@vinyasa/typography 1.0.24 → 1.0.25

package/dist/cjs/index.css

@@ -130,9 +130,99 @@
 ._4sie9wn {
   text-overflow: ellipsis;
   white-space: nowrap;
+  max-width: 100%;
+  display: inline-block;
   overflow: hidden;
 }
 
+._4sie9wo {
+  text-overflow: ellipsis;
+  white-space: nowrap;
+  text-align: left;
+  direction: rtl;
+  max-width: 100%;
+  display: inline-block;
+  overflow: hidden;
+}
+
+._4sie9wp {
+  font-style: italic;
+}
+
+._4sie9wq {
+  text-transform: uppercase;
+}
+
+._4sie9wr {
+  text-transform: lowercase;
+}
+
+._4sie9ws {
+  text-transform: capitalize;
+}
+
+._4sie9wt {
+  text-transform: none;
+}
+
+._4sie9wu {
+  text-decoration: underline;
+}
+
+._4sie9wv {
+  text-decoration: line-through;
+}
+
+._4sie9ww {
+  text-decoration: none;
+}
+
+._4sie9wx {
+  letter-spacing: var(--vinyasa-letter-spacing-tight);
+}
+
+._4sie9wy {
+  letter-spacing: var(--vinyasa-letter-spacing-normal);
+}
+
+._4sie9wz {
+  letter-spacing: var(--vinyasa-letter-spacing-wide);
+}
+
+._4sie9w10 {
+  line-height: var(--vinyasa-line-height-tight);
+}
+
+._4sie9w11 {
+  line-height: var(--vinyasa-line-height-normal);
+}
+
+._4sie9w12 {
+  line-height: var(--vinyasa-line-height-loose);
+}
+
+._4sie9w13 {
+  text-wrap: wrap;
+}
+
+._4sie9w14 {
+  text-wrap: balance;
+}
+
+._4sie9w15 {
+  text-wrap: pretty;
+}
+
+._4sie9w16 {
+  text-wrap: nowrap;
+}
+
+._4sie9w17 {
+  color: rgba(0, 0, 0, 0);
+  -webkit-background-clip: text;
+  background-clip: text;
+}
+
 ._15gjhvw0 {
   font-family: var(--vinyasa-font-family-mono);
   font-size: var(--vinyasa-font-size-sm);
@@ -154,6 +244,14 @@
   display: inline;
 }
 
+.x8q83o0 {
+  background-color: var(--vinyasa-status-warning-bg);
+  color: var(--vinyasa-status-warning-text);
+  border-radius: var(--vinyasa-radius-sm);
+  padding-left: .2em;
+  padding-right: .2em;
+}
+
 ._18ahdyj0 {
   font-family: var(--vinyasa-font-family-mono);
   font-size: var(--vinyasa-font-size-sm);
@@ -175,3 +273,63 @@
   text-decoration: underline;
 }
 
+._1ohxnc10 {
+  font-family: var(--vinyasa-font-family-sans);
+  font-size: var(--vinyasa-font-size-md);
+  color: var(--vinyasa-text-default);
+  flex-direction: column;
+  margin: 0;
+  display: flex;
+}
+
+._1ohxnc11 {
+  gap: var(--vinyasa-space1);
+}
+
+._1ohxnc12 {
+  gap: var(--vinyasa-space2);
+}
+
+._1ohxnc13 {
+  gap: var(--vinyasa-space3);
+}
+
+._1ohxnc14 {
+  gap: var(--vinyasa-space4);
+}
+
+._1ohxnc15 {
+  gap: var(--vinyasa-space5);
+}
+
+._1ohxnc16 {
+  gap: var(--vinyasa-space6);
+}
+
+._1ohxnc17 {
+  padding-left: var(--vinyasa-space5);
+}
+
+._1ohxnc18 {
+  padding-left: 0;
+  list-style: none;
+}
+
+._1ohxnc1a {
+  align-items: flex-start;
+  gap: var(--vinyasa-space2);
+  list-style: none;
+  display: flex;
+}
+
+._1ohxnc1b {
+  align-items: center;
+}
+
+._1ohxnc1c {
+  flex-shrink: 0;
+  align-items: center;
+  line-height: 1;
+  display: inline-flex;
+}
+

package/dist/cjs/label.cjs

