@clickhouse/click-ui 0.5.0 → 0.6.0-rc1

package/dist/esm/components/Switch/Switch.css

@@ -0,0 +1,65 @@
+/* The wrapper class is applied alongside FormRoot's styled-components class.
+   The .wrapper.wrapper double-class boost matches the specificity behavior of
+   the original `styled(FormRoot)` chain so these overrides reliably beat
+   FormRoot's `align-items: flex-start` regardless of stylesheet insertion
+   order between CSS Modules and the runtime-injected styled-components. */
+.wrapper__kudO9.wrapper__kudO9 {
+  /* stylelint-disable-next-line plugin/no-unsupported-browser-features -- `fit-content`
+     keyword on `max-width` is widely supported on evergreen browsers; the original
+     styled-components rule used the same value. */
+  max-width: fit-content;
+  align-items: center;
+}
+
+.switch__hgdMu {
+  position: relative;
+  width: var(--click-switch-size-width);
+  height: var(--click-switch-size-height);
+  padding: 0;
+  border: 1px solid var(--click-switch-color-stroke-default);
+  border-radius: var(--click-switch-radii-all);
+  background-color: var(--click-switch-color-background-default);
+  cursor: pointer;
+}
+
+.switch__hgdMu[data-state='checked'] {
+  border: 1px solid var(--click-switch-color-stroke-active);
+  background-color: var(--click-switch-color-background-active);
+}
+
+/* stylelint-disable no-descending-specificity -- disabled state intentionally
+   defined after the checked state to mirror the original `getRootVars`
+   priority, where `disabled` is evaluated before `checked` so a disabled
+   switch always shows the disabled colors regardless of checked. */
+.switch__hgdMu[data-disabled],
+.switch__hgdMu[data-disabled][data-state='checked'] {
+  border: 1px solid var(--click-switch-color-stroke-disabled);
+  background-color: var(--click-switch-color-background-disabled);
+  cursor: not-allowed;
+}
+/* stylelint-enable no-descending-specificity */
+
+.switch__thumb__cPlbD {
+  display: block;
+  width: 12px;
+  height: 12px;
+  border-radius: var(--click-switch-radii-all);
+  background-color: var(--click-switch-color-indicator-default);
+  transition: transform 100ms;
+  transform: translateX(2px);
+  will-change: transform;
+}
+
+.switch__thumb__cPlbD[data-state='checked'] {
+  background-color: var(--click-switch-color-indicator-active);
+  transform: translateX(15px);
+}
+
+/* stylelint-disable no-descending-specificity -- disabled state intentionally
+   defined after the checked state to mirror the original `getThumbVars`
+   priority, where `disabled` is evaluated before `checked`. */
+.switch__thumb__cPlbD[data-disabled],
+.switch__thumb__cPlbD[data-disabled][data-state='checked'] {
+  background-color: var(--click-switch-color-indicator-disabled);
+}
+/* stylelint-enable no-descending-specificity */

package/dist/esm/components/Switch/Switch.module.css.js

@@ -0,0 +1,10 @@
+const wrapper = "wrapper__kudO9";
+const switch__thumb = "switch__thumb__cPlbD";
+const styles = {
+	wrapper: wrapper,
+	"switch": "switch__hgdMu",
+	switch__thumb: switch__thumb
+};
+
+export { styles as default, switch__thumb, wrapper };
+//# sourceMappingURL=Switch.module.css.js.map

package/dist/esm/components/Switch/Switch.module.css.js.map

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

package/dist/esm/components/Switch/index.js

@@ -1,13 +1,12 @@
+import "./Switch.css";
 import { jsxs, jsx } from 'react/jsx-runtime';
 import * as RadixSwitch from '@radix-ui/react-switch';
 import { forwardRef, useId } from 'react';
-import { styled } from 'styled-components';
-import { GenericLabel } from '../GenericLabel/index.js';
+import { cn } from '../../lib/cva.js';
+import styles from './Switch.module.css.js';
 import { FormRoot } from '../FormContainer/FormRoot.js';
+import { GenericLabel } from '../GenericLabel/index.js';
 
