@bolio-ui/core 2.0.0-alpha.2 → 3.0.0-alpha.1

package/esm/chunk-YFQOB5OC.js

@@ -1,204 +0,0 @@
-import {
-  use_toasts_default
-} from "./chunk-NCUSKYUE.js";
-import {
-  use_clipboard_default
-} from "./chunk-C3ZZPIUO.js";
-import {
-  getVariantColors,
-  isSemanticColorType
-} from "./chunk-GJZT47MP.js";
-import {
-  use_scale_default,
-  with_scale_default
-} from "./chunk-S62PPQHN.js";
-import {
-  use_theme_default
-} from "./chunk-45MVPPJN.js";
-import {
-  use_classes_default
-} from "./chunk-5KUROAEP.js";
-
-// core/Snippet/Snippet.tsx
-import _JSXStyle2 from "styled-jsx/style";
-import React2, { useMemo, useRef } from "react";
-
-// core/Snippet/styles.ts
-var getStyles = (type, palette, { fill, light, ghost, subtle } = {}) => {
-  if (isSemanticColorType(type)) {
-    if (subtle) {
-      const { bg, border, color } = getVariantColors(palette, type, "subtle");
-      return { color, border, bgColor: bg };
-    }
-    if (light) {
-      const { bg, border, color } = getVariantColors(palette, type, "light");
-      return { color, border, bgColor: bg };
-    }
-    if (ghost) {
-      const { bg, border, color } = getVariantColors(palette, type, "outline");
-      return { color, border, bgColor: bg };
-    }
-  }
-  const styles = {
-    default: {
-      color: palette.foreground,
-      border: palette.accents_2,
-      bgColor: palette.accents_2
-    },
-    primary: {
-      color: palette.primary,
-      border: palette.primary,
-      bgColor: palette.accents_1
-    },
-    secondary: {
-      color: palette.secondary,
-      border: palette.secondary,
-      bgColor: palette.accents_1
-    },
-    success: {
-      color: palette.success,
-      border: palette.success,
-      bgColor: palette.accents_1
-    },
-    warning: {
-      color: palette.warning,
-      border: palette.warning,
-      bgColor: palette.accents_1
-    },
-    error: {
-      color: palette.error,
-      border: palette.error,
-      bgColor: palette.accents_1
-    },
-    info: {
-      color: palette.info,
-      border: palette.info,
-      bgColor: palette.accents_1
-    },
-    lite: {
-      color: palette.foreground,
-      border: palette.border,
-      bgColor: palette.accents_1
-    },
-    dark: {
-      color: palette.background,
-      border: palette.foreground,
-      bgColor: palette.foreground
-    }
-  };
-  const filledTypes = [
-    "primary",
-    "secondary",
-    "success",
-    "warning",
-    "error",
-    "info"
-  ];
-  const style = styles[type];
-  const shouldFilled = filledTypes.includes(type);
-  if (!fill || !shouldFilled) return style;
-  return {
-    ...style,
-    color: style.bgColor,
-    bgColor: style.color
-  };
-};
-
-// core/Snippet/SnippetIcon.tsx
-import _JSXStyle from "styled-jsx/style";
-import React from "react";
-import { jsx, jsxs } from "react/jsx-runtime";
-function SnippetIconComponent() {
-  return /* @__PURE__ */ jsxs("svg", { viewBox: "0 0 24 24", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round", fill: "none", shapeRendering: "geometricPrecision", style: {
-    color: "currentcolor"
-  }, className: "jsx-418323402", children: [
-    /* @__PURE__ */ jsx("path", { d: "M8 17.929H6c-1.105 0-2-.912-2-2.036V5.036C4 3.91 4.895 3 6 3h8c1.105 0 2 .911 2 2.036v1.866m-6 .17h8c1.105 0 2 .91 2 2.035v10.857C20 21.09 19.105 22 18 22h-8c-1.105 0-2-.911-2-2.036V9.107c0-1.124.895-2.036 2-2.036z", className: "jsx-418323402" }),
-    /* @__PURE__ */ jsx(_JSXStyle, { id: "418323402", children: "svg.jsx-418323402{width:calc(var(--snippet-font-size) * 1.69);height:calc(var(--snippet-font-size) * 1.69);}" })
-  ] });
-}
-SnippetIconComponent.displayName = "BolioUISnippetIcon";
-var SnippetIcon = React.memo(SnippetIconComponent);
-var SnippetIcon_default = SnippetIcon;
-
-// core/utils/use-clipboard.ts
-var use_clipboard_default2 = use_clipboard_default;
-
-// core/Snippet/Snippet.tsx
-import { jsx as jsx2, jsxs as jsxs2 } from "react/jsx-runtime";
-var textArrayToString = (text) => {
-  return text.reduce((pre, current) => {
-    if (!current) return pre;
-    return pre ? `${pre}
-${current}` : current;
-  }, "");
-};
-var SnippetComponent = React2.forwardRef(({
-  type = "default",
-  filled = false,
-  light = false,
-  ghost = false,
-  subtle = false,
-  rounded = false,
-  children,
-  symbol = "$",
-  toastText = "Copied!",
-  toastType = "primary",
-  text,
-  copy: copyType,
-  className = "",
-  ...props
-}, ref) => {
-  const theme = use_theme_default();
-  const {
-    SCALES
-  } = use_scale_default();
-  const {
-    copy
-  } = use_clipboard_default2();
-  const {
-    setToast
-  } = use_toasts_default();
-  const preRef = useRef(null);
-  const isMultiLine = text && Array.isArray(text);
-  const style = useMemo(() => getStyles(type, theme.palette, {
-    fill: filled,
-    light,
-    ghost,
-    subtle
-  }), [type, theme.palette, filled, light, ghost, subtle]);
-  const showCopyIcon = useMemo(() => copyType !== "prevent", [copyType]);
-  const childText = useMemo(() => {
-    if (isMultiLine) return textArrayToString(text);
-    if (!children) return text;
-    if (!preRef.current) return "";
-    return preRef.current.textContent;
-  }, [isMultiLine, text, children]);
-  const symbolBefore = useMemo(() => {
-    const str = symbol.trim();
-    return str ? `${str} ` : "";
-  }, [symbol]);
-  const clickHandler = () => {
-    if (!childText || !showCopyIcon) return;
-    copy(childText);
-    if (copyType === "silent") return;
-    setToast({
-      text: toastText,
-      type: toastType
-    });
-  };
-  return /* @__PURE__ */ jsxs2("div", { ref, ...props, className: _JSXStyle2.dynamic([["3243552610", [style.color, style.bgColor, style.border, rounded ? "25px" : theme.layout.radius, SCALES.font(0.8125), SCALES.pt(0.667), SCALES.width(1, "initial"), SCALES.height(1, "auto"), SCALES.pt(0.667), SCALES.pr(2.667), SCALES.pb(0.667), SCALES.pl(0.667), SCALES.mt(0), SCALES.mr(0), SCALES.mb(0), SCALES.ml(0), style.color, symbolBefore, style.bgColor, isMultiLine ? "flex-start" : "center", rounded ? "25px" : theme.layout.radius, isMultiLine ? "var(--snippet-padding-top)" : 0]]]) + " " + (props && props.className != null && props.className || use_classes_default("snippet", className) || ""), children: [
-    isMultiLine ? text.map((t, index) => /* @__PURE__ */ jsx2("pre", { className: _JSXStyle2.dynamic([["3243552610", [style.color, style.bgColor, style.border, rounded ? "25px" : theme.layout.radius, SCALES.font(0.8125), SCALES.pt(0.667), SCALES.width(1, "initial"), SCALES.height(1, "auto"), SCALES.pt(0.667), SCALES.pr(2.667), SCALES.pb(0.667), SCALES.pl(0.667), SCALES.mt(0), SCALES.mr(0), SCALES.mb(0), SCALES.ml(0), style.color, symbolBefore, style.bgColor, isMultiLine ? "flex-start" : "center", rounded ? "25px" : theme.layout.radius, isMultiLine ? "var(--snippet-padding-top)" : 0]]]), children: t }, `snippet-${index}-${t}`)) : /* @__PURE__ */ jsx2("pre", { ref: preRef, className: _JSXStyle2.dynamic([["3243552610", [style.color, style.bgColor, style.border, rounded ? "25px" : theme.layout.radius, SCALES.font(0.8125), SCALES.pt(0.667), SCALES.width(1, "initial"), SCALES.height(1, "auto"), SCALES.pt(0.667), SCALES.pr(2.667), SCALES.pb(0.667), SCALES.pl(0.667), SCALES.mt(0), SCALES.mr(0), SCALES.mb(0), SCALES.ml(0), style.color, symbolBefore, style.bgColor, isMultiLine ? "flex-start" : "center", rounded ? "25px" : theme.layout.radius, isMultiLine ? "var(--snippet-padding-top)" : 0]]]), children: children || text }),
-    showCopyIcon && /* @__PURE__ */ jsx2("div", { onClick: clickHandler, className: _JSXStyle2.dynamic([["3243552610", [style.color, style.bgColor, style.border, rounded ? "25px" : theme.layout.radius, SCALES.font(0.8125), SCALES.pt(0.667), SCALES.width(1, "initial"), SCALES.height(1, "auto"), SCALES.pt(0.667), SCALES.pr(2.667), SCALES.pb(0.667), SCALES.pl(0.667), SCALES.mt(0), SCALES.mr(0), SCALES.mb(0), SCALES.ml(0), style.color, symbolBefore, style.bgColor, isMultiLine ? "flex-start" : "center", rounded ? "25px" : theme.layout.radius, isMultiLine ? "var(--snippet-padding-top)" : 0]]]) + " copy", children: /* @__PURE__ */ jsx2(SnippetIcon_default, {}) }),
-    /* @__PURE__ */ jsx2(_JSXStyle2, { id: "3243552610", dynamic: [style.color, style.bgColor, style.border, rounded ? "25px" : theme.layout.radius, SCALES.font(0.8125), SCALES.pt(0.667), SCALES.width(1, "initial"), SCALES.height(1, "auto"), SCALES.pt(0.667), SCALES.pr(2.667), SCALES.pb(0.667), SCALES.pl(0.667), SCALES.mt(0), SCALES.mr(0), SCALES.mb(0), SCALES.ml(0), style.color, symbolBefore, style.bgColor, isMultiLine ? "flex-start" : "center", rounded ? "25px" : theme.layout.radius, isMultiLine ? "var(--snippet-padding-top)" : 0], children: `.snippet.__jsx-style-dynamic-selector{position:relative;max-width:100%;color:${style.color};background-color:${style.bgColor};border:1px solid ${style.border};border-radius:${rounded ? "25px" : theme.layout.radius};--snippet-font-size:${SCALES.font(0.8125)};--snippet-padding-top:${SCALES.pt(0.667)};font-size:var(--snippet-font-size);width:${SCALES.width(1, "initial")};height:${SCALES.height(1, "auto")};padding:${SCALES.pt(0.667)} ${SCALES.pr(2.667)} ${SCALES.pb(0.667)} ${SCALES.pl(0.667)};margin:${SCALES.mt(0)} ${SCALES.mr(0)} ${SCALES.mb(0)} ${SCALES.ml(0)};}pre.__jsx-style-dynamic-selector{margin:0;padding:0;border:none;background-color:transparent;color:${style.color};font-size:inherit;}pre.__jsx-style-dynamic-selector::before{content:'${symbolBefore}';-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;}pre.__jsx-style-dynamic-selector *{margin:0;padding:0;font-size:inherit;color:inherit;}.copy.__jsx-style-dynamic-selector{position:absolute;right:0;top:0;bottom:0;background-color:${style.bgColor};display:-webkit-inline-box;display:-webkit-inline-flex;display:-ms-inline-flexbox;display:inline-flex;-webkit-box-pack:center;-webkit-justify-content:center;-ms-flex-pack:center;justify-content:center;-webkit-align-items:${isMultiLine ? "flex-start" : "center"};-webkit-box-align:${isMultiLine ? "flex-start" : "center"};-ms-flex-align:${isMultiLine ? "flex-start" : "center"};align-items:${isMultiLine ? "flex-start" : "center"};width:calc(3.281 * var(--snippet-font-size));color:inherit;-webkit-transition:opacity 150ms ease 0s;transition:opacity 150ms ease 0s;border-radius:${rounded ? "25px" : theme.layout.radius};cursor:pointer;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;padding-top:${isMultiLine ? "var(--snippet-padding-top)" : 0};opacity:0.65;}.copy.__jsx-style-dynamic-selector:hover{opacity:1;}` })
-  ] });
-});
-SnippetComponent.displayName = "BolioUISnippet";
-var Snippet = with_scale_default(SnippetComponent);
-var Snippet_default = Snippet;
-
-// core/Snippet/index.ts
-var Snippet_default2 = Snippet_default;
-
-export {
-  Snippet_default2 as Snippet_default
-};

