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

package/dist/chunk-OAMGJMK4.js

@@ -0,0 +1,210 @@
+"use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+
+var _chunkMAICNLTYjs = require('./chunk-MAICNLTY.js');
+
+
+var _chunkV5I4ORQQjs = require('./chunk-V5I4ORQQ.js');
+
+
+var _chunk5KUROAEPjs = require('./chunk-5KUROAEP.js');
+
+// core/Rating/Rating.tsx
+var _react = require('react'); var _react2 = _interopRequireDefault(_react);
+
+// core/Rating/RatingIcon.tsx
+var _jsxruntime = require('react/jsx-runtime');
+function RatingIcon() {
+  return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+    "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__ */ _jsxruntime.jsx.call(void 0, "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;
+
+// css-module-source:/Users/brunnoandrade/Desktop/BolioUI/bolio-ui/core/Rating/Rating.module.css.bolio-css-module-source
+var Rating_module_css_default = { "rating": "Rating-module_rating__7siaT", "disabled": "Rating-module_disabled__of-BG", "item": "Rating-module_item__GfEIM", "layer": "Rating-module_layer__B7f3-", "empty": "Rating-module_empty__nUE0G", "filled": "Rating-module_filled__uPLdj", "hit": "Rating-module_hit__WMP3G", "half": "Rating-module_half__xqWUq", "full": "Rating-module_full__dcRIA", "input": "Rating-module_input__MLAsw" };
+
+// core/Rating/Rating.tsx
+
+var defaultGetLabel = (value, count) => `${value} of ${count}`;
+var RatingComponent = _react2.default.forwardRef(
+  ({
+    type = "default",
+    variant = "outline",
+    className = "",
+    icon = /* @__PURE__ */ _jsxruntime.jsx.call(void 0, RatingIcon_default, {}),
+    emptyIcon,
+    count = 5,
+    value: customValue,
+    initialValue = 0,
+    onChange,
+    onHoverChange,
+    precision = 1,
+    readOnly = false,
+    disabled = false,
+    clearable = false,
+    highlightSelectedOnly = false,
+    getLabel = defaultGetLabel,
+    style,
+    ...props
+  }, ref) => {
+    const theme = _chunkV5I4ORQQjs.use_theme_default.call(void 0, );
+    const { SCALES } = _chunkMAICNLTYjs.use_scale_default.call(void 0, );
+    const name = _react.useId.call(void 0, );
+    const [selfValue, setSelfValue] = _react.useState.call(void 0, initialValue);
+    const [hovered, setHovered] = _react.useState.call(void 0, null);
+    const round = (next) => Math.min(Math.max(Math.round(next / precision) * precision, 0), count);
+    const value = round(customValue !== void 0 ? customValue : selfValue);
+    const shown = hovered != null ? hovered : value;
+    const interactive = !readOnly && !disabled;
+    const palette = theme.palette;
+    const colors = {
+      default: palette.warning,
+      primary: palette.primary,
+      secondary: palette.secondary,
+      success: palette.success,
+      warning: palette.warning,
+      error: palette.error,
+      info: palette.info
+    };
+    const commit = (next) => {
+      if (customValue === void 0) setSelfValue(next);
+      if (onChange) onChange(next);
+    };
+    const hover = (next) => {
+      if (next === hovered) return;
+      setHovered(next);
+      if (onHoverChange) onHoverChange(next);
+    };
+    const fillOf = (index) => {
+      if (highlightSelectedOnly) return Math.ceil(shown) === index ? 1 : 0;
+      return Math.min(Math.max(shown - (index - 1), 0), 1);
+    };
+    const steps = precision === 0.5 ? [0.5, 1] : [1];
+    const ratingStyle = {
+      "--rating-font-size": SCALES.font(1),
+      "--rating-color": colors[type] || colors.default,
+      "--rating-empty-color": variant === "filled" ? palette.accents_2 : palette.accents_4,
+      "--rating-empty-fill": variant === "filled" ? "currentColor" : "none",
+      "--rating-focus-outline": palette.primary,
+      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)}`,
+      ...style
+    };
+    const items = Array.from({ length: count }, (_, index) => index + 1);
+    const layers = (index) => /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _jsxruntime.Fragment, { children: [
+      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "span", { className: _chunk5KUROAEPjs.joinClasses.call(void 0, Rating_module_css_default.layer, Rating_module_css_default.empty), children: emptyIcon != null ? emptyIcon : icon }),
+      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+        "span",
+        {
+          className: _chunk5KUROAEPjs.joinClasses.call(void 0, Rating_module_css_default.layer, Rating_module_css_default.filled),
+          style: { clipPath: `inset(0 ${(1 - fillOf(index)) * 100}% 0 0)` },
+          children: icon
+        }
+      )
+    ] });
+    if (!interactive) {
+      return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+        "div",
+        {
+          ref,
+          role: "img",
+          "aria-label": getLabel(value, count),
+          "aria-disabled": disabled || void 0,
+          className: _chunk5KUROAEPjs.joinClasses.call(void 0, 
+            Rating_module_css_default.rating,
+            { [Rating_module_css_default.disabled]: disabled },
+            className
+          ),
+          ...props,
+          style: ratingStyle,
+          children: items.map((index) => /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "span", { className: Rating_module_css_default.item, "aria-hidden": "true", children: layers(index) }, index))
+        }
+      );
+    }
+    return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, 
+      "div",
+      {
+        ref,
+        role: "radiogroup",
+        className: _chunk5KUROAEPjs.joinClasses.call(void 0, Rating_module_css_default.rating, className),
+        onMouseLeave: () => hover(null),
+        ...props,
+        style: ratingStyle,
+        children: [
+          /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+            "input",
+            {
+              type: "radio",
+              className: Rating_module_css_default.input,
+              name,
+              value: 0,
+              checked: value === 0,
+              "aria-label": getLabel(0, count),
+              onChange: () => commit(0)
+            }
+          ),
+          items.map((index) => /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "span", { className: Rating_module_css_default.item, children: [
+            layers(index),
+            steps.map((step) => {
+              const stepValue = index - 1 + step;
+              return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+                "label",
+                {
+                  className: _chunk5KUROAEPjs.joinClasses.call(void 0, Rating_module_css_default.hit, {
+                    [Rating_module_css_default.half]: precision === 0.5 && step === 0.5,
+                    [Rating_module_css_default.full]: precision === 0.5 && step === 1
+                  }),
+                  onMouseEnter: () => hover(stepValue),
+                  children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+                    "input",
+                    {
+                      type: "radio",
+                      className: Rating_module_css_default.input,
+                      name,
+                      value: stepValue,
+                      checked: value === stepValue,
+                      "aria-label": getLabel(stepValue, count),
+                      onChange: () => commit(stepValue),
+                      onClick: () => {
+                        if (clearable && value === stepValue) commit(0);
+                      },
+                      onFocus: () => hover(stepValue),
+                      onBlur: () => hover(null)
+                    }
+                  )
+                },
+                step
+              );
+            })
+          ] }, index))
+        ]
+      }
+    );
+  }
+);
+RatingComponent.displayName = "BolioUIRating";
+var Rating = _chunkMAICNLTYjs.with_scale_default.call(void 0, RatingComponent);
+var Rating_default = Rating;
+
+// core/Rating/index.ts
+var Rating_default2 = Rating_default;
+
+
+
+exports.Rating_default = Rating_default2;

package/dist/chunk-PGQYW6YF.js

@@ -0,0 +1,245 @@
+"use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+
+
+
+
+var _chunkTKIUVNKPjs = require('./chunk-TKIUVNKP.js');
+
+
+var _chunkF3AL4TQZjs = require('./chunk-F3AL4TQZ.js');
+
+
+var _chunkLDTDMDE6js = require('./chunk-LDTDMDE6.js');
+
+
+var _chunkBXDUHMWSjs = require('./chunk-BXDUHMWS.js');
+
+
+
+var _chunkMAICNLTYjs = require('./chunk-MAICNLTY.js');
+
+
+var _chunkUX2B3G6Ujs = require('./chunk-UX2B3G6U.js');
+
+
+var _chunkV5I4ORQQjs = require('./chunk-V5I4ORQQ.js');
+
+
+var _chunk5KUROAEPjs = require('./chunk-5KUROAEP.js');
+
+// core/Drawer/Drawer.tsx
+var _react = require('react'); var _react2 = _interopRequireDefault(_react);
+var _reactdom = require('react-dom');
+
+// core/Drawer/DrawerWrapper.tsx
+
+
+// core/Drawer/helper.ts
+var getDrawerTransform = (placement) => {
+  const translates = {
+    top: {
+      initial: "translate3d(0, -100%, 0)",
+      hidden: "translate3d(0, -100%, 0)",
+      visible: "translate3d(0, 0, 0)"
+    },
+    left: {
+      initial: "translate3d(-100%, 0, 0)",
+      hidden: "translate3d(-100%, 0, 0)",
+      visible: "translate3d(0, 0, 0)"
+    },
+    bottom: {
+      initial: "translate3d(0, 100%, 0)",
+      hidden: "translate3d(0, 100%, 0)",
+      visible: "translate3d(0, 0, 0)"
+    },
+    right: {
+      initial: "translate3d(100%, 0, 0)",
+      hidden: "translate3d(100%, 0, 0)",
+      visible: "translate3d(0, 0, 0)"
+    }
+  };
+  return translates[placement];
+};
+
+// css-module-source:/Users/brunnoandrade/Desktop/BolioUI/bolio-ui/core/Drawer/DrawerWrapper.module.css.bolio-css-module-source
+var DrawerWrapper_module_css_default = { "wrapper": "DrawerWrapper-module_wrapper__fBKjA", "top": "DrawerWrapper-module_top__MiCoE", "bottom": "DrawerWrapper-module_bottom__P74aR", "left": "DrawerWrapper-module_left__6JjuW", "right": "DrawerWrapper-module_right__56-8q", "hideTab": "DrawerWrapper-module_hideTab__SgQrc" };
+
+// core/Drawer/DrawerWrapper.tsx
+var _jsxruntime = require('react/jsx-runtime');
+var placementClasses = {
+  top: DrawerWrapper_module_css_default.top,
+  left: DrawerWrapper_module_css_default.left,
+  bottom: DrawerWrapper_module_css_default.bottom,
+  right: DrawerWrapper_module_css_default.right
+};
+var DrawerWrapper = _react2.default.forwardRef(({ className = "", children, visible = false, placement, ...props }, ref) => {
+  const theme = _chunkV5I4ORQQjs.use_theme_default.call(void 0, );
+  const { SCALES } = _chunkMAICNLTYjs.use_scale_default.call(void 0, );
+  const modalContent = _react.useRef.call(void 0, null);
+  _react.useImperativeHandle.call(void 0, ref, () => modalContent.current);
+  const tabStart = _react.useRef.call(void 0, null);
+  const tabEnd = _react.useRef.call(void 0, null);
+  const transform = _react.useMemo.call(void 0, () => getDrawerTransform(placement), [placement]);
+  const classes = _chunk5KUROAEPjs.use_classes_default.call(void 0, 
+    DrawerWrapper_module_css_default.wrapper,
+    placementClasses[placement],
+    className
+  );
+  const wrapperStyle = {
+    backgroundColor: theme.palette.background,
+    color: theme.palette.foreground,
+    borderRadius: `calc(3 * ${theme.layout.radius})`,
+    boxShadow: theme.expressiveness.shadowLarge,
+    fontSize: SCALES.font(1),
+    "--drawer-wrapper-padding-left": SCALES.pl(1.3125),
+    "--drawer-wrapper-padding-right": SCALES.pr(1.3125),
+    padding: `${SCALES.pt(1.3125)} var(--drawer-wrapper-padding-right) ${SCALES.pb(1.3125)} var(--drawer-wrapper-padding-left)`,
+    margin: `${SCALES.mt(0)} ${SCALES.mr(0)} ${SCALES.mb(0)} ${SCALES.ml(0)}`,
+    "--drawer-wrapper-top-bottom-width": SCALES.width(1, "100%"),
+    "--drawer-wrapper-top-bottom-height": SCALES.height(1, "auto"),
+    "--drawer-wrapper-left-right-width": SCALES.width(1, "auto"),
+    "--drawer-wrapper-left-right-height": SCALES.height(1, "100%"),
+    "--drawer-wrapper-transform-initial": transform.initial,
+    "--drawer-wrapper-transform-hidden": transform.hidden,
+    "--drawer-wrapper-transform-visible": transform.visible
+  };
+  _react.useEffect.call(void 0, () => {
+    if (!visible) return;
+    const activeElement = document.activeElement;
+    const isChild = _chunkUX2B3G6Ujs.isChildElement.call(void 0, 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__ */ _jsxruntime.jsx.call(void 0, _chunkLDTDMDE6js.css_transition_default, { name: "wrapper", visible, clearTime: 300, children: /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, 
+    "div",
+    {
+      className: classes,
+      role: "dialog",
+      "aria-modal": "true",
+      tabIndex: -1,
+      onKeyDown,
+      ref: modalContent,
+      ...props,
+      style: wrapperStyle,
+      children: [
+        /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+          "div",
+          {
+            tabIndex: 0,
+            className: DrawerWrapper_module_css_default.hideTab,
+            "aria-hidden": "true",
+            ref: tabStart
+          }
+        ),
+        children,
+        /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+          "div",
+          {
+            tabIndex: 0,
+            className: DrawerWrapper_module_css_default.hideTab,
+            "aria-hidden": "true",
+            ref: tabEnd
+          }
+        )
+      ]
+    }
+  ) });
+});
+DrawerWrapper.displayName = "BolioUIDrawerWrapper";
+var DrawerWrapper_default = DrawerWrapper;
+
+// core/Drawer/Drawer.tsx
+
+var DrawerComponent = _react2.default.forwardRef(
+  ({
+    visible: customVisible,
+    keyboard = true,
+    disableBackdropClick,
+    wrapClassName,
+    children,
+    placement,
+    onClose,
+    onContentClick,
+    ...props
+  }, ref) => {
+    const portal = _chunkBXDUHMWSjs.use_portal_default.call(void 0, "drawer");
+    const [visible, setVisible] = _react.useState.call(void 0, false);
+    const [, setBodyHidden] = _chunkTKIUVNKPjs.use_body_scroll_default.call(void 0, null, { delayReset: 300 });
+    const closeDrawer = () => {
+      if (onClose) onClose();
+      setVisible(false);
+      setBodyHidden(false);
+    };
+    _react.useEffect.call(void 0, () => {
+      if (typeof customVisible === "undefined") return;
+      setVisible(customVisible);
+      setBodyHidden(customVisible);
+    }, [customVisible, setBodyHidden]);
+    const { bindings } = _chunkF3AL4TQZjs.use_keyboard_default.call(void 0, 
+      () => {
+        if (keyboard) closeDrawer();
+      },
+      27 /* Escape */,
+      {
+        disableGlobalEvent: true
+      }
+    );
+    const closeFromBackdrop = () => {
+      if (disableBackdropClick) return;
+      closeDrawer();
+    };
+    if (!portal) return null;
+    return _reactdom.createPortal.call(void 0, 
+      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+        _chunkTKIUVNKPjs.backdrop_default,
+        {
+          onClick: closeFromBackdrop,
+          onContentClick,
+          visible,
+          width: "100%",
+          ...bindings,
+          children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+            DrawerWrapper_default,
+            {
+              ref,
+              visible,
+              className: wrapClassName,
+              placement,
+              ...props,
+              children
+            }
+          )
+        }
+      ),
+      portal
+    );
+  }
+);
+DrawerComponent.displayName = "BolioUIDrawer";
+var Drawer = _chunkMAICNLTYjs.with_scale_default.call(void 0, DrawerComponent);
+var Drawer_default = Drawer;
+
+// core/Drawer/index.ts
+Drawer_default.Title = _chunkTKIUVNKPjs.ModalTitle_default;
+Drawer_default.Subtitle = _chunkTKIUVNKPjs.ModalSubtitle_default;
+Drawer_default.Content = _chunkTKIUVNKPjs.ModalContent_default;
+var Drawer_default2 = Drawer_default;
+
+
+
+exports.Drawer_default = Drawer_default2;

package/dist/chunk-QCE3XFHZ.js

@@ -0,0 +1,32 @@
+"use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+
+var _chunkMAICNLTYjs = require('./chunk-MAICNLTY.js');
+
+// core/Spacer/Spacer.tsx
+var _react = require('react'); var _react2 = _interopRequireDefault(_react);
+var _jsxruntime = require('react/jsx-runtime');
+var SpacerComponent = _react2.default.forwardRef(
+  ({ inline = false, className = "", style, ...props }, ref) => {
+    const { SCALES } = _chunkMAICNLTYjs.use_scale_default.call(void 0, );
+    const dynamicStyle = {
+      display: inline ? "inline-block" : "block",
+      width: SCALES.width(1),
+      height: SCALES.height(1),
+      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)}`,
+      ...style
+    };
+    return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "span", { ref, className, style: dynamicStyle, ...props });
+  }
+);
+SpacerComponent.displayName = "BolioUISpacer";
+var Spacer = _chunkMAICNLTYjs.with_scale_default.call(void 0, SpacerComponent);
+var Spacer_default = Spacer;
+
+// core/Spacer/index.ts
+var Spacer_default2 = Spacer_default;
+
+
+
+exports.Spacer_default = Spacer_default2;

