@bolio-ui/core 2.0.0-alpha.0 → 2.0.0-alpha.2

package/esm/chunk-EZILJ6TJ.js

@@ -0,0 +1,133 @@
+import {
+  use_scale_default,
+  with_scale_default
+} from "./chunk-S62PPQHN.js";
+import {
+  use_theme_default
+} from "./chunk-45MVPPJN.js";
+import {
+  joinClasses,
+  use_classes_default
+} from "./chunk-5KUROAEP.js";
+
+// core/Rating/Rating.tsx
+import _JSXStyle from "styled-jsx/style";
+import React, { useEffect, useMemo, useState } from "react";
+
+// core/Rating/RatingIcon.tsx
+import { jsx } from "react/jsx-runtime";
+function RatingIcon() {
+  return /* @__PURE__ */ jsx(
+    "svg",
+    {
+      viewBox: "0 0 24 24",
+      width: "24",
+      height: "24",
+      stroke: "currentColor",
+      strokeWidth: "1.5",
+      strokeLinecap: "round",
+      strokeLinejoin: "round",
+      fill: "none",
+      shapeRendering: "geometricPrecision",
+      children: /* @__PURE__ */ jsx("path", { d: "M12 2l3.09 6.26L22 9.27l-5 4.87 1.18 6.88L12 17.77l-6.18 3.25L7 14.14 2 9.27l6.91-1.01L12 2z" })
+    }
+  );
+}
+RatingIcon.displayName = "BolioUIRatingIcon";
+var RatingIcon_default = RatingIcon;
+
+// core/Rating/Rating.tsx
+import { jsx as jsx2, jsxs } from "react/jsx-runtime";
+var getColor = (type, palette) => {
+  const colors = {
+    default: palette.accents_6,
+    primary: palette.primary,
+    secondary: palette.secondary,
+    success: palette.success,
+    warning: palette.warning,
+    error: palette.error,
+    info: palette.info
+  };
+  return colors[type] || colors.default;
+};
+var RatingComponent = React.forwardRef(({
+  type = "default",
+  className = "",
+  icon = /* @__PURE__ */ jsx2(RatingIcon_default, {}),
+  count = 5,
+  value: customValue,
+  initialValue = 1,
+  onValueChange,
+  locked = false,
+  onLockedChange,
+  ...props
+}, ref) => {
+  const theme = use_theme_default();
+  const {
+    SCALES
+  } = use_scale_default();
+  const color = useMemo(() => getColor(type, theme.palette), [type, theme.palette]);
+  const [value, setValue] = useState(initialValue);
+  const [isLocked, setIsLocked] = useState(locked);
+  const lockedChangeHandler = (next) => {
+    setIsLocked(next);
+    if (onLockedChange) onLockedChange(next);
+  };
+  const valueChangeHandler = (next) => {
+    setValue(next);
+    const emitValue = next > count ? count : next;
+    if (onValueChange) onValueChange(emitValue);
+  };
+  const clickHandler = (index) => {
+    if (isLocked) return lockedChangeHandler(false);
+    valueChangeHandler(index);
+    lockedChangeHandler(true);
+  };
+  const mouseEnterHandler = (index) => {
+    if (isLocked) return;
+    valueChangeHandler(index);
+  };
+  const focusIndex = value >= 1 && value <= count ? value : 1;
+  const keyDownHandler = (event, index) => {
+    var _a, _b;
+    const nextByKey = {
+      ArrowRight: index + 1,
+      ArrowUp: index + 1,
+      ArrowLeft: index - 1,
+      ArrowDown: index - 1,
+      Home: 1,
+      End: count
+    };
+    if (event.key === "Enter" || event.key === " ") {
+      event.preventDefault();
+      return clickHandler(index);
+    }
+    if (!(event.key in nextByKey)) return;
+    event.preventDefault();
+    const next = Math.min(Math.max(nextByKey[event.key], 1), count);
+    valueChangeHandler(next);
+    lockedChangeHandler(true);
+    const radios = (_a = event.currentTarget.parentElement) == null ? void 0 : _a.querySelectorAll('[role="radio"]');
+    (_b = radios == null ? void 0 : radios[next - 1]) == null ? void 0 : _b.focus();
+  };
+  useEffect(() => {
+    if (typeof customValue === "undefined") return;
+    setValue(customValue < 0 ? 0 : customValue);
+  }, [customValue]);
+  return /* @__PURE__ */ jsxs("div", { ref, role: "radiogroup", ...props, className: _JSXStyle.dynamic([["2099255611", [SCALES.font(1), SCALES.width(1, "auto"), SCALES.height(1, "auto"), SCALES.pt(0), SCALES.pr(0), SCALES.pb(0), SCALES.pl(0), SCALES.mt(0), SCALES.mr(0), SCALES.mb(0), SCALES.ml(0), color, isLocked ? "default" : "pointer", color]]]) + " " + (props && props.className != null && props.className || use_classes_default("rating", className) || ""), children: [
+    [...Array(count)].map((_, index) => /* @__PURE__ */ jsx2("div", { role: "radio", "aria-checked": index + 1 === value, "aria-label": `${index + 1} of ${count}`, tabIndex: index + 1 === focusIndex ? 0 : -1, onKeyDown: (event) => keyDownHandler(event, index + 1), onMouseEnter: () => mouseEnterHandler(index + 1), onClick: () => clickHandler(index + 1), className: _JSXStyle.dynamic([["2099255611", [SCALES.font(1), SCALES.width(1, "auto"), SCALES.height(1, "auto"), SCALES.pt(0), SCALES.pr(0), SCALES.pb(0), SCALES.pl(0), SCALES.mt(0), SCALES.mr(0), SCALES.mb(0), SCALES.ml(0), color, isLocked ? "default" : "pointer", color]]]) + " " + (joinClasses("icon-box", {
+      hovered: index + 1 <= value
+    }) || ""), children: icon }, index)),
+    /* @__PURE__ */ jsx2(_JSXStyle, { id: "2099255611", dynamic: [SCALES.font(1), SCALES.width(1, "auto"), SCALES.height(1, "auto"), SCALES.pt(0), SCALES.pr(0), SCALES.pb(0), SCALES.pl(0), SCALES.mt(0), SCALES.mr(0), SCALES.mb(0), SCALES.ml(0), color, isLocked ? "default" : "pointer", color], children: `.rating.__jsx-style-dynamic-selector{box-sizing:border-box;display:-webkit-inline-box;display:-webkit-inline-flex;display:-ms-inline-flexbox;display:inline-flex;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;--rating-font-size:${SCALES.font(1)};font-size:var(--rating-font-size);width:${SCALES.width(1, "auto")};height:${SCALES.height(1, "auto")};padding:${SCALES.pt(0)} ${SCALES.pr(0)} ${SCALES.pb(0)} ${SCALES.pl(0)};margin:${SCALES.mt(0)} ${SCALES.mr(0)} ${SCALES.mb(0)} ${SCALES.ml(0)};}.icon-box.__jsx-style-dynamic-selector{box-sizing:border-box;color:${color};width:calc(var(--rating-font-size) * 1.5);height:calc(var(--rating-font-size) * 1.5);margin-right:calc(var(--rating-font-size) * 1 / 5);cursor:${isLocked ? "default" : "pointer"};}.icon-box.__jsx-style-dynamic-selector svg{width:100%;height:100%;fill:transparent;-webkit-transform:scale(1);-ms-transform:scale(1);transform:scale(1);-webkit-transition: -webkit-transform, color, fill 30ms linear;-webkit-transition: transform, color, fill 30ms linear;transition: transform, color, fill 30ms linear;}.hovered.__jsx-style-dynamic-selector svg{fill:${color};-webkit-transform:scale(0.9);-ms-transform:scale(0.9);transform:scale(0.9);}` })
+  ] });
+});
+RatingComponent.displayName = "BolioUIRating";
+var Rating = with_scale_default(RatingComponent);
+var Rating_default = Rating;
+
+// core/Rating/index.ts
+var Rating_default2 = Rating_default;
+
+export {
+  Rating_default2 as Rating_default
+};

