@bolio-ui/core 3.0.5 → 3.1.0

package/dist/chunk-7U52BGWH.js

@@ -0,0 +1,88 @@
+"use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+var _chunk5L34MDJFjs = require('./chunk-5L34MDJF.js');
+
+
+
+var _chunkMAICNLTYjs = require('./chunk-MAICNLTY.js');
+
+
+var _chunkV5I4ORQQjs = require('./chunk-V5I4ORQQ.js');
+
+
+var _chunk5KUROAEPjs = require('./chunk-5KUROAEP.js');
+
+// core/Spoiler/Spoiler.tsx
+var _react = require('react'); var _react2 = _interopRequireDefault(_react);
+
+// css-module-source:/Users/brunnoandrade/Desktop/BolioUI/bolio-ui/core/Spoiler/Spoiler.module.css.bolio-css-module-source
+var Spoiler_module_css_default = { "spoiler": "Spoiler-module_spoiler__aAOK0", "content": "Spoiler-module_content__D69z0", "toggle": "Spoiler-module_toggle__kCTmC" };
+
+// core/Spoiler/Spoiler.tsx
+var _jsxruntime = require('react/jsx-runtime');
+var SpoilerComponent = _react2.default.forwardRef(
+  ({
+    maxHeight = 100,
+    showLabel = "Show more",
+    hideLabel = "Hide",
+    initialOpened = false,
+    className = "",
+    style,
+    children,
+    ...props
+  }, ref) => {
+    const theme = _chunkV5I4ORQQjs.use_theme_default.call(void 0, );
+    const { SCALES } = _chunkMAICNLTYjs.use_scale_default.call(void 0, );
+    const [opened, setOpened] = _react.useState.call(void 0, initialOpened);
+    const [innerRef, { height }] = _chunk5L34MDJFjs.use_resize_observer_default.call(void 0, );
+    const contentId = _react.useId.call(void 0, );
+    const showToggle = opened || height > maxHeight;
+    const spoilerStyle = {
+      width: SCALES.width(1, "100%"),
+      margin: `${SCALES.mt(0)} ${SCALES.mr(0)} ${SCALES.mb(0)} ${SCALES.ml(0)}`,
+      "--spoiler-link": theme.palette.link,
+      ...style
+    };
+    return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, 
+      "div",
+      {
+        ref,
+        className: _chunk5KUROAEPjs.use_classes_default.call(void 0, Spoiler_module_css_default.spoiler, className),
+        ...props,
+        style: spoilerStyle,
+        children: [
+          /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+            "div",
+            {
+              id: contentId,
+              className: Spoiler_module_css_default.content,
+              style: opened ? void 0 : { maxHeight },
+              children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { ref: innerRef, children })
+            }
+          ),
+          showToggle && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+            "button",
+            {
+              type: "button",
+              className: Spoiler_module_css_default.toggle,
+              "aria-expanded": opened,
+              "aria-controls": contentId,
+              onClick: () => setOpened(!opened),
+              children: opened ? hideLabel : showLabel
+            }
+          )
+        ]
+      }
+    );
+  }
+);
+SpoilerComponent.displayName = "BolioUISpoiler";
+var Spoiler = _chunkMAICNLTYjs.with_scale_default.call(void 0, SpoilerComponent);
+var Spoiler_default = Spoiler;
+
+// core/Spoiler/index.ts
+var Spoiler_default2 = Spoiler_default;
+
+
+
+exports.Spoiler_default = Spoiler_default2;

package/dist/chunk-7UTQAZHV.js

@@ -0,0 +1,26 @@
+"use strict";Object.defineProperty(exports, "__esModule", {value: true});// core/use-orientation/use-orientation.ts
+var _react = require('react');
+var useOrientation = (defaultValue = { angle: 0, type: "landscape-primary" }) => {
+  const [orientation, setOrientation] = _react.useState.call(void 0, defaultValue);
+  _react.useEffect.call(void 0, () => {
+    var _a;
+    const screenOrientation = (_a = window.screen) == null ? void 0 : _a.orientation;
+    if (!screenOrientation) return;
+    const update = () => setOrientation({
+      angle: screenOrientation.angle,
+      type: screenOrientation.type
+    });
+    update();
+    screenOrientation.addEventListener("change", update);
+    return () => screenOrientation.removeEventListener("change", update);
+  }, []);
+  return orientation;
+};
+var use_orientation_default = useOrientation;
+
+// core/use-orientation/index.ts
+var use_orientation_default2 = use_orientation_default;
+
+
+
+exports.use_orientation_default = use_orientation_default2;

