@tramo-digital/react-ui 0.0.0-alpha

package/dist/esm/ui/primitives/List/List.module.css.js

@@ -0,0 +1,32 @@
+const t = "lU1Qoi9-", i = "_29P1Aapw", n = "v3OH59nt", e = "wVRiFU2f", o = "OcRpwyGI", s = "oEKTZaTE", c = "PgoFW-Ga", a = "qlaulDWF", l = "b2JGKd0B", m = "lICSaxGH", r = "MdVfJxl8", d = "WJgwejDX", v = {
+  list: t,
+  listItem: i,
+  disabled: n,
+  itemLink: e,
+  itemInner: o,
+  itemText: s,
+  itemIcon: c,
+  icon: a,
+  itemBody: l,
+  itemDescription: m,
+  "variant-descriptive": "MdVfJxl8",
+  variantDescriptive: r,
+  "variant-icon": "WJgwejDX",
+  variantIcon: d
+};
+export {
+  v as default,
+  n as disabled,
+  a as icon,
+  l as itemBody,
+  m as itemDescription,
+  c as itemIcon,
+  o as itemInner,
+  e as itemLink,
+  s as itemText,
+  t as list,
+  i as listItem,
+  r as variantDescriptive,
+  d as variantIcon
+};
+//# sourceMappingURL=List.module.css.js.map

package/dist/esm/ui/primitives/List/List.module.css.js.map

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

package/dist/esm/ui/primitives/List/index.js

@@ -0,0 +1,5 @@
+import o from "./List.js";
+export {
+  o as default
+};
+//# sourceMappingURL=index.js.map

package/dist/esm/ui/primitives/List/index.js.map

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

package/dist/esm/ui/primitives/Loader/Loader.js

@@ -0,0 +1,56 @@
+import { jsx as e, jsxs as u } from "react/jsx-runtime";
+import N from "../Frame/Frame.js";
+import i from "./Loader.module.css.js";
+const f = (a) => ({
+  spinner: /* @__PURE__ */ e("div", { className: i.spinnerRing }),
+  dots: /* @__PURE__ */ u("div", { className: i.dotsContainer, children: [
+    /* @__PURE__ */ e("span", { className: i.dot }),
+    /* @__PURE__ */ e("span", { className: i.dot }),
+    /* @__PURE__ */ e("span", { className: i.dot })
+  ] }),
+  pulse: /* @__PURE__ */ e("div", { className: i.pulseRing })
+})[a] || null, A = ({
+  data: a,
+  tokens: s,
+  className: n,
+  colorPalette: r,
+  colorSource: o,
+  customColor: d,
+  ...m
+}) => {
+  if (!a) return null;
+  const { variant: l = "spinner", label: t = "Loading..." } = a, c = {
+    ...s?.color?.fill && {
+      "--loader-color": s.color.fill.default
+    },
+    ...s?.dimension?.size?.lg && {
+      "--loader-size-lg": s.dimension.size.lg
+    },
+    ...s?.dimension?.size?.md && {
+      "--loader-size-md": s.dimension.size.md
+    },
+    ...s?.dimension?.size?.sm && {
+      "--loader-size-sm": s.dimension.size.sm
+    }
+  }, p = [i.tuiLoader, i[`variant-${l}`], n].filter(Boolean).join(" ").trim();
+  return /* @__PURE__ */ e(
+    N,
+    {
+      "data-tui-primitive": "base",
+      data: { as: "div" },
+      colorPalette: r,
+      colorSource: o,
+      customColor: d,
+      className: p,
+      style: c,
+      role: "status",
+      "aria-label": t,
+      ...m,
+      children: f(l)
+    }
+  );
+};
+export {
+  A as default
+};
+//# sourceMappingURL=Loader.js.map