package/dist/{chunk-5BRAW5HK.js → chunk-QILHI3LO.js}

@@ -1,9 +1,9 @@
 "use strict";Object.defineProperty(exports, "__esModule", {value: true});
 
-var _chunkUVCSH6DWjs = require('./chunk-UVCSH6DW.js');
+var _chunk5HRVN7L7js = require('./chunk-5HRVN7L7.js');
 
 // core/use-all-themes/index.ts
-var use_all_themes_default = _chunkUVCSH6DWjs.useAllThemes;
+var use_all_themes_default = _chunk5HRVN7L7js.useAllThemes;
 
 
 

package/dist/chunk-RD4CEB5S.js

@@ -0,0 +1,155 @@
+"use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+
+var _chunkGJZT47MPjs = require('./chunk-GJZT47MP.js');
+
+
+
+var _chunkMAICNLTYjs = require('./chunk-MAICNLTY.js');
+
+
+var _chunkUX2B3G6Ujs = require('./chunk-UX2B3G6U.js');
+
+
+var _chunkV5I4ORQQjs = require('./chunk-V5I4ORQQ.js');
+
+
+var _chunk5KUROAEPjs = require('./chunk-5KUROAEP.js');
+
+// core/Badge/Badge.tsx
+var _react = require('react'); var _react2 = _interopRequireDefault(_react);
+
+// css-module-source:/Users/brunnoandrade/Desktop/BolioUI/bolio-ui/core/Badge/Badge.module.css.bolio-css-module-source
+var Badge_module_css_default = { "badge": "Badge-module_badge__QIF6A", "dot": "Badge-module_dot__MaYr0", "pulse": "Badge-module_pulse__hSsvc", "badgePulse": "Badge-module_badgePulse__Xwqez" };
+
+// core/Badge/Badge.tsx
+var _jsxruntime = require('react/jsx-runtime');
+var getColors = (type, palette, { ghost, light, subtle }) => {
+  if (_chunkGJZT47MPjs.isSemanticColorType.call(void 0, type)) {
+    const variant = subtle ? "subtle" : light ? "light" : ghost ? "outline" : "filled";
+    return _chunkGJZT47MPjs.getVariantColors.call(void 0, palette, type, variant);
+  }
+  return {
+    bg: palette.accents_2,
+    border: palette.accents_2,
+    color: palette.foreground
+  };
+};
+var BadgeComponent = _react2.default.forwardRef(
+  ({
+    type = "default",
+    className = "",
+    children,
+    dot = false,
+    pulse = false,
+    ghost = false,
+    light = false,
+    subtle = false,
+    style,
+    ...props
+  }, ref) => {
+    const theme = _chunkV5I4ORQQjs.use_theme_default.call(void 0, );
+    const { SCALES } = _chunkMAICNLTYjs.use_scale_default.call(void 0, );
+    const { bg, border, color } = _react.useMemo.call(void 0, 
+      () => getColors(type, theme.palette, { ghost, light, subtle }),
+      [type, theme.palette, ghost, light, subtle]
+    );
+    const classes = _chunk5KUROAEPjs.use_classes_default.call(void 0, 
+      Badge_module_css_default.badge,
+      { [Badge_module_css_default.dot]: dot, [Badge_module_css_default.pulse]: pulse },
+      className
+    );
+    const badgeStyle = {
+      "--badge-pulse-color": bg,
+      backgroundColor: bg,
+      color,
+      border: `1px solid ${border}`,
+      fontSize: SCALES.font(0.875),
+      width: SCALES.width(1, "auto"),
+      height: SCALES.height(1, "auto"),
+      padding: dot ? `${SCALES.py(0.25)} ${SCALES.px(0.25)}` : SCALES.pt(0.5),
+      margin: `${SCALES.mt(0)} ${SCALES.mr(0)} ${SCALES.mb(0)} ${SCALES.ml(0)}`,
+      ...style
+    };
+    return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "span", { ref, className: classes, ...props, style: badgeStyle, children: !dot && children });
+  }
+);
+BadgeComponent.displayName = "BolioUIBadge";
+var Badge = _chunkMAICNLTYjs.with_scale_default.call(void 0, BadgeComponent);
+var Badge_default = Badge;
+
+// core/Badge/BadgeAnchor.tsx
+
+
+// css-module-source:/Users/brunnoandrade/Desktop/BolioUI/bolio-ui/core/Badge/BadgeAnchor.module.css.bolio-css-module-source
+var BadgeAnchor_module_css_default = { "anchor": "BadgeAnchor-module_anchor__loBaC", "sup": "BadgeAnchor-module_sup__tFyC8" };
+
+// core/Badge/BadgeAnchor.tsx
+
+var getTransform = (placement) => {
+  const styles = {
+    topLeft: {
+      top: "0",
+      left: "0",
+      value: "translate(-50%, -50%)",
+      origin: "0% 0%"
+    },
+    topRight: {
+      top: "0",
+      right: "0",
+      value: "translate(50%, -50%)",
+      origin: "100% 0%"
+    },
+    bottomLeft: {
+      left: "0",
+      bottom: "0",
+      value: "translate(-50%, 50%)",
+      origin: "0% 100%"
+    },
+    bottomRight: {
+      right: "0",
+      bottom: "0",
+      value: "translate(50%, 50%)",
+      origin: "100% 100%"
+    }
+  };
+  return styles[placement];
+};
+function BadgeAnchor({
+  children,
+  placement = "topRight"
+}) {
+  const [withoutBadgeChildren, badgeChldren] = _chunkUX2B3G6Ujs.pickChild.call(void 0, children, Badge_default);
+  const { top, bottom, left, right, value, origin } = _react.useMemo.call(void 0, 
+    () => getTransform(placement),
+    [placement]
+  );
+  return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: BadgeAnchor_module_css_default.anchor, children: [
+    withoutBadgeChildren,
+    /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+      "sup",
+      {
+        className: BadgeAnchor_module_css_default.sup,
+        style: {
+          top: top || "auto",
+          left: left || "auto",
+          right: right || "auto",
+          bottom: bottom || "auto",
+          transform: value,
+          transformOrigin: origin
+        },
+        children: badgeChldren
+      }
+    )
+  ] });
+}
+BadgeAnchor.displayName = "BolioUIBadgeAnchor";
+var BadgeAnchor_default = BadgeAnchor;
+
+// core/Badge/index.ts
+Badge_default.Anchor = BadgeAnchor_default;
+var Badge_default2 = Badge_default;
+
+
+
+exports.Badge_default = Badge_default2;