@brycks/core-front 0.2.7 → 0.2.9

package/dist/components/utility/Loader/Loader.js

@@ -0,0 +1,142 @@
+import { jsxs as c, jsx as t } from "react/jsx-runtime";
+import { forwardRef as k, memo as d } from "react";
+import { cx as b } from "../../../utils/styles.js";
+const L = {
+  xs: 14,
+  sm: 18,
+  md: 24,
+  lg: 32,
+  xl: 48
+}, g = d(function({ size: e, color: r }) {
+  return /* @__PURE__ */ c(
+    "svg",
+    {
+      width: e,
+      height: e,
+      viewBox: "0 0 24 24",
+      fill: "none",
+      className: "brycks-animate-spin",
+      "aria-hidden": "true",
+      children: [
+        /* @__PURE__ */ t(
+          "circle",
+          {
+            cx: "12",
+            cy: "12",
+            r: "10",
+            stroke: r,
+            strokeWidth: "2.5",
+            strokeLinecap: "round",
+            opacity: "0.2"
+          }
+        ),
+        /* @__PURE__ */ t(
+          "path",
+          {
+            d: "M12 2C6.47715 2 2 6.47715 2 12",
+            stroke: r,
+            strokeWidth: "2.5",
+            strokeLinecap: "round"
+          }
+        )
+      ]
+    }
+  );
+}), x = d(function({ size: e, color: r }) {
+  const n = e / 4, s = e / 6;
+  return /* @__PURE__ */ t(
+    "div",
+    {
+      style: {
+        display: "flex",
+        alignItems: "center",
+        gap: s,
+        height: e
+      },
+      "aria-hidden": "true",
+      children: [0, 1, 2].map((a) => /* @__PURE__ */ t(
+        "span",
+        {
+          style: {
+            width: n,
+            height: n,
+            borderRadius: "50%",
+            backgroundColor: r,
+            animation: "brycks-bounce-scale 1.4s ease-in-out infinite",
+            animationDelay: `${a * 0.16}s`
+          }
+        },
+        a
+      ))
+    }
+  );
+}), w = d(function({ size: e, color: r }) {
+  return /* @__PURE__ */ t(
+    "span",
+    {
+      style: {
+        display: "block",
+        width: e,
+        height: e,
+        borderRadius: "50%",
+        backgroundColor: r,
+        animation: "brycks-pulse-scale 1.5s ease-in-out infinite"
+      },
+      "aria-hidden": "true"
+    }
+  );
+}), l = k(function({
+  size: e = "md",
+  variant: r = "spinner",
+  color: n = "var(--brycks-primary-default)",
+  label: s = "Loading",
+  className: a,
+  style: u,
+  testId: p,
+  ...m
+}, y) {
+  const o = L[e], h = {
+    display: "inline-flex",
+    alignItems: "center",
+    justifyContent: "center",
+    ...u
+  }, f = () => {
+    switch (r) {
+      case "dots":
+        return /* @__PURE__ */ t(x, { size: o, color: n });
+      case "pulse":
+        return /* @__PURE__ */ t(w, { size: o, color: n });
+      default:
+        return /* @__PURE__ */ t(g, { size: o, color: n });
+    }
+  };
+  return /* @__PURE__ */ c(
+    "div",
+    {
+      ref: y,
+      role: "status",
+      "aria-label": s,
+      "aria-live": "polite",
+      className: b(
+        "brycks-loader",
+        `brycks-loader--${r}`,
+        `brycks-loader--${e}`,
+        a
+      ),
+      style: h,
+      "data-testid": p,
+      ...m,
+      children: [
+        f(),
+        /* @__PURE__ */ t("span", { className: "brycks-sr-only", children: s })
+      ]
+    }
+  );
+});
+l.displayName = "Loader";
+const N = l;
+export {
+  l as Loader,
+  N as Spinner
+};
+//# sourceMappingURL=Loader.js.map