package/dist/chunk-7VYP5HCP.js

@@ -0,0 +1,20 @@
+"use strict";Object.defineProperty(exports, "__esModule", {value: true});// core/use-document-visibility/use-document-visibility.ts
+var _react = require('react');
+var useDocumentVisibility = () => {
+  const [visibility, setVisibility] = _react.useState.call(void 0, "visible");
+  _react.useEffect.call(void 0, () => {
+    const update = () => setVisibility(document.visibilityState);
+    update();
+    document.addEventListener("visibilitychange", update);
+    return () => document.removeEventListener("visibilitychange", update);
+  }, []);
+  return visibility;
+};
+var use_document_visibility_default = useDocumentVisibility;
+
+// core/use-document-visibility/index.ts
+var use_document_visibility_default2 = use_document_visibility_default;
+
+
+
+exports.use_document_visibility_default = use_document_visibility_default2;

package/dist/chunk-7XJQX5IB.js

@@ -0,0 +1,22 @@
+"use strict";Object.defineProperty(exports, "__esModule", {value: true});// core/use-favicon/use-favicon.ts
+var _react = require('react');
+var useFavicon = (url) => {
+  _react.useEffect.call(void 0, () => {
+    if (!url) return;
+    let link = document.querySelector("link[rel*='icon']");
+    if (!link) {
+      link = document.createElement("link");
+      link.rel = "shortcut icon";
+      document.head.appendChild(link);
+    }
+    link.href = url;
+  }, [url]);
+};
+var use_favicon_default = useFavicon;
+
+// core/use-favicon/index.ts
+var use_favicon_default2 = use_favicon_default;
+
+
+
+exports.use_favicon_default = use_favicon_default2;

package/dist/chunk-AW2CZE7L.js

@@ -0,0 +1,33 @@
+"use strict";Object.defineProperty(exports, "__esModule", {value: true});// core/use-mouse/use-mouse.ts
+var _react = require('react');
+var useMouse = () => {
+  const ref = _react.useRef.call(void 0, null);
+  const [position, setPosition] = _react.useState.call(void 0, { x: 0, y: 0 });
+  _react.useEffect.call(void 0, () => {
+    const node = ref.current;
+    const target = node != null ? node : document;
+    const move = (event) => {
+      const { clientX, clientY } = event;
+      if (node) {
+        const rect = node.getBoundingClientRect();
+        setPosition({
+          x: Math.round(clientX - rect.left),
+          y: Math.round(clientY - rect.top)
+        });
+      } else {
+        setPosition({ x: clientX, y: clientY });
+      }
+    };
+    target.addEventListener("mousemove", move);
+    return () => target.removeEventListener("mousemove", move);
+  }, []);
+  return { ref, ...position };
+};
+var use_mouse_default = useMouse;
+
+// core/use-mouse/index.ts
+var use_mouse_default2 = use_mouse_default;
+
+
+
+exports.use_mouse_default = use_mouse_default2;

package/dist/{chunk-IUZV5Y27.js → chunk-B3Q2W7MC.js}

@@ -1,6 +1,9 @@
 "use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
-var _chunk33BUV2RXjs = require('./chunk-33BUV2RX.js');
+var _chunkUOGCO6CVjs = require('./chunk-UOGCO6CV.js');
+
+
+var _chunkE4LPRAZ6js = require('./chunk-E4LPRAZ6.js');
 
 
 var _chunkZRORQ2WHjs = require('./chunk-ZRORQ2WH.js');
@@ -23,6 +26,7 @@ var _chunk5KUROAEPjs = require('./chunk-5KUROAEP.js');
 
 
 
