@tramo-digital/react-ui 0.0.0-alpha

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

@@ -0,0 +1,137 @@
+import { jsxs as f, jsx as d } from "react/jsx-runtime";
+import { useId as L } from "react";
+import S from "../Frame/Frame.js";
+import o from "./Select.module.css.js";
+const q = ({
+  data: t,
+  events: l,
+  tokens: r,
+  className: p,
+  colorPalette: b,
+  colorSource: g,
+  customColor: m
+}) => {
+  if (!t) return null;
+  const {
+    name: s,
+    options: v = [],
+    placeholder: u,
+    required: n = !1,
+    disabled: c = !1,
+    multiple: a = !1,
+    value: y,
+    id: x,
+    errorMessage: w
+  } = t, C = L(), F = x ?? s ?? C, h = !!w, j = {
+    ...r?.color?.background && {
+      "--select-color-background": r.color.background.default
+    },
+    ...r?.color?.border && {
+      "--select-color-border": r.color.border.default
+    },
+    ...r?.color?.borderFocus && {
+      "--select-color-border-focus": r.color.borderFocus.default
+    },
+    ...r?.color?.borderError && {
+      "--select-color-border-error": r.color.borderError.default
+    },
+    ...r?.color?.text && {
+      "--select-color-text": r.color.text.default
+    },
+    ...r?.color?.placeholder && {
+      "--select-color-placeholder": r.color.placeholder.default
+    },
+    ...r?.color?.chevron && {
+      "--select-color-chevron": r.color.chevron.default
+    },
+    ...r?.spacing?.padding && {
+      "--select-spacing-padding": r.spacing.padding.default
+    },
+    ...r?.border?.borderRadius && {
+      "--select-border-radius": r.border.borderRadius.default
+    },
+    ...r?.border?.borderWidth && {
+      "--select-border-width": r.border.borderWidth.default
+    },
+    ...r?.typography?.fontSize && {
+      "--select-font-size": r.typography.fontSize.default
+    }
+  }, B = (e) => {
+    if (l?.onChange)
+      if (a) {
+        const i = Array.from(
+          e.target.selectedOptions,
+          (E) => E.value
+        );
+        l.onChange(i, e);
+      } else
+        l.onChange(e.target.value, e);
+  };
+  return /* @__PURE__ */ f(
+    S,
+    {
+      data: { as: "div" },
+      "data-tui-primitive": "base",
+      "data-tui-dynamic-states": "default",
+      colorPalette: b,
+      colorSource: g,
+      customColor: m,
+      className: [
+        o.selectWrapper,
+        h ? o.hasError : "",
+        c ? o.disabled : "",
+        a ? o.multiple : "",
+        p ?? ""
+      ].filter(Boolean).join(" "),
+      style: j,
+      children: [
+        /* @__PURE__ */ f(
+          "select",
+          {
+            id: F,
+            name: s,
+            multiple: a,
+            value: y,
+            required: n,
+            disabled: c,
+            "aria-required": n,
+            "aria-disabled": c,
+            "aria-invalid": h,
+            className: o.select,
+            onChange: B,
+            onBlur: l?.onBlur,
+            onFocus: l?.onFocus,
+            children: [
+              u && !a && /* @__PURE__ */ d("option", { value: "", disabled: !0, children: u }),
+              v.map((e, i) => /* @__PURE__ */ d("option", { value: e.value, disabled: e.disabled, children: e.label }, i))
+            ]
+          }
+        ),
+        !a && /* @__PURE__ */ d("span", { className: o.chevron, "aria-hidden": "true", children: /* @__PURE__ */ d(
+          "svg",
+          {
+            width: "12",
+            height: "8",
+            viewBox: "0 0 12 8",
+            fill: "none",
+            xmlns: "http://www.w3.org/2000/svg",
+            children: /* @__PURE__ */ d(
+              "path",
+              {
+                d: "M1 1.5L6 6.5L11 1.5",
+                stroke: "currentColor",
+                strokeWidth: "1.5",
+                strokeLinecap: "round",
+                strokeLinejoin: "round"
+              }
+            )
+          }
+        ) })
+      ]
+    }
+  );
+};
+export {
+  q as default
+};
+//# sourceMappingURL=Select.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"Select.js","sources":["../../../../../src/ui/primitives/Select/Select.tsx"],"sourcesContent":["import React, { useId } from \"react\";\nimport type { SelectModel } from \"@tramo-digital/types\";\nimport Frame from \"../Frame/Frame\";\nimport styles from \"./Select.module.css\";\n\nexport interface SelectProps {\n  id?: SelectModel[\"id\"];\n  data: SelectModel[\"data\"];\n  events?: SelectModel[\"events\"];\n  tokens?: SelectModel[\"tokens\"];\n  className?: SelectModel[\"className\"];\n  colorPalette?: SelectModel[\"colorPalette\"];\n  colorSource?: SelectModel[\"colorSource\"];\n  customColor?: SelectModel[\"customColor\"];\n}\n\nconst Select: React.FC<SelectProps> = ({\n  data,\n  events,\n  tokens,\n  className,\n  colorPalette,\n  colorSource,\n  customColor,\n}) => {\n  if (!data) return null;\n  const _fingerprint = \"caa5f545bb15c8f65bae4b5c24e7d5e4\";\n\n  const {\n    name,\n    options = [],\n    placeholder,\n    required = false,\n    disabled = false,\n    multiple = false,\n    value,\n    id,\n    errorMessage,\n  } = data;\n\n  const generatedId = useId();\n  const fieldId = id ?? name ?? generatedId;\n  const hasError = !!errorMessage;\n\n  const tokenStyles = {\n    ...(tokens?.color?.background && {\n      \"--select-color-background\": tokens.color.background.default,\n    }),\n    ...(tokens?.color?.border && {\n      \"--select-color-border\": tokens.color.border.default,\n    }),\n    ...(tokens?.color?.borderFocus && {\n      \"--select-color-border-focus\": tokens.color.borderFocus.default,\n    }),\n    ...(tokens?.color?.borderError && {\n      \"--select-color-border-error\": tokens.color.borderError.default,\n    }),\n    ...(tokens?.color?.text && {\n      \"--select-color-text\": tokens.color.text.default,\n    }),\n    ...(tokens?.color?.placeholder && {\n      \"--select-color-placeholder\": tokens.color.placeholder.default,\n    }),\n    ...(tokens?.color?.chevron && {\n      \"--select-color-chevron\": tokens.color.chevron.default,\n    }),\n    ...(tokens?.spacing?.padding && {\n      \"--select-spacing-padding\": tokens.spacing.padding.default,\n    }),\n    ...(tokens?.border?.borderRadius && {\n      \"--select-border-radius\": tokens.border.borderRadius.default,\n    }),\n    ...(tokens?.border?.borderWidth && {\n      \"--select-border-width\": tokens.border.borderWidth.default,\n    }),\n    ...(tokens?.typography?.fontSize && {\n      \"--select-font-size\": tokens.typography.fontSize.default,\n    }),\n  };\n\n  const handleChange = (e: React.ChangeEvent<HTMLSelectElement>) => {\n    if (!events?.onChange) return;\n    if (multiple) {\n      const selectedValues = Array.from(\n        e.target.selectedOptions,\n        (option) => option.value,\n      );\n      events.onChange(selectedValues, e);\n    } else {\n      events.onChange(e.target.value, e);\n    }\n  };\n\n  return (\n    <Frame\n      data={{ as: \"div\" }}\n      data-tui-primitive=\"base\"\n      data-tui-dynamic-states=\"default\"\n      colorPalette={colorPalette}\n      colorSource={colorSource}\n      customColor={customColor}\n      className={[\n        styles.selectWrapper,\n        hasError ? styles.hasError : \"\",\n        disabled ? styles.disabled : \"\",\n        multiple ? styles.multiple : \"\",\n        className ?? \"\",\n      ]\n        .filter(Boolean)\n        .join(\" \")}\n      style={tokenStyles as React.CSSProperties}\n    >\n      <select\n        id={fieldId}\n        name={name}\n        multiple={multiple}\n        value={value}\n        required={required}\n        disabled={disabled}\n        aria-required={required}\n        aria-disabled={disabled}\n        aria-invalid={hasError}\n        className={styles.select}\n        onChange={handleChange}\n        onBlur={events?.onBlur}\n        onFocus={events?.onFocus}\n      >\n        {placeholder && !multiple && (\n          <option value=\"\" disabled>\n            {placeholder}\n          </option>\n        )}\n        {options.map((opt, idx) => (\n          <option key={idx} value={opt.value} disabled={opt.disabled}>\n            {opt.label}\n          </option>\n        ))}\n      </select>\n      {!multiple && (\n        <span className={styles.chevron} aria-hidden=\"true\">\n          <svg\n            width=\"12\"\n            height=\"8\"\n            viewBox=\"0 0 12 8\"\n            fill=\"none\"\n            xmlns=\"http://www.w3.org/2000/svg\"\n          >\n            <path\n              d=\"M1 1.5L6 6.5L11 1.5\"\n              stroke=\"currentColor\"\n              strokeWidth=\"1.5\"\n              strokeLinecap=\"round\"\n              strokeLinejoin=\"round\"\n            />\n          </svg>\n        </span>\n      )}\n    </Frame>\n  );\n};\n\nexport default Select;\n"],"names":["Select","data","events","tokens","className","colorPalette","colorSource","customColor","name","options","placeholder","required","disabled","multiple","value","id","errorMessage","generatedId","useId","fieldId","hasError","tokenStyles","handleChange","selectedValues","option","jsxs","Frame","styles","jsx","opt","idx"],"mappings":"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"}

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