package/dist/components/utility/Loader/Loader.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Loader.js","sources":["../../../../src/components/utility/Loader/Loader.tsx"],"sourcesContent":["/**\r\n * Loader Component\r\n *\r\n * Elegant loading spinner with smooth animation.\r\n * Apple-inspired design with multiple sizes and variants.\r\n * Uses global CSS animations for reduced bundle size.\r\n */\r\n\r\nimport {\r\n  forwardRef,\r\n  memo,\r\n  type CSSProperties,\r\n  type HTMLAttributes,\r\n} from 'react'\r\nimport { cx } from '../../../utils/styles'\r\n\r\nexport type LoaderSize = 'xs' | 'sm' | 'md' | 'lg' | 'xl'\r\nexport type LoaderVariant = 'spinner' | 'dots' | 'pulse'\r\n\r\nexport interface LoaderProps extends HTMLAttributes<HTMLDivElement> {\r\n  /** Loader size */\r\n  size?: LoaderSize\r\n  /** Loader variant */\r\n  variant?: LoaderVariant\r\n  /** Color (CSS value) */\r\n  color?: string\r\n  /** Accessible label */\r\n  label?: string\r\n  /** Custom class name */\r\n  className?: string\r\n  /** Test ID */\r\n  testId?: string\r\n}\r\n\r\nconst sizeMap: Record<LoaderSize, number> = {\r\n  xs: 14,\r\n  sm: 18,\r\n  md: 24,\r\n  lg: 32,\r\n  xl: 48,\r\n}\r\n\r\n/** Spinner loader - uses global CSS animation */\r\nconst SpinnerLoader = memo(function SpinnerLoader({ size, color }: { size: number; color: string }) {\r\n  return (\r\n    <svg\r\n      width={size}\r\n      height={size}\r\n      viewBox=\"0 0 24 24\"\r\n      fill=\"none\"\r\n      className=\"brycks-animate-spin\"\r\n      aria-hidden=\"true\"\r\n    >\r\n      <circle\r\n        cx=\"12\"\r\n        cy=\"12\"\r\n        r=\"10\"\r\n        stroke={color}\r\n        strokeWidth=\"2.5\"\r\n        strokeLinecap=\"round\"\r\n        opacity=\"0.2\"\r\n      />\r\n      <path\r\n        d=\"M12 2C6.47715 2 2 6.47715 2 12\"\r\n        stroke={color}\r\n        strokeWidth=\"2.5\"\r\n        strokeLinecap=\"round\"\r\n      />\r\n    </svg>\r\n  )\r\n})\r\n\r\n/** Dots loader - uses global CSS animation */\r\nconst DotsLoader = memo(function DotsLoader({ size, color }: { size: number; color: string }) {\r\n  const dotSize = size / 4\r\n  const gap = size / 6\r\n\r\n  return (\r\n    <div\r\n      style={{\r\n        display: 'flex',\r\n        alignItems: 'center',\r\n        gap,\r\n        height: size,\r\n      }}\r\n      aria-hidden=\"true\"\r\n    >\r\n      {[0, 1, 2].map((i) => (\r\n        <span\r\n          key={i}\r\n          style={{\r\n            width: dotSize,\r\n            height: dotSize,\r\n            borderRadius: '50%',\r\n            backgroundColor: color,\r\n            animation: 'brycks-bounce-scale 1.4s ease-in-out infinite',\r\n            animationDelay: `${i * 0.16}s`,\r\n          }}\r\n        />\r\n      ))}\r\n    </div>\r\n  )\r\n})\r\n\r\n/** Pulse loader - uses global CSS animation */\r\nconst PulseLoader = memo(function PulseLoader({ size, color }: { size: number; color: string }) {\r\n  return (\r\n    <span\r\n      style={{\r\n        display: 'block',\r\n        width: size,\r\n        height: size,\r\n        borderRadius: '50%',\r\n        backgroundColor: color,\r\n        animation: 'brycks-pulse-scale 1.5s ease-in-out infinite',\r\n      }}\r\n      aria-hidden=\"true\"\r\n    />\r\n  )\r\n})\r\n\r\nexport const Loader = forwardRef<HTMLDivElement, LoaderProps>(function Loader(\r\n  {\r\n    size = 'md',\r\n    variant = 'spinner',\r\n    color = 'var(--brycks-primary-default)',\r\n    label = 'Loading',\r\n    className,\r\n    style,\r\n    testId,\r\n    ...props\r\n  },\r\n  ref\r\n) {\r\n  const sizeValue = sizeMap[size]\r\n\r\n  const wrapperStyle: CSSProperties = {\r\n    display: 'inline-flex',\r\n    alignItems: 'center',\r\n    justifyContent: 'center',\r\n    ...style,\r\n  }\r\n\r\n  const renderLoader = () => {\r\n    switch (variant) {\r\n      case 'dots':\r\n        return <DotsLoader size={sizeValue} color={color} />\r\n      case 'pulse':\r\n        return <PulseLoader size={sizeValue} color={color} />\r\n      default:\r\n        return <SpinnerLoader size={sizeValue} color={color} />\r\n    }\r\n  }\r\n\r\n  return (\r\n    <div\r\n      ref={ref}\r\n      role=\"status\"\r\n      aria-label={label}\r\n      aria-live=\"polite\"\r\n      className={cx(\r\n        'brycks-loader',\r\n        `brycks-loader--${variant}`,\r\n        `brycks-loader--${size}`,\r\n        className\r\n      )}\r\n      style={wrapperStyle}\r\n      data-testid={testId}\r\n      {...props}\r\n    >\r\n      {renderLoader()}\r\n      {/* Visually hidden text for screen readers */}\r\n      <span className=\"brycks-sr-only\">{label}</span>\r\n    </div>\r\n  )\r\n})\r\n\r\nLoader.displayName = 'Loader'\r\n\r\n/** Alias for Loader */\r\nexport const Spinner = Loader\r\n"],"names":["sizeMap","SpinnerLoader","memo","size","color","jsxs","jsx","DotsLoader","dotSize","gap","i","PulseLoader","Loader","forwardRef","variant","label","className","style","testId","props","ref","sizeValue","wrapperStyle","renderLoader","cx","Spinner"],"mappings":";;;AAkCA,MAAMA,IAAsC;AAAA,EAC1C,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AACN,GAGMC,IAAgBC,EAAK,SAAuB,EAAE,MAAAC,GAAM,OAAAC,KAA0C;AAClG,SACE,gBAAAC;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,OAAOF;AAAA,MACP,QAAQA;AAAA,MACR,SAAQ;AAAA,MACR,MAAK;AAAA,MACL,WAAU;AAAA,MACV,eAAY;AAAA,MAEZ,UAAA;AAAA,QAAA,gBAAAG;AAAA,UAAC;AAAA,UAAA;AAAA,YACC,IAAG;AAAA,YACH,IAAG;AAAA,YACH,GAAE;AAAA,YACF,QAAQF;AAAA,YACR,aAAY;AAAA,YACZ,eAAc;AAAA,YACd,SAAQ;AAAA,UAAA;AAAA,QAAA;AAAA,QAEV,gBAAAE;AAAA,UAAC;AAAA,UAAA;AAAA,YACC,GAAE;AAAA,YACF,QAAQF;AAAA,YACR,aAAY;AAAA,YACZ,eAAc;AAAA,UAAA;AAAA,QAAA;AAAA,MAChB;AAAA,IAAA;AAAA,EAAA;AAGN,CAAC,GAGKG,IAAaL,EAAK,SAAoB,EAAE,MAAAC,GAAM,OAAAC,KAA0C;AAC5F,QAAMI,IAAUL,IAAO,GACjBM,IAAMN,IAAO;AAEnB,SACE,gBAAAG;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,OAAO;AAAA,QACL,SAAS;AAAA,QACT,YAAY;AAAA,QACZ,KAAAG;AAAA,QACA,QAAQN;AAAA,MAAA;AAAA,MAEV,eAAY;AAAA,MAEX,WAAC,GAAG,GAAG,CAAC,EAAE,IAAI,CAACO,MACd,gBAAAJ;AAAA,QAAC;AAAA,QAAA;AAAA,UAEC,OAAO;AAAA,YACL,OAAOE;AAAA,YACP,QAAQA;AAAA,YACR,cAAc;AAAA,YACd,iBAAiBJ;AAAA,YACjB,WAAW;AAAA,YACX,gBAAgB,GAAGM,IAAI,IAAI;AAAA,UAAA;AAAA,QAC7B;AAAA,QARKA;AAAA,MAAA,CAUR;AAAA,IAAA;AAAA,EAAA;AAGP,CAAC,GAGKC,IAAcT,EAAK,SAAqB,EAAE,MAAAC,GAAM,OAAAC,KAA0C;AAC9F,SACE,gBAAAE;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,OAAO;AAAA,QACL,SAAS;AAAA,QACT,OAAOH;AAAA,QACP,QAAQA;AAAA,QACR,cAAc;AAAA,QACd,iBAAiBC;AAAA,QACjB,WAAW;AAAA,MAAA;AAAA,MAEb,eAAY;AAAA,IAAA;AAAA,EAAA;AAGlB,CAAC,GAEYQ,IAASC,EAAwC,SAC5D;AAAA,EACE,MAAAV,IAAO;AAAA,EACP,SAAAW,IAAU;AAAA,EACV,OAAAV,IAAQ;AAAA,EACR,OAAAW,IAAQ;AAAA,EACR,WAAAC;AAAA,EACA,OAAAC;AAAA,EACA,QAAAC;AAAA,EACA,GAAGC;AACL,GACAC,GACA;AACA,QAAMC,IAAYrB,EAAQG,CAAI,GAExBmB,IAA8B;AAAA,IAClC,SAAS;AAAA,IACT,YAAY;AAAA,IACZ,gBAAgB;AAAA,IAChB,GAAGL;AAAA,EAAA,GAGCM,IAAe,MAAM;AACzB,YAAQT,GAAA;AAAA,MACN,KAAK;AACH,eAAO,gBAAAR,EAACC,GAAA,EAAW,MAAMc,GAAW,OAAAjB,EAAA,CAAc;AAAA,MACpD,KAAK;AACH,eAAO,gBAAAE,EAACK,GAAA,EAAY,MAAMU,GAAW,OAAAjB,EAAA,CAAc;AAAA,MACrD;AACE,eAAO,gBAAAE,EAACL,GAAA,EAAc,MAAMoB,GAAW,OAAAjB,EAAA,CAAc;AAAA,IAAA;AAAA,EAE3D;AAEA,SACE,gBAAAC;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,KAAAe;AAAA,MACA,MAAK;AAAA,MACL,cAAYL;AAAA,MACZ,aAAU;AAAA,MACV,WAAWS;AAAA,QACT;AAAA,QACA,kBAAkBV,CAAO;AAAA,QACzB,kBAAkBX,CAAI;AAAA,QACtBa;AAAA,MAAA;AAAA,MAEF,OAAOM;AAAA,MACP,eAAaJ;AAAA,MACZ,GAAGC;AAAA,MAEH,UAAA;AAAA,QAAAI,EAAA;AAAA,QAED,gBAAAjB,EAAC,QAAA,EAAK,WAAU,kBAAkB,UAAAS,EAAA,CAAM;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAG9C,CAAC;AAEDH,EAAO,cAAc;AAGd,MAAMa,IAAUb;"}

package/dist/components/utility/Logo/Logo.cjs

@@ -0,0 +1,2 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const m=require("react/jsx-runtime"),u=require("react"),y=require("../../../utils/styles.cjs"),f={sm:32,md:40,lg:56,xl:64},p={sm:14,md:18,lg:24,xl:28},x={sm:8,md:10,lg:14,xl:16},o=u.forwardRef(function({size:t="md",children:r,className:s,testId:i,style:n,...a},d){const e=f[t],c=p[t],l=x[t],g={width:e,height:e,minWidth:e,borderRadius:l,background:"linear-gradient(135deg, var(--brycks-primary-default) 0%, var(--brycks-primary-600) 100%)",display:"flex",alignItems:"center",justifyContent:"center",color:"white",fontWeight:700,fontSize:c,boxShadow:"0 2px 8px rgba(59, 92, 233, 0.3)",...n};return m.jsx("div",{ref:d,className:y.cx("brycks-logo",s),style:g,"data-testid":i,"aria-hidden":"true",...a,children:r})});o.displayName="Logo";exports.Logo=o;
+//# sourceMappingURL=Logo.cjs.map

package/dist/components/utility/Logo/Logo.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"Logo.cjs","sources":["../../../../src/components/utility/Logo/Logo.tsx"],"sourcesContent":["import { forwardRef, type CSSProperties, type ReactNode, type HTMLAttributes } from 'react'\nimport { cx } from '../../../utils/styles'\n\nexport type LogoSize = 'sm' | 'md' | 'lg' | 'xl'\n\nconst sizeMap: Record<LogoSize, number> = {\n  sm: 32,\n  md: 40,\n  lg: 56,\n  xl: 64,\n}\n\nconst fontSizeMap: Record<LogoSize, number> = {\n  sm: 14,\n  md: 18,\n  lg: 24,\n  xl: 28,\n}\n\nconst radiusMap: Record<LogoSize, number> = {\n  sm: 8,\n  md: 10,\n  lg: 14,\n  xl: 16,\n}\n\nexport interface LogoProps extends HTMLAttributes<HTMLDivElement> {\n  /** Size of the logo */\n  size?: LogoSize\n  /** Content to display (usually a letter or icon) */\n  children?: ReactNode\n  /** Custom class name */\n  className?: string\n  /** Test ID */\n  testId?: string\n}\n\nexport const Logo = forwardRef<HTMLDivElement, LogoProps>(\n  function Logo(\n    {\n      size = 'md',\n      children,\n      className,\n      testId,\n      style,\n      ...props\n    },\n    ref\n  ) {\n    const dimension = sizeMap[size]\n    const fontSize = fontSizeMap[size]\n    const radius = radiusMap[size]\n\n    const logoStyle: CSSProperties = {\n      width: dimension,\n      height: dimension,\n      minWidth: dimension,\n      borderRadius: radius,\n      background: 'linear-gradient(135deg, var(--brycks-primary-default) 0%, var(--brycks-primary-600) 100%)',\n      display: 'flex',\n      alignItems: 'center',\n      justifyContent: 'center',\n      color: 'white',\n      fontWeight: 700,\n      fontSize,\n      boxShadow: '0 2px 8px rgba(59, 92, 233, 0.3)',\n      ...style,\n    }\n\n    return (\n      <div\n        ref={ref}\n        className={cx('brycks-logo', className)}\n        style={logoStyle}\n        data-testid={testId}\n        aria-hidden=\"true\"\n        {...props}\n      >\n        {children}\n      </div>\n    )\n  }\n)\n\nLogo.displayName = 'Logo'\n"],"names":["sizeMap","fontSizeMap","radiusMap","Logo","forwardRef","size","children","className","testId","style","props","ref","dimension","fontSize","radius","logoStyle","jsx","cx"],"mappings":"+KAKMA,EAAoC,CACxC,GAAI,GACJ,GAAI,GACJ,GAAI,GACJ,GAAI,EACN,EAEMC,EAAwC,CAC5C,GAAI,GACJ,GAAI,GACJ,GAAI,GACJ,GAAI,EACN,EAEMC,EAAsC,CAC1C,GAAI,EACJ,GAAI,GACJ,GAAI,GACJ,GAAI,EACN,EAaaC,EAAOC,EAAAA,WAClB,SACE,CACE,KAAAC,EAAO,KACP,SAAAC,EACA,UAAAC,EACA,OAAAC,EACA,MAAAC,EACA,GAAGC,CAAA,EAELC,EACA,CACA,MAAMC,EAAYZ,EAAQK,CAAI,EACxBQ,EAAWZ,EAAYI,CAAI,EAC3BS,EAASZ,EAAUG,CAAI,EAEvBU,EAA2B,CAC/B,MAAOH,EACP,OAAQA,EACR,SAAUA,EACV,aAAcE,EACd,WAAY,4FACZ,QAAS,OACT,WAAY,SACZ,eAAgB,SAChB,MAAO,QACP,WAAY,IACZ,SAAAD,EACA,UAAW,mCACX,GAAGJ,CAAA,EAGL,OACEO,EAAAA,IAAC,MAAA,CACC,IAAAL,EACA,UAAWM,EAAAA,GAAG,cAAeV,CAAS,EACtC,MAAOQ,EACP,cAAaP,EACb,cAAY,OACX,GAAGE,EAEH,SAAAJ,CAAA,CAAA,CAGP,CACF,EAEAH,EAAK,YAAc"}

package/dist/components/utility/Logo/Logo.js

