@pk-design/react-tailwind 1.8.0 → 1.9.0

package/dist/cjs/components/Banner/Banner.js

@@ -33,7 +33,7 @@ const Banner = React.forwardRef((props, ref) => {
     const { type = 'info', iconSize = 'sm', children, icon, removable = false, onRemove, className, ...restProps } = props;
     const DefaultIcon = IconMap[type];
     const iconNode = icon !== undefined ? (icon) : (jsxRuntime.jsx(DefaultIcon, { "data-testid": `banner-${type}-icon`, className: buildClassname.buildClassName('shrink-0', sizeMap[iconSize]) }));
-    return (jsxRuntime.jsxs("div", { ref: ref, className: buildClassname.buildClassName('text-sm rounded-md flex w-full p-3 items-center gap-3 ring-1 ring-inset', TypeClassMap[type], className), "data-testid": `banner-${type}`, ...restProps, children: [iconNode, jsxRuntime.jsx("div", { className: "flex items-center w-full justify-between", children: children }), removable && (jsxRuntime.jsx(Button.Button, { iconOnly: true, "aria-label": "Dismiss banner", size: "xs", variant: "plain", theme: "secondary", className: "hover:bg-black/10 dark:hover:bg-white/10 shrink-0", onClick: () => onRemove === null || onRemove === void 0 ? void 0 : onRemove(), "data-testid": "banner-remove-btn", children: jsxRuntime.jsx(X.default, { className: "size-4.5", "data-testid": "banner-remove-icon" }) }))] }));
+    return (jsxRuntime.jsxs("div", { ref: ref, className: buildClassname.buildClassName('text-sm rounded-md flex w-full p-3 items-center gap-3 ring-1 ring-inset', TypeClassMap[type], className), "data-testid": `banner-${type}`, ...restProps, children: [iconNode, jsxRuntime.jsx("div", { className: "flex items-center w-full justify-between", children: children }), removable && (jsxRuntime.jsx(Button.Button, { iconOnly: true, "aria-label": "Dismiss banner", size: "xs", variant: "plain", className: "text-current focus-visible:outline-current shrink-0", onClick: () => onRemove === null || onRemove === void 0 ? void 0 : onRemove(), "data-testid": "banner-remove-btn", children: jsxRuntime.jsx(X.default, { className: "size-4.5", "data-testid": "banner-remove-icon" }) }))] }));
 });
 Banner.displayName = 'Banner';
 

package/dist/cjs/components/Banner/Banner.js.map

@@ -1 +1 @@
-{"version":3,"file":"Banner.js","sources":["../../../../../src/components/Banner/Banner.tsx"],"sourcesContent":["import React, { forwardRef } from 'react'\nimport TriangleAlertIcon from '../Icons/TriangleAlert.svg'\nimport CircleXIcon from '../Icons/CircleX.svg'\nimport CircleCheckIcon from '../Icons/CircleCheck.svg'\nimport InfoIcon from '../Icons/Info.svg'\nimport XIcon from '../Icons/X.svg'\nimport { buildClassName } from '../../utils/build-classname'\nimport { Button } from '../Button'\nimport { BannerProps } from './Banner.types'\n\nconst sizeMap = {\n  xs: 'size-4',\n  sm: 'size-5',\n  md: 'size-6',\n  lg: 'size-8',\n  xl: 'size-10',\n}\n\nconst IconMap = {\n  info: InfoIcon,\n  error: CircleXIcon,\n  success: CircleCheckIcon,\n  warning: TriangleAlertIcon,\n}\n\nconst TypeClassMap = {\n  info: 'bg-[var(--ui-info-light)] ring-[var(--ui-info-ring-subtle)] text-[var(--ui-info-text)]',\n  error:\n    'bg-[var(--ui-danger-light)] ring-[var(--ui-danger-ring-subtle)] text-[var(--ui-danger-text)]',\n  success:\n    'bg-[var(--ui-success-light)] ring-[var(--ui-success-ring-subtle)] text-[var(--ui-success-text)]',\n  warning:\n    'bg-[var(--ui-warning-light)] ring-[var(--ui-warning-ring-subtle)] text-[var(--ui-warning-text)]',\n}\n\nexport const Banner = forwardRef<HTMLDivElement, BannerProps>((props, ref) => {\n  const {\n    type = 'info',\n    iconSize = 'sm',\n    children,\n    icon,\n    removable = false,\n    onRemove,\n    className,\n    ...restProps\n  } = props\n\n  const DefaultIcon = IconMap[type]\n  const iconNode =\n    icon !== undefined ? (\n      icon\n    ) : (\n      <DefaultIcon\n        data-testid={`banner-${type}-icon`}\n        className={buildClassName('shrink-0', sizeMap[iconSize])}\n      />\n    )\n\n  return (\n    <div\n      ref={ref}\n      className={buildClassName(\n        'text-sm rounded-md flex w-full p-3 items-center gap-3 ring-1 ring-inset',\n        TypeClassMap[type],\n        className,\n      )}\n      data-testid={`banner-${type}`}\n      {...restProps}\n    >\n      {iconNode}\n      <div className=\"flex items-center w-full justify-between\">{children}</div>\n      {removable && (\n        <Button\n          iconOnly\n          aria-label=\"Dismiss banner\"\n          size=\"xs\"\n          variant=\"plain\"\n          theme=\"secondary\"\n          className=\"hover:bg-black/10 dark:hover:bg-white/10 shrink-0\"\n          onClick={() => onRemove?.()}\n          data-testid=\"banner-remove-btn\"\n        >\n          <XIcon className=\"size-4.5\" data-testid=\"banner-remove-icon\" />\n        </Button>\n      )}\n    </div>\n  )\n})\n\nBanner.displayName = 'Banner'\n"],"names":["InfoIcon","CircleXIcon","CircleCheckIcon","TriangleAlertIcon","forwardRef","_jsx","buildClassName","_jsxs","Button","XIcon"],"mappings":";;;;;;;;;;;;AAUA,MAAM,OAAO,GAAG;AACd,IAAA,EAAE,EAAE,QAAQ;AACZ,IAAA,EAAE,EAAE,QAAQ;AACZ,IAAA,EAAE,EAAE,QAAQ;AACZ,IAAA,EAAE,EAAE,QAAQ;AACZ,IAAA,EAAE,EAAE,SAAS;CACd;AAED,MAAM,OAAO,GAAG;AACd,IAAA,IAAI,EAAEA,YAAQ;AACd,IAAA,KAAK,EAAEC,eAAW;AAClB,IAAA,OAAO,EAAEC,mBAAe;AACxB,IAAA,OAAO,EAAEC,qBAAiB;CAC3B;AAED,MAAM,YAAY,GAAG;AACnB,IAAA,IAAI,EAAE,wFAAwF;AAC9F,IAAA,KAAK,EACH,8FAA8F;AAChG,IAAA,OAAO,EACL,iGAAiG;AACnG,IAAA,OAAO,EACL,iGAAiG;CACpG;AAEM,MAAM,MAAM,GAAGC,gBAAU,CAA8B,CAAC,KAAK,EAAE,GAAG,KAAI;IAC3E,MAAM,EACJ,IAAI,GAAG,MAAM,EACb,QAAQ,GAAG,IAAI,EACf,QAAQ,EACR,IAAI,EACJ,SAAS,GAAG,KAAK,EACjB,QAAQ,EACR,SAAS,EACT,GAAG,SAAS,EACb,GAAG,KAAK;AAET,IAAA,MAAM,WAAW,GAAG,OAAO,CAAC,IAAI,CAAC;AACjC,IAAA,MAAM,QAAQ,GACZ,IAAI,KAAK,SAAS,IAChB,IAAI,KAEJC,cAAA,CAAC,WAAW,EAAA,EAAA,aAAA,EACG,CAAA,OAAA,EAAU,IAAI,CAAA,KAAA,CAAO,EAClC,SAAS,EAAEC,6BAAc,CAAC,UAAU,EAAE,OAAO,CAAC,QAAQ,CAAC,CAAC,EAAA,CACxD,CACH;AAEH,IAAA,QACEC,eAAA,CAAA,KAAA,EAAA,EACE,GAAG,EAAE,GAAG,EACR,SAAS,EAAED,6BAAc,CACvB,yEAAyE,EACzE,YAAY,CAAC,IAAI,CAAC,EAClB,SAAS,CACV,EAAA,aAAA,EACY,CAAA,OAAA,EAAU,IAAI,CAAA,CAAE,KACzB,SAAS,EAAA,QAAA,EAAA,CAEZ,QAAQ,EACTD,cAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAC,0CAA0C,YAAE,QAAQ,EAAA,CAAO,EACzE,SAAS,KACRA,cAAA,CAACG,aAAM,IACL,QAAQ,EAAA,IAAA,EAAA,YAAA,EACG,gBAAgB,EAC3B,IAAI,EAAC,IAAI,EACT,OAAO,EAAC,OAAO,EACf,KAAK,EAAC,WAAW,EACjB,SAAS,EAAC,mDAAmD,EAC7D,OAAO,EAAE,MAAM,QAAQ,KAAA,IAAA,IAAR,QAAQ,uBAAR,QAAQ,EAAI,iBACf,mBAAmB,EAAA,QAAA,EAE/BH,eAACI,SAAK,EAAA,EAAC,SAAS,EAAC,UAAU,iBAAa,oBAAoB,EAAA,CAAG,GACxD,CACV,CAAA,EAAA,CACG;AAEV,CAAC;AAED,MAAM,CAAC,WAAW,GAAG,QAAQ;;;;"}
+{"version":3,"file":"Banner.js","sources":["../../../../../src/components/Banner/Banner.tsx"],"sourcesContent":["import React, { forwardRef } from 'react'\nimport TriangleAlertIcon from '../Icons/TriangleAlert.svg'\nimport CircleXIcon from '../Icons/CircleX.svg'\nimport CircleCheckIcon from '../Icons/CircleCheck.svg'\nimport InfoIcon from '../Icons/Info.svg'\nimport XIcon from '../Icons/X.svg'\nimport { buildClassName } from '../../utils/build-classname'\nimport { Button } from '../Button'\nimport { BannerProps } from './Banner.types'\n\nconst sizeMap = {\n  xs: 'size-4',\n  sm: 'size-5',\n  md: 'size-6',\n  lg: 'size-8',\n  xl: 'size-10',\n}\n\nconst IconMap = {\n  info: InfoIcon,\n  error: CircleXIcon,\n  success: CircleCheckIcon,\n  warning: TriangleAlertIcon,\n}\n\nconst TypeClassMap = {\n  info: 'bg-[var(--ui-info-light)] ring-[var(--ui-info-ring-subtle)] text-[var(--ui-info-text)]',\n  error:\n    'bg-[var(--ui-danger-light)] ring-[var(--ui-danger-ring-subtle)] text-[var(--ui-danger-text)]',\n  success:\n    'bg-[var(--ui-success-light)] ring-[var(--ui-success-ring-subtle)] text-[var(--ui-success-text)]',\n  warning:\n    'bg-[var(--ui-warning-light)] ring-[var(--ui-warning-ring-subtle)] text-[var(--ui-warning-text)]',\n}\n\nexport const Banner = forwardRef<HTMLDivElement, BannerProps>((props, ref) => {\n  const {\n    type = 'info',\n    iconSize = 'sm',\n    children,\n    icon,\n    removable = false,\n    onRemove,\n    className,\n    ...restProps\n  } = props\n\n  const DefaultIcon = IconMap[type]\n  const iconNode =\n    icon !== undefined ? (\n      icon\n    ) : (\n      <DefaultIcon\n        data-testid={`banner-${type}-icon`}\n        className={buildClassName('shrink-0', sizeMap[iconSize])}\n      />\n    )\n\n  return (\n    <div\n      ref={ref}\n      className={buildClassName(\n        'text-sm rounded-md flex w-full p-3 items-center gap-3 ring-1 ring-inset',\n        TypeClassMap[type],\n        className,\n      )}\n      data-testid={`banner-${type}`}\n      {...restProps}\n    >\n      {iconNode}\n      <div className=\"flex items-center w-full justify-between\">{children}</div>\n      {removable && (\n        <Button\n          iconOnly\n          aria-label=\"Dismiss banner\"\n          size=\"xs\"\n          variant=\"plain\"\n          className=\"text-current focus-visible:outline-current shrink-0\"\n          onClick={() => onRemove?.()}\n          data-testid=\"banner-remove-btn\"\n        >\n          <XIcon className=\"size-4.5\" data-testid=\"banner-remove-icon\" />\n        </Button>\n      )}\n    </div>\n  )\n})\n\nBanner.displayName = 'Banner'\n"],"names":["InfoIcon","CircleXIcon","CircleCheckIcon","TriangleAlertIcon","forwardRef","_jsx","buildClassName","_jsxs","Button","XIcon"],"mappings":";;;;;;;;;;;;AAUA,MAAM,OAAO,GAAG;AACd,IAAA,EAAE,EAAE,QAAQ;AACZ,IAAA,EAAE,EAAE,QAAQ;AACZ,IAAA,EAAE,EAAE,QAAQ;AACZ,IAAA,EAAE,EAAE,QAAQ;AACZ,IAAA,EAAE,EAAE,SAAS;CACd;AAED,MAAM,OAAO,GAAG;AACd,IAAA,IAAI,EAAEA,YAAQ;AACd,IAAA,KAAK,EAAEC,eAAW;AAClB,IAAA,OAAO,EAAEC,mBAAe;AACxB,IAAA,OAAO,EAAEC,qBAAiB;CAC3B;AAED,MAAM,YAAY,GAAG;AACnB,IAAA,IAAI,EAAE,wFAAwF;AAC9F,IAAA,KAAK,EACH,8FAA8F;AAChG,IAAA,OAAO,EACL,iGAAiG;AACnG,IAAA,OAAO,EACL,iGAAiG;CACpG;AAEM,MAAM,MAAM,GAAGC,gBAAU,CAA8B,CAAC,KAAK,EAAE,GAAG,KAAI;IAC3E,MAAM,EACJ,IAAI,GAAG,MAAM,EACb,QAAQ,GAAG,IAAI,EACf,QAAQ,EACR,IAAI,EACJ,SAAS,GAAG,KAAK,EACjB,QAAQ,EACR,SAAS,EACT,GAAG,SAAS,EACb,GAAG,KAAK;AAET,IAAA,MAAM,WAAW,GAAG,OAAO,CAAC,IAAI,CAAC;AACjC,IAAA,MAAM,QAAQ,GACZ,IAAI,KAAK,SAAS,IAChB,IAAI,KAEJC,cAAA,CAAC,WAAW,EAAA,EAAA,aAAA,EACG,CAAA,OAAA,EAAU,IAAI,CAAA,KAAA,CAAO,EAClC,SAAS,EAAEC,6BAAc,CAAC,UAAU,EAAE,OAAO,CAAC,QAAQ,CAAC,CAAC,EAAA,CACxD,CACH;AAEH,IAAA,QACEC,eAAA,CAAA,KAAA,EAAA,EACE,GAAG,EAAE,GAAG,EACR,SAAS,EAAED,6BAAc,CACvB,yEAAyE,EACzE,YAAY,CAAC,IAAI,CAAC,EAClB,SAAS,CACV,EAAA,aAAA,EACY,CAAA,OAAA,EAAU,IAAI,EAAE,EAAA,GACzB,SAAS,aAEZ,QAAQ,EACTD,wBAAK,SAAS,EAAC,0CAA0C,EAAA,QAAA,EAAE,QAAQ,EAAA,CAAO,EACzE,SAAS,KACRA,eAACG,aAAM,EAAA,EACL,QAAQ,EAAA,IAAA,EAAA,YAAA,EACG,gBAAgB,EAC3B,IAAI,EAAC,IAAI,EACT,OAAO,EAAC,OAAO,EACf,SAAS,EAAC,qDAAqD,EAC/D,OAAO,EAAE,MAAM,QAAQ,KAAA,IAAA,IAAR,QAAQ,uBAAR,QAAQ,EAAI,iBACf,mBAAmB,EAAA,QAAA,EAE/BH,eAACI,SAAK,EAAA,EAAC,SAAS,EAAC,UAAU,iBAAa,oBAAoB,EAAA,CAAG,GACxD,CACV,CAAA,EAAA,CACG;AAEV,CAAC;AAED,MAAM,CAAC,WAAW,GAAG,QAAQ;;;;"}