package/dist/esm/ui/primitives/Loader/Loader.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Loader.js","sources":["../../../../../src/ui/primitives/Loader/Loader.tsx"],"sourcesContent":["import type { LoaderModel } from \"@tramo-digital/types\";\nimport React from \"react\";\nimport Frame from \"../../primitives/Frame/Frame\";\nimport styles from \"./Loader.module.css\";\n\nexport interface LoaderProps extends React.HTMLAttributes<HTMLDivElement> {\n  id?: LoaderModel[\"id\"];\n  data: LoaderModel[\"data\"];\n  events?: LoaderModel[\"events\"];\n  tokens?: LoaderModel[\"tokens\"];\n  className?: LoaderModel[\"className\"];\n  colorPalette?: LoaderModel[\"colorPalette\"];\n  colorSource?: LoaderModel[\"colorSource\"];\n  customColor?: LoaderModel[\"customColor\"];\n}\n\nconst renderVariant = (variant: string) => {\n  const VARIANT_MAP: Record<string, React.ReactNode> = {\n    spinner: <div className={styles.spinnerRing} />,\n    dots: (\n      <div className={styles.dotsContainer}>\n        <span className={styles.dot} />\n        <span className={styles.dot} />\n        <span className={styles.dot} />\n      </div>\n    ),\n    pulse: <div className={styles.pulseRing} />,\n  };\n\n  return VARIANT_MAP[variant] || null;\n};\n\nconst LoaderBase: React.FC<LoaderProps> = ({\n  data,\n  tokens,\n  className,\n  colorPalette,\n  colorSource,\n  customColor,\n  ...rest\n}) => {\n  if (!data) return null;\n  const _fingerprint = \"2307cca977070175e82a3b0600e8536a\";\n\n  const { variant = \"spinner\", label = \"Loading...\" } = data;\n\n  const tokenStyles = {\n    ...(tokens?.color?.fill && {\n      \"--loader-color\": tokens.color.fill.default,\n    }),\n    ...(tokens?.dimension?.size?.lg && {\n      \"--loader-size-lg\": tokens.dimension.size.lg,\n    }),\n    ...(tokens?.dimension?.size?.md && {\n      \"--loader-size-md\": tokens.dimension.size.md,\n    }),\n    ...(tokens?.dimension?.size?.sm && {\n      \"--loader-size-sm\": tokens.dimension.size.sm,\n    }),\n  };\n\n  const classNames = [styles.tuiLoader, styles[`variant-${variant}`], className]\n    .filter(Boolean)\n    .join(\" \")\n    .trim();\n\n  return (\n    <Frame\n      data-tui-primitive=\"base\"\n      data={{ as: \"div\" }}\n      colorPalette={colorPalette}\n      colorSource={colorSource}\n      customColor={customColor}\n      className={classNames}\n      style={tokenStyles as React.CSSProperties}\n      role=\"status\"\n      aria-label={label}\n      {...rest}\n    >\n      {renderVariant(variant)}\n    </Frame>\n  );\n};\n\nexport default LoaderBase;\n"],"names":["renderVariant","variant","jsx","styles","jsxs","LoaderBase","data","tokens","className","colorPalette","colorSource","customColor","rest","label","tokenStyles","classNames","Frame"],"mappings":";;;AAgBA,MAAMA,IAAgB,CAACC,OACgC;AAAA,EACnD,SAAS,gBAAAC,EAAC,OAAA,EAAI,WAAWC,EAAO,aAAa;AAAA,EAC7C,MACE,gBAAAC,EAAC,OAAA,EAAI,WAAWD,EAAO,eACrB,UAAA;AAAA,IAAA,gBAAAD,EAAC,QAAA,EAAK,WAAWC,EAAO,IAAA,CAAK;AAAA,IAC7B,gBAAAD,EAAC,QAAA,EAAK,WAAWC,EAAO,IAAA,CAAK;AAAA,IAC7B,gBAAAD,EAAC,QAAA,EAAK,WAAWC,EAAO,IAAA,CAAK;AAAA,EAAA,GAC/B;AAAA,EAEF,OAAO,gBAAAD,EAAC,OAAA,EAAI,WAAWC,EAAO,UAAA,CAAW;AAAA,GAGxBF,CAAO,KAAK,MAG3BI,IAAoC,CAAC;AAAA,EACzC,MAAAC;AAAA,EACA,QAAAC;AAAA,EACA,WAAAC;AAAA,EACA,cAAAC;AAAA,EACA,aAAAC;AAAA,EACA,aAAAC;AAAA,EACA,GAAGC;AACL,MAAM;AACJ,MAAI,CAACN,EAAM,QAAO;AAGlB,QAAM,EAAE,SAAAL,IAAU,WAAW,OAAAY,IAAQ,iBAAiBP,GAEhDQ,IAAc;AAAA,IAClB,GAAIP,GAAQ,OAAO,QAAQ;AAAA,MACzB,kBAAkBA,EAAO,MAAM,KAAK;AAAA,IAAA;AAAA,IAEtC,GAAIA,GAAQ,WAAW,MAAM,MAAM;AAAA,MACjC,oBAAoBA,EAAO,UAAU,KAAK;AAAA,IAAA;AAAA,IAE5C,GAAIA,GAAQ,WAAW,MAAM,MAAM;AAAA,MACjC,oBAAoBA,EAAO,UAAU,KAAK;AAAA,IAAA;AAAA,IAE5C,GAAIA,GAAQ,WAAW,MAAM,MAAM;AAAA,MACjC,oBAAoBA,EAAO,UAAU,KAAK;AAAA,IAAA;AAAA,EAC5C,GAGIQ,IAAa,CAACZ,EAAO,WAAWA,EAAO,WAAWF,CAAO,EAAE,GAAGO,CAAS,EAC1E,OAAO,OAAO,EACd,KAAK,GAAG,EACR,KAAA;AAEH,SACE,gBAAAN;AAAA,IAACc;AAAA,IAAA;AAAA,MACC,sBAAmB;AAAA,MACnB,MAAM,EAAE,IAAI,MAAA;AAAA,MACZ,cAAAP;AAAA,MACA,aAAAC;AAAA,MACA,aAAAC;AAAA,MACA,WAAWI;AAAA,MACX,OAAOD;AAAA,MACP,MAAK;AAAA,MACL,cAAYD;AAAA,MACX,GAAGD;AAAA,MAEH,YAAcX,CAAO;AAAA,IAAA;AAAA,EAAA;AAG5B;"}

package/dist/esm/ui/primitives/Loader/Loader.module.css.js

@@ -0,0 +1,32 @@
+const n = "gQ-Qkwc0", t = "dD1mmKfh", s = "d9umvex-", o = "wPKkYGWh", i = "qFkryqI-", r = "ZV914JVo", e = "j97sK3I3", a = "XfnHmBDD", c = "JuzvJkkk", u = "NrdKc6Nu", d = {
+  tuiLoader: n,
+  "variant-spinner": "dD1mmKfh",
+  variantSpinner: t,
+  spinnerRing: s,
+  "spinner-spin": "wPKkYGWh",
+  spinnerSpin: o,
+  "variant-dots": "qFkryqI-",
+  variantDots: i,
+  dotsContainer: r,
+  dot: e,
+  "dots-bounce": "XfnHmBDD",
+  dotsBounce: a,
+  "variant-pulse": "JuzvJkkk",
+  variantPulse: c,
+  pulseRing: u,
+  "pulse-ring": "NrdKc6Nu"
+};
+export {
+  d as default,
+  e as dot,
+  a as dotsBounce,
+  r as dotsContainer,
+  u as pulseRing,
+  s as spinnerRing,
+  o as spinnerSpin,
+  n as tuiLoader,
+  i as variantDots,
+  c as variantPulse,
+  t as variantSpinner
+};
+//# sourceMappingURL=Loader.module.css.js.map

package/dist/esm/ui/primitives/Loader/Loader.module.css.js.map

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

package/dist/esm/ui/primitives/Logo/Logo.js