@@ -0,0 +1,61 @@
+import { jsx as l } from "react/jsx-runtime";
+import { forwardRef as g } from "react";
+import { cx as p } from "../../../utils/styles.js";
+const f = {
+  sm: 32,
+  md: 40,
+  lg: 56,
+  xl: 64
+}, x = {
+  sm: 14,
+  md: 18,
+  lg: 24,
+  xl: 28
+}, y = {
+  sm: 8,
+  md: 10,
+  lg: 14,
+  xl: 16
+}, u = g(
+  function({
+    size: o = "md",
+    children: r,
+    className: i,
+    testId: a,
+    style: e,
+    ...n
+  }, s) {
+    const t = f[o], d = x[o], m = y[o], c = {
+      width: t,
+      height: t,
+      minWidth: t,
+      borderRadius: m,
+      background: "linear-gradient(135deg, var(--brycks-primary-default) 0%, var(--brycks-primary-600) 100%)",
+      display: "flex",
+      alignItems: "center",
+      justifyContent: "center",
+      color: "white",
+      fontWeight: 700,
+      fontSize: d,
+      boxShadow: "0 2px 8px rgba(59, 92, 233, 0.3)",
+      ...e
+    };
+    return /* @__PURE__ */ l(
+      "div",
+      {
+        ref: s,
+        className: p("brycks-logo", i),
+        style: c,
+        "data-testid": a,
+        "aria-hidden": "true",
+        ...n,
+        children: r
+      }
+    );
+  }
+);
+u.displayName = "Logo";
+export {
+  u as Logo
+};
+//# sourceMappingURL=Logo.js.map

package/dist/components/utility/Logo/Logo.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Logo.js","sources":["../../../../src/components/utility/Logo/Logo.tsx"],"sourcesContent":["import { forwardRef, type CSSProperties, type ReactNode, type HTMLAttributes } from 'react'\nimport { cx } from '../../../utils/styles'\n\nexport type LogoSize = 'sm' | 'md' | 'lg' | 'xl'\n\nconst sizeMap: Record<LogoSize, number> = {\n  sm: 32,\n  md: 40,\n  lg: 56,\n  xl: 64,\n}\n\nconst fontSizeMap: Record<LogoSize, number> = {\n  sm: 14,\n  md: 18,\n  lg: 24,\n  xl: 28,\n}\n\nconst radiusMap: Record<LogoSize, number> = {\n  sm: 8,\n  md: 10,\n  lg: 14,\n  xl: 16,\n}\n\nexport interface LogoProps extends HTMLAttributes<HTMLDivElement> {\n  /** Size of the logo */\n  size?: LogoSize\n  /** Content to display (usually a letter or icon) */\n  children?: ReactNode\n  /** Custom class name */\n  className?: string\n  /** Test ID */\n  testId?: string\n}\n\nexport const Logo = forwardRef<HTMLDivElement, LogoProps>(\n  function Logo(\n    {\n      size = 'md',\n      children,\n      className,\n      testId,\n      style,\n      ...props\n    },\n    ref\n  ) {\n    const dimension = sizeMap[size]\n    const fontSize = fontSizeMap[size]\n    const radius = radiusMap[size]\n\n    const logoStyle: CSSProperties = {\n      width: dimension,\n      height: dimension,\n      minWidth: dimension,\n      borderRadius: radius,\n      background: 'linear-gradient(135deg, var(--brycks-primary-default) 0%, var(--brycks-primary-600) 100%)',\n      display: 'flex',\n      alignItems: 'center',\n      justifyContent: 'center',\n      color: 'white',\n      fontWeight: 700,\n      fontSize,\n      boxShadow: '0 2px 8px rgba(59, 92, 233, 0.3)',\n      ...style,\n    }\n\n    return (\n      <div\n        ref={ref}\n        className={cx('brycks-logo', className)}\n        style={logoStyle}\n        data-testid={testId}\n        aria-hidden=\"true\"\n        {...props}\n      >\n        {children}\n      </div>\n    )\n  }\n)\n\nLogo.displayName = 'Logo'\n"],"names":["sizeMap","fontSizeMap","radiusMap","Logo","forwardRef","size","children","className","testId","style","props","ref","dimension","fontSize","radius","logoStyle","jsx","cx"],"mappings":";;;AAKA,MAAMA,IAAoC;AAAA,EACxC,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AACN,GAEMC,IAAwC;AAAA,EAC5C,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AACN,GAEMC,IAAsC;AAAA,EAC1C,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AACN,GAaaC,IAAOC;AAAA,EAClB,SACE;AAAA,IACE,MAAAC,IAAO;AAAA,IACP,UAAAC;AAAA,IACA,WAAAC;AAAA,IACA,QAAAC;AAAA,IACA,OAAAC;AAAA,IACA,GAAGC;AAAA,EAAA,GAELC,GACA;AACA,UAAMC,IAAYZ,EAAQK,CAAI,GACxBQ,IAAWZ,EAAYI,CAAI,GAC3BS,IAASZ,EAAUG,CAAI,GAEvBU,IAA2B;AAAA,MAC/B,OAAOH;AAAA,MACP,QAAQA;AAAA,MACR,UAAUA;AAAA,MACV,cAAcE;AAAA,MACd,YAAY;AAAA,MACZ,SAAS;AAAA,MACT,YAAY;AAAA,MACZ,gBAAgB;AAAA,MAChB,OAAO;AAAA,MACP,YAAY;AAAA,MACZ,UAAAD;AAAA,MACA,WAAW;AAAA,MACX,GAAGJ;AAAA,IAAA;AAGL,WACE,gBAAAO;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,KAAAL;AAAA,QACA,WAAWM,EAAG,eAAeV,CAAS;AAAA,QACtC,OAAOQ;AAAA,QACP,eAAaP;AAAA,QACb,eAAY;AAAA,QACX,GAAGE;AAAA,QAEH,UAAAJ;AAAA,MAAA;AAAA,IAAA;AAAA,EAGP;AACF;AAEAH,EAAK,cAAc;"}

package/dist/components/utility/Overlay/Overlay.cjs

@@ -0,0 +1,7 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),g=require("react"),j=require("../../../utils/styles.cjs"),h=require("../Portal/Portal.cjs"),o=g.forwardRef(function({isOpen:n,onClose:s,closeOnClick:l=!0,blur:r=!0,blurAmount:t=4,opacity:c=.5,usePortal:y=!0,zIndex:d,className:u,style:v,testId:f,children:k,...b},x){if(!n)return null;const p=i=>{l&&i.target===i.currentTarget&&s?.()},m={position:"fixed",inset:0,zIndex:d??"var(--brycks-z-overlay)",backgroundColor:`rgba(0, 0, 0, ${c})`,backdropFilter:r?`blur(${t}px)`:void 0,WebkitBackdropFilter:r?`blur(${t}px)`:void 0,animation:"brycks-overlay-fade-in 200ms ease-out",...v},a=e.jsxs(e.Fragment,{children:[e.jsx("style",{children:`
+          @keyframes brycks-overlay-fade-in {
+            from { opacity: 0; }
+            to { opacity: 1; }
+          }
+        `}),e.jsx("div",{ref:x,className:j.cx("brycks-overlay",u),style:m,onClick:p,"aria-hidden":"true","data-testid":f,...b,children:k})]});return y?e.jsx(h.Portal,{children:a}):a});o.displayName="Overlay";exports.Overlay=o;
+//# sourceMappingURL=Overlay.cjs.map

package/dist/components/utility/Overlay/Overlay.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"Overlay.cjs","sources":["../../../../src/components/utility/Overlay/Overlay.tsx"],"sourcesContent":["/**\n * Overlay Component\n *\n * A backdrop overlay for modals, drawers, and dialogs.\n * Supports click-to-close and backdrop blur.\n */\n\nimport { forwardRef, type CSSProperties, type HTMLAttributes } from 'react'\nimport { cx } from '../../../utils/styles'\nimport { Portal } from '../Portal'\n\nexport interface OverlayProps extends HTMLAttributes<HTMLDivElement> {\n  /** Whether the overlay is visible */\n  isOpen: boolean\n  /** Callback when overlay is clicked */\n  onClose?: () => void\n  /** Whether clicking the overlay closes it */\n  closeOnClick?: boolean\n  /** Whether to apply backdrop blur */\n  blur?: boolean\n  /** Blur intensity (in pixels) */\n  blurAmount?: number\n  /** Background opacity (0-1) */\n  opacity?: number\n  /** Whether to use a portal */\n  usePortal?: boolean\n  /** Z-index for the overlay */\n  zIndex?: number\n  /** Custom class name */\n  className?: string\n  /** Test ID */\n  testId?: string\n}\n\nexport const Overlay = forwardRef<HTMLDivElement, OverlayProps>(function Overlay(\n  {\n    isOpen,\n    onClose,\n    closeOnClick = true,\n    blur = true,\n    blurAmount = 4,\n    opacity = 0.5,\n    usePortal = true,\n    zIndex,\n    className,\n    style,\n    testId,\n    children,\n    ...props\n  },\n  ref\n) {\n  if (!isOpen) return null\n\n  const handleClick = (e: React.MouseEvent) => {\n    if (closeOnClick && e.target === e.currentTarget) {\n      onClose?.()\n    }\n  }\n\n  const overlayStyle: CSSProperties = {\n    position: 'fixed',\n    inset: 0,\n    zIndex: zIndex ?? 'var(--brycks-z-overlay)' as unknown as number,\n    backgroundColor: `rgba(0, 0, 0, ${opacity})`,\n    backdropFilter: blur ? `blur(${blurAmount}px)` : undefined,\n    WebkitBackdropFilter: blur ? `blur(${blurAmount}px)` : undefined,\n    animation: 'brycks-overlay-fade-in 200ms ease-out',\n    ...style,\n  }\n\n  const content = (\n    <>\n      <style>\n        {`\n          @keyframes brycks-overlay-fade-in {\n            from { opacity: 0; }\n            to { opacity: 1; }\n          }\n        `}\n      </style>\n      <div\n        ref={ref}\n        className={cx('brycks-overlay', className)}\n        style={overlayStyle}\n        onClick={handleClick}\n        aria-hidden=\"true\"\n        data-testid={testId}\n        {...props}\n      >\n        {children}\n      </div>\n    </>\n  )\n\n  if (usePortal) {\n    return <Portal>{content}</Portal>\n  }\n\n  return content\n})\n\nOverlay.displayName = 'Overlay'\n"],"names":["Overlay","forwardRef","isOpen","onClose","closeOnClick","blur","blurAmount","opacity","usePortal","zIndex","className","style","testId","children","props","ref","handleClick","e","overlayStyle","content","jsxs","Fragment","jsx","cx","Portal"],"mappings":"iNAkCaA,EAAUC,EAAAA,WAAyC,SAC9D,CACE,OAAAC,EACA,QAAAC,EACA,aAAAC,EAAe,GACf,KAAAC,EAAO,GACP,WAAAC,EAAa,EACb,QAAAC,EAAU,GACV,UAAAC,EAAY,GACZ,OAAAC,EACA,UAAAC,EACA,MAAAC,EACA,OAAAC,EACA,SAAAC,EACA,GAAGC,CACL,EACAC,EACA,CACA,GAAI,CAACb,EAAQ,OAAO,KAEpB,MAAMc,EAAeC,GAAwB,CACvCb,GAAgBa,EAAE,SAAWA,EAAE,eACjCd,IAAA,CAEJ,EAEMe,EAA8B,CAClC,SAAU,QACV,MAAO,EACP,OAAQT,GAAU,0BAClB,gBAAiB,iBAAiBF,CAAO,IACzC,eAAgBF,EAAO,QAAQC,CAAU,MAAQ,OACjD,qBAAsBD,EAAO,QAAQC,CAAU,MAAQ,OACvD,UAAW,wCACX,GAAGK,CAAA,EAGCQ,EACJC,EAAAA,KAAAC,EAAAA,SAAA,CACE,SAAA,CAAAC,MAAC,QAAA,CACE,SAAA;AAAA;AAAA;AAAA;AAAA;AAAA,UAMH,EACAA,EAAAA,IAAC,MAAA,CACC,IAAAP,EACA,UAAWQ,EAAAA,GAAG,iBAAkBb,CAAS,EACzC,MAAOQ,EACP,QAASF,EACT,cAAY,OACZ,cAAaJ,EACZ,GAAGE,EAEH,SAAAD,CAAA,CAAA,CACH,EACF,EAGF,OAAIL,EACKc,EAAAA,IAACE,EAAAA,QAAQ,SAAAL,CAAA,CAAQ,EAGnBA,CACT,CAAC,EAEDnB,EAAQ,YAAc"}