package/dist/cjs/components/Button/Button.js

@@ -8,59 +8,35 @@ var TextContent = require('../TextContent/TextContent.js');
 
 /**
  * Tailwind CSS classes for theme + variant combinations.
+ *
+ * Only colours live here. Focus outline width/offset and disabled styling are
+ * applied uniformly in the component so they can be toggled in one place.
  */
 const THEMED_BTN_CLASS = {
     primary: {
-        default: 'text-white bg-[var(--ui-primary)] hover:bg-[var(--ui-primary-hover)] focus-visible:ring-2 focus-visible:ring-offset-2 focus-visible:ring-[var(--ui-primary-ring)] disabled:bg-[var(--ui-primary-disabled)]',
-        outlined: 'text-[var(--ui-primary-text)] hover:text-white border border-[var(--ui-primary)] hover:bg-[var(--ui-primary)] focus-visible:ring-2 focus-visible:ring-offset-2 focus-visible:ring-[var(--ui-primary-ring)] disabled:text-[var(--ui-primary-disabled)] disabled:border-[var(--ui-primary-disabled)]',
-        plain: 'text-[var(--ui-primary-text)] hover:bg-blue-50/80 dark:hover:bg-blue-950/40 focus-visible:ring-2 focus-visible:ring-offset-2 focus-visible:ring-[var(--ui-primary-ring)] disabled:text-[var(--ui-primary-disabled)]',
+        default: 'text-white bg-[var(--ui-primary)] hover:bg-[var(--ui-primary-hover)] focus-visible:outline-[var(--ui-primary-ring)]',
+        outlined: 'text-[var(--ui-primary-text)] hover:text-white border border-[var(--ui-primary)] hover:bg-[var(--ui-primary)] focus-visible:outline-[var(--ui-primary-ring)]',
+        plain: 'text-[var(--ui-primary-text)] hover:bg-current/10 active:bg-current/15 focus-visible:outline-[var(--ui-primary-ring)]',
     },
     danger: {
-        default: 'text-white bg-[var(--ui-danger)] hover:bg-[var(--ui-danger-hover)] focus-visible:ring-2 focus-visible:ring-offset-2 focus-visible:ring-[var(--ui-danger-ring)] disabled:bg-[var(--ui-danger-disabled)]',
-        outlined: 'text-[var(--ui-danger-text)] hover:text-white border border-[var(--ui-danger)] hover:bg-[var(--ui-danger)] focus-visible:ring-2 focus-visible:ring-offset-2 focus-visible:ring-[var(--ui-danger-ring)] disabled:text-[var(--ui-danger-disabled)] disabled:border-[var(--ui-danger-disabled)]',
-        plain: 'text-[var(--ui-danger-text)] hover:bg-red-50/80 dark:hover:bg-red-950/40 focus-visible:ring-2 focus-visible:ring-offset-2 focus-visible:ring-[var(--ui-danger-ring)] disabled:text-[var(--ui-danger-disabled)]',
+        default: 'text-white bg-[var(--ui-danger)] hover:bg-[var(--ui-danger-hover)] focus-visible:outline-[var(--ui-danger-ring)]',
+        outlined: 'text-[var(--ui-danger-text)] hover:text-white border border-[var(--ui-danger)] hover:bg-[var(--ui-danger)] focus-visible:outline-[var(--ui-danger-ring)]',
+        plain: 'text-[var(--ui-danger-text)] hover:bg-current/10 active:bg-current/15 focus-visible:outline-[var(--ui-danger-ring)]',
     },
     secondary: {
-        default: 'text-gray-700 bg-white border border-[var(--ui-border)] hover:bg-gray-100 dark:bg-gray-800 dark:text-white dark:hover:bg-gray-700 focus-visible:ring-2 focus-visible:ring-offset-2 focus-visible:ring-[var(--ui-focus-ring)] disabled:bg-gray-200 dark:disabled:bg-gray-700',
-        outlined: 'text-gray-700 hover:text-white border border-[var(--ui-border)] hover:bg-gray-700 dark:text-gray-200 dark:hover:text-white dark:hover:bg-gray-600 focus-visible:ring-2 focus-visible:ring-offset-2 focus-visible:ring-[var(--ui-focus-ring)] disabled:text-gray-400 disabled:border-[var(--ui-border-muted)]',
-        plain: 'text-gray-700 hover:bg-gray-100 dark:text-gray-200 dark:hover:bg-gray-800 focus-visible:ring-2 focus-visible:ring-offset-2 focus-visible:ring-[var(--ui-focus-ring)] disabled:text-gray-400',
+        default: 'text-gray-700 bg-white border border-[var(--ui-border)] hover:bg-gray-100 dark:bg-gray-800 dark:text-white dark:hover:bg-gray-700 focus-visible:outline-[var(--ui-focus-ring)]',
+        outlined: 'text-gray-700 hover:text-white border border-[var(--ui-border)] hover:bg-gray-700 dark:text-gray-200 dark:hover:text-white dark:hover:bg-gray-600 focus-visible:outline-[var(--ui-focus-ring)]',
+        plain: 'text-gray-700 hover:bg-current/10 active:bg-current/15 dark:text-gray-200 focus-visible:outline-[var(--ui-focus-ring)]',
     },
     success: {
-        default: 'text-white bg-emerald-600 hover:bg-emerald-700 focus-visible:ring-2 focus-visible:ring-offset-2 focus-visible:ring-emerald-500 disabled:bg-emerald-300 dark:disabled:bg-emerald-900',
-        outlined: 'text-emerald-600 hover:text-white border border-emerald-600 hover:bg-emerald-600 dark:text-emerald-400 dark:border-emerald-500 focus-visible:ring-2 focus-visible:ring-offset-2 focus-visible:ring-emerald-500 disabled:opacity-50',
-        plain: 'text-emerald-600 hover:bg-emerald-50 dark:text-emerald-400 dark:hover:bg-emerald-950/40 focus-visible:ring-2 focus-visible:ring-offset-2 focus-visible:ring-emerald-500 disabled:opacity-50',
+        default: 'text-white bg-emerald-600 hover:bg-emerald-700 focus-visible:outline-emerald-500',
+        outlined: 'text-emerald-700 hover:text-white border border-emerald-600 hover:bg-emerald-600 dark:text-emerald-400 dark:border-emerald-500 focus-visible:outline-emerald-500',
+        plain: 'text-emerald-700 hover:bg-current/10 active:bg-current/15 dark:text-emerald-400 focus-visible:outline-emerald-500',
     },
     warning: {
-        default: 'text-white bg-amber-500 hover:bg-amber-600 focus-visible:ring-2 focus-visible:ring-offset-2 focus-visible:ring-amber-500 disabled:bg-amber-300 dark:disabled:bg-amber-900',
-        outlined: 'text-amber-600 hover:text-white border border-amber-500 hover:bg-amber-500 dark:text-amber-400 dark:border-amber-500 focus-visible:ring-2 focus-visible:ring-offset-2 focus-visible:ring-amber-500 disabled:opacity-50',
-        plain: 'text-amber-600 hover:bg-amber-50 dark:text-amber-400 dark:hover:bg-amber-950/40 focus-visible:ring-2 focus-visible:ring-offset-2 focus-visible:ring-amber-500 disabled:opacity-50',
-    },
-};
-const LOADER_TEXT_CLASS = {
-    primary: {
-        default: 'text-white',
-        outlined: 'text-[var(--ui-primary-text)]',
-        plain: 'text-[var(--ui-primary-text)]',
-    },
-    danger: {
-        default: 'text-white',
-        outlined: 'text-[var(--ui-danger-text)]',
-        plain: 'text-[var(--ui-danger-text)]',
-    },
-    secondary: {
-        default: 'text-gray-700 dark:text-white',
-        outlined: 'text-gray-700 dark:text-gray-200',
-        plain: 'text-gray-700 dark:text-gray-200',
-    },
-    success: {
-        default: 'text-white',
-        outlined: 'text-emerald-600 dark:text-emerald-400',
-        plain: 'text-emerald-600 dark:text-emerald-400',
-    },
-    warning: {
-        default: 'text-white',
-        outlined: 'text-amber-600 dark:text-amber-400',
-        plain: 'text-amber-600 dark:text-amber-400',
+        default: 'text-white bg-amber-500 hover:bg-amber-600 focus-visible:outline-amber-500',
+        outlined: 'text-amber-700 hover:text-white border border-amber-500 hover:bg-amber-500 dark:text-amber-400 dark:border-amber-500 focus-visible:outline-amber-500',
+        plain: 'text-amber-700 hover:bg-current/10 active:bg-current/15 dark:text-amber-400 focus-visible:outline-amber-500',
     },
 };
 const SIZE_CLASSES = {
@@ -80,22 +56,32 @@ const LOADER_SIZE = {
 };
 /**
  * Base shared tailwind classes.
+ *
+ * Disabled styling is keyed off both the native `disabled` attribute and
+ * `aria-disabled`, so non-button elements rendered via `as` look disabled too.
  */
 const BASE_BTN_CLASS = 'font-medium inline-flex items-center justify-center shrink-0 cursor-pointer select-none ' +
-    'disabled:cursor-not-allowed disabled:pointer-events-none disabled:opacity-75 ' +
-    'active:scale-[0.98] transition-all duration-150 ease-out focus:outline-none';
+    'transition-[color,background-color,border-color,box-shadow,opacity,transform] duration-150 ease-out ' +
+    'active:scale-[0.98] focus:outline-none ' +
+    'disabled:pointer-events-none disabled:opacity-50 disabled:shadow-none ' +
+    'aria-disabled:pointer-events-none aria-disabled:opacity-50 aria-disabled:shadow-none';
 const Button = React.forwardRef(({ as, type, ...props }, ref) => {
-    var _a, _b, _c, _d;
     const { className = '', children, theme = 'primary', variant = 'default', size = 'md', leftIcon, rightIcon, fullWidth = false, loading = false, loadingText = '', rounded = false, disabled, iconOnly = false, noOutlineOnFocus = false, active, onClick, ...restProps } = props;
     const Component = as || 'button';
     const isNativeButton = Component === 'button';
+    // Clean invalid props when not rendering a real button
+    const { type: _ignoreType, disabled: _ignoreDisabled, role, tabIndex, onKeyDown, onKeyUp, ...domProps } = restProps;
+    const ariaLabel = domProps['aria-label'];
+    const ariaLabelledBy = domProps['aria-labelledby'];
     // Accessibility guard for icon-only buttons
-    if (iconOnly && !restProps['aria-label']) {
-        console.warn('[ui] <Button iconOnly> requires aria-label for accessibility.');
-    }
+    React.useEffect(() => {
+        if (iconOnly && !ariaLabel && !ariaLabelledBy) {
+            console.warn('[ui] <Button iconOnly> requires aria-label or aria-labelledby for accessibility.');
+        }
+    }, [iconOnly, ariaLabel, ariaLabelledBy]);
     const resolvedDisabled = Boolean(disabled || loading);
-    // Clean invalid props when not rendering a real button
-    const { type: _ignoreType, disabled: _ignoreDisabled, ...cleanRest } = restProps;
+    // Links (`href`, or `to` for router Link components) keep their native semantics.
+    const isLink = !isNativeButton && (domProps.href != null || domProps.to != null);
     const handleClick = (e) => {
         if (resolvedDisabled) {
             e.preventDefault();
@@ -104,31 +90,73 @@ const Button = React.forwardRef(({ as, type, ...props }, ref) => {
         }
         onClick === null || onClick === void 0 ? void 0 : onClick(e);
     };
+    // Mirror native <button> keyboard activation for non-button elements:
+    // Enter activates on keydown, Space on keyup (and must not scroll the page).
+    const handleKeyDown = (e) => {
+        onKeyDown === null || onKeyDown === void 0 ? void 0 : onKeyDown(e);
+        if (e.defaultPrevented || e.target !== e.currentTarget)
+            return;
+        if (e.key === 'Enter') {
+            e.preventDefault();
+            e.currentTarget.click();
+        }
+        else if (e.key === ' ') {
+            e.preventDefault();
+        }
+    };
+    const handleKeyUp = (e) => {
+        onKeyUp === null || onKeyUp === void 0 ? void 0 : onKeyUp(e);
+        if (e.defaultPrevented || e.target !== e.currentTarget)
+            return;
+        if (e.key === ' ') {
+            e.preventDefault();
+            e.currentTarget.click();
+        }
+    };
     const elementProps = isNativeButton
         ? {
             type: type !== null && type !== void 0 ? type : 'button',
             disabled: resolvedDisabled,
+            role,
+            tabIndex,
             onClick: handleClick,
+            onKeyDown,
+            onKeyUp,
         }
-        : {
-            role: (_a = cleanRest.role) !== null && _a !== void 0 ? _a : 'button',
-            tabIndex: resolvedDisabled ? -1 : ((_b = cleanRest.tabIndex) !== null && _b !== void 0 ? _b : 0),
-            'aria-disabled': resolvedDisabled ? true : undefined,
-            onClick: handleClick,
-        };
+        : isLink
+            ? {
+                role,
+                tabIndex: resolvedDisabled ? -1 : tabIndex,
+                'aria-disabled': resolvedDisabled ? true : undefined,
+                onClick: handleClick,
+                onKeyDown,
+                onKeyUp,
+            }
+            : {
+                role: role !== null && role !== void 0 ? role : 'button',
+                tabIndex: resolvedDisabled ? -1 : (tabIndex !== null && tabIndex !== void 0 ? tabIndex : 0),
+                'aria-disabled': resolvedDisabled ? true : undefined,
+                onClick: handleClick,
+                onKeyDown: handleKeyDown,
+                onKeyUp: handleKeyUp,
+            };
     const sizeObj = SIZE_CLASSES[size] || SIZE_CLASSES.md;
     const classes = React.useMemo(() => {
         var _a;
-        return buildClassname.buildClassName(BASE_BTN_CLASS, ((_a = THEMED_BTN_CLASS[theme]) === null || _a === void 0 ? void 0 : _a[variant]) || THEMED_BTN_CLASS.primary.default, iconOnly ? sizeObj.iconOnly : sizeObj.normal, !noOutlineOnFocus && 'focus-visible:ring-2 focus-visible:ring-offset-2', rounded && 'rounded-full', fullWidth && 'w-full', variant === 'default' && 'shadow-xs hover:shadow-none disabled:shadow-none', active && 'ring-2 ring-offset-2 ring-current', className);
+        return buildClassname.buildClassName(BASE_BTN_CLASS, ((_a = THEMED_BTN_CLASS[theme]) === null || _a === void 0 ? void 0 : _a[variant]) || THEMED_BTN_CLASS.primary.default, iconOnly ? sizeObj.iconOnly : sizeObj.normal, 
+        // An outline (not a ring) so the offset gap stays transparent on any surface/mode.
+        !noOutlineOnFocus &&
+            'focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-solid', rounded && 'rounded-full', fullWidth && 'w-full', variant === 'default' && 'shadow-xs hover:shadow-none', active && 'ring-2 ring-current', className);
     }, [theme, variant, sizeObj, iconOnly, noOutlineOnFocus, rounded, fullWidth, active, className]);
-    const loaderIcon = (jsxRuntime.jsx(index.Loader, { "data-testid": "btn-loader-icon", size: LOADER_SIZE[size] || 'xs', className: buildClassname.buildClassName((_c = LOADER_TEXT_CLASS[theme]) === null || _c === void 0 ? void 0 : _c[variant]) }));
+    // The spinner and loading text inherit the button's text colour.
+    const loaderIcon = (jsxRuntime.jsx(index.Loader, { "data-testid": "btn-loader-icon", size: LOADER_SIZE[size] || 'xs', className: "text-current" }));
     /**
      * SPECIAL CASE: iconOnly + loading → show spinner only
      */
     if (loading && iconOnly) {
-        return (jsxRuntime.jsx(Component, { ref: ref, className: classes, "aria-busy": "true", "aria-pressed": active !== undefined ? active : undefined, ...elementProps, ...cleanRest, children: loaderIcon }));
+        return (jsxRuntime.jsx(Component, { ref: ref, className: classes, "aria-busy": "true", "aria-pressed": active !== undefined ? active : undefined, ...domProps, ...elementProps, children: loaderIcon }));
     }
-    return (jsxRuntime.jsx(Component, { ref: ref, className: classes, "aria-busy": loading ? 'true' : undefined, "aria-pressed": active !== undefined ? active : undefined, ...elementProps, ...cleanRest, children: loading ? (jsxRuntime.jsxs("span", { className: "inline-flex items-center gap-2", "aria-live": "polite", children: [loaderIcon, loadingText ? (jsxRuntime.jsx(TextContent.TextContent, { className: buildClassname.buildClassName((_d = LOADER_TEXT_CLASS[theme]) === null || _d === void 0 ? void 0 : _d[variant]), children: loadingText })) : (children)] })) : (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [leftIcon && jsxRuntime.jsx("span", { className: "shrink-0 inline-flex items-center", children: leftIcon }), children, rightIcon && jsxRuntime.jsx("span", { className: "shrink-0 inline-flex items-center", children: rightIcon })] })) }));
+    return (jsxRuntime.jsx(Component, { ref: ref, className: classes, "aria-busy": loading ? 'true' : undefined, "aria-pressed": active !== undefined ? active : undefined, ...domProps, ...elementProps, children: loading ? (jsxRuntime.jsxs("span", { className: "inline-flex items-center gap-2", "aria-live": "polite", children: [loaderIcon, loadingText ? (jsxRuntime.jsx(TextContent.TextContent, { className: "text-current", children: loadingText })) : (children)] })) : (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [leftIcon && jsxRuntime.jsx("span", { className: "shrink-0 inline-flex items-center", children: leftIcon }), children, rightIcon && jsxRuntime.jsx("span", { className: "shrink-0 inline-flex items-center", children: rightIcon })] })) }));
 });
 Button.displayName = 'Button';
 

