@funstack/ui 0.1.0-alpha.5 → 0.1.0-alpha.6

package/dist/accordion/accordion-item.mjs

@@ -1,8 +1,8 @@
 "use client";
-import { useTransitionBoundary } from "../internal/transition-boundary.mjs";
 import { dataAttr } from "../internal/data-attr.mjs";
-import { useRender } from "../internal/use-render.mjs";
+import { useTransitionBoundary } from "../internal/transition-boundary.mjs";
 import { useDevWarning } from "../internal/use-dev-warning.mjs";
+import { useRender } from "../internal/use-render.mjs";
 import { AccordionItemContext, AccordionRootContext } from "./accordion-context.mjs";
 import { use, useCallback, useMemo, useState } from "react";
 import { jsx } from "react/jsx-runtime";

package/dist/accordion/accordion-panel.mjs

@@ -1,8 +1,8 @@
 "use client";
-import { useTransitionBoundary } from "../internal/transition-boundary.mjs";
 import { dataAttr } from "../internal/data-attr.mjs";
-import { useRender } from "../internal/use-render.mjs";
+import { useTransitionBoundary } from "../internal/transition-boundary.mjs";
 import { useDevWarning } from "../internal/use-dev-warning.mjs";
+import { useRender } from "../internal/use-render.mjs";
 import { AccordionItemContext } from "./accordion-context.mjs";
 import { use } from "react";
 //#region src/accordion/accordion-panel.tsx

package/dist/accordion/accordion-root.mjs

@@ -1,12 +1,12 @@
 "use client";
 import { createActionDetails } from "../internal/action-details.mjs";
 import { dataAttr } from "../internal/data-attr.mjs";
+import { useDevWarning } from "../internal/use-dev-warning.mjs";
+import { resolveStateValue } from "../internal/render-element.mjs";
+import { useRender } from "../internal/use-render.mjs";
 import { transitionTypes } from "../internal/transition-types.mjs";
 import { useLatest } from "../internal/use-latest.mjs";
 import { useControllableAction } from "../internal/use-controllable-action.mjs";
-import { resolveStateValue } from "../internal/render-element.mjs";
-import { useRender } from "../internal/use-render.mjs";
-import { useDevWarning } from "../internal/use-dev-warning.mjs";
 import { AccordionRootContext } from "./accordion-context.mjs";
 import { useCallback, useEffectEvent, useId, useLayoutEffect, useMemo, useRef, useState } from "react";
 import { jsx } from "react/jsx-runtime";

package/dist/accordion/accordion-trigger.mjs

@@ -1,8 +1,8 @@
 "use client";
-import { useTransitionBoundary } from "../internal/transition-boundary.mjs";
 import { dataAttr } from "../internal/data-attr.mjs";
-import { useRender } from "../internal/use-render.mjs";
+import { useTransitionBoundary } from "../internal/transition-boundary.mjs";
 import { useDevWarning } from "../internal/use-dev-warning.mjs";
+import { useRender } from "../internal/use-render.mjs";
 import { AccordionItemContext } from "./accordion-context.mjs";
 import { use, useCallback } from "react";
 //#region src/accordion/accordion-trigger.tsx

package/dist/button/button.d.mts

@@ -0,0 +1,78 @@
+import { Action, ActionDetails, RenderProp, StateValue } from "../internal/types.mjs";
+import { CSSProperties, ComponentPropsWithRef, ReactNode, ViewTransitionClass } from "react";
+//#region src/button/button.d.ts
+/** Details passed to `Button`'s `action`. Serialisable; `event` is virtual (conventions 2.2). */
+export interface ButtonActionDetails extends ActionDetails {}
+export interface ButtonState {
+  /**
+   * This Button's own `action` is in flight, or a submission it started through its own
+   * function `formAction` is pending.
+   */
+  readonly pending: boolean;
+  /** The `disabled` prop. Not set by pending. */
+  readonly disabled: boolean;
+}
+export interface ButtonProps extends Omit<ComponentPropsWithRef<"button">, "onClick" | "aria-disabled" | "className" | "style" | "children" | "type" | "formAction"> {
+  /**
+   * Runs inside this Button's own transition on click, Enter or Space (`data-pending`
+   * meanwhile). Sync or async; may be a Server Function. A rejection reaches the nearest Error
+   * Boundary above the Button. While it is pending the Button ignores further activation and
+   * renders `aria-disabled="true"`. Not combinable with `formAction` (development error).
+   */
+  action?: Action<[details: ButtonActionDetails]>;
+  /**
+   * React's `formAction`: a function (a Server Function, a `useActionState` dispatch, a client
+   * function) or a URL, run by React instead of the form's `action` when this Button submits the
+   * form. With a function, the Button is `pending` while its own submission runs (not while
+   * another submitter's does), ignores further activation meanwhile, and defaults to
+   * `type="submit"`.
+   */
+  formAction?: ComponentPropsWithRef<"button">["formAction"];
+  /**
+   * Default `"button"`, or `"submit"` when `formAction` is given. Owned on a `<button>` and on a
+   * component `render` element (set it here, not on the element; a component should spread it);
+   * omitted for a host element of another tag (`<a>`). `action` together with
+   * `"submit"` / `"reset"` warns in development: one click would do two things.
+   */
+  type?: "button" | "submit" | "reset";
+  /**
+   * Native `disabled` (owned; a `render` element cannot re-enable it) and `data-disabled`.
+   * Never dispatches. With `focusableWhenDisabled`, inside a `Toolbar.Root`, or when the
+   * rendered element is not a host `<button>` (`render={<a href />}`, a component), renders
+   * `aria-disabled="true"` instead.
+   */
+  disabled?: boolean;
+  /**
+   * Keep a disabled Button focusable: `aria-disabled="true"` instead of native `disabled`, so
+   * keyboard and screen-reader users still find it and a Tooltip on it still opens. Default
+   * `false`; implied `true` inside a `Toolbar.Root` (APG Toolbar) and for a `render` element that
+   * is not a host `<button>`.
+   */
+  focusableWhenDisabled?: boolean;
+  /**
+   * Forwarded as `default` to the Button's `<ViewTransition>`: animates the commit that ends the
+   * action (content keyed on `pending`), not a click. Static; any value makes a mount inside a
+   * transition start a document view transition (issue #35).
+   */
+  transition?: ViewTransitionClass;
+  className?: StateValue<string | undefined, ButtonState>;
+  style?: StateValue<CSSProperties | undefined, ButtonState>;
+  children?: StateValue<ReactNode, ButtonState>;
+  render?: RenderProp<ComponentPropsWithRef<"button">, ButtonState>;
+}
+/**
+ * A button whose click is a transition (design/components/button.md): `<button type="button">`
+ * that runs `action` in its own transition, with `data-pending` and `aria-disabled="true"` while
+ * it runs, and ignores further activation meanwhile (conventions 2.5). With a function
+ * `formAction` it is a form submitter with its own per-submitter pending. Inside a
+ * `Toolbar.Root` a disabled Button stays focusable (`aria-disabled`).
+ *
+ * Owned keys (conventions 1.2): `type` (on a `<button>` only), `disabled`, `aria-disabled`,
+ * `data-pending`, `data-disabled`, `onClick`.
+ */
+export declare function Button({ action, formAction, type, disabled, focusableWhenDisabled, transition, className, style, children, render, ...rest }: ButtonProps): ReactNode;
+export declare namespace Button {
+  var displayName: string;
+}
+//#endregion
+//# sourceMappingURL=button.d.mts.map

package/dist/button/button.d.mts.map

@@ -0,0 +1 @@
+{"version":3,"file":"button.d.mts","names":[],"sources":["../../src/button/button.tsx"],"mappings":";;;;iBAoBiB,4BAA4B;iBAE5B;;;;;WAKN;;WAEA;;iBAGM,oBAAoB,KACnC;;;;;;;EASA,SAAS,QAAQ,SAAS;;;;;;;;EAQ1B,aAAa;;;;;;;EAOb;;;;;;;EAOA;;;;;;;EAOA;;;;;;EAMA,aAAa;EACb,YAAY,+BAA+B;EAC3C,QAAQ,WAAW,2BAA2B;EAC9C,WAAW,WAAW,WAAW;EACjC,SAAS,WAAW,iCAAiC;;;;;;;;;;;;wBAavC,SACd,QACA,YACA,MACA,UACA,uBACA,YACA,WACA,OACA,UACA,WACG,QACF,cAAW;yBAZE"}

package/dist/button/button.mjs

