@surflane/ui 0.3.0 → 0.5.0

package/dist/markdown.js

@@ -3,8 +3,9 @@ import { jsx as _jsx } from "react/jsx-runtime";
 import * as React from 'react';
 import ReactMarkdown from 'react-markdown';
 import remarkGfm from 'remark-gfm';
-import { CodeBlock } from './content.js';
-import { Table } from './data.js';
+import { CodeBlock } from './code.js';
+import { Table } from './table.js';
+import { cx } from './parts.js';
 function text(node) {
     return 'value' in node
         ? node.value
@@ -20,7 +21,7 @@ function visit(node, callback) {
 }
 /** CommonMark + GFM. HTML stays disabled, URLs use react-markdown's safe default.
  * Fetching, permissions, frontmatter, MDX and script execution are caller concerns. */
-export const Markdown = React.forwardRef(function Markdown({ source, label = 'Markdown content', headingLevel = 2, codeWrap = false, className, ...props }, ref) {
+export const Markdown = /* @__PURE__ */ React.forwardRef(function Markdown({ source, label = 'Markdown content', headingLevel = 2, codeWrap = false, className, ...props }, ref) {
     const prefix = `md-${React.useId().replace(/[^a-zA-Z0-9_-]/g, '')}`;
     const headings = React.useMemo(() => () => (tree) => {
         const counts = new Map();
@@ -91,7 +92,8 @@ export const Markdown = React.forwardRef(function Markdown({ source, label = 'Ma
                 const child = React.Children.toArray(children)[0];
                 if (!React.isValidElement(child))
                     return _jsx("pre", { children: children });
-                const language = /(?:^|\s)language-([^\s]+)/.exec(child.props.className ?? '')?.[1] ?? 'text';
+                const language = /(?:^|\s)language-([^\s]+)/.exec(child.props.className ?? '')?.[1] ??
+                    'text';
                 const code = String(child.props.children ?? '').replace(/\n$/, '');
                 return (_jsx(CodeBlock, { code: code, language: language, wrap: codeWrap, label: `${label}: code at line ${node?.position?.start.line ?? 1}` }));
             },
@@ -115,7 +117,5 @@ export const Markdown = React.forwardRef(function Markdown({ source, label = 'Ma
             },
         };
     }, [headingLevel, label, codeWrap]);
-    return (_jsx("div", { ...props, ref: ref, role: 'article', className: ['pui-prose pui-markdown', className]
-            .filter(Boolean)
-            .join(' '), "aria-label": label, children: _jsx(ReactMarkdown, { remarkPlugins: [remarkGfm], rehypePlugins: [headings], remarkRehypeOptions: { clobberPrefix: `${prefix}-` }, skipHtml: true, components: components, children: source }) }));
+    return (_jsx("div", { ...props, ref: ref, role: 'article', className: cx('pui-prose pui-markdown', className), "aria-label": label, children: _jsx(ReactMarkdown, { remarkPlugins: [remarkGfm], rehypePlugins: [headings], remarkRehypeOptions: { clobberPrefix: `${prefix}-` }, skipHtml: true, components: components, children: source }) }));
 });

package/dist/menu.d.ts

@@ -6,10 +6,13 @@ declare const MenuPopup: React.ForwardRefExoticComponent<Omit<Omit<Omit<import("
 declare const MenuPositioner: React.ForwardRefExoticComponent<Omit<Omit<Omit<import("@base-ui/react/menu").MenuPositionerProps, "ref"> & React.RefAttributes<HTMLDivElement>, "ref">, "size"> & {
     size?: import("./sizing.js").ComponentSize;
 } & React.RefAttributes<HTMLDivElement>>;
-declare const MenuContent: React.ForwardRefExoticComponent<Omit<Omit<import("@base-ui/react/menu").MenuPopupProps, "ref"> & React.RefAttributes<HTMLDivElement>, "ref"> & Pick<Omit<Omit<import("@base-ui/react/menu").MenuPositionerProps, "ref"> & React.RefAttributes<HTMLDivElement>, "ref">, "align" | "side" | "sideOffset" | "collisionPadding"> & React.RefAttributes<HTMLDivElement>>;
+declare const MenuContent: React.ForwardRefExoticComponent<Omit<Omit<import("@base-ui/react/menu").MenuPopupProps, "ref"> & React.RefAttributes<HTMLDivElement>, "ref"> & Pick<Omit<Omit<import("@base-ui/react/menu").MenuPositionerProps, "ref"> & React.RefAttributes<HTMLDivElement>, "ref">, "side" | "align" | "sideOffset" | "collisionPadding"> & React.RefAttributes<HTMLDivElement>>;
 declare const MenuTrigger: React.ForwardRefExoticComponent<Omit<import("@base-ui/react/menu").MenuTriggerProps<unknown> & React.RefAttributes<HTMLElement>, "ref"> & React.RefAttributes<HTMLButtonElement>>;
+/** Content brings its own portal; Portal stays for wrapping it, or raw parts. */
+declare const MenuPortal: React.ForwardRefExoticComponent<Omit<import("@base-ui/react/menu").MenuPortalProps, "ref"> & React.RefAttributes<HTMLDivElement>>;
 export declare const Menu: {
-    Content: React.ForwardRefExoticComponent<Omit<Omit<import("@base-ui/react/menu").MenuPopupProps, "ref"> & React.RefAttributes<HTMLDivElement>, "ref"> & Pick<Omit<Omit<import("@base-ui/react/menu").MenuPositionerProps, "ref"> & React.RefAttributes<HTMLDivElement>, "ref">, "align" | "side" | "sideOffset" | "collisionPadding"> & React.RefAttributes<HTMLDivElement>>;
+    Portal: React.ForwardRefExoticComponent<Omit<import("@base-ui/react/menu").MenuPortalProps, "ref"> & React.RefAttributes<HTMLDivElement>>;
+    Content: React.ForwardRefExoticComponent<Omit<Omit<import("@base-ui/react/menu").MenuPopupProps, "ref"> & React.RefAttributes<HTMLDivElement>, "ref"> & Pick<Omit<Omit<import("@base-ui/react/menu").MenuPositionerProps, "ref"> & React.RefAttributes<HTMLDivElement>, "ref">, "side" | "align" | "sideOffset" | "collisionPadding"> & React.RefAttributes<HTMLDivElement>>;
     Popup: React.ForwardRefExoticComponent<Omit<Omit<Omit<import("@base-ui/react/menu").MenuPopupProps, "ref"> & React.RefAttributes<HTMLDivElement>, "ref">, "size"> & {
         size?: import("./sizing.js").ComponentSize;
     } & React.RefAttributes<HTMLDivElement>>;
@@ -46,7 +49,6 @@ export declare const Menu: {
     Arrow: React.ForwardRefExoticComponent<Omit<import("@base-ui/react/menu").MenuArrowProps, "ref"> & React.RefAttributes<HTMLDivElement>>;
     Backdrop: React.ForwardRefExoticComponent<Omit<import("@base-ui/react/menu").MenuBackdropProps, "ref"> & React.RefAttributes<HTMLDivElement>>;
     Group: React.ForwardRefExoticComponent<Omit<import("@base-ui/react/menu").MenuGroupProps, "ref"> & React.RefAttributes<HTMLDivElement>>;
-    Portal: React.ForwardRefExoticComponent<Omit<import("@base-ui/react/menu").MenuPortalProps, "ref"> & React.RefAttributes<HTMLDivElement>>;
     RadioGroup: React.NamedExoticComponent<Omit<import("@base-ui/react/menu").MenuRadioGroupProps, "ref"> & React.RefAttributes<HTMLDivElement>>;
     Root: typeof BaseMenu.Root;
     SubmenuRoot: typeof BaseMenu.SubmenuRoot;
@@ -59,7 +61,7 @@ export declare const Menu: {
     Empty: React.ForwardRefExoticComponent<Omit<import("@base-ui/react/menu").MenuEmptyProps, "ref"> & React.RefAttributes<HTMLDivElement>>;
     useFilter: typeof BaseMenu.useFilter;
 };
-export { MenuPopup, MenuPositioner, MenuTrigger, MenuContent };
+export { MenuPopup, MenuPositioner, MenuTrigger, MenuContent, MenuPortal };
 export declare const MenuArrow: React.ForwardRefExoticComponent<Omit<import("@base-ui/react/menu").MenuArrowProps, "ref"> & React.RefAttributes<HTMLDivElement>>, MenuBackdrop: React.ForwardRefExoticComponent<Omit<import("@base-ui/react/menu").MenuBackdropProps, "ref"> & React.RefAttributes<HTMLDivElement>>, MenuCheckboxItem: React.ForwardRefExoticComponent<Omit<Omit<Omit<import("@base-ui/react/menu").MenuCheckboxItemProps, "ref"> & React.RefAttributes<HTMLElement>, "ref">, "size"> & {
     size?: import("./sizing.js").ComponentSize;
 } & React.RefAttributes<HTMLDivElement>>, MenuCheckboxItemIndicator: React.ForwardRefExoticComponent<Omit<Omit<import("@base-ui/react/menu").MenuCheckboxItemIndicatorProps, "ref"> & React.RefAttributes<HTMLSpanElement>, "ref"> & React.RefAttributes<HTMLSpanElement>>, MenuClear: React.ForwardRefExoticComponent<Omit<import("@base-ui/react/menu").MenuClearProps, "ref"> & React.RefAttributes<HTMLButtonElement>>, MenuEmpty: React.ForwardRefExoticComponent<Omit<import("@base-ui/react/menu").MenuEmptyProps, "ref"> & React.RefAttributes<HTMLDivElement>>, MenuFilterProvider: typeof BaseMenu.FilterProvider, MenuGroup: React.ForwardRefExoticComponent<Omit<import("@base-ui/react/menu").MenuGroupProps, "ref"> & React.RefAttributes<HTMLDivElement>>, MenuGroupLabel: React.ForwardRefExoticComponent<Omit<Omit<Omit<import("@base-ui/react/menu").MenuGroupLabelProps, "ref"> & React.RefAttributes<HTMLDivElement>, "ref">, "size"> & {
@@ -70,7 +72,7 @@ export declare const MenuArrow: React.ForwardRefExoticComponent<Omit<import("@ba
     size?: import("./sizing.js").ComponentSize;
 } & React.RefAttributes<HTMLDivElement>>, MenuLinkItem: React.ForwardRefExoticComponent<Omit<Omit<Omit<import("@base-ui/react/menu").MenuLinkItemProps, "ref"> & React.RefAttributes<Element>, "ref">, "size"> & {
     size?: import("./sizing.js").ComponentSize;
-} & React.RefAttributes<HTMLAnchorElement>>, MenuList: React.ForwardRefExoticComponent<Omit<import("@base-ui/react/menu").MenuListProps, "ref"> & React.RefAttributes<HTMLDivElement>>, MenuPortal: React.ForwardRefExoticComponent<Omit<import("@base-ui/react/menu").MenuPortalProps, "ref"> & React.RefAttributes<HTMLDivElement>>, MenuRadioGroup: React.NamedExoticComponent<Omit<import("@base-ui/react/menu").MenuRadioGroupProps, "ref"> & React.RefAttributes<HTMLDivElement>>, MenuRadioItem: React.ForwardRefExoticComponent<Omit<Omit<Omit<import("@base-ui/react/menu").MenuRadioItemProps, "ref"> & React.RefAttributes<HTMLElement>, "ref">, "size"> & {
+} & React.RefAttributes<HTMLAnchorElement>>, MenuList: React.ForwardRefExoticComponent<Omit<import("@base-ui/react/menu").MenuListProps, "ref"> & React.RefAttributes<HTMLDivElement>>, MenuRadioGroup: React.NamedExoticComponent<Omit<import("@base-ui/react/menu").MenuRadioGroupProps, "ref"> & React.RefAttributes<HTMLDivElement>>, MenuRadioItem: React.ForwardRefExoticComponent<Omit<Omit<Omit<import("@base-ui/react/menu").MenuRadioItemProps, "ref"> & React.RefAttributes<HTMLElement>, "ref">, "size"> & {
     size?: import("./sizing.js").ComponentSize;
 } & React.RefAttributes<HTMLDivElement>>, MenuRadioItemIndicator: React.ForwardRefExoticComponent<Omit<Omit<import("@base-ui/react/menu").MenuRadioItemIndicatorProps, "ref"> & React.RefAttributes<HTMLSpanElement>, "ref"> & React.RefAttributes<HTMLSpanElement>>, MenuRoot: typeof BaseMenu.Root, MenuSeparator: React.ForwardRefExoticComponent<Omit<Omit<Omit<import("@base-ui/react").SeparatorProps, "ref"> & React.RefAttributes<HTMLDivElement>, "ref">, "size"> & {
     size?: import("./sizing.js").ComponentSize;

package/dist/menu.js

@@ -1,29 +1,33 @@
 'use client';
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import * as React from 'react';
+import { Icon } from './icon.js';
 import { Menu as BaseMenu } from '@base-ui/react/menu';
-import { skin, part } from './parts.js';
-const MenuPopup = part(BaseMenu.Popup, 'pui-menu');
-const MenuPositioner = part(BaseMenu.Positioner, 'pui-positioner');
-const MenuContent = React.forwardRef(function MenuContent({ align = 'end', sideOffset = 6, side, collisionPadding, className, ...props }, ref) {
-    return (_jsx(MenuPositioner, { align: align, side: side, sideOffset: sideOffset, collisionPadding: collisionPadding, children: _jsx(MenuPopup, { ...props, ref: ref, className: className }) }));
+import { OwnPortal, part, scopedPortal, skin } from './parts.js';
+const MenuPopup = /* @__PURE__ */ part(BaseMenu.Popup, 'pui-menu', { portal: true });
+const MenuPositioner = /* @__PURE__ */ part(BaseMenu.Positioner, 'pui-positioner', { portal: true });
+const MenuContent = /* @__PURE__ */ React.forwardRef(function MenuContent({ align = 'end', sideOffset = 6, side, collisionPadding, className, ...props }, ref) {
+    return (_jsx(OwnPortal, { portal: BaseMenu.Portal, children: _jsx(MenuPositioner, { align: align, side: side, sideOffset: sideOffset, collisionPadding: collisionPadding, children: _jsx(MenuPopup, { ...props, ref: ref, className: className }) }) }));
 });
-const MenuTrigger = React.forwardRef(function MenuTrigger({ className, ...props }, ref) {
+const MenuTrigger = /* @__PURE__ */ React.forwardRef(function MenuTrigger({ className, ...props }, ref) {
     return (_jsx(BaseMenu.Trigger, { "data-variant": 'ghost', ...props, ref: ref, className: skin('pui-button pui-menu-trigger', className) }));
 });
-const CheckboxIndicator = React.forwardRef(function CheckboxIndicator({ className, children, ...props }, ref) {
-    return (_jsx(BaseMenu.CheckboxItemIndicator, { keepMounted: true, ...props, ref: ref, className: skin('pui-menu-indicator', className), children: children ?? (_jsx("svg", { width: '16', height: '16', viewBox: '0 0 24 24', fill: 'none', stroke: 'currentColor', strokeWidth: '1.6', "aria-hidden": 'true', children: _jsx("path", { d: 'm5 12 4 4L19 6' }) })) }));
+const CheckboxIndicator = /* @__PURE__ */ React.forwardRef(function CheckboxIndicator({ className, children, ...props }, ref) {
+    return (_jsx(BaseMenu.CheckboxItemIndicator, { keepMounted: true, ...props, ref: ref, className: skin('pui-menu-indicator', className), children: children ?? _jsx(Icon, { name: 'check' }) }));
 });
-const RadioIndicator = React.forwardRef(function RadioIndicator({ className, children, ...props }, ref) {
+const RadioIndicator = /* @__PURE__ */ React.forwardRef(function RadioIndicator({ className, children, ...props }, ref) {
     return (_jsx(BaseMenu.RadioItemIndicator, { keepMounted: true, ...props, ref: ref, className: skin('pui-menu-indicator', className), children: children ?? (_jsx("svg", { width: '16', height: '16', viewBox: '0 0 24 24', fill: 'currentColor', "aria-hidden": 'true', children: _jsx("circle", { cx: '12', cy: '12', r: '4' }) })) }));
 });
-const SubmenuTrigger = React.forwardRef(function SubmenuTrigger({ className, children, indicator, ...props }, ref) {
+const SubmenuTrigger = /* @__PURE__ */ React.forwardRef(function SubmenuTrigger({ className, children, indicator, ...props }, ref) {
     return (_jsxs(BaseMenu.SubmenuTrigger, { ...props, ref: ref, className: skin('pui-menu-item pui-menu-submenu-trigger', className), children: [children, indicator === false
                 ? null
-                : (indicator ?? (_jsx("svg", { className: 'pui-submenu-arrow', width: '16', height: '16', viewBox: '0 0 24 24', fill: 'none', stroke: 'currentColor', strokeWidth: '1.6', "aria-hidden": 'true', children: _jsx("path", { d: 'm9 6 6 6-6 6' }) })))] }));
+                : (indicator ?? (_jsx(Icon, { name: 'chevron-forward', className: 'pui-submenu-arrow' })))] }));
 });
+/** Content brings its own portal; Portal stays for wrapping it, or raw parts. */
+const MenuPortal = /* @__PURE__ */ scopedPortal(BaseMenu.Portal);
 export const Menu = {
     ...BaseMenu,
+    Portal: MenuPortal,
     Content: MenuContent,
     Popup: MenuPopup,
     Positioner: MenuPositioner,
@@ -31,14 +35,14 @@ export const Menu = {
     CheckboxItemIndicator: CheckboxIndicator,
     RadioItemIndicator: RadioIndicator,
     SubmenuTrigger,
-    Item: part(BaseMenu.Item, 'pui-menu-item'),
-    LinkItem: part(BaseMenu.LinkItem, 'pui-menu-item'),
-    CheckboxItem: part(BaseMenu.CheckboxItem, 'pui-menu-item pui-menu-check-item'),
-    RadioItem: part(BaseMenu.RadioItem, 'pui-menu-item pui-menu-check-item'),
-    GroupLabel: part(BaseMenu.GroupLabel, 'pui-menu-group-label'),
-    Separator: part(BaseMenu.Separator, 'pui-menu-separator'),
-    Input: part(BaseMenu.Input, 'pui-input'),
+    Item: /* @__PURE__ */ part(BaseMenu.Item, 'pui-menu-item'),
+    LinkItem: /* @__PURE__ */ part(BaseMenu.LinkItem, 'pui-menu-item'),
+    CheckboxItem: /* @__PURE__ */ part(BaseMenu.CheckboxItem, 'pui-menu-item pui-menu-check-item'),
+    RadioItem: /* @__PURE__ */ part(BaseMenu.RadioItem, 'pui-menu-item pui-menu-check-item'),
+    GroupLabel: /* @__PURE__ */ part(BaseMenu.GroupLabel, 'pui-menu-group-label'),
+    Separator: /* @__PURE__ */ part(BaseMenu.Separator, 'pui-menu-separator'),
+    Input: /* @__PURE__ */ part(BaseMenu.Input, 'pui-input'),
 };
 // Flat names for React Server Components, which cannot dot into client exports.
-export { MenuPopup, MenuPositioner, MenuTrigger, MenuContent };
-export const { Arrow: MenuArrow, Backdrop: MenuBackdrop, CheckboxItem: MenuCheckboxItem, CheckboxItemIndicator: MenuCheckboxItemIndicator, Clear: MenuClear, Empty: MenuEmpty, FilterProvider: MenuFilterProvider, Group: MenuGroup, GroupLabel: MenuGroupLabel, Handle: MenuHandle, Input: MenuInput, Item: MenuItem, LinkItem: MenuLinkItem, List: MenuList, Portal: MenuPortal, RadioGroup: MenuRadioGroup, RadioItem: MenuRadioItem, RadioItemIndicator: MenuRadioItemIndicator, Root: MenuRoot, Separator: MenuSeparator, SubmenuRoot: MenuSubmenuRoot, SubmenuTrigger: MenuSubmenuTrigger, Viewport: MenuViewport, } = Menu;
+export { MenuPopup, MenuPositioner, MenuTrigger, MenuContent, MenuPortal };
+export const { Arrow: MenuArrow, Backdrop: MenuBackdrop, CheckboxItem: MenuCheckboxItem, CheckboxItemIndicator: MenuCheckboxItemIndicator, Clear: MenuClear, Empty: MenuEmpty, FilterProvider: MenuFilterProvider, Group: MenuGroup, GroupLabel: MenuGroupLabel, Handle: MenuHandle, Input: MenuInput, Item: MenuItem, LinkItem: MenuLinkItem, List: MenuList, RadioGroup: MenuRadioGroup, RadioItem: MenuRadioItem, RadioItemIndicator: MenuRadioItemIndicator, Root: MenuRoot, Separator: MenuSeparator, SubmenuRoot: MenuSubmenuRoot, SubmenuTrigger: MenuSubmenuTrigger, Viewport: MenuViewport, } = Menu;

package/dist/menubar.d.ts

@@ -0,0 +1,4 @@
+import * as React from 'react';
+export declare const Menubar: React.ForwardRefExoticComponent<Omit<Omit<Omit<import("@base-ui/react/menubar").MenubarProps, "ref"> & React.RefAttributes<HTMLDivElement>, "ref">, "size"> & {
+    size?: import("./sizing.js").ComponentSize;
+} & React.RefAttributes<HTMLDivElement>>;

package/dist/menubar.js

@@ -0,0 +1,4 @@
+'use client';
+import { Menubar as BaseMenubar } from '@base-ui/react/menubar';
+import { part } from './parts.js';
+export const Menubar = /* @__PURE__ */ part(BaseMenubar, 'pui-menubar');

package/dist/meter.d.ts

@@ -0,0 +1,29 @@
+import * as React from 'react';
+export declare const Meter: {
+    Root: React.ForwardRefExoticComponent<Omit<Omit<Omit<import("@base-ui/react/meter").MeterRootProps, "ref"> & React.RefAttributes<HTMLDivElement>, "ref">, "size"> & {
+        size?: import("./sizing.js").ComponentSize;
+    } & React.RefAttributes<HTMLDivElement>>;
+    Label: React.ForwardRefExoticComponent<Omit<Omit<Omit<import("@base-ui/react/meter").MeterLabelProps, "ref"> & React.RefAttributes<HTMLSpanElement>, "ref">, "size"> & {
+        size?: import("./sizing.js").ComponentSize;
+    } & React.RefAttributes<HTMLSpanElement>>;
+    Value: React.ForwardRefExoticComponent<Omit<Omit<Omit<import("@base-ui/react/meter").MeterValueProps, "ref"> & React.RefAttributes<HTMLSpanElement>, "ref">, "size"> & {
+        size?: import("./sizing.js").ComponentSize;
+    } & React.RefAttributes<HTMLSpanElement>>;
+    Track: React.ForwardRefExoticComponent<Omit<Omit<Omit<import("@base-ui/react/meter").MeterTrackProps, "ref"> & React.RefAttributes<HTMLDivElement>, "ref">, "size"> & {
+        size?: import("./sizing.js").ComponentSize;
+    } & React.RefAttributes<HTMLDivElement>>;
+    Indicator: React.ForwardRefExoticComponent<Omit<Omit<Omit<import("@base-ui/react/meter").MeterIndicatorProps, "ref"> & React.RefAttributes<HTMLDivElement>, "ref">, "size"> & {
+        size?: import("./sizing.js").ComponentSize;
+    } & React.RefAttributes<HTMLDivElement>>;
+};
+export declare const MeterIndicator: React.ForwardRefExoticComponent<Omit<Omit<Omit<import("@base-ui/react/meter").MeterIndicatorProps, "ref"> & React.RefAttributes<HTMLDivElement>, "ref">, "size"> & {
+    size?: import("./sizing.js").ComponentSize;
+} & React.RefAttributes<HTMLDivElement>>, MeterLabel: React.ForwardRefExoticComponent<Omit<Omit<Omit<import("@base-ui/react/meter").MeterLabelProps, "ref"> & React.RefAttributes<HTMLSpanElement>, "ref">, "size"> & {
+    size?: import("./sizing.js").ComponentSize;
+} & React.RefAttributes<HTMLSpanElement>>, MeterRoot: React.ForwardRefExoticComponent<Omit<Omit<Omit<import("@base-ui/react/meter").MeterRootProps, "ref"> & React.RefAttributes<HTMLDivElement>, "ref">, "size"> & {
+    size?: import("./sizing.js").ComponentSize;
+} & React.RefAttributes<HTMLDivElement>>, MeterTrack: React.ForwardRefExoticComponent<Omit<Omit<Omit<import("@base-ui/react/meter").MeterTrackProps, "ref"> & React.RefAttributes<HTMLDivElement>, "ref">, "size"> & {
+    size?: import("./sizing.js").ComponentSize;
+} & React.RefAttributes<HTMLDivElement>>, MeterValue: React.ForwardRefExoticComponent<Omit<Omit<Omit<import("@base-ui/react/meter").MeterValueProps, "ref"> & React.RefAttributes<HTMLSpanElement>, "ref">, "size"> & {
+    size?: import("./sizing.js").ComponentSize;
+} & React.RefAttributes<HTMLSpanElement>>;

package/dist/meter.js

@@ -0,0 +1,13 @@
+'use client';
+import { Meter as BaseMeter } from '@base-ui/react/meter';
+import { part } from './parts.js';
+export const Meter = {
+    ...BaseMeter,
+    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'),
+};
+// Flat names for React Server Components, which cannot dot into client exports.
+export const { Indicator: MeterIndicator, Label: MeterLabel, Root: MeterRoot, Track: MeterTrack, Value: MeterValue, } = Meter;

package/dist/native-select.d.ts

@@ -0,0 +1,8 @@
+import * as React from 'react';
+import { type ComponentSizeAlias } from './sizing.js';
+/** Transitional HTML-option adapter. Submitted values use Base UI's native hidden input. */
+export declare const NativeSelect: React.ForwardRefExoticComponent<Omit<Omit<React.DetailedHTMLProps<React.SelectHTMLAttributes<HTMLSelectElement>, HTMLSelectElement>, "ref">, "size" | "multiple"> & {
+    size?: ComponentSizeAlias;
+} & React.RefAttributes<HTMLButtonElement>>;
+export declare function NativeSelectOption(props: React.ComponentProps<'option'>): React.JSX.Element;
+export declare function NativeSelectOptGroup(props: React.ComponentProps<'optgroup'>): React.JSX.Element;

package/dist/native-select.js

@@ -0,0 +1,54 @@
+'use client';
+import { jsx as _jsx } from "react/jsx-runtime";
+import * as React from 'react';
+import { Select } from './select.js';
+function optionList(children) {
+    return React.Children.toArray(children).flatMap((child) => {
+        if (!React.isValidElement(child))
+            return [];
+        const p = child.props;
+        if (child.type === React.Fragment)
+            return optionList(p.children);
+        // An optgroup keeps its label as a visible group heading.
+        if (child.type === 'optgroup' || child.type === NativeSelectOptGroup)
+            return [
+                {
+                    label: p.label,
+                    options: optionList(p.children).flatMap((item) => 'options' in item ? item.options : [item]),
+                },
+            ];
+        return [
+            {
+                value: String(p.value ?? p.children ?? ''),
+                label: p.label ?? p.children,
+                disabled: p.disabled,
+            },
+        ];
+    });
+}
+/** Transitional HTML-option adapter. Submitted values use Base UI's native hidden input. */
+export const NativeSelect = /* @__PURE__ */ React.forwardRef(function NativeSelect({ children, onChange, value, defaultValue, className, size, ...props }, ref) {
+    const input = React.useRef(null);
+    const options = optionList(children);
+    return (_jsx(Select, { options: options, value: value === undefined ? undefined : String(value), defaultValue: defaultValue === undefined ? undefined : String(defaultValue), className: className, size: size, inputRef: input, triggerRef: ref, name: props.name, form: props.form, disabled: props.disabled, required: props.required, id: props.id, "aria-label": props['aria-label'], "aria-labelledby": props['aria-labelledby'], "aria-describedby": props['aria-describedby'], "aria-invalid": props['aria-invalid'], onValueChange: (next) => {
+            if (!onChange)
+                return;
+            const target = input.current;
+            if (!target)
+                return;
+            const setter = Object.getOwnPropertyDescriptor(HTMLInputElement.prototype, 'value')?.set;
+            setter?.call(target, next);
+            const event = new Event('change', { bubbles: true });
+            Object.defineProperties(event, {
+                target: { value: target },
+                currentTarget: { value: target },
+            });
+            onChange(event);
+        } }));
+});
+export function NativeSelectOption(props) {
+    return _jsx("option", { ...props });
+}
+export function NativeSelectOptGroup(props) {
+    return _jsx("optgroup", { ...props });
+}

package/dist/navigation-menu.js

@@ -1,30 +1,33 @@
 'use client';
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import * as React from 'react';
+import { Icon } from './icon.js';
 import { NavigationMenu as BaseNavigationMenu } from '@base-ui/react/navigation-menu';
 import { part, skin } from './parts.js';
 function Root(props) {
     const { className, orientation = 'horizontal', ...rest } = props;
     return (_jsx(BaseNavigationMenu.Root, { ...rest, orientation: orientation, "data-orientation": orientation, className: skin('pui-navigation-menu', className) }));
 }
-const Trigger = React.forwardRef(function Trigger({ className, children, indicator, ...props }, ref) {
+const Trigger = /* @__PURE__ */ React.forwardRef(function Trigger({ className, children, indicator, ...props }, ref) {
     return (_jsxs(BaseNavigationMenu.Trigger, { "data-variant": 'ghost', ...props, ref: ref, className: skin('pui-button pui-navigation-trigger', className), children: [children, indicator === false
                 ? null
-                : (indicator ?? (_jsx(BaseNavigationMenu.Icon, { className: 'pui-navigation-icon', children: _jsx("svg", { width: '16', height: '16', viewBox: '0 0 24 24', fill: 'none', stroke: 'currentColor', strokeWidth: '1.6', "aria-hidden": 'true', children: _jsx("path", { d: 'm6 9 6 6 6-6' }) }) })))] }));
+                : (indicator ?? (_jsx(BaseNavigationMenu.Icon, { className: 'pui-navigation-icon', children: _jsx(Icon, { name: 'chevron-down' }) })))] }));
 });
 export const NavigationMenu = {
     ...BaseNavigationMenu,
     Root,
     Trigger,
-    List: part(BaseNavigationMenu.List, 'pui-navigation-list'),
-    Item: part(BaseNavigationMenu.Item, 'pui-navigation-item'),
-    Link: part(BaseNavigationMenu.Link, 'pui-navigation-link'),
-    Content: part(BaseNavigationMenu.Content, 'pui-navigation-content'),
-    Positioner: part(BaseNavigationMenu.Positioner, 'pui-positioner pui-navigation-positioner'),
-    Popup: part(BaseNavigationMenu.Popup, 'pui-navigation-popup'),
-    Viewport: part(BaseNavigationMenu.Viewport, 'pui-navigation-viewport'),
-    Icon: React.forwardRef(function Icon({ children, className, ...props }, ref) {
-        return (_jsx(BaseNavigationMenu.Icon, { ...props, ref: ref, className: skin('pui-navigation-icon', className), children: children ?? (_jsx("svg", { width: '16', height: '16', viewBox: '0 0 24 24', fill: 'none', stroke: 'currentColor', strokeWidth: '1.6', "aria-hidden": 'true', children: _jsx("path", { d: 'm6 9 6 6 6-6' }) })) }));
+    List: /* @__PURE__ */ part(BaseNavigationMenu.List, 'pui-navigation-list'),
+    Item: /* @__PURE__ */ part(BaseNavigationMenu.Item, 'pui-navigation-item'),
+    Link: /* @__PURE__ */ part(BaseNavigationMenu.Link, 'pui-navigation-link'),
+    Content: /* @__PURE__ */ part(BaseNavigationMenu.Content, 'pui-navigation-content'),
+    Positioner: /* @__PURE__ */ part(BaseNavigationMenu.Positioner, 'pui-positioner pui-navigation-positioner', {
+        portal: true,
+    }),
+    Popup: /* @__PURE__ */ part(BaseNavigationMenu.Popup, 'pui-navigation-popup', { portal: true }),
+    Viewport: /* @__PURE__ */ part(BaseNavigationMenu.Viewport, 'pui-navigation-viewport'),
+    Icon: /* @__PURE__ */ React.forwardRef(function NavigationMenuIcon({ children, className, ...props }, ref) {
+        return (_jsx(BaseNavigationMenu.Icon, { ...props, ref: ref, className: skin('pui-navigation-icon', className), children: children ?? _jsx(Icon, { name: 'chevron-down' }) }));
     }),
 };
 // Flat names for React Server Components, which cannot dot into client exports.

package/dist/number-field.d.ts

@@ -0,0 +1,23 @@
+import * as React from 'react';
+export declare const NumberField: {
+    Root: React.ForwardRefExoticComponent<Omit<Omit<import("@base-ui/react/number-field").NumberFieldRootProps, "ref"> & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
+    Increment: React.ForwardRefExoticComponent<Omit<Omit<import("@base-ui/react/number-field").NumberFieldIncrementProps, "ref"> & React.RefAttributes<HTMLButtonElement>, "ref"> & React.RefAttributes<HTMLButtonElement>>;
+    Decrement: React.ForwardRefExoticComponent<Omit<Omit<import("@base-ui/react/number-field").NumberFieldDecrementProps, "ref"> & React.RefAttributes<HTMLButtonElement>, "ref"> & React.RefAttributes<HTMLButtonElement>>;
+    Group: React.ForwardRefExoticComponent<Omit<Omit<Omit<import("@base-ui/react/number-field").NumberFieldGroupProps, "ref"> & React.RefAttributes<HTMLDivElement>, "ref">, "size"> & {
+        size?: import("./sizing.js").ComponentSize;
+    } & React.RefAttributes<HTMLDivElement>>;
+    Input: React.ForwardRefExoticComponent<Omit<Omit<Omit<import("@base-ui/react/number-field").NumberFieldInputProps, "ref"> & React.RefAttributes<HTMLInputElement>, "ref">, "size"> & {
+        size?: import("./sizing.js").ComponentSize;
+    } & React.RefAttributes<HTMLInputElement>>;
+    ScrubArea: React.ForwardRefExoticComponent<Omit<Omit<Omit<import("@base-ui/react/number-field").NumberFieldScrubAreaProps, "ref"> & React.RefAttributes<HTMLSpanElement>, "ref">, "size"> & {
+        size?: import("./sizing.js").ComponentSize;
+    } & React.RefAttributes<HTMLSpanElement>>;
+    ScrubAreaCursor: React.ForwardRefExoticComponent<Omit<import("@base-ui/react/number-field").NumberFieldScrubAreaCursorProps, "ref"> & React.RefAttributes<HTMLSpanElement>>;
+};
+export declare const NumberFieldDecrement: React.ForwardRefExoticComponent<Omit<Omit<import("@base-ui/react/number-field").NumberFieldDecrementProps, "ref"> & React.RefAttributes<HTMLButtonElement>, "ref"> & React.RefAttributes<HTMLButtonElement>>, NumberFieldGroup: React.ForwardRefExoticComponent<Omit<Omit<Omit<import("@base-ui/react/number-field").NumberFieldGroupProps, "ref"> & React.RefAttributes<HTMLDivElement>, "ref">, "size"> & {
+    size?: import("./sizing.js").ComponentSize;
+} & React.RefAttributes<HTMLDivElement>>, NumberFieldIncrement: React.ForwardRefExoticComponent<Omit<Omit<import("@base-ui/react/number-field").NumberFieldIncrementProps, "ref"> & React.RefAttributes<HTMLButtonElement>, "ref"> & React.RefAttributes<HTMLButtonElement>>, NumberFieldInput: React.ForwardRefExoticComponent<Omit<Omit<Omit<import("@base-ui/react/number-field").NumberFieldInputProps, "ref"> & React.RefAttributes<HTMLInputElement>, "ref">, "size"> & {
+    size?: import("./sizing.js").ComponentSize;
+} & React.RefAttributes<HTMLInputElement>>, NumberFieldRoot: React.ForwardRefExoticComponent<Omit<Omit<import("@base-ui/react/number-field").NumberFieldRootProps, "ref"> & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>, NumberFieldScrubArea: React.ForwardRefExoticComponent<Omit<Omit<Omit<import("@base-ui/react/number-field").NumberFieldScrubAreaProps, "ref"> & React.RefAttributes<HTMLSpanElement>, "ref">, "size"> & {
+    size?: import("./sizing.js").ComponentSize;
+} & React.RefAttributes<HTMLSpanElement>>, NumberFieldScrubAreaCursor: React.ForwardRefExoticComponent<Omit<import("@base-ui/react/number-field").NumberFieldScrubAreaCursorProps, "ref"> & React.RefAttributes<HTMLSpanElement>>;

package/dist/number-field.js

@@ -0,0 +1,33 @@
+'use client';
+import { jsx as _jsx } from "react/jsx-runtime";
+import * as React from 'react';
+import { Icon } from './icon.js';
+import { NumberField as BaseNumberField } from '@base-ui/react/number-field';
+import { part, skin } from './parts.js';
+import { useRootRef, useResetValue } from './form-state.js';
+const NumberRoot = /* @__PURE__ */ React.forwardRef(function NumberRoot({ value, defaultValue, onValueChange, className, form, ...props }, ref) {
+    const [element, attach] = useRootRef(ref);
+    const [numeric, setNumeric] = useResetValue(value, defaultValue ?? null, element, form);
+    return (_jsx(BaseNumberField.Root, { ...props, form: form, ref: attach, value: numeric, className: skin('pui-number-field', className), onValueChange: (next, event) => {
+            onValueChange?.(next, event);
+            if (value === undefined && !event.isCanceled)
+                setNumeric(next);
+        } }));
+});
+const NumberIncrement = /* @__PURE__ */ React.forwardRef(function NumberIncrement({ className, children, ...props }, ref) {
+    return (_jsx(BaseNumberField.Increment, { "aria-label": 'Increase value', ...props, ref: ref, className: skin('pui-number-step', className), children: children ?? _jsx(Icon, { name: 'plus' }) }));
+});
+const NumberDecrement = /* @__PURE__ */ React.forwardRef(function NumberDecrement({ className, children, ...props }, ref) {
+    return (_jsx(BaseNumberField.Decrement, { "aria-label": 'Decrease value', ...props, ref: ref, className: skin('pui-number-step', className), children: children ?? _jsx(Icon, { name: 'minus' }) }));
+});
+export const NumberField = {
+    ...BaseNumberField,
+    Root: NumberRoot,
+    Increment: NumberIncrement,
+    Decrement: NumberDecrement,
+    Group: /* @__PURE__ */ part(BaseNumberField.Group, 'pui-number-group'),
+    Input: /* @__PURE__ */ part(BaseNumberField.Input, 'pui-number-input'),
+    ScrubArea: /* @__PURE__ */ part(BaseNumberField.ScrubArea, 'pui-number-scrub'),
+};
+// Flat names for React Server Components, which cannot dot into client exports.
+export const { Decrement: NumberFieldDecrement, Group: NumberFieldGroup, Increment: NumberFieldIncrement, Input: NumberFieldInput, Root: NumberFieldRoot, ScrubArea: NumberFieldScrubArea, ScrubAreaCursor: NumberFieldScrubAreaCursor, } = NumberField;

package/dist/otp-field.js

@@ -5,7 +5,7 @@ import { useRender } from '@base-ui/react/use-render';
 import { OTPField as BaseOTPField } from '@base-ui/react/otp-field';
 import { part, skin } from './parts.js';
 import { useResetValue, useRootRef } from './form-state.js';
-const Root = React.forwardRef(function Root({ value, defaultValue = '', form, onValueChange, className, ...props }, forwardedRef) {
+const Root = /* @__PURE__ */ React.forwardRef(function Root({ value, defaultValue = '', form, onValueChange, className, ...props }, forwardedRef) {
     const [element, ref] = useRootRef(forwardedRef);
     const [local, setLocal, revision] = useResetValue(value, defaultValue, element, form);
     return (_jsx(BaseOTPField.Root, { ...props, ref: ref, form: form, value: local, className: skin('pui-otp-field', className), onValueChange: (next, event) => {
@@ -14,7 +14,7 @@ const Root = React.forwardRef(function Root({ value, defaultValue = '', form, on
                 setLocal(next);
         } }, revision));
 });
-const Separator = React.forwardRef(function Separator({ className, ...props }, ref) {
+const Separator = /* @__PURE__ */ React.forwardRef(function Separator({ className, ...props }, ref) {
     return (_jsx(BaseOTPField.Separator, { "aria-hidden": 'true', ...props, ref: ref, className: skin('pui-otp-separator', className) }));
 });
 // Preserve Base UI's DOM refs and user render composition while fixing native-validation ARIA.
@@ -32,14 +32,14 @@ function SlotElement({ domProps, state, render, }) {
         },
     });
 }
-const Input = React.forwardRef(function Input({ render, className, ...props }, ref) {
+const Input = /* @__PURE__ */ React.forwardRef(function Input({ render, className, ...props }, ref) {
     return (_jsx(BaseOTPField.Input, { ...props, ref: ref, className: skin('pui-input pui-otp-input', className), render: (domProps, state) => (_jsx(SlotElement, { domProps: domProps, state: state, render: render })) }));
 });
 export const OTPField = {
     ...BaseOTPField,
     Root,
     Input,
-    Group: part('div', 'pui-otp-group'),
+    Group: /* @__PURE__ */ part('div', 'pui-otp-group'),
     Separator,
 };
 // Flat names for React Server Components, which cannot dot into client exports.

package/dist/page-header.d.ts

@@ -0,0 +1,12 @@
+import * as React from 'react';
+export declare function PageHeader({ as: Root, headingProps, actionsLabel, title, description, breadcrumb, actions, level, size, className, ...props }: Omit<React.ComponentProps<'div'>, 'title'> & {
+    as?: 'div' | 'header';
+    headingProps?: Omit<React.HTMLAttributes<HTMLHeadingElement>, 'children' | 'dangerouslySetInnerHTML'>;
+    actionsLabel?: string;
+    title: React.ReactNode;
+    description?: React.ReactNode;
+    breadcrumb?: React.ReactNode;
+    actions?: React.ReactNode;
+    level?: 1 | 2 | 3 | 4 | 5 | 6;
+    size?: 'title' | 'page' | 'workspace' | 'document';
+}): React.JSX.Element;

package/dist/page-header.js

@@ -0,0 +1,9 @@
+'use client';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { cx } from './parts.js';
+import { Heading, Text } from './typography.js';
+export function PageHeader({ as: Root = 'div', headingProps, actionsLabel, title, description, breadcrumb, actions, level = 1, size = 'title', className, ...props }) {
+    return (_jsxs(Root, { ...props, className: cx('pui-page-header', className), children: [breadcrumb != null && breadcrumb !== false && breadcrumb !== '' && (_jsx("div", { className: 'pui-page-header-breadcrumb', children: breadcrumb })), _jsxs("div", { className: 'pui-page-header-content', children: [_jsxs("div", { className: 'pui-page-header-copy', children: [_jsx(Heading, { ...headingProps, level: level, size: size, children: title }), description != null &&
+                                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 }))] })] }));
+}

package/dist/pagination.js

@@ -1,11 +1,10 @@
 'use client';
 import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
 import * as React from 'react';
+import { Icon } from './icon.js';
 import { Button } from './button.js';
-function Chevron({ next = false }) {
-    return (_jsx("svg", { className: 'pui-pagination-arrow', width: '16', height: '16', viewBox: '0 0 24 24', fill: 'none', stroke: 'currentColor', strokeWidth: '1.6', "aria-hidden": 'true', children: _jsx("path", { d: next ? 'm9 6 6 6-6 6' : 'm15 6-6 6 6 6' }) }));
-}
-export const Pagination = React.forwardRef(function Pagination({ page, pageCount, siblings = 1, disabled = false, labels, getPageHref, onPageChange, className, 'aria-label': ariaLabel = 'Pagination', ...props }, ref) {
+import { cx } from './parts.js';
+export const Pagination = /* @__PURE__ */ React.forwardRef(function Pagination({ page, pageCount, siblings = 1, disabled = false, labels, getPageHref, onPageChange, className, 'aria-label': ariaLabel = 'Pagination', ...props }, ref) {
     const count = Number.isFinite(pageCount)
         ? Math.min(Number.MAX_SAFE_INTEGER, Math.max(0, Math.floor(pageCount)))
         : 0;
@@ -40,5 +39,5 @@ export const Pagination = React.forwardRef(function Pagination({ page, pageCount
                     onPageChange?.(target);
             }, children: children }));
     }
-    return (_jsxs("nav", { ...props, ref: ref, "aria-label": ariaLabel, className: ['pui-pagination', className].filter(Boolean).join(' '), children: [control(Math.max(1, current - 1), labels?.previous ?? 'Previous page', _jsxs(_Fragment, { children: [_jsx(Chevron, {}), _jsx("span", { children: labels?.previous ?? 'Previous page' })] }), current === 1), _jsx("span", { className: 'pui-pagination-summary', children: labels?.summary?.(current, count) ?? `Page ${current} of ${count}` }), _jsx("ul", { role: 'list', className: 'pui-pagination-list', children: items.map((item) => (_jsx("li", { children: typeof item === 'number' ? (control(item, labels?.page?.(item) ?? `Page ${item}`, item)) : (_jsxs("span", { className: 'pui-pagination-gap', children: [_jsxs("svg", { width: '16', height: '16', viewBox: '0 0 24 24', fill: 'currentColor', "aria-hidden": 'true', children: [_jsx("circle", { cx: '5', cy: '12', r: '1.5' }), _jsx("circle", { cx: '12', cy: '12', r: '1.5' }), _jsx("circle", { cx: '19', cy: '12', r: '1.5' })] }), _jsx("span", { className: 'pui-feedback-sr', children: labels?.more ?? 'More pages' })] })) }, item))) }), control(Math.min(count, current + 1), labels?.next ?? 'Next page', _jsxs(_Fragment, { children: [_jsx("span", { children: labels?.next ?? 'Next page' }), _jsx(Chevron, { next: true })] }), current === count)] }));
+    return (_jsxs("nav", { ...props, ref: ref, "aria-label": ariaLabel, className: cx('pui-pagination', className), children: [control(Math.max(1, current - 1), labels?.previous ?? 'Previous page', _jsxs(_Fragment, { children: [_jsx(Icon, { name: 'chevron-back', className: 'pui-pagination-arrow' }), _jsx("span", { children: labels?.previous ?? 'Previous page' })] }), current === 1), _jsx("span", { className: 'pui-pagination-summary', children: labels?.summary?.(current, count) ?? `Page ${current} of ${count}` }), _jsx("ul", { role: 'list', className: 'pui-pagination-list', children: items.map((item) => (_jsx("li", { children: typeof item === 'number' ? (control(item, labels?.page?.(item) ?? `Page ${item}`, item)) : (_jsxs("span", { className: 'pui-pagination-gap', children: [_jsx(Icon, { name: 'more' }), _jsx("span", { className: 'pui-feedback-sr', children: labels?.more ?? 'More pages' })] })) }, item))) }), control(Math.min(count, current + 1), labels?.next ?? 'Next page', _jsxs(_Fragment, { children: [_jsx("span", { children: labels?.next ?? 'Next page' }), _jsx(Icon, { name: 'chevron-forward', className: 'pui-pagination-arrow' })] }), current === count)] }));
 });

package/dist/panel.d.ts

@@ -0,0 +1,13 @@
+import * as React from 'react';
+import { type ComponentSizeAlias } from './sizing.js';
+export type PanelSide = 'left' | 'right' | 'top' | 'bottom';
+export type PanelOptions = {
+    size?: ComponentSizeAlias;
+    closeLabel?: string;
+    /** Attaches the panel to its edge: no gap, and square corners on that edge, as a
+     * mobile bottom sheet sits. */
+    flush?: boolean;
+};
+export declare function Header({ className, ...props }: React.ComponentProps<'div'>): React.JSX.Element;
+export declare const Body: React.ForwardRefExoticComponent<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
+export declare function Footer({ className, ...props }: React.ComponentProps<'div'>): React.JSX.Element;

package/dist/panel.js

@@ -0,0 +1,13 @@
+'use client';
+import { jsx as _jsx } from "react/jsx-runtime";
+import * as React from 'react';
+import { cx } from './parts.js';
+export function Header({ className, ...props }) {
+    return _jsx("div", { ...props, className: cx('pui-panel-header', className) });
+}
+export const Body = /* @__PURE__ */ React.forwardRef(function Body({ className, ...props }, ref) {
+    return (_jsx("div", { ...props, ref: ref, className: cx('pui-panel-body', className) }));
+});
+export function Footer({ className, ...props }) {
+    return _jsx("div", { ...props, className: cx('pui-panel-footer', className) });
+}

package/dist/parts.d.ts

@@ -1,9 +1,30 @@
 import { type ComponentSize } from './sizing.js';
 import * as React from 'react';
+/** Joins class names, skipping empty ones. */
+export declare function cx(...classes: (string | false | null | undefined)[]): string;
+/** The data-size value: a short alias (sm, md, lg) renders as its full name, so both
+ * spellings meet the same CSS; other values such as xs or icon pass through. */
+export declare function sizeName<Size extends string>(size?: Size): ComponentSize | Size | undefined;
 /** Preserve Base UI's state-dependent className contract when adding a skin. */
 export declare function skin<State>(base: string, custom?: string | ((state: State) => string | undefined)): string | ((state: State) => string);
+/** A styled Base UI part or element. A portal part renders outside the tree that sets
+ * data-ui-size, so it always carries the size scheme; other parts carry it only when
+ * size is set. */
 export declare function part<Element extends HTMLElement, Props extends {
     className?: unknown;
-}>(Component: React.ElementType, base: string): React.ForwardRefExoticComponent<React.PropsWithoutRef<Omit<Props, "size"> & {
+}>(Component: React.ElementType, base: string, { portal }?: {
+    portal?: boolean;
+}): React.ForwardRefExoticComponent<React.PropsWithoutRef<Omit<Props, "size"> & {
     size?: ComponentSize;
 }> & React.RefAttributes<Element>>;
+/** A namespace Portal that marks its subtree as already portalled. */
+export declare function scopedPortal<Portal extends React.ElementType>(BasePortal: Portal): Portal;
+/** Renders a Content's positioner in its portal, unless a namespace Portal holds it. */
+export declare function OwnPortal({ portal: BasePortal, children, }: {
+    portal: React.ElementType;
+    children: React.ReactNode;
+}): React.JSX.Element;
+/** Drops undefined entries, so explicit placement props override defaults only when set. */
+export declare function defined<Props extends object>(props: Props): Partial<Props>;
+/** The placement props a popup Content passes to its Positioner. */
+export type Placement<Positioner extends React.ElementType> = Pick<React.ComponentPropsWithoutRef<Positioner>, 'side' | 'align' | 'sideOffset' | 'collisionPadding'>;