@cfx-dev/ui-components 4.2.24 → 4.3.1

package/dist/components/Layout/Page/Page.js

@@ -1,21 +1,20 @@
-import { jsxs as _, jsx as c } from "react/jsx-runtime";
-import { clsx as l } from "../../../utils/clsx.js";
-const d = "cfxui__Page__root__3b40d", f = "cfxui__Page__loader__df597", n = "cfxui__Page__wtf__c1620", o = {
+import { jsxs as c, jsx as l } from "react/jsx-runtime";
+import { clsx as _ } from "../../../utils/clsx.js";
+const d = "cfxui__Page__root__3b40d", n = "cfxui__Page__loader__df597", o = {
   root: d,
-  loader: f,
-  wtf: n
+  loader: n
 };
-function x(s) {
+function f(s) {
   const {
     children: r,
-    className: t,
-    showLoader: a = !1
-  } = s, e = l(o.root, t);
-  return /* @__PURE__ */ _("div", { className: e, children: [
+    className: a,
+    showLoader: e = !1
+  } = s, t = _(o.root, a);
+  return /* @__PURE__ */ c("div", { className: t, children: [
     r,
-    a && /* @__PURE__ */ c("div", { className: o.loader })
+    e && /* @__PURE__ */ l("div", { className: o.loader })
   ] });
 }
 export {
-  x as Page
+  f as Page
 };

package/dist/components/Layout/Scrollable/Rail.d.ts

@@ -3,7 +3,7 @@ import { default as React } from 'react';
 export interface RailProps {
     axis: 'x' | 'y';
     pos: number;
-    rootRef: React.RefObject<HTMLDivElement>;
+    rootRef: React.RefObject<HTMLDivElement | null>;
     size: number;
     scrollSize: number;
     minThumbSize: number;

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

@@ -4,6 +4,7 @@ export interface ScrollableProps {
     minThumbSize?: number;
     className?: string;
     children?: React.ReactNode;
+    ref?: React.Ref<HTMLDivElement>;
     onScroll?: (event: WheelEvent | React.UIEvent<HTMLDivElement, UIEvent>) => void;
     scrollerRef?: React.Ref<HTMLDivElement>;
     /**
@@ -11,4 +12,4 @@ export interface ScrollableProps {
      */
     verticalAsHorizontal?: boolean;
 }
-export declare const Scrollable: React.ForwardRefExoticComponent<ScrollableProps & React.RefAttributes<HTMLDivElement>>;
+export declare function Scrollable(props: ScrollableProps): import("react/jsx-runtime").JSX.Element;

package/dist/components/Layout/Scrollable/Scrollable.js

@@ -1,48 +1,50 @@
-import { jsxs as j, jsx as i } from "react/jsx-runtime";
+import { jsxs as W, jsx as i } from "react/jsx-runtime";
 import r from "react";
-import { useContextualStyle as W } from "../../Style/Style.js";
-import { clsx as b } from "../../../utils/clsx.js";
+import { clsx as x } from "../../../utils/clsx.js";
 import { mergeRefs as k } from "../../../utils/mergeRefs.js";
-import { s as o, R as w } from "../../../Rail-DcVowhML.js";
-const N = {
+import { s as o, R as N } from "../../../Rail-DcVowhML.js";
+const P = {
   size: 0,
   scrollPos: 0,
   scrollSize: 0
-}, K = r.forwardRef(function(u, P) {
+};
+function G(b) {
   const {
-    children: y,
+    children: w,
     className: A,
     onScroll: l,
-    minThumbSize: f = 20,
-    verticalAsHorizontal: S = !1
-  } = u, e = r.useRef(null), a = r.useRef(null), [L, m] = r.useState(!1), [c, E] = r.useState(N), [T, g] = r.useState(0), [n, C] = r.useState(N), [I, X] = r.useState(0), Y = b(o.root, A, {
-    [o.active]: L
+    minThumbSize: u = 20,
+    verticalAsHorizontal: f = !1,
+    ref: L,
+    scrollerRef: E
+  } = b, e = r.useRef(null), a = r.useRef(null), [T, S] = r.useState(!1), [c, y] = r.useState(P), [g, I] = r.useState(0), [n, X] = r.useState(P), [Y, _] = r.useState(0), C = x(o.root, A, {
+    [o.active]: T
   });
   r.useLayoutEffect(() => {
     if (!a.current)
       throw new Error("No scrollable content ref");
     const s = new ResizeObserver(() => {
-      var t, d, h, v, p, x;
-      C({
+      var t, R, d, h, v, p;
+      X({
         size: ((t = e.current) == null ? void 0 : t.clientHeight) || 0,
-        scrollPos: ((d = e.current) == null ? void 0 : d.scrollTop) || 0,
-        scrollSize: ((h = e.current) == null ? void 0 : h.scrollHeight) || 0
-      }), E({
-        size: ((v = e.current) == null ? void 0 : v.clientWidth) || 0,
-        scrollPos: ((p = e.current) == null ? void 0 : p.scrollLeft) || 0,
-        scrollSize: ((x = e.current) == null ? void 0 : x.scrollWidth) || 0
+        scrollPos: ((R = e.current) == null ? void 0 : R.scrollTop) || 0,
+        scrollSize: ((d = e.current) == null ? void 0 : d.scrollHeight) || 0
+      }), y({
+        size: ((h = e.current) == null ? void 0 : h.clientWidth) || 0,
+        scrollPos: ((v = e.current) == null ? void 0 : v.scrollLeft) || 0,
+        scrollSize: ((p = e.current) == null ? void 0 : p.scrollWidth) || 0
       });
     });
     return s.observe(a.current), () => s.disconnect();
   }, []);
-  const _ = r.useCallback(
+  const H = r.useCallback(
     (s) => {
-      e.current && (l == null || l(s), X(e.current.scrollTop), g(e.current.scrollLeft));
+      e.current && (l == null || l(s), _(e.current.scrollTop), I(e.current.scrollLeft));
     },
     [l]
   );
   r.useEffect(() => {
-    if (!S || !e.current)
+    if (!f || !e.current)
       return;
     const s = (t) => {
       t.preventDefault(), t.stopPropagation(), e.current && (e.current.scrollLeft += t.deltaY);
@@ -51,39 +53,39 @@ const N = {
       var t;
       return (t = e.current) == null ? void 0 : t.removeEventListener("wheel", s);
     };
-  }, [S]);
-  const z = c.scrollSize - c.size > 1, R = n.scrollSize - n.size > 1, H = b(o.scroller, {
+  }, [f]);
+  const z = c.scrollSize - c.size > 1, m = n.scrollSize - n.size > 1, j = x(o.scroller, {
     [o["no-x-scroll"]]: !z,
-    [o["no-y-scroll"]]: !R
+    [o["no-y-scroll"]]: !m
   });
-  return /* @__PURE__ */ j("div", { ref: P, style: W(), className: Y, children: [
-    /* @__PURE__ */ i("div", { ref: k(e, u.scrollerRef), className: H, onScroll: _, children: /* @__PURE__ */ i("div", { ref: a, className: o.content, children: y }) }),
-    R && /* @__PURE__ */ i(
-      w,
+  return /* @__PURE__ */ W("div", { ref: L, className: C, children: [
+    /* @__PURE__ */ i("div", { ref: k(e, E), className: j, onScroll: H, children: /* @__PURE__ */ i("div", { ref: a, className: o.content, children: w }) }),
+    m && /* @__PURE__ */ i(
+      N,
       {
         rootRef: e,
         axis: "y",
         size: n.size,
-        pos: I,
+        pos: Y,
         scrollSize: n.scrollSize,
-        setRootActive: m,
-        minThumbSize: f
+        setRootActive: S,
+        minThumbSize: u
       }
     ),
     z && /* @__PURE__ */ i(
-      w,
+      N,
       {
         rootRef: e,
         axis: "x",
         size: c.size,
-        pos: T,
+        pos: g,
         scrollSize: c.scrollSize,
-        setRootActive: m,
-        minThumbSize: f
+        setRootActive: S,
+        minThumbSize: u
       }
     )
   ] });
-});
+}
 export {
-  K as Scrollable
+  G as Scrollable
 };

package/dist/components/Layout/Scrollable/ScrollableShowcase.js

@@ -1,6 +1,6 @@
 import { jsxs as l, jsx as r } from "react/jsx-runtime";
 import d from "react";
-import { Flex as i } from "../Flex/Flex.js";
+import i from "../Flex/Flex.js";
 import { Text as t } from "../../Text/Text.js";
 import "../../../utils/ui/ui.js";
 import { LOREM_IPSUM as e } from "../../../utils/loremipsum.js";

package/dist/components/Layout/Scrollable/VirtualScrollable.js

@@ -1,5 +1,5 @@
-import { jsx as R } from "react/jsx-runtime";
-import N, { createElement as k, PureComponent as re } from "react";
+import { jsx as N } from "react/jsx-runtime";
+import W, { createElement as k, PureComponent as re } from "react";
 import { _ as ie, a as ne } from "../../../inheritsLoose-CyjgKRgL.js";
 import { clsx as oe } from "../../../utils/clsx.js";
 import { Scrollable as le } from "./Scrollable.js";
@@ -17,18 +17,18 @@ function ae(r, t) {
 function ce(r, t) {
   if (r.length !== t.length)
     return !1;
-  for (var i = 0; i < r.length; i++)
-    if (!ae(r[i], t[i]))
+  for (var o = 0; o < r.length; o++)
+    if (!ae(r[o], t[o]))
       return !1;
   return !0;
 }
 function D(r, t) {
   t === void 0 && (t = ce);
-  var i, l = [], a, I = !1;
+  var o, l = [], a, I = !1;
   function m() {
     for (var v = [], S = 0; S < arguments.length; S++)
       v[S] = arguments[S];
-    return I && i === this && t(v, l) || (a = r.apply(this, v), I = !0, i = this, l = v), a;
+    return I && o === this && t(v, l) || (a = r.apply(this, v), I = !0, o = this, l = v), a;
   }
   return m;
 }
@@ -41,9 +41,9 @@ function K(r) {
   cancelAnimationFrame(r.id);
 }
 function de(r, t) {
-  var i = H();
+  var o = H();
   function l() {
-    H() - i >= t ? r.call(null) : a.id = requestAnimationFrame(l);
+    H() - o >= t ? r.call(null) : a.id = requestAnimationFrame(l);
   }
   var a = {
     id: requestAnimationFrame(l)
@@ -53,28 +53,28 @@ function de(r, t) {
 var L = -1;
 function j(r) {
   if (r === void 0 && (r = !1), L === -1 || r) {
-    var t = document.createElement("div"), i = t.style;
-    i.width = "50px", i.height = "50px", i.overflow = "scroll", document.body.appendChild(t), L = t.offsetWidth - t.clientWidth, document.body.removeChild(t);
+    var t = document.createElement("div"), o = t.style;
+    o.width = "50px", o.height = "50px", o.overflow = "scroll", document.body.appendChild(t), L = t.offsetWidth - t.clientWidth, document.body.removeChild(t);
   }
   return L;
 }
 var _ = null;
 function B(r) {
   if (r === void 0 && (r = !1), _ === null || r) {
-    var t = document.createElement("div"), i = t.style;
-    i.width = "50px", i.height = "50px", i.overflow = "scroll", i.direction = "rtl";
+    var t = document.createElement("div"), o = t.style;
+    o.width = "50px", o.height = "50px", o.overflow = "scroll", o.direction = "rtl";
     var l = document.createElement("div"), a = l.style;
     return a.width = "100px", a.height = "100px", t.appendChild(l), document.body.appendChild(t), t.scrollLeft > 0 ? _ = "positive-descending" : (t.scrollLeft = 1, t.scrollLeft === 0 ? _ = "negative" : _ = "positive-ascending"), document.body.removeChild(t), _;
   }
   return _;
 }
 process.env.NODE_ENV;
-var fe = 150, he = function(t, i) {
+var fe = 150, he = function(t, o) {
   return t;
-}, P = null, M = null;
-process.env.NODE_ENV !== "production" && typeof window < "u" && typeof window.WeakSet < "u" && (P = /* @__PURE__ */ new WeakSet(), M = /* @__PURE__ */ new WeakSet());
+}, R = null, P = null;
+process.env.NODE_ENV !== "production" && typeof window < "u" && typeof window.WeakSet < "u" && (R = /* @__PURE__ */ new WeakSet(), P = /* @__PURE__ */ new WeakSet());
 function pe(r) {
-  var t, i = r.getItemOffset, l = r.getEstimatedTotalSize, a = r.getItemSize, I = r.getOffsetForIndexAndAlignment, m = r.getStartIndexForOffset, v = r.getStopIndexForStartIndex, S = r.initInstanceProps, y = r.shouldResetStyleCacheOnItemSizeChange, g = r.validateProps;
+  var t, o = r.getItemOffset, l = r.getEstimatedTotalSize, a = r.getItemSize, I = r.getOffsetForIndexAndAlignment, m = r.getStartIndexForOffset, v = r.getStopIndexForStartIndex, S = r.initInstanceProps, y = r.shouldResetStyleCacheOnItemSizeChange, g = r.validateProps;
   return t = /* @__PURE__ */ function(w) {
     ie(b, w);
     function b(p) {
@@ -85,26 +85,26 @@ function pe(r) {
         scrollDirection: "forward",
         scrollOffset: typeof e.props.initialScrollOffset == "number" ? e.props.initialScrollOffset : 0,
         scrollUpdateWasRequested: !1
-      }, e._callOnItemsRendered = void 0, e._callOnItemsRendered = D(function(n, o, s, u) {
+      }, e._callOnItemsRendered = void 0, e._callOnItemsRendered = D(function(i, n, s, u) {
         return e.props.onItemsRendered({
-          overscanStartIndex: n,
-          overscanStopIndex: o,
+          overscanStartIndex: i,
+          overscanStopIndex: n,
           visibleStartIndex: s,
           visibleStopIndex: u
         });
-      }), e._callOnScroll = void 0, e._callOnScroll = D(function(n, o, s) {
+      }), e._callOnScroll = void 0, e._callOnScroll = D(function(i, n, s) {
         return e.props.onScroll({
-          scrollDirection: n,
-          scrollOffset: o,
+          scrollDirection: i,
+          scrollOffset: n,
           scrollUpdateWasRequested: s
         });
-      }), e._getItemStyle = void 0, e._getItemStyle = function(n) {
-        var o = e.props, s = o.direction, u = o.itemSize, f = o.layout, c = e._getItemStyleCache(y && u, y && f, y && s), d;
-        if (c.hasOwnProperty(n))
-          d = c[n];
+      }), e._getItemStyle = void 0, e._getItemStyle = function(i) {
+        var n = e.props, s = n.direction, u = n.itemSize, f = n.layout, c = e._getItemStyleCache(y && u, y && f, y && s), d;
+        if (c.hasOwnProperty(i))
+          d = c[i];
         else {
-          var h = i(e.props, n, e._instanceProps), T = a(e.props, n, e._instanceProps), O = s === "horizontal" || f === "horizontal", x = s === "rtl", E = O ? h : 0;
-          c[n] = d = {
+          var h = o(e.props, i, e._instanceProps), T = a(e.props, i, e._instanceProps), O = s === "horizontal" || f === "horizontal", x = s === "rtl", E = O ? h : 0;
+          c[i] = d = {
             position: "absolute",
             left: x ? void 0 : E,
             right: x ? E : void 0,
@@ -114,10 +114,10 @@ function pe(r) {
           };
         }
         return d;
-      }, e._getItemStyleCache = void 0, e._getItemStyleCache = D(function(n, o, s) {
+      }, e._getItemStyleCache = void 0, e._getItemStyleCache = D(function(i, n, s) {
         return {};
-      }), e._onScrollHorizontal = function(n) {
-        var o = n.currentTarget, s = o.clientWidth, u = o.scrollLeft, f = o.scrollWidth;
+      }), e._onScrollHorizontal = function(i) {
+        var n = i.currentTarget, s = n.clientWidth, u = n.scrollLeft, f = n.scrollWidth;
         e.setState(function(c) {
           if (c.scrollOffset === u)
             return null;
@@ -138,8 +138,8 @@ function pe(r) {
             scrollUpdateWasRequested: !1
           };
         }, e._resetIsScrollingDebounced);
-      }, e._onScrollVertical = function(n) {
-        var o = n.currentTarget, s = o.clientHeight, u = o.scrollHeight, f = o.scrollTop;
+      }, e._onScrollVertical = function(i) {
+        var n = i.currentTarget, s = n.clientHeight, u = n.scrollHeight, f = n.scrollTop;
         e.setState(function(c) {
           if (c.scrollOffset === f)
             return null;
@@ -151,9 +151,9 @@ function pe(r) {
             scrollUpdateWasRequested: !1
           };
         }, e._resetIsScrollingDebounced);
-      }, e._outerRefSetter = function(n) {
-        var o = e.props.outerRef;
-        e._outerRef = n, typeof o == "function" ? o(n) : o != null && typeof o == "object" && o.hasOwnProperty("current") && (o.current = n);
+      }, e._outerRefSetter = function(i) {
+        var n = e.props.outerRef;
+        e._outerRef = i, typeof n == "function" ? n(i) : n != null && typeof n == "object" && n.hasOwnProperty("current") && (n.current = i);
       }, e._resetIsScrollingDebounced = function() {
         e._resetIsScrollingTimeoutId !== null && K(e._resetIsScrollingTimeoutId), e._resetIsScrollingTimeoutId = de(e._resetIsScrolling, fe);
       }, e._resetIsScrolling = function() {
@@ -164,41 +164,41 @@ function pe(r) {
         });
       }, e;
     }
-    b.getDerivedStateFromProps = function(e, n) {
-      return me(e, n), g(e), null;
+    b.getDerivedStateFromProps = function(e, i) {
+      return me(e, i), g(e), null;
     };
     var z = b.prototype;
     return z.scrollTo = function(e) {
-      e = Math.max(0, e), this.setState(function(n) {
-        return n.scrollOffset === e ? null : {
-          scrollDirection: n.scrollOffset < e ? "forward" : "backward",
+      e = Math.max(0, e), this.setState(function(i) {
+        return i.scrollOffset === e ? null : {
+          scrollDirection: i.scrollOffset < e ? "forward" : "backward",
           scrollOffset: e,
           scrollUpdateWasRequested: !0
         };
       }, this._resetIsScrollingDebounced);
-    }, z.scrollToItem = function(e, n) {
-      n === void 0 && (n = "auto");
-      var o = this.props, s = o.itemCount, u = o.layout, f = this.state.scrollOffset;
+    }, z.scrollToItem = function(e, i) {
+      i === void 0 && (i = "auto");
+      var n = this.props, s = n.itemCount, u = n.layout, f = this.state.scrollOffset;
       e = Math.max(0, Math.min(e, s - 1));
       var c = 0;
       if (this._outerRef) {
         var d = this._outerRef;
         u === "vertical" ? c = d.scrollWidth > d.clientWidth ? j() : 0 : c = d.scrollHeight > d.clientHeight ? j() : 0;
       }
-      this.scrollTo(I(this.props, e, n, f, this._instanceProps, c));
+      this.scrollTo(I(this.props, e, i, f, this._instanceProps, c));
     }, z.componentDidMount = function() {
-      var e = this.props, n = e.direction, o = e.initialScrollOffset, s = e.layout;
-      if (typeof o == "number" && this._outerRef != null) {
+      var e = this.props, i = e.direction, n = e.initialScrollOffset, s = e.layout;
+      if (typeof n == "number" && this._outerRef != null) {
         var u = this._outerRef;
-        n === "horizontal" || s === "horizontal" ? u.scrollLeft = o : u.scrollTop = o;
+        i === "horizontal" || s === "horizontal" ? u.scrollLeft = n : u.scrollTop = n;
       }
       this._callPropsCallbacks();
     }, z.componentDidUpdate = function() {
-      var e = this.props, n = e.direction, o = e.layout, s = this.state, u = s.scrollOffset, f = s.scrollUpdateWasRequested;
+      var e = this.props, i = e.direction, n = e.layout, s = this.state, u = s.scrollOffset, f = s.scrollUpdateWasRequested;
       if (f && this._outerRef != null) {
         var c = this._outerRef;
-        if (n === "horizontal" || o === "horizontal")
-          if (n === "rtl")
+        if (i === "horizontal" || n === "horizontal")
+          if (i === "rtl")
             switch (B()) {
               case "negative":
                 c.scrollLeft = -u;
@@ -220,10 +220,10 @@ function pe(r) {
     }, z.componentWillUnmount = function() {
       this._resetIsScrollingTimeoutId !== null && K(this._resetIsScrollingTimeoutId);
     }, z.render = function() {
-      var e = this.props, n = e.children, o = e.className, s = e.direction, u = e.height, f = e.innerRef, c = e.innerElementType, d = e.innerTagName, h = e.itemCount, T = e.itemData, O = e.itemKey, x = O === void 0 ? he : O, E = e.layout, G = e.outerElementType, J = e.outerTagName, Q = e.style, X = e.useIsScrolling, Y = e.width, A = this.state.isScrolling, W = s === "horizontal" || E === "horizontal", Z = W ? this._onScrollHorizontal : this._onScrollVertical, F = this._getRangeToRender(), ee = F[0], te = F[1], V = [];
+      var e = this.props, i = e.children, n = e.className, s = e.direction, u = e.height, f = e.innerRef, c = e.innerElementType, d = e.innerTagName, h = e.itemCount, T = e.itemData, O = e.itemKey, x = O === void 0 ? he : O, E = e.layout, G = e.outerElementType, J = e.outerTagName, Q = e.style, X = e.useIsScrolling, Y = e.width, A = this.state.isScrolling, M = s === "horizontal" || E === "horizontal", Z = M ? this._onScrollHorizontal : this._onScrollVertical, F = this._getRangeToRender(), ee = F[0], te = F[1], V = [];
       if (h > 0)
         for (var C = ee; C <= te; C++)
-          V.push(k(n, {
+          V.push(k(i, {
             data: T,
             key: x(C, T),
             index: C,
@@ -232,7 +232,7 @@ function pe(r) {
           }));
       var U = l(this.props, this._instanceProps);
       return k(G || J || "div", {
-        className: o,
+        className: n,
         onScroll: Z,
         ref: this._outerRefSetter,
         style: ne({
@@ -248,17 +248,17 @@ function pe(r) {
         children: V,
         ref: f,
         style: {
-          height: W ? "100%" : U,
+          height: M ? "100%" : U,
           pointerEvents: A ? "none" : void 0,
-          width: W ? U : "100%"
+          width: M ? U : "100%"
         }
       }));
     }, z._callPropsCallbacks = function() {
       if (typeof this.props.onItemsRendered == "function") {
         var e = this.props.itemCount;
         if (e > 0) {
-          var n = this._getRangeToRender(), o = n[0], s = n[1], u = n[2], f = n[3];
-          this._callOnItemsRendered(o, s, u, f);
+          var i = this._getRangeToRender(), n = i[0], s = i[1], u = i[2], f = i[3];
+          this._callOnItemsRendered(n, s, u, f);
         }
       }
       if (typeof this.props.onScroll == "function") {
@@ -266,11 +266,11 @@ function pe(r) {
         this._callOnScroll(d, h, T);
       }
     }, z._getRangeToRender = function() {
-      var e = this.props, n = e.itemCount, o = e.overscanCount, s = this.state, u = s.isScrolling, f = s.scrollDirection, c = s.scrollOffset;
-      if (n === 0)
+      var e = this.props, i = e.itemCount, n = e.overscanCount, s = this.state, u = s.isScrolling, f = s.scrollDirection, c = s.scrollOffset;
+      if (i === 0)
         return [0, 0, 0, 0];
-      var d = m(this.props, c, this._instanceProps), h = v(this.props, d, c, this._instanceProps), T = !u || f === "backward" ? Math.max(1, o) : 1, O = !u || f === "forward" ? Math.max(1, o) : 1;
-      return [Math.max(0, d - T), Math.max(0, Math.min(n - 1, h + O)), d, h];
+      var d = m(this.props, c, this._instanceProps), h = v(this.props, d, c, this._instanceProps), T = !u || f === "backward" ? Math.max(1, n) : 1, O = !u || f === "forward" ? Math.max(1, n) : 1;
+      return [Math.max(0, d - T), Math.max(0, Math.min(i - 1, h + O)), d, h];
     }, b;
   }(re), t.defaultProps = {
     direction: "ltr",
@@ -280,15 +280,15 @@ function pe(r) {
     useIsScrolling: !1
   }, t;
 }
-var me = function(t, i) {
-  var l = t.children, a = t.direction, I = t.height, m = t.layout, v = t.innerTagName, S = t.outerTagName, y = t.width, g = i.instance;
+var me = function(t, o) {
+  var l = t.children, a = t.direction, I = t.height, m = t.layout, v = t.innerTagName, S = t.outerTagName, y = t.width, g = o.instance;
   if (process.env.NODE_ENV !== "production") {
-    (v != null || S != null) && M && !M.has(g) && (M.add(g), console.warn("The innerTagName and outerTagName props have been deprecated. Please use the innerElementType and outerElementType props instead."));
+    (v != null || S != null) && P && !P.has(g) && (P.add(g), console.warn("The innerTagName and outerTagName props have been deprecated. Please use the innerElementType and outerElementType props instead."));
     var w = a === "horizontal" || m === "horizontal";
     switch (a) {
       case "horizontal":
       case "vertical":
-        P && !P.has(g) && (P.add(g), console.warn('The direction prop should be either "ltr" (default) or "rtl". Please use the layout prop to specify "vertical" (default) or "horizontal" orientation.'));
+        R && !R.has(g) && (R.add(g), console.warn('The direction prop should be either "ltr" (default) or "rtl". Please use the layout prop to specify "vertical" (default) or "horizontal" orientation.'));
         break;
       case "ltr":
       case "rtl":
@@ -311,43 +311,43 @@ var me = function(t, i) {
       throw Error('An invalid "height" prop has been specified. Vertical lists must specify a number for height. ' + ('"' + (I === null ? "null" : typeof I) + '" was specified.'));
   }
 }, ve = /* @__PURE__ */ pe({
-  getItemOffset: function(t, i) {
+  getItemOffset: function(t, o) {
     var l = t.itemSize;
-    return i * l;
+    return o * l;
   },
-  getItemSize: function(t, i) {
+  getItemSize: function(t, o) {
     var l = t.itemSize;
     return l;
   },
   getEstimatedTotalSize: function(t) {
-    var i = t.itemCount, l = t.itemSize;
-    return l * i;
+    var o = t.itemCount, l = t.itemSize;
+    return l * o;
   },
-  getOffsetForIndexAndAlignment: function(t, i, l, a, I, m) {
-    var v = t.direction, S = t.height, y = t.itemCount, g = t.itemSize, w = t.layout, b = t.width, z = v === "horizontal" || w === "horizontal", p = z ? b : S, e = Math.max(0, y * g - p), n = Math.min(e, i * g), o = Math.max(0, i * g - p + g + m);
-    switch (l === "smart" && (a >= o - p && a <= n + p ? l = "auto" : l = "center"), l) {
+  getOffsetForIndexAndAlignment: function(t, o, l, a, I, m) {
+    var v = t.direction, S = t.height, y = t.itemCount, g = t.itemSize, w = t.layout, b = t.width, z = v === "horizontal" || w === "horizontal", p = z ? b : S, e = Math.max(0, y * g - p), i = Math.min(e, o * g), n = Math.max(0, o * g - p + g + m);
+    switch (l === "smart" && (a >= n - p && a <= i + p ? l = "auto" : l = "center"), l) {
       case "start":
-        return n;
+        return i;
       case "end":
-        return o;
+        return n;
       case "center": {
-        var s = Math.round(o + (n - o) / 2);
+        var s = Math.round(n + (i - n) / 2);
         return s < Math.ceil(p / 2) ? 0 : s > e + Math.floor(p / 2) ? e : s;
       }
       case "auto":
       default:
-        return a >= o && a <= n ? a : a < o ? o : n;
+        return a >= n && a <= i ? a : a < n ? n : i;
     }
   },
-  getStartIndexForOffset: function(t, i) {
+  getStartIndexForOffset: function(t, o) {
     var l = t.itemCount, a = t.itemSize;
-    return Math.max(0, Math.min(l - 1, Math.floor(i / a)));
+    return Math.max(0, Math.min(l - 1, Math.floor(o / a)));
   },
-  getStopIndexForStartIndex: function(t, i, l) {
-    var a = t.direction, I = t.height, m = t.itemCount, v = t.itemSize, S = t.layout, y = t.width, g = a === "horizontal" || S === "horizontal", w = i * v, b = g ? y : I, z = Math.ceil((b + l - w) / v);
+  getStopIndexForStartIndex: function(t, o, l) {
+    var a = t.direction, I = t.height, m = t.itemCount, v = t.itemSize, S = t.layout, y = t.width, g = a === "horizontal" || S === "horizontal", w = o * v, b = g ? y : I, z = Math.ceil((b + l - w) / v);
     return Math.max(0, Math.min(
       m - 1,
-      i + z - 1
+      o + z - 1
       // -1 is because stop index is inclusive
     ));
   },
@@ -355,51 +355,51 @@ var me = function(t, i) {
   },
   shouldResetStyleCacheOnItemSizeChange: !0,
   validateProps: function(t) {
-    var i = t.itemSize;
-    if (process.env.NODE_ENV !== "production" && typeof i != "number")
-      throw Error('An invalid "itemSize" prop has been specified. Value should be a number. ' + ('"' + (i === null ? "null" : typeof i) + '" was specified.'));
+    var o = t.itemSize;
+    if (process.env.NODE_ENV !== "production" && typeof o != "number")
+      throw Error('An invalid "itemSize" prop has been specified. Value should be a number. ' + ('"' + (o === null ? "null" : typeof o) + '" was specified.'));
   }
 });
 function ge() {
-  const [r, t] = N.useState([500, 500]), i = N.useRef(null);
-  return N.useEffect(() => {
+  const [r, t] = W.useState([500, 500]), o = W.useRef(null);
+  return W.useEffect(() => {
     const l = () => {
-      if (i.current) {
-        const a = i.current.getBoundingClientRect();
+      if (o.current) {
+        const a = o.current.getBoundingClientRect();
         t([a.width, a.height]);
       }
     };
     return l(), window.addEventListener("resize", l), () => {
       window.removeEventListener("resize", l);
     };
-  }, []), [i, ...r];
+  }, []), [o, ...r];
+}
+function Se(r) {
+  return /* @__PURE__ */ N(le, { ...r });
 }
-const Se = N.forwardRef(function(t, i) {
-  return /* @__PURE__ */ R(le, { scrollerRef: i, ...t });
-});
 function Oe(r) {
   const {
     className: t,
-    itemCount: i,
+    itemCount: o,
     itemHeight: l,
     renderItem: a,
     initialScrollOffset: I,
     onScrollUpdate: m
   } = r, v = m ? (w) => m == null ? void 0 : m(w.scrollOffset) : void 0, [S, y, g] = ge();
-  return /* @__PURE__ */ R("div", { ref: S, className: oe(se.virtual, t), children: /* @__PURE__ */ R(
+  return /* @__PURE__ */ N("div", { ref: S, className: oe(se.virtual, t), children: /* @__PURE__ */ N(
     ve,
     {
       outerElementType: Se,
       width: y,
       height: g,
-      itemCount: i,
+      itemCount: o,
       itemSize: l,
       initialScrollOffset: I,
       onScroll: v,
       children: ({
         index: w,
         style: b
-      }) => /* @__PURE__ */ R("div", { style: b, children: a(w) })
+      }) => /* @__PURE__ */ N("div", { style: b, children: a(w) })
     }
   ) });
 }

package/dist/components/Link/LinkShowcase.js

@@ -1,6 +1,6 @@
 import { jsxs as r, jsx as e } from "react/jsx-runtime";
 import d from "react";
-import { Flex as l } from "../Layout/Flex/Flex.js";
+import l from "../Layout/Flex/Flex.js";
 import { Text as i } from "../Text/Text.js";
 import "../../utils/ui/ui.js";
 import t from "./ButtonLink.js";

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

@@ -8,5 +8,6 @@ export interface LoafProps {
     bright?: boolean;
     className?: string;
     children: React.ReactNode;
+    ref?: React.Ref<HTMLDivElement>;
 }
-export declare const Loaf: React.ForwardRefExoticComponent<LoafProps & React.RefAttributes<HTMLDivElement>>;
+export declare function Loaf(props: LoafProps): import("react/jsx-runtime").JSX.Element;