package/dist/cjs/components/Button/Button.js.map

@@ -1 +1 @@
-{"version":3,"file":"Button.js","sources":["../../../../../src/components/Button/Button.tsx"],"sourcesContent":["import React, { ElementType, forwardRef, useMemo } from 'react'\nimport { buildClassName } from '../../utils/build-classname'\nimport { Loader } from '../Loader'\nimport { TextContent } from '../TextContent'\nimport type { ButtonComponent, ButtonProps, ButtonSize, ThemedButtonClass } from './Button.types'\nimport type { PolymorphicRef } from '../common-type'\n\n/**\n * Tailwind CSS classes for theme + variant combinations.\n */\nconst THEMED_BTN_CLASS: ThemedButtonClass = {\n  primary: {\n    default:\n      'text-white bg-[var(--ui-primary)] hover:bg-[var(--ui-primary-hover)] focus-visible:ring-2 focus-visible:ring-offset-2 focus-visible:ring-[var(--ui-primary-ring)] disabled:bg-[var(--ui-primary-disabled)]',\n    outlined:\n      'text-[var(--ui-primary-text)] hover:text-white border border-[var(--ui-primary)] hover:bg-[var(--ui-primary)] focus-visible:ring-2 focus-visible:ring-offset-2 focus-visible:ring-[var(--ui-primary-ring)] disabled:text-[var(--ui-primary-disabled)] disabled:border-[var(--ui-primary-disabled)]',\n    plain:\n      'text-[var(--ui-primary-text)] hover:bg-blue-50/80 dark:hover:bg-blue-950/40 focus-visible:ring-2 focus-visible:ring-offset-2 focus-visible:ring-[var(--ui-primary-ring)] disabled:text-[var(--ui-primary-disabled)]',\n  },\n  danger: {\n    default:\n      'text-white bg-[var(--ui-danger)] hover:bg-[var(--ui-danger-hover)] focus-visible:ring-2 focus-visible:ring-offset-2 focus-visible:ring-[var(--ui-danger-ring)] disabled:bg-[var(--ui-danger-disabled)]',\n    outlined:\n      'text-[var(--ui-danger-text)] hover:text-white border border-[var(--ui-danger)] hover:bg-[var(--ui-danger)] focus-visible:ring-2 focus-visible:ring-offset-2 focus-visible:ring-[var(--ui-danger-ring)] disabled:text-[var(--ui-danger-disabled)] disabled:border-[var(--ui-danger-disabled)]',\n    plain:\n      'text-[var(--ui-danger-text)] hover:bg-red-50/80 dark:hover:bg-red-950/40 focus-visible:ring-2 focus-visible:ring-offset-2 focus-visible:ring-[var(--ui-danger-ring)] disabled:text-[var(--ui-danger-disabled)]',\n  },\n  secondary: {\n    default:\n      'text-gray-700 bg-white border border-[var(--ui-border)] hover:bg-gray-100 dark:bg-gray-800 dark:text-white dark:hover:bg-gray-700 focus-visible:ring-2 focus-visible:ring-offset-2 focus-visible:ring-[var(--ui-focus-ring)] disabled:bg-gray-200 dark:disabled:bg-gray-700',\n    outlined:\n      'text-gray-700 hover:text-white border border-[var(--ui-border)] hover:bg-gray-700 dark:text-gray-200 dark:hover:text-white dark:hover:bg-gray-600 focus-visible:ring-2 focus-visible:ring-offset-2 focus-visible:ring-[var(--ui-focus-ring)] disabled:text-gray-400 disabled:border-[var(--ui-border-muted)]',\n    plain:\n      'text-gray-700 hover:bg-gray-100 dark:text-gray-200 dark:hover:bg-gray-800 focus-visible:ring-2 focus-visible:ring-offset-2 focus-visible:ring-[var(--ui-focus-ring)] disabled:text-gray-400',\n  },\n  success: {\n    default:\n      'text-white bg-emerald-600 hover:bg-emerald-700 focus-visible:ring-2 focus-visible:ring-offset-2 focus-visible:ring-emerald-500 disabled:bg-emerald-300 dark:disabled:bg-emerald-900',\n    outlined:\n      'text-emerald-600 hover:text-white border border-emerald-600 hover:bg-emerald-600 dark:text-emerald-400 dark:border-emerald-500 focus-visible:ring-2 focus-visible:ring-offset-2 focus-visible:ring-emerald-500 disabled:opacity-50',\n    plain:\n      'text-emerald-600 hover:bg-emerald-50 dark:text-emerald-400 dark:hover:bg-emerald-950/40 focus-visible:ring-2 focus-visible:ring-offset-2 focus-visible:ring-emerald-500 disabled:opacity-50',\n  },\n  warning: {\n    default:\n      'text-white bg-amber-500 hover:bg-amber-600 focus-visible:ring-2 focus-visible:ring-offset-2 focus-visible:ring-amber-500 disabled:bg-amber-300 dark:disabled:bg-amber-900',\n    outlined:\n      'text-amber-600 hover:text-white border border-amber-500 hover:bg-amber-500 dark:text-amber-400 dark:border-amber-500 focus-visible:ring-2 focus-visible:ring-offset-2 focus-visible:ring-amber-500 disabled:opacity-50',\n    plain:\n      'text-amber-600 hover:bg-amber-50 dark:text-amber-400 dark:hover:bg-amber-950/40 focus-visible:ring-2 focus-visible:ring-offset-2 focus-visible:ring-amber-500 disabled:opacity-50',\n  },\n}\n\nconst LOADER_TEXT_CLASS: ThemedButtonClass = {\n  primary: {\n    default: 'text-white',\n    outlined: 'text-[var(--ui-primary-text)]',\n    plain: 'text-[var(--ui-primary-text)]',\n  },\n  danger: {\n    default: 'text-white',\n    outlined: 'text-[var(--ui-danger-text)]',\n    plain: 'text-[var(--ui-danger-text)]',\n  },\n  secondary: {\n    default: 'text-gray-700 dark:text-white',\n    outlined: 'text-gray-700 dark:text-gray-200',\n    plain: 'text-gray-700 dark:text-gray-200',\n  },\n  success: {\n    default: 'text-white',\n    outlined: 'text-emerald-600 dark:text-emerald-400',\n    plain: 'text-emerald-600 dark:text-emerald-400',\n  },\n  warning: {\n    default: 'text-white',\n    outlined: 'text-amber-600 dark:text-amber-400',\n    plain: 'text-amber-600 dark:text-amber-400',\n  },\n}\n\nconst SIZE_CLASSES: Record<ButtonSize, { normal: string; iconOnly: string }> = {\n  xs: { normal: 'h-7 px-2.5 rounded-sm gap-1 text-xs', iconOnly: 'h-7 w-7 p-1 rounded-sm text-xs' },\n  sm: { normal: 'h-8 px-3 rounded gap-1.5 text-sm', iconOnly: 'h-8 w-8 p-1.5 rounded text-sm' },\n  md: { normal: 'h-9 px-4 rounded-md gap-2 text-sm', iconOnly: 'h-9 w-9 p-2 rounded-md text-sm' },\n  lg: {\n    normal: 'h-10 px-5 rounded-lg gap-2 text-base',\n    iconOnly: 'h-10 w-10 p-2.5 rounded-lg text-base',\n  },\n}\n\nconst LOADER_SIZE: Record<ButtonSize, 'xs' | 'sm'> = {\n  xs: 'xs',\n  sm: 'xs',\n  md: 'sm',\n  lg: 'sm',\n}\n\n/**\n * Base shared tailwind classes.\n */\nconst BASE_BTN_CLASS =\n  'font-medium inline-flex items-center justify-center shrink-0 cursor-pointer select-none ' +\n  'disabled:cursor-not-allowed disabled:pointer-events-none disabled:opacity-75 ' +\n  'active:scale-[0.98] transition-all duration-150 ease-out focus:outline-none'\n\nexport const Button = forwardRef(\n  <C extends ElementType = 'button'>(\n    { as, type, ...props }: ButtonProps<C>,\n    ref: PolymorphicRef<C>,\n  ) => {\n    const {\n      className = '',\n      children,\n      theme = 'primary',\n      variant = 'default',\n      size = 'md',\n      leftIcon,\n      rightIcon,\n      fullWidth = false,\n      loading = false,\n      loadingText = '',\n      rounded = false,\n      disabled,\n      iconOnly = false,\n      noOutlineOnFocus = false,\n      active,\n      onClick,\n      ...restProps\n    } = props\n\n    const Component = as || 'button'\n    const isNativeButton = Component === 'button'\n\n    // Accessibility guard for icon-only buttons\n    if (iconOnly && !(restProps as Record<string, unknown>)['aria-label']) {\n      console.warn('[ui] <Button iconOnly> requires aria-label for accessibility.')\n    }\n\n    const resolvedDisabled = Boolean(disabled || loading)\n\n    // Clean invalid props when not rendering a real button\n    const { type: _ignoreType, disabled: _ignoreDisabled, ...cleanRest } = restProps\n\n    const handleClick = (e: React.MouseEvent<any>) => {\n      if (resolvedDisabled) {\n        e.preventDefault()\n        e.stopPropagation()\n        return\n      }\n      onClick?.(e)\n    }\n\n    const elementProps = isNativeButton\n      ? {\n          type: type ?? 'button',\n          disabled: resolvedDisabled,\n          onClick: handleClick,\n        }\n      : {\n          role: cleanRest.role ?? 'button',\n          tabIndex: resolvedDisabled ? -1 : (cleanRest.tabIndex ?? 0),\n          'aria-disabled': resolvedDisabled ? true : undefined,\n          onClick: handleClick,\n        }\n\n    const sizeObj = SIZE_CLASSES[size] || SIZE_CLASSES.md\n\n    const classes = useMemo(\n      () =>\n        buildClassName(\n          BASE_BTN_CLASS,\n          THEMED_BTN_CLASS[theme]?.[variant] || THEMED_BTN_CLASS.primary.default,\n          iconOnly ? sizeObj.iconOnly : sizeObj.normal,\n          !noOutlineOnFocus && 'focus-visible:ring-2 focus-visible:ring-offset-2',\n          rounded && 'rounded-full',\n          fullWidth && 'w-full',\n          variant === 'default' && 'shadow-xs hover:shadow-none disabled:shadow-none',\n          active && 'ring-2 ring-offset-2 ring-current',\n          className,\n        ),\n      [theme, variant, sizeObj, iconOnly, noOutlineOnFocus, rounded, fullWidth, active, className],\n    )\n\n    const loaderIcon = (\n      <Loader\n        data-testid=\"btn-loader-icon\"\n        size={LOADER_SIZE[size] || 'xs'}\n        className={buildClassName(LOADER_TEXT_CLASS[theme]?.[variant])}\n      />\n    )\n\n    /**\n     * SPECIAL CASE: iconOnly + loading → show spinner only\n     */\n    if (loading && iconOnly) {\n      return (\n        <Component\n          ref={ref}\n          className={classes}\n          aria-busy=\"true\"\n          aria-pressed={active !== undefined ? active : undefined}\n          {...elementProps}\n          {...cleanRest}\n        >\n          {loaderIcon}\n        </Component>\n      )\n    }\n\n    return (\n      <Component\n        ref={ref}\n        className={classes}\n        aria-busy={loading ? 'true' : undefined}\n        aria-pressed={active !== undefined ? active : undefined}\n        {...elementProps}\n        {...cleanRest}\n      >\n        {loading ? (\n          <span className=\"inline-flex items-center gap-2\" aria-live=\"polite\">\n            {loaderIcon}\n            {loadingText ? (\n              <TextContent className={buildClassName(LOADER_TEXT_CLASS[theme]?.[variant])}>\n                {loadingText}\n              </TextContent>\n            ) : (\n              children\n            )}\n          </span>\n        ) : (\n          <>\n            {leftIcon && <span className=\"shrink-0 inline-flex items-center\">{leftIcon}</span>}\n            {children}\n            {rightIcon && <span className=\"shrink-0 inline-flex items-center\">{rightIcon}</span>}\n          </>\n        )}\n      </Component>\n    )\n  },\n) as ButtonComponent\n\nButton.displayName = 'Button'\n"],"names":["forwardRef","useMemo","buildClassName","_jsx","Loader","_jsxs","TextContent","_Fragment"],"mappings":"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"}
+{"version":3,"file":"Button.js","sources":["../../../../../src/components/Button/Button.tsx"],"sourcesContent":["import React, { ElementType, forwardRef, useEffect, useMemo } from 'react'\nimport { buildClassName } from '../../utils/build-classname'\nimport { Loader } from '../Loader'\nimport { TextContent } from '../TextContent'\nimport type { ButtonComponent, ButtonProps, ButtonSize, ThemedButtonClass } from './Button.types'\nimport type { PolymorphicRef } from '../common-type'\n\n/**\n * Tailwind CSS classes for theme + variant combinations.\n *\n * Only colours live here. Focus outline width/offset and disabled styling are\n * applied uniformly in the component so they can be toggled in one place.\n */\nconst THEMED_BTN_CLASS: ThemedButtonClass = {\n  primary: {\n    default:\n      'text-white bg-[var(--ui-primary)] hover:bg-[var(--ui-primary-hover)] focus-visible:outline-[var(--ui-primary-ring)]',\n    outlined:\n      'text-[var(--ui-primary-text)] hover:text-white border border-[var(--ui-primary)] hover:bg-[var(--ui-primary)] focus-visible:outline-[var(--ui-primary-ring)]',\n    plain:\n      'text-[var(--ui-primary-text)] hover:bg-current/10 active:bg-current/15 focus-visible:outline-[var(--ui-primary-ring)]',\n  },\n  danger: {\n    default:\n      'text-white bg-[var(--ui-danger)] hover:bg-[var(--ui-danger-hover)] focus-visible:outline-[var(--ui-danger-ring)]',\n    outlined:\n      'text-[var(--ui-danger-text)] hover:text-white border border-[var(--ui-danger)] hover:bg-[var(--ui-danger)] focus-visible:outline-[var(--ui-danger-ring)]',\n    plain:\n      'text-[var(--ui-danger-text)] hover:bg-current/10 active:bg-current/15 focus-visible:outline-[var(--ui-danger-ring)]',\n  },\n  secondary: {\n    default:\n      'text-gray-700 bg-white border border-[var(--ui-border)] hover:bg-gray-100 dark:bg-gray-800 dark:text-white dark:hover:bg-gray-700 focus-visible:outline-[var(--ui-focus-ring)]',\n    outlined:\n      'text-gray-700 hover:text-white border border-[var(--ui-border)] hover:bg-gray-700 dark:text-gray-200 dark:hover:text-white dark:hover:bg-gray-600 focus-visible:outline-[var(--ui-focus-ring)]',\n    plain:\n      'text-gray-700 hover:bg-current/10 active:bg-current/15 dark:text-gray-200 focus-visible:outline-[var(--ui-focus-ring)]',\n  },\n  success: {\n    default: 'text-white bg-emerald-600 hover:bg-emerald-700 focus-visible:outline-emerald-500',\n    outlined:\n      'text-emerald-700 hover:text-white border border-emerald-600 hover:bg-emerald-600 dark:text-emerald-400 dark:border-emerald-500 focus-visible:outline-emerald-500',\n    plain:\n      'text-emerald-700 hover:bg-current/10 active:bg-current/15 dark:text-emerald-400 focus-visible:outline-emerald-500',\n  },\n  warning: {\n    default: 'text-white bg-amber-500 hover:bg-amber-600 focus-visible:outline-amber-500',\n    outlined:\n      'text-amber-700 hover:text-white border border-amber-500 hover:bg-amber-500 dark:text-amber-400 dark:border-amber-500 focus-visible:outline-amber-500',\n    plain:\n      'text-amber-700 hover:bg-current/10 active:bg-current/15 dark:text-amber-400 focus-visible:outline-amber-500',\n  },\n}\n\nconst SIZE_CLASSES: Record<ButtonSize, { normal: string; iconOnly: string }> = {\n  xs: { normal: 'h-7 px-2.5 rounded-sm gap-1 text-xs', iconOnly: 'h-7 w-7 p-1 rounded-sm text-xs' },\n  sm: { normal: 'h-8 px-3 rounded gap-1.5 text-sm', iconOnly: 'h-8 w-8 p-1.5 rounded text-sm' },\n  md: { normal: 'h-9 px-4 rounded-md gap-2 text-sm', iconOnly: 'h-9 w-9 p-2 rounded-md text-sm' },\n  lg: {\n    normal: 'h-10 px-5 rounded-lg gap-2 text-base',\n    iconOnly: 'h-10 w-10 p-2.5 rounded-lg text-base',\n  },\n}\n\nconst LOADER_SIZE: Record<ButtonSize, 'xs' | 'sm'> = {\n  xs: 'xs',\n  sm: 'xs',\n  md: 'sm',\n  lg: 'sm',\n}\n\n/**\n * Base shared tailwind classes.\n *\n * Disabled styling is keyed off both the native `disabled` attribute and\n * `aria-disabled`, so non-button elements rendered via `as` look disabled too.\n */\nconst BASE_BTN_CLASS =\n  'font-medium inline-flex items-center justify-center shrink-0 cursor-pointer select-none ' +\n  'transition-[color,background-color,border-color,box-shadow,opacity,transform] duration-150 ease-out ' +\n  'active:scale-[0.98] focus:outline-none ' +\n  'disabled:pointer-events-none disabled:opacity-50 disabled:shadow-none ' +\n  'aria-disabled:pointer-events-none aria-disabled:opacity-50 aria-disabled:shadow-none'\n\nexport const Button = forwardRef(\n  <C extends ElementType = 'button'>(\n    { as, type, ...props }: ButtonProps<C>,\n    ref: PolymorphicRef<C>,\n  ) => {\n    const {\n      className = '',\n      children,\n      theme = 'primary',\n      variant = 'default',\n      size = 'md',\n      leftIcon,\n      rightIcon,\n      fullWidth = false,\n      loading = false,\n      loadingText = '',\n      rounded = false,\n      disabled,\n      iconOnly = false,\n      noOutlineOnFocus = false,\n      active,\n      onClick,\n      ...restProps\n    } = props\n\n    const Component = as || 'button'\n    const isNativeButton = Component === 'button'\n\n    // Clean invalid props when not rendering a real button\n    const {\n      type: _ignoreType,\n      disabled: _ignoreDisabled,\n      role,\n      tabIndex,\n      onKeyDown,\n      onKeyUp,\n      ...domProps\n    } = restProps as Record<string, any>\n\n    const ariaLabel = domProps['aria-label']\n    const ariaLabelledBy = domProps['aria-labelledby']\n\n    // Accessibility guard for icon-only buttons\n    useEffect(() => {\n      if (iconOnly && !ariaLabel && !ariaLabelledBy) {\n        console.warn(\n          '[ui] <Button iconOnly> requires aria-label or aria-labelledby for accessibility.',\n        )\n      }\n    }, [iconOnly, ariaLabel, ariaLabelledBy])\n\n    const resolvedDisabled = Boolean(disabled || loading)\n\n    // Links (`href`, or `to` for router Link components) keep their native semantics.\n    const isLink = !isNativeButton && (domProps.href != null || domProps.to != null)\n\n    const handleClick = (e: React.MouseEvent<any>) => {\n      if (resolvedDisabled) {\n        e.preventDefault()\n        e.stopPropagation()\n        return\n      }\n      onClick?.(e)\n    }\n\n    // Mirror native <button> keyboard activation for non-button elements:\n    // Enter activates on keydown, Space on keyup (and must not scroll the page).\n    const handleKeyDown = (e: React.KeyboardEvent<any>) => {\n      onKeyDown?.(e)\n      if (e.defaultPrevented || e.target !== e.currentTarget) return\n      if (e.key === 'Enter') {\n        e.preventDefault()\n        e.currentTarget.click()\n      } else if (e.key === ' ') {\n        e.preventDefault()\n      }\n    }\n\n    const handleKeyUp = (e: React.KeyboardEvent<any>) => {\n      onKeyUp?.(e)\n      if (e.defaultPrevented || e.target !== e.currentTarget) return\n      if (e.key === ' ') {\n        e.preventDefault()\n        e.currentTarget.click()\n      }\n    }\n\n    const elementProps = isNativeButton\n      ? {\n          type: type ?? 'button',\n          disabled: resolvedDisabled,\n          role,\n          tabIndex,\n          onClick: handleClick,\n          onKeyDown,\n          onKeyUp,\n        }\n      : isLink\n        ? {\n            role,\n            tabIndex: resolvedDisabled ? -1 : tabIndex,\n            'aria-disabled': resolvedDisabled ? true : undefined,\n            onClick: handleClick,\n            onKeyDown,\n            onKeyUp,\n          }\n        : {\n            role: role ?? 'button',\n            tabIndex: resolvedDisabled ? -1 : (tabIndex ?? 0),\n            'aria-disabled': resolvedDisabled ? true : undefined,\n            onClick: handleClick,\n            onKeyDown: handleKeyDown,\n            onKeyUp: handleKeyUp,\n          }\n\n    const sizeObj = SIZE_CLASSES[size] || SIZE_CLASSES.md\n\n    const classes = useMemo(\n      () =>\n        buildClassName(\n          BASE_BTN_CLASS,\n          THEMED_BTN_CLASS[theme]?.[variant] || THEMED_BTN_CLASS.primary.default,\n          iconOnly ? sizeObj.iconOnly : sizeObj.normal,\n          // An outline (not a ring) so the offset gap stays transparent on any surface/mode.\n          !noOutlineOnFocus &&\n            'focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-solid',\n          rounded && 'rounded-full',\n          fullWidth && 'w-full',\n          variant === 'default' && 'shadow-xs hover:shadow-none',\n          active && 'ring-2 ring-current',\n          className,\n        ),\n      [theme, variant, sizeObj, iconOnly, noOutlineOnFocus, rounded, fullWidth, active, className],\n    )\n\n    // The spinner and loading text inherit the button's text colour.\n    const loaderIcon = (\n      <Loader\n        data-testid=\"btn-loader-icon\"\n        size={LOADER_SIZE[size] || 'xs'}\n        className=\"text-current\"\n      />\n    )\n\n    /**\n     * SPECIAL CASE: iconOnly + loading → show spinner only\n     */\n    if (loading && iconOnly) {\n      return (\n        <Component\n          ref={ref}\n          className={classes}\n          aria-busy=\"true\"\n          aria-pressed={active !== undefined ? active : undefined}\n          {...domProps}\n          {...elementProps}\n        >\n          {loaderIcon}\n        </Component>\n      )\n    }\n\n    return (\n      <Component\n        ref={ref}\n        className={classes}\n        aria-busy={loading ? 'true' : undefined}\n        aria-pressed={active !== undefined ? active : undefined}\n        {...domProps}\n        {...elementProps}\n      >\n        {loading ? (\n          <span className=\"inline-flex items-center gap-2\" aria-live=\"polite\">\n            {loaderIcon}\n            {loadingText ? (\n              <TextContent className=\"text-current\">{loadingText}</TextContent>\n            ) : (\n              children\n            )}\n          </span>\n        ) : (\n          <>\n            {leftIcon && <span className=\"shrink-0 inline-flex items-center\">{leftIcon}</span>}\n            {children}\n            {rightIcon && <span className=\"shrink-0 inline-flex items-center\">{rightIcon}</span>}\n          </>\n        )}\n      </Component>\n    )\n  },\n) as ButtonComponent\n\nButton.displayName = 'Button'\n"],"names":["forwardRef","useEffect","useMemo","buildClassName","_jsx","Loader","_jsxs","TextContent"],"mappings":"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"}

