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

package/dist/chunk-UEWD6OUC.js

@@ -0,0 +1,137 @@
+"use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+
+var _chunkS62PPQHNjs = require('./chunk-S62PPQHN.js');
+
+
+var _chunk45MVPPJNjs = require('./chunk-45MVPPJN.js');
+
+// core/Text/Text.tsx
+var _react = require('react'); var _react2 = _interopRequireDefault(_react);
+
+// core/Text/Child.tsx
+var _style = require('styled-jsx/style'); var _style2 = _interopRequireDefault(_style);
+
+var _jsxruntime = require('react/jsx-runtime');
+var getTypeColor = (type, palette) => {
+  const colors = {
+    default: "inherit",
+    primary: palette.primary,
+    secondary: palette.secondary,
+    success: palette.success,
+    warning: palette.warning,
+    error: palette.error,
+    info: palette.info
+  };
+  return colors[type] || colors.default;
+};
+var TextChild = _react2.default.forwardRef(({
+  children,
+  tag,
+  className = "",
+  type = "default",
+  ...props
+}, ref) => {
+  const Component = tag;
+  const theme = _chunk45MVPPJNjs.use_theme_default.call(void 0, );
+  const {
+    SCALES,
+    getScaleProps
+  } = _chunkS62PPQHNjs.use_scale_default.call(void 0, );
+  const font = getScaleProps("font");
+  const mx = getScaleProps(["margin", "marginLeft", "marginRight", "mx", "ml", "mr"]);
+  const my = getScaleProps(["margin", "marginTop", "marginBottom", "my", "mt", "mb"]);
+  const px = getScaleProps(["padding", "paddingLeft", "paddingRight", "pl", "pr", "px"]);
+  const py = getScaleProps(["padding", "paddingTop", "paddingBottom", "pt", "pb", "py"]);
+  const color = _react.useMemo.call(void 0, () => getTypeColor(type, theme.palette), [type, theme.palette]);
+  const classNames = _react.useMemo.call(void 0, () => {
+    const keys = [{
+      value: mx,
+      className: "mx"
+    }, {
+      value: my,
+      className: "my"
+    }, {
+      value: px,
+      className: "px"
+    }, {
+      value: py,
+      className: "py"
+    }, {
+      value: font,
+      className: "font"
+    }];
+    const scaleClassNames = keys.reduce((pre, next) => {
+      if (typeof next.value === "undefined") return pre;
+      return `${pre} ${next.className}`;
+    }, "");
+    return `${scaleClassNames} ${className}`.trim();
+  }, [mx, my, px, py, font, className]);
+  return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, Component, { ref, ...props, className: _style2.default.dynamic([["674408519", [tag, color, SCALES.width(1, "auto"), SCALES.height(1, "auto"), SCALES.font(1, "inherit"), SCALES.ml(0, "revert"), SCALES.mr(0, "revert"), SCALES.mt(0, "revert"), SCALES.mb(0, "revert"), SCALES.pl(0, "revert"), SCALES.pr(0, "revert"), SCALES.pt(0, "revert"), SCALES.pb(0, "revert")]]]) + " " + (props && props.className != null && props.className || classNames || ""), children: [
+    children,
+    /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _style2.default, { id: "674408519", dynamic: [tag, color, SCALES.width(1, "auto"), SCALES.height(1, "auto"), SCALES.font(1, "inherit"), SCALES.ml(0, "revert"), SCALES.mr(0, "revert"), SCALES.mt(0, "revert"), SCALES.mb(0, "revert"), SCALES.pl(0, "revert"), SCALES.pr(0, "revert"), SCALES.pt(0, "revert"), SCALES.pb(0, "revert")], children: `${tag}.__jsx-style-dynamic-selector{color:${color};width:${SCALES.width(1, "auto")};height:${SCALES.height(1, "auto")};}.font.__jsx-style-dynamic-selector{font-size:${SCALES.font(1, "inherit")};}.mx.__jsx-style-dynamic-selector{margin-left:${SCALES.ml(0, "revert")};margin-right:${SCALES.mr(0, "revert")};}.my.__jsx-style-dynamic-selector{margin-top:${SCALES.mt(0, "revert")};margin-bottom:${SCALES.mb(0, "revert")};}.px.__jsx-style-dynamic-selector{padding-left:${SCALES.pl(0, "revert")};padding-right:${SCALES.pr(0, "revert")};}.py.__jsx-style-dynamic-selector{padding-top:${SCALES.pt(0, "revert")};padding-bottom:${SCALES.pb(0, "revert")};}` })
+  ] });
+});
+TextChild.displayName = "BolioUITextChild";
+var Child_default = TextChild;
+
+// core/Text/Text.tsx
+
+var getModifierChild = (tags, children) => {
+  if (!tags.length) return children;
+  const nextTag = tags.slice(1, tags.length);
+  return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, Child_default, { tag: tags[0], children: getModifierChild(nextTag, children) });
+};
+var TextComponent = _react2.default.forwardRef(
+  ({
+    h1 = false,
+    h2 = false,
+    h3 = false,
+    h4 = false,
+    h5 = false,
+    h6 = false,
+    p = false,
+    b = false,
+    small = false,
+    i = false,
+    span = false,
+    del = false,
+    em = false,
+    blockquote = false,
+    children,
+    className = "",
+    ...props
+  }, ref) => {
+    const elements = { h1, h2, h3, h4, h5, h6, p, blockquote };
+    const inlineElements = { span, small, b, em, i, del };
+    const names = Object.keys(elements).filter(
+      (name) => elements[name]
+    );
+    const inlineNames = Object.keys(inlineElements).filter(
+      (name) => inlineElements[name]
+    );
+    const tag = _react.useMemo.call(void 0, () => {
+      if (names[0]) return names[0];
+      if (inlineNames[0]) return inlineNames[0];
+      return "p";
+    }, [names, inlineNames]);
+    const renderableChildElements = inlineNames.filter(
+      (name) => name !== tag
+    );
+    const modifers = _react.useMemo.call(void 0, () => {
+      if (!renderableChildElements.length) return children;
+      return getModifierChild(renderableChildElements, children);
+    }, [renderableChildElements, children]);
+    return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, Child_default, { ref, className, tag, ...props, children: modifers });
+  }
+);
+TextComponent.displayName = "BolioUIText";
+var Text = _chunkS62PPQHNjs.with_scale_default.call(void 0, TextComponent);
+var Text_default = Text;
+
+// core/Text/index.ts
+var Text_default2 = Text_default;
+
+
+
+exports.Text_default = Text_default2;