@@ -0,0 +1,16 @@
+const e = "_5bVftmR9", s = "TQtxkk8c", t = "xVuzRzFe", c = "g2uj7cIy", r = "-HiEKu0W", o = {
+  selectWrapper: e,
+  select: s,
+  disabled: t,
+  hasError: c,
+  chevron: r
+};
+export {
+  r as chevron,
+  o as default,
+  t as disabled,
+  c as hasError,
+  s as select,
+  e as selectWrapper
+};
+//# sourceMappingURL=Select.module.css.js.map

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

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

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

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

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

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

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

@@ -0,0 +1,39 @@
+import { jsx as p } from "react/jsx-runtime";
+import l from "../Frame/Frame.js";
+import m from "./Separator.module.css.js";
+const u = ({
+  className: a,
+  data: t,
+  tokens: r,
+  colorPalette: i,
+  colorSource: e,
+  customColor: n
+}) => {
+  const o = t?.orientation || "horizontal", s = {
+    ...r?.color?.border && {
+      "--separator-color-border": r.color.border.default
+    },
+    ...r?.spacing?.margin && {
+      "--separator-margin": r.spacing.margin.default
+    }
+  };
+  return /* @__PURE__ */ p(
+    l,
+    {
+      data: { as: "hr" },
+      role: "separator",
+      "data-tui-primitive": "base",
+      "data-orientation": o,
+      "aria-orientation": o,
+      colorPalette: i,
+      colorSource: e,
+      customColor: n,
+      className: `${m.tuiSeparator} ${a || ""}`,
+      style: s
+    }
+  );
+};
+export {
+  u as default
+};
+//# sourceMappingURL=Separator.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"Separator.js","sources":["../../../../../src/ui/primitives/Separator/Separator.tsx"],"sourcesContent":["import type { SeparatorModel } from \"@tramo-digital/types\";\nimport React from \"react\";\nimport Frame from \"../Frame/Frame\";\nimport styles from \"./Separator.module.css\";\n\nexport interface SeparatorProps extends SeparatorModel {\n  className?: string;\n}\n\nconst Separator: React.FC<SeparatorProps> = ({\n  className,\n  data,\n  tokens,\n  colorPalette,\n  colorSource,\n  customColor,\n}) => {\n  const _fingerprint = \"fa9daf77b60a47ed736407775d575278\";\n\n  const orientation = data?.orientation || \"horizontal\";\n\n  const tokenStyles = {\n    ...(tokens?.color?.border && {\n      \"--separator-color-border\": tokens.color.border.default,\n    }),\n    ...(tokens?.spacing?.margin && {\n      \"--separator-margin\": tokens.spacing.margin.default,\n    }),\n  };\n\n  return (\n    <Frame\n      data={{ as: \"hr\" }}\n      role=\"separator\"\n      data-tui-primitive=\"base\"\n      data-orientation={orientation}\n      aria-orientation={orientation}\n      colorPalette={colorPalette}\n      colorSource={colorSource}\n      customColor={customColor}\n      className={`${styles.tuiSeparator} ${className ? className : \"\"}`}\n      style={tokenStyles as React.CSSProperties}\n    />\n  );\n};\n\nexport default Separator;\n"],"names":["Separator","className","data","tokens","colorPalette","colorSource","customColor","orientation","tokenStyles","jsx","Frame","styles"],"mappings":";;;AASA,MAAMA,IAAsC,CAAC;AAAA,EAC3C,WAAAC;AAAA,EACA,MAAAC;AAAA,EACA,QAAAC;AAAA,EACA,cAAAC;AAAA,EACA,aAAAC;AAAA,EACA,aAAAC;AACF,MAAM;AAGJ,QAAMC,IAAcL,GAAM,eAAe,cAEnCM,IAAc;AAAA,IAClB,GAAIL,GAAQ,OAAO,UAAU;AAAA,MAC3B,4BAA4BA,EAAO,MAAM,OAAO;AAAA,IAAA;AAAA,IAElD,GAAIA,GAAQ,SAAS,UAAU;AAAA,MAC7B,sBAAsBA,EAAO,QAAQ,OAAO;AAAA,IAAA;AAAA,EAC9C;AAGF,SACE,gBAAAM;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,MAAM,EAAE,IAAI,KAAA;AAAA,MACZ,MAAK;AAAA,MACL,sBAAmB;AAAA,MACnB,oBAAkBH;AAAA,MAClB,oBAAkBA;AAAA,MAClB,cAAAH;AAAA,MACA,aAAAC;AAAA,MACA,aAAAC;AAAA,MACA,WAAW,GAAGK,EAAO,YAAY,IAAIV,KAAwB,EAAE;AAAA,MAC/D,OAAOO;AAAA,IAAA;AAAA,EAAA;AAGb;"}

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