package/dist/components/utility/Overlay/Overlay.js

@@ -0,0 +1,59 @@
+import { jsxs as x, Fragment as g, jsx as r } from "react/jsx-runtime";
+import { forwardRef as h } from "react";
+import { cx as C } from "../../../utils/styles.js";
+import { Portal as F } from "../Portal/Portal.js";
+const O = h(function({
+  isOpen: i,
+  onClose: n,
+  closeOnClick: l = !0,
+  blur: e = !0,
+  blurAmount: t = 4,
+  opacity: c = 0.5,
+  usePortal: s = !0,
+  zIndex: d,
+  className: y,
+  style: f,
+  testId: m,
+  children: p,
+  ...v
+}, k) {
+  if (!i) return null;
+  const u = (a) => {
+    l && a.target === a.currentTarget && n?.();
+  }, b = {
+    position: "fixed",
+    inset: 0,
+    zIndex: d ?? "var(--brycks-z-overlay)",
+    backgroundColor: `rgba(0, 0, 0, ${c})`,
+    backdropFilter: e ? `blur(${t}px)` : void 0,
+    WebkitBackdropFilter: e ? `blur(${t}px)` : void 0,
+    animation: "brycks-overlay-fade-in 200ms ease-out",
+    ...f
+  }, o = /* @__PURE__ */ x(g, { children: [
+    /* @__PURE__ */ r("style", { children: `
+          @keyframes brycks-overlay-fade-in {
+            from { opacity: 0; }
+            to { opacity: 1; }
+          }
+        ` }),
+    /* @__PURE__ */ r(
+      "div",
+      {
+        ref: k,
+        className: C("brycks-overlay", y),
+        style: b,
+        onClick: u,
+        "aria-hidden": "true",
+        "data-testid": m,
+        ...v,
+        children: p
+      }
+    )
+  ] });
+  return s ? /* @__PURE__ */ r(F, { children: o }) : o;
+});
+O.displayName = "Overlay";
+export {
+  O as Overlay
+};
+//# sourceMappingURL=Overlay.js.map

package/dist/components/utility/Overlay/Overlay.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Overlay.js","sources":["../../../../src/components/utility/Overlay/Overlay.tsx"],"sourcesContent":["/**\n * Overlay Component\n *\n * A backdrop overlay for modals, drawers, and dialogs.\n * Supports click-to-close and backdrop blur.\n */\n\nimport { forwardRef, type CSSProperties, type HTMLAttributes } from 'react'\nimport { cx } from '../../../utils/styles'\nimport { Portal } from '../Portal'\n\nexport interface OverlayProps extends HTMLAttributes<HTMLDivElement> {\n  /** Whether the overlay is visible */\n  isOpen: boolean\n  /** Callback when overlay is clicked */\n  onClose?: () => void\n  /** Whether clicking the overlay closes it */\n  closeOnClick?: boolean\n  /** Whether to apply backdrop blur */\n  blur?: boolean\n  /** Blur intensity (in pixels) */\n  blurAmount?: number\n  /** Background opacity (0-1) */\n  opacity?: number\n  /** Whether to use a portal */\n  usePortal?: boolean\n  /** Z-index for the overlay */\n  zIndex?: number\n  /** Custom class name */\n  className?: string\n  /** Test ID */\n  testId?: string\n}\n\nexport const Overlay = forwardRef<HTMLDivElement, OverlayProps>(function Overlay(\n  {\n    isOpen,\n    onClose,\n    closeOnClick = true,\n    blur = true,\n    blurAmount = 4,\n    opacity = 0.5,\n    usePortal = true,\n    zIndex,\n    className,\n    style,\n    testId,\n    children,\n    ...props\n  },\n  ref\n) {\n  if (!isOpen) return null\n\n  const handleClick = (e: React.MouseEvent) => {\n    if (closeOnClick && e.target === e.currentTarget) {\n      onClose?.()\n    }\n  }\n\n  const overlayStyle: CSSProperties = {\n    position: 'fixed',\n    inset: 0,\n    zIndex: zIndex ?? 'var(--brycks-z-overlay)' as unknown as number,\n    backgroundColor: `rgba(0, 0, 0, ${opacity})`,\n    backdropFilter: blur ? `blur(${blurAmount}px)` : undefined,\n    WebkitBackdropFilter: blur ? `blur(${blurAmount}px)` : undefined,\n    animation: 'brycks-overlay-fade-in 200ms ease-out',\n    ...style,\n  }\n\n  const content = (\n    <>\n      <style>\n        {`\n          @keyframes brycks-overlay-fade-in {\n            from { opacity: 0; }\n            to { opacity: 1; }\n          }\n        `}\n      </style>\n      <div\n        ref={ref}\n        className={cx('brycks-overlay', className)}\n        style={overlayStyle}\n        onClick={handleClick}\n        aria-hidden=\"true\"\n        data-testid={testId}\n        {...props}\n      >\n        {children}\n      </div>\n    </>\n  )\n\n  if (usePortal) {\n    return <Portal>{content}</Portal>\n  }\n\n  return content\n})\n\nOverlay.displayName = 'Overlay'\n"],"names":["Overlay","forwardRef","isOpen","onClose","closeOnClick","blur","blurAmount","opacity","usePortal","zIndex","className","style","testId","children","props","ref","handleClick","e","overlayStyle","content","jsxs","Fragment","jsx","cx","Portal"],"mappings":";;;;AAkCO,MAAMA,IAAUC,EAAyC,SAC9D;AAAA,EACE,QAAAC;AAAA,EACA,SAAAC;AAAA,EACA,cAAAC,IAAe;AAAA,EACf,MAAAC,IAAO;AAAA,EACP,YAAAC,IAAa;AAAA,EACb,SAAAC,IAAU;AAAA,EACV,WAAAC,IAAY;AAAA,EACZ,QAAAC;AAAA,EACA,WAAAC;AAAA,EACA,OAAAC;AAAA,EACA,QAAAC;AAAA,EACA,UAAAC;AAAA,EACA,GAAGC;AACL,GACAC,GACA;AACA,MAAI,CAACb,EAAQ,QAAO;AAEpB,QAAMc,IAAc,CAACC,MAAwB;AAC3C,IAAIb,KAAgBa,EAAE,WAAWA,EAAE,iBACjCd,IAAA;AAAA,EAEJ,GAEMe,IAA8B;AAAA,IAClC,UAAU;AAAA,IACV,OAAO;AAAA,IACP,QAAQT,KAAU;AAAA,IAClB,iBAAiB,iBAAiBF,CAAO;AAAA,IACzC,gBAAgBF,IAAO,QAAQC,CAAU,QAAQ;AAAA,IACjD,sBAAsBD,IAAO,QAAQC,CAAU,QAAQ;AAAA,IACvD,WAAW;AAAA,IACX,GAAGK;AAAA,EAAA,GAGCQ,IACJ,gBAAAC,EAAAC,GAAA,EACE,UAAA;AAAA,IAAA,gBAAAC,EAAC,SAAA,EACE,UAAA;AAAA;AAAA;AAAA;AAAA;AAAA,WAMH;AAAA,IACA,gBAAAA;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,KAAAP;AAAA,QACA,WAAWQ,EAAG,kBAAkBb,CAAS;AAAA,QACzC,OAAOQ;AAAA,QACP,SAASF;AAAA,QACT,eAAY;AAAA,QACZ,eAAaJ;AAAA,QACZ,GAAGE;AAAA,QAEH,UAAAD;AAAA,MAAA;AAAA,IAAA;AAAA,EACH,GACF;AAGF,SAAIL,IACK,gBAAAc,EAACE,KAAQ,UAAAL,EAAA,CAAQ,IAGnBA;AACT,CAAC;AAEDnB,EAAQ,cAAc;"}

package/dist/components/utility/Portal/Portal.cjs

@@ -0,0 +1,2 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const l=require("react/jsx-runtime"),r=require("react"),i=require("react-dom");function n({children:o,container:e,disabled:a=!1}){const[f,u]=r.useState(!1),[s,t]=r.useState(null);return r.useEffect(()=>{if(u(!0),typeof e=="string"){const c=document.querySelector(e);t(c)}else t(e||document.body);return()=>u(!1)},[e]),a?l.jsx(l.Fragment,{children:o}):!f||!s?null:i.createPortal(o,s)}n.displayName="Portal";exports.Portal=n;
+//# sourceMappingURL=Portal.cjs.map

package/dist/components/utility/Portal/Portal.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"Portal.cjs","sources":["../../../../src/components/utility/Portal/Portal.tsx"],"sourcesContent":["/**\n * Portal Component\n *\n * Renders children into a different part of the DOM tree.\n * Useful for modals, tooltips, and overlays.\n */\n\nimport { useState, useEffect, type ReactNode } from 'react'\nimport { createPortal } from 'react-dom'\n\nexport interface PortalProps {\n  /** Content to render in the portal */\n  children: ReactNode\n  /** Container element or selector to render into */\n  container?: HTMLElement | string\n  /** Whether the portal is disabled (renders inline) */\n  disabled?: boolean\n}\n\nexport function Portal({ children, container, disabled = false }: PortalProps) {\n  const [mounted, setMounted] = useState(false)\n  const [portalContainer, setPortalContainer] = useState<HTMLElement | null>(null)\n\n  useEffect(() => {\n    setMounted(true)\n\n    if (typeof container === 'string') {\n      const element = document.querySelector<HTMLElement>(container)\n      setPortalContainer(element)\n    } else if (container) {\n      setPortalContainer(container)\n    } else {\n      setPortalContainer(document.body)\n    }\n\n    return () => setMounted(false)\n  }, [container])\n\n  if (disabled) {\n    return <>{children}</>\n  }\n\n  if (!mounted || !portalContainer) {\n    return null\n  }\n\n  return createPortal(children, portalContainer)\n}\n\nPortal.displayName = 'Portal'\n"],"names":["Portal","children","container","disabled","mounted","setMounted","useState","portalContainer","setPortalContainer","useEffect","element","createPortal"],"mappings":"+JAmBO,SAASA,EAAO,CAAE,SAAAC,EAAU,UAAAC,EAAW,SAAAC,EAAW,IAAsB,CAC7E,KAAM,CAACC,EAASC,CAAU,EAAIC,EAAAA,SAAS,EAAK,EACtC,CAACC,EAAiBC,CAAkB,EAAIF,EAAAA,SAA6B,IAAI,EAiB/E,OAfAG,EAAAA,UAAU,IAAM,CAGd,GAFAJ,EAAW,EAAI,EAEX,OAAOH,GAAc,SAAU,CACjC,MAAMQ,EAAU,SAAS,cAA2BR,CAAS,EAC7DM,EAAmBE,CAAO,CAC5B,MACEF,EADSN,GAGU,SAAS,IAFA,EAK9B,MAAO,IAAMG,EAAW,EAAK,CAC/B,EAAG,CAACH,CAAS,CAAC,EAEVC,oBACQ,SAAAF,EAAS,EAGjB,CAACG,GAAW,CAACG,EACR,KAGFI,EAAAA,aAAaV,EAAUM,CAAe,CAC/C,CAEAP,EAAO,YAAc"}