@@ -227,7 +227,41 @@ var Text_css_text = createRuntimeFn({
             error: '_4sie9wm'
         },
         truncate: {
-            true: '_4sie9wn'
+            end: '_4sie9wn',
+            start: '_4sie9wo'
+        },
+        italic: {
+            true: '_4sie9wp'
+        },
+        textTransform: {
+            uppercase: '_4sie9wq',
+            lowercase: '_4sie9wr',
+            capitalize: '_4sie9ws',
+            none: '_4sie9wt'
+        },
+        decoration: {
+            underline: '_4sie9wu',
+            'line-through': '_4sie9wv',
+            none: '_4sie9ww'
+        },
+        letterSpacing: {
+            tight: '_4sie9wx',
+            normal: '_4sie9wy',
+            wide: '_4sie9wz'
+        },
+        lineHeight: {
+            tight: '_4sie9w10',
+            normal: '_4sie9w11',
+            loose: '_4sie9w12'
+        },
+        textWrap: {
+            wrap: '_4sie9w13',
+            balance: '_4sie9w14',
+            pretty: '_4sie9w15',
+            nowrap: '_4sie9w16'
+        },
+        variant: {
+            gradient: '_4sie9w17'
         }
     },
     defaultVariants: {
@@ -319,13 +353,23 @@ const Text = /*#__PURE__*/ (0, external_react_namespaceObject.forwardRef)((_0, _
     let _ref = [
         _0,
         _1
-    ], [_ref1, ..._rest] = _ref, { as: Component = 'span', size, weight, align, color, truncate, m, mt, mr, mb, ml, mx, my, p, pt, pr, pb, pl, px, py, className, style, children } = _ref1, rest = _object_without_properties(_ref1, [
+    ], [_ref1, ..._rest] = _ref, { as: Component = 'span', size, weight, align, color, truncate, italic, textTransform, decoration, letterSpacing, lineHeight, textWrap, variant, lineClamp, inherit, gradient, m, mt, mr, mb, ml, mx, my, p, pt, pr, pb, pl, px, py, className, style, children } = _ref1, rest = _object_without_properties(_ref1, [
         "as",
         "size",
         "weight",
         "align",
         "color",
         "truncate",
+        "italic",
+        "textTransform",
+        "decoration",
+        "letterSpacing",
+        "lineHeight",
+        "textWrap",
+        "variant",
+        "lineClamp",
+        "inherit",
+        "gradient",
         "m",
         "mt",
         "mr",
@@ -344,20 +388,24 @@ const Text = /*#__PURE__*/ (0, external_react_namespaceObject.forwardRef)((_0, _
         "style",
         "children"
     ]), [ref] = _rest;
+    var _gradient_deg;
     const themedRef = (0, tokens_namespaceObject.useThemedRef)(ref);
-    const classes = className ? `${Text_css_text({
+    const normalizedTruncate = true === truncate ? 'end' : false === truncate ? void 0 : truncate;
+    const variantArgs = {
         size,
         weight,
         align,
         color,
-        truncate
-    })} ${className}` : Text_css_text({
-        size,
-        weight,
-        align,
-        color,
-        truncate
-    });
+        truncate: normalizedTruncate,
+        italic,
+        textTransform,
+        decoration,
+        letterSpacing,
+        lineHeight,
+        textWrap,
+        variant
+    };
+    const classes = className ? `${Text_css_text(variantArgs)} ${className}` : Text_css_text(variantArgs);
     const spacingStyle = resolveSpacingStyle({
         m,
         mt,
@@ -374,10 +422,26 @@ const Text = /*#__PURE__*/ (0, external_react_namespaceObject.forwardRef)((_0, _
         px,
         py
     });
+    const inheritStyle = inherit ? {
+        fontFamily: 'inherit',
+        fontSize: 'inherit',
+        fontWeight: 'inherit',
+        color: 'inherit',
+        lineHeight: 'inherit'
+    } : void 0;
+    const gradientStyle = 'gradient' === variant && gradient ? {
+        backgroundImage: `linear-gradient(${String(null != (_gradient_deg = gradient.deg) ? _gradient_deg : 45)}deg, ${gradient.from}, ${gradient.to})`
+    } : void 0;
+    const lineClampStyle = void 0 !== lineClamp ? {
+        display: '-webkit-box',
+        WebkitLineClamp: lineClamp,
+        WebkitBoxOrient: 'vertical',
+        overflow: 'hidden'
+    } : void 0;
     return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(Component, _object_spread_props(_object_spread({
         ref: themedRef,
         className: classes,
-        style: _object_spread({}, spacingStyle, style)
+        style: _object_spread({}, spacingStyle, inheritStyle, gradientStyle, lineClampStyle, style)
     }, rest), {
         children: children
     }));

package/dist/cjs/label.css

@@ -94,6 +94,96 @@
 ._4sie9wn {
   text-overflow: ellipsis;
   white-space: nowrap;
+  max-width: 100%;
+  display: inline-block;
   overflow: hidden;
 }
 
+._4sie9wo {
+  text-overflow: ellipsis;
+  white-space: nowrap;
+  text-align: left;
+  direction: rtl;
+  max-width: 100%;
+  display: inline-block;
+  overflow: hidden;
+}
+
+._4sie9wp {
+  font-style: italic;
+}
+
+._4sie9wq {
+  text-transform: uppercase;
+}
+
+._4sie9wr {
+  text-transform: lowercase;
+}
+
+._4sie9ws {
+  text-transform: capitalize;
+}
+
+._4sie9wt {
+  text-transform: none;
+}
+
+._4sie9wu {
+  text-decoration: underline;
+}
+
+._4sie9wv {
+  text-decoration: line-through;
+}
+
+._4sie9ww {
+  text-decoration: none;
+}
+
+._4sie9wx {
+  letter-spacing: var(--vinyasa-letter-spacing-tight);
+}
+
+._4sie9wy {
+  letter-spacing: var(--vinyasa-letter-spacing-normal);
+}
+
+._4sie9wz {
+  letter-spacing: var(--vinyasa-letter-spacing-wide);
+}
+
+._4sie9w10 {
+  line-height: var(--vinyasa-line-height-tight);
+}
+
+._4sie9w11 {
+  line-height: var(--vinyasa-line-height-normal);
+}
+
+._4sie9w12 {
+  line-height: var(--vinyasa-line-height-loose);
+}
+
+._4sie9w13 {
+  text-wrap: wrap;
+}
+
+._4sie9w14 {
+  text-wrap: balance;
+}
+
+._4sie9w15 {
+  text-wrap: pretty;
+}
+
+._4sie9w16 {
+  text-wrap: nowrap;
+}
+
+._4sie9w17 {
+  color: rgba(0, 0, 0, 0);
+  -webkit-background-clip: text;
+  background-clip: text;
+}
+

package/dist/cjs/link.cjs

@@ -227,7 +227,41 @@ var Text_css_text = createRuntimeFn({
             error: '_4sie9wm'
         },
         truncate: {
-            true: '_4sie9wn'
+            end: '_4sie9wn',
+            start: '_4sie9wo'
+        },
+        italic: {
+            true: '_4sie9wp'
+        },
+        textTransform: {
+            uppercase: '_4sie9wq',
+            lowercase: '_4sie9wr',
+            capitalize: '_4sie9ws',
+            none: '_4sie9wt'
+        },
+        decoration: {
+            underline: '_4sie9wu',
+            'line-through': '_4sie9wv',
+            none: '_4sie9ww'
+        },
+        letterSpacing: {
+            tight: '_4sie9wx',
+            normal: '_4sie9wy',
+            wide: '_4sie9wz'
+        },
+        lineHeight: {
+            tight: '_4sie9w10',
+            normal: '_4sie9w11',
+            loose: '_4sie9w12'
+        },
+        textWrap: {
+            wrap: '_4sie9w13',
+            balance: '_4sie9w14',
+            pretty: '_4sie9w15',
+            nowrap: '_4sie9w16'
+        },
+        variant: {
+            gradient: '_4sie9w17'
         }
     },
     defaultVariants: {
@@ -319,13 +353,23 @@ const Text = /*#__PURE__*/ (0, external_react_namespaceObject.forwardRef)((_0, _
     let _ref = [
         _0,
         _1
-    ], [_ref1, ..._rest] = _ref, { as: Component = 'span', size, weight, align, color, truncate, m, mt, mr, mb, ml, mx, my, p, pt, pr, pb, pl, px, py, className, style, children } = _ref1, rest = _object_without_properties(_ref1, [
+    ], [_ref1, ..._rest] = _ref, { as: Component = 'span', size, weight, align, color, truncate, italic, textTransform, decoration, letterSpacing, lineHeight, textWrap, variant, lineClamp, inherit, gradient, m, mt, mr, mb, ml, mx, my, p, pt, pr, pb, pl, px, py, className, style, children } = _ref1, rest = _object_without_properties(_ref1, [
         "as",
         "size",
         "weight",
         "align",
         "color",
         "truncate",
+        "italic",
+        "textTransform",
+        "decoration",
+        "letterSpacing",
+        "lineHeight",
+        "textWrap",
+        "variant",
+        "lineClamp",
+        "inherit",
+        "gradient",
         "m",
         "mt",
         "mr",
@@ -344,20 +388,24 @@ const Text = /*#__PURE__*/ (0, external_react_namespaceObject.forwardRef)((_0, _
         "style",
         "children"
     ]), [ref] = _rest;
+    var _gradient_deg;
     const themedRef = (0, tokens_namespaceObject.useThemedRef)(ref);
-    const classes = className ? `${Text_css_text({
+    const normalizedTruncate = true === truncate ? 'end' : false === truncate ? void 0 : truncate;
+    const variantArgs = {
         size,
         weight,
         align,
         color,
-        truncate
-    })} ${className}` : Text_css_text({
-        size,
-        weight,
-        align,
-        color,
-        truncate
-    });
+        truncate: normalizedTruncate,
+        italic,
+        textTransform,
+        decoration,
+        letterSpacing,
+        lineHeight,
+        textWrap,
+        variant
+    };
+    const classes = className ? `${Text_css_text(variantArgs)} ${className}` : Text_css_text(variantArgs);
     const spacingStyle = resolveSpacingStyle({
         m,
         mt,
@@ -374,10 +422,26 @@ const Text = /*#__PURE__*/ (0, external_react_namespaceObject.forwardRef)((_0, _
         px,
         py
     });
+    const inheritStyle = inherit ? {
+        fontFamily: 'inherit',
+        fontSize: 'inherit',
+        fontWeight: 'inherit',
+        color: 'inherit',
+        lineHeight: 'inherit'
+    } : void 0;
+    const gradientStyle = 'gradient' === variant && gradient ? {
+        backgroundImage: `linear-gradient(${String(null != (_gradient_deg = gradient.deg) ? _gradient_deg : 45)}deg, ${gradient.from}, ${gradient.to})`
+    } : void 0;
+    const lineClampStyle = void 0 !== lineClamp ? {
+        display: '-webkit-box',
+        WebkitLineClamp: lineClamp,
+        WebkitBoxOrient: 'vertical',
+        overflow: 'hidden'
+    } : void 0;
     return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(Component, _object_spread_props(_object_spread({
         ref: themedRef,
         className: classes,
-        style: _object_spread({}, spacingStyle, style)
+        style: _object_spread({}, spacingStyle, inheritStyle, gradientStyle, lineClampStyle, style)
     }, rest), {
         children: children
     }));

package/dist/cjs/link.css

@@ -94,9 +94,99 @@
 ._4sie9wn {
   text-overflow: ellipsis;
   white-space: nowrap;
+  max-width: 100%;
+  display: inline-block;
   overflow: hidden;
 }
 
+._4sie9wo {
+  text-overflow: ellipsis;
+  white-space: nowrap;
+  text-align: left;
+  direction: rtl;
+  max-width: 100%;
+  display: inline-block;
+  overflow: hidden;
+}
+
+._4sie9wp {
+  font-style: italic;
+}
+
+._4sie9wq {
+  text-transform: uppercase;
+}
+
+._4sie9wr {
+  text-transform: lowercase;
+}
+
+._4sie9ws {
+  text-transform: capitalize;
+}
+
+._4sie9wt {
+  text-transform: none;
+}
+
+._4sie9wu {
+  text-decoration: underline;
+}
+
+._4sie9wv {
+  text-decoration: line-through;
+}
+
+._4sie9ww {
+  text-decoration: none;
+}
+
+._4sie9wx {
+  letter-spacing: var(--vinyasa-letter-spacing-tight);
+}
+
+._4sie9wy {
+  letter-spacing: var(--vinyasa-letter-spacing-normal);
+}
+
+._4sie9wz {
+  letter-spacing: var(--vinyasa-letter-spacing-wide);
+}
+
+._4sie9w10 {
+  line-height: var(--vinyasa-line-height-tight);
+}
+
+._4sie9w11 {
+  line-height: var(--vinyasa-line-height-normal);
+}
+
+._4sie9w12 {
+  line-height: var(--vinyasa-line-height-loose);
+}
+
+._4sie9w13 {
+  text-wrap: wrap;
+}
+
+._4sie9w14 {
+  text-wrap: balance;
+}
+
+._4sie9w15 {
+  text-wrap: pretty;
+}
+
+._4sie9w16 {
+  text-wrap: nowrap;
+}
+
+._4sie9w17 {
+  color: rgba(0, 0, 0, 0);
+  -webkit-background-clip: text;
+  background-clip: text;
+}
+
 ._1laoo9r0 {
   text-decoration: none;
 }