package/dist/cjs/components/DataTable/DataTable.js

@@ -134,7 +134,7 @@ function DataTable({ items, columns, sorting = {}, onSort, loading, pagination,
                                         }), isInlineMode && (jsxRuntime.jsx(Table.TableCell, { align: "right", className: buildClassname.buildClassName(densityCellClass, striped && idx % 2 === 1 && 'bg-gray-50 dark:bg-gray-800/40'), onClick: (e) => e.stopPropagation(), children: jsxRuntime.jsx("div", { className: buildClassname.buildClassName('opacity-0 group-hover:opacity-100 group-focus-within:opacity-100 transition-opacity duration-150 flex items-center justify-end gap-1.5', rowHoverActionClass), "data-testid": `row-hover-actions-${key}`, children: renderActionsContent(item, idx) }) })), isOverlayMode && (jsxRuntime.jsx(Table.TableCell, { align: "right", style: { padding: 0, width: 0, minWidth: 0, maxWidth: 0 }, className: "sticky right-0 z-20 !p-0 !pr-0 !pl-0 !py-0 w-0 max-w-0 min-w-0 border-0 overflow-visible text-right", onClick: (e) => e.stopPropagation(), children: jsxRuntime.jsx("div", { className: buildClassname.buildClassName('absolute right-0 top-0 bottom-0 h-full opacity-0 group-hover:opacity-100 group-focus-within:opacity-100 transition-opacity duration-150 flex items-center justify-end gap-1 px-3 z-30 pointer-events-none group-hover:pointer-events-auto whitespace-nowrap', striped && idx % 2 === 1
                                                     ? 'bg-gray-100 dark:bg-gray-800'
                                                     : 'bg-white group-hover:bg-gray-50 dark:bg-gray-900 dark:group-hover:bg-gray-800', rowHoverActionClass), "data-testid": `row-hover-actions-${key}`, children: renderActionsContent(item, idx) }) }))] }, key));