+
 var _react = require('react'); var _react2 = _interopRequireDefault(_react);
 
 // core/utils/use-drag.ts
@@ -32,8 +36,8 @@ var useDrag = (elementRef, draggingHandler = () => {
 }, dragEndHandler = () => {
 }) => {
   const onDragging = _react.useRef.call(void 0, false);
-  const [, setStartX, startXRef] = _chunk33BUV2RXjs.use_current_state_default.call(void 0, 0);
-  const [, setCurrentX, currentXRef] = _chunk33BUV2RXjs.use_current_state_default.call(void 0, 0);
+  const [, setStartX, startXRef] = _chunkE4LPRAZ6js.use_current_state_default.call(void 0, 0);
+  const [, setCurrentX, currentXRef] = _chunkE4LPRAZ6js.use_current_state_default.call(void 0, 0);
   const draggingRef = _chunkZRORQ2WHjs.use_latest_default.call(void 0, draggingHandler);
   const dragStartRef = _chunkZRORQ2WHjs.use_latest_default.call(void 0, dragStartHandler);
   const dragEndRef = _chunkZRORQ2WHjs.use_latest_default.call(void 0, dragEndHandler);
@@ -209,6 +213,8 @@ var SliderComponent = _react2.default.forwardRef(
   ({
     hideValue = false,
     disabled = false,
+    error = false,
+    errorMessage,
     type = "default",
     step = 1,
     max = 100,
@@ -220,14 +226,17 @@ var SliderComponent = _react2.default.forwardRef(
     showMarkers = false,
     "aria-label": ariaLabel,
     "aria-labelledby": ariaLabelledby,
+    "aria-describedby": ariaDescribedby,
     style,
     ...props
   }, ref) => {
     const theme = _chunkV5I4ORQQjs.use_theme_default.call(void 0, );
     const { SCALES } = _chunkMAICNLTYjs.use_scale_default.call(void 0, );
+    const errorId = `${_react.useId.call(void 0, )}-error`;
+    const describedBy = [ariaDescribedby, error && errorMessage ? errorId : void 0].filter(Boolean).join(" ") || void 0;
     const [value, setValue] = _react.useState.call(void 0, initialValue);
-    const [, setSliderWidth, sideWidthRef] = _chunk33BUV2RXjs.use_current_state_default.call(void 0, 0);
-    const [, setLastDargOffset, lastDargOffsetRef] = _chunk33BUV2RXjs.use_current_state_default.call(void 0, 0);
+    const [, setSliderWidth, sideWidthRef] = _chunkE4LPRAZ6js.use_current_state_default.call(void 0, 0);
+    const [, setLastDargOffset, lastDargOffsetRef] = _chunkE4LPRAZ6js.use_current_state_default.call(void 0, 0);
     const [isClick, setIsClick] = _react.useState.call(void 0, false);
     const sliderRef = _react.useRef.call(void 0, null);
     _react.useImperativeHandle.call(void 0, ref, () => sliderRef.current);
@@ -256,8 +265,8 @@ var SliderComponent = _react2.default.forwardRef(
       [max, min, step, sideWidthRef, onChange]
     );
     const { bg } = _react.useMemo.call(void 0, 
-      () => getColors(theme.palette, type),
-      [theme.palette, type]
+      () => getColors(theme.palette, error ? "error" : type),
+      [theme.palette, type, error]
     );
     const dragHandler = (event) => {
       if (disabled) return;
@@ -324,38 +333,43 @@ var SliderComponent = _react2.default.forwardRef(
       margin: `${SCALES.mt(0)} ${SCALES.mr(0)} ${SCALES.mb(0)} ${SCALES.ml(0)}`,
       ...style
     };
-    return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, 
-      "div",
-      {
-        className: _chunk5KUROAEPjs.use_classes_default.call(void 0, Slider_module_css_default.slider, className),
-        onClick: clickHandler,
-        ref: sliderRef,
-        ...props,
-        style: sliderStyle,
-        children: [
-          /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-            SliderDot_default,
-            {
-              disabled,
-              ref: dotRef,
-              isClick,
-              left: currentRatio,
-              role: "slider",
-              tabIndex: disabled ? -1 : 0,
-              "aria-label": ariaLabel,
-              "aria-labelledby": ariaLabelledby,
-              "aria-valuemin": min,
-              "aria-valuemax": max,
-              "aria-valuenow": value,
-              "aria-disabled": disabled || void 0,
-              onKeyDown: keyDownHandler,
-              children: hideValue || value
-            }
-          ),
-          showMarkers && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, SliderMark_default, { max, min, step })
-        ]
-      }
-    );
+    return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _jsxruntime.Fragment, { children: [
+      /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, 
+        "div",
+        {
+          className: _chunk5KUROAEPjs.use_classes_default.call(void 0, Slider_module_css_default.slider, className),
+          onClick: clickHandler,
+          ref: sliderRef,
+          ...props,
+          style: sliderStyle,
+          children: [
+            /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+              SliderDot_default,
+              {
+                disabled,
+                ref: dotRef,
+                isClick,
+                left: currentRatio,
+                role: "slider",
+                tabIndex: disabled ? -1 : 0,
+                "aria-label": ariaLabel,
+                "aria-labelledby": ariaLabelledby,
+                "aria-invalid": error || void 0,
+                "aria-describedby": describedBy,
+                "aria-valuemin": min,
+                "aria-valuemax": max,
+                "aria-valuenow": value,
+                "aria-disabled": disabled || void 0,
+                onKeyDown: keyDownHandler,
+                children: hideValue || value
+              }
+            ),
+            showMarkers && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, SliderMark_default, { max, min, step })
+          ]
+        }
+      ),
+      error && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkUOGCO6CVjs.InputBlockLabel_default, { error, id: errorId, children: errorMessage })
+    ] });
   }
 );
 SliderComponent.displayName = "BolioUISlider";