package/dist/components/utility/Portal/Portal.js

@@ -0,0 +1,18 @@
+import { jsx as m, Fragment as a } from "react/jsx-runtime";
+import { useState as s, useEffect as i } from "react";
+import { createPortal as p } from "react-dom";
+function d({ children: r, container: e, disabled: u = !1 }) {
+  const [f, o] = s(!1), [l, t] = s(null);
+  return i(() => {
+    if (o(!0), typeof e == "string") {
+      const n = document.querySelector(e);
+      t(n);
+    } else t(e || document.body);
+    return () => o(!1);
+  }, [e]), u ? /* @__PURE__ */ m(a, { children: r }) : !f || !l ? null : p(r, l);
+}
+d.displayName = "Portal";
+export {
+  d as Portal
+};
+//# sourceMappingURL=Portal.js.map

package/dist/components/utility/Portal/Portal.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Portal.js","sources":["../../../../src/components/utility/Portal/Portal.tsx"],"sourcesContent":["/**\n * Portal Component\n *\n * Renders children into a different part of the DOM tree.\n * Useful for modals, tooltips, and overlays.\n */\n\nimport { useState, useEffect, type ReactNode } from 'react'\nimport { createPortal } from 'react-dom'\n\nexport interface PortalProps {\n  /** Content to render in the portal */\n  children: ReactNode\n  /** Container element or selector to render into */\n  container?: HTMLElement | string\n  /** Whether the portal is disabled (renders inline) */\n  disabled?: boolean\n}\n\nexport function Portal({ children, container, disabled = false }: PortalProps) {\n  const [mounted, setMounted] = useState(false)\n  const [portalContainer, setPortalContainer] = useState<HTMLElement | null>(null)\n\n  useEffect(() => {\n    setMounted(true)\n\n    if (typeof container === 'string') {\n      const element = document.querySelector<HTMLElement>(container)\n      setPortalContainer(element)\n    } else if (container) {\n      setPortalContainer(container)\n    } else {\n      setPortalContainer(document.body)\n    }\n\n    return () => setMounted(false)\n  }, [container])\n\n  if (disabled) {\n    return <>{children}</>\n  }\n\n  if (!mounted || !portalContainer) {\n    return null\n  }\n\n  return createPortal(children, portalContainer)\n}\n\nPortal.displayName = 'Portal'\n"],"names":["Portal","children","container","disabled","mounted","setMounted","useState","portalContainer","setPortalContainer","useEffect","element","createPortal"],"mappings":";;;AAmBO,SAASA,EAAO,EAAE,UAAAC,GAAU,WAAAC,GAAW,UAAAC,IAAW,MAAsB;AAC7E,QAAM,CAACC,GAASC,CAAU,IAAIC,EAAS,EAAK,GACtC,CAACC,GAAiBC,CAAkB,IAAIF,EAA6B,IAAI;AAiB/E,SAfAG,EAAU,MAAM;AAGd,QAFAJ,EAAW,EAAI,GAEX,OAAOH,KAAc,UAAU;AACjC,YAAMQ,IAAU,SAAS,cAA2BR,CAAS;AAC7D,MAAAM,EAAmBE,CAAO;AAAA,IAC5B,OACEF,EADSN,KAGU,SAAS,IAFA;AAK9B,WAAO,MAAMG,EAAW,EAAK;AAAA,EAC/B,GAAG,CAACH,CAAS,CAAC,GAEVC,2BACQ,UAAAF,GAAS,IAGjB,CAACG,KAAW,CAACG,IACR,OAGFI,EAAaV,GAAUM,CAAe;AAC/C;AAEAP,EAAO,cAAc;"}

package/dist/components/utility/ScreenReaderOnly/ScreenReaderOnly.cjs

@@ -0,0 +1,2 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const y=require("react/jsx-runtime"),d=require("react"),p=require("../../../utils/styles.cjs"),n={position:"absolute",width:"1px",height:"1px",padding:0,margin:"-1px",overflow:"hidden",clip:"rect(0, 0, 0, 0)",whiteSpace:"nowrap",border:0},S={...n},r=d.forwardRef(function({children:s,focusable:e=!1,className:a,style:l,testId:o,...c},i){return y.jsx("span",{ref:i,className:p.cx("brycks-sr-only",e&&"brycks-sr-only--focusable",a),style:{...e?S:n,...l},tabIndex:e?0:void 0,"data-testid":o,...c,children:s})});r.displayName="ScreenReaderOnly";const t=r;t.displayName="SrOnly";exports.ScreenReaderOnly=r;exports.SrOnly=t;
+//# sourceMappingURL=ScreenReaderOnly.cjs.map

package/dist/components/utility/ScreenReaderOnly/ScreenReaderOnly.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"ScreenReaderOnly.cjs","sources":["../../../../src/components/utility/ScreenReaderOnly/ScreenReaderOnly.tsx"],"sourcesContent":["/**\n * ScreenReaderOnly Component\n *\n * Visually hides content while keeping it accessible to screen readers.\n * Essential for accessibility when visual elements need text descriptions.\n *\n * @module components/utility/ScreenReaderOnly\n */\n\nimport { forwardRef, type HTMLAttributes, type ReactNode, type CSSProperties } from 'react'\nimport { cx } from '../../../utils/styles'\n\nexport interface ScreenReaderOnlyProps extends HTMLAttributes<HTMLSpanElement> {\n  /** Content to be read by screen readers */\n  children: ReactNode\n  /** Whether to make content focusable (shows on focus) */\n  focusable?: boolean\n  /** Custom class name */\n  className?: string\n  /** Test ID */\n  testId?: string\n}\n\n/**\n * CSS that visually hides content but keeps it accessible\n * Based on best practices from a11y guidelines\n */\nconst srOnlyStyles: CSSProperties = {\n  position: 'absolute',\n  width: '1px',\n  height: '1px',\n  padding: 0,\n  margin: '-1px',\n  overflow: 'hidden',\n  clip: 'rect(0, 0, 0, 0)',\n  whiteSpace: 'nowrap',\n  border: 0,\n}\n\n/**\n * Styles applied when element is focusable and receives focus\n */\nconst focusableStyles: CSSProperties = {\n  ...srOnlyStyles,\n}\n\nexport const ScreenReaderOnly = forwardRef<HTMLSpanElement, ScreenReaderOnlyProps>(\n  function ScreenReaderOnly(\n    {\n      children,\n      focusable = false,\n      className,\n      style,\n      testId,\n      ...props\n    },\n    ref\n  ) {\n    return (\n      <span\n        ref={ref}\n        className={cx(\n          'brycks-sr-only',\n          focusable && 'brycks-sr-only--focusable',\n          className\n        )}\n        style={{\n          ...(focusable ? focusableStyles : srOnlyStyles),\n          ...style,\n        }}\n        tabIndex={focusable ? 0 : undefined}\n        data-testid={testId}\n        {...props}\n      >\n        {children}\n      </span>\n    )\n  }\n)\n\nScreenReaderOnly.displayName = 'ScreenReaderOnly'\n\n/**\n * Alias for ScreenReaderOnly with a shorter name\n */\nexport const SrOnly = ScreenReaderOnly\n\nSrOnly.displayName = 'SrOnly'\n"],"names":["srOnlyStyles","focusableStyles","ScreenReaderOnly","forwardRef","children","focusable","className","style","testId","props","ref","jsx","cx","SrOnly"],"mappings":"+KA2BMA,EAA8B,CAClC,SAAU,WACV,MAAO,MACP,OAAQ,MACR,QAAS,EACT,OAAQ,OACR,SAAU,SACV,KAAM,mBACN,WAAY,SACZ,OAAQ,CACV,EAKMC,EAAiC,CACrC,GAAGD,CACL,EAEaE,EAAmBC,EAAAA,WAC9B,SACE,CACE,SAAAC,EACA,UAAAC,EAAY,GACZ,UAAAC,EACA,MAAAC,EACA,OAAAC,EACA,GAAGC,CAAA,EAELC,EACA,CACA,OACEC,EAAAA,IAAC,OAAA,CACC,IAAAD,EACA,UAAWE,EAAAA,GACT,iBACAP,GAAa,4BACbC,CAAA,EAEF,MAAO,CACL,GAAID,EAAYJ,EAAkBD,EAClC,GAAGO,CAAA,EAEL,SAAUF,EAAY,EAAI,OAC1B,cAAaG,EACZ,GAAGC,EAEH,SAAAL,CAAA,CAAA,CAGP,CACF,EAEAF,EAAiB,YAAc,mBAKxB,MAAMW,EAASX,EAEtBW,EAAO,YAAc"}