-                            })) }), footerRow && jsxRuntime.jsx(Table.TableFoot, { children: footerRow })] }) }), pagination && (jsxRuntime.jsx("div", { className: buildClassname.buildClassName(stickyPagination && 'sticky bottom-0 z-20 bg-white dark:bg-gray-800', paginationClass, paginationContainerClass), children: renderPagination ? (renderPagination(pagination, setPagination)) : (jsxRuntime.jsx(Pagination.Pagination, { ...pagination, ...paginationProps, className: buildClassname.buildClassName('rounded-t-none rounded-b-lg border border-[var(--ui-border)]', stickyPagination && 'sticky bottom-0 z-20 bg-white dark:bg-gray-800', paginationProps === null || paginationProps === void 0 ? void 0 : paginationProps.className), onChange: setPagination })) }))] }));
+                            })) }), footerRow && jsxRuntime.jsx(Table.TableFoot, { children: footerRow })] }) }), pagination && (jsxRuntime.jsx("div", { className: buildClassname.buildClassName(stickyPagination && 'sticky bottom-0 z-20', paginationContainerClass), children: renderPagination ? (renderPagination(pagination, setPagination)) : (jsxRuntime.jsx(Pagination.Pagination, { ...pagination, ...paginationProps, className: buildClassname.buildClassName('rounded-t-none rounded-b-lg border border-[var(--ui-border)] bg-white dark:bg-gray-800', paginationClass, paginationProps === null || paginationProps === void 0 ? void 0 : paginationProps.className), onChange: setPagination })) }))] }));
 }
 DataTable.displayName = 'DataTable';
 

package/dist/cjs/components/DataTable/DataTable.js.map

