@cerebruminc/cerebellum 13.6.2 → 13.7.0

package/lib/esm/Search.js

@@ -1,16 +1,16 @@
-import { _ as __assign } from './_tslib-1a4c929e.js';
+import { _ as __assign } from './_tslib-Cea_sJmA.js';
 import { jsx, jsxs } from 'react/jsx-runtime';
-import { b as boxColorLookup } from './colors-12bf079c.js';
-import { S as Svg, I as IconBox, B as BoringSpan, a as InnerIconBox } from './IconComponentStyles-091931ba.js';
+import { b as boxColorLookup } from './colors-D-UTb8yU.js';
+import { S as Svg, I as IconBox, B as BoringSpan, a as InnerIconBox } from './IconComponentStyles-BBt1vuNf.js';
 import './colors.js';
 import './pressedEnter.js';
 import 'styled-components';
 
-var Search = function (props) {
-    var _a = props.boxed, boxed = _a === void 0 ? false : _a, _b = props.boxedSize, boxedSize = _b === void 0 ? 67 : _b, boxColor = props.boxColor, _c = props.fill, fill = _c === void 0 ? "#000000" : _c, _d = props.round, round = _d === void 0 ? false : _d, _e = props.scale, scale = _e === void 0 ? 1 : _e, title = props.title;
-    var Container = boxed || round ? IconBox : BoringSpan;
-    var InnerContainer = boxed || round ? InnerIconBox : BoringSpan;
-    return (jsx(Container, __assign({ "$boxedSize": boxedSize }, { children: jsx(InnerContainer, __assign({ "$boxColor": boxColor !== null && boxColor !== void 0 ? boxColor : boxColorLookup(fill), "$round": round, "$paddingString": round ? "35%" : "29.9%" }, { children: jsxs(Svg, __assign({ version: "1.1", x: "0px", y: "0px", role: "img" }, (title ? { "aria-labelledby": "search-icon-title-id" } : { "aria-hidden": "true" }), { viewBox: "0 0 415 415", scale: scale }, { children: [title && jsx("title", __assign({ id: "search-icon-title-id" }, { children: title }), void 0), jsx("path", { fill: fill, d: "M408.7,373.4l-94.1-94.1v0c22.6-30.2,34.9-66.9,34.8-104.6C349.4,78.4,271.1,0,174.7,0S0,78.4,0,174.7\ts78.4,174.7,174.7,174.7l0,0c37.7,0,74.4-12.2,104.6-34.8l94.1,94.1l0,0c10.3,9.2,26.1,8.3,35.3-2\tC417.2,397.2,417.2,382.9,408.7,373.4L408.7,373.4z M49.9,174.7L49.9,174.7c0-68.9,55.9-124.8,124.8-124.8\tc68.9,0,124.8,55.9,124.8,124.8s-55.9,124.8-124.8,124.8l0,0C105.8,299.4,50,243.6,49.9,174.7L49.9,174.7z" }, void 0)] }), void 0) }), void 0) }), void 0));
+var Search = function (props) {
+    var _a = props.boxed, boxed = _a === void 0 ? false : _a, _b = props.boxedSize, boxedSize = _b === void 0 ? 67 : _b, boxColor = props.boxColor, _c = props.fill, fill = _c === void 0 ? "#000000" : _c, _d = props.round, round = _d === void 0 ? false : _d, _e = props.scale, scale = _e === void 0 ? 1 : _e, title = props.title;
+    var Container = boxed || round ? IconBox : BoringSpan;
+    var InnerContainer = boxed || round ? InnerIconBox : BoringSpan;
+    return (jsx(Container, { "$boxedSize": boxedSize, children: jsx(InnerContainer, { "$boxColor": boxColor !== null && boxColor !== void 0 ? boxColor : boxColorLookup(fill), "$round": round, "$paddingString": round ? "35%" : "29.9%", children: jsxs(Svg, __assign({ version: "1.1", x: "0px", y: "0px", role: "img" }, (title ? { "aria-labelledby": "search-icon-title-id" } : { "aria-hidden": "true" }), { viewBox: "0 0 415 415", scale: scale, children: [title && jsx("title", { id: "search-icon-title-id", children: title }), jsx("path", { fill: fill, d: "M408.7,373.4l-94.1-94.1v0c22.6-30.2,34.9-66.9,34.8-104.6C349.4,78.4,271.1,0,174.7,0S0,78.4,0,174.7\ts78.4,174.7,174.7,174.7l0,0c37.7,0,74.4-12.2,104.6-34.8l94.1,94.1l0,0c10.3,9.2,26.1,8.3,35.3-2\tC417.2,397.2,417.2,382.9,408.7,373.4L408.7,373.4z M49.9,174.7L49.9,174.7c0-68.9,55.9-124.8,124.8-124.8\tc68.9,0,124.8,55.9,124.8,124.8s-55.9,124.8-124.8,124.8l0,0C105.8,299.4,50,243.6,49.9,174.7L49.9,174.7z" })] })) }) }));
 };
 
 export { Search };

package/lib/esm/SearchInput-2TWxL_-B.js

@@ -0,0 +1,78 @@
+import { b as __makeTemplateObject, _ as __assign } from './_tslib-Cea_sJmA.js';
+import { jsxs, jsx } from 'react/jsx-runtime';
+import { useRef, useState, useEffect } from 'react';
+import { I as IconButton } from './IconButton-E4owK8Nt.js';
+import { colors } from './colors.js';
+import './IconComponentStyles-BBt1vuNf.js';
+import { Search } from './Search.js';
+import { I as InlineInput } from './InlineInput-Ch6CfLME.js';
+import { ButtonColorFamilyEnum } from './ButtonColorFamilyEnum.js';
+import { styled } from 'styled-components';
+
+var SearchBase = styled.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  position: relative;\n  width: ", ";\n"], ["\n  position: relative;\n  width: ", ";\n"])), function (_a) {
+    var $inputWidth = _a.$inputWidth;
+    return ($inputWidth ? "".concat($inputWidth, "px") : "100%");
+});
+var IconButtonBox = styled.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  opacity: ", ";\n  pointer-events: ", ";\n  position: absolute;\n  right: 0;\n  z-index: ", ";\n  transition: ", ";\n"], ["\n  opacity: ", ";\n  pointer-events: ", ";\n  position: absolute;\n  right: 0;\n  z-index: ", ";\n  transition: ", ";\n"])), function (_a) {
+    var $inputVisible = _a.$inputVisible;
+    return ($inputVisible ? 0 : 1);
+}, function (_a) {
+    var $inputVisible = _a.$inputVisible;
+    return ($inputVisible ? "none" : "all");
+}, function (_a) {
+    var $inputVisible = _a.$inputVisible;
+    return ($inputVisible ? 0 : 1);
+}, function (_a) {
+    var $inputVisible = _a.$inputVisible;
+    return ($inputVisible ? "opacity 100ms ease-out 50ms" : "opacity 200ms ease-out 300ms");
+});
+var InputSleeve = styled.div(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n  position: relative;\n  opacity: ", ";\n  transform: ", ";\n  transition: opacity 350ms ease-out 50ms, transform 350ms ease-out 50ms;\n"], ["\n  position: relative;\n  opacity: ", ";\n  transform: ", ";\n  transition: opacity 350ms ease-out 50ms, transform 350ms ease-out 50ms;\n"])), function (_a) {
+    var $inputVisible = _a.$inputVisible;
+    return ($inputVisible ? 1 : 0);
+}, function (_a) {
+    var $inputVisible = _a.$inputVisible;
+    return ($inputVisible ? "translate3d(0, 0, 0)" : "translate3d(100%, 0, 0)");
+});
+var templateObject_1, templateObject_2, templateObject_3;
+
+var EXPANDABLE_ICON_BUTTON = "Click to open search";
+var SEARCH_INPUT_WRAPPER_ID = "searchInputWrapper";
+var SearchInput = function (_a) {
+    var _b = _a.activeBackgroundColor, activeBackgroundColor = _b === void 0 ? colors.WHITE : _b, characterLimit = _a.characterLimit, _c = _a.clearButton, clearButton = _c === void 0 ? true : _c, expandable = _a.expandable, focus = _a.focus, innerRef = _a.innerRef, _d = _a.inputBackgroundColor, inputBackgroundColor = _d === void 0 ? colors.COOL_GREY_5 : _d, _e = _a.inputHeight, inputHeight = _e === void 0 ? 39 : _e, inputWidth = _a.inputWidth, name = _a.name, onEnter = _a.onEnter, onInputBlur = _a.onInputBlur, onInputFocus = _a.onInputFocus, onChange = _a.onChange, onValueChange = _a.onValueChange, placeholder = _a.placeholder, placeholderColor = _a.placeholderColor, _f = _a.searchIconColor, searchIconColor = _f === void 0 ? colors.COOL_GREY_45 : _f, sidePadding = _a.sidePadding, textColor = _a.textColor, textFontSize = _a.textFontSize, value = _a.value;
+    var inputRef = innerRef || useRef(null);
+    var _g = useState(!expandable), inputVisible = _g[0], setInputVisible = _g[1];
+    var inputBorderRadius = inputHeight ? inputHeight / 2 : 25;
+    var showInput = function () {
+        setInputVisible(true);
+        setTimeout(function () {
+            var _a;
+            (_a = inputRef === null || inputRef === void 0 ? void 0 : inputRef.current) === null || _a === void 0 ? void 0 : _a.focus();
+        }, 1);
+    };
+    useEffect(function () {
+        if (focus) {
+            showInput();
+        }
+    }, [focus]);
+    return (jsxs(SearchBase, { "$inputWidth": inputWidth, children: [expandable && (jsx(IconButtonBox, { "$inputVisible": inputVisible, children: jsx(IconButton, { ariaLabel: EXPANDABLE_ICON_BUTTON, colorFamily: ButtonColorFamilyEnum.CoolGrey, Icon: Search, onClick: showInput, disabled: inputVisible, size: inputHeight }) })), jsx(InputSleeve, { "$inputVisible": inputVisible, "data-testid": SEARCH_INPUT_WRAPPER_ID, children: jsx(InlineInput, __assign({ activeBackgroundColor: activeBackgroundColor, activeBorderColor: colors.BLUE_100, activeColor: colors.BLUE_100, "aria-label": "Search", characterLimit: characterLimit, clearButton: clearButton, onChange: function (event) {
+                        onValueChange === null || onValueChange === void 0 ? void 0 : onValueChange(event.target.value);
+                        onChange === null || onChange === void 0 ? void 0 : onChange(event);
+                    }, disabled: !inputVisible, focus: focus, hoverBorderColor: colors.COOL_GREY_5, inactiveBorderColor: colors.COOL_GREY_5, innerRef: inputRef, inputBackgroundColor: inputBackgroundColor, inputBorderRadius: inputVisible ? 8 : inputBorderRadius, inputHeight: inputHeight, inputLabel: "Search", inputWidth: inputVisible ? inputWidth : inputHeight }, (name ? { name: name } : {}), { LeadingIcon: Search, leadingIconColor: searchIconColor, onInputBlur: function (event) {
+                        if (onInputBlur) {
+                            onInputBlur(event);
+                        }
+                        if (expandable && !value) {
+                            setInputVisible(false);
+                        }
+                    }, onInputFocus: function (event) {
+                        if (onInputFocus) {
+                            onInputFocus(event);
+                        }
+                        if (expandable) {
+                            setInputVisible(true);
+                        }
+                    }, onEnter: onEnter, placeholder: placeholder, placeholderColor: placeholderColor, sidePadding: sidePadding, textColor: textColor, textFontSize: textFontSize, type: "text", value: value })) })] }));
+};
+
+export { SearchInput as S };
+//# sourceMappingURL=SearchInput-2TWxL_-B.js.map

