@opencxh/ui-kit 3.160.0 → 3.166.0

package/dist/src/content/MetaValue.d.ts

@@ -0,0 +1,31 @@
+import { ReactNode } from 'react';
+/**
+ * One value in a record's property line.
+ *
+ * The properties of a record — sender, inbox, priority, topic, folder, status,
+ * assignee — belong in the sentence under the title, not in a row of chips
+ * underneath it. Six chips read as six buttons for something you change maybe
+ * once; the same six values as a line read as *what this record is*.
+ *
+ * The dashed underline is the whole affordance: it says "you can change this"
+ * without spending a control. Wrap it in a `Popover` to make it do so.
+ *
+ * An unset property stays **visible** in the dimmer pair rather than
+ * disappearing, so you can see that it is empty — a property that vanishes when
+ * unset is a property you never discover.
+ */
+export interface MetaValueProps {
+    label: string;
+    icon?: ReactNode;
+    /** No value chosen yet. Renders dimmer, never hidden. */
+    unset?: boolean;
+    className?: string;
+}
+export declare function MetaValue({ icon, label, unset, className }: MetaValueProps): import("react").JSX.Element;
+/**
+ * Separator between two properties in a meta line.
+ *
+ * Decorative and hidden from assistive tech — the values carry the meaning, and
+ * a screen reader announcing "middle dot" between every property is noise.
+ */
+export declare function MetaSeparator(): import("react").JSX.Element;

package/dist/src/content/Table.d.ts

@@ -1,4 +1,5 @@
 import { default as React } from 'react';
+import { ListGroup } from './List';
 import { PageHeaderAction } from './PageHeader';
 export interface TableColumn<T = any> {
     /** Unique column identifier */
@@ -71,6 +72,16 @@ export interface TableFilter {
  */
 export declare const dateFilterHandler: (fn: (value: Date | null) => void) => TableFilter["onChange"];
 export declare const selectFilterHandler: (fn: (value: string) => void) => TableFilter["onChange"];
+/**
+ * The `multiSelect: true` counterpart. It emits `string[]`, which neither adapter
+ * above accepts, so without this every multi-select call site pushed a cast — the
+ * exact thing these adapters exist to avoid.
+ *
+ * A single string is folded into a one-element array rather than dropped: a filter
+ * that silently clears itself when the menu emits the narrower shape is worse than
+ * one that over-selects.
+ */
+export declare const multiSelectFilterHandler: (fn: (value: string[]) => void) => TableFilter["onChange"];
 export interface TableProps<T = any> {
     /** Table data */
     data: T[];
@@ -99,6 +110,31 @@ export interface TableProps<T = any> {
      * table owns what you do to it.
      */
     toolbarActions?: PageHeaderAction[];
+    /**
+     * Extra controls in the toolbar, rendered **after the filter chips and before**
+     * the right-hand action cluster.
+     *
+     * This is where anything that belongs *with the filters* goes: an avatar stack
+     * you filter by, a "clear filters" chip, a group-by control. `toolbarActions`
+     * is pushed right with `ml-auto`, so putting a filter there parks it beside the
+     * list's own buttons and it stops reading as a filter at all.
+     */
+    toolbarContent?: React.ReactNode;
+    /**
+     * Split the rows into sections. Returns the group id a row belongs to; the
+     * same shape `List` uses, so a screen that has both does not learn two APIs.
+     *
+     * **Grouping turns pagination off.** Paging *across* sections is meaningless —
+     * "1–10 of 40" under a section holding three rows is worse than no paginator —
+     * so a grouped table shows every row it was given.
+     */
+    groupBy?: (item: T, index: number) => string;
+    /**
+     * Declared section order, titles and tone. Ids missing from the data are
+     * skipped; ids in the data that are not declared come after, in the order
+     * they first appear.
+     */
+    groups?: ListGroup[];
     /** Whether table has pagination */
     paginated?: boolean;
     /** Rows per page. Fixed — the footer is a summary and a page list, nothing to set. */
@@ -144,4 +180,4 @@ export interface TableProps<T = any> {
  * Data table: a bordered box with a tinted column strip, a toolbar above it
  * (search, filters, the list's own actions) and a summary + paginator below.
  */
-export declare const Table: <T extends Record<string, any>>({ data, columns, loading, searchable, searchPlaceholder, searchValue, onSearchChange, filters, toolbarActions, paginated, defaultPageSize, actions, onRowClick, selectable, selectedRows, onSelectionChange, getRowKey, emptyContent, footerSummary, size, hoverable, padding, className, rowClassName, headerBackground, }: TableProps<T>) => React.JSX.Element;
+export declare const Table: <T extends Record<string, any>>({ data, columns, loading, searchable, searchPlaceholder, searchValue, onSearchChange, filters, toolbarActions, toolbarContent, groupBy, groups, paginated, defaultPageSize, actions, onRowClick, selectable, selectedRows, onSelectionChange, getRowKey, emptyContent, footerSummary, size, hoverable, padding, className, rowClassName, headerBackground, }: TableProps<T>) => React.JSX.Element;

package/dist/src/index.d.ts

@@ -47,6 +47,7 @@ export { Image, type ImageProps } from './content/Image';
 export { List, ListBulkAction, type ListGroup, type ListProps } from './content/List';
 export { MessageBubble, type MessageBubbleProps } from './content/MessageBubble';
 export { KpiCard, type KpiCardProps } from './content/KpiCard';
+export { MetaSeparator, MetaValue, type MetaValueProps } from './content/MetaValue';
 export { Page, type PageProps } from './content/Page';
 export { PageHeader, type PageHeaderAction, type PageHeaderProps } from './content/PageHeader';
 export { PageToolbar, PageToolbarActions, type PageToolbarActionsProps, type PageToolbarProps } from './content/PageToolbar';
@@ -56,7 +57,7 @@ export { SectionDivider, type SectionDividerProps } from './content/SectionDivid
 export { SettingsFrameProvider, SettingsPage, useSettingsFrame, useSettingsFrameHost, type SettingsFrameApi, type SettingsPageProps, type SettingsTrailEntry } from './content/SettingsPage';
 export { SettingsRow, SettingsSection, type SettingsRowProps, type SettingsSectionProps } from './content/SettingsRow';
 export { SourceChip, type SourceChipProps } from './content/SourceChip';
-export { Table, dateFilterHandler, selectFilterHandler, type TableAction, type TableColumn, type TableFilter, type TableProps } from './content/Table';
+export { Table, dateFilterHandler, multiSelectFilterHandler, selectFilterHandler, type TableAction, type TableColumn, type TableFilter, type TableProps } from './content/Table';
 export { badgeColumn, booleanBadgeColumn, labelsColumn, type BadgeColumnConfig, type BooleanBadgeColumnConfig, type LabelsColumnConfig } from './content/tableColumns';
 export { View, type ViewGroup, type ViewProps } from './content/View';
 export { SidebarMenu, type MenuItem, type MenuItemAction } from './navigation/Sidebar';

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@opencxh/ui-kit",
-  "version": "3.160.0",
+  "version": "3.166.0",
   "description": "Theme-aware UI component library for OpenCXH platform",
   "type": "module",
   "exports": {