@@ -0,0 +1,8 @@
+const t = "nYITx9F-", a = {
+  tuiSeparator: t
+};
+export {
+  a as default,
+  t as tuiSeparator
+};
+//# sourceMappingURL=Separator.module.css.js.map

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

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

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

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

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

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

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

@@ -0,0 +1,83 @@
+import { jsx as d } from "react/jsx-runtime";
+import { useMemo as u } from "react";
+import w from "../Frame/Frame.js";
+import o from "./TextBlock.module.css.js";
+const B = ({
+  data: r,
+  tokens: t,
+  children: e,
+  className: p,
+  colorPalette: y,
+  colorSource: l,
+  customColor: g,
+  ...h
+}) => {
+  if (!r) return null;
+  const { as: x = "p", text: c = "", alignment: a } = r, f = u(
+    () => ({
+      ...t?.color?.text && {
+        "--text-block-color": t.color.text.default
+      },
+      ...t?.typography?.font && {
+        "--text-block-font": t.typography.font.default
+      },
+      ...t?.typography?.fontSize && {
+        "--text-block-font-size": t.typography.fontSize.default
+      },
+      ...t?.typography?.fontWeight && {
+        "--text-block-font-weight": t.typography.fontWeight.default
+      },
+      ...t?.typography?.lineHeight && {
+        "--text-block-line-height": t.typography.lineHeight.default
+      },
+      ...t?.typography?.letterSpacing && {
+        "--text-block-letter-spacing": t.typography.letterSpacing.default
+      },
+      ...t?.typography?.textAlign && {
+        "--text-block-text-align": t.typography.textAlign.default
+      },
+      ...t?.typography?.textTransform && {
+        "--text-block-text-transform": t.typography.textTransform.default
+      },
+      ...t?.typography?.textDecoration && {
+        "--text-block-text-decoration": t.typography.textDecoration.default
+      },
+      ...t?.typography?.textOverflow && {
+        "--text-block-text-overflow": t.typography.textOverflow.default
+      },
+      ...t?.typography?.whiteSpace && {
+        "--text-block-white-space": t.typography.whiteSpace.default
+      },
+      ...t?.typography?.wordBreak && {
+        "--text-block-word-break": t.typography.wordBreak.default
+      },
+      ...t?.typography?.wordWrap && {
+        "--text-block-word-wrap": t.typography.wordWrap.default
+      },
+      ...t?.typography?.wordSpacing && {
+        "--text-block-word-spacing": t.typography.wordSpacing.default
+      },
+      ...t?.typography?.textShadow && {
+        "--text-block-text-shadow": t.typography.textShadow.default
+      }
+    }),
+    [t]
+  ), i = a ? o[`textblock-${a}`] : "";
+  return /* @__PURE__ */ d(
+    w,
+    {
+      data: { as: x },
+      colorPalette: y,
+      colorSource: l,
+      customColor: g,
+      style: f,
+      className: `${o.tuiTextBlock} ${i} ${p || ""}`,
+      ...h,
+      children: e ?? c
+    }
+  );
+};
+export {
+  B as default
+};
+//# sourceMappingURL=TextBlock.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"TextBlock.js","sources":["../../../../../src/ui/primitives/TextBlock/TextBlock.tsx"],"sourcesContent":["import type { TextBlockModel } from \"@tramo-digital/types\";\nimport React, { useMemo } from \"react\";\nimport Frame from \"../Frame/Frame\";\nimport styles from \"./TextBlock.module.css\";\n\nexport interface TextBlockProps extends React.HTMLAttributes<HTMLElement> {\n  id?: TextBlockModel[\"id\"];\n  children?: React.ReactNode;\n  data: TextBlockModel[\"data\"];\n  events?: TextBlockModel[\"events\"];\n  tokens?: TextBlockModel[\"tokens\"];\n  className?: string;\n  colorPalette?: TextBlockModel[\"colorPalette\"];\n  colorSource?: TextBlockModel[\"colorSource\"];\n  customColor?: TextBlockModel[\"customColor\"];\n}\n\nconst TextBlock: React.FC<TextBlockProps> = ({\n  data,\n  tokens,\n  children,\n  className,\n  colorPalette,\n  colorSource,\n  customColor,\n  ...rest\n}) => {\n  if (!data) return null;\n\n  const _fingerprint = \"0559228e4cad64a1a72a9fbdb98aa134\";\n  const { as = \"p\", text = \"\", alignment } = data;\n  const tokensStyles = useMemo(\n    () => ({\n      ...(tokens?.color?.text && {\n        \"--text-block-color\": tokens.color.text.default,\n      }),\n      ...(tokens?.typography?.font && {\n        \"--text-block-font\": tokens.typography.font.default,\n      }),\n      ...(tokens?.typography?.fontSize && {\n        \"--text-block-font-size\": tokens.typography.fontSize.default,\n      }),\n      ...(tokens?.typography?.fontWeight && {\n        \"--text-block-font-weight\": tokens.typography.fontWeight.default,\n      }),\n      ...(tokens?.typography?.lineHeight && {\n        \"--text-block-line-height\": tokens.typography.lineHeight.default,\n      }),\n      ...(tokens?.typography?.letterSpacing && {\n        \"--text-block-letter-spacing\": tokens.typography.letterSpacing.default,\n      }),\n      ...(tokens?.typography?.textAlign && {\n        \"--text-block-text-align\": tokens.typography.textAlign.default,\n      }),\n      ...(tokens?.typography?.textTransform && {\n        \"--text-block-text-transform\": tokens.typography.textTransform.default,\n      }),\n      ...(tokens?.typography?.textDecoration && {\n        \"--text-block-text-decoration\":\n          tokens.typography.textDecoration.default,\n      }),\n      ...(tokens?.typography?.textOverflow && {\n        \"--text-block-text-overflow\": tokens.typography.textOverflow.default,\n      }),\n      ...(tokens?.typography?.whiteSpace && {\n        \"--text-block-white-space\": tokens.typography.whiteSpace.default,\n      }),\n      ...(tokens?.typography?.wordBreak && {\n        \"--text-block-word-break\": tokens.typography.wordBreak.default,\n      }),\n      ...(tokens?.typography?.wordWrap && {\n        \"--text-block-word-wrap\": tokens.typography.wordWrap.default,\n      }),\n      ...(tokens?.typography?.wordSpacing && {\n        \"--text-block-word-spacing\": tokens.typography.wordSpacing.default,\n      }),\n      ...(tokens?.typography?.textShadow && {\n        \"--text-block-text-shadow\": tokens.typography.textShadow.default,\n      }),\n    }),\n    [tokens],\n  );\n\n  const textAlignment = alignment ? styles[`textblock-${alignment}`] : \"\";\n\n  return (\n    <Frame\n      data={{ as }}\n      colorPalette={colorPalette}\n      colorSource={colorSource}\n      customColor={customColor}\n      style={tokensStyles as React.CSSProperties}\n      className={`${styles.tuiTextBlock} ${textAlignment} ${className ? className : \"\"}`}\n      {...rest}\n    >\n      {children ?? text}\n    </Frame>\n  );\n};\n\nexport default TextBlock;\n"],"names":["TextBlock","data","tokens","children","className","colorPalette","colorSource","customColor","rest","as","text","alignment","tokensStyles","useMemo","textAlignment","styles","jsx","Frame"],"mappings":";;;;AAiBA,MAAMA,IAAsC,CAAC;AAAA,EAC3C,MAAAC;AAAA,EACA,QAAAC;AAAA,EACA,UAAAC;AAAA,EACA,WAAAC;AAAA,EACA,cAAAC;AAAA,EACA,aAAAC;AAAA,EACA,aAAAC;AAAA,EACA,GAAGC;AACL,MAAM;AACJ,MAAI,CAACP,EAAM,QAAO;AAGlB,QAAM,EAAE,IAAAQ,IAAK,KAAK,MAAAC,IAAO,IAAI,WAAAC,MAAcV,GACrCW,IAAeC;AAAA,IACnB,OAAO;AAAA,MACL,GAAIX,GAAQ,OAAO,QAAQ;AAAA,QACzB,sBAAsBA,EAAO,MAAM,KAAK;AAAA,MAAA;AAAA,MAE1C,GAAIA,GAAQ,YAAY,QAAQ;AAAA,QAC9B,qBAAqBA,EAAO,WAAW,KAAK;AAAA,MAAA;AAAA,MAE9C,GAAIA,GAAQ,YAAY,YAAY;AAAA,QAClC,0BAA0BA,EAAO,WAAW,SAAS;AAAA,MAAA;AAAA,MAEvD,GAAIA,GAAQ,YAAY,cAAc;AAAA,QACpC,4BAA4BA,EAAO,WAAW,WAAW;AAAA,MAAA;AAAA,MAE3D,GAAIA,GAAQ,YAAY,cAAc;AAAA,QACpC,4BAA4BA,EAAO,WAAW,WAAW;AAAA,MAAA;AAAA,MAE3D,GAAIA,GAAQ,YAAY,iBAAiB;AAAA,QACvC,+BAA+BA,EAAO,WAAW,cAAc;AAAA,MAAA;AAAA,MAEjE,GAAIA,GAAQ,YAAY,aAAa;AAAA,QACnC,2BAA2BA,EAAO,WAAW,UAAU;AAAA,MAAA;AAAA,MAEzD,GAAIA,GAAQ,YAAY,iBAAiB;AAAA,QACvC,+BAA+BA,EAAO,WAAW,cAAc;AAAA,MAAA;AAAA,MAEjE,GAAIA,GAAQ,YAAY,kBAAkB;AAAA,QACxC,gCACEA,EAAO,WAAW,eAAe;AAAA,MAAA;AAAA,MAErC,GAAIA,GAAQ,YAAY,gBAAgB;AAAA,QACtC,8BAA8BA,EAAO,WAAW,aAAa;AAAA,MAAA;AAAA,MAE/D,GAAIA,GAAQ,YAAY,cAAc;AAAA,QACpC,4BAA4BA,EAAO,WAAW,WAAW;AAAA,MAAA;AAAA,MAE3D,GAAIA,GAAQ,YAAY,aAAa;AAAA,QACnC,2BAA2BA,EAAO,WAAW,UAAU;AAAA,MAAA;AAAA,MAEzD,GAAIA,GAAQ,YAAY,YAAY;AAAA,QAClC,0BAA0BA,EAAO,WAAW,SAAS;AAAA,MAAA;AAAA,MAEvD,GAAIA,GAAQ,YAAY,eAAe;AAAA,QACrC,6BAA6BA,EAAO,WAAW,YAAY;AAAA,MAAA;AAAA,MAE7D,GAAIA,GAAQ,YAAY,cAAc;AAAA,QACpC,4BAA4BA,EAAO,WAAW,WAAW;AAAA,MAAA;AAAA,IAC3D;AAAA,IAEF,CAACA,CAAM;AAAA,EAAA,GAGHY,IAAgBH,IAAYI,EAAO,aAAaJ,CAAS,EAAE,IAAI;AAErE,SACE,gBAAAK;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,MAAM,EAAE,IAAAR,EAAA;AAAA,MACR,cAAAJ;AAAA,MACA,aAAAC;AAAA,MACA,aAAAC;AAAA,MACA,OAAOK;AAAA,MACP,WAAW,GAAGG,EAAO,YAAY,IAAID,CAAa,IAAIV,KAAwB,EAAE;AAAA,MAC/E,GAAGI;AAAA,MAEH,UAAAL,KAAYO;AAAA,IAAA;AAAA,EAAA;AAGnB;"}

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