@@ -1 +1 @@
-{"version":3,"file":"DataTable.js","sources":["../../../../../src/components/DataTable/DataTable.tsx"],"sourcesContent":["import { useCallback, useEffect, useMemo, useRef, useState } from 'react'\nimport {\n  EmptyTableRow,\n  Table,\n  TableBody,\n  TableCell,\n  TableFoot,\n  TableHead,\n  TableHeaderCell,\n  TableRow,\n} from '../Table'\nimport { buildClassName } from '../../utils/build-classname'\nimport type {\n  DataTableProps,\n  DataTableColumn,\n  DataTableDensity,\n  Sorting,\n  SortQuery,\n} from './DataTable.types'\nimport { TextContent } from '../TextContent'\nimport { Pagination } from '../Pagination'\nimport { Checkbox } from '../Checkbox'\nimport { Button } from '../Button'\nimport { get } from '../../utils/get'\nimport { updateSortQuery, useRowSelection } from './DataTable.utils'\nimport { getSortIcon } from './DataTable.icons'\n\nconst OVERFLOW_REGEX = /\\boverflow-(x-|y-)?(auto|hidden|scroll|visible|clip)\\b/\nconst NOOP = () => {}\n\nconst DENSITY_CELL_CLASS: Record<DataTableDensity, string> = {\n  compact: 'px-2 py-1.5',\n  default: '',\n  spacious: 'px-4 py-4',\n}\n\nconst autoSortItems = <T,>(items: T[], column: DataTableColumn<T>, sort: Sorting): T[] => {\n  const path = column.name\n  return [...items].sort((a, b) => {\n    const valueA = get(a as Record<string, any>, path)\n    const valueB = get(b as Record<string, any>, path)\n\n    if (column.type === 'number') {\n      const nA = Number(valueA)\n      const nB = Number(valueB)\n      return sort === 'asc' || sort === '1' ? nA - nB : nB - nA\n    }\n\n    if (column.type === 'date') {\n      const dA = new Date(valueA).getTime()\n      const dB = new Date(valueB).getTime()\n      return sort === 'asc' || sort === '1' ? dA - dB : dB - dA\n    }\n\n    const sA = String(valueA).toLowerCase()\n    const sB = String(valueB).toLowerCase()\n    if (sA < sB) return sort === 'asc' || sort === '1' ? -1 : 1\n    if (sA > sB) return sort === 'asc' || sort === '1' ? 1 : -1\n    return 0\n  })\n}\n\nexport function DataTable<T extends Record<string, any> = Record<string, any>>({\n  items,\n  columns,\n  sorting = {},\n  onSort,\n  loading,\n  pagination,\n  setPagination = NOOP,\n  emptyMessage = 'No data found',\n  containerClass = '',\n  wrapperClass = '',\n  tableClass = '',\n  headClass = '',\n  footerRow,\n  rowKey = 'id',\n  onRowClick,\n  rowClass,\n  density = 'default',\n  striped = false,\n  layout = 'auto',\n  selectable = false,\n  selectedRowKeys,\n  defaultSelectedRowKeys,\n  onSelectionChange,\n  isRowSelectable,\n  stickyHeader = true,\n  stickyPagination = true,\n  rowHoverActions,\n  renderRowHoverActions,\n  rowHoverActionHeader,\n  rowHoverActionMode = 'overlay',\n  rowHoverActionClass,\n  paginationClass,\n  paginationContainerClass,\n  paginationProps,\n  renderPagination,\n}: DataTableProps<T>) {\n  const [internalSortingState, setInternalSortingState] = useState<SortQuery>({})\n\n  const handleSort = useCallback(\n    (column: DataTableColumn<T>) => {\n      if (!column.sortable) return\n      if (onSort) {\n        onSort(column)\n      } else {\n        setInternalSortingState((prev) => updateSortQuery(prev, column.name, column.type))\n      }\n    },\n    [onSort],\n  )\n\n  const activeSorting = useMemo(\n    () => ({ ...sorting, ...internalSortingState }),\n    [sorting, internalSortingState],\n  )\n\n  const sortedItems: T[] = useMemo(() => {\n    if (onSort) return items\n    const activeSortKey = Object.keys(activeSorting)[0]\n    if (!activeSortKey) return items\n    const column = columns.find((c) => c.name === activeSortKey)\n    if (!column) return items\n    return autoSortItems(items, column, activeSorting[activeSortKey])\n  }, [items, columns, onSort, activeSorting])\n\n  const getKey = useCallback(\n    (item: T, idx: number): string | number =>\n      typeof rowKey === 'function' ? rowKey(item) : ((item as any)[rowKey] ?? idx),\n    [rowKey],\n  )\n\n  const getRowClass = useCallback(\n    (item: T, idx: number): string =>\n      typeof rowClass === 'function' ? rowClass(item, idx) : rowClass || '',\n    [rowClass],\n  )\n\n  const getCellClass = useCallback(\n    (column: DataTableColumn<T>, item: T): string =>\n      typeof column.cellClass === 'function' ? column.cellClass(item) : column.cellClass || '',\n    [],\n  )\n\n  const { isSelected, toggleRow, toggleAll, allSelected, someSelected } = useRowSelection({\n    items: sortedItems,\n    getKey,\n    selectedRowKeys,\n    defaultSelectedRowKeys,\n    onSelectionChange,\n    isRowSelectable,\n  })\n\n  const hasRowHoverActions = Boolean(rowHoverActions || renderRowHoverActions)\n  const isInlineMode = hasRowHoverActions && rowHoverActionMode === 'inline'\n  const isOverlayMode = hasRowHoverActions && rowHoverActionMode !== 'inline'\n\n  const densityCellClass = DENSITY_CELL_CLASS[density]\n  const colSize = columns.length + (selectable ? 1 : 0) + (isInlineMode ? 1 : 0)\n  const wrapperHasOverflow = OVERFLOW_REGEX.test(wrapperClass)\n\n  const renderActionsContent = useCallback(\n    (item: T, idx: number) => {\n      if (renderRowHoverActions) return renderRowHoverActions(item, idx)\n      if (!rowHoverActions) return null\n      return rowHoverActions(item, idx).map((act) => {\n        const isDisabled = typeof act.disabled === 'function' ? act.disabled(item) : act.disabled\n        const isIconOnly = Boolean(act.icon && !act.label)\n\n        return (\n          <Button\n            key={act.id}\n            size=\"xs\"\n            theme={act.theme || 'secondary'}\n            variant={act.variant || 'plain'}\n            disabled={isDisabled}\n            title={act.title || (typeof act.label === 'string' ? act.label : undefined)}\n            className={buildClassName(\n              isIconOnly\n                ? 'p-1.5 rounded-full hover:bg-black/5 dark:hover:bg-white/10'\n                : 'px-2 py-1',\n              act.className,\n            )}\n            onClick={(e) => {\n              e.stopPropagation()\n              act.onClick(item, idx, e)\n            }}\n          >\n            {act.icon && <span className=\"shrink-0\">{act.icon}</span>}\n            {act.label && <span>{act.label}</span>}\n          </Button>\n        )\n      })\n    },\n    [renderRowHoverActions, rowHoverActions],\n  )\n\n  return (\n    <div className={buildClassName('w-full rounded-lg relative', containerClass)}>\n      <div\n        className={buildClassName(\n          !wrapperHasOverflow && 'overflow-x-auto',\n          'rounded-lg border border-[var(--ui-border)]',\n          wrapperClass,\n          pagination && 'rounded-b-none border-b-0',\n        )}\n      >\n        <Table\n          className={buildClassName('relative w-full max-w-full h-fit', tableClass)}\n          layout={layout}\n        >\n          <TableHead className={headClass}>\n            {selectable && (\n              <TableHeaderCell\n                className={buildClassName(\n                  'bg-gray-50 dark:bg-gray-800 w-px',\n                  densityCellClass,\n                  stickyHeader && 'sticky top-0 z-20 shadow-[0_1px_2px_rgba(0,0,0,0.06)]',\n                )}\n              >\n                <Checkbox\n                  aria-label=\"Select all rows\"\n                  checked={allSelected}\n                  ref={(el) => {\n                    if (el) el.indeterminate = someSelected\n                  }}\n                  onChange={toggleAll}\n                />\n              </TableHeaderCell>\n            )}\n            {columns.map((column) => {\n              const sortState = activeSorting[column.name]\n              const ariaSortValue = column.sortable\n                ? sortState === 'asc' || sortState === '1'\n                  ? 'ascending'\n                  : sortState === 'desc' || sortState === '-1'\n                    ? 'descending'\n                    : 'none'\n                : undefined\n\n              return (\n                <TableHeaderCell\n                  key={column.name}\n                  align={column.headerAlign}\n                  style={{ width: column.width || 'auto' }}\n                  aria-sort={ariaSortValue}\n                  className={buildClassName(\n                    'bg-gray-50 dark:bg-gray-800',\n                    densityCellClass,\n                    stickyHeader && 'sticky top-0 z-20 shadow-[0_1px_2px_rgba(0,0,0,0.06)]',\n                    column.sticky === 'left' &&\n                      'sticky left-0 z-30 shadow-[2px_0_6px_rgba(0,0,0,0.06)]',\n                    column.sticky === 'right' &&\n                      'sticky right-0 z-30 shadow-[-2px_0_6px_rgba(0,0,0,0.06)]',\n                    column.headerClass,\n                  )}\n                >\n                  <TextContent\n                    role={column.sortable ? 'button' : undefined}\n                    tabIndex={column.sortable ? 0 : undefined}\n                    aria-label={column.sortable ? `Sort by ${column.label}` : undefined}\n                    className={buildClassName(\n                      'group',\n                      column.sortable &&\n                        'inline-flex items-center gap-2 cursor-pointer select-none focus:outline-none focus-visible:ring-1 focus-visible:ring-blue-500 rounded',\n                    )}\n                    onClick={() => handleSort(column)}\n                    onKeyDown={(e) => {\n                      if (column.sortable && (e.key === 'Enter' || e.key === ' ')) {\n                        e.preventDefault()\n                        handleSort(column)\n                      }\n                    }}\n                  >\n                    <TextContent className=\"shrink-0\">{column.label}</TextContent>\n                    {column.sortable ? getSortIcon(activeSorting[column.name]) : null}\n                  </TextContent>\n                </TableHeaderCell>\n              )\n            })}\n            {isInlineMode && (\n              <TableHeaderCell\n                align=\"right\"\n                className={buildClassName(\n                  'bg-gray-50 dark:bg-gray-800 text-right w-px',\n                  densityCellClass,\n                  stickyHeader && 'sticky top-0 z-20 shadow-[0_1px_2px_rgba(0,0,0,0.06)]',\n                )}\n              >\n                {rowHoverActionHeader ?? ''}\n              </TableHeaderCell>\n            )}\n            {isOverlayMode && (\n              <TableHeaderCell\n                align=\"right\"\n                style={{ padding: 0, width: 0, minWidth: 0, maxWidth: 0 }}\n                className={buildClassName(\n                  'sticky right-0 z-20 !p-0 !pr-0 !pl-0 !py-0 w-0 max-w-0 min-w-0 border-0 bg-gray-50 dark:bg-gray-800',\n                  stickyHeader && 'top-0',\n                )}\n              >\n                {null}\n              </TableHeaderCell>\n            )}\n          </TableHead>\n\n          <TableBody loading={loading} colSize={colSize} rowSize={pagination?.limit || 5}>\n            {!loading && sortedItems.length === 0 ? (\n              <EmptyTableRow colSpan={colSize}>{emptyMessage}</EmptyTableRow>\n            ) : (\n              sortedItems.map((item, idx) => {\n                const key = getKey(item, idx)\n                const rowSelectable = !isRowSelectable || isRowSelectable(item)\n\n                return (\n                  <TableRow\n                    key={key}\n                    className={buildClassName(\n                      'group',\n                      onRowClick && 'cursor-pointer',\n                      striped && idx % 2 === 1 && 'bg-gray-50 dark:bg-gray-800/40',\n                      getRowClass(item, idx),\n                    )}\n                    onClick={onRowClick ? () => onRowClick(item, idx) : undefined}\n                  >\n                    {selectable && (\n                      <TableCell\n                        className={buildClassName(\n                          densityCellClass,\n                          striped && idx % 2 === 1 && 'bg-gray-50 dark:bg-gray-800/40',\n                        )}\n                      >\n                        <span onClick={(e) => e.stopPropagation()}>\n                          <Checkbox\n                            aria-label=\"Select row\"\n                            checked={isSelected(key)}\n                            disabled={!rowSelectable}\n                            onChange={() => toggleRow(key)}\n                          />\n                        </span>\n                      </TableCell>\n                    )}\n                    {columns.map((column) => (\n                      <TableCell\n                        key={column.name}\n                        align={column.align}\n                        className={buildClassName(\n                          densityCellClass,\n                          striped && idx % 2 === 1 && 'bg-gray-50 dark:bg-gray-800/40',\n                          column.sticky === 'left' &&\n                            'sticky left-0 z-10 shadow-[2px_0_6px_rgba(0,0,0,0.06)]',\n                          column.sticky === 'right' &&\n                            'sticky right-0 z-10 shadow-[-2px_0_6px_rgba(0,0,0,0.06)]',\n                          getCellClass(column, item),\n                        )}\n                      >\n                        {column.render\n                          ? column.render(item)\n                          : ((get(item, column.name) as any) ?? 'Not set')}\n                      </TableCell>\n                    ))}\n                    {isInlineMode && (\n                      <TableCell\n                        align=\"right\"\n                        className={buildClassName(\n                          densityCellClass,\n                          striped && idx % 2 === 1 && 'bg-gray-50 dark:bg-gray-800/40',\n                        )}\n                        onClick={(e) => e.stopPropagation()}\n                      >\n                        <div\n                          className={buildClassName(\n                            'opacity-0 group-hover:opacity-100 group-focus-within:opacity-100 transition-opacity duration-150 flex items-center justify-end gap-1.5',\n                            rowHoverActionClass,\n                          )}\n                          data-testid={`row-hover-actions-${key}`}\n                        >\n                          {renderActionsContent(item, idx)}\n                        </div>\n                      </TableCell>\n                    )}\n                    {isOverlayMode && (\n                      <TableCell\n                        align=\"right\"\n                        style={{ padding: 0, width: 0, minWidth: 0, maxWidth: 0 }}\n                        className=\"sticky right-0 z-20 !p-0 !pr-0 !pl-0 !py-0 w-0 max-w-0 min-w-0 border-0 overflow-visible text-right\"\n                        onClick={(e) => e.stopPropagation()}\n                      >\n                        <div\n                          className={buildClassName(\n                            'absolute right-0 top-0 bottom-0 h-full opacity-0 group-hover:opacity-100 group-focus-within:opacity-100 transition-opacity duration-150 flex items-center justify-end gap-1 px-3 z-30 pointer-events-none group-hover:pointer-events-auto whitespace-nowrap',\n                            striped && idx % 2 === 1\n                              ? 'bg-gray-100 dark:bg-gray-800'\n                              : 'bg-white group-hover:bg-gray-50 dark:bg-gray-900 dark:group-hover:bg-gray-800',\n                            rowHoverActionClass,\n                          )}\n                          data-testid={`row-hover-actions-${key}`}\n                        >\n                          {renderActionsContent(item, idx)}\n                        </div>\n                      </TableCell>\n                    )}\n                  </TableRow>\n                )\n              })\n            )}\n          </TableBody>\n\n          {footerRow && <TableFoot>{footerRow}</TableFoot>}\n        </Table>\n      </div>\n\n      {pagination && (\n        <div\n          className={buildClassName(\n            stickyPagination && 'sticky bottom-0 z-20 bg-white dark:bg-gray-800',\n            paginationClass,\n            paginationContainerClass,\n          )}\n        >\n          {renderPagination ? (\n            renderPagination(pagination, setPagination)\n          ) : (\n            <Pagination\n              {...pagination}\n              {...paginationProps}\n              className={buildClassName(\n                'rounded-t-none rounded-b-lg border border-[var(--ui-border)]',\n                stickyPagination && 'sticky bottom-0 z-20 bg-white dark:bg-gray-800',\n                paginationProps?.className,\n              )}\n              onChange={setPagination}\n            />\n          )}\n        </div>\n      )}\n    </div>\n  )\n}\n\nDataTable.displayName = 'DataTable'\n"],"names":["get","useState","useCallback","updateSortQuery","useMemo","useRowSelection","_jsxs","Button","buildClassName","_jsx","Table","TableHead","TableHeaderCell","Checkbox","TextContent","getSortIcon","TableBody","EmptyTableRow","TableRow","TableCell","TableFoot","Pagination"],"mappings":"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"}
+{"version":3,"file":"DataTable.js","sources":["../../../../../src/components/DataTable/DataTable.tsx"],"sourcesContent":["import { useCallback, useEffect, useMemo, useRef, useState } from 'react'\nimport {\n  EmptyTableRow,\n  Table,\n  TableBody,\n  TableCell,\n  TableFoot,\n  TableHead,\n  TableHeaderCell,\n  TableRow,\n} from '../Table'\nimport { buildClassName } from '../../utils/build-classname'\nimport type {\n  DataTableProps,\n  DataTableColumn,\n  DataTableDensity,\n  Sorting,\n  SortQuery,\n} from './DataTable.types'\nimport { TextContent } from '../TextContent'\nimport { Pagination } from '../Pagination'\nimport { Checkbox } from '../Checkbox'\nimport { Button } from '../Button'\nimport { get } from '../../utils/get'\nimport { updateSortQuery, useRowSelection } from './DataTable.utils'\nimport { getSortIcon } from './DataTable.icons'\n\nconst OVERFLOW_REGEX = /\\boverflow-(x-|y-)?(auto|hidden|scroll|visible|clip)\\b/\nconst NOOP = () => {}\n\nconst DENSITY_CELL_CLASS: Record<DataTableDensity, string> = {\n  compact: 'px-2 py-1.5',\n  default: '',\n  spacious: 'px-4 py-4',\n}\n\nconst autoSortItems = <T,>(items: T[], column: DataTableColumn<T>, sort: Sorting): T[] => {\n  const path = column.name\n  return [...items].sort((a, b) => {\n    const valueA = get(a as Record<string, any>, path)\n    const valueB = get(b as Record<string, any>, path)\n\n    if (column.type === 'number') {\n      const nA = Number(valueA)\n      const nB = Number(valueB)\n      return sort === 'asc' || sort === '1' ? nA - nB : nB - nA\n    }\n\n    if (column.type === 'date') {\n      const dA = new Date(valueA).getTime()\n      const dB = new Date(valueB).getTime()\n      return sort === 'asc' || sort === '1' ? dA - dB : dB - dA\n    }\n\n    const sA = String(valueA).toLowerCase()\n    const sB = String(valueB).toLowerCase()\n    if (sA < sB) return sort === 'asc' || sort === '1' ? -1 : 1\n    if (sA > sB) return sort === 'asc' || sort === '1' ? 1 : -1\n    return 0\n  })\n}\n\nexport function DataTable<T extends Record<string, any> = Record<string, any>>({\n  items,\n  columns,\n  sorting = {},\n  onSort,\n  loading,\n  pagination,\n  setPagination = NOOP,\n  emptyMessage = 'No data found',\n  containerClass = '',\n  wrapperClass = '',\n  tableClass = '',\n  headClass = '',\n  footerRow,\n  rowKey = 'id',\n  onRowClick,\n  rowClass,\n  density = 'default',\n  striped = false,\n  layout = 'auto',\n  selectable = false,\n  selectedRowKeys,\n  defaultSelectedRowKeys,\n  onSelectionChange,\n  isRowSelectable,\n  stickyHeader = true,\n  stickyPagination = true,\n  rowHoverActions,\n  renderRowHoverActions,\n  rowHoverActionHeader,\n  rowHoverActionMode = 'overlay',\n  rowHoverActionClass,\n  paginationClass,\n  paginationContainerClass,\n  paginationProps,\n  renderPagination,\n}: DataTableProps<T>) {\n  const [internalSortingState, setInternalSortingState] = useState<SortQuery>({})\n\n  const handleSort = useCallback(\n    (column: DataTableColumn<T>) => {\n      if (!column.sortable) return\n      if (onSort) {\n        onSort(column)\n      } else {\n        setInternalSortingState((prev) => updateSortQuery(prev, column.name, column.type))\n      }\n    },\n    [onSort],\n  )\n\n  const activeSorting = useMemo(\n    () => ({ ...sorting, ...internalSortingState }),\n    [sorting, internalSortingState],\n  )\n\n  const sortedItems: T[] = useMemo(() => {\n    if (onSort) return items\n    const activeSortKey = Object.keys(activeSorting)[0]\n    if (!activeSortKey) return items\n    const column = columns.find((c) => c.name === activeSortKey)\n    if (!column) return items\n    return autoSortItems(items, column, activeSorting[activeSortKey])\n  }, [items, columns, onSort, activeSorting])\n\n  const getKey = useCallback(\n    (item: T, idx: number): string | number =>\n      typeof rowKey === 'function' ? rowKey(item) : ((item as any)[rowKey] ?? idx),\n    [rowKey],\n  )\n\n  const getRowClass = useCallback(\n    (item: T, idx: number): string =>\n      typeof rowClass === 'function' ? rowClass(item, idx) : rowClass || '',\n    [rowClass],\n  )\n\n  const getCellClass = useCallback(\n    (column: DataTableColumn<T>, item: T): string =>\n      typeof column.cellClass === 'function' ? column.cellClass(item) : column.cellClass || '',\n    [],\n  )\n\n  const { isSelected, toggleRow, toggleAll, allSelected, someSelected } = useRowSelection({\n    items: sortedItems,\n    getKey,\n    selectedRowKeys,\n    defaultSelectedRowKeys,\n    onSelectionChange,\n    isRowSelectable,\n  })\n\n  const hasRowHoverActions = Boolean(rowHoverActions || renderRowHoverActions)\n  const isInlineMode = hasRowHoverActions && rowHoverActionMode === 'inline'\n  const isOverlayMode = hasRowHoverActions && rowHoverActionMode !== 'inline'\n\n  const densityCellClass = DENSITY_CELL_CLASS[density]\n  const colSize = columns.length + (selectable ? 1 : 0) + (isInlineMode ? 1 : 0)\n  const wrapperHasOverflow = OVERFLOW_REGEX.test(wrapperClass)\n\n  const renderActionsContent = useCallback(\n    (item: T, idx: number) => {\n      if (renderRowHoverActions) return renderRowHoverActions(item, idx)\n      if (!rowHoverActions) return null\n      return rowHoverActions(item, idx).map((act) => {\n        const isDisabled = typeof act.disabled === 'function' ? act.disabled(item) : act.disabled\n        const isIconOnly = Boolean(act.icon && !act.label)\n\n        return (\n          <Button\n            key={act.id}\n            size=\"xs\"\n            theme={act.theme || 'secondary'}\n            variant={act.variant || 'plain'}\n            disabled={isDisabled}\n            title={act.title || (typeof act.label === 'string' ? act.label : undefined)}\n            className={buildClassName(\n              isIconOnly\n                ? 'p-1.5 rounded-full hover:bg-black/5 dark:hover:bg-white/10'\n                : 'px-2 py-1',\n              act.className,\n            )}\n            onClick={(e) => {\n              e.stopPropagation()\n              act.onClick(item, idx, e)\n            }}\n          >\n            {act.icon && <span className=\"shrink-0\">{act.icon}</span>}\n            {act.label && <span>{act.label}</span>}\n          </Button>\n        )\n      })\n    },\n    [renderRowHoverActions, rowHoverActions],\n  )\n\n  return (\n    <div className={buildClassName('w-full rounded-lg relative', containerClass)}>\n      <div\n        className={buildClassName(\n          !wrapperHasOverflow && 'overflow-x-auto',\n          'rounded-lg border border-[var(--ui-border)]',\n          wrapperClass,\n          pagination && 'rounded-b-none border-b-0',\n        )}\n      >\n        <Table\n          className={buildClassName('relative w-full max-w-full h-fit', tableClass)}\n          layout={layout}\n        >\n          <TableHead className={headClass}>\n            {selectable && (\n              <TableHeaderCell\n                className={buildClassName(\n                  'bg-gray-50 dark:bg-gray-800 w-px',\n                  densityCellClass,\n                  stickyHeader && 'sticky top-0 z-20 shadow-[0_1px_2px_rgba(0,0,0,0.06)]',\n                )}\n              >\n                <Checkbox\n                  aria-label=\"Select all rows\"\n                  checked={allSelected}\n                  ref={(el) => {\n                    if (el) el.indeterminate = someSelected\n                  }}\n                  onChange={toggleAll}\n                />\n              </TableHeaderCell>\n            )}\n            {columns.map((column) => {\n              const sortState = activeSorting[column.name]\n              const ariaSortValue = column.sortable\n                ? sortState === 'asc' || sortState === '1'\n                  ? 'ascending'\n                  : sortState === 'desc' || sortState === '-1'\n                    ? 'descending'\n                    : 'none'\n                : undefined\n\n              return (\n                <TableHeaderCell\n                  key={column.name}\n                  align={column.headerAlign}\n                  style={{ width: column.width || 'auto' }}\n                  aria-sort={ariaSortValue}\n                  className={buildClassName(\n                    'bg-gray-50 dark:bg-gray-800',\n                    densityCellClass,\n                    stickyHeader && 'sticky top-0 z-20 shadow-[0_1px_2px_rgba(0,0,0,0.06)]',\n                    column.sticky === 'left' &&\n                      'sticky left-0 z-30 shadow-[2px_0_6px_rgba(0,0,0,0.06)]',\n                    column.sticky === 'right' &&\n                      'sticky right-0 z-30 shadow-[-2px_0_6px_rgba(0,0,0,0.06)]',\n                    column.headerClass,\n                  )}\n                >\n                  <TextContent\n                    role={column.sortable ? 'button' : undefined}\n                    tabIndex={column.sortable ? 0 : undefined}\n                    aria-label={column.sortable ? `Sort by ${column.label}` : undefined}\n                    className={buildClassName(\n                      'group',\n                      column.sortable &&\n                        'inline-flex items-center gap-2 cursor-pointer select-none focus:outline-none focus-visible:ring-1 focus-visible:ring-blue-500 rounded',\n                    )}\n                    onClick={() => handleSort(column)}\n                    onKeyDown={(e) => {\n                      if (column.sortable && (e.key === 'Enter' || e.key === ' ')) {\n                        e.preventDefault()\n                        handleSort(column)\n                      }\n                    }}\n                  >\n                    <TextContent className=\"shrink-0\">{column.label}</TextContent>\n                    {column.sortable ? getSortIcon(activeSorting[column.name]) : null}\n                  </TextContent>\n                </TableHeaderCell>\n              )\n            })}\n            {isInlineMode && (\n              <TableHeaderCell\n                align=\"right\"\n                className={buildClassName(\n                  'bg-gray-50 dark:bg-gray-800 text-right w-px',\n                  densityCellClass,\n                  stickyHeader && 'sticky top-0 z-20 shadow-[0_1px_2px_rgba(0,0,0,0.06)]',\n                )}\n              >\n                {rowHoverActionHeader ?? ''}\n              </TableHeaderCell>\n            )}\n            {isOverlayMode && (\n              <TableHeaderCell\n                align=\"right\"\n                style={{ padding: 0, width: 0, minWidth: 0, maxWidth: 0 }}\n                className={buildClassName(\n                  'sticky right-0 z-20 !p-0 !pr-0 !pl-0 !py-0 w-0 max-w-0 min-w-0 border-0 bg-gray-50 dark:bg-gray-800',\n                  stickyHeader && 'top-0',\n                )}\n              >\n                {null}\n              </TableHeaderCell>\n            )}\n          </TableHead>\n\n          <TableBody loading={loading} colSize={colSize} rowSize={pagination?.limit || 5}>\n            {!loading && sortedItems.length === 0 ? (\n              <EmptyTableRow colSpan={colSize}>{emptyMessage}</EmptyTableRow>\n            ) : (\n              sortedItems.map((item, idx) => {\n                const key = getKey(item, idx)\n                const rowSelectable = !isRowSelectable || isRowSelectable(item)\n\n                return (\n                  <TableRow\n                    key={key}\n                    className={buildClassName(\n                      'group',\n                      onRowClick && 'cursor-pointer',\n                      striped && idx % 2 === 1 && 'bg-gray-50 dark:bg-gray-800/40',\n                      getRowClass(item, idx),\n                    )}\n                    onClick={onRowClick ? () => onRowClick(item, idx) : undefined}\n                  >\n                    {selectable && (\n                      <TableCell\n                        className={buildClassName(\n                          densityCellClass,\n                          striped && idx % 2 === 1 && 'bg-gray-50 dark:bg-gray-800/40',\n                        )}\n                      >\n                        <span onClick={(e) => e.stopPropagation()}>\n                          <Checkbox\n                            aria-label=\"Select row\"\n                            checked={isSelected(key)}\n                            disabled={!rowSelectable}\n                            onChange={() => toggleRow(key)}\n                          />\n                        </span>\n                      </TableCell>\n                    )}\n                    {columns.map((column) => (\n                      <TableCell\n                        key={column.name}\n                        align={column.align}\n                        className={buildClassName(\n                          densityCellClass,\n                          striped && idx % 2 === 1 && 'bg-gray-50 dark:bg-gray-800/40',\n                          column.sticky === 'left' &&\n                            'sticky left-0 z-10 shadow-[2px_0_6px_rgba(0,0,0,0.06)]',\n                          column.sticky === 'right' &&\n                            'sticky right-0 z-10 shadow-[-2px_0_6px_rgba(0,0,0,0.06)]',\n                          getCellClass(column, item),\n                        )}\n                      >\n                        {column.render\n                          ? column.render(item)\n                          : ((get(item, column.name) as any) ?? 'Not set')}\n                      </TableCell>\n                    ))}\n                    {isInlineMode && (\n                      <TableCell\n                        align=\"right\"\n                        className={buildClassName(\n                          densityCellClass,\n                          striped && idx % 2 === 1 && 'bg-gray-50 dark:bg-gray-800/40',\n                        )}\n                        onClick={(e) => e.stopPropagation()}\n                      >\n                        <div\n                          className={buildClassName(\n                            'opacity-0 group-hover:opacity-100 group-focus-within:opacity-100 transition-opacity duration-150 flex items-center justify-end gap-1.5',\n                            rowHoverActionClass,\n                          )}\n                          data-testid={`row-hover-actions-${key}`}\n                        >\n                          {renderActionsContent(item, idx)}\n                        </div>\n                      </TableCell>\n                    )}\n                    {isOverlayMode && (\n                      <TableCell\n                        align=\"right\"\n                        style={{ padding: 0, width: 0, minWidth: 0, maxWidth: 0 }}\n                        className=\"sticky right-0 z-20 !p-0 !pr-0 !pl-0 !py-0 w-0 max-w-0 min-w-0 border-0 overflow-visible text-right\"\n                        onClick={(e) => e.stopPropagation()}\n                      >\n                        <div\n                          className={buildClassName(\n                            'absolute right-0 top-0 bottom-0 h-full opacity-0 group-hover:opacity-100 group-focus-within:opacity-100 transition-opacity duration-150 flex items-center justify-end gap-1 px-3 z-30 pointer-events-none group-hover:pointer-events-auto whitespace-nowrap',\n                            striped && idx % 2 === 1\n                              ? 'bg-gray-100 dark:bg-gray-800'\n                              : 'bg-white group-hover:bg-gray-50 dark:bg-gray-900 dark:group-hover:bg-gray-800',\n                            rowHoverActionClass,\n                          )}\n                          data-testid={`row-hover-actions-${key}`}\n                        >\n                          {renderActionsContent(item, idx)}\n                        </div>\n                      </TableCell>\n                    )}\n                  </TableRow>\n                )\n              })\n            )}\n          </TableBody>\n\n          {footerRow && <TableFoot>{footerRow}</TableFoot>}\n        </Table>\n      </div>\n\n      {pagination && (\n        <div\n          className={buildClassName(\n            stickyPagination && 'sticky bottom-0 z-20',\n            paginationContainerClass,\n          )}\n        >\n          {renderPagination ? (\n            renderPagination(pagination, setPagination)\n          ) : (\n            <Pagination\n              {...pagination}\n              {...paginationProps}\n              className={buildClassName(\n                'rounded-t-none rounded-b-lg border border-[var(--ui-border)] bg-white dark:bg-gray-800',\n                paginationClass,\n                paginationProps?.className,\n              )}\n              onChange={setPagination}\n            />\n          )}\n        </div>\n      )}\n    </div>\n  )\n}\n\nDataTable.displayName = 'DataTable'\n"],"names":["get","useState","useCallback","updateSortQuery","useMemo","useRowSelection","_jsxs","Button","buildClassName","_jsx","Table","TableHead","TableHeaderCell","Checkbox","TextContent","getSortIcon","TableBody","EmptyTableRow","TableRow","TableCell","TableFoot","Pagination"],"mappings":"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"}

