@usefragments/ui 1.5.4 → 1.7.0

package/dist/components/Text/Text.module.scss.cjs

@@ -1,95 +1,132 @@
 "use strict";
 Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
-const text = "_text_1159j_1";
-const variantSectionLabel = "_variant-section-label_1159j_7";
-const size2Xs = "_size-2xs_1159j_17";
-const sizeXs = "_size-xs_1159j_21";
-const sizeSm = "_size-sm_1159j_25";
-const sizeBase = "_size-base_1159j_29";
-const sizeMd = "_size-md_1159j_33";
-const sizeLg = "_size-lg_1159j_37";
-const sizeXl = "_size-xl_1159j_41";
-const size2Xl = "_size-2xl_1159j_45";
-const size3Xl = "_size-3xl_1159j_49";
-const size4Xl = "_size-4xl_1159j_55";
-const weightNormal = "_weight-normal_1159j_61";
-const weightMedium = "_weight-medium_1159j_65";
-const weightSemibold = "_weight-semibold_1159j_69";
-const weightBold = "_weight-bold_1159j_73";
-const colorPrimary = "_color-primary_1159j_77";
-const colorSecondary = "_color-secondary_1159j_81";
-const colorTertiary = "_color-tertiary_1159j_85";
-const colorMuted = "_color-muted_1159j_86";
-const colorSuccess = "_color-success_1159j_90";
-const colorWarning = "_color-warning_1159j_94";
-const colorDanger = "_color-danger_1159j_98";
-const mono = "_mono_1159j_102";
-const truncate = "_truncate_1159j_106";
-const lineClamp = "_lineClamp_1159j_112";
-const trackingNormal = "_tracking-normal_1159j_120";
-const trackingTight = "_tracking-tight_1159j_124";
-const trackingTighter = "_tracking-tighter_1159j_128";
-const trackingTightest = "_tracking-tightest_1159j_132";
-const tabularNums = "_tabularNums_1159j_136";
+const text = "_text_1bltq_1";
+const variantSectionLabel = "_variant-section-label_1bltq_7";
+const variantEyebrow = "_variant-eyebrow_1bltq_15";
+const roleCaption = "_role-caption_1bltq_27";
+const roleUiCompact = "_role-ui-compact_1bltq_35";
+const roleUiStandard = "_role-ui-standard_1bltq_43";
+const roleBodyCompact = "_role-body-compact_1bltq_51";
+const roleBodyRelaxed = "_role-body-relaxed_1bltq_59";
+const roleTitleSm = "_role-title-sm_1bltq_67";
+const roleTitleMd = "_role-title-md_1bltq_75";
+const roleTitleLg = "_role-title-lg_1bltq_83";
+const roleDisplay = "_role-display_1bltq_91";
+const roleCode = "_role-code_1bltq_99";
+const size2Xs = "_size-2xs_1bltq_107";
+const sizeXs = "_size-xs_1bltq_111";
+const sizeSm = "_size-sm_1bltq_115";
+const sizeBase = "_size-base_1bltq_119";
+const sizeMd = "_size-md_1bltq_123";
+const sizeLg = "_size-lg_1bltq_127";
+const sizeXl = "_size-xl_1bltq_131";
+const size2Xl = "_size-2xl_1bltq_135";
+const size3Xl = "_size-3xl_1bltq_139";
+const size4Xl = "_size-4xl_1bltq_145";
+const weightNormal = "_weight-normal_1bltq_151";
+const weightMedium = "_weight-medium_1bltq_155";
+const weightSemibold = "_weight-semibold_1bltq_159";
+const weightBold = "_weight-bold_1bltq_163";
+const colorPrimary = "_color-primary_1bltq_167";
+const colorSecondary = "_color-secondary_1bltq_171";
+const colorTertiary = "_color-tertiary_1bltq_175";
+const colorMuted = "_color-muted_1bltq_176";
+const colorAccent = "_color-accent_1bltq_180";
+const colorSuccess = "_color-success_1bltq_184";
+const colorWarning = "_color-warning_1bltq_188";
+const colorDanger = "_color-danger_1bltq_192";
+const mono = "_mono_1bltq_196";
+const truncate = "_truncate_1bltq_200";
+const lineClamp = "_lineClamp_1bltq_206";
+const trackingNormal = "_tracking-normal_1bltq_214";
+const trackingTight = "_tracking-tight_1bltq_218";
+const trackingTighter = "_tracking-tighter_1bltq_222";
+const trackingTightest = "_tracking-tightest_1bltq_226";
+const tabularNums = "_tabularNums_1bltq_230";
 const styles = {
   text,
-  "variant-section-label": "_variant-section-label_1159j_7",
+  "variant-section-label": "_variant-section-label_1bltq_7",
   variantSectionLabel,
-  "size-2xs": "_size-2xs_1159j_17",
+  "variant-eyebrow": "_variant-eyebrow_1bltq_15",
+  variantEyebrow,
+  "role-caption": "_role-caption_1bltq_27",
+  roleCaption,
+  "role-ui-compact": "_role-ui-compact_1bltq_35",
+  roleUiCompact,
+  "role-ui-standard": "_role-ui-standard_1bltq_43",
+  roleUiStandard,
+  "role-body-compact": "_role-body-compact_1bltq_51",
+  roleBodyCompact,
+  "role-body-relaxed": "_role-body-relaxed_1bltq_59",
+  roleBodyRelaxed,
+  "role-title-sm": "_role-title-sm_1bltq_67",
+  roleTitleSm,
+  "role-title-md": "_role-title-md_1bltq_75",
+  roleTitleMd,
+  "role-title-lg": "_role-title-lg_1bltq_83",
+  roleTitleLg,
+  "role-display": "_role-display_1bltq_91",
+  roleDisplay,
+  "role-code": "_role-code_1bltq_99",
+  roleCode,
+  "size-2xs": "_size-2xs_1bltq_107",
   size2Xs,
-  "size-xs": "_size-xs_1159j_21",
+  "size-xs": "_size-xs_1bltq_111",
   sizeXs,
-  "size-sm": "_size-sm_1159j_25",
+  "size-sm": "_size-sm_1bltq_115",
   sizeSm,
-  "size-base": "_size-base_1159j_29",
+  "size-base": "_size-base_1bltq_119",
   sizeBase,
-  "size-md": "_size-md_1159j_33",
+  "size-md": "_size-md_1bltq_123",
   sizeMd,
-  "size-lg": "_size-lg_1159j_37",
+  "size-lg": "_size-lg_1bltq_127",
   sizeLg,
-  "size-xl": "_size-xl_1159j_41",
+  "size-xl": "_size-xl_1bltq_131",
   sizeXl,
-  "size-2xl": "_size-2xl_1159j_45",
+  "size-2xl": "_size-2xl_1bltq_135",
   size2Xl,
-  "size-3xl": "_size-3xl_1159j_49",
+  "size-3xl": "_size-3xl_1bltq_139",
   size3Xl,
-  "size-4xl": "_size-4xl_1159j_55",
+  "size-4xl": "_size-4xl_1bltq_145",
   size4Xl,
-  "weight-normal": "_weight-normal_1159j_61",
+  "weight-normal": "_weight-normal_1bltq_151",
   weightNormal,
-  "weight-medium": "_weight-medium_1159j_65",
+  "weight-medium": "_weight-medium_1bltq_155",
   weightMedium,
-  "weight-semibold": "_weight-semibold_1159j_69",
+  "weight-semibold": "_weight-semibold_1bltq_159",
   weightSemibold,
-  "weight-bold": "_weight-bold_1159j_73",
+  "weight-bold": "_weight-bold_1bltq_163",
   weightBold,
-  "color-primary": "_color-primary_1159j_77",
+  "color-primary": "_color-primary_1bltq_167",
   colorPrimary,
-  "color-secondary": "_color-secondary_1159j_81",
+  "color-secondary": "_color-secondary_1bltq_171",
   colorSecondary,
-  "color-tertiary": "_color-tertiary_1159j_85",
+  "color-tertiary": "_color-tertiary_1bltq_175",
   colorTertiary,
-  "color-muted": "_color-muted_1159j_86",
+  "color-muted": "_color-muted_1bltq_176",
   colorMuted,
-  "color-success": "_color-success_1159j_90",
+  "color-accent": "_color-accent_1bltq_180",
+  colorAccent,
+  "color-success": "_color-success_1bltq_184",
   colorSuccess,
-  "color-warning": "_color-warning_1159j_94",
+  "color-warning": "_color-warning_1bltq_188",
   colorWarning,
-  "color-danger": "_color-danger_1159j_98",
+  "color-danger": "_color-danger_1bltq_192",
   colorDanger,
   mono,
   truncate,
   lineClamp,
-  "tracking-normal": "_tracking-normal_1159j_120",
+  "tracking-normal": "_tracking-normal_1bltq_214",
   trackingNormal,
-  "tracking-tight": "_tracking-tight_1159j_124",
+  "tracking-tight": "_tracking-tight_1bltq_218",
   trackingTight,
-  "tracking-tighter": "_tracking-tighter_1159j_128",
+  "tracking-tighter": "_tracking-tighter_1bltq_222",
   trackingTighter,
-  "tracking-tightest": "_tracking-tightest_1159j_132",
+  "tracking-tightest": "_tracking-tightest_1bltq_226",
   trackingTightest,
   tabularNums
 };