package/dist/components/utility/ScreenReaderOnly/ScreenReaderOnly.js

@@ -0,0 +1,53 @@
+import { jsx as d } from "react/jsx-runtime";
+import { forwardRef as c } from "react";
+import { cx as p } from "../../../utils/styles.js";
+const r = {
+  position: "absolute",
+  width: "1px",
+  height: "1px",
+  padding: 0,
+  margin: "-1px",
+  overflow: "hidden",
+  clip: "rect(0, 0, 0, 0)",
+  whiteSpace: "nowrap",
+  border: 0
+}, y = {
+  ...r
+}, n = c(
+  function({
+    children: o,
+    focusable: e = !1,
+    className: t,
+    style: s,
+    testId: a,
+    ...l
+  }, i) {
+    return /* @__PURE__ */ d(
+      "span",
+      {
+        ref: i,
+        className: p(
+          "brycks-sr-only",
+          e && "brycks-sr-only--focusable",
+          t
+        ),
+        style: {
+          ...e ? y : r,
+          ...s
+        },
+        tabIndex: e ? 0 : void 0,
+        "data-testid": a,
+        ...l,
+        children: o
+      }
+    );
+  }
+);
+n.displayName = "ScreenReaderOnly";
+const m = n;
+m.displayName = "SrOnly";
+export {
+  n as ScreenReaderOnly,
+  m as SrOnly
+};
+//# sourceMappingURL=ScreenReaderOnly.js.map

package/dist/components/utility/ScreenReaderOnly/ScreenReaderOnly.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ScreenReaderOnly.js","sources":["../../../../src/components/utility/ScreenReaderOnly/ScreenReaderOnly.tsx"],"sourcesContent":["/**\n * ScreenReaderOnly Component\n *\n * Visually hides content while keeping it accessible to screen readers.\n * Essential for accessibility when visual elements need text descriptions.\n *\n * @module components/utility/ScreenReaderOnly\n */\n\nimport { forwardRef, type HTMLAttributes, type ReactNode, type CSSProperties } from 'react'\nimport { cx } from '../../../utils/styles'\n\nexport interface ScreenReaderOnlyProps extends HTMLAttributes<HTMLSpanElement> {\n  /** Content to be read by screen readers */\n  children: ReactNode\n  /** Whether to make content focusable (shows on focus) */\n  focusable?: boolean\n  /** Custom class name */\n  className?: string\n  /** Test ID */\n  testId?: string\n}\n\n/**\n * CSS that visually hides content but keeps it accessible\n * Based on best practices from a11y guidelines\n */\nconst srOnlyStyles: CSSProperties = {\n  position: 'absolute',\n  width: '1px',\n  height: '1px',\n  padding: 0,\n  margin: '-1px',\n  overflow: 'hidden',\n  clip: 'rect(0, 0, 0, 0)',\n  whiteSpace: 'nowrap',\n  border: 0,\n}\n\n/**\n * Styles applied when element is focusable and receives focus\n */\nconst focusableStyles: CSSProperties = {\n  ...srOnlyStyles,\n}\n\nexport const ScreenReaderOnly = forwardRef<HTMLSpanElement, ScreenReaderOnlyProps>(\n  function ScreenReaderOnly(\n    {\n      children,\n      focusable = false,\n      className,\n      style,\n      testId,\n      ...props\n    },\n    ref\n  ) {\n    return (\n      <span\n        ref={ref}\n        className={cx(\n          'brycks-sr-only',\n          focusable && 'brycks-sr-only--focusable',\n          className\n        )}\n        style={{\n          ...(focusable ? focusableStyles : srOnlyStyles),\n          ...style,\n        }}\n        tabIndex={focusable ? 0 : undefined}\n        data-testid={testId}\n        {...props}\n      >\n        {children}\n      </span>\n    )\n  }\n)\n\nScreenReaderOnly.displayName = 'ScreenReaderOnly'\n\n/**\n * Alias for ScreenReaderOnly with a shorter name\n */\nexport const SrOnly = ScreenReaderOnly\n\nSrOnly.displayName = 'SrOnly'\n"],"names":["srOnlyStyles","focusableStyles","ScreenReaderOnly","forwardRef","children","focusable","className","style","testId","props","ref","jsx","cx","SrOnly"],"mappings":";;;AA2BA,MAAMA,IAA8B;AAAA,EAClC,UAAU;AAAA,EACV,OAAO;AAAA,EACP,QAAQ;AAAA,EACR,SAAS;AAAA,EACT,QAAQ;AAAA,EACR,UAAU;AAAA,EACV,MAAM;AAAA,EACN,YAAY;AAAA,EACZ,QAAQ;AACV,GAKMC,IAAiC;AAAA,EACrC,GAAGD;AACL,GAEaE,IAAmBC;AAAA,EAC9B,SACE;AAAA,IACE,UAAAC;AAAA,IACA,WAAAC,IAAY;AAAA,IACZ,WAAAC;AAAA,IACA,OAAAC;AAAA,IACA,QAAAC;AAAA,IACA,GAAGC;AAAA,EAAA,GAELC,GACA;AACA,WACE,gBAAAC;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,KAAAD;AAAA,QACA,WAAWE;AAAA,UACT;AAAA,UACAP,KAAa;AAAA,UACbC;AAAA,QAAA;AAAA,QAEF,OAAO;AAAA,UACL,GAAID,IAAYJ,IAAkBD;AAAA,UAClC,GAAGO;AAAA,QAAA;AAAA,QAEL,UAAUF,IAAY,IAAI;AAAA,QAC1B,eAAaG;AAAA,QACZ,GAAGC;AAAA,QAEH,UAAAL;AAAA,MAAA;AAAA,IAAA;AAAA,EAGP;AACF;AAEAF,EAAiB,cAAc;AAKxB,MAAMW,IAASX;AAEtBW,EAAO,cAAc;"}

package/dist/components/utility/Skeleton/Skeleton.cjs

@@ -0,0 +1,2 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const a=require("react/jsx-runtime"),S=require("react"),c=require("../../../utils/styles.cjs"),i=S.forwardRef(function({variant:n="rectangular",width:t,height:s,radius:l,animate:r=!0,className:u,style:k,testId:b,...y},m){const g={...(()=>{const e={backgroundColor:"var(--brycks-background-muted)",position:"relative",overflow:"hidden"};switch(n){case"text":e.width=t??"100%",e.height=s??"1em",e.borderRadius="var(--brycks-radius-sm)";break;case"circular":e.width=t??40,e.height=s??t??40,e.borderRadius="50%";break;case"rectangular":e.width=t??"100%",e.height=s??40,e.borderRadius=l??"var(--brycks-radius-default)";break}return e})(),...k},x={position:"absolute",top:0,left:0,right:0,bottom:0,background:"linear-gradient(90deg, transparent 0%, rgba(255,255,255,0.4) 50%, transparent 100%)",animation:r?"brycks-shimmer 1.5s ease-in-out infinite":"none"};return a.jsx("div",{ref:m,className:c.cx("brycks-skeleton",`brycks-skeleton--${n}`,r&&"brycks-skeleton--animated",u),style:g,"data-testid":b,"aria-hidden":"true",...y,children:r&&a.jsx("div",{style:x})})});i.displayName="Skeleton";function d({lines:o=3,gap:n=8,lastLineWidth:t="80%",className:s}){return a.jsx("div",{className:c.cx("brycks-skeleton-text",s),style:{display:"flex",flexDirection:"column",gap:n},children:Array.from({length:o}).map((l,r)=>a.jsx(i,{variant:"text",width:r===o-1?t:"100%"},r))})}d.displayName="SkeletonText";exports.Skeleton=i;exports.SkeletonText=d;
+//# sourceMappingURL=Skeleton.cjs.map

