@pantheon-systems/pds-toolkit-react 2.0.0-alpha.25 → 2.0.0-alpha.27

package/dist/components/SortableList/SortableList.d.ts

@@ -0,0 +1,8 @@
+import React from 'react';
+import type { SortableListProps } from './types';
+import './sortable-list.css';
+export interface SortableListHandle {
+    /** Reverts the list to the order it was in when drag mode was last enabled. */
+    resetToSnapshot: () => void;
+}
+export declare const SortableList: React.ForwardRefExoticComponent<SortableListProps & React.RefAttributes<SortableListHandle>>;

package/dist/components/SortableList/SortableListHeader.d.ts

@@ -0,0 +1,7 @@
+import type { SortableListColumn, SortableListHeaderProps } from './types';
+import './sortable-list.css';
+interface SortableListHeaderInternalProps {
+    columns?: SortableListColumn[];
+}
+export declare const SortableListHeader: ({ children, className, columns, ...props }: SortableListHeaderProps & SortableListHeaderInternalProps) => import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/components/SortableList/SortableRow.d.ts

@@ -0,0 +1,16 @@
+import type { SortableListColumn, SortableRowProps } from './types';
+import './sortable-list.css';
+interface SortableRowInternalProps {
+    columns?: SortableListColumn[];
+    depth?: number;
+    hasChildren?: boolean;
+    isDragActive?: boolean;
+    isDragging?: boolean;
+    isDropTarget?: boolean;
+    isExpanded?: boolean;
+    isProjectedParent?: boolean;
+    onToggleExpand?: () => void;
+    projectedDepthDelta?: number;
+}
+export declare const SortableRow: ({ children, className, columns, depth, hasChildren, id, isDragActive, isDragging: _isDraggingProp, isDropTarget, isExpanded, isLocked, isProjectedParent, onToggleExpand, projectedDepthDelta, ...props }: SortableRowProps & SortableRowInternalProps) => import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/components/SortableList/sortable-utils.d.ts

@@ -0,0 +1,19 @@
+import type { FlattenedNode, SortableTreeNode } from './types';
+/**
+ * Flatten a tree into a list suitable for dnd-kit's SortableContext.
+ * Only includes nodes whose ancestors are all expanded.
+ */
+export declare function flattenTree(items: SortableTreeNode[], expandedIds: Set<string>, parentId?: string | null, depth?: number, ancestorIds?: string[]): FlattenedNode[];
+/**
+ * Rebuild a tree from a flat list of nodes.
+ */
+export declare function buildTree(flatNodes: FlattenedNode[]): SortableTreeNode[];
+/**
+ * Find a node by id in a tree.
+ */
+export declare function findItem(items: SortableTreeNode[], id: string): SortableTreeNode | undefined;
+/**
+ * Calculate the projected depth during a drag based on horizontal pointer offset.
+ * Returns the clamped depth the item would land at if dropped.
+ */
+export declare function getProjectedDepth(flatNodes: FlattenedNode[], activeId: string, overId: string, dragOffsetX: number, indentSize: number, maxDepth: number, activeNodeDepth?: number): number;

package/dist/components/SortableList/types.d.ts

@@ -0,0 +1,142 @@
+import { ComponentPropsWithoutRef, ReactNode } from 'react';
+export interface SortableTreeNode {
+    [key: string]: unknown;
+    children?: SortableTreeNode[];
+    id: string;
+}
+export interface FlattenedNode {
+    ancestorIds: string[];
+    data: SortableTreeNode;
+    depth: number;
+    hasChildren: boolean;
+    id: string;
+    index: number;
+    isExpanded: boolean;
+    parentId: string | null;
+}
+export interface SortableListColumn {
+    /**
+     * Unique identifier for this column. Used as the slot name in SortableRow.
+     */
+    id: string;
+    /**
+     * Display label for the column header. Also used as the visually-hidden
+     * label for screen readers inside each row cell.
+     */
+    label: string;
+    /**
+     * CSS width value for the column (e.g., '1fr', '10rem', '150px').
+     */
+    width: string;
+}
+export type ReorderMode = 'always' | 'toggle' | 'disabled';
+export interface SortableRowMeta {
+    depth: number;
+    hasChildren: boolean;
+    index: number;
+    isDragging: boolean;
+    isExpanded: boolean;
+    isLocked: boolean;
+    toggleExpand: () => void;
+}
+export interface SortableListProps extends ComponentPropsWithoutRef<'div'> {
+    /**
+     * Content for the header area. Typically a SortableListHeader.
+     */
+    children?: ReactNode;
+    /**
+     * Additional class names.
+     */
+    className?: string;
+    /**
+     * Column definitions for grid-based layout. Defines widths, labels,
+     * and slot names used by both the header and row content areas.
+     * When omitted, the row content area uses a plain flex layout.
+     */
+    columns?: SortableListColumn[];
+    /**
+     * Initial tree data (uncontrolled mode).
+     */
+    defaultItems?: SortableTreeNode[];
+    /**
+     * Function to extract a human-readable label from an item for screen reader
+     * announcements (e.g. "Picked up Home page. Position 1 of 5."). Defaults to
+     * using the item's id.
+     */
+    getItemLabel?: (item: SortableTreeNode) => string;
+    /**
+     * Whether drag is currently enabled. Only relevant when reorderMode='toggle'.
+     * Controlled externally (e.g., by a UtilityBar lock/unlock button).
+     */
+    isDragEnabled?: boolean;
+    /**
+     * Function that returns true for items whose position should be fixed.
+     * Locked items cannot be dragged and cannot be displaced by other items
+     * moving around them. Use this for items that must always remain at the
+     * top or bottom of the list (e.g. a Home page that is always first).
+     * Does not prevent other items from being nested inside the locked item —
+     * use isNestingLocked for that.
+     */
+    isItemLocked?: (item: SortableTreeNode) => boolean;
+    /**
+     * Function that returns true for items that should not accept nested
+     * children. Items matching this function can still be moved to a new
+     * position; they just cannot be used as a parent during drag-and-drop.
+     */
+    isNestingLocked?: (item: SortableTreeNode) => boolean;
+    /**
+     * Tree-structured data (controlled mode).
+     */
+    items?: SortableTreeNode[];
+    /**
+     * Maximum nesting depth allowed. 0 = flat list, no nesting.
+     */
+    maxDepth?: 0 | 1 | 2 | 3 | 4 | 5;
+    /**
+     * Callback when items are reordered. Receives the new tree structure.
+     */
+    onReorder?: (items: SortableTreeNode[]) => void;
+    /**
+     * Render function for each row. Receives the item data and tree metadata.
+     */
+    renderRow: (item: SortableTreeNode, meta: SortableRowMeta) => ReactNode;
+    /**
+     * Controls drag-and-drop availability.
+     * - 'always': drag handles always visible (default).
+     * - 'toggle': drag state controlled externally via isDragEnabled prop.
+     * - 'disabled': no dragging, no handles, read-only list.
+     */
+    reorderMode?: ReorderMode;
+    /**
+     * Custom screen reader instructions for drag operations.
+     */
+    screenReaderInstructions?: string;
+}
+export interface SortableRowProps extends ComponentPropsWithoutRef<'div'> {
+    /**
+     * Child elements — the consumer-defined row content.
+     */
+    children: ReactNode;
+    /**
+     * Additional class names.
+     */
+    className?: string;
+    /**
+     * Unique identifier for this row. Must match an item id.
+     */
+    id: string;
+    /**
+     * Prevents this row from being dragged or receiving drops.
+     */
+    isLocked?: boolean;
+}
+export interface SortableListHeaderProps extends ComponentPropsWithoutRef<'div'> {
+    /**
+     * Child elements assigned to named slots.
+     */
+    children?: ReactNode;
+    /**
+     * Additional class names.
+     */
+    className?: string;
+}