package/dist/chunk-UF4IKEU2.js

@@ -0,0 +1,17 @@
+"use strict";Object.defineProperty(exports, "__esModule", {value: true});// core/utils/calculations.ts
+var _react = require('react');
+var getProportions = (value, max, maxFixed = 2) => {
+  const val = value / max;
+  const couldBeDecimalValue = (Number.isNaN(val) ? 0 : val) * 100;
+  if (couldBeDecimalValue > 100) return 100;
+  if (couldBeDecimalValue < 0) return 0;
+  if (!`${couldBeDecimalValue}`.includes(".")) return couldBeDecimalValue;
+  const decimal = `${couldBeDecimalValue}`.split(".")[1];
+  if (decimal.length < maxFixed) return couldBeDecimalValue;
+  return +couldBeDecimalValue.toFixed(maxFixed);
+};
+var useProportions = (value, max, maxFixed = 2) => _react.useMemo.call(void 0, () => getProportions(value, max, maxFixed), [value, max, maxFixed]);
+
+
+
+exports.useProportions = useProportions;

package/dist/chunk-UVCSH6DW.js

@@ -0,0 +1,16 @@
+"use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+var _chunkVCTKX4ASjs = require('./chunk-VCTKX4AS.js');
+
+// core/use-all-themes/all-themes-context.ts
+var _react = require('react'); var _react2 = _interopRequireDefault(_react);
+var defaultAllThemesConfig = {
+  themes: _chunkVCTKX4ASjs.Themes_default.getPresets()
+};
+var AllThemesContext = _react2.default.createContext(defaultAllThemesConfig);
+var useAllThemes = () => _react2.default.useContext(AllThemesContext);
+
+
+
+
+exports.AllThemesContext = AllThemesContext; exports.useAllThemes = useAllThemes;

