@tailor-platform/app-shell 1.17.0 → 1.18.0

package/dist/app-shell.d.ts

@@ -1012,6 +1012,20 @@ export declare const avatarVariants: (props?: ({
 
 export declare function Badge({ className, variant, children, ...props }: BadgeProps): JSX.Element;
 
+/**
+ * `edit` config for `type: "badge"` columns: a dropdown whose choices render as
+ * the same badges the cell shows. Picking one notifies its `value`; a "None"
+ * choice notifies `null`. Single-value columns only.
+ */
+export declare interface BadgeCellEditOptions<TRow extends Record<string, unknown>> extends CellEditBase<TRow, string> {
+    /**
+     * The choices. Default: the entries of `typeOptions.badgeLabelMap`, else the
+     * column's enum `filter` options. A badge column with neither can't be
+     * edited.
+     */
+    options?: readonly SelectOption[];
+}
+
 /** Options for `type: "badge"` cells. */
 declare interface BadgeCellOptions extends BadgeOptions {
     /** Maximum number of badges to display before showing a "+N" overflow indicator */
@@ -1190,6 +1204,35 @@ declare namespace Cell {
 
 declare type CellAlign = "left" | "center" | "right";
 
+declare interface CellEditBase<TRow extends Record<string, unknown>, TValue, TDraft = TValue | null> {
+    /**
+     * Decides, per row, whether the cell can be edited. Receives the row and
+     * whether it is selected, so "editable once selected" is
+     * `(_, { selected }) => selected`. Default: every row with an `id`.
+     */
+    canEdit?: (row: TRow, state: CellEditState) => boolean;
+    /**
+     * Observes editor drafts, including incomplete input and restored drafts on
+     * cancellation. Direct inputs emit raw strings; choices emit selected values,
+     * not search text or highlights. Updating `data` here is outside the supported
+     * coordination contract. The return value is ignored.
+     */
+    onValueChange?: (row: TRow, draft: TDraft) => void;
+    /**
+     * Notifies a changed, confirmed editor output, compared with current `data`.
+     * Empty cells confirm `null`. Confirmation does not imply business validation,
+     * adoption, or persistence; update `data` here to adopt it. Return values are
+     * ignored. Output types follow the editor, not the row field's runtime type.
+     */
+    onValueCommitted: (row: TRow, value: TValue | null) => void;
+}
+
+/** Row state passed to `edit.canEdit` alongside the row. */
+export declare interface CellEditState {
+    /** Whether the row is selected. Always `false` when row selection is off. */
+    selected: boolean;
+}
+
 declare type CellProps = React_2.ComponentProps<"td"> & {
     align?: CellAlign;
 };
@@ -1806,6 +1849,12 @@ declare type Columns = 3 | 4;
  * and `undefined` are always allowed: every built-in renderer maps them to the
  * `—` placeholder.
  *
+ * `edit` makes the cells editable in place and also narrows per branch, so
+ * `onValueCommitted` receives the editor's output type, not necessarily the
+ * original row field's runtime type. Text / link / badge output strings or null.
+ * Every typed column
+ * supports it; untyped (`render`-only) columns don't.
+ *
  * Prefer `Column<TRow>` in most cases; this is exported so consumers can
  * compose more specific column types.
  */
@@ -1813,30 +1862,37 @@ declare type ColumnTypeBranch<TRow extends Record<string, unknown>> = {
     type?: undefined;
     typeOptions?: never;
     accessor?: (row: TRow) => unknown;
+    edit?: never;
 } | {
     type: "text";
     typeOptions?: never;
     accessor?: (row: TRow) => string | number | boolean | bigint | null | undefined;
+    edit?: TextCellEditOptions<TRow>;
 } | {
     type: "number";
     typeOptions?: NumberCellOptions;
     accessor?: (row: TRow) => number | null | undefined;
+    edit?: NumberCellEditOptions<TRow>;
 } | {
     type: "money";
     typeOptions?: MoneyCellOptions<TRow>;
     accessor?: (row: TRow) => number | null | undefined;
+    edit?: NumberCellEditOptions<TRow>;
 } | {
     type: "date";
     typeOptions?: DateCellOptions;
     accessor?: (row: TRow) => Date | string | number | null | undefined;
+    edit?: DateCellEditOptions<TRow>;
 } | {
     type: "badge";
     typeOptions?: BadgeCellOptions;
     accessor?: (row: TRow) => string | string[] | number | boolean | null | undefined;
+    edit?: BadgeCellEditOptions<TRow>;
 } | {
     type: "link";
     typeOptions: LinkCellOptions<TRow>;
     accessor?: (row: TRow) => string | number | boolean | null | undefined;
+    edit?: TextCellEditOptions<TRow>;
 };
 
 export declare const Combobox: ComboboxComponent;
@@ -2928,6 +2984,16 @@ declare type DataTableUiFilterOperatorByType = {
 
 declare type DataTableUuidFilterOperator = Extract<OperatorForFilterType["uuid"], "eq">;
 
+/**
+ * `edit` config for `type: "date"` columns: a calendar that opens from the
+ * cell. Picking a day commits `"YYYY-MM-DD"`. With `dateFormat: "datetime"`
+ * the calendar emits complete `DateTimeDraft` snapshots and Done confirms an
+ * ISO 8601 timestamp in the AppShell timezone only with a valid day and time.
+ * Outside closing / Esc cancels; Clear explicitly confirms `null`.
+ * Date-only drafts are `"YYYY-MM-DD" | null`.
+ */
+export declare type DateCellEditOptions<TRow extends Record<string, unknown>> = CellEditBase<TRow, string, string | DateTimeDraft | null>;
+
 /** Options for `type: "date"` cells. */
 declare interface DateCellOptions {
     /**
@@ -3116,6 +3182,12 @@ declare type DateSection<TField extends string = string> = FieldSectionBase<TFie
     max?: string;
 };
 
+/** Incomplete date-time editor state, interpreted in the AppShell timezone. */
+export declare interface DateTimeDraft {
+    day: string | null;
+    time: string | null;
+}
+
 export { DateValue }
 
 /**
@@ -5161,6 +5233,16 @@ declare interface NonSortableHeaderRenderContext {
     sortable: false;
 }
 
+/**
+ * `edit` config for `type: "number"` and `type: "money"` columns. Drafts are raw
+ * strings (including incomplete input); confirmation emits a JavaScript number
+ * or `null`, not an arbitrary-precision Decimal. Editing uses `.` as the decimal
+ * separator, independently of display locale. Full-width digits and valid comma
+ * grouping are normalized on confirmation. Display precision does not constrain
+ * input; business rules belong to the consumer.
+ */
+export declare type NumberCellEditOptions<TRow extends Record<string, unknown>> = CellEditBase<TRow, number, string>;
+
 /** Options for `type: "number"` cells. */
 declare interface NumberCellOptions {
     /** Minimum decimal places. Default: `0`. */
@@ -7193,6 +7275,22 @@ declare type TabsSize = "xs" | "sm" | "default" | "lg";
 
 declare type TabsVariant = "default" | "line" | "capsule";
 
+/**
+ * Text with a typography role. The role sets the size, line height, weight,
+ * and letter spacing. It does not set the color or choose the heading level.
+ *
+ * @example
+ * ```tsx
+ * import { Text } from "@tailor-platform/app-shell";
+ *
+ * <Text variant="heading-md" render={<h3 />}>Line items</Text>
+ * <Text variant="body-md" className="text-muted-foreground">Orders sent this month.</Text>
+ * <Text variant="label-md" className="tabular-nums">1,240</Text>
+ * ```
+ */
+declare function Text_2({ className, variant, render, children, ref, ...props }: TextProps): React_2.ReactElement<unknown, string | React_2.JSXElementConstructor<any>>;
+export { Text_2 as Text }
+
 /**
  * A styled multi-line text input.
  *
@@ -7254,6 +7352,29 @@ export declare type TextareaProps = Omit<React_2.ComponentProps<typeof Field_2.C
     className?: string;
 };
 
+/**
+ * `edit` config for `type: "text"` and `type: "link"` columns. Without
+ * `options` the cell is typed into: the value is the text as typed, and an
+ * emptied cell commits `null`. A `link` column shows its label as plain text
+ * while the cell can be edited.
+ */
+export declare interface TextCellEditOptions<TRow extends Record<string, unknown>> extends CellEditBase<TRow, string, string | null> {
+    /**
+     * Turns the cell into a dropdown of these choices (a supplier, a warehouse,
+     * a unit of measure). The column's value is an option's `value`, and every
+     * cell in the column — editable or not — shows the matching `label`.
+     * Picking a choice notifies its value; a "None" choice notifies `null`.
+     */
+    options?: readonly SelectOption[];
+}
+
+export declare type TextProps = React_2.HTMLAttributes<HTMLElement> & VariantProps<typeof textVariants> & {
+    /** Ref to the rendered element. */
+    ref?: React_2.Ref<HTMLElement>;
+    /** Custom element to render as (Base UI render prop). Use it to set the heading level, for example `render={<h3 />}`. */
+    render?: React_2.ReactElement;
+};
+
 /** Free text with one fixed operator. */
 declare type TextSection<TField extends string = string> = FieldSectionBase<TField> & {
     control: "text";
@@ -7265,6 +7386,10 @@ declare type TextSection<TField extends string = string> = FieldSectionBase<TFie
     minLength?: number;
 };
 
+declare const textVariants: (props?: ({
+    variant?: "heading-lg" | "heading-md" | "heading-sm" | "body-md" | "body-sm" | "label-md" | "label-sm" | "code-sm" | "body-md-relaxed" | "body-sm-relaxed" | null | undefined;
+} & ClassProp) | undefined) => string;
+
 export { Time }
 
 /**
@@ -8959,7 +9084,7 @@ export declare function useURLCollectionVariables(options: UseCollectionOptions
  *   <Field.Validity>
  *     {(state) =>
  *       state.validity.valid === false && (
- *         <p className="text-destructive text-sm">
+ *         <p className="text-danger-text text-sm">
  *           {state.validity.typeMismatch
  *             ? "Please enter a valid URL (e.g. https://example.com)"
  *             : "This field is required."}
@@ -9127,37 +9252,17 @@ declare namespace Root {
 }
 
 
-declare namespace Header {
-    var displayName: string;
-}
-
-
-declare namespace Body {
-    var displayName: string;
-}
-
-
-declare namespace Footer {
-    var displayName: string;
-}
-
-
-declare namespace Row {
-    var displayName: string;
-}
-
-
-declare namespace Head {
+declare namespace Title {
     var displayName: string;
 }
 
 
-declare namespace Cell {
+declare namespace Description {
     var displayName: string;
 }
 
 
-declare namespace Caption {
+declare namespace Provider {
     var displayName: string;
 }
 
@@ -9172,12 +9277,12 @@ declare namespace Header {
 }
 
 
-declare namespace Content {
+declare namespace ClearAll {
     var displayName: string;
 }
 
 
-declare namespace Root {
+declare namespace Sections {
     var displayName: string;
 }
 
@@ -9187,12 +9292,12 @@ declare namespace Trigger {
 }
 
 
-declare namespace Close {
+declare namespace Settings {
     var displayName: string;
 }
 
 
-declare namespace Content {
+declare namespace Root {
     var displayName: string;
 }
 
@@ -9202,17 +9307,7 @@ declare namespace Header {
 }
 
 
-declare namespace Footer {
-    var displayName: string;
-}
-
-
-declare namespace Title {
-    var displayName: string;
-}
-
-
-declare namespace Description {
+declare namespace Content {
     var displayName: string;
 }
 
@@ -9222,122 +9317,117 @@ declare namespace Root {
 }
 
 
-declare namespace Legend {
-    var displayName: string;
-}
-
-
-declare namespace ComboboxRoot {
+declare namespace Header {
     var displayName: string;
 }
 
 
-declare namespace ComboboxInput {
+declare namespace Body {
     var displayName: string;
 }
 
 
-declare namespace ComboboxTrigger {
+declare namespace Footer {
     var displayName: string;
 }
 
 
-declare namespace ComboboxInputGroup {
+declare namespace Row {
     var displayName: string;
 }
 
 
-declare namespace ComboboxContent {
+declare namespace Head {
     var displayName: string;
 }
 
 
-declare namespace ComboboxList {
+declare namespace Cell {
     var displayName: string;
 }
 
 
-declare namespace ComboboxItem {
+declare namespace Caption {
     var displayName: string;
 }
 
 
-declare namespace ComboboxEmpty {
+declare namespace Root {
     var displayName: string;
 }
 
 
-declare namespace ComboboxGroup {
+declare namespace Trigger {
     var displayName: string;
 }
 
 
-declare namespace ComboboxGroupLabel {
+declare namespace Close {
     var displayName: string;
 }
 
 
-declare namespace ComboboxClear {
+declare namespace Content {
     var displayName: string;
 }
 
 
-declare namespace ComboboxChips {
+declare namespace Header {
     var displayName: string;
 }
 
 
-declare namespace ComboboxChip {
+declare namespace Footer {
     var displayName: string;
 }
 
 
-declare namespace ComboboxChipRemove {
+declare namespace Title {
     var displayName: string;
 }
 
 
-declare namespace ComboboxValue {
+declare namespace Description {
     var displayName: string;
 }
 
 
-declare namespace ComboboxStatus {
+declare namespace Root {
     var displayName: string;
 }
 
 
-declare namespace ComboboxCollection {
+declare namespace Label {
     var displayName: string;
 }
 
 
-declare namespace Root {
+declare namespace Control {
     var displayName: string;
 }
 
 
-declare namespace Label {
+declare namespace Description {
     var displayName: string;
 }
 
 
-declare namespace Control {
+declare namespace Error {
     var displayName: string;
 }
 
 
-declare namespace Description {
+declare namespace Validity {
     var displayName: string;
 }
 
 
-declare namespace Error {
+declare namespace Root {
     var displayName: string;
 }
 
 
-declare namespace Validity {
+declare namespace Legend {
     var displayName: string;
 }
 
@@ -9422,57 +9512,57 @@ declare namespace Root {
 }
 
 
-declare namespace Row {
+declare namespace Trigger {
     var displayName: string;
 }
 
 
-declare namespace Group {
+declare namespace Close {
     var displayName: string;
 }
 
 
-declare namespace Separator {
+declare namespace Content {
     var displayName: string;
 }
 
 
-declare namespace Root {
+declare namespace Header {
     var displayName: string;
 }
 
 
-declare namespace Trigger {
+declare namespace Footer {
     var displayName: string;
 }
 
 
-declare namespace Close {
+declare namespace Title {
     var displayName: string;
 }
 
 
-declare namespace Content {
+declare namespace Description {
     var displayName: string;
 }
 
 
-declare namespace Header {
+declare namespace Root {
     var displayName: string;
 }
 
 
-declare namespace Footer {
+declare namespace List {
     var displayName: string;
 }
 
 
-declare namespace Title {
+declare namespace Tab {
     var displayName: string;
 }
 
 
-declare namespace Description {
+declare namespace Panel {
     var displayName: string;
 }
 
@@ -9482,42 +9572,57 @@ declare namespace Root {
 }
 
 
-declare namespace List {
+declare namespace Row {
     var displayName: string;
 }
 
 
-declare namespace Tab {
+declare namespace Group {
     var displayName: string;
 }
 
 
-declare namespace Panel {
+declare namespace Separator {
     var displayName: string;
 }
 
 
-declare namespace Root {
+declare namespace SelectRoot {
     var displayName: string;
 }
 
 
-declare namespace Title {
+declare namespace SelectTrigger {
     var displayName: string;
 }
 
 
-declare namespace Description {
+declare namespace SelectValue {
     var displayName: string;
 }
 
 
-declare namespace Trigger {
+declare namespace SelectContent {
     var displayName: string;
 }
 
 
-declare namespace Settings {
+declare namespace SelectItem {
+    var displayName: string;
+}
+
+
+declare namespace SelectGroup {
+    var displayName: string;
+}
+
+
+declare namespace SelectGroupLabel {
+    var displayName: string;
+}
+
+
+declare namespace SelectSeparator {
     var displayName: string;
 }
 
@@ -9532,87 +9637,97 @@ declare namespace Root {
 }
 
 
-declare namespace Header {
+declare namespace Trigger {
     var displayName: string;
 }
 
 
-declare namespace ClearAll {
+declare namespace Content {
     var displayName: string;
 }
 
 
-declare namespace Sections {
+declare namespace ComboboxRoot {
     var displayName: string;
 }
 
 
-declare namespace Provider {
+declare namespace ComboboxInput {
     var displayName: string;
 }
 
 
-declare namespace Root {
+declare namespace ComboboxTrigger {
     var displayName: string;
 }
 
 
-declare namespace Trigger {
+declare namespace ComboboxInputGroup {
     var displayName: string;
 }
 
 
-declare namespace Content {
+declare namespace ComboboxContent {
     var displayName: string;
 }
 
 
-declare namespace SelectRoot {
+declare namespace ComboboxList {
     var displayName: string;
 }
 
 
-declare namespace SelectTrigger {
+declare namespace ComboboxItem {
     var displayName: string;
 }
 
 
-declare namespace SelectValue {
+declare namespace ComboboxEmpty {
     var displayName: string;
 }
 
 
-declare namespace SelectContent {
+declare namespace ComboboxGroup {
     var displayName: string;
 }
 
 
-declare namespace SelectItem {
+declare namespace ComboboxGroupLabel {
     var displayName: string;
 }
 
 
-declare namespace SelectGroup {
+declare namespace ComboboxClear {
     var displayName: string;
 }
 
 
-declare namespace SelectGroupLabel {
+declare namespace ComboboxChips {
     var displayName: string;
 }
 
 
-declare namespace SelectSeparator {
+declare namespace ComboboxChip {
     var displayName: string;
 }
 
 
-declare namespace AutocompleteStandalone {
+declare namespace ComboboxChipRemove {
     var displayName: string;
 }
 
 
-declare namespace AutocompleteAsyncStandalone {
+declare namespace ComboboxValue {
+    var displayName: string;
+}
+
+
+declare namespace ComboboxStatus {
+    var displayName: string;
+}
+
+
+declare namespace ComboboxCollection {
     var displayName: string;
 }
 
@@ -9687,6 +9802,16 @@ declare namespace AutocompleteStatus {
 }
 
 
+declare namespace AutocompleteStandalone {
+    var displayName: string;
+}
+
+
+declare namespace AutocompleteAsyncStandalone {
+    var displayName: string;
+}
+
+
 declare namespace DataTableRoot {
     var displayName: string;
 }