package/dist/cjs/components/RadioGroup/RadioGroup.js

@@ -16,6 +16,7 @@ const COLUMN_GRID_MAP = {
 const RadioGroup = (props) => {
     const { name, variant = 'default', size = 'md', theme = 'primary', label, labelClass, labelWrapperClass, labelHint, containerClass, options, value, columns, disabled = false, row, error, showErrorMessage = true, onChange, required, 'aria-describedby': ariaDescribedBy, } = props;
     const groupId = React.useId();
+    const groupName = name || groupId;
     const items = React.useMemo(() => {
         var _a;
         return (_a = options === null || options === void 0 ? void 0 : options.map((option) => typeof option === 'string'
@@ -40,13 +41,14 @@ const RadioGroup = (props) => {
                         : 'flex flex-col gap-3'), children: items.map((item) => {
                     const isSelected = value === item.value;
                     const isItemDisabled = disabled || Boolean(item.disabled);
+                    const radioItemId = `${groupName}-${item.value}`;
                     if (isCards) {
-                        return (jsxRuntime.jsxs("label", { htmlFor: `${name}-${item.value}`, className: buildClassname.buildClassName('relative flex items-start gap-3 p-4 rounded-xl border transition-all cursor-pointer select-none min-w-[200px] flex-1', isSelected
+                        return (jsxRuntime.jsxs("label", { htmlFor: radioItemId, className: buildClassname.buildClassName('relative flex items-start gap-3 p-4 rounded-xl border transition-all cursor-pointer select-none min-w-[200px] flex-1', 'focus-within:ring-2 focus-within:ring-[var(--ui-primary-ring)] focus-within:border-[var(--ui-primary)]', isSelected
                                 ? 'border-[var(--ui-primary)] bg-blue-50/40 dark:bg-blue-950/30 ring-2 ring-[var(--ui-primary-ring)]/30'
                                 : 'border-[var(--ui-border)] bg-white dark:bg-gray-800 hover:border-gray-300 dark:hover:border-gray-600', isItemDisabled &&
-                                'opacity-50 cursor-not-allowed pointer-events-none bg-gray-50 dark:bg-gray-800/50'), children: [jsxRuntime.jsx(Radio.Radio, { name: name, id: `${name}-${item.value}`, value: item.value, "aria-label": item.label, size: size, theme: theme, checked: isSelected, disabled: isItemDisabled, onChange: onChange, containerClass: "pt-0.5" }), jsxRuntime.jsxs("div", { className: "flex-1 min-w-0", children: [jsxRuntime.jsxs("div", { className: "flex items-center gap-2", children: [item.icon && (jsxRuntime.jsx("span", { className: "shrink-0 text-gray-500 dark:text-gray-400", children: item.icon })), jsxRuntime.jsx("span", { className: "text-sm font-semibold text-gray-900 dark:text-white truncate", children: item.label })] }), item.description && (jsxRuntime.jsx("p", { className: "mt-1 text-xs text-gray-500 dark:text-gray-400 font-normal leading-relaxed", children: item.description }))] })] }, item.value));
+                                'opacity-50 cursor-not-allowed pointer-events-none bg-gray-50 dark:bg-gray-800/50'), children: [jsxRuntime.jsx(Radio.Radio, { name: groupName, id: radioItemId, value: item.value, "aria-label": item.label, size: size, theme: theme, checked: isSelected, disabled: isItemDisabled, onChange: onChange, containerClass: "pt-0.5" }), jsxRuntime.jsxs("div", { className: "flex-1 min-w-0", children: [jsxRuntime.jsxs("div", { className: "flex items-center gap-2", children: [item.icon && (jsxRuntime.jsx("span", { className: "shrink-0 text-gray-500 dark:text-gray-400", children: item.icon })), jsxRuntime.jsx("span", { className: "text-sm font-semibold text-gray-900 dark:text-white truncate", children: item.label })] }), item.description && (jsxRuntime.jsx("p", { className: "mt-1 text-xs text-gray-500 dark:text-gray-400 font-normal leading-relaxed", children: item.description }))] })] }, item.value));
                     }
-                    return (jsxRuntime.jsx(Radio.Radio, { name: name, id: `${name}-${item.value}`, label: item.label, description: item.description, value: item.value, size: size, theme: theme, checked: isSelected, disabled: isItemDisabled, onChange: onChange }, item.value));
+                    return (jsxRuntime.jsx(Radio.Radio, { name: groupName, id: radioItemId, label: item.label, description: item.description, value: item.value, size: size, theme: theme, checked: isSelected, disabled: isItemDisabled, onChange: onChange }, item.value));
                 }) }), showErrorMessage && error && (jsxRuntime.jsx("div", { className: "mt-1.5", children: jsxRuntime.jsx(TextContent.TextContent, { error: true, small: true, id: errorId, children: error }) }))] }));
 };
 RadioGroup.displayName = 'RadioGroup';