package/dist/chunk-UX2B3G6U.js

@@ -0,0 +1,106 @@
+"use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }// core/utils/collections.ts
+var _react = require('react'); var _react2 = _interopRequireDefault(_react);
+var getId = () => {
+  return Math.random().toString(32).slice(2, 10);
+};
+var hasChild = (children, child) => {
+  const types = _react2.default.Children.map(children, (item) => {
+    if (!_react2.default.isValidElement(item)) return null;
+    return item.type;
+  });
+  return (types || []).includes(child);
+};
+var pickChild = (children, targetChild) => {
+  const target = [];
+  const withoutTargetChildren = _react2.default.Children.map(children, (item) => {
+    if (!_react2.default.isValidElement(item)) return item;
+    if (item.type === targetChild) {
+      target.push(item);
+      return null;
+    }
+    return item;
+  });
+  const targetChildren = target.length >= 0 ? target : void 0;
+  return [withoutTargetChildren, targetChildren];
+};
+var pickChildByProps = (children, key, value) => {
+  const target = [];
+  const isArray = Array.isArray(value);
+  const withoutPropChildren = _react2.default.Children.map(children, (item) => {
+    if (!_react2.default.isValidElement(item)) return null;
+    if (!item.props) return item;
+    if (isArray) {
+      if (value.includes(item.props[key])) {
+        target.push(item);
+        return null;
+      }
+      return item;
+    }
+    if (item.props[key] === value) {
+      target.push(item);
+      return null;
+    }
+    return item;
+  });
+  const targetChildren = target.length >= 0 ? target : void 0;
+  return [withoutPropChildren, targetChildren];
+};
+var setChildrenIndex = (children, targetComponents = []) => {
+  if (_react2.default.Children.count(children) === 0) return [];
+  const allowAll = targetComponents.length === 0;
+  const clone = (child, props = {}) => _react2.default.cloneElement(child, props);
+  let index = 0;
+  return _react2.default.Children.map(children, (item) => {
+    if (!_react2.default.isValidElement(item)) return item;
+    index = index + 1;
+    if (allowAll) return clone(item, { index });
+    const isAllowed = targetComponents.find((child) => child === item.type);
+    if (isAllowed) return clone(item, { index });
+    index = index - 1;
+    return item;
+  });
+};
+var getReactNode = (node) => {
+  if (!node) return null;
+  if (typeof node !== "function") return node;
+  return node();
+};
+var isChildElement = (parent, child) => {
+  if (!parent || !child) return false;
+  let node = child;
+  while (node) {
+    if (node === parent) return true;
+    node = node.parentNode;
+  }
+  return false;
+};
+var isBolioUIElement = (el) => {
+  if (!el) return false;
+  if ((el == null ? void 0 : el.dataset) && (el == null ? void 0 : el.dataset["bolio-ui"])) return true;
+  el.attributes.getNamedItem("data-bolio-ui");
+  return !!el.attributes.getNamedItem("data-bolio-ui");
+};
+var isBrowser = () => {
+  return Boolean(
+    typeof window !== "undefined" && window.document && window.document.createElement
+  );
+};
+var isMac = () => {
+  if (!isBrowser()) return false;
+  return navigator.platform.toUpperCase().indexOf("MAC") >= 0;
+};
+var isCSSNumberValue = (value) => value !== void 0 && !Number.isNaN(+value);
+
+
+
+
+
+
+
+
+
+
+
+
+
+exports.getId = getId; exports.hasChild = hasChild; exports.pickChild = pickChild; exports.pickChildByProps = pickChildByProps; exports.setChildrenIndex = setChildrenIndex; exports.getReactNode = getReactNode; exports.isChildElement = isChildElement; exports.isBolioUIElement = isBolioUIElement; exports.isBrowser = isBrowser; exports.isMac = isMac; exports.isCSSNumberValue = isCSSNumberValue;