package/esm/chunk-YHEIC6EK.js

@@ -1,102 +0,0 @@
-import {
-  use_scale_default,
-  with_scale_default
-} from "./chunk-S62PPQHN.js";
-import {
-  use_theme_default
-} from "./chunk-45MVPPJN.js";
-import {
-  use_classes_default
-} from "./chunk-5KUROAEP.js";
-
-// core/Toggle/Toggle.tsx
-import _JSXStyle from "styled-jsx/style";
-import React, { useCallback, useEffect, useMemo, useState } from "react";
-
-// core/Toggle/styles.ts
-var getColors = (palette, status) => {
-  const colors = {
-    default: {
-      bg: palette.success
-    },
-    primary: {
-      bg: palette.primary
-    },
-    secondary: {
-      bg: palette.secondary
-    },
-    success: {
-      bg: palette.success
-    },
-    warning: {
-      bg: palette.warning
-    },
-    error: {
-      bg: palette.error
-    },
-    info: {
-      bg: palette.info
-    }
-  };
-  if (!status) return colors.default;
-  return colors[status];
-};
-
-// core/Toggle/Toggle.tsx
-import { jsx, jsxs } from "react/jsx-runtime";
-var ToggleComponent = React.forwardRef(({
-  initialChecked = false,
-  checked,
-  disabled = false,
-  onChange,
-  type = "default",
-  className = "",
-  "aria-label": ariaLabel,
-  "aria-labelledby": ariaLabelledby,
-  ...props
-}, ref) => {
-  const theme = use_theme_default();
-  const {
-    SCALES
-  } = use_scale_default();
-  const [selfChecked, setSelfChecked] = useState(initialChecked);
-  const classes = use_classes_default("toggle", {
-    checked: selfChecked,
-    disabled
-  });
-  const changeHandle = useCallback((ev) => {
-    if (disabled) return;
-    const selfEvent = {
-      target: {
-        checked: !selfChecked
-      },
-      stopPropagation: ev.stopPropagation,
-      preventDefault: ev.preventDefault,
-      nativeEvent: ev
-    };
-    setSelfChecked(!selfChecked);
-    if (onChange) onChange(selfEvent);
-  }, [disabled, selfChecked, onChange]);
-  const {
-    bg
-  } = useMemo(() => getColors(theme.palette, type), [theme.palette, type]);
-  useEffect(() => {
-    if (checked === void 0) return;
-    setSelfChecked(checked);
-  }, [checked]);
-  return /* @__PURE__ */ jsxs("label", { ...props, className: _JSXStyle.dynamic([["951079252", [disabled ? "not-allowed" : "pointer", SCALES.font(1), SCALES.height(1), SCALES.width(1.75), SCALES.pt(0.1875), SCALES.pr(0), SCALES.pb(0.1875), SCALES.pl(0), SCALES.mt(0), SCALES.mr(0), SCALES.mb(0), SCALES.ml(0), theme.palette.primary, theme.palette.accents_2, theme.palette.accents_1, theme.palette.accents_2, theme.palette.accents_1, theme.palette.accents_2, theme.palette.accents_4, theme.palette.accents_4, bg]]]) + " " + (props && props.className != null && props.className || className || ""), children: [
-    /* @__PURE__ */ jsx("input", { ref, type: "checkbox", role: "switch", "aria-label": ariaLabel, "aria-labelledby": ariaLabelledby, disabled, checked: selfChecked, onChange: changeHandle, className: _JSXStyle.dynamic([["951079252", [disabled ? "not-allowed" : "pointer", SCALES.font(1), SCALES.height(1), SCALES.width(1.75), SCALES.pt(0.1875), SCALES.pr(0), SCALES.pb(0.1875), SCALES.pl(0), SCALES.mt(0), SCALES.mr(0), SCALES.mb(0), SCALES.ml(0), theme.palette.primary, theme.palette.accents_2, theme.palette.accents_1, theme.palette.accents_2, theme.palette.accents_1, theme.palette.accents_2, theme.palette.accents_4, theme.palette.accents_4, bg]]]) }),
-    /* @__PURE__ */ jsx("div", { className: _JSXStyle.dynamic([["951079252", [disabled ? "not-allowed" : "pointer", SCALES.font(1), SCALES.height(1), SCALES.width(1.75), SCALES.pt(0.1875), SCALES.pr(0), SCALES.pb(0.1875), SCALES.pl(0), SCALES.mt(0), SCALES.mr(0), SCALES.mb(0), SCALES.ml(0), theme.palette.primary, theme.palette.accents_2, theme.palette.accents_1, theme.palette.accents_2, theme.palette.accents_1, theme.palette.accents_2, theme.palette.accents_4, theme.palette.accents_4, bg]]]) + " " + (classes || ""), children: /* @__PURE__ */ jsx("span", { className: _JSXStyle.dynamic([["951079252", [disabled ? "not-allowed" : "pointer", SCALES.font(1), SCALES.height(1), SCALES.width(1.75), SCALES.pt(0.1875), SCALES.pr(0), SCALES.pb(0.1875), SCALES.pl(0), SCALES.mt(0), SCALES.mr(0), SCALES.mb(0), SCALES.ml(0), theme.palette.primary, theme.palette.accents_2, theme.palette.accents_1, theme.palette.accents_2, theme.palette.accents_1, theme.palette.accents_2, theme.palette.accents_4, theme.palette.accents_4, bg]]]) + " inner" }) }),
-    /* @__PURE__ */ jsx(_JSXStyle, { id: "951079252", dynamic: [disabled ? "not-allowed" : "pointer", SCALES.font(1), SCALES.height(1), SCALES.width(1.75), SCALES.pt(0.1875), SCALES.pr(0), SCALES.pb(0.1875), SCALES.pl(0), SCALES.mt(0), SCALES.mr(0), SCALES.mb(0), SCALES.ml(0), theme.palette.primary, theme.palette.accents_2, theme.palette.accents_1, theme.palette.accents_2, theme.palette.accents_1, theme.palette.accents_2, theme.palette.accents_4, theme.palette.accents_4, bg], children: `label.__jsx-style-dynamic-selector{-webkit-tap-highlight-color:transparent;display:inline-block;vertical-align:middle;white-space:nowrap;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;position:relative;cursor:${disabled ? "not-allowed" : "pointer"};--toggle-font-size:${SCALES.font(1)};--toggle-height:${SCALES.height(1)};width:${SCALES.width(1.75)};height:var(--toggle-height);padding:${SCALES.pt(0.1875)} ${SCALES.pr(0)} ${SCALES.pb(0.1875)} ${SCALES.pl(0)};margin:${SCALES.mt(0)} ${SCALES.mr(0)} ${SCALES.mb(0)} ${SCALES.ml(0)};}input.__jsx-style-dynamic-selector{overflow:hidden;height:0;margin:0;opacity:0;width:0;position:absolute;background-color:transparent;z-index:-1;}input.__jsx-style-dynamic-selector:focus-visible+.toggle.__jsx-style-dynamic-selector{outline:2px solid ${theme.palette.primary};outline-offset:2px;}.toggle.__jsx-style-dynamic-selector{height:calc(var(--toggle-height) + 2px);width:100%;border-radius:var(--toggle-height);-webkit-transition-delay:0.12s;transition-delay:0.12s;-webkit-transition-duration:0.2s;transition-duration:0.2s;-webkit-transition-property:background,border;transition-property:background,border;-webkit-transition-timing-function:cubic-bezier(0,0,0.2,1);transition-timing-function:cubic-bezier(0,0,0.2,1);position:relative;border:1px solid transparent;background-color:${theme.palette.accents_2};padding:0;}.inner.__jsx-style-dynamic-selector{width:calc(var(--toggle-height) - 2px);height:calc(var(--toggle-height) - 2px);position:absolute;top:50%;-webkit-transform:translateY(-50%);-ms-transform:translateY(-50%);transform:translateY(-50%);left:1px;box-shadow: rgba(0,0,0,0.2) 0 1px 2px 0, rgba(0,0,0,0.1) 0 1px 3px 0;-webkit-transition:left 280ms cubic-bezier(0,0,0.2,1);transition:left 280ms cubic-bezier(0,0,0.2,1);border-radius:50%;background-color:${theme.palette.accents_1};}.disabled.__jsx-style-dynamic-selector{border-color:${theme.palette.accents_2};background-color:${theme.palette.accents_1};}.disabled.__jsx-style-dynamic-selector>.inner.__jsx-style-dynamic-selector{background-color:${theme.palette.accents_2};}.disabled.checked.__jsx-style-dynamic-selector{border-color:${theme.palette.accents_4};background-color:${theme.palette.accents_4};}.checked.__jsx-style-dynamic-selector{background-color:${bg};}.checked.__jsx-style-dynamic-selector>.inner.__jsx-style-dynamic-selector{left:calc(100% - (var(--toggle-height) - 1px));box-shadow:none;}` })
-  ] });
-});
-ToggleComponent.displayName = "BolioUIToggle";
-var Toggle = with_scale_default(ToggleComponent);
-var Toggle_default = Toggle;
-
-// core/Toggle/index.ts
-var Toggle_default2 = Toggle_default;
-
-export {
-  Toggle_default2 as Toggle_default
-};

