@lightsparkdev/ui 1.1.6 → 1.1.8

package/dist/{chunk-X436QMUJ.js → chunk-BVE25R77.js}

@@ -1,77 +1,86 @@
+import {
+  Body
+} from "./chunk-2ISDPHR2.js";
 import {
   Table
-} from "./chunk-QUJRT7QQ.js";
+} from "./chunk-KYMNXYGA.js";
+import {
+  DateFilter,
+  getDefaultDateFilterState
+} from "./chunk-S654EVGY.js";
 import {
   EnumFilter,
   getDefaultEnumFilterState,
   isEnumFilterState
-} from "./chunk-XJ66OUZX.js";
+} from "./chunk-PE5VPTE7.js";
 import {
   IdFilter,
   getDefaultIdFilterState,
   isIdFilterState
-} from "./chunk-J6HVPA4W.js";
+} from "./chunk-LVFRXL5V.js";
 import {
   StringFilter,
   getDefaultStringFilterState,
   isStringFilterState
-} from "./chunk-UMBSUXYO.js";
+} from "./chunk-RLAOH7NA.js";
 import {
   BooleanFilter,
   getDefaultBooleanFilterState
-} from "./chunk-VLMBOSKE.js";
+} from "./chunk-MF2LAPAH.js";
 import {
   CurrencyFilter,
   getDefaultCurrencyFilterState
-} from "./chunk-2WE44IMC.js";
-import {
-  DateFilter,
-  getDefaultDateFilterState
-} from "./chunk-LD7PLWND.js";
+} from "./chunk-AIHJ6BXO.js";
 import {
   LabelModerate
-} from "./chunk-IHC26EHJ.js";
+} from "./chunk-GTUR5PQO.js";
 import {
   Label
-} from "./chunk-RTSN6SGW.js";
+} from "./chunk-XSN4IRUE.js";
 import {
   Modal
-} from "./chunk-LBE3ENP5.js";
+} from "./chunk-4ST6OTON.js";
 import {
   Dropdown
-} from "./chunk-3HUQ2TXZ.js";
-import {
-  TextIconAligner
-} from "./chunk-XZMAK3X2.js";
+} from "./chunk-B7HUWFEI.js";
 import {
   CardPageFullWidth
-} from "./chunk-N2DXHWDR.js";
+} from "./chunk-BYQUJQ5Y.js";
 import {
   StyledButtonRow
-} from "./chunk-O5PXZPWW.js";
-import {
-  Spacing
-} from "./chunk-E5DUKMCU.js";
+} from "./chunk-KRYOR3UG.js";
 import {
   Button,
   StyledButton
-} from "./chunk-LCFXXG6V.js";
+} from "./chunk-2MB6EJ7Z.js";
 import {
   z
 } from "./chunk-55OQPFLF.js";
+import {
+  Spacing
+} from "./chunk-E5DUKMCU.js";
+import {
+  TextIconAligner
+} from "./chunk-7577MJVJ.js";
+import {
+  Icon
+} from "./chunk-U6AUAZQA.js";
 import {
   standardBorderRadius,
   standardContentInset
-} from "./chunk-CGK72IUW.js";
+} from "./chunk-33BECMKR.js";
 import {
   getColor,
   themeOr,
   themeOrWithKey
-} from "./chunk-5NZ22GSE.js";
+} from "./chunk-2JNM2KTT.js";
 import {
   bp,
   useBreakpoints
 } from "./chunk-JSGRNWSB.js";
