@tcn/ui 0.0.2 → 0.0.4

package/dist/tokens/badge/badge.js

@@ -1,14 +1,14 @@
 import { jsxs as t, jsx as e } from "react/jsx-runtime";
 import h from "react";
-import o from "classnames";
-import { Spacer as s } from "../../stacks/spacer.js";
-import { VStack as u } from "../../stacks/v_stack.js";
+import { clsx as o } from "clsx";
+import { Spacer as u } from "../../stacks/spacer.js";
+import { VStack as c } from "../../stacks/v_stack.js";
 import { ZStack as r } from "../../stacks/z_stack.js";
-import { Bubble as c } from "../bubble/bubble.js";
-import '../../badge.css';const g = "_badge-bubble_7fe9ed5", f = { "badge-bubble": g }, S = h.forwardRef(
+import { Bubble as g } from "../bubble/bubble.js";
+import '../../badge.css';const s = "_badge-bubble_7fe9ed5", f = { "badge-bubble": s }, j = h.forwardRef(
   ({
-    value: a,
-    children: i,
+    value: i,
+    children: a,
     backgroundColor: b,
     textColor: d,
     className: l,
@@ -26,25 +26,25 @@ import '../../badge.css';const g = "_badge-bubble_7fe9ed5", f = { "badge-bubble"
       className: o("badge", l),
       ...n,
       children: [
-        /* @__PURE__ */ e(r, { zIndex: 0, inline: !0, width: "auto", height: "auto", children: i }),
-        /* @__PURE__ */ t(u, { zIndex: 1, height: "100%", width: "auto", children: [
+        /* @__PURE__ */ e(r, { zIndex: 0, inline: !0, width: "auto", height: "auto", children: a }),
+        /* @__PURE__ */ t(c, { zIndex: 1, height: "100%", width: "auto", children: [
           /* @__PURE__ */ e(
-            c,
+            g,
             {
               className: o(f["badge-bubble"], "badge-bubble"),
               backgroundColor: b,
               textColor: d,
               elevate: !0,
-              children: a
+              children: i
             }
           ),
-          /* @__PURE__ */ e(s, { height: "100%" })
+          /* @__PURE__ */ e(u, { height: "100%" })
         ] })
       ]
     }
   )
 );
 export {
-  S as Badge
+  j as Badge
 };
 //# sourceMappingURL=badge.js.map

package/dist/tokens/badge/badge.js.map

@@ -1 +1 @@
-{"version":3,"file":"badge.js","sources":["../../../src/tokens/badge/badge.tsx"],"sourcesContent":["import React, { HTMLAttributes } from 'react';\nimport classNames from 'classnames';\nimport { Spacer } from '../../stacks/spacer.js';\nimport { VStack } from '../../stacks/v_stack.js';\nimport { ZStack } from '../../stacks/z_stack.js';\nimport { Bubble } from '../bubble/bubble.js';\nimport styles from './badge.module.css';\n\nexport interface BadgeProps extends HTMLAttributes<HTMLDivElement> {\n  value: React.ReactNode;\n  backgroundColor?: string;\n  textColor?: string;\n}\n\nexport const Badge = React.forwardRef(\n  (\n    {\n      value,\n      children,\n      backgroundColor,\n      textColor: color,\n      className,\n      ...props\n    }: BadgeProps,\n    ref: React.Ref<HTMLDivElement>\n  ) => {\n    return (\n      <ZStack\n        inline\n        width=\"auto\"\n        height=\"auto\"\n        ref={ref}\n        vAlign=\"end\"\n        hAlign=\"end\"\n        zIndex={0}\n        className={classNames('badge', className)}\n        {...props}\n      >\n        <ZStack zIndex={0} inline width=\"auto\" height=\"auto\">\n          {children}\n        </ZStack>\n        <VStack zIndex={1} height=\"100%\" width=\"auto\">\n          <Bubble\n            className={classNames(styles['badge-bubble'], 'badge-bubble')}\n            backgroundColor={backgroundColor}\n            textColor={color}\n            elevate\n          >\n            {value}\n          </Bubble>\n          <Spacer height=\"100%\" />\n        </VStack>\n      </ZStack>\n    );\n  }\n);\n"],"names":["Badge","React","value","children","backgroundColor","color","className","props","ref","jsxs","ZStack","classNames","jsx","VStack","Bubble","styles","Spacer"],"mappings":";;;;;;;8DAcaA,IAAQC,EAAM;AAAA,EACzB,CACE;AAAA,IACE,OAAAC;AAAA,IACA,UAAAC;AAAA,IACA,iBAAAC;AAAA,IACA,WAAWC;AAAA,IACX,WAAAC;AAAA,IACA,GAAGC;AAAA,EAAA,GAELC,MAGE,gBAAAC;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,QAAM;AAAA,MACN,OAAM;AAAA,MACN,QAAO;AAAA,MACP,KAAAF;AAAA,MACA,QAAO;AAAA,MACP,QAAO;AAAA,MACP,QAAQ;AAAA,MACR,WAAWG,EAAW,SAASL,CAAS;AAAA,MACvC,GAAGC;AAAA,MAEJ,UAAA;AAAA,QAAA,gBAAAK,EAACF,GAAA,EAAO,QAAQ,GAAG,QAAM,IAAC,OAAM,QAAO,QAAO,QAC3C,UAAAP,EAAA,CACH;AAAA,0BACCU,GAAA,EAAO,QAAQ,GAAG,QAAO,QAAO,OAAM,QACrC,UAAA;AAAA,UAAA,gBAAAD;AAAA,YAACE;AAAA,YAAA;AAAA,cACC,WAAWH,EAAWI,EAAO,cAAc,GAAG,cAAc;AAAA,cAC5D,iBAAAX;AAAA,cACA,WAAWC;AAAA,cACX,SAAO;AAAA,cAEN,UAAAH;AAAA,YAAA;AAAA,UAAA;AAAA,UAEH,gBAAAU,EAACI,GAAA,EAAO,QAAO,OAAA,CAAO;AAAA,QAAA,EAAA,CACxB;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAIR;"}
+{"version":3,"file":"badge.js","sources":["../../../src/tokens/badge/badge.tsx"],"sourcesContent":["import React, { HTMLAttributes } from 'react';\nimport { clsx } from 'clsx';\nimport { Spacer } from '../../stacks/spacer.js';\nimport { VStack } from '../../stacks/v_stack.js';\nimport { ZStack } from '../../stacks/z_stack.js';\nimport { Bubble } from '../bubble/bubble.js';\nimport styles from './badge.module.css';\n\nexport interface BadgeProps extends HTMLAttributes<HTMLDivElement> {\n  value: React.ReactNode;\n  backgroundColor?: string;\n  textColor?: string;\n}\n\nexport const Badge = React.forwardRef(\n  (\n    {\n      value,\n      children,\n      backgroundColor,\n      textColor: color,\n      className,\n      ...props\n    }: BadgeProps,\n    ref: React.Ref<HTMLDivElement>\n  ) => {\n    return (\n      <ZStack\n        inline\n        width=\"auto\"\n        height=\"auto\"\n        ref={ref}\n        vAlign=\"end\"\n        hAlign=\"end\"\n        zIndex={0}\n        className={clsx('badge', className)}\n        {...props}\n      >\n        <ZStack zIndex={0} inline width=\"auto\" height=\"auto\">\n          {children}\n        </ZStack>\n        <VStack zIndex={1} height=\"100%\" width=\"auto\">\n          <Bubble\n            className={clsx(styles['badge-bubble'], 'badge-bubble')}\n            backgroundColor={backgroundColor}\n            textColor={color}\n            elevate\n          >\n            {value}\n          </Bubble>\n          <Spacer height=\"100%\" />\n        </VStack>\n      </ZStack>\n    );\n  }\n);\n"],"names":["Badge","React","value","children","backgroundColor","color","className","props","ref","jsxs","ZStack","clsx","jsx","VStack","Bubble","styles","Spacer"],"mappings":";;;;;;;8DAcaA,IAAQC,EAAM;AAAA,EACzB,CACE;AAAA,IACE,OAAAC;AAAA,IACA,UAAAC;AAAA,IACA,iBAAAC;AAAA,IACA,WAAWC;AAAA,IACX,WAAAC;AAAA,IACA,GAAGC;AAAA,EAAA,GAELC,MAGE,gBAAAC;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,QAAM;AAAA,MACN,OAAM;AAAA,MACN,QAAO;AAAA,MACP,KAAAF;AAAA,MACA,QAAO;AAAA,MACP,QAAO;AAAA,MACP,QAAQ;AAAA,MACR,WAAWG,EAAK,SAASL,CAAS;AAAA,MACjC,GAAGC;AAAA,MAEJ,UAAA;AAAA,QAAA,gBAAAK,EAACF,GAAA,EAAO,QAAQ,GAAG,QAAM,IAAC,OAAM,QAAO,QAAO,QAC3C,UAAAP,EAAA,CACH;AAAA,0BACCU,GAAA,EAAO,QAAQ,GAAG,QAAO,QAAO,OAAM,QACrC,UAAA;AAAA,UAAA,gBAAAD;AAAA,YAACE;AAAA,YAAA;AAAA,cACC,WAAWH,EAAKI,EAAO,cAAc,GAAG,cAAc;AAAA,cACtD,iBAAAX;AAAA,cACA,WAAWC;AAAA,cACX,SAAO;AAAA,cAEN,UAAAH;AAAA,YAAA;AAAA,UAAA;AAAA,UAEH,gBAAAU,EAACI,GAAA,EAAO,QAAO,OAAA,CAAO;AAAA,QAAA,EAAA,CACxB;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAIR;"}

package/dist/tokens/bubble/bubble.js

@@ -1,44 +1,43 @@
-import { jsx as m } from "react/jsx-runtime";
-import n from "classnames";
+import { jsx as s } from "react/jsx-runtime";
+import { clsx as m } from "clsx";
 import u from "react";
 import { theme as f } from "../../themes/theme_variables.js";
-import "../../themes/themes/windows_98/windows_98_theme.js";
-import { HStack as p } from "../../stacks/h_stack.js";
-import '../../bubble.css';const d = "_bubble_d3b757e", h = { bubble: d }, N = u.forwardRef(function({
+import { HStack as d } from "../../stacks/h_stack.js";
+import '../../bubble.css';const p = "_bubble_d3b757e", h = { bubble: p }, B = u.forwardRef(function({
   children: e,
   className: t,
   style: o,
   backgroundColor: b = f.accentColor,
-  textColor: r = "#fff",
-  size: l = "md",
+  textColor: l = "#fff",
+  size: r = "md",
   elevate: a = !1,
-  ...s
-}, c) {
+  ...c
+}, n) {
   const i = {
-    "--bubble-text-color": r,
+    "--bubble-text-color": l,
     "--bubble-color": b,
     ...o
   };
-  return /* @__PURE__ */ m(
-    p,
+  return /* @__PURE__ */ s(
+    d,
     {
       inline: !0,
-      className: n(h.bubble, "bubble", t),
+      className: m(h.bubble, "bubble", t),
       width: "auto",
       height: "auto",
-      ref: c,
+      ref: n,
       style: i,
       hAlign: "center",
       vAlign: "center",
-      "data-size": l,
+      "data-size": r,
       "data-elevate": a,
       padding: "4px",
-      ...s,
+      ...c,
       children: e
     }
   );
 });
 export {
-  N as Bubble
+  B as Bubble
 };
 //# sourceMappingURL=bubble.js.map

package/dist/tokens/bubble/bubble.js.map

@@ -1 +1 @@
-{"version":3,"file":"bubble.js","sources":["../../../src/tokens/bubble/bubble.tsx"],"sourcesContent":["import classNames from 'classnames';\nimport React, { HTMLAttributes } from 'react';\nimport styles from './bubble.module.css';\nimport { theme } from '../../themes/index.js';\nimport { HStack } from '../../stacks/h_stack.js';\nimport { Size } from '../../utils/index.js';\n\nexport interface BubbleProps extends HTMLAttributes<HTMLDivElement> {\n  children?: React.ReactNode;\n  backgroundColor?: string;\n  textColor?: string;\n  elevate?: boolean;\n  size?: Size;\n}\n\nexport const Bubble = React.forwardRef(function Bubble(\n  {\n    children,\n    className,\n    style: defaultStyle,\n    backgroundColor = theme.accentColor,\n    textColor = '#fff',\n    size = 'md',\n    elevate = false,\n    ...props\n  }: BubbleProps,\n  ref: React.Ref<HTMLDivElement>\n) {\n  const style = {\n    '--bubble-text-color': textColor,\n    '--bubble-color': backgroundColor,\n    ...defaultStyle,\n  } as React.CSSProperties;\n\n  return (\n    <HStack\n      inline\n      className={classNames(styles.bubble, 'bubble', className)}\n      width=\"auto\"\n      height=\"auto\"\n      ref={ref}\n      style={style}\n      hAlign=\"center\"\n      vAlign=\"center\"\n      data-size={size}\n      data-elevate={elevate}\n      padding=\"4px\"\n      {...props}\n    >\n      {children}\n    </HStack>\n  );\n});\n"],"names":["Bubble","React","children","className","defaultStyle","backgroundColor","theme","textColor","size","elevate","props","ref","style","jsx","HStack","classNames","styles"],"mappings":";;;;;;gDAeaA,IAASC,EAAM,WAAW,SACrC;AAAA,EACE,UAAAC;AAAA,EACA,WAAAC;AAAA,EACA,OAAOC;AAAA,EACP,iBAAAC,IAAkBC,EAAM;AAAA,EACxB,WAAAC,IAAY;AAAA,EACZ,MAAAC,IAAO;AAAA,EACP,SAAAC,IAAU;AAAA,EACV,GAAGC;AACL,GACAC,GACA;AACA,QAAMC,IAAQ;AAAA,IACZ,uBAAuBL;AAAA,IACvB,kBAAkBF;AAAA,IAClB,GAAGD;AAAA,EAAA;AAGL,SACE,gBAAAS;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,QAAM;AAAA,MACN,WAAWC,EAAWC,EAAO,QAAQ,UAAUb,CAAS;AAAA,MACxD,OAAM;AAAA,MACN,QAAO;AAAA,MACP,KAAAQ;AAAA,MACA,OAAAC;AAAA,MACA,QAAO;AAAA,MACP,QAAO;AAAA,MACP,aAAWJ;AAAA,MACX,gBAAcC;AAAA,MACd,SAAQ;AAAA,MACP,GAAGC;AAAA,MAEH,UAAAR;AAAA,IAAA;AAAA,EAAA;AAGP,CAAC;"}
+{"version":3,"file":"bubble.js","sources":["../../../src/tokens/bubble/bubble.tsx"],"sourcesContent":["import { clsx } from 'clsx';\nimport React, { HTMLAttributes } from 'react';\nimport styles from './bubble.module.css';\nimport { theme } from '../../themes/index.js';\nimport { HStack } from '../../stacks/h_stack.js';\nimport { Size } from '../../utils/index.js';\n\nexport interface BubbleProps extends HTMLAttributes<HTMLDivElement> {\n  children?: React.ReactNode;\n  backgroundColor?: string;\n  textColor?: string;\n  elevate?: boolean;\n  size?: Size;\n}\n\nexport const Bubble = React.forwardRef(function Bubble(\n  {\n    children,\n    className,\n    style: defaultStyle,\n    backgroundColor = theme.accentColor,\n    textColor = '#fff',\n    size = 'md',\n    elevate = false,\n    ...props\n  }: BubbleProps,\n  ref: React.Ref<HTMLDivElement>\n) {\n  const style = {\n    '--bubble-text-color': textColor,\n    '--bubble-color': backgroundColor,\n    ...defaultStyle,\n  } as React.CSSProperties;\n\n  return (\n    <HStack\n      inline\n      className={clsx(styles.bubble, 'bubble', className)}\n      width=\"auto\"\n      height=\"auto\"\n      ref={ref}\n      style={style}\n      hAlign=\"center\"\n      vAlign=\"center\"\n      data-size={size}\n      data-elevate={elevate}\n      padding=\"4px\"\n      {...props}\n    >\n      {children}\n    </HStack>\n  );\n});\n"],"names":["Bubble","React","children","className","defaultStyle","backgroundColor","theme","textColor","size","elevate","props","ref","style","jsx","HStack","clsx","styles"],"mappings":";;;;;gDAeaA,IAASC,EAAM,WAAW,SACrC;AAAA,EACE,UAAAC;AAAA,EACA,WAAAC;AAAA,EACA,OAAOC;AAAA,EACP,iBAAAC,IAAkBC,EAAM;AAAA,EACxB,WAAAC,IAAY;AAAA,EACZ,MAAAC,IAAO;AAAA,EACP,SAAAC,IAAU;AAAA,EACV,GAAGC;AACL,GACAC,GACA;AACA,QAAMC,IAAQ;AAAA,IACZ,uBAAuBL;AAAA,IACvB,kBAAkBF;AAAA,IAClB,GAAGD;AAAA,EAAA;AAGL,SACE,gBAAAS;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,QAAM;AAAA,MACN,WAAWC,EAAKC,EAAO,QAAQ,UAAUb,CAAS;AAAA,MAClD,OAAM;AAAA,MACN,QAAO;AAAA,MACP,KAAAQ;AAAA,MACA,OAAAC;AAAA,MACA,QAAO;AAAA,MACP,QAAO;AAAA,MACP,aAAWJ;AAAA,MACX,gBAAcC;AAAA,MACd,SAAQ;AAAA,MACP,GAAGC;AAAA,MAEH,UAAAR;AAAA,IAAA;AAAA,EAAA;AAGP,CAAC;"}

package/dist/tokens/chip/chip.js

@@ -1,30 +1,29 @@
 import { jsx as p } from "react/jsx-runtime";
-import { HStack as n } from "../../stacks/h_stack.js";
-import s from "classnames";
-import a from "react";
-import { theme as f } from "../../themes/theme_variables.js";
-import "../../themes/themes/windows_98/windows_98_theme.js";
-import '../../chip.css';const h = "_chip_35f6f0b", l = { chip: h }, N = a.forwardRef(function({ children: t, style: o, className: i, color: r = f.accentColor, ...c }, e) {
-  const m = {
+import { HStack as m } from "../../stacks/h_stack.js";
+import { clsx as f } from "clsx";
+import h from "react";
+import { theme as s } from "../../themes/theme_variables.js";
+import '../../chip.css';const l = "_chip_35f6f0b", a = { chip: l }, w = h.forwardRef(function({ children: t, style: o, className: i, color: r = s.accentColor, ...c }, e) {
+  const n = {
     "--chip-color": r,
     ...o
   };
   return /* @__PURE__ */ p(
-    n,
+    m,
     {
       ref: e,
       inline: !0,
       width: "auto",
       height: "auto",
       vAlign: "center",
-      className: s(l.chip, "chip", i),
-      style: m,
+      className: f(a.chip, "chip", i),
+      style: n,
       ...c,
       children: t
     }
   );
 });
 export {
-  N as Chip
+  w as Chip
 };
 //# sourceMappingURL=chip.js.map

package/dist/tokens/chip/chip.js.map

@@ -1 +1 @@
-{"version":3,"file":"chip.js","sources":["../../../src/tokens/chip/chip.tsx"],"sourcesContent":["import { HStack, HStackProps } from '../../stacks/h_stack.js';\nimport classNames from 'classnames';\nimport React from 'react';\nimport styles from './chip.module.css';\nimport { theme } from '../../themes/index.js';\n\nexport interface ChipProps extends HStackProps {\n  children?: React.ReactNode;\n  color?: string;\n  disabled?: boolean;\n}\n\nexport const Chip = React.forwardRef(function Chip(\n  { children, style, className, color = theme.accentColor, ...props }: ChipProps,\n  ref: React.Ref<HTMLDivElement>\n) {\n  const finalStyle = {\n    '--chip-color': color,\n    ...style,\n  };\n\n  return (\n    <HStack\n      ref={ref}\n      inline\n      width=\"auto\"\n      height=\"auto\"\n      vAlign=\"center\"\n      className={classNames(styles.chip, 'chip', className)}\n      style={finalStyle}\n      {...props}\n    >\n      {children}\n    </HStack>\n  );\n});\n"],"names":["Chip","React","children","style","className","color","theme","props","ref","finalStyle","jsx","HStack","classNames","styles"],"mappings":";;;;;;4CAYaA,IAAOC,EAAM,WAAW,SACnC,EAAE,UAAAC,GAAU,OAAAC,GAAO,WAAAC,GAAW,OAAAC,IAAQC,EAAM,aAAa,GAAGC,EAAA,GAC5DC,GACA;AACA,QAAMC,IAAa;AAAA,IACjB,gBAAgBJ;AAAA,IAChB,GAAGF;AAAA,EAAA;AAGL,SACE,gBAAAO;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,KAAAH;AAAA,MACA,QAAM;AAAA,MACN,OAAM;AAAA,MACN,QAAO;AAAA,MACP,QAAO;AAAA,MACP,WAAWI,EAAWC,EAAO,MAAM,QAAQT,CAAS;AAAA,MACpD,OAAOK;AAAA,MACN,GAAGF;AAAA,MAEH,UAAAL;AAAA,IAAA;AAAA,EAAA;AAGP,CAAC;"}
+{"version":3,"file":"chip.js","sources":["../../../src/tokens/chip/chip.tsx"],"sourcesContent":["import { HStack, HStackProps } from '../../stacks/h_stack.js';\nimport { clsx } from 'clsx';\nimport React from 'react';\nimport styles from './chip.module.css';\nimport { theme } from '../../themes/index.js';\n\nexport interface ChipProps extends HStackProps {\n  children?: React.ReactNode;\n  color?: string;\n  disabled?: boolean;\n}\n\nexport const Chip = React.forwardRef(function Chip(\n  { children, style, className, color = theme.accentColor, ...props }: ChipProps,\n  ref: React.Ref<HTMLDivElement>\n) {\n  const finalStyle = {\n    '--chip-color': color,\n    ...style,\n  };\n\n  return (\n    <HStack\n      ref={ref}\n      inline\n      width=\"auto\"\n      height=\"auto\"\n      vAlign=\"center\"\n      className={clsx(styles.chip, 'chip', className)}\n      style={finalStyle}\n      {...props}\n    >\n      {children}\n    </HStack>\n  );\n});\n"],"names":["Chip","React","children","style","className","color","theme","props","ref","finalStyle","jsx","HStack","clsx","styles"],"mappings":";;;;;4CAYaA,IAAOC,EAAM,WAAW,SACnC,EAAE,UAAAC,GAAU,OAAAC,GAAO,WAAAC,GAAW,OAAAC,IAAQC,EAAM,aAAa,GAAGC,EAAA,GAC5DC,GACA;AACA,QAAMC,IAAa;AAAA,IACjB,gBAAgBJ;AAAA,IAChB,GAAGF;AAAA,EAAA;AAGL,SACE,gBAAAO;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,KAAAH;AAAA,MACA,QAAM;AAAA,MACN,OAAM;AAAA,MACN,QAAO;AAAA,MACP,QAAO;AAAA,MACP,WAAWI,EAAKC,EAAO,MAAM,QAAQT,CAAS;AAAA,MAC9C,OAAOK;AAAA,MACN,GAAGF;AAAA,MAEH,UAAAL;AAAA,IAAA;AAAA,EAAA;AAGP,CAAC;"}

package/dist/typography/body_text/body_text.js

@@ -1,37 +1,37 @@
-import { jsx as x } from "react/jsx-runtime";
-import b from "classnames";
+import { jsx as g } from "react/jsx-runtime";
+import { clsx as b } from "clsx";
 import { s as h } from "../../body_text.module-h4XQE2pC.js";
-function N({
-  size: t = "md",
-  emphasis: m = "normal",
-  hierarchy: f = "primary",
-  color: i,
+function j({
+  size: e = "md",
+  emphasis: f = "normal",
+  hierarchy: m = "primary",
+  color: a,
   children: s,
   className: p,
-  style: a = {},
+  style: i = {},
   padStart: r,
   padEnd: d,
-  padBottom: e,
-  padTop: n,
-  pad: o,
-  selectable: c = !0,
-  breakWords: g = !1
+  padBottom: n,
+  padTop: o,
+  pad: t,
+  selectable: x = !0,
+  breakWords: c = !1
 }) {
-  return o && (a.padding = o), r && (a.paddingInlineStart = r), d && (a.paddingInlineEnd = d), n && (a.paddingTop = n), e && (a.paddingBottom = e), i && (a.color = i), /* @__PURE__ */ x(
+  return t && (i.padding = t), r && (i.paddingInlineStart = r), d && (i.paddingInlineEnd = d), o && (i.paddingTop = o), n && (i.paddingBottom = n), a && (i.color = a), /* @__PURE__ */ g(
     "div",
     {
-      "data-hierarchy": f,
-      "data-emphasis": m,
-      "data-selectable": c,
+      "data-hierarchy": m,
+      "data-emphasis": f,
+      "data-selectable": x,
       className: b(h["body-text"], "body-text", p),
-      style: a,
-      "data-size": t,
-      "data-word-break": g,
+      style: i,
+      "data-size": e,
+      "data-word-break": c,
       children: s
     }
   );
 }
 export {
-  N as BodyText
+  j as BodyText
 };
 //# sourceMappingURL=body_text.js.map

package/dist/typography/body_text/body_text.js.map

@@ -1 +1 @@
-{"version":3,"file":"body_text.js","sources":["../../../src/typography/body_text/body_text.tsx"],"sourcesContent":["import React from 'react';\nimport { Emphasis, Hierarchy, Size } from '../../utils/index.js';\nimport type { WithDetailedHTMLProps } from '../../stacks/types/as.js';\nimport classnames from 'classnames';\nimport styles from './body_text.module.css';\n\nexport interface BodyTextOwnProps {\n  size?: Size;\n  emphasis?: Emphasis;\n  hierarchy?: Hierarchy;\n  color?: string;\n  pad?: string;\n  padStart?: string;\n  padEnd?: string;\n  padTop?: string;\n  padBottom?: string;\n  selectable?: boolean;\n  breakWords?: boolean;\n}\n\nexport type BodyTextProps = WithDetailedHTMLProps<BodyTextOwnProps, 'div'>;\n\nexport function BodyText({\n  size = 'md',\n  emphasis = 'normal',\n  hierarchy = 'primary',\n  color,\n  children,\n  className,\n  style = {},\n  padStart,\n  padEnd,\n  padBottom,\n  padTop,\n  pad,\n  selectable = true,\n  breakWords = false,\n}: BodyTextProps) {\n  if (pad) {\n    style.padding = pad;\n  }\n\n  if (padStart) {\n    style.paddingInlineStart = padStart;\n  }\n\n  if (padEnd) {\n    style.paddingInlineEnd = padEnd;\n  }\n\n  if (padTop) {\n    style.paddingTop = padTop;\n  }\n\n  if (padBottom) {\n    style.paddingBottom = padBottom;\n  }\n\n  if (color) {\n    style.color = color;\n  }\n\n  return (\n    <div\n      data-hierarchy={hierarchy}\n      data-emphasis={emphasis}\n      data-selectable={selectable}\n      className={classnames(styles['body-text'], 'body-text', className)}\n      style={style}\n      data-size={size}\n      data-word-break={breakWords}\n    >\n      {children}\n    </div>\n  );\n}\n"],"names":["BodyText","size","emphasis","hierarchy","color","children","className","style","padStart","padEnd","padBottom","padTop","pad","selectable","breakWords","jsx","classnames","styles"],"mappings":";;;AAsBO,SAASA,EAAS;AAAA,EACvB,MAAAC,IAAO;AAAA,EACP,UAAAC,IAAW;AAAA,EACX,WAAAC,IAAY;AAAA,EACZ,OAAAC;AAAA,EACA,UAAAC;AAAA,EACA,WAAAC;AAAA,EACA,OAAAC,IAAQ,CAAA;AAAA,EACR,UAAAC;AAAA,EACA,QAAAC;AAAA,EACA,WAAAC;AAAA,EACA,QAAAC;AAAA,EACA,KAAAC;AAAA,EACA,YAAAC,IAAa;AAAA,EACb,YAAAC,IAAa;AACf,GAAkB;AAChB,SAAIF,MACFL,EAAM,UAAUK,IAGdJ,MACFD,EAAM,qBAAqBC,IAGzBC,MACFF,EAAM,mBAAmBE,IAGvBE,MACFJ,EAAM,aAAaI,IAGjBD,MACFH,EAAM,gBAAgBG,IAGpBN,MACFG,EAAM,QAAQH,IAId,gBAAAW;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,kBAAgBZ;AAAA,MAChB,iBAAeD;AAAA,MACf,mBAAiBW;AAAA,MACjB,WAAWG,EAAWC,EAAO,WAAW,GAAG,aAAaX,CAAS;AAAA,MACjE,OAAAC;AAAA,MACA,aAAWN;AAAA,MACX,mBAAiBa;AAAA,MAEhB,UAAAT;AAAA,IAAA;AAAA,EAAA;AAGP;"}
+{"version":3,"file":"body_text.js","sources":["../../../src/typography/body_text/body_text.tsx"],"sourcesContent":["import React from 'react';\nimport { Emphasis, Hierarchy, Size } from '../../utils/index.js';\nimport type { WithDetailedHTMLProps } from '../../stacks/types/as.js';\nimport { clsx } from 'clsx';\nimport styles from './body_text.module.css';\n\nexport interface BodyTextOwnProps {\n  size?: Size;\n  emphasis?: Emphasis;\n  hierarchy?: Hierarchy;\n  color?: string;\n  pad?: string;\n  padStart?: string;\n  padEnd?: string;\n  padTop?: string;\n  padBottom?: string;\n  selectable?: boolean;\n  breakWords?: boolean;\n}\n\nexport type BodyTextProps = WithDetailedHTMLProps<BodyTextOwnProps, 'div'>;\n\nexport function BodyText({\n  size = 'md',\n  emphasis = 'normal',\n  hierarchy = 'primary',\n  color,\n  children,\n  className,\n  style = {},\n  padStart,\n  padEnd,\n  padBottom,\n  padTop,\n  pad,\n  selectable = true,\n  breakWords = false,\n}: BodyTextProps) {\n  if (pad) {\n    style.padding = pad;\n  }\n\n  if (padStart) {\n    style.paddingInlineStart = padStart;\n  }\n\n  if (padEnd) {\n    style.paddingInlineEnd = padEnd;\n  }\n\n  if (padTop) {\n    style.paddingTop = padTop;\n  }\n\n  if (padBottom) {\n    style.paddingBottom = padBottom;\n  }\n\n  if (color) {\n    style.color = color;\n  }\n\n  return (\n    <div\n      data-hierarchy={hierarchy}\n      data-emphasis={emphasis}\n      data-selectable={selectable}\n      className={clsx(styles['body-text'], 'body-text', className)}\n      style={style}\n      data-size={size}\n      data-word-break={breakWords}\n    >\n      {children}\n    </div>\n  );\n}\n"],"names":["BodyText","size","emphasis","hierarchy","color","children","className","style","padStart","padEnd","padBottom","padTop","pad","selectable","breakWords","jsx","clsx","styles"],"mappings":";;;AAsBO,SAASA,EAAS;AAAA,EACvB,MAAAC,IAAO;AAAA,EACP,UAAAC,IAAW;AAAA,EACX,WAAAC,IAAY;AAAA,EACZ,OAAAC;AAAA,EACA,UAAAC;AAAA,EACA,WAAAC;AAAA,EACA,OAAAC,IAAQ,CAAA;AAAA,EACR,UAAAC;AAAA,EACA,QAAAC;AAAA,EACA,WAAAC;AAAA,EACA,QAAAC;AAAA,EACA,KAAAC;AAAA,EACA,YAAAC,IAAa;AAAA,EACb,YAAAC,IAAa;AACf,GAAkB;AAChB,SAAIF,MACFL,EAAM,UAAUK,IAGdJ,MACFD,EAAM,qBAAqBC,IAGzBC,MACFF,EAAM,mBAAmBE,IAGvBE,MACFJ,EAAM,aAAaI,IAGjBD,MACFH,EAAM,gBAAgBG,IAGpBN,MACFG,EAAM,QAAQH,IAId,gBAAAW;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,kBAAgBZ;AAAA,MAChB,iBAAeD;AAAA,MACf,mBAAiBW;AAAA,MACjB,WAAWG,EAAKC,EAAO,WAAW,GAAG,aAAaX,CAAS;AAAA,MAC3D,OAAAC;AAAA,MACA,aAAWN;AAAA,MACX,mBAAiBa;AAAA,MAEhB,UAAAT;AAAA,IAAA;AAAA,EAAA;AAGP;"}

package/dist/typography/callout/callout.js

@@ -1,35 +1,35 @@
-import { jsx as p } from "react/jsx-runtime";
-import u from "classnames";
+import { jsx as s } from "react/jsx-runtime";
+import { clsx as u } from "clsx";
 import { s as g } from "../../callout.module-D8ECmxpO.js";
-function N({
+function b({
   size: f = "md",
   emphasis: t = "normal",
-  hierarchy: e = "primary",
+  hierarchy: l = "primary",
   color: a,
-  children: l,
-  className: s,
+  children: c,
+  className: e,
   style: i = {},
   padStart: r,
   padEnd: n,
-  padBottom: m,
-  padTop: o,
-  pad: d,
-  selectable: c = !0
+  padBottom: o,
+  padTop: d,
+  pad: m,
+  selectable: p = !0
 }) {
-  return d && (i.padding = d), r && (i.paddingInlineStart = r), n && (i.paddingInlineEnd = n), o && (i.paddingTop = o), m && (i.paddingBottom = m), a && (i.color = a), /* @__PURE__ */ p(
+  return m && (i.padding = m), r && (i.paddingInlineStart = r), n && (i.paddingInlineEnd = n), d && (i.paddingTop = d), o && (i.paddingBottom = o), a && (i.color = a), /* @__PURE__ */ s(
     "div",
     {
-      "data-hierarchy": e,
+      "data-hierarchy": l,
       "data-emphasis": t,
-      "data-selectable": c,
-      className: u(g.callout, "callout", s),
+      "data-selectable": p,
+      className: u(g.callout, "callout", e),
       style: i,
       "data-size": f,
-      children: l
+      children: c
     }
   );
 }
 export {
-  N as Callout
+  b as Callout
 };
 //# sourceMappingURL=callout.js.map

package/dist/typography/callout/callout.js.map

@@ -1 +1 @@
-{"version":3,"file":"callout.js","sources":["../../../src/typography/callout/callout.tsx"],"sourcesContent":["import React from 'react';\nimport classnames from 'classnames';\nimport { Emphasis, Hierarchy, Size } from '../../utils/index.js';\nimport type { WithDetailedHTMLProps } from '../../stacks/types/as.js';\nimport styles from './callout.module.css';\n\nexport interface CalloutOwnProps {\n  children?: string;\n  size?: Size;\n  emphasis?: Emphasis;\n  hierarchy?: Hierarchy;\n  color?: string;\n  pad?: string;\n  padStart?: string;\n  padEnd?: string;\n  padTop?: string;\n  padBottom?: string;\n  selectable?: boolean;\n}\n\nexport type CalloutProps = WithDetailedHTMLProps<CalloutOwnProps, 'div'>;\n\nexport function Callout({\n  size = 'md',\n  emphasis = 'normal',\n  hierarchy = 'primary',\n  color,\n  children,\n  className,\n  style = {},\n  padStart,\n  padEnd,\n  padBottom,\n  padTop,\n  pad,\n  selectable = true,\n}: CalloutProps) {\n  if (pad) {\n    style.padding = pad;\n  }\n\n  if (padStart) {\n    style.paddingInlineStart = padStart;\n  }\n\n  if (padEnd) {\n    style.paddingInlineEnd = padEnd;\n  }\n\n  if (padTop) {\n    style.paddingTop = padTop;\n  }\n\n  if (padBottom) {\n    style.paddingBottom = padBottom;\n  }\n\n  if (color) {\n    style.color = color;\n  }\n\n  return (\n    <div\n      data-hierarchy={hierarchy}\n      data-emphasis={emphasis}\n      data-selectable={selectable}\n      className={classnames(styles['callout'], 'callout', className)}\n      style={style}\n      data-size={size}\n    >\n      {children}\n    </div>\n  );\n}\n"],"names":["Callout","size","emphasis","hierarchy","color","children","className","style","padStart","padEnd","padBottom","padTop","pad","selectable","jsx","classnames","styles"],"mappings":";;;AAsBO,SAASA,EAAQ;AAAA,EACtB,MAAAC,IAAO;AAAA,EACP,UAAAC,IAAW;AAAA,EACX,WAAAC,IAAY;AAAA,EACZ,OAAAC;AAAA,EACA,UAAAC;AAAA,EACA,WAAAC;AAAA,EACA,OAAAC,IAAQ,CAAA;AAAA,EACR,UAAAC;AAAA,EACA,QAAAC;AAAA,EACA,WAAAC;AAAA,EACA,QAAAC;AAAA,EACA,KAAAC;AAAA,EACA,YAAAC,IAAa;AACf,GAAiB;AACf,SAAID,MACFL,EAAM,UAAUK,IAGdJ,MACFD,EAAM,qBAAqBC,IAGzBC,MACFF,EAAM,mBAAmBE,IAGvBE,MACFJ,EAAM,aAAaI,IAGjBD,MACFH,EAAM,gBAAgBG,IAGpBN,MACFG,EAAM,QAAQH,IAId,gBAAAU;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,kBAAgBX;AAAA,MAChB,iBAAeD;AAAA,MACf,mBAAiBW;AAAA,MACjB,WAAWE,EAAWC,EAAO,SAAY,WAAWV,CAAS;AAAA,MAC7D,OAAAC;AAAA,MACA,aAAWN;AAAA,MAEV,UAAAI;AAAA,IAAA;AAAA,EAAA;AAGP;"}
+{"version":3,"file":"callout.js","sources":["../../../src/typography/callout/callout.tsx"],"sourcesContent":["import React from 'react';\nimport { clsx } from 'clsx';\nimport { Emphasis, Hierarchy, Size } from '../../utils/index.js';\nimport type { WithDetailedHTMLProps } from '../../stacks/types/as.js';\nimport styles from './callout.module.css';\n\nexport interface CalloutOwnProps {\n  children?: string;\n  size?: Size;\n  emphasis?: Emphasis;\n  hierarchy?: Hierarchy;\n  color?: string;\n  pad?: string;\n  padStart?: string;\n  padEnd?: string;\n  padTop?: string;\n  padBottom?: string;\n  selectable?: boolean;\n}\n\nexport type CalloutProps = WithDetailedHTMLProps<CalloutOwnProps, 'div'>;\n\nexport function Callout({\n  size = 'md',\n  emphasis = 'normal',\n  hierarchy = 'primary',\n  color,\n  children,\n  className,\n  style = {},\n  padStart,\n  padEnd,\n  padBottom,\n  padTop,\n  pad,\n  selectable = true,\n}: CalloutProps) {\n  if (pad) {\n    style.padding = pad;\n  }\n\n  if (padStart) {\n    style.paddingInlineStart = padStart;\n  }\n\n  if (padEnd) {\n    style.paddingInlineEnd = padEnd;\n  }\n\n  if (padTop) {\n    style.paddingTop = padTop;\n  }\n\n  if (padBottom) {\n    style.paddingBottom = padBottom;\n  }\n\n  if (color) {\n    style.color = color;\n  }\n\n  return (\n    <div\n      data-hierarchy={hierarchy}\n      data-emphasis={emphasis}\n      data-selectable={selectable}\n      className={clsx(styles['callout'], 'callout', className)}\n      style={style}\n      data-size={size}\n    >\n      {children}\n    </div>\n  );\n}\n"],"names":["Callout","size","emphasis","hierarchy","color","children","className","style","padStart","padEnd","padBottom","padTop","pad","selectable","jsx","clsx","styles"],"mappings":";;;AAsBO,SAASA,EAAQ;AAAA,EACtB,MAAAC,IAAO;AAAA,EACP,UAAAC,IAAW;AAAA,EACX,WAAAC,IAAY;AAAA,EACZ,OAAAC;AAAA,EACA,UAAAC;AAAA,EACA,WAAAC;AAAA,EACA,OAAAC,IAAQ,CAAA;AAAA,EACR,UAAAC;AAAA,EACA,QAAAC;AAAA,EACA,WAAAC;AAAA,EACA,QAAAC;AAAA,EACA,KAAAC;AAAA,EACA,YAAAC,IAAa;AACf,GAAiB;AACf,SAAID,MACFL,EAAM,UAAUK,IAGdJ,MACFD,EAAM,qBAAqBC,IAGzBC,MACFF,EAAM,mBAAmBE,IAGvBE,MACFJ,EAAM,aAAaI,IAGjBD,MACFH,EAAM,gBAAgBG,IAGpBN,MACFG,EAAM,QAAQH,IAId,gBAAAU;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,kBAAgBX;AAAA,MAChB,iBAAeD;AAAA,MACf,mBAAiBW;AAAA,MACjB,WAAWE,EAAKC,EAAO,SAAY,WAAWV,CAAS;AAAA,MACvD,OAAAC;AAAA,MACA,aAAWN;AAAA,MAEV,UAAAI;AAAA,IAAA;AAAA,EAAA;AAGP;"}

package/dist/typography/caption/caption.js

@@ -1,35 +1,35 @@
 import { jsx as g } from "react/jsx-runtime";
-import h from "classnames";
+import { clsx as h } from "clsx";
 import { s as u } from "../../caption.module-DDq0H4xZ.js";
-function N({
+function b({
   size: f = "md",
   emphasis: t = "normal",
   hierarchy: p = "primary",
   color: a,
-  children: e,
-  className: s,
+  children: c,
+  className: e,
   style: i = {},
   padStart: n,
   padEnd: r,
-  padBottom: m,
-  padTop: o,
-  pad: d,
-  selectable: c = !0
+  padBottom: o,
+  padTop: d,
+  pad: m,
+  selectable: s = !0
 }) {
-  return d && (i.padding = d), n && (i.paddingInlineStart = n), r && (i.paddingInlineEnd = r), o && (i.paddingTop = o), m && (i.paddingBottom = m), a && (i.color = a), /* @__PURE__ */ g(
+  return m && (i.padding = m), n && (i.paddingInlineStart = n), r && (i.paddingInlineEnd = r), d && (i.paddingTop = d), o && (i.paddingBottom = o), a && (i.color = a), /* @__PURE__ */ g(
     "div",
     {
       "data-hierarchy": p,
       "data-emphasis": t,
-      "data-selectable": c,
-      className: h(u.caption, "caption", s),
+      "data-selectable": s,
+      className: h(u.caption, "caption", e),
       style: i,
       "data-size": f,
-      children: e
+      children: c
     }
   );
 }
 export {
-  N as Caption
+  b as Caption
 };
 //# sourceMappingURL=caption.js.map

package/dist/typography/caption/caption.js.map

@@ -1 +1 @@
-{"version":3,"file":"caption.js","sources":["../../../src/typography/caption/caption.tsx"],"sourcesContent":["import React from 'react';\nimport classnames from 'classnames';\nimport { Emphasis, Hierarchy, Size } from '../../utils/index.js';\nimport type { WithDetailedHTMLProps } from '../../stacks/types/as.js';\nimport styles from './caption.module.css';\n\nexport interface CaptionOwnProps {\n  children?: string;\n  size?: Size;\n  emphasis?: Emphasis;\n  hierarchy?: Hierarchy;\n  color?: string;\n  pad?: string;\n  padStart?: string;\n  padEnd?: string;\n  padTop?: string;\n  padBottom?: string;\n  selectable?: boolean;\n}\n\nexport type CaptionProps = WithDetailedHTMLProps<CaptionOwnProps, 'div'>;\n\nexport function Caption({\n  size = 'md',\n  emphasis = 'normal',\n  hierarchy = 'primary',\n  color,\n  children,\n  className,\n  style = {},\n  padStart,\n  padEnd,\n  padBottom,\n  padTop,\n  pad,\n  selectable = true,\n}: CaptionProps) {\n  if (pad) {\n    style.padding = pad;\n  }\n\n  if (padStart) {\n    style.paddingInlineStart = padStart;\n  }\n\n  if (padEnd) {\n    style.paddingInlineEnd = padEnd;\n  }\n\n  if (padTop) {\n    style.paddingTop = padTop;\n  }\n\n  if (padBottom) {\n    style.paddingBottom = padBottom;\n  }\n\n  if (color) {\n    style.color = color;\n  }\n\n  return (\n    <div\n      data-hierarchy={hierarchy}\n      data-emphasis={emphasis}\n      data-selectable={selectable}\n      className={classnames(styles['caption'], 'caption', className)}\n      style={style}\n      data-size={size}\n    >\n      {children}\n    </div>\n  );\n}\n"],"names":["Caption","size","emphasis","hierarchy","color","children","className","style","padStart","padEnd","padBottom","padTop","pad","selectable","jsx","classnames","styles"],"mappings":";;;AAsBO,SAASA,EAAQ;AAAA,EACtB,MAAAC,IAAO;AAAA,EACP,UAAAC,IAAW;AAAA,EACX,WAAAC,IAAY;AAAA,EACZ,OAAAC;AAAA,EACA,UAAAC;AAAA,EACA,WAAAC;AAAA,EACA,OAAAC,IAAQ,CAAA;AAAA,EACR,UAAAC;AAAA,EACA,QAAAC;AAAA,EACA,WAAAC;AAAA,EACA,QAAAC;AAAA,EACA,KAAAC;AAAA,EACA,YAAAC,IAAa;AACf,GAAiB;AACf,SAAID,MACFL,EAAM,UAAUK,IAGdJ,MACFD,EAAM,qBAAqBC,IAGzBC,MACFF,EAAM,mBAAmBE,IAGvBE,MACFJ,EAAM,aAAaI,IAGjBD,MACFH,EAAM,gBAAgBG,IAGpBN,MACFG,EAAM,QAAQH,IAId,gBAAAU;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,kBAAgBX;AAAA,MAChB,iBAAeD;AAAA,MACf,mBAAiBW;AAAA,MACjB,WAAWE,EAAWC,EAAO,SAAY,WAAWV,CAAS;AAAA,MAC7D,OAAAC;AAAA,MACA,aAAWN;AAAA,MAEV,UAAAI;AAAA,IAAA;AAAA,EAAA;AAGP;"}
+{"version":3,"file":"caption.js","sources":["../../../src/typography/caption/caption.tsx"],"sourcesContent":["import React from 'react';\nimport { clsx } from 'clsx';\nimport { Emphasis, Hierarchy, Size } from '../../utils/index.js';\nimport type { WithDetailedHTMLProps } from '../../stacks/types/as.js';\nimport styles from './caption.module.css';\n\nexport interface CaptionOwnProps {\n  children?: string;\n  size?: Size;\n  emphasis?: Emphasis;\n  hierarchy?: Hierarchy;\n  color?: string;\n  pad?: string;\n  padStart?: string;\n  padEnd?: string;\n  padTop?: string;\n  padBottom?: string;\n  selectable?: boolean;\n}\n\nexport type CaptionProps = WithDetailedHTMLProps<CaptionOwnProps, 'div'>;\n\nexport function Caption({\n  size = 'md',\n  emphasis = 'normal',\n  hierarchy = 'primary',\n  color,\n  children,\n  className,\n  style = {},\n  padStart,\n  padEnd,\n  padBottom,\n  padTop,\n  pad,\n  selectable = true,\n}: CaptionProps) {\n  if (pad) {\n    style.padding = pad;\n  }\n\n  if (padStart) {\n    style.paddingInlineStart = padStart;\n  }\n\n  if (padEnd) {\n    style.paddingInlineEnd = padEnd;\n  }\n\n  if (padTop) {\n    style.paddingTop = padTop;\n  }\n\n  if (padBottom) {\n    style.paddingBottom = padBottom;\n  }\n\n  if (color) {\n    style.color = color;\n  }\n\n  return (\n    <div\n      data-hierarchy={hierarchy}\n      data-emphasis={emphasis}\n      data-selectable={selectable}\n      className={clsx(styles['caption'], 'caption', className)}\n      style={style}\n      data-size={size}\n    >\n      {children}\n    </div>\n  );\n}\n"],"names":["Caption","size","emphasis","hierarchy","color","children","className","style","padStart","padEnd","padBottom","padTop","pad","selectable","jsx","clsx","styles"],"mappings":";;;AAsBO,SAASA,EAAQ;AAAA,EACtB,MAAAC,IAAO;AAAA,EACP,UAAAC,IAAW;AAAA,EACX,WAAAC,IAAY;AAAA,EACZ,OAAAC;AAAA,EACA,UAAAC;AAAA,EACA,WAAAC;AAAA,EACA,OAAAC,IAAQ,CAAA;AAAA,EACR,UAAAC;AAAA,EACA,QAAAC;AAAA,EACA,WAAAC;AAAA,EACA,QAAAC;AAAA,EACA,KAAAC;AAAA,EACA,YAAAC,IAAa;AACf,GAAiB;AACf,SAAID,MACFL,EAAM,UAAUK,IAGdJ,MACFD,EAAM,qBAAqBC,IAGzBC,MACFF,EAAM,mBAAmBE,IAGvBE,MACFJ,EAAM,aAAaI,IAGjBD,MACFH,EAAM,gBAAgBG,IAGpBN,MACFG,EAAM,QAAQH,IAId,gBAAAU;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,kBAAgBX;AAAA,MAChB,iBAAeD;AAAA,MACf,mBAAiBW;AAAA,MACjB,WAAWE,EAAKC,EAAO,SAAY,WAAWV,CAAS;AAAA,MACvD,OAAAC;AAAA,MACA,aAAWN;AAAA,MAEV,UAAAI;AAAA,IAAA;AAAA,EAAA;AAGP;"}

package/dist/typography/footnote/footnote.js

@@ -1,35 +1,35 @@
 import { jsx as g } from "react/jsx-runtime";
-import h from "classnames";
+import { clsx as h } from "clsx";
 import { s as u } from "../../footnote.module-DEyFuqOr.js";
-function N({
-  size: m = "md",
-  emphasis: d = "normal",
+function b({
+  size: d = "md",
+  emphasis: m = "normal",
   hierarchy: e = "primary",
-  color: a,
-  children: s,
-  className: p,
+  color: o,
+  children: p,
+  className: s,
   style: i = {},
-  padStart: o,
+  padStart: a,
   padEnd: n,
   padBottom: r,
   padTop: t,
   pad: f,
   selectable: c = !0
 }) {
-  return f && (i.padding = f), o && (i.paddingInlineStart = o), n && (i.paddingInlineEnd = n), t && (i.paddingTop = t), r && (i.paddingBottom = r), a && (i.color = a), /* @__PURE__ */ g(
+  return f && (i.padding = f), a && (i.paddingInlineStart = a), n && (i.paddingInlineEnd = n), t && (i.paddingTop = t), r && (i.paddingBottom = r), o && (i.color = o), /* @__PURE__ */ g(
     "div",
     {
       "data-hierarchy": e,
-      "data-emphasis": d,
+      "data-emphasis": m,
       "data-selectable": c,
-      className: h(u.footnote, "footnote", p),
+      className: h(u.footnote, "footnote", s),
       style: i,
-      "data-size": m,
-      children: s
+      "data-size": d,
+      children: p
     }
   );
 }
 export {
-  N as Footnote
+  b as Footnote
 };
 //# sourceMappingURL=footnote.js.map

package/dist/typography/footnote/footnote.js.map

@@ -1 +1 @@
-{"version":3,"file":"footnote.js","sources":["../../../src/typography/footnote/footnote.tsx"],"sourcesContent":["import React from 'react';\nimport classnames from 'classnames';\nimport { Emphasis, Hierarchy, Size } from '../../utils/index.js';\nimport type { WithDetailedHTMLProps } from '../../stacks/types/as.js';\nimport styles from './footnote.module.css';\n\nexport interface FootnoteOwnProps {\n  children?: string;\n  size?: Size;\n  emphasis?: Emphasis;\n  hierarchy?: Hierarchy;\n  color?: string;\n  pad?: string;\n  padStart?: string;\n  padEnd?: string;\n  padTop?: string;\n  padBottom?: string;\n  selectable?: boolean;\n}\n\nexport type FootnoteProps = WithDetailedHTMLProps<FootnoteOwnProps, 'div'>;\n\nexport function Footnote({\n  size = 'md',\n  emphasis = 'normal',\n  hierarchy = 'primary',\n  color,\n  children,\n  className,\n  style = {},\n  padStart,\n  padEnd,\n  padBottom,\n  padTop,\n  pad,\n  selectable = true,\n}: FootnoteProps) {\n  if (pad) {\n    style.padding = pad;\n  }\n\n  if (padStart) {\n    style.paddingInlineStart = padStart;\n  }\n\n  if (padEnd) {\n    style.paddingInlineEnd = padEnd;\n  }\n\n  if (padTop) {\n    style.paddingTop = padTop;\n  }\n\n  if (padBottom) {\n    style.paddingBottom = padBottom;\n  }\n\n  if (color) {\n    style.color = color;\n  }\n\n  return (\n    <div\n      data-hierarchy={hierarchy}\n      data-emphasis={emphasis}\n      data-selectable={selectable}\n      className={classnames(styles['footnote'], 'footnote', className)}\n      style={style}\n      data-size={size}\n    >\n      {children}\n    </div>\n  );\n}\n"],"names":["Footnote","size","emphasis","hierarchy","color","children","className","style","padStart","padEnd","padBottom","padTop","pad","selectable","jsx","classnames","styles"],"mappings":";;;AAsBO,SAASA,EAAS;AAAA,EACvB,MAAAC,IAAO;AAAA,EACP,UAAAC,IAAW;AAAA,EACX,WAAAC,IAAY;AAAA,EACZ,OAAAC;AAAA,EACA,UAAAC;AAAA,EACA,WAAAC;AAAA,EACA,OAAAC,IAAQ,CAAA;AAAA,EACR,UAAAC;AAAA,EACA,QAAAC;AAAA,EACA,WAAAC;AAAA,EACA,QAAAC;AAAA,EACA,KAAAC;AAAA,EACA,YAAAC,IAAa;AACf,GAAkB;AAChB,SAAID,MACFL,EAAM,UAAUK,IAGdJ,MACFD,EAAM,qBAAqBC,IAGzBC,MACFF,EAAM,mBAAmBE,IAGvBE,MACFJ,EAAM,aAAaI,IAGjBD,MACFH,EAAM,gBAAgBG,IAGpBN,MACFG,EAAM,QAAQH,IAId,gBAAAU;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,kBAAgBX;AAAA,MAChB,iBAAeD;AAAA,MACf,mBAAiBW;AAAA,MACjB,WAAWE,EAAWC,EAAO,UAAa,YAAYV,CAAS;AAAA,MAC/D,OAAAC;AAAA,MACA,aAAWN;AAAA,MAEV,UAAAI;AAAA,IAAA;AAAA,EAAA;AAGP;"}
+{"version":3,"file":"footnote.js","sources":["../../../src/typography/footnote/footnote.tsx"],"sourcesContent":["import React from 'react';\nimport { clsx } from 'clsx';\nimport { Emphasis, Hierarchy, Size } from '../../utils/index.js';\nimport type { WithDetailedHTMLProps } from '../../stacks/types/as.js';\nimport styles from './footnote.module.css';\n\nexport interface FootnoteOwnProps {\n  children?: string;\n  size?: Size;\n  emphasis?: Emphasis;\n  hierarchy?: Hierarchy;\n  color?: string;\n  pad?: string;\n  padStart?: string;\n  padEnd?: string;\n  padTop?: string;\n  padBottom?: string;\n  selectable?: boolean;\n}\n\nexport type FootnoteProps = WithDetailedHTMLProps<FootnoteOwnProps, 'div'>;\n\nexport function Footnote({\n  size = 'md',\n  emphasis = 'normal',\n  hierarchy = 'primary',\n  color,\n  children,\n  className,\n  style = {},\n  padStart,\n  padEnd,\n  padBottom,\n  padTop,\n  pad,\n  selectable = true,\n}: FootnoteProps) {\n  if (pad) {\n    style.padding = pad;\n  }\n\n  if (padStart) {\n    style.paddingInlineStart = padStart;\n  }\n\n  if (padEnd) {\n    style.paddingInlineEnd = padEnd;\n  }\n\n  if (padTop) {\n    style.paddingTop = padTop;\n  }\n\n  if (padBottom) {\n    style.paddingBottom = padBottom;\n  }\n\n  if (color) {\n    style.color = color;\n  }\n\n  return (\n    <div\n      data-hierarchy={hierarchy}\n      data-emphasis={emphasis}\n      data-selectable={selectable}\n      className={clsx(styles['footnote'], 'footnote', className)}\n      style={style}\n      data-size={size}\n    >\n      {children}\n    </div>\n  );\n}\n"],"names":["Footnote","size","emphasis","hierarchy","color","children","className","style","padStart","padEnd","padBottom","padTop","pad","selectable","jsx","clsx","styles"],"mappings":";;;AAsBO,SAASA,EAAS;AAAA,EACvB,MAAAC,IAAO;AAAA,EACP,UAAAC,IAAW;AAAA,EACX,WAAAC,IAAY;AAAA,EACZ,OAAAC;AAAA,EACA,UAAAC;AAAA,EACA,WAAAC;AAAA,EACA,OAAAC,IAAQ,CAAA;AAAA,EACR,UAAAC;AAAA,EACA,QAAAC;AAAA,EACA,WAAAC;AAAA,EACA,QAAAC;AAAA,EACA,KAAAC;AAAA,EACA,YAAAC,IAAa;AACf,GAAkB;AAChB,SAAID,MACFL,EAAM,UAAUK,IAGdJ,MACFD,EAAM,qBAAqBC,IAGzBC,MACFF,EAAM,mBAAmBE,IAGvBE,MACFJ,EAAM,aAAaI,IAGjBD,MACFH,EAAM,gBAAgBG,IAGpBN,MACFG,EAAM,QAAQH,IAId,gBAAAU;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,kBAAgBX;AAAA,MAChB,iBAAeD;AAAA,MACf,mBAAiBW;AAAA,MACjB,WAAWE,EAAKC,EAAO,UAAa,YAAYV,CAAS;AAAA,MACzD,OAAAC;AAAA,MACA,aAAWN;AAAA,MAEV,UAAAI;AAAA,IAAA;AAAA,EAAA;AAGP;"}

package/dist/typography/headline/headline.js

@@ -1,36 +1,36 @@
 import { jsx as p } from "react/jsx-runtime";
-import c from "classnames";
+import { clsx as c } from "clsx";
 import { s as u } from "../../headline.module-BiwHBtGf.js";
-function b({
+function j({
   size: e = "md",
   emphasis: o = "normal",
-  hierarchy: s = "primary",
+  hierarchy: h = "primary",
   color: n,
-  children: h,
-  className: t,
+  children: t,
+  className: s,
   style: i = {},
   padStart: r,
   padEnd: d,
-  padBottom: m,
-  padTop: f,
+  padBottom: f,
+  padTop: m,
   pad: l,
   selectable: g = !0
 }) {
   let a;
-  return e === "lg" ? a = "h1" : e === "md" ? a = "h2" : a = "h3", l && (i.padding = l), r && (i.paddingInlineStart = r), d && (i.paddingInlineEnd = d), f && (i.paddingTop = f), m && (i.paddingBottom = m), n && (i.color = n), /* @__PURE__ */ p(
+  return e === "lg" ? a = "h1" : e === "md" ? a = "h2" : a = "h3", l && (i.padding = l), r && (i.paddingInlineStart = r), d && (i.paddingInlineEnd = d), m && (i.paddingTop = m), f && (i.paddingBottom = f), n && (i.color = n), /* @__PURE__ */ p(
     a,
     {
-      "data-hierarchy": s,
+      "data-hierarchy": h,
       "data-emphasis": o,
       "data-selectable": g,
-      className: c(u.headline, "headline", t),
+      className: c(u.headline, "headline", s),
       style: i,
       "data-size": e,
-      children: h
+      children: t
     }
   );
 }
 export {
-  b as Headline
+  j as Headline
 };
 //# sourceMappingURL=headline.js.map

package/dist/typography/headline/headline.js.map

@@ -1 +1 @@
-{"version":3,"file":"headline.js","sources":["../../../src/typography/headline/headline.tsx"],"sourcesContent":["import React from 'react';\nimport classnames from 'classnames';\nimport { Emphasis, Hierarchy, Size } from '../../utils/index.js';\nimport type { WithDetailedHTMLProps } from '../../stacks/types/as.js';\nimport styles from './headline.module.css';\n\nexport interface HeadlineOwnProps {\n  children?: string;\n  size?: Size;\n  emphasis?: Emphasis;\n  hierarchy?: Hierarchy;\n  color?: string;\n  pad?: string;\n  padStart?: string;\n  padEnd?: string;\n  padTop?: string;\n  padBottom?: string;\n  selectable?: boolean;\n}\n\nexport type HeadlineProps = WithDetailedHTMLProps<HeadlineOwnProps, 'h1' | 'h2' | 'h3'>;\n\nexport function Headline({\n  size = 'md',\n  emphasis = 'normal',\n  hierarchy = 'primary',\n  color,\n  children,\n  className,\n  style = {},\n  padStart,\n  padEnd,\n  padBottom,\n  padTop,\n  pad,\n  selectable = true,\n}: HeadlineProps) {\n  let As: React.ElementType;\n\n  if (size === 'lg') {\n    As = 'h1';\n  } else if (size === 'md') {\n    As = 'h2';\n  } else {\n    As = 'h3';\n  }\n\n  if (pad) {\n    style.padding = pad;\n  }\n\n  if (padStart) {\n    style.paddingInlineStart = padStart;\n  }\n\n  if (padEnd) {\n    style.paddingInlineEnd = padEnd;\n  }\n\n  if (padTop) {\n    style.paddingTop = padTop;\n  }\n\n  if (padBottom) {\n    style.paddingBottom = padBottom;\n  }\n\n  if (color) {\n    style.color = color;\n  }\n\n  return (\n    <As\n      data-hierarchy={hierarchy}\n      data-emphasis={emphasis}\n      data-selectable={selectable}\n      className={classnames(styles['headline'], 'headline', className)}\n      style={style}\n      data-size={size}\n    >\n      {children}\n    </As>\n  );\n}\n"],"names":["Headline","size","emphasis","hierarchy","color","children","className","style","padStart","padEnd","padBottom","padTop","pad","selectable","As","jsx","classnames","styles"],"mappings":";;;AAsBO,SAASA,EAAS;AAAA,EACvB,MAAAC,IAAO;AAAA,EACP,UAAAC,IAAW;AAAA,EACX,WAAAC,IAAY;AAAA,EACZ,OAAAC;AAAA,EACA,UAAAC;AAAA,EACA,WAAAC;AAAA,EACA,OAAAC,IAAQ,CAAA;AAAA,EACR,UAAAC;AAAA,EACA,QAAAC;AAAA,EACA,WAAAC;AAAA,EACA,QAAAC;AAAA,EACA,KAAAC;AAAA,EACA,YAAAC,IAAa;AACf,GAAkB;AAChB,MAAIC;AAEJ,SAAIb,MAAS,OACXa,IAAK,OACIb,MAAS,OAClBa,IAAK,OAELA,IAAK,MAGHF,MACFL,EAAM,UAAUK,IAGdJ,MACFD,EAAM,qBAAqBC,IAGzBC,MACFF,EAAM,mBAAmBE,IAGvBE,MACFJ,EAAM,aAAaI,IAGjBD,MACFH,EAAM,gBAAgBG,IAGpBN,MACFG,EAAM,QAAQH,IAId,gBAAAW;AAAA,IAACD;AAAA,IAAA;AAAA,MACC,kBAAgBX;AAAA,MAChB,iBAAeD;AAAA,MACf,mBAAiBW;AAAA,MACjB,WAAWG,EAAWC,EAAO,UAAa,YAAYX,CAAS;AAAA,MAC/D,OAAAC;AAAA,MACA,aAAWN;AAAA,MAEV,UAAAI;AAAA,IAAA;AAAA,EAAA;AAGP;"}
+{"version":3,"file":"headline.js","sources":["../../../src/typography/headline/headline.tsx"],"sourcesContent":["import React from 'react';\nimport { clsx } from 'clsx';\nimport { Emphasis, Hierarchy, Size } from '../../utils/index.js';\nimport type { WithDetailedHTMLProps } from '../../stacks/types/as.js';\nimport styles from './headline.module.css';\n\nexport interface HeadlineOwnProps {\n  children?: string;\n  size?: Size;\n  emphasis?: Emphasis;\n  hierarchy?: Hierarchy;\n  color?: string;\n  pad?: string;\n  padStart?: string;\n  padEnd?: string;\n  padTop?: string;\n  padBottom?: string;\n  selectable?: boolean;\n}\n\nexport type HeadlineProps = WithDetailedHTMLProps<HeadlineOwnProps, 'h1' | 'h2' | 'h3'>;\n\nexport function Headline({\n  size = 'md',\n  emphasis = 'normal',\n  hierarchy = 'primary',\n  color,\n  children,\n  className,\n  style = {},\n  padStart,\n  padEnd,\n  padBottom,\n  padTop,\n  pad,\n  selectable = true,\n}: HeadlineProps) {\n  let As: React.ElementType;\n\n  if (size === 'lg') {\n    As = 'h1';\n  } else if (size === 'md') {\n    As = 'h2';\n  } else {\n    As = 'h3';\n  }\n\n  if (pad) {\n    style.padding = pad;\n  }\n\n  if (padStart) {\n    style.paddingInlineStart = padStart;\n  }\n\n  if (padEnd) {\n    style.paddingInlineEnd = padEnd;\n  }\n\n  if (padTop) {\n    style.paddingTop = padTop;\n  }\n\n  if (padBottom) {\n    style.paddingBottom = padBottom;\n  }\n\n  if (color) {\n    style.color = color;\n  }\n\n  return (\n    <As\n      data-hierarchy={hierarchy}\n      data-emphasis={emphasis}\n      data-selectable={selectable}\n      className={clsx(styles['headline'], 'headline', className)}\n      style={style}\n      data-size={size}\n    >\n      {children}\n    </As>\n  );\n}\n"],"names":["Headline","size","emphasis","hierarchy","color","children","className","style","padStart","padEnd","padBottom","padTop","pad","selectable","As","jsx","clsx","styles"],"mappings":";;;AAsBO,SAASA,EAAS;AAAA,EACvB,MAAAC,IAAO;AAAA,EACP,UAAAC,IAAW;AAAA,EACX,WAAAC,IAAY;AAAA,EACZ,OAAAC;AAAA,EACA,UAAAC;AAAA,EACA,WAAAC;AAAA,EACA,OAAAC,IAAQ,CAAA;AAAA,EACR,UAAAC;AAAA,EACA,QAAAC;AAAA,EACA,WAAAC;AAAA,EACA,QAAAC;AAAA,EACA,KAAAC;AAAA,EACA,YAAAC,IAAa;AACf,GAAkB;AAChB,MAAIC;AAEJ,SAAIb,MAAS,OACXa,IAAK,OACIb,MAAS,OAClBa,IAAK,OAELA,IAAK,MAGHF,MACFL,EAAM,UAAUK,IAGdJ,MACFD,EAAM,qBAAqBC,IAGzBC,MACFF,EAAM,mBAAmBE,IAGvBE,MACFJ,EAAM,aAAaI,IAGjBD,MACFH,EAAM,gBAAgBG,IAGpBN,MACFG,EAAM,QAAQH,IAId,gBAAAW;AAAA,IAACD;AAAA,IAAA;AAAA,MACC,kBAAgBX;AAAA,MAChB,iBAAeD;AAAA,MACf,mBAAiBW;AAAA,MACjB,WAAWG,EAAKC,EAAO,UAAa,YAAYX,CAAS;AAAA,MACzD,OAAAC;AAAA,MACA,aAAWN;AAAA,MAEV,UAAAI;AAAA,IAAA;AAAA,EAAA;AAGP;"}

package/dist/typography/subheadline/subheadline.js

@@ -1,36 +1,36 @@
 import { jsx as p } from "react/jsx-runtime";
-import u from "classnames";
+import { clsx as u } from "clsx";
 import { s as c } from "../../subheadline.module-C-v7zMkQ.js";
-function N({
+function j({
   size: e = "md",
-  emphasis: h = "normal",
-  hierarchy: l = "primary",
+  emphasis: l = "normal",
+  hierarchy: o = "primary",
   color: n,
-  children: o,
+  children: s,
   className: t,
   style: i = {},
   padStart: r,
   padEnd: d,
-  padBottom: m,
-  padTop: f,
-  pad: s,
+  padBottom: f,
+  padTop: m,
+  pad: h,
   selectable: g = !0
 }) {
   let a;
-  return e === "lg" ? a = "h3" : e === "md" ? a = "h4" : a = "h5", s && (i.padding = s), r && (i.paddingInlineStart = r), d && (i.paddingInlineEnd = d), f && (i.paddingTop = f), m && (i.paddingBottom = m), n && (i.color = n), /* @__PURE__ */ p(
+  return e === "lg" ? a = "h3" : e === "md" ? a = "h4" : a = "h5", h && (i.padding = h), r && (i.paddingInlineStart = r), d && (i.paddingInlineEnd = d), m && (i.paddingTop = m), f && (i.paddingBottom = f), n && (i.color = n), /* @__PURE__ */ p(
     a,
     {
-      "data-hierarchy": l,
-      "data-emphasis": h,
+      "data-hierarchy": o,
+      "data-emphasis": l,
       "data-selectable": g,
       className: u(c.subheadline, "subheadline", t),
       style: i,
       "data-size": e,
-      children: o
+      children: s
     }
   );
 }
 export {
-  N as Subheadline
+  j as Subheadline
 };
 //# sourceMappingURL=subheadline.js.map

package/dist/typography/subheadline/subheadline.js.map

@@ -1 +1 @@
-{"version":3,"file":"subheadline.js","sources":["../../../src/typography/subheadline/subheadline.tsx"],"sourcesContent":["import React from 'react';\nimport classnames from 'classnames';\nimport { Emphasis, Hierarchy, Size } from '../../utils/index.js';\nimport type { WithDetailedHTMLProps } from '../../stacks/types/as.js';\nimport styles from './subheadline.module.css';\n\nexport interface SubheadlineOwnProps {\n  children?: string;\n  size?: Size;\n  emphasis?: Emphasis;\n  hierarchy?: Hierarchy;\n  color?: string;\n  pad?: string;\n  padStart?: string;\n  padEnd?: string;\n  padTop?: string;\n  padBottom?: string;\n  selectable?: boolean;\n}\n\nexport type SubheadlineProps = WithDetailedHTMLProps<\n  SubheadlineOwnProps,\n  'h3' | 'h4' | 'h5'\n>;\n\nexport function Subheadline({\n  size = 'md',\n  emphasis = 'normal',\n  hierarchy = 'primary',\n  color,\n  children,\n  className,\n  style = {},\n  padStart,\n  padEnd,\n  padBottom,\n  padTop,\n  pad,\n  selectable = true,\n}: SubheadlineProps) {\n  let As: React.ElementType;\n\n  if (size === 'lg') {\n    As = 'h3';\n  } else if (size === 'md') {\n    As = 'h4';\n  } else {\n    As = 'h5';\n  }\n\n  if (pad) {\n    style.padding = pad;\n  }\n\n  if (padStart) {\n    style.paddingInlineStart = padStart;\n  }\n\n  if (padEnd) {\n    style.paddingInlineEnd = padEnd;\n  }\n\n  if (padTop) {\n    style.paddingTop = padTop;\n  }\n\n  if (padBottom) {\n    style.paddingBottom = padBottom;\n  }\n\n  if (color) {\n    style.color = color;\n  }\n\n  return (\n    <As\n      data-hierarchy={hierarchy}\n      data-emphasis={emphasis}\n      data-selectable={selectable}\n      className={classnames(styles['subheadline'], 'subheadline', className)}\n      style={style}\n      data-size={size}\n    >\n      {children}\n    </As>\n  );\n}\n"],"names":["Subheadline","size","emphasis","hierarchy","color","children","className","style","padStart","padEnd","padBottom","padTop","pad","selectable","As","jsx","classnames","styles"],"mappings":";;;AAyBO,SAASA,EAAY;AAAA,EAC1B,MAAAC,IAAO;AAAA,EACP,UAAAC,IAAW;AAAA,EACX,WAAAC,IAAY;AAAA,EACZ,OAAAC;AAAA,EACA,UAAAC;AAAA,EACA,WAAAC;AAAA,EACA,OAAAC,IAAQ,CAAA;AAAA,EACR,UAAAC;AAAA,EACA,QAAAC;AAAA,EACA,WAAAC;AAAA,EACA,QAAAC;AAAA,EACA,KAAAC;AAAA,EACA,YAAAC,IAAa;AACf,GAAqB;AACnB,MAAIC;AAEJ,SAAIb,MAAS,OACXa,IAAK,OACIb,MAAS,OAClBa,IAAK,OAELA,IAAK,MAGHF,MACFL,EAAM,UAAUK,IAGdJ,MACFD,EAAM,qBAAqBC,IAGzBC,MACFF,EAAM,mBAAmBE,IAGvBE,MACFJ,EAAM,aAAaI,IAGjBD,MACFH,EAAM,gBAAgBG,IAGpBN,MACFG,EAAM,QAAQH,IAId,gBAAAW;AAAA,IAACD;AAAA,IAAA;AAAA,MACC,kBAAgBX;AAAA,MAChB,iBAAeD;AAAA,MACf,mBAAiBW;AAAA,MACjB,WAAWG,EAAWC,EAAO,aAAgB,eAAeX,CAAS;AAAA,MACrE,OAAAC;AAAA,MACA,aAAWN;AAAA,MAEV,UAAAI;AAAA,IAAA;AAAA,EAAA;AAGP;"}
+{"version":3,"file":"subheadline.js","sources":["../../../src/typography/subheadline/subheadline.tsx"],"sourcesContent":["import React from 'react';\nimport { clsx } from 'clsx';\nimport { Emphasis, Hierarchy, Size } from '../../utils/index.js';\nimport type { WithDetailedHTMLProps } from '../../stacks/types/as.js';\nimport styles from './subheadline.module.css';\n\nexport interface SubheadlineOwnProps {\n  children?: string;\n  size?: Size;\n  emphasis?: Emphasis;\n  hierarchy?: Hierarchy;\n  color?: string;\n  pad?: string;\n  padStart?: string;\n  padEnd?: string;\n  padTop?: string;\n  padBottom?: string;\n  selectable?: boolean;\n}\n\nexport type SubheadlineProps = WithDetailedHTMLProps<\n  SubheadlineOwnProps,\n  'h3' | 'h4' | 'h5'\n>;\n\nexport function Subheadline({\n  size = 'md',\n  emphasis = 'normal',\n  hierarchy = 'primary',\n  color,\n  children,\n  className,\n  style = {},\n  padStart,\n  padEnd,\n  padBottom,\n  padTop,\n  pad,\n  selectable = true,\n}: SubheadlineProps) {\n  let As: React.ElementType;\n\n  if (size === 'lg') {\n    As = 'h3';\n  } else if (size === 'md') {\n    As = 'h4';\n  } else {\n    As = 'h5';\n  }\n\n  if (pad) {\n    style.padding = pad;\n  }\n\n  if (padStart) {\n    style.paddingInlineStart = padStart;\n  }\n\n  if (padEnd) {\n    style.paddingInlineEnd = padEnd;\n  }\n\n  if (padTop) {\n    style.paddingTop = padTop;\n  }\n\n  if (padBottom) {\n    style.paddingBottom = padBottom;\n  }\n\n  if (color) {\n    style.color = color;\n  }\n\n  return (\n    <As\n      data-hierarchy={hierarchy}\n      data-emphasis={emphasis}\n      data-selectable={selectable}\n      className={clsx(styles['subheadline'], 'subheadline', className)}\n      style={style}\n      data-size={size}\n    >\n      {children}\n    </As>\n  );\n}\n"],"names":["Subheadline","size","emphasis","hierarchy","color","children","className","style","padStart","padEnd","padBottom","padTop","pad","selectable","As","jsx","clsx","styles"],"mappings":";;;AAyBO,SAASA,EAAY;AAAA,EAC1B,MAAAC,IAAO;AAAA,EACP,UAAAC,IAAW;AAAA,EACX,WAAAC,IAAY;AAAA,EACZ,OAAAC;AAAA,EACA,UAAAC;AAAA,EACA,WAAAC;AAAA,EACA,OAAAC,IAAQ,CAAA;AAAA,EACR,UAAAC;AAAA,EACA,QAAAC;AAAA,EACA,WAAAC;AAAA,EACA,QAAAC;AAAA,EACA,KAAAC;AAAA,EACA,YAAAC,IAAa;AACf,GAAqB;AACnB,MAAIC;AAEJ,SAAIb,MAAS,OACXa,IAAK,OACIb,MAAS,OAClBa,IAAK,OAELA,IAAK,MAGHF,MACFL,EAAM,UAAUK,IAGdJ,MACFD,EAAM,qBAAqBC,IAGzBC,MACFF,EAAM,mBAAmBE,IAGvBE,MACFJ,EAAM,aAAaI,IAGjBD,MACFH,EAAM,gBAAgBG,IAGpBN,MACFG,EAAM,QAAQH,IAId,gBAAAW;AAAA,IAACD;AAAA,IAAA;AAAA,MACC,kBAAgBX;AAAA,MAChB,iBAAeD;AAAA,MACf,mBAAiBW;AAAA,MACjB,WAAWG,EAAKC,EAAO,aAAgB,eAAeX,CAAS;AAAA,MAC/D,OAAAC;AAAA,MACA,aAAWN;AAAA,MAEV,UAAAI;AAAA,IAAA;AAAA,EAAA;AAGP;"}

package/dist/typography/title/title.d.ts

@@ -1,5 +1,5 @@
-import { Emphasis, Hierarchy, Size } from '../../utils/index.js';
 import { WithDetailedHTMLProps } from '../../stacks/types/as.js';
+import { Emphasis, Hierarchy, Size } from '../../utils/index.js';
 export interface TitleOwnProps {
     children?: string;
     size?: Size;