package/lib/esm/SearchInput-2TWxL_-B.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SearchInput-2TWxL_-B.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/lib/esm/SearchInput.js

@@ -1,17 +1,17 @@
-export { S as SearchInput } from './SearchInput-ca23eec0.js';
-import './_tslib-1a4c929e.js';
+export { S as SearchInput } from './SearchInput-2TWxL_-B.js';
+import './_tslib-Cea_sJmA.js';
 import 'react/jsx-runtime';
 import 'react';
-import './IconButton-58bf3c70.js';
+import './IconButton-E4owK8Nt.js';
 import 'styled-components';
 import './pressedEnter.js';
 import './ButtonColorFamilyEnum.js';
 import './focusAfter.js';
 import './colors.js';
-import './IconComponentStyles-091931ba.js';
+import './IconComponentStyles-BBt1vuNf.js';
 import './Search.js';
-import './colors-12bf079c.js';
-import './InlineInput-b032bad6.js';
+import './colors-D-UTb8yU.js';
+import './InlineInput-Ch6CfLME.js';
 import './CloseCircle.js';
-import './Inputs-e6fa30e2.js';
+import './Inputs-CDGsS9tQ.js';
 //# sourceMappingURL=SearchInput.js.map

package/lib/esm/SearchMenu-h5HqVgJs.js