package/esm/chunk-F3AL4TQZ.js

@@ -0,0 +1,186 @@
+import {
+  use_latest_default
+} from "./chunk-ZRORQ2WH.js";
+import {
+  isMac
+} from "./chunk-UX2B3G6U.js";
+
+// core/use-keyboard/codes.ts
+var KeyCode = /* @__PURE__ */ ((KeyCode2) => {
+  KeyCode2[KeyCode2["Unknown"] = 0] = "Unknown";
+  KeyCode2[KeyCode2["Backspace"] = 8] = "Backspace";
+  KeyCode2[KeyCode2["Tab"] = 9] = "Tab";
+  KeyCode2[KeyCode2["Enter"] = 13] = "Enter";
+  KeyCode2[KeyCode2["Shift"] = 16] = "Shift";
+  KeyCode2[KeyCode2["Ctrl"] = 17] = "Ctrl";
+  KeyCode2[KeyCode2["Alt"] = 18] = "Alt";
+  KeyCode2[KeyCode2["PauseBreak"] = 19] = "PauseBreak";
+  KeyCode2[KeyCode2["CapsLock"] = 20] = "CapsLock";
+  KeyCode2[KeyCode2["Escape"] = 27] = "Escape";
+  KeyCode2[KeyCode2["Space"] = 32] = "Space";
+  KeyCode2[KeyCode2["PageUp"] = 33] = "PageUp";
+  KeyCode2[KeyCode2["PageDown"] = 34] = "PageDown";
+  KeyCode2[KeyCode2["End"] = 35] = "End";
+  KeyCode2[KeyCode2["Home"] = 36] = "Home";
+  KeyCode2[KeyCode2["LeftArrow"] = 37] = "LeftArrow";
+  KeyCode2[KeyCode2["UpArrow"] = 38] = "UpArrow";
+  KeyCode2[KeyCode2["RightArrow"] = 39] = "RightArrow";
+  KeyCode2[KeyCode2["DownArrow"] = 40] = "DownArrow";
+  KeyCode2[KeyCode2["Insert"] = 45] = "Insert";
+  KeyCode2[KeyCode2["Delete"] = 46] = "Delete";
+  KeyCode2[KeyCode2["KEY_0"] = 48] = "KEY_0";
+  KeyCode2[KeyCode2["KEY_1"] = 49] = "KEY_1";
+  KeyCode2[KeyCode2["KEY_2"] = 50] = "KEY_2";
+  KeyCode2[KeyCode2["KEY_3"] = 51] = "KEY_3";
+  KeyCode2[KeyCode2["KEY_4"] = 52] = "KEY_4";
+  KeyCode2[KeyCode2["KEY_5"] = 53] = "KEY_5";
+  KeyCode2[KeyCode2["KEY_6"] = 54] = "KEY_6";
+  KeyCode2[KeyCode2["KEY_7"] = 55] = "KEY_7";
+  KeyCode2[KeyCode2["KEY_8"] = 56] = "KEY_8";
+  KeyCode2[KeyCode2["KEY_9"] = 57] = "KEY_9";
+  KeyCode2[KeyCode2["KEY_A"] = 65] = "KEY_A";
+  KeyCode2[KeyCode2["KEY_B"] = 66] = "KEY_B";
+  KeyCode2[KeyCode2["KEY_C"] = 67] = "KEY_C";
+  KeyCode2[KeyCode2["KEY_D"] = 68] = "KEY_D";
+  KeyCode2[KeyCode2["KEY_E"] = 69] = "KEY_E";
+  KeyCode2[KeyCode2["KEY_F"] = 70] = "KEY_F";
+  KeyCode2[KeyCode2["KEY_G"] = 71] = "KEY_G";
+  KeyCode2[KeyCode2["KEY_H"] = 72] = "KEY_H";
+  KeyCode2[KeyCode2["KEY_I"] = 73] = "KEY_I";
+  KeyCode2[KeyCode2["KEY_J"] = 74] = "KEY_J";
+  KeyCode2[KeyCode2["KEY_K"] = 75] = "KEY_K";
+  KeyCode2[KeyCode2["KEY_L"] = 76] = "KEY_L";
+  KeyCode2[KeyCode2["KEY_M"] = 77] = "KEY_M";
+  KeyCode2[KeyCode2["KEY_N"] = 78] = "KEY_N";
+  KeyCode2[KeyCode2["KEY_O"] = 79] = "KEY_O";
+  KeyCode2[KeyCode2["KEY_P"] = 80] = "KEY_P";
+  KeyCode2[KeyCode2["KEY_Q"] = 81] = "KEY_Q";
+  KeyCode2[KeyCode2["KEY_R"] = 82] = "KEY_R";
+  KeyCode2[KeyCode2["KEY_S"] = 83] = "KEY_S";
+  KeyCode2[KeyCode2["KEY_T"] = 84] = "KEY_T";
+  KeyCode2[KeyCode2["KEY_U"] = 85] = "KEY_U";
+  KeyCode2[KeyCode2["KEY_V"] = 86] = "KEY_V";
+  KeyCode2[KeyCode2["KEY_W"] = 87] = "KEY_W";
+  KeyCode2[KeyCode2["KEY_X"] = 88] = "KEY_X";
+  KeyCode2[KeyCode2["KEY_Y"] = 89] = "KEY_Y";
+  KeyCode2[KeyCode2["KEY_Z"] = 90] = "KEY_Z";
+  KeyCode2[KeyCode2["Meta"] = 91] = "Meta";
+  KeyCode2[KeyCode2["F1"] = 112] = "F1";
+  KeyCode2[KeyCode2["F2"] = 113] = "F2";
+  KeyCode2[KeyCode2["F3"] = 114] = "F3";
+  KeyCode2[KeyCode2["F4"] = 115] = "F4";
+  KeyCode2[KeyCode2["F5"] = 116] = "F5";
+  KeyCode2[KeyCode2["F6"] = 117] = "F6";
+  KeyCode2[KeyCode2["F7"] = 118] = "F7";
+  KeyCode2[KeyCode2["F8"] = 119] = "F8";
+  KeyCode2[KeyCode2["F9"] = 120] = "F9";
+  KeyCode2[KeyCode2["F10"] = 121] = "F10";
+  KeyCode2[KeyCode2["F11"] = 122] = "F11";
+  KeyCode2[KeyCode2["F12"] = 123] = "F12";
+  KeyCode2[KeyCode2["NumLock"] = 144] = "NumLock";
+  KeyCode2[KeyCode2["ScrollLock"] = 145] = "ScrollLock";
+  KeyCode2[KeyCode2["Equal"] = 187] = "Equal";
+  KeyCode2[KeyCode2["Minus"] = 189] = "Minus";
+  KeyCode2[KeyCode2["Backquote"] = 192] = "Backquote";
+  KeyCode2[KeyCode2["Backslash"] = 220] = "Backslash";
+  return KeyCode2;
+})(KeyCode || {});
+var KeyMod = /* @__PURE__ */ ((KeyMod2) => {
+  KeyMod2[KeyMod2["CtrlCmd"] = 2048] = "CtrlCmd";
+  KeyMod2[KeyMod2["Shift"] = 1024] = "Shift";
+  KeyMod2[KeyMod2["Alt"] = 512] = "Alt";
+  KeyMod2[KeyMod2["WinCtrl"] = 256] = "WinCtrl";
+  return KeyMod2;
+})(KeyMod || {});
+
+// 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) => {
+  const modBindings = bindings.filter((item) => !!KeyMod[item]);
+  const activeModMap = {
+    CtrlCmd: false,
+    Shift: false,
+    Alt: false,
+    WinCtrl: false
+  };
+  modBindings.forEach((code) => {
+    const modKey = KeyMod[code];
+    activeModMap[modKey] = true;
+  });
+  return activeModMap;
+};
+
+// 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) => !KeyMod[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-F5ENWFJU.js

