@platform/core¶

Location: modules/platform/core/
Dependencies: none (standalone foundation module)

Overview¶

@platform/core is the lowest-level platform module. It provides:

Reusable React UI components (layout, navigation, forms, tables, trees, dialogs, …)
The Application shell — Application component, ModuleProps registration system, routing
The Workbench layout — themed container with a collapsible sidebar
Express server bootstrap utility
Shared types and utilities (error handling, YAML parsing, i18n string types)

All other platform modules depend on @platform/core.

Contexts¶

Context	Entry point	Contents
`client`	`src/client/index.ts`	React components, hooks, Application shell, Workbench
`server`	`src/server/index.ts`	`ServerExpressService`
`common`	`src/common/index.ts`	Types, `CoreError`, i18n utilities, YAML service

Client API¶

Application Shell¶

The application shell lives in @platform/core/client and is the entry point for wiring all modules together.

import { Application, ApplicationProps, ModuleProps } from '@platform/core/client'

Export	Description
`Application`	Root application component — provides i18n, theme, socket, doc, routing, sidebar
`ApplicationProps`	Props for `Application`: `name`, `logo`, `i18n`, `modules?`, `Layout?`
`ModuleProps`	Module registration descriptor: `name`, `title`, `buttons?`, `route?`
`ApplicationContext`	React context giving access to registered modules and layout
`useApplicationContext`	Hook to read the `ApplicationContext`
`RouteErrorBoundaryFallback`	Default error boundary component used in React Router routes

ApplicationProps fields:

Field	Type	Description
`name`	`string`	Application identifier
`logo`	`string`	Path or URL to the logo image
`i18n`	`i18n`	Configured i18next instance
`modules?`	`ModuleProps[]`	Modules to register
`Layout?`	`ComponentType`	Optional wrapper layout around the Workbench

ModuleProps fields:

Field	Type	Description
`name`	`string`	Unique module identifier
`title`	`TranslationText`	Display name (i18n key or bilingual string)
`buttons?`	`ApplicationSideBarButtonProps[]`	Sidebar button entries for this module
`route?`	`RouteObject`	React Router route contributed by this module

Workbench¶

import { Workbench, ThemeContainer } from '@platform/core/client'

Export	Description
`Workbench`	Root shell layout with navbar and sidebar (used inside the Application shell)
`ThemeContainer`	MUI theme provider wrapper
`SideBar`	Collapsible sidebar container
`SideBarButton`	Icon button displayed in the sidebar
`SideBarContext`	React context giving access to sidebar state
`SideBarSection`	Logical section inside the sidebar

Display Components¶

import { Typo, CoreIcon, CoreTable, CoreTreeView } from '@platform/core/client'

Export	Description
`Typo`	Typography component with preset variants
`CoreIcon`	Multi-source icon resolver — supports `mui:`, `fa:`, `far:`, `fab:`, `bi:`, and `fi:` prefixes
`FacebookIcon` / `GoogleIcon`	Social login icons
`CoreTable`	Resizable data table
`CoreTableRow`	Row component for `CoreTable`
`CoreTreeView`	MUI tree view wrapper
`CoreTreeItem`	Individual tree node
`ErrorBoundary`	React error boundary component

`CoreIcon` — icon string format¶

The icon prop accepts a string in the format source:name:

Prefix	Library	Example
`mui:`	MUI Icons Material	`mui:Article`
`fa:`	Font Awesome (Solid)	`fa:coffee`
`far:`	Font Awesome (Regular)	`far:star`
`fab:`	Font Awesome (Brands)	`fab:github`
`bi:`	Bootstrap Icons	`bi:House`
`fi:`	Flaticon Uicons (CDN)	`fi:rr-house`
(none)	MUI — backward-compatible	`Article`

Input & Form Components¶

import { CoreButton, CoreForm, StringControl } from '@platform/core/client'

Export	Description
`CoreButton`	Themed button
`CodeEditor`	Monaco editor wrapper
`CoreForm`	Form container with submit handling
`StringControl`	Text field form control
`NumberControl`	Numeric input form control
`BooleanControl`	Checkbox form control
`DateControl`	Date picker form control
`SelectControl`	Single-select dropdown form control
`MultipleSelectControl`	Multi-select dropdown form control
`I18nStringControl`	Bilingual (fr/en) text input
`CoreControlProps`	Base props type for all form controls

import { CoreBreadcrumbs, CoreTabs, CoreLink, CoreContextMenu, CoreNavTabs, CoreTabsNav } from '@platform/core/client'

Export	Description
`CoreBreadcrumbs`	Breadcrumb navigation bar
`CoreTabs`	Tabbed navigation
`CoreNavTabs`	Navigation tabs integrated with React Router
`CoreTabsNav`	Tab navigation bar component
`CoreLink`	Router-aware link
`CoreContextMenu`	Right-click context menu

Feedback¶

Export	Description
`CoreDialogContext`	Context/hook for programmatic dialog management
`CoreDialog` props type	Type for dialog configuration

Layout¶

Export	Description
`CoreSplitter`	Resizable split-pane layout (`react-reflex` wrapper)
`CoreCardPage`	Page-level card container

Hooks¶

Export	Description
`useT`	Typed i18next translation hook
`useLocalStorage`	Persistent state hook backed by `localStorage`

i18n¶

Export	Description
`I18nProvider`	Sets up the i18next provider for the app
`useLang`	Hook to read / change the current language

Server API¶

import { ServerExpressService } from '@platform/core/server'

Export	Description
`ServerExpressService`	Bootstrap utility for creating and configuring an Express application

Common API¶

import { CoreError, TranslationText, I18nString } from '@platform/core/common'

Export	Description
`CoreError`	Base error entity with code and message
`TranslationText`	Union type: `TranslationKey \\| TranslationObject \\| I18nString`
`I18nString`	Bilingual string `{ fr: string; en: string }`
`TranslationKey`	Type-safe i18next key
`CommonI18nService`	Utility for resolving `TranslationText` to a string
`CommonYamlService`	YAML parse/stringify utilities
`ActualType`	TypeScript utility type helper

Usage Example¶

// Registering a module
import { ModuleProps } from '@platform/core/client'

export const ChatModule: ModuleProps = {
  name: 'chat',
  title: 'chat:module.title',
  buttons: [{ path: '/chat', title: 'chat:module.title', icon: <ChatIcon /> }],
  route: { path: 'chat/*', Component: ChatRoutes }
}

// Bootstrapping the application
import { Application } from '@platform/core/client'
import { i18n } from './i18n'
import { ChatModule } from '@platform/chat/client'

export function App() {
  return (
    <Application name="MyApp" logo="/logo.png" i18n={i18n} modules={[ChatModule]} />
  )
}

// Server
import { ServerExpressService } from '@platform/core/server'

const app = ServerExpressService.create()
app.listen(8081)