@lightsparkdev/ui 1.0.7 → 1.0.9

package/dist/chunk-NROZVENV.cjs

@@ -0,0 +1,191 @@
+"use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+
+
+
+
+
+
+
+var _chunkNVVAOGNLcjs = require('./chunk-NVVAOGNL.cjs');
+
+
+var _chunkZU72XWNEcjs = require('./chunk-ZU72XWNE.cjs');
+
+
+var _chunkI6Y7IHF5cjs = require('./chunk-I6Y7IHF5.cjs');
+
+
+
+var _chunkJX6HEEEQcjs = require('./chunk-JX6HEEEQ.cjs');
+
+
+
+
+var _chunkYM5JDZDQcjs = require('./chunk-YM5JDZDQ.cjs');
+
+// src/components/Select.tsx
+var _react = require('@emotion/react');
+var _styled = require('@emotion/styled'); var _styled2 = _interopRequireDefault(_styled);
+var _reactselect = require('react-select'); var _reactselect2 = _interopRequireDefault(_reactselect);
+var _jsxruntime = require('@emotion/react/jsx-runtime');
+function Select(_a) {
+  var _b = _a, {
+    zIndex,
+    selectRef,
+    label,
+    openMenuOnFocus = true,
+    tabSelectsValue = false,
+    getOptionStyles
+  } = _b, rest = _chunkYM5JDZDQcjs.__objRest.call(void 0, _b, [
+    "zIndex",
+    "selectRef",
+    "label",
+    "openMenuOnFocus",
+    "tabSelectsValue",
+    "getOptionStyles"
+  ]);
+  const theme = _react.useTheme.call(void 0, );
+  const styles = {
+    container: (styles2, state) => {
+      return _chunkYM5JDZDQcjs.__spreadProps.call(void 0, _chunkYM5JDZDQcjs.__spreadValues.call(void 0, {}, styles2), {
+        width: _chunkNVVAOGNLcjs.fieldWidth,
+        maxWidth: _chunkNVVAOGNLcjs.maxFieldWidth,
+        zIndex: _chunkZU72XWNEcjs.z.select
+      });
+    },
+    control: (styles2, state) => {
+      return _chunkYM5JDZDQcjs.__spreadProps.call(void 0, _chunkYM5JDZDQcjs.__spreadValues.call(void 0, {}, styles2), {
+        transition: "none",
+        padding: state.menuIsOpen || state.isFocused ? `${_chunkNVVAOGNLcjs.textInputPaddingPx - 1}px` : _chunkNVVAOGNLcjs.textInputPadding,
+        boxShadow: "none",
+        background: theme.bg,
+        minHeight: 0,
+        fontSize: 14,
+        borderWidth: state.menuIsOpen || state.isFocused ? "2px" : "1px",
+        "&:hover": {
+          borderColor: state.menuIsOpen ? _chunkNVVAOGNLcjs.textInputBorderColorFocused.call(void 0, { theme }) : _chunkNVVAOGNLcjs.textInputBorderColor.call(void 0, { theme })
+        },
+        borderColor: state.menuIsOpen || state.isFocused ? _chunkNVVAOGNLcjs.textInputBorderColorFocused.call(void 0, { theme }) : _chunkNVVAOGNLcjs.textInputBorderColor.call(void 0, { theme })
+      });
+    },
+    indicatorsContainer: (styles2) => _chunkYM5JDZDQcjs.__spreadProps.call(void 0, _chunkYM5JDZDQcjs.__spreadValues.call(void 0, {}, styles2), {
+      padding: "0 8px"
+    }),
+    indicatorSeparator: (styles2) => ({
+      display: "none"
+    }),
+    menu: (styles2, state) => {
+      return _chunkYM5JDZDQcjs.__spreadProps.call(void 0, _chunkYM5JDZDQcjs.__spreadValues.call(void 0, {}, styles2), {
+        overflow: "hidden",
+        border: `2px solid ${theme.lcNeutral}`,
+        backgroundColor: theme.bg,
+        boxShadow: "0px 3px 6px 1px rgba(0,0,0,0.05)",
+        borderColor: theme.hcNeutral,
+        width: "max-content",
+        minWidth: "100%"
+      });
+    },
+    option: (styles2, props) => {
+      const optionStyles = getOptionStyles ? getOptionStyles(styles2, props) : {};
+      return _chunkYM5JDZDQcjs.__spreadValues.call(void 0, _chunkYM5JDZDQcjs.__spreadProps.call(void 0, _chunkYM5JDZDQcjs.__spreadValues.call(void 0, {}, styles2), {
+        color: props.isFocused ? _chunkJX6HEEEQcjs.getColor.call(void 0, theme, _chunkNVVAOGNLcjs.defaultTextInputTypography.color) : props.isDisabled ? _chunkNVVAOGNLcjs.textInputPlaceholderColor.call(void 0, { theme }) : _chunkJX6HEEEQcjs.getColor.call(void 0, theme, _chunkNVVAOGNLcjs.defaultTextInputTypography.color),
+        fontWeight: 600,
+        cursor: "pointer",
+        backgroundColor: props.isFocused ? _chunkJX6HEEEQcjs.themeOr.call(void 0, theme.c05Neutral, theme.c2Neutral)({ theme }) : theme.bg,
+        WebkitTapHighlightColor: theme.c1Neutral,
+        "&:active": {
+          backgroundColor: _chunkJX6HEEEQcjs.themeOr.call(void 0, 
+            theme.c05Neutral,
+            theme.c5Neutral
+          )({ theme })
+        }
+      }), optionStyles);
+    },
+    menuPortal: (styles2) => _chunkYM5JDZDQcjs.__spreadProps.call(void 0, _chunkYM5JDZDQcjs.__spreadValues.call(void 0, {}, styles2), {
+      fontSize: 14,
+      zIndex: zIndex || _chunkZU72XWNEcjs.z.selectFocused
+    }),
+    singleValue: (styles2) => _chunkYM5JDZDQcjs.__spreadProps.call(void 0, _chunkYM5JDZDQcjs.__spreadValues.call(void 0, {}, styles2), {
+      color: theme.text,
+      fontWeight: 600,
+      fontSize: 14
+    }),
+    placeholder: (styles2) => _chunkYM5JDZDQcjs.__spreadProps.call(void 0, _chunkYM5JDZDQcjs.__spreadValues.call(void 0, {}, styles2), {
+      color: theme.mcNeutral
+    }),
+    valueContainer: (styles2) => _chunkYM5JDZDQcjs.__spreadProps.call(void 0, _chunkYM5JDZDQcjs.__spreadValues.call(void 0, {}, styles2), {
+      padding: 0
+    }),
+    input: (styles2) => _chunkYM5JDZDQcjs.__spreadProps.call(void 0, _chunkYM5JDZDQcjs.__spreadValues.call(void 0, {}, styles2), {
+      color: theme.text,
+      fontWeight: 600,
+      fontSize: 14
+    })
+  };
+  return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, StyledSelect, { children: [
+    label && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, SelectLabel, { hasError: false, children: label }),
+    /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+      _reactselect2.default,
+      _chunkYM5JDZDQcjs.__spreadProps.call(void 0, _chunkYM5JDZDQcjs.__spreadValues.call(void 0, {}, rest), {
+        styles,
+        openMenuOnFocus,
+        tabSelectsValue,
+        menuPortalTarget: document.body,
+        ref: selectRef,
+        components: {
+          DropdownIndicator: () => /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkI6Y7IHF5cjs.Icon, { name: "Chevron", width: 16 })
+          // Option: (option) => {
+          //   return <div>Option</div>;
+          // },
+        },
+        theme: (selectTheme) => _chunkYM5JDZDQcjs.__spreadProps.call(void 0, _chunkYM5JDZDQcjs.__spreadValues.call(void 0, {}, selectTheme), {
+          borderRadius: 8,
+          colors: {
+            danger: theme.danger,
+            dangerLight: "#ff8",
+            primary: theme.text,
+            primary75: "#ccc",
+            primary50: "#888",
+            primary25: "#444",
+            neutral0: "#000",
+            neutral5: "#111",
+            neutral10: "#222",
+            neutral20: "#999",
+            neutral30: "#aaa",
+            neutral40: "#bbb",
+            neutral50: "#bbb",
+            neutral60: "#ccc",
+            neutral70: "#ccc",
+            neutral80: "#ddd",
+            neutral90: "#ddd"
+          }
+        })
+      })
+    )
+  ] });
+}
+var SelectLabel = _styled2.default.label`
+  font-size: 10px;
+  position: absolute;
+  z-index: ${_chunkZU72XWNEcjs.z.select + 1};
+  background-color: ${({ theme }) => theme.bg};
+  color: ${({ theme, hasError }) => hasError ? theme.danger : theme.mcNeutral};
+  font-weight: 600;
+  padding: 0px 6px;
+  left: 12px;
+  top: -6px;
+`;
+var StyledSelect = _styled2.default.div`
+  position: relative;
+  & + & {
+    margin-top: 8px;
+  }
+`;
+var Select_default = Select;
+
+
+
+
+
+exports.Select = Select; exports.StyledSelect = StyledSelect; exports.Select_default = Select_default;