@@ -0,0 +1,77 @@
+"use client";
+import { createActionDetails } from "../internal/action-details.mjs";
+import { dataAttr } from "../internal/data-attr.mjs";
+import { useToolbarContext } from "../internal/toolbar-context.mjs";
+import { useTransitionBoundary } from "../internal/transition-boundary.mjs";
+import { useActionTrigger } from "../internal/use-action-trigger.mjs";
+import { useDevWarning } from "../internal/use-dev-warning.mjs";
+import { isHostButton, rendersButton } from "../internal/render-element.mjs";
+import { useRender } from "../internal/use-render.mjs";
+import { useRef } from "react";
+import { useFormStatus } from "react-dom";
+//#region src/button/button.tsx
+/**
+* A button whose click is a transition (design/components/button.md): `<button type="button">`
+* that runs `action` in its own transition, with `data-pending` and `aria-disabled="true"` while
+* it runs, and ignores further activation meanwhile (conventions 2.5). With a function
+* `formAction` it is a form submitter with its own per-submitter pending. Inside a
+* `Toolbar.Root` a disabled Button stays focusable (`aria-disabled`).
+*
+* Owned keys (conventions 1.2): `type` (on a `<button>` only), `disabled`, `aria-disabled`,
+* `data-pending`, `data-disabled`, `onClick`.
+*/
+function Button({ action, formAction, type, disabled = false, focusableWhenDisabled = false, transition, className, style, children, render, ...rest }) {
+	const toolbar = useToolbarContext();
+	const focusable = focusableWhenDisabled || toolbar !== null || !isHostButton(render);
+	const { pending: ownPending, run } = useActionTrigger({ ignoreWhilePending: true });
+	const status = useFormStatus();
+	const submittedWith = useRef(void 0);
+	const formPending = status.pending && typeof formAction === "function" && (status.action === formAction || status.action === submittedWith.current);
+	const pending = ownPending || formPending;
+	useDevWarning(action !== void 0 && formAction !== void 0, "Button: `action` and `formAction` were both given. One click would run two actions; the Button runs `action` and leaves `formAction` to the form submission. Pass one of them.");
+	useDevWarning(action !== void 0 && (type === "submit" || type === "reset"), `Button: \`action\` together with type="${type}". One click would run \`action\` in a transition and ${type === "reset" ? "reset" : "submit"} the form. Use \`formAction\` for a submitter, or drop \`type\`.`);
+	const element = useRender({
+		defaultElement: "button",
+		render,
+		state: {
+			pending,
+			disabled
+		},
+		className,
+		style,
+		children,
+		props: formAction === void 0 ? rest : {
+			...rest,
+			formAction
+		},
+		libraryProps: {
+			...rendersButton(render) && { type: type ?? (formAction !== void 0 ? "submit" : "button") },
+			disabled: disabled && !focusable ? true : void 0,
+			"aria-disabled": pending || disabled && focusable ? true : void 0,
+			"data-pending": dataAttr(pending),
+			"data-disabled": dataAttr(disabled),
+			onClick: (event) => {
+				if (disabled) {
+					event.preventDefault();
+					return;
+				}
+				if (action === void 0) {
+					if (formPending) {
+						event.preventDefault();
+						return;
+					}
+					submittedWith.current = formAction;
+					return;
+				}
+				const details = createActionDetails(event.nativeEvent, {});
+				if (!run(() => action(details))) event.preventDefault();
+			}
+		}
+	});
+	return useTransitionBoundary("Button", transition, element);
+}
+Button.displayName = "Button";
+//#endregion
+export { Button };
+
+//# sourceMappingURL=button.mjs.map