+exports.colorAccent = colorAccent;
 exports.colorDanger = colorDanger;
 exports.colorMuted = colorMuted;
 exports.colorPrimary = colorPrimary;
@@ -100,6 +137,16 @@ exports.colorWarning = colorWarning;
 exports.default = styles;
 exports.lineClamp = lineClamp;
 exports.mono = mono;
+exports.roleBodyCompact = roleBodyCompact;
+exports.roleBodyRelaxed = roleBodyRelaxed;
+exports.roleCaption = roleCaption;
+exports.roleCode = roleCode;
+exports.roleDisplay = roleDisplay;
+exports.roleTitleLg = roleTitleLg;
+exports.roleTitleMd = roleTitleMd;
+exports.roleTitleSm = roleTitleSm;
+exports.roleUiCompact = roleUiCompact;
+exports.roleUiStandard = roleUiStandard;
 exports.size2Xl = size2Xl;
 exports.size2Xs = size2Xs;
 exports.size3Xl = size3Xl;
@@ -117,6 +164,7 @@ exports.trackingTight = trackingTight;
 exports.trackingTighter = trackingTighter;
 exports.trackingTightest = trackingTightest;
 exports.truncate = truncate;
+exports.variantEyebrow = variantEyebrow;
 exports.variantSectionLabel = variantSectionLabel;
 exports.weightBold = weightBold;
 exports.weightMedium = weightMedium;