@@ -0,0 +1,68 @@
+import { jsx as t, jsxs as r } from "react/jsx-runtime";
+import h from "../Frame/Frame.js";
+import i from "./Logo.module.css.js";
+const y = ({
+  data: a,
+  tokens: e,
+  className: l,
+  colorPalette: o,
+  colorSource: g,
+  customColor: c
+}) => {
+  const { type: d = "default", size: n = "md", theme: s = "light" } = a || {}, p = {
+    ...e?.color?.text && {
+      "--logo-color-text": e.color.text.default
+    },
+    ...e?.spacing?.padding && {
+      "--logo-padding": e.spacing.padding.default
+    },
+    ...e?.spacing?.gap && { "--logo-gap": e.spacing.gap.default }
+  };
+  return /* @__PURE__ */ t(
+    h,
+    {
+      "data-tui-primitive": "base",
+      data: { as: "div" },
+      colorPalette: o,
+      colorSource: g,
+      customColor: c,
+      className: `${i[d]} ${i[s]} ${i[n]}${l ? ` ${l}` : ""}`,
+      style: p,
+      children: /* @__PURE__ */ t(
+        "svg",
+        {
+          className: i.logo,
+          xmlns: "http://www.w3.org/2000/svg",
+          fill: "none",
+          viewBox: "0 0 300 56",
+          children: /* @__PURE__ */ r("g", { fill: "currentColor", children: [
+            /* @__PURE__ */ t("rect", { x: "4", y: "4", width: "48", height: "14", rx: "6" }),
+            /* @__PURE__ */ t("rect", { x: "4", y: "30", width: "18", height: "26", rx: "6" }),
+            /* @__PURE__ */ t("rect", { x: "34", y: "30", width: "18", height: "26", rx: "6" }),
+            /* @__PURE__ */ t("circle", { cx: "28", cy: "26", r: "4", style: { fill: "#002EE6" } }),
+            /* @__PURE__ */ r(
+              "text",
+              {
+                x: "68",
+                y: "48",
+                fontFamily: "'Recoleta Regular', Georgia, serif",
+                fontSize: "36",
+                fontWeight: "400",
+                letterSpacing: "-0.5",
+                children: [
+                  "tramo",
+                  /* @__PURE__ */ t("tspan", { fill: "#002EE6", children: "." }),
+                  "digital"
+                ]
+              }
+            )
+          ] })
+        }
+      )
+    }
+  );
+};
+export {
+  y as default
+};
+//# sourceMappingURL=Logo.js.map