@@ -0,0 +1,273 @@
+import {
+  use_current_state_default
+} from "./chunk-33BUV2RX.js";
+import {
+  addColorAlpha
+} from "./chunk-RZBEZ26A.js";
+import {
+  use_scale_default,
+  with_scale_default
+} from "./chunk-S62PPQHN.js";
+import {
+  pickChild
+} from "./chunk-UX2B3G6U.js";
+import {
+  use_theme_default
+} from "./chunk-45MVPPJN.js";
+import {
+  use_classes_default
+} from "./chunk-5KUROAEP.js";
+
+// core/Pagination/Pagination.tsx
+import _JSXStyle3 from "styled-jsx/style";
+import React5, { useCallback as useCallback2, useEffect, useMemo as useMemo3 } from "react";
+
+// core/Pagination/PaginationItem.tsx
+import _JSXStyle from "styled-jsx/style";
+import { useMemo } from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+function PaginationItem({
+  active,
+  children,
+  disabled,
+  onClick,
+  ...props
+}) {
+  const theme = use_theme_default();
+  const [hover, activeHover] = useMemo(() => [addColorAlpha(theme.palette.primary, 0.1), addColorAlpha(theme.palette.primary, 0.8)], [theme.palette.primary]);
+  const classes = use_classes_default({
+    active,
+    disabled
+  });
+  const clickHandler = (event) => {
+    if (disabled) return;
+    if (onClick) onClick(event);
+  };
+  return /* @__PURE__ */ jsxs("li", { className: _JSXStyle.dynamic([["32129165", [theme.palette.primary, theme.layout.radius, theme.palette.background, hover, theme.palette.primary, theme.palette.background, theme.expressiveness.shadowSmall, activeHover, theme.expressiveness.shadowMedium, theme.palette.accents_4, theme.palette.accents_2]]]), children: [
+    /* @__PURE__ */ jsx("button", { "aria-current": active ? "page" : void 0, onClick: clickHandler, ...props, className: _JSXStyle.dynamic([["32129165", [theme.palette.primary, theme.layout.radius, theme.palette.background, hover, theme.palette.primary, theme.palette.background, theme.expressiveness.shadowSmall, activeHover, theme.expressiveness.shadowMedium, theme.palette.accents_4, theme.palette.accents_2]]]) + " " + (props && props.className != null && props.className || classes || ""), children }),
+    /* @__PURE__ */ jsx(_JSXStyle, { id: "32129165", dynamic: [theme.palette.primary, theme.layout.radius, theme.palette.background, hover, theme.palette.primary, theme.palette.background, theme.expressiveness.shadowSmall, activeHover, theme.expressiveness.shadowMedium, theme.palette.accents_4, theme.palette.accents_2], children: `li.__jsx-style-dynamic-selector{margin-right:0.428em;display:inline-block;}button.__jsx-style-dynamic-selector{border:none;display:-webkit-inline-box;display:-webkit-inline-flex;display:-ms-inline-flexbox;display:inline-flex;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-webkit-justify-content:center;-ms-flex-pack:center;justify-content:center;box-sizing:border-box;text-transform:capitalize;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;white-space:nowrap;text-align:center;vertical-align:middle;box-shadow:none;outline:none;height:var(--pagination-size);min-width:var(--pagination-size);font-size:inherit;cursor:pointer;color:${theme.palette.primary};border-radius:${theme.layout.radius};background-color:${theme.palette.background};-webkit-transition:all linear 200ms 0ms;transition:all linear 200ms 0ms;}button.__jsx-style-dynamic-selector:hover{background-color:${hover};}.active.__jsx-style-dynamic-selector{font-weight:bold;background-color:${theme.palette.primary};color:${theme.palette.background};box-shadow:${theme.expressiveness.shadowSmall};}.active.__jsx-style-dynamic-selector:hover{background-color:${activeHover};box-shadow:${theme.expressiveness.shadowMedium};}.disabled.__jsx-style-dynamic-selector{color:${theme.palette.accents_4};cursor:not-allowed;}.disabled.__jsx-style-dynamic-selector:hover{background-color:${theme.palette.accents_2};}button.__jsx-style-dynamic-selector svg{width:1.3em;height:1.3em;}` })
+  ] });
+}
+PaginationItem.displayName = "BolioUIPaginationItem";
+var PaginationItem_default = PaginationItem;
+
+// core/Pagination/PaginationContext.ts
+import React2 from "react";
+var defaultContext = {};
+var PaginationContext = React2.createContext(defaultContext);
+var usePaginationContext = () => React2.useContext(PaginationContext);
+
+// core/Pagination/PaginationPrevious.tsx
+import { jsx as jsx2 } from "react/jsx-runtime";
+function PaginationPrevious({ children, ...props }) {
+  const { update, isFirst } = usePaginationContext();
+  return /* @__PURE__ */ jsx2(
+    PaginationItem_default,
+    {
+      onClick: () => update && update("prev"),
+      disabled: isFirst,
+      ...props,
+      children
+    }
+  );
+}
+PaginationPrevious.displayName = "BolioUIPaginationPrevious";
+var PaginationPrevious_default = PaginationPrevious;
+
+// core/Pagination/PaginationNext.tsx
+import { jsx as jsx3 } from "react/jsx-runtime";
+function PaginationNext({ children, ...props }) {
+  const { update, isLast } = usePaginationContext();
+  return /* @__PURE__ */ jsx3(
+    PaginationItem_default,
+    {
+      onClick: () => update && update("next"),
+      disabled: isLast,
+      ...props,
+      children
+    }
+  );
+}
+PaginationNext.displayName = "BolioUIPaginationNext";
+var PaginationNext_default = PaginationNext;
+
+// core/Pagination/PaginationPages.tsx
+import { useCallback, useMemo as useMemo2 } from "react";
+
+// core/Pagination/PaginationEllipsis.tsx
+import _JSXStyle2 from "styled-jsx/style";
+import { useState } from "react";
+import { jsx as jsx4, jsxs as jsxs2 } from "react/jsx-runtime";
+function PaginationEllipsis({
+  isBefore,
+  onClick
+}) {
+  const [showMore, setShowMore] = useState(false);
+  return /* @__PURE__ */ jsxs2(PaginationItem_default, { onClick: (e) => onClick && onClick(e), onMouseEnter: () => setShowMore(true), onMouseLeave: () => setShowMore(false), children: [
+    showMore ? /* @__PURE__ */ jsxs2("svg", { viewBox: "0 0 24 24", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round", fill: "none", shapeRendering: "geometricPrecision", className: _JSXStyle2.dynamic([["2928474255", [isBefore ? "180deg" : "0deg"]]]) + " more", children: [
+      /* @__PURE__ */ jsx4("path", { d: "M13 17l5-5-5-5", className: _JSXStyle2.dynamic([["2928474255", [isBefore ? "180deg" : "0deg"]]]) }),
+      /* @__PURE__ */ jsx4("path", { d: "M6 17l5-5-5-5", className: _JSXStyle2.dynamic([["2928474255", [isBefore ? "180deg" : "0deg"]]]) })
+    ] }) : /* @__PURE__ */ jsxs2("svg", { viewBox: "0 0 24 24", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round", fill: "none", shapeRendering: "geometricPrecision", className: _JSXStyle2.dynamic([["2928474255", [isBefore ? "180deg" : "0deg"]]]), children: [
+      /* @__PURE__ */ jsx4("circle", { cx: "12", cy: "12", r: "1", fill: "currentColor", className: _JSXStyle2.dynamic([["2928474255", [isBefore ? "180deg" : "0deg"]]]) }),
+      /* @__PURE__ */ jsx4("circle", { cx: "19", cy: "12", r: "1", fill: "currentColor", className: _JSXStyle2.dynamic([["2928474255", [isBefore ? "180deg" : "0deg"]]]) }),
+      /* @__PURE__ */ jsx4("circle", { cx: "5", cy: "12", r: "1", fill: "currentColor", className: _JSXStyle2.dynamic([["2928474255", [isBefore ? "180deg" : "0deg"]]]) })
+    ] }),
+    /* @__PURE__ */ jsx4(_JSXStyle2, { id: "2928474255", dynamic: [isBefore ? "180deg" : "0deg"], children: `svg.__jsx-style-dynamic-selector{color:currentColor;stroke:currentColor;width:1em;height:1em;}.more.__jsx-style-dynamic-selector{-webkit-transform:rotate(${isBefore ? "180deg" : "0deg"});-ms-transform:rotate(${isBefore ? "180deg" : "0deg"});transform:rotate(${isBefore ? "180deg" : "0deg"});}` })
+  ] });
+}
+PaginationEllipsis.displayName = "BolioUIPaginationEllipsis";
+var PaginationEllipsis_default = PaginationEllipsis;
+
+// core/Pagination/PaginationPages.tsx
+import { Fragment, jsx as jsx5, jsxs as jsxs3 } from "react/jsx-runtime";
+function PaginationPages({ limit, count, current, setPage }) {
+  const showPages = useMemo2(() => {
+    const oddLimit = limit % 2 === 0 ? limit - 1 : limit;
+    return oddLimit - 2;
+  }, [limit]);
+  const middleNumber = (showPages + 1) / 2;
+  const [showBeforeEllipsis, showAfterEllipsis] = useMemo2(() => {
+    const showEllipsis = count > limit;
+    return [
+      showEllipsis && current > middleNumber + 1,
+      showEllipsis && current < count - middleNumber
+    ];
+  }, [current, middleNumber, count, limit]);
+  const pagesArray = useMemo2(() => [...new Array(showPages)], [showPages]);
+  const renderItem = useCallback(
+    (value, active) => /* @__PURE__ */ jsx5(
+      PaginationItem_default,
+      {
+        active: value === active,
+        onClick: () => setPage(value),
+        children: value
+      },
+      `pagination-item-${value}`
+    ),
+    [setPage]
+  );
+  const startPages = pagesArray.map((_, index) => {
+    const value = index + 2;
+    return renderItem(value, current);
+  });
+  const middlePages = pagesArray.map((_, index) => {
+    const middleIndexNumber = middleNumber - (index + 1);
+    const value = current - middleIndexNumber;
+    return /* @__PURE__ */ jsx5(
+      PaginationItem_default,
+      {
+        active: index + 1 === middleNumber,
+        onClick: () => setPage(value),
+        children: value
+      },
+      `pagination-middle-${index}`
+    );
+  });
+  const endPages = pagesArray.map((_, index) => {
+    const value = count - (showPages - index);
+    return renderItem(value, current);
+  });
+  if (count <= limit) {
+    return /* @__PURE__ */ jsx5(Fragment, { children: [...new Array(count)].map((_, index) => {
+      const value = index + 1;
+      return /* @__PURE__ */ jsx5(
+        PaginationItem_default,
+        {
+          active: value === current,
+          onClick: () => setPage(value),
+          children: value
+        },
+        `pagination-item-${value}`
+      );
+    }) });
+  }
+  return /* @__PURE__ */ jsxs3(Fragment, { children: [
+    renderItem(1, current),
+    showBeforeEllipsis && /* @__PURE__ */ jsx5(
+      PaginationEllipsis_default,
+      {
+        isBefore: true,
+        onClick: () => setPage((last) => last - 5 >= 1 ? last - 5 : 1)
+      },
+      "pagination-ellipsis-before"
+    ),
+    showBeforeEllipsis && showAfterEllipsis ? middlePages : showBeforeEllipsis ? endPages : startPages,
+    showAfterEllipsis && /* @__PURE__ */ jsx5(
+      PaginationEllipsis_default,
+      {
+        onClick: () => setPage((last) => last + 5 <= count ? last + 5 : count)
+      },
+      "pagination-ellipsis-after"
+    ),
+    renderItem(count, current)
+  ] });
+}
+PaginationPages.displayName = "BolioUIPaginationPages";
+var PaginationPages_default = PaginationPages;
+
+// core/Pagination/Pagination.tsx
+import { jsx as jsx6, jsxs as jsxs4 } from "react/jsx-runtime";
+var PaginationComponent = React5.forwardRef(({
+  page: customPage,
+  initialPage = 1,
+  count = 1,
+  limit = 7,
+  children,
+  onChange,
+  className = "",
+  ...props
+}, ref) => {
+  const {
+    SCALES
+  } = use_scale_default();
+  const [page, setPage, pageRef] = use_current_state_default(initialPage);
+  const [, prevChildren] = pickChild(children, PaginationPrevious_default);
+  const [, nextChildren] = pickChild(children, PaginationNext_default);
+  const [prevItem, nextItem] = useMemo3(() => {
+    const hasChildren = (c) => React5.Children.count(c) > 0;
+    const prevDefault = /* @__PURE__ */ jsx6(PaginationPrevious_default, { children: "prev" });
+    const nextDefault = /* @__PURE__ */ jsx6(PaginationNext_default, { children: "next" });
+    return [hasChildren(prevChildren) ? prevChildren : prevDefault, hasChildren(nextChildren) ? nextChildren : nextDefault];
+  }, [prevChildren, nextChildren]);
+  const update = useCallback2((type) => {
+    if (type === "prev" && pageRef.current > 1) {
+      setPage((last) => last - 1);
+    }
+    if (type === "next" && pageRef.current < count) {
+      setPage((last) => last + 1);
+    }
+  }, [count, pageRef, setPage]);
+  const values = useMemo3(() => ({
+    isFirst: page <= 1,
+    isLast: page >= count,
+    update
+  }), [page, count, update]);
+  useEffect(() => {
+    if (onChange) onChange(page);
+  }, [onChange, page]);
+  useEffect(() => {
+    if (customPage !== void 0) {
+      setPage(customPage);
+    }
+  }, [customPage, setPage]);
+  return /* @__PURE__ */ jsxs4(PaginationContext.Provider, { value: values, children: [
+    /* @__PURE__ */ jsx6("nav", { ref, "aria-label": "Pagination", ...props, className: _JSXStyle3.dynamic([["2367140580", [SCALES.font(2), SCALES.font(0.875), SCALES.width(1, "auto"), SCALES.height(1, "auto"), SCALES.pt(0), SCALES.pr(0), SCALES.pb(0), SCALES.pl(0), SCALES.mt(0), SCALES.mr(0), SCALES.mb(0), SCALES.ml(0)]]]) + " " + (props && props.className != null && props.className || className || ""), children: /* @__PURE__ */ jsxs4("ul", { className: _JSXStyle3.dynamic([["2367140580", [SCALES.font(2), SCALES.font(0.875), SCALES.width(1, "auto"), SCALES.height(1, "auto"), SCALES.pt(0), SCALES.pr(0), SCALES.pb(0), SCALES.pl(0), SCALES.mt(0), SCALES.mr(0), SCALES.mb(0), SCALES.ml(0)]]]), children: [
+      prevItem,
+      /* @__PURE__ */ jsx6(PaginationPages_default, { count, current: page, limit, setPage }),
+      nextItem
+    ] }) }),
+    /* @__PURE__ */ jsx6(_JSXStyle3, { id: "2367140580", dynamic: [SCALES.font(2), SCALES.font(0.875), SCALES.width(1, "auto"), SCALES.height(1, "auto"), SCALES.pt(0), SCALES.pr(0), SCALES.pb(0), SCALES.pl(0), SCALES.mt(0), SCALES.mr(0), SCALES.mb(0), SCALES.ml(0)], children: `ul.__jsx-style-dynamic-selector{margin:0;padding:0;list-style:none;}nav.__jsx-style-dynamic-selector{font-variant:tabular-nums;font-feature-settings:'tnum';--pagination-size:${SCALES.font(2)};font-size:${SCALES.font(0.875)};width:${SCALES.width(1, "auto")};height:${SCALES.height(1, "auto")};padding:${SCALES.pt(0)} ${SCALES.pr(0)} ${SCALES.pb(0)} ${SCALES.pl(0)};margin:${SCALES.mt(0)} ${SCALES.mr(0)} ${SCALES.mb(0)} ${SCALES.ml(0)};}nav.__jsx-style-dynamic-selector button:last-of-type{margin-right:0;}` })
+  ] });
+});
+PaginationComponent.displayName = "BolioUIPagination";
+var Pagination = with_scale_default(PaginationComponent);
+var Pagination_default = Pagination;
+
+// core/Pagination/index.ts
+Pagination_default.Previous = PaginationPrevious_default;
+Pagination_default.Next = PaginationNext_default;
+var Pagination_default2 = Pagination_default;
+
+export {
+  Pagination_default2 as Pagination_default
+};

