@tipp/ui 2.7.1 → 2.9.0

package/dist/index.cjs

@@ -353,6 +353,7 @@ __export(index_exports, {
   LockOpen1Icon: () => import_react_icons2.LockOpen1Icon,
   LockOpen2Icon: () => import_react_icons2.LockOpen2Icon,
   LoopIcon: () => import_react_icons2.LoopIcon,
+  MONO_STYLE: () => MONO_STYLE,
   MagicWandIcon: () => import_react_icons2.MagicWandIcon,
   MagnifyingGlassIcon: () => import_react_icons2.MagnifyingGlassIcon,
   MarginIcon: () => import_react_icons2.MarginIcon,
@@ -524,6 +525,7 @@ __export(index_exports, {
   WidthIcon: () => import_react_icons2.WidthIcon,
   ZoomInIcon: () => import_react_icons2.ZoomInIcon,
   ZoomOutIcon: () => import_react_icons2.ZoomOutIcon,
+  clampStyle: () => clampStyle,
   createColumnHelper: () => import_react_table2.createColumnHelper,
   createYupValidation: () => createYupValidation,
   getCalloutIconComponent: () => getCalloutIconComponent,
@@ -1065,6 +1067,21 @@ var mapWithResponsive = (args) => {
   return value;
 };
 
+// src/utils/clamp-style.ts
+var clampStyle = (lines) => ({
+  display: "-webkit-box",
+  WebkitBoxOrient: "vertical",
+  WebkitLineClamp: lines,
+  lineClamp: lines,
+  overflow: "hidden"
+});
+
+// src/utils/mono-style.ts
+var MONO_STYLE = {
+  fontFamily: 'var(--code-font-family, ui-monospace, "SF Mono", monospace)',
+  fontVariantNumeric: "tabular-nums"
+};
+
 // src/atoms/heading.tsx
 var import_themes18 = require("@radix-ui/themes");
 var import_jsx_runtime15 = require("react/jsx-runtime");
@@ -1085,7 +1102,25 @@ var mapVariant = (variant) => {
   }
 };
 function Heading2(props) {
-  const _a = props, { size, children, variant, color, className } = _a, rest = __objRest(_a, ["size", "children", "variant", "color", "className"]);
+  const _a = props, {
+    size,
+    children,
+    variant,
+    color,
+    className,
+    mono,
+    clamp,
+    style
+  } = _a, rest = __objRest(_a, [
+    "size",
+    "children",
+    "variant",
+    "color",
+    "className",
+    "mono",
+    "clamp",
+    "style"
+  ]);
   const { color: radixColor, className: colorClassName } = (0, import_react15.useMemo)(
     () => resolveColor(color),
     [color]
@@ -1102,6 +1137,7 @@ function Heading2(props) {
       className: (0, import_clsx13.clsx)(colorClassName, className),
       color: radixColor,
       size: radixSize,
+      style: __spreadValues(__spreadValues(__spreadValues({}, mono ? MONO_STYLE : null), clamp ? clampStyle(clamp) : null), style),
       children
     })
   );
@@ -1738,7 +1774,25 @@ var import_react31 = require("react");
 var import_jsx_runtime31 = require("react/jsx-runtime");
 var Typo = (0, import_react31.forwardRef)(
   (props, ref) => {
-    const _a = props, { size, variant, children, color, className } = _a, rest = __objRest(_a, ["size", "variant", "children", "color", "className"]);
+    const _a = props, {
+      size,
+      variant,
+      children,
+      color,
+      className,
+      mono,
+      clamp,
+      style
+    } = _a, rest = __objRest(_a, [
+      "size",
+      "variant",
+      "children",
+      "color",
+      "className",
+      "mono",
+      "clamp",
+      "style"
+    ]);
     const { color: radixColor, className: colorClassName } = (0, import_react31.useMemo)(
       () => resolveColor(color),
       [color]
@@ -1768,6 +1822,7 @@ var Typo = (0, import_react31.forwardRef)(
         color: radixColor,
         ref,
         size: radixSize,
+        style: __spreadValues(__spreadValues(__spreadValues({}, mono ? MONO_STYLE : null), clamp ? clampStyle(clamp) : null), style),
         children
       })
     );
@@ -10456,6 +10511,7 @@ function CurriculumCard(props) {
   LockOpen1Icon,
   LockOpen2Icon,
   LoopIcon,
+  MONO_STYLE,
   MagicWandIcon,
   MagnifyingGlassIcon,
   MarginIcon,
@@ -10627,6 +10683,7 @@ function CurriculumCard(props) {
   WidthIcon,
   ZoomInIcon,
   ZoomOutIcon,
+  clampStyle,
   createColumnHelper,
   createYupValidation,
   getCalloutIconComponent,