package/dist/chunk-V57PNXMD.js

@@ -0,0 +1,14 @@
+"use strict";Object.defineProperty(exports, "__esModule", {value: true});// core/utils/use-click-anywhere.ts
+var _react = require('react');
+var useClickAnyWhere = (handler) => {
+  _react.useEffect.call(void 0, () => {
+    const callback = (event) => handler(event);
+    document.addEventListener("click", callback);
+    return () => document.removeEventListener("click", callback);
+  }, [handler]);
+};
+var use_click_anywhere_default = useClickAnyWhere;
+
+
+
+exports.use_click_anywhere_default = use_click_anywhere_default;

package/dist/chunk-VCTKX4AS.js

@@ -0,0 +1,247 @@
+"use strict";Object.defineProperty(exports, "__esModule", {value: true});// core/Themes/Presets/Shared.ts
+var defaultFont = {
+  sans: '"Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif',
+  mono: "Menlo, Monaco, Lucida Console, Liberation Mono, DejaVu Sans Mono, Bitstream Vera Sans Mono, Courier New, monospace",
+  prism: 'ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas,"Liberation Mono", "Courier New", monospace'
+};
+var defaultBreakpoints = {
+  xs: {
+    min: "0",
+    max: "650px"
+  },
+  sm: {
+    min: "650px",
+    max: "900px"
+  },
+  md: {
+    min: "900px",
+    max: "1280px"
+  },
+  lg: {
+    min: "1280px",
+    max: "1920px"
+  },
+  xl: {
+    min: "1920px",
+    max: "10000px"
+  }
+};
+var defaultLayout = {
+  gap: "16pt",
+  gapNegative: "-16pt",
+  gapHalf: "8pt",
+  gapHalfNegative: "-8pt",
+  gapQuarter: "4pt",
+  gapQuarterNegative: "-4pt",
+  pageMargin: "16pt",
+  pageWidth: "900pt",
+  pageWidthWithMargin: "930pt",
+  breakpointMobile: defaultBreakpoints.xs.max,
+  breakpointTablet: defaultBreakpoints.sm.max,
+  radius: "10px",
+  unit: "16px"
+};
+
+// core/Themes/Presets/Default.ts
+var palette = {
+  background: "#fff",
+  foreground: "#000",
+  accents_1: "#fafafa",
+  accents_2: "#eaeaea",
+  accents_3: "#999",
+  accents_4: "#888",
+  accents_5: "#666",
+  accents_6: "#444",
+  accents_7: "#333",
+  accents_8: "#111",
+  selection: "rgba(206,228,254, 0.5)",
+  code: "#C25FFF",
+  border: "#eaeaea",
+  primary: "#60A5FA",
+  primaryLight: "#D7E9FE",
+  primaryLighter: "#A6CDFC",
+  primaryDark: "#03346F",
+  secondary: "#A78BFA",
+  secondaryLight: "#E1D8FD",
+  secondaryLighter: "#BCA7FB",
+  secondaryDark: "#23057B",
+  error: "#F87171",
+  errorLight: "#FDD8D8",
+  errorLighter: "#FBA8A8",
+  errorDark: "#720606",
+  success: "#4ADE80",
+  successLight: "#DCF9E7",
+  successLighter: "#B1F1C9",
+  successDark: "#0F5328",
+  warning: "#FFD666",
+  warningLight: "#FFF4D6",
+  warningLighter: "#FFE6A3",
+  warningDark: "#765600",
+  info: "#FF6A3D",
+  infoLight: "#FFE0D6",
+  infoLighter: "#FFB8A3",
+  infoDark: "#681800",
+  purple: "#F472B6",
+  alert: "#ff0080",
+  link: "#0070f3",
+  pre: "#363450"
+};
+var expressiveness = {
+  linkStyle: "none",
+  linkHoverStyle: "none",
+  dropdownBoxShadow: "0 4px 4px 0 rgba(0, 0, 0, 0.02)",
+  scrollerStart: "rgba(255, 255, 255, 1)",
+  scrollerEnd: "rgba(255, 255, 255, 0)",
+  shadowSmall: "0 5px 10px rgba(0, 0, 0, 0.12)",
+  shadowMedium: "0 8px 30px rgba(0, 0, 0, 0.12)",
+  shadowLarge: "0 30px 60px rgba(0, 0, 0, 0.12)",
+  portalOpacity: 0.25
+};
+var font = defaultFont;
+var breakpoints = defaultBreakpoints;
+var layout = defaultLayout;
+var themes = {
+  type: "light",
+  font,
+  layout,
+  palette,
+  breakpoints,
+  expressiveness
+};
+var Default_default = themes;
+
+// core/Themes/Presets/Dark.ts
+var palette2 = {
+  background: "#08090c",
+  foreground: "#fff",
+  accents_1: "#0d0e12",
+  accents_2: "#101216",
+  accents_3: "#171a20",
+  accents_4: "#23262e",
+  accents_5: "#757b88",
+  accents_6: "#7e838d",
+  accents_7: "#9aa0aa",
+  accents_8: "#f2f3f5",
+  selection: "rgba(248,28,229, 0.5)",
+  code: "#C25FFF",
+  border: "#101216",
+  primary: "#60A5FA",
+  primaryLight: "#D7E9FE",
+  primaryLighter: "#A6CDFC",
+  primaryDark: "#03346F",
+  secondary: "#A78BFA",
+  secondaryLight: "#E1D8FD",
+  secondaryLighter: "#BCA7FB",
+  secondaryDark: "#23057B",
+  error: "#F87171",
+  errorLight: "#FDD8D8",
+  errorLighter: "#FBA8A8",
+  errorDark: "#720606",
+  success: "#4ADE80",
+  successLight: "#DCF9E7",
+  successLighter: "#B1F1C9",
+  successDark: "#0F5328",
+  warning: "#FFD666",
+  warningLight: "#FFF4D6",
+  warningLighter: "#FFE6A3",
+  warningDark: "#765600",
+  info: "#FF6A3D",
+  infoLight: "#FFE0D6",
+  infoLighter: "#FFB8A3",
+  infoDark: "#681800",
+  purple: "#F472B6",
+  alert: "#ff0080",
+  link: "#3291ff",
+  pre: "#0d0e12"
+};
+var expressiveness2 = {
+  linkStyle: "none",
+  linkHoverStyle: "none",
+  dropdownBoxShadow: "0 0 0 1px #101216",
+  scrollerStart: "rgba(255, 255, 255, 1)",
+  scrollerEnd: "rgba(255, 255, 255, 0)",
+  shadowSmall: "0 5px 10px rgba(0, 0, 0, 0.3)",
+  shadowMedium: "0 8px 30px rgba(0, 0, 0, 0.35)",
+  shadowLarge: "0 30px 60px rgba(0, 0, 0, 0.45)",
+  portalOpacity: 0.75
+};
+var font2 = defaultFont;
+var breakpoints2 = defaultBreakpoints;
+var layout2 = defaultLayout;
+var themes2 = {
+  type: "dark",
+  font: font2,
+  layout: layout2,
+  palette: palette2,
+  breakpoints: breakpoints2,
+  expressiveness: expressiveness2
+};
+var Dark_default = themes2;
+
+// core/Themes/Themes.ts
+var isObject = (target) => target && typeof target === "object";
+var deepDuplicable = (source, target) => {
+  if (!isObject(target) || !isObject(source)) return source;
+  const sourceKeys = Object.keys(source);
+  const result = {};
+  for (const key of sourceKeys) {
+    const sourceValue = source[key];
+    const targetValue = target[key];
+    if (Array.isArray(sourceValue) && Array.isArray(targetValue)) {
+      result[key] = targetValue.concat(sourceValue);
+    } else if (isObject(sourceValue) && isObject(targetValue)) {
+      result[key] = deepDuplicable(sourceValue, {
+        ...targetValue
+      });
+    } else if (targetValue) {
+      result[key] = targetValue;
+    } else {
+      result[key] = sourceValue;
+    }
+  }
+  return result;
+};
+var getPresets = () => {
+  return [Default_default, Dark_default];
+};
+var getPresetStaticTheme = () => {
+  return Default_default;
+};
+var isAvailableThemeType = (type) => {
+  if (!type) return false;
+  const presetThemes = getPresets();
+  const hasType = presetThemes.find((theme) => theme.type === type);
+  return !hasType;
+};
+var isPresetTheme = (themeOrType) => {
+  if (!themeOrType) return false;
+  const isType = typeof themeOrType === "string";
+  const type = isType ? themeOrType : themeOrType.type;
+  return !isAvailableThemeType(type);
+};
+var hasUserCustomTheme = (themes3 = []) => {
+  return !!themes3.find((item) => isAvailableThemeType(item.type));
+};
+var create = (base, custom) => {
+  if (!isAvailableThemeType(custom.type)) {
+    throw new Error("Duplicate or unavailable theme type");
+  }
+  return deepDuplicable(base, custom);
+};
+var createFromDark = (custom) => create(Dark_default, custom);
+var createFromLight = (custom) => create(Default_default, custom);
+var Themes = {
+  isPresetTheme,
+  isAvailableThemeType,
+  hasUserCustomTheme,
+  getPresets,
+  getPresetStaticTheme,
+  create,
+  createFromDark,
+  createFromLight
+};
+var Themes_default = Themes;
+
+
+
+exports.Themes_default = Themes_default;