package/dist/esm/ui/primitives/Logo/Logo.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Logo.js","sources":["../../../../../src/ui/primitives/Logo/Logo.tsx"],"sourcesContent":["import type { LogoModel } from \"@tramo-digital/types\";\nimport React from \"react\";\nimport Frame from \"../Frame/Frame\";\nimport styles from \"./Logo.module.css\";\n\nexport type LogoProps = Omit<LogoModel, \"_type\">;\n\nconst Logo: React.FC<LogoProps> = ({\n  data,\n  tokens,\n  className,\n  colorPalette,\n  colorSource,\n  customColor,\n}) => {\n  const _fingerprint = \"e19122d75b9b3c1914134c492e248faf\";\n\n  const { type = \"default\", size = \"md\", theme = \"light\" } = data || {};\n\n  const tokenStyles = {\n    ...(tokens?.color?.text && {\n      \"--logo-color-text\": tokens.color.text.default,\n    }),\n    ...(tokens?.spacing?.padding && {\n      \"--logo-padding\": tokens.spacing.padding.default,\n    }),\n    ...(tokens?.spacing?.gap && { \"--logo-gap\": tokens.spacing.gap.default }),\n  };\n\n  return (\n    <Frame\n      data-tui-primitive=\"base\"\n      data={{ as: \"div\" }}\n      colorPalette={colorPalette}\n      colorSource={colorSource}\n      customColor={customColor}\n      className={`${styles[type]} ${styles[theme]} ${styles[size]}${className ? ` ${className}` : \"\"}`}\n      style={tokenStyles as React.CSSProperties}\n    >\n      <svg\n        className={styles.logo}\n        xmlns=\"http://www.w3.org/2000/svg\"\n        fill=\"none\"\n        viewBox=\"0 0 300 56\"\n      >\n        <g fill=\"currentColor\">\n          {/* Isotype: \"Pathway T\" — three blocks form a T, stem is negative space */}\n          <rect x=\"4\" y=\"4\" width=\"48\" height=\"14\" rx=\"6\" />\n          <rect x=\"4\" y=\"30\" width=\"18\" height=\"26\" rx=\"6\" />\n          <rect x=\"34\" y=\"30\" width=\"18\" height=\"26\" rx=\"6\" />\n          <circle cx=\"28\" cy=\"26\" r=\"4\" style={{ fill: \"#002EE6\" }} />\n          <text\n            x=\"68\"\n            y=\"48\"\n            fontFamily=\"'Recoleta Regular', Georgia, serif\"\n            fontSize=\"36\"\n            fontWeight=\"400\"\n            letterSpacing=\"-0.5\"\n          >\n            tramo<tspan fill=\"#002EE6\">.</tspan>digital\n          </text>\n        </g>\n      </svg>\n    </Frame>\n  );\n};\n\nexport default Logo;\n"],"names":["Logo","data","tokens","className","colorPalette","colorSource","customColor","type","size","theme","tokenStyles","jsx","Frame","styles","jsxs"],"mappings":";;;AAOA,MAAMA,IAA4B,CAAC;AAAA,EACjC,MAAAC;AAAA,EACA,QAAAC;AAAA,EACA,WAAAC;AAAA,EACA,cAAAC;AAAA,EACA,aAAAC;AAAA,EACA,aAAAC;AACF,MAAM;AAGJ,QAAM,EAAE,MAAAC,IAAO,WAAW,MAAAC,IAAO,MAAM,OAAAC,IAAQ,YAAYR,KAAQ,CAAA,GAE7DS,IAAc;AAAA,IAClB,GAAIR,GAAQ,OAAO,QAAQ;AAAA,MACzB,qBAAqBA,EAAO,MAAM,KAAK;AAAA,IAAA;AAAA,IAEzC,GAAIA,GAAQ,SAAS,WAAW;AAAA,MAC9B,kBAAkBA,EAAO,QAAQ,QAAQ;AAAA,IAAA;AAAA,IAE3C,GAAIA,GAAQ,SAAS,OAAO,EAAE,cAAcA,EAAO,QAAQ,IAAI,QAAA;AAAA,EAAQ;AAGzE,SACE,gBAAAS;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,sBAAmB;AAAA,MACnB,MAAM,EAAE,IAAI,MAAA;AAAA,MACZ,cAAAR;AAAA,MACA,aAAAC;AAAA,MACA,aAAAC;AAAA,MACA,WAAW,GAAGO,EAAON,CAAI,CAAC,IAAIM,EAAOJ,CAAK,CAAC,IAAII,EAAOL,CAAI,CAAC,GAAGL,IAAY,IAAIA,CAAS,KAAK,EAAE;AAAA,MAC9F,OAAOO;AAAA,MAEP,UAAA,gBAAAC;AAAA,QAAC;AAAA,QAAA;AAAA,UACC,WAAWE,EAAO;AAAA,UAClB,OAAM;AAAA,UACN,MAAK;AAAA,UACL,SAAQ;AAAA,UAER,UAAA,gBAAAC,EAAC,KAAA,EAAE,MAAK,gBAEN,UAAA;AAAA,YAAA,gBAAAH,EAAC,QAAA,EAAK,GAAE,KAAI,GAAE,KAAI,OAAM,MAAK,QAAO,MAAK,IAAG,IAAA,CAAI;AAAA,YAChD,gBAAAA,EAAC,QAAA,EAAK,GAAE,KAAI,GAAE,MAAK,OAAM,MAAK,QAAO,MAAK,IAAG,IAAA,CAAI;AAAA,YACjD,gBAAAA,EAAC,QAAA,EAAK,GAAE,MAAK,GAAE,MAAK,OAAM,MAAK,QAAO,MAAK,IAAG,IAAA,CAAI;AAAA,YAClD,gBAAAA,EAAC,UAAA,EAAO,IAAG,MAAK,IAAG,MAAK,GAAE,KAAI,OAAO,EAAE,MAAM,UAAA,EAAU,CAAG;AAAA,YAC1D,gBAAAG;AAAA,cAAC;AAAA,cAAA;AAAA,gBACC,GAAE;AAAA,gBACF,GAAE;AAAA,gBACF,YAAW;AAAA,gBACX,UAAS;AAAA,gBACT,YAAW;AAAA,gBACX,eAAc;AAAA,gBACf,UAAA;AAAA,kBAAA;AAAA,kBACM,gBAAAH,EAAC,SAAA,EAAM,MAAK,WAAU,UAAA,KAAC;AAAA,kBAAQ;AAAA,gBAAA;AAAA,cAAA;AAAA,YAAA;AAAA,UACtC,EAAA,CACF;AAAA,QAAA;AAAA,MAAA;AAAA,IACF;AAAA,EAAA;AAGN;"}

package/dist/esm/ui/primitives/Logo/Logo.module.css.js

@@ -0,0 +1,19 @@
+const s = "pwMpAGb5", t = "u-31B-lg", l = "cxFuCk0m", c = "QSXwuYgr", o = "FWpP6jb-", n = "NmXLJwBl", a = {
+  default: "mnFYAIYl",
+  sm: s,
+  md: t,
+  lg: l,
+  social: c,
+  light: o,
+  dark: n
+};
+export {
+  n as dark,
+  a as default,
+  l as lg,
+  o as light,
+  t as md,
+  s as sm,
+  c as social
+};
+//# sourceMappingURL=Logo.module.css.js.map

package/dist/esm/ui/primitives/Logo/Logo.module.css.js.map

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

package/dist/esm/ui/primitives/Logo/index.js

@@ -0,0 +1,5 @@
+import r from "./Logo.js";
+export {
+  r as default
+};
+//# sourceMappingURL=index.js.map

package/dist/esm/ui/primitives/Logo/index.js.map

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

package/dist/esm/ui/primitives/Overlay/Overlay.js

@@ -0,0 +1,58 @@
+import { jsx as O } from "react/jsx-runtime";
+import { useRef as C } from "react";
+import x from "../Frame/Frame.js";
+import l from "./Overlay.module.css.js";
+const $ = Object.freeze({
+  isOpen: !0,
+  type: "transparent",
+  opacity: 50,
+  onClose: () => ({})
+}), j = ({
+  colorSource: c,
+  colorPalette: n,
+  customColor: i,
+  data: y = $,
+  tokens: e,
+  events: r,
+  children: f,
+  className: o,
+  ...p
+}) => {
+  const t = C(null), s = {
+    ...e?.color?.background && {
+      "--overlay-background-color": e.color.background.default
+    },
+    ...e?.elevation?.zIndex && {
+      "--overlay-z-index": e.elevation.zIndex.default
+    },
+    ...e?.effect?.opacity && {
+      "--overlay-opacity": `${e.effect.opacity.default}%`
+    }
+  }, { type: u = "transparent", opacity: d = 50, isOpen: a } = y, m = `${l.tuiOverlayViewport} ${l[u]} ${o ? `${o}` : ""}`.trim();
+  return a ? /* @__PURE__ */ O(
+    x,
+    {
+      inert: !a,
+      "data-overlay-opacity": d,
+      colorPalette: n,
+      colorSource: c,
+      customColor: i,
+      data: {
+        as: "div"
+      },
+      ref: t,
+      events: r,
+      className: m,
+      style: s,
+      onClick: (v) => {
+        t.current && t.current === v.target && r?.onClose && r.onClose();
+      },
+      ...p,
+      children: f
+    }
+  ) : null;
+};
+export {
+  j as default
+};
+//# sourceMappingURL=Overlay.js.map