+import {
+  colors
+} from "./chunk-5J7O4QVA.js";
 import {
   __async,
   __spreadProps,
@@ -110,11 +119,13 @@ function initialFilterState(filters) {
   return state;
 }
 function DataManagerTable(props) {
-  var _a, _b, _c, _d;
+  var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j;
   const isCardPageFullWidth = typeof props.cardPageFullWidth === "boolean" ? props.cardPageFullWidth : true;
   const cardPageMt = typeof props.cardPageMt === "undefined" ? 24 : props.cardPageMt;
+  const showPaginationPreviousNext = typeof ((_a = props.paginationDisplayOptions) == null ? void 0 : _a.showPaginationPreviousNext) === "boolean" ? props.paginationDisplayOptions.showPaginationPreviousNext : true;
+  const pageSizeString = typeof ((_b = props.paginationDisplayOptions) == null ? void 0 : _b.pageSizeStringTemplate) === "string" ? props.paginationDisplayOptions.pageSizeStringTemplate : "Show {pageSize} items";
   const breakPoint = useBreakpoints();
-  const [pageSize, setPageSize] = useState(((_a = props.pageSizes) == null ? void 0 : _a[0]) || 20);
+  const [pageSize, setPageSize] = useState(((_c = props.pageSizes) == null ? void 0 : _c[0]) || 20);
   const [pageCursorState, setPageCursorState] = useState({
     startResult: void 0,
     nextPageCursor: props.nextPageCursor,
@@ -122,12 +133,12 @@ function DataManagerTable(props) {
   });
   const [isLoading, setIsLoading] = useState(props.loading || false);
   const [numFiltersApplied, setNumFiltersApplied] = useState(0);
-  const [showFilters, setShowFilters] = useState(false);
+  const [showFilterEditor, setShowFilterEditor] = useState(false);
   const [filterStates, setFilterStates] = useState(
     props.filterOptions ? initialFilterState(props.filterOptions.filters) : {}
   );
   const [fetchVariables, setFetchVariables] = useState(
-    ((_b = props.filterOptions) == null ? void 0 : _b.initialQueryVariables) || {}
+    ((_d = props.filterOptions) == null ? void 0 : _d.initialQueryVariables) || {}
   );
   const isSm = breakPoint.isSm();
   useEffect(() => {
@@ -248,7 +259,7 @@ function DataManagerTable(props) {
       return state.isApplied ? acc + 1 : acc;
     }, 0);
     setNumFiltersApplied(numFiltersApplied2);
-    setShowFilters(false);
+    setShowFilterEditor(false);
     setIsLoading(true);
     const newFetchVariables = getFilterQueryVariables(
       filters2,
@@ -311,6 +322,27 @@ function DataManagerTable(props) {
     }
     setIsLoading(false);
   });
+  const currentPage = Math.floor((pageCursorState.startResult || 0) / pageSize) + 1;
+  const handleChangePage = (page) => __async(this, null, function* () {
+    const pageCursorIndex = (page - 1) * pageSize + 1 - pageSize;
+    const cachedCursorState = pageCursorState.cursorCache[pageSize][pageCursorIndex];
+    if (!props.filterOptions || pageCursorIndex > 0 && !cachedCursorState || page === currentPage) {
+      return;
+    }
+    const { refetch } = props.filterOptions;
+    setIsLoading(true);
+    const newFetchVariables = __spreadProps(__spreadValues({}, fetchVariables), {
+      after: cachedCursorState
+    });
+    setFetchVariables(newFetchVariables);
+    try {
+      yield refetch(newFetchVariables);
+    } catch (e) {
+      setIsLoading(false);
+      throw e;
+    }
+    setIsLoading(false);
+  });
   const handleChangePageSize = (size) => __async(this, null, function* () {
     setPageSize(size);
     if (props.showMoreOptions) {
@@ -445,7 +477,7 @@ function DataManagerTable(props) {
         /* @__PURE__ */ jsxs(FilterContentFooter, { children: [
           /* @__PURE__ */ jsx(Button, { text: "Clear", onClick: handleClearFilters }),
           /* @__PURE__ */ jsxs(FilterContentFooterRight, { children: [
-            /* @__PURE__ */ jsx(Button, { text: "Cancel", onClick: () => setShowFilters(false) }),
+            /* @__PURE__ */ jsx(Button, { text: "Cancel", onClick: () => setShowFilterEditor(false) }),
             /* @__PURE__ */ jsx(Button, { text: "Apply", kind: "primary", onClick: onApply })
           ] })
         ] })
@@ -462,18 +494,19 @@ function DataManagerTable(props) {
     text: !isFilterButtonSmall ? `Filter${numFiltersApplied > 0 ? ` | ${numFiltersApplied}` : ""}` : void 0
   };
   if (props.filterOptions) {
-    filters = /* @__PURE__ */ jsx(Fragment2, { children: /* @__PURE__ */ jsx(DataManagerTableFilterContainer, { children: isSm ? /* @__PURE__ */ jsxs(Fragment, { children: [
+    const FilterContainerComponent = ((_e = props.customComponents) == null ? void 0 : _e.filterContainerComponent) || DataManagerTableFilterContainer;
+    filters = /* @__PURE__ */ jsx(FilterContainerComponent, { children: isSm ? /* @__PURE__ */ jsxs(Fragment, { children: [
       /* @__PURE__ */ jsx(
         Button,
-        __spreadProps(__spreadValues({}, commonButtonProps), {
-          onClick: () => setShowFilters(!showFilters)
+        __spreadProps(__spreadValues(__spreadValues({}, commonButtonProps), props.filterButtonProps), {
+          onClick: () => setShowFilterEditor(!showFilterEditor)
         })
       ),
       /* @__PURE__ */ jsx(
         Modal,
         {
-          visible: showFilters,
-          onClose: () => setShowFilters(false),
+          visible: showFilterEditor,
+          onClose: () => setShowFilterEditor(false),
           smKind: "fullscreen",
           children: filterContent
         }
@@ -483,24 +516,26 @@ function DataManagerTable(props) {
       {
         borderRadius: 12,
         maxDropdownItemsWidth: 400,
-        dropdownContent: /* @__PURE__ */ jsx(FilterDropdownContent, { children: filterContent }),
-        isOpen: showFilters,
+        dropdownContent: /* @__PURE__ */ jsx(FilterDropdownContent, { visible: showFilterEditor, children: filterContent }),
+        isOpen: showFilterEditor,
         onOpen: () => {
-          setShowFilters(true);
+          setShowFilterEditor(true);
         },
         onClose: () => {
-          setShowFilters(false);
+          setShowFilterEditor(false);
         },
-        button: commonButtonProps,
-        align: "right"
+        button: __spreadValues(__spreadValues({}, commonButtonProps), props.filterButtonProps),
+        align: props.filterDropdownAlign || "right"
       }
-    ) }) });
+    ) });
   }
   let showMoreDropdown;
-  if (((_c = props.pageSizes) == null ? void 0 : _c.length) > 1) {
+  if (((_f = props.pageSizes) == null ? void 0 : _f.length) > 1) {
     showMoreDropdown = /* @__PURE__ */ jsx(
       Dropdown,
       {
+        align: "right",
+        verticalPlacement: "top",
         getCSS: ({ isOpen }) => ({
           height: "fit-content",
           alignSelf: "center"
@@ -515,7 +550,7 @@ function DataManagerTable(props) {
           getContent: ({ isOpen }) => /* @__PURE__ */ jsx(
             TextIconAligner,
             {
-              content: `Show ${pageSize} items`,
+              content: pageSizeString.replace("{pageSize}", `${pageSize}`),
               typography: { size: "ExtraSmall" },
               rightIcon: {
                 name: "Chevron",
@@ -554,9 +589,9 @@ function DataManagerTable(props) {
   } else if (props.resultCount) {
     const startResult = pageCursorState.startResult || 1;
     const endResult = Math.min(props.resultCount, startResult + pageSize - 1);
-    const isFullCount = (_d = props.isFullCount) != null ? _d : true;
+    const isFullCount = (_g = props.isFullCount) != null ? _g : true;
     const countString = isFullCount ? props.resultCount : props.resultCount + "+";
-    const resultsString = /* @__PURE__ */ jsxs("div", { children: [
+    const resultsString = ((_h = props.paginationDisplayOptions) == null ? void 0 : _h.showPageNumberButtons) ? /* @__PURE__ */ jsx("div", {}) : /* @__PURE__ */ jsxs("div", { children: [
       /* @__PURE__ */ jsx(Label, { children: "Viewing " }),
       /* @__PURE__ */ jsx(LabelModerate, { children: `${startResult}-${endResult}` }),
       /* @__PURE__ */ jsx(Label, { children: " of " }),
@@ -565,11 +600,93 @@ function DataManagerTable(props) {
     ] });
     const hasNext = props.resultCount ? startResult + pageSize - 1 < props.resultCount : false;
     const hasPrev = startResult > 1;
+    const pageNumbers = Array.from(
+      { length: Math.ceil(props.resultCount / pageSize) },
+      (_, i) => i
+    );
+    const pageNumberButtons = ((_i = props.paginationDisplayOptions) == null ? void 0 : _i.showPageNumberButtons) ? /* @__PURE__ */ jsxs(PageNumberPaginationButtonsContainer, { children: [
+      /* @__PURE__ */ jsx(
+        Button,
+        {
+          icon: {
+            name: "CentralChevronLeftSmall",
+            width: 24,
+            color: "text"
+          },
+          kind: "ghost",
+          paddingY: "short",
+          onClick: () => void handlePrev(),
+          disabled: !hasPrev
+        }
+      ),
+      pageNumbers.slice(0, 2).map((pageNumber) => /* @__PURE__ */ jsx(
+        PageNumberButton,
+        {
+          onClick: () => void handleChangePage(pageNumber + 1),
+          isCurrentPage: currentPage === pageNumber + 1,
+          children: /* @__PURE__ */ jsx(Body, { content: `${pageNumber + 1}` })
+        },
+        pageNumber
+      )),
+      pageNumbers.length > 4 && currentPage - 2 > 1 && /* @__PURE__ */ jsx(
+        Icon,
+        {
+          name: "CentralDotGrid1x3Horizontal",
+          width: 18,
+          ml: 7,
+          mr: 7,
+          color: "text"
+        }
+      ),
+      currentPage - 1 > 1 && currentPage < pageNumbers.length && /* @__PURE__ */ jsx(
+        PageNumberButton,
+        {
+          isCurrentPage: true,
+          onClick: () => void handleChangePage(currentPage),
+          children: /* @__PURE__ */ jsx(Body, { content: `${currentPage}` })
+        },
+        currentPage
+      ),
+      pageNumbers.length > 4 && currentPage + 1 < pageNumbers.length && /* @__PURE__ */ jsx(
+        Icon,
+        {
+          name: "CentralDotGrid1x3Horizontal",
+          width: 18,
+          ml: 7,
+          mr: 7,
+          color: "text"
+        }
+      ),
+      pageNumbers.length > 4 && /* @__PURE__ */ jsx(
+        PageNumberButton,
+        {
+          isCurrentPage: currentPage === pageNumbers.length,
+          onClick: () => void handleChangePage(pageNumbers.length),
+          children: /* @__PURE__ */ jsx(Body, { content: `${pageNumbers.length}` })
+        },
+        pageNumbers.length
+      ),
+      /* @__PURE__ */ jsx(
+        Button,
+        {
+          icon: {
+            name: "CentralChevronRightSmall",
+            width: 24,
+            color: "text"
+          },
+          kind: "ghost",
+          paddingY: "short",
+          onClick: () => void handleNext(),
+          disabled: !hasNext
+        }
+      )
+    ] }) : /* @__PURE__ */ jsx(Fragment2, {});
     footer = /* @__PURE__ */ jsxs(DataManagerTableFooter, { children: [
       resultsString,
+      pageNumberButtons,
       /* @__PURE__ */ jsxs(PaginationContainer, { children: [
         showMoreDropdown,
-        /* @__PURE__ */ jsxs(PaginationButtonsContainer, { children: [
+        showPaginationPreviousNext && /* @__PURE__ */ jsxs(PaginationButtonsContainer, { children: [
           /* @__PURE__ */ jsx(
             Button,
             {
@@ -596,8 +713,9 @@ function DataManagerTable(props) {
       ] })
     ] });
   }
+  const DataManagerTableHeaderComponent = ((_j = props.customComponents) == null ? void 0 : _j.dataManagerTableHeaderComponent) || DataManagerTableHeader;
   const content = /* @__PURE__ */ jsxs(Fragment2, { children: [
-    props.showHeader && /* @__PURE__ */ jsxs(DataManagerTableHeader, { children: [
+    props.showHeader && /* @__PURE__ */ jsxs(DataManagerTableHeaderComponent, { children: [
       props.header,
       filters
     ] }),
@@ -606,7 +724,9 @@ function DataManagerTable(props) {
   ] });
   return /* @__PURE__ */ jsx(StyledDataManagerTable, { children: isCardPageFullWidth ? /* @__PURE__ */ jsx(CardPageFullWidth, { css: { marginTop: `${cardPageMt}px` }, children: content }) : content });
 }
-var StyledDataManagerTable = styled.div``;
+var StyledDataManagerTable = styled.div`
+  width: 100%;
+`;
 var commonPadding = `
   ${bp.lg(`
   padding-left: ${standardContentInset.lgPx}px;
@@ -653,6 +773,29 @@ var PaginationButtonsContainer = styled.div`
   margin-left: ${Spacing.px.md};
   gap: ${Spacing.px.xs};
 `;
+var PageNumberPaginationButtonsContainer = styled.div`
+  display: flex;
+  flex-direction: row;
+  align-items: center;
+`;
+var PageNumberButton = styled.button`
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  width: 32px;
+  height: 32px;
+  padding: 0;
+  cursor: pointer;
+  ${standardBorderRadius(8)}
+  border: none;
+  background-color: transparent;
+  &:hover {
+    border: 0.5px solid ${colors["black-10"]};
+  }
+  ${({ isCurrentPage }) => isCurrentPage ? `
+      border: 0.5px solid ${colors["black-10"]};
+    ` : ""}
+`;
 var DataManagerTableFilterContainer = styled.div`
   position: absolute;
   z-index: 3;
@@ -676,6 +819,7 @@ var FilterDropdownContent = styled.div`
   box-shadow:
     0px 1px 4px 0px rgba(0, 0, 0, 0.1),
     0px 4px 8px 0px rgba(0, 0, 0, 0.08);
+  ${({ visible }) => !visible && "display: none;"}
 `;
 var FilterContentInner = styled.div`
   display: flex;

package/dist/{chunk-MNI3PE7T.js → chunk-BVJA3O5M.js}

@@ -1,9 +1,9 @@
 import {
   CopyToClipboardButton
-} from "./chunk-NTL4YTDH.js";
+} from "./chunk-2V62CWB4.js";
 import {
   standardBorderRadius
-} from "./chunk-CGK72IUW.js";
+} from "./chunk-33BECMKR.js";
 
 // src/components/SecretContainer.tsx
 import styled from "@emotion/styled";

package/dist/{chunk-N2DXHWDR.js → chunk-BYQUJQ5Y.js}

@@ -1,17 +1,17 @@
 import {
   Heading
-} from "./chunk-EJZ7JBMZ.js";
+} from "./chunk-YBLHOQFS.js";
 import {
   StyledButtonRow
-} from "./chunk-O5PXZPWW.js";
+} from "./chunk-KRYOR3UG.js";
+import {
+  z
+} from "./chunk-55OQPFLF.js";
 import {
   flexCenter,
   overflowAutoWithoutScrollbars,
   size
-} from "./chunk-KQ4LSNOH.js";
-import {
-  z
-} from "./chunk-55OQPFLF.js";
+} from "./chunk-AGHCD2FL.js";
 import {
   cardBorderRadiusPx,
   darkGradientBg,
@@ -19,10 +19,10 @@ import {
   standardBorderRadius,
   standardCardShadow,
   standardContentInset
-} from "./chunk-CGK72IUW.js";
+} from "./chunk-33BECMKR.js";
 import {
   themeOr
-} from "./chunk-5NZ22GSE.js";
+} from "./chunk-2JNM2KTT.js";
 import {
   bp,
   useBreakpoints

package/dist/{chunk-3OMRODUD.cjs → chunk-C3FY5BQC.cjs}

@@ -1,24 +1,24 @@
 "use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
-var _chunkMKQVFO6Lcjs = require('./chunk-MKQVFO6L.cjs');
+var _chunkZU72XWNEcjs = require('./chunk-ZU72XWNE.cjs');
 
 
-var _chunkZU72XWNEcjs = require('./chunk-ZU72XWNE.cjs');
+var _chunkEC2UGHQ6cjs = require('./chunk-EC2UGHQ6.cjs');
 
 
 
-var _chunkJPVQC3NYcjs = require('./chunk-JPVQC3NY.cjs');
+var _chunkUL22WLXRcjs = require('./chunk-UL22WLXR.cjs');
 
 
-var _chunkMIEMA7HOcjs = require('./chunk-MIEMA7HO.cjs');
+var _chunk6SDFZ57Lcjs = require('./chunk-6SDFZ57L.cjs');
 
 
 
 
-var _chunk4NC6INKXcjs = require('./chunk-4NC6INKX.cjs');
+var _chunkLPTWQ2KPcjs = require('./chunk-LPTWQ2KP.cjs');
 
 
-var _chunkGHXHO5FQcjs = require('./chunk-GHXHO5FQ.cjs');
+var _chunk2J2ZDWLFcjs = require('./chunk-2J2ZDWLF.cjs');
 
 // src/styles/fields.tsx
 var _react = require('@emotion/react');
@@ -33,16 +33,16 @@ var formButtonTopMarginStyle = _react.css`
   margin-top: ${formButtonTopMargin};
 `;
 var standardBorderColor = ({ theme }) => _react.css`
-  border-color: ${_chunk4NC6INKXcjs.themeOr.call(void 0, theme.c1Neutral, theme.mcNeutral)({ theme })};
+  border-color: ${_chunkLPTWQ2KPcjs.themeOr.call(void 0, theme.c1Neutral, theme.mcNeutral)({ theme })};
 `;
 var inputBlockStyle = ({
   theme,
   hasValue,
   hasError
 }) => _react.css`
-  ${_chunkJPVQC3NYcjs.subtext.call(void 0, { theme })}
+  ${_chunkUL22WLXRcjs.subtext.call(void 0, { theme })}
   ${standardBorderColor({ theme })}
-  ${_chunkJPVQC3NYcjs.standardBorderRadius.call(void 0, 8)}
+  ${_chunkUL22WLXRcjs.standardBorderRadius.call(void 0, 8)}
   background-color: ${theme.bg};
   border-width: 2px;
   display: flex;
@@ -58,8 +58,8 @@ var textInputPlaceholderColor = ({ theme }) => theme.c4Neutral;
 var textInputFontWeight = 600;
 var textInputPaddingPx = 12;
 var textInputPadding = `${textInputPaddingPx}px`;
-var textInputBorderColor = ({ theme }) => _chunk4NC6INKXcjs.isBridge.call(void 0, theme) ? _chunkGHXHO5FQcjs.colors.gray4 : _chunk4NC6INKXcjs.themeOr.call(void 0, theme.c1Neutral, theme.c3Neutral)({ theme });
-var textInputBorderColorFocused = ({ theme }) => _chunk4NC6INKXcjs.themeOr.call(void 0, theme.hcNeutral, theme.hcNeutral)({ theme });
+var textInputBorderColor = ({ theme }) => _chunkLPTWQ2KPcjs.isBridge.call(void 0, theme) ? _chunk2J2ZDWLFcjs.colors.gray4 : _chunkLPTWQ2KPcjs.themeOr.call(void 0, theme.c1Neutral, theme.c3Neutral)({ theme });
+var textInputBorderColorFocused = ({ theme }) => _chunkLPTWQ2KPcjs.themeOr.call(void 0, theme.hcNeutral, theme.hcNeutral)({ theme });
 var textInputActiveStyles = ({
   theme,
   paddingLeftPx,
@@ -70,7 +70,7 @@ var textInputActiveStyles = ({
   activeOutlineColor
 }) => {
   if (activeOutline) {
-    const outlineColor = activeOutlineColor ? _chunk4NC6INKXcjs.getColor.call(void 0, theme, activeOutlineColor) : textInputBorderColorFocused({ theme });
+    const outlineColor = activeOutlineColor ? _chunkLPTWQ2KPcjs.getColor.call(void 0, theme, activeOutlineColor) : textInputBorderColorFocused({ theme });
     return _react.css`
       outline: 2px solid ${outlineColor};
       outline-offset: 2px;
@@ -129,7 +129,7 @@ var textInputStyle = ({
   line-height: 22px;
   outline: none;
 
-  ${_chunkMIEMA7HOcjs.applyTypography.call(void 0, 
+  ${_chunk6SDFZ57Lcjs.applyTypography.call(void 0, 
     theme,
     (typography == null ? void 0 : typography.type) || defaultTextInputTypography.type,
     (typography == null ? void 0 : typography.size) || defaultTextInputTypography.size,
@@ -239,7 +239,7 @@ function InputSubtextContent({
   if (typeof text === "string") {
     return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _jsxruntime.Fragment, { children: text });
   }
-  return _chunkMKQVFO6Lcjs.toReactNodes.call(void 0, text);
+  return _chunkEC2UGHQ6cjs.toReactNodes.call(void 0, text);
 }
 var StyledInputSubtext = _styled2.default.div`
   margin-top: ${({ visible }) => visible ? "8px" : "0px"};
@@ -272,11 +272,11 @@ var labelStyle = ({
   }
 `;
 var Label = _styled2.default.label`
-  ${_chunkJPVQC3NYcjs.subtext}
+  ${_chunkUL22WLXRcjs.subtext}
   ${labelStyle}
 `;
 var LabelDiv = _styled2.default.div`
-  ${_chunkJPVQC3NYcjs.subtext}
+  ${_chunkUL22WLXRcjs.subtext}
   ${labelStyle}
 `;
 

package/dist/{chunk-2WIERZ3Z.js → chunk-C3I42MEE.js}

@@ -6,7 +6,7 @@ import {
 } from "./chunk-YW4BJCOL.js";
 import {
   applyTypography
-} from "./chunk-2C6JCHWU.js";
+} from "./chunk-XIWXA6GF.js";
 import {
   __objRest,
   __spreadProps,

package/dist/chunk-C5GHMAVP.cjs

@@ -0,0 +1,41 @@
+"use strict";Object.defineProperty(exports, "__esModule", {value: true});// src/icons/central/LoadingCircle.tsx
+var _jsxruntime = require('@emotion/react/jsx-runtime');
+function LoadingCircle({
+  strokeWidth = "2",
+  strokeLinecap = "round"
+}) {
+  return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, 
+    "svg",
+    {
+      xmlns: "http://www.w3.org/2000/svg",
+      width: "24",
+      height: "24",
+      viewBox: "0 0 24 24",
+      fill: "none",
+      children: [
+        /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+          "path",
+          {
+            d: "M21 12C21 16.9706 16.9706 21 12 21C7.02944 21 3 16.9706 3 12C3 7.02944 7.02944 3 12 3C16.9706 3 21 7.02944 21 12Z",
+            stroke: "black",
+            strokeOpacity: "0.3",
+            strokeWidth
+          }
+        ),
+        /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+          "path",
+          {
+            d: "M20.9451 13C20.4839 17.1716 17.1716 20.4839 13 20.9451",
+            stroke: "#1A1A1A",
+            strokeWidth,
+            strokeLinecap
+          }
+        )
+      ]
+    }
+  );
+}
+
+
+
+exports.LoadingCircle = LoadingCircle;