package/esm/chunk-YS5PWRS7.js

@@ -1,288 +0,0 @@
-import {
-  ModalContent_default,
-  ModalContext,
-  ModalSubtitle_default,
-  ModalTitle_default,
-  backdrop_default,
-  useModalContext,
-  use_body_scroll_default
-} from "./chunk-K53ERLS7.js";
-import {
-  use_keyboard_default
-} from "./chunk-F3AL4TQZ.js";
-import {
-  css_transition_default
-} from "./chunk-LDTDMDE6.js";
-import {
-  use_portal_default
-} from "./chunk-BXDUHMWS.js";
-import {
-  Button_default
-} from "./chunk-6XJS3KMW.js";
-import {
-  use_scale_default,
-  with_scale_default
-} from "./chunk-S62PPQHN.js";
-import {
-  hasChild,
-  isChildElement,
-  pickChild
-} from "./chunk-UX2B3G6U.js";
-import {
-  use_theme_default
-} from "./chunk-45MVPPJN.js";
-import {
-  use_classes_default
-} from "./chunk-5KUROAEP.js";
-
-// core/Modal/Modal.tsx
-import React4, {
-  useCallback,
-  useEffect as useEffect3,
-  useId,
-  useMemo as useMemo2,
-  useState as useState2
-} from "react";
-import { createPortal } from "react-dom";
-
-// core/Modal/ModalWrapper.tsx
-import _JSXStyle from "styled-jsx/style";
-import React, { useEffect, useImperativeHandle, useRef } from "react";
-import { jsx, jsxs } from "react/jsx-runtime";
-var ModalWrapper = React.forwardRef(({
-  className = "",
-  children,
-  visible = false,
-  ...props
-}, ref) => {
-  const theme = use_theme_default();
-  const {
-    SCALES
-  } = use_scale_default();
-  const modalContent = useRef(null);
-  useImperativeHandle(ref, () => modalContent.current);
-  const tabStart = useRef(null);
-  const tabEnd = useRef(null);
-  useEffect(() => {
-    if (!visible) return;
-    const activeElement = document.activeElement;
-    const isChild = isChildElement(modalContent.current, activeElement);
-    if (isChild) return;
-    if (tabStart.current) tabStart.current.focus();
-  }, [visible]);
-  const onKeyDown = (event) => {
-    const isTabDown = event.keyCode === 9;
-    if (!visible || !isTabDown) return;
-    const activeElement = document.activeElement;
-    if (event.shiftKey) {
-      if (activeElement === tabStart.current) {
-        if (tabEnd.current) tabEnd.current.focus();
-      }
-    } else {
-      if (activeElement === tabEnd.current) {
-        if (tabStart.current) tabStart.current.focus();
-      }
-    }
-  };
-  return /* @__PURE__ */ jsx(css_transition_default, { name: "wrapper", visible, clearTime: 300, children: /* @__PURE__ */ jsxs("div", { role: "dialog", "aria-modal": "true", tabIndex: -1, onKeyDown, ref: modalContent, ...props, className: _JSXStyle.dynamic([["356685991", [theme.palette.background, theme.palette.foreground, theme.layout.radius, theme.expressiveness.shadowLarge, SCALES.font(1), SCALES.height(1, "auto"), SCALES.pl(1.3125), SCALES.pr(1.3125), SCALES.pt(1.3125), SCALES.pb(1.3125), SCALES.mt(0), SCALES.mr(0), SCALES.mb(0), SCALES.ml(0)]]]) + " " + (props && props.className != null && props.className || use_classes_default("wrapper", className) || ""), children: [
-    /* @__PURE__ */ jsx("div", { tabIndex: 0, "aria-hidden": "true", ref: tabStart, className: _JSXStyle.dynamic([["356685991", [theme.palette.background, theme.palette.foreground, theme.layout.radius, theme.expressiveness.shadowLarge, SCALES.font(1), SCALES.height(1, "auto"), SCALES.pl(1.3125), SCALES.pr(1.3125), SCALES.pt(1.3125), SCALES.pb(1.3125), SCALES.mt(0), SCALES.mr(0), SCALES.mb(0), SCALES.ml(0)]]]) + " hide-tab" }),
-    children,
-    /* @__PURE__ */ jsx("div", { tabIndex: 0, "aria-hidden": "true", ref: tabEnd, className: _JSXStyle.dynamic([["356685991", [theme.palette.background, theme.palette.foreground, theme.layout.radius, theme.expressiveness.shadowLarge, SCALES.font(1), SCALES.height(1, "auto"), SCALES.pl(1.3125), SCALES.pr(1.3125), SCALES.pt(1.3125), SCALES.pb(1.3125), SCALES.mt(0), SCALES.mr(0), SCALES.mb(0), SCALES.ml(0)]]]) + " hide-tab" }),
-    /* @__PURE__ */ jsx(_JSXStyle, { id: "356685991", dynamic: [theme.palette.background, theme.palette.foreground, theme.layout.radius, theme.expressiveness.shadowLarge, SCALES.font(1), SCALES.height(1, "auto"), SCALES.pl(1.3125), SCALES.pr(1.3125), SCALES.pt(1.3125), SCALES.pb(1.3125), SCALES.mt(0), SCALES.mr(0), SCALES.mb(0), SCALES.ml(0)], children: `.wrapper.__jsx-style-dynamic-selector{max-width:100%;vertical-align:middle;overflow:hidden;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;position:relative;box-sizing:border-box;background-color:${theme.palette.background};color:${theme.palette.foreground};border-radius:${theme.layout.radius};box-shadow:${theme.expressiveness.shadowLarge};opacity:0;outline:none;-webkit-transform:translate3d(0px,-30px,0px);-ms-transform:translate3d(0px,-30px,0px);transform:translate3d(0px,-30px,0px);-webkit-transition: opacity 0.35s cubic-bezier(0.4,0,0.2,1) 0s, -webkit-transform 0.35s cubic-bezier(0.4,0,0.2,1) 0s;-webkit-transition: opacity 0.35s cubic-bezier(0.4,0,0.2,1) 0s, transform 0.35s cubic-bezier(0.4,0,0.2,1) 0s;transition: opacity 0.35s cubic-bezier(0.4,0,0.2,1) 0s, transform 0.35s cubic-bezier(0.4,0,0.2,1) 0s;width:100%;font-size:${SCALES.font(1)};height:${SCALES.height(1, "auto")};--modal-wrapper-padding-left:${SCALES.pl(1.3125)};--modal-wrapper-padding-right:${SCALES.pr(1.3125)};padding:${SCALES.pt(1.3125)} var(--modal-wrapper-padding-right) ${SCALES.pb(1.3125)} var(--modal-wrapper-padding-left);margin:${SCALES.mt(0)} ${SCALES.mr(0)} ${SCALES.mb(0)} ${SCALES.ml(0)};}.wrapper-enter.__jsx-style-dynamic-selector{opacity:0;-webkit-transform:translate3d(0px,-30px,0px);-ms-transform:translate3d(0px,-30px,0px);transform:translate3d(0px,-30px,0px);}.wrapper-enter-active.__jsx-style-dynamic-selector{opacity:1;-webkit-transform:translate3d(0px,0px,0px);-ms-transform:translate3d(0px,0px,0px);transform:translate3d(0px,0px,0px);}.wrapper-leave.__jsx-style-dynamic-selector{opacity:1;-webkit-transform:translate3d(0px,0px,0px);-ms-transform:translate3d(0px,0px,0px);transform:translate3d(0px,0px,0px);}.wrapper-leave-active.__jsx-style-dynamic-selector{opacity:0;-webkit-transform:translate3d(0px,-30px,0px);-ms-transform:translate3d(0px,-30px,0px);transform:translate3d(0px,-30px,0px);}.hide-tab.__jsx-style-dynamic-selector{outline:none;overflow:hidden;width:0;height:0;opacity:0;}` })
-  ] }) });
-});
-ModalWrapper.displayName = "BolioUIModalWrapper";
-var ModalWrapper_default = ModalWrapper;
-
-// core/Modal/ModalAction.tsx
-import _JSXStyle2 from "styled-jsx/style";
-import React2, { useImperativeHandle as useImperativeHandle2, useMemo, useRef as useRef2 } from "react";
-import { jsx as jsx2, jsxs as jsxs2 } from "react/jsx-runtime";
-var ModalActionComponent = React2.forwardRef(function({
-  className = "",
-  children,
-  onClick,
-  passive = false,
-  disabled = false,
-  ...props
-}, ref) {
-  const theme = use_theme_default();
-  const {
-    SCALES
-  } = use_scale_default();
-  const btnRef = useRef2(null);
-  const {
-    close
-  } = useModalContext();
-  useImperativeHandle2(ref, () => btnRef.current);
-  const clickHandler = (event) => {
-    if (disabled) return;
-    const actionEvent = Object.assign({}, event, {
-      close: () => close && close()
-    });
-    if (onClick) onClick(actionEvent);
-  };
-  const color = useMemo(() => {
-    return passive ? theme.palette.accents_5 : theme.palette.foreground;
-  }, [theme.palette, passive]);
-  const bgColor = useMemo(() => {
-    return disabled ? theme.palette.accents_1 : theme.palette.background;
-  }, [theme.palette, disabled]);
-  const {
-    className: resolveClassName,
-    styles
-  } = {
-    styles: /* @__PURE__ */ jsx2(_JSXStyle2, { id: "1003252629", dynamic: [SCALES.font(0.75), color, theme.palette.background, SCALES.height(3.5625), disabled ? color : theme.palette.foreground, disabled ? bgColor : theme.palette.accents_1], children: `button.btn.__jsx-style-dynamic-selector{font-size:${SCALES.font(0.75)};border:none;color:${color};background-color:${theme.palette.background};display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-align:center;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-webkit-box-pack:center;-webkit-justify-content:center;-ms-flex-pack:center;justify-content:center;-webkit-flex:1;-ms-flex:1;flex:1;height:${SCALES.height(3.5625)};border-radius:0;min-width:0;}button.btn.__jsx-style-dynamic-selector:hover,button.btn.__jsx-style-dynamic-selector:focus{color:${disabled ? color : theme.palette.foreground};background-color:${disabled ? bgColor : theme.palette.accents_1};}` }),
-    className: _JSXStyle2.dynamic([["1003252629", [SCALES.font(0.75), color, theme.palette.background, SCALES.height(3.5625), disabled ? color : theme.palette.foreground, disabled ? bgColor : theme.palette.accents_1]]])
-  };
-  const classes = use_classes_default(resolveClassName, className);
-  const overrideProps = {
-    ...props,
-    effect: false,
-    ref: btnRef
-  };
-  return /* @__PURE__ */ jsxs2(Button_default, { className: classes, onClick: clickHandler, disabled, ...overrideProps, children: [
-    children,
-    styles
-  ] });
-});
-ModalActionComponent.displayName = "BolioUIModalAction";
-var ModalAction = with_scale_default(ModalActionComponent);
-var ModalAction_default = ModalAction;
-
-// core/Modal/ModalActions.tsx
-import _JSXStyle3 from "styled-jsx/style";
-import React3, { useEffect as useEffect2, useRef as useRef3, useState } from "react";
-import { Fragment, jsx as jsx3, jsxs as jsxs3 } from "react/jsx-runtime";
-var ModalActionsComponent = ({
-  children,
-  ...props
-}) => {
-  const theme = use_theme_default();
-  const ref = useRef3(null);
-  const [height, setHeight] = useState("auto");
-  useEffect2(() => {
-    if (!ref.current) return;
-    setHeight(`${ref.current.clientHeight}px`);
-  }, [ref]);
-  return /* @__PURE__ */ jsxs3(Fragment, { children: [
-    /* @__PURE__ */ jsx3("div", { className: _JSXStyle3.dynamic([["2914444644", [theme.palette.border, theme.layout.radius, theme.layout.radius, theme.palette.border, height]]]) }),
-    /* @__PURE__ */ jsx3("footer", { ref, ...props, className: _JSXStyle3.dynamic([["2914444644", [theme.palette.border, theme.layout.radius, theme.layout.radius, theme.palette.border, height]]]) + " " + (props && props.className != null && props.className || ""), children }),
-    /* @__PURE__ */ jsx3(_JSXStyle3, { id: "2914444644", dynamic: [theme.palette.border, theme.layout.radius, theme.layout.radius, theme.palette.border, height], children: `footer.__jsx-style-dynamic-selector{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;overflow:hidden;width:100%;height:auto;position:absolute;bottom:0;left:0;right:0;border-top:1px solid ${theme.palette.border};border-bottom-left-radius:${theme.layout.radius};border-bottom-right-radius:${theme.layout.radius};}footer.__jsx-style-dynamic-selector>button.btn + button.btn{border-left:1px solid ${theme.palette.border};}div.__jsx-style-dynamic-selector{height:${height};-webkit-flex-shrink:0;-ms-flex-negative:0;flex-shrink:0;}` })
-  ] });
-};
-ModalActionsComponent.displayName = "BolioUIModalActions";
-var ModalActions = React3.memo(ModalActionsComponent);
-var ModalActions_default = ModalActions;
-
-// core/Modal/Modal.tsx
-import { jsx as jsx4, jsxs as jsxs4 } from "react/jsx-runtime";
-var ModalComponent = React4.forwardRef(
-  ({
-    visible: customVisible,
-    onClose,
-    children,
-    keyboard = true,
-    wrapClassName = "",
-    onContentClick,
-    disableBackdropClick = false,
-    positionClassName = "",
-    backdropClassName = "",
-    layerClassName = "",
-    role = "dialog",
-    "aria-label": ariaLabel,
-    "aria-labelledby": ariaLabelledby,
-    "aria-describedby": ariaDescribedby
-  }, ref) => {
-    const portal = use_portal_default("modal");
-    const baseId = useId();
-    const titleId = `${baseId}-title`;
-    const descriptionId = `${baseId}-description`;
-    const { SCALES } = use_scale_default();
-    const [, setBodyHidden] = use_body_scroll_default(null, { delayReset: 300 });
-    const [visible, setVisible] = useState2(false);
-    const [withoutActionsChildren, ActionsChildren] = pickChild(
-      children,
-      ModalAction_default
-    );
-    const hasActions = ActionsChildren && React4.Children.count(ActionsChildren) > 0;
-    const closeModal = useCallback(() => {
-      if (onClose) onClose();
-      setVisible(false);
-      setBodyHidden(false);
-    }, [onClose, setBodyHidden]);
-    useEffect3(() => {
-      if (typeof customVisible === "undefined") return;
-      setVisible(customVisible);
-      setBodyHidden(customVisible);
-    }, [customVisible, setBodyHidden]);
-    const { bindings } = use_keyboard_default(
-      () => {
-        if (keyboard) closeModal();
-      },
-      27 /* Escape */,
-      {
-        disableGlobalEvent: true
-      }
-    );
-    const closeFromBackdrop = () => {
-      if (disableBackdropClick) return;
-      closeModal();
-    };
-    const modalConfig = useMemo2(
-      () => ({
-        close: closeModal,
-        titleId,
-        descriptionId
-      }),
-      [closeModal, titleId, descriptionId]
-    );
-    if (!portal) return null;
-    return createPortal(
-      /* @__PURE__ */ jsx4(ModalContext.Provider, { value: modalConfig, children: /* @__PURE__ */ jsx4(
-        backdrop_default,
-        {
-          onClick: closeFromBackdrop,
-          onContentClick,
-          visible,
-          width: SCALES.width(26),
-          positionClassName,
-          backdropClassName,
-          layerClassName,
-          ...bindings,
-          children: /* @__PURE__ */ jsxs4(
-            ModalWrapper_default,
-            {
-              ref,
-              visible,
-              className: wrapClassName,
-              role,
-              "aria-label": ariaLabel,
-              "aria-labelledby": ariaLabelledby || (hasChild(children, ModalTitle_default) ? titleId : void 0),
-              "aria-describedby": ariaDescribedby || (hasChild(children, ModalSubtitle_default) ? descriptionId : void 0),
-              children: [
-                withoutActionsChildren,
-                hasActions && /* @__PURE__ */ jsx4(ModalActions_default, { children: ActionsChildren })
-              ]
-            }
-          )
-        }
-      ) }),
-      portal
-    );
-  }
-);
-ModalComponent.displayName = "BolioUIModal";
-var Modal = with_scale_default(ModalComponent);
-var Modal_default = Modal;
-
-// core/Modal/index.ts
-Modal_default.Title = ModalTitle_default;
-Modal_default.Subtitle = ModalSubtitle_default;
-Modal_default.Content = ModalContent_default;
-Modal_default.Action = ModalAction_default;
-var Modal_default2 = Modal_default;
-
-export {
-  Modal_default2 as Modal_default
-};