package/dist/{chunk-QR6XKKRK.cjs → chunk-NVVAOGNL.cjs}

@@ -1,16 +1,16 @@
 "use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
-var _chunkIXV57HL7cjs = require('./chunk-IXV57HL7.cjs');
+var _chunkUN4FMYEQcjs = require('./chunk-UN4FMYEQ.cjs');
 
 
 var _chunkZU72XWNEcjs = require('./chunk-ZU72XWNE.cjs');
 
 
 
-var _chunkMNAZ4BDQcjs = require('./chunk-MNAZ4BDQ.cjs');
+var _chunk23NA5VW6cjs = require('./chunk-23NA5VW6.cjs');
 
 
-var _chunkPDZ23BEDcjs = require('./chunk-PDZ23BED.cjs');
+var _chunkJX6HEEEQcjs = require('./chunk-JX6HEEEQ.cjs');
 
 // src/styles/fields.tsx
 var _react = require('@emotion/react');
@@ -25,16 +25,16 @@ var formButtonTopMarginStyle = _react.css`
   margin-top: ${formButtonTopMargin};
 `;
 var standardBorderColor = ({ theme }) => _react.css`
-  border-color: ${_chunkPDZ23BEDcjs.themeOr.call(void 0, theme.c1Neutral, theme.mcNeutral)({ theme })};
+  border-color: ${_chunkJX6HEEEQcjs.themeOr.call(void 0, theme.c1Neutral, theme.mcNeutral)({ theme })};
 `;
 var inputBlockStyle = ({
   theme,
   hasValue,
   hasError
 }) => _react.css`
-  ${_chunkMNAZ4BDQcjs.subtext.call(void 0, { theme })}
+  ${_chunk23NA5VW6cjs.subtext.call(void 0, { theme })}
   ${standardBorderColor({ theme })}
-  ${_chunkMNAZ4BDQcjs.standardBorderRadius.call(void 0, 8)}
+  ${_chunk23NA5VW6cjs.standardBorderRadius.call(void 0, 8)}
   background-color: ${theme.bg};
   border-width: 2px;
   display: flex;
@@ -51,8 +51,8 @@ var textInputFontWeight = 600;
 var textInputBorderRadiusPx = 8;
 var textInputPaddingPx = 12;
 var textInputPadding = `${textInputPaddingPx}px`;
-var textInputBorderColor = ({ theme }) => _chunkPDZ23BEDcjs.themeOr.call(void 0, theme.c1Neutral, theme.c3Neutral)({ theme });
-var textInputBorderColorFocused = ({ theme }) => _chunkPDZ23BEDcjs.themeOr.call(void 0, theme.hcNeutral, theme.hcNeutral)({ theme });
+var textInputBorderColor = ({ theme }) => _chunkJX6HEEEQcjs.themeOr.call(void 0, theme.c1Neutral, theme.c3Neutral)({ theme });
+var textInputBorderColorFocused = ({ theme }) => _chunkJX6HEEEQcjs.themeOr.call(void 0, theme.hcNeutral, theme.hcNeutral)({ theme });
 var textInputActiveStyles = ({
   theme,
   paddingLeftPx,
@@ -76,11 +76,12 @@ var textInputStyle = ({
   hasError,
   paddingLeftPx,
   paddingRightPx,
-  typography
+  typography,
+  borderRadius
 }) => {
   var _a;
   return _react.css`