package/dist/components/SortableList/useSortableTree.d.ts

@@ -0,0 +1,18 @@
+import type { FlattenedNode, SortableTreeNode } from './types';
+interface UseSortableTreeOptions {
+    defaultItems?: SortableTreeNode[];
+    isDragEnabled?: boolean;
+    items?: SortableTreeNode[];
+    onReorder?: (items: SortableTreeNode[]) => void;
+}
+export declare function useSortableTree({ defaultItems, isDragEnabled, items: controlledItems, onReorder, }: UseSortableTreeOptions): {
+    currentItems: SortableTreeNode[];
+    expandedIds: Set<string>;
+    expandItem: (id: string) => void;
+    flatNodes: FlattenedNode[];
+    handleReorder: (updatedFlat: FlattenedNode[]) => void;
+    resetToSnapshot: () => void;
+    sortableIds: string[];
+    toggleExpand: (id: string) => void;
+};
+export {};

package/dist/components/Tooltip/Tooltip.d.ts

@@ -34,7 +34,7 @@ interface TooltipProps extends ComponentPropsWithoutRef<'div'> {
     /**
      * Icon to trigger tooltip
      */
-    triggerIcon?: 'circleInfo' | 'circleQuestion' | 'circleExclamation';
+    triggerIcon?: 'circleExclamation' | 'circleExclamationSolid' | 'circleInfo' | 'circleInfoSolid' | 'circleQuestion' | 'circleQuestionSolid';
     /**
      * Color of the trigger icon. Uses PDS default text color options.
      */
@@ -42,7 +42,7 @@ interface TooltipProps extends ComponentPropsWithoutRef<'div'> {
     /**
      * Size of the trigger icon. Uses PDS Icon sizing.
      */
-    triggerIconSize?: 's' | 'm' | 'l';
+    triggerIconSize?: 'xs' | 's' | 'm' | 'l';
     /**
      * Z-index value for the tooltip container. In most cases, the default value should be retained.
      */

package/dist/components/UtilityBar/UtilityBar.d.ts

@@ -0,0 +1,27 @@
+import { ComponentPropsWithoutRef, ReactNode } from 'react';
+import { GridGapOptions } from '../../libs/types/layout-types';
+import './utility-bar.css';
+type UtilityBarBackground = 'default' | 'default-secondary' | 'transparent';
+type UtilityBarPadding = GridGapOptions | 'none';
+export interface UtilityBarProps extends ComponentPropsWithoutRef<'div'> {
+    /**
+     * Background color of the utility bar.
+     */
+    backgroundColor?: UtilityBarBackground;
+    /**
+     * Child elements assigned to named slots.
+     * - `items-left` — left-side content (e.g. search input)
+     * - `items-right` — right-side controls (e.g. icon buttons)
+     */
+    children: ReactNode;
+    /**
+     * Additional class names.
+     */
+    className?: string;
+    /**
+     * Internal padding. Defaults to 'none'.
+     */
+    padding?: UtilityBarPadding;
+}
+export declare const UtilityBar: ({ backgroundColor, children, className, padding, ...props }: UtilityBarProps) => import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/components/buttons/IconButton/IconButton.d.ts

@@ -36,10 +36,18 @@ interface IconButtonProps extends ComponentPropsWithoutRef<'button'> {
      * Which icon to render.
      */
     iconName: PDSIcon;
+    /**
+     * Whether the button is in a pressed/active toggle state. Maps to aria-pressed.
+     */
+    isPressed?: boolean;
     /**
      * Click event handler callback.
      */
     onClick?: (e: MouseEvent<HTMLElement>) => void;
+    /**
+     * Icon to display when isPressed is true. When not set, iconName is used in both states.
+     */
+    pressedIconName?: PDSIcon;
     /**
      * Which size of button to render.
      */

package/dist/components/icons/Icon/generated-icon-data.d.ts

@@ -3,7 +3,7 @@
  *
  * Generated by: npm run generate:icon-data
  * Source: icon-registry.ts + Font Awesome packages + custom-icons.tsx
- * Generated: 2026-05-17T18:14:17.010Z
+ * Generated: 2026-05-28T21:43:58.268Z
  */
 import { customIcons } from './custom-icons';
 export { customIcons };
@@ -50,6 +50,13 @@ export declare const iconData: {
         readonly svgPathData: "M175.5 143c9.4-9.4 24.6-9.4 33.9 0l160 160c9.4 9.4 9.4 24.6 0 33.9s-24.6 9.4-33.9 0l-143-143-143 143c-9.4 9.4-24.6 9.4-33.9 0s-9.4-24.6 0-33.9l160-160z";
         readonly width: 384;
     };
+    readonly arrowDownLeftAndArrowUpRightToCenter: {
+        readonly aliases: readonly ["collapse", "minimize", "compress"];
+        readonly categories: readonly ["actions", "arrows"];
+        readonly height: 512;
+        readonly svgPathData: "M502.6 54.6c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0L336 130.7 336 80c0-17.7-14.3-32-32-32s-32 14.3-32 32l0 128c0 17.7 14.3 32 32 32l128 0c17.7 0 32-14.3 32-32s-14.3-32-32-32l-50.7 0 121.4-121.4zM80 272c-17.7 0-32 14.3-32 32s14.3 32 32 32l50.7 0-121.4 121.4c-12.5 12.5-12.5 32.8 0 45.3s32.8 12.5 45.3 0L176 381.3 176 432c0 17.7 14.3 32 32 32s32-14.3 32-32l0-128c0-17.7-14.3-32-32-32L80 272z";
+        readonly width: 512;
+    };
     readonly arrowDownToLine: {
         readonly aliases: readonly ["download", "save to"];
         readonly categories: readonly ["actions", "arrows"];
@@ -78,6 +85,13 @@ export declare const iconData: {
         readonly svgPathData: "M463 473c9.4 9.4 24.6 9.4 33.9 0l72-72c9.4-9.4 9.4-24.6 0-33.9s-24.6-9.4-33.9 0l-31 31 0-270.1c0-53-43-96-96-96L280 32c-13.3 0-24 10.7-24 24s10.7 24 24 24l128 0c26.5 0 48 21.5 48 48l0 270.1-31-31c-9.4-9.4-24.6-9.4-33.9 0s-9.4 24.6 0 33.9l72 72zM113 39c-9.4-9.4-24.6-9.4-33.9 0L7 111c-9.4 9.4-9.4 24.6 0 33.9s24.6 9.4 33.9 0l31-31 0 270.1c0 53 43 96 96 96l128 0c13.3 0 24-10.7 24-24s-10.7-24-24-24l-128 0c-26.5 0-48-21.5-48-48l0-270.1 31 31c9.4 9.4 24.6 9.4 33.9 0s9.4-24.6 0-33.9L113 39z";
         readonly width: 576;
     };
+    readonly arrowsUpDownLeftRight: {
+        readonly aliases: readonly ["move", "reorder", "drag", "rearrange"];
+        readonly categories: readonly ["actions", "arrows"];
+        readonly height: 512;
+        readonly svgPathData: "M273.5 7c-9.4-9.4-24.6-9.4-33.9 0l-72 72c-9.4 9.4-9.4 24.6 0 33.9s24.6 9.4 33.9 0l31-31 0 150.1-150.1 0 31-31c9.4-9.4 9.4-24.6 0-33.9s-24.6-9.4-33.9 0l-72 72c-9.4 9.4-9.4 24.6 0 33.9l72 72c9.4 9.4 24.6 9.4 33.9 0s9.4-24.6 0-33.9l-31-31 150.1 0 0 150.1-31-31c-9.4-9.4-24.6-9.4-33.9 0s-9.4 24.6 0 33.9l72 72c9.4 9.4 24.6 9.4 33.9 0l72-72c9.4-9.4 9.4-24.6 0-33.9s-24.6-9.4-33.9 0l-31 31 0-150.1 150.1 0-31 31c-9.4 9.4-9.4 24.6 0 33.9s24.6 9.4 33.9 0l72-72c9.4-9.4 9.4-24.6 0-33.9l-72-72c-9.4-9.4-24.6-9.4-33.9 0s-9.4 24.6 0 33.9l31 31-150.1 0 0-150.1 31 31c9.4 9.4 24.6 9.4 33.9 0s9.4-24.6 0-33.9l-72-72z";
+        readonly width: 512;
+    };
     readonly asterisk: {
         readonly aliases: readonly ["required", "star"];
         readonly categories: readonly ["objects"];
@@ -106,6 +120,13 @@ export declare const iconData: {
         readonly svgPathData: "M0 88C0 74.7 10.7 64 24 64l464 0c13.3 0 24 10.7 24 24s-10.7 24-24 24L24 112C10.7 112 0 101.3 0 88zM96 256c0-13.3 10.7-24 24-24l272 0c13.3 0 24 10.7 24 24s-10.7 24-24 24l-272 0c-13.3 0-24-10.7-24-24zM320 424c0 13.3-10.7 24-24 24l-80 0c-13.3 0-24-10.7-24-24s10.7-24 24-24l80 0c13.3 0 24 10.7 24 24z";
         readonly width: 512;
     };
+    readonly barsStaggered: {
+        readonly aliases: readonly ["stagger", "indent", "hierarchy", "reorder"];
+        readonly categories: readonly ["actions", "navigation"];
+        readonly height: 512;
+        readonly svgPathData: "M0 88C0 74.7 10.7 64 24 64l400 0c13.3 0 24 10.7 24 24s-10.7 24-24 24L24 112C10.7 112 0 101.3 0 88zM64 256c0-13.3 10.7-24 24-24l400 0c13.3 0 24 10.7 24 24s-10.7 24-24 24L88 280c-13.3 0-24-10.7-24-24zM448 424c0 13.3-10.7 24-24 24L24 448c-13.3 0-24-10.7-24-24s10.7-24 24-24l400 0c13.3 0 24 10.7 24 24z";
+        readonly width: 512;
+    };
     readonly bell: {
         readonly aliases: readonly ["notification", "alert", "reminder"];
         readonly categories: readonly ["communication", "status"];
@@ -351,6 +372,13 @@ export declare const iconData: {
         readonly svgPathData: "M256 512a256 256 0 1 1 0-512 256 256 0 1 1 0 512zm0-464a208 208 0 1 0 0 416 208 208 0 1 0 0-416zm0 336a32 32 0 1 1 0-64 32 32 0 1 1 0 64zm0-256c18.2 0 32.7 15.5 31.4 33.7l-7.4 104c-.9 12.6-11.4 22.3-23.9 22.3-12.6 0-23-9.7-23.9-22.3l-7.4-104C223.3 143.5 237.8 128 256 128z";
         readonly width: 512;
     };
+    readonly circleExclamationSolid: {
+        readonly aliases: readonly ["warning", "error", "alert"];
+        readonly categories: readonly ["status"];
+        readonly height: 512;
+        readonly svgPathData: "M256 512a256 256 0 1 1 0-512 256 256 0 1 1 0 512zm0-192a32 32 0 1 0 0 64 32 32 0 1 0 0-64zm0-192c-18.2 0-32.7 15.5-31.4 33.7l7.4 104c.9 12.6 11.4 22.3 23.9 22.3 12.6 0 23-9.7 23.9-22.3l7.4-104c1.3-18.2-13.1-33.7-31.4-33.7z";
+        readonly width: 512;
+    };
     readonly circleInfo: {
         readonly aliases: readonly ["info", "information", "about"];
         readonly categories: readonly ["status"];
@@ -358,6 +386,13 @@ export declare const iconData: {
         readonly svgPathData: "M256 48a208 208 0 1 1 0 416 208 208 0 1 1 0-416zm0 464a256 256 0 1 0 0-512 256 256 0 1 0 0 512zM216 336c-13.3 0-24 10.7-24 24s10.7 24 24 24l80 0c13.3 0 24-10.7 24-24s-10.7-24-24-24l-8 0 0-88c0-13.3-10.7-24-24-24l-48 0c-13.3 0-24 10.7-24 24s10.7 24 24 24l24 0 0 64-24 0zm40-144a32 32 0 1 0 0-64 32 32 0 1 0 0 64z";
         readonly width: 512;
     };
+    readonly circleInfoSolid: {
+        readonly aliases: readonly ["info", "information", "about"];
+        readonly categories: readonly ["status"];
+        readonly height: 512;
+        readonly svgPathData: "M256 512a256 256 0 1 0 0-512 256 256 0 1 0 0 512zM224 160a32 32 0 1 1 64 0 32 32 0 1 1 -64 0zm-8 64l48 0c13.3 0 24 10.7 24 24l0 88 8 0c13.3 0 24 10.7 24 24s-10.7 24-24 24l-80 0c-13.3 0-24-10.7-24-24s10.7-24 24-24l24 0 0-64-24 0c-13.3 0-24-10.7-24-24s10.7-24 24-24z";
+        readonly width: 512;
+    };
     readonly circleMinus: {
         readonly aliases: readonly ["remove", "subtract"];
         readonly categories: readonly ["status"];
@@ -386,6 +421,13 @@ export declare const iconData: {
         readonly svgPathData: "M464 256a208 208 0 1 0 -416 0 208 208 0 1 0 416 0zM0 256a256 256 0 1 1 512 0 256 256 0 1 1 -512 0zm256-80c-17.7 0-32 14.3-32 32 0 13.3-10.7 24-24 24s-24-10.7-24-24c0-44.2 35.8-80 80-80s80 35.8 80 80c0 47.2-36 67.2-56 74.5l0 3.8c0 13.3-10.7 24-24 24s-24-10.7-24-24l0-8.1c0-20.5 14.8-35.2 30.1-40.2 6.4-2.1 13.2-5.5 18.2-10.3 4.3-4.2 7.7-10 7.7-19.6 0-17.7-14.3-32-32-32zM224 368a32 32 0 1 1 64 0 32 32 0 1 1 -64 0z";
         readonly width: 512;
     };
+    readonly circleQuestionSolid: {
+        readonly aliases: readonly ["help", "faq", "support"];
+        readonly categories: readonly ["status"];
+        readonly height: 512;
+        readonly svgPathData: "M256 512a256 256 0 1 0 0-512 256 256 0 1 0 0 512zm0-336c-17.7 0-32 14.3-32 32 0 13.3-10.7 24-24 24s-24-10.7-24-24c0-44.2 35.8-80 80-80s80 35.8 80 80c0 47.2-36 67.2-56 74.5l0 3.8c0 13.3-10.7 24-24 24s-24-10.7-24-24l0-8.1c0-20.5 14.8-35.2 30.1-40.2 6.4-2.1 13.2-5.5 18.2-10.3 4.3-4.2 7.7-10 7.7-19.6 0-17.7-14.3-32-32-32zM224 368a32 32 0 1 1 64 0 32 32 0 1 1 -64 0z";
+        readonly width: 512;
+    };
     readonly circleUser: {
         readonly aliases: readonly ["avatar", "profile", "account"];
         readonly categories: readonly ["users"];
@@ -463,6 +505,13 @@ export declare const iconData: {
         readonly svgPathData: "M51.9 384.9C19.3 344.6 0 294.4 0 240 0 107.5 114.6 0 256 0S512 107.5 512 240 397.4 480 256 480c-36.5 0-71.2-7.2-102.6-20L37 509.9c-3.7 1.6-7.5 2.1-11.5 2.1-14.1 0-25.5-11.4-25.5-25.5 0-4.3 1.1-8.5 3.1-12.2l48.8-89.4zm37.3-30.2c12.2 15.1 14.1 36.1 4.8 53.2l-18 33.1 58.5-25.1c11.8-5.1 25.2-5.2 37.1-.3 25.7 10.5 54.2 16.4 84.3 16.4 117.8 0 208-88.8 208-192S373.8 48 256 48 48 136.8 48 240c0 42.8 15.1 82.4 41.2 114.7z";
         readonly width: 512;
     };
+    readonly compress: {
+        readonly aliases: readonly ["fullscreen exit", "minimize", "shrink"];
+        readonly categories: readonly ["actions"];
+        readonly height: 512;
+        readonly svgPathData: "M160 56c0-13.3-10.7-24-24-24s-24 10.7-24 24l0 88-88 0c-13.3 0-24 10.7-24 24s10.7 24 24 24l112 0c13.3 0 24-10.7 24-24l0-112zM24 320c-13.3 0-24 10.7-24 24s10.7 24 24 24l88 0 0 88c0 13.3 10.7 24 24 24s24-10.7 24-24l0-112c0-13.3-10.7-24-24-24L24 320zM336 56c0-13.3-10.7-24-24-24s-24 10.7-24 24l0 112c0 13.3 10.7 24 24 24l112 0c13.3 0 24-10.7 24-24s-10.7-24-24-24l-88 0 0-88zM312 320c-13.3 0-24 10.7-24 24l0 112c0 13.3 10.7 24 24 24s24-10.7 24-24l0-88 88 0c13.3 0 24-10.7 24-24s-10.7-24-24-24l-112 0z";
+        readonly width: 448;
+    };
     readonly copy: {
         readonly aliases: readonly ["duplicate", "clipboard", "paste"];
         readonly categories: readonly ["actions"];
@@ -1444,7 +1493,7 @@ export declare const iconData: {
         readonly width: 576;
     };
 };
-export declare const iconList: readonly ["angleDown", "angleLeft", "angleRight", "anglesLeft", "anglesRight", "angleUp", "arrowDownToLine", "arrowLeft", "arrowRight", "arrowsRetweet", "asterisk", "banBug", "bars", "barsFilter", "bell", "billboard", "bitbucket", "bluesky", "bolt", "boltPantheon", "boltSolid", "book", "books", "bracketRight", "bracketsSquare", "brainCircuit", "broomWide", "building", "buildings", "bullhorn", "calendarDays", "caretDown", "caretLeft", "caretRight", "caretUp", "ccAmex", "ccApplePay", "ccDiscover", "ccGeneric", "ccMC", "ccPaypal", "ccVisa", "chartLine", "chartNetwork", "chartSimple", "check", "circle", "circleCheck", "circleExclamation", "circleInfo", "circleMinus", "circleNotch", "circlePlus", "circleQuestion", "circleUser", "circleXmark", "cloud", "cloudArrowDown", "cloudArrowUp", "cloudPlus", "code", "codeBranch", "codeMerge", "command", "comment", "copy", "desktop", "diamondExclamation", "diamonds4", "discourse", "display", "dollarSign", "download", "drupal", "ellipsis", "ellipsisVertical", "emptySet", "envelope", "envelopeOpen", "exclamation", "expand", "expandFromCenter", "externalLink", "eye", "eyeSlash", "facebook", "file", "fileCheck", "fileContract", "fileCSV", "fileDiff", "fileExport", "fileImport", "fileLines", "filePDF", "fileZip", "folder", "folderTree", "gear", "gem", "github", "gitlab", "globe", "graduationCap", "grid", "gripDots", "gripDotsVertical", "heart", "heartSolid", "house", "idCard", "image", "inputText", "instagram", "keySkeleton", "landmark", "laptop", "laptopCode", "leaf", "lifeRing", "linkedin", "linkSimple", "linkSimpleSlash", "listCheck", "locationCrosshairs", "lock", "lockOpen", "magnifyingGlass", "medal", "memo", "messages", "minus", "moon", "nextJs", "paperclip", "paperPlane", "pause", "pen", "penField", "phone", "play", "plus", "question", "quotesLeft", "quotesRight", "rectangleList", "reply", "robot", "rocketLaunch", "rotate", "rotateClock", "rotateLeft", "rotateRight", "rss", "save", "server", "shareNodes", "shield", "shieldQuartered", "shovel", "sidebar", "siren", "sirenOn", "sitemap", "slack", "slashForward", "slidersSimple", "snowflake", "sparkles", "squareCheck", "squareCode", "squareMinus", "squarePen", "squareQuestion", "squareTerminal", "star", "starSolid", "sun", "sunBright", "table", "tableRows", "terminal", "text", "threads", "thumbsDown", "thumbsUp", "trash", "triangleExclamation", "twitter", "upload", "user", "userAstronaut", "userGear", "userPlus", "users", "video", "wavePulse", "windowRestore", "wordpress", "wreathLaurel", "wrench", "xmark", "xmarkLarge", "xTwitter", "youtube"];
+export declare const iconList: readonly ["angleDown", "angleLeft", "angleRight", "anglesLeft", "anglesRight", "angleUp", "arrowDownLeftAndArrowUpRightToCenter", "arrowDownToLine", "arrowLeft", "arrowRight", "arrowsRetweet", "arrowsUpDownLeftRight", "asterisk", "banBug", "bars", "barsFilter", "barsStaggered", "bell", "billboard", "bitbucket", "bluesky", "bolt", "boltPantheon", "boltSolid", "book", "books", "bracketRight", "bracketsSquare", "brainCircuit", "broomWide", "building", "buildings", "bullhorn", "calendarDays", "caretDown", "caretLeft", "caretRight", "caretUp", "ccAmex", "ccApplePay", "ccDiscover", "ccGeneric", "ccMC", "ccPaypal", "ccVisa", "chartLine", "chartNetwork", "chartSimple", "check", "circle", "circleCheck", "circleExclamation", "circleExclamationSolid", "circleInfo", "circleInfoSolid", "circleMinus", "circleNotch", "circlePlus", "circleQuestion", "circleQuestionSolid", "circleUser", "circleXmark", "cloud", "cloudArrowDown", "cloudArrowUp", "cloudPlus", "code", "codeBranch", "codeMerge", "command", "comment", "compress", "copy", "desktop", "diamondExclamation", "diamonds4", "discourse", "display", "dollarSign", "download", "drupal", "ellipsis", "ellipsisVertical", "emptySet", "envelope", "envelopeOpen", "exclamation", "expand", "expandFromCenter", "externalLink", "eye", "eyeSlash", "facebook", "file", "fileCheck", "fileContract", "fileCSV", "fileDiff", "fileExport", "fileImport", "fileLines", "filePDF", "fileZip", "folder", "folderTree", "gear", "gem", "github", "gitlab", "globe", "graduationCap", "grid", "gripDots", "gripDotsVertical", "heart", "heartSolid", "house", "idCard", "image", "inputText", "instagram", "keySkeleton", "landmark", "laptop", "laptopCode", "leaf", "lifeRing", "linkedin", "linkSimple", "linkSimpleSlash", "listCheck", "locationCrosshairs", "lock", "lockOpen", "magnifyingGlass", "medal", "memo", "messages", "minus", "moon", "nextJs", "paperclip", "paperPlane", "pause", "pen", "penField", "phone", "play", "plus", "question", "quotesLeft", "quotesRight", "rectangleList", "reply", "robot", "rocketLaunch", "rotate", "rotateClock", "rotateLeft", "rotateRight", "rss", "save", "server", "shareNodes", "shield", "shieldQuartered", "shovel", "sidebar", "siren", "sirenOn", "sitemap", "slack", "slashForward", "slidersSimple", "snowflake", "sparkles", "squareCheck", "squareCode", "squareMinus", "squarePen", "squareQuestion", "squareTerminal", "star", "starSolid", "sun", "sunBright", "table", "tableRows", "terminal", "text", "threads", "thumbsDown", "thumbsUp", "trash", "triangleExclamation", "twitter", "upload", "user", "userAstronaut", "userGear", "userPlus", "users", "video", "wavePulse", "windowRestore", "wordpress", "wreathLaurel", "wrench", "xmark", "xmarkLarge", "xTwitter", "youtube"];
 export type PDSIconName = (typeof iconList)[number];
 export declare const categoryList: readonly ["actions", "arrows", "brands", "communication", "custom", "data", "development", "documents", "financial", "media", "navigation", "objects", "security", "status", "users"];
 export type IconCategory = (typeof categoryList)[number];

package/dist/components/inputs/Checkbox/Checkbox.d.ts

@@ -34,7 +34,7 @@ export interface CheckboxProps extends ComponentPropsWithoutRef<'div'> {
      */
     inputProps?: ComponentPropsWithoutRef<'input'>;
     /**
-     * Max-width of the input field. Accepts a number in pixels. Leave blank for width: 100%.
+     * Width of the input field in pixels. When omitted, the input fills its container.
      */
     inputWidth?: number;
     /**

package/dist/components/inputs/Combobox/Combobox.d.ts

@@ -57,7 +57,7 @@ export interface ComboboxProps extends Omit<ComponentPropsWithoutRef<'div'>, 'on
      */
     id: string;
     /**
-     * Max-width of the input field. Accepts a number in pixels. Leave blank for width: 100%.
+     * Width of the input field in pixels. When omitted, the input fills its container.
      */
     inputWidth?: number;
     /**

package/dist/components/inputs/ComboboxMultiselect/ComboboxMultiselect.d.ts

@@ -51,7 +51,7 @@ export interface ComboboxMultiselectProps extends DivProps {
      */
     initialSelectedItems?: OptionProps[];
     /**
-     * Max-width of the input field. Accepts a number in pixels. Leave blank for width: 100%.
+     * Width of the input field in pixels. When omitted, the input fills its container.
      */
     inputWidth?: number;
     /**

package/dist/components/inputs/Datepicker/Datepicker.d.ts

@@ -44,7 +44,7 @@ export interface DatepickerProps extends DatepickerHTMLProps {
      */
     id: string;
     /**
-     * Max-width of the input field. Accepts a number in pixels.
+     * Width of the input field in pixels. When omitted, the input fills its container.
      * Numbers below 160 will display at 160px.
      * Leave blank for width: 100%.
      */

package/dist/components/inputs/FileUpload/FileUpload.d.ts

@@ -39,7 +39,7 @@ export interface FileUploadProps extends ComponentPropsWithoutRef<'div'> {
      */
     inputProps?: ComponentPropsWithoutRef<'input'>;
     /**
-     * Max-width of the input field. Accepts a number in pixels. Leave blank for width: 100%.
+     * Width of the input field in pixels. When omitted, the input fills its container.
      */
     inputWidth?: number;
     /**

package/dist/components/inputs/RadioGroup/RadioGroup.d.ts

@@ -44,7 +44,7 @@ export interface RadioGroupProps extends ComponentPropsWithoutRef<'div'> {
      */
     id: string;
     /**
-     * Max-width of the input field. Accepts a number in pixels. Leave blank for width: 100%.
+     * Width of the input field in pixels. When omitted, the input fills its container.
      */
     inputWidth?: number;
     /**

package/dist/components/inputs/Select/Select.d.ts

@@ -70,7 +70,7 @@ export interface SelectProps {
      */
     id: string;
     /**
-     * Max-width of the input field. Accepts a number in pixels. Leave blank for width: 100%.
+     * Width of the input field in pixels. When omitted, the input fills its container.
      */
     inputWidth?: number;
     /**

package/dist/components/inputs/Switch/Switch.d.ts

@@ -29,7 +29,7 @@ export interface SwitchProps extends ComponentPropsWithoutRef<'div'> {
      */
     inputProps?: ComponentPropsWithoutRef<'input'>;
     /**
-     * Max-width of the input field. Accepts a number in pixels. Leave blank for width: 100%.
+     * Width of the input field in pixels. When omitted, the input fills its container.
      */
     inputWidth?: number;
     /**

package/dist/components/inputs/TagsInput/TagsInput.d.ts

@@ -15,6 +15,7 @@ export type TagType = {
     id: string;
     value: string;
 };
+export type TagsInputSize = 's' | 'm' | 'l';
 type DivProps = Omit<ComponentPropsWithoutRef<'div'>, 'onChange'>;
 /**
  * Prop types for TagsInput
@@ -41,7 +42,7 @@ export interface TagsInputProps extends DivProps {
      */
     inputMinHeight?: number;
     /**
-     * Max-width of the input field. Accepts a number in pixels. Leave blank for width: 100%.
+     * Width of the input field in pixels. When omitted, the input fills its container.
      */
     inputWidth?: number;
     /**
@@ -72,6 +73,10 @@ export interface TagsInputProps extends DivProps {
      * Should the label be visible? If false, it will render for screen readers only.
      */
     showLabel?: boolean;
+    /**
+     * Size of the input.
+     */
+    size?: TagsInputSize;
     /**
      * Tags array. The component is controlled and requires managing state externally.
      */

package/dist/components/inputs/TextInput/TextInput.d.ts

@@ -56,7 +56,7 @@ export interface TextInputProps extends ComponentPropsWithoutRef<'div'> {
      */
     inputProps?: ComponentPropsWithoutRef<'input'>;
     /**
-     * Max-width of the input field. Accepts a number in pixels. Leave blank for width: 100%.
+     * Width of the input field in pixels. When omitted, the input fills its container.
      */
     inputWidth?: number;
     /**

package/dist/components/inputs/Textarea/Textarea.d.ts

@@ -31,7 +31,7 @@ export interface TextareaProps {
      */
     id: string;
     /**
-     * Max-width of the input field. Accepts a number in pixels. Leave blank for width: 100%.
+     * Width of the input field in pixels. When omitted, the input fills its container.
      */
     inputWidth?: number;
     /**

package/dist/components/inputs/input-utilities.d.ts

@@ -11,7 +11,7 @@ export declare const inputCommonClasses: {
     readonly: string;
 };
 export declare const getInputWidthStyle: (inputWidth: number) => {
-    maxWidth: string;
+    width: string;
 };
 export declare const stripUrlProtocol: (value: string) => string;
 export declare const RequiredIcon: () => import("react/jsx-runtime").JSX.Element;

package/dist/components/overlays/FullScreenOverlay/FullScreenOverlay.d.ts

@@ -0,0 +1,45 @@
+import { ComponentPropsWithoutRef, ReactNode } from 'react';
+import { PDSIcon } from '../../icons/Icon/Icon';
+import './full-screen-overlay.css';
+export interface FullScreenOverlayProps extends ComponentPropsWithoutRef<'div'> {
+    /**
+     * Accessible label for the overlay.
+     */
+    ariaLabel: string;
+    /**
+     * Background color of the overlay surface.
+     * - 'default': white / dark-mode dark (default)
+     * - 'default-secondary': slightly off-white / dark-mode slightly lighter dark
+     */
+    background?: 'default' | 'default-secondary';
+    /**
+     * Content rendered inside the overlay.
+     */
+    children: ReactNode;
+    /**
+     * Additional class names.
+     */
+    className?: string;
+    /**
+     * Accessible label for the close button.
+     */
+    closeButtonLabel?: string;
+    /**
+     * Icon to use for the close button. Defaults to 'compress'.
+     */
+    closeIconName?: PDSIcon;
+    /**
+     * Whether to show the built-in close button. Set to false when providing
+     * your own close control (e.g. in a UtilityBar).
+     */
+    hasCloseButton?: boolean;
+    /**
+     * Whether the overlay is currently open.
+     */
+    isOpen: boolean;
+    /**
+     * Callback when the overlay should close.
+     */
+    onClose: () => void;
+}
+export declare const FullScreenOverlay: ({ ariaLabel, background, children, className, closeButtonLabel, closeIconName, hasCloseButton, isOpen, onClose, ...props }: FullScreenOverlayProps) => any;

package/dist/css/component-css/pds-checkbox.css

@@ -1 +1 @@
-.pds-checkbox{--checkbox-font-size:var(--pds-typography-size-input-label);--checkbox-input-size:1rem;--checkbox-input-gap:var(--pds-spacing-2xs);line-height:1.2}.pds-checkbox--m{--checkbox-font-size:var(--pds-typography-size-s);--checkbox-input-size:1.25rem}.pds-checkbox__input-wrapper{display:flex}.pds-checkbox input[type=checkbox]{appearance:none}.pds-checkbox__label{align-items:center;column-gap:var(--checkbox-input-gap);display:grid;grid-template-columns:var(--checkbox-input-size) auto;margin-block-end:0}.pds-checkbox__label-text{color:var(--pds-color-fg-default);font-size:var(--checkbox-font-size);font-weight:var(--pds-typography-fw-regular)}.pds-checkbox__box{align-items:center;background-color:var(--pds-color-input-background);border:var(--pds-border-width-default) solid var(--pds-color-fg-default);border-radius:var(--pds-border-radius-input);display:flex;height:var(--checkbox-input-size);padding:.0625rem;transition:var(--pds-animation-transition-default);width:var(--checkbox-input-size)}.pds-checkbox__box--checked,.pds-checkbox__box--indeterminate{background-color:var(--pds-color-bg-reverse);border-color:var(--pds-color-bg-reverse);transition:var(--pds-animation-transition-default)}.pds-checkbox__icon{color:var(--pds-color-fg-reverse);height:100%;transition:var(--pds-animation-transition-default);width:100%}.pds-checkbox:hover .pds-checkbox__box{cursor:pointer}.pds-checkbox input[type=checkbox]:focus-visible~label .pds-checkbox__box{outline:var(--pds-border-width-outline) solid var(--pds-color-interactive-focus);outline-offset:.0625rem}.pds-checkbox.pds-is-disabled .pds-checkbox__label{cursor:not-allowed;opacity:40%}.pds-checkbox.pds-has-error .pds-checkbox__box{border-color:var(--pds-color-status-critical-foreground)}.pds-checkbox.pds-has-error .pds-checkbox__label-text{color:var(--pds-color-status-critical-foreground)}.pds-checkbox .pds-input-label__required{margin-inline-start:.125rem}div.pds-checkbox-group .pds-checkbox--indent-1{margin-inline-start:calc(var(--checkbox-input-size)*2 - var(--checkbox-input-gap))}div.pds-checkbox-group .pds-checkbox--indent-2{margin-inline-start:calc(var(--checkbox-input-size)*4 - var(--checkbox-input-gap)*2)}
+.pds-checkbox{--checkbox-font-size:var(--pds-typography-size-input-label);--checkbox-input-size:1rem;--checkbox-input-gap:var(--pds-spacing-2xs);line-height:1.2}.pds-checkbox--m{--checkbox-font-size:var(--pds-typography-size-s);--checkbox-input-size:1.25rem}.pds-checkbox__input-wrapper{display:flex}.pds-checkbox input[type=checkbox]{appearance:none}.pds-checkbox__label{align-items:center;column-gap:var(--checkbox-input-gap);display:grid;grid-template-columns:var(--checkbox-input-size) auto;margin-block-end:0}.pds-checkbox__label-text{color:var(--pds-color-fg-default);font-size:var(--checkbox-font-size);font-weight:var(--pds-typography-fw-regular)}.pds-checkbox__box{align-items:center;background-color:var(--pds-color-input-background);border:var(--pds-border-width-default) solid var(--pds-color-fg-default);border-radius:var(--pds-border-radius-input);display:flex;height:var(--checkbox-input-size);padding:.0625rem;transition:var(--pds-animation-transition-default);width:var(--checkbox-input-size)}.pds-checkbox__box--checked,.pds-checkbox__box--indeterminate{background-color:var(--pds-color-input-selected-background);border-color:var(--pds-color-input-selected-background);transition:var(--pds-animation-transition-default)}.pds-checkbox__icon{color:var(--pds-color-input-selected-foreground);height:100%;transition:var(--pds-animation-transition-default);width:100%}.pds-checkbox:hover .pds-checkbox__box{cursor:pointer}.pds-checkbox input[type=checkbox]:focus-visible~label .pds-checkbox__box{outline:var(--pds-border-width-outline) solid var(--pds-color-interactive-focus);outline-offset:.0625rem}.pds-checkbox.pds-is-disabled .pds-checkbox__label{cursor:not-allowed;opacity:40%}.pds-checkbox.pds-has-error .pds-checkbox__box{border-color:var(--pds-color-status-critical-foreground)}.pds-checkbox.pds-has-error .pds-checkbox__label-text{color:var(--pds-color-status-critical-foreground)}.pds-checkbox .pds-input-label__required{margin-inline-start:.125rem}div.pds-checkbox-group .pds-checkbox--indent-1{margin-inline-start:calc(var(--checkbox-input-size)*2 - var(--checkbox-input-gap))}div.pds-checkbox-group .pds-checkbox--indent-2{margin-inline-start:calc(var(--checkbox-input-size)*4 - var(--checkbox-input-gap)*2)}