@@ -0,0 +1,17 @@
+const t = "r2rXkpCt", e = "_0-8DBaz-", c = "SArirr-f", o = "_6IjEF1jG", l = {
+  tuiTextBlock: t,
+  "textblock-left": "_0-8DBaz-",
+  textblockLeft: e,
+  "textblock-center": "SArirr-f",
+  textblockCenter: c,
+  "textblock-right": "_6IjEF1jG",
+  textblockRight: o
+};
+export {
+  l as default,
+  c as textblockCenter,
+  e as textblockLeft,
+  o as textblockRight,
+  t as tuiTextBlock
+};
+//# sourceMappingURL=TextBlock.module.css.js.map

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

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

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

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

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

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

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

@@ -0,0 +1,70 @@
+import { jsx as s } from "react/jsx-runtime";
+import b from "../TextBlock/TextBlock.js";
+import o from "./TextBody.module.css.js";
+const $ = ({
+  children: p,
+  data: e,
+  tokens: t,
+  className: y = "",
+  colorPalette: i,
+  colorSource: l,
+  customColor: g,
+  ...f
+}) => {
+  if (!e) return null;
+  const {
+    as: h = "p",
+    size: r = "md",
+    weight: a = "regular",
+    alignment: d,
+    text: x
+  } = e || {}, c = {
+    ...t?.typography?.fontFamily && {
+      "--text-body-fontfamily": t.typography.fontFamily.default
+    },
+    ...t?.color?.text && {
+      "--text-body-color": t.color.text.default
+    },
+    ...t?.typography?.fontSize && {
+      "--text-body-font-size": t.typography.fontSize.default
+    },
+    ...t?.typography?.fontWeight && {
+      "--text-body-font-weight": t.typography.fontWeight.default
+    },
+    ...t?.typography?.lineHeight && {
+      "--text-body-line-height": t.typography.lineHeight.default
+    },
+    ...t?.typography?.letterSpacing && {
+      "--text-body-letter-spacing": t.typography.letterSpacing.default
+    },
+    ...t?.typography?.textTransform && {
+      "--text-body-text-transform": t.typography.textTransform.default
+    },
+    ...t?.typography?.textDecoration && {
+      "--text-body-text-decoration": t.typography.textDecoration.default
+    }
+  }, n = `body-${r}`, m = a, u = `${o.tuiTextBody} ${o[n]} ${o[m]} ${y || ""}`;
+  return /* @__PURE__ */ s(
+    b,
+    {
+      data: {
+        as: h,
+        alignment: d,
+        weight: a,
+        size: r,
+        text: x
+      },
+      colorPalette: i,
+      colorSource: l,
+      customColor: g,
+      className: u,
+      style: c,
+      ...f,
+      children: p
+    }
+  );
+};
+export {
+  $ as default
+};
+//# sourceMappingURL=TextBody.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"TextBody.js","sources":["../../../../../src/ui/primitives/TextBody/TextBody.tsx"],"sourcesContent":["import type { TextBodyModel } from \"@tramo-digital/types\";\nimport React from \"react\";\nimport TextBlock from \"../TextBlock/TextBlock\";\nimport styles from \"./TextBody.module.css\";\n\nexport type TextBodyProps = Omit<TextBodyModel, \"_type\"> &\n  React.HTMLAttributes<HTMLElement> & {\n    children?: React.ReactNode;\n  };\n\nconst TextBody: React.FC<TextBodyProps> = ({\n  children,\n  data,\n  tokens,\n  className = \"\",\n  colorPalette,\n  colorSource,\n  customColor,\n  ...rest\n}) => {\n  if (!data) return null;\n  const _fingerprint = \"0235377ad2caff647d93dff0dd5a5916\";\n\n  const {\n    as = \"p\",\n    size = \"md\",\n    weight = \"regular\",\n    alignment,\n    text,\n  } = data || {};\n\n  const tokenStyles = {\n    ...(tokens?.typography?.fontFamily && {\n      \"--text-body-fontfamily\": tokens.typography.fontFamily.default,\n    }),\n    ...(tokens?.color?.text && {\n      \"--text-body-color\": tokens.color.text.default,\n    }),\n    ...(tokens?.typography?.fontSize && {\n      \"--text-body-font-size\": tokens.typography.fontSize.default,\n    }),\n    ...(tokens?.typography?.fontWeight && {\n      \"--text-body-font-weight\": tokens.typography.fontWeight.default,\n    }),\n    ...(tokens?.typography?.lineHeight && {\n      \"--text-body-line-height\": tokens.typography.lineHeight.default,\n    }),\n    ...(tokens?.typography?.letterSpacing && {\n      \"--text-body-letter-spacing\": tokens.typography.letterSpacing.default,\n    }),\n    ...(tokens?.typography?.textTransform && {\n      \"--text-body-text-transform\": tokens.typography.textTransform.default,\n    }),\n    ...(tokens?.typography?.textDecoration && {\n      \"--text-body-text-decoration\": tokens.typography.textDecoration.default,\n    }),\n  };\n\n  const cssSize = `body-${size}` as keyof typeof styles;\n  const cssWeight = weight as keyof typeof styles;\n  const rootClassName = `${styles.tuiTextBody} ${styles[cssSize]} ${styles[cssWeight]} ${className ? className : \"\"}`;\n\n  return (\n    <TextBlock\n      data={{\n        as,\n        alignment,\n        weight,\n        size,\n        text,\n      }}\n      colorPalette={colorPalette}\n      colorSource={colorSource}\n      customColor={customColor}\n      className={rootClassName}\n      style={tokenStyles as React.CSSProperties}\n      {...rest}\n    >\n      {children}\n    </TextBlock>\n  );\n};\n\nexport default TextBody;\n"],"names":["TextBody","children","data","tokens","className","colorPalette","colorSource","customColor","rest","as","size","weight","alignment","text","tokenStyles","cssSize","cssWeight","rootClassName","styles","jsx","TextBlock"],"mappings":";;;AAUA,MAAMA,IAAoC,CAAC;AAAA,EACzC,UAAAC;AAAA,EACA,MAAAC;AAAA,EACA,QAAAC;AAAA,EACA,WAAAC,IAAY;AAAA,EACZ,cAAAC;AAAA,EACA,aAAAC;AAAA,EACA,aAAAC;AAAA,EACA,GAAGC;AACL,MAAM;AACJ,MAAI,CAACN,EAAM,QAAO;AAGlB,QAAM;AAAA,IACJ,IAAAO,IAAK;AAAA,IACL,MAAAC,IAAO;AAAA,IACP,QAAAC,IAAS;AAAA,IACT,WAAAC;AAAA,IACA,MAAAC;AAAA,EAAA,IACEX,KAAQ,CAAA,GAENY,IAAc;AAAA,IAClB,GAAIX,GAAQ,YAAY,cAAc;AAAA,MACpC,0BAA0BA,EAAO,WAAW,WAAW;AAAA,IAAA;AAAA,IAEzD,GAAIA,GAAQ,OAAO,QAAQ;AAAA,MACzB,qBAAqBA,EAAO,MAAM,KAAK;AAAA,IAAA;AAAA,IAEzC,GAAIA,GAAQ,YAAY,YAAY;AAAA,MAClC,yBAAyBA,EAAO,WAAW,SAAS;AAAA,IAAA;AAAA,IAEtD,GAAIA,GAAQ,YAAY,cAAc;AAAA,MACpC,2BAA2BA,EAAO,WAAW,WAAW;AAAA,IAAA;AAAA,IAE1D,GAAIA,GAAQ,YAAY,cAAc;AAAA,MACpC,2BAA2BA,EAAO,WAAW,WAAW;AAAA,IAAA;AAAA,IAE1D,GAAIA,GAAQ,YAAY,iBAAiB;AAAA,MACvC,8BAA8BA,EAAO,WAAW,cAAc;AAAA,IAAA;AAAA,IAEhE,GAAIA,GAAQ,YAAY,iBAAiB;AAAA,MACvC,8BAA8BA,EAAO,WAAW,cAAc;AAAA,IAAA;AAAA,IAEhE,GAAIA,GAAQ,YAAY,kBAAkB;AAAA,MACxC,+BAA+BA,EAAO,WAAW,eAAe;AAAA,IAAA;AAAA,EAClE,GAGIY,IAAU,QAAQL,CAAI,IACtBM,IAAYL,GACZM,IAAgB,GAAGC,EAAO,WAAW,IAAIA,EAAOH,CAAO,CAAC,IAAIG,EAAOF,CAAS,CAAC,IAAIZ,KAAwB,EAAE;AAEjH,SACE,gBAAAe;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,MAAM;AAAA,QACJ,IAAAX;AAAA,QACA,WAAAG;AAAA,QACA,QAAAD;AAAA,QACA,MAAAD;AAAA,QACA,MAAAG;AAAA,MAAA;AAAA,MAEF,cAAAR;AAAA,MACA,aAAAC;AAAA,MACA,aAAAC;AAAA,MACA,WAAWU;AAAA,MACX,OAAOH;AAAA,MACN,GAAGN;AAAA,MAEH,UAAAP;AAAA,IAAA;AAAA,EAAA;AAGP;"}

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