package/esm/chunk-GGD4BGH2.js

@@ -0,0 +1,30 @@
+// core/use-current-state/use-current-state.ts
+import {
+  useCallback,
+  useEffect,
+  useRef,
+  useState
+} from "react";
+var useCurrentState = (initialState) => {
+  const [state, setState] = useState(() => {
+    return typeof initialState === "function" ? initialState() : initialState;
+  });
+  const ref = useRef(initialState);
+  useEffect(() => {
+    ref.current = state;
+  }, [state]);
+  const setValue = useCallback((val) => {
+    const result = typeof val === "function" ? val(ref.current) : val;
+    ref.current = result;
+    setState(result);
+  }, []);
+  return [state, setValue, ref];
+};
+var use_current_state_default = useCurrentState;
+
+// core/use-current-state/index.ts
+var use_current_state_default2 = use_current_state_default;
+
+export {
+  use_current_state_default2 as use_current_state_default
+};

package/esm/chunk-GJZT47MP.js

@@ -0,0 +1,32 @@
+// core/utils/variant-colors.ts
+var SEMANTIC_COLOR_TYPES = [
+  "primary",
+  "secondary",
+  "success",
+  "warning",
+  "error",
+  "info"
+];
+var isSemanticColorType = (type) => !!type && SEMANTIC_COLOR_TYPES.includes(type);
+var getVariantColors = (palette, type, variant) => {
+  const base = palette[type];
+  switch (variant) {
+    case "filled":
+      return { bg: base, border: base, color: "#fff" };
+    case "light":
+      return {
+        bg: palette[`${type}Lighter`],
+        border: palette[`${type}Lighter`],
+        color: palette[`${type}Dark`]
+      };
+    case "outline":
+      return { bg: palette.background, border: base, color: base };
+    case "subtle":
+      return { bg: "transparent", border: "transparent", color: base };
+  }
+};
+
+export {
+  isSemanticColorType,
+  getVariantColors
+};