@tailor-platform/app-shell 1.16.0 → 1.17.0

package/dist/vite-plugin.d.ts

@@ -41,12 +41,12 @@ declare namespace Root {
 }
 
 
-declare namespace Title {
+declare namespace Image {
     var displayName: string;
 }
 
 
-declare namespace Description {
+declare namespace Fallback {
     var displayName: string;
 }
 
@@ -56,32 +56,37 @@ declare namespace Root {
 }
 
 
-declare namespace List {
+declare namespace Header {
     var displayName: string;
 }
 
 
-declare namespace Tab {
+declare namespace Body {
     var displayName: string;
 }
 
 
-declare namespace Panel {
+declare namespace Footer {
     var displayName: string;
 }
 
 
-declare namespace Root {
+declare namespace Row {
     var displayName: string;
 }
 
 
-declare namespace Image {
+declare namespace Head {
     var displayName: string;
 }
 
 
-declare namespace Fallback {
+declare namespace Cell {
+    var displayName: string;
+}
+
+
+declare namespace Caption {
     var displayName: string;
 }
 
@@ -96,47 +101,47 @@ declare namespace Header {
 }
 
 
-declare namespace Body {
+declare namespace Content {
     var displayName: string;
 }
 
 
-declare namespace Footer {
+declare namespace Root {
     var displayName: string;
 }
 
 
-declare namespace Row {
+declare namespace Trigger {
     var displayName: string;
 }
 
 
-declare namespace Head {
+declare namespace Close {
     var displayName: string;
 }
 
 
-declare namespace Cell {
+declare namespace Content {
     var displayName: string;
 }
 
 
-declare namespace Caption {
+declare namespace Header {
     var displayName: string;
 }
 
 
-declare namespace Root {
+declare namespace Footer {
     var displayName: string;
 }
 
 
-declare namespace Header {
+declare namespace Title {
     var displayName: string;
 }
 
 
-declare namespace Content {
+declare namespace Description {
     var displayName: string;
 }
 
@@ -146,192 +151,197 @@ declare namespace Root {
 }
 
 
-declare namespace Trigger {
+declare namespace Legend {
     var displayName: string;
 }
 
 
-declare namespace Close {
+declare namespace ComboboxRoot {
     var displayName: string;
 }
 
 
-declare namespace Content {
+declare namespace ComboboxInput {
     var displayName: string;
 }
 
 
-declare namespace Header {
+declare namespace ComboboxTrigger {
     var displayName: string;
 }
 
 
-declare namespace Footer {
+declare namespace ComboboxInputGroup {
     var displayName: string;
 }
 
 
-declare namespace Title {
+declare namespace ComboboxContent {
     var displayName: string;
 }
 
 
-declare namespace Description {
+declare namespace ComboboxList {
     var displayName: string;
 }
 
 
-declare namespace Root {
+declare namespace ComboboxItem {
     var displayName: string;
 }
 
 
-declare namespace Label {
+declare namespace ComboboxEmpty {
     var displayName: string;
 }
 
 
-declare namespace Control {
+declare namespace ComboboxGroup {
     var displayName: string;
 }
 
 
-declare namespace Description {
+declare namespace ComboboxGroupLabel {
     var displayName: string;
 }
 
 
-declare namespace Error {
+declare namespace ComboboxClear {
     var displayName: string;
 }
 
 
-declare namespace Validity {
+declare namespace ComboboxChips {
     var displayName: string;
 }
 
 
-declare namespace Root {
+declare namespace ComboboxChip {
     var displayName: string;
 }
 
 
-declare namespace Legend {
+declare namespace ComboboxChipRemove {
     var displayName: string;
 }
 
 
-declare namespace Root {
+declare namespace ComboboxValue {
     var displayName: string;
 }
 
 
-declare namespace Trigger {
+declare namespace ComboboxStatus {
     var displayName: string;
 }
 
 
-declare namespace Content {
+declare namespace ComboboxCollection {
     var displayName: string;
 }
 
 
-declare namespace Item {
+declare namespace Root {
     var displayName: string;
 }
 
 
-declare namespace LinkItem {
+declare namespace Label {
     var displayName: string;
 }
 
 
-declare namespace CheckboxItem {
+declare namespace Control {
     var displayName: string;
 }
 
 
-declare namespace CheckboxItemIndicator {
+declare namespace Description {
     var displayName: string;
 }
 
 
-declare namespace RadioItem {
+declare namespace Error {
     var displayName: string;
 }
 
 
-declare namespace RadioItemIndicator {
+declare namespace Validity {
     var displayName: string;
 }
 
 
-declare namespace RadioGroup {
+declare namespace Root {
     var displayName: string;
 }
 
 
-declare namespace Group {
+declare namespace Trigger {
     var displayName: string;
 }
 
 
-declare namespace GroupLabel {
+declare namespace Content {
     var displayName: string;
 }
 
 
-declare namespace MenuSeparator {
+declare namespace Item {
     var displayName: string;
 }
 
 
-declare namespace SubmenuRoot {
+declare namespace LinkItem {
     var displayName: string;
 }
 
 
-declare namespace SubmenuTrigger {
+declare namespace CheckboxItem {
     var displayName: string;
 }
 
 
-declare namespace Root {
+declare namespace CheckboxItemIndicator {
     var displayName: string;
 }
 
 
-declare namespace Trigger {
+declare namespace RadioItem {
     var displayName: string;
 }
 
 
-declare namespace Close {
+declare namespace RadioItemIndicator {
     var displayName: string;
 }
 
 
-declare namespace Content {
+declare namespace RadioGroup {
     var displayName: string;
 }
 
 
-declare namespace Header {
+declare namespace Group {
     var displayName: string;
 }
 
 
-declare namespace Footer {
+declare namespace GroupLabel {
     var displayName: string;
 }
 
 
-declare namespace Title {
+declare namespace MenuSeparator {
     var displayName: string;
 }
 
 
-declare namespace Description {
+declare namespace SubmenuRoot {
+    var displayName: string;
+}
+
+
+declare namespace SubmenuTrigger {
     var displayName: string;
 }
 
@@ -356,47 +366,62 @@ declare namespace Separator {
 }
 
 
-declare namespace SelectRoot {
+declare namespace Root {
     var displayName: string;
 }
 
 
-declare namespace SelectTrigger {
+declare namespace Trigger {
     var displayName: string;
 }
 
 
-declare namespace SelectValue {
+declare namespace Close {
     var displayName: string;
 }
 
 
-declare namespace SelectContent {
+declare namespace Content {
     var displayName: string;
 }
 
 
-declare namespace SelectItem {
+declare namespace Header {
     var displayName: string;
 }
 
 
-declare namespace SelectGroup {
+declare namespace Footer {
     var displayName: string;
 }
 
 
-declare namespace SelectGroupLabel {
+declare namespace Title {
     var displayName: string;
 }
 
 
-declare namespace SelectSeparator {
+declare namespace Description {
     var displayName: string;
 }
 
 
-declare namespace Provider {
+declare namespace Root {
+    var displayName: string;
+}
+
+
+declare namespace List {
+    var displayName: string;
+}
+
+
+declare namespace Tab {
+    var displayName: string;
+}
+
+
+declare namespace Panel {
     var displayName: string;
 }
 
@@ -406,97 +431,107 @@ declare namespace Root {
 }
 
 
+declare namespace Title {
+    var displayName: string;
+}
+
+
+declare namespace Description {
+    var displayName: string;
+}
+
+
 declare namespace Trigger {
     var displayName: string;
 }
 
 
-declare namespace Content {
+declare namespace Settings {
     var displayName: string;
 }
 
 
-declare namespace ComboboxRoot {
+declare namespace Provider {
     var displayName: string;
 }
 
 
-declare namespace ComboboxInput {
+declare namespace Root {
     var displayName: string;
 }
 
 
-declare namespace ComboboxTrigger {
+declare namespace Header {
     var displayName: string;
 }
 
 
-declare namespace ComboboxInputGroup {
+declare namespace ClearAll {
     var displayName: string;
 }
 
 
-declare namespace ComboboxContent {
+declare namespace Sections {
     var displayName: string;
 }
 
 
-declare namespace ComboboxList {
+declare namespace Provider {
     var displayName: string;
 }
 
 
-declare namespace ComboboxItem {
+declare namespace Root {
     var displayName: string;
 }
 
 
-declare namespace ComboboxEmpty {
+declare namespace Trigger {
     var displayName: string;
 }
 
 
-declare namespace ComboboxGroup {
+declare namespace Content {
     var displayName: string;
 }
 
 
-declare namespace ComboboxGroupLabel {
+declare namespace SelectRoot {
     var displayName: string;
 }
 
 
-declare namespace ComboboxClear {
+declare namespace SelectTrigger {
     var displayName: string;
 }
 
 
-declare namespace ComboboxChips {
+declare namespace SelectValue {
     var displayName: string;
 }
 
 
-declare namespace ComboboxChip {
+declare namespace SelectContent {
     var displayName: string;
 }
 
 
-declare namespace ComboboxChipRemove {
+declare namespace SelectItem {
     var displayName: string;
 }
 
 
-declare namespace ComboboxValue {
+declare namespace SelectGroup {
     var displayName: string;
 }
 
 
-declare namespace ComboboxStatus {
+declare namespace SelectGroupLabel {
     var displayName: string;
 }
 
 
-declare namespace ComboboxCollection {
+declare namespace SelectSeparator {
     var displayName: string;
 }
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@tailor-platform/app-shell",
-  "version": "1.16.0",
+  "version": "1.17.0",
   "description": "An opinionated React application framework for building ERP applications on Tailor Platform",
   "keywords": [
     "app-shell",

package/skills/app-shell-patterns/SKILL.md

@@ -59,6 +59,7 @@ Every AppShell component, its API surface, and usage guidance. Read the entry fo
 | [DescriptionCard](references/components/description-card.md)            | Display structured key-value information in a responsive grid layout with automatic field rendering                                                |
 | [Dialog](references/components/dialog.md)                               | Modal dialog with a compound component API                                                                                                         |
 | [DocumentProgressCard](references/components/document-progress-card.md) | Generic card visualising a document's lifecycle state — optional percentage, stacked progress bar, and status legend                               |
+| [FilterRail](references/components/filter-rail.md)                      | An always-visible faceted filter rail with user layout settings, driven by the same CollectionControl as DataTable                                 |
 | [Form, Field, and Fieldset](references/components/form.md)              | Components for building validated forms with automatic accessibility wiring, validation state management, and optional React Hook Form integration |
 | [GlobalHeaderLayout](references/components/global-header-layout.md)     | Opinionated layout with an app-wide header above the whole shell and a sidebar that collapses to a persistent icon rail                            |
 | [Grid](references/components/grid.md)                                   | Generic CSS-Grid layout primitive for equal or custom-width columns with responsive reflow, auto-fit, and spanning                                 |
@@ -71,6 +72,7 @@ Every AppShell component, its API surface, and usage guidance. Read the entry fo
 | [SidebarGroup](references/components/sidebar-group.md)                  | Collapsible group component for organizing sidebar navigation items with icons and nested structure                                                |
 | [SidebarItem](references/components/sidebar-item.md)                    | Individual navigation item for customizing sidebar with icons, active states, and external links                                                   |
 | [SidebarLayout](references/components/sidebar-layout.md)                | Default AppShell layout with a built-in sidebar, content header, optional app-wide top bar, and an escape-hatch body slot                          |
+| [SidebarSection](references/components/sidebar-section.md)              | Static, non-collapsible heading for grouping flat sidebar navigation items                                                                         |
 | [Spinner](references/components/spinner.md)                             | Lightweight loading indicator component with accessible defaults and preset sizes                                                                  |
 | [Table](references/components/table.md)                                 | Semantic HTML table with pre-styled sub-components                                                                                                 |
 | [Tabs](references/components/tabs.md)                                   | Tab navigation with a compound component API                                                                                                       |
@@ -134,11 +136,11 @@ A page is the shape of a whole screen — the outer choice, made before picking
 
 ### interaction
 
-| Slug                                                                          | Name         | Description                                                           |
-| ----------------------------------------------------------------------------- | ------------ | --------------------------------------------------------------------- |
-| [`interaction/confirm`](references/patterns/interaction-confirm.md)           | Confirm      | Confirmation dialog before destructive or irreversible actions        |
-| [`interaction/multi-select`](references/patterns/interaction-multi-select.md) | Multi Select | Floating bottom action bar for bulk operations on selected list rows  |
-| [`interaction/toast`](references/patterns/interaction-toast.md)               | Toast        | Lightweight feedback after mutations — success or error notifications |
+| Slug                                                                          | Name         | Description                                                                             |
+| ----------------------------------------------------------------------------- | ------------ | --------------------------------------------------------------------------------------- |
+| [`interaction/confirm`](references/patterns/interaction-confirm.md)           | Confirm      | Confirmation dialog before destructive or irreversible actions                          |
+| [`interaction/multi-select`](references/patterns/interaction-multi-select.md) | Multi Select | Bulk operations on selected DataTable rows, from a bar that takes over the table footer |
+| [`interaction/toast`](references/patterns/interaction-toast.md)               | Toast        | Lightweight feedback after mutations — success or error notifications                   |
 
 ### list
 

package/skills/app-shell-patterns/references/api/define-module.md

@@ -70,8 +70,8 @@ defineModule({
 
 **meta.breadcrumbTitle**
 
-- **Type:** `string | ((segment: string) => string)`
-- **Description:** Custom breadcrumb segment title override
+- **Type:** `string | ((segment: string) => LocalizedString)`
+- **Description:** Custom breadcrumb segment title override. Pass `labels.t(key)` directly for localization: `breadcrumbTitle: labels.t("dashboard")`. Other callbacks receive the URL segment and may return a `LocalizedString`, resolved using the current locale. The existing `() => labels.t(key)` form remains supported; handwritten locale functions must be returned from an outer callback. When omitted, the breadcrumb uses the localized `meta.title`.
 
 ### `guards`
 

package/skills/app-shell-patterns/references/api/define-resource.md

@@ -65,8 +65,8 @@ defineResource({
 
 **meta.breadcrumbTitle**
 
-- **Type:** `string | ((segment: string) => string)`
-- **Description:** Custom breadcrumb segment title
+- **Type:** `string | ((segment: string) => LocalizedString)`
+- **Description:** Custom breadcrumb segment title. Pass `labels.t(key)` directly for localization: `breadcrumbTitle: labels.t("orders")`. Other callbacks receive the URL segment and may return a `LocalizedString`, for example `breadcrumbTitle: (segment) => labels.t("order", { id: segment })` for a dynamic label. AppShell resolves it using the current locale. The existing `() => labels.t(key)` form remains supported; handwritten locale functions must be returned from an outer callback. When omitted, the breadcrumb uses the localized `meta.title`.
 
 ### `subResources`