@lightsparkdev/ui 1.0.17 → 1.1.1

package/dist/chunk-2X7TY7WF.cjs

@@ -0,0 +1,477 @@
+"use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+var _chunkDCH43ZYZcjs = require('./chunk-DCH43ZYZ.cjs');
+
+
+var _chunkJHMM3LEXcjs = require('./chunk-JHMM3LEX.cjs');
+
+
+var _chunkK52UQVCMcjs = require('./chunk-K52UQVCM.cjs');
+
+
+var _chunkFTJZZWYScjs = require('./chunk-FTJZZWYS.cjs');
+
+
+
+var _chunkVXW4GOMOcjs = require('./chunk-VXW4GOMO.cjs');
+
+
+var _chunkR46DRG52cjs = require('./chunk-R46DRG52.cjs');
+
+
+var _chunkZU72XWNEcjs = require('./chunk-ZU72XWNE.cjs');
+
+
+var _chunkZUAO4DW3cjs = require('./chunk-ZUAO4DW3.cjs');
+
+
+var _chunkSFVPZBMVcjs = require('./chunk-SFVPZBMV.cjs');
+
+
+var _chunk6OSTNEFIcjs = require('./chunk-6OSTNEFI.cjs');
+
+
+var _chunkXQNOVNF4cjs = require('./chunk-XQNOVNF4.cjs');
+
+
+var _chunk4N5EXQIScjs = require('./chunk-4N5EXQIS.cjs');
+
+
+
+
+
+var _chunkU35SY546cjs = require('./chunk-U35SY546.cjs');
+
+
+var _chunk6VA4SAHQcjs = require('./chunk-6VA4SAHQ.cjs');
+
+
+
+var _chunkKW3JYLRIcjs = require('./chunk-KW3JYLRI.cjs');
+
+
+var _chunkKL5ZQSVOcjs = require('./chunk-KL5ZQSVO.cjs');
+
+
+
+var _chunkZ6EUSUADcjs = require('./chunk-Z6EUSUAD.cjs');
+
+// src/components/Modal.tsx
+var _styled = require('@emotion/styled'); var _styled2 = _interopRequireDefault(_styled);
+
+
+
+
+
+
+var _react = require('react'); var _react2 = _interopRequireDefault(_react);
+var _reactdom = require('react-dom'); var _reactdom2 = _interopRequireDefault(_reactdom);
+var _jsxruntime = require('@emotion/react/jsx-runtime');
+function isSubmitLinkWithHref(submitLink) {
+  return Boolean(submitLink && "href" in submitLink);
+}
+function Modal({
+  visible,
+  topContent,
+  title,
+  description,
+  children,
+  onClose,
+  onCancel,
+  cancelDisabled,
+  cancelHidden,
+  ghost,
+  onSubmit,
+  submitDisabled,
+  submitLoading,
+  submitLoadingKind,
+  submitText,
+  submitIcon,
+  submitLink,
+  cancelText = "Cancel",
+  firstFocusRef,
+  smKind = "default",
+  top,
+  nonDismissable = false,
+  autoFocus = true,
+  width = 460,
+  progressBar,
+  buttonOrder,
+  buttonLayout = "horizontal",
+  extraActions,
+  handleBack,
+  appendToElement,
+  bottomContent,
+  topLeftIcon,
+  drawerKind,
+  drawerPadding,
+  drawerCloseButton = true
+}) {
+  const visibleChangedRef = _react.useRef.call(void 0, false);
+  const [visibleChanged, setVisibleChanged] = _react.useState.call(void 0, false);
+  const nodeRef = _react.useRef.call(void 0, null);
+  const [defaultFirstFocusRef, defaultFirstFocusRefCb] = _chunkKL5ZQSVOcjs.useLiveRef.call(void 0, );
+  const ref = firstFocusRef || defaultFirstFocusRef;
+  const [nodeReady, setNodeReady] = _react2.default.useState(false);
+  const overlayRef = _react.useRef.call(void 0, null);
+  const prevFocusedElement = _react.useRef.call(void 0, );
+  const modalContainerRef = _react.useRef.call(void 0, null);
+  const bp2 = _chunkKW3JYLRIcjs.useBreakpoints.call(void 0, );
+  const isSm = bp2.current("sm" /* sm */);
+  _react.useEffect.call(void 0, () => {
+    if (visible !== visibleChangedRef.current) {
+      visibleChangedRef.current = visible;
+      setVisibleChanged(true);
+    }
+  }, [visible]);
+  _react.useEffect.call(void 0, () => {
+    if (visibleChanged) {
+      setVisibleChanged(false);
+    }
+  }, [visibleChanged]);
+  _react.useEffect.call(void 0, () => {
+    prevFocusedElement.current = document.activeElement;
+    const elementToAppendTo = appendToElement != null ? appendToElement : document.body;
+    if (!nodeRef.current) {
+      nodeRef.current = document.createElement("div");
+      elementToAppendTo.appendChild(nodeRef.current);
+    }
+    setNodeReady(true);
+    return () => {
+      if (nodeRef.current) {
+        elementToAppendTo.removeChild(nodeRef.current);
+        nodeRef.current = null;
+      }
+    };
+  }, [appendToElement]);
+  _react.useEffect.call(void 0, () => {
+    const handleOutsideClick = (event) => {
+      if (visible && overlayRef.current && event.target && overlayRef.current.contains(event.target) && !nonDismissable) {
+        onClose();
+      }
+    };
+    const handleKeyDown = (event) => {
+      if (visible && event.key === "Escape" && !nonDismissable) {
+        onClose();
+      }
+    };
+    if (visible) {
+      if (modalContainerRef.current) {
+        modalContainerRef.current.addEventListener("keydown", handleKeyDown);
+      }
+      if (overlayRef.current) {
+        overlayRef.current.addEventListener("click", handleOutsideClick);
+      }
+    } else {
+      if (modalContainerRef.current) {
+        modalContainerRef.current.removeEventListener("keydown", handleKeyDown);
+      }
+      if (overlayRef.current) {
+        overlayRef.current.removeEventListener("click", handleOutsideClick);
+      }
+    }
+    const containerRef = modalContainerRef.current;
+    const overlayRefVar = overlayRef.current;
+    return () => {
+      if (containerRef) {
+        containerRef.removeEventListener("keydown", handleKeyDown);
+      }
+      if (overlayRefVar) {
+        overlayRefVar.removeEventListener("click", handleOutsideClick);
+      }
+    };
+  }, [onClose, visible, nonDismissable]);
+  _react.useLayoutEffect.call(void 0, () => {
+    if (visible) {
+      if (visibleChanged) {
+        prevFocusedElement.current = document.activeElement;
+      }
+      if (typeof ref === "object" && (ref == null ? void 0 : ref.current) && autoFocus) {
+        ref.current.focus();
+      }
+    } else if (visibleChanged && prevFocusedElement.current) {
+      prevFocusedElement.current.focus();
+    }
+  }, [visible, visibleChanged, ref, autoFocus]);
+  function onClickCloseButton(event) {
+    event == null ? void 0 : event.stopPropagation();
+    onClose();
+  }
+  function onSubmitForm(e) {
+    e.preventDefault();
+    e.stopPropagation();
+    if (!submitDisabled && onSubmit) {
+      onSubmit();
+    }
+  }
+  function onClickCancel() {
+    if (onCancel) {
+      onCancel();
+    } else {
+      onClose();
+    }
+  }
+  const linkIsHref = isSubmitLinkWithHref(submitLink);
+  const linkIsRoute = !linkIsHref && submitLink;
+  const displayCancelAbove = !!buttonOrder ? buttonOrder === "cancel-first" : !isSm;
+  const displayCancelBelow = !!buttonOrder ? buttonOrder === "submit-first" : isSm;
+  const buttonContent = /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _jsxruntime.Fragment, { children: [
+    extraActions == null ? void 0 : extraActions.filter((action) => action.placement === "above").map((_a, i) => {
+      var _b = _a, { placement, text } = _b, rest = _chunkZ6EUSUADcjs.__objRest.call(void 0, _b, ["placement", "text"]);
+      return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkVXW4GOMOcjs.Button, _chunkZ6EUSUADcjs.__spreadValues.call(void 0, { text }, rest), text || `no-text-${i}`);
+    }),
+    displayCancelAbove && !cancelHidden && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+      _chunkVXW4GOMOcjs.Button,
+      {
+        disabled: cancelDisabled,
+        onClick: onClickCancel,
+        text: cancelText
+      }
+    ),
+    (onSubmit || submitLink) && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+      _chunkVXW4GOMOcjs.Button,
+      {
+        kind: "primary",
+        disabled: submitDisabled,
+        icon: submitIcon,
+        text: submitText != null ? submitText : "Continue",
+        loading: submitLoading,
+        loadingKind: submitLoadingKind,
+        to: linkIsRoute ? submitLink.to : void 0,
+        externalLink: linkIsHref ? submitLink.href : void 0,
+        filename: linkIsHref ? submitLink.filename : void 0,
+        type: submitLink ? "button" : "submit",
+        onClick: submitLink ? onSubmit : void 0
+      }
+    ),
+    displayCancelBelow && !cancelHidden && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+      _chunkVXW4GOMOcjs.Button,
+      {
+        disabled: cancelDisabled,
+        onClick: onClickCancel,
+        text: cancelText
+      }
+    ),
+    extraActions == null ? void 0 : extraActions.filter((action) => action.placement === "below").map((_c, i) => {
+      var _d = _c, { placement, text } = _d, rest = _chunkZ6EUSUADcjs.__objRest.call(void 0, _d, ["placement", "text"]);
+      return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkVXW4GOMOcjs.Button, _chunkZ6EUSUADcjs.__spreadValues.call(void 0, { text }, rest), text || `no-text-${i}`);
+    })
+  ] });
+  let titleContent = null;
+  if (title) {
+    const defaultTypography = {
+      type: "Headline",
+      heading: "h4",
+      size: "Small"
+    };
+    const titleNodesWithTypography = _chunkSFVPZBMVcjs.setDefaultReactNodesTypography.call(void 0, title, {
+      default: defaultTypography
+    });
+    titleContent = /* @__PURE__ */ _jsxruntime.jsx.call(void 0, ModalTitle, { children: _chunk6OSTNEFIcjs.toReactNodes.call(void 0, titleNodesWithTypography) });
+  }
+  let descriptionContent = null;
+  if (description) {
+    const defaultTypography = {
+      type: "Body",
+      size: "ExtraSmall"
+    };
+    const descriptionNodesWithTypography = _chunkSFVPZBMVcjs.setDefaultReactNodesTypography.call(void 0, 
+      description,
+      { default: defaultTypography }
+    );
+    descriptionContent = /* @__PURE__ */ _jsxruntime.jsx.call(void 0, ModalDescription, { children: _chunk6OSTNEFIcjs.toReactNodes.call(void 0, descriptionNodesWithTypography) });
+  }
+  let topContentNode = null;
+  if (topContent) {
+    if (_chunkDCH43ZYZcjs.isReactNode.call(void 0, topContent)) {
+      topContentNode = topContent;
+    } else {
+      topContentNode = /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { css: { marginBottom: _chunkZUAO4DW3cjs.Spacing.px.xl }, children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkK52UQVCMcjs.IconWithCircleBackground, _chunkZ6EUSUADcjs.__spreadValues.call(void 0, {}, topContent)) });
+    }
+  }
+  const modalContent = /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _react.Fragment, { children: [
+    progressBar ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { css: { marginBottom: "20px" }, children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+      _chunkJHMM3LEXcjs.ProgressBar,
+      {
+        progressPercentage: progressBar.progressPercentage,
+        isSm: progressBar.isSm
+      }
+    ) }) : null,
+    topContentNode,
+    titleContent,
+    descriptionContent,
+    children,
+    onSubmit || onCancel || submitLink ? buttonLayout === "horizontal" ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, ModalButtonRow, { children: buttonContent }) : /* @__PURE__ */ _jsxruntime.jsx.call(void 0, ModalButtonColumn, { children: buttonContent }) : null
+  ] });
+  let content;
+  if (smKind === "drawer" && isSm) {
+    content = /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+      _chunkFTJZZWYScjs.Drawer,
+      {
+        onClose: () => onClickCloseButton(),
+        closeButton: drawerCloseButton,
+        nonDismissable,
+        handleBack,
+        kind: drawerKind != null ? drawerKind : "default",
+        padding: drawerPadding !== void 0 ? `${drawerPadding}px` : void 0,
+        top,
+        children: modalContent
+      }
+    );
+  } else {
+    content = /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _react.Fragment, { children: [
+      !(smKind === "fullscreen" && bp2.isSm()) ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, ModalOverlay, { ref: overlayRef }) : null,
+      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+        ModalContainer,
+        {
+          "aria-modal": true,
+          "aria-hidden": true,
+          tabIndex: -1,
+          onClick: (event) => {
+            event.stopPropagation();
+          },
+          role: "dialog",
+          ref: modalContainerRef,
+          top: top || (smKind === "default" ? _chunkU35SY546cjs.standardContentInset.smPx : 0),
+          children: /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, ModalContent, { width, ghost, smKind, children: [
+            !firstFocusRef && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, DefaultFocusTarget, { ref: defaultFirstFocusRefCb }),
+            !ghost && /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, ModalNavigation, { children: [
+              handleBack ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, BackButton, { onClick: handleBack, children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunk4N5EXQIScjs.Icon, { name: "ChevronLeft", width: 16 }) }) : topLeftIcon ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunk4N5EXQIScjs.Icon, _chunkZ6EUSUADcjs.__spreadValues.call(void 0, {}, topLeftIcon)) : null,
+              !nonDismissable && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, CloseButton, { onClick: onClickCloseButton, type: "button", children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunk4N5EXQIScjs.Icon, { name: "Close", width: 9 }) })
+            ] }),
+            /* @__PURE__ */ _jsxruntime.jsx.call(void 0, ModalContentInner, { ghost, children: modalContent }),
+            bottomContent && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { css: { marginTop: "auto" }, children: bottomContent })
+          ] })
+        }
+      )
+    ] });
+  }
+  return visible && nodeReady && nodeRef.current ? _reactdom2.default.createPortal(
+    onSubmit ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "form", { onSubmit: onSubmitForm, children: content }) : content,
+    nodeRef.current
+  ) : null;
+}
+var DefaultFocusTarget = _styled2.default.call(void 0, _chunkR46DRG52cjs.UnstyledButton)`
+  position: absolute;
+  top: -30px;
+  width: 0;
+  height: 0;
+`;
+var ModalOverlay = _styled2.default.div`
+  position: fixed;
+  bottom: 0;
+  left: 0;
+  z-index: ${_chunkZU72XWNEcjs.z.modalOverlay};
+  width: 100vw;
+  height: 100vh;
+  background: rgba(0, 0, 0, 0.5);
+`;
+var ModalContainer = _styled2.default.div`
+  pointer-events: none;
+  position: fixed;
+  top: 0;
+  left: 0;
+  z-index: ${_chunkZU72XWNEcjs.z.modalContainer};
+  width: 100%;
+  height: 100%;
+  overflow-x: hidden;
+  overflow-y: auto;
+  outline: 0;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  color: ${({ theme }) => theme.text};
+  ${(props) => `top: ${props.top}px;`}
+`;
+var contentTopMarginPx = 24;
+var ModalDescription = _styled2.default.div`
+  color: ${({ theme }) => theme.mcNeutral};
+  margin-top: ${_chunkZUAO4DW3cjs.Spacing.px.sm};
+  & + * {
+    margin-top: ${contentTopMarginPx}px;
+  }
+`;
+var ModalButtonRow = _styled2.default.div`
+  margin-top: ${_chunkZUAO4DW3cjs.Spacing.px.lg};
+  ${_chunkKW3JYLRIcjs.bp.minSm(`display: flex;`)}
+  gap: 10px;
+
+  ${_chunkVXW4GOMOcjs.ButtonSelector.call(void 0, )} {
+    width: 50%;
+    ${_chunkKW3JYLRIcjs.bp.sm(`
+      width: 100%;
+    `)}
+  }
+`;
+var ModalButtonColumn = _styled2.default.div`
+  display: flex;
+  flex-direction: column;
+  gap: ${_chunkZUAO4DW3cjs.Spacing.px.sm};
+
+  ${_chunkVXW4GOMOcjs.ButtonSelector.call(void 0, )} {
+    width: 100%;
+  }
+
+  margin-top: ${_chunkZUAO4DW3cjs.Spacing.px.lg};
+`;
+var ModalTitle = _styled2.default.div`
+  margin: 0;
+  & + *:not(${_chunk6VA4SAHQcjs.select.call(void 0, ModalDescription)}) {
+    margin-top: ${contentTopMarginPx}px;
+  }
+`;
+var ModalContent = _styled2.default.div`
+  pointer-events: auto;
+  transition: width 0.25s ease-in;
+
+  ${({ theme, smKind, ghost }) => ghost ? "" : _chunkU35SY546cjs.overlaySurface.call(void 0, { theme, border: smKind !== "fullscreen" })}
+
+  ${_chunkXQNOVNF4cjs.overflowAutoWithoutScrollbars}
+  ${_chunkU35SY546cjs.standardContentInset.smCSS.styles}
+  max-width: 100%;
+  max-height: 100%;
+  position: absolute;
+  display: flex;
+  flex-direction: column;
+
+  ${({ ghost, smKind, width }) => `
+    ${ghost ? "" : _chunkU35SY546cjs.standardBorderRadius.call(void 0, 16)}
+    width: ${width}px;
+  `}
+
+  ${({ smKind }) => smKind === "fullscreen" ? _chunkKW3JYLRIcjs.bp.sm(`
+          border-radius: 0px;
+          width: 100%;
+          height: 100dvh;
+        `) : ""}
+
+  ${({ ghost }) => ghost ? "" : "padding: 16px 16px 40px;"}
+`;
+var ModalNavigation = _styled2.default.div`
+  display: grid;
+  grid-auto-flow: column;
+  width: 100%;
+`;
+var BackButton = _styled2.default.call(void 0, _chunkR46DRG52cjs.UnstyledButton)`
+  ${_chunkU35SY546cjs.standardFocusOutline}
+  width: 24px;
+  height: 24px;
+  justify-self: flex-start;
+`;
+var CloseButton = _styled2.default.call(void 0, _chunkR46DRG52cjs.UnstyledButton)`
+  ${_chunkU35SY546cjs.standardFocusOutline}
+  width: 24px;
+  height: 24px;
+  justify-self: flex-end;
+`;
+var ModalContentInner = _styled2.default.div`
+  ${(props) => props.ghost ? "" : "padding: 32px 24px 0;"}
+  ${(props) => props.ghost ? "" : `${_chunkKW3JYLRIcjs.bp.sm(`
+    padding-left: 10px;
+    padding-right: 10px;
+  `)}`}
+`;
+
+
+
+exports.Modal = Modal;

