@gridui/button 2.2.0 → 3.0.1

package/README.md

@@ -1,7 +1,7 @@
 # Button
 
 `@gridui/button` owns native buttons, button-styled links, shared button classes,
-async action scheduling, and browser download lifecycle. It has no domain,
+and async action scheduling. It has no domain,
 route, locale, or Layout dependency. Load `@gridui/button/styles.css` after
 the theme styles.
 
@@ -20,7 +20,9 @@ import "@gridui/button/styles.css";
 `Button` forwards native button props and refs. It defaults to `type="button"`;
 use `type="submit"` for a form action. `loading` disables the native button and
 exposes `aria-busy` without replacing the visible action name. Native `disabled`
-remains available independently of loading.
+remains available independently of loading. For a focusable unavailable action,
+supply `aria-disabled` and guard activation in its owner. ARIA/data-disabled
+attributes share the disabled appearance; native `disabled` blocks activation.
 
 `ButtonLink` forwards native anchor props and refs and requires `href`. It
 defaults to the secondary variant and retains navigation, modified-click,
@@ -72,11 +74,13 @@ direction matches the action and locale.
 
 Primary buttons use `accent-background` and `accent-foreground`. Secondary
 buttons use a transparent fill, foreground text, and a border; quiet buttons
-omit the border. Secondary and quiet surfaces use `surface-hover` while enabled.
-Disabled buttons keep their base fill and reduced opacity. Standard and small
+omit the border. All variants use Theme's shared hover and keyboard-focus outlines. Pressing
+overlays the existing background without fading the label or icon. Highlight
+buttons use `brand-tint` for persistent selection. Disabled buttons keep their
+base fill and reduced opacity. Standard and small
 sizes scale with the consumer's root font size.
 
-`highlight` uses the neutral `surface` fill and normal foreground. Use it for a
+`highlight` uses the local `brand-tint` fill and normal foreground. Use it for a
 persistent selected action, with `quiet` for its unselected peers. Choose the
 variant from application state and supply the matching native semantics, such as
 `aria-pressed` for a toggle or `aria-current="page"` for navigation. The variant
@@ -138,10 +142,6 @@ browser event loop, runs the action, and releases pending state on success or
 failure. Disabled actions and repeated activation while pending are ignored.
 Callers own business error handling and generated bytes.
 
-`downloadBlob(blob, filename)` creates the download anchor and object URL,
-activates the native download, removes the anchor, and releases the URL after
-the browser has had time to consume it. Callers own the Blob contents and name.
-
 ## Verification
 
 Package unit tests cover native action/link semantics, decorative icon isolation,

package/dist/index.d.ts

@@ -7,7 +7,6 @@
 export { useAsyncAction } from "./button/async-action";
 export type { ButtonProps } from "./button/button";
 export { Button } from "./button/button";
-export { downloadBlob } from "./button/download";
 export type { ButtonLinkProps } from "./button-link/button-link";
 export { ButtonLink } from "./button-link/button-link";
 export type { ButtonVariants } from "./shared/style";

package/dist/index.js

