@surflane/ui 0.2.0 → 0.4.0

package/dist/data.js

@@ -1,40 +1,82 @@
 'use client';
-import { jsx as _jsx } from "react/jsx-runtime";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import * as React from 'react';
+import { Button } from './button.js';
 import { part } from './parts.js';
 import { ScrollArea } from './scroll-area.js';
-const TableContainer = React.forwardRef(function TableContainer(props, ref) {
+const TableContainer = /* @__PURE__ */ React.forwardRef(function TableContainer(props, ref) {
     return _jsx(ScrollArea, { ...props, ref: ref });
 });
-const TableRow = React.forwardRef(function TableRow({ selected, className, ...props }, ref) {
+const RootPart = /* @__PURE__ */ part('table', 'pui-table');
+const TableRoot = /* @__PURE__ */ React.forwardRef(function TableRoot({ density, stickyHeader, ...props }, ref) {
+    return (_jsx(RootPart, { ...props, ref: ref, "data-density": density === 'compact' ? 'compact' : undefined, "data-sticky-header": stickyHeader || undefined }));
+});
+const layout = ({ align, numeric }) => ({
+    'data-align': numeric ? 'end' : align,
+    'data-numeric': numeric || undefined,
+});
+const HeaderCellPart = /* @__PURE__ */ part('th', 'pui-table-cell pui-table-header');
+const CellPart = /* @__PURE__ */ part('td', 'pui-table-cell');
+// align replaces the obsolete HTML align attribute of th and td.
+const TableHeaderCell = /* @__PURE__ */ React.forwardRef(function TableHeaderCell({ align, numeric, ...props }, ref) {
+    return _jsx(HeaderCellPart, { ...props, ...layout({ align, numeric }), ref: ref });
+});
+const TableCell = /* @__PURE__ */ React.forwardRef(function TableCell({ align, numeric, ...props }, ref) {
+    return _jsx(CellPart, { ...props, ...layout({ align, numeric }), ref: ref });
+});
+function SortIcon({ sort }) {
+    return (_jsx("svg", { className: 'pui-table-sort-icon', width: '16', height: '16', viewBox: '0 0 24 24', fill: 'none', stroke: 'currentColor', strokeWidth: '1.6', strokeLinecap: 'round', strokeLinejoin: 'round', "aria-hidden": 'true', children: _jsx("path", { d: sort === 'ascending'
+                ? 'M12 19V5m-6 6 6-6 6 6'
+                : sort === 'descending'
+                    ? 'M12 5v14m-6-6 6 6 6-6'
+                    : 'm8 9 4-4 4 4m-8 6 4 4 4-4' }) }));
+}
+/** A column header whose button sorts the column. aria-sort names the order on the sorted column only. */
+const TableSortHeader = /* @__PURE__ */ React.forwardRef(function TableSortHeader({ sort, onSort, disabled, children, className, ...props }, ref) {
+    return (_jsx(TableHeaderCell, { ...props, ref: ref, scope: 'col', "aria-sort": sort, className: ['pui-table-sort-header', className].filter(Boolean).join(' '), children: _jsxs(Button, { variant: 'ghost', className: 'pui-table-sort', "data-sort": sort, disabled: disabled, onClick: onSort, children: [_jsx("span", { children: children }), _jsx(SortIcon, { sort: sort })] }) }));
+});
+/** One-line text that ends in an ellipsis. String content also becomes the title. */
+const TableTruncate = /* @__PURE__ */ React.forwardRef(function TableTruncate({ className, title, children, ...props }, ref) {
+    return (_jsx("span", { ...props, ref: ref, title: title ?? (typeof children === 'string' ? children : undefined), className: ['pui-table-truncate', className].filter(Boolean).join(' '), children: children }));
+});
+/** A full-width body row for loading, empty, error and permission messages. It has no hover. */
+const TableMessage = /* @__PURE__ */ React.forwardRef(function TableMessage({ className, ...props }, ref) {
+    return (_jsx("tr", { className: 'pui-table-row pui-table-message-row', children: _jsx("td", { ...props, ref: ref, className: ['pui-table-cell pui-table-message', className]
+                .filter(Boolean)
+                .join(' ') }) }));
+});
+const TableRow = /* @__PURE__ */ React.forwardRef(function TableRow({ selected, className, ...props }, ref) {
     return (_jsx("tr", { ...props, ref: ref, "data-selected": selected || undefined, className: ['pui-table-row', className].filter(Boolean).join(' ') }));
 });
 export const Table = {
     Container: TableContainer,
-    Root: part('table', 'pui-table'),
-    Caption: part('caption', 'pui-table-caption'),
-    Head: part('thead', 'pui-table-head'),
-    Body: part('tbody', 'pui-table-body'),
-    Foot: part('tfoot', 'pui-table-foot'),
+    Root: TableRoot,
+    Caption: /* @__PURE__ */ part('caption', 'pui-table-caption'),
+    Head: /* @__PURE__ */ part('thead', 'pui-table-head'),
+    Body: /* @__PURE__ */ part('tbody', 'pui-table-body'),
+    Foot: /* @__PURE__ */ part('tfoot', 'pui-table-foot'),
     Row: TableRow,
-    HeaderCell: part('th', 'pui-table-cell pui-table-header'),
-    Cell: part('td', 'pui-table-cell'),
+    HeaderCell: TableHeaderCell,
+    SortHeader: TableSortHeader,
+    Cell: TableCell,
+    Truncate: TableTruncate,
+    Message: TableMessage,
 };
-const ListRoot = React.forwardRef(function ListRoot({ className, ...props }, ref) {
+const ListRoot = /* @__PURE__ */ React.forwardRef(function ListRoot({ className, ...props }, ref) {
     return (_jsx("ul", { role: 'list', ...props, ref: ref, className: ['pui-list', className].filter(Boolean).join(' ') }));
 });
-const ListItem = React.forwardRef(function ListItem({ selected, className, ...props }, ref) {
+const ListItem = /* @__PURE__ */ React.forwardRef(function ListItem({ selected, className, ...props }, ref) {
     return (_jsx("li", { ...props, ref: ref, "data-selected": selected || undefined, className: ['pui-list-item', className].filter(Boolean).join(' ') }));
 });
 export const List = {
     Root: ListRoot,
     Item: ListItem,
-    Content: part('div', 'pui-list-content'),
-    Title: part('div', 'pui-list-title'),
-    Description: part('p', 'pui-list-description'),
-    Actions: part('div', 'pui-list-actions'),
+    Content: /* @__PURE__ */ part('div', 'pui-list-content'),
+    Title: /* @__PURE__ */ part('div', 'pui-list-title'),
+    Description: /* @__PURE__ */ part('p', 'pui-list-description'),
+    Actions: /* @__PURE__ */ part('div', 'pui-list-actions'),
 };
 // Flat names for React Server Components, which cannot dot into client exports.
-export { ListRoot, ListItem, TableContainer, TableRow };
+export { ListRoot, ListItem, TableContainer, TableRoot, TableRow, TableHeaderCell, TableSortHeader, TableCell, TableTruncate, TableMessage, };
 export const { Content: ListContent, Title: ListTitle, Description: ListDescription, Actions: ListActions, } = List;
-export const { Root: TableRoot, Caption: TableCaption, Head: TableHead, Body: TableBody, Foot: TableFoot, HeaderCell: TableHeaderCell, Cell: TableCell, } = Table;
+export const { Caption: TableCaption, Head: TableHead, Body: TableBody, Foot: TableFoot, } = Table;

package/dist/dialog.js

@@ -1,24 +1,25 @@
 'use client';
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import * as React from 'react';
+import { skin } from './parts.js';
 import { useDialogFocusBoundary } from './dialog-focus.js';
 import { useComponentSize } from './sizing.js';
 import { Dialog as BaseDialog } from '@base-ui/react/dialog';
 import { AlertDialog as BaseAlertDialog } from '@base-ui/react/alert-dialog';
 const cx = (...v) => v.filter(Boolean).join(' ');
 /** Visible icon close action; inherits Dialog focus and dismissal behavior. */
-const DialogCloseButton = React.forwardRef(function DialogCloseButton({ className, 'aria-label': label = 'Close dialog', ...props }, ref) {
-    return (_jsx(BaseDialog.Close, { ...props, ref: ref, "aria-label": label, className: cx('pui-icon-button pui-dialog-close', typeof className === 'string' && className), children: _jsx("svg", { width: '18', height: '18', viewBox: '0 0 24 24', fill: 'none', stroke: 'currentColor', strokeWidth: '1.7', "aria-hidden": 'true', children: _jsx("path", { d: 'm6 6 12 12M18 6 6 18' }) }) }));
+const DialogCloseButton = /* @__PURE__ */ React.forwardRef(function DialogCloseButton({ className, 'aria-label': label = 'Close dialog', ...props }, ref) {
+    return (_jsx(BaseDialog.Close, { ...props, ref: ref, "aria-label": label, className: skin('pui-icon-button pui-dialog-close', className), children: _jsx("svg", { width: '18', height: '18', viewBox: '0 0 24 24', fill: 'none', stroke: 'currentColor', strokeWidth: '1.7', "aria-hidden": 'true', children: _jsx("path", { d: 'm6 6 12 12M18 6 6 18' }) }) }));
 });
-const DialogContent = React.forwardRef(function DialogContent({ className, children, closeLabel = 'Close dialog', closeDisabled, focusBoundaryLabel = 'Continue dialog navigation', ...props }, ref) {
+const DialogContent = /* @__PURE__ */ React.forwardRef(function DialogContent({ className, children, closeLabel = 'Close dialog', closeDisabled, focusBoundaryLabel = 'Continue dialog navigation', ...props }, ref) {
     const scheme = useComponentSize();
     const portalRef = useDialogFocusBoundary(focusBoundaryLabel);
-    return (_jsxs(BaseDialog.Portal, { ref: portalRef, children: [_jsx(BaseDialog.Backdrop, { className: 'pui-dialog-backdrop' }), _jsxs(BaseDialog.Popup, { "data-ui-size": scheme, ...props, ref: ref, className: cx('pui-dialog-popup pui-dialog-content', typeof className === 'string' && className), children: [_jsx(DialogCloseButton, { "aria-label": closeLabel, disabled: closeDisabled }), children] })] }));
+    return (_jsxs(BaseDialog.Portal, { ref: portalRef, children: [_jsx(BaseDialog.Backdrop, { className: 'pui-dialog-backdrop' }), _jsxs(BaseDialog.Popup, { "data-ui-size": scheme, ...props, ref: ref, className: skin('pui-dialog-popup pui-dialog-content', className), children: [_jsx(DialogCloseButton, { "aria-label": closeLabel, disabled: closeDisabled }), children] })] }));
 });
 function DialogHeader({ className, ...props }) {
     return _jsx("div", { ...props, className: cx('pui-dialog-header', className) });
 }
-const DialogBody = React.forwardRef(function DialogBody({ className, ...props }, ref) {
+const DialogBody = /* @__PURE__ */ React.forwardRef(function DialogBody({ className, ...props }, ref) {
     return (_jsx("div", { ...props, ref: ref, className: cx('pui-dialog-body', className) }));
 });
 function DialogFooter({ className, ...props }) {
@@ -32,10 +33,10 @@ export const Dialog = {
     Footer: DialogFooter,
     CloseButton: DialogCloseButton,
 };
-const AlertDialogContent = React.forwardRef(function AlertDialogContent({ className, focusBoundaryLabel = 'Continue dialog navigation', ...props }, ref) {
+const AlertDialogContent = /* @__PURE__ */ React.forwardRef(function AlertDialogContent({ className, focusBoundaryLabel = 'Continue dialog navigation', ...props }, ref) {
     const scheme = useComponentSize();
     const portalRef = useDialogFocusBoundary(focusBoundaryLabel);
-    return (_jsxs(BaseAlertDialog.Portal, { ref: portalRef, children: [_jsx(BaseAlertDialog.Backdrop, { className: 'pui-dialog-backdrop' }), _jsx(BaseAlertDialog.Popup, { "data-ui-size": scheme, ...props, ref: ref, className: cx('pui-dialog-popup pui-dialog-content pui-confirm-content', typeof className === 'string' && className) })] }));
+    return (_jsxs(BaseAlertDialog.Portal, { ref: portalRef, children: [_jsx(BaseAlertDialog.Backdrop, { className: 'pui-dialog-backdrop' }), _jsx(BaseAlertDialog.Popup, { "data-ui-size": scheme, ...props, ref: ref, className: skin('pui-dialog-popup pui-dialog-content pui-confirm-content', className) })] }));
 });
 export const AlertDialog = {
     ...BaseAlertDialog,

package/dist/disclosure.d.ts

@@ -0,0 +1,42 @@
+import * as React from 'react';
+import { Accordion as BaseAccordion } from '@base-ui/react/accordion';
+declare function AccordionRoot<Value = string>({ className, ...props }: BaseAccordion.Root.Props<Value>): React.JSX.Element;
+declare const AccordionTrigger: React.ForwardRefExoticComponent<Omit<Omit<import("@base-ui/react/accordion").AccordionTriggerProps, "ref"> & React.RefAttributes<HTMLElement>, "ref"> & {
+    indicator?: React.ReactNode;
+} & React.RefAttributes<HTMLElement>>;
+declare const AccordionPanel: React.ForwardRefExoticComponent<Omit<Omit<import("@base-ui/react/accordion").AccordionPanelProps, "ref"> & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
+export declare const Accordion: {
+    Root: typeof AccordionRoot;
+    Item: React.ForwardRefExoticComponent<Omit<Omit<Omit<import("@base-ui/react/accordion").AccordionItemProps, "ref"> & React.RefAttributes<HTMLDivElement>, "ref">, "size"> & {
+        size?: import("./sizing.js").ComponentSize;
+    } & React.RefAttributes<HTMLDivElement>>;
+    Header: React.ForwardRefExoticComponent<Omit<Omit<Omit<import("@base-ui/react/accordion").AccordionHeaderProps, "ref"> & React.RefAttributes<HTMLHeadingElement>, "ref">, "size"> & {
+        size?: import("./sizing.js").ComponentSize;
+    } & React.RefAttributes<HTMLHeadingElement>>;
+    Trigger: React.ForwardRefExoticComponent<Omit<Omit<import("@base-ui/react/accordion").AccordionTriggerProps, "ref"> & React.RefAttributes<HTMLElement>, "ref"> & {
+        indicator?: React.ReactNode;
+    } & React.RefAttributes<HTMLElement>>;
+    Panel: React.ForwardRefExoticComponent<Omit<Omit<import("@base-ui/react/accordion").AccordionPanelProps, "ref"> & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
+};
+declare const CollapsibleTrigger: React.ForwardRefExoticComponent<Omit<Omit<import("@base-ui/react/collapsible").CollapsibleTriggerProps, "ref"> & React.RefAttributes<HTMLButtonElement>, "ref"> & {
+    indicator?: React.ReactNode;
+} & React.RefAttributes<HTMLButtonElement>>;
+declare const CollapsiblePanel: React.ForwardRefExoticComponent<Omit<Omit<import("@base-ui/react/collapsible").CollapsiblePanelProps, "ref"> & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
+export declare const Collapsible: {
+    Root: React.ForwardRefExoticComponent<Omit<Omit<Omit<import("@base-ui/react/collapsible").CollapsibleRootProps, "ref"> & React.RefAttributes<HTMLDivElement>, "ref">, "size"> & {
+        size?: import("./sizing.js").ComponentSize;
+    } & React.RefAttributes<HTMLDivElement>>;
+    Trigger: React.ForwardRefExoticComponent<Omit<Omit<import("@base-ui/react/collapsible").CollapsibleTriggerProps, "ref"> & React.RefAttributes<HTMLButtonElement>, "ref"> & {
+        indicator?: React.ReactNode;
+    } & React.RefAttributes<HTMLButtonElement>>;
+    Panel: React.ForwardRefExoticComponent<Omit<Omit<import("@base-ui/react/collapsible").CollapsiblePanelProps, "ref"> & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
+};
+export { AccordionPanel, AccordionRoot, AccordionTrigger, CollapsiblePanel, CollapsibleTrigger, };
+export declare const AccordionHeader: React.ForwardRefExoticComponent<Omit<Omit<Omit<import("@base-ui/react/accordion").AccordionHeaderProps, "ref"> & React.RefAttributes<HTMLHeadingElement>, "ref">, "size"> & {
+    size?: import("./sizing.js").ComponentSize;
+} & React.RefAttributes<HTMLHeadingElement>>, AccordionItem: React.ForwardRefExoticComponent<Omit<Omit<Omit<import("@base-ui/react/accordion").AccordionItemProps, "ref"> & React.RefAttributes<HTMLDivElement>, "ref">, "size"> & {
+    size?: import("./sizing.js").ComponentSize;
+} & React.RefAttributes<HTMLDivElement>>;
+export declare const CollapsibleRoot: React.ForwardRefExoticComponent<Omit<Omit<Omit<import("@base-ui/react/collapsible").CollapsibleRootProps, "ref"> & React.RefAttributes<HTMLDivElement>, "ref">, "size"> & {
+    size?: import("./sizing.js").ComponentSize;
+} & React.RefAttributes<HTMLDivElement>>;

package/dist/disclosure.js

@@ -0,0 +1,41 @@
+'use client';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import * as React from 'react';
+import { Accordion as BaseAccordion } from '@base-ui/react/accordion';
+import { Collapsible as BaseCollapsible } from '@base-ui/react/collapsible';
+import { Chevron } from './chevron.js';
+import { skin, part } from './parts.js';
+function AccordionRoot({ className, ...props }) {
+    return (_jsx(BaseAccordion.Root, { ...props, className: skin('pui-accordion', className) }));
+}
+const AccordionTrigger = /* @__PURE__ */ React.forwardRef(function AccordionTrigger({ className, children, indicator, ...props }, ref) {
+    return (_jsxs(BaseAccordion.Trigger, { ...props, ref: ref, className: skin('pui-disclosure-trigger', className), children: [_jsx("span", { className: 'pui-disclosure-label', children: children }), indicator === undefined ? _jsx(Chevron, {}) : indicator] }));
+});
+const AccordionPanel = /* @__PURE__ */ React.forwardRef(function AccordionPanel({ className, children, render, ...props }, ref) {
+    return (_jsx(BaseAccordion.Panel, { ...props, ref: ref, className: skin('pui-accordion-panel', className), render: render ??
+            ((panelProps, state) => (_jsx("div", { ...panelProps, inert: state.transitionStatus === 'ending' || undefined, "aria-hidden": state.transitionStatus === 'ending' || undefined }))), children: _jsx("div", { className: 'pui-disclosure-body', children: children }) }));
+});
+export const Accordion = {
+    ...BaseAccordion,
+    Root: AccordionRoot,
+    Item: /* @__PURE__ */ part(BaseAccordion.Item, 'pui-accordion-item'),
+    Header: /* @__PURE__ */ part(BaseAccordion.Header, 'pui-accordion-header'),
+    Trigger: AccordionTrigger,
+    Panel: AccordionPanel,
+};
+const CollapsibleTrigger = /* @__PURE__ */ React.forwardRef(function CollapsibleTrigger({ className, children, indicator, ...props }, ref) {
+    return (_jsxs(BaseCollapsible.Trigger, { ...props, ref: ref, className: skin('pui-disclosure-trigger', className), children: [_jsx("span", { className: 'pui-disclosure-label', children: children }), indicator === undefined ? _jsx(Chevron, {}) : indicator] }));
+});
+const CollapsiblePanel = /* @__PURE__ */ React.forwardRef(function CollapsiblePanel({ className, children, ...props }, ref) {
+    return (_jsx(BaseCollapsible.Panel, { ...props, ref: ref, className: skin('pui-collapsible-panel', className), children: _jsx("div", { className: 'pui-disclosure-body', children: children }) }));
+});
+export const Collapsible = {
+    ...BaseCollapsible,
+    Root: /* @__PURE__ */ part(BaseCollapsible.Root, 'pui-collapsible'),
+    Trigger: CollapsibleTrigger,
+    Panel: CollapsiblePanel,
+};
+// Flat names for React Server Components, which cannot dot into client exports.
+export { AccordionPanel, AccordionRoot, AccordionTrigger, CollapsiblePanel, CollapsibleTrigger, };
+export const { Header: AccordionHeader, Item: AccordionItem } = Accordion;
+export const { Root: CollapsibleRoot } = Collapsible;

package/dist/feedback.js

@@ -4,30 +4,30 @@ import * as React from 'react';
 import { useComponentSize } from './sizing.js';
 import { Progress as BaseProgress } from '@base-ui/react/progress';
 import { Meter as BaseMeter } from '@base-ui/react/meter';
-import { part } from './parts.js';
+import { part, sizeName } from './parts.js';
 export const Progress = {
     ...BaseProgress,
-    Root: part(BaseProgress.Root, 'pui-gauge pui-progress'),
-    Label: part(BaseProgress.Label, 'pui-gauge-label'),
-    Value: part(BaseProgress.Value, 'pui-gauge-value'),
-    Track: part(BaseProgress.Track, 'pui-gauge-track'),
-    Indicator: part(BaseProgress.Indicator, 'pui-gauge-indicator'),
+    Root: /* @__PURE__ */ part(BaseProgress.Root, 'pui-gauge pui-progress'),
+    Label: /* @__PURE__ */ part(BaseProgress.Label, 'pui-gauge-label'),
+    Value: /* @__PURE__ */ part(BaseProgress.Value, 'pui-gauge-value'),
+    Track: /* @__PURE__ */ part(BaseProgress.Track, 'pui-gauge-track'),
+    Indicator: /* @__PURE__ */ part(BaseProgress.Indicator, 'pui-gauge-indicator'),
 };
 export const Meter = {
     ...BaseMeter,
-    Root: part(BaseMeter.Root, 'pui-gauge pui-meter'),
-    Label: part(BaseMeter.Label, 'pui-gauge-label'),
-    Value: part(BaseMeter.Value, 'pui-gauge-value'),
-    Track: part(BaseMeter.Track, 'pui-gauge-track'),
-    Indicator: part(BaseMeter.Indicator, 'pui-gauge-indicator'),
+    Root: /* @__PURE__ */ part(BaseMeter.Root, 'pui-gauge pui-meter'),
+    Label: /* @__PURE__ */ part(BaseMeter.Label, 'pui-gauge-label'),
+    Value: /* @__PURE__ */ part(BaseMeter.Value, 'pui-gauge-value'),
+    Track: /* @__PURE__ */ part(BaseMeter.Track, 'pui-gauge-track'),
+    Indicator: /* @__PURE__ */ part(BaseMeter.Indicator, 'pui-gauge-indicator'),
 };
 /** Use decorative within a loading region that already owns the announcement. */
-export const Spinner = React.forwardRef(function Spinner({ label = 'Loading', decorative = false, size, className, ...props }, ref) {
+export const Spinner = /* @__PURE__ */ React.forwardRef(function Spinner({ label = 'Loading', decorative = false, size, className, ...props }, ref) {
     const scheme = useComponentSize(size);
-    return (_jsxs("span", { ...props, ref: ref, className: ['pui-spinner', className].filter(Boolean).join(' '), "data-size": size, "data-ui-size": scheme, role: decorative ? undefined : 'status', "aria-hidden": decorative || undefined, children: [_jsxs("svg", { viewBox: '0 0 24 24', fill: 'none', stroke: 'currentColor', strokeWidth: '2', "aria-hidden": 'true', children: [_jsx("circle", { cx: '12', cy: '12', r: '9', opacity: '.2' }), _jsx("path", { d: 'M12 3a9 9 0 0 1 9 9', strokeLinecap: 'round' })] }), !decorative && _jsx("span", { className: 'pui-feedback-sr', children: label })] }));
+    return (_jsxs("span", { ...props, ref: ref, className: ['pui-spinner', className].filter(Boolean).join(' '), "data-size": sizeName(size), "data-ui-size": scheme, role: decorative ? undefined : 'status', "aria-hidden": decorative || undefined, children: [_jsxs("svg", { viewBox: '0 0 24 24', fill: 'none', stroke: 'currentColor', strokeWidth: '2', "aria-hidden": 'true', children: [_jsx("circle", { cx: '12', cy: '12', r: '9', opacity: '.2' }), _jsx("path", { d: 'M12 3a9 9 0 0 1 9 9', strokeLinecap: 'round' })] }), !decorative && _jsx("span", { className: 'pui-feedback-sr', children: label })] }));
 });
 /** Decorative placeholder; the owning region provides aria-busy and loading text. */
-export const Skeleton = React.forwardRef(function Skeleton({ shape = 'text', className, ...props }, ref) {
+export const Skeleton = /* @__PURE__ */ React.forwardRef(function Skeleton({ shape = 'text', className, ...props }, ref) {
     return (_jsx("span", { ...props, ref: ref, className: ['pui-skeleton', className].filter(Boolean).join(' '), "data-shape": shape, "aria-hidden": 'true' }));
 });
 // Flat names for React Server Components, which cannot dot into client exports.

package/dist/file-upload.js

@@ -49,7 +49,7 @@ function sizeLabel(bytes) {
     return `${new Intl.NumberFormat(undefined, { maximumFractionDigits: 1 }).format(bytes / (unit === 'MB' ? 1024 * 1024 : unit === 'KB' ? 1024 : 1))} ${unit}`;
 }
 /** Native selection/validation and a cancellable transport adapter; no network request is built in. */
-export const FileUpload = React.forwardRef(function FileUpload({ label, description, name, form, accept = '', capture, multiple = false, required = false, maxFiles = Infinity, maxFileSize = Infinity, files: controlled, defaultFiles = [], onFilesChange, onReject, transport, getUploadError, labels: customLabels, disabled = false, className, onDragEnter, onDragLeave, onDragOver, onDrop, ...props }, forwardedRef) {
+export const FileUpload = /* @__PURE__ */ React.forwardRef(function FileUpload({ label, description, name, form, accept = '', capture, multiple = false, required = false, maxFiles = Infinity, maxFileSize = Infinity, files: controlled, defaultFiles = [], onFilesChange, onReject, transport, getUploadError, labels: customLabels, disabled = false, className, onDragEnter, onDragLeave, onDragOver, onDrop, ...props }, forwardedRef) {
     const labels = {
         ...labelsDefault,
         ...customLabels,

package/dist/filter-bar.js

@@ -3,19 +3,19 @@ import { jsx as _jsx } from "react/jsx-runtime";
 import * as React from 'react';
 const cx = (base, extra) => [base, extra].filter(Boolean).join(' ');
 /** Layout only: filtering, routing and async results remain controlled by the caller. */
-const Root = React.forwardRef(function FilterBarRoot({ label, className, ...props }, ref) {
+const Root = /* @__PURE__ */ React.forwardRef(function FilterBarRoot({ label, className, ...props }, ref) {
     return (_jsx("form", { ...props, ref: ref, role: 'search', "aria-label": label, className: cx('pui-filter-bar', className) }));
 });
-const Controls = React.forwardRef(function FilterBarControls({ className, ...props }, ref) {
+const Controls = /* @__PURE__ */ React.forwardRef(function FilterBarControls({ className, ...props }, ref) {
     return (_jsx("div", { ...props, ref: ref, className: cx('pui-filter-bar-controls', className) }));
 });
-const Field = React.forwardRef(function FilterBarField({ width = 'filter', className, ...props }, ref) {
+const Field = /* @__PURE__ */ React.forwardRef(function FilterBarField({ width = 'filter', className, ...props }, ref) {
     return (_jsx("label", { ...props, ref: ref, "data-width": width, className: cx('pui-filter-bar-field', className) }));
 });
-const Actions = React.forwardRef(function FilterBarActions({ className, ...props }, ref) {
+const Actions = /* @__PURE__ */ React.forwardRef(function FilterBarActions({ className, ...props }, ref) {
     return (_jsx("div", { ...props, ref: ref, className: cx('pui-filter-bar-actions', className) }));
 });
-const Summary = React.forwardRef(function FilterBarSummary({ className, ...props }, ref) {
+const Summary = /* @__PURE__ */ React.forwardRef(function FilterBarSummary({ className, ...props }, ref) {
     return (_jsx("div", { role: 'status', "aria-atomic": 'true', ...props, ref: ref, className: cx('pui-filter-bar-summary', className) }));
 });
 export const FilterBar = { Root, Controls, Field, Actions, Summary };

package/dist/forms.js

@@ -10,14 +10,14 @@ import { CheckboxGroup as BaseCheckboxGroup } from '@base-ui/react/checkbox-grou
 import { Radio as BaseRadio } from '@base-ui/react/radio';
 import { RadioGroup as BaseRadioGroup } from '@base-ui/react/radio-group';
 import { Switch as BaseSwitch } from '@base-ui/react/switch';
-const ChoiceResetPaint = React.createContext(0);
+const ChoiceResetPaint = /* @__PURE__ */ React.createContext(0);
 import { skin, part } from './parts.js';
-const FieldRoot = part(BaseField.Root, 'pui-field');
-const FieldLabel = part(BaseField.Label, 'pui-field-label');
-const FieldControl = part(BaseField.Control, 'pui-input');
-const FieldDescription = part(BaseField.Description, 'pui-field-description');
-const FieldError = part(BaseField.Error, 'pui-field-error');
-const FieldItem = part(BaseField.Item, 'pui-field-item');
+const FieldRoot = /* @__PURE__ */ part(BaseField.Root, 'pui-field');
+const FieldLabel = /* @__PURE__ */ part(BaseField.Label, 'pui-field-label');
+const FieldControl = /* @__PURE__ */ part(BaseField.Control, 'pui-input');
+const FieldDescription = /* @__PURE__ */ part(BaseField.Description, 'pui-field-description');
+const FieldError = /* @__PURE__ */ part(BaseField.Error, 'pui-field-error');
+const FieldItem = /* @__PURE__ */ part(BaseField.Item, 'pui-field-item');
 export const Field = {
     ...BaseField,
     Root: FieldRoot,
@@ -29,20 +29,20 @@ export const Field = {
 };
 export const Fieldset = {
     ...BaseFieldset,
-    Root: part(BaseFieldset.Root, 'pui-fieldset'),
-    Legend: part(BaseFieldset.Legend, 'pui-fieldset-legend'),
+    Root: /* @__PURE__ */ part(BaseFieldset.Root, 'pui-fieldset'),
+    Legend: /* @__PURE__ */ part(BaseFieldset.Legend, 'pui-fieldset-legend'),
 };
 export function Form({ className, ...props }) {
     return _jsx(BaseForm, { ...props, className: skin('pui-form', className) });
 }
-export const Textarea = React.forwardRef(function Textarea({ className, size, ...props }, ref) {
+export const Textarea = /* @__PURE__ */ React.forwardRef(function Textarea({ className, size, ...props }, ref) {
     const scheme = useComponentSize(size);
     return (_jsx("textarea", { "data-ui-size": scheme, ...props, ref: ref, className: ['pui-input pui-textarea', className]
             .filter(Boolean)
             .join(' ') }));
 });
 import { useRootRef, useResetValue } from './form-state.js';
-const CheckboxRoot = React.forwardRef(function CheckboxRoot({ checked, defaultChecked = false, onCheckedChange, className, form, ...props }, ref) {
+const CheckboxRoot = /* @__PURE__ */ React.forwardRef(function CheckboxRoot({ checked, defaultChecked = false, onCheckedChange, className, form, ...props }, ref) {
     React.useContext(ChoiceResetPaint);
     const [element, attach] = useRootRef(ref);
     const [selected, setSelected] = useResetValue(checked, defaultChecked, element, form);
@@ -52,7 +52,7 @@ const CheckboxRoot = React.forwardRef(function CheckboxRoot({ checked, defaultCh
                 setSelected(next);
         } }));
 });
-const CheckboxIndicator = React.forwardRef(function CheckboxIndicator({ className, children, ...props }, ref) {
+const CheckboxIndicator = /* @__PURE__ */ React.forwardRef(function CheckboxIndicator({ className, children, ...props }, ref) {
     return (_jsx(BaseCheckbox.Indicator, { ...props, ref: ref, className: skin('pui-checkbox-indicator', className), children: children ?? (_jsxs("svg", { width: '14', height: '14', viewBox: '0 0 20 20', fill: 'none', stroke: 'currentColor', strokeWidth: '2', "aria-hidden": 'true', children: [_jsx("path", { className: 'pui-checkbox-check', d: 'm4 10 4 4 8-8' }), _jsx("path", { className: 'pui-checkbox-mixed', d: 'M4 10h12' })] })) }));
 });
 export const Checkbox = {
@@ -60,7 +60,7 @@ export const Checkbox = {
     Root: CheckboxRoot,
     Indicator: CheckboxIndicator,
 };
-export const CheckboxGroup = React.forwardRef(function CheckboxGroup({ value, defaultValue = [], onValueChange, className, ...props }, ref) {
+export const CheckboxGroup = /* @__PURE__ */ React.forwardRef(function CheckboxGroup({ value, defaultValue = [], onValueChange, className, ...props }, ref) {
     const [element, attach] = useRootRef(ref);
     const [selected, setSelected, revision] = useResetValue(value, defaultValue, element);
     return (_jsx(ChoiceResetPaint.Provider, { value: revision, children: _jsx(BaseCheckboxGroup, { ...props, ref: attach, value: selected, className: skin('pui-choice-group', className), onValueChange: (next, event) => {
@@ -78,16 +78,16 @@ export function RadioGroup({ value, defaultValue, onValueChange, className, form
                     setSelected(next);
             } }) }));
 }
-const RadioRoot = React.forwardRef(function RadioRoot({ className, ...props }, ref) {
+const RadioRoot = /* @__PURE__ */ React.forwardRef(function RadioRoot({ className, ...props }, ref) {
     React.useContext(ChoiceResetPaint);
     return (_jsx(BaseRadio.Root, { ...props, ref: ref, className: skin('pui-radio', className) }));
 });
 export const Radio = {
     ...BaseRadio,
     Root: RadioRoot,
-    Indicator: part(BaseRadio.Indicator, 'pui-radio-indicator'),
+    Indicator: /* @__PURE__ */ part(BaseRadio.Indicator, 'pui-radio-indicator'),
 };
-const SwitchRoot = React.forwardRef(function SwitchRoot({ checked, defaultChecked = false, onCheckedChange, className, form, ...props }, ref) {
+const SwitchRoot = /* @__PURE__ */ React.forwardRef(function SwitchRoot({ checked, defaultChecked = false, onCheckedChange, className, form, ...props }, ref) {
     const [element, attach] = useRootRef(ref);
     const [selected, setSelected] = useResetValue(checked, defaultChecked, element, form);
     return (_jsx(BaseSwitch.Root, { ...props, form: form, ref: attach, checked: selected, className: skin('pui-switch', className), onCheckedChange: (next, event) => {
@@ -99,7 +99,7 @@ const SwitchRoot = React.forwardRef(function SwitchRoot({ checked, defaultChecke
 export const Switch = {
     ...BaseSwitch,
     Root: SwitchRoot,
-    Thumb: part(BaseSwitch.Thumb, 'pui-switch-thumb'),
+    Thumb: /* @__PURE__ */ part(BaseSwitch.Thumb, 'pui-switch-thumb'),
 };
 // Flat names for React Server Components, which cannot dot into client exports.
 export { CheckboxIndicator, CheckboxRoot, FieldControl, FieldDescription, FieldError, FieldItem, FieldLabel, FieldRoot, RadioRoot, SwitchRoot, };

package/dist/foundations.js

@@ -6,23 +6,23 @@ const gapStyle = (gap, style) => ({
     ...(gap === undefined ? {} : { '--layout-gap': `var(--space-${gap})` }),
     ...style,
 });
-export const Container = React.forwardRef(function Container({ width = 'workspace', className, ...props }, ref) {
+export const Container = /* @__PURE__ */ React.forwardRef(function Container({ width = 'workspace', className, ...props }, ref) {
     return (_jsx("div", { ...props, ref: ref, className: cx('pui-container', className), "data-width": width }));
 });
-export const Stack = React.forwardRef(function Stack({ gap, className, style, ...props }, ref) {
+export const Stack = /* @__PURE__ */ React.forwardRef(function Stack({ gap, className, style, ...props }, ref) {
     return (_jsx("div", { ...props, ref: ref, className: cx('pui-stack', className), style: gapStyle(gap, style) }));
 });
-export const Inline = React.forwardRef(function Inline({ gap, justify = 'start', className, style, ...props }, ref) {
+export const Inline = /* @__PURE__ */ React.forwardRef(function Inline({ gap, justify = 'start', className, style, ...props }, ref) {
     return (_jsx("div", { ...props, ref: ref, className: cx('pui-inline', className), "data-justify": justify, style: gapStyle(gap, style) }));
 });
-export const Grid = React.forwardRef(function Grid({ gap, bleed = 0, columns = 3, className, style, ...props }, ref) {
+export const Grid = /* @__PURE__ */ React.forwardRef(function Grid({ gap, bleed = 0, columns = 3, className, style, ...props }, ref) {
     return (_jsx("div", { ...props, ref: ref, className: cx('pui-grid', className), "data-columns": columns, style: gapStyle(gap, {
             '--grid-inline-bleed': `var(--space-${bleed})`,
             ...style,
         }) }));
 });
 /** Spans are explicit at each viewport breakpoint; placement follows DOM order. */
-export const GridItem = React.forwardRef(function GridItem({ span, mediumSpan, smallSpan, className, style, ...props }, ref) {
+export const GridItem = /* @__PURE__ */ React.forwardRef(function GridItem({ span, mediumSpan, smallSpan, className, style, ...props }, ref) {
     return (_jsx("div", { ...props, ref: ref, className: cx('pui-grid-item', className), style: {
             '--grid-item-span': span,
             '--grid-item-span-medium': mediumSpan,
@@ -30,7 +30,7 @@ export const GridItem = React.forwardRef(function GridItem({ span, mediumSpan, s
             ...style,
         } }));
 });
-export const Surface = React.forwardRef(function Surface({ tone = 'subtle', padding, className, style, ...props }, ref) {
+export const Surface = /* @__PURE__ */ React.forwardRef(function Surface({ tone = 'subtle', padding, className, style, ...props }, ref) {
     return (_jsx("div", { ...props, ref: ref, className: cx('pui-surface', className), "data-tone": tone, style: {
             ...(padding === undefined
                 ? {}
@@ -50,6 +50,6 @@ export function PageHeader({ as: Root = 'div', headingProps, actionsLabel, title
                                 description !== false &&
                                 description !== '' && (_jsx(Text, { color: 'secondary', className: 'pui-page-header-description', children: description }))] }), actions != null && actions !== false && actions !== '' && (_jsx("div", { className: 'pui-page-header-actions', role: actionsLabel ? 'group' : undefined, "aria-label": actionsLabel, children: actions }))] })] }));
 }
-export const Prose = React.forwardRef(function Prose({ className, ...props }, ref) {
+export const Prose = /* @__PURE__ */ React.forwardRef(function Prose({ className, ...props }, ref) {
     return _jsx("div", { ...props, ref: ref, className: cx('pui-prose', className) });
 });

package/dist/icon.d.ts

@@ -8,6 +8,7 @@ declare const shapes: {
     alert: React.JSX.Element;
     warning: React.JSX.Element;
     menu: React.JSX.Element;
+    more: React.JSX.Element;
     sun: React.JSX.Element;
     moon: React.JSX.Element;
     monitor: React.JSX.Element;

package/dist/icon.js

@@ -10,6 +10,7 @@ const shapes = {
     alert: (_jsxs(_Fragment, { children: [_jsx("circle", { cx: '12', cy: '12', r: '9' }), _jsx("path", { d: 'M12 7v6m0 3v1' })] })),
     warning: (_jsxs(_Fragment, { children: [_jsx("path", { d: 'm12 3 10 18H2L12 3Z' }), _jsx("path", { d: 'M12 9v4m0 3v1' })] })),
     menu: _jsx("path", { d: 'M4 6h16M4 12h16M4 18h16' }),
+    more: (_jsxs(_Fragment, { children: [_jsx("circle", { cx: '5', cy: '12', r: '1' }), _jsx("circle", { cx: '12', cy: '12', r: '1' }), _jsx("circle", { cx: '19', cy: '12', r: '1' })] })),
     sun: (_jsxs(_Fragment, { children: [_jsx("circle", { cx: '12', cy: '12', r: '4' }), _jsx("path", { d: 'M12 2v2m0 16v2M2 12h2m16 0h2M5 5l1.5 1.5m11 11L19 19M5 19l1.5-1.5m11-11L19 5' })] })),
     moon: _jsx("path", { d: 'M20.5 13.2A8.5 8.5 0 0 1 10.8 3.5 8.5 8.5 0 1 0 20.5 13.2Z' }),
     monitor: (_jsxs(_Fragment, { children: [_jsx("rect", { x: '3', y: '4', width: '18', height: '13', rx: '2' }), _jsx("path", { d: 'M8 21h8m-4-4v4' })] })),
@@ -23,6 +24,8 @@ const shapes = {
 };
 export const iconNames = Object.keys(shapes);
 /** Static SVG only. Actions, focus, accessible button names and hit targets belong to the parent control. */
-export const Icon = React.forwardRef(function Icon({ name, size = 'sm', decorative = true, label, className, ...props }, ref) {
-    return (_jsx("svg", { ...props, ref: ref, className: ['pui-icon', className].filter(Boolean).join(' '), "data-size": size, "data-directional": name === 'chevron-forward' || name === 'arrow-back' ? 'true' : undefined, viewBox: '0 0 24 24', fill: 'none', stroke: 'currentColor', strokeLinecap: 'round', strokeLinejoin: 'round', focusable: 'false', "aria-hidden": decorative ? true : undefined, role: decorative ? undefined : 'img', "aria-label": decorative ? undefined : label, children: shapes[name] }));
+export const Icon = /* @__PURE__ */ React.forwardRef(function Icon({ name, size = 'sm', decorative = true, label, className, ...props }, ref) {
+    return (_jsx("svg", { ...props, ref: ref, className: ['pui-icon', className].filter(Boolean).join(' '), "data-size": size, "data-directional": name === 'chevron-forward' || name === 'arrow-back'
+            ? 'true'
+            : undefined, viewBox: '0 0 24 24', fill: 'none', stroke: 'currentColor', strokeLinecap: 'round', strokeLinejoin: 'round', focusable: 'false', "aria-hidden": decorative ? true : undefined, role: decorative ? undefined : 'img', "aria-label": decorative ? undefined : label, children: shapes[name] }));
 });

package/dist/index.d.ts

@@ -11,10 +11,14 @@ export { ScrollArea } from './scroll-area.js';
 export { Sheet, Drawer, type PanelSide, SheetBackdrop, SheetClose, SheetDescription, SheetHandle, SheetPopup, SheetPortal, SheetRoot, SheetTitle, SheetTrigger, SheetViewport, SheetContent, SheetHeader, SheetBody, SheetFooter, DrawerBackdrop, DrawerClose, DrawerContent, DrawerDescription, DrawerHandle, DrawerIndent, DrawerIndentBackground, DrawerPopup, DrawerPortal, DrawerProvider, DrawerRoot, DrawerSwipeArea, DrawerTitle, DrawerTrigger, DrawerViewport, DrawerVirtualKeyboardProvider, DrawerPrimitiveContent, DrawerHeader, DrawerBody, DrawerFooter, } from './panels.js';
 export { Container, Stack, Inline, Grid, GridItem, Surface, Heading, Text, PageHeader, Prose, type Space, } from './foundations.js';
 export { Field, Fieldset, Form, Textarea, Checkbox, CheckboxGroup, Radio, RadioGroup, Switch, FieldControl, FieldDescription, FieldError, FieldItem, FieldLabel, FieldRoot, FieldValidity, FieldsetLegend, FieldsetRoot, CheckboxIndicator, CheckboxRoot, RadioIndicator, RadioRoot, SwitchRoot, SwitchThumb, } from './forms.js';
-export { Tabs, Accordion, Collapsible, Avatar, Separator, Link, Breadcrumbs, TabsIndicator, TabsList, TabsPanel, TabsRoot, TabsTab, AccordionHeader, AccordionItem, AccordionPanel, AccordionRoot, AccordionTrigger, CollapsiblePanel, CollapsibleRoot, CollapsibleTrigger, AvatarFallback, AvatarImage, AvatarRoot, AvatarStatus, BreadcrumbsRoot, BreadcrumbsList, BreadcrumbsItem, BreadcrumbsLink, BreadcrumbsSeparator, BreadcrumbsCurrent, } from './navigation.js';
+export { Tabs, TabsIndicator, TabsList, TabsPanel, TabsRoot, TabsTab, } from './tabs.js';
+export { Accordion, Collapsible, AccordionHeader, AccordionItem, AccordionPanel, AccordionRoot, AccordionTrigger, CollapsiblePanel, CollapsibleRoot, CollapsibleTrigger, } from './disclosure.js';
+export { Avatar, AvatarFallback, AvatarImage, AvatarRoot, AvatarStatus, } from './avatar.js';
+export { Separator, Link, Breadcrumbs, BreadcrumbsRoot, BreadcrumbsList, BreadcrumbsItem, BreadcrumbsLink, BreadcrumbsSeparator, BreadcrumbsCurrent, } from './navigation.js';
 export { Badge, StatusBadge, type BadgeProps, type StatusTone, } from './status.js';
 export { Progress, Meter, Spinner, Skeleton, type SpinnerProps, type SkeletonProps, ProgressIndicator, ProgressLabel, ProgressRoot, ProgressTrack, ProgressValue, MeterIndicator, MeterLabel, MeterRoot, MeterTrack, MeterValue, } from './feedback.js';
-export { Table, List, TableContainer, TableRoot, TableCaption, TableHead, TableBody, TableFoot, TableRow, TableHeaderCell, TableCell, ListRoot, ListItem, ListContent, ListTitle, ListDescription, ListActions, } from './data.js';
+export { Table, List, TableContainer, TableRoot, TableCaption, TableHead, TableBody, TableFoot, TableRow, TableHeaderCell, TableSortHeader, TableCell, TableTruncate, TableMessage, ListRoot, ListItem, ListContent, ListTitle, ListDescription, ListActions, type TableDensity, type TableSort, } from './data.js';
+export { useTableSelection, type TableSelectionOptions, type TableSelectionCheckbox, } from './table-selection.js';
 export { InlineMessage, EmptyState, InlineMessageRoot, InlineMessageIcon, InlineMessageContent, InlineMessageTitle, InlineMessageDescription, InlineMessageActions, EmptyStateRoot, EmptyStateIcon, EmptyStateTitle, EmptyStateDescription, EmptyStateActions, } from './messages.js';
 export { Card, CodeBlock, type CodeBlockProps, CardRoot, CardHeader, CardTitle, CardDescription, CardBody, CardFooter, } from './content.js';
 export { Pagination, type PaginationProps } from './pagination.js';
@@ -29,9 +33,5 @@ export { Toast, type ToastRootProps, type ToastViewportProps, ToastAction, Toast
 export { FileUpload, type FileUploadProps, type UploadTransport, type FileUploadLabels, type FileChangeDetails, type FileRejection, type UploadState, } from './file-upload.js';
 export { Icon, iconNames, type IconName, type IconProps } from './icon.js';
 export { FilterBar, FilterBarRoot, FilterBarControls, FilterBarField, FilterBarActions, FilterBarSummary, } from './filter-bar.js';
-export { AppShell, AppShellRoot, AppShellHeader, AppShellSidebar, AppShellContent, AppShellFooter, AppShellLabel, AppShellLink, } from './app-shell.js';
-export { Tree, type TreeNode, type TreeProps } from './tree.js';
-export { DatePicker, DateRangePicker, TimeField, DateLocaleProvider, type DatePickerProps, type DateRangePickerProps, type TimeFieldProps, type DateValue, type TimeValue, } from './date-picker.js';
-export { Chart, type ChartDatum, type ChartSeries, type ChartProps, } from './chart.js';
+export { AppShell, AppShellRoot, AppShellHeader, AppShellSidebar, AppShellContent, AppShellPage, AppShellFooter, AppShellLabel, AppShellLink, } from './app-shell.js';
 export { SyntaxHighlighter, syntaxLanguages, type SyntaxHighlighterProps, } from './syntax-highlighter.js';
-export { Markdown, type MarkdownProps } from './markdown.js';

package/dist/index.js

@@ -12,10 +12,14 @@ export { ScrollArea } from './scroll-area.js';
 export { Sheet, Drawer, SheetBackdrop, SheetClose, SheetDescription, SheetHandle, SheetPopup, SheetPortal, SheetRoot, SheetTitle, SheetTrigger, SheetViewport, SheetContent, SheetHeader, SheetBody, SheetFooter, DrawerBackdrop, DrawerClose, DrawerContent, DrawerDescription, DrawerHandle, DrawerIndent, DrawerIndentBackground, DrawerPopup, DrawerPortal, DrawerProvider, DrawerRoot, DrawerSwipeArea, DrawerTitle, DrawerTrigger, DrawerViewport, DrawerVirtualKeyboardProvider, DrawerPrimitiveContent, DrawerHeader, DrawerBody, DrawerFooter, } from './panels.js';
 export { Container, Stack, Inline, Grid, GridItem, Surface, Heading, Text, PageHeader, Prose, } from './foundations.js';
 export { Field, Fieldset, Form, Textarea, Checkbox, CheckboxGroup, Radio, RadioGroup, Switch, FieldControl, FieldDescription, FieldError, FieldItem, FieldLabel, FieldRoot, FieldValidity, FieldsetLegend, FieldsetRoot, CheckboxIndicator, CheckboxRoot, RadioIndicator, RadioRoot, SwitchRoot, SwitchThumb, } from './forms.js';
-export { Tabs, Accordion, Collapsible, Avatar, Separator, Link, Breadcrumbs, TabsIndicator, TabsList, TabsPanel, TabsRoot, TabsTab, AccordionHeader, AccordionItem, AccordionPanel, AccordionRoot, AccordionTrigger, CollapsiblePanel, CollapsibleRoot, CollapsibleTrigger, AvatarFallback, AvatarImage, AvatarRoot, AvatarStatus, BreadcrumbsRoot, BreadcrumbsList, BreadcrumbsItem, BreadcrumbsLink, BreadcrumbsSeparator, BreadcrumbsCurrent, } from './navigation.js';
+export { Tabs, TabsIndicator, TabsList, TabsPanel, TabsRoot, TabsTab, } from './tabs.js';
+export { Accordion, Collapsible, AccordionHeader, AccordionItem, AccordionPanel, AccordionRoot, AccordionTrigger, CollapsiblePanel, CollapsibleRoot, CollapsibleTrigger, } from './disclosure.js';
+export { Avatar, AvatarFallback, AvatarImage, AvatarRoot, AvatarStatus, } from './avatar.js';
+export { Separator, Link, Breadcrumbs, BreadcrumbsRoot, BreadcrumbsList, BreadcrumbsItem, BreadcrumbsLink, BreadcrumbsSeparator, BreadcrumbsCurrent, } from './navigation.js';
 export { Badge, StatusBadge, } from './status.js';
 export { Progress, Meter, Spinner, Skeleton, ProgressIndicator, ProgressLabel, ProgressRoot, ProgressTrack, ProgressValue, MeterIndicator, MeterLabel, MeterRoot, MeterTrack, MeterValue, } from './feedback.js';
-export { Table, List, TableContainer, TableRoot, TableCaption, TableHead, TableBody, TableFoot, TableRow, TableHeaderCell, TableCell, ListRoot, ListItem, ListContent, ListTitle, ListDescription, ListActions, } from './data.js';
+export { Table, List, TableContainer, TableRoot, TableCaption, TableHead, TableBody, TableFoot, TableRow, TableHeaderCell, TableSortHeader, TableCell, TableTruncate, TableMessage, ListRoot, ListItem, ListContent, ListTitle, ListDescription, ListActions, } from './data.js';
+export { useTableSelection, } from './table-selection.js';
 export { InlineMessage, EmptyState, InlineMessageRoot, InlineMessageIcon, InlineMessageContent, InlineMessageTitle, InlineMessageDescription, InlineMessageActions, EmptyStateRoot, EmptyStateIcon, EmptyStateTitle, EmptyStateDescription, EmptyStateActions, } from './messages.js';
 export { Card, CodeBlock, CardRoot, CardHeader, CardTitle, CardDescription, CardBody, CardFooter, } from './content.js';
 export { Pagination } from './pagination.js';
@@ -30,9 +34,8 @@ export { Toast, ToastAction, ToastArrow, ToastClose, ToastContent, ToastDescript
 export { FileUpload, } from './file-upload.js';
 export { Icon, iconNames } from './icon.js';
 export { FilterBar, FilterBarRoot, FilterBarControls, FilterBarField, FilterBarActions, FilterBarSummary, } from './filter-bar.js';
-export { AppShell, AppShellRoot, AppShellHeader, AppShellSidebar, AppShellContent, AppShellFooter, AppShellLabel, AppShellLink, } from './app-shell.js';
-export { Tree } from './tree.js';
-export { DatePicker, DateRangePicker, TimeField, DateLocaleProvider, } from './date-picker.js';
-export { Chart, } from './chart.js';
+export { AppShell, AppShellRoot, AppShellHeader, AppShellSidebar, AppShellContent, AppShellPage, AppShellFooter, AppShellLabel, AppShellLink, } from './app-shell.js';
+// Chart, DatePicker, Markdown, Tree and syntax highlighting need optional packages, so
+// they live on their own entry points: @surflane/ui/chart, /date-picker, /markdown, /tree
+// and /syntax-highlighting.
 export { SyntaxHighlighter, syntaxLanguages, } from './syntax-highlighter.js';
-export { Markdown } from './markdown.js';