@@ -0,0 +1,343 @@
+import { b as __makeTemplateObject, _ as __assign, a as __spreadArray } from './_tslib-Cea_sJmA.js';
+import { jsx, jsxs } from 'react/jsx-runtime';
+import { useState, useRef, useEffect } from 'react';
+import { styled, useTheme } from 'styled-components';
+import { C as Checkbox } from './Checkbox-BdrC_AX0.js';
+import { colors } from './colors.js';
+import { pressedEnter } from './pressedEnter.js';
+import './IconComponentStyles-BBt1vuNf.js';
+import { Search } from './Search.js';
+import { I as InlineInput } from './InlineInput-Ch6CfLME.js';
+import { R as Radio } from './Radio-DkEF92KD.js';
+import { T as TextLink } from './TextLink-g0qDn7WU.js';
+import { T as TruncatePicker } from './TruncatePicker-CMfshChw.js';
+import { S as SearchInput } from './SearchInput-2TWxL_-B.js';
+import { useFocus } from './useFocus.js';
+import { f as filterOptions } from './filtering-D9dGwiF6.js';
+import './Loading.js';
+import { Scroller } from './Scroller.js';
+import { TextStyleEnum } from './ButtonColorFamilyEnum.js';
+import { BodySSecondary } from './BodyLEmphasis.js';
+import { clearAfter } from './focusAfter.js';
+
+var Menu = styled.span(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  background-color: ", ";\n  border-radius: ", "px;\n  box-shadow: ", ";\n  display: block;\n  max-width: 700px;\n  ", ";\n"], ["\n  background-color: ", ";\n  border-radius: ", "px;\n  box-shadow: ", ";\n  display: block;\n  max-width: 700px;\n  ", ";\n"])), function (_a) {
+    var _b;
+    var $backgroundColor = _a.$backgroundColor, theme = _a.theme;
+    return $backgroundColor || ((_b = theme.searchMenu) === null || _b === void 0 ? void 0 : _b.backgroundColor);
+}, function (_a) {
+    var _b;
+    var $borderRadius = _a.$borderRadius, theme = _a.theme;
+    return $borderRadius || ((_b = theme.searchMenu) === null || _b === void 0 ? void 0 : _b.borderRadius);
+}, function (_a) {
+    var _b;
+    var $boxShadow = _a.$boxShadow, theme = _a.theme;
+    return $boxShadow || ((_b = theme.searchMenu) === null || _b === void 0 ? void 0 : _b.boxShadow);
+}, clearAfter);
+var AltSearchWrapper = styled.span(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  display: block;\n  padding: ", "px 15px 0;\n"], ["\n  display: block;\n  padding: ", "px 15px 0;\n"])), function (_a) {
+    var $roomForHeader = _a.$roomForHeader;
+    return ($roomForHeader ? 8 : 15);
+});
+var SearchWrapper = styled.span(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n  display: block;\n  padding: 10px 10px 0;\n"], ["\n  display: block;\n  padding: 10px 10px 0;\n"])));
+var Header = styled.span(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n  display: flex;\n  justify-content: space-between;\n  padding: 22px 16px 0 23px;\n"], ["\n  display: flex;\n  justify-content: space-between;\n  padding: 22px 16px 0 23px;\n"])));
+var HeaderTitle = styled(BodySSecondary)(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n  color: ", ";\n  min-width: 0;\n"], ["\n  color: ", ";\n  min-width: 0;\n"])), function (_a) {
+    var $textColor = _a.$textColor;
+    return $textColor;
+});
+var TextLinkBox = styled.span(templateObject_6 || (templateObject_6 = __makeTemplateObject(["\n  display: block;\n  min-width: 0;\n  text-align: right;\n"], ["\n  display: block;\n  min-width: 0;\n  text-align: right;\n"])));
+var ContentPad = styled(function (props) { return jsx(Scroller, __assign({}, props)); })(templateObject_7 || (templateObject_7 = __makeTemplateObject(["\n  max-height: ", "px;\n  overflow: auto;\n  padding-top: ", "px;\n  padding-bottom: ", "px;\n  width: calc(100% - ", "px);\n  overscroll-behavior-y: contain;\n"], ["\n  max-height: ", "px;\n  overflow: auto;\n  padding-top: ", "px;\n  padding-bottom: ", "px;\n  width: calc(100% - ", "px);\n  overscroll-behavior-y: contain;\n"])), function (_a) {
+    var _b;
+    var $hasButton = _a.$hasButton, $searchVisible = _a.$searchVisible, $maxHeight = _a.$maxHeight, theme = _a.theme;
+    return ($maxHeight || ((_b = theme.searchMenu) === null || _b === void 0 ? void 0 : _b.maxHeight) || 256) - ($searchVisible ? 75 : 0) - ($hasButton ? 50 : 0);
+}, function (_a) {
+    var $menuVerticalPadding = _a.$menuVerticalPadding, theme = _a.theme, $wrapText = _a.$wrapText;
+    return ($menuVerticalPadding || theme.searchMenu.menuVerticalPadding) - ($wrapText ? 0 : 1);
+}, function (_a) {
+    var $menuBottomPadding = _a.$menuBottomPadding, $menuVerticalPadding = _a.$menuVerticalPadding, theme = _a.theme;
+    return $menuBottomPadding || $menuVerticalPadding || theme.searchMenu.menuBottomPadding;
+}, function (_a) {
+    var $hideScrollbarGutter = _a.$hideScrollbarGutter;
+    return ($hideScrollbarGutter ? 0 : 6);
+});
+var SubOption = styled.p(templateObject_8 || (templateObject_8 = __makeTemplateObject(["\n  font-size: ", "px;\n  font-weight: ", ";\n  height: ", ";\n  line-height: 24px;\n  min-height: 35px;\n  padding: 7px 15px 5px 20px;\n  position: relative;\n  white-space: ", ";\n  z-index: 1;\n  &:after {\n    content: \"\";\n    background-color: transparent;\n    border-radius: 4px;\n    bottom: 5px;\n    left: 0;\n    position: absolute;\n    right: 0;\n    top: 5px;\n    transition: background-color 350ms ease-out 50ms;\n    z-index: -1;\n  }\n"], ["\n  font-size: ", "px;\n  font-weight: ", ";\n  height: ", ";\n  line-height: 24px;\n  min-height: 35px;\n  padding: 7px 15px 5px 20px;\n  position: relative;\n  white-space: ", ";\n  z-index: 1;\n  &:after {\n    content: \"\";\n    background-color: transparent;\n    border-radius: 4px;\n    bottom: 5px;\n    left: 0;\n    position: absolute;\n    right: 0;\n    top: 5px;\n    transition: background-color 350ms ease-out 50ms;\n    z-index: -1;\n  }\n"])), function (_a) {
+    var _b;
+    var theme = _a.theme, $optionFontSize = _a.$optionFontSize;
+    return ($optionFontSize || ((_b = theme.searchMenu) === null || _b === void 0 ? void 0 : _b.optionFontSize) || 15) - 1;
+}, function (_a) {
+    var _b, _c;
+    var $activeOptionFontWeight = _a.$activeOptionFontWeight, theme = _a.theme, selected = _a.selected, $optionFontWeight = _a.$optionFontWeight;
+    return selected
+        ? $activeOptionFontWeight || ((_b = theme.searchMenu) === null || _b === void 0 ? void 0 : _b.activeOptionFontWeight)
+        : $optionFontWeight || ((_c = theme.searchMenu) === null || _c === void 0 ? void 0 : _c.optionFontWeight);
+}, function (_a) {
+    var $wrapText = _a.$wrapText;
+    return ($wrapText ? "auto" : "40px");
+}, function (_a) {
+    var $wrapText = _a.$wrapText;
+    return ($wrapText ? "normal" : "nowrap");
+});
+var OptionLabel = styled.p(templateObject_9 || (templateObject_9 = __makeTemplateObject(["\n  align-items: flex-start;\n  display: flex;\n  justify-content: left;\n  font-size: ", "px;\n  font-weight: ", ";\n  height: ", ";\n  min-height: 35px;\n  max-width: 100%;\n  line-height: 23px;\n  padding: 6px 15px 6px;\n  position: relative;\n  text-indent: initial;\n  white-space: ", ";\n  word-break: ", ";\n\n  z-index: 1;\n  &:after {\n    content: \"\";\n    background-color: transparent;\n    border-radius: 4px;\n    bottom: 4px;\n    left: 0;\n    position: absolute;\n    right: 0;\n    top: 3px;\n    transition: background-color 350ms ease-out 50ms;\n    z-index: -1;\n  }\n"], ["\n  align-items: flex-start;\n  display: flex;\n  justify-content: left;\n  font-size: ", "px;\n  font-weight: ", ";\n  height: ", ";\n  min-height: 35px;\n  max-width: 100%;\n  line-height: 23px;\n  padding: 6px 15px 6px;\n  position: relative;\n  text-indent: initial;\n  white-space: ", ";\n  word-break: ", ";\n\n  z-index: 1;\n  &:after {\n    content: \"\";\n    background-color: transparent;\n    border-radius: 4px;\n    bottom: 4px;\n    left: 0;\n    position: absolute;\n    right: 0;\n    top: 3px;\n    transition: background-color 350ms ease-out 50ms;\n    z-index: -1;\n  }\n"])), function (_a) {
+    var _b;
+    var theme = _a.theme, $optionFontSize = _a.$optionFontSize;
+    return $optionFontSize || ((_b = theme.searchMenu) === null || _b === void 0 ? void 0 : _b.optionFontSize);
+}, function (_a) {
+    var _b, _c;
+    var $activeOptionFontWeight = _a.$activeOptionFontWeight, theme = _a.theme, selected = _a.selected, $optionFontWeight = _a.$optionFontWeight;
+    return selected
+        ? $activeOptionFontWeight || ((_b = theme.searchMenu) === null || _b === void 0 ? void 0 : _b.activeOptionFontWeight)
+        : $optionFontWeight || ((_c = theme.searchMenu) === null || _c === void 0 ? void 0 : _c.optionFontWeight);
+}, function (_a) {
+    var $wrapText = _a.$wrapText;
+    return ($wrapText ? "auto" : "35px");
+}, function (_a) {
+    var $wrapText = _a.$wrapText;
+    return ($wrapText ? "break-spaces" : "nowrap");
+}, function (_a) {
+    var $wrapText = _a.$wrapText;
+    return ($wrapText ? "break-word" : "normal");
+});
+var LabelText = styled.span(templateObject_10 || (templateObject_10 = __makeTemplateObject(["\n  display: inline-block;\n  max-width: 100%;\n  text-indent: 0; // prevent double indent\n"], ["\n  display: inline-block;\n  max-width: 100%;\n  text-indent: 0; // prevent double indent\n"])));
+var OptionWrapper = styled.span(templateObject_11 || (templateObject_11 = __makeTemplateObject(["\n  align-items: center;\n  border-radius: 4px;\n  background-color: ", ";\n  color: ", ";\n  cursor: ", ";\n  display: block;\n  margin: 0 10px;\n  pointer-events: ", ";\n  position: relative;\n  text-align: left;\n\n  &:focus-visible {\n    outline: 1px solid ", ";\n  }\n\n  &:hover {\n    ", ":after {\n      background-color: ", ";\n    }\n    ", ":after {\n      background-color: ", ";\n    }\n  }\n"], ["\n  align-items: center;\n  border-radius: 4px;\n  background-color: ", ";\n  color: ", ";\n  cursor: ", ";\n  display: block;\n  margin: 0 10px;\n  pointer-events: ", ";\n  position: relative;\n  text-align: left;\n\n  &:focus-visible {\n    outline: 1px solid ", ";\n  }\n\n  &:hover {\n    ", ":after {\n      background-color: ", ";\n    }\n    ", ":after {\n      background-color: ", ";\n    }\n  }\n"])), function (_a) {
+    var _b;
+    var $isHovered = _a.$isHovered, $optionHoverColor = _a.$optionHoverColor, theme = _a.theme;
+    return $isHovered && ($optionHoverColor || ((_b = theme.searchMenu) === null || _b === void 0 ? void 0 : _b.optionHoverColor));
+}, function (_a) {
+    var _b, _c;
+    var $disabled = _a.$disabled, $disabledTextColor = _a.$disabledTextColor, $textColor = _a.$textColor, theme = _a.theme;
+    return $disabled ? $disabledTextColor || ((_b = theme.searchMenu) === null || _b === void 0 ? void 0 : _b.disabledTextColor) : $textColor || ((_c = theme.searchMenu) === null || _c === void 0 ? void 0 : _c.textColor);
+}, function (_a) {
+    var $clickable = _a.$clickable, $disabled = _a.$disabled;
+    return (!$clickable || $disabled ? "auto" : "pointer");
+}, function (_a) {
+    var $clickable = _a.$clickable, $disabled = _a.$disabled;
+    return (!$clickable || $disabled ? "none" : "all");
+}, function (_a) {
+    var theme = _a.theme;
+    return theme.focusColor;
+}, OptionLabel, function (_a) {
+    var _b;
+    var $disallowHover = _a.$disallowHover, $optionHoverColor = _a.$optionHoverColor, theme = _a.theme;
+    return !$disallowHover && ($optionHoverColor || ((_b = theme.searchMenu) === null || _b === void 0 ? void 0 : _b.optionHoverColor));
+}, SubOption, function (_a) {
+    var _b;
+    var $disallowHover = _a.$disallowHover, $optionHoverColor = _a.$optionHoverColor, theme = _a.theme;
+    return !$disallowHover && ($optionHoverColor || ((_b = theme.searchMenu) === null || _b === void 0 ? void 0 : _b.optionHoverColor));
+});
+var CheckboxHolder = styled.span(templateObject_12 || (templateObject_12 = __makeTemplateObject(["\n  display: inline-block;\n  position: relative;\n  left: -3px;\n  top: ", "px;\n  margin-right: 14px;\n  vertical-align: top;\n"], ["\n  display: inline-block;\n  position: relative;\n  left: -3px;\n  top: ", "px;\n  margin-right: 14px;\n  vertical-align: top;\n"])), function (_a) {
+    var $isChild = _a.$isChild, $wrapText = _a.$wrapText;
+    return ($isChild ? ($wrapText ? 4 : 5) : $wrapText ? 3 : 4);
+});
+var NoResultsMessage = styled.p(templateObject_13 || (templateObject_13 = __makeTemplateObject(["\n  color: ", ";\n  font-size: 14px;\n  text-align: center;\n  height: 40px;\n  line-height: 40px;\n  padding: 0 40px;\n"], ["\n  color: ", ";\n  font-size: 14px;\n  text-align: center;\n  height: 40px;\n  line-height: 40px;\n  padding: 0 40px;\n"])), function (_a) {
+    var _b;
+    var $textColor = _a.$textColor, theme = _a.theme;
+    return $textColor || ((_b = theme.searchMenu) === null || _b === void 0 ? void 0 : _b.textColor);
+});
+var BottomButton = styled.span(templateObject_14 || (templateObject_14 = __makeTemplateObject(["\n  border-top: 1px solid ", ";\n  cursor: pointer;\n  display: block;\n  height: 50px;\n  padding: 10px;\n  position: relative;\n  &:after {\n    content: \"\";\n    background-color: transparent;\n    border-radius: 4px;\n    transition: background-color 350ms ease-out 50ms;\n    bottom: 6px;\n    left: 10px;\n    position: absolute;\n    right: 10px;\n    top: 6px;\n    z-index: 0;\n  }\n  &:hover {\n    &:after {\n      background-color: ", ";\n    }\n  }\n  &:focus-visible {\n    outline: none;\n    &:after {\n      outline: 1px solid ", ";\n    }\n  }\n"], ["\n  border-top: 1px solid ", ";\n  cursor: pointer;\n  display: block;\n  height: 50px;\n  padding: 10px;\n  position: relative;\n  &:after {\n    content: \"\";\n    background-color: transparent;\n    border-radius: 4px;\n    transition: background-color 350ms ease-out 50ms;\n    bottom: 6px;\n    left: 10px;\n    position: absolute;\n    right: 10px;\n    top: 6px;\n    z-index: 0;\n  }\n  &:hover {\n    &:after {\n      background-color: ", ";\n    }\n  }\n  &:focus-visible {\n    outline: none;\n    &:after {\n      outline: 1px solid ", ";\n    }\n  }\n"])), colors.COOL_GREY_20, function (_a) {
+    var _b;
+    var $bottomButtonColorHover = _a.$bottomButtonColorHover, theme = _a.theme;
+    return $bottomButtonColorHover || ((_b = theme.searchMenu) === null || _b === void 0 ? void 0 : _b.bottomButtonColorHover);
+}, function (_a) {
+    var theme = _a.theme;
+    return theme.focusColor;
+});
+var ButtonIcon = styled.span(templateObject_15 || (templateObject_15 = __makeTemplateObject(["\n  display: inline-block;\n  height: 20px;\n  position: relative;\n  margin-left: 15px;\n  vertical-align: middle;\n  width: 20px;\n  z-index: 1;\n"], ["\n  display: inline-block;\n  height: 20px;\n  position: relative;\n  margin-left: 15px;\n  vertical-align: middle;\n  width: 20px;\n  z-index: 1;\n"])));
+var BottomButtonText = styled.p(templateObject_16 || (templateObject_16 = __makeTemplateObject(["\n  color: ", ";\n  display: inline-block;\n  font-size: ", "px;\n  line-height: 120%;\n  padding: 6px 10px;\n  position: relative;\n  vertical-align: middle;\n  z-index: 1;\n"], ["\n  color: ", ";\n  display: inline-block;\n  font-size: ", "px;\n  line-height: 120%;\n  padding: 6px 10px;\n  position: relative;\n  vertical-align: middle;\n  z-index: 1;\n"])), function (_a) {
+    var _b;
+    var $bottomButtonColor = _a.$bottomButtonColor, theme = _a.theme;
+    return $bottomButtonColor || ((_b = theme.searchMenu) === null || _b === void 0 ? void 0 : _b.bottomButtonColor);
+}, function (_a) {
+    var _b;
+    var theme = _a.theme, $optionFontSize = _a.$optionFontSize;
+    return $optionFontSize || ((_b = theme.searchMenu) === null || _b === void 0 ? void 0 : _b.optionFontSize);
+});
+var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5, templateObject_6, templateObject_7, templateObject_8, templateObject_9, templateObject_10, templateObject_11, templateObject_12, templateObject_13, templateObject_14, templateObject_15, templateObject_16;
+
+var SearchMenu = function (_a) {
+    var _b, _c;
+    var activeOptionFontWeight = _a.activeOptionFontWeight, activeId = _a.activeId, activeIdArray = _a.activeIdArray, altSearchStyle = _a.altSearchStyle, backgroundColor = _a.backgroundColor, borderRadius = _a.borderRadius, bottomButtonLabel = _a.bottomButtonLabel, bottomButtonClick = _a.bottomButtonClick, BottomButtonIcon = _a.BottomButtonIcon, bottomButtonColor = _a.bottomButtonColor, bottomButtonColorHover = _a.bottomButtonColorHover, boxShadow = _a.boxShadow, disabledTextColor = _a.disabledTextColor, headerTitle = _a.headerTitle, headerFunction = _a.headerFunction, _d = _a.headerFunctionLabel, headerFunctionLabel = _d === void 0 ? "Clear All" : _d, _e = _a.hideScrollbarGutter, hideScrollbarGutter = _e === void 0 ? false : _e, _f = _a.hideSearch, hideSearch = _f === void 0 ? false : _f, _g = _a.idField, idField = _g === void 0 ? "id" : _g, innerRef = _a.innerRef, innerSearch = _a.innerSearch, _h = _a.isVisible, isVisible = _h === void 0 ? true : _h, _j = _a.labelField, labelField = _j === void 0 ? "label" : _j, maxHeight = _a.maxHeight, menuBottomPadding = _a.menuBottomPadding, menuVerticalPadding = _a.menuVerticalPadding, onEsc = _a.onEsc, onSelect = _a.onSelect, options = _a.options, optionFontSize = _a.optionFontSize, optionFontWeight = _a.optionFontWeight, optionHoverColor = _a.optionHoverColor, _k = _a.predictiveTyping, predictiveTyping = _k === void 0 ? true : _k, _l = _a.preventDeselect, preventDeselect = _l === void 0 ? false : _l, _m = _a.radioButtons, radioButtons = _m === void 0 ? false : _m, searchActiveColor = _a.searchActiveColor, searchIconColor = _a.searchIconColor, textColor = _a.textColor, _o = _a.showSearchThreshold, showSearchThreshold = _o === void 0 ? 10 : _o, renderOptionLabel = _a.renderOptionLabel, wrapText = _a.wrapText;
+    var _p = useState([]), matchedOptions = _p[0], setMatchedOptions = _p[1];
+    var _q = useState(""), predictiveTextEntered = _q[0], setPredictiveTextEntered = _q[1];
+    var _r = useState(""), searchString = _r[0], setSearchString = _r[1];
+    var _s = useState(options), filteredOptions = _s[0], setFilteredOptions = _s[1];
+    // const [focus, setFocus] = useState(false);
+    var _t = useFocus(), inputTarget = _t[0], focusInputTarget = _t[1];
+    var _u = useFocus(), firstRef = _u[0], focusFirstRef = _u[1];
+    var lastRef = useFocus()[0];
+    var optionsRefArray = useRef([]);
+    var headerButtonRef = useFocus()[0];
+    var displayHeader = headerTitle || headerFunction;
+    var displaySearch = !hideSearch && !!showSearchThreshold && (options === null || options === void 0 ? void 0 : options.length) >= showSearchThreshold;
+    var hasButton = !!bottomButtonLabel && !!bottomButtonClick;
+    var theme = useTheme();
+    var multiMode = !!activeIdArray;
+    var _v = useState(""), predictiveOptionTarget = _v[0], setPredictiveOptionTarget = _v[1];
+    useEffect(function () {
+        var timer = setTimeout(function () {
+            setPredictiveTextEntered("");
+        }, 400);
+        return function () { return clearTimeout(timer); };
+    }, [predictiveTextEntered]);
+    var clickOption = function (option) {
+        var deselectAction = multiMode ? activeIdArray.includes(option[idField]) : activeId && activeId === option[idField];
+        var doNothing = deselectAction && preventDeselect;
+        if (onSelect && !doNothing && isVisible) {
+            if (deselectAction && !multiMode) {
+                onSelect();
+            }
+            else {
+                onSelect(option);
+            }
+        }
+    };
+    var onChangeSearchString = function (value) {
+        setSearchString(value);
+        var tempOptions = filterOptions({ options: options, str: value, innerSearch: innerSearch, labelField: labelField });
+        setFilteredOptions(__spreadArray([], tempOptions, true));
+    };
+    var searchMenuEventListener = function (event) {
+        var isEscPressed = event.key === "Escape" || event.keyCode === 27;
+        var isTabPressed = event.key === "Tab" || event.keyCode === 9;
+        if (!isTabPressed) {
+            if (isEscPressed) {
+                onEsc === null || onEsc === void 0 ? void 0 : onEsc(event);
+            }
+            return;
+        }
+        if (headerFunction && event.shiftKey && document.activeElement === headerButtonRef.current) {
+            lastRef.current.focus();
+            event.preventDefault();
+        }
+        if (headerFunction && displaySearch && event.shiftKey && document.activeElement === inputTarget.current) {
+            headerButtonRef.current.focus();
+            event.preventDefault();
+        }
+        else if (event.shiftKey && document.activeElement === firstRef.current) {
+            if (displaySearch) {
+                focusInputTarget();
+            }
+            else {
+                lastRef.current.focus();
+            }
+            event.preventDefault(); // prevent default tabbing
+        }
+        else if (document.activeElement === inputTarget.current && event.shiftKey) {
+            lastRef.current.focus();
+            event.preventDefault(); // prevent default tabbing
+        }
+        else if (document.activeElement === lastRef.current && !event.shiftKey) {
+            if (headerFunction) {
+                headerButtonRef.current.focus();
+            }
+            else if (displaySearch) {
+                focusInputTarget();
+            }
+            else {
+                firstRef.current.focus();
+            }
+            event.preventDefault(); // prevent default tabbing
+        }
+    };
+    // Runs when the Select is first opened
+    useEffect(function () {
+        if (isVisible) {
+            setSearchString("");
+            setFilteredOptions(options);
+            focusInputTarget();
+        }
+    }, [isVisible, options]);
+    useEffect(function () {
+        if (isVisible) {
+            if (displaySearch) {
+                focusInputTarget();
+            }
+            else {
+                focusFirstRef();
+            }
+        }
+    }, [isVisible]);
+    useEffect(function () {
+        if (isVisible) {
+            window.addEventListener("keydown", searchMenuEventListener);
+        }
+        return function () {
+            window.removeEventListener("keydown", searchMenuEventListener);
+        };
+    }, [isVisible]);
+    return (jsxs(Menu, { ref: innerRef, "$backgroundColor": backgroundColor, "$borderRadius": borderRadius, "$boxShadow": boxShadow, children: [displayHeader && (jsxs(Header, { "data-testid": "searchMenu_header", children: [jsx(HeaderTitle, { "$textColor": colors.COOL_GREY_60, children: jsx(TruncatePicker, { children: headerTitle }) }), headerFunction && (jsx(TextLinkBox, { children: jsx(TextLink, { innerRef: headerButtonRef, fontSize: 12, onClick: headerFunction, text: headerFunctionLabel || "", textColorOverride: colors.BLUE_100, textStyle: TextStyleEnum.Emphasis, truncate: true, underline: true }) }))] })), displaySearch &&
+                (altSearchStyle ? (jsx(AltSearchWrapper, { "$roomForHeader": !!displayHeader, children: jsx(SearchInput, { innerRef: inputTarget, clearButton: true, onValueChange: onChangeSearchString, searchIconColor: searchIconColor, value: searchString }) })) : (jsx(SearchWrapper, { children: jsx(InlineInput, { innerRef: inputTarget, activeColor: searchActiveColor || ((_b = theme.searchMenu) === null || _b === void 0 ? void 0 : _b.searchActiveColor), activeBorderColor: searchActiveColor || ((_c = theme.searchMenu) === null || _c === void 0 ? void 0 : _c.searchActiveColor), clearButton: true, LeadingIcon: Search, leadingIconColor: searchIconColor, onValueChange: onChangeSearchString, placeholder: "Search...", value: searchString }) }))), jsx(ContentPad, { as: Scroller, "$maxHeight": maxHeight, "$searchVisible": displaySearch, "$hasButton": hasButton, "$hideScrollbarGutter": hideScrollbarGutter, "$menuBottomPadding": menuBottomPadding, "$menuVerticalPadding": menuVerticalPadding, onKeyDown: function (event) {
+                    var _a;
+                    if (predictiveTyping) {
+                        if (pressedEnter(event) && matchedOptions.length > 0) {
+                            var lastMatchedOption = filteredOptions.filter(function (option) { return option[labelField].toLowerCase() === matchedOptions[matchedOptions.length - 1]; })[0];
+                            clickOption(lastMatchedOption);
+                        }
+                        var newKeyString = predictiveTextEntered + event.key.toLowerCase();
+                        setPredictiveTextEntered(newKeyString);
+                        for (var i = 0; i < filteredOptions.length; i++) {
+                            var filteredOption = filteredOptions[i];
+                            var optionText = filteredOption[labelField].toLowerCase();
+                            if (matchedOptions.includes(optionText)) {
+                                continue;
+                            }
+                            if (optionText.startsWith(newKeyString)) {
+                                var optionRef = (_a = optionsRefArray.current) === null || _a === void 0 ? void 0 : _a[i];
+                                optionRef.focus();
+                                optionRef.scrollIntoView();
+                                setPredictiveOptionTarget(optionText);
+                                setMatchedOptions([optionText]);
+                                break;
+                            }
+                        }
+                    }
+                }, "$wrapText": wrapText, children: filteredOptions.length > 0 ? (filteredOptions.map(function (option, index) {
+                    var isFirstOption = index === 0;
+                    var isLastOption = index === filteredOptions.length - 1 && !hasButton;
+                    var disabled = option.disabled;
+                    if (option.showChildrenOnly) {
+                        return (jsx("div", { ref: function (ref) { return (optionsRefArray.current[index] = ref); }, children: ((option === null || option === void 0 ? void 0 : option.children) || []).map(function (subOption) {
+                                var isSelected = multiMode
+                                    ? activeIdArray.includes(subOption[idField]) || activeIdArray.includes(subOption[labelField])
+                                    : !!activeId && activeId === subOption[idField];
+                                return (jsx("div", { children: jsx(OptionWrapper, { ref: isFirstOption ? firstRef : isLastOption ? lastRef : undefined, "$clickable": isVisible, "$disabled": subOption.disabled, "$disabledTextColor": disabledTextColor, onClick: function () {
+                                            clickOption(subOption);
+                                        }, onKeyPress: function (event) {
+                                            if (!disabled && pressedEnter(event)) {
+                                                clickOption(subOption);
+                                            }
+                                        }, "$optionHoverColor": optionHoverColor, role: "button", tabIndex: isVisible && !subOption.disabled ? 0 : -1, "$textColor": textColor, "$wrapMulti": wrapText && multiMode, children: renderOptionLabel ? (renderOptionLabel({ option: subOption, activeId: activeId, activeIdArray: activeIdArray }, index)) : (jsxs(SubOption, { "$activeOptionFontWeight": activeOptionFontWeight, "$optionFontSize": optionFontSize, "$optionFontWeight": optionFontWeight, selected: isSelected, "$wrapMulti": wrapText && multiMode, "$wrapText": wrapText, children: [multiMode && (jsx(CheckboxHolder, { "$wrapText": wrapText, children: jsx(Checkbox, { active: isSelected, disabled: option.disabled }) })), radioButtons && !multiMode && (jsx(CheckboxHolder, { "$wrapText": wrapText, children: jsx(Radio, { active: isSelected, disabled: option.disabled }) })), jsx(LabelText, { children: subOption[labelField] || subOption[idField] })] })) }) }, subOption[idField] || index));
+                            }) }, option[idField] || index));
+                    }
+                    else {
+                        var isSelected = multiMode
+                            ? activeIdArray.includes(option[idField]) || activeIdArray.includes(option[labelField])
+                            : !!activeId && activeId === option[idField];
+                        var disallowHover = Boolean(predictiveOptionTarget && predictiveOptionTarget !== option[labelField].toLowerCase());
+                        return (jsxs("div", { ref: function (ref) { return (optionsRefArray.current[index] = ref); }, children: [jsx(OptionWrapper, { ref: isFirstOption ? firstRef : isLastOption ? lastRef : undefined, "data-testid": "option-".concat(option.label), "$clickable": isVisible, "$disabled": option.disabled, "$disabledTextColor": disabledTextColor, "$disallowHover": disallowHover, "$isHovered": typeof option[labelField] === "string" && predictiveOptionTarget === option[labelField].toLowerCase(), onClick: function () {
+                                        clickOption(option);
+                                    }, onKeyPress: function (event) {
+                                        if (pressedEnter(event)) {
+                                            clickOption(option);
+                                        }
+                                    }, "$optionHoverColor": optionHoverColor, role: "button", tabIndex: isVisible && !option.disabled ? 0 : -1, "$textColor": textColor, "$wrapMulti": wrapText && multiMode, children: renderOptionLabel ? (renderOptionLabel({ option: option, activeId: activeId, activeIdArray: activeIdArray }, index)) : (jsxs(OptionLabel, { "$activeOptionFontWeight": activeOptionFontWeight, "$optionFontSize": optionFontSize, "$optionFontWeight": optionFontWeight, selected: isSelected, "$wrapText": wrapText, children: [multiMode && (jsx(CheckboxHolder, { "$wrapText": wrapText, children: jsx(Checkbox, { active: isSelected, disabled: option.disabled }) })), radioButtons && !multiMode && (jsx(CheckboxHolder, { "$wrapText": wrapText, children: jsx(Radio, { active: isSelected, disabled: option.disabled }) })), jsx(LabelText, { children: wrapText ? option[labelField] || option[idField] : jsx(TruncatePicker, { children: option[labelField] || option[idField] }) })] })) }), ((option === null || option === void 0 ? void 0 : option.children) || []).map(function (subOption, i) {
+                                    var activeChild = multiMode
+                                        ? activeIdArray.includes(subOption[idField])
+                                        : !!activeId && activeId === subOption[idField];
+                                    return (jsx("div", { children: jsx(OptionWrapper, { "$clickable": isVisible, "$disabled": subOption.disabled, "$disabledTextColor": disabledTextColor, onClick: function () {
+                                                clickOption(subOption);
+                                            }, onKeyPress: function (event) {
+                                                if (!disabled && pressedEnter(event)) {
+                                                    clickOption(subOption);
+                                                }
+                                            }, "$optionHoverColor": optionHoverColor, role: "button", "$textColor": textColor, tabIndex: !subOption.disabled ? 0 : -1, "$wrapMulti": wrapText && multiMode, children: renderOptionLabel ? (renderOptionLabel({ option: subOption, activeId: activeId, activeIdArray: activeIdArray }, index)) : (jsxs(SubOption, { "$activeOptionFontWeight": activeOptionFontWeight, "$optionFontSize": optionFontSize, "$optionFontWeight": optionFontWeight, selected: multiMode
+                                                    ? activeIdArray.includes(subOption[idField]) || activeIdArray.includes(subOption[labelField])
+                                                    : !!activeId && activeId === subOption[idField], "$wrapMulti": wrapText && multiMode, "$wrapText": wrapText, children: [multiMode && (jsx(CheckboxHolder, { "$wrapText": wrapText, "$isChild": true, children: jsx(Checkbox, { active: activeChild, disabled: subOption.disabled }) })), radioButtons && !multiMode && (jsx(CheckboxHolder, { "$wrapText": wrapText, "$isChild": true, children: jsx(Radio, { active: activeChild, disabled: subOption.disabled }) })), jsx(LabelText, { children: wrapText ? (subOption[labelField] || subOption[idField]) : (jsx(TruncatePicker, { children: subOption[labelField] || subOption[idField] })) })] })) }) }, subOption[idField] || "".concat(index, "_").concat(i)));
+                                })] }, option[idField] || index));
+                    }
+                })) : (jsx(NoResultsMessage, { "$textColor": textColor, children: "No Results" })) }), hasButton && (jsxs(BottomButton, { ref: hasButton ? lastRef : undefined, "$bottomButtonColorHover": bottomButtonColorHover, onClick: function (event) { return bottomButtonClick(event); }, onKeyPress: function (event) {
+                    if (pressedEnter(event)) {
+                        bottomButtonClick(event);
+                    }
+                }, role: "button", tabIndex: 0, children: [BottomButtonIcon && (jsx(ButtonIcon, { children: jsx(BottomButtonIcon, { fill: bottomButtonColor }) })), jsx(BottomButtonText, { "$bottomButtonColor": bottomButtonColor, "$optionFontSize": optionFontSize, children: bottomButtonLabel })] }))] }));
+};
+
+export { CheckboxHolder as C, SearchMenu as S };
+//# sourceMappingURL=SearchMenu-h5HqVgJs.js.map

package/lib/esm/SearchMenu-h5HqVgJs.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SearchMenu-h5HqVgJs.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/lib/esm/SearchMenu.js

@@ -1,40 +1,40 @@
-export { C as CheckboxHolder, S as SearchMenu } from './SearchMenu-4b099b6e.js';
-import './_tslib-1a4c929e.js';
+export { C as CheckboxHolder, S as SearchMenu } from './SearchMenu-h5HqVgJs.js';
+import './_tslib-Cea_sJmA.js';
 import 'react/jsx-runtime';
 import 'react';
 import 'styled-components';
-import './Checkbox-34317452.js';
+import './Checkbox-BdrC_AX0.js';
 import './colors.js';
-import './IconComponentStyles-091931ba.js';
+import './IconComponentStyles-BBt1vuNf.js';
 import './CheckboxEmpty.js';
-import './colors-12bf079c.js';
+import './colors-D-UTb8yU.js';
 import './pressedEnter.js';
 import './CheckboxFull.js';
-import './CheckboxStyles-737d1b2c.js';
+import './CheckboxStyles-n0dZUWcQ.js';
 import './Search.js';
-import './InlineInput-b032bad6.js';
+import './InlineInput-Ch6CfLME.js';
 import './CloseCircle.js';
-import './Inputs-e6fa30e2.js';
-import './Radio-7b1fcff6.js';
+import './Inputs-CDGsS9tQ.js';
+import './Radio-DkEF92KD.js';
 import './RadioEmpty.js';
 import './RadioFull.js';
-import './RadioStyles-876d7b0d.js';
-import './TextLink-1f344858.js';
+import './RadioStyles-BE77MqVD.js';
+import './TextLink-g0qDn7WU.js';
 import './IndicatorDown.js';
-import './TruncatePicker-b2b57019.js';
-import './Truncate-e3f27970.js';
+import './TruncatePicker-CMfshChw.js';
+import './Truncate-70b6FNIJ.js';
 import './getPosition.js';
-import './useIsomorphicLayoutEffect-02f8ff90.js';
+import './useIsomorphicLayoutEffect-Br1zBZHl.js';
 import './isEmptyObject.js';
-import './useMeasure-c4c687e9.js';
+import './useMeasure-D89v6c_A.js';
 import './addOrRemoveById.js';
 import 'dayjs';
 import './ButtonColorFamilyEnum.js';
-import './SearchInput-ca23eec0.js';
-import './IconButton-58bf3c70.js';
+import './SearchInput-2TWxL_-B.js';
+import './IconButton-E4owK8Nt.js';
 import './focusAfter.js';
 import './useFocus.js';
-import './filtering-ce417fc1.js';
+import './filtering-D9dGwiF6.js';
 import './Loading.js';
 import './Scroller.js';
 import './BodyLEmphasis.js';

package/lib/esm/SecondaryButton.js

@@ -1,20 +1,20 @@
-import { _ as __assign } from './_tslib-1a4c929e.js';
+import { _ as __assign } from './_tslib-Cea_sJmA.js';
 import { jsx } from 'react/jsx-runtime';
 import { Button } from './Button.js';
 import 'react';
 import 'styled-components';
 import './colors.js';
 import './pressedEnter.js';
-import './IconComponentStyles-091931ba.js';
+import './IconComponentStyles-BBt1vuNf.js';
 import './ArrowLong.js';
-import './colors-12bf079c.js';
+import './colors-D-UTb8yU.js';
 import './CaretDown.js';
 import './IndicatorDown.js';
 import './ButtonColorFamilyEnum.js';
-import './LoadingEllipsis-505a407e.js';
+import './LoadingEllipsis-C1NXXo2M.js';
 
-var SecondaryButton = function (props) {
-    return jsx(Button, __assign({}, props, { boxed: false, boxedOutline: false, outline: false, secondary: true, textButton: false }), void 0);
+var SecondaryButton = function (props) {
+    return jsx(Button, __assign({}, props, { boxed: false, boxedOutline: false, outline: false, secondary: true, textButton: false }));
 };
 
 export { SecondaryButton };