@bolio-ui/core 3.0.4 → 3.1.0

package/esm/chunk-VE3ZUJ6K.js

@@ -0,0 +1,22 @@
+import {
+  use_latest_default
+} from "./chunk-ZRORQ2WH.js";
+
+// core/use-window-event/use-window-event.ts
+import { useEffect } from "react";
+var useWindowEvent = (type, listener, options) => {
+  const latest = use_latest_default(listener);
+  useEffect(() => {
+    const handler = (event) => latest.current(event);
+    window.addEventListener(type, handler, options);
+    return () => window.removeEventListener(type, handler, options);
+  }, [type, options, latest]);
+};
+var use_window_event_default = useWindowEvent;
+
+// core/use-window-event/index.ts
+var use_window_event_default2 = use_window_event_default;
+
+export {
+  use_window_event_default2 as use_window_event_default
+};

package/esm/chunk-VSSO6Y76.js

@@ -0,0 +1,32 @@
+// core/use-fullscreen/use-fullscreen.ts
+import { useCallback, useEffect, useRef, useState } from "react";
+var useFullscreen = () => {
+  const ref = useRef(null);
+  const [fullscreen, setFullscreen] = useState(false);
+  useEffect(() => {
+    const update = () => setFullscreen(Boolean(document.fullscreenElement));
+    document.addEventListener("fullscreenchange", update);
+    return () => document.removeEventListener("fullscreenchange", update);
+  }, []);
+  const enter = useCallback(async () => {
+    var _a, _b;
+    const node = (_a = ref.current) != null ? _a : document.documentElement;
+    await ((_b = node.requestFullscreen) == null ? void 0 : _b.call(node));
+  }, []);
+  const exit = useCallback(async () => {
+    if (document.fullscreenElement) await document.exitFullscreen();
+  }, []);
+  const toggle = useCallback(
+    () => document.fullscreenElement ? exit() : enter(),
+    [enter, exit]
+  );
+  return { ref, fullscreen, enter, exit, toggle };
+};
+var use_fullscreen_default = useFullscreen;
+
+// core/use-fullscreen/index.ts
+var use_fullscreen_default2 = use_fullscreen_default;
+
+export {
+  use_fullscreen_default2 as use_fullscreen_default
+};

package/esm/chunk-VUMACSU5.js

@@ -0,0 +1,29 @@
+// core/use-validated-state/use-validated-state.ts
+import { useState } from "react";
+var useValidatedState = (initialValue, validate) => {
+  const [state, setState] = useState(() => {
+    const valid = validate(initialValue);
+    return {
+      value: initialValue,
+      lastValidValue: valid ? initialValue : void 0,
+      valid
+    };
+  });
+  const onChange = (value) => {
+    const valid = validate(value);
+    setState((current) => ({
+      value,
+      lastValidValue: valid ? value : current.lastValidValue,
+      valid
+    }));
+  };
+  return [state, onChange];
+};
+var use_validated_state_default = useValidatedState;
+
+// core/use-validated-state/index.ts
+var use_validated_state_default2 = use_validated_state_default;
+
+export {
+  use_validated_state_default2 as use_validated_state_default
+};

package/esm/{chunk-IL7L3BEL.js → chunk-VXXNERDY.js}

@@ -9,20 +9,20 @@ import {
 } from "./chunk-LDTDMDE6.js";
 import {
   use_portal_default
-} from "./chunk-BXDUHMWS.js";
+} from "./chunk-S5PYSYVR.js";
 import {
   use_latest_default
 } from "./chunk-ZRORQ2WH.js";
-import {
-  getVariantColors,
-  isSemanticColorType
-} from "./chunk-GJZT47MP.js";
 import {
   use_click_away_default
 } from "./chunk-DGXZP4VJ.js";
 import {
   getSurface
 } from "./chunk-EUYSKHRS.js";
+import {
+  getVariantColors,
+  isSemanticColorType
+} from "./chunk-Q4FDY7EJ.js";
 import {
   use_scale_default,
   with_scale_default
@@ -46,12 +46,7 @@ import React3, {
 } from "react";
 
 // core/Tooltip/TooltipContent.tsx
-import {
-  useEffect,
-  useMemo as useMemo2,
-  useRef,
-  useState
-} from "react";
+import { useEffect, useMemo as useMemo2, useRef, useState } from "react";
 import { createPortal } from "react-dom";
 
 // core/Tooltip/styles.ts

package/esm/{chunk-FLUNRVVG.js → chunk-VZNIINQP.js}

@@ -1,12 +1,15 @@
 import {
   dropdown_default
-} from "./chunk-WCTANCLG.js";
+} from "./chunk-ROBEGHM5.js";
 import {
   use_click_away_default
 } from "./chunk-DGXZP4VJ.js";
 import {
   getSurface
 } from "./chunk-EUYSKHRS.js";