package/dist/components/Text/Text.module.scss.js

@@ -1,94 +1,131 @@
-const text = "_text_1159j_1";
-const variantSectionLabel = "_variant-section-label_1159j_7";
-const size2Xs = "_size-2xs_1159j_17";
-const sizeXs = "_size-xs_1159j_21";
-const sizeSm = "_size-sm_1159j_25";
-const sizeBase = "_size-base_1159j_29";
-const sizeMd = "_size-md_1159j_33";
-const sizeLg = "_size-lg_1159j_37";
-const sizeXl = "_size-xl_1159j_41";
-const size2Xl = "_size-2xl_1159j_45";
-const size3Xl = "_size-3xl_1159j_49";
-const size4Xl = "_size-4xl_1159j_55";
-const weightNormal = "_weight-normal_1159j_61";
-const weightMedium = "_weight-medium_1159j_65";
-const weightSemibold = "_weight-semibold_1159j_69";
-const weightBold = "_weight-bold_1159j_73";
-const colorPrimary = "_color-primary_1159j_77";
-const colorSecondary = "_color-secondary_1159j_81";
-const colorTertiary = "_color-tertiary_1159j_85";
-const colorMuted = "_color-muted_1159j_86";
-const colorSuccess = "_color-success_1159j_90";
-const colorWarning = "_color-warning_1159j_94";
-const colorDanger = "_color-danger_1159j_98";
-const mono = "_mono_1159j_102";
-const truncate = "_truncate_1159j_106";
-const lineClamp = "_lineClamp_1159j_112";
-const trackingNormal = "_tracking-normal_1159j_120";
-const trackingTight = "_tracking-tight_1159j_124";
-const trackingTighter = "_tracking-tighter_1159j_128";
-const trackingTightest = "_tracking-tightest_1159j_132";
-const tabularNums = "_tabularNums_1159j_136";
+const text = "_text_1bltq_1";
+const variantSectionLabel = "_variant-section-label_1bltq_7";
+const variantEyebrow = "_variant-eyebrow_1bltq_15";
+const roleCaption = "_role-caption_1bltq_27";
+const roleUiCompact = "_role-ui-compact_1bltq_35";
+const roleUiStandard = "_role-ui-standard_1bltq_43";
+const roleBodyCompact = "_role-body-compact_1bltq_51";
+const roleBodyRelaxed = "_role-body-relaxed_1bltq_59";
+const roleTitleSm = "_role-title-sm_1bltq_67";
+const roleTitleMd = "_role-title-md_1bltq_75";
+const roleTitleLg = "_role-title-lg_1bltq_83";
+const roleDisplay = "_role-display_1bltq_91";
+const roleCode = "_role-code_1bltq_99";
+const size2Xs = "_size-2xs_1bltq_107";
+const sizeXs = "_size-xs_1bltq_111";
+const sizeSm = "_size-sm_1bltq_115";
+const sizeBase = "_size-base_1bltq_119";
+const sizeMd = "_size-md_1bltq_123";
+const sizeLg = "_size-lg_1bltq_127";
+const sizeXl = "_size-xl_1bltq_131";
+const size2Xl = "_size-2xl_1bltq_135";
+const size3Xl = "_size-3xl_1bltq_139";
+const size4Xl = "_size-4xl_1bltq_145";
+const weightNormal = "_weight-normal_1bltq_151";
+const weightMedium = "_weight-medium_1bltq_155";
+const weightSemibold = "_weight-semibold_1bltq_159";
+const weightBold = "_weight-bold_1bltq_163";
+const colorPrimary = "_color-primary_1bltq_167";
+const colorSecondary = "_color-secondary_1bltq_171";
+const colorTertiary = "_color-tertiary_1bltq_175";
+const colorMuted = "_color-muted_1bltq_176";
+const colorAccent = "_color-accent_1bltq_180";
+const colorSuccess = "_color-success_1bltq_184";
+const colorWarning = "_color-warning_1bltq_188";
+const colorDanger = "_color-danger_1bltq_192";
+const mono = "_mono_1bltq_196";
+const truncate = "_truncate_1bltq_200";
+const lineClamp = "_lineClamp_1bltq_206";
+const trackingNormal = "_tracking-normal_1bltq_214";
+const trackingTight = "_tracking-tight_1bltq_218";
+const trackingTighter = "_tracking-tighter_1bltq_222";
+const trackingTightest = "_tracking-tightest_1bltq_226";
+const tabularNums = "_tabularNums_1bltq_230";
 const styles = {
   text,
-  "variant-section-label": "_variant-section-label_1159j_7",
+  "variant-section-label": "_variant-section-label_1bltq_7",
   variantSectionLabel,
-  "size-2xs": "_size-2xs_1159j_17",
+  "variant-eyebrow": "_variant-eyebrow_1bltq_15",
+  variantEyebrow,
+  "role-caption": "_role-caption_1bltq_27",
+  roleCaption,
+  "role-ui-compact": "_role-ui-compact_1bltq_35",
+  roleUiCompact,
+  "role-ui-standard": "_role-ui-standard_1bltq_43",
+  roleUiStandard,
+  "role-body-compact": "_role-body-compact_1bltq_51",
+  roleBodyCompact,
+  "role-body-relaxed": "_role-body-relaxed_1bltq_59",
+  roleBodyRelaxed,
+  "role-title-sm": "_role-title-sm_1bltq_67",
+  roleTitleSm,
+  "role-title-md": "_role-title-md_1bltq_75",
+  roleTitleMd,
+  "role-title-lg": "_role-title-lg_1bltq_83",
+  roleTitleLg,
+  "role-display": "_role-display_1bltq_91",
+  roleDisplay,
+  "role-code": "_role-code_1bltq_99",
+  roleCode,
+  "size-2xs": "_size-2xs_1bltq_107",
   size2Xs,
-  "size-xs": "_size-xs_1159j_21",
+  "size-xs": "_size-xs_1bltq_111",
   sizeXs,
-  "size-sm": "_size-sm_1159j_25",
+  "size-sm": "_size-sm_1bltq_115",
   sizeSm,
-  "size-base": "_size-base_1159j_29",
+  "size-base": "_size-base_1bltq_119",
   sizeBase,
-  "size-md": "_size-md_1159j_33",
+  "size-md": "_size-md_1bltq_123",
   sizeMd,
-  "size-lg": "_size-lg_1159j_37",
+  "size-lg": "_size-lg_1bltq_127",
   sizeLg,
-  "size-xl": "_size-xl_1159j_41",
+  "size-xl": "_size-xl_1bltq_131",
   sizeXl,
-  "size-2xl": "_size-2xl_1159j_45",
+  "size-2xl": "_size-2xl_1bltq_135",
   size2Xl,
-  "size-3xl": "_size-3xl_1159j_49",
+  "size-3xl": "_size-3xl_1bltq_139",
   size3Xl,
-  "size-4xl": "_size-4xl_1159j_55",
+  "size-4xl": "_size-4xl_1bltq_145",
   size4Xl,
-  "weight-normal": "_weight-normal_1159j_61",
+  "weight-normal": "_weight-normal_1bltq_151",
   weightNormal,
-  "weight-medium": "_weight-medium_1159j_65",
+  "weight-medium": "_weight-medium_1bltq_155",
   weightMedium,
-  "weight-semibold": "_weight-semibold_1159j_69",
+  "weight-semibold": "_weight-semibold_1bltq_159",
   weightSemibold,
-  "weight-bold": "_weight-bold_1159j_73",
+  "weight-bold": "_weight-bold_1bltq_163",
   weightBold,
-  "color-primary": "_color-primary_1159j_77",
+  "color-primary": "_color-primary_1bltq_167",
   colorPrimary,
-  "color-secondary": "_color-secondary_1159j_81",
+  "color-secondary": "_color-secondary_1bltq_171",
   colorSecondary,
-  "color-tertiary": "_color-tertiary_1159j_85",
+  "color-tertiary": "_color-tertiary_1bltq_175",
   colorTertiary,
-  "color-muted": "_color-muted_1159j_86",
+  "color-muted": "_color-muted_1bltq_176",
   colorMuted,
-  "color-success": "_color-success_1159j_90",
+  "color-accent": "_color-accent_1bltq_180",
+  colorAccent,
+  "color-success": "_color-success_1bltq_184",
   colorSuccess,
-  "color-warning": "_color-warning_1159j_94",
+  "color-warning": "_color-warning_1bltq_188",
   colorWarning,
-  "color-danger": "_color-danger_1159j_98",
+  "color-danger": "_color-danger_1bltq_192",
   colorDanger,
   mono,
   truncate,
   lineClamp,
-  "tracking-normal": "_tracking-normal_1159j_120",
+  "tracking-normal": "_tracking-normal_1bltq_214",
   trackingNormal,
-  "tracking-tight": "_tracking-tight_1159j_124",
+  "tracking-tight": "_tracking-tight_1bltq_218",
   trackingTight,
-  "tracking-tighter": "_tracking-tighter_1159j_128",
+  "tracking-tighter": "_tracking-tighter_1bltq_222",
   trackingTighter,
-  "tracking-tightest": "_tracking-tightest_1159j_132",
+  "tracking-tightest": "_tracking-tightest_1bltq_226",
   trackingTightest,
   tabularNums
 };
 export {
+  colorAccent,
   colorDanger,
   colorMuted,
   colorPrimary,
@@ -99,6 +136,16 @@ export {
   styles as default,
   lineClamp,
   mono,
+  roleBodyCompact,
+  roleBodyRelaxed,
+  roleCaption,
+  roleCode,
+  roleDisplay,
+  roleTitleLg,
+  roleTitleMd,
+  roleTitleSm,
+  roleUiCompact,
+  roleUiStandard,
   size2Xl,
   size2Xs,
   size3Xl,
@@ -116,6 +163,7 @@ export {
   trackingTighter,
   trackingTightest,
   truncate,
+  variantEyebrow,
   variantSectionLabel,
   weightBold,
   weightMedium,

package/dist/components/Text/index.cjs

@@ -3,6 +3,7 @@ Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const jsxRuntime = require("react/jsx-runtime");
 const React = require("react");
 const Text_module = require("./Text.module.scss.cjs");
+const env = require("../../utils/env.cjs");
 function _interopNamespaceDefault(e) {
   const n = Object.create(null, { [Symbol.toStringTag]: { value: "Module" } });
   if (e) {
@@ -20,40 +21,55 @@ function _interopNamespaceDefault(e) {
   return Object.freeze(n);
 }
 const React__namespace = /* @__PURE__ */ _interopNamespaceDefault(React);
-const TextRoot = React__namespace.forwardRef(
-  function Text2({
-    children,
-    as: Component = "span",
-    variant,
-    size,
-    weight,
-    color,
-    font = "sans",
-    truncate,
-    lineClamp,
-    letterSpacing,
-    tabularNums,
-    className,
-    style,
-    ...htmlProps
-  }, ref) {
-    const classes = [
-      Text_module.default.text,
-      variant && Text_module.default[`variant-${variant}`],
-      size && Text_module.default[`size-${size}`],
-      weight && Text_module.default[`weight-${weight}`],
-      color && Text_module.default[`color-${color}`],
-      font === "mono" && Text_module.default.mono,
-      truncate && Text_module.default.truncate,
-      lineClamp && Text_module.default.lineClamp,
-      letterSpacing && Text_module.default[`tracking-${letterSpacing}`],
-      tabularNums && Text_module.default.tabularNums,
-      className
-    ].filter(Boolean).join(" ");
-    const lineClampStyle = lineClamp ? { "--fui-line-clamp": lineClamp, ...style } : style;
-    return /* @__PURE__ */ jsxRuntime.jsx(Component, { ref, className: classes, style: lineClampStyle, ...htmlProps, children });
+const TextRoot = React__namespace.forwardRef(function Text2({
+  children,
+  as: Component = "span",
+  role,
+  variant,
+  size,
+  weight,
+  color,
+  font,
+  truncate,
+  lineClamp,
+  letterSpacing,
+  tabularNums,
+  className,
+  style,
+  ...htmlProps
+}, ref) {
+  const ignoredLegacyProps = role ? [size, variant, weight, font, letterSpacing].some((value) => value !== void 0) : false;
+  if (!env.isProductionBuild() && ignoredLegacyProps) {
+    console.warn(
+      "[Text] Semantic role takes precedence over size, variant, weight, font, and letterSpacing."
+    );
   }
-);
+  const classes = [
+    Text_module.default.text,
+    role && Text_module.default[`role-${role}`],
+    !role && variant && Text_module.default[`variant-${variant}`],
+    !role && size && Text_module.default[`size-${size}`],
+    !role && weight && Text_module.default[`weight-${weight}`],
+    color && Text_module.default[`color-${color}`],
+    !role && font === "mono" && Text_module.default.mono,
+    truncate && Text_module.default.truncate,
+    lineClamp && Text_module.default.lineClamp,
+    !role && letterSpacing && Text_module.default[`tracking-${letterSpacing}`],
+    tabularNums && Text_module.default.tabularNums,
+    className
+  ].filter(Boolean).join(" ");
+  const lineClampStyle = lineClamp ? { "--fui-line-clamp": lineClamp, ...style } : style;
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    Component,
+    {
+      ref,
+      className: classes,
+      style: lineClampStyle,
+      ...htmlProps,
+      children
+    }
+  );
+});
 const Text = Object.assign(TextRoot, {
   Root: TextRoot
 });

package/dist/components/Text/index.d.ts

@@ -1,30 +1,24 @@
-import * as React from 'react';
+import * as React from "react";
 /**
  * Typography component for rendering text with consistent styling.
  * @see https://usefragments.com/components/text
  */
-export interface TextProps extends Omit<React.HTMLAttributes<HTMLElement>, 'color'> {
+export type TextRole = "caption" | "ui-compact" | "ui-standard" | "body-compact" | "body-relaxed" | "title-sm" | "title-md" | "title-lg" | "display" | "code";
+export type TextSize = "2xs" | "xs" | "sm" | "base" | "md" | "lg" | "xl" | "2xl" | "3xl" | "4xl";
+export type TextWeight = "normal" | "medium" | "semibold" | "bold";
+export type TextFont = "sans" | "mono";
+export type TextTracking = "normal" | "tight" | "tighter" | "tightest";
+type TextSharedProps = Omit<React.HTMLAttributes<HTMLElement>, "color" | "role"> & {
     children: React.ReactNode;
     /** HTML element to render.
      * @default "span" */
-    as?: 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6' | 'p' | 'span' | 'label' | 'div' | 'strong' | 'em' | 'small' | 'mark' | 'del' | 'ins' | 'sub' | 'sup' | 'time' | 'address' | 'blockquote' | 'cite' | 'code' | 'abbr';
-    /** Preset text variant */
-    variant?: 'section-label';
-    /** Font size. Steps up the scale: 2xs (10), xs (12), sm/base (14), md (15 prose body),
-     * lg (20), xl (24), 2xl (30), 3xl (36 page title), 4xl (48 hero).
-     * @see https://usefragments.com/components/text#sizes */
-    size?: '2xs' | 'xs' | 'sm' | 'base' | 'md' | 'lg' | 'xl' | '2xl' | '3xl' | '4xl';
-    /** Font weight.
-     * @default "normal" */
-    weight?: 'normal' | 'medium' | 'semibold' | 'bold';
-    /** Text color. `"muted"` is an alias for `"tertiary"`. `"success" | "warning" | "danger"`
+    as?: "h1" | "h2" | "h3" | "h4" | "h5" | "h6" | "p" | "span" | "label" | "div" | "strong" | "em" | "small" | "mark" | "del" | "ins" | "sub" | "sup" | "time" | "address" | "blockquote" | "cite" | "code" | "abbr";
+    /** Text color. `"muted"` is an alias for `"tertiary"`. `"accent"` is the brand
+     * spend for one word inside a line (a repo name). `"success" | "warning" | "danger"`
      * are for a run of text that carries a state on its own; prefer Badge or Alert when the
      * state deserves a container.
      * @default "primary" */
-    color?: 'primary' | 'secondary' | 'tertiary' | 'muted' | 'success' | 'warning' | 'danger';
-    /** Font family.
-     * @default "sans" */
-    font?: 'sans' | 'mono';
+    color?: "primary" | "secondary" | "tertiary" | "muted" | "accent" | "success" | "warning" | "danger";
     /** Truncate text with ellipsis when it overflows */
     truncate?: boolean;
     /** Number of lines before truncating (requires truncate=true) */
@@ -32,12 +26,29 @@ export interface TextProps extends Omit<React.HTMLAttributes<HTMLElement>, 'colo
     /** Letter-spacing preset. `"tight"` suits dense UI chrome labels (-0.01em);
      * `"tighter"` suits headings and stat values (-0.02em); `"tightest"` suits
      * display numerics (-0.025em). Omit for the font's default tracking. */
-    letterSpacing?: 'normal' | 'tight' | 'tighter' | 'tightest';
     /** Use tabular (fixed-width) numerals so digits align in columns. Ideal for
      * stat values, tables, timestamps, and any updating number. */
     tabularNums?: boolean;
-}
+};
+type TextRoleProps = {
+    role: TextRole;
+    size?: never;
+    variant?: never;
+    weight?: never;
+    font?: never;
+    letterSpacing?: never;
+};
+type TextLegacyScaleProps = {
+    role?: never;
+    size?: TextSize;
+    variant?: "section-label" | "eyebrow";
+    weight?: TextWeight;
+    font?: TextFont;
+    letterSpacing?: TextTracking;
+};
+export type TextProps = TextSharedProps & (TextRoleProps | TextLegacyScaleProps);
 export declare const Text: React.ForwardRefExoticComponent<TextProps & React.RefAttributes<HTMLElement>> & {
     Root: React.ForwardRefExoticComponent<TextProps & React.RefAttributes<HTMLElement>>;
 };
+export {};
 //# sourceMappingURL=index.d.ts.map

package/dist/components/Text/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Text/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAG/B;;;GAGG;AACH,MAAM,WAAW,SAAU,SAAQ,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC,WAAW,CAAC,EAAE,OAAO,CAAC;IACjF,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B;yBACqB;IACrB,EAAE,CAAC,EAAE,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,GAAG,GAAG,MAAM,GAAG,OAAO,GAAG,KAAK,GAAG,QAAQ,GAAG,IAAI,GAAG,OAAO,GAAG,MAAM,GAAG,KAAK,GAAG,KAAK,GAAG,KAAK,GAAG,KAAK,GAAG,MAAM,GAAG,SAAS,GAAG,YAAY,GAAG,MAAM,GAAG,MAAM,GAAG,MAAM,CAAC;IAClN,0BAA0B;IAC1B,OAAO,CAAC,EAAE,eAAe,CAAC;IAC1B;;6DAEyD;IACzD,IAAI,CAAC,EAAE,KAAK,GAAG,IAAI,GAAG,IAAI,GAAG,MAAM,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,KAAK,GAAG,KAAK,GAAG,KAAK,CAAC;IACjF;2BACuB;IACvB,MAAM,CAAC,EAAE,QAAQ,GAAG,QAAQ,GAAG,UAAU,GAAG,MAAM,CAAC;IACnD;;;4BAGwB;IACxB,KAAK,CAAC,EAAE,SAAS,GAAG,WAAW,GAAG,UAAU,GAAG,OAAO,GAAG,SAAS,GAAG,SAAS,GAAG,QAAQ,CAAC;IAC1F;yBACqB;IACrB,IAAI,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IACvB,oDAAoD;IACpD,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,iEAAiE;IACjE,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB;;4EAEwE;IACxE,aAAa,CAAC,EAAE,QAAQ,GAAG,OAAO,GAAG,SAAS,GAAG,UAAU,CAAC;IAC5D;mEAC+D;IAC/D,WAAW,CAAC,EAAE,OAAO,CAAC;CACvB;AAkDD,eAAO,MAAM,IAAI;;CAEf,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Text/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAI/B;;;GAGG;AACH,MAAM,MAAM,QAAQ,GAChB,SAAS,GACT,YAAY,GACZ,aAAa,GACb,cAAc,GACd,cAAc,GACd,UAAU,GACV,UAAU,GACV,UAAU,GACV,SAAS,GACT,MAAM,CAAC;AAEX,MAAM,MAAM,QAAQ,GAAG,KAAK,GAAG,IAAI,GAAG,IAAI,GAAG,MAAM,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,KAAK,GAAG,KAAK,GAAG,KAAK,CAAC;AACjG,MAAM,MAAM,UAAU,GAAG,QAAQ,GAAG,QAAQ,GAAG,UAAU,GAAG,MAAM,CAAC;AACnE,MAAM,MAAM,QAAQ,GAAG,MAAM,GAAG,MAAM,CAAC;AACvC,MAAM,MAAM,YAAY,GAAG,QAAQ,GAAG,OAAO,GAAG,SAAS,GAAG,UAAU,CAAC;AAEvE,KAAK,eAAe,GAAG,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC,WAAW,CAAC,EAAE,OAAO,GAAG,MAAM,CAAC,GAAG;IACjF,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B;yBACqB;IACrB,EAAE,CAAC,EACC,IAAI,GACJ,IAAI,GACJ,IAAI,GACJ,IAAI,GACJ,IAAI,GACJ,IAAI,GACJ,GAAG,GACH,MAAM,GACN,OAAO,GACP,KAAK,GACL,QAAQ,GACR,IAAI,GACJ,OAAO,GACP,MAAM,GACN,KAAK,GACL,KAAK,GACL,KAAK,GACL,KAAK,GACL,MAAM,GACN,SAAS,GACT,YAAY,GACZ,MAAM,GACN,MAAM,GACN,MAAM,CAAC;IACX;;;;4BAIwB;IACxB,KAAK,CAAC,EACF,SAAS,GACT,WAAW,GACX,UAAU,GACV,OAAO,GACP,QAAQ,GACR,SAAS,GACT,SAAS,GACT,QAAQ,CAAC;IACb,oDAAoD;IACpD,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,iEAAiE;IACjE,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB;;4EAEwE;IACxE;mEAC+D;IAC/D,WAAW,CAAC,EAAE,OAAO,CAAC;CACvB,CAAC;AAEF,KAAK,aAAa,GAAG;IACnB,IAAI,EAAE,QAAQ,CAAC;IACf,IAAI,CAAC,EAAE,KAAK,CAAC;IACb,OAAO,CAAC,EAAE,KAAK,CAAC;IAChB,MAAM,CAAC,EAAE,KAAK,CAAC;IACf,IAAI,CAAC,EAAE,KAAK,CAAC;IACb,aAAa,CAAC,EAAE,KAAK,CAAC;CACvB,CAAC;AAEF,KAAK,oBAAoB,GAAG;IAC1B,IAAI,CAAC,EAAE,KAAK,CAAC;IACb,IAAI,CAAC,EAAE,QAAQ,CAAC;IAChB,OAAO,CAAC,EAAE,eAAe,GAAG,SAAS,CAAC;IACtC,MAAM,CAAC,EAAE,UAAU,CAAC;IACpB,IAAI,CAAC,EAAE,QAAQ,CAAC;IAChB,aAAa,CAAC,EAAE,YAAY,CAAC;CAC9B,CAAC;AAEF,MAAM,MAAM,SAAS,GAAG,eAAe,GAAG,CAAC,aAAa,GAAG,oBAAoB,CAAC,CAAC;AAiEjF,eAAO,MAAM,IAAI;;CAEf,CAAC"}