@@ -0,0 +1,23 @@
+const o = "D5tGkCQc", d = "_-6oF6vHV", t = "JQFm52go", y = "rbyguXn-", b = "yMH42Ax-", s = "CddC7M5O", n = "MA3eKnMV", M = {
+  tuiTextBody: o,
+  md: d,
+  bold: t,
+  light: y,
+  "body-md": "yMH42Ax-",
+  bodyMd: b,
+  "body-lg": "CddC7M5O",
+  bodyLg: s,
+  "body-sm": "MA3eKnMV",
+  bodySm: n
+};
+export {
+  s as bodyLg,
+  b as bodyMd,
+  n as bodySm,
+  t as bold,
+  M as default,
+  y as light,
+  d as md,
+  o as tuiTextBody
+};
+//# sourceMappingURL=TextBody.module.css.js.map

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

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

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

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

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

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

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

@@ -0,0 +1,52 @@
+import { jsx as h } from "react/jsx-runtime";
+import $ from "../TextBlock/TextBlock.js";
+import o from "./TextDisplay.module.css.js";
+const F = ({
+  children: r,
+  data: l,
+  events: i,
+  tokens: t,
+  className: e,
+  colorPalette: y,
+  colorSource: p,
+  customColor: c
+}) => {
+  if (!l) return null;
+  const {
+    size: s = "md",
+    weight: a = "regular",
+    text: f = "",
+    alignment: m = "left",
+    as: n = "h1"
+  } = l, x = {
+    ...t?.color?.text && {
+      "--text-display-color": t.color.text.default
+    },
+    ...t?.typography?.fontFamily && {
+      "--text-display-fontfamily": t.typography.fontFamily.default
+    }
+  }, u = `display-${s}`, d = a, g = `${o.tuiTextDisplay} ${o[u]} ${o[d]} ${e || ""}`;
+  return /* @__PURE__ */ h(
+    $,
+    {
+      data: {
+        as: n,
+        alignment: m,
+        weight: a,
+        size: s,
+        text: f
+      },
+      colorPalette: y,
+      colorSource: p,
+      customColor: c,
+      className: g,
+      style: x,
+      events: i,
+      children: r
+    }
+  );
+};
+export {
+  F as default
+};
+//# sourceMappingURL=TextDisplay.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"TextDisplay.js","sources":["../../../../../src/ui/primitives/TextDisplay/TextDisplay.tsx"],"sourcesContent":["import type { TextDisplayModel } from \"@tramo-digital/types\";\nimport React from \"react\";\nimport TextBlock from \"../TextBlock/TextBlock\";\nimport styles from \"./TextDisplay.module.css\";\n\nexport interface TextDisplayProps extends TextDisplayModel {\n  children?: React.ReactNode;\n}\n\nconst TextDisplay: React.FC<TextDisplayProps> = ({\n  children,\n  data,\n  events,\n  tokens,\n  className,\n  colorPalette,\n  colorSource,\n  customColor,\n}) => {\n  if (!data) return null;\n  const _fingerprint = \"3f8ae0cec3b9f2ae296963957087085d\";\n  const {\n    size = \"md\",\n    weight = \"regular\",\n    text = \"\",\n    alignment = \"left\",\n    as = \"h1\",\n  } = data;\n\n  const tokenStyles = {\n    ...(tokens?.color?.text && {\n      \"--text-display-color\": tokens.color.text.default,\n    }),\n    ...(tokens?.typography?.fontFamily && {\n      \"--text-display-fontfamily\": tokens.typography.fontFamily.default,\n    }),\n  };\n\n  const cssSize = `display-${size}` as keyof typeof styles;\n  const cssWeight = weight as keyof typeof styles;\n  const rootClassName = `${styles.tuiTextDisplay} ${styles[cssSize]} ${styles[cssWeight]} ${className ? className : \"\"}`;\n\n  return (\n    <TextBlock\n      data={{\n        as,\n        alignment,\n        weight,\n        size,\n        text,\n      }}\n      colorPalette={colorPalette}\n      colorSource={colorSource}\n      customColor={customColor}\n      className={rootClassName}\n      style={tokenStyles as React.CSSProperties}\n      events={events}\n    >\n      {children}\n    </TextBlock>\n  );\n};\n\nexport default TextDisplay;\n"],"names":["TextDisplay","children","data","events","tokens","className","colorPalette","colorSource","customColor","size","weight","text","alignment","as","tokenStyles","cssSize","cssWeight","rootClassName","styles","jsx","TextBlock"],"mappings":";;;AASA,MAAMA,IAA0C,CAAC;AAAA,EAC/C,UAAAC;AAAA,EACA,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;AAElB,QAAM;AAAA,IACJ,MAAAO,IAAO;AAAA,IACP,QAAAC,IAAS;AAAA,IACT,MAAAC,IAAO;AAAA,IACP,WAAAC,IAAY;AAAA,IACZ,IAAAC,IAAK;AAAA,EAAA,IACHX,GAEEY,IAAc;AAAA,IAClB,GAAIV,GAAQ,OAAO,QAAQ;AAAA,MACzB,wBAAwBA,EAAO,MAAM,KAAK;AAAA,IAAA;AAAA,IAE5C,GAAIA,GAAQ,YAAY,cAAc;AAAA,MACpC,6BAA6BA,EAAO,WAAW,WAAW;AAAA,IAAA;AAAA,EAC5D,GAGIW,IAAU,WAAWN,CAAI,IACzBO,IAAYN,GACZO,IAAgB,GAAGC,EAAO,cAAc,IAAIA,EAAOH,CAAO,CAAC,IAAIG,EAAOF,CAAS,CAAC,IAAIX,KAAwB,EAAE;AAEpH,SACE,gBAAAc;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,MAAM;AAAA,QACJ,IAAAP;AAAA,QACA,WAAAD;AAAA,QACA,QAAAF;AAAA,QACA,MAAAD;AAAA,QACA,MAAAE;AAAA,MAAA;AAAA,MAEF,cAAAL;AAAA,MACA,aAAAC;AAAA,MACA,aAAAC;AAAA,MACA,WAAWS;AAAA,MACX,OAAOH;AAAA,MACP,QAAAX;AAAA,MAEC,UAAAF;AAAA,IAAA;AAAA,EAAA;AAGP;"}

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

