@bolio-ui/core 3.0.4 → 3.1.0

package/dist/{chunk-4DSLA5LJ.js → chunk-7G6BCLC6.js}

@@ -6,16 +6,17 @@
 
 
 
-var _chunkTWT6F7A7js = require('./chunk-TWT6F7A7.js');
+var _chunkDBUEPZWMjs = require('./chunk-DBUEPZWM.js');
 
 
-var _chunkF3AL4TQZjs = require('./chunk-F3AL4TQZ.js');
+
+var _chunkWXUMV5TDjs = require('./chunk-WXUMV5TD.js');
 
 
 var _chunkLDTDMDE6js = require('./chunk-LDTDMDE6.js');
 
 
-var _chunkBXDUHMWSjs = require('./chunk-BXDUHMWS.js');
+var _chunkS5PYSYVRjs = require('./chunk-S5PYSYVR.js');
 
 
 var _chunkEUYSKHRSjs = require('./chunk-EUYSKHRS.js');
@@ -110,7 +111,7 @@ var DrawerWrapper = _react2.default.forwardRef(({ className = "", children, visi
     "--drawer-wrapper-transform-hidden": transform.hidden,
     "--drawer-wrapper-transform-visible": transform.visible
   };
-  _chunkTWT6F7A7js.use_dialog_focus_default.call(void 0, visible, modalContent);
+  _chunkDBUEPZWMjs.use_dialog_focus_default.call(void 0, visible, modalContent);
   const onKeyDown = (event) => {
     const isTabDown = event.keyCode === 9;
     if (!visible || !isTabDown) return;
@@ -179,12 +180,12 @@ var DrawerComponent = _react2.default.forwardRef(
     "aria-describedby": ariaDescribedby,
     ...props
   }, ref) => {
-    const portal = _chunkBXDUHMWSjs.use_portal_default.call(void 0, "drawer");
+    const portal = _chunkS5PYSYVRjs.use_portal_default.call(void 0, "drawer");
     const baseId = _react.useId.call(void 0, );
     const titleId = `${baseId}-title`;
     const descriptionId = `${baseId}-description`;
     const [visible, setVisible] = _react.useState.call(void 0, false);
-    const [, setBodyHidden] = _chunkTWT6F7A7js.use_body_scroll_default.call(void 0, null, { delayReset: 300 });
+    const [, setBodyHidden] = _chunkDBUEPZWMjs.use_body_scroll_default.call(void 0, null, { delayReset: 300 });
     const closeDrawer = () => {
       if (onClose) onClose();
       setVisible(false);
@@ -195,11 +196,11 @@ var DrawerComponent = _react2.default.forwardRef(
       setVisible(customVisible);
       setBodyHidden(customVisible);
     }, [customVisible, setBodyHidden]);
-    const { bindings } = _chunkF3AL4TQZjs.use_keyboard_default.call(void 0, 
+    const { bindings } = _chunkWXUMV5TDjs.use_keyboard_default.call(void 0, 
       () => {
         if (keyboard) closeDrawer();
       },
-      27 /* Escape */,
+      _chunkWXUMV5TDjs.KeyCode.Escape,
       {
         disableGlobalEvent: true
       }
@@ -214,8 +215,8 @@ var DrawerComponent = _react2.default.forwardRef(
     );
     if (!portal) return null;
     return _reactdom.createPortal.call(void 0, 
-      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkTWT6F7A7js.ModalContext.Provider, { value: modalConfig, children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-        _chunkTWT6F7A7js.backdrop_default,
+      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkDBUEPZWMjs.ModalContext.Provider, { value: modalConfig, children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+        _chunkDBUEPZWMjs.backdrop_default,
         {
           onClick: closeFromBackdrop,
           onContentClick,
@@ -229,8 +230,8 @@ var DrawerComponent = _react2.default.forwardRef(
               visible,
               className: wrapClassName,
               placement,
-              "aria-labelledby": ariaLabelledby || (_chunkUX2B3G6Ujs.hasChild.call(void 0, children, _chunkTWT6F7A7js.ModalTitle_default) ? titleId : void 0),
-              "aria-describedby": ariaDescribedby || (_chunkUX2B3G6Ujs.hasChild.call(void 0, children, _chunkTWT6F7A7js.ModalSubtitle_default) ? descriptionId : void 0),
+              "aria-labelledby": ariaLabelledby || (_chunkUX2B3G6Ujs.hasChild.call(void 0, children, _chunkDBUEPZWMjs.ModalTitle_default) ? titleId : void 0),
+              "aria-describedby": ariaDescribedby || (_chunkUX2B3G6Ujs.hasChild.call(void 0, children, _chunkDBUEPZWMjs.ModalSubtitle_default) ? descriptionId : void 0),
               ...props,
               children
             }
@@ -246,9 +247,9 @@ var Drawer = _chunkMAICNLTYjs.with_scale_default.call(void 0, DrawerComponent);
 var Drawer_default = Drawer;
 
 // core/Drawer/index.ts
-Drawer_default.Title = _chunkTWT6F7A7js.ModalTitle_default;
-Drawer_default.Subtitle = _chunkTWT6F7A7js.ModalSubtitle_default;
-Drawer_default.Content = _chunkTWT6F7A7js.ModalContent_default;
+Drawer_default.Title = _chunkDBUEPZWMjs.ModalTitle_default;
+Drawer_default.Subtitle = _chunkDBUEPZWMjs.ModalSubtitle_default;
+Drawer_default.Content = _chunkDBUEPZWMjs.ModalContent_default;
 var Drawer_default2 = Drawer_default;
 
 

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;