package/dist/{chunk-XC33TGGT.js → chunk-B555RLYX.js}

@@ -1,7 +1,7 @@
 "use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
 
-var _chunkGJZT47MPjs = require('./chunk-GJZT47MP.js');
+var _chunkQ4FDY7EJjs = require('./chunk-Q4FDY7EJ.js');
 
 
 
@@ -26,9 +26,9 @@ var getColors = (type, palette, {
   light,
   subtle
 }) => {
-  if (_chunkGJZT47MPjs.isSemanticColorType.call(void 0, type)) {
+  if (_chunkQ4FDY7EJjs.isSemanticColorType.call(void 0, type)) {
     const variant = subtle ? "subtle" : light ? "light" : invert ? "filled" : "outline";
-    const { bg, border, color } = _chunkGJZT47MPjs.getVariantColors.call(void 0, palette, type, variant);
+    const { bg, border, color } = _chunkQ4FDY7EJjs.getVariantColors.call(void 0, palette, type, variant);
     return { color, bgColor: bg, borderColor: border };
   }
   const colors = {

package/dist/chunk-BI3KST5Z.js

@@ -0,0 +1,46 @@
+"use strict";Object.defineProperty(exports, "__esModule", {value: true});
+
+var _chunkZRORQ2WHjs = require('./chunk-ZRORQ2WH.js');
+
+// core/use-file-dialog/use-file-dialog.ts
+var _react = require('react');
+var useFileDialog = (options = {}) => {
+  const [files, setFiles] = _react.useState.call(void 0, null);
+  const input = _react.useRef.call(void 0, null);
+  const latest = _chunkZRORQ2WHjs.use_latest_default.call(void 0, options);
+  _react.useEffect.call(void 0, () => {
+    const element = document.createElement("input");
+    element.type = "file";
+    element.addEventListener("change", () => {
+      var _a, _b;
+      setFiles(element.files);
+      (_b = (_a = latest.current).onChange) == null ? void 0 : _b.call(_a, element.files);
+    });
+    input.current = element;
+    return () => {
+      input.current = null;
+    };
+  }, [latest]);
+  const open = _react.useCallback.call(void 0, () => {
+    const element = input.current;
+    if (!element) return;
+    const { multiple, accept, capture } = latest.current;
+    element.multiple = Boolean(multiple);
+    element.accept = accept != null ? accept : "";
+    if (capture) element.capture = capture;
+    element.click();
+  }, [latest]);
+  const reset = _react.useCallback.call(void 0, () => {
+    setFiles(null);
+    if (input.current) input.current.value = "";
+  }, []);
+  return { files, open, reset };
+};
+var use_file_dialog_default = useFileDialog;
+
+// core/use-file-dialog/index.ts
+var use_file_dialog_default2 = use_file_dialog_default;
+
+
+
+exports.use_file_dialog_default = use_file_dialog_default2;

package/dist/chunk-BMMTVFV5.js

@@ -0,0 +1,202 @@
+"use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+var _chunkFU73QPTYjs = require('./chunk-FU73QPTY.js');
+
+
+
+var _chunkMAICNLTYjs = require('./chunk-MAICNLTY.js');
+
+
+var _chunkV5I4ORQQjs = require('./chunk-V5I4ORQQ.js');
+
+
+
+var _chunk5KUROAEPjs = require('./chunk-5KUROAEP.js');
+
+// core/ScrollArea/ScrollArea.tsx
+var _react = require('react'); var _react2 = _interopRequireDefault(_react);
+
+// css-module-source:/Users/brunnoandrade/Desktop/BolioUI/bolio-ui/core/ScrollArea/ScrollArea.module.css.bolio-css-module-source
+var ScrollArea_module_css_default = { "scrollArea": "ScrollArea-module_scrollArea__hWDno", "hover": "ScrollArea-module_hover__BdieF", "viewport": "ScrollArea-module_viewport__NsNP8", "vertical": "ScrollArea-module_vertical__pLVjR", "horizontal": "ScrollArea-module_horizontal__04fX0", "both": "ScrollArea-module_both__SLatS", "custom": "ScrollArea-module_custom__EmB3p", "track": "ScrollArea-module_track__vGrOF", "trackX": "ScrollArea-module_trackX__VM9bC", "trackY": "ScrollArea-module_trackY__Apbnh", "thumb": "ScrollArea-module_thumb__DLvTa" };
+
+// core/ScrollArea/ScrollArea.tsx
+var _jsxruntime = require('react/jsx-runtime');
+var minThumb = 24;
+var noThumbs = { x: null, y: null };
+var measure = (node, axis) => {
+  const horizontal = axis === "x";
+  const scroll = horizontal ? node.scrollWidth : node.scrollHeight;
+  const client = horizontal ? node.clientWidth : node.clientHeight;
+  if (scroll <= client) return null;
+  const position = horizontal ? node.scrollLeft : node.scrollTop;
+  const size = Math.max(minThumb, client * client / scroll);
+  return {
+    size,
+    offset: position / (scroll - client) * (client - size)
+  };
+};
+var same = (a, b) => a === b || !!a && !!b && a.size === b.size && a.offset === b.offset;
+var hasStyledScrollbar = () => typeof CSS === "undefined" || typeof CSS.supports !== "function" || CSS.supports("selector(::-webkit-scrollbar)");
+var ScrollAreaComponent = _react2.default.forwardRef(
+  ({
+    orientation = "vertical",
+    scrollbar = "always",
+    className = "",
+    style,
+    children,
+    ...props
+  }, ref) => {
+    const theme = _chunkV5I4ORQQjs.use_theme_default.call(void 0, );
+    const viewportRef = _react.useRef.call(void 0, null);
+    const mergedRef = _chunkFU73QPTYjs.use_merged_ref_default.call(void 0, ref, viewportRef);
+    const { SCALES } = _chunkMAICNLTYjs.use_scale_default.call(void 0, );
+    const [custom, setCustom] = _react.useState.call(void 0, false);
+    const [thumbs, setThumbs] = _react.useState.call(void 0, noThumbs);
+    const drag = _react.useRef.call(void 0, 
+      null
+    );
+    _react.useEffect.call(void 0, () => setCustom(!hasStyledScrollbar()), []);
+    _react.useEffect.call(void 0, () => {
+      const node = viewportRef.current;
+      if (!node || orientation !== "horizontal") return;
+      const onWheel = (event) => {
+        if (Math.abs(event.deltaY) <= Math.abs(event.deltaX)) return;
+        const max = node.scrollWidth - node.clientWidth;
+        const next = Math.min(max, Math.max(0, node.scrollLeft + event.deltaY));
+        if (next === node.scrollLeft) return;
+        event.preventDefault();
+        node.scrollLeft = next;
+      };
+      node.addEventListener("wheel", onWheel, { passive: false });
+      return () => node.removeEventListener("wheel", onWheel);
+    }, [orientation]);
+    const update = _react.useCallback.call(void 0, () => {
+      const node = viewportRef.current;
+      if (!node) return;
+      const x = orientation === "vertical" ? null : measure(node, "x");
+      const y = orientation === "horizontal" ? null : measure(node, "y");
+      setThumbs(
+        (prev) => same(prev.x, x) && same(prev.y, y) ? prev : { x, y }
+      );
+    }, [orientation]);
+    _react.useEffect.call(void 0, () => {
+      const node = viewportRef.current;
+      if (!custom || !node) return;
+      update();
+      node.addEventListener("scroll", update);
+      const resize = new ResizeObserver(update);
+      resize.observe(node);
+      const mutation = new MutationObserver(update);
+      mutation.observe(node, {
+        childList: true,
+        subtree: true,
+        characterData: true
+      });
+      return () => {
+        node.removeEventListener("scroll", update);
+        resize.disconnect();
+        mutation.disconnect();
+      };
+    }, [custom, update]);
+    const onThumbDown = (axis) => (event) => {
+      const node = viewportRef.current;
+      if (!node) return;
+      event.currentTarget.setPointerCapture(event.pointerId);
+      drag.current = {
+        axis,
+        pointer: axis === "x" ? event.clientX : event.clientY,
+        scroll: axis === "x" ? node.scrollLeft : node.scrollTop
+      };
+    };
+    const onThumbMove = (event) => {
+      const node = viewportRef.current;
+      const start = drag.current;
+      if (!node || !start) return;
+      const horizontal = start.axis === "x";
+      const thumb = thumbs[start.axis];
+      if (!thumb) return;
+      const scroll = horizontal ? node.scrollWidth : node.scrollHeight;
+      const client = horizontal ? node.clientWidth : node.clientHeight;
+      const delta = (horizontal ? event.clientX : event.clientY) - start.pointer;
+      const next = start.scroll + delta * (scroll - client) / (client - thumb.size);
+      if (horizontal) node.scrollLeft = next;
+      else node.scrollTop = next;
+    };
+    const classes = _chunk5KUROAEPjs.use_classes_default.call(void 0, 
+      ScrollArea_module_css_default.scrollArea,
+      { [ScrollArea_module_css_default.hover]: scrollbar === "hover" },
+      className
+    );
+    const viewportClasses = _chunk5KUROAEPjs.use_classes_default.call(void 0, ScrollArea_module_css_default.viewport, ScrollArea_module_css_default[orientation], {
+      [ScrollArea_module_css_default.custom]: custom
+    });
+    const rootStyle = {
+      width: SCALES.width(1, "100%"),
+      height: SCALES.height(1, "auto"),
+      margin: `${SCALES.mt(0)} ${SCALES.mr(0)} ${SCALES.mb(0)} ${SCALES.ml(0)}`,
+      "--scroll-thumb-visible": theme.palette.accents_5,
+      "--scroll-thumb-active": theme.palette.accents_6,
+      "--scroll-focus": theme.palette.foreground,
+      ...style
+    };
+    const viewportStyle = {
+      padding: `${SCALES.pt(0)} ${SCALES.pr(0)} ${SCALES.pb(orientation === "vertical" ? 0 : 0.5)} ${SCALES.pl(0)}`
+    };
+    return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: classes, style: rootStyle, children: [
+      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+        "div",
+        {
+          ref: mergedRef,
+          className: viewportClasses,
+          tabIndex: 0,
+          ...props,
+          style: viewportStyle,
+          children
+        }
+      ),
+      custom && ["x", "y"].map((axis) => {
+        const thumb = thumbs[axis];
+        if (!thumb) return null;
+        const horizontal = axis === "x";
+        return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+          "div",
+          {
+            className: _chunk5KUROAEPjs.joinClasses.call(void 0, 
+              ScrollArea_module_css_default.track,
+              horizontal ? ScrollArea_module_css_default.trackX : ScrollArea_module_css_default.trackY
+            ),
+            "aria-hidden": true,
+            children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+              "div",
+              {
+                className: ScrollArea_module_css_default.thumb,
+                style: horizontal ? {
+                  width: thumb.size,
+                  transform: `translateX(${thumb.offset}px)`
+                } : {
+                  height: thumb.size,
+                  transform: `translateY(${thumb.offset}px)`
+                },
+                onPointerDown: onThumbDown(axis),
+                onPointerMove: onThumbMove,
+                onPointerUp: () => drag.current = null,
+                onPointerCancel: () => drag.current = null
+              }
+            )
+          },
+          axis
+        );
+      })
+    ] });
+  }
+);
+ScrollAreaComponent.displayName = "BolioUIScrollArea";
+var ScrollArea = _chunkMAICNLTYjs.with_scale_default.call(void 0, ScrollAreaComponent);
+var ScrollArea_default = ScrollArea;
+
+// core/ScrollArea/index.ts
+var ScrollArea_default2 = ScrollArea_default;
+
+
+
+exports.ScrollArea_default = ScrollArea_default2;