package/dist/esm/ui/primitives/Overlay/Overlay.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Overlay.js","sources":["../../../../../src/ui/primitives/Overlay/Overlay.tsx"],"sourcesContent":["import type { OverlayModel } from \"@tramo-digital/types\";\nimport React, { useRef } from \"react\";\nimport Frame from \"../Frame/Frame\";\nimport styles from \"./Overlay.module.css\";\n\nexport interface OverlayProps extends OverlayModel {\n  children?: React.ReactNode;\n}\n\nconst DEFAULT_DATA = Object.freeze({\n  isOpen: true,\n  type: \"transparent\",\n  opacity: 50,\n  onClose: () => ({}),\n});\n\nconst Overlay: React.FC<OverlayProps> = ({\n  colorSource,\n  colorPalette,\n  customColor,\n  data = DEFAULT_DATA,\n  tokens,\n  events,\n  children,\n  className,\n  ...rest\n}) => {\n  const overlayRef = useRef<HTMLDivElement>(null);\n  const tokenStyles = {\n    ...(tokens?.color?.background && {\n      \"--overlay-background-color\": tokens.color.background.default,\n    }),\n    ...(tokens?.elevation?.zIndex && {\n      \"--overlay-z-index\": tokens.elevation.zIndex.default,\n    }),\n    ...(tokens?.effect?.opacity && {\n      \"--overlay-opacity\": `${tokens.effect.opacity.default}%`,\n    }),\n  } as React.CSSProperties;\n\n  const { type = \"transparent\", opacity = 50, isOpen } = data;\n\n  const classNames =\n    `${styles.tuiOverlayViewport} ${styles[type]} ${className ? `${className}` : \"\"}`.trim();\n\n  if (!isOpen) {\n    return null;\n  }\n\n  const handleOverlayClick = (e: React.MouseEvent<HTMLDivElement>) => {\n    if (\n      overlayRef.current &&\n      overlayRef.current === e.target &&\n      events?.onClose\n    ) {\n      events.onClose();\n    }\n  };\n\n  return (\n    <Frame\n      inert={!isOpen}\n      data-overlay-opacity={opacity}\n      colorPalette={colorPalette}\n      colorSource={colorSource}\n      customColor={customColor}\n      data={{\n        as: \"div\",\n      }}\n      ref={overlayRef}\n      events={events}\n      className={classNames}\n      style={tokenStyles}\n      onClick={handleOverlayClick}\n      {...rest}\n    >\n      {children}\n    </Frame>\n  );\n};\n\nexport default Overlay;\n"],"names":["DEFAULT_DATA","Overlay","colorSource","colorPalette","customColor","data","tokens","events","children","className","rest","overlayRef","useRef","tokenStyles","type","opacity","isOpen","classNames","styles","jsx","Frame","e"],"mappings":";;;;AASA,MAAMA,IAAe,OAAO,OAAO;AAAA,EACjC,QAAQ;AAAA,EACR,MAAM;AAAA,EACN,SAAS;AAAA,EACT,SAAS,OAAO,CAAA;AAClB,CAAC,GAEKC,IAAkC,CAAC;AAAA,EACvC,aAAAC;AAAA,EACA,cAAAC;AAAA,EACA,aAAAC;AAAA,EACA,MAAAC,IAAOL;AAAA,EACP,QAAAM;AAAA,EACA,QAAAC;AAAA,EACA,UAAAC;AAAA,EACA,WAAAC;AAAA,EACA,GAAGC;AACL,MAAM;AACJ,QAAMC,IAAaC,EAAuB,IAAI,GACxCC,IAAc;AAAA,IAClB,GAAIP,GAAQ,OAAO,cAAc;AAAA,MAC/B,8BAA8BA,EAAO,MAAM,WAAW;AAAA,IAAA;AAAA,IAExD,GAAIA,GAAQ,WAAW,UAAU;AAAA,MAC/B,qBAAqBA,EAAO,UAAU,OAAO;AAAA,IAAA;AAAA,IAE/C,GAAIA,GAAQ,QAAQ,WAAW;AAAA,MAC7B,qBAAqB,GAAGA,EAAO,OAAO,QAAQ,OAAO;AAAA,IAAA;AAAA,EACvD,GAGI,EAAE,MAAAQ,IAAO,eAAe,SAAAC,IAAU,IAAI,QAAAC,MAAWX,GAEjDY,IACJ,GAAGC,EAAO,kBAAkB,IAAIA,EAAOJ,CAAI,CAAC,IAAIL,IAAY,GAAGA,CAAS,KAAK,EAAE,GAAG,KAAA;AAEpF,SAAKO,IAeH,gBAAAG;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,OAAO,CAACJ;AAAA,MACR,wBAAsBD;AAAA,MACtB,cAAAZ;AAAA,MACA,aAAAD;AAAA,MACA,aAAAE;AAAA,MACA,MAAM;AAAA,QACJ,IAAI;AAAA,MAAA;AAAA,MAEN,KAAKO;AAAA,MACL,QAAAJ;AAAA,MACA,WAAWU;AAAA,MACX,OAAOJ;AAAA,MACP,SAxBuB,CAACQ,MAAwC;AAClE,QACEV,EAAW,WACXA,EAAW,YAAYU,EAAE,UACzBd,GAAQ,WAERA,EAAO,QAAA;AAAA,MAEX;AAAA,MAiBK,GAAGG;AAAA,MAEH,UAAAF;AAAA,IAAA;AAAA,EAAA,IA9BI;AAiCX;"}

