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

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@funstack/ui",
-  "version": "0.1.0-alpha.5",
+  "version": "0.1.0-alpha.6",
   "description": "Headless UI library for React — the first Async React-native UI library",
   "keywords": [
     "components",
@@ -30,6 +30,7 @@
   "exports": {
     ".": "./dist/index.mjs",
     "./accordion": "./dist/accordion/index.mjs",
+    "./button": "./dist/button/index.mjs",
     "./checkbox": "./dist/checkbox/index.mjs",
     "./checkbox-group": "./dist/checkbox-group/index.mjs",
     "./combobox": "./dist/combobox/index.mjs",

package/dist/toolbar/toolbar-button.d.mts

@@ -1,42 +0,0 @@
-import { Action, ActionDetails, RenderProp, StateValue } from "../internal/types.mjs";
-import { CSSProperties, ComponentPropsWithRef, ReactNode, ViewTransitionClass } from "react";
-//#region src/toolbar/toolbar-button.d.ts
-/** Details passed to `Toolbar.Button`'s `action`. */
-export interface ToolbarButtonActionDetails extends ActionDetails {}
-export interface ToolbarButtonState {
-  /** This button's action is in flight. */
-  readonly pending: boolean;
-  readonly disabled: boolean;
-}
-export interface ToolbarButtonProps extends Omit<ComponentPropsWithRef<"button">, "onClick" | "type" | "tabIndex" | "aria-disabled" | "className" | "style" | "children"> {
-  /** Runs inside this button's own transition on click, Enter or Space. Sync or async; rejections reach the nearest Error Boundary. */
-  action?: Action<[details: ToolbarButtonActionDetails]>;
-  /**
-   * `aria-disabled="true"`: the button stays focusable and in the arrow-key sequence so
-   * assistive technology still finds it (APG Toolbar example), and never dispatches.
-   */
-  disabled?: 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, ToolbarButtonState>;
-  style?: StateValue<CSSProperties | undefined, ToolbarButtonState>;
-  children?: StateValue<ReactNode, ToolbarButtonState>;
-  render?: RenderProp<ComponentPropsWithRef<"button">, ToolbarButtonState>;
-}
-/**
- * A toolbar command: `<button type="button">` that runs `action` in its own transition
- * (`data-pending` while it runs). Disabled is `aria-disabled`, so it stays focusable.
- *
- * Owned keys (conventions 1.2): `type` (on a `<button>` only), `aria-disabled`, `data-pending`,
- * `data-disabled`, `onClick`.
- */
-export declare function ToolbarButton({ action, disabled, transition, className, style, children, render, ...rest }: ToolbarButtonProps): ReactNode;
-export declare namespace ToolbarButton {
-  var displayName: string;
-}
-//#endregion
-//# sourceMappingURL=toolbar-button.d.mts.map

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

@@ -1 +0,0 @@
-{"version":3,"file":"toolbar-button.d.mts","names":[],"sources":["../../src/toolbar/toolbar-button.tsx"],"mappings":";;;;iBAgBiB,mCAAmC;iBAEnC;;WAEN;WACA;;iBAGM,2BAA2B,KAC1C;;EAIA,SAAS,QAAQ,SAAS;;;;;EAK1B;;;;;;EAMA,aAAa;EACb,YAAY,+BAA+B;EAC3C,QAAQ,WAAW,2BAA2B;EAC9C,WAAW,WAAW,WAAW;EACjC,SAAS,WAAW,iCAAiC;;;;;;;;;wBAUvC,gBACd,QACA,UACA,YACA,WACA,OACA,UACA,WACG,QACF,qBAAkB;yBATL"}

package/dist/toolbar/toolbar-button.mjs

@@ -1,50 +0,0 @@
-"use client";
-import { useTransitionBoundary } from "../internal/transition-boundary.mjs";
-import { createActionDetails } from "../internal/action-details.mjs";
-import { dataAttr } from "../internal/data-attr.mjs";
-import { rendersButton } from "../internal/render-element.mjs";
-import { useRender } from "../internal/use-render.mjs";
-import { useActionTrigger } from "../internal/use-action-trigger.mjs";
-//#region src/toolbar/toolbar-button.tsx
-/**
-* A toolbar command: `<button type="button">` that runs `action` in its own transition
-* (`data-pending` while it runs). Disabled is `aria-disabled`, so it stays focusable.
-*
-* Owned keys (conventions 1.2): `type` (on a `<button>` only), `aria-disabled`, `data-pending`,
-* `data-disabled`, `onClick`.
-*/
-function ToolbarButton({ action, disabled = false, transition, className, style, children, render, ...rest }) {
-	const { pending, run } = useActionTrigger();
-	const element = useRender({
-		defaultElement: "button",
-		render,
-		state: {
-			pending,
-			disabled
-		},
-		className,
-		style,
-		children,
-		props: rest,
-		libraryProps: {
-			...rendersButton(render) && { type: "button" },
-			"aria-disabled": disabled ? true : void 0,
-			"data-pending": dataAttr(pending),
-			"data-disabled": dataAttr(disabled),
-			onClick: (event) => {
-				if (disabled) {
-					event.preventDefault();
-					return;
-				}
-				const details = createActionDetails(event.nativeEvent, {});
-				run(() => action?.(details));
-			}
-		}
-	});
-	return useTransitionBoundary("Toolbar.Button", transition, element);
-}
-ToolbarButton.displayName = "ToolbarButton";
-//#endregion
-export { ToolbarButton };
-
-//# sourceMappingURL=toolbar-button.mjs.map

package/dist/toolbar/toolbar-button.mjs.map

@@ -1 +0,0 @@
-{"version":3,"file":"toolbar-button.mjs","names":[],"sources":["../../src/toolbar/toolbar-button.tsx"],"sourcesContent":["\"use client\";\nimport type {\n  ComponentPropsWithRef,\n  CSSProperties,\n  MouseEvent,\n  ReactNode,\n  ViewTransitionClass,\n} from \"react\";\nimport { createActionDetails } from \"../internal/action-details.js\";\nimport { dataAttr } from \"../internal/data-attr.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 { rendersButton, useRender } from \"../internal/use-render.js\";\n\n/** Details passed to `Toolbar.Button`'s `action`. */\nexport interface ToolbarButtonActionDetails extends ActionDetails {}\n\nexport interface ToolbarButtonState {\n  /** This button's action is in flight. */\n  readonly pending: boolean;\n  readonly disabled: boolean;\n}\n\nexport interface ToolbarButtonProps extends Omit<\n  ComponentPropsWithRef<\"button\">,\n  \"onClick\" | \"type\" | \"tabIndex\" | \"aria-disabled\" | \"className\" | \"style\" | \"children\"\n> {\n  /** Runs inside this button's own transition on click, Enter or Space. Sync or async; rejections reach the nearest Error Boundary. */\n  action?: Action<[details: ToolbarButtonActionDetails]>;\n  /**\n   * `aria-disabled=\"true\"`: the button stays focusable and in the arrow-key sequence so\n   * assistive technology still finds it (APG Toolbar example), and never dispatches.\n   */\n  disabled?: 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, ToolbarButtonState>;\n  style?: StateValue<CSSProperties | undefined, ToolbarButtonState>;\n  children?: StateValue<ReactNode, ToolbarButtonState>;\n  render?: RenderProp<ComponentPropsWithRef<\"button\">, ToolbarButtonState>;\n}\n\n/**\n * A toolbar command: `<button type=\"button\">` that runs `action` in its own transition\n * (`data-pending` while it runs). Disabled is `aria-disabled`, so it stays focusable.\n *\n * Owned keys (conventions 1.2): `type` (on a `<button>` only), `aria-disabled`, `data-pending`,\n * `data-disabled`, `onClick`.\n */\nexport function ToolbarButton({\n  action,\n  disabled = false,\n  transition,\n  className,\n  style,\n  children,\n  render,\n  ...rest\n}: ToolbarButtonProps) {\n  const { pending, run } = useActionTrigger();\n  const state: ToolbarButtonState = { pending, disabled };\n\n  const element = useRender<ComponentPropsWithRef<\"button\">, ToolbarButtonState>({\n    defaultElement: \"button\",\n    render,\n    state,\n    className,\n    style,\n    children,\n    props: rest,\n    libraryProps: {\n      ...(rendersButton(render) && { type: \"button\" as const }),\n      \"aria-disabled\": disabled ? true : undefined,\n      \"data-pending\": dataAttr(pending),\n      \"data-disabled\": dataAttr(disabled),\n      onClick: (event: MouseEvent<HTMLButtonElement>) => {\n        if (disabled) {\n          // A disabled link must not navigate either.\n          event.preventDefault();\n          return;\n        }\n        const details: ToolbarButtonActionDetails = createActionDetails(event.nativeEvent, {});\n        run(() => action?.(details));\n      },\n    },\n  });\n\n  return useTransitionBoundary(\"Toolbar.Button\", transition, element);\n}\n\nToolbarButton.displayName = \"ToolbarButton\";\n"],"mappings":";;;;;;;;;;;;;;;AAsDA,SAAgB,cAAc,EAC5B,QACA,WAAW,OACX,YACA,WACA,OACA,UACA,QACA,GAAG,QACkB;CACrB,MAAM,EAAE,SAAS,QAAQ,iBAAiB;CAG1C,MAAM,UAAU,UAA+D;EAC7E,gBAAgB;EAChB;EACA,OAAA;GALkC;GAAS;EAKvC;EACJ;EACA;EACA;EACA,OAAO;EACP,cAAc;GACZ,GAAI,cAAc,MAAM,KAAK,EAAE,MAAM,SAAkB;GACvD,iBAAiB,WAAW,OAAO,KAAA;GACnC,gBAAgB,SAAS,OAAO;GAChC,iBAAiB,SAAS,QAAQ;GAClC,UAAU,UAAyC;IACjD,IAAI,UAAU;KAEZ,MAAM,eAAe;KACrB;IACF;IACA,MAAM,UAAsC,oBAAoB,MAAM,aAAa,CAAC,CAAC;IACrF,UAAU,SAAS,OAAO,CAAC;GAC7B;EACF;CACF,CAAC;CAED,OAAO,sBAAsB,kBAAkB,YAAY,OAAO;AACpE;AAEA,cAAc,cAAc"}