package/dist/button/button.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"button.mjs","names":[],"sources":["../../src/button/button.tsx"],"sourcesContent":["\"use client\";\nimport { useRef } from \"react\";\nimport type {\n  ComponentPropsWithRef,\n  CSSProperties,\n  MouseEvent,\n  ReactNode,\n  ViewTransitionClass,\n} from \"react\";\nimport { useFormStatus } from \"react-dom\";\nimport { createActionDetails } from \"../internal/action-details.js\";\nimport { dataAttr } from \"../internal/data-attr.js\";\nimport { useToolbarContext } from \"../internal/toolbar-context.js\";\nimport { useTransitionBoundary } from \"../internal/transition-boundary.js\";\nimport type { Action, ActionDetails, RenderProp, StateValue } from \"../internal/types.js\";\nimport { useActionTrigger } from \"../internal/use-action-trigger.js\";\nimport { useDevWarning } from \"../internal/use-dev-warning.js\";\nimport { isHostButton, rendersButton, useRender } from \"../internal/use-render.js\";\n\n/** Details passed to `Button`'s `action`. Serialisable; `event` is virtual (conventions 2.2). */\nexport interface ButtonActionDetails extends ActionDetails {}\n\nexport interface ButtonState {\n  /**\n   * This Button's own `action` is in flight, or a submission it started through its own\n   * function `formAction` is pending.\n   */\n  readonly pending: boolean;\n  /** The `disabled` prop. Not set by pending. */\n  readonly disabled: boolean;\n}\n\nexport interface ButtonProps extends Omit<\n  ComponentPropsWithRef<\"button\">,\n  \"onClick\" | \"aria-disabled\" | \"className\" | \"style\" | \"children\" | \"type\" | \"formAction\"\n> {\n  /**\n   * Runs inside this Button's own transition on click, Enter or Space (`data-pending`\n   * meanwhile). Sync or async; may be a Server Function. A rejection reaches the nearest Error\n   * Boundary above the Button. While it is pending the Button ignores further activation and\n   * renders `aria-disabled=\"true\"`. Not combinable with `formAction` (development error).\n   */\n  action?: Action<[details: ButtonActionDetails]>;\n  /**\n   * React's `formAction`: a function (a Server Function, a `useActionState` dispatch, a client\n   * function) or a URL, run by React instead of the form's `action` when this Button submits the\n   * form. With a function, the Button is `pending` while its own submission runs (not while\n   * another submitter's does), ignores further activation meanwhile, and defaults to\n   * `type=\"submit\"`.\n   */\n  formAction?: ComponentPropsWithRef<\"button\">[\"formAction\"];\n  /**\n   * Default `\"button\"`, or `\"submit\"` when `formAction` is given. Owned on a `<button>` and on a\n   * component `render` element (set it here, not on the element; a component should spread it);\n   * omitted for a host element of another tag (`<a>`). `action` together with\n   * `\"submit\"` / `\"reset\"` warns in development: one click would do two things.\n   */\n  type?: \"button\" | \"submit\" | \"reset\";\n  /**\n   * Native `disabled` (owned; a `render` element cannot re-enable it) and `data-disabled`.\n   * Never dispatches. With `focusableWhenDisabled`, inside a `Toolbar.Root`, or when the\n   * rendered element is not a host `<button>` (`render={<a href />}`, a component), renders\n   * `aria-disabled=\"true\"` instead.\n   */\n  disabled?: boolean;\n  /**\n   * Keep a disabled Button focusable: `aria-disabled=\"true\"` instead of native `disabled`, so\n   * keyboard and screen-reader users still find it and a Tooltip on it still opens. Default\n   * `false`; implied `true` inside a `Toolbar.Root` (APG Toolbar) and for a `render` element that\n   * is not a host `<button>`.\n   */\n  focusableWhenDisabled?: boolean;\n  /**\n   * Forwarded as `default` to the Button's `<ViewTransition>`: animates the commit that ends the\n   * action (content keyed on `pending`), not a click. Static; any value makes a mount inside a\n   * transition start a document view transition (issue #35).\n   */\n  transition?: ViewTransitionClass;\n  className?: StateValue<string | undefined, ButtonState>;\n  style?: StateValue<CSSProperties | undefined, ButtonState>;\n  children?: StateValue<ReactNode, ButtonState>;\n  render?: RenderProp<ComponentPropsWithRef<\"button\">, ButtonState>;\n}\n\n/**\n * A button whose click is a transition (design/components/button.md): `<button type=\"button\">`\n * that runs `action` in its own transition, with `data-pending` and `aria-disabled=\"true\"` while\n * it runs, and ignores further activation meanwhile (conventions 2.5). With a function\n * `formAction` it is a form submitter with its own per-submitter pending. Inside a\n * `Toolbar.Root` a disabled Button stays focusable (`aria-disabled`).\n *\n * Owned keys (conventions 1.2): `type` (on a `<button>` only), `disabled`, `aria-disabled`,\n * `data-pending`, `data-disabled`, `onClick`.\n */\nexport function Button({\n  action,\n  formAction,\n  type,\n  disabled = false,\n  focusableWhenDisabled = false,\n  transition,\n  className,\n  style,\n  children,\n  render,\n  ...rest\n}: ButtonProps) {\n  const toolbar = useToolbarContext();\n  // Not a host <button> (a link, a component): native `disabled` would mean nothing to the\n  // browser and hide the state from AT, so the focusable-disabled branch (review fold F1).\n  const focusable = focusableWhenDisabled || toolbar !== null || !isHostButton(render);\n  const { pending: ownPending, run } = useActionTrigger({ ignoreWhilePending: true });\n\n  // Per-submitter pending (design 6.2): React reports the submitter's function as\n  // `status.action`. `submittedWith` keeps the function this Button last submitted with, so an\n  // inline `formAction` whose identity changes during the submission still matches.\n  const status = useFormStatus();\n  const submittedWith = useRef<unknown>(undefined);\n  const formPending =\n    status.pending &&\n    typeof formAction === \"function\" &&\n    // Written only by the click handler, before the submission whose status this render shows,\n    // so the render that reads it is never stale for that submission.\n    // oxlint-disable-next-line react/refs\n    (status.action === formAction || status.action === submittedWith.current);\n  const pending = ownPending || formPending;\n\n  useDevWarning(\n    action !== undefined && formAction !== undefined,\n    \"Button: `action` and `formAction` were both given. One click would run two actions; the \" +\n      \"Button runs `action` and leaves `formAction` to the form submission. Pass one of them.\",\n  );\n  useDevWarning(\n    action !== undefined && (type === \"submit\" || type === \"reset\"),\n    `Button: \\`action\\` together with type=\"${type}\". One click would run \\`action\\` in a ` +\n      `transition and ${type === \"reset\" ? \"reset\" : \"submit\"} the form. Use \\`formAction\\` ` +\n      `for a submitter, or drop \\`type\\`.`,\n  );\n\n  const state: ButtonState = { pending, disabled };\n\n  const element = useRender<ComponentPropsWithRef<\"button\">, ButtonState>({\n    defaultElement: \"button\",\n    render,\n    state,\n    className,\n    style,\n    children,\n    props: formAction === undefined ? rest : { ...rest, formAction },\n    libraryProps: {\n      ...(rendersButton(render) && {\n        type: type ?? (formAction !== undefined ? \"submit\" : \"button\"),\n      }),\n      // `undefined` (not `false`) in the focusable case, so the owned key removes a render\n      // element's `disabled` too.\n      disabled: disabled && !focusable ? true : undefined,\n      \"aria-disabled\": pending || (disabled && focusable) ? true : undefined,\n      \"data-pending\": dataAttr(pending),\n      \"data-disabled\": dataAttr(disabled),\n      onClick: (event: MouseEvent<HTMLButtonElement>) => {\n        // `event.defaultPrevented` is never read: an outer part (`Dialog.Trigger`) cancels the\n        // click as part of its own mechanism and the Button must still run (design 5.1).\n        if (disabled) {\n          // A disabled link must not navigate either.\n          event.preventDefault();\n          return;\n        }\n        if (action === undefined) {\n          // A native button (a `formAction` submitter, a command, a link): only the guard.\n          if (formPending) {\n            event.preventDefault();\n            return;\n          }\n          submittedWith.current = formAction;\n          return;\n        }\n        const details: ButtonActionDetails = createActionDetails(event.nativeEvent, {});\n        // Ignored while pending: do not navigate, submit or run a command either.\n        if (!run(() => action(details))) event.preventDefault();\n      },\n    },\n  });\n\n  return useTransitionBoundary(\"Button\", transition, element);\n}\n\nButton.displayName = \"Button\";\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;AA8FA,SAAgB,OAAO,EACrB,QACA,YACA,MACA,WAAW,OACX,wBAAwB,OACxB,YACA,WACA,OACA,UACA,QACA,GAAG,QACW;CACd,MAAM,UAAU,kBAAkB;CAGlC,MAAM,YAAY,yBAAyB,YAAY,QAAQ,CAAC,aAAa,MAAM;CACnF,MAAM,EAAE,SAAS,YAAY,QAAQ,iBAAiB,EAAE,oBAAoB,KAAK,CAAC;CAKlF,MAAM,SAAS,cAAc;CAC7B,MAAM,gBAAgB,OAAgB,KAAA,CAAS;CAC/C,MAAM,cACJ,OAAO,WACP,OAAO,eAAe,eAIrB,OAAO,WAAW,cAAc,OAAO,WAAW,cAAc;CACnE,MAAM,UAAU,cAAc;CAE9B,cACE,WAAW,KAAA,KAAa,eAAe,KAAA,GACvC,gLAEF;CACA,cACE,WAAW,KAAA,MAAc,SAAS,YAAY,SAAS,UACvD,0CAA0C,KAAK,wDAC3B,SAAS,UAAU,UAAU,SAAS,iEAE5D;CAIA,MAAM,UAAU,UAAwD;EACtE,gBAAgB;EAChB;EACA,OAAA;GAL2B;GAAS;EAKhC;EACJ;EACA;EACA;EACA,OAAO,eAAe,KAAA,IAAY,OAAO;GAAE,GAAG;GAAM;EAAW;EAC/D,cAAc;GACZ,GAAI,cAAc,MAAM,KAAK,EAC3B,MAAM,SAAS,eAAe,KAAA,IAAY,WAAW,UACvD;GAGA,UAAU,YAAY,CAAC,YAAY,OAAO,KAAA;GAC1C,iBAAiB,WAAY,YAAY,YAAa,OAAO,KAAA;GAC7D,gBAAgB,SAAS,OAAO;GAChC,iBAAiB,SAAS,QAAQ;GAClC,UAAU,UAAyC;IAGjD,IAAI,UAAU;KAEZ,MAAM,eAAe;KACrB;IACF;IACA,IAAI,WAAW,KAAA,GAAW;KAExB,IAAI,aAAa;MACf,MAAM,eAAe;MACrB;KACF;KACA,cAAc,UAAU;KACxB;IACF;IACA,MAAM,UAA+B,oBAAoB,MAAM,aAAa,CAAC,CAAC;IAE9E,IAAI,CAAC,UAAU,OAAO,OAAO,CAAC,GAAG,MAAM,eAAe;GACxD;EACF;CACF,CAAC;CAED,OAAO,sBAAsB,UAAU,YAAY,OAAO;AAC5D;AAEA,OAAO,cAAc"}

package/dist/button/index.d.mts

@@ -0,0 +1,3 @@
+import "../internal/platform-attributes.mjs";
+import { Button, ButtonActionDetails, ButtonProps, ButtonState } from "./button.mjs";
+export { Button, type ButtonActionDetails, type ButtonProps, type ButtonState };

package/dist/button/index.mjs

@@ -0,0 +1 @@
+export { Button } from "./button.mjs";

package/dist/checkbox/checkbox.mjs

@@ -1,10 +1,10 @@
 "use client";
-import { useTransitionBoundary } from "../internal/transition-boundary.mjs";
 import { createActionDetails } from "../internal/action-details.mjs";
 import { dataAttr } from "../internal/data-attr.mjs";
+import { useTransitionBoundary } from "../internal/transition-boundary.mjs";
+import { useRender } from "../internal/use-render.mjs";
 import { transitionTypes } from "../internal/transition-types.mjs";
 import { useControllableAction } from "../internal/use-controllable-action.mjs";
-import { useRender } from "../internal/use-render.mjs";
 import { fieldInputProps, useFieldControl, useFieldValueChange, useMergedRef } from "../internal/use-field-control.mjs";
 import { guardCheckableChange, useNativeChecked } from "../internal/use-native-checked.mjs";
 //#region src/checkbox/checkbox.tsx

package/dist/checkbox-group/checkbox-group-item.mjs

@@ -1,6 +1,6 @@
 "use client";
-import { useTransitionBoundary } from "../internal/transition-boundary.mjs";
 import { dataAttr } from "../internal/data-attr.mjs";
+import { useTransitionBoundary } from "../internal/transition-boundary.mjs";
 import { useRender } from "../internal/use-render.mjs";
 import { guardCheckableChange, useNativeChecked } from "../internal/use-native-checked.mjs";
 import { syncPresence } from "../internal/sync-presence.mjs";

package/dist/checkbox-group/checkbox-group-parent.mjs

@@ -1,6 +1,6 @@
 "use client";
-import { useTransitionBoundary } from "../internal/transition-boundary.mjs";
 import { dataAttr } from "../internal/data-attr.mjs";
+import { useTransitionBoundary } from "../internal/transition-boundary.mjs";
 import { useRender } from "../internal/use-render.mjs";
 import { useFormReset } from "../internal/use-form-reset.mjs";
 import { guardCheckableChange, useNativeChecked } from "../internal/use-native-checked.mjs";

package/dist/checkbox-group/checkbox-group-root.mjs