package/dist/chunk-2YBZV2K6.cjs

@@ -0,0 +1,118 @@
+"use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+
+var _chunkZ6EUSUADcjs = require('./chunk-Z6EUSUAD.cjs');
+
+// src/components/Flex.tsx
+var _styled = require('@emotion/styled'); var _styled2 = _interopRequireDefault(_styled);
+var _lodashes = require('lodash-es');
+var _jsxruntime = require('@emotion/react/jsx-runtime');
+function Flex({
+  center = false,
+  justify: justifyProp,
+  align: alignProp,
+  column = false,
+  children,
+  onClick,
+  disabled = false,
+  gap,
+  as = "div",
+  asButtonType,
+  overflow,
+  whiteSpace,
+  mt,
+  mr,
+  mb,
+  ml,
+  pt,
+  pr,
+  pb,
+  pl,
+  height,
+  width,
+  position
+}) {
+  const justify = justifyProp ? justifyProp : center ? "center" : "stretch";
+  const align = alignProp ? alignProp : center ? "center" : "stretch";
+  const asButtonProps = asButtonType ? { type: asButtonType, disabled } : {};
+  return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+    StyledFlex,
+    _chunkZ6EUSUADcjs.__spreadProps.call(void 0, _chunkZ6EUSUADcjs.__spreadValues.call(void 0, {
+      justify,
+      align,
+      column,
+      as,
+      onClick: disabled ? void 0 : onClick,
+      cursorProp: onClick ? disabled ? "not-allowed" : "pointer" : "unset",
+      overflowProp: overflow,
+      whiteSpace,
+      mr,
+      ml,
+      mt,
+      mb,
+      pt,
+      pr,
+      pb,
+      pl,
+      gap,
+      height,
+      width,
+      position
+    }, asButtonProps), {
+      children
+    })
+  );
+}
+function marginPropToString(margin, type) {
+  if (typeof margin === "number") {
+    return `margin-${type}: ${margin}px;`;
+  } else if (margin === "auto") {
+    return `margin-${type}: auto;`;
+  }
+  return "";
+}
+var StyledFlex = _styled2.default.div`
+  display: flex;
+  text-overflow: ellipsis;
+
+  ${({ as }) => (
+  /* reset button styles */
+  as === "button" && `
+    border: 0;
+    appearance: none;
+    background: transparent;
+    padding: 0;
+    /* needed in Safari for some reason */
+    font-size: 1rem;
+    color: inherit;
+    font-weight: inherit;
+  `
+)}
+
+  ${({ column }) => column && `flex-direction: column;`}
+  ${({ justify }) => `justify-content: ${justify};`}
+  ${({ align }) => `align-items: ${align};`}
+  ${({ cursorProp }) => `cursor: ${cursorProp};`}
+  ${({ overflowProp }) => overflowProp ? `overflow: ${overflowProp}; max-width: 100%;` : ""}
+  ${({ whiteSpace }) => whiteSpace ? `white-space: ${whiteSpace};` : ""}
+  ${({ gap }) => gap && `gap: ${gap}px;`}
+
+  ${({ mt }) => marginPropToString(mt, "top")}
+  ${({ mr }) => marginPropToString(mr, "right")}
+  ${({ mb }) => marginPropToString(mb, "bottom")}
+  ${({ ml }) => marginPropToString(ml, "left")}
+
+  ${({ pt }) => pt && `padding-top: ${pt}px;`}
+  ${({ pr }) => pr && `padding-right: ${pr}px;`}
+  ${({ pb }) => pb && `padding-bottom: ${pb}px;`}
+  ${({ pl }) => pl && `padding-left: ${pl}px;`}
+
+  ${({ height }) => height && (_lodashes.isNumber.call(void 0, height) ? `height: ${height}px;` : `height: ${height};`)}
+  ${({ width }) => width && (_lodashes.isNumber.call(void 0, width) ? `width: ${width}px;` : `width: ${width};`)}
+  ${({ position }) => position && `position: ${position};`}
+`;
+
+
+
+
+exports.Flex = Flex; exports.StyledFlex = StyledFlex;