-const Wrapper = styled(FormRoot).withConfig({
-  componentId: "sc-egkkgl-0"
-})(["align-items:center;max-width:fit-content;"]);
 const Switch = forwardRef(({
   checked,
   disabled,
@@ -15,77 +14,15 @@ const Switch = forwardRef(({
   dir,
   label,
   id,
+  className,
   ...props
 }, ref) => {
   const defaultId = useId();
-  return /* @__PURE__ */ jsxs(Wrapper, { $orientation: orientation, $dir: dir, children: [
-    /* @__PURE__ */ jsx(SwitchRoot, { ref, id: id ?? defaultId, disabled, "aria-label": `${label}`, checked, ...props, children: /* @__PURE__ */ jsx(SwitchThumb, { $checked: checked, $disabled: disabled }) }),
+  return /* @__PURE__ */ jsxs(FormRoot, { $orientation: orientation, $dir: dir, className: styles.wrapper, children: [
+    /* @__PURE__ */ jsx(RadixSwitch.Root, { ref, id: id ?? defaultId, disabled, "aria-label": `${label}`, checked, ...props, className: cn(styles.switch, className), children: /* @__PURE__ */ jsx(RadixSwitch.Thumb, { className: styles.switch__thumb }) }),
     label && /* @__PURE__ */ jsx(GenericLabel, { htmlFor: id ?? defaultId, disabled, children: label })
   ] });
 });
-const getRootVars = (theme, disabled, checked) => {
-  if (disabled) {
-    return {
-      backgroundColor: theme.click.switch.color.background.disabled,
-      border: `1px solid ${theme.click.switch.color.stroke.disabled}`
-    };
-  } else if (checked) {
-    return {
-      backgroundColor: theme.click.switch.color.background.active,
-      border: `1px solid ${theme.click.switch.color.stroke.active}`
-    };
-  } else {
-    return {
-      backgroundColor: theme.click.switch.color.background.default,
-      border: `1px solid ${theme.click.switch.color.stroke.default}`
-    };
-  }
-};
-const getThumbVars = (theme, disabled, checked) => {
-  if (disabled) {
-    return {
-      backgroundColor: theme.click.switch.color.indicator.disabled
-    };
-  } else if (checked) {
-    return {
-      backgroundColor: theme.click.switch.color.indicator.active
-    };
-  } else {
-    return {
-      backgroundColor: theme.click.switch.color.indicator.default
-    };
-  }
-};
-const SwitchRoot = styled(RadixSwitch.Root).withConfig({
-  componentId: "sc-egkkgl-1"
-})((props) => {
-  const vars = getRootVars(props.theme, props.disabled ?? false, props.checked ?? false);
-  return {
-    width: props.theme.click.switch.size.width,
-    height: props.theme.click.switch.size.height,
-    backgroundColor: vars.backgroundColor,
-    border: vars.border,
-    borderRadius: props.theme.click.switch.radii.all,
-    position: "relative",
-    padding: 0,
-    cursor: props.disabled ? "not-allowed" : "pointer"
-  };
-});
-const SwitchThumb = styled(RadixSwitch.Thumb).withConfig({
-  componentId: "sc-egkkgl-2"
-})((props) => {
-  const vars = getThumbVars(props.theme, props.$disabled, props.$checked);
-  return {
-    display: "block",
-    width: "12px",
-    height: "12px",
-    backgroundColor: vars.backgroundColor,
-    borderRadius: props.theme.click.switch.radii.all,
-    transition: "transform 100ms",
-    transform: props.$checked ? "translateX(15px)" : "translateX(2px)",
-    willChange: "transform"
-  };
-});
 
 export { Switch };
 //# sourceMappingURL=index.js.map

package/dist/esm/components/Switch/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../../../src/components/Switch/Switch.tsx"],"sourcesContent":["import * as RadixSwitch from '@radix-ui/react-switch';\nimport { forwardRef, useId } from 'react';\nimport { styled } from 'styled-components';\nimport { FormRoot } from '@/components/FormContainer';\nimport { GenericLabel } from '@/components/GenericLabel';\nimport { SwitchProps } from './Switch.types';\nimport type { Theme } from '@/theme/theme.types';\n\ninterface ThumbProps {\n  $checked: boolean;\n  $disabled?: boolean;\n}\n\nconst Wrapper = styled(FormRoot)`\n  align-items: center;\n  max-width: fit-content;\n`;\n\nexport const Switch = forwardRef<HTMLButtonElement, SwitchProps>(\n  ({ checked, disabled, orientation, dir, label, id, ...props }, ref) => {\n    const defaultId = useId();\n    return (\n      <Wrapper\n        $orientation={orientation}\n        $dir={dir}\n      >\n        <SwitchRoot\n          ref={ref}\n          id={id ?? defaultId}\n          disabled={disabled}\n          aria-label={`${label}`}\n          checked={checked}\n          {...props}\n        >\n          <SwitchThumb\n            $checked={checked}\n            $disabled={disabled}\n          />\n        </SwitchRoot>\n        {label && (\n          <GenericLabel\n            htmlFor={id ?? defaultId}\n            disabled={disabled}\n          >\n            {label}\n          </GenericLabel>\n        )}\n      </Wrapper>\n    );\n  }\n);\n\nconst getRootVars = (theme: Theme, disabled: boolean | undefined, checked: boolean) => {\n  if (disabled) {\n    return {\n      backgroundColor: theme.click.switch.color.background.disabled,\n      border: `1px solid ${theme.click.switch.color.stroke.disabled}`,\n    };\n  } else if (checked) {\n    return {\n      backgroundColor: theme.click.switch.color.background.active,\n      border: `1px solid ${theme.click.switch.color.stroke.active}`,\n    };\n  } else {\n    return {\n      backgroundColor: theme.click.switch.color.background.default,\n      border: `1px solid ${theme.click.switch.color.stroke.default}`,\n    };\n  }\n};\n\nconst getThumbVars = (theme: Theme, disabled: boolean | undefined, checked: boolean) => {\n  if (disabled) {\n    return {\n      backgroundColor: theme.click.switch.color.indicator.disabled,\n    };\n  } else if (checked) {\n    return {\n      backgroundColor: theme.click.switch.color.indicator.active,\n    };\n  } else {\n    return {\n      backgroundColor: theme.click.switch.color.indicator.default,\n    };\n  }\n};\n\nconst SwitchRoot = styled(RadixSwitch.Root)(props => {\n  const vars = getRootVars(props.theme, props.disabled ?? false, props.checked ?? false);\n\n  return {\n    width: props.theme.click.switch.size.width,\n    height: props.theme.click.switch.size.height,\n    backgroundColor: vars.backgroundColor,\n    border: vars.border,\n    borderRadius: props.theme.click.switch.radii.all,\n    position: 'relative',\n    padding: 0,\n    cursor: props.disabled ? 'not-allowed' : 'pointer',\n  };\n});\n\nconst SwitchThumb = styled(RadixSwitch.Thumb)<ThumbProps>(props => {\n  const vars = getThumbVars(props.theme, props.$disabled, props.$checked);\n\n  return {\n    display: 'block',\n    width: '12px',\n    height: '12px',\n    backgroundColor: vars.backgroundColor,\n    borderRadius: props.theme.click.switch.radii.all,\n    transition: 'transform 100ms',\n    transform: props.$checked ? 'translateX(15px)' : 'translateX(2px)',\n    willChange: 'transform',\n  };\n});\n"],"names":["Wrapper","styled","FormRoot","withConfig","componentId","Switch","forwardRef","checked","disabled","orientation","dir","label","id","props","ref","defaultId","useId","getRootVars","theme","backgroundColor","click","switch","color","background","border","stroke","active","default","getThumbVars","indicator","SwitchRoot","RadixSwitch","Root","vars","width","size","height","borderRadius","radii","all","position","padding","cursor","SwitchThumb","Thumb","$disabled","$checked","display","transition","transform","willChange"],"mappings":"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"}
+{"version":3,"file":"index.js","sources":["../../../../src/components/Switch/Switch.tsx"],"sourcesContent":["import * as RadixSwitch from '@radix-ui/react-switch';\nimport { forwardRef, useId } from 'react';\nimport { FormRoot } from '@/components/FormContainer';\nimport { GenericLabel } from '@/components/GenericLabel';\nimport { cn } from '@/lib/cva';\nimport styles from './Switch.module.css';\nimport { SwitchProps } from './Switch.types';\n\nexport const Switch = forwardRef<HTMLButtonElement, SwitchProps>(\n  ({ checked, disabled, orientation, dir, label, id, className, ...props }, ref) => {\n    const defaultId = useId();\n    return (\n      <FormRoot\n        $orientation={orientation}\n        $dir={dir}\n        className={styles.wrapper}\n      >\n        <RadixSwitch.Root\n          ref={ref}\n          id={id ?? defaultId}\n          disabled={disabled}\n          aria-label={`${label}`}\n          checked={checked}\n          {...props}\n          className={cn(styles.switch, className)}\n        >\n          <RadixSwitch.Thumb className={styles.switch__thumb} />\n        </RadixSwitch.Root>\n        {label && (\n          <GenericLabel\n            htmlFor={id ?? defaultId}\n            disabled={disabled}\n          >\n            {label}\n          </GenericLabel>\n        )}\n      </FormRoot>\n    );\n  }\n);\n"],"names":["Switch","forwardRef","checked","disabled","orientation","dir","label","id","className","props","ref","defaultId","useId","styles","wrapper","cn","switch","switch__thumb"],"mappings":";;;;;;;;AAQO,MAAMA,MAAAA,GAASC,WACpB,CAAC;AAAA,EAAEC,OAAAA;AAAAA,EAASC,QAAAA;AAAAA,EAAUC,WAAAA;AAAAA,EAAaC,GAAAA;AAAAA,EAAKC,KAAAA;AAAAA,EAAOC,EAAAA;AAAAA,EAAIC,SAAAA;AAAAA,EAAW,GAAGC;AAAM,CAAA,EAAGC,GAAAA,KAAQ;AAChF,EAAA,MAAMC,YAAYC,KAAAA,EAAM;AACxB,EAAA,uBACE,IAAA,CAAC,YACC,YAAA,EAAcR,WAAAA,EACd,MAAMC,GAAAA,EACN,SAAA,EAAWQ,OAAOC,OAAAA,EAElB,QAAA,EAAA;AAAA,oBAAA,GAAA,CAAC,WAAA,CAAY,IAAA,EAAZ,EACC,GAAA,EACA,EAAA,EAAIP,EAAAA,IAAMI,SAAAA,EACV,QAAA,EACA,YAAA,EAAY,CAAA,EAAGL,KAAK,CAAA,CAAA,EACpB,OAAA,EACA,GAAIG,KAAAA,EACJ,SAAA,EAAWM,EAAAA,CAAGF,MAAAA,CAAOG,MAAAA,EAAQR,SAAS,CAAA,EAEtC,QAAA,kBAAA,GAAA,CAAC,WAAA,CAAY,KAAA,EAAZ,EAAkB,SAAA,EAAWK,MAAAA,CAAOI,aAAAA,EAAc,CAAA,EACrD,CAAA;AAAA,IACCX,yBACC,GAAA,CAAC,YAAA,EAAA,EACC,SAASC,EAAAA,IAAMI,SAAAA,EACf,UAECL,QAAAA,EAAAA,KAAAA,EACH;AAAA,GAAA,EAEJ,CAAA;AAEJ,CACF;;;;"}

package/dist/esm/components/Text/Text.css

@@ -0,0 +1,125 @@
+.text__78lq0 {
+  margin: 0;
+  color: var(--click-global-color-text-default);
+  font: var(--typography-styles-product-text-normal-md);
+  text-align: left;
+}
+
+.text_fill-width__zRuxC {
+  width: 100%;
+}
+
+/* font shorthand depends on both size and weight; one class per pairing
+   mirrors the single `font:` declaration emitted by styled-components. */
+
+.text_font_normal-xs__78uM- {
+  font: var(--typography-styles-product-text-normal-xs);
+}
+
+.text_font_normal-sm__nFGGC {
+  font: var(--typography-styles-product-text-normal-sm);
+}
+
+.text_font_normal-md__In-T2 {
+  font: var(--typography-styles-product-text-normal-md);
+}
+
+.text_font_normal-lg__WHd7I {
+  font: var(--typography-styles-product-text-normal-lg);
+}
+
+.text_font_medium-xs__KhN9o {
+  font: var(--typography-styles-product-text-medium-xs);
+}
+
+.text_font_medium-sm__zOR0K {
+  font: var(--typography-styles-product-text-medium-sm);
+}
+
+.text_font_medium-md__-svhL {
+  font: var(--typography-styles-product-text-medium-md);
+}
+
+.text_font_medium-lg__G8YvP {
+  font: var(--typography-styles-product-text-medium-lg);
+}
+
+.text_font_semibold-xs__MM2zu {
+  font: var(--typography-styles-product-text-semibold-xs);
+}
+
+.text_font_semibold-sm__2-9t1 {
+  font: var(--typography-styles-product-text-semibold-sm);
+}
+
+.text_font_semibold-md__o-5L5 {
+  font: var(--typography-styles-product-text-semibold-md);
+}
+
+.text_font_semibold-lg__0Tcyn {
+  font: var(--typography-styles-product-text-semibold-lg);
+}
+
+.text_font_bold-xs__WGk3B {
+  font: var(--typography-styles-product-text-bold-xs);
+}
+
+.text_font_bold-sm__-h2Ak {
+  font: var(--typography-styles-product-text-bold-sm);
+}
+
+.text_font_bold-md__IdFMh {
+  font: var(--typography-styles-product-text-bold-md);
+}
+
+.text_font_bold-lg__TAnMH {
+  font: var(--typography-styles-product-text-bold-lg);
+}
+
+.text_font_mono-xs__h2Ng9 {
+  font: var(--typography-styles-product-text-mono-xs);
+}
+
+.text_font_mono-sm__-TW-0 {
+  font: var(--typography-styles-product-text-mono-sm);
+}
+
+.text_font_mono-md__8WvNk {
+  font: var(--typography-styles-product-text-mono-md);
+}
+
+.text_font_mono-lg__1npTu {
+  font: var(--typography-styles-product-text-mono-lg);
+}
+
+.text_color_default__225Wd {
+  color: var(--click-global-color-text-default);
+}
+
+.text_color_muted__DpcbG {
+  color: var(--click-global-color-text-muted);
+}
+
+.text_color_danger__hphaQ {
+  color: var(--click-global-color-text-danger);
+}
+
+.text_color_disabled__noB1s {
+  color: var(--click-global-color-text-disabled);
+}
+
+.text_color_warning__OosOF {
+  color: var(--click-global-color-text-warning);
+}
+
+.text_align_left__W0fKP {
+  text-align: left;
+}
+
+.text_align_center__TjmiH {
+  text-align: center;
+}
+
+.text_align_right__azLA3 {
+  text-align: right;
+}

package/dist/esm/components/Text/Text.module.css.js

@@ -0,0 +1,44 @@
+const text = "text__78lq0";
+const text_color_default = "text_color_default__225Wd";
+const text_color_muted = "text_color_muted__DpcbG";
+const text_color_danger = "text_color_danger__hphaQ";
+const text_color_disabled = "text_color_disabled__noB1s";
+const text_color_warning = "text_color_warning__OosOF";
+const text_align_left = "text_align_left__W0fKP";
+const text_align_center = "text_align_center__TjmiH";
+const text_align_right = "text_align_right__azLA3";
+const styles = {
+	text: text,
+	"text_fill-width": "text_fill-width__zRuxC",
+	"text_font_normal-xs": "text_font_normal-xs__78uM-",
+	"text_font_normal-sm": "text_font_normal-sm__nFGGC",
+	"text_font_normal-md": "text_font_normal-md__In-T2",
+	"text_font_normal-lg": "text_font_normal-lg__WHd7I",
+	"text_font_medium-xs": "text_font_medium-xs__KhN9o",
+	"text_font_medium-sm": "text_font_medium-sm__zOR0K",
+	"text_font_medium-md": "text_font_medium-md__-svhL",
+	"text_font_medium-lg": "text_font_medium-lg__G8YvP",
+	"text_font_semibold-xs": "text_font_semibold-xs__MM2zu",
+	"text_font_semibold-sm": "text_font_semibold-sm__2-9t1",
+	"text_font_semibold-md": "text_font_semibold-md__o-5L5",
+	"text_font_semibold-lg": "text_font_semibold-lg__0Tcyn",
+	"text_font_bold-xs": "text_font_bold-xs__WGk3B",
+	"text_font_bold-sm": "text_font_bold-sm__-h2Ak",
+	"text_font_bold-md": "text_font_bold-md__IdFMh",
+	"text_font_bold-lg": "text_font_bold-lg__TAnMH",
+	"text_font_mono-xs": "text_font_mono-xs__h2Ng9",
+	"text_font_mono-sm": "text_font_mono-sm__-TW-0",
+	"text_font_mono-md": "text_font_mono-md__8WvNk",
+	"text_font_mono-lg": "text_font_mono-lg__1npTu",
+	text_color_default: text_color_default,
+	text_color_muted: text_color_muted,
+	text_color_danger: text_color_danger,
+	text_color_disabled: text_color_disabled,
+	text_color_warning: text_color_warning,
+	text_align_left: text_align_left,
+	text_align_center: text_align_center,
+	text_align_right: text_align_right
+};
+
+export { styles as default, text, text_align_center, text_align_left, text_align_right, text_color_danger, text_color_default, text_color_disabled, text_color_muted, text_color_warning };
+//# sourceMappingURL=Text.module.css.js.map

package/dist/esm/components/Text/Text.module.css.js.map

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

package/dist/esm/components/Text/index.js

@@ -1,7 +1,129 @@
+import "./Text.css";
 import { jsx } from 'react/jsx-runtime';
 import { forwardRef } from 'react';
-import { styled } from 'styled-components';
+import { cn } from '../../lib/cva.js';
+import styles from './Text.module.css.js';
+import { cva } from 'class-variance-authority';
 
+const textVariants = cva(styles.text, {
+  variants: {
+    color: {
+      default: styles["text_color_default"],
+      muted: styles["text_color_muted"],
+      danger: styles["text_color_danger"],
+      disabled: styles["text_color_disabled"],
+      warning: styles["text_color_warning"]
+    },
+    align: {
+      left: styles["text_align_left"],
+      center: styles["text_align_center"],
+      right: styles["text_align_right"]
+    },
+    fillWidth: {
+      true: styles["text_fill-width"]
+    },
+    size: {
+      xs: "",
+      sm: "",
+      md: "",
+      lg: ""
+    },
+    weight: {
+      normal: "",
+      medium: "",
+      semibold: "",
+      bold: "",
+      mono: ""
+    }
+  },
+  compoundVariants: [{
+    weight: "normal",
+    size: "xs",
+    class: styles["text_font_normal-xs"]
+  }, {
+    weight: "normal",
+    size: "sm",
+    class: styles["text_font_normal-sm"]
+  }, {
+    weight: "normal",
+    size: "md",
+    class: styles["text_font_normal-md"]
+  }, {
+    weight: "normal",
+    size: "lg",
+    class: styles["text_font_normal-lg"]
+  }, {
+    weight: "medium",
+    size: "xs",
+    class: styles["text_font_medium-xs"]
+  }, {
+    weight: "medium",
+    size: "sm",
+    class: styles["text_font_medium-sm"]
+  }, {
+    weight: "medium",
+    size: "md",
+    class: styles["text_font_medium-md"]
+  }, {
+    weight: "medium",
+    size: "lg",
+    class: styles["text_font_medium-lg"]
+  }, {
+    weight: "semibold",
+    size: "xs",
+    class: styles["text_font_semibold-xs"]
+  }, {
+    weight: "semibold",
+    size: "sm",
+    class: styles["text_font_semibold-sm"]
+  }, {
+    weight: "semibold",
+    size: "md",
+    class: styles["text_font_semibold-md"]
+  }, {
+    weight: "semibold",
+    size: "lg",
+    class: styles["text_font_semibold-lg"]
+  }, {
+    weight: "bold",
+    size: "xs",
+    class: styles["text_font_bold-xs"]
+  }, {
+    weight: "bold",
+    size: "sm",
+    class: styles["text_font_bold-sm"]
+  }, {
+    weight: "bold",
+    size: "md",
+    class: styles["text_font_bold-md"]
+  }, {
+    weight: "bold",
+    size: "lg",
+    class: styles["text_font_bold-lg"]
+  }, {
+    weight: "mono",
+    size: "xs",
+    class: styles["text_font_mono-xs"]
+  }, {
+    weight: "mono",
+    size: "sm",
+    class: styles["text_font_mono-sm"]
+  }, {
+    weight: "mono",
+    size: "md",
+    class: styles["text_font_mono-md"]
+  }, {
+    weight: "mono",
+    size: "lg",
+    class: styles["text_font_mono-lg"]
+  }],
+  defaultVariants: {
+    color: "default",
+    align: "left",
+    size: "md",
+    weight: "normal"
+  }
+});
 const _Text = ({
   align,
   color,
@@ -12,21 +134,16 @@ const _Text = ({
   component,
   fillWidth,
   ...props
-}, ref) => /* @__PURE__ */ jsx(CuiText, { as: component ?? "p", ref, $align: align, $color: color, $size: size, $weight: weight, $fillWidth: fillWidth, className, ...props, children });
-const CuiText = styled.p.withConfig({
-  componentId: "sc-ereusu-0"
-})(["font:", ";color:", ";text-align:", ";margin:0;", ";"], ({
-  $size = "md",
-  $weight = "normal",
-  theme
-}) => theme.typography.styles.product.text[$weight][$size], ({
-  $color = "default",
-  theme
-}) => theme.click.global.color.text[$color], ({
-  $align = "left"
-}) => $align, ({
-  $fillWidth
-}) => $fillWidth && "width: 100%");
+}, ref) => {
+  const Component = component ?? "p";
+  return /* @__PURE__ */ jsx(Component, { ref, ...props, className: cn(textVariants({
+    color,
+    align,
+    size,
+    weight,
+    fillWidth
+  }), className), children });
+};
 _Text.displayName = "Text";
 const Text = forwardRef(_Text);
 

package/dist/esm/components/Text/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../../../src/components/Text/Text.tsx"],"sourcesContent":["import {\n  ComponentProps,\n  ComponentPropsWithRef,\n  ElementType,\n  ReactNode,\n  forwardRef,\n} from 'react';\nimport { styled } from 'styled-components';\n\nexport type TextSize = 'xs' | 'sm' | 'md' | 'lg';\nexport type TextWeight = 'normal' | 'medium' | 'semibold' | 'bold' | 'mono';\nexport type TextAlignment = 'left' | 'center' | 'right';\nexport type TextColor = 'default' | 'muted' | 'danger' | 'disabled' | 'warning';\n\nexport interface TextProps<T extends ElementType = 'p'> {\n  /** The text content to display */\n  children: ReactNode;\n  /** The text alignment */\n  align?: TextAlignment;\n  /** The text color variant */\n  color?: TextColor;\n  /** The font size of the text */\n  size?: TextSize;\n  /** The font weight of the text */\n  weight?: TextWeight;\n  /** Additional CSS class name */\n  className?: string;\n  /** Custom component to render as */\n  component?: T;\n  /** Whether the text should fill the full width of its container */\n  fillWidth?: boolean;\n}\n\ntype TextPolymorphicComponent = <T extends ElementType = 'p'>(\n  props: Omit<ComponentProps<T>, keyof T> & TextProps<T>\n) => ReactNode;\n\nconst _Text = <T extends ElementType = 'p'>(\n  {\n    align,\n    color,\n    size,\n    weight,\n    className,\n    children,\n    component,\n    fillWidth,\n    ...props\n  }: Omit<ComponentProps<T>, keyof T> & TextProps<T>,\n  ref: ComponentPropsWithRef<T>['ref']\n) => (\n  <CuiText\n    as={component ?? 'p'}\n    ref={ref}\n    $align={align}\n    $color={color}\n    $size={size}\n    $weight={weight}\n    $fillWidth={fillWidth}\n    className={className}\n    {...props}\n  >\n    {children}\n  </CuiText>\n);\n\nconst CuiText = styled.p<{\n  $align?: TextAlignment;\n  $color?: TextColor;\n  $size?: TextSize;\n  $weight?: TextWeight;\n  $fillWidth?: boolean;\n}>`\n  font: ${({ $size = 'md', $weight = 'normal', theme }) =>\n    theme.typography.styles.product.text[$weight][$size]};\n  color: ${({ $color = 'default', theme }) => theme.click.global.color.text[$color]};\n  text-align: ${({ $align = 'left' }) => $align};\n  margin: 0;\n  ${({ $fillWidth }) => $fillWidth && 'width: 100%'};\n`;\n\n_Text.displayName = 'Text';\n\nexport const Text: TextPolymorphicComponent = forwardRef(_Text);\n"],"names":["_Text","align","color","size","weight","className","children","component","fillWidth","props","ref","CuiText","styled","p","withConfig","componentId","$size","$weight","theme","typography","styles","product","text","$color","click","global","$align","$fillWidth","displayName","Text","forwardRef"],"mappings":";;;;AAqCA,MAAMA,QAAQ,CACZ;AAAA,EACEC,KAAAA;AAAAA,EACAC,KAAAA;AAAAA,EACAC,IAAAA;AAAAA,EACAC,MAAAA;AAAAA,EACAC,SAAAA;AAAAA,EACAC,QAAAA;AAAAA,EACAC,SAAAA;AAAAA,EACAC,SAAAA;AAAAA,EACA,GAAGC;AAC4C,CAAA,EACjDC,GAAAA,yBAEC,OAAA,EAAA,EACC,EAAA,EAAIH,aAAa,GAAA,EACjB,GAAA,EACA,QAAQN,KAAAA,EACR,MAAA,EAAQC,OACR,KAAA,EAAOC,IAAAA,EACP,SAASC,MAAAA,EACT,UAAA,EAAYI,WACZ,SAAA,EACA,GAAIC,OAEHH,QAAAA,EACH,CAAA;AAGF,MAAMK,OAAAA,GAAUC,MAAAA,CAAOC,CAAAA,CAACC,UAAAA,CAAA;AAAA,EAAAC,WAAAA,EAAA;AAAA,CAAA,CAAA,CAAA,CAAA,OAAA,EAAA,SAAA,EAAA,gBAAA,YAAA,EAAA,GAAA,GAOd,CAAC;AAAA,EAAEC,KAAAA,GAAQ,IAAA;AAAA,EAAMC,OAAAA,GAAU,QAAA;AAAA,EAAUC;AAAM,CAAA,KACjDA,KAAAA,CAAMC,WAAWC,MAAAA,CAAOC,OAAAA,CAAQC,KAAKL,OAAO,CAAA,CAAED,KAAK,CAAA,EAC5C,CAAC;AAAA,EAAEO,MAAAA,GAAS,SAAA;AAAA,EAAWL;AAAM,CAAA,KAAMA,MAAMM,KAAAA,CAAMC,MAAAA,CAAOvB,MAAMoB,IAAAA,CAAKC,MAAM,GAClE,CAAC;AAAA,EAAEG,MAAAA,GAAS;AAAO,CAAA,KAAMA,QAErC,CAAC;AAAA,EAAEC;AAAW,CAAA,KAAMA,cAAc,aAAa,CAAA;AAGnD3B,KAAAA,CAAM4B,WAAAA,GAAc,MAAA;AAEb,MAAMC,IAAAA,GAAiCC,WAAW9B,KAAK;;;;"}
+{"version":3,"file":"index.js","sources":["../../../../src/components/Text/Text.tsx"],"sourcesContent":["import {\n  ComponentProps,\n  ComponentPropsWithRef,\n  ElementType,\n  ReactNode,\n  forwardRef,\n} from 'react';\nimport { cn, cva } from '@/lib/cva';\nimport styles from './Text.module.css';\n\nexport type TextSize = 'xs' | 'sm' | 'md' | 'lg';\nexport type TextWeight = 'normal' | 'medium' | 'semibold' | 'bold' | 'mono';\nexport type TextAlignment = 'left' | 'center' | 'right';\nexport type TextColor = 'default' | 'muted' | 'danger' | 'disabled' | 'warning';\n\nexport interface TextProps<T extends ElementType = 'p'> {\n  /** The text content to display */\n  children: ReactNode;\n  /** The text alignment */\n  align?: TextAlignment;\n  /** The text color variant */\n  color?: TextColor;\n  /** The font size of the text */\n  size?: TextSize;\n  /** The font weight of the text */\n  weight?: TextWeight;\n  /** Additional CSS class name */\n  className?: string;\n  /** Custom component to render as */\n  component?: T;\n  /** Whether the text should fill the full width of its container */\n  fillWidth?: boolean;\n}\n\ntype TextPolymorphicComponent = <T extends ElementType = 'p'>(\n  props: Omit<ComponentProps<T>, keyof TextProps<T>> & TextProps<T>\n) => ReactNode;\n\nconst textVariants = cva(styles.text, {\n  variants: {\n    color: {\n      default: styles['text_color_default'],\n      muted: styles['text_color_muted'],\n      danger: styles['text_color_danger'],\n      disabled: styles['text_color_disabled'],\n      warning: styles['text_color_warning'],\n    },\n    align: {\n      left: styles['text_align_left'],\n      center: styles['text_align_center'],\n      right: styles['text_align_right'],\n    },\n    fillWidth: {\n      true: styles['text_fill-width'],\n    },\n    size: {\n      xs: '',\n      sm: '',\n      md: '',\n      lg: '',\n    },\n    weight: {\n      normal: '',\n      medium: '',\n      semibold: '',\n      bold: '',\n      mono: '',\n    },\n  },\n  compoundVariants: [\n    { weight: 'normal', size: 'xs', class: styles['text_font_normal-xs'] },\n    { weight: 'normal', size: 'sm', class: styles['text_font_normal-sm'] },\n    { weight: 'normal', size: 'md', class: styles['text_font_normal-md'] },\n    { weight: 'normal', size: 'lg', class: styles['text_font_normal-lg'] },\n    { weight: 'medium', size: 'xs', class: styles['text_font_medium-xs'] },\n    { weight: 'medium', size: 'sm', class: styles['text_font_medium-sm'] },\n    { weight: 'medium', size: 'md', class: styles['text_font_medium-md'] },\n    { weight: 'medium', size: 'lg', class: styles['text_font_medium-lg'] },\n    { weight: 'semibold', size: 'xs', class: styles['text_font_semibold-xs'] },\n    { weight: 'semibold', size: 'sm', class: styles['text_font_semibold-sm'] },\n    { weight: 'semibold', size: 'md', class: styles['text_font_semibold-md'] },\n    { weight: 'semibold', size: 'lg', class: styles['text_font_semibold-lg'] },\n    { weight: 'bold', size: 'xs', class: styles['text_font_bold-xs'] },\n    { weight: 'bold', size: 'sm', class: styles['text_font_bold-sm'] },\n    { weight: 'bold', size: 'md', class: styles['text_font_bold-md'] },\n    { weight: 'bold', size: 'lg', class: styles['text_font_bold-lg'] },\n    { weight: 'mono', size: 'xs', class: styles['text_font_mono-xs'] },\n    { weight: 'mono', size: 'sm', class: styles['text_font_mono-sm'] },\n    { weight: 'mono', size: 'md', class: styles['text_font_mono-md'] },\n    { weight: 'mono', size: 'lg', class: styles['text_font_mono-lg'] },\n  ],\n  defaultVariants: {\n    color: 'default',\n    align: 'left',\n    size: 'md',\n    weight: 'normal',\n  },\n});\n\nconst _Text = <T extends ElementType = 'p'>(\n  {\n    align,\n    color,\n    size,\n    weight,\n    className,\n    children,\n    component,\n    fillWidth,\n    ...props\n  }: Omit<ComponentProps<T>, keyof TextProps<T>> & TextProps<T>,\n  ref: ComponentPropsWithRef<T>['ref']\n) => {\n  const Component = component ?? 'p';\n  return (\n    <Component\n      ref={ref}\n      {...props}\n      className={cn(textVariants({ color, align, size, weight, fillWidth }), className)}\n    >\n      {children}\n    </Component>\n  );\n};\n\n_Text.displayName = 'Text';\n\nexport const Text: TextPolymorphicComponent = forwardRef(_Text);\n"],"names":["textVariants","cva","styles","text","variants","color","default","muted","danger","disabled","warning","align","left","center","right","fillWidth","true","size","xs","sm","md","lg","weight","normal","medium","semibold","bold","mono","compoundVariants","class","defaultVariants","_Text","className","children","component","props","ref","Component","cn","displayName","Text","forwardRef"],"mappings":"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"}