package/dist/esm/ui/primitives/Overlay/Overlay.module.css.js

@@ -0,0 +1,14 @@
+const r = "OZOsA10-", t = "WyfMhCNs", s = "TJ6a21j1", l = {
+  tuiOverlayViewport: r,
+  "soft-blur": "WyfMhCNs",
+  softBlur: t,
+  "hard-blur": "TJ6a21j1",
+  hardBlur: s
+};
+export {
+  l as default,
+  s as hardBlur,
+  t as softBlur,
+  r as tuiOverlayViewport
+};
+//# sourceMappingURL=Overlay.module.css.js.map

package/dist/esm/ui/primitives/Overlay/Overlay.module.css.js.map

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

package/dist/esm/ui/primitives/Overlay/index.js

@@ -0,0 +1,5 @@
+import a from "./Overlay.js";
+export {
+  a as default
+};
+//# sourceMappingURL=index.js.map

package/dist/esm/ui/primitives/Overlay/index.js.map

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

package/dist/esm/ui/primitives/Radio/Radio.js

@@ -0,0 +1,119 @@
+import { jsx as o, jsxs as f } from "react/jsx-runtime";
+import { useId as B } from "react";
+import D from "../Frame/Frame.js";
+import a from "./Radio.module.css.js";
+const L = ({
+  data: d,
+  events: c,
+  tokens: r,
+  className: b,
+  colorPalette: g,
+  colorSource: h,
+  customColor: v
+}) => {
+  if (!d) return null;
+  const {
+    name: t,
+    options: N = [],
+    value: C,
+    required: y = !1,
+    disabled: l = !1,
+    errorMessage: z,
+    direction: S = "vertical",
+    id: j
+  } = d, I = B(), s = j ?? t ?? I, n = !!z, q = {
+    ...r?.color?.circle && {
+      "--radio-color-circle": r.color.circle.default
+    },
+    ...r?.color?.circleSelected && {
+      "--radio-color-circle-selected": r.color.circleSelected.default
+    },
+    ...r?.color?.dot && {
+      "--radio-color-dot": r.color.dot.default
+    },
+    ...r?.color?.border && {
+      "--radio-color-border": r.color.border.default
+    },
+    ...r?.color?.borderSelected && {
+      "--radio-color-border-selected": r.color.borderSelected.default
+    },
+    ...r?.color?.label && {
+      "--radio-color-label": r.color.label.default
+    },
+    ...r?.color?.error && {
+      "--radio-color-error": r.color.error.default
+    },
+    ...r?.spacing?.gap && {
+      "--radio-spacing-gap": r.spacing.gap.default
+    },
+    ...r?.spacing?.optionGap && {
+      "--radio-spacing-option-gap": r.spacing.optionGap.default
+    },
+    ...r?.dimension?.size && {
+      "--radio-size": r.dimension.size.default
+    }
+  };
+  return /* @__PURE__ */ o(
+    D,
+    {
+      data: { as: "div" },
+      "data-tui-primitive": "base",
+      "data-tui-dynamic-states": "default",
+      role: "radiogroup",
+      id: s,
+      colorPalette: g,
+      colorSource: h,
+      customColor: v,
+      className: [
+        a.radiogroup,
+        S === "horizontal" ? a.horizontal : a.vertical,
+        n ? a.hasError : "",
+        l ? a.disabled : "",
+        b ?? ""
+      ].filter(Boolean).join(" "),
+      style: q,
+      "aria-invalid": n,
+      "aria-disabled": l,
+      children: N.map((e, i) => {
+        const p = `${s}-opt-${i}`, x = C === e.value, u = l || e.disabled;
+        return /* @__PURE__ */ f(
+          "label",
+          {
+            htmlFor: p,
+            className: [
+              a.optionLabel,
+              u ? a.optionDisabled : ""
+            ].filter(Boolean).join(" "),
+            children: [
+              /* @__PURE__ */ f("span", { className: a.inputContainer, children: [
+                /* @__PURE__ */ o(
+                  "input",
+                  {
+                    id: p,
+                    name: t,
+                    type: "radio",
+                    value: e.value,
+                    checked: x,
+                    disabled: u,
+                    required: y && i === 0,
+                    className: a.input,
+                    onChange: (m) => {
+                      m.target.checked && c?.onChange && c.onChange(e.value, m);
+                    }
+                  }
+                ),
+                /* @__PURE__ */ o("span", { className: a.customCircle, "aria-hidden": "true", children: /* @__PURE__ */ o("span", { className: a.dot }) })
+              ] }),
+              /* @__PURE__ */ o("span", { className: a.labelText, children: e.label })
+            ]
+          },
+          i
+        );
+      })
+    }
+  );
+};
+export {
+  L as default
+};
+//# sourceMappingURL=Radio.js.map