package/dist/chunk-2ZEXIXP5.cjs

@@ -0,0 +1,33 @@
+"use strict";Object.defineProperty(exports, "__esModule", {value: true});// src/icons/central/CircleX.tsx
+var _jsxruntime = require('@emotion/react/jsx-runtime');
+function CircleX({
+  strokeWidth = "1.5",
+  strokeLinecap = "round",
+  strokeLinejoin = "round"
+}) {
+  return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+    "svg",
+    {
+      width: "24",
+      height: "24",
+      viewBox: "0 0 24 24",
+      fill: "none",
+      xmlns: "http://www.w3.org/2000/svg",
+      children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+        "path",
+        {
+          d: "M15.4054 8.59459L8.59459 15.4054M15.4054 15.4054L8.59459 8.59459M22.5 12C22.5 17.799 17.799 22.5 12 22.5C6.20101 22.5 1.5 17.799 1.5 12C1.5 6.20101 6.20101 1.5 12 1.5C17.799 1.5 22.5 6.20101 22.5 12Z",
+          stroke: "currentColor",
+          strokeWidth,
+          strokeLinecap,
+          strokeLinejoin,
+          vectorEffect: "non-scaling-stroke"
+        }
+      )
+    }
+  );
+}
+
+
+
+exports.CircleX = CircleX;