@tailor-platform/app-shell 1.8.0 → 1.9.0

package/dist/app-shell.d.ts

@@ -248,6 +248,8 @@ export declare const alertVariants: (props?: ({
     variant?: "error" | "neutral" | "success" | "warning" | "info" | null | undefined;
 } & ClassProp) | undefined) => string;
 
+declare type Anchor = "start" | "center" | "end";
+
 /**
  * Appearance menu. The end-user controls **color theme** (light / dark / system);
  * the color palette/brand is a developer configuration, so it is not shown here.
@@ -796,7 +798,7 @@ export declare const Avatar: {
 export declare type AvatarProps = React_2.ComponentProps<typeof Avatar_2.Root> & VariantProps<typeof avatarVariants>;
 
 export declare const avatarVariants: (props?: ({
-    size?: "default" | "sm" | "lg" | null | undefined;
+    size?: "default" | "xs" | "sm" | "lg" | null | undefined;
 } & ClassProp) | undefined) => string;
 
 export declare function Badge({ className, variant, children, ...props }: BadgeProps): JSX.Element;
@@ -1689,8 +1691,9 @@ declare namespace Content_4 {
 }
 
 /** The tooltip popup that displays additional information. */
-declare function Content_5({ className, position, side: _side, align: _align, sideOffset: _sideOffset, children, ...restProps }: React_2.ComponentProps<typeof Tooltip_2.Popup> & {
+declare function Content_5({ className, position, side: _side, align: _align, sideOffset: _sideOffset, noArrow, children, ...restProps }: React_2.ComponentProps<typeof Tooltip_2.Popup> & {
     position?: PositionProps;
+    noArrow?: boolean;
     /** @deprecated Use `position={{ side }}` instead. */
     side?: PositionProps["side"];
     /** @deprecated Use `position={{ align }}` instead. */
@@ -2160,6 +2163,11 @@ declare interface DateBehaviorProps<T extends DateValue> {
     hourCycle?: HourCycle;
     hideTimeZone?: boolean;
     placeholderValue?: DateValue;
+    /**
+     * First day of the week (0 = Sunday … 6 = Saturday); defaults to the locale.
+     * Only affects the `w`/`k` (start/end of week) keyboard shortcuts here.
+     */
+    firstDayOfWeek?: FirstDayOfWeek;
     name?: string;
     /** Accessible name when no visible `label` is provided (e.g. a compact filter input). */
     "aria-label"?: string;
@@ -2189,7 +2197,7 @@ declare interface DateCellOptions {
  * <DateField label="Created at" granularity="minute" />
  * ```
  */
-export declare function DateField<T extends DateValue = DateValue>({ label, description, errorMessage, className, locale: localeProp, value, defaultValue, onChange, granularity, hourCycle, placeholderValue, isDisabled, isReadOnly, isInvalid, isRequired, autoFocus, name, "aria-label": ariaLabel, }: DateFieldProps<T>): JSX.Element;
+export declare function DateField<T extends DateValue = DateValue>({ label, description, errorMessage, className, locale: localeProp, value, defaultValue, onChange, granularity, hourCycle, placeholderValue, minValue, maxValue, isDateUnavailable, isDisabled, isReadOnly, isInvalid, isRequired, autoFocus, firstDayOfWeek, name, "aria-label": ariaLabel, }: DateFieldProps<T>): JSX.Element;
 
 declare interface DateFieldMetaProps {
     label?: LocalizedString;
@@ -2223,7 +2231,6 @@ declare type DateFormat = "short" | "medium" | "long" | "relative";
 export declare function DatePicker<T extends DateValue = DateValue>({ label, description, errorMessage, className, locale: localeProp, timeZone: timeZoneProp, value, defaultValue, onChange, granularity, hourCycle, placeholderValue, minValue, maxValue, isDateUnavailable, isDisabled, isReadOnly, isInvalid, isRequired, autoFocus, firstDayOfWeek, name, "aria-label": ariaLabel, }: DatePickerProps<T>): JSX.Element;
 
 export declare type DatePickerProps<T extends DateValue = DateValue> = DateFieldProps<T> & {
-    firstDayOfWeek?: FirstDayOfWeek;
     /** IANA timezone; defaults to the AppShell `timeZone`. */
     timeZone?: string;
 };
@@ -3087,10 +3094,9 @@ declare type FilterInputForFieldType<TFilterConfigType extends FilterConfig["typ
 export declare type FilterOperator = OperatorForFilterType[FilterConfig["type"]];
 
 /**
- * Hand-rolled calendar-grid state — the logic react-aria's `useCalendarState`
- * would otherwise provide. We own: month/week computation (locale + first-day-
- * of-week aware), selection, roving focus, and full APG keyboard navigation
- * (arrows, Home/End, PageUp/Down, Shift+PageUp/Down).
+ * Week-start override for the `weekStart`/`weekEnd` shortcuts (and the calendar
+ * grid). Defined here — with the resolver that consumes it — so the field and
+ * calendar engines share one source of truth.
  */
 declare type FirstDayOfWeek = "sun" | "mon" | "tue" | "wed" | "thu" | "fri" | "sat";
 
@@ -3482,6 +3488,15 @@ export declare function Input({ className, type, ...props }: InputProps): JSX.El
 
 export declare type InputProps = React_2.ComponentProps<"input">;
 
+/**
+ * Positions content across a time range inside a row.
+ */
+declare function Interval({ start, end, children, id, insetY, className, style, }: TimelineIntervalProps): JSX.Element;
+
+declare namespace Interval {
+    var displayName: string;
+}
+
 /**
  * Check if an object type has no keys.
  */
@@ -3666,6 +3681,17 @@ declare namespace Legend {
 
 export { Link }
 
+/**
+ * Draws an orthogonal connector between two row items.
+ *
+ * If either referenced `Timeline.Interval` id is unresolved, nothing is rendered.
+ */
+declare function Link_2({ from, to, fromAnchor, toAnchor, arrow, gap, className, style, strokeWidth, }: TimelineLinkProps): React_2.ReactPortal | null;
+
+declare namespace Link_2 {
+    var displayName: string;
+}
+
 /** Options for `type: "link"` cells. `href` is required. */
 declare interface LinkCellOptions<TRow extends Record<string, unknown>> {
     /**
@@ -3857,6 +3883,11 @@ declare interface NumberCellOptions {
     locale?: string;
 }
 
+export declare type OpenCommandPaletteOptions = {
+    /** Optional initial text to prefill into the palette input. */
+    search?: string;
+};
+
 /**
  * Resolve the operator union for a specific field within a filter type.
  */
@@ -4163,6 +4194,26 @@ declare namespace Root_12 {
     var displayName: string;
 }
 
+/**
+ * Provides the shared time range used by all timeline primitives.
+ *
+ * Example:
+ * ```tsx
+ * <Timeline.Root start={projectStart} end={projectEnd}>
+ *   <Timeline.Viewport axis={axis}>
+ *     <Timeline.Row height={40}>
+ *       <Timeline.Interval start={task.start} end={task.end}>…</Timeline.Interval>
+ *     </Timeline.Row>
+ *   </Timeline.Viewport>
+ * </Timeline.Root>
+ * ```
+ */
+declare function Root_13({ start, end, children, className, style }: TimelineRootProps): JSX.Element;
+
+declare namespace Root_13 {
+    var displayName: string;
+}
+
 declare function Root_2<T extends ActivityCardBaseItem>({ items, title, maxVisible, overflowLabel, groupBy, className, children, }: ActivityCardRootProps<T>): JSX.Element;
 
 declare namespace Root_2 {
@@ -4383,6 +4434,25 @@ declare namespace Row {
     var displayName: string;
 }
 
+/**
+ * A single body row.
+ *
+ * Rows control vertical sizing and can optionally provide a background layer:
+ * ```tsx
+ * <Timeline.Row
+ *   height={40}
+ *   background={{ style: { background: "var(--muted)" } }}
+ * >
+ *   <Timeline.Interval start={task.start} end={task.end}>…</Timeline.Interval>
+ * </Timeline.Row>
+ * ```
+ */
+declare function Row_2({ children, className, style, height, background }: TimelineRowProps): JSX.Element;
+
+declare namespace Row_2 {
+    var displayName: string;
+}
+
 /**
  * A single row action definition for the actions column.
  */
@@ -5191,6 +5261,344 @@ declare type TabsVariant = "default" | "line" | "capsule";
 
 export { Time }
 
+/**
+ * Timeline primitives for building app-specific schedule, trace, and dependency UIs.
+ *
+ * Typical usage:
+ * ```tsx
+ * <Timeline.Root start={start} end={end}>
+ *   <Timeline.Viewport axis={axis} decorations={decorations}>
+ *     <Timeline.Row height={40} background={{ style: { background: "var(--muted)" } }}>
+ *       <Timeline.Interval id="task-1" start={task.start} end={task.end}>…</Timeline.Interval>
+ *     </Timeline.Row>
+ *     <Timeline.Link from="task-1" to="task-2" />
+ *   </Timeline.Viewport>
+ * </Timeline.Root>
+ * ```
+ */
+export declare const Timeline: {
+    Root: typeof Root_13;
+    Viewport: typeof Viewport;
+    Row: typeof Row_2;
+    Interval: typeof Interval;
+    Link: typeof Link_2;
+};
+
+/**
+ * Axis configuration owned by `Timeline.Viewport`.
+ *
+ * Example:
+ * ```tsx
+ * axis={{
+ *   guides: boundaries.map((at) => ({
+ *     at,
+ *     axisStyle: { background: "var(--border)" },
+ *     bodyStyle: { background: "var(--border)" },
+ *   })),
+ *   levels: [
+ *     {
+ *       kind: "spans",
+ *       items: timeboxes,
+ *     },
+ *   ],
+ * }}
+ * ```
+ */
+export declare interface TimelineAxis {
+    /** Boundary lines rendered in the axis and/or body. */
+    guides?: TimelineGuide[];
+    /** Stacked header levels rendered above the body. Defaults to `[]` when omitted. */
+    levels?: TimelineAxisLevel[];
+    /** Optional class applied to the axis container. */
+    className?: string;
+}
+
+/**
+ * One stacked axis level.
+ *
+ * Levels let an app compose multi-level headers such as year → month or a
+ * single timebox row such as half-hour slots.
+ */
+export declare type TimelineAxisLevel = (TimelineAxisLevelBase & {
+    /** Interval labels rendered across a time range. */
+    kind: "spans";
+    /** Span items to render in this level. */
+    items: TimelineAxisSpan[];
+    /** Optional class applied to every span in the level. */
+    itemClassName?: string;
+    /** Optional style applied to every span in the level. */
+    itemStyle?: React_2.CSSProperties;
+}) | (TimelineAxisLevelBase & {
+    /** Point labels rendered at specific times. */
+    kind: "ticks";
+    /** Tick items to render in this level. */
+    items: TimelineAxisTick[];
+    /** Horizontal anchor used when placing each tick label. */
+    labelAlign?: Anchor;
+});
+
+declare type TimelineAxisLevelBase = {
+    /** Height of this axis level in pixels. Defaults to `28`. */
+    height?: number;
+    /** Optional class applied to the level container. */
+    className?: string;
+};
+
+/**
+ * A labeled time range rendered inside an axis level.
+ *
+ * Use spans for "timeboxes" such as months, half-hours, sprints, or any
+ * other interval that should be labeled between boundary guides.
+ */
+export declare interface TimelineAxisSpan {
+    /** Stable React key. Falls back to a start/end-based key when omitted. */
+    key?: React_2.Key;
+    /** Start of the timebox. Accepts a `Date` or a millisecond timestamp. */
+    start: TimeValue;
+    /** End of the timebox. Accepts a `Date` or a millisecond timestamp. */
+    end: TimeValue;
+    /** Label rendered inside the span. */
+    label?: React_2.ReactNode;
+    /** Optional class applied to the positioned span element. */
+    className?: string;
+    /** Optional inline style applied to the positioned span element. */
+    style?: React_2.CSSProperties;
+}
+
+/**
+ * A labeled point in an axis level.
+ *
+ * Ticks are useful for point-in-time labels such as milestones or specific
+ * timestamps. For boxed labels between boundaries, prefer `TimelineAxisSpan`.
+ */
+export declare interface TimelineAxisTick {
+    /** Stable React key. Falls back to an `at`-based key when omitted. */
+    key?: React_2.Key;
+    /** Point in time represented by this tick. */
+    at: TimeValue;
+    /** Label rendered for the tick. */
+    label?: React_2.ReactNode;
+    /**
+     * Optional custom label position.
+     *
+     * Defaults to `at`. Use this when the tick represents one time but its label
+     * should be positioned elsewhere.
+     */
+    labelAt?: TimeValue;
+    /** Optional class applied to the tick container. */
+    className?: string;
+    /** Optional inline style applied to the tick container. */
+    style?: React_2.CSSProperties;
+}
+
+/**
+ * A decorative band rendered behind the timeline body.
+ *
+ * Useful for blackout windows, maintenance ranges, release freezes, or any
+ * other highlighted interval.
+ */
+export declare interface TimelineBand {
+    /** Stable React key. Falls back to a start/end-based key when omitted. */
+    key?: React_2.Key;
+    /** Start of the band. */
+    start: TimeValue;
+    /** End of the band. */
+    end: TimeValue;
+    /** Optional background color convenience prop. */
+    color?: string;
+    /** Optional class applied to the band element. */
+    className?: string;
+    /** Optional inline style applied to the band element. */
+    style?: React_2.CSSProperties;
+}
+
+/**
+ * Decorative layers rendered by `Timeline.Viewport`.
+ */
+export declare interface TimelineDecorations {
+    /** Background range highlights rendered behind rows. */
+    bands?: TimelineBand[];
+    /** Vertical markers rendered in the axis and/or body. */
+    markers?: TimelineMarker[];
+}
+
+/**
+ * A vertical guide line projected onto the axis and/or the timeline body.
+ *
+ * Guides are the timeline's "boundaries". Apps usually derive them from their
+ * own scale logic, then pair them with axis spans to label the ranges between
+ * those boundaries.
+ */
+export declare interface TimelineGuide {
+    /** Stable React key. Falls back to an `at`-based key when omitted. */
+    key?: React_2.Key;
+    /** Time position for the guide line. */
+    at: TimeValue;
+    /** Optional class applied to the guide inside the axis area. */
+    axisClassName?: string;
+    /** Optional inline style applied to the guide inside the axis area. */
+    axisStyle?: React_2.CSSProperties;
+    /** Optional class applied to the guide inside the body area. */
+    bodyClassName?: string;
+    /** Optional inline style applied to the guide inside the body area. */
+    bodyStyle?: React_2.CSSProperties;
+}
+
+export declare type TimelineIntervalProps = {
+    /** Start of the interval. */
+    start: TimeValue;
+    /** End of the interval. */
+    end: TimeValue;
+    /** Rendered content for the interval. */
+    children: React_2.ReactNode;
+    /** Optional stable id used by `Timeline.Link`. */
+    id?: string;
+    /** Top and bottom inset in pixels within the row. Defaults to `0`. */
+    insetY?: number;
+    /** Optional class applied to the positioned interval container. */
+    className?: string;
+    /** Optional inline style applied to the positioned interval container. */
+    style?: React_2.CSSProperties;
+};
+
+/**
+ * Shared defaults for `Timeline.Link` instances inside one viewport.
+ */
+export declare interface TimelineLinkDefaults {
+    /** Link routing strategy. Only orthogonal routing is currently supported. */
+    routing?: "orthogonal";
+    /** Whether links end with an arrow marker. Defaults to `true`. */
+    arrow?: boolean;
+    /** Horizontal gap used when routing out of and into items. Defaults to `16`. */
+    gap?: number;
+    /** Optional class applied to each link SVG when the link does not override it. */
+    className?: string;
+    /**
+     * Optional inline style applied to each link SVG when the link does not override it.
+     *
+     * Prefer an opaque `color` here over alpha-based text colors when overlapping links
+     * should not appear darker.
+     */
+    style?: React_2.CSSProperties;
+    /** Optional stroke width used by each link when the link does not override it. */
+    strokeWidth?: number;
+}
+
+export declare type TimelineLinkProps = {
+    /** Source `Timeline.Interval` id. */
+    from: string;
+    /** Target `Timeline.Interval` id. */
+    to: string;
+    /** Source anchor used for routing. Defaults to `"end"`. */
+    fromAnchor?: Anchor;
+    /** Target anchor used for routing. Defaults to `"start"`. */
+    toAnchor?: Anchor;
+    /** Overrides the viewport default arrow visibility. */
+    arrow?: boolean;
+    /** Overrides the viewport default routing gap. */
+    gap?: number;
+    /** Optional class applied to the link SVG. */
+    className?: string;
+    /** Optional inline style applied to the link SVG. */
+    style?: React_2.CSSProperties;
+    /** Optional stroke width for the link path. */
+    strokeWidth?: number;
+};
+
+/**
+ * A decorative vertical marker rendered in the axis and/or body.
+ */
+export declare interface TimelineMarker {
+    /** Stable React key. Falls back to an `at`-based key when omitted. */
+    key?: React_2.Key;
+    /** Time position for the marker. */
+    at: TimeValue;
+    /** Optional line color convenience prop. */
+    color?: string;
+    /** Optional marker label. */
+    label?: React_2.ReactNode;
+    /** Optional class applied to the outer marker wrapper. */
+    className?: string;
+    /** Optional inline style applied to the outer marker wrapper. */
+    style?: React_2.CSSProperties;
+    /** Optional class applied to the marker line. */
+    lineClassName?: string;
+    /** Optional inline style applied to the marker line. */
+    lineStyle?: React_2.CSSProperties;
+    /** Optional class applied to the marker label. */
+    labelClassName?: string;
+    /** Optional inline style applied to the marker label. */
+    labelStyle?: React_2.CSSProperties;
+    /** Controls where the marker is rendered. Defaults to `"body"`. */
+    placement?: "axis" | "body" | "both";
+}
+
+export declare type TimelineRootProps = {
+    /** Inclusive start of the overall timeline range. */
+    start: TimeValue;
+    /** Inclusive end of the overall timeline range. */
+    end: TimeValue;
+    /** Timeline subtree. Usually contains one `Timeline.Viewport`. */
+    children: React_2.ReactNode;
+    /** Optional class applied to the root container. */
+    className?: string;
+    /** Optional inline style applied to the root container. */
+    style?: React_2.CSSProperties;
+};
+
+/**
+ * Background content rendered for a `Timeline.Row` in a dedicated layer.
+ *
+ * Use this when a row background should sit behind guides but in front of body
+ * bands. This is different from `Timeline.Row`'s own `style`, which affects the
+ * row content container itself.
+ */
+export declare interface TimelineRowBackground {
+    /** Optional class applied to the background layer element. */
+    className?: string;
+    /** Optional inline style applied to the background layer element. */
+    style?: React_2.CSSProperties;
+}
+
+export declare type TimelineRowProps = {
+    /** Row contents, typically intervals. */
+    children: React_2.ReactNode;
+    /** Optional class applied to the row content container. */
+    className?: string;
+    /** Optional inline style applied to the row content container. */
+    style?: React_2.CSSProperties;
+    /** Row height in pixels. Defaults to `32`. */
+    height?: number;
+    /**
+     * Optional background rendered in a dedicated layer.
+     *
+     * Use this instead of `style.background` when guides should remain visible in
+     * front of the row background.
+     */
+    background?: TimelineRowBackground | null;
+};
+
+export declare type TimelineViewportProps = {
+    /** Timeline content. Rows and links can be passed in any order. */
+    children: React_2.ReactNode;
+    /** Optional fixed canvas width in pixels for horizontally scrollable timelines. */
+    canvasWidth?: number;
+    /** Keeps the axis pinned to the top of the viewport when scrolling vertically. */
+    stickyAxis?: boolean;
+    /** Axis configuration for guides and header levels. */
+    axis?: TimelineAxis;
+    /** Decorative layers such as bands and markers. */
+    decorations?: TimelineDecorations;
+    /** Shared defaults applied to `Timeline.Link` nodes inside this viewport. */
+    linkDefaults?: TimelineLinkDefaults;
+    /** Optional class applied to the scroll viewport. */
+    className?: string;
+    /** Optional inline style applied to the scroll viewport. */
+    style?: React_2.CSSProperties;
+};
+
+declare type TimeValue = Date | number;
+
 /**
  * Resolved timezone object with helpers bound to the configured timezone.
  */
@@ -6090,6 +6498,14 @@ export { useLocation }
 
 export { useNavigate }
 
+/**
+ * Returns a function that opens the CommandPalette.
+ *
+ * Optionally accepts an initial search string, including prefix-activated
+ * search modes such as `PO: alice`.
+ */
+export declare function useOpenCommandPalette(): (options?: OpenCommandPaletteOptions) => void;
+
 /**
  * Override the breadcrumb title for the current page.
  *
@@ -6278,6 +6694,28 @@ declare namespace Validity {
     var displayName: string;
 }
 
+/**
+ * Owns scrolling, axis rendering, decoration layers, and link layering.
+ *
+ * Example:
+ * ```tsx
+ * <Timeline.Viewport
+ *   canvasWidth={1200}
+ *   axis={{ guides, levels }}
+ *   decorations={{ bands }}
+ *   linkDefaults={{ style: { color: "var(--muted-foreground)" }, strokeWidth: 1.5 }}
+ * >
+ *   {rows}
+ *   {links}
+ * </Timeline.Viewport>
+ * ```
+ */
+declare function Viewport({ children, canvasWidth, stickyAxis, axis, decorations, linkDefaults, className, style, }: TimelineViewportProps): JSX.Element;
+
+declare namespace Viewport {
+    var displayName: string;
+}
+
 /**
  * Conditionally render children based on guard evaluation.
  *