@cfx-dev/ui-components 4.5.21 → 5.0.1

package/dist/components/Input/RichInput.js

@@ -1,83 +1,69 @@
-import { jsxs as B, jsx as t } from "react/jsx-runtime";
-import i from "react";
-import D from "../Button/Button.js";
-import { clsx as F } from "../../utils/clsx.js";
+import { jsxs as D, jsx as o } from "react/jsx-runtime";
+import r from "react";
+import F from "../Button/Button.js";
+import { clsx as L } from "../../utils/clsx.js";
 import "../../utils/links.js";
-import { useDynamicRef as s } from "../../utils/hooks/useDynamicRef.js";
+import { useDynamicRef as u } from "../../utils/hooks/useDynamicRef.js";
 import "../../utils/hooks/useGlobalKeyboardEvent.js";
 import "../../utils/hooks/useKeyboardClose.js";
 import "../../index-Cl_RnsqN.js";
-import { ui as L } from "../../utils/ui/ui.js";
-const T = "cfxui__RichInput__root__57e6e", j = "cfxui__RichInput__renderer__8b298", w = "cfxui__RichInput__clear__5538b", c = {
-  root: T,
-  renderer: j,
-  clear: w,
-  "richinputSizeinitial-large": "cfxui__RichInput__richinputSizeinitial-large__4991c",
-  "richinputSizeinitial-small": "cfxui__RichInput__richinputSizeinitial-small__cb0af",
-  "richinputSizesmall-large": "cfxui__RichInput__richinputSizesmall-large__d8bc8",
-  "richinputSizesmall-small": "cfxui__RichInput__richinputSizesmall-small__2f49a",
-  "richinputSizesmall-medium-large": "cfxui__RichInput__richinputSizesmall-medium-large__e3523",
-  "richinputSizesmall-medium-small": "cfxui__RichInput__richinputSizesmall-medium-small__a84f9",
-  "richinputSizemedium-large": "cfxui__RichInput__richinputSizemedium-large__80e93",
-  "richinputSizemedium-small": "cfxui__RichInput__richinputSizemedium-small__f42a7",
-  "richinputSizemedium-large-large": "cfxui__RichInput__richinputSizemedium-large-large__b8650",
-  "richinputSizemedium-large-small": "cfxui__RichInput__richinputSizemedium-large-small__30be4",
-  "richinputSizelarge-large": "cfxui__RichInput__richinputSizelarge-large__13d43",
-  "richinputSizelarge-small": "cfxui__RichInput__richinputSizelarge-small__de800",
-  "richinputSizexlarge-large": "cfxui__RichInput__richinputSizexlarge-large__fe171",
-  "richinputSizexlarge-small": "cfxui__RichInput__richinputSizexlarge-small__32365"
+import { ui as T } from "../../utils/ui/ui.js";
+const j = "cfxui__RichInput__root__57e6e", w = "cfxui__RichInput__renderer__8b298", z = "cfxui__RichInput__clear__5538b", c = {
+  root: j,
+  renderer: w,
+  clear: z
 };
-function P(o) {
+function P(f) {
   const {
-    size: m = "normal",
+    size: m = "medium",
     value: a,
     onChange: p,
-    onFocus: h,
-    onBlur: f,
-    onSelect: d,
-    onKeyDown: g,
-    className: S,
-    rendered: z,
-    placeholder: R,
-    autoFocus: x,
-    withClearButton: I = !1,
-    ref: C
-  } = o, _ = i.useRef(null), r = i.useRef(null), l = s(p), n = s(d), b = i.useCallback((e) => {
-    l.current(e.target.value);
-  }, [l]), k = i.useCallback(() => {
+    onFocus: d,
+    onBlur: _,
+    onSelect: h,
+    onKeyDown: C,
+    className: R,
+    rendered: g,
+    placeholder: x,
+    autoFocus: S,
+    withClearButton: b = !1,
+    ref: k
+  } = f, i = r.useRef(null), t = r.useRef(null), n = u(p), l = u(h), I = r.useCallback((e) => {
+    n.current(e.target.value);
+  }, [n]), N = r.useCallback(() => {
     var e;
-    l.current(""), (e = _.current) == null || e.focus();
-  }, [l]), N = i.useCallback((e) => {
-    if (!n.current || !(e.target instanceof HTMLInputElement))
+    n.current(""), (e = i.current) == null || e.focus();
+  }, [n]), v = r.useCallback((e) => {
+    if (!l.current || !(e.target instanceof HTMLInputElement))
       return;
-    const u = e.target;
-    n.current(u.selectionStart, u.selectionEnd, u.selectionDirection);
-  }, [n]), v = i.useCallback((e) => {
-    r.current && (r.current.scrollTop = e.target.scrollTop, r.current.scrollLeft = e.target.scrollLeft);
-  }, []), y = F(
+    const s = e.target;
+    l.current(s.selectionStart, s.selectionEnd, s.selectionDirection);
+  }, [l]), y = r.useCallback((e) => {
+    t.current && (t.current.scrollTop = e.target.scrollTop, t.current.scrollLeft = e.target.scrollLeft);
+  }, []), B = L(
     c.root,
-    S,
-    L.getResponsiveFlatClassnames("richinput-size", m).map((e) => c[e])
+    R,
+    T.getResponsiveFlatClassnames("richinput-size", m).map((e) => c[e])
   );
-  return /* @__PURE__ */ B("div", { ref: C, className: y, children: [
-    /* @__PURE__ */ t(
+  return /* @__PURE__ */ D("div", { ref: k, className: B, children: [
+    /* @__PURE__ */ o(
       "input",
       {
-        ref: _,
-        autoFocus: x,
+        ref: i,
+        autoFocus: S,
         type: "text",
         value: a,
-        onChange: b,
-        placeholder: R,
-        onBlur: f,
-        onFocus: h,
-        onScroll: v,
-        onSelect: N,
-        onKeyDown: g
+        onChange: I,
+        placeholder: x,
+        onBlur: _,
+        onFocus: d,
+        onScroll: y,
+        onSelect: v,
+        onKeyDown: C
       }
     ),
-    /* @__PURE__ */ t("div", { ref: r, className: c.renderer, children: z }),
-    I && a && /* @__PURE__ */ t("div", { className: c.clear, children: /* @__PURE__ */ t(D, { icon: "Close", onClick: k }) })
+    /* @__PURE__ */ o("div", { ref: t, className: c.renderer, children: g }),
+    b && a && /* @__PURE__ */ o("div", { className: c.clear, children: /* @__PURE__ */ o(F, { icon: "Close", onClick: N }) })
   ] });
 }
 export {

package/dist/components/InputDropzone/InputDropzone.js

@@ -2,7 +2,7 @@ import { jsxs as wa, jsx as B } from "react/jsx-runtime";
 import oa, { useMemo as T, useRef as ea, useReducer as hi, useEffect as ka, useCallback as y, forwardRef as yi, useImperativeHandle as wi, Fragment as ki } from "react";
 import { P as s } from "../../index-DQMInta3.js";
 import { a as I } from "../../tslib.es6-CtHwNPxX.js";
-import { IconBig as ji } from "../IconBig/IconBig.js";
+import { Icon as ji } from "../Icon/Icon.js";
 import { Text as Na } from "../Text/Text.js";
 import { clsx as Di } from "../../utils/clsx.js";
 import Wa from "./ItemPreview.js";
@@ -1436,8 +1436,8 @@ function Ki(a, i) {
     try {
       for (t = t.call(a); !(p = (l = t.next()).done) && (n.push(l.value), !(i && n.length === i)); p = !0)
         ;
-    } catch (u) {
-      o = !0, r = u;
+    } catch (v) {
+      o = !0, r = v;
     } finally {
       try {
         !p && t.return != null && t.return();
@@ -1491,8 +1491,8 @@ function P(a) {
 }
 function Vi(a) {
   var i = a.files, t = a.accept, n = a.minSize, p = a.maxSize, o = a.multiple, l = a.maxFiles, r = a.validator;
-  return !o && i.length > 1 || o && l >= 1 && i.length > l ? !1 : i.every(function(u) {
-    var k = oi(u, t), z = U(k, 1), A = z[0], j = ci(u, n, p), _ = U(j, 1), E = _[0], F = r ? r(u) : null;
+  return !o && i.length > 1 || o && l >= 1 && i.length > l ? !1 : i.every(function(v) {
+    var k = oi(v, t), z = U(k, 1), A = z[0], j = ci(v, n, p), _ = U(j, 1), E = _[0], F = r ? r(v) : null;
     return A && E && !F;
   });
 }
@@ -1584,9 +1584,9 @@ function mt(a) {
   if (Array.isArray(a)) return _a(a);
 }
 function Da(a, i) {
-  return ft(a) || ut(a, i) || si(a, i) || vt();
+  return ft(a) || vt(a, i) || si(a, i) || ut();
 }
-function vt() {
+function ut() {
   throw new TypeError(`Invalid attempt to destructure non-iterable instance.
 In order to be iterable, non-array objects must have a [Symbol.iterator]() method.`);
 }
@@ -1604,15 +1604,15 @@ function _a(a, i) {
     n[t] = a[t];
   return n;
 }
-function ut(a, i) {
+function vt(a, i) {
   var t = a == null ? null : typeof Symbol < "u" && a[Symbol.iterator] || a["@@iterator"];
   if (t != null) {
     var n = [], p = !0, o = !1, l, r;
     try {
       for (t = t.call(a); !(p = (l = t.next()).done) && (n.push(l.value), !(i && n.length === i)); p = !0)
         ;
-    } catch (u) {
-      o = !0, r = u;
+    } catch (v) {
+      o = !0, r = v;
     } finally {
       try {
         !p && t.return != null && t.return();
@@ -1873,7 +1873,7 @@ var Fa = {
   fileRejections: []
 };
 function mi() {
-  var a = arguments.length > 0 && arguments[0] !== void 0 ? arguments[0] : {}, i = d(d({}, di), a), t = i.accept, n = i.disabled, p = i.getFilesFromEvent, o = i.maxSize, l = i.minSize, r = i.multiple, u = i.maxFiles, k = i.onDragEnter, z = i.onDragLeave, A = i.onDragOver, j = i.onDrop, _ = i.onDropAccepted, E = i.onDropRejected, F = i.onFileDialogCancel, M = i.onFileDialogOpen, Y = i.useFsAccessApi, G = i.autoFocus, $ = i.preventDropOnDocument, J = i.noClick, K = i.noKeyboard, V = i.noDrag, f = i.noDragEventsBubbling, sa = i.onError, H = i.validator, N = T(function() {
+  var a = arguments.length > 0 && arguments[0] !== void 0 ? arguments[0] : {}, i = d(d({}, di), a), t = i.accept, n = i.disabled, p = i.getFilesFromEvent, o = i.maxSize, l = i.minSize, r = i.multiple, v = i.maxFiles, k = i.onDragEnter, z = i.onDragLeave, A = i.onDragOver, j = i.onDrop, _ = i.onDropAccepted, E = i.onDropRejected, F = i.onFileDialogCancel, M = i.onFileDialogOpen, Y = i.useFsAccessApi, G = i.autoFocus, $ = i.preventDropOnDocument, J = i.noClick, K = i.noKeyboard, V = i.noDrag, f = i.noDragEventsBubbling, sa = i.onError, H = i.validator, N = T(function() {
     return tt(t);
   }, [t]), Pa = T(function() {
     return it(t);
@@ -1881,7 +1881,7 @@ function mi() {
     return typeof M == "function" ? M : ii;
   }, [M]), Q = T(function() {
     return typeof F == "function" ? F : ii;
-  }, [F]), x = ea(null), h = ea(null), vi = hi(gt, Fa), Ia = Da(vi, 2), ma = Ia[0], g = Ia[1], ui = ma.isFocused, Ra = ma.isFileDialogActive, X = ea(typeof window < "u" && window.isSecureContext && Y && at()), qa = function() {
+  }, [F]), x = ea(null), h = ea(null), ui = hi(gt, Fa), Ia = Da(ui, 2), ma = Ia[0], g = Ia[1], vi = ma.isFocused, Ra = ma.isFileDialogActive, X = ea(typeof window < "u" && window.isSecureContext && Y && at()), qa = function() {
     !X.current && Ra && setTimeout(function() {
       if (h.current) {
         var c = h.current.files;
@@ -1912,17 +1912,17 @@ function mi() {
   }, [sa]), Sa = y(function(e) {
     e.preventDefault(), e.persist(), ta(e), R.current = [].concat(rt(R.current), [e.target]), pa(e) && Promise.resolve(p(e)).then(function(c) {
       if (!(la(e) && !f)) {
-        var m = c.length, v = m > 0 && Vi({
+        var m = c.length, u = m > 0 && Vi({
           files: c,
           accept: N,
           minSize: l,
           maxSize: o,
           multiple: r,
-          maxFiles: u,
+          maxFiles: v,
           validator: H
-        }), b = m > 0 && !v;
+        }), b = m > 0 && !u;
         g({
-          isDragAccept: v,
+          isDragAccept: u,
           isDragReject: b,
           isDragActive: !0,
           type: "setDraggedFiles"
@@ -1931,7 +1931,7 @@ function mi() {
     }).catch(function(c) {
       return O(c);
     });
-  }, [p, k, O, f, N, l, o, r, u, H]), Ta = y(function(e) {
+  }, [p, k, O, f, N, l, o, r, v, H]), Ta = y(function(e) {
     e.preventDefault(), e.persist(), ta(e);
     var c = pa(e);
     if (c && e.dataTransfer)
@@ -1942,8 +1942,8 @@ function mi() {
     return c && A && A(e), !1;
   }, [A, f]), La = y(function(e) {
     e.preventDefault(), e.persist(), ta(e);
-    var c = R.current.filter(function(v) {
-      return x.current && x.current.contains(v);
+    var c = R.current.filter(function(u) {
+      return x.current && x.current.contains(u);
     }), m = c.indexOf(e.target);
     m !== -1 && c.splice(m, 1), R.current = c, !(c.length > 0) && (g({
       type: "setDraggedFiles",
@@ -1952,32 +1952,32 @@ function mi() {
       isDragReject: !1
     }), pa(e) && z && z(e));
   }, [x, z, f]), Z = y(function(e, c) {
-    var m = [], v = [];
+    var m = [], u = [];
     e.forEach(function(b) {
-      var W = oi(b, N), S = Da(W, 2), ua = S[0], fa = S[1], xa = ci(b, l, o), na = Da(xa, 2), ga = na[0], ba = na[1], ha = H ? H(b) : null;
-      if (ua && ga && !ha)
+      var W = oi(b, N), S = Da(W, 2), va = S[0], fa = S[1], xa = ci(b, l, o), na = Da(xa, 2), ga = na[0], ba = na[1], ha = H ? H(b) : null;
+      if (va && ga && !ha)
         m.push(b);
       else {
         var ya = [fa, ba];
-        ha && (ya = ya.concat(ha)), v.push({
+        ha && (ya = ya.concat(ha)), u.push({
           file: b,
           errors: ya.filter(function(bi) {
             return bi;
           })
         });
       }
-    }), (!r && m.length > 1 || r && u >= 1 && m.length > u) && (m.forEach(function(b) {
-      v.push({
+    }), (!r && m.length > 1 || r && v >= 1 && m.length > v) && (m.forEach(function(b) {
+      u.push({
         file: b,
         errors: [Ji]
       });
     }), m.splice(0)), g({
       acceptedFiles: m,
-      fileRejections: v,
-      isDragReject: v.length > 0,
+      fileRejections: u,
+      isDragReject: u.length > 0,
       type: "setFiles"
-    }), j && j(m, v, c), v.length > 0 && E && E(v, c), m.length > 0 && _ && _(m, c);
-  }, [g, r, N, l, o, u, j, _, E, H]), aa = y(function(e) {
+    }), j && j(m, u, c), u.length > 0 && E && E(u, c), m.length > 0 && _ && _(m, c);
+  }, [g, r, N, l, o, v, j, _, E, H]), aa = y(function(e) {
     e.preventDefault(), e.persist(), ta(e), R.current = [], pa(e) && Promise.resolve(p(e)).then(function(c) {
       la(e) && !f || Z(c, e);
     }).catch(function(c) {
@@ -2024,7 +2024,7 @@ function mi() {
     J || (Zi() ? setTimeout(q, 0) : q());
   }, [J, q]), C = function(c) {
     return n ? null : c;
-  }, va = function(c) {
+  }, ua = function(c) {
     return K ? null : C(c);
   }, ia = function(c) {
     return V ? null : C(c);
@@ -2032,17 +2032,17 @@ function mi() {
     f && c.stopPropagation();
   }, fi = T(function() {
     return function() {
-      var e = arguments.length > 0 && arguments[0] !== void 0 ? arguments[0] : {}, c = e.refKey, m = c === void 0 ? "ref" : c, v = e.role, b = e.onKeyDown, W = e.onFocus, S = e.onBlur, ua = e.onClick, fa = e.onDragEnter, xa = e.onDragOver, na = e.onDragLeave, ga = e.onDrop, ba = ra(e, ct);
+      var e = arguments.length > 0 && arguments[0] !== void 0 ? arguments[0] : {}, c = e.refKey, m = c === void 0 ? "ref" : c, u = e.role, b = e.onKeyDown, W = e.onFocus, S = e.onBlur, va = e.onClick, fa = e.onDragEnter, xa = e.onDragOver, na = e.onDragLeave, ga = e.onDrop, ba = ra(e, ct);
       return d(d(Ea({
-        onKeyDown: va(w(b, Ma)),
-        onFocus: va(w(W, $a)),
-        onBlur: va(w(S, Ka)),
-        onClick: C(w(ua, Ha)),
+        onKeyDown: ua(w(b, Ma)),
+        onFocus: ua(w(W, $a)),
+        onBlur: ua(w(S, Ka)),
+        onClick: C(w(va, Ha)),
         onDragEnter: ia(w(fa, Sa)),
         onDragOver: ia(w(xa, Ta)),
         onDragLeave: ia(w(na, La)),
         onDrop: ia(w(ga, aa)),
-        role: typeof v == "string" && v !== "" ? v : "presentation"
+        role: typeof u == "string" && u !== "" ? u : "presentation"
       }, m, x), !n && !K ? {
         tabIndex: 0
       } : {}), ba);
@@ -2051,7 +2051,7 @@ function mi() {
     e.stopPropagation();
   }, []), gi = T(function() {
     return function() {
-      var e = arguments.length > 0 && arguments[0] !== void 0 ? arguments[0] : {}, c = e.refKey, m = c === void 0 ? "ref" : c, v = e.onChange, b = e.onClick, W = ra(e, lt), S = Ea({
+      var e = arguments.length > 0 && arguments[0] !== void 0 ? arguments[0] : {}, c = e.refKey, m = c === void 0 ? "ref" : c, u = e.onChange, b = e.onClick, W = ra(e, lt), S = Ea({
         accept: N,
         multiple: r,
         type: "file",
@@ -2067,7 +2067,7 @@ function mi() {
           width: "1px",
           whiteSpace: "nowrap"
         },
-        onChange: C(w(v, aa)),
+        onChange: C(w(u, aa)),
         onClick: C(w(b, xi)),
         tabIndex: -1
       }, m, h);
@@ -2075,7 +2075,7 @@ function mi() {
     };
   }, [h, t, r, aa, n]);
   return d(d({}, ma), {}, {
-    isFocused: ui && !n,
+    isFocused: vi && !n,
     getRootProps: fi,
     getInputProps: gi,
     rootRef: x,
@@ -2137,7 +2137,7 @@ function jt(a) {
     removeItemAriaLabel: o = "",
     rootAriaLabel: l = "",
     onRemoveFile: r,
-    onRemoveRejection: u,
+    onRemoveRejection: v,
     dropzoneItemClassName: k,
     dropzoneClassName: z,
     name: A,
@@ -2153,8 +2153,8 @@ function jt(a) {
   } = mi(j), J = oa.useCallback((f) => {
     r && r(f);
   }, [r]), K = oa.useCallback((f) => {
-    u && u(f);
-  }, [u]), V = Di(D.dropzone, z, {
+    v && v(f);
+  }, [v]), V = Di(D.dropzone, z, {
     [D.disabled]: j.disabled,
     [D.focused]: _,
     [D.dragActive]: E,
@@ -2172,7 +2172,16 @@ function jt(a) {
         }),
         children: [
           /* @__PURE__ */ B("input", { ...$({ name: A }) }),
-          /* @__PURE__ */ B(ji, { name: "Upload" }),
+          /* @__PURE__ */ B(
+            ji,
+            {
+              name: "Upload",
+              size: {
+                large: "xlarge",
+                initial: "medium"
+              }
+            }
+          ),
           /* @__PURE__ */ wa(Na, { className: D.text, children: [
             p ? `${n} ` : n,
             !!p && /* @__PURE__ */ B(

package/dist/components/InputDropzone/ItemPreview.js

@@ -1,29 +1,31 @@
-import { jsxs as l, jsx as c } from "react/jsx-runtime";
-import a from "react";
-import f from "../IconButton/IconButton.js";
-import { Text as n } from "../Text/Text.js";
-import { clsx as d } from "../../utils/clsx.js";
-const u = "cfxui__ItemPreview__root__bb9bc", h = "cfxui__ItemPreview__failed__98fb7", p = "cfxui__ItemPreview__filePath__54877", o = {
+import { jsxs as m, jsx as r } from "react/jsx-runtime";
+import i from "react";
+import n from "../Flex/Flex.js";
+import { clsx as s } from "../../utils/clsx.js";
+import p from "../IconButton/IconButton.js";
+import { Text as d } from "../Text/Text.js";
+const u = "cfxui__ItemPreview__root__bb9bc", w = "cfxui__ItemPreview__preview__fff25", x = "cfxui__ItemPreview__failed__98fb7", h = "cfxui__ItemPreview__filePath__54877", t = {
   root: u,
-  failed: h,
-  filePath: p
+  preview: w,
+  failed: x,
+  filePath: h
 };
 function P({
-  file: t,
-  onRemoveFile: r,
-  removeAriaLabel: e = "",
-  className: i,
-  theme: s = "default"
+  file: e,
+  onRemoveFile: a,
+  removeAriaLabel: o = "",
+  className: c,
+  theme: _ = "default"
 }) {
-  const m = a.useCallback(() => {
-    r(t);
-  }, [t, r]), _ = a.useMemo(() => `${e}${e ? ", " : ""}${t.path}`, [e, t.path]);
-  return /* @__PURE__ */ l("div", { className: d(o.root, o[s], i), children: [
-    /* @__PURE__ */ c(n, { family: "secondary", className: o.filePath, children: t.path }),
-    /* @__PURE__ */ c(f, { areaSize: "large", ariaLabel: _, name: "Close", onClick: m })
+  const f = i.useCallback(() => {
+    a(e);
+  }, [e, a]), l = i.useMemo(() => `${o}${o ? ", " : ""}${e.path}`, [o, e.path]);
+  return /* @__PURE__ */ m(n, { direction: "row", display: "flex", alignItems: "center", className: s(t.root, t[_], c), children: [
+    /* @__PURE__ */ r("div", { className: s(t.preview, t[_], c), children: /* @__PURE__ */ r(d, { family: "secondary", className: t.filePath, children: e.path }) }),
+    /* @__PURE__ */ r(p, { areaSize: "large", ariaLabel: l, name: "Close", onClick: f })
   ] });
 }
-const $ = a.memo(P);
+const g = i.memo(P);
 export {
-  $ as default
+  g as default
 };

package/dist/components/Layout/Pad/Pad.d.ts

@@ -4,9 +4,9 @@ export interface PadProps {
     children?: React.ReactNode;
     className?: string;
     /**
-     * 'normal' by default
+     * 'medium' by default
      */
-    size?: 'none' | 'small' | 'normal' | 'large' | 'xlarge';
+    size?: 'none' | 'small' | 'medium' | 'large' | 'xlarge';
     top?: boolean;
     left?: boolean;
     right?: boolean;

package/dist/components/Layout/Pad/Pad.js

@@ -24,7 +24,7 @@ function p(a) {
     left: t = !1,
     right: e = !1,
     bottom: s = !1,
-    size: l = "normal",
+    size: l = "medium",
     children: n,
     className: c
   } = a, o = !(f || t || e || s), i = x(_.root, c, _[`offset-${l}`], {

package/dist/components/Link/LinkShowcase.js

@@ -1,64 +1,64 @@
-import { jsxs as r, jsx as e } from "react/jsx-runtime";
-import d from "react";
-import l from "../Flex/Flex.js";
-import { Text as i } from "../Text/Text.js";
+import { jsxs as i, jsx as e } from "react/jsx-runtime";
+import n from "react";
+import d from "../Flex/Flex.js";
+import { Text as r } from "../Text/Text.js";
 import "../../utils/ui/ui.js";
 import t from "./ButtonLink.js";
-import n from "./Link.js";
+import l from "./Link.js";
 function c() {
-  return /* @__PURE__ */ r(l, { gap: "large", vertical: !0, children: [
-    /* @__PURE__ */ r(l, { gap: "normal", vertical: !0, children: [
-      /* @__PURE__ */ e(i, { children: "Color Default" }),
-      /* @__PURE__ */ e("div", { children: /* @__PURE__ */ e(n, { href: "/", children: "Link active" }) }),
-      /* @__PURE__ */ e("div", { children: /* @__PURE__ */ e(n, { href: "/", disabled: !0, children: "Link disable" }) }),
-      /* @__PURE__ */ e("div", { children: /* @__PURE__ */ e(n, { href: "/", unstyled: !0, children: "Link unstyled" }) })
+  return /* @__PURE__ */ i(d, { gap: "large", vertical: !0, children: [
+    /* @__PURE__ */ i(d, { gap: "medium", vertical: !0, children: [
+      /* @__PURE__ */ e(r, { children: "Color Default" }),
+      /* @__PURE__ */ e("div", { children: /* @__PURE__ */ e(l, { href: "/", children: "Link active" }) }),
+      /* @__PURE__ */ e("div", { children: /* @__PURE__ */ e(l, { href: "/", disabled: !0, children: "Link disable" }) }),
+      /* @__PURE__ */ e("div", { children: /* @__PURE__ */ e(l, { href: "/", unstyled: !0, children: "Link unstyled" }) })
     ] }),
-    /* @__PURE__ */ r(l, { gap: "normal", vertical: !0, children: [
-      /* @__PURE__ */ e(i, { children: "Color secondary" }),
-      /* @__PURE__ */ e("div", { children: /* @__PURE__ */ e(n, { href: "/", color: "secondary", children: "Link active" }) }),
-      /* @__PURE__ */ e("div", { children: /* @__PURE__ */ e(n, { href: "/", color: "secondary", disabled: !0, children: "Link disable" }) })
+    /* @__PURE__ */ i(d, { gap: "medium", vertical: !0, children: [
+      /* @__PURE__ */ e(r, { children: "Color secondary" }),
+      /* @__PURE__ */ e("div", { children: /* @__PURE__ */ e(l, { href: "/", color: "secondary", children: "Link active" }) }),
+      /* @__PURE__ */ e("div", { children: /* @__PURE__ */ e(l, { href: "/", color: "secondary", disabled: !0, children: "Link disable" }) })
     ] }),
-    /* @__PURE__ */ r(l, { gap: "normal", vertical: !0, children: [
-      /* @__PURE__ */ e(i, { children: "Color red" }),
-      /* @__PURE__ */ e("div", { children: /* @__PURE__ */ e(n, { href: "/", color: "red", children: "Link active" }) }),
-      /* @__PURE__ */ e("div", { children: /* @__PURE__ */ e(n, { href: "/", color: "red", disabled: !0, children: "Link disable" }) })
+    /* @__PURE__ */ i(d, { gap: "medium", vertical: !0, children: [
+      /* @__PURE__ */ e(r, { children: "Color red" }),
+      /* @__PURE__ */ e("div", { children: /* @__PURE__ */ e(l, { href: "/", color: "red", children: "Link active" }) }),
+      /* @__PURE__ */ e("div", { children: /* @__PURE__ */ e(l, { href: "/", color: "red", disabled: !0, children: "Link disable" }) })
     ] }),
-    /* @__PURE__ */ r(l, { gap: "normal", vertical: !0, children: [
-      /* @__PURE__ */ e(i, { children: "ButtonLink - look like link but its button" }),
+    /* @__PURE__ */ i(d, { gap: "medium", vertical: !0, children: [
+      /* @__PURE__ */ e(r, { children: "ButtonLink - look like link but its button" }),
       /* @__PURE__ */ e("div", { children: /* @__PURE__ */ e(t, { children: "Link active" }) }),
       /* @__PURE__ */ e("div", { children: /* @__PURE__ */ e(t, { disabled: !0, children: "Link disable" }) })
     ] }),
-    /* @__PURE__ */ r(l, { gap: "normal", vertical: !0, children: [
-      /* @__PURE__ */ e(i, { children: "Inside text" }),
-      /* @__PURE__ */ e("div", { children: /* @__PURE__ */ r(i, { size: "large", as: "h2", children: [
+    /* @__PURE__ */ i(d, { gap: "medium", vertical: !0, children: [
+      /* @__PURE__ */ e(r, { children: "Inside text" }),
+      /* @__PURE__ */ e("div", { children: /* @__PURE__ */ i(r, { size: "large", as: "h2", children: [
         "Out of link text.",
         " ",
-        /* @__PURE__ */ e(n, { href: "/", children: "Link text" })
+        /* @__PURE__ */ e(l, { href: "/", children: "Link text" })
       ] }) })
     ] }),
-    /* @__PURE__ */ r(l, { gap: "normal", vertical: !0, children: [
-      /* @__PURE__ */ e(i, { children: "Inside typographic text" }),
-      /* @__PURE__ */ e("div", { children: /* @__PURE__ */ r(i, { size: "large", as: "h2", typographic: !0, children: [
+    /* @__PURE__ */ i(d, { gap: "medium", vertical: !0, children: [
+      /* @__PURE__ */ e(r, { children: "Inside typographic text" }),
+      /* @__PURE__ */ e("div", { children: /* @__PURE__ */ i(r, { size: "large", as: "h2", typographic: !0, children: [
         "Out of link text.",
         " ",
-        /* @__PURE__ */ e(n, { href: "/", children: "Link text" })
+        /* @__PURE__ */ e(l, { href: "/", children: "Link text" })
       ] }) })
     ] }),
-    /* @__PURE__ */ r(l, { gap: "normal", vertical: !0, children: [
-      /* @__PURE__ */ e(i, { children: "Row a tag" }),
+    /* @__PURE__ */ i(d, { gap: "medium", vertical: !0, children: [
+      /* @__PURE__ */ e(r, { children: "Row a tag" }),
       /* @__PURE__ */ e("div", { children: /* @__PURE__ */ e("a", { href: "/", children: "Link text" }) })
     ] }),
-    /* @__PURE__ */ r(l, { gap: "normal", vertical: !0, children: [
-      /* @__PURE__ */ e(i, { children: "Row a in text" }),
-      /* @__PURE__ */ e("div", { children: /* @__PURE__ */ r(i, { size: "large", as: "h2", children: [
+    /* @__PURE__ */ i(d, { gap: "medium", vertical: !0, children: [
+      /* @__PURE__ */ e(r, { children: "Row a in text" }),
+      /* @__PURE__ */ e("div", { children: /* @__PURE__ */ i(r, { size: "large", as: "h2", children: [
         "Out of link text.",
         " ",
         /* @__PURE__ */ e("a", { href: "/", children: "Link text" })
       ] }) })
     ] }),
-    /* @__PURE__ */ r(l, { gap: "normal", vertical: !0, children: [
-      /* @__PURE__ */ e(i, { children: "Row a in typographic text" }),
-      /* @__PURE__ */ e("div", { children: /* @__PURE__ */ r(i, { size: "large", as: "h2", typographic: !0, children: [
+    /* @__PURE__ */ i(d, { gap: "medium", vertical: !0, children: [
+      /* @__PURE__ */ e(r, { children: "Row a in typographic text" }),
+      /* @__PURE__ */ e("div", { children: /* @__PURE__ */ i(r, { size: "large", as: "h2", typographic: !0, children: [
         "Out of link text.",
         " ",
         /* @__PURE__ */ e("a", { href: "/", children: "Link text" })
@@ -66,7 +66,7 @@ function c() {
     ] })
   ] });
 }
-const k = d.memo(c);
+const f = n.memo(c);
 export {
-  k as default
+  f as default
 };

package/dist/components/Loaf/Loaf.d.ts

@@ -1,7 +1,7 @@
 import { default as React } from 'react';
 
-export type LoafSize = 'small' | 'normal' | 'large';
-export type LoafColor = 'normal' | 'gold' | 'error';
+export type LoafSize = 'small' | 'medium' | 'large';
+export type LoafColor = 'default' | 'gold' | 'error';
 export interface LoafProps {
     size?: LoafSize;
     color?: LoafColor;

package/dist/components/Loaf/Loaf.js

@@ -1,27 +1,27 @@
-import { jsx as e } from "react/jsx-runtime";
+import { jsx as a } from "react/jsx-runtime";
 import { clsx as t } from "../../utils/clsx.js";
-const m = "cfxui__Loaf__root__05393", n = "cfxui__Loaf__bright__6638c", o = {
-  root: m,
-  "color-normal": "cfxui__Loaf__color-normal__bec17",
-  bright: n,
+const u = "cfxui__Loaf__root__05393", m = "cfxui__Loaf__bright__6638c", o = {
+  root: u,
+  "color-default": "cfxui__Loaf__color-default__5b15b",
+  bright: m,
   "color-gold": "cfxui__Loaf__color-gold__4fa59",
   "color-error": "cfxui__Loaf__color-error__9887b",
   "size-small": "cfxui__Loaf__size-small__942f7",
-  "size-normal": "cfxui__Loaf__size-normal__7b2a1",
+  "size-medium": "cfxui__Loaf__size-medium__2679d",
   "size-large": "cfxui__Loaf__size-large__1679c"
 };
 function g(_) {
   const {
-    size: r = "normal",
-    color: c = "normal",
-    bright: a = !1,
-    children: l,
-    className: i,
-    ref: s
-  } = _, f = t(o.root, o[`size-${r}`], o[`color-${c}`], i, {
-    [o.bright]: a
+    size: r = "medium",
+    color: i = "default",
+    bright: c = !1,
+    children: f,
+    className: e,
+    ref: l
+  } = _, s = t(o.root, o[`size-${r}`], o[`color-${i}`], e, {
+    [o.bright]: c
   });
-  return /* @__PURE__ */ e("div", { ref: s, className: f, children: l });
+  return /* @__PURE__ */ a("div", { ref: l, className: s, children: f });
 }
 export {
   g as Loaf