-  border-radius: ${textInputBorderRadiusPx}px;
+  border-radius: ${borderRadius === "round" ? "999" : textInputBorderRadiusPx}px;
   background-color: ${disabled ? theme.vlcNeutral : theme.inputBackground};
   cursor: ${disabled ? "not-allowed" : "auto"};
   box-sizing: border-box;
@@ -98,7 +99,7 @@ var textInputStyle = ({
   line-height: 22px;
   outline: none;
 
-  ${_chunkIXV57HL7cjs.applyTypography.call(void 0, 
+  ${_chunkUN4FMYEQcjs.applyTypography.call(void 0, 
     theme,
     (typography == null ? void 0 : typography.type) || defaultTextInputTypography.type,
     (typography == null ? void 0 : typography.size) || defaultTextInputTypography.size,
@@ -207,11 +208,11 @@ var labelStyle = ({
   }
 `;
 var Label = _styled2.default.label`
-  ${_chunkMNAZ4BDQcjs.subtext}
+  ${_chunk23NA5VW6cjs.subtext}
   ${labelStyle}
 `;
 var LabelDiv = _styled2.default.div`
-  ${_chunkMNAZ4BDQcjs.subtext}
+  ${_chunk23NA5VW6cjs.subtext}
   ${labelStyle}
 `;
 

package/dist/chunk-NXSA7WNB.js

@@ -0,0 +1,41 @@
+import {
+  toReactNodesBase
+} from "./chunk-HQO3PIAY.js";
+import {
+  isTextNode
+} from "./chunk-G5IVQ4O3.js";
+import {
+  renderTypography
+} from "./chunk-5GLOHTP6.js";
+import {
+  __objRest,
+  __spreadProps,
+  __spreadValues
+} from "./chunk-CWMXXUWU.js";
+
+// src/utils/toReactNodes/toReactNodes.tsx
+import { ensureArray } from "@lightsparkdev/core";
+import { Fragment } from "react";
+import { jsx } from "@emotion/react/jsx-runtime";
+function toReactNodes(toReactNodesArg) {
+  const toReactNodesArray = ensureArray(toReactNodesArg);
+  const reactNodes = toReactNodesArray.map((node, i) => {
+    let content;
+    if (!node) {
+      return null;
+    } else if (isTextNode(node) && node.typography) {
+      const _a = node.typography, { type: typographyType } = _a, typographyProps = __objRest(_a, ["type"]);
+      content = /* @__PURE__ */ jsx(Fragment, { children: renderTypography(typographyType, __spreadProps(__spreadValues({}, typographyProps), {
+        content: node.text
+      })) }, `typography-${i}-${node.text.substr(0, 10)}`);
+    } else {
+      content = toReactNodesBase(node);
+    }
+    return content || null;
+  });
+  return /* @__PURE__ */ jsx(Fragment, { children: reactNodes });
+}
+
+export {
+  toReactNodes
+};

package/dist/{chunk-PBYLFD52.cjs → chunk-O2MMD4LF.cjs}

@@ -1,40 +1,40 @@
 "use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
-var _chunk3ET7MRCRcjs = require('./chunk-3ET7MRCR.cjs');
+var _chunkCJ3GSEW5cjs = require('./chunk-CJ3GSEW5.cjs');
 
 
-var _chunkTTWRXIOPcjs = require('./chunk-TTWRXIOP.cjs');
+var _chunk22I3LZGWcjs = require('./chunk-22I3LZGW.cjs');
 
 
-var _chunkFQWU3AUOcjs = require('./chunk-FQWU3AUO.cjs');
+var _chunkUJKCQS5Ccjs = require('./chunk-UJKCQS5C.cjs');
 
 
-var _chunkZFRMFHCUcjs = require('./chunk-ZFRMFHCU.cjs');
+var _chunkZC7NYTXWcjs = require('./chunk-ZC7NYTXW.cjs');
 
 
-var _chunkE42IFW4Ecjs = require('./chunk-E42IFW4E.cjs');
 
+var _chunkSFTKSNEKcjs = require('./chunk-SFTKSNEK.cjs');
 
 
-var _chunk7OBPNS6Wcjs = require('./chunk-7OBPNS6W.cjs');
+var _chunkZUAO4DW3cjs = require('./chunk-ZUAO4DW3.cjs');
 
 
-var _chunk6VA4SAHQcjs = require('./chunk-6VA4SAHQ.cjs');
+var _chunkYB3AGHD5cjs = require('./chunk-YB3AGHD5.cjs');
 
 
-var _chunkZUAO4DW3cjs = require('./chunk-ZUAO4DW3.cjs');
+var _chunkZO52GP5Zcjs = require('./chunk-ZO52GP5Z.cjs');
 
 
-var _chunkSODYHHOBcjs = require('./chunk-SODYHHOB.cjs');
+var _chunk6VA4SAHQcjs = require('./chunk-6VA4SAHQ.cjs');
 
 
-var _chunkMNAZ4BDQcjs = require('./chunk-MNAZ4BDQ.cjs');
+var _chunk23NA5VW6cjs = require('./chunk-23NA5VW6.cjs');
 
 
-var _chunkEKCGBLIHcjs = require('./chunk-EKCGBLIH.cjs');
+var _chunkDCQM7IVKcjs = require('./chunk-DCQM7IVK.cjs');
 
 
-var _chunkKSKKC6C2cjs = require('./chunk-KSKKC6C2.cjs');
+var _chunkO7USIZI6cjs = require('./chunk-O7USIZI6.cjs');
 
 // src/components/typography/Article.tsx
 var _styled = require('@emotion/styled'); var _styled2 = _interopRequireDefault(_styled);
@@ -50,53 +50,53 @@ function Article({ defaultTypography, children }) {
   );
 }
 var StyledArticle = _styled2.default.article`
-  ${({ theme, type, size }) => _chunkEKCGBLIHcjs.getTypographyString.call(void 0, theme, type, size)}
+  ${({ theme, type, size }) => _chunkDCQM7IVKcjs.getTypographyString.call(void 0, theme, type, size)}
 
-  ${_chunkFQWU3AUOcjs.displaySelector.call(void 0, "h1")} {
+  ${_chunkUJKCQS5Ccjs.displaySelector.call(void 0, "h1")} {
     margin: 0;
   }
 
-  ${_chunk7OBPNS6Wcjs.headlineSelector.call(void 0, "h1")} {
+  ${_chunkSFTKSNEKcjs.headlineSelector.call(void 0, "h1")} {
     margin: 0;
     padding-bottom: ${_chunkZUAO4DW3cjs.Spacing.px.xs};
   }
 
-  ${_chunk7OBPNS6Wcjs.headlineSelector.call(void 0, "h2")} {
+  ${_chunkSFTKSNEKcjs.headlineSelector.call(void 0, "h2")} {
     padding-top: ${_chunkZUAO4DW3cjs.Spacing.px["2xl"]};
     padding-bottom: ${_chunkZUAO4DW3cjs.Spacing.px.xs};
     margin: 0;
   }
 
-  ${_chunk7OBPNS6Wcjs.headlineSelector.call(void 0, "h3")} {
+  ${_chunkSFTKSNEKcjs.headlineSelector.call(void 0, "h3")} {
     padding-top: ${_chunkZUAO4DW3cjs.Spacing.px["2xl"]};
     padding-bottom: ${_chunkZUAO4DW3cjs.Spacing.px.xs};
     margin: 0;
   }
 
-  ${_chunk7OBPNS6Wcjs.headlineSelector.call(void 0, "h4")} {
+  ${_chunkSFTKSNEKcjs.headlineSelector.call(void 0, "h4")} {
     padding-top: ${_chunkZUAO4DW3cjs.Spacing.px["2xl"]};
     padding-bottom: ${_chunkZUAO4DW3cjs.Spacing.px.xs};
     margin: 0;
   }
 
-  ${_chunk7OBPNS6Wcjs.headlineSelector.call(void 0, "h5")} {
+  ${_chunkSFTKSNEKcjs.headlineSelector.call(void 0, "h5")} {
     padding-top: ${_chunkZUAO4DW3cjs.Spacing.px["2xl"]};
     padding-bottom: ${_chunkZUAO4DW3cjs.Spacing.px.xs};
     margin: 0;
   }
 
-  ${_chunk7OBPNS6Wcjs.headlineSelector.call(void 0, "h6")} {
+  ${_chunkSFTKSNEKcjs.headlineSelector.call(void 0, "h6")} {
     padding-top: ${_chunkZUAO4DW3cjs.Spacing.px["2xl"]};
     padding-bottom: ${_chunkZUAO4DW3cjs.Spacing.px.xs};
     margin: 0;
   }
 
-  ${_chunk6VA4SAHQcjs.select.call(void 0, _chunkE42IFW4Ecjs.StyledBody)} {
+  ${_chunk6VA4SAHQcjs.select.call(void 0, _chunkZC7NYTXWcjs.StyledBody)} {
     margin-top: ${_chunkZUAO4DW3cjs.Spacing.px.xs};
     margin-bottom: ${_chunkZUAO4DW3cjs.Spacing.px.xs};
   }
 
-  ${_chunk6VA4SAHQcjs.select.call(void 0, _chunk3ET7MRCRcjs.StyledContentTable)} {
+  ${_chunk6VA4SAHQcjs.select.call(void 0, _chunkYB3AGHD5cjs.StyledContentTable)} {
     margin: ${_chunkZUAO4DW3cjs.Spacing.px["2xl"]} 0;
   }
 
@@ -110,9 +110,9 @@ var StyledArticle = _styled2.default.article`
     font-weight: 700;
   }
 
-  *:not(${_chunk7OBPNS6Wcjs.ALL_HEADLINE_SELECTORS},${_chunk6VA4SAHQcjs.select.call(void 0, _chunkZFRMFHCUcjs.StyledTitle)},${_chunk6VA4SAHQcjs.select.call(void 0, _chunkTTWRXIOPcjs.StyledCode)})
+  *:not(${_chunkSFTKSNEKcjs.ALL_HEADLINE_SELECTORS},${_chunk6VA4SAHQcjs.select.call(void 0, _chunkCJ3GSEW5cjs.StyledTitle)},${_chunk6VA4SAHQcjs.select.call(void 0, _chunk22I3LZGWcjs.StyledCode)})
     > a {
-    ${({ theme }) => _chunkEKCGBLIHcjs.getTypographyString.call(void 0, theme, "Label Strong", "Large")}
+    ${({ theme }) => _chunkDCQM7IVKcjs.getTypographyString.call(void 0, theme, "Label Strong", "Large")}
     font-size: inherit;
     color: ${({ theme }) => theme.link};
   }
@@ -128,22 +128,22 @@ var StyledArticle = _styled2.default.article`
   }
 
   li {
-    ${({ theme }) => _chunkEKCGBLIHcjs.getTypographyString.call(void 0, theme, "Body", "Medium")}
+    ${({ theme }) => _chunkDCQM7IVKcjs.getTypographyString.call(void 0, theme, "Body", "Medium")}
     :not(:last-child) {
       margin-bottom: ${_chunkZUAO4DW3cjs.Spacing.px["3xs"]};
     }
   }
 
   code:not([class|="language"]) {
-    ${({ theme }) => _chunkEKCGBLIHcjs.getTypographyString.call(void 0, theme, "Code", "Medium")}
-    background: ${_chunkKSKKC6C2cjs.colors.grayBlue94};
+    ${({ theme }) => _chunkDCQM7IVKcjs.getTypographyString.call(void 0, theme, "Code", "Medium")}
+    background: ${_chunkO7USIZI6cjs.colors.grayBlue94};
     padding: ${_chunkZUAO4DW3cjs.Spacing.px["4xs"]} ${_chunkZUAO4DW3cjs.Spacing.px["2xs"]};
     margin: ${_chunkZUAO4DW3cjs.Spacing.px["4xs"]};
     border-radius: 4px;
   }
 
   pre[class|="language"] {
-    ${_chunkMNAZ4BDQcjs.standardBorderRadius.call(void 0, 8)}
+    ${_chunk23NA5VW6cjs.standardBorderRadius.call(void 0, 8)}
     width: 100%;
     padding: ${_chunkZUAO4DW3cjs.Spacing.px.md} ${_chunkZUAO4DW3cjs.Spacing.px.lg};
     margin: ${_chunkZUAO4DW3cjs.Spacing.px.md} 0;
@@ -152,9 +152,9 @@ var StyledArticle = _styled2.default.article`
   // Must match specificity of prismjs to get proper line height!
   pre[class|="language"],
   code[class|="language"] {
-    ${({ theme }) => _chunkEKCGBLIHcjs.getTypographyString.call(void 0, theme, "Code", "Small")}
+    ${({ theme }) => _chunkDCQM7IVKcjs.getTypographyString.call(void 0, theme, "Code", "Small")}
 
-    ${_chunkSODYHHOBcjs.overflowAutoWithoutScrollbars}
+    ${_chunkZO52GP5Zcjs.overflowAutoWithoutScrollbars}
   }
 
   blockquote {

package/dist/{chunk-LWXTVAZ6.js → chunk-O37IA7LS.js}

@@ -1,9 +1,9 @@
 import {
   GlobalStyles
-} from "./chunk-5BNDOQKG.js";
+} from "./chunk-AOBHSOUN.js";
 import {
   themes
-} from "./chunk-I4NIA4SD.js";
+} from "./chunk-GZW6KBUI.js";
 
 // src/components/LightsparkProvider.tsx
 import { ThemeProvider } from "@emotion/react";

package/dist/{chunk-TWG7OQT7.js → chunk-O7EVPXE5.js}

@@ -1,18 +1,18 @@
+import {
+  flexCenter
+} from "./chunk-IGZYEIQS.js";
 import {
   Loading
-} from "./chunk-7GCXP2EW.js";
+} from "./chunk-QJPQJXJ2.js";
 import {
   UnstyledButton
-} from "./chunk-H47HIU2F.js";
-import {
-  flexCenter
-} from "./chunk-JQV6H76U.js";
+} from "./chunk-EYWGUIVP.js";
 import {
   Icon
-} from "./chunk-UACBVBBE.js";
+} from "./chunk-K3DMPJSX.js";
 import {
   colors
-} from "./chunk-REL56P3K.js";
+} from "./chunk-RTRS42I3.js";
 
 // src/components/Pill.tsx
 import styled from "@emotion/styled";

package/dist/{chunk-KSKKC6C2.cjs → chunk-O7USIZI6.cjs}

@@ -1,7 +1,7 @@
 "use strict";Object.defineProperty(exports, "__esModule", {value: true});
 
 
-var _chunkLKKJVJCGcjs = require('./chunk-LKKJVJCG.cjs');
+var _chunkYM5JDZDQcjs = require('./chunk-YM5JDZDQ.cjs');
 
 // src/styles/colors.tsx
 var neutral = {
@@ -16,6 +16,7 @@ var neutral = {
   gray50: "#808080",
   gray60: "#999999",
   gray70: "#B3B3B3",
+  gray75: "#BFBFBF",
   gray80: "#CCCCCC",
   gray85: "#D9D9D9",
   gray90: "#E6E6E6",
@@ -26,7 +27,7 @@ var neutral = {
 };
 var darkGradient = "#1d1d1d linear-gradient(180deg, #090909 63.08%, #1d1d1d 100.52%)";
 var primary = "#FFF14E";
-var baseColors = _chunkLKKJVJCGcjs.__spreadProps.call(void 0, _chunkLKKJVJCGcjs.__spreadValues.call(void 0, {}, neutral), {
+var baseColors = _chunkYM5JDZDQcjs.__spreadProps.call(void 0, _chunkYM5JDZDQcjs.__spreadValues.call(void 0, {}, neutral), {
   // green
   success: "#17C27C",
   green33: "#179257",
@@ -70,8 +71,7 @@ function isColorKey(key) {
 function hcNeutralFromBg(bgHex, defaultHex = colors.black, altHex = colors.white) {
   const bgRGB = hexToRGB(bgHex);
   const hcRGB = hexToRGB(defaultHex);
-  if (!bgRGB || !hcRGB)
-    return defaultHex;
+  if (!bgRGB || !hcRGB) return defaultHex;
   const c = contrast(bgRGB, hcRGB);
   if (c < 4.5) {
     return altHex;

package/dist/chunk-ODJXKX67.cjs

@@ -0,0 +1,101 @@
+"use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+var _chunkJT3HYZXJcjs = require('./chunk-JT3HYZXJ.cjs');
+
+
+var _chunkNROZVENVcjs = require('./chunk-NROZVENV.cjs');
+
+
+var _chunkZUAO4DW3cjs = require('./chunk-ZUAO4DW3.cjs');
+
+
+var _chunk3XWROTDTcjs = require('./chunk-3XWROTDT.cjs');
+
+
+
+var _chunkYM5JDZDQcjs = require('./chunk-YM5JDZDQ.cjs');
+
+// src/components/DataManagerTable/EnumFilter.tsx
+var _styled = require('@emotion/styled'); var _styled2 = _interopRequireDefault(_styled);
+var _core = require('@lightsparkdev/core');
+var _jsxruntime = require('@emotion/react/jsx-runtime');
+var isEnumFilterState = (state) => state.type === "enum" /* ENUM */;
+var getDefaultEnumFilterState = () => ({
+  type: "enum" /* ENUM */,
+  value: "",
+  isApplied: false
+});
+var EnumFilter = ({
+  updateFilterState,
+  state,
+  options,
+  placeholder,
+  label,
+  isMulti
+}) => {
+  var _a;
+  const appliedValueButtons = (_a = state.appliedValues) == null ? void 0 : _a.map((value) => {
+    return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+      _chunk3XWROTDTcjs.Button,
+      {
+        kind: "primary",
+        size: "ExtraSmall",
+        text: value,
+        icon: "Close",
+        iconSide: "right",
+        onClick: () => {
+          var _a2;
+          updateFilterState(_chunkYM5JDZDQcjs.__spreadProps.call(void 0, _chunkYM5JDZDQcjs.__spreadValues.call(void 0, {}, state), {
+            appliedValues: (_a2 = state.appliedValues) == null ? void 0 : _a2.filter(
+              (appliedValue) => appliedValue !== value
+            )
+          }));
+        }
+      },
+      value
+    );
+  });
+  return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _jsxruntime.Fragment, { children: [
+    /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkJT3HYZXJcjs.Filter, { label, children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+      _chunkNROZVENVcjs.Select_default,
+      {
+        placeholder: "Select event",
+        options,
+        onChange: (option) => {
+          if (option) {
+            const optionValues = _core.ensureArray.call(void 0, option.value);
+            let updatedAppliedValues = [];
+            if (isMulti) {
+              updatedAppliedValues = state.appliedValues ? [
+                ...state.appliedValues.filter(
+                  (appliedValue) => appliedValue !== option.value
+                ),
+                ...optionValues
+              ] : [...optionValues];
+            } else {
+              updatedAppliedValues = [...optionValues];
+            }
+            updateFilterState(_chunkYM5JDZDQcjs.__spreadProps.call(void 0, _chunkYM5JDZDQcjs.__spreadValues.call(void 0, {}, state), {
+              value: option.label,
+              isApplied: true,
+              appliedValues: updatedAppliedValues
+            }));
+          }
+        }
+      }
+    ) }),
+    !!(appliedValueButtons == null ? void 0 : appliedValueButtons.length) ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, AppliedButtonsContainer, { children: appliedValueButtons }) : null
+  ] });
+};
+var AppliedButtonsContainer = _styled2.default.div`
+  margin-top: ${_chunkZUAO4DW3cjs.Spacing.px.sm};
+  display: flex;
+  gap: ${_chunkZUAO4DW3cjs.Spacing.px.xs};
+  flex-wrap: wrap;
+`;
+
+
+
+
+
+exports.isEnumFilterState = isEnumFilterState; exports.getDefaultEnumFilterState = getDefaultEnumFilterState; exports.EnumFilter = EnumFilter;