@@ -1,9 +1,9 @@
 "use client";
 import { createActionDetails } from "../internal/action-details.mjs";
 import { dataAttr } from "../internal/data-attr.mjs";
+import { useRender } from "../internal/use-render.mjs";
 import { transitionTypes } from "../internal/transition-types.mjs";
 import { useControllableAction } from "../internal/use-controllable-action.mjs";
-import { useRender } from "../internal/use-render.mjs";
 import { useFieldControl, useFieldValueChange, useMergedRef } from "../internal/use-field-control.mjs";
 import { useNativeGroupReconciliation } from "../internal/use-native-group-reconciliation.mjs";
 import { CheckboxGroupContext, enabledValues } from "./checkbox-group-context.mjs";

package/dist/combobox/combobox-group.mjs

@@ -1,6 +1,6 @@
 "use client";
-import { useRender } from "../internal/use-render.mjs";
 import { useDevWarning } from "../internal/use-dev-warning.mjs";
+import { useRender } from "../internal/use-render.mjs";
 import { ComboboxGroupContext, ComboboxListContext, useComboboxContext } from "./combobox-context.mjs";
 import { use, useId, useLayoutEffect } from "react";
 import { jsx } from "react/jsx-runtime";

package/dist/combobox/combobox-list.mjs

@@ -1,8 +1,8 @@
 "use client";
 import { dataAttr } from "../internal/data-attr.mjs";
+import { useDevWarning } from "../internal/use-dev-warning.mjs";
 import { resolveStateValue } from "../internal/render-element.mjs";
 import { useRender } from "../internal/use-render.mjs";
-import { useDevWarning } from "../internal/use-dev-warning.mjs";
 import { ComboboxListContext, ComboboxPopupContext, useComboboxContext } from "./combobox-context.mjs";
 import { use, useCallback, useRef } from "react";
 import { jsx } from "react/jsx-runtime";

package/dist/combobox/combobox-option.mjs

@@ -1,7 +1,7 @@
 "use client";
 import { dataAttr } from "../internal/data-attr.mjs";
-import { useRender } from "../internal/use-render.mjs";
 import { useDevWarning } from "../internal/use-dev-warning.mjs";
+import { useRender } from "../internal/use-render.mjs";
 import { ComboboxListContext, optionId, useComboboxContext } from "./combobox-context.mjs";
 import { use, useCallback, useLayoutEffect, useRef } from "react";
 //#region src/combobox/combobox-option.tsx

package/dist/combobox/combobox-popup.mjs

@@ -1,10 +1,10 @@
 "use client";
-import { useTransitionBoundary } from "../internal/transition-boundary.mjs";
 import { dataAttr } from "../internal/data-attr.mjs";
+import { ToolbarContext } from "../internal/toolbar-context.mjs";
+import { useTransitionBoundary } from "../internal/transition-boundary.mjs";
 import { mergeRefs } from "../internal/merge-props.mjs";
 import { resolveStateValue } from "../internal/render-element.mjs";
 import { useRender } from "../internal/use-render.mjs";
-import { ToolbarContext } from "../internal/toolbar-context.mjs";
 import { usePopoverPopup } from "../internal/use-popover-popup.mjs";
 import { ComboboxPopupContext, useComboboxContext } from "./combobox-context.mjs";
 import { Activity, useCallback, useMemo } from "react";

package/dist/combobox/combobox-root.mjs

@@ -1,16 +1,16 @@
 "use client";
 import { createActionDetails } from "../internal/action-details.mjs";
-import { useControllableAction } from "../internal/use-controllable-action.mjs";
-import { resolveStateValue } from "../internal/render-element.mjs";
 import { useDevWarning } from "../internal/use-dev-warning.mjs";
+import { resolveStateValue } from "../internal/render-element.mjs";
+import { useControllableAction } from "../internal/use-controllable-action.mjs";
 import { FieldContext } from "../internal/field-context.mjs";
 import { useFieldValueChange } from "../internal/use-field-control.mjs";
 import { useFormReset } from "../internal/use-form-reset.mjs";
 import { usePopoverRoot } from "../internal/use-popover-root.mjs";
 import { ComboboxContext } from "./combobox-context.mjs";
 import { use, useCallback, useDeferredValue, useEffect, useId, useInsertionEffect, useLayoutEffect, useMemo, useRef, useState } from "react";
-import { jsx, jsxs } from "react/jsx-runtime";
 import { flushSync } from "react-dom";