+import {
+  mixWithPage
+} from "./chunk-Q4FDY7EJ.js";
 import {
   use_scale_default,
   with_scale_default
@@ -323,12 +326,13 @@ var MenuItemBase = React4.forwardRef(
       if (document.activeElement !== event.currentTarget)
         event.currentTarget.focus();
     };
+    const dark = theme.type === "dark";
     const itemStyle = {
       "--menu-item-color": theme.palette.foreground,
       "--menu-item-focus-bg": getSurface(theme).hover,
       "--menu-item-error-color": theme.palette.error,
-      "--menu-item-error-focus-bg": theme.palette.errorLight,
-      "--menu-item-error-focus-color": theme.palette.errorDark,
+      "--menu-item-error-focus-bg": dark ? mixWithPage(theme.palette, theme.palette.error, 14) : theme.palette.errorLight,
+      "--menu-item-error-focus-color": dark ? theme.palette.error : theme.palette.errorDark,
       "--menu-item-disabled-color": theme.palette.accents_4,
       "--menu-item-shortcut-color": theme.palette.accents_5,
       ...style

package/esm/{chunk-A2NLRQ55.js → chunk-WCZ6YRFN.js}

@@ -1,6 +1,6 @@
 import {
   addColorAlpha
-} from "./chunk-RZBEZ26A.js";
+} from "./chunk-SELOBD66.js";
 import {
   use_scale_default,
   with_scale_default

package/esm/chunk-WD7HJTRQ.js

@@ -0,0 +1,40 @@
+import {
+  use_latest_default
+} from "./chunk-ZRORQ2WH.js";
+
+// core/use-state-history/use-state-history.ts
+import { useMemo, useState } from "react";
+var useStateHistory = (initialValue) => {
+  const initial = use_latest_default(initialValue);
+  const [state, setState] = useState({
+    history: [initialValue],
+    current: 0
+  });
+  const handlers = useMemo(
+    () => ({
+      set: (value) => setState(({ history, current }) => {
+        const next = [...history.slice(0, current + 1), value];
+        return { history: next, current: next.length - 1 };
+      }),
+      back: (steps = 1) => setState(({ history, current }) => ({
+        history,
+        current: Math.max(0, current - steps)
+      })),
+      forward: (steps = 1) => setState(({ history, current }) => ({
+        history,
+        current: Math.min(history.length - 1, current + steps)
+      })),
+      reset: () => setState({ history: [initial.current], current: 0 })
+    }),
+    [initial]
+  );
+  return [state.history[state.current], handlers, state];
+};
+var use_state_history_default = useStateHistory;
+
+// core/use-state-history/index.ts
+var use_state_history_default2 = use_state_history_default;
+
+export {
+  use_state_history_default2 as use_state_history_default
+};

package/esm/chunk-WPDNBQYS.js

@@ -0,0 +1,27 @@
+// core/use-counter/use-counter.ts
+import { useCallback, useMemo, useState } from "react";
+var useCounter = (initialValue = 0, { min, max } = {}) => {
+  const clamp = useCallback(
+    (value) => Math.min(Math.max(value, min != null ? min : -Infinity), max != null ? max : Infinity),
+    [min, max]
+  );
+  const [count, setCount] = useState(() => clamp(initialValue));
+  const handlers = useMemo(
+    () => ({
+      increment: () => setCount((current) => clamp(current + 1)),
+      decrement: () => setCount((current) => clamp(current - 1)),
+      set: (value) => setCount(clamp(value)),
+      reset: () => setCount(clamp(initialValue))
+    }),
+    [clamp, initialValue]
+  );
+  return [count, handlers];
+};
+var use_counter_default = useCounter;
+
+// core/use-counter/index.ts
+var use_counter_default2 = use_counter_default;
+
+export {
+  use_counter_default2 as use_counter_default
+};

package/esm/chunk-WXUMV5TD.js

@@ -0,0 +1,178 @@
+import {
+  use_latest_default
+} from "./chunk-ZRORQ2WH.js";
+import {
+  isMac
+} from "./chunk-UX2B3G6U.js";
+
+// core/use-keyboard/codes.ts
+var KeyCode = {
+  Unknown: 0,
+  Backspace: 8,
+  Tab: 9,
+  Enter: 13,
+  Shift: 16,
+  Ctrl: 17,
+  Alt: 18,
+  PauseBreak: 19,
+  CapsLock: 20,
+  Escape: 27,
+  Space: 32,
+  PageUp: 33,
+  PageDown: 34,
+  End: 35,
+  Home: 36,
+  LeftArrow: 37,
+  UpArrow: 38,
+  RightArrow: 39,
+  DownArrow: 40,
+  Insert: 45,
+  Delete: 46,
+  KEY_0: 48,
+  KEY_1: 49,
+  KEY_2: 50,
+  KEY_3: 51,
+  KEY_4: 52,
+  KEY_5: 53,
+  KEY_6: 54,
+  KEY_7: 55,
+  KEY_8: 56,
+  KEY_9: 57,
+  KEY_A: 65,
+  KEY_B: 66,
+  KEY_C: 67,
+  KEY_D: 68,
+  KEY_E: 69,
+  KEY_F: 70,
+  KEY_G: 71,
+  KEY_H: 72,
+  KEY_I: 73,
+  KEY_J: 74,
+  KEY_K: 75,
+  KEY_L: 76,
+  KEY_M: 77,
+  KEY_N: 78,
+  KEY_O: 79,
+  KEY_P: 80,
+  KEY_Q: 81,
+  KEY_R: 82,
+  KEY_S: 83,
+  KEY_T: 84,
+  KEY_U: 85,
+  KEY_V: 86,
+  KEY_W: 87,
+  KEY_X: 88,
+  KEY_Y: 89,
+  KEY_Z: 90,
+  Meta: 91,
+  F1: 112,
+  F2: 113,
+  F3: 114,
+  F4: 115,
+  F5: 116,
+  F6: 117,
+  F7: 118,
+  F8: 119,
+  F9: 120,
+  F10: 121,
+  F11: 122,
+  F12: 123,
+  NumLock: 144,
+  ScrollLock: 145,
+  Equal: 187,
+  Minus: 189,
+  Backquote: 192,
+  Backslash: 220
+};
+var KeyMod = {
+  CtrlCmd: 1 << 11 >>> 0,
+  Shift: 1 << 10 >>> 0,
+  Alt: 1 << 9 >>> 0,
+  WinCtrl: 1 << 8 >>> 0
+};
+
+// core/use-keyboard/use-keyboard.ts
+import { useEffect } from "react";
+
+// core/use-keyboard/helper.ts
+var getCtrlKeysByPlatform = () => {
+  return {
+    CtrlCmd: isMac() ? "metaKey" : "ctrlKey",
+    WinCtrl: isMac() ? "ctrlKey" : "metaKey"
+  };
+};
+var getActiveModMap = (bindings) => ({
+  CtrlCmd: bindings.includes(KeyMod.CtrlCmd),
+  Shift: bindings.includes(KeyMod.Shift),
+  Alt: bindings.includes(KeyMod.Alt),
+  WinCtrl: bindings.includes(KeyMod.WinCtrl)
+});
+
+// core/use-keyboard/use-keyboard.ts
+var useKeyboard = (handler, keyBindings, options = {}) => {
+  const bindings = Array.isArray(keyBindings) ? keyBindings : [keyBindings];
+  const {
+    disableGlobalEvent = false,
+    capture = false,
+    stopPropagation = false,
+    preventDefault = true,
+    event = "keydown"
+  } = options;
+  const activeModMap = getActiveModMap(bindings);
+  const keyCode = bindings.filter(
+    (item) => !Object.values(KeyMod).includes(item)
+  );
+  const { CtrlCmd, WinCtrl } = getCtrlKeysByPlatform();
+  const eventHandler = (event2) => {
+    if (activeModMap.Shift && !event2.shiftKey) return;
+    if (activeModMap.Alt && !event2.altKey) return;
+    if (activeModMap.CtrlCmd && !event2[CtrlCmd]) return;
+    if (activeModMap.WinCtrl && !event2[WinCtrl]) return;
+    const hitOne = keyCode.find((k) => k === event2.keyCode);
+    if (keyCode && !hitOne) return;
+    if (stopPropagation) {
+      event2.stopPropagation();
+    }
+    if (preventDefault) {
+      event2.preventDefault();
+    }
+    if (handler) handler(event2);
+  };
+  const latest = use_latest_default(eventHandler);
+  useEffect(() => {
+    const listener = (e) => latest.current(e);
+    if (!disableGlobalEvent) {
+      document.addEventListener(event, listener);
+    }
+    return () => {
+      document.removeEventListener(event, listener);
+    };
+  }, [disableGlobalEvent, event, latest]);
+  const elementBindingHandler = (elementEventType, isCapture = false) => {
+    if (elementEventType !== event) return () => {
+    };
+    if (isCapture !== capture) return () => {
+    };
+    return (e) => eventHandler(e);
+  };
+  return {
+    bindings: {
+      onKeyDown: elementBindingHandler("keydown"),
+      onKeyDownCapture: elementBindingHandler("keydown", true),
+      onKeyPress: elementBindingHandler("keypress"),
+      onKeyPressCapture: elementBindingHandler("keypress", true),
+      onKeyUp: elementBindingHandler("keyup"),
+      onKeyUpCapture: elementBindingHandler("keyup", true)
+    }
+  };
+};
+var use_keyboard_default = useKeyboard;
+
+// core/use-keyboard/index.ts
+var use_keyboard_default2 = use_keyboard_default;
+
+export {
+  KeyCode,
+  KeyMod,
+  use_keyboard_default2 as use_keyboard_default
+};

package/esm/{chunk-EEZG4FGY.js → chunk-XB3GY5TL.js}

@@ -1,9 +1,12 @@
+import {
+  activateOnKey
+} from "./chunk-YTIXCWZO.js";
 import {
   Link_default
-} from "./chunk-WEYAL53O.js";
+} from "./chunk-TZ6SF6CO.js";
 import {
   addColorAlpha
-} from "./chunk-RZBEZ26A.js";
+} from "./chunk-SELOBD66.js";
 import {
   use_scale_default,
   with_scale_default
@@ -114,7 +117,15 @@ var BreadcrumbsItem = React2.forwardRef(
       if (onClick) onClick(event);
     };
     if (!isLink) {
-      return /* @__PURE__ */ jsx3("span", { className: classes, onClick: clickHandler, children: withoutSepChildren });
+      return /* @__PURE__ */ jsx3(
+        "span",
+        {
+          className: classes,
+          onClick: clickHandler,
+          ...onClick ? { role: "button", tabIndex: 0, onKeyDown: activateOnKey } : {},
+          children: withoutSepChildren
+        }
+      );
     }
     return /* @__PURE__ */ jsx3(
       Link_default,

package/esm/{chunk-6U7FXFJP.js → chunk-XI7N2LKD.js}

@@ -1,3 +1,6 @@
+import {
+  use_previous_default
+} from "./chunk-45Y5OGFM.js";
 import {
   isUnplacedRect,
   useRect
@@ -17,12 +20,7 @@ import {
 } from "./chunk-5KUROAEP.js";
 
 // core/Tabs/Tabs.tsx
-import React4, {
-  useEffect as useEffect3,
-  useMemo as useMemo3,
-  useRef as useRef4,
-  useState
-} from "react";
+import React4, { useEffect as useEffect2, useMemo as useMemo3, useRef as useRef3, useState } from "react";
 
 // core/Tabs/TabsContext.ts
 import React from "react";
@@ -33,20 +31,7 @@ var TabsContext = React.createContext(defaultContext);
 var useTabsContext = () => React.useContext(TabsContext);
 
 // core/Shared/highlight.tsx
-import { useMemo, useRef as useRef2 } from "react";
-
-// core/utils/use-previous.ts
-import { useEffect, useRef } from "react";
-var usePrevious = (state) => {
-  const ref = useRef(null);
-  useEffect(() => {
-    ref.current = state;
-  });
-  return ref ? ref.current : null;
-};
-var use_previous_default = usePrevious;
-
-// core/Shared/highlight.tsx
+import { useMemo, useRef } from "react";
 import { jsx } from "react/jsx-runtime";
 var Highlight = ({
   rect,
@@ -59,7 +44,7 @@ var Highlight = ({
   ...props
 }) => {
   const theme = use_theme_default();
-  const ref = useRef2(null);
+  const ref = useRef(null);
   const isFirstVisible = use_previous_default(isUnplacedRect(rect));
   const position = useMemo(() => {
     const width = rect.width * hoverWidthRatio;
@@ -98,7 +83,7 @@ var Highlight = ({
 var highlight_default = Highlight;
 
 // core/Tabs/TabsItem.tsx
-import { useEffect as useEffect2, useMemo as useMemo2, useRef as useRef3 } from "react";
+import { useEffect, useMemo as useMemo2, useRef as useRef2 } from "react";
 
 // css-module-source:/Users/brunnoandrade/Desktop/BolioUI/bolio-ui/core/Tabs/TabsItem.module.css.bolio-css-module-source
 var TabsItem_module_css_default = { "tab": "TabsItem-module_tab__uI-6R", "active": "TabsItem-module_active__BWQaR", "disabled": "TabsItem-module_disabled__C3bbH", "hideBorder": "TabsItem-module_hideBorder__JBKMA" };
@@ -117,7 +102,7 @@ function TabsItemCellComponent({
 }) {
   const theme = use_theme_default();
   const { SCALES } = use_scale_default();
-  const ref = useRef3(null);
+  const ref = useRef2(null);
   const { currentValue } = useTabsContext();
   const active = currentValue === value;
   const classes = use_classes_default(
@@ -209,7 +194,7 @@ function TabsItemComponent({
   const { register, currentValue, directValues } = useTabsContext();
   const isActive = useMemo2(() => currentValue === value, [currentValue, value]);
   const isDirect = Boolean(directValues == null ? void 0 : directValues.includes(value));
-  useEffect2(() => {
+  useEffect(() => {
     if (isDirect || !register) return;
     register({
       value,
@@ -261,8 +246,8 @@ var TabsComponent = React4.forwardRef(
     const [selfValue, setSelfValue] = useState(
       userCustomInitialValue
     );
-    const headerRef = useRef4(null);
-    const listRef = useRef4(null);
+    const headerRef = useRef3(null);
+    const listRef = useRef3(null);
     const [indicator, setIndicator] = useState(null);
     const [displayHighlight, setDisplayHighlight] = useState(false);
     const { rect, setRect } = useRect();
@@ -297,11 +282,11 @@ var TabsComponent = React4.forwardRef(
       // eslint-disable-next-line react-hooks/exhaustive-deps
       [selfValue, leftSpace, directKey]
     );
-    useEffect3(() => {
+    useEffect2(() => {
       if (typeof value === "undefined") return;
       setSelfValue(value);
     }, [value]);
-    useEffect3(() => {
+    useEffect2(() => {
       var _a;
       if (!slide) return;
       const active = (_a = listRef.current) == null ? void 0 : _a.querySelector(

package/esm/chunk-XTRGAC3F.js

@@ -0,0 +1,11 @@
+// core/use-isomorphic-effect/use-isomorphic-effect.ts
+import { useEffect, useLayoutEffect } from "react";
+var useIsomorphicEffect = typeof document !== "undefined" ? useLayoutEffect : useEffect;
+var use_isomorphic_effect_default = useIsomorphicEffect;
+
+// core/use-isomorphic-effect/index.ts
+var use_isomorphic_effect_default2 = use_isomorphic_effect_default;
+
+export {
+  use_isomorphic_effect_default2 as use_isomorphic_effect_default
+};

package/esm/chunk-Y6DIYKCE.js

@@ -0,0 +1,43 @@
+import {
+  use_latest_default
+} from "./chunk-ZRORQ2WH.js";
+
+// core/use-throttled-callback/use-throttled-callback.ts
+import { useEffect, useMemo, useRef } from "react";
+var useThrottledCallback = (callback, wait) => {
+  const latest = use_latest_default(callback);
+  const lastRun = useRef(0);
+  const lastArgs = useRef(void 0);
+  const timer = useRef(void 0);
+  useEffect(() => () => clearTimeout(timer.current), []);
+  return useMemo(() => {
+    const run = () => {
+      timer.current = void 0;
+      lastRun.current = Date.now();
+      if (lastArgs.current) latest.current(...lastArgs.current);
+    };
+    const throttled = (...args) => {
+      lastArgs.current = args;
+      const remaining = wait - (Date.now() - lastRun.current);
+      if (remaining <= 0) {
+        clearTimeout(timer.current);
+        run();
+      } else if (timer.current === void 0) {
+        timer.current = setTimeout(run, remaining);
+      }
+    };
+    throttled.cancel = () => {
+      clearTimeout(timer.current);
+      timer.current = void 0;
+    };
+    return throttled;
+  }, [latest, wait]);
+};
+var use_throttled_callback_default = useThrottledCallback;
+
+// core/use-throttled-callback/index.ts
+var use_throttled_callback_default2 = use_throttled_callback_default;
+
+export {
+  use_throttled_callback_default2 as use_throttled_callback_default
+};