@@ -0,0 +1,23 @@
+const s = "MVMwu4V-", l = "_5yd8Mlln", t = "t-r7CqWu", d = "UhChus6f", a = "kKAZ63c9", i = "_-24I-Qyn", y = "-cAKnjbY", n = {
+  tuiTextDisplay: s,
+  light: l,
+  regular: t,
+  bold: d,
+  "display-sm": "kKAZ63c9",
+  displaySm: a,
+  "display-md": "_-24I-Qyn",
+  displayMd: i,
+  "display-lg": "-cAKnjbY",
+  displayLg: y
+};
+export {
+  d as bold,
+  n as default,
+  y as displayLg,
+  i as displayMd,
+  a as displaySm,
+  l as light,
+  t as regular,
+  s as tuiTextDisplay
+};
+//# sourceMappingURL=TextDisplay.module.css.js.map

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

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

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

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

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

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

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

@@ -0,0 +1,43 @@
+import { jsx as w } from "react/jsx-runtime";
+import $ from "../TextBlock/TextBlock.js";
+import t from "./TextEyebrow.module.css.js";
+const h = ({
+  children: c,
+  data: e,
+  tokens: o,
+  className: r = "",
+  colorPalette: n,
+  colorSource: i,
+  customColor: a
+}) => {
+  if (!e) return null;
+  const { size: s = "md", weight: l = "regular", alignment: x, text: m } = e, u = {
+    ...o?.color?.text && {
+      "--text-eyebrow-color": o.color.text.default
+    }
+  }, f = {
+    size: s,
+    weight: l,
+    alignment: x,
+    text: m
+  }, y = `eyebrow-${s}`, p = l;
+  return /* @__PURE__ */ w(
+    $,
+    {
+      data: {
+        as: "span",
+        ...f
+      },
+      colorPalette: n,
+      colorSource: i,
+      customColor: a,
+      className: `${t.tuiTextEyebrow} ${t[y]} ${t[p]} ${r || ""}`,
+      style: u,
+      children: c
+    }
+  );
+};
+export {
+  h as default
+};
+//# sourceMappingURL=TextEyebrow.js.map