package/dist/chunk-BNPKMXV3.js

@@ -0,0 +1,32 @@
+"use strict";Object.defineProperty(exports, "__esModule", {value: true});// core/use-debounced-value/use-debounced-value.ts
+var _react = require('react');
+var useDebouncedValue = (value, wait, { leading = false } = {}) => {
+  const [debounced, setDebounced] = _react.useState.call(void 0, value);
+  const mounted = _react.useRef.call(void 0, false);
+  const cooling = _react.useRef.call(void 0, false);
+  const timer = _react.useRef.call(void 0, void 0);
+  const cancel = () => clearTimeout(timer.current);
+  _react.useEffect.call(void 0, () => {
+    if (!mounted.current) {
+      mounted.current = true;
+      return;
+    }
+    if (leading && !cooling.current) setDebounced(value);
+    cooling.current = true;
+    clearTimeout(timer.current);
+    timer.current = setTimeout(() => {
+      cooling.current = false;
+      setDebounced(value);
+    }, wait);
+  }, [value, wait, leading]);
+  _react.useEffect.call(void 0, () => () => clearTimeout(timer.current), []);
+  return [debounced, cancel];
+};
+var use_debounced_value_default = useDebouncedValue;
+
+// core/use-debounced-value/index.ts
+var use_debounced_value_default2 = use_debounced_value_default;
+
+
+
+exports.use_debounced_value_default = use_debounced_value_default2;

package/dist/chunk-BURRM6RO.js

@@ -0,0 +1,28 @@
+"use strict";Object.defineProperty(exports, "__esModule", {value: true});
+
+var _chunkZRORQ2WHjs = require('./chunk-ZRORQ2WH.js');
+
+// core/use-timeout/use-timeout.ts
+var _react = require('react');
+var useTimeout = (callback, delay, { autoInvoke = false } = {}) => {
+  const timer = _react.useRef.call(void 0, void 0);
+  const latest = _chunkZRORQ2WHjs.use_latest_default.call(void 0, callback);
+  const clear = _react.useCallback.call(void 0, () => clearTimeout(timer.current), []);
+  const start = _react.useCallback.call(void 0, () => {
+    clearTimeout(timer.current);
+    timer.current = setTimeout(() => latest.current(), delay);
+  }, [delay, latest]);
+  _react.useEffect.call(void 0, () => {
+    if (autoInvoke) start();
+    return clear;
+  }, [autoInvoke, start, clear]);
+  return { start, clear };
+};
+var use_timeout_default = useTimeout;
+
+// core/use-timeout/index.ts
+var use_timeout_default2 = use_timeout_default;
+
+
+
+exports.use_timeout_default = use_timeout_default2;