pixelize-design-library 2.4.2-beta.67 → 2.4.2-beta.69

package/dist/Components/Tag/TagProps.d.ts

@@ -12,6 +12,7 @@ export type TagVariant = "solid" | "outline" | "subtle";
 export type TagDisplay = "chip" | "dot";
 /** Props for the pill-shaped status/filter Tag chip — see Tag.tsx for interactive/icon behavior. */
 export interface TagProps extends DataAttributes {
+    /** Chip text; truncates with an ellipsis when `maxW` is set. */
     label: string;
     /** No effect without icon — turns it into a remove button and stops the click from bubbling to onTagClick. */
     onIconClick?: () => void;
@@ -29,7 +30,9 @@ export interface TagProps extends DataAttributes {
     tone?: Tone;
     /** Caps the width; the label truncates with an ellipsis and shows the full text as a title. */
     maxW?: BoxProps["maxW"];
+    /** Defaults to "sm"; also scales the icons. */
     size?: TagSize;
+    /** Defaults to "subtle"; ignored when `display` is "dot". */
     variant?: TagVariant;
     /** "dot" renders an 8px tone dot plus plain label for quiet rows; variant and icons are ignored. Default "chip". */
     display?: TagDisplay;

package/dist/Components/TagInput/TagInput.d.ts

@@ -1,3 +1,4 @@
 import type { TagInputProps } from "./TagInputProps";
+/** Free-text tag field that commits entries as removable chips; forwards its ref to the text input. */
 declare const TagInput: import("react").ForwardRefExoticComponent<TagInputProps & import("react").RefAttributes<HTMLInputElement>>;
 export default TagInput;

package/dist/Components/TagInput/TagInput.js

@@ -18,6 +18,7 @@ const useFieldIds_1 = require("../Common/useFieldIds");
 const searchSelectSize_1 = require("../SearchSelect/searchSelectSize");
 const Tag_1 = __importDefault(require("../Tag/Tag"));
 const tagEntries_1 = require("./tagEntries");
+/** Free-text tag field that commits entries as removable chips; forwards its ref to the text input. */
 const TagInput = (0, react_1.forwardRef)(function TagInput({ value, onChange, validate, maxTags, allowDuplicates = false, addOnBlur = false, id, name, label, "aria-label": ariaLabel, placeholder, isRequired = false, isInformation, informationMessage, isDisabled = false, isReadOnly = false, error, errorMessage, helperText, size = controlSizes_1.DEFAULT_CONTROL_SIZE, labels, width = "100%", }, ref) {
     const theme = (0, useCustomTheme_1.useCustomTheme)();
     const s = (0, searchSelectSize_1.getSearchSelectSizeStyles)(size);

package/dist/Components/TagInput/TagInputProps.d.ts

@@ -19,6 +19,7 @@ export type TagInputProps = {
     id?: string;
     /** Submits each tag as its own hidden input with this name; the half-typed text is never submitted. */
     name?: string;
+    /** Visible label above the field, tied to the input via `for`; also required for the info icon. */
     label?: string;
     /** Names the input when there is no visible `label`. */
     "aria-label"?: string;
@@ -28,6 +29,7 @@ export type TagInputProps = {
     isRequired?: boolean;
     /** Shows an info icon beside the label; needs both `label` and `informationMessage`. */
     isInformation?: boolean;
+    /** Tooltip text of the info icon; has no effect unless `isInformation` and `label` are set. */
     informationMessage?: string;
     /** Dims the chips, disables the input and drops the remove buttons. */
     isDisabled?: boolean;

package/dist/Components/TimePicker/TimePicker.d.ts

@@ -1,3 +1,4 @@
 import type { TimePickerProps } from "./TimePickerProps";
+/** Three inline selects (hour, minute, AM/PM or 24-hour) that emit a Date; `ref` is the hour select. */
 declare const TimePicker: import("react").ForwardRefExoticComponent<TimePickerProps & import("react").RefAttributes<HTMLSelectElement>>;
 export default TimePicker;

package/dist/Components/TimePicker/TimePicker.js

@@ -14,6 +14,7 @@ const useFieldIds_1 = require("../Common/useFieldIds");
 const fieldStyles_1 = require("../Common/fieldStyles");
 const timeParts_1 = require("./timeParts");
 const EMPTY = "";
+/** Three inline selects (hour, minute, AM/PM or 24-hour) that emit a Date; `ref` is the hour select. */
 const TimePicker = (0, react_1.forwardRef)(function TimePicker({ value, date, onChange, onClear, use24Hour, dateFormat, minuteStep, baseDate, isDisabled, disabled: legacyDisabled, id, name, label, "aria-label": ariaLabel, isRequired = false, isInformation, informationMessage, error, errorMessage, helperText, size = controlSizes_1.DEFAULT_CONTROL_SIZE, width = "100%", }, ref) {
     var _a;
     const theme = (0, useCustomTheme_1.useCustomTheme)();

package/dist/Components/TimePicker/TimePickerProps.d.ts

@@ -17,6 +17,7 @@ export type TimePickerProps = {
     minuteStep?: number;
     /** Day a picked time lands on while `value` is empty; defaults to today. */
     baseDate?: Date;
+    /** Disables all three selects and dims the field; wins over the deprecated `disabled`. */
     isDisabled?: boolean;
     /** @deprecated Use `isDisabled`; `isDisabled` wins when both are set. */
     disabled?: boolean;
@@ -32,6 +33,7 @@ export type TimePickerProps = {
     isRequired?: boolean;
     /** Shows an info icon beside the label; needs both `label` and `informationMessage`. */
     isInformation?: boolean;
+    /** Tooltip text of the info icon; shown only with `isInformation` and a `label`. */
     informationMessage?: string;
     /** Error border and `aria-invalid` on every select; swaps `helperText` for `errorMessage`. */
     error?: boolean;

package/dist/Components/Timeline/TimelineProps.d.ts

@@ -32,6 +32,7 @@ export interface TimelineEvent {
 }
 /** A file attached to a manual timeline note; size is captured but never read or displayed. */
 export interface TimelineNoteAttachment {
+    /** Link target, opened in a new tab; clicks do not trigger the card's `onEventClick`. */
     url: string;
     /** Link text; defaults to "attachment". */
     name?: string;
@@ -39,11 +40,15 @@ export interface TimelineNoteAttachment {
 }
 /** One manual note attached to a log entry; log_note_id doubles as the React key and the edit/delete target. */
 export interface TimelineNote {
+    /** Unique note id passed back to `onEditNote` and `onDeleteNote`. */
     log_note_id: number;
     /** @deprecated Never read — the parent event already identifies the log. */
     logs_id?: number;
+    /** Bold note heading; omitted when empty. */
     title?: string | null;
+    /** Note body, rendered with line breaks preserved; omitted when empty. */
     note?: string | null;
+    /** Rendered as link chips under the body. */
     attachments?: TimelineNoteAttachment[] | null;
     /** Epoch ms (number or digit string) or any `Date`-parseable string. */
     created_at?: number | string | null;
@@ -54,7 +59,7 @@ export interface TimelineNote {
 export interface TimelineEvents {
     /** Only used in the React key — duplicates are tolerated. */
     logs_id: number;
-    /** "created"/"updated"/"delete(d)" (any case) pick the color and icon; anything else renders in primary. */
+    /** Shown as the capitalised status pill; "created"/"updated"/"delete(d)" (any case) pick the color and icon, anything else uses primary. */
     title: string;
     /** @deprecated Never read, but required — keep passing it; do not delete. */
     primary_id: number;
@@ -68,6 +73,7 @@ export interface TimelineEvents {
     created_at: number;
     /** Object or JSON string of `{ field: { original, updated } }`; renders a from→to diff, bad JSON renders none. */
     changes: unknown;
+    /** Manual notes listed under the card; editable and deletable through `onEditNote` and `onDeleteNote`. */
     notes?: TimelineNote[] | null;
     /** Replaces the node icon derived from `title`/`action_from`. */
     icon?: ReactNode;

package/dist/Components/Toggle/TableToggleProps.d.ts

@@ -5,7 +5,9 @@ export type ViewMode = "grid" | "list";
 export type TableToggleVariant = SegmentedControlVariant;
 /** Props for TableToggle — the exported type is named ViewToggleProps, not TableToggleProps. */
 export type ViewToggleProps = {
+    /** Controlled active view; marks that button `aria-pressed`. */
     value: ViewMode;
+    /** Fires with the clicked mode, including when it is already active. */
     onChange: (val: ViewMode) => void;
     /** brandSlide = primary view switcher; underlineSlide = dense toolbars/headers. */
     variant?: TableToggleVariant;

package/dist/Components/ToggleSwitch/ToggleSwitchProps.d.ts

@@ -48,9 +48,11 @@ export type ToggleSwitchProps = Naming & {
     helperText?: string;
     /** Red track border and shows `errorMessage` instead of `helperText`. */
     error?: boolean;
+    /** Shown in place of `helperText` while `error` is true. */
     errorMessage?: string;
     /** Adds the asterisk to `fieldLabel` when present, else to the inline `label`; `aria-required` is omitted, not allowed on role="switch". */
     isRequired?: boolean;
+    /** Native name of the input, so the switch submits with a surrounding form. */
     name?: string;
     /** Native input value submitted with a form when checked. */
     value?: string;

package/dist/Components/ToolTip/OverflowToolTip.d.ts

@@ -1,2 +1,3 @@
 import { ToolTipProps } from "./ToolTipProps";
+/** Tooltip that appears only when its child text is actually truncated; sugar over `<ToolTip overflowOnly>`. */
 export default function OverflowToolTip(props: ToolTipProps): import("react/jsx-runtime").JSX.Element;

package/dist/Components/ToolTip/OverflowToolTip.js

@@ -6,7 +6,7 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.default = OverflowToolTip;
 const jsx_runtime_1 = require("react/jsx-runtime");
 const ToolTip_1 = __importDefault(require("./ToolTip"));
-// Tooltip that appears only when its child text is actually truncated. Sugar over <ToolTip overflowOnly>.
+/** Tooltip that appears only when its child text is actually truncated; sugar over `<ToolTip overflowOnly>`. */
 function OverflowToolTip(props) {
     return (0, jsx_runtime_1.jsx)(ToolTip_1.default, { ...props, overflowOnly: true });
 }

package/dist/Components/ToolTip/ToolTipProps.d.ts

@@ -5,6 +5,7 @@ export type ToolTipProps = Pick<ChakraTooltip, "placement" | "label" | "hasArrow
     bg?: string;
     /** Label ink; defaults to the tooltipSurface text colour. */
     color?: string;
+    /** The trigger element; a non-element such as text is wrapped in a focusable span. */
     children: React.ReactNode;
     /** Inline CSS on the tooltip bubble (forwarded as `style`), not on the child. */
     styles?: React.CSSProperties;

package/dist/Components/TrustBadges/TrustBadgesProps.d.ts

@@ -5,14 +5,18 @@ export interface TrustItem {
     id?: string;
     /** A lucide icon element; decorative, so the title always carries the meaning. */
     icon: ReactNode;
+    /** Bold headline of the tile; also the React key when `id` is missing. */
     title: string;
+    /** Smaller muted line under the title. */
     detail?: string;
 }
 /** `row` is a wrapping horizontal strip, `grid` an even two-column grid, `stack` a vertical list. */
 export type TrustBadgesLayout = "row" | "grid" | "stack";
 /** Reassurance items (returns, COD, authenticity, secure payments) on a tonal tile. */
 export interface TrustBadgesProps {
+    /** Tiles in display order; an empty array renders nothing. */
     items: TrustItem[];
+    /** Defaults to "row". */
     layout?: TrustBadgesLayout;
     /** Accessible name of the list. */
     "aria-label"?: string;

package/dist/Components/UpgradeButton/UpgradeButton.d.ts

@@ -1,4 +1,5 @@
 import React from "react";
 import { UpgradeButtonProps } from "./UpgradeButtonProps";
+/** Gradient CTA pill with optional shimmer, subtitle and loading state for upgrade prompts. */
 declare const UpgradeButton: React.FC<UpgradeButtonProps>;
 export default UpgradeButton;

package/dist/Components/UpgradeButton/UpgradeButton.js

@@ -20,6 +20,7 @@ const sizeMap = {
     md: { px: "20px", py: "5px", font: "14px", sub: "10px", icon: 13, radius: "full" },
     lg: { px: "26px", py: "8px", font: "16px", sub: "11px", icon: 16, radius: "full" },
 };
+/** Gradient CTA pill with optional shimmer, subtitle and loading state for upgrade prompts. */
 const UpgradeButton = ({ label, mobileLabel, subtitle, icon = lucide_react_1.Sparkles, iconColor, variant = "brand", gradient, size = "md", shimmer = true, isLoading = false, isDisabled = false, maxLabelWidth = "160px", ariaLabel, onClick, }) => {
     const theme = (0, useCustomTheme_1.useCustomTheme)();
     const c = theme.colors;

package/dist/Components/UpgradeButton/UpgradeButtonProps.d.ts

@@ -16,7 +16,7 @@ export interface UpgradeButtonProps {
     subtitle?: string;
     /** Leading icon. Defaults to lucide `Sparkles`. Pass null to hide. */
     icon?: ElementType | null;
-    /** Defaults to gold only when gold clears AA contrast against the gradient; otherwise silently falls back to the label's ink color. */
+    /** Defaults to gold only when gold clears 3:1 (non-text) against the painted gradient stops; otherwise silently falls back to the label's ink color. */
     iconColor?: string;
     /**
      * Theme-aware color variant. Defaults to `brand` (the active theme's
@@ -28,7 +28,9 @@ export interface UpgradeButtonProps {
      * provided.
      */
     gradient?: {
+        /** Start color of the 135deg gradient; reversed on hover. */
         from: string;
+        /** End color of the gradient; label ink is chosen to clear contrast on both stops. */
         to: string;
     };
     /** Default "md". */
@@ -43,5 +45,6 @@ export interface UpgradeButtonProps {
     maxLabelWidth?: string;
     /** Replaces the name read from the visible text; it must contain that text, or voice control cannot match it. */
     ariaLabel?: string;
+    /** Click handler; not called while `isLoading` or `isDisabled`. */
     onClick?: React.MouseEventHandler<HTMLButtonElement>;
 }

package/dist/Components/UserDetails/UserDetailsProps.d.ts

@@ -1,18 +1,26 @@
 import { ElementType, ReactNode } from "react";
 /** One assignable role offered in the Add User and Change Role selects. */
 export type RoleOption = {
+    /** Identifier passed back as `roleId` on change; compared by `label`, not id, to pre-select the current role. */
     id: number;
+    /** Role name shown in the select and matched case-insensitively against `SelectedUserDetail.role`. */
     label: string;
 };
 /** One row in the left-panel user list — see SelectedUserDetail for the richer shape used once selected. */
 export type UserListItem = {
+    /** Row key; compared with `selectedUserId` to highlight the selected row. */
     id: number;
+    /** Joined with `lastName` as the row title and avatar initials. */
     firstName: string;
+    /** Joined after `firstName` as the row title. */
     lastName: string;
+    /** Secondary line under the name in the row. */
     email: string;
     /** Display-only — UserDetails never reads this in the list row itself, only in SelectedUserDetail once selected. */
     role: string;
+    /** Avatar image URL; initials show when omitted. */
     profile?: string;
+    /** Selects the green Active or red Inactive badge on the row. */
     isActive: boolean;
     /** isPending/isCurrent/isSuperAdmin here are decorative — only SelectedUserDetail's copies (after selection) drive any badge or action-bar behavior. */
     isPending?: boolean;
@@ -21,20 +29,26 @@ export type UserListItem = {
 };
 /** One label/value row in the "Personal Information" panel; icon falls back to a generic user icon when omitted. */
 export type UserDetailRow = {
+    /** Caption on the left of the row. */
     label: string;
+    /** Text shown for this field. */
     value: string;
+    /** Lucide-style icon component for the row tile; a generic user icon when omitted. */
     icon?: ElementType;
 };
 /** Right-panel shape for the selected user — distinct field names from UserListItem (name, userId); not derived from it. */
 export type SelectedUserDetail = {
     /** When null, Change Role and Resend Invitation silently no-op on click (no disabled state) — unlike Deactivate, which greys out. */
     userId?: number;
+    /** Heading and avatar name in the detail header; also named in the deactivate confirmation. */
     name: string;
     /** Feeds ChangeRoleModal's currentRole — must case-insensitively match a roleOptions[].label or the modal opens with nothing pre-selected. */
     role: string;
     /** Shown only inside ChangeRoleModal's header — the Personal Information panel does not render this field, only `details`. */
     email: string;
+    /** Avatar image URL; initials show when omitted. */
     profilePhoto?: string;
+    /** Selects the green Active or red Inactive badge; Resend Invitation shows only while inactive. */
     isActive: boolean;
     /** Renders the "Pending Invitation" badge only — does not affect which action buttons show. */
     isPending?: boolean;
@@ -42,18 +56,25 @@ export type SelectedUserDetail = {
     isCurrent?: boolean;
     /** True hides the entire action bar (reinvite/change-role/deactivate), not just the deactivate button. */
     isSuperAdmin?: boolean;
+    /** Rows of the Personal Information panel, in order, separated by dividers. */
     details: UserDetailRow[];
 };
 /** Form values submitted by the Add User modal; role stays null until the user picks one. */
 export type AddUserFormValues = {
+    /** Entered first name; required, trimmed before the empty check. */
     firstName: string;
+    /** Entered last name; required, trimmed before the empty check. */
     lastName: string;
+    /** Entered email; required and validated as an address. */
     email: string;
+    /** The picked role option, or null while none is chosen. */
     role: RoleOption | null;
 };
 /** Payload from the Change Role modal — just the ids, unlike AddUserFormValues which carries the full RoleOption. */
 export type ChangeRoleSubmitPayload = {
+    /** Id of the user whose role changes (`SelectedUserDetail.userId`). */
     userId: number;
+    /** `id` of the newly picked RoleOption. */
     roleId: number;
 };
 /**
@@ -61,40 +82,75 @@ export type ChangeRoleSubmitPayload = {
  * key has a sensible English default so the component works standalone.
  */
 export type UserDetailsLabels = {
+    /** List panel heading and its accessible region name. */
     teamMembers?: string;
+    /** Accessible name of the refresh button; the button exists only when `onRefresh` is passed. */
     refreshList?: string;
+    /** Detail panel heading and region name while a user is selected. */
     userDetails?: string;
+    /** Detail panel heading and region name, and the empty-state title, while no user is selected. */
     selectTeamMember?: string;
+    /** Add User button text in the detail header; the button needs `canManageUsers`. */
     addUser?: string;
+    /** Resend Invitation button text. */
     resendInvitation?: string;
+    /** Deactivate button text, also the confirm button in the deactivation dialog. */
     deactivateUser?: string;
+    /** Change Role button text. */
     changeRole?: string;
+    /** Badge on the avatar of the current user. */
     you?: string;
+    /** Badge text for an active user, in the list and the detail header. */
     active?: string;
+    /** Badge text for an inactive user, in the list and the detail header. */
     inactive?: string;
+    /** Badge text for a user whose invitation is pending. */
     pendingInvitation?: string;
+    /** Uppercase caption above the details rows. */
     personalInformation?: string;
+    /** Empty-state title of the list when `users` is empty. */
     noUsers?: string;
+    /** Empty-state description in the detail panel while no user is selected. */
     noUserSelected?: string;
+    /** Title of the Add User modal. */
     addNewUser?: string;
+    /** Label of the first-name field in the Add User modal. */
     firstName?: string;
+    /** Label of the last-name field in the Add User modal. */
     lastName?: string;
+    /** Label of the email field in the Add User modal and of the read-only email in the Change Role modal. */
     email?: string;
+    /** Label of the role select in the Add User and Change Role modals. */
     role?: string;
+    /** Placeholder of the first-name field. */
     firstNamePlaceholder?: string;
+    /** Placeholder of the last-name field. */
     lastNamePlaceholder?: string;
+    /** Placeholder of the email field. */
     emailPlaceholder?: string;
+    /** Text of the add-role action inside the role select; shown when `onAddRoleClick` is passed. */
     addNewRole?: string;
+    /** Cancel button text in all three modals. */
     cancel?: string;
+    /** Save button text in the Add User and Change Role modals. */
     save?: string;
+    /** Error shown when the first name is empty on save. */
     firstNameRequired?: string;
+    /** Error shown when the last name is empty on save. */
     lastNameRequired?: string;
+    /** Error shown when the email is empty on save. */
     emailRequired?: string;
+    /** Error shown when the email is not a valid address. */
     emailInvalid?: string;
+    /** Error shown when no role is picked on save. */
     roleRequired?: string;
+    /** Title of the Change Role modal. */
     changeRoleTitle?: string;
+    /** Title of the deactivation dialog. */
     confirmDeactivation?: string;
+    /** Question line of the deactivation dialog. */
     deactivateConfirmQuestion?: string;
+    /** Text following the user name in the deactivation dialog, e.g. "Ann will no longer have access". */
     deactivateConfirmDescription?: string;
 };
 /** Two-pane user directory + detail panel with bundled Add/Change-Role/Deactivate modals; not a role editor — pair with RolesPermission for managing roles themselves. */
@@ -115,7 +171,9 @@ export interface UserDetailsProps {
     isInviteLoading?: boolean;
     /** Unlike isAddUserLoading/isChangeRoleLoading, the confirm modal closes immediately on click — this flag can't keep it open to show a spinner. */
     isDeactivateLoading?: boolean;
+    /** Spinner on the Add User modal's Save button. */
     isAddUserLoading?: boolean;
+    /** Spinner on the Change Role modal's Save button. */
     isChangeRoleLoading?: boolean;
     /** Selection + refresh. */
     onSelectUser?: (user: UserListItem) => void;

package/dist/Components/VariantSelector/VariantSelectorProps.d.ts

@@ -10,6 +10,7 @@ export interface VariantSelectorProps {
     variants: ProductVariant[];
     /** Controlled selection, axis id to option value id. */
     value?: VariantSelection;
+    /** Initial selection when uncontrolled; ignored once `value` is passed. */
     defaultValue?: VariantSelection;
     /** Receives the new selection and the matching variant, or undefined while the selection is incomplete or has no variant. */
     onValueChange?: (selection: VariantSelection, variant: ProductVariant | undefined) => void;
@@ -19,9 +20,12 @@ export interface VariantSelectorProps {
     showSelectedLabel?: boolean;
     /** Tags a value "N left" only when its real remaining stock is at or under LOW_STOCK_THRESHOLD. */
     showLowStock?: boolean;
+    /** Size of every option chip. Defaults to "md". */
     size?: OptionChipSize;
+    /** How each axis arranges its options. Defaults to "wrap". */
     layout?: VariantSelectorLayout;
     /** Also called when an axis `guide` link is clicked, after the guide's own onClick. */
     onGuideClick?: (axisId: string) => void;
+    /** Test id placed on the root element. */
     "data-testid"?: string;
 }

package/dist/Components/WishlistToggle/WishlistToggleProps.d.ts

@@ -10,10 +10,14 @@ export interface WishlistToggleProps {
     defaultSelected?: boolean;
     /** Fires with the next state on click or keyboard activation. */
     onSelectedChange?: (selected: boolean) => void;
+    /** Button size; defaults to "md". */
     size?: WishlistToggleSize;
+    /** Look of the button; defaults to "soft". */
     variant?: WishlistToggleVariant;
     /** Fixed accessible name, e.g. "Save Denim Jacket"; defaults to "Add to wishlist" / "Remove from wishlist". */
     label?: string;
+    /** Blocks toggling and dims the button. */
     isDisabled?: boolean;
+    /** Test id on the button. */
     "data-testid"?: string;
 }

package/dist/Components/WizardDialog/WizardDialogProps.d.ts

@@ -1,9 +1,11 @@
 import type { ReactNode } from "react";
 /** One step of a wizard: its stepper label, body, validation and review summary. */
 export type WizardStep = {
+    /** Stable key for the step; the value of `stepId` and what `onStepChange` receives. */
     id: string;
     /** Stepper label and the heading shown above the step content. */
     label: string;
+    /** Body rendered below the step heading; stays in the tree only while this step is current. */
     content: ReactNode;
     /** Messages that block leaving this step; [] = valid. Must be pure (runs in the reducer). */
     validate?: () => string[];
@@ -12,21 +14,32 @@ export type WizardStep = {
 };
 /** Visible strings; every key falls back to its English default. */
 export type WizardLabels = Partial<{
+    /** Back button. Default "Back". */
     back: string;
+    /** Continue button on every step but the last. Default "Continue". */
     next: string;
+    /** Finish button on the last step. Default "Finish". */
     finish: string;
+    /** Cancel button text. Default "Cancel". */
     cancel: string;
+    /** Progress line above the step heading, from the 1-based step number and the step count. Default "Step N of M". */
     stepOf: (current: number, total: number) => string;
+    /** Title of the error summary shown when a step fails validation. Default "Fix the following to continue". */
     fixErrors: string;
+    /** Heading of the review block on the last step. Default "Review". */
     review: string;
 }>;
 /** Props for the wizard dialog: Modal (or inline with `chrome`) + stepper + per-step validation + review on the last step. */
 export interface WizardDialogProps {
+    /** Shows the wizard; closing resets uncontrolled progress to the first step. */
     isOpen: boolean;
     /** Ignored while `isFinishing`. */
     onClose: () => void;
+    /** Dialog title, or the heading above the inline wizard. */
     title: string;
+    /** Muted line under the title. */
     subtitle?: string;
+    /** Ordered steps; the stepper locks every step beyond the furthest one validly reached. */
     steps: WizardStep[];
     /** Called after every step re-validates; a failing step is jumped to with its errors. */
     onFinish: () => void;
@@ -44,7 +57,9 @@ export interface WizardDialogProps {
     size?: "lg" | "xl" | "2xl" | "3xl" | "4xl";
     /** "inline" draws the wizard in place with no Modal (no overlay, focus trap, close X, Esc or dialog role) for a host that is already the dialog, such as a WorkspaceWindow; it renders nothing while closed and Cancel still calls `onClose`. Default "modal". */
     chrome?: "modal" | "inline";
+    /** Overrides button and message text; omitted keys keep their English defaults. */
     labels?: WizardLabels;
+    /** Test id of the step body; the inline frame uses it with an `-inline` suffix. Defaults to "wizard-dialog". */
     "data-testid"?: string;
 }
 /** Same flow inline (a page section, not a modal) — for full-page wizards. */

package/dist/Components/WizardDialog/wizardSteps.d.ts

@@ -1,24 +1,36 @@
 export type StepValidator = () => string[];
 /** Reducer state: current step, the furthest validly reached step, and the blocking messages. */
 export type WizardState = {
+    /** Zero-based index of the current step. */
     index: number;
     /** Furthest step the user has validly reached; stages beyond it stay locked. */
     furthest: number;
+    /** Messages blocking the current step; [] when none. */
     errors: string[];
 };
 /** Actions `wizardTransition` understands. */
-export type WizardAction = {
+export type WizardAction = 
+/** Validates the current step, then advances; failing keeps the step and stores its errors. */
+{
     type: "next";
-} | {
+}
+/** Steps back one, clearing errors. */
+ | {
     type: "back";
-} | {
+}
+/** Jumps to `index` if it is at or before `furthest`; otherwise ignored. */
+ | {
     type: "goto";
     index: number;
-} | {
+}
+/** Moves to `index` and shows `errors`, used when finishing finds an invalid step. */
+ | {
     type: "fail";
     index: number;
     errors: string[];
-} | {
+}
+/** Returns to the first step with nothing reached beyond it. */
+ | {
     type: "reset";
 };
 export declare const INITIAL_WIZARD_STATE: WizardState;

package/dist/Components/WorkspaceWindow/WorkspaceTrayPreview.d.ts

@@ -1,2 +1,3 @@
 import type { WorkspaceTrayPreviewProps } from "./WorkspaceWindowProps";
+/** Hover and focus preview card with open delay, close grace and Escape dismissal. */
 export default function WorkspaceTrayPreview({ children, preview, enabled, openDelayMs, closeDelayMs, placement, onOpenChange, width, testId, }: WorkspaceTrayPreviewProps): import("react/jsx-runtime").JSX.Element;

package/dist/Components/WorkspaceWindow/WorkspaceTrayPreview.js

@@ -16,7 +16,7 @@ const PLACEMENT_STYLE = {
     "bottom-end": { top: "100%", right: 0, marginTop: "6px" },
     "bottom-start": { top: "100%", left: 0, marginTop: "6px" },
 };
-// Presentational, app-agnostic hover-preview (intent-safe: open delay, close grace, Escape dismisses).
+/** Hover and focus preview card with open delay, close grace and Escape dismissal. */
 function WorkspaceTrayPreview({ children, preview, enabled = true, openDelayMs = 350, closeDelayMs = 200, placement = "top-end", onOpenChange, width = "340px", testId = "workspace-tray-preview", }) {
     const theme = (0, useCustomTheme_1.useCustomTheme)();
     const cardId = (0, react_1.useId)();

package/dist/Components/WorkspaceWindow/WorkspaceWindow.d.ts

@@ -1,3 +1,5 @@
 import type { WorkspaceTrayProps, WorkspaceWindowProps } from "./WorkspaceWindowProps";
+/** Floating Jira-style workspace window; headless, so the parent owns its `state`. */
 export default function WorkspaceWindow({ title, state, children, onMinimize, onClose, onOpenFullPage, onOverlayClick, headerActions, labels, finalFocusRef, testId, }: WorkspaceWindowProps): import("react/jsx-runtime").JSX.Element | null;
+/** Row of minimized-window pills, portalled above modals. */
 export declare function WorkspaceTray({ items, onRestore, onClose, testId, placement, offset, closeLabel, dirtyLabel, label, renderItem, }: WorkspaceTrayProps): import("react/jsx-runtime").JSX.Element | null;

package/dist/Components/WorkspaceWindow/WorkspaceWindow.js

@@ -24,7 +24,7 @@ const WindowTitle = ({ testId, color, children }) => {
     }, [setHeaderMounted]);
     return ((0, jsx_runtime_1.jsx)(react_1.Text, { id: headerId, fontSize: "sm", fontWeight: 600, color: color, noOfLines: 1, "data-testid": `${testId}-title`, children: children }));
 };
-// Presentational floating "workspace window" (Jira-style dialog), headless — the parent owns window state.
+/** Floating Jira-style workspace window; headless, so the parent owns its `state`. */
 function WorkspaceWindow({ title, state, children, onMinimize, onClose, onOpenFullPage, onOverlayClick, headerActions, labels, finalFocusRef, testId = "workspace-window", }) {
     var _a, _b, _c;
     // Must run before the early return: a minimized render would otherwise skip the hook
@@ -44,6 +44,7 @@ function WorkspaceWindow({ title, state, children, onMinimize, onClose, onOpenFu
                 }, "data-testid": `${testId}-backdrop`, children: (0, jsx_runtime_1.jsxs)(react_1.Box, { bg: theme.colors.surfaceRaised, borderRadius: "xl", boxShadow: "2xl", overflow: "hidden", w: "100%", maxW: size.maxW, h: size.h, display: "flex", flexDirection: "column", "data-testid": testId, "data-window-state": state, children: [(0, jsx_runtime_1.jsxs)(react_1.Flex, { align: "center", justify: "space-between", px: 3, py: 2, borderBottomWidth: "1px", borderColor: (0, surfaceRaised_1.raisedRule)(theme.colors), bg: (0, planeStep_1.bandOn)(theme.colors.background[100], theme.colors.surfaceRaised), flexShrink: 0, children: [(0, jsx_runtime_1.jsx)(WindowTitle, { testId: testId, color: theme.colors.text[700], children: title }), (0, jsx_runtime_1.jsxs)(react_1.HStack, { spacing: 1, children: [headerActions, onOpenFullPage ? ((0, jsx_runtime_1.jsx)(react_1.IconButton, { "aria-label": (_a = labels === null || labels === void 0 ? void 0 : labels.openFullPage) !== null && _a !== void 0 ? _a : "Open full page", size: "xs", variant: "ghost", icon: (0, jsx_runtime_1.jsx)(lucide_react_1.ExternalLink, { size: 14 }), onClick: onOpenFullPage, "data-testid": `${testId}-fullpage` })) : null, onMinimize ? ((0, jsx_runtime_1.jsx)(react_1.IconButton, { "aria-label": (_b = labels === null || labels === void 0 ? void 0 : labels.minimize) !== null && _b !== void 0 ? _b : "Minimize", size: "xs", variant: "ghost", icon: (0, jsx_runtime_1.jsx)(lucide_react_1.Minus, { size: 15 }), onClick: onMinimize, "data-testid": `${testId}-minimize` })) : null, onClose ? ((0, jsx_runtime_1.jsx)(react_1.IconButton, { "aria-label": (_c = labels === null || labels === void 0 ? void 0 : labels.close) !== null && _c !== void 0 ? _c : "Close", size: "xs", variant: "ghost", colorScheme: "red", icon: (0, jsx_runtime_1.jsx)(lucide_react_1.X, { size: 15 }), onClick: onClose, "data-testid": `${testId}-close` })) : null] })] }), (0, jsx_runtime_1.jsx)(react_1.Box, { flex: "1", overflow: "auto", px: { base: 3, md: 5 }, py: 4, children: children })] }) })] }));
 }
 const cssLength = (value) => (typeof value === "number" ? `${value}px` : value);
+/** Row of minimized-window pills, portalled above modals. */
 // Portalled above modal overlays; aria-live keeps Chakra's modal aria-hidden off it, data-no-focus-lock keeps the focus trap off it.
 function WorkspaceTray({ items, onRestore, onClose, testId = "workspace-tray", placement = "bottom-end", offset, closeLabel, dirtyLabel = "Unsaved changes", label = "Minimized windows", renderItem, }) {
     var _a, _b;