package/esm/chunk-ZNNLYTW5.js

@@ -1,64 +0,0 @@
-import {
-  use_scale_default,
-  with_scale_default
-} from "./chunk-S62PPQHN.js";
-import {
-  use_theme_default
-} from "./chunk-45MVPPJN.js";
-import {
-  use_classes_default
-} from "./chunk-5KUROAEP.js";
-
-// core/Divider/Divider.tsx
-import _JSXStyle from "styled-jsx/style";
-import React, { useMemo } from "react";
-import { jsx, jsxs } from "react/jsx-runtime";
-var getColor = (type, palette) => {
-  const colors = {
-    default: palette.border,
-    primary: palette.primaryLight,
-    secondary: palette.secondaryLight,
-    success: palette.successLight,
-    warning: palette.warningLight,
-    error: palette.errorLight,
-    info: palette.infoLight,
-    dark: palette.foreground,
-    lite: palette.accents_1
-  };
-  return colors[type];
-};
-var DividerComponent = React.forwardRef(({
-  type = "default",
-  align = "center",
-  children,
-  className = "",
-  ...props
-}, ref) => {
-  const theme = use_theme_default();
-  const {
-    SCALES
-  } = use_scale_default();
-  const classes = use_classes_default("divider", className);
-  const color = useMemo(() => getColor(type, theme.palette), [type, theme.palette]);
-  const alignClassName = useMemo(() => {
-    if (!align || align === "center") return "";
-    if (align === "left" || align === "start") return "start";
-    return "end";
-  }, [align]);
-  const alignClasses = use_classes_default("text", alignClassName);
-  const textColor = type === "default" ? theme.palette.foreground : color;
-  return /* @__PURE__ */ jsxs("div", { ref, role: "separator", ...props, className: _JSXStyle.dynamic([["1488853092", [color, SCALES.font(1), SCALES.width(1, "auto"), SCALES.height(0.0625), SCALES.pt(0), SCALES.pr(0), SCALES.pb(0), SCALES.pl(0), SCALES.mt(0.5), SCALES.mr(0), SCALES.mb(0.5), SCALES.ml(0), theme.palette.background, textColor]]]) + " " + (props && props.className != null && props.className || classes || ""), children: [
-    children && /* @__PURE__ */ jsx("span", { className: _JSXStyle.dynamic([["1488853092", [color, SCALES.font(1), SCALES.width(1, "auto"), SCALES.height(0.0625), SCALES.pt(0), SCALES.pr(0), SCALES.pb(0), SCALES.pl(0), SCALES.mt(0.5), SCALES.mr(0), SCALES.mb(0.5), SCALES.ml(0), theme.palette.background, textColor]]]) + " " + (alignClasses || ""), children }),
-    /* @__PURE__ */ jsx(_JSXStyle, { id: "1488853092", dynamic: [color, SCALES.font(1), SCALES.width(1, "auto"), SCALES.height(0.0625), SCALES.pt(0), SCALES.pr(0), SCALES.pb(0), SCALES.pl(0), SCALES.mt(0.5), SCALES.mr(0), SCALES.mb(0.5), SCALES.ml(0), theme.palette.background, textColor], children: `.divider.__jsx-style-dynamic-selector{max-width:100%;background-color:${color};position:relative;font-size:${SCALES.font(1)};width:${SCALES.width(1, "auto")};height:${SCALES.height(0.0625)};padding:${SCALES.pt(0)} ${SCALES.pr(0)} ${SCALES.pb(0)} ${SCALES.pl(0)};margin:${SCALES.mt(0.5)} ${SCALES.mr(0)} ${SCALES.mb(0.5)} ${SCALES.ml(0)};}.text.__jsx-style-dynamic-selector{position:absolute;left:50%;top:50%;min-height:100%;display:-webkit-inline-box;display:-webkit-inline-flex;display:-ms-inline-flexbox;display:inline-flex;-webkit-box-pack:center;-webkit-justify-content:center;-ms-flex-pack:center;justify-content:center;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-transform:translate(-50%,-50%);-ms-transform:translate(-50%,-50%);transform:translate(-50%,-50%);padding:0 0.75em;font-size:inherit;font-weight:bold;text-transform:capitalize;background-color:${theme.palette.background};color:${textColor};z-index:10;}.text.start.__jsx-style-dynamic-selector{-webkit-transform:translateY(-50%);-ms-transform:translateY(-50%);transform:translateY(-50%);left:7%;}.text.end.__jsx-style-dynamic-selector{-webkit-transform:translateY(-50%);-ms-transform:translateY(-50%);transform:translateY(-50%);left:auto;right:7%;}` })
-  ] });
-});
-DividerComponent.displayName = "BolioUIDivider";
-var Divider = with_scale_default(DividerComponent);
-var Divider_default = Divider;
-
-// core/Divider/index.ts
-var Divider_default2 = Divider_default;
-
-export {
-  Divider_default2 as Divider_default
-};