@cfx-dev/ui-components 4.3.8 → 4.3.9

package/dist/index-DCuJlMqr.js

@@ -0,0 +1,239 @@
+import * as c from "react";
+import { jsx as y } from "react/jsx-runtime";
+import { r as w } from "./index-Cl_RnsqN.js";
+function v(t, n) {
+  if (typeof t == "function")
+    return t(n);
+  t != null && (t.current = n);
+}
+function C(...t) {
+  return (n) => {
+    let o = !1;
+    const r = t.map((e) => {
+      const s = v(e, n);
+      return !o && typeof s == "function" && (o = !0), s;
+    });
+    if (o)
+      return () => {
+        for (let e = 0; e < r.length; e++) {
+          const s = r[e];
+          typeof s == "function" ? s() : v(t[e], null);
+        }
+      };
+  };
+}
+function j(...t) {
+  return c.useCallback(C(...t), t);
+}
+function B(t, n = []) {
+  let o = [];
+  function r(s, u) {
+    const i = c.createContext(u), l = o.length;
+    o = [...o, u];
+    const f = (a) => {
+      var b;
+      const { scope: p, children: h, ...m } = a, S = ((b = p == null ? void 0 : p[t]) == null ? void 0 : b[l]) || i, g = c.useMemo(() => m, Object.values(m));
+      return /* @__PURE__ */ y(S.Provider, { value: g, children: h });
+    };
+    f.displayName = s + "Provider";
+    function d(a, p) {
+      var S;
+      const h = ((S = p == null ? void 0 : p[t]) == null ? void 0 : S[l]) || i, m = c.useContext(h);
+      if (m) return m;
+      if (u !== void 0) return u;
+      throw new Error(`\`${a}\` must be used within \`${s}\``);
+    }
+    return [f, d];
+  }
+  const e = () => {
+    const s = o.map((u) => c.createContext(u));
+    return function(i) {
+      const l = (i == null ? void 0 : i[t]) || s;
+      return c.useMemo(
+        () => ({ [`__scope${t}`]: { ...i, [t]: l } }),
+        [i, l]
+      );
+    };
+  };
+  return e.scopeName = t, [r, P(e, ...n)];
+}
+function P(...t) {
+  const n = t[0];
+  if (t.length === 1) return n;
+  const o = () => {
+    const r = t.map((e) => ({
+      useScope: e(),
+      scopeName: e.scopeName
+    }));
+    return function(s) {
+      const u = r.reduce((i, { useScope: l, scopeName: f }) => {
+        const a = l(s)[`__scope${f}`];
+        return { ...i, ...a };
+      }, {});
+      return c.useMemo(() => ({ [`__scope${n.scopeName}`]: u }), [u]);
+    };
+  };
+  return o.scopeName = n.scopeName, o;
+}
+function k(t, n, { checkForDefaultPrevented: o = !0 } = {}) {
+  return function(e) {
+    if (t == null || t(e), o === !1 || !e.defaultPrevented)
+      return n == null ? void 0 : n(e);
+  };
+}
+var x = globalThis != null && globalThis.document ? c.useLayoutEffect : () => {
+}, E = c[" useInsertionEffect ".trim().toString()] || x;
+function L({
+  prop: t,
+  defaultProp: n,
+  onChange: o = () => {
+  },
+  caller: r
+}) {
+  const [e, s, u] = R({
+    defaultProp: n,
+    onChange: o
+  }), i = t !== void 0, l = i ? t : e;
+  {
+    const d = c.useRef(t !== void 0);
+    c.useEffect(() => {
+      const a = d.current;
+      a !== i && console.warn(
+        `${r} is changing from ${a ? "controlled" : "uncontrolled"} to ${i ? "controlled" : "uncontrolled"}. Components should not switch from controlled to uncontrolled (or vice versa). Decide between using a controlled or uncontrolled value for the lifetime of the component.`
+      ), d.current = i;
+    }, [i, r]);
+  }
+  const f = c.useCallback(
+    (d) => {
+      var a;
+      if (i) {
+        const p = $(d) ? d(t) : d;
+        p !== t && ((a = u.current) == null || a.call(u, p));
+      } else
+        s(d);
+    },
+    [i, t, s, u]
+  );
+  return [l, f];
+}
+function R({
+  defaultProp: t,
+  onChange: n
+}) {
+  const [o, r] = c.useState(t), e = c.useRef(o), s = c.useRef(n);
+  return E(() => {
+    s.current = n;
+  }, [n]), c.useEffect(() => {
+    var u;
+    e.current !== o && ((u = s.current) == null || u.call(s, o), e.current = o);
+  }, [o, e]), [o, r, s];
+}
+function $(t) {
+  return typeof t == "function";
+}
+function T(t) {
+  const [n, o] = c.useState(void 0);
+  return x(() => {
+    if (t) {
+      o({ width: t.offsetWidth, height: t.offsetHeight });
+      const r = new ResizeObserver((e) => {
+        if (!Array.isArray(e) || !e.length)
+          return;
+        const s = e[0];
+        let u, i;
+        if ("borderBoxSize" in s) {
+          const l = s.borderBoxSize, f = Array.isArray(l) ? l[0] : l;
+          u = f.inlineSize, i = f.blockSize;
+        } else
+          u = t.offsetWidth, i = t.offsetHeight;
+        o({ width: u, height: i });
+      });
+      return r.observe(t, { box: "border-box" }), () => r.unobserve(t);
+    } else
+      o(void 0);
+  }, [t]), n;
+}
+// @__NO_SIDE_EFFECTS__
+function z(t) {
+  const n = /* @__PURE__ */ _(t), o = c.forwardRef((r, e) => {
+    const { children: s, ...u } = r, i = c.Children.toArray(s), l = i.find(A);
+    if (l) {
+      const f = l.props.children, d = i.map((a) => a === l ? c.Children.count(f) > 1 ? c.Children.only(null) : c.isValidElement(f) ? f.props.children : null : a);
+      return /* @__PURE__ */ y(n, { ...u, ref: e, children: c.isValidElement(f) ? c.cloneElement(f, void 0, d) : null });
+    }
+    return /* @__PURE__ */ y(n, { ...u, ref: e, children: s });
+  });
+  return o.displayName = `${t}.Slot`, o;
+}
+// @__NO_SIDE_EFFECTS__
+function _(t) {
+  const n = c.forwardRef((o, r) => {
+    const { children: e, ...s } = o;
+    if (c.isValidElement(e)) {
+      const u = D(e), i = N(s, e.props);
+      return e.type !== c.Fragment && (i.ref = r ? C(r, u) : u), c.cloneElement(e, i);
+    }
+    return c.Children.count(e) > 1 ? c.Children.only(null) : null;
+  });
+  return n.displayName = `${t}.SlotClone`, n;
+}
+var O = Symbol("radix.slottable");
+function A(t) {
+  return c.isValidElement(t) && typeof t.type == "function" && "__radixId" in t.type && t.type.__radixId === O;
+}
+function N(t, n) {
+  const o = { ...n };
+  for (const r in n) {
+    const e = t[r], s = n[r];
+    /^on[A-Z]/.test(r) ? e && s ? o[r] = (...i) => {
+      const l = s(...i);
+      return e(...i), l;
+    } : e && (o[r] = e) : r === "style" ? o[r] = { ...e, ...s } : r === "className" && (o[r] = [e, s].filter(Boolean).join(" "));
+  }
+  return { ...t, ...o };
+}
+function D(t) {
+  var r, e;
+  let n = (r = Object.getOwnPropertyDescriptor(t.props, "ref")) == null ? void 0 : r.get, o = n && "isReactWarning" in n && n.isReactWarning;
+  return o ? t.ref : (n = (e = Object.getOwnPropertyDescriptor(t, "ref")) == null ? void 0 : e.get, o = n && "isReactWarning" in n && n.isReactWarning, o ? t.props.ref : t.props.ref || t.ref);
+}
+var I = [
+  "a",
+  "button",
+  "div",
+  "form",
+  "h2",
+  "h3",
+  "img",
+  "input",
+  "label",
+  "li",
+  "nav",
+  "ol",
+  "p",
+  "select",
+  "span",
+  "svg",
+  "ul"
+], F = I.reduce((t, n) => {
+  const o = /* @__PURE__ */ z(`Primitive.${n}`), r = c.forwardRef((e, s) => {
+    const { asChild: u, ...i } = e, l = u ? o : n;
+    return typeof window < "u" && (window[Symbol.for("radix-ui")] = !0), /* @__PURE__ */ y(l, { ...i, ref: s });
+  });
+  return r.displayName = `Primitive.${n}`, { ...t, [n]: r };
+}, {});
+function M(t, n) {
+  t && w.flushSync(() => t.dispatchEvent(n));
+}
+export {
+  F as P,
+  x as a,
+  z as b,
+  B as c,
+  L as d,
+  k as e,
+  T as f,
+  M as g,
+  C as h,
+  j as u
+};