package/dist/esm/ui/primitives/Radio/Radio.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Radio.js","sources":["../../../../../src/ui/primitives/Radio/Radio.tsx"],"sourcesContent":["import React, { useId } from \"react\";\nimport type { RadioModel } from \"@tramo-digital/types\";\nimport Frame from \"../Frame/Frame\";\nimport styles from \"./Radio.module.css\";\n\nexport interface RadioProps {\n  id?: RadioModel[\"id\"];\n  data: RadioModel[\"data\"];\n  events?: RadioModel[\"events\"];\n  tokens?: RadioModel[\"tokens\"];\n  className?: RadioModel[\"className\"];\n  colorPalette?: RadioModel[\"colorPalette\"];\n  colorSource?: RadioModel[\"colorSource\"];\n  customColor?: RadioModel[\"customColor\"];\n}\n\nconst Radio: React.FC<RadioProps> = ({\n  data,\n  events,\n  tokens,\n  className,\n  colorPalette,\n  colorSource,\n  customColor,\n}) => {\n  if (!data) return null;\n  const _fingerprint = \"55f975a57d8e488495edd62b91f0590a\";\n\n  const {\n    name,\n    options = [],\n    value,\n    required = false,\n    disabled = false,\n    errorMessage,\n    direction = \"vertical\",\n    id,\n  } = data;\n\n  const generatedId = useId();\n  const fieldsetId = id ?? name ?? generatedId;\n  const hasError = !!errorMessage;\n\n  const tokenStyles = {\n    ...(tokens?.color?.circle && {\n      \"--radio-color-circle\": tokens.color.circle.default,\n    }),\n    ...(tokens?.color?.circleSelected && {\n      \"--radio-color-circle-selected\": tokens.color.circleSelected.default,\n    }),\n    ...(tokens?.color?.dot && {\n      \"--radio-color-dot\": tokens.color.dot.default,\n    }),\n    ...(tokens?.color?.border && {\n      \"--radio-color-border\": tokens.color.border.default,\n    }),\n    ...(tokens?.color?.borderSelected && {\n      \"--radio-color-border-selected\": tokens.color.borderSelected.default,\n    }),\n    ...(tokens?.color?.label && {\n      \"--radio-color-label\": tokens.color.label.default,\n    }),\n    ...(tokens?.color?.error && {\n      \"--radio-color-error\": tokens.color.error.default,\n    }),\n    ...(tokens?.spacing?.gap && {\n      \"--radio-spacing-gap\": tokens.spacing.gap.default,\n    }),\n    ...(tokens?.spacing?.optionGap && {\n      \"--radio-spacing-option-gap\": tokens.spacing.optionGap.default,\n    }),\n    ...(tokens?.dimension?.size && {\n      \"--radio-size\": tokens.dimension.size.default,\n    }),\n  };\n\n  return (\n    <Frame\n      data={{ as: \"div\" }}\n      data-tui-primitive=\"base\"\n      data-tui-dynamic-states=\"default\"\n      role=\"radiogroup\"\n      id={fieldsetId}\n      colorPalette={colorPalette}\n      colorSource={colorSource}\n      customColor={customColor}\n      className={[\n        styles.radiogroup,\n        direction === \"horizontal\" ? styles.horizontal : styles.vertical,\n        hasError ? styles.hasError : \"\",\n        disabled ? styles.disabled : \"\",\n        className ?? \"\",\n      ]\n        .filter(Boolean)\n        .join(\" \")}\n      style={tokenStyles as React.CSSProperties}\n      aria-invalid={hasError}\n      aria-disabled={disabled}\n    >\n      {options.map((opt, idx) => {\n        const optionId = `${fieldsetId}-opt-${idx}`;\n        const isChecked = value === opt.value;\n        const isOptDisabled = disabled || opt.disabled;\n\n        return (\n          <label\n            key={idx}\n            htmlFor={optionId}\n            className={[\n              styles.optionLabel,\n              isOptDisabled ? styles.optionDisabled : \"\",\n            ]\n              .filter(Boolean)\n              .join(\" \")}\n          >\n            <span className={styles.inputContainer}>\n              <input\n                id={optionId}\n                name={name}\n                type=\"radio\"\n                value={opt.value}\n                checked={isChecked}\n                disabled={isOptDisabled}\n                required={required && idx === 0}\n                className={styles.input}\n                onChange={(e) => {\n                  if (e.target.checked && events?.onChange) {\n                    events.onChange(opt.value, e);\n                  }\n                }}\n              />\n              <span className={styles.customCircle} aria-hidden=\"true\">\n                <span className={styles.dot} />\n              </span>\n            </span>\n            <span className={styles.labelText}>{opt.label}</span>\n          </label>\n        );\n      })}\n    </Frame>\n  );\n};\n\nexport default Radio;\n"],"names":["Radio","data","events","tokens","className","colorPalette","colorSource","customColor","name","options","value","required","disabled","errorMessage","direction","id","generatedId","useId","fieldsetId","hasError","tokenStyles","jsx","Frame","styles","opt","idx","optionId","isChecked","isOptDisabled","jsxs","e"],"mappings":";;;;AAgBA,MAAMA,IAA8B,CAAC;AAAA,EACnC,MAAAC;AAAA,EACA,QAAAC;AAAA,EACA,QAAAC;AAAA,EACA,WAAAC;AAAA,EACA,cAAAC;AAAA,EACA,aAAAC;AAAA,EACA,aAAAC;AACF,MAAM;AACJ,MAAI,CAACN,EAAM,QAAO;AAGlB,QAAM;AAAA,IACJ,MAAAO;AAAA,IACA,SAAAC,IAAU,CAAA;AAAA,IACV,OAAAC;AAAA,IACA,UAAAC,IAAW;AAAA,IACX,UAAAC,IAAW;AAAA,IACX,cAAAC;AAAA,IACA,WAAAC,IAAY;AAAA,IACZ,IAAAC;AAAA,EAAA,IACEd,GAEEe,IAAcC,EAAA,GACdC,IAAaH,KAAMP,KAAQQ,GAC3BG,IAAW,CAAC,CAACN,GAEbO,IAAc;AAAA,IAClB,GAAIjB,GAAQ,OAAO,UAAU;AAAA,MAC3B,wBAAwBA,EAAO,MAAM,OAAO;AAAA,IAAA;AAAA,IAE9C,GAAIA,GAAQ,OAAO,kBAAkB;AAAA,MACnC,iCAAiCA,EAAO,MAAM,eAAe;AAAA,IAAA;AAAA,IAE/D,GAAIA,GAAQ,OAAO,OAAO;AAAA,MACxB,qBAAqBA,EAAO,MAAM,IAAI;AAAA,IAAA;AAAA,IAExC,GAAIA,GAAQ,OAAO,UAAU;AAAA,MAC3B,wBAAwBA,EAAO,MAAM,OAAO;AAAA,IAAA;AAAA,IAE9C,GAAIA,GAAQ,OAAO,kBAAkB;AAAA,MACnC,iCAAiCA,EAAO,MAAM,eAAe;AAAA,IAAA;AAAA,IAE/D,GAAIA,GAAQ,OAAO,SAAS;AAAA,MAC1B,uBAAuBA,EAAO,MAAM,MAAM;AAAA,IAAA;AAAA,IAE5C,GAAIA,GAAQ,OAAO,SAAS;AAAA,MAC1B,uBAAuBA,EAAO,MAAM,MAAM;AAAA,IAAA;AAAA,IAE5C,GAAIA,GAAQ,SAAS,OAAO;AAAA,MAC1B,uBAAuBA,EAAO,QAAQ,IAAI;AAAA,IAAA;AAAA,IAE5C,GAAIA,GAAQ,SAAS,aAAa;AAAA,MAChC,8BAA8BA,EAAO,QAAQ,UAAU;AAAA,IAAA;AAAA,IAEzD,GAAIA,GAAQ,WAAW,QAAQ;AAAA,MAC7B,gBAAgBA,EAAO,UAAU,KAAK;AAAA,IAAA;AAAA,EACxC;AAGF,SACE,gBAAAkB;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,MAAM,EAAE,IAAI,MAAA;AAAA,MACZ,sBAAmB;AAAA,MACnB,2BAAwB;AAAA,MACxB,MAAK;AAAA,MACL,IAAIJ;AAAA,MACJ,cAAAb;AAAA,MACA,aAAAC;AAAA,MACA,aAAAC;AAAA,MACA,WAAW;AAAA,QACTgB,EAAO;AAAA,QACPT,MAAc,eAAeS,EAAO,aAAaA,EAAO;AAAA,QACxDJ,IAAWI,EAAO,WAAW;AAAA,QAC7BX,IAAWW,EAAO,WAAW;AAAA,QAC7BnB,KAAa;AAAA,MAAA,EAEZ,OAAO,OAAO,EACd,KAAK,GAAG;AAAA,MACX,OAAOgB;AAAA,MACP,gBAAcD;AAAA,MACd,iBAAeP;AAAA,MAEd,UAAAH,EAAQ,IAAI,CAACe,GAAKC,MAAQ;AACzB,cAAMC,IAAW,GAAGR,CAAU,QAAQO,CAAG,IACnCE,IAAYjB,MAAUc,EAAI,OAC1BI,IAAgBhB,KAAYY,EAAI;AAEtC,eACE,gBAAAK;AAAA,UAAC;AAAA,UAAA;AAAA,YAEC,SAASH;AAAA,YACT,WAAW;AAAA,cACTH,EAAO;AAAA,cACPK,IAAgBL,EAAO,iBAAiB;AAAA,YAAA,EAEvC,OAAO,OAAO,EACd,KAAK,GAAG;AAAA,YAEX,UAAA;AAAA,cAAA,gBAAAM,EAAC,QAAA,EAAK,WAAWN,EAAO,gBACtB,UAAA;AAAA,gBAAA,gBAAAF;AAAA,kBAAC;AAAA,kBAAA;AAAA,oBACC,IAAIK;AAAA,oBACJ,MAAAlB;AAAA,oBACA,MAAK;AAAA,oBACL,OAAOgB,EAAI;AAAA,oBACX,SAASG;AAAA,oBACT,UAAUC;AAAA,oBACV,UAAUjB,KAAYc,MAAQ;AAAA,oBAC9B,WAAWF,EAAO;AAAA,oBAClB,UAAU,CAACO,MAAM;AACf,sBAAIA,EAAE,OAAO,WAAW5B,GAAQ,YAC9BA,EAAO,SAASsB,EAAI,OAAOM,CAAC;AAAA,oBAEhC;AAAA,kBAAA;AAAA,gBAAA;AAAA,gBAEF,gBAAAT,EAAC,QAAA,EAAK,WAAWE,EAAO,cAAc,eAAY,QAChD,UAAA,gBAAAF,EAAC,QAAA,EAAK,WAAWE,EAAO,IAAA,CAAK,EAAA,CAC/B;AAAA,cAAA,GACF;AAAA,gCACC,QAAA,EAAK,WAAWA,EAAO,WAAY,YAAI,MAAA,CAAM;AAAA,YAAA;AAAA,UAAA;AAAA,UA7BzCE;AAAA,QAAA;AAAA,MAgCX,CAAC;AAAA,IAAA;AAAA,EAAA;AAGP;"}