package/dist/components/utility/Skeleton/Skeleton.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"Skeleton.cjs","sources":["../../../../src/components/utility/Skeleton/Skeleton.tsx"],"sourcesContent":["/**\r\n * Skeleton Component\r\n *\r\n * Loading placeholder with shimmer animation.\r\n * Provides visual feedback while content is loading.\r\n */\r\n\r\nimport {\r\n  forwardRef,\r\n  type CSSProperties,\r\n  type HTMLAttributes,\r\n} from 'react'\r\nimport { cx } from '../../../utils/styles'\r\n\r\nexport type SkeletonVariant = 'text' | 'circular' | 'rectangular'\r\n\r\nexport interface SkeletonProps extends HTMLAttributes<HTMLDivElement> {\r\n  /** Skeleton variant */\r\n  variant?: SkeletonVariant\r\n  /** Width */\r\n  width?: string | number\r\n  /** Height */\r\n  height?: string | number\r\n  /** Border radius (for rectangular variant) */\r\n  radius?: string | number\r\n  /** Whether to animate */\r\n  animate?: boolean\r\n  /** Custom class name */\r\n  className?: string\r\n  /** Test ID */\r\n  testId?: string\r\n}\r\n\r\nexport const Skeleton = forwardRef<HTMLDivElement, SkeletonProps>(function Skeleton(\r\n  {\r\n    variant = 'rectangular',\r\n    width,\r\n    height,\r\n    radius,\r\n    animate = true,\r\n    className,\r\n    style,\r\n    testId,\r\n    ...props\r\n  },\r\n  ref\r\n) {\r\n  const getStyles = (): CSSProperties => {\r\n    const base: CSSProperties = {\r\n      backgroundColor: 'var(--brycks-background-muted)',\r\n      position: 'relative',\r\n      overflow: 'hidden',\r\n    }\r\n\r\n    switch (variant) {\r\n      case 'text':\r\n        base.width = width ?? '100%'\r\n        base.height = height ?? '1em'\r\n        base.borderRadius = 'var(--brycks-radius-sm)'\r\n        break\r\n      case 'circular':\r\n        base.width = width ?? 40\r\n        base.height = height ?? width ?? 40\r\n        base.borderRadius = '50%'\r\n        break\r\n      case 'rectangular':\r\n        base.width = width ?? '100%'\r\n        base.height = height ?? 40\r\n        base.borderRadius = radius ?? 'var(--brycks-radius-default)'\r\n        break\r\n    }\r\n\r\n    return base\r\n  }\r\n\r\n  const skeletonStyle: CSSProperties = {\r\n    ...getStyles(),\r\n    ...style,\r\n  }\r\n\r\n  // Shimmer uses global CSS animation from animations.css\r\n  const shimmerStyle: CSSProperties = {\r\n    position: 'absolute',\r\n    top: 0,\r\n    left: 0,\r\n    right: 0,\r\n    bottom: 0,\r\n    background: 'linear-gradient(90deg, transparent 0%, rgba(255,255,255,0.4) 50%, transparent 100%)',\r\n    animation: animate ? 'brycks-shimmer 1.5s ease-in-out infinite' : 'none',\r\n  }\r\n\r\n  return (\r\n    <div\r\n      ref={ref}\r\n      className={cx(\r\n        'brycks-skeleton',\r\n        `brycks-skeleton--${variant}`,\r\n        animate && 'brycks-skeleton--animated',\r\n        className\r\n      )}\r\n      style={skeletonStyle}\r\n      data-testid={testId}\r\n      aria-hidden=\"true\"\r\n      {...props}\r\n    >\r\n      {animate && <div style={shimmerStyle} />}\r\n    </div>\r\n  )\r\n})\r\n\r\nSkeleton.displayName = 'Skeleton'\r\n\r\n/** Text skeleton with multiple lines */\r\nexport interface SkeletonTextProps {\r\n  /** Number of lines */\r\n  lines?: number\r\n  /** Gap between lines */\r\n  gap?: number\r\n  /** Last line width percentage */\r\n  lastLineWidth?: string\r\n  /** Custom class name */\r\n  className?: string\r\n}\r\n\r\nexport function SkeletonText({\r\n  lines = 3,\r\n  gap = 8,\r\n  lastLineWidth = '80%',\r\n  className,\r\n}: SkeletonTextProps) {\r\n  return (\r\n    <div\r\n      className={cx('brycks-skeleton-text', className)}\r\n      style={{ display: 'flex', flexDirection: 'column', gap }}\r\n    >\r\n      {Array.from({ length: lines }).map((_, i) => (\r\n        <Skeleton\r\n          key={i}\r\n          variant=\"text\"\r\n          width={i === lines - 1 ? lastLineWidth : '100%'}\r\n        />\r\n      ))}\r\n    </div>\r\n  )\r\n}\r\n\r\nSkeletonText.displayName = 'SkeletonText'\r\n"],"names":["Skeleton","forwardRef","variant","width","height","radius","animate","className","style","testId","props","ref","skeletonStyle","base","shimmerStyle","jsx","cx","SkeletonText","lines","gap","lastLineWidth","_","i"],"mappings":"+KAiCaA,EAAWC,EAAAA,WAA0C,SAChE,CACE,QAAAC,EAAU,cACV,MAAAC,EACA,OAAAC,EACA,OAAAC,EACA,QAAAC,EAAU,GACV,UAAAC,EACA,MAAAC,EACA,OAAAC,EACA,GAAGC,CACL,EACAC,EACA,CA6BA,MAAMC,EAA+B,CACnC,IA7BgB,IAAqB,CACrC,MAAMC,EAAsB,CAC1B,gBAAiB,iCACjB,SAAU,WACV,SAAU,QAAA,EAGZ,OAAQX,EAAA,CACN,IAAK,OACHW,EAAK,MAAQV,GAAS,OACtBU,EAAK,OAAST,GAAU,MACxBS,EAAK,aAAe,0BACpB,MACF,IAAK,WACHA,EAAK,MAAQV,GAAS,GACtBU,EAAK,OAAST,GAAUD,GAAS,GACjCU,EAAK,aAAe,MACpB,MACF,IAAK,cACHA,EAAK,MAAQV,GAAS,OACtBU,EAAK,OAAST,GAAU,GACxBS,EAAK,aAAeR,GAAU,+BAC9B,KAAA,CAGJ,OAAOQ,CACT,GAGK,EACH,GAAGL,CAAA,EAICM,EAA8B,CAClC,SAAU,WACV,IAAK,EACL,KAAM,EACN,MAAO,EACP,OAAQ,EACR,WAAY,sFACZ,UAAWR,EAAU,2CAA6C,MAAA,EAGpE,OACES,EAAAA,IAAC,MAAA,CACC,IAAAJ,EACA,UAAWK,EAAAA,GACT,kBACA,oBAAoBd,CAAO,GAC3BI,GAAW,4BACXC,CAAA,EAEF,MAAOK,EACP,cAAaH,EACb,cAAY,OACX,GAAGC,EAEH,SAAAJ,GAAWS,EAAAA,IAAC,MAAA,CAAI,MAAOD,CAAA,CAAc,CAAA,CAAA,CAG5C,CAAC,EAEDd,EAAS,YAAc,WAchB,SAASiB,EAAa,CAC3B,MAAAC,EAAQ,EACR,IAAAC,EAAM,EACN,cAAAC,EAAgB,MAChB,UAAAb,CACF,EAAsB,CACpB,OACEQ,EAAAA,IAAC,MAAA,CACC,UAAWC,EAAAA,GAAG,uBAAwBT,CAAS,EAC/C,MAAO,CAAE,QAAS,OAAQ,cAAe,SAAU,IAAAY,CAAA,EAElD,SAAA,MAAM,KAAK,CAAE,OAAQD,EAAO,EAAE,IAAI,CAACG,EAAGC,IACrCP,EAAAA,IAACf,EAAA,CAEC,QAAQ,OACR,MAAOsB,IAAMJ,EAAQ,EAAIE,EAAgB,MAAA,EAFpCE,CAAA,CAIR,CAAA,CAAA,CAGP,CAEAL,EAAa,YAAc"}

package/dist/components/utility/Skeleton/Skeleton.js

@@ -0,0 +1,91 @@
+import { jsx as o } from "react/jsx-runtime";
+import { forwardRef as g } from "react";
+import { cx as l } from "../../../utils/styles.js";
+const c = g(function({
+  variant: a = "rectangular",
+  width: t,
+  height: s,
+  radius: i,
+  animate: r = !0,
+  className: d,
+  style: k,
+  testId: u,
+  ...b
+}, m) {
+  const y = {
+    ...(() => {
+      const e = {
+        backgroundColor: "var(--brycks-background-muted)",
+        position: "relative",
+        overflow: "hidden"
+      };
+      switch (a) {
+        case "text":
+          e.width = t ?? "100%", e.height = s ?? "1em", e.borderRadius = "var(--brycks-radius-sm)";
+          break;
+        case "circular":
+          e.width = t ?? 40, e.height = s ?? t ?? 40, e.borderRadius = "50%";
+          break;
+        case "rectangular":
+          e.width = t ?? "100%", e.height = s ?? 40, e.borderRadius = i ?? "var(--brycks-radius-default)";
+          break;
+      }
+      return e;
+    })(),
+    ...k
+  }, f = {
+    position: "absolute",
+    top: 0,
+    left: 0,
+    right: 0,
+    bottom: 0,
+    background: "linear-gradient(90deg, transparent 0%, rgba(255,255,255,0.4) 50%, transparent 100%)",
+    animation: r ? "brycks-shimmer 1.5s ease-in-out infinite" : "none"
+  };
+  return /* @__PURE__ */ o(
+    "div",
+    {
+      ref: m,
+      className: l(
+        "brycks-skeleton",
+        `brycks-skeleton--${a}`,
+        r && "brycks-skeleton--animated",
+        d
+      ),
+      style: y,
+      "data-testid": u,
+      "aria-hidden": "true",
+      ...b,
+      children: r && /* @__PURE__ */ o("div", { style: f })
+    }
+  );
+});
+c.displayName = "Skeleton";
+function p({
+  lines: n = 3,
+  gap: a = 8,
+  lastLineWidth: t = "80%",
+  className: s
+}) {
+  return /* @__PURE__ */ o(
+    "div",
+    {
+      className: l("brycks-skeleton-text", s),
+      style: { display: "flex", flexDirection: "column", gap: a },
+      children: Array.from({ length: n }).map((i, r) => /* @__PURE__ */ o(
+        c,
+        {
+          variant: "text",
+          width: r === n - 1 ? t : "100%"
+        },
+        r
+      ))
+    }
+  );
+}
+p.displayName = "SkeletonText";
+export {
+  c as Skeleton,
+  p as SkeletonText
+};
+//# sourceMappingURL=Skeleton.js.map