package/dist/cjs/components/RadioGroup/RadioGroup.js.map

@@ -1 +1 @@
-{"version":3,"file":"RadioGroup.js","sources":["../../../../../src/components/RadioGroup/RadioGroup.tsx"],"sourcesContent":["import React, { useId, useMemo } from 'react'\nimport { Radio } from '../Radio'\nimport { Label } from '../Label'\nimport { buildClassName } from '../../utils/build-classname'\nimport { TextContent } from '../TextContent'\nimport type { RadioGroupProps } from './RadioGroup.types'\n\nconst COLUMN_GRID_MAP: Record<number, string> = {\n  1: 'grid-cols-1',\n  2: 'grid-cols-1 md:grid-cols-2',\n  3: 'grid-cols-1 md:grid-cols-3',\n  4: 'grid-cols-1 md:grid-cols-4',\n}\n\nexport const RadioGroup: React.FC<RadioGroupProps> = (props) => {\n  const {\n    name,\n    variant = 'default',\n    size = 'md',\n    theme = 'primary',\n    label,\n    labelClass,\n    labelWrapperClass,\n    labelHint,\n    containerClass,\n    options,\n    value,\n    columns,\n    disabled = false,\n    row,\n    error,\n    showErrorMessage = true,\n    onChange,\n    required,\n    'aria-describedby': ariaDescribedBy,\n  } = props\n\n  const groupId = useId()\n\n  const items = useMemo(\n    () =>\n      options?.map((option) =>\n        typeof option === 'string'\n          ? {\n              label: option,\n              value: option,\n              description: undefined,\n              icon: undefined,\n              disabled: undefined,\n            }\n          : option,\n      ) ?? [],\n    [options],\n  )\n\n  const isCards = variant === 'cards'\n  const hasError = Boolean(error)\n  const labelId = label ? `${groupId}-label` : undefined\n  const errorId = groupId && hasError && showErrorMessage ? `${groupId}-error` : undefined\n  const describedBy = [ariaDescribedBy, errorId].filter(Boolean).join(' ') || undefined\n\n  return (\n    <div\n      role=\"radiogroup\"\n      aria-labelledby={labelId}\n      aria-describedby={describedBy}\n      className={buildClassName(containerClass)}\n    >\n      {label && (\n        <div\n          className={buildClassName('flex items-center justify-between mb-3', labelWrapperClass)}\n        >\n          <Label id={labelId} className={labelClass} aria-required={required}>\n            {label}\n          </Label>\n          {labelHint}\n        </div>\n      )}\n\n      <div\n        className={buildClassName(\n          columns\n            ? buildClassName('grid gap-3', COLUMN_GRID_MAP[columns])\n            : row || isCards\n              ? 'flex flex-wrap gap-3'\n              : 'flex flex-col gap-3',\n        )}\n      >\n        {items.map((item) => {\n          const isSelected = value === item.value\n          const isItemDisabled = disabled || Boolean(item.disabled)\n\n          if (isCards) {\n            return (\n              <label\n                key={item.value}\n                htmlFor={`${name}-${item.value}`}\n                className={buildClassName(\n                  'relative flex items-start gap-3 p-4 rounded-xl border transition-all cursor-pointer select-none min-w-[200px] flex-1',\n                  isSelected\n                    ? 'border-[var(--ui-primary)] bg-blue-50/40 dark:bg-blue-950/30 ring-2 ring-[var(--ui-primary-ring)]/30'\n                    : 'border-[var(--ui-border)] bg-white dark:bg-gray-800 hover:border-gray-300 dark:hover:border-gray-600',\n                  isItemDisabled &&\n                    'opacity-50 cursor-not-allowed pointer-events-none bg-gray-50 dark:bg-gray-800/50',\n                )}\n              >\n                <Radio\n                  name={name}\n                  id={`${name}-${item.value}`}\n                  value={item.value}\n                  aria-label={item.label}\n                  size={size}\n                  theme={theme}\n                  checked={isSelected}\n                  disabled={isItemDisabled}\n                  onChange={onChange}\n                  containerClass=\"pt-0.5\"\n                />\n\n                <div className=\"flex-1 min-w-0\">\n                  <div className=\"flex items-center gap-2\">\n                    {item.icon && (\n                      <span className=\"shrink-0 text-gray-500 dark:text-gray-400\">{item.icon}</span>\n                    )}\n                    <span className=\"text-sm font-semibold text-gray-900 dark:text-white truncate\">\n                      {item.label}\n                    </span>\n                  </div>\n                  {item.description && (\n                    <p className=\"mt-1 text-xs text-gray-500 dark:text-gray-400 font-normal leading-relaxed\">\n                      {item.description}\n                    </p>\n                  )}\n                </div>\n              </label>\n            )\n          }\n\n          return (\n            <Radio\n              key={item.value}\n              name={name}\n              id={`${name}-${item.value}`}\n              label={item.label}\n              description={item.description}\n              value={item.value}\n              size={size}\n              theme={theme}\n              checked={isSelected}\n              disabled={isItemDisabled}\n              onChange={onChange}\n            />\n          )\n        })}\n      </div>\n\n      {showErrorMessage && error && (\n        <div className=\"mt-1.5\">\n          <TextContent error small id={errorId}>\n            {error}\n          </TextContent>\n        </div>\n      )}\n    </div>\n  )\n}\n\nRadioGroup.displayName = 'RadioGroup'\n"],"names":["useId","useMemo","_jsxs","buildClassName","_jsx","Label","Radio","TextContent"],"mappings":"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"}
+{"version":3,"file":"RadioGroup.js","sources":["../../../../../src/components/RadioGroup/RadioGroup.tsx"],"sourcesContent":["import React, { useId, useMemo } from 'react'\nimport { Radio } from '../Radio'\nimport { Label } from '../Label'\nimport { buildClassName } from '../../utils/build-classname'\nimport { TextContent } from '../TextContent'\nimport type { RadioGroupProps } from './RadioGroup.types'\n\nconst COLUMN_GRID_MAP: Record<number, string> = {\n  1: 'grid-cols-1',\n  2: 'grid-cols-1 md:grid-cols-2',\n  3: 'grid-cols-1 md:grid-cols-3',\n  4: 'grid-cols-1 md:grid-cols-4',\n}\n\nexport const RadioGroup: React.FC<RadioGroupProps> = (props) => {\n  const {\n    name,\n    variant = 'default',\n    size = 'md',\n    theme = 'primary',\n    label,\n    labelClass,\n    labelWrapperClass,\n    labelHint,\n    containerClass,\n    options,\n    value,\n    columns,\n    disabled = false,\n    row,\n    error,\n    showErrorMessage = true,\n    onChange,\n    required,\n    'aria-describedby': ariaDescribedBy,\n  } = props\n\n  const groupId = useId()\n  const groupName = name || groupId\n\n  const items = useMemo(\n    () =>\n      options?.map((option) =>\n        typeof option === 'string'\n          ? {\n              label: option,\n              value: option,\n              description: undefined,\n              icon: undefined,\n              disabled: undefined,\n            }\n          : option,\n      ) ?? [],\n    [options],\n  )\n\n  const isCards = variant === 'cards'\n  const hasError = Boolean(error)\n  const labelId = label ? `${groupId}-label` : undefined\n  const errorId = groupId && hasError && showErrorMessage ? `${groupId}-error` : undefined\n  const describedBy = [ariaDescribedBy, errorId].filter(Boolean).join(' ') || undefined\n\n  return (\n    <div\n      role=\"radiogroup\"\n      aria-labelledby={labelId}\n      aria-describedby={describedBy}\n      className={buildClassName(containerClass)}\n    >\n      {label && (\n        <div\n          className={buildClassName('flex items-center justify-between mb-3', labelWrapperClass)}\n        >\n          <Label id={labelId} className={labelClass} aria-required={required}>\n            {label}\n          </Label>\n          {labelHint}\n        </div>\n      )}\n\n      <div\n        className={buildClassName(\n          columns\n            ? buildClassName('grid gap-3', COLUMN_GRID_MAP[columns])\n            : row || isCards\n              ? 'flex flex-wrap gap-3'\n              : 'flex flex-col gap-3',\n        )}\n      >\n        {items.map((item) => {\n          const isSelected = value === item.value\n          const isItemDisabled = disabled || Boolean(item.disabled)\n          const radioItemId = `${groupName}-${item.value}`\n\n          if (isCards) {\n            return (\n              <label\n                key={item.value}\n                htmlFor={radioItemId}\n                className={buildClassName(\n                  'relative flex items-start gap-3 p-4 rounded-xl border transition-all cursor-pointer select-none min-w-[200px] flex-1',\n                  'focus-within:ring-2 focus-within:ring-[var(--ui-primary-ring)] focus-within:border-[var(--ui-primary)]',\n                  isSelected\n                    ? 'border-[var(--ui-primary)] bg-blue-50/40 dark:bg-blue-950/30 ring-2 ring-[var(--ui-primary-ring)]/30'\n                    : 'border-[var(--ui-border)] bg-white dark:bg-gray-800 hover:border-gray-300 dark:hover:border-gray-600',\n                  isItemDisabled &&\n                    'opacity-50 cursor-not-allowed pointer-events-none bg-gray-50 dark:bg-gray-800/50',\n                )}\n              >\n                <Radio\n                  name={groupName}\n                  id={radioItemId}\n                  value={item.value}\n                  aria-label={item.label}\n                  size={size}\n                  theme={theme}\n                  checked={isSelected}\n                  disabled={isItemDisabled}\n                  onChange={onChange}\n                  containerClass=\"pt-0.5\"\n                />\n\n                <div className=\"flex-1 min-w-0\">\n                  <div className=\"flex items-center gap-2\">\n                    {item.icon && (\n                      <span className=\"shrink-0 text-gray-500 dark:text-gray-400\">{item.icon}</span>\n                    )}\n                    <span className=\"text-sm font-semibold text-gray-900 dark:text-white truncate\">\n                      {item.label}\n                    </span>\n                  </div>\n                  {item.description && (\n                    <p className=\"mt-1 text-xs text-gray-500 dark:text-gray-400 font-normal leading-relaxed\">\n                      {item.description}\n                    </p>\n                  )}\n                </div>\n              </label>\n            )\n          }\n\n          return (\n            <Radio\n              key={item.value}\n              name={groupName}\n              id={radioItemId}\n              label={item.label}\n              description={item.description}\n              value={item.value}\n              size={size}\n              theme={theme}\n              checked={isSelected}\n              disabled={isItemDisabled}\n              onChange={onChange}\n            />\n          )\n        })}\n      </div>\n\n      {showErrorMessage && error && (\n        <div className=\"mt-1.5\">\n          <TextContent error small id={errorId}>\n            {error}\n          </TextContent>\n        </div>\n      )}\n    </div>\n  )\n}\n\nRadioGroup.displayName = 'RadioGroup'\n"],"names":["useId","useMemo","_jsxs","buildClassName","_jsx","Label","Radio","TextContent"],"mappings":"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"}