package/dist/chunk-W4T2KO5B.js

@@ -0,0 +1,129 @@
+"use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+var _chunk3XTTDT42js = require('./chunk-3XTTDT42.js');
+
+
+var _chunkRZBEZ26Ajs = require('./chunk-RZBEZ26A.js');
+
+
+
+var _chunkS62PPQHNjs = require('./chunk-S62PPQHN.js');
+
+
+var _chunkUX2B3G6Ujs = require('./chunk-UX2B3G6U.js');
+
+
+var _chunk45MVPPJNjs = require('./chunk-45MVPPJN.js');
+
+
+var _chunk5KUROAEPjs = require('./chunk-5KUROAEP.js');
+
+// core/Breadcrumbs/Breadcrumbs.tsx
+var _style = require('styled-jsx/style'); var _style2 = _interopRequireDefault(_style);
+var _react = require('react'); var _react2 = _interopRequireDefault(_react);
+
+// core/Breadcrumbs/BreadcrumbsSeparator.tsx
+
+var _jsxruntime = require('react/jsx-runtime');
+function Separator({
+  children,
+  className = ""
+}) {
+  const {
+    SCALES
+  } = _chunkS62PPQHNjs.use_scale_default.call(void 0, );
+  const classes = _chunk5KUROAEPjs.use_classes_default.call(void 0, "separator", className);
+  return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: _style2.default.dynamic([["2295921440", [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.5), SCALES.mb(0), SCALES.ml(0.5)]]]) + " " + (classes || ""), children: [
+    children,
+    /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _style2.default, { id: "2295921440", dynamic: [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.5), SCALES.mb(0), SCALES.ml(0.5)], children: `.separator.__jsx-style-dynamic-selector{display:-webkit-inline-box;display:-webkit-inline-flex;display:-ms-inline-flexbox;display:inline-flex;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;pointer-events:none;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;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.5)} ${SCALES.mb(0)} ${SCALES.ml(0.5)};}` })
+  ] });
+}
+Separator.displayName = "BolioUIBreadcrumbsSeparator";
+var BreadcrumbsSeparator = _chunkS62PPQHNjs.with_scale_default.call(void 0, Separator);
+var BreadcrumbsSeparator_default = BreadcrumbsSeparator;
+
+// core/Breadcrumbs/Breadcrumbs.tsx
+
+var BreadcrumbsComponent = _react2.default.forwardRef(({
+  separator = "/",
+  children,
+  className = ""
+}, ref) => {
+  const theme = _chunk45MVPPJNjs.use_theme_default.call(void 0, );
+  const {
+    SCALES
+  } = _chunkS62PPQHNjs.use_scale_default.call(void 0, );
+  const hoverColor = _react.useMemo.call(void 0, () => {
+    return _chunkRZBEZ26Ajs.addColorAlpha.call(void 0, theme.palette.link, 0.85);
+  }, [theme.palette.link]);
+  const childrenArray = _react2.default.Children.toArray(children);
+  const withSeparatorChildren = childrenArray.map((item, index) => {
+    if (!_react2.default.isValidElement(item)) return item;
+    const last = childrenArray[index - 1];
+    const lastIsSeparator = _react2.default.isValidElement(last) && last.type === BreadcrumbsSeparator_default;
+    const currentIsSeparator = item.type === BreadcrumbsSeparator_default;
+    if (!lastIsSeparator && !currentIsSeparator && index > 0) {
+      return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _react2.default.Fragment, { children: [
+        /* @__PURE__ */ _jsxruntime.jsx.call(void 0, BreadcrumbsSeparator_default, { children: separator }),
+        item
+      ] }, index);
+    }
+    return item;
+  });
+  return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "nav", { ref, className: _style2.default.dynamic([["3435904432", [theme.palette.accents_5, 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), hoverColor, theme.palette.accents_7]]]) + " " + (className || ""), children: [
+    withSeparatorChildren,
+    /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _style2.default, { id: "3435904432", dynamic: [theme.palette.accents_5, 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), hoverColor, theme.palette.accents_7], children: `nav.__jsx-style-dynamic-selector{line-height:inherit;color:${theme.palette.accents_5};box-sizing:border-box;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;font-size:${SCALES.font(1)};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 .link:hover{color:${hoverColor};}nav.__jsx-style-dynamic-selector>span:last-of-type{color:${theme.palette.accents_7};}nav.__jsx-style-dynamic-selector>.separator:last-child{display:none;}nav.__jsx-style-dynamic-selector svg{width:1em;height:1em;margin:0 4px;}nav.__jsx-style-dynamic-selector .breadcrumbs-item{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;}` })
+  ] });
+});
+BreadcrumbsComponent.displayName = "BolioUIBreadcrumbs";
+var Breadcrumbs = _chunkS62PPQHNjs.with_scale_default.call(void 0, BreadcrumbsComponent);
+var Breadcrumbs_default = Breadcrumbs;
+
+// core/Breadcrumbs/BreadcrumbsItem.tsx
+
+
+var BreadcrumbsItem = _react2.default.forwardRef(
+  ({
+    href,
+    nextLink = false,
+    onClick,
+    children,
+    className = "",
+    ...props
+  }, ref) => {
+    const isLink = _react.useMemo.call(void 0, 
+      () => href !== void 0 || nextLink,
+      [href, nextLink]
+    );
+    const [withoutSepChildren] = _chunkUX2B3G6Ujs.pickChild.call(void 0, children, BreadcrumbsSeparator_default);
+    const classes = _chunk5KUROAEPjs.use_classes_default.call(void 0, "breadcrumbs-item", className);
+    const clickHandler = (event) => {
+      if (onClick) onClick(event);
+    };
+    if (!isLink) {
+      return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "span", { className: classes, onClick: clickHandler, children: withoutSepChildren });
+    }
+    return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+      _chunk3XTTDT42js.Link_default,
+      {
+        className: classes,
+        href,
+        onClick: clickHandler,
+        ref,
+        ...props,
+        children: withoutSepChildren
+      }
+    );
+  }
+);
+BreadcrumbsItem.displayName = "BolioUIBreadcrumbsItem";
+var BreadcrumbsItem_default = BreadcrumbsItem;
+
+// core/Breadcrumbs/index.ts
+Breadcrumbs_default.Item = BreadcrumbsItem_default;
+Breadcrumbs_default.Separator = BreadcrumbsSeparator_default;
+var Breadcrumbs_default2 = Breadcrumbs_default;
+
+
+
+exports.Breadcrumbs_default = Breadcrumbs_default2;