@cfx-dev/ui-components 4.4.0 → 4.5.1

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

@@ -1,8 +1,8 @@
-import { TextOpacity, ResponsiveTextSize, TextPropsWithRef } from './Text.types';
+import { TextOpacity, ResponsiveTextSize, TextPropsWithRef, TextSpecificOpacity } from './Text.types';
 
 export declare const textSizeResponsiveValueFormatter: (val: ResponsiveTextSize) => string;
 export declare const lineHeightResponsiveValueFormatter: (val: ResponsiveTextSize) => string;
-export declare const TEXT_OPACITY_MAP: Record<TextOpacity, number | string>;
+export declare const TEXT_OPACITY_MAP: Record<TextSpecificOpacity, number | string>;
 export declare const getTextOpacity: (opacity?: TextOpacity, otherwise?: string | number) => string | number;
 export declare const DEFAULT_TEXT_COLOR = "primary";
 export declare function Text(props: TextPropsWithRef): import("react/jsx-runtime").JSX.Element;

package/dist/components/Text/Text.js

@@ -1,105 +1,102 @@
-import { jsx as c } from "react/jsx-runtime";
-import { clsx as E } from "../../utils/clsx.js";
-import { getColor as O } from "../../utils/color.js";
-import { ui as o } from "../../utils/ui/ui.js";
-import { TextSizeEnum as a } from "../../utils/ui/ui.types.js";
-const H = "cfxui__Text__root__2fe11", N = "cfxui__Text__centered__4d7bd", $ = "cfxui__Text__underlined__5860e", w = "cfxui__Text__strikethrough__e3ee3", P = "cfxui__Text__truncated__417f4", q = "cfxui__Text__typographic__d8155", B = "cfxui__Text__block__cb1b6", r = {
-  root: H,
-  centered: N,
+import { jsx as a } from "react/jsx-runtime";
+import { clsx as H } from "../../utils/clsx.js";
+import { getColor as N } from "../../utils/color.js";
+import { ui as t } from "../../utils/ui/ui.js";
+import { TextSizeEnum as s } from "../../utils/ui/ui.types.js";
+const O = "cfxui__Text__root__2fe11", P = "cfxui__Text__centered__4d7bd", $ = "cfxui__Text__underlined__5860e", w = "cfxui__Text__strikethrough__e3ee3", B = "cfxui__Text__truncated__417f4", D = "cfxui__Text__typographic__d8155", I = "cfxui__Text__block__cb1b6", r = {
+  root: O,
+  centered: P,
   underlined: $,
   strikethrough: w,
-  truncated: P,
-  typographic: q,
-  block: B
-}, D = (e) => e in a ? o.fontSize(e) : typeof e == "number" ? o.q(e) : e, I = (e) => e in a ? o.lineHeight(e) : typeof e == "number" ? o.q(e) : e, L = {
+  truncated: B,
+  typographic: D,
+  block: I
+}, L = (e) => e in s ? t.fontSize(e) : typeof e == "number" ? t.q(e) : e, M = (e) => e in s ? t.lineHeight(e) : typeof e == "number" ? e >= 100 ? (e / 100).toFixed(2) : t.lineHeight(s.normal) : e, V = {
   0: 0,
   25: "var(--text-opacity-25)",
   50: "var(--text-opacity-50)",
   75: "var(--text-opacity-75)",
   100: 1
-}, M = {
+}, X = {
   h1: "h1",
   h2: "h2",
   h3: "h3",
   h4: "h4",
   h5: "h5",
   h6: "h6"
-}, V = (e, n = 1) => {
-  const t = typeof e == "string" && L[e];
-  return typeof t == "string" || typeof t == "number" ? t : n;
-}, X = "primary";
-function j(e) {
+}, j = (e, o = 1) => typeof e == "number" ? e : typeof e == "string" && V[e] || o, q = "primary";
+function G(e) {
   const {
-    family: n,
-    size: t = "normal",
-    weight: l = "normal",
-    letterSpacing: f = "normal",
+    family: o,
+    size: n = "normal",
+    lineHeight: l = n,
+    weight: f = "normal",
+    letterSpacing: u = "normal",
     color: _,
-    opacity: u,
+    opacity: p,
     as: i = "span",
-    centered: p = !1,
-    truncated: h = !1,
-    typographic: m = !1,
+    centered: h = !1,
+    truncated: m = !1,
+    typographic: d = !1,
     uppercase: g = !1,
-    userSelectable: d = !1,
+    userSelectable: x = !1,
     underlined: y = !1,
-    strikethrough: x = !1,
-    children: T,
-    className: b,
-    style: k,
-    ref: S,
-    htmlFor: C,
-    id: R
-  } = e, v = i === "div", z = E(
+    strikethrough: T = !1,
+    children: b,
+    className: k,
+    style: S,
+    ref: C,
+    htmlFor: R,
+    id: F
+  } = e, z = i === "div", v = H(
     r.root,
-    b,
-    o.getResponsiveClassnames("font-size", t),
-    o.getResponsiveClassnames("line-height", t),
+    k,
+    t.getResponsiveClassnames("font-size", n),
+    t.getResponsiveClassnames("line-height", n),
     {
-      [r.block]: v,
-      [r.centered]: p,
-      [r.truncated]: h,
+      [r.block]: z,
+      [r.centered]: h,
+      [r.truncated]: m,
       [r.underlined]: y,
-      [r.strikethrough]: x,
-      [r.typographic]: m,
-      [o.cls.userSelectableText]: d
+      [r.strikethrough]: T,
+      [r.typographic]: d,
+      [t.cls.userSelectableText]: x
     }
-  ), F = O({
+  ), A = N({
     ...e,
-    color: _ || X,
-    opacity: V(u)
-  }), A = typeof n == "string" ? n : M[i] || "primary", s = {
-    color: F,
-    fontFamily: `var(--font-family-${A})`,
-    lineHeight: `var(--line-height-${t})`,
-    letterSpacing: `var(--letter-spacing-${f})`,
-    fontWeight: `var(--font-weight-${l})`,
-    ...o.getResponsiveStyles("font-size", t, D),
-    ...o.getResponsiveStyles("line-height", t, I),
-    ...k
+    color: _ || q,
+    opacity: j(p)
+  }), E = typeof o == "string" ? o : X[i] || "primary", c = {
+    color: A,
+    fontFamily: `var(--font-family-${E})`,
+    letterSpacing: `var(--letter-spacing-${u})`,
+    fontWeight: `var(--font-weight-${f})`,
+    ...t.getResponsiveStyles("font-size", n, L),
+    ...t.getResponsiveStyles("line-height", l, M),
+    ...S
   };
-  return g && (s.textTransform = "uppercase"), /* @__PURE__ */ c(
+  return g && (c.textTransform = "uppercase"), /* @__PURE__ */ a(
     i,
     {
-      ref: S,
+      ref: C,
       dir: "auto",
-      className: z,
-      style: s,
-      htmlFor: C,
-      id: R,
-      children: T
+      className: v,
+      style: c,
+      htmlFor: R,
+      id: F,
+      children: b
     }
   );
 }
-function Q(e) {
-  return /* @__PURE__ */ c(j, { ...e, as: "div" });
+function Z(e) {
+  return /* @__PURE__ */ a(G, { ...e, as: "div" });
 }
 export {
-  X as DEFAULT_TEXT_COLOR,
-  L as TEXT_OPACITY_MAP,
-  j as Text,
-  Q as TextBlock,
-  V as getTextOpacity,
-  I as lineHeightResponsiveValueFormatter,
-  D as textSizeResponsiveValueFormatter
+  q as DEFAULT_TEXT_COLOR,
+  V as TEXT_OPACITY_MAP,
+  G as Text,
+  Z as TextBlock,
+  j as getTextOpacity,
+  M as lineHeightResponsiveValueFormatter,
+  L as textSizeResponsiveValueFormatter
 };

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

@@ -1,11 +1,13 @@
 import { default as React } from 'react';
 import { GetColorProps } from '../../utils/color';
 import { ResponsiveValueType, TextSize as RawTextSize } from '../../utils/ui';
+import { OpacityRange } from '../../utils/ui/ui.types';
 
 export type TextSize = RawTextSize;
 export type ResponsiveTextSize = TextSize | string | number;
 export type TextWeight = 'thin' | 'normal' | 'bold' | 'bolder';
-export type TextOpacity = '0' | '25' | '50' | '75' | '100';
+export type TextSpecificOpacity = '0' | '25' | '50' | '75' | '100';
+export type TextOpacity = TextSpecificOpacity | OpacityRange;
 export type TextAs = 'span' | 'div' | 'p' | 'label' | 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6';
 export type TextLetterSpacing = 'normal' | 'large';
 export type TextFamaly = 'primary' | 'secondary';
@@ -27,6 +29,7 @@ interface TextPropsBase {
     size?: ResponsiveValueType<ResponsiveTextSize>;
     weight?: TextWeight;
     letterSpacing?: TextLetterSpacing;
+    lineHeight?: ResponsiveValueType<number>;
     family?: TextFamaly;
     children?: React.ReactNode;
     className?: string;

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

@@ -1,3 +1,3 @@
-export { Text, TextBlock, TEXT_OPACITY_MAP, DEFAULT_TEXT_COLOR, getTextOpacity, textSizeResponsiveValueFormatter, } from './Text';
+export { Text, TextBlock, TEXT_OPACITY_MAP, DEFAULT_TEXT_COLOR, getTextOpacity, textSizeResponsiveValueFormatter, lineHeightResponsiveValueFormatter, } from './Text';
 export { TextSizeEnum } from '../../utils/ui';
 export type { TextSize, TextWeight, TextOpacity, TextAs, TextLetterSpacing, TextProps, TextColorProps, ResponsiveTextSize, TextFamaly, TextPropsWithRef, } from './Text.types';

package/dist/components/Text/index.js

@@ -1,12 +1,13 @@
-import { DEFAULT_TEXT_COLOR as o, TEXT_OPACITY_MAP as r, Text as x, TextBlock as i, getTextOpacity as m, textSizeResponsiveValueFormatter as p } from "./Text.js";
+import { DEFAULT_TEXT_COLOR as T, TEXT_OPACITY_MAP as r, Text as i, TextBlock as x, getTextOpacity as m, lineHeightResponsiveValueFormatter as p, textSizeResponsiveValueFormatter as a } from "./Text.js";
 import "../../utils/ui/ui.js";
-import { TextSizeEnum as O } from "../../utils/ui/ui.types.js";
+import { TextSizeEnum as n } from "../../utils/ui/ui.types.js";
 export {
-  o as DEFAULT_TEXT_COLOR,
+  T as DEFAULT_TEXT_COLOR,
   r as TEXT_OPACITY_MAP,
-  x as Text,
-  i as TextBlock,
-  O as TextSizeEnum,
+  i as Text,
+  x as TextBlock,
+  n as TextSizeEnum,
   m as getTextOpacity,
-  p as textSizeResponsiveValueFormatter
+  p as lineHeightResponsiveValueFormatter,
+  a as textSizeResponsiveValueFormatter
 };

package/dist/main.d.ts

@@ -16,7 +16,7 @@ export type { SetTimeoutReturn } from './utils/execution';
 export { getColor } from './utils/color';
 export type { GetColorProps } from './utils/color';
 export { ui, OffsetEnum, MediaQueryEnum, BorderRadiusEnum, ZIndexEnum, ColorEnum, } from './utils/ui';
-export type { OffsetType, MediaQueryType, ResponsiveOffsetType, ResponsiveValueType, MPProps, BorderRadiusType, ZIndexType, ColorType, } from './utils/ui';
+export type { OffsetType, MediaQueryType, ResponsiveOffsetType, ResponsiveValueType, MPProps, BorderRadiusType, ZIndexType, ColorType, OpacityRange, } from './utils/ui';
 export { isInEnum } from './utils/enum';
 export { joaat32 } from './utils/joaat32';
 export { IconButton } from './components/IconButton';
@@ -125,7 +125,7 @@ export { Table, TableIconButton, } from './components/Table';
 export type { TableRootProps, TableBodyProps, TableHeaderProps, TableCellProps, TableRowProps, } from './components/Table';
 export { TableResponsiveText } from './components/TableResponsiveText';
 export type { TableResponsiveTextProps } from './components/TableResponsiveText';
-export { TextSizeEnum, Text, TextBlock, getTextOpacity, DEFAULT_TEXT_COLOR, TEXT_OPACITY_MAP, textSizeResponsiveValueFormatter, } from './components/Text';
+export { TextSizeEnum, Text, TextBlock, getTextOpacity, DEFAULT_TEXT_COLOR, TEXT_OPACITY_MAP, textSizeResponsiveValueFormatter, lineHeightResponsiveValueFormatter, } from './components/Text';
 export type { TextSize, TextWeight, TextOpacity, TextAs, TextLetterSpacing, TextProps, TextColorProps, TextFamaly, TextPropsWithRef, } from './components/Text';
 export { Label } from './components/Label';
 export type { LabelProps } from './components/Label';