package/dist/{index-CriGVLlo.js → index-DWzyrn_L.js}

@@ -1,5 +1,5 @@
 import * as a from "react";
-import { u as T, a as A } from "./index-ByKwkZKY.js";
+import { u as T, a as A } from "./index-DCuJlMqr.js";
 function E(n, e) {
   return a.useReducer((r, t) => e[r][t] ?? r, n);
 }

package/dist/styles-scss/_colors.scss

@@ -1,7 +1,7 @@
-@use "sass:math";
-@use "sass:list";
-@use "sass:map";
-@use "sass:color";
+@use 'sass:math';
+@use 'sass:list';
+@use 'sass:map';
+@use 'sass:color';
 
 @function get-channel($color, $channel) {
   @return color.channel($color, $channel, $space: rgb);
@@ -9,9 +9,9 @@
 
 @function get-luminance($color) {
   $colors: (
-    'red': get-channel($color, "red"),
-    'green': get-channel($color, "green"),
-    'blue': get-channel($color, "blue"),
+    'red': get-channel($color, 'red'),
+    'green': get-channel($color, 'green'),
+    'blue': get-channel($color, 'blue'),
   );
 
   @each $name, $value in $colors {
@@ -21,29 +21,32 @@
     @if $value < 0.03928 {
       $value: math.div($value, 12.92);
     } @else {
-      $value: math.div($value + .055, 1.055);
+      $value: math.div($value + 0.055, 1.055);
       $value: math.pow($value, 2.4);
     }
 
-    $colors: map.merge($colors, ($name: $value));
+    $colors: map.merge(
+      $colors,
+      (
+        $name: $value,
+      )
+    );
   }
 
-  @return (map.get($colors, 'red') * .2126) + (map.get($colors, 'green') * .7152) + (map.get($colors, 'blue') * .0722);
+  @return (
+    (map.get($colors, 'red') * 0.2126) + (map.get($colors, 'green') * 0.7152) + (map.get($colors, 'blue') * 0.0722)
+  );
 }
 
 @function interpolate($c1, $c2, $f) {
-  $c1r: get-channel($c1, "red");
-  $c1g: get-channel($c1, "green");
-  $c1b: get-channel($c1, "blue");
-  $c2r: get-channel($c2, "red");
-  $c2g: get-channel($c2, "green");
-  $c2b: get-channel($c2, "blue");
-
-  @return rgb(
-    $c1r + $f * ($c2r - $c1r),
-    $c1g + $f * ($c2g - $c1g),
-    $c1b + $f * ($c2b - $c1b),
-  );
+  $c1r: get-channel($c1, 'red');
+  $c1g: get-channel($c1, 'green');
+  $c1b: get-channel($c1, 'blue');
+  $c2r: get-channel($c2, 'red');
+  $c2g: get-channel($c2, 'green');
+  $c2b: get-channel($c2, 'blue');
+
+  @return rgb($c1r + $f * ($c2r - $c1r), $c1g + $f * ($c2g - $c1g), $c1b + $f * ($c2b - $c1b));
 }
 
 @function set-luminance($color, $lum) {
@@ -57,12 +60,12 @@
     $low: $color;
   }
 
-  $mid: interpolate($low, $high, .5);
+  $mid: interpolate($low, $high, 0.5);
   $lm: get-luminance($mid);
 
   @while math.abs($lum - $lm) >= 1e - 7 and $itersLeft > 0 {
     $itersLeft: $itersLeft - 1;
-    $mid: interpolate($low, $high, .5);
+    $mid: interpolate($low, $high, 0.5);
     $lm: get-luminance($mid);
 
     @if $lm > $lum {
@@ -76,19 +79,18 @@
 }
 
 @function color-triplet($color) {
-  @return #{get-channel($color, "red")}, #{get-channel($color, "green")}, #{get-channel($color, "blue")};
+  @return #{get-channel($color, 'red')}, #{get-channel($color, 'green')}, #{get-channel($color, 'blue')};
 }
 
-
 // LAB <-> RGB
 $oneThird: math.div(1, 3);
 $_16OVER116: math.div(16, 116);
 $_1OVER2P4: math.div(1, 2.4);
 
 @function rgb2lab($color) {
-  $r: math.div(get-channel($color, "red"), 255);
-  $g: math.div(get-channel($color, "green"), 255);
-  $b: math.div(get-channel($color, "blue"), 255);
+  $r: math.div(get-channel($color, 'red'), 255);
+  $g: math.div(get-channel($color, 'green'), 255);
+  $b: math.div(get-channel($color, 'blue'), 255);
 
   @if $r > 0.04045 {
     $r: math.pow(math.div($r + 0.055, 1.055), 2.4);
@@ -109,7 +111,7 @@ $_1OVER2P4: math.div(1, 2.4);
   }
 
   $x: math.div($r * 0.4124 + $g * 0.3576 + $b * 0.1805, 0.95047);
-  $y: math.div($r * 0.2126 + $g * 0.7152 + $b * 0.0722, 1.00000);
+  $y: math.div($r * 0.2126 + $g * 0.7152 + $b * 0.0722, 1);
   $z: math.div($r * 0.0193 + $g * 0.1192 + $b * 0.9505, 1.08883);
 
   @if $x > 0.008856 {
@@ -130,11 +132,11 @@ $_1OVER2P4: math.div(1, 2.4);
     $z: (7.787 * $z) + $_16OVER116;
   }
 
-  @return (
-    'L': (116 * $y) - 16,
-    'a': 500 * ($x - $y),
-    'b': 200 * ($y - $z),
-  );
+  $b: 200 * $y - $z;
+  $a: 500 * ($x - $y);
+  $l: 116 * $y - 16;
+
+  @return ('L': $l, 'a': $a, 'b': $b);
 }
 
 @function lab2rgb($lab) {
@@ -148,27 +150,27 @@ $_1OVER2P4: math.div(1, 2.4);
   @if $x3 > 0.008856 {
     $x: $x3;
   } @else {
-    $x: math.div($x - $_16OVER116 , 7.787);
+    $x: math.div($x - $_16OVER116, 7.787);
   }
 
   @if $y3 > 0.008856 {
     $y: $y3;
   } @else {
-    $y: math.div($y - $_16OVER116 , 7.787);
+    $y: math.div($y - $_16OVER116, 7.787);
   }
 
   @if $z3 > 0.008856 {
     $z: $z3;
   } @else {
-    $z: math.div($z - $_16OVER116 , 7.787);
+    $z: math.div($z - $_16OVER116, 7.787);
   }
 
   $x: $x * 0.95047;
-  $y: $y * 1.00000;
+  $y: $y * 1;
   $z: $z * 1.08883;
   $r: $x * 3.2406 + $y * -1.5372 + $z * -0.4986;
   $g: $x * -0.9689 + $y * 1.8758 + $z * 0.0415;
-  $b: $x * 0.0557 + $y * -0.2040 + $z * 1.0570;
+  $b: $x * 0.0557 + $y * -0.204 + $z * 1.057;
 
   @if $r > 0.0031308 {
     $r: 1.055 * math.pow($r, $_1OVER2P4) - 0.055;
@@ -188,11 +190,7 @@ $_1OVER2P4: math.div(1, 2.4);
     $b: 12.92 * $b;
   }
 
-  @return rgb(
-    math.clamp(0, $r, 1) * 255,
-    math.clamp(0, $g, 1) * 255,
-    math.clamp(0, $b, 1) * 255,
-  );
+  @return rgb(math.clamp(0, $r, 1) * 255, math.clamp(0, $g, 1) * 255, math.clamp(0, $b, 1) * 255);
 }
 
 @function lab-gradient($s, $e, $start, $stop) {
@@ -211,10 +209,11 @@ $_1OVER2P4: math.div(1, 2.4);
   $a: math.div($i, $stop - 1);
   $ia: 1 - $a;
 
-  @return lab2rgb((
-    'L': $ia * map.get($s, 'L') + $a * map.get($e, 'L'),
-    'a': $ia * map.get($s, 'a') + $a * map.get($e, 'a'),
-    'b': $ia * map.get($s, 'b') + $a * map.get($e, 'b'),
-  ));
+  @return lab2rgb(
+    (
+      'L': $ia * map.get($s, 'L') + $a * map.get($e, 'L'),
+      'a': $ia * map.get($s, 'a') + $a * map.get($e, 'a'),
+      'b': $ia * map.get($s, 'b') + $a * map.get($e, 'b'),
+    )
+  );
 }
-

package/dist/styles-scss/_typography.scss

@@ -9,44 +9,49 @@
     font-style: normal;
     font-weight: 400;
     font-family: HelveticaNowDisplay;
-    src: url("assets/fonts/HelveticaNow/HelveticaNowDisplay.woff2") format("woff2"),
-         url("assets/fonts/HelveticaNow/HelveticaNowDisplay.woff") format("woff"),
-         url("assets/fonts/HelveticaNow/HelveticaNowDisplay.ttf") format("truetype");
+    src:
+      url('assets/fonts/HelveticaNow/HelveticaNowDisplay.woff2') format('woff2'),
+      url('assets/fonts/HelveticaNow/HelveticaNowDisplay.woff') format('woff'),
+      url('assets/fonts/HelveticaNow/HelveticaNowDisplay.ttf') format('truetype');
   }
-  
+
   @font-face {
     font-style: normal;
     font-weight: 700;
     font-family: HelveticaNowDisplay;
-    src: url("assets/fonts/HelveticaNow/HelveticaNowDisplayBold.woff2") format("woff2"),
-         url("assets/fonts/HelveticaNow/HelveticaNowDisplayBold.woff") format("woff"),
-         url("assets/fonts/HelveticaNow/HelveticaNowDisplayBold.ttf") format("truetype");
+    src:
+      url('assets/fonts/HelveticaNow/HelveticaNowDisplayBold.woff2') format('woff2'),
+      url('assets/fonts/HelveticaNow/HelveticaNowDisplayBold.woff') format('woff'),
+      url('assets/fonts/HelveticaNow/HelveticaNowDisplayBold.ttf') format('truetype');
   }
-  
+
   @font-face {
     font-style: normal;
     font-weight: 400;
     font-family: HelveticaNowText;
-    src: url("assets/fonts/HelveticaNow/HelveticaNowText.woff2") format("woff2"),
-         url("assets/fonts/HelveticaNow/HelveticaNowText.woff") format("woff"),
-         url("assets/fonts/HelveticaNow/HelveticaNowText.ttf") format("truetype");
+    src:
+      url('assets/fonts/HelveticaNow/HelveticaNowText.woff2') format('woff2'),
+      url('assets/fonts/HelveticaNow/HelveticaNowText.woff') format('woff'),
+      url('assets/fonts/HelveticaNow/HelveticaNowText.ttf') format('truetype');
   }
-  
+
   @font-face {
     font-style: normal;
     font-weight: 700;
     font-family: HelveticaNowText;
-    src: url("assets/fonts/HelveticaNow/HelveticaNowTextBold.woff2") format("woff2"),
-         url("assets/fonts/HelveticaNow/HelveticaNowTextBold.woff") format("woff"),
-         url("assets/fonts/HelveticaNow/HelveticaNowTextBold.ttf") format("truetype");
+    src:
+      url('assets/fonts/HelveticaNow/HelveticaNowTextBold.woff2') format('woff2'),
+      url('assets/fonts/HelveticaNow/HelveticaNowTextBold.woff') format('woff'),
+      url('assets/fonts/HelveticaNow/HelveticaNowTextBold.ttf') format('truetype');
   }
-  
+
   @font-face {
     font-style: italic;
     font-weight: 400;
     font-family: HelveticaNowText;
-    src: url("assets/fonts/HelveticaNow/HelveticaNowTextIt.woff2") format("woff2"),
-         url("assets/fonts/HelveticaNow/HelveticaNowTextIt.woff") format("woff"),
-         url("assets/fonts/HelveticaNow/HelveticaNowTextIt.ttf") format("truetype");
+    src:
+      url('assets/fonts/HelveticaNow/HelveticaNowTextIt.woff2') format('woff2'),
+      url('assets/fonts/HelveticaNow/HelveticaNowTextIt.woff') format('woff'),
+      url('assets/fonts/HelveticaNow/HelveticaNowTextIt.ttf') format('truetype');
   }
-}
+}