+import { jsx, jsxs } from "react/jsx-runtime";
 //#region src/combobox/combobox-root.tsx
 /** The default announcement (design 6.4; conventions 11: English, always overridable). */
 function defaultComboboxAnnouncement(count) {

package/dist/dialog/dialog-close.mjs

@@ -1,9 +1,9 @@
 "use client";
 import { createActionDetails } from "../internal/action-details.mjs";
 import { dataAttr } from "../internal/data-attr.mjs";
+import { useActionTrigger } from "../internal/use-action-trigger.mjs";
 import { rendersButton } from "../internal/render-element.mjs";
 import { useRender } from "../internal/use-render.mjs";
-import { useActionTrigger } from "../internal/use-action-trigger.mjs";
 import { useDialogContext } from "./dialog-context.mjs";
 import { useCallback } from "react";
 //#region src/dialog/dialog-close.tsx

package/dist/dialog/dialog-form.mjs

@@ -1,7 +1,7 @@
 "use client";
+import { useDevWarning } from "../internal/use-dev-warning.mjs";
 import { resolveStateValue } from "../internal/render-element.mjs";
 import { useRender } from "../internal/use-render.mjs";
-import { useDevWarning } from "../internal/use-dev-warning.mjs";
 import { FormContext } from "../internal/field-context.mjs";
 import { useDialogContext } from "./dialog-context.mjs";
 import { FormStatusWatcher } from "../internal/form-status-watcher.mjs";

package/dist/dialog/dialog-popup.mjs

@@ -1,10 +1,10 @@
 "use client";
-import { useTransitionBoundary } from "../internal/transition-boundary.mjs";
 import { dataAttr } from "../internal/data-attr.mjs";
-import { resolveStateValue } from "../internal/render-element.mjs";
-import { useRender } from "../internal/use-render.mjs";
 import { ToolbarContext } from "../internal/toolbar-context.mjs";
+import { useTransitionBoundary } from "../internal/transition-boundary.mjs";
 import { useDevWarning } from "../internal/use-dev-warning.mjs";
+import { resolveStateValue } from "../internal/render-element.mjs";
+import { useRender } from "../internal/use-render.mjs";
 import { useDialogContext } from "./dialog-context.mjs";
 import { useContentFocusProbe } from "../internal/content-focus-probe.mjs";
 import { useExitAnimation } from "../internal/use-exit-animation.mjs";

package/dist/dialog/dialog-root.mjs

@@ -1,10 +1,10 @@
 "use client";
 import { createActionDetails } from "../internal/action-details.mjs";
+import { useDevWarning } from "../internal/use-dev-warning.mjs";
+import { resolveStateValue } from "../internal/render-element.mjs";
 import { transitionTypes } from "../internal/transition-types.mjs";
 import { useLatest } from "../internal/use-latest.mjs";
 import { useControllableAction } from "../internal/use-controllable-action.mjs";
-import { resolveStateValue } from "../internal/render-element.mjs";
-import { useDevWarning } from "../internal/use-dev-warning.mjs";
 import { DialogContext } from "./dialog-context.mjs";
 import { useCallback, useId, useInsertionEffect, useMemo, useRef, useState } from "react";
 import { jsx } from "react/jsx-runtime";

package/dist/field/field-root.mjs

@@ -1,15 +1,15 @@
 "use client";
 import { dataAttr } from "../internal/data-attr.mjs";
-import { useLatest } from "../internal/use-latest.mjs";
-import { useRender } from "../internal/use-render.mjs";
 import { useDevWarning } from "../internal/use-dev-warning.mjs";
+import { useRender } from "../internal/use-render.mjs";
+import { useLatest } from "../internal/use-latest.mjs";
 import { FieldContext, FormContext } from "../internal/field-context.mjs";
 import { useFormOwnerEvent } from "../internal/use-form-owner-event.mjs";
 import { VALID, arraysEqual, focusTargetOf, normaliseErrorValue, snapshotValidity, supportsUserInvalid, validityElementOf, validityEquals } from "../internal/validity.mjs";
 import { collectInvalid } from "../internal/focus-first-invalid.mjs";
 import { use, useCallback, useEffect, useId, useLayoutEffect, useMemo, useRef, useState } from "react";
-import { jsx } from "react/jsx-runtime";
 import { useFormStatus } from "react-dom";
+import { jsx } from "react/jsx-runtime";
 //#region src/field/field-root.tsx
 const isDev = process.env.NODE_ENV !== "production";
 const NONE = Object.freeze([]);

package/dist/form/form-root.mjs

@@ -1,8 +1,8 @@
 "use client";
 import { dataAttr } from "../internal/data-attr.mjs";
-import { useLatest } from "../internal/use-latest.mjs";
 import { resolveStateValue } from "../internal/render-element.mjs";
 import { useRender } from "../internal/use-render.mjs";
+import { useLatest } from "../internal/use-latest.mjs";
 import { FormContext } from "../internal/field-context.mjs";
 import { FormStatusWatcher } from "../internal/form-status-watcher.mjs";
 import { hasAnyError, sortByDocumentOrder } from "../internal/validity.mjs";

package/dist/index.d.mts

@@ -5,6 +5,8 @@ import { AccordionPanelProps, AccordionPanelState } from "./accordion/accordion-
 import { AccordionRootExclusiveProps, AccordionRootMultipleProps, AccordionRootProps, AccordionRootState, AccordionValueChangeDetails } from "./accordion/accordion-root.mjs";
 import { AccordionTriggerProps, AccordionTriggerState } from "./accordion/accordion-trigger.mjs";
 import { Accordion } from "./accordion/index.mjs";
+import { Button, ButtonActionDetails, ButtonProps, ButtonState } from "./button/button.mjs";
+import "./button/index.mjs";
 import { CheckboxGroupItemProps, CheckboxGroupItemState } from "./checkbox-group/checkbox-group-item.mjs";
 import { CheckboxGroupRootProps, CheckboxGroupRootState, CheckboxGroupValueChangeDetails } from "./checkbox-group/checkbox-group-root.mjs";
 import { CheckboxGroupLabelProps } from "./checkbox-group/checkbox-group-label.mjs";
@@ -47,7 +49,6 @@ import { ToggleGroupOrientation } from "./toggle-group/toggle-group-context.mjs"
 import { ToggleGroupItemProps, ToggleGroupItemState } from "./toggle-group/toggle-group-item.mjs";
 import { ToggleGroupExclusiveProps, ToggleGroupMultipleProps, ToggleGroupRootProps, ToggleGroupRootState, ToggleGroupValueChangeDetails } from "./toggle-group/toggle-group-root.mjs";
 import { ToggleGroup } from "./toggle-group/index.mjs";
-import { ToolbarButtonActionDetails, ToolbarButtonProps, ToolbarButtonState } from "./toolbar/toolbar-button.mjs";
 import { ToolbarOrientation, ToolbarRootProps, ToolbarRootState } from "./toolbar/toolbar-root.mjs";
 import { ToolbarSeparatorProps, ToolbarSeparatorState } from "./toolbar/toolbar-separator.mjs";
 import { Toolbar } from "./toolbar/index.mjs";
@@ -127,4 +128,4 @@ import { MeterLabelProps } from "./meter/meter-label.mjs";
 import { MeterTrackProps } from "./meter/meter-track.mjs";
 import { MeterValueProps } from "./meter/meter-value.mjs";
 import { Meter } from "./meter/index.mjs";
-export { Accordion, type AccordionItemProps, type AccordionItemState, type AccordionPanelProps, type AccordionPanelState, type AccordionRootExclusiveProps, type AccordionRootMultipleProps, type AccordionRootProps, type AccordionRootState, type AccordionTriggerProps, type AccordionTriggerState, type AccordionValueChangeDetails, type Action, type ActionDetails, type ChangeAction, type ChangeReason, Checkbox, type CheckboxCheckedChangeDetails, CheckboxGroup, type CheckboxGroupItemProps, type CheckboxGroupItemState, type CheckboxGroupLabelProps, type CheckboxGroupParentProps, type CheckboxGroupParentState, type CheckboxGroupRootProps, type CheckboxGroupRootState, type CheckboxGroupValueChangeDetails, type CheckboxProps, type CheckboxState, Combobox, type ComboboxClearProps, type ComboboxClearState, type ComboboxEmptyProps, type ComboboxEmptyState, type ComboboxGroupLabelProps, type ComboboxGroupLabelState, type ComboboxGroupProps, type ComboboxGroupState, type ComboboxInputProps, type ComboboxInputState, type ComboboxInputValueChangeDetails, type ComboboxLabelProps, type ComboboxLabelState, type ComboboxListProps, type ComboboxListState, type ComboboxOpenChangeDetails, type ComboboxOptionProps, type ComboboxOptionState, type ComboboxPopupProps, type ComboboxPopupState, type ComboboxRootProps, type ComboboxRootState, type ComboboxStatusProps, type ComboboxStatusState, type ComboboxTriggerProps, type ComboboxTriggerState, type ComboboxValueChangeDetails, Dialog, type DialogCloseDetails, type DialogCloseProps, type DialogCloseState, type DialogDescriptionProps, type DialogDescriptionState, type DialogFormProps, type DialogFormState, type DialogOpenChangeDetails, type DialogPopupProps, type DialogPopupState, type DialogRootProps, type DialogRootState, type DialogTitleProps, type DialogTitleState, type DialogTriggerProps, type DialogTriggerState, Field, type FieldControlProps, type FieldDescriptionProps, type FieldErrorProps, type FieldErrorValue, type FieldLabelProps, type FieldRootProps, type FieldState, type FieldValidate, type FieldValidity, Form, type FormErrors, type FormRootProps, type FormRootState, type FormSubmitProps, type FormSubmitState, Menu, type MenuAlign, type MenuCheckboxItemProps, type MenuCheckboxItemState, type MenuGroupLabelProps, type MenuGroupLabelState, type MenuGroupProps, type MenuGroupState, type MenuItemDetails, type MenuItemProps, type MenuItemState, type MenuOpenChangeDetails, type MenuPopupProps, type MenuPopupState, type MenuRadioGroupProps, type MenuRadioGroupState, type MenuRadioItemProps, type MenuRadioItemState, type MenuRootProps, type MenuRootState, type MenuSeparatorProps, type MenuSeparatorState, type MenuSide, type MenuSubmenuTriggerProps, type MenuSubmenuTriggerState, type MenuTriggerProps, type MenuTriggerState, Meter, type MeterIndicatorProps, type MeterLabelProps, type MeterRegion, type MeterRootProps, type MeterState, type MeterTrackProps, type MeterValueProps, NumberField, type NumberFieldButtonState, type NumberFieldDecrementProps, type NumberFieldIncrementProps, type NumberFieldInputProps, type NumberFieldLabelProps, type NumberFieldRootProps, type NumberFieldState, type NumberFieldValueChangeDetails, Popover, type PopoverAlign, type PopoverCloseProps, type PopoverCloseState, type PopoverDescriptionProps, type PopoverDescriptionState, type PopoverOpenChangeDetails, type PopoverPopupProps, type PopoverPopupState, type PopoverRootProps, type PopoverRootState, type PopoverSide, type PopoverTitleProps, type PopoverTitleState, type PopoverTriggerProps, type PopoverTriggerState, Progress, type ProgressIndicatorProps, type ProgressLabelProps, type ProgressRootProps, type ProgressState, type ProgressTrackProps, type ProgressValueProps, RadioGroup, type RadioGroupItemProps, type RadioGroupItemState, type RadioGroupLabelProps, type RadioGroupRootProps, type RadioGroupRootState, type RadioGroupValueChangeDetails, type RenderProp, Select, type SelectGroupLabelProps, type SelectGroupProps, type SelectOptionProps, type SelectOptionState, type SelectRootProps, type SelectRootState, type SelectSeparatorProps, type SelectTriggerProps, type SelectValueChangeDetails, type SelectValueProps, Slider, type SliderIndicatorProps, type SliderIndicatorState, type SliderLabelProps, type SliderOrientation, type SliderRootProps, type SliderRootState, type SliderThumbProps, type SliderThumbState, type SliderTrackProps, type SliderTrackState, type SliderValue, type SliderValueChangeDetails, type SliderValueCommitDetails, type SliderValueProps, type SliderValueState, type StateValue, Switch, type SwitchCheckedChangeDetails, type SwitchProps, type SwitchState, Tabs, type TabsActivationMode, type TabsIndicatorProps, type TabsIndicatorState, type TabsListProps, type TabsListState, type TabsOrientation, type TabsPanelProps, type TabsPanelState, type TabsRootProps, type TabsRootState, type TabsTabProps, type TabsTabState, type TabsValueChangeDetails, Toast, type ToastActionDetails, type ToastActionOptions, type ToastActionProps, type ToastActionState, type ToastCloseDetails, type ToastCloseProps, type ToastCloseState, type ToastDescriptionProps, type ToastItem, type ToastManager, type ToastOptions, type ToastPriority, type ToastPromiseOptions, type ToastRootProps, type ToastRootState, type ToastTitleProps, type ToastViewportProps, type ToastViewportState, Toggle, ToggleGroup, type ToggleGroupExclusiveProps, type ToggleGroupItemProps, type ToggleGroupItemState, type ToggleGroupMultipleProps, type ToggleGroupOrientation, type ToggleGroupRootProps, type ToggleGroupRootState, type ToggleGroupValueChangeDetails, type TogglePressedChangeDetails, type ToggleProps, type ToggleState, Toolbar, type ToolbarButtonActionDetails, type ToolbarButtonProps, type ToolbarButtonState, type ToolbarOrientation, type ToolbarRootProps, type ToolbarRootState, type ToolbarSeparatorProps, type ToolbarSeparatorState, Tooltip, type TooltipAlign, type TooltipPopupProps, type TooltipPopupState, type TooltipProvides, type TooltipRootProps, type TooltipRootState, type TooltipSide, type TooltipTriggerProps, type TooltipTriggerState, type UrgentChangeAction, createToastManager, toast };
+export { Accordion, type AccordionItemProps, type AccordionItemState, type AccordionPanelProps, type AccordionPanelState, type AccordionRootExclusiveProps, type AccordionRootMultipleProps, type AccordionRootProps, type AccordionRootState, type AccordionTriggerProps, type AccordionTriggerState, type AccordionValueChangeDetails, type Action, type ActionDetails, Button, type ButtonActionDetails, type ButtonProps, type ButtonState, type ChangeAction, type ChangeReason, Checkbox, type CheckboxCheckedChangeDetails, CheckboxGroup, type CheckboxGroupItemProps, type CheckboxGroupItemState, type CheckboxGroupLabelProps, type CheckboxGroupParentProps, type CheckboxGroupParentState, type CheckboxGroupRootProps, type CheckboxGroupRootState, type CheckboxGroupValueChangeDetails, type CheckboxProps, type CheckboxState, Combobox, type ComboboxClearProps, type ComboboxClearState, type ComboboxEmptyProps, type ComboboxEmptyState, type ComboboxGroupLabelProps, type ComboboxGroupLabelState, type ComboboxGroupProps, type ComboboxGroupState, type ComboboxInputProps, type ComboboxInputState, type ComboboxInputValueChangeDetails, type ComboboxLabelProps, type ComboboxLabelState, type ComboboxListProps, type ComboboxListState, type ComboboxOpenChangeDetails, type ComboboxOptionProps, type ComboboxOptionState, type ComboboxPopupProps, type ComboboxPopupState, type ComboboxRootProps, type ComboboxRootState, type ComboboxStatusProps, type ComboboxStatusState, type ComboboxTriggerProps, type ComboboxTriggerState, type ComboboxValueChangeDetails, Dialog, type DialogCloseDetails, type DialogCloseProps, type DialogCloseState, type DialogDescriptionProps, type DialogDescriptionState, type DialogFormProps, type DialogFormState, type DialogOpenChangeDetails, type DialogPopupProps, type DialogPopupState, type DialogRootProps, type DialogRootState, type DialogTitleProps, type DialogTitleState, type DialogTriggerProps, type DialogTriggerState, Field, type FieldControlProps, type FieldDescriptionProps, type FieldErrorProps, type FieldErrorValue, type FieldLabelProps, type FieldRootProps, type FieldState, type FieldValidate, type FieldValidity, Form, type FormErrors, type FormRootProps, type FormRootState, type FormSubmitProps, type FormSubmitState, Menu, type MenuAlign, type MenuCheckboxItemProps, type MenuCheckboxItemState, type MenuGroupLabelProps, type MenuGroupLabelState, type MenuGroupProps, type MenuGroupState, type MenuItemDetails, type MenuItemProps, type MenuItemState, type MenuOpenChangeDetails, type MenuPopupProps, type MenuPopupState, type MenuRadioGroupProps, type MenuRadioGroupState, type MenuRadioItemProps, type MenuRadioItemState, type MenuRootProps, type MenuRootState, type MenuSeparatorProps, type MenuSeparatorState, type MenuSide, type MenuSubmenuTriggerProps, type MenuSubmenuTriggerState, type MenuTriggerProps, type MenuTriggerState, Meter, type MeterIndicatorProps, type MeterLabelProps, type MeterRegion, type MeterRootProps, type MeterState, type MeterTrackProps, type MeterValueProps, NumberField, type NumberFieldButtonState, type NumberFieldDecrementProps, type NumberFieldIncrementProps, type NumberFieldInputProps, type NumberFieldLabelProps, type NumberFieldRootProps, type NumberFieldState, type NumberFieldValueChangeDetails, Popover, type PopoverAlign, type PopoverCloseProps, type PopoverCloseState, type PopoverDescriptionProps, type PopoverDescriptionState, type PopoverOpenChangeDetails, type PopoverPopupProps, type PopoverPopupState, type PopoverRootProps, type PopoverRootState, type PopoverSide, type PopoverTitleProps, type PopoverTitleState, type PopoverTriggerProps, type PopoverTriggerState, Progress, type ProgressIndicatorProps, type ProgressLabelProps, type ProgressRootProps, type ProgressState, type ProgressTrackProps, type ProgressValueProps, RadioGroup, type RadioGroupItemProps, type RadioGroupItemState, type RadioGroupLabelProps, type RadioGroupRootProps, type RadioGroupRootState, type RadioGroupValueChangeDetails, type RenderProp, Select, type SelectGroupLabelProps, type SelectGroupProps, type SelectOptionProps, type SelectOptionState, type SelectRootProps, type SelectRootState, type SelectSeparatorProps, type SelectTriggerProps, type SelectValueChangeDetails, type SelectValueProps, Slider, type SliderIndicatorProps, type SliderIndicatorState, type SliderLabelProps, type SliderOrientation, type SliderRootProps, type SliderRootState, type SliderThumbProps, type SliderThumbState, type SliderTrackProps, type SliderTrackState, type SliderValue, type SliderValueChangeDetails, type SliderValueCommitDetails, type SliderValueProps, type SliderValueState, type StateValue, Switch, type SwitchCheckedChangeDetails, type SwitchProps, type SwitchState, Tabs, type TabsActivationMode, type TabsIndicatorProps, type TabsIndicatorState, type TabsListProps, type TabsListState, type TabsOrientation, type TabsPanelProps, type TabsPanelState, type TabsRootProps, type TabsRootState, type TabsTabProps, type TabsTabState, type TabsValueChangeDetails, Toast, type ToastActionDetails, type ToastActionOptions, type ToastActionProps, type ToastActionState, type ToastCloseDetails, type ToastCloseProps, type ToastCloseState, type ToastDescriptionProps, type ToastItem, type ToastManager, type ToastOptions, type ToastPriority, type ToastPromiseOptions, type ToastRootProps, type ToastRootState, type ToastTitleProps, type ToastViewportProps, type ToastViewportState, Toggle, ToggleGroup, type ToggleGroupExclusiveProps, type ToggleGroupItemProps, type ToggleGroupItemState, type ToggleGroupMultipleProps, type ToggleGroupOrientation, type ToggleGroupRootProps, type ToggleGroupRootState, type ToggleGroupValueChangeDetails, type TogglePressedChangeDetails, type ToggleProps, type ToggleState, Toolbar, type ToolbarOrientation, type ToolbarRootProps, type ToolbarRootState, type ToolbarSeparatorProps, type ToolbarSeparatorState, Tooltip, type TooltipAlign, type TooltipPopupProps, type TooltipPopupState, type TooltipProvides, type TooltipRootProps, type TooltipRootState, type TooltipSide, type TooltipTriggerProps, type TooltipTriggerState, type UrgentChangeAction, createToastManager, toast };

package/dist/index.mjs

@@ -1,3 +1,4 @@
+import { Button } from "./button/button.mjs";
 import { Toggle } from "./toggle/toggle.mjs";
 import { ToggleGroup } from "./toggle-group/index.mjs";
 import { Toolbar } from "./toolbar/index.mjs";
@@ -21,4 +22,4 @@ import { Field } from "./field/index.mjs";
 import { Form } from "./form/index.mjs";
 import { Progress } from "./progress/index.mjs";
 import { Meter } from "./meter/index.mjs";
-export { Accordion, Checkbox, CheckboxGroup, Combobox, Dialog, Field, Form, Menu, Meter, NumberField, Popover, Progress, RadioGroup, Select, Slider, Switch, Tabs, Toast, Toggle, ToggleGroup, Toolbar, Tooltip, createToastManager, toast };
+export { Accordion, Button, Checkbox, CheckboxGroup, Combobox, Dialog, Field, Form, Menu, Meter, NumberField, Popover, Progress, RadioGroup, Select, Slider, Switch, Tabs, Toast, Toggle, ToggleGroup, Toolbar, Tooltip, createToastManager, toast };

package/dist/internal/render-element.mjs

@@ -5,12 +5,25 @@ function resolveStateValue(value, state) {
 	return typeof value === "function" ? value(state) : value;
 }
 /**
-* Whether a part whose default element is a `<button>` should add `type="button"`: no `render`,
-* a `render` element whose type is the intrinsic `"button"`, or the function form (it receives
-* button props and decides itself what to spread). An element of any other type (an `<a>`, a
-* router `Link`) does not get it: `type` means something else, or nothing, there.
+* Whether a part whose default element is a `<button>` should add `type="button"` (conventions
+* 1.2): no `render`, the function form (it receives button props and decides itself what to
+* spread), a host `<button>` element, or a **component** element (assumed to render a
+* `<button>`; if it renders a link, `type` is a harmless ignored attribute, while a missing
+* `type` on a `<button>` in a form is a silent submit). Only a host element of another tag (an
+* `<a>`) does not get it.
 */
 function rendersButton(render) {
+	if (render === void 0 || typeof render === "function") return true;
+	if (!isValidElement(render)) return false;
+	return typeof render.type !== "string" || render.type === "button";
+}
+/**
+* Whether the rendered element is certainly a host `<button>`: no `render`, the function form, or
+* a host `"button"` element. The strict predicate for native `disabled`, which means nothing on a
+* link and would expose it as enabled to assistive technology; anything else (a link, a
+* component) takes the `aria-disabled` branch (design/components/button.md, review fold F1).
+*/
+function isHostButton(render) {
 	if (render === void 0 || typeof render === "function") return true;
 	return isValidElement(render) && render.type === "button";
 }
@@ -49,6 +62,6 @@ function renderElement(options) {
 	return createElement(defaultElement, resolved);
 }
 //#endregion
-export { mergeRenderRef, renderElement, rendersButton, resolveStateValue };
+export { isHostButton, mergeRenderRef, renderElement, rendersButton, resolveStateValue };
 
 //# sourceMappingURL=render-element.mjs.map

package/dist/internal/render-element.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"render-element.mjs","names":[],"sources":["../../src/internal/render-element.ts"],"sourcesContent":["// No \"use client\": the pure half of `useRender`, usable from a directive-free part (a Root that\n// may run as a Server Component, design/components/progress.md 8.1 and implementation note 14.1).\nimport { cloneElement, createElement, isValidElement } from \"react\";\nimport type { CSSProperties, ReactNode, Ref } from \"react\";\nimport { mergeProps, mergeRefs } from \"./merge-props.js\";\nimport type { RenderProp, StateValue } from \"./types.js\";\n\nexport interface ElementLikeProps {\n  className?: string | undefined;\n  style?: CSSProperties | undefined;\n  children?: ReactNode;\n  ref?: Ref<unknown> | undefined;\n}\n\n/** `data-*` attributes are valid JSX but absent from the element prop types. */\nexport type DataAttributes = { [key: `data-${string}`]: string | undefined };\n\nexport interface RenderElementOptions<Props extends ElementLikeProps, State> {\n  /** Intrinsic element rendered when `render` is not given. */\n  defaultElement: string;\n  render: RenderProp<Props, State> | undefined;\n  state: State;\n  className: StateValue<string | undefined, State> | undefined;\n  style: StateValue<CSSProperties | undefined, State> | undefined;\n  children: StateValue<ReactNode, State> | undefined;\n  /**\n   * The part's pass-through props for the element. A `render` element's own props win over\n   * these. Their `ref` is replaced by `ref` below.\n   */\n  props: Omit<Props, \"className\" | \"style\" | \"children\"> & DataAttributes;\n  /**\n   * Library-controlled attributes the part computes (`role`, `aria-*` state, id wiring, `data-*`\n   * state, the library's own event handlers). These win over a `render` element's props\n   * (conventions 1.2).\n   */\n  libraryProps?: Partial<Omit<Props, \"className\" | \"style\" | \"children\">> & DataAttributes;\n  /**\n   * The element's ref, already merged from the library's ref, the consumer's `ref` and the\n   * `render` element's ref. The `render` element's own ref is not attached separately.\n   */\n  ref: Ref<unknown> | undefined;\n}\n\nexport function resolveStateValue<T, State>(value: StateValue<T, State>, state: State): T {\n  return typeof value === \"function\" ? (value as (state: State) => T)(state) : value;\n}\n\n/**\n * Whether a part whose default element is a `<button>` should add `type=\"button\"`: no `render`,\n * a `render` element whose type is the intrinsic `\"button\"`, or the function form (it receives\n * button props and decides itself what to spread). An element of any other type (an `<a>`, a\n * router `Link`) does not get it: `type` means something else, or nothing, there.\n */\nexport function rendersButton<Props, State>(render: RenderProp<Props, State> | undefined): boolean {\n  if (render === undefined || typeof render === \"function\") return true;\n  return isValidElement(render) && render.type === \"button\";\n}\n\n/**\n * The ref of a part with no library ref, merged from the consumer's `ref` and a `render`\n * element's ref without memoisation (a directive-free part cannot `useMemo`, design\n * progress.md 14.1). A fresh callback ref per render is correct because every merged callback\n * returns a cleanup; a single ref is passed through untouched.\n */\nexport function mergeRenderRef(\n  consumerRef: Ref<unknown> | undefined,\n  render: unknown,\n): Ref<unknown> | undefined {\n  const elementRef = isValidElement<ElementLikeProps>(render) ? render.props.ref : undefined;\n  if (consumerRef != null && elementRef != null) return mergeRefs(consumerRef, elementRef);\n  return consumerRef ?? elementRef;\n}\n\n/**\n * Resolves `render` and the function-form `className` / `style` / `children` of a part against\n * its state and produces the element (conventions 1.2, 1.3, 1.4). Pure: the caller merges the\n * refs (`useRender` memoises the merge; a directive-free part merges unmemoised).\n */\nexport function renderElement<Props extends ElementLikeProps, State>(\n  options: RenderElementOptions<Props, State>,\n): ReactNode {\n  const { defaultElement, render, state, className, style, children, props, libraryProps, ref } =\n    options;\n\n  const partProps = {\n    ...props,\n    ref,\n    className: resolveStateValue(className, state),\n    style: resolveStateValue(style, state),\n    children: resolveStateValue(children, state),\n  } as Record<string, unknown>;\n  const controlled = (libraryProps ?? {}) as Record<string, unknown>;\n\n  if (isValidElement<ElementLikeProps>(render)) {\n    // The element's ref is already part of `ref`.\n    const { ref: _ignored, ...elementProps } = render.props as Record<string, unknown>;\n    return cloneElement(render, mergeProps(partProps, elementProps, controlled) as Partial<Props>);\n  }\n  const resolved = mergeProps(partProps, {}, controlled) as unknown as Props;\n  if (typeof render === \"function\") {\n    return render(resolved, state);\n  }\n  return createElement(defaultElement, resolved);\n}\n"],"mappings":";;;AA2CA,SAAgB,kBAA4B,OAA6B,OAAiB;CACxF,OAAO,OAAO,UAAU,aAAc,MAA8B,KAAK,IAAI;AAC/E;;;;;;;AAQA,SAAgB,cAA4B,QAAuD;CACjG,IAAI,WAAW,KAAA,KAAa,OAAO,WAAW,YAAY,OAAO;CACjE,OAAO,eAAe,MAAM,KAAK,OAAO,SAAS;AACnD;;;;;;;AAQA,SAAgB,eACd,aACA,QAC0B;CAC1B,MAAM,aAAa,eAAiC,MAAM,IAAI,OAAO,MAAM,MAAM,KAAA;CACjF,IAAI,eAAe,QAAQ,cAAc,MAAM,OAAO,UAAU,aAAa,UAAU;CACvF,OAAO,eAAe;AACxB;;;;;;AAOA,SAAgB,cACd,SACW;CACX,MAAM,EAAE,gBAAgB,QAAQ,OAAO,WAAW,OAAO,UAAU,OAAO,cAAc,QACtF;CAEF,MAAM,YAAY;EAChB,GAAG;EACH;EACA,WAAW,kBAAkB,WAAW,KAAK;EAC7C,OAAO,kBAAkB,OAAO,KAAK;EACrC,UAAU,kBAAkB,UAAU,KAAK;CAC7C;CACA,MAAM,aAAc,gBAAgB,CAAC;CAErC,IAAI,eAAiC,MAAM,GAAG;EAE5C,MAAM,EAAE,KAAK,UAAU,GAAG,iBAAiB,OAAO;EAClD,OAAO,aAAa,QAAQ,WAAW,WAAW,cAAc,UAAU,CAAmB;CAC/F;CACA,MAAM,WAAW,WAAW,WAAW,CAAC,GAAG,UAAU;CACrD,IAAI,OAAO,WAAW,YACpB,OAAO,OAAO,UAAU,KAAK;CAE/B,OAAO,cAAc,gBAAgB,QAAQ;AAC/C"}
+{"version":3,"file":"render-element.mjs","names":[],"sources":["../../src/internal/render-element.ts"],"sourcesContent":["// No \"use client\": the pure half of `useRender`, usable from a directive-free part (a Root that\n// may run as a Server Component, design/components/progress.md 8.1 and implementation note 14.1).\nimport { cloneElement, createElement, isValidElement } from \"react\";\nimport type { CSSProperties, ReactNode, Ref } from \"react\";\nimport { mergeProps, mergeRefs } from \"./merge-props.js\";\nimport type { RenderProp, StateValue } from \"./types.js\";\n\nexport interface ElementLikeProps {\n  className?: string | undefined;\n  style?: CSSProperties | undefined;\n  children?: ReactNode;\n  ref?: Ref<unknown> | undefined;\n}\n\n/** `data-*` attributes are valid JSX but absent from the element prop types. */\nexport type DataAttributes = { [key: `data-${string}`]: string | undefined };\n\nexport interface RenderElementOptions<Props extends ElementLikeProps, State> {\n  /** Intrinsic element rendered when `render` is not given. */\n  defaultElement: string;\n  render: RenderProp<Props, State> | undefined;\n  state: State;\n  className: StateValue<string | undefined, State> | undefined;\n  style: StateValue<CSSProperties | undefined, State> | undefined;\n  children: StateValue<ReactNode, State> | undefined;\n  /**\n   * The part's pass-through props for the element. A `render` element's own props win over\n   * these. Their `ref` is replaced by `ref` below.\n   */\n  props: Omit<Props, \"className\" | \"style\" | \"children\"> & DataAttributes;\n  /**\n   * Library-controlled attributes the part computes (`role`, `aria-*` state, id wiring, `data-*`\n   * state, the library's own event handlers). These win over a `render` element's props\n   * (conventions 1.2).\n   */\n  libraryProps?: Partial<Omit<Props, \"className\" | \"style\" | \"children\">> & DataAttributes;\n  /**\n   * The element's ref, already merged from the library's ref, the consumer's `ref` and the\n   * `render` element's ref. The `render` element's own ref is not attached separately.\n   */\n  ref: Ref<unknown> | undefined;\n}\n\nexport function resolveStateValue<T, State>(value: StateValue<T, State>, state: State): T {\n  return typeof value === \"function\" ? (value as (state: State) => T)(state) : value;\n}\n\n/**\n * Whether a part whose default element is a `<button>` should add `type=\"button\"` (conventions\n * 1.2): no `render`, the function form (it receives button props and decides itself what to\n * spread), a host `<button>` element, or a **component** element (assumed to render a\n * `<button>`; if it renders a link, `type` is a harmless ignored attribute, while a missing\n * `type` on a `<button>` in a form is a silent submit). Only a host element of another tag (an\n * `<a>`) does not get it.\n */\nexport function rendersButton<Props, State>(render: RenderProp<Props, State> | undefined): boolean {\n  if (render === undefined || typeof render === \"function\") return true;\n  if (!isValidElement(render)) return false;\n  return typeof render.type !== \"string\" || render.type === \"button\";\n}\n\n/**\n * Whether the rendered element is certainly a host `<button>`: no `render`, the function form, or\n * a host `\"button\"` element. The strict predicate for native `disabled`, which means nothing on a\n * link and would expose it as enabled to assistive technology; anything else (a link, a\n * component) takes the `aria-disabled` branch (design/components/button.md, review fold F1).\n */\nexport function isHostButton<Props, State>(render: RenderProp<Props, State> | undefined): boolean {\n  if (render === undefined || typeof render === \"function\") return true;\n  return isValidElement(render) && render.type === \"button\";\n}\n\n/**\n * The ref of a part with no library ref, merged from the consumer's `ref` and a `render`\n * element's ref without memoisation (a directive-free part cannot `useMemo`, design\n * progress.md 14.1). A fresh callback ref per render is correct because every merged callback\n * returns a cleanup; a single ref is passed through untouched.\n */\nexport function mergeRenderRef(\n  consumerRef: Ref<unknown> | undefined,\n  render: unknown,\n): Ref<unknown> | undefined {\n  const elementRef = isValidElement<ElementLikeProps>(render) ? render.props.ref : undefined;\n  if (consumerRef != null && elementRef != null) return mergeRefs(consumerRef, elementRef);\n  return consumerRef ?? elementRef;\n}\n\n/**\n * Resolves `render` and the function-form `className` / `style` / `children` of a part against\n * its state and produces the element (conventions 1.2, 1.3, 1.4). Pure: the caller merges the\n * refs (`useRender` memoises the merge; a directive-free part merges unmemoised).\n */\nexport function renderElement<Props extends ElementLikeProps, State>(\n  options: RenderElementOptions<Props, State>,\n): ReactNode {\n  const { defaultElement, render, state, className, style, children, props, libraryProps, ref } =\n    options;\n\n  const partProps = {\n    ...props,\n    ref,\n    className: resolveStateValue(className, state),\n    style: resolveStateValue(style, state),\n    children: resolveStateValue(children, state),\n  } as Record<string, unknown>;\n  const controlled = (libraryProps ?? {}) as Record<string, unknown>;\n\n  if (isValidElement<ElementLikeProps>(render)) {\n    // The element's ref is already part of `ref`.\n    const { ref: _ignored, ...elementProps } = render.props as Record<string, unknown>;\n    return cloneElement(render, mergeProps(partProps, elementProps, controlled) as Partial<Props>);\n  }\n  const resolved = mergeProps(partProps, {}, controlled) as unknown as Props;\n  if (typeof render === \"function\") {\n    return render(resolved, state);\n  }\n  return createElement(defaultElement, resolved);\n}\n"],"mappings":";;;AA2CA,SAAgB,kBAA4B,OAA6B,OAAiB;CACxF,OAAO,OAAO,UAAU,aAAc,MAA8B,KAAK,IAAI;AAC/E;;;;;;;;;AAUA,SAAgB,cAA4B,QAAuD;CACjG,IAAI,WAAW,KAAA,KAAa,OAAO,WAAW,YAAY,OAAO;CACjE,IAAI,CAAC,eAAe,MAAM,GAAG,OAAO;CACpC,OAAO,OAAO,OAAO,SAAS,YAAY,OAAO,SAAS;AAC5D;;;;;;;AAQA,SAAgB,aAA2B,QAAuD;CAChG,IAAI,WAAW,KAAA,KAAa,OAAO,WAAW,YAAY,OAAO;CACjE,OAAO,eAAe,MAAM,KAAK,OAAO,SAAS;AACnD;;;;;;;AAQA,SAAgB,eACd,aACA,QAC0B;CAC1B,MAAM,aAAa,eAAiC,MAAM,IAAI,OAAO,MAAM,MAAM,KAAA;CACjF,IAAI,eAAe,QAAQ,cAAc,MAAM,OAAO,UAAU,aAAa,UAAU;CACvF,OAAO,eAAe;AACxB;;;;;;AAOA,SAAgB,cACd,SACW;CACX,MAAM,EAAE,gBAAgB,QAAQ,OAAO,WAAW,OAAO,UAAU,OAAO,cAAc,QACtF;CAEF,MAAM,YAAY;EAChB,GAAG;EACH;EACA,WAAW,kBAAkB,WAAW,KAAK;EAC7C,OAAO,kBAAkB,OAAO,KAAK;EACrC,UAAU,kBAAkB,UAAU,KAAK;CAC7C;CACA,MAAM,aAAc,gBAAgB,CAAC;CAErC,IAAI,eAAiC,MAAM,GAAG;EAE5C,MAAM,EAAE,KAAK,UAAU,GAAG,iBAAiB,OAAO;EAClD,OAAO,aAAa,QAAQ,WAAW,WAAW,cAAc,UAAU,CAAmB;CAC/F;CACA,MAAM,WAAW,WAAW,WAAW,CAAC,GAAG,UAAU;CACrD,IAAI,OAAO,WAAW,YACpB,OAAO,OAAO,UAAU,KAAK;CAE/B,OAAO,cAAc,gBAAgB,QAAQ;AAC/C"}