package/dist/components/utility/Skeleton/Skeleton.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Skeleton.js","sources":["../../../../src/components/utility/Skeleton/Skeleton.tsx"],"sourcesContent":["/**\r\n * Skeleton Component\r\n *\r\n * Loading placeholder with shimmer animation.\r\n * Provides visual feedback while content is loading.\r\n */\r\n\r\nimport {\r\n  forwardRef,\r\n  type CSSProperties,\r\n  type HTMLAttributes,\r\n} from 'react'\r\nimport { cx } from '../../../utils/styles'\r\n\r\nexport type SkeletonVariant = 'text' | 'circular' | 'rectangular'\r\n\r\nexport interface SkeletonProps extends HTMLAttributes<HTMLDivElement> {\r\n  /** Skeleton variant */\r\n  variant?: SkeletonVariant\r\n  /** Width */\r\n  width?: string | number\r\n  /** Height */\r\n  height?: string | number\r\n  /** Border radius (for rectangular variant) */\r\n  radius?: string | number\r\n  /** Whether to animate */\r\n  animate?: boolean\r\n  /** Custom class name */\r\n  className?: string\r\n  /** Test ID */\r\n  testId?: string\r\n}\r\n\r\nexport const Skeleton = forwardRef<HTMLDivElement, SkeletonProps>(function Skeleton(\r\n  {\r\n    variant = 'rectangular',\r\n    width,\r\n    height,\r\n    radius,\r\n    animate = true,\r\n    className,\r\n    style,\r\n    testId,\r\n    ...props\r\n  },\r\n  ref\r\n) {\r\n  const getStyles = (): CSSProperties => {\r\n    const base: CSSProperties = {\r\n      backgroundColor: 'var(--brycks-background-muted)',\r\n      position: 'relative',\r\n      overflow: 'hidden',\r\n    }\r\n\r\n    switch (variant) {\r\n      case 'text':\r\n        base.width = width ?? '100%'\r\n        base.height = height ?? '1em'\r\n        base.borderRadius = 'var(--brycks-radius-sm)'\r\n        break\r\n      case 'circular':\r\n        base.width = width ?? 40\r\n        base.height = height ?? width ?? 40\r\n        base.borderRadius = '50%'\r\n        break\r\n      case 'rectangular':\r\n        base.width = width ?? '100%'\r\n        base.height = height ?? 40\r\n        base.borderRadius = radius ?? 'var(--brycks-radius-default)'\r\n        break\r\n    }\r\n\r\n    return base\r\n  }\r\n\r\n  const skeletonStyle: CSSProperties = {\r\n    ...getStyles(),\r\n    ...style,\r\n  }\r\n\r\n  // Shimmer uses global CSS animation from animations.css\r\n  const shimmerStyle: CSSProperties = {\r\n    position: 'absolute',\r\n    top: 0,\r\n    left: 0,\r\n    right: 0,\r\n    bottom: 0,\r\n    background: 'linear-gradient(90deg, transparent 0%, rgba(255,255,255,0.4) 50%, transparent 100%)',\r\n    animation: animate ? 'brycks-shimmer 1.5s ease-in-out infinite' : 'none',\r\n  }\r\n\r\n  return (\r\n    <div\r\n      ref={ref}\r\n      className={cx(\r\n        'brycks-skeleton',\r\n        `brycks-skeleton--${variant}`,\r\n        animate && 'brycks-skeleton--animated',\r\n        className\r\n      )}\r\n      style={skeletonStyle}\r\n      data-testid={testId}\r\n      aria-hidden=\"true\"\r\n      {...props}\r\n    >\r\n      {animate && <div style={shimmerStyle} />}\r\n    </div>\r\n  )\r\n})\r\n\r\nSkeleton.displayName = 'Skeleton'\r\n\r\n/** Text skeleton with multiple lines */\r\nexport interface SkeletonTextProps {\r\n  /** Number of lines */\r\n  lines?: number\r\n  /** Gap between lines */\r\n  gap?: number\r\n  /** Last line width percentage */\r\n  lastLineWidth?: string\r\n  /** Custom class name */\r\n  className?: string\r\n}\r\n\r\nexport function SkeletonText({\r\n  lines = 3,\r\n  gap = 8,\r\n  lastLineWidth = '80%',\r\n  className,\r\n}: SkeletonTextProps) {\r\n  return (\r\n    <div\r\n      className={cx('brycks-skeleton-text', className)}\r\n      style={{ display: 'flex', flexDirection: 'column', gap }}\r\n    >\r\n      {Array.from({ length: lines }).map((_, i) => (\r\n        <Skeleton\r\n          key={i}\r\n          variant=\"text\"\r\n          width={i === lines - 1 ? lastLineWidth : '100%'}\r\n        />\r\n      ))}\r\n    </div>\r\n  )\r\n}\r\n\r\nSkeletonText.displayName = 'SkeletonText'\r\n"],"names":["Skeleton","forwardRef","variant","width","height","radius","animate","className","style","testId","props","ref","skeletonStyle","base","shimmerStyle","jsx","cx","SkeletonText","lines","gap","lastLineWidth","_","i"],"mappings":";;;AAiCO,MAAMA,IAAWC,EAA0C,SAChE;AAAA,EACE,SAAAC,IAAU;AAAA,EACV,OAAAC;AAAA,EACA,QAAAC;AAAA,EACA,QAAAC;AAAA,EACA,SAAAC,IAAU;AAAA,EACV,WAAAC;AAAA,EACA,OAAAC;AAAA,EACA,QAAAC;AAAA,EACA,GAAGC;AACL,GACAC,GACA;AA6BA,QAAMC,IAA+B;AAAA,IACnC,IA7BgB,MAAqB;AACrC,YAAMC,IAAsB;AAAA,QAC1B,iBAAiB;AAAA,QACjB,UAAU;AAAA,QACV,UAAU;AAAA,MAAA;AAGZ,cAAQX,GAAA;AAAA,QACN,KAAK;AACH,UAAAW,EAAK,QAAQV,KAAS,QACtBU,EAAK,SAAST,KAAU,OACxBS,EAAK,eAAe;AACpB;AAAA,QACF,KAAK;AACH,UAAAA,EAAK,QAAQV,KAAS,IACtBU,EAAK,SAAST,KAAUD,KAAS,IACjCU,EAAK,eAAe;AACpB;AAAA,QACF,KAAK;AACH,UAAAA,EAAK,QAAQV,KAAS,QACtBU,EAAK,SAAST,KAAU,IACxBS,EAAK,eAAeR,KAAU;AAC9B;AAAA,MAAA;AAGJ,aAAOQ;AAAA,IACT,GAGK;AAAA,IACH,GAAGL;AAAA,EAAA,GAICM,IAA8B;AAAA,IAClC,UAAU;AAAA,IACV,KAAK;AAAA,IACL,MAAM;AAAA,IACN,OAAO;AAAA,IACP,QAAQ;AAAA,IACR,YAAY;AAAA,IACZ,WAAWR,IAAU,6CAA6C;AAAA,EAAA;AAGpE,SACE,gBAAAS;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,KAAAJ;AAAA,MACA,WAAWK;AAAA,QACT;AAAA,QACA,oBAAoBd,CAAO;AAAA,QAC3BI,KAAW;AAAA,QACXC;AAAA,MAAA;AAAA,MAEF,OAAOK;AAAA,MACP,eAAaH;AAAA,MACb,eAAY;AAAA,MACX,GAAGC;AAAA,MAEH,UAAAJ,KAAW,gBAAAS,EAAC,OAAA,EAAI,OAAOD,EAAA,CAAc;AAAA,IAAA;AAAA,EAAA;AAG5C,CAAC;AAEDd,EAAS,cAAc;AAchB,SAASiB,EAAa;AAAA,EAC3B,OAAAC,IAAQ;AAAA,EACR,KAAAC,IAAM;AAAA,EACN,eAAAC,IAAgB;AAAA,EAChB,WAAAb;AACF,GAAsB;AACpB,SACE,gBAAAQ;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,WAAWC,EAAG,wBAAwBT,CAAS;AAAA,MAC/C,OAAO,EAAE,SAAS,QAAQ,eAAe,UAAU,KAAAY,EAAA;AAAA,MAElD,UAAA,MAAM,KAAK,EAAE,QAAQD,GAAO,EAAE,IAAI,CAACG,GAAGC,MACrC,gBAAAP;AAAA,QAACf;AAAA,QAAA;AAAA,UAEC,SAAQ;AAAA,UACR,OAAOsB,MAAMJ,IAAQ,IAAIE,IAAgB;AAAA,QAAA;AAAA,QAFpCE;AAAA,MAAA,CAIR;AAAA,IAAA;AAAA,EAAA;AAGP;AAEAL,EAAa,cAAc;"}

package/dist/components/utility.cjs

@@ -0,0 +1,2 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const n=require("./utility/Badge/Badge.cjs"),e=require("./utility/Loader/Loader.cjs"),r=require("./utility/Skeleton/Skeleton.cjs"),a=require("./utility/Divider/Divider.cjs"),t=require("./utility/EmptyState/EmptyState.cjs"),i=require("./utility/Portal/Portal.cjs"),c=require("./utility/FocusTrap/FocusTrap.cjs"),l=require("./utility/Overlay/Overlay.cjs"),o=require("./utility/ScreenReaderOnly/ScreenReaderOnly.cjs"),S=require("./utility/Avatar/Avatar.cjs"),u=require("./utility/Logo/Logo.cjs");exports.Badge=n.Badge;exports.Loader=e.Loader;exports.Spinner=e.Spinner;exports.Skeleton=r.Skeleton;exports.SkeletonText=r.SkeletonText;exports.Divider=a.Divider;exports.EmptyState=t.EmptyState;exports.EmptyStateIcon=t.EmptyStateIcon;exports.Portal=i.Portal;exports.FocusTrap=c.FocusTrap;exports.Overlay=l.Overlay;exports.ScreenReaderOnly=o.ScreenReaderOnly;exports.SrOnly=o.SrOnly;exports.Avatar=S.Avatar;exports.Logo=u.Logo;
+//# sourceMappingURL=utility.cjs.map

package/dist/components/utility.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"utility.cjs","sources":[],"sourcesContent":[],"names":[],"mappings":""}

package/dist/components/utility.d.ts

@@ -0,0 +1,2 @@
+export * from './utility/index'
+export {}

package/dist/components/utility.js

@@ -0,0 +1,29 @@
+import { Badge as e } from "./utility/Badge/Badge.js";
+import { Loader as p, Spinner as m } from "./utility/Loader/Loader.js";
+import { Skeleton as f, SkeletonText as a } from "./utility/Skeleton/Skeleton.js";
+import { Divider as S } from "./utility/Divider/Divider.js";
+import { EmptyState as y, EmptyStateIcon as d } from "./utility/EmptyState/EmptyState.js";
+import { Portal as i } from "./utility/Portal/Portal.js";
+import { FocusTrap as O } from "./utility/FocusTrap/FocusTrap.js";
+import { Overlay as k } from "./utility/Overlay/Overlay.js";
+import { ScreenReaderOnly as L, SrOnly as T } from "./utility/ScreenReaderOnly/ScreenReaderOnly.js";
+import { Avatar as u } from "./utility/Avatar/Avatar.js";
+import { Logo as B } from "./utility/Logo/Logo.js";
+export {
+  u as Avatar,
+  e as Badge,
+  S as Divider,
+  y as EmptyState,
+  d as EmptyStateIcon,
+  O as FocusTrap,
+  p as Loader,
+  B as Logo,
+  k as Overlay,
+  i as Portal,
+  L as ScreenReaderOnly,
+  f as Skeleton,
+  a as SkeletonText,
+  m as Spinner,
+  T as SrOnly
+};
+//# sourceMappingURL=utility.js.map

package/dist/components/utility.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"utility.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;"}