@@ -44,27 +44,27 @@ import { cva } from "class-variance-authority";
 var buttonStyles = cva(cn(
   "gridui-button",
   "gridui-u-inline-flex gridui-u-w-fit gridui-u-max-w-full gridui-u-min-w-0 gridui-u-items-center gridui-u-justify-center gridui-u-gap-gridui-8 gridui-u-border gridui-u-border-solid gridui-u-border-transparent gridui-u-rounded-control gridui-u-type-ui gridui-u-text-center gridui-u-no-underline gridui-u-wrap-anywhere gridui-u-cursor-pointer gridui-u-transition-colors gridui-u-duration-(--gridui-motion-duration-quick) gridui-u-ease-(--gridui-motion-ease-out)",
-  "gridui-u-[&_svg]:w-gridui-16 gridui-u-[&_svg]:h-gridui-16 gridui-u-[&_svg]:shrink-0 gridui-u-[&_svg]:pointer-events-none",
+  "gridui-u-[&_svg]:w-gridui-icon gridui-u-[&_svg]:h-gridui-icon gridui-u-[&_svg]:shrink-0 gridui-u-[&_svg]:pointer-events-none",
   "gridui-u-disabled:opacity-50 gridui-u-disabled:cursor-not-allowed",
-  "gridui-u-[&:hover:not(:disabled)]:border-foreground",
-  "gridui-u-[&:active:not(:disabled)]:opacity-[0.8]",
+  "gridui-u-aria-disabled:opacity-50 gridui-u-aria-disabled:cursor-not-allowed",
+  "gridui-u-data-disabled:opacity-50 gridui-u-data-disabled:cursor-not-allowed",
   "gridui-u-motion-reduce:transition-none"
 ));
 var buttonStandardStyles = cva(cn(
   "gridui-button-standard",
-  "gridui-u-min-h-11 gridui-u-py-gridui-8 gridui-u-px-gridui-16"
+  "gridui-u-min-h-gridui-control gridui-u-py-gridui-8 gridui-u-px-gridui-16"
 ));
 var buttonSmallStyles = cva(cn(
   "gridui-button-small",
-  "gridui-u-min-h-9 gridui-u-py-gridui-4 gridui-u-px-gridui-8"
+  "gridui-u-min-h-gridui-control-small gridui-u-py-gridui-4 gridui-u-px-gridui-8"
 ));
 var buttonLargeStyles = cva(cn(
   "gridui-button-large",
-  "gridui-u-min-h-12 gridui-u-py-gridui-8 gridui-u-px-gridui-24 gridui-u-[&_svg]:w-5 gridui-u-[&_svg]:h-5"
+  "gridui-u-min-h-gridui-control-large gridui-u-py-gridui-8 gridui-u-px-gridui-24 gridui-u-[&_svg]:w-gridui-icon-large gridui-u-[&_svg]:h-gridui-icon-large"
 ));
 var buttonExtraLargeStyles = cva(cn(
   "gridui-button-extra-large",
-  "gridui-u-min-h-18 gridui-u-py-gridui-16 gridui-u-px-gridui-24 gridui-u-[&_svg]:w-5 gridui-u-[&_svg]:h-5"
+  "gridui-u-min-h-18 gridui-u-py-gridui-16 gridui-u-px-gridui-24 gridui-u-[&_svg]:w-gridui-icon-large gridui-u-[&_svg]:h-gridui-icon-large"
 ));
 var buttonPrimaryStyles = cva(cn(
   "gridui-button-primary",
@@ -72,17 +72,15 @@ var buttonPrimaryStyles = cva(cn(
 ));
 var buttonSecondaryStyles = cva(cn(
   "gridui-button-secondary",
-  "gridui-u-text-foreground gridui-u-bg-transparent gridui-u-border-border",
-  "gridui-u-[&:hover:not(:disabled)]:bg-surface-hover"
+  "gridui-u-text-foreground gridui-u-bg-transparent gridui-u-border-border"
 ));
 var buttonQuietStyles = cva(cn(
   "gridui-button-quiet",
-  "gridui-u-text-foreground gridui-u-bg-transparent",
-  "gridui-u-[&:hover:not(:disabled)]:bg-surface-hover"
+  "gridui-u-text-foreground gridui-u-bg-transparent"
 ));
 var buttonHighlightStyles = cva(cn(
   "gridui-button-highlight",
-  "gridui-u-text-foreground gridui-u-bg-surface"
+  "gridui-u-text-foreground gridui-u-bg-brand-tint"
 ));
 var buttonTextStyles = cva(cn(
   "gridui-button-text",
@@ -107,11 +105,11 @@ var buttonRailStyles = cva(cn(
 ));
 var buttonIconStyles = cva(cn(
   "gridui-button-icon",
-  "gridui-u-w-11 gridui-u-h-11 gridui-u-shrink-0 gridui-u-p-0",
-  "gridui-u-[&.gridui-button-small]:w-9 gridui-u-[&.gridui-button-small]:h-9",
-  "gridui-u-[&.gridui-button-large]:w-12 gridui-u-[&.gridui-button-large]:h-12",
+  "gridui-u-w-gridui-control gridui-u-h-gridui-control gridui-u-shrink-0 gridui-u-p-0",
+  "gridui-u-[&.gridui-button-small]:w-gridui-control-small gridui-u-[&.gridui-button-small]:h-gridui-control-small",
+  "gridui-u-[&.gridui-button-large]:w-gridui-control-large gridui-u-[&.gridui-button-large]:h-gridui-control-large",
   "gridui-u-[&.gridui-button-extra-large]:w-18 gridui-u-[&.gridui-button-extra-large]:h-18",
-  "gridui-u-pointer-coarse:[&.gridui-button-small]:w-11 gridui-u-pointer-coarse:[&.gridui-button-small]:h-11"
+  "gridui-u-pointer-coarse:[&.gridui-button-small]:w-gridui-control gridui-u-pointer-coarse:[&.gridui-button-small]:h-gridui-control"
 ));
 var buttonDividedStyles = cva(cn(
   "gridui-button-divided",
@@ -137,9 +135,9 @@ var buttonEndRegionStyles = cva(cn(
 ), {
   variants: {
     size: {
-      small: "gridui-u-w-9",
-      standard: "gridui-u-w-11",
-      large: "gridui-u-w-12",
+      small: "gridui-u-w-gridui-control-small",
+      standard: "gridui-u-w-gridui-control",
+      large: "gridui-u-w-gridui-control-large",
       "extra-large": "gridui-u-w-gridui-64"
     }
   },
@@ -194,13 +192,12 @@ var buttonVariants = cva(buttonStyles(), {
 });
 var buttonClass = (variants = {}, className) => {
   const textVariant = variants.variant === "text" || variants.variant === "underlined";
-  const boundaryLayout = variants.layout === "cell" || variants.layout === "rail";
   return cn(buttonVariants({
     variant: variants.variant,
     size: variants.size,
     layout: variants.layout,
     iconMotion: variants.iconMotion
-  }), textVariant && "gridui-u-px-0", !textVariant && !boundaryLayout && "gridui-hover-surface", className);
+  }), textVariant && "gridui-u-px-0", className);
 };
 
 // src/shared/content.tsx
@@ -300,20 +297,6 @@ var Button = (props) => {
   );
 };
 
-// src/button/download.ts
-var downloadBlob = (blob, filename) => {
-  const url = URL.createObjectURL(blob);
-  const link = document.createElement("a");
-  link.href = url;
-  link.download = filename;
-  document.body.appendChild(link);
-  link.click();
-  link.remove();
-  window.setTimeout(() => {
-    URL.revokeObjectURL(url);
-  }, 3e4);
-};
-
 // src/button-link/button-link.tsx
 import { jsx as jsx3 } from "react/jsx-runtime";
 var ButtonLink = (props) => {
@@ -362,7 +345,6 @@ export {
   Button,
   ButtonLink,
   buttonClass,
-  downloadBlob,
   useAsyncAction
 };
 //# sourceMappingURL=index.js.map

package/dist/index.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
-  "sources": ["../src/button/async-action.ts", "../src/shared/style.ts", "../src/shared/content.tsx", "../src/button/button.tsx", "../src/button/download.ts", "../src/button-link/button-link.tsx"],
-  "sourcesContent": ["/**\n * @author WMXPY\n * @package Button\n * @namespace Button\n * @description Async Action\n */\n\nimport { useRef, useState } from \"react\";\n\ntype Action = () => void | Promise<void>;\n\nexport const performAsyncAction = async ({ action, onStart, onPendingChange }: {\n    readonly action: Action;\n    readonly onStart?: Action;\n    readonly onPendingChange: (pending: boolean) => void;\n}): Promise<void> => {\n    onPendingChange(true);\n    try {\n        await onStart?.();\n        await new Promise<void>((resolve) => {\n            setTimeout(resolve, 0);\n        });\n        await action();\n    } finally {\n        onPendingChange(false);\n    }\n};\n\nexport const useAsyncAction = ({ action, onStart, disabled = false }: {\n    readonly action: Action;\n    readonly onStart?: Action;\n    readonly disabled?: boolean;\n}) => {\n    const [\n        pending,\n        setPending,\n    ] = useState(false);\n    const active = useRef(false);\n    return {\n        pending,\n        async run(): Promise<void> {\n            if (disabled || active.current) {\n                return;\n            }\n            active.current = true;\n            try {\n                await performAsyncAction({\n                    action,\n                    ...(onStart ? { onStart } : {}),\n                    onPendingChange: setPending,\n                });\n            } finally {\n                active.current = false;\n            }\n        },\n    };\n};\n", "/**\n * @author WMXPY\n * @package Button\n * @namespace Shared\n * @description Style\n */\n\nimport { cn } from \"@gridui/style-utils\";\nimport { cva, type VariantProps } from \"class-variance-authority\";\n\nexport const buttonStyles = cva(cn(\n    \"gridui-button\",\n    \"gridui-u-inline-flex gridui-u-w-fit gridui-u-max-w-full gridui-u-min-w-0 gridui-u-items-center gridui-u-justify-center gridui-u-gap-gridui-8 gridui-u-border gridui-u-border-solid gridui-u-border-transparent gridui-u-rounded-control gridui-u-type-ui gridui-u-text-center gridui-u-no-underline gridui-u-wrap-anywhere gridui-u-cursor-pointer gridui-u-transition-colors gridui-u-duration-(--gridui-motion-duration-quick) gridui-u-ease-(--gridui-motion-ease-out)\",\n    \"gridui-u-[&_svg]:w-gridui-16 gridui-u-[&_svg]:h-gridui-16 gridui-u-[&_svg]:shrink-0 gridui-u-[&_svg]:pointer-events-none\",\n    \"gridui-u-disabled:opacity-50 gridui-u-disabled:cursor-not-allowed\",\n    \"gridui-u-[&:hover:not(:disabled)]:border-foreground\",\n    \"gridui-u-[&:active:not(:disabled)]:opacity-[0.8]\",\n    \"gridui-u-motion-reduce:transition-none\",\n));\n\nexport const buttonStandardStyles = cva(cn(\n    \"gridui-button-standard\",\n    \"gridui-u-min-h-11 gridui-u-py-gridui-8 gridui-u-px-gridui-16\",\n));\n\nexport const buttonSmallStyles = cva(cn(\n    \"gridui-button-small\",\n    \"gridui-u-min-h-9 gridui-u-py-gridui-4 gridui-u-px-gridui-8\",\n));\n\nexport const buttonLargeStyles = cva(cn(\n    \"gridui-button-large\",\n    \"gridui-u-min-h-12 gridui-u-py-gridui-8 gridui-u-px-gridui-24 gridui-u-[&_svg]:w-5 gridui-u-[&_svg]:h-5\",\n));\n\nexport const buttonExtraLargeStyles = cva(cn(\n    \"gridui-button-extra-large\",\n    \"gridui-u-min-h-18 gridui-u-py-gridui-16 gridui-u-px-gridui-24 gridui-u-[&_svg]:w-5 gridui-u-[&_svg]:h-5\",\n));\n\nexport const buttonPrimaryStyles = cva(cn(\n    \"gridui-button-primary\",\n    \"gridui-u-text-accent-foreground gridui-u-bg-accent-background gridui-u-border-accent-background\",\n));\n\nexport const buttonSecondaryStyles = cva(cn(\n    \"gridui-button-secondary\",\n    \"gridui-u-text-foreground gridui-u-bg-transparent gridui-u-border-border\",\n    \"gridui-u-[&:hover:not(:disabled)]:bg-surface-hover\",\n));\n\nexport const buttonQuietStyles = cva(cn(\n    \"gridui-button-quiet\",\n    \"gridui-u-text-foreground gridui-u-bg-transparent\",\n    \"gridui-u-[&:hover:not(:disabled)]:bg-surface-hover\",\n));\n\nexport const buttonHighlightStyles = cva(cn(\n    \"gridui-button-highlight\",\n    \"gridui-u-text-foreground gridui-u-bg-surface\",\n));\n\nexport const buttonTextStyles = cva(cn(\n    \"gridui-button-text\",\n    \"gridui-u-text-foreground gridui-u-bg-transparent gridui-u-border-0 gridui-u-rounded-none\",\n));\n\nexport const buttonUnderlinedStyles = cva(cn(\n    \"gridui-button-underlined\",\n    \"gridui-u-text-foreground gridui-u-bg-transparent gridui-u-border-0 gridui-u-border-b gridui-u-border-foreground gridui-u-rounded-none\",\n));\n\nexport const buttonEntryStyles = cva(cn(\n    \"gridui-button-entry\",\n    \"gridui-u-justify-between gridui-u-w-full gridui-u-py-gridui-16 gridui-u-px-gridui-24\",\n));\n\nexport const buttonCellStyles = cva(cn(\n    \"gridui-button-cell gridui-interaction-boundary\",\n    \"gridui-u-w-full gridui-u-h-full gridui-u-justify-start gridui-u-rounded-none gridui-u-border-0 gridui-u-py-gridui-16 gridui-u-px-gridui-24 gridui-u-text-left\",\n));\n\nexport const buttonRailStyles = cva(cn(\n    \"gridui-button-rail gridui-interaction-boundary\",\n    \"gridui-u-w-full gridui-u-min-w-gridui-24 gridui-u-flex-col gridui-u-py-gridui-8 gridui-u-px-0\",\n    \"gridui-u-[&_>_span]:[writing-mode:vertical-rl] gridui-u-[&_>_span]:whitespace-nowrap\",\n));\n\nexport const buttonIconStyles = cva(cn(\n    \"gridui-button-icon\",\n    \"gridui-u-w-11 gridui-u-h-11 gridui-u-shrink-0 gridui-u-p-0\",\n    \"gridui-u-[&.gridui-button-small]:w-9 gridui-u-[&.gridui-button-small]:h-9\",\n    \"gridui-u-[&.gridui-button-large]:w-12 gridui-u-[&.gridui-button-large]:h-12\",\n    \"gridui-u-[&.gridui-button-extra-large]:w-18 gridui-u-[&.gridui-button-extra-large]:h-18\",\n    \"gridui-u-pointer-coarse:[&.gridui-button-small]:w-11 gridui-u-pointer-coarse:[&.gridui-button-small]:h-11\",\n));\n\nexport const buttonDividedStyles = cva(cn(\n    \"gridui-button-divided\",\n    \"gridui-u-w-full gridui-u-items-stretch gridui-u-justify-between gridui-u-gap-0 gridui-u-rounded-none gridui-u-p-0 gridui-u-text-start\",\n));\n\nexport const buttonLabelStyles = cva(cn(\n    \"gridui-button-label\",\n    \"gridui-u-inline-flex gridui-u-min-w-0 gridui-u-flex-1 gridui-u-items-center gridui-u-gap-gridui-8\",\n), {\n    variants: {\n        size: {\n            small: \"gridui-u-py-gridui-4 gridui-u-px-gridui-8\",\n            standard: \"gridui-u-py-gridui-8 gridui-u-px-gridui-16\",\n            large: \"gridui-u-py-gridui-8 gridui-u-px-gridui-24\",\n            \"extra-large\": \"gridui-u-py-gridui-16 gridui-u-px-gridui-24\",\n        },\n    },\n    defaultVariants: { size: \"standard\" },\n});\n\nexport const buttonEndRegionStyles = cva(cn(\n    \"gridui-button-end-region\",\n    \"gridui-u-justify-center gridui-u-self-stretch gridui-u-border-s gridui-u-border-solid gridui-u-border-current/25\",\n), {\n    variants: {\n        size: {\n            small: \"gridui-u-w-9\",\n            standard: \"gridui-u-w-11\",\n            large: \"gridui-u-w-12\",\n            \"extra-large\": \"gridui-u-w-gridui-64\",\n        },\n    },\n    defaultVariants: { size: \"standard\" },\n});\n\nexport const buttonVariants = cva(buttonStyles(), {\n    variants: {\n        variant: {\n            primary: buttonPrimaryStyles(),\n            secondary: buttonSecondaryStyles(),\n            quiet: buttonQuietStyles(),\n            highlight: buttonHighlightStyles(),\n            text: buttonTextStyles(),\n            underlined: buttonUnderlinedStyles(),\n        },\n        size: {\n            small: buttonSmallStyles(),\n            standard: buttonStandardStyles(),\n            large: buttonLargeStyles(),\n            \"extra-large\": buttonExtraLargeStyles(),\n        },\n        layout: {\n            standard: \"\",\n            icon: buttonIconStyles(),\n            entry: buttonEntryStyles(),\n            cell: buttonCellStyles(),\n            rail: buttonRailStyles(),\n            divided: buttonDividedStyles(),\n        },\n        iconMotion: {\n            none: \"\",\n            outward: \"gridui-button-icon-motion-outward\",\n        },\n    },\n    compoundVariants: [\n        {\n            variant: [\n                \"text\",\n                \"underlined\",\n            ],\n            size: [\n                \"large\",\n                \"extra-large\",\n            ],\n            className: \"gridui-u-gap-gridui-32 gridui-u-type-supporting\",\n        },\n    ],\n    defaultVariants: {\n        variant: \"primary\",\n        size: \"standard\",\n    },\n});\n\ntype ButtonStyleVariants = VariantProps<typeof buttonVariants>;\n\nexport type ButtonVariants = Omit<ButtonStyleVariants, \"variant\" | \"layout\"> & (\n    | {\n        readonly variant: \"text\" | \"underlined\";\n        readonly layout?: \"standard\" | null | undefined;\n    }\n    | {\n        readonly variant?: Exclude<ButtonStyleVariants[\"variant\"], \"text\" | \"underlined\">;\n        readonly layout?: ButtonStyleVariants[\"layout\"];\n    }\n);\n\nexport const buttonClass = (variants: ButtonVariants = {}, className?: string): string => {\n    const textVariant = variants.variant === \"text\" || variants.variant === \"underlined\";\n    const boundaryLayout = variants.layout === \"cell\" || variants.layout === \"rail\";\n    return cn(buttonVariants({\n        variant: variants.variant,\n        size: variants.size,\n        layout: variants.layout,\n        iconMotion: variants.iconMotion,\n    }), textVariant && \"gridui-u-px-0\", !textVariant && !boundaryLayout && \"gridui-hover-surface\", className);\n};\n", "/**\n * @author WMXPY\n * @package Button\n * @namespace Shared\n * @description Content\n */\n\nimport { buttonEndRegionStyles, buttonLabelStyles, type ButtonVariants } from \"./style\";\nimport { cn } from \"@gridui/style-utils\";\nimport type { FC, ReactNode } from \"react\";\n\nexport type ButtonContentProps = {\n    readonly children?: ReactNode;\n    readonly startIcon?: ReactNode;\n    readonly endIcon?: ReactNode;\n    readonly layout?: ButtonVariants[\"layout\"];\n    readonly size?: ButtonVariants[\"size\"];\n    readonly iconMotion?: ButtonVariants[\"iconMotion\"];\n};\n\nexport const ButtonContent: FC<ButtonContentProps> = (props: ButtonContentProps) => {\n    const { children, startIcon, endIcon, layout, size, iconMotion } = props;\n    const label = (<>\n        {startIcon !== undefined && startIcon !== null && typeof startIcon !== \"boolean\" && (<span\n            className=\"gridui-button-adornment gridui-u-inline-flex gridui-u-shrink-0 gridui-u-items-center gridui-u-pointer-events-none\"\n            aria-hidden=\"true\"\n            inert\n        >\n            {startIcon}\n        </span>)}\n        {children}\n    </>);\n\n    return (<>\n        {layout === \"divided\" ? (<span\n            className={buttonLabelStyles({ size })}\n        >\n            {label}\n        </span>) : label}\n        {endIcon !== undefined && endIcon !== null && typeof endIcon !== \"boolean\" && (<span\n            className={cn(\n                \"gridui-button-adornment gridui-u-inline-flex gridui-u-shrink-0 gridui-u-items-center gridui-u-pointer-events-none\",\n                layout === \"divided\" && buttonEndRegionStyles({ size }),\n            )}\n            aria-hidden=\"true\"\n            inert\n        >\n            {iconMotion === \"outward\" ? (<span\n                className=\"gridui-button-end-icon gridui-u-inline-flex\"\n            >\n                {endIcon}\n            </span>) : endIcon}\n        </span>)}\n    </>);\n};\n", "/**\n * @author WMXPY\n * @package Button\n * @namespace Button\n * @description Button\n */\n\nimport { ButtonContent } from \"../shared/content\";\nimport { buttonClass, type ButtonVariants } from \"../shared/style\";\nimport type { ComponentPropsWithRef, FC, ReactNode } from \"react\";\n\nexport type ButtonProps = ComponentPropsWithRef<\"button\"> & ButtonVariants & {\n    readonly loading?: boolean;\n    readonly startIcon?: ReactNode;\n    readonly endIcon?: ReactNode;\n};\n\nexport const Button: FC<ButtonProps> = (props: ButtonProps) => {\n    const {\n        variant,\n        size,\n        layout,\n        iconMotion,\n        loading = false,\n        disabled,\n        type = \"button\",\n        className,\n        children,\n        startIcon,\n        endIcon,\n        ...restProps\n    } = props;\n    const variants: ButtonVariants = (variant === \"text\" || variant === \"underlined\") ? {\n        variant,\n        size,\n        layout: \"standard\",\n        iconMotion,\n    } : {\n        variant,\n        size,\n        layout,\n        iconMotion,\n    };\n    return (<button\n        {...restProps}\n        type={type}\n        disabled={disabled || loading}\n        aria-busy={loading || restProps[\"aria-busy\"]}\n        className={buttonClass(variants, className)}\n    >\n        <ButtonContent\n            layout={variants.layout}\n            size={size}\n            iconMotion={iconMotion}\n            startIcon={startIcon}\n            endIcon={endIcon}\n        >\n            {children}\n        </ButtonContent>\n    </button>);\n};\n", "/**\n * @author WMXPY\n * @package Button\n * @namespace Button\n * @description Download\n */\n\nexport const downloadBlob = (blob: Blob, filename: string): void => {\n    const url = URL.createObjectURL(blob);\n    const link = document.createElement(\"a\");\n    link.href = url;\n    link.download = filename;\n    document.body.appendChild(link);\n    link.click();\n    link.remove();\n    window.setTimeout(() => {\n        URL.revokeObjectURL(url);\n    }, 30000);\n};\n", "/**\n * @author WMXPY\n * @package Button\n * @namespace ButtonLink\n * @description Button Link\n */\n\nimport { ButtonContent } from \"../shared/content\";\nimport { buttonClass, type ButtonVariants } from \"../shared/style\";\nimport type { ComponentPropsWithRef, FC, ReactNode } from \"react\";\n\nexport type ButtonLinkProps = ComponentPropsWithRef<\"a\"> & ButtonVariants & {\n    readonly href: string;\n    readonly startIcon?: ReactNode;\n    readonly endIcon?: ReactNode;\n};\n\nexport const ButtonLink: FC<ButtonLinkProps> = (props: ButtonLinkProps) => {\n    const {\n        variant = \"secondary\",\n        size,\n        layout,\n        iconMotion,\n        className,\n        children,\n        startIcon,\n        endIcon,\n        ...restProps\n    } = props;\n    const variants: ButtonVariants = (variant === \"text\" || variant === \"underlined\") ? {\n        variant,\n        size,\n        layout: \"standard\",\n        iconMotion,\n    } : {\n        variant,\n        size,\n        layout,\n        iconMotion,\n    };\n    return (<a\n        {...restProps}\n        className={buttonClass(variants, className)}\n    >\n        <ButtonContent\n            layout={variants.layout}\n            size={size}\n            iconMotion={iconMotion}\n            startIcon={startIcon}\n            endIcon={endIcon}\n        >\n            {children}\n        </ButtonContent>\n    </a>);\n};\n"],
-  "mappings": "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",
+  "sources": ["../src/button/async-action.ts", "../src/shared/style.ts", "../src/shared/content.tsx", "../src/button/button.tsx", "../src/button-link/button-link.tsx"],
+  "sourcesContent": ["/**\n * @author WMXPY\n * @package Button\n * @namespace Button\n * @description Async Action\n */\n\nimport { useRef, useState } from \"react\";\n\ntype Action = () => void | Promise<void>;\n\nexport const performAsyncAction = async ({ action, onStart, onPendingChange }: {\n    readonly action: Action;\n    readonly onStart?: Action;\n    readonly onPendingChange: (pending: boolean) => void;\n}): Promise<void> => {\n    onPendingChange(true);\n    try {\n        await onStart?.();\n        await new Promise<void>((resolve) => {\n            setTimeout(resolve, 0);\n        });\n        await action();\n    } finally {\n        onPendingChange(false);\n    }\n};\n\nexport const useAsyncAction = ({ action, onStart, disabled = false }: {\n    readonly action: Action;\n    readonly onStart?: Action;\n    readonly disabled?: boolean;\n}) => {\n    const [\n        pending,\n        setPending,\n    ] = useState(false);\n    const active = useRef(false);\n    return {\n        pending,\n        async run(): Promise<void> {\n            if (disabled || active.current) {\n                return;\n            }\n            active.current = true;\n            try {\n                await performAsyncAction({\n                    action,\n                    ...(onStart ? { onStart } : {}),\n                    onPendingChange: setPending,\n                });\n            } finally {\n                active.current = false;\n            }\n        },\n    };\n};\n", "/**\n * @author WMXPY\n * @package Button\n * @namespace Shared\n * @description Style\n */\n\nimport { cn } from \"@gridui/style-utils\";\nimport { cva, type VariantProps } from \"class-variance-authority\";\n\nexport const buttonStyles = cva(cn(\n    \"gridui-button\",\n    \"gridui-u-inline-flex gridui-u-w-fit gridui-u-max-w-full gridui-u-min-w-0 gridui-u-items-center gridui-u-justify-center gridui-u-gap-gridui-8 gridui-u-border gridui-u-border-solid gridui-u-border-transparent gridui-u-rounded-control gridui-u-type-ui gridui-u-text-center gridui-u-no-underline gridui-u-wrap-anywhere gridui-u-cursor-pointer gridui-u-transition-colors gridui-u-duration-(--gridui-motion-duration-quick) gridui-u-ease-(--gridui-motion-ease-out)\",\n    \"gridui-u-[&_svg]:w-gridui-icon gridui-u-[&_svg]:h-gridui-icon gridui-u-[&_svg]:shrink-0 gridui-u-[&_svg]:pointer-events-none\",\n    \"gridui-u-disabled:opacity-50 gridui-u-disabled:cursor-not-allowed\",\n    \"gridui-u-aria-disabled:opacity-50 gridui-u-aria-disabled:cursor-not-allowed\",\n    \"gridui-u-data-disabled:opacity-50 gridui-u-data-disabled:cursor-not-allowed\",\n    \"gridui-u-motion-reduce:transition-none\",\n));\n\nexport const buttonStandardStyles = cva(cn(\n    \"gridui-button-standard\",\n    \"gridui-u-min-h-gridui-control gridui-u-py-gridui-8 gridui-u-px-gridui-16\",\n));\n\nexport const buttonSmallStyles = cva(cn(\n    \"gridui-button-small\",\n    \"gridui-u-min-h-gridui-control-small gridui-u-py-gridui-4 gridui-u-px-gridui-8\",\n));\n\nexport const buttonLargeStyles = cva(cn(\n    \"gridui-button-large\",\n    \"gridui-u-min-h-gridui-control-large gridui-u-py-gridui-8 gridui-u-px-gridui-24 gridui-u-[&_svg]:w-gridui-icon-large gridui-u-[&_svg]:h-gridui-icon-large\",\n));\n\nexport const buttonExtraLargeStyles = cva(cn(\n    \"gridui-button-extra-large\",\n    \"gridui-u-min-h-18 gridui-u-py-gridui-16 gridui-u-px-gridui-24 gridui-u-[&_svg]:w-gridui-icon-large gridui-u-[&_svg]:h-gridui-icon-large\",\n));\n\nexport const buttonPrimaryStyles = cva(cn(\n    \"gridui-button-primary\",\n    \"gridui-u-text-accent-foreground gridui-u-bg-accent-background gridui-u-border-accent-background\",\n));\n\nexport const buttonSecondaryStyles = cva(cn(\n    \"gridui-button-secondary\",\n    \"gridui-u-text-foreground gridui-u-bg-transparent gridui-u-border-border\",\n));\n\nexport const buttonQuietStyles = cva(cn(\n    \"gridui-button-quiet\",\n    \"gridui-u-text-foreground gridui-u-bg-transparent\",\n));\n\nexport const buttonHighlightStyles = cva(cn(\n    \"gridui-button-highlight\",\n    \"gridui-u-text-foreground gridui-u-bg-brand-tint\",\n));\n\nexport const buttonTextStyles = cva(cn(\n    \"gridui-button-text\",\n    \"gridui-u-text-foreground gridui-u-bg-transparent gridui-u-border-0 gridui-u-rounded-none\",\n));\n\nexport const buttonUnderlinedStyles = cva(cn(\n    \"gridui-button-underlined\",\n    \"gridui-u-text-foreground gridui-u-bg-transparent gridui-u-border-0 gridui-u-border-b gridui-u-border-foreground gridui-u-rounded-none\",\n));\n\nexport const buttonEntryStyles = cva(cn(\n    \"gridui-button-entry\",\n    \"gridui-u-justify-between gridui-u-w-full gridui-u-py-gridui-16 gridui-u-px-gridui-24\",\n));\n\nexport const buttonCellStyles = cva(cn(\n    \"gridui-button-cell gridui-interaction-boundary\",\n    \"gridui-u-w-full gridui-u-h-full gridui-u-justify-start gridui-u-rounded-none gridui-u-border-0 gridui-u-py-gridui-16 gridui-u-px-gridui-24 gridui-u-text-left\",\n));\n\nexport const buttonRailStyles = cva(cn(\n    \"gridui-button-rail gridui-interaction-boundary\",\n    \"gridui-u-w-full gridui-u-min-w-gridui-24 gridui-u-flex-col gridui-u-py-gridui-8 gridui-u-px-0\",\n    \"gridui-u-[&_>_span]:[writing-mode:vertical-rl] gridui-u-[&_>_span]:whitespace-nowrap\",\n));\n\nexport const buttonIconStyles = cva(cn(\n    \"gridui-button-icon\",\n    \"gridui-u-w-gridui-control gridui-u-h-gridui-control gridui-u-shrink-0 gridui-u-p-0\",\n    \"gridui-u-[&.gridui-button-small]:w-gridui-control-small gridui-u-[&.gridui-button-small]:h-gridui-control-small\",\n    \"gridui-u-[&.gridui-button-large]:w-gridui-control-large gridui-u-[&.gridui-button-large]:h-gridui-control-large\",\n    \"gridui-u-[&.gridui-button-extra-large]:w-18 gridui-u-[&.gridui-button-extra-large]:h-18\",\n    \"gridui-u-pointer-coarse:[&.gridui-button-small]:w-gridui-control gridui-u-pointer-coarse:[&.gridui-button-small]:h-gridui-control\",\n));\n\nexport const buttonDividedStyles = cva(cn(\n    \"gridui-button-divided\",\n    \"gridui-u-w-full gridui-u-items-stretch gridui-u-justify-between gridui-u-gap-0 gridui-u-rounded-none gridui-u-p-0 gridui-u-text-start\",\n));\n\nexport const buttonLabelStyles = cva(cn(\n    \"gridui-button-label\",\n    \"gridui-u-inline-flex gridui-u-min-w-0 gridui-u-flex-1 gridui-u-items-center gridui-u-gap-gridui-8\",\n), {\n    variants: {\n        size: {\n            small: \"gridui-u-py-gridui-4 gridui-u-px-gridui-8\",\n            standard: \"gridui-u-py-gridui-8 gridui-u-px-gridui-16\",\n            large: \"gridui-u-py-gridui-8 gridui-u-px-gridui-24\",\n            \"extra-large\": \"gridui-u-py-gridui-16 gridui-u-px-gridui-24\",\n        },\n    },\n    defaultVariants: { size: \"standard\" },\n});\n\nexport const buttonEndRegionStyles = cva(cn(\n    \"gridui-button-end-region\",\n    \"gridui-u-justify-center gridui-u-self-stretch gridui-u-border-s gridui-u-border-solid gridui-u-border-current/25\",\n), {\n    variants: {\n        size: {\n            small: \"gridui-u-w-gridui-control-small\",\n            standard: \"gridui-u-w-gridui-control\",\n            large: \"gridui-u-w-gridui-control-large\",\n            \"extra-large\": \"gridui-u-w-gridui-64\",\n        },\n    },\n    defaultVariants: { size: \"standard\" },\n});\n\nexport const buttonVariants = cva(buttonStyles(), {\n    variants: {\n        variant: {\n            primary: buttonPrimaryStyles(),\n            secondary: buttonSecondaryStyles(),\n            quiet: buttonQuietStyles(),\n            highlight: buttonHighlightStyles(),\n            text: buttonTextStyles(),\n            underlined: buttonUnderlinedStyles(),\n        },\n        size: {\n            small: buttonSmallStyles(),\n            standard: buttonStandardStyles(),\n            large: buttonLargeStyles(),\n            \"extra-large\": buttonExtraLargeStyles(),\n        },\n        layout: {\n            standard: \"\",\n            icon: buttonIconStyles(),\n            entry: buttonEntryStyles(),\n            cell: buttonCellStyles(),\n            rail: buttonRailStyles(),\n            divided: buttonDividedStyles(),\n        },\n        iconMotion: {\n            none: \"\",\n            outward: \"gridui-button-icon-motion-outward\",\n        },\n    },\n    compoundVariants: [\n        {\n            variant: [\n                \"text\",\n                \"underlined\",\n            ],\n            size: [\n                \"large\",\n                \"extra-large\",\n            ],\n            className: \"gridui-u-gap-gridui-32 gridui-u-type-supporting\",\n        },\n    ],\n    defaultVariants: {\n        variant: \"primary\",\n        size: \"standard\",\n    },\n});\n\ntype ButtonStyleVariants = VariantProps<typeof buttonVariants>;\n\nexport type ButtonVariants = Omit<ButtonStyleVariants, \"variant\" | \"layout\"> & (\n    | {\n        readonly variant: \"text\" | \"underlined\";\n        readonly layout?: \"standard\" | null | undefined;\n    }\n    | {\n        readonly variant?: Exclude<ButtonStyleVariants[\"variant\"], \"text\" | \"underlined\">;\n        readonly layout?: ButtonStyleVariants[\"layout\"];\n    }\n);\n\nexport const buttonClass = (variants: ButtonVariants = {}, className?: string): string => {\n    const textVariant = variants.variant === \"text\" || variants.variant === \"underlined\";\n    return cn(buttonVariants({\n        variant: variants.variant,\n        size: variants.size,\n        layout: variants.layout,\n        iconMotion: variants.iconMotion,\n    }), textVariant && \"gridui-u-px-0\", className);\n};\n", "/**\n * @author WMXPY\n * @package Button\n * @namespace Shared\n * @description Content\n */\n\nimport { buttonEndRegionStyles, buttonLabelStyles, type ButtonVariants } from \"./style\";\nimport { cn } from \"@gridui/style-utils\";\nimport type { FC, ReactNode } from \"react\";\n\nexport type ButtonContentProps = {\n    readonly children?: ReactNode;\n    readonly startIcon?: ReactNode;\n    readonly endIcon?: ReactNode;\n    readonly layout?: ButtonVariants[\"layout\"];\n    readonly size?: ButtonVariants[\"size\"];\n    readonly iconMotion?: ButtonVariants[\"iconMotion\"];\n};\n\nexport const ButtonContent: FC<ButtonContentProps> = (props: ButtonContentProps) => {\n    const { children, startIcon, endIcon, layout, size, iconMotion } = props;\n    const label = (<>\n        {startIcon !== undefined && startIcon !== null && typeof startIcon !== \"boolean\" && (<span\n            className=\"gridui-button-adornment gridui-u-inline-flex gridui-u-shrink-0 gridui-u-items-center gridui-u-pointer-events-none\"\n            aria-hidden=\"true\"\n            inert\n        >\n            {startIcon}\n        </span>)}\n        {children}\n    </>);\n\n    return (<>\n        {layout === \"divided\" ? (<span\n            className={buttonLabelStyles({ size })}\n        >\n            {label}\n        </span>) : label}\n        {endIcon !== undefined && endIcon !== null && typeof endIcon !== \"boolean\" && (<span\n            className={cn(\n                \"gridui-button-adornment gridui-u-inline-flex gridui-u-shrink-0 gridui-u-items-center gridui-u-pointer-events-none\",\n                layout === \"divided\" && buttonEndRegionStyles({ size }),\n            )}\n            aria-hidden=\"true\"\n            inert\n        >\n            {iconMotion === \"outward\" ? (<span\n                className=\"gridui-button-end-icon gridui-u-inline-flex\"\n            >\n                {endIcon}\n            </span>) : endIcon}\n        </span>)}\n    </>);\n};\n", "/**\n * @author WMXPY\n * @package Button\n * @namespace Button\n * @description Button\n */\n\nimport { ButtonContent } from \"../shared/content\";\nimport { buttonClass, type ButtonVariants } from \"../shared/style\";\nimport type { ComponentPropsWithRef, FC, ReactNode } from \"react\";\n\nexport type ButtonProps = ComponentPropsWithRef<\"button\"> & ButtonVariants & {\n    readonly loading?: boolean;\n    readonly startIcon?: ReactNode;\n    readonly endIcon?: ReactNode;\n};\n\nexport const Button: FC<ButtonProps> = (props: ButtonProps) => {\n    const {\n        variant,\n        size,\n        layout,\n        iconMotion,\n        loading = false,\n        disabled,\n        type = \"button\",\n        className,\n        children,\n        startIcon,\n        endIcon,\n        ...restProps\n    } = props;\n    const variants: ButtonVariants = (variant === \"text\" || variant === \"underlined\") ? {\n        variant,\n        size,\n        layout: \"standard\",\n        iconMotion,\n    } : {\n        variant,\n        size,\n        layout,\n        iconMotion,\n    };\n    return (<button\n        {...restProps}\n        type={type}\n        disabled={disabled || loading}\n        aria-busy={loading || restProps[\"aria-busy\"]}\n        className={buttonClass(variants, className)}\n    >\n        <ButtonContent\n            layout={variants.layout}\n            size={size}\n            iconMotion={iconMotion}\n            startIcon={startIcon}\n            endIcon={endIcon}\n        >\n            {children}\n        </ButtonContent>\n    </button>);\n};\n", "/**\n * @author WMXPY\n * @package Button\n * @namespace ButtonLink\n * @description Button Link\n */\n\nimport { ButtonContent } from \"../shared/content\";\nimport { buttonClass, type ButtonVariants } from \"../shared/style\";\nimport type { ComponentPropsWithRef, FC, ReactNode } from \"react\";\n\nexport type ButtonLinkProps = ComponentPropsWithRef<\"a\"> & ButtonVariants & {\n    readonly href: string;\n    readonly startIcon?: ReactNode;\n    readonly endIcon?: ReactNode;\n};\n\nexport const ButtonLink: FC<ButtonLinkProps> = (props: ButtonLinkProps) => {\n    const {\n        variant = \"secondary\",\n        size,\n        layout,\n        iconMotion,\n        className,\n        children,\n        startIcon,\n        endIcon,\n        ...restProps\n    } = props;\n    const variants: ButtonVariants = (variant === \"text\" || variant === \"underlined\") ? {\n        variant,\n        size,\n        layout: \"standard\",\n        iconMotion,\n    } : {\n        variant,\n        size,\n        layout,\n        iconMotion,\n    };\n    return (<a\n        {...restProps}\n        className={buttonClass(variants, className)}\n    >\n        <ButtonContent\n            layout={variants.layout}\n            size={size}\n            iconMotion={iconMotion}\n            startIcon={startIcon}\n            endIcon={endIcon}\n        >\n            {children}\n        </ButtonContent>\n    </a>);\n};\n"],
+  "mappings": "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",
   "names": ["cn", "jsx", "jsx"]
 }

package/dist/styles.css

@@ -15,32 +15,23 @@
   .gridui-u-inline-flex {
     display: inline-flex;
   }
-  .gridui-u-h-11 {
-    height: calc(var(--spacing) * 11);
-  }
   .gridui-u-h-full {
     height: 100%;
   }
-  .gridui-u-min-h-9 {
-    min-height: calc(var(--spacing) * 9);
-  }
-  .gridui-u-min-h-11 {
-    min-height: calc(var(--spacing) * 11);
-  }
-  .gridui-u-min-h-12 {
-    min-height: calc(var(--spacing) * 12);
+  .gridui-u-h-gridui-control {
+    height: var(--gridui-control-min-height);
   }
   .gridui-u-min-h-18 {
     min-height: calc(var(--spacing) * 18);
   }
-  .gridui-u-w-9 {
-    width: calc(var(--spacing) * 9);
+  .gridui-u-min-h-gridui-control {
+    min-height: var(--gridui-control-min-height);
   }
-  .gridui-u-w-11 {
-    width: calc(var(--spacing) * 11);
+  .gridui-u-min-h-gridui-control-large {
+    min-height: var(--gridui-control-min-height-large);
   }
-  .gridui-u-w-12 {
-    width: calc(var(--spacing) * 12);
+  .gridui-u-min-h-gridui-control-small {
+    min-height: var(--gridui-control-min-height-small);
   }
   .gridui-u-w-fit {
     width: fit-content;
@@ -51,6 +42,15 @@
   .gridui-u-w-gridui-64 {
     width: var(--gridui-space-64);
   }
+  .gridui-u-w-gridui-control {
+    width: var(--gridui-control-min-height);
+  }
+  .gridui-u-w-gridui-control-large {
+    width: var(--gridui-control-min-height-large);
+  }
+  .gridui-u-w-gridui-control-small {
+    width: var(--gridui-control-min-height-small);
+  }
   .gridui-u-max-w-full {
     max-width: 100%;
   }
@@ -146,8 +146,8 @@
   .gridui-u-bg-accent-background {
     background-color: var(--gridui-accent-background);
   }
-  .gridui-u-bg-surface {
-    background-color: var(--gridui-surface);
+  .gridui-u-bg-brand-tint {
+    background-color: var(--gridui-brand-tint);
   }
   .gridui-u-bg-transparent {
     background-color: transparent;
@@ -224,6 +224,18 @@
   .gridui-u-disabled\:opacity-50:disabled {
     opacity: 50%;
   }
+  .gridui-u-aria-disabled\:cursor-not-allowed[aria-disabled="true"] {
+    cursor: not-allowed;
+  }
+  .gridui-u-aria-disabled\:opacity-50[aria-disabled="true"] {
+    opacity: 50%;
+  }
+  .gridui-u-data-disabled\:cursor-not-allowed[data-disabled] {
+    cursor: not-allowed;
+  }
+  .gridui-u-data-disabled\:opacity-50[data-disabled] {
+    opacity: 50%;
+  }
   @media (prefers-reduced-motion: reduce) {
     .gridui-u-motion-reduce\:transition-none {
       transition-property: none;
@@ -238,17 +250,17 @@
   .gridui-u-\[\&_svg\]\:pointer-events-none svg {
     pointer-events: none;
   }
-  .gridui-u-\[\&_svg\]\:h-5 svg {
-    height: calc(var(--spacing) * 5);
+  .gridui-u-\[\&_svg\]\:h-gridui-icon svg {
+    height: var(--gridui-icon-size);
   }
-  .gridui-u-\[\&_svg\]\:h-gridui-16 svg {
-    height: var(--gridui-space-16);
+  .gridui-u-\[\&_svg\]\:h-gridui-icon-large svg {
+    height: var(--gridui-icon-size-large);
   }
-  .gridui-u-\[\&_svg\]\:w-5 svg {
-    width: calc(var(--spacing) * 5);
+  .gridui-u-\[\&_svg\]\:w-gridui-icon svg {
+    width: var(--gridui-icon-size);
   }
-  .gridui-u-\[\&_svg\]\:w-gridui-16 svg {
-    width: var(--gridui-space-16);
+  .gridui-u-\[\&_svg\]\:w-gridui-icon-large svg {
+    width: var(--gridui-icon-size-large);
   }
   .gridui-u-\[\&_svg\]\:shrink-0 svg {
     flex-shrink: 0;
@@ -259,45 +271,36 @@
   .gridui-u-\[\&\.gridui-button-extra-large\]\:w-18.gridui-button-extra-large {
     width: calc(var(--spacing) * 18);
   }
-  .gridui-u-\[\&\.gridui-button-large\]\:h-12.gridui-button-large {
-    height: calc(var(--spacing) * 12);
+  .gridui-u-\[\&\.gridui-button-large\]\:h-gridui-control-large.gridui-button-large {
+    height: var(--gridui-control-min-height-large);
   }
-  .gridui-u-\[\&\.gridui-button-large\]\:w-12.gridui-button-large {
-    width: calc(var(--spacing) * 12);
+  .gridui-u-\[\&\.gridui-button-large\]\:w-gridui-control-large.gridui-button-large {
+    width: var(--gridui-control-min-height-large);
   }
-  .gridui-u-\[\&\.gridui-button-small\]\:h-9.gridui-button-small {
-    height: calc(var(--spacing) * 9);
+  .gridui-u-\[\&\.gridui-button-small\]\:h-gridui-control-small.gridui-button-small {
+    height: var(--gridui-control-min-height-small);
   }
-  .gridui-u-\[\&\.gridui-button-small\]\:w-9.gridui-button-small {
-    width: calc(var(--spacing) * 9);
+  .gridui-u-\[\&\.gridui-button-small\]\:w-gridui-control-small.gridui-button-small {
+    width: var(--gridui-control-min-height-small);
   }
   @media (pointer: coarse) {
-    .gridui-u-pointer-coarse\:\[\&\.gridui-button-small\]\:h-11.gridui-button-small {
-      height: calc(var(--spacing) * 11);
+    .gridui-u-pointer-coarse\:\[\&\.gridui-button-small\]\:h-gridui-control.gridui-button-small {
+      height: var(--gridui-control-min-height);
     }
-    .gridui-u-pointer-coarse\:\[\&\.gridui-button-small\]\:w-11.gridui-button-small {
-      width: calc(var(--spacing) * 11);
+    .gridui-u-pointer-coarse\:\[\&\.gridui-button-small\]\:w-gridui-control.gridui-button-small {
+      width: var(--gridui-control-min-height);
     }
   }
-  .gridui-u-\[\&\:active\:not\(\:disabled\)\]\:opacity-\[0\.8\]:active:not(:disabled) {
-    opacity: 0.8;
-  }
-  .gridui-u-\[\&\:hover\:not\(\:disabled\)\]\:border-foreground:hover:not(:disabled) {
-    border-color: var(--gridui-foreground);
-  }
-  .gridui-u-\[\&\:hover\:not\(\:disabled\)\]\:bg-surface-hover:hover:not(:disabled) {
-    background-color: var(--gridui-surface-hover);
-  }
 }
 @layer components {
   @media (prefers-reduced-motion: no-preference) {
-    .gridui-button-icon-motion-outward:not(:disabled) .gridui-button-end-icon {
+    .gridui-button-icon-motion-outward:not(:disabled, [aria-disabled="true"], [data-disabled], [aria-readonly="true"], [data-readonly], [readonly]) .gridui-button-end-icon {
       transition: transform var(--gridui-motion-duration-quick) var(--gridui-motion-ease-out);
     }
-    .gridui-button-icon-motion-outward:hover:not(:disabled) .gridui-button-end-icon {
+    .gridui-button-icon-motion-outward:not(:disabled, [aria-disabled="true"], [data-disabled], [aria-readonly="true"], [data-readonly], [readonly]):hover .gridui-button-end-icon {
       transform: translate(var(--gridui-space-4), calc(-1 * var(--gridui-space-4)));
     }
-    .gridui-button-icon-motion-outward:dir(rtl):hover:not(:disabled) .gridui-button-end-icon {
+    .gridui-button-icon-motion-outward:not(:disabled, [aria-disabled="true"], [data-disabled], [aria-readonly="true"], [data-readonly], [readonly]):dir(rtl):hover .gridui-button-end-icon {
       transform: translate(calc(-1 * var(--gridui-space-4)), calc(-1 * var(--gridui-space-4)));
     }
   }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@gridui/button",
-  "version": "2.2.0",
+  "version": "3.0.1",
   "description": "GridUI React buttons and action helpers",
   "license": "UNLICENSED",
   "type": "module",
@@ -22,8 +22,8 @@
     "access": "public"
   },
   "dependencies": {
-    "@gridui/style-utils": "^2.1.4",
-    "@gridui/theme": "^2.3.2",
+    "@gridui/style-utils": "^2.2.0",
+    "@gridui/theme": "^2.5.0",
     "class-variance-authority": "0.7.1"
   },
   "devDependencies": {
@@ -35,7 +35,7 @@
     "@types/react": "19.3.0",
     "@types/react-dom": "19.3.0",
     "jest": "30.5.2",
-    "lucide-react": "1.65.0",
+    "lucide-react": "1.66.0",
     "react": "19.3.1",
     "react-dom": "19.3.1",
     "typescript": "6.0.3"

package/dist/button/download.d.ts

@@ -1,7 +0,0 @@
-/**
- * @author WMXPY
- * @package Button
- * @namespace Button
- * @description Download
- */
-export declare const downloadBlob: (blob: Blob, filename: string) => void;