package/dist/esm/ui/primitives/Radio/Radio.module.css.js

@@ -0,0 +1,28 @@
+const o = "MBNARfNM", t = "T-GvAXIn", n = "qHW25Uo2", s = "uWDVOzVS", a = "ajQm0D1K", i = "jyfOLvlj", r = "Cpw2bANw", c = "TE8gLgoR", e = "Ypz-saQH", l = "_5CffXVXa", p = "_0dhjLFKR", u = {
+  radiogroup: o,
+  vertical: t,
+  horizontal: n,
+  optionLabel: s,
+  optionDisabled: a,
+  inputContainer: i,
+  input: r,
+  customCircle: c,
+  dot: e,
+  hasError: l,
+  labelText: p
+};
+export {
+  c as customCircle,
+  u as default,
+  e as dot,
+  l as hasError,
+  n as horizontal,
+  r as input,
+  i as inputContainer,
+  p as labelText,
+  a as optionDisabled,
+  s as optionLabel,
+  o as radiogroup,
+  t as vertical
+};
+//# sourceMappingURL=Radio.module.css.js.map

package/dist/esm/ui/primitives/Radio/Radio.module.css.js.map

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

package/dist/esm/ui/primitives/Radio/index.js

@@ -0,0 +1,5 @@
+import a from "./Radio.js";
+export {
+  a as default
+};
+//# sourceMappingURL=index.js.map

package/dist/esm/ui/primitives/Radio/index.js.map

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