@sitecore/sc-contenthub-blok 0.0.23 → 0.0.25

package/dist/Components/BlokSelect/BlokSelect.js

@@ -0,0 +1,247 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.BlokSelect = BlokSelect;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const css_1 = require("@emotion/css");
+const react_1 = require("react");
+const useIsMounted_1 = __importDefault(require("../../customHooks/useIsMounted"));
+const Foundations_1 = require("../../Foundations");
+const utils_1 = require("../../Foundations/utils");
+const BlokIcon_1 = require("../BlokIcon/BlokIcon");
+const BlokSearchBox_1 = require("../BlokSearchBox/BlokSearchBox");
+const CoreComponents_1 = require("../CoreComponents");
+const classes = {
+    dropDownAutoWidth: (0, css_1.css)({
+        width: "auto",
+    }),
+    dropdownFullWidth: (0, css_1.css)({
+        width: `${Foundations_1.inputMaxWidth}px`,
+        display: "block",
+        maxWidth: "100%",
+        "& .MuiSelect-select": {
+            maxWidth: "calc(100% - 2.5rem)",
+        },
+    }),
+    select: (0, css_1.css)({
+        backgroundColor: "transparent !important ",
+        maxWidth: "calc(100% - 40px)",
+        display: "flex",
+        alignItems: "center",
+    }),
+    selectIcon: (0, css_1.css)({
+        color: Foundations_1.blackAlpha[900],
+        top: "50%",
+        transform: "translateY(-50%)",
+        right: utils_1.isLTR ? "7px !important" : "auto",
+        left: utils_1.isRTL ? "7px !important" : "auto",
+        position: "absolute",
+        pointerEvents: "none",
+        cursor: "pointer",
+        svg: (0, css_1.css)({
+            width: "22px !important",
+            height: "22px !important",
+            verticalAlign: "middle",
+            marginInlineStart: "calc(0.375rem * -1)!important",
+            marginInlineEnd: "calc(0.375rem * -1)!important",
+            padding: "0.125rem !important",
+        }),
+    }),
+    checkBox: (0, css_1.css)({
+        marginLeft: -"8px",
+    }),
+    noneLabel: (0, css_1.css)({
+        color: Foundations_1.blackAlpha["800"],
+    }),
+    noneLabelOnDark: (0, css_1.css)({
+        color: Foundations_1.whiteAlpha["800"],
+    }),
+    transparentDropdownButton: (0, css_1.css)({
+        backgroundColor: "transparent",
+    }),
+    searchBoxWithButton: (0, css_1.css)({ margin: "0 0.5rem 0.5rem 0.5rem" }),
+    dropdownItemIconMenu: (0, css_1.css)({
+        marginRight: utils_1.isLTR ? "24px" : 0,
+        marginLeft: utils_1.isRTL ? "24px" : 0,
+        color: Foundations_1.blackAlpha[600],
+    }),
+    dropdownItemIcon: (0, css_1.css)({
+        color: Foundations_1.blackAlpha[600],
+    }),
+    hidden: (0, css_1.css)({
+        display: "none",
+    }),
+    lightText: (0, css_1.css)({ color: Foundations_1.blackAlpha["500"] }),
+    iconLabel: (0, css_1.css)({ marginLeft: "8px", verticalAlign: "middle" }),
+};
+const dropdownClasses = {
+    select: classes.select,
+};
+const customDropdownIcon = () => ((0, jsx_runtime_1.jsx)(BlokIcon_1.BlokIcon, { icon: "chevron-down", classes: [classes.selectIcon] }));
+function BlokSelect({ id, options = (0, utils_1.getEmptyImmutableArray)(), onChange: onChange_, value, labelMapper = (item) => item, valueMapper = (item) => item, returnValue, placeholder = "Select an option", emptyValueSelectable = false, className, isReadOnly, searchBoxMinAmountOfItems = 8, tooltip = "", showIconAndText = false, hideItemIcons = false, isFullWidth = false, accessibilityId, maxHeight = 250, itemsToDisable = (0, utils_1.getEmptyImmutableArray)(), openMenuByDefault = false, showEmptyDropdown = false, noneLabel = "None", noResultsText = "No results found", }) {
+    const [filteredOptions, setFilteredOptions] = (0, react_1.useState)(options);
+    const [searchFilter, setSearchFilter] = (0, react_1.useState)("");
+    const searchBoxRef = (0, react_1.useCallback)((node) => {
+        if (node) {
+            node.focus();
+        }
+    }, []);
+    const [isMenuVisible, setIsMenuVisible] = (0, react_1.useState)(openMenuByDefault);
+    const [toolTipIsShown, setToolTipIsShown] = (0, react_1.useState)(false);
+    const isMountedRef = (0, useIsMounted_1.default)();
+    // When clicking the clear button on the searchbox clear search value and set the list back to the original values.
+    const onClearSearch = (0, react_1.useCallback)(() => {
+        setFilteredOptions(options);
+        setSearchFilter("");
+    }, [options]);
+    // When selecting a value in the dropdown.
+    const onChange = (0, react_1.useCallback)(async (event) => {
+        onClearSearch();
+        const key = event.target.value;
+        const newValue = options?.find((item) => valueMapper(item) === key);
+        if ((0, utils_1.isFunction)(onChange_)) {
+            if (newValue) {
+                if ((0, utils_1.isFunction)(returnValue)) {
+                    await onChange_(returnValue(newValue));
+                }
+                else {
+                    await onChange_(newValue);
+                }
+            }
+            if (newValue == null) {
+                if (emptyValueSelectable) {
+                    await onChange_(newValue);
+                }
+            }
+        }
+        if (isMountedRef.current) {
+            // Hide the menu.
+            setIsMenuVisible(false);
+        }
+    }, [
+        emptyValueSelectable,
+        isMountedRef,
+        valueMapper,
+        onChange_,
+        onClearSearch,
+        options,
+        returnValue,
+    ]);
+    // When clicking the enter key in the search box select the first value in the list and close the menu.
+    const onEnterPress = (0, react_1.useCallback)(async () => {
+        if (filteredOptions.length) {
+            // Grab the first value in the filtered options list.
+            const valueToSelect = filteredOptions[0];
+            if ((0, utils_1.isFunction)(returnValue)) {
+                await onChange_(returnValue(valueToSelect));
+            }
+            else {
+                await onChange_(valueToSelect);
+            }
+            if (isMountedRef.current) {
+                // Restore the filtered options to the options.
+                setFilteredOptions(options);
+                // Hide the menu.
+                setIsMenuVisible(false);
+            }
+        }
+    }, [filteredOptions, isMountedRef, onChange_, options, returnValue]);
+    (0, react_1.useEffect)(() => {
+        if (!options.length) {
+            return;
+        }
+        if (searchFilter !== "") {
+            setFilteredOptions(options.filter((option) => labelMapper(option)
+                .toLocaleLowerCase()
+                .includes(searchFilter.toLocaleLowerCase())));
+        }
+        else {
+            setFilteredOptions(options);
+        }
+    }, [labelMapper, options, searchFilter]);
+    const hideToolTip = (0, react_1.useCallback)(() => setToolTipIsShown(false), []);
+    const showToolTip = (0, react_1.useCallback)(() => setToolTipIsShown(true), []);
+    const renderValue = (0, react_1.useCallback)((selected) => {
+        const selectedItem = options.find((item) => valueMapper(item) === selected);
+        if (!selectedItem) {
+            return (0, jsx_runtime_1.jsx)("span", { children: placeholder ?? noneLabel });
+        }
+        /** This can maybe be refined in the future this way we show the selected icon on the search template dropdown. */
+        if (Object.prototype.hasOwnProperty.call(selectedItem, "icon")) {
+            return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(BlokIcon_1.BlokIcon, { icon: selectedItem.icon, classes: [classes.dropdownItemIcon] }), showIconAndText && ((0, jsx_runtime_1.jsx)("span", { className: classes.iconLabel, children: labelMapper(selectedItem) }))] }));
+        }
+        return labelMapper(selectedItem);
+    }, [
+        options,
+        labelMapper,
+        valueMapper,
+        placeholder,
+        noneLabel,
+        showIconAndText,
+    ]);
+    const onOpen = (0, react_1.useCallback)(() => {
+        setIsMenuVisible(true);
+        hideToolTip();
+    }, [hideToolTip]);
+    const filteredItems = (0, react_1.useMemo)(() => {
+        return filteredOptions?.map((option, index) => {
+            return (option && ((0, jsx_runtime_1.jsxs)(CoreComponents_1.MenuItem, { value: valueMapper(option), onKeyDown: (e) => {
+                    if (e.key === "Escape") {
+                        setIsMenuVisible(false);
+                        setSearchFilter("");
+                    }
+                }, disabled: itemsToDisable.some((item) => valueMapper(option) === valueMapper(item)), children: [Object.prototype.hasOwnProperty.call(option, "icon") &&
+                        !hideItemIcons && ((0, jsx_runtime_1.jsx)(BlokIcon_1.BlokIcon, { icon: option.icon, classes: [classes.dropdownItemIconMenu] })), (0, jsx_runtime_1.jsx)(CoreComponents_1.ListItemText, { primary: labelMapper(option) })] }, `${valueMapper(option)}-${index}`)));
+        });
+    }, [
+        filteredOptions,
+        hideItemIcons,
+        itemsToDisable,
+        valueMapper,
+        labelMapper,
+    ]);
+    const searchBox = (0, react_1.useMemo)(() => options.length > searchBoxMinAmountOfItems && ((0, jsx_runtime_1.jsx)(BlokSearchBox_1.BlokSearchBox, { onSearch: setSearchFilter, onClearSearch: onClearSearch, value: searchFilter, ref: searchBoxRef, onEnterPress: onEnterPress, isInsideDropdown: true, hasGutterBottom: false })), [
+        onClearSearch,
+        onEnterPress,
+        options.length,
+        searchBoxMinAmountOfItems,
+        searchBoxRef,
+        searchFilter,
+    ]);
+    const menuCloseHandler = (0, react_1.useCallback)(() => {
+        setIsMenuVisible(false);
+        setSearchFilter("");
+    }, []);
+    const menuProps = (0, react_1.useMemo)(() => ({
+        anchorOrigin: {
+            vertical: "bottom",
+            horizontal: "center",
+        },
+        slotProps: {
+            paper: {
+                style: {
+                    maxHeight,
+                },
+            },
+        },
+        autoFocus: options.length < searchBoxMinAmountOfItems,
+    }), [maxHeight, options.length, searchBoxMinAmountOfItems]);
+    if (!options.length && !showEmptyDropdown) {
+        return null;
+    }
+    const selectedValue = (value && valueMapper(value)) || "";
+    return ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: isReadOnly ? ((0, jsx_runtime_1.jsx)("div", { "data-testid": id, children: (0, jsx_runtime_1.jsx)(CoreComponents_1.Typography, { variant: "body1", children: typeof value === "object"
+                    ? labelMapper(value)
+                    : (value ?? "") }) })) : ((0, jsx_runtime_1.jsx)(CoreComponents_1.Tooltip, { title: toolTipIsShown ? tooltip : "", children: (0, jsx_runtime_1.jsxs)(CoreComponents_1.Select, { "data-testid": id, onChange: onChange, className: (0, css_1.cx)(className, isFullWidth
+                    ? classes.dropdownFullWidth
+                    : classes.dropDownAutoWidth), classes: dropdownClasses, value: filteredOptions.some((option) => valueMapper(option) === selectedValue)
+                    ? selectedValue
+                    : searchFilter, open: isMenuVisible, displayEmpty: true, onMouseEnter: showToolTip, onMouseLeave: hideToolTip, onOpen: onOpen, onClose: menuCloseHandler, renderValue: renderValue, labelId: `label-${accessibilityId}`, onKeyDown: (e) => {
+                    e.stopPropagation();
+                }, variant: "filled", MenuProps: menuProps, IconComponent: customDropdownIcon, children: [searchBox, value === null && ((0, jsx_runtime_1.jsx)(CoreComponents_1.MenuItem, { value: undefined, className: classes.hidden, children: (0, jsx_runtime_1.jsx)("em", { className: classes.lightText, children: placeholder }) })), emptyValueSelectable && searchFilter === "" && (
+                    // We need to set the value to null so that it is picked up correctly.
+                    (0, jsx_runtime_1.jsx)(CoreComponents_1.MenuItem, { value: null, children: (0, jsx_runtime_1.jsx)("em", { children: noneLabel }) })), !filteredOptions.length && noResultsText, filteredItems] }) })) }));
+}
+//# sourceMappingURL=BlokSelect.js.map

package/dist/Components/BlokSelect/BlokSelect.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"BlokSelect.js","sourceRoot":"","sources":["../../../src/Components/BlokSelect/BlokSelect.tsx"],"names":[],"mappings":"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"}

package/dist/Components/BlokSelect/BlokSelect.spec.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/Components/BlokSelect/BlokSelect.spec.js

@@ -0,0 +1,54 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const jsx_runtime_1 = require("react/jsx-runtime");
+const react_1 = require("@testing-library/react");
+const user_event_1 = __importDefault(require("@testing-library/user-event"));
+const BlokSelect_1 = require("./BlokSelect");
+describe("BlokSelect Component", () => {
+    test("renders without crashing", () => {
+        const options = ["Option 1", "Option 2", "Option 3"];
+        (0, react_1.render)((0, jsx_runtime_1.jsx)(BlokSelect_1.BlokSelect, { id: "blok-select", options: options, onChange: () => { } }));
+        expect(react_1.screen.getByTestId("blok-select")).toBeInTheDocument();
+    });
+    test("displays options correctly", async () => {
+        const user = user_event_1.default.setup();
+        const options = ["Option 1", "Option 2", "Option 3"];
+        (0, react_1.render)((0, jsx_runtime_1.jsx)(BlokSelect_1.BlokSelect, { id: "blok-select", options: options, onChange: () => { } }));
+        await user.click(react_1.screen.getByRole("combobox"));
+        options.forEach((option) => {
+            expect(react_1.screen.getByText(option)).toBeInTheDocument();
+        });
+    });
+    test("calls onChange when an option is selected", async () => {
+        const user = user_event_1.default.setup();
+        const options = ["Option 1", "Option 2", "Option 3"];
+        const handleChange = jest.fn();
+        (0, react_1.render)((0, jsx_runtime_1.jsx)(BlokSelect_1.BlokSelect, { id: "blok-select", options: options, onChange: handleChange }));
+        await user.click(react_1.screen.getByRole("combobox"));
+        await user.click(react_1.screen.getByRole("option", { name: options[1] }));
+        expect(handleChange).toHaveBeenCalledWith(options[1]);
+    });
+    test("displays the selected option", () => {
+        const options = ["Option 1", "Option 2", "Option 3"];
+        (0, react_1.render)((0, jsx_runtime_1.jsx)(BlokSelect_1.BlokSelect, { id: "blok-select", options: options, value: options[1], onChange: () => { } }));
+        expect(react_1.screen.getByDisplayValue(options[1])).toBeInTheDocument();
+    });
+    test("displays placeholder when no value is selected", () => {
+        const options = ["Option 1", "Option 2", "Option 3"];
+        const placeholder = "Select an option";
+        (0, react_1.render)((0, jsx_runtime_1.jsx)(BlokSelect_1.BlokSelect, { id: "blok-select", options: options, placeholder: placeholder, onChange: () => { } }));
+        expect(react_1.screen.getByText(placeholder)).toBeInTheDocument();
+    });
+    test("disables specific options", async () => {
+        const user = user_event_1.default.setup();
+        const options = ["Option 1", "Option 2", "Option 3"];
+        const itemsToDisable = ["Option 2"];
+        (0, react_1.render)((0, jsx_runtime_1.jsx)(BlokSelect_1.BlokSelect, { id: "blok-select", options: options, onChange: () => { }, itemsToDisable: itemsToDisable }));
+        await user.click(react_1.screen.getByRole("combobox"));
+        expect(react_1.screen.getByRole("option", { name: "Option 2" })).toHaveClass("Mui-disabled");
+    });
+});
+//# sourceMappingURL=BlokSelect.spec.js.map

package/dist/Components/BlokSelect/BlokSelect.spec.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"BlokSelect.spec.js","sourceRoot":"","sources":["../../../src/Components/BlokSelect/BlokSelect.spec.tsx"],"names":[],"mappings":"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"}

package/dist/Components/BlokSelect/BlokSelect.stories.d.ts

@@ -0,0 +1,8 @@
+import type { Meta, StoryObj } from "@storybook/react";
+import { PropsWithChildren } from "react";
+import { BlokSelectProps } from "./BlokSelect";
+type ComponentProps = PropsWithChildren<BlokSelectProps<string, string>>;
+declare const meta: Meta<ComponentProps>;
+export default meta;
+type Story = StoryObj<ComponentProps>;
+export declare const BlokSelectExamples: Story;

package/dist/Components/BlokSelect/BlokSelect.stories.js

@@ -0,0 +1,59 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.BlokSelectExamples = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const css_1 = require("@emotion/css");
+const CoreComponents_1 = require("../../Components/CoreComponents");
+const BlokSelect_1 = require("./BlokSelect");
+const classes = {
+    flexWrapper: (0, css_1.css)({
+        display: "flex",
+        flexDirection: "column",
+        gap: 8,
+        marginBottom: 24,
+    }),
+};
+const meta = {
+    title: "Components/Form/BlokSelect",
+    component: BlokSelect_1.BlokSelect,
+    tags: ["autodocs"],
+    argTypes: {},
+    args: {},
+};
+exports.default = meta;
+const options = [
+    { label: "Option 1", value: "1" },
+    { label: "Option 2", value: "2" },
+    { label: "Option 3", value: "3" },
+];
+const manyOptions = [
+    { label: "Option 1", value: "1" },
+    { label: "Option 2", value: "2" },
+    { label: "Option 3", value: "3" },
+    { label: "Option 4", value: "4" },
+    { label: "Option 5", value: "5" },
+    { label: "Option 6", value: "6" },
+    { label: "Option 7", value: "7" },
+    { label: "Option 8", value: "8" },
+];
+const optionsWithIcons = [
+    {
+        icon: "m-icon m-icon-view-sequential-outline",
+        id: 0,
+        label: "No grouping",
+    },
+    {
+        id: 121,
+        label: "Content type",
+        icon: "m-icon m-icon-view-sequential-outline",
+    },
+];
+exports.BlokSelectExamples = {
+    parameters: {
+        viewMode: "story",
+        controls: { disable: true, expanded: false },
+        options: { showPanel: false },
+    },
+    render: () => ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsxs)("div", { className: classes.flexWrapper, children: [(0, jsx_runtime_1.jsx)(CoreComponents_1.Typography, { children: "Disabled item" }), (0, jsx_runtime_1.jsx)("div", { children: (0, jsx_runtime_1.jsx)(BlokSelect_1.BlokSelect, { id: "example1", options: options, onChange: (selected) => console.log("Selected:", selected), labelMapper: (item) => item.label, valueMapper: (item) => item.value, placeholder: "Select an option", searchBoxMinAmountOfItems: 5, itemsToDisable: [options[1]], value: options[0] }) })] }), (0, jsx_runtime_1.jsxs)("div", { className: classes.flexWrapper, children: [(0, jsx_runtime_1.jsx)(CoreComponents_1.Typography, { children: "None value selectable" }), (0, jsx_runtime_1.jsx)("div", { children: (0, jsx_runtime_1.jsx)(BlokSelect_1.BlokSelect, { id: "example2", options: options, onChange: (selected) => console.log("Selected:", selected), labelMapper: (item) => item.label, valueMapper: (item) => item.value, placeholder: "Select an option", emptyValueSelectable: true, searchBoxMinAmountOfItems: 5, noneLabel: "None", value: options[0] }) })] }), (0, jsx_runtime_1.jsxs)("div", { className: classes.flexWrapper, children: [(0, jsx_runtime_1.jsx)(CoreComponents_1.Typography, { children: "No value selected" }), (0, jsx_runtime_1.jsx)("div", { children: (0, jsx_runtime_1.jsx)(BlokSelect_1.BlokSelect, { id: "example3", options: options, onChange: (selected) => console.log("Selected:", selected), labelMapper: (item) => item.label, valueMapper: (item) => item.value, placeholder: "Select an option", emptyValueSelectable: true, searchBoxMinAmountOfItems: 5, noneLabel: "None" }) })] }), (0, jsx_runtime_1.jsxs)("div", { className: classes.flexWrapper, children: [(0, jsx_runtime_1.jsx)(CoreComponents_1.Typography, { children: "Search box" }), (0, jsx_runtime_1.jsx)("div", { children: (0, jsx_runtime_1.jsx)(BlokSelect_1.BlokSelect, { id: "example4", options: manyOptions, onChange: (selected) => console.log("Selected:", selected), labelMapper: (item) => item.label, valueMapper: (item) => item.value, returnValue: (item) => item, placeholder: "Select an option", searchBoxMinAmountOfItems: 3, accessibilityId: "example2", maxHeight: 300 }) })] }), (0, jsx_runtime_1.jsxs)("div", { className: classes.flexWrapper, children: [(0, jsx_runtime_1.jsx)(CoreComponents_1.Typography, { children: "Full width" }), (0, jsx_runtime_1.jsx)("div", { children: (0, jsx_runtime_1.jsx)(BlokSelect_1.BlokSelect, { id: "example5", options: options, onChange: (selected) => console.log("Selected:", selected), labelMapper: (item) => item.label, valueMapper: (item) => item.value, returnValue: (item) => item, placeholder: "Select an option", searchBoxMinAmountOfItems: 3, isFullWidth: true, accessibilityId: "example2", maxHeight: 300 }) })] }), (0, jsx_runtime_1.jsxs)("div", { className: classes.flexWrapper, children: [(0, jsx_runtime_1.jsx)(CoreComponents_1.Typography, { children: "With icons on the items" }), (0, jsx_runtime_1.jsx)("div", { children: (0, jsx_runtime_1.jsx)(BlokSelect_1.BlokSelect, { id: "example6", options: optionsWithIcons, onChange: (selected) => console.log("Selected:", selected), labelMapper: (item) => item.label, valueMapper: (item) => item.id.toString(), returnValue: (item) => item, placeholder: "Select an option", searchBoxMinAmountOfItems: 3, accessibilityId: "example2", maxHeight: 300, isFullWidth: true, value: optionsWithIcons[0], showIconAndText: true }) })] })] })),
+};
+//# sourceMappingURL=BlokSelect.stories.js.map

package/dist/Components/BlokSelect/BlokSelect.stories.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"BlokSelect.stories.js","sourceRoot":"","sources":["../../../src/Components/BlokSelect/BlokSelect.stories.tsx"],"names":[],"mappings":"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"}

package/dist/Components/index.d.ts

@@ -1,10 +1,13 @@
 export * from "./BlokAlert/BlokAlert";
 export * from "./BlokBadge/BlokBadge";
 export * from "./BlokButton/BlokButton";
+export * from "./BlokButtonSelect/BlokButtonSelect";
 export * from "./BlokIcon/BlokIcon";
 export * from "./BlokIcon/BlokIconContext";
 export * from "./BlokIconButton/BlokIconButton";
 export * from "./BlokLabeledIcon/BlokLabeledIcon";
 export * from "./BlokLink/BlokLink";
+export * from "./BlokSearchBox/BlokSearchBox";
+export * from "./BlokSelect/BlokSelect";
 export * from "./BlokTag/BlokTag";
 export * from "./BlokTooltip/BlokTooltip";

package/dist/Components/index.js

@@ -17,11 +17,14 @@ Object.defineProperty(exports, "__esModule", { value: true });
 __exportStar(require("./BlokAlert/BlokAlert"), exports);
 __exportStar(require("./BlokBadge/BlokBadge"), exports);
 __exportStar(require("./BlokButton/BlokButton"), exports);
+__exportStar(require("./BlokButtonSelect/BlokButtonSelect"), exports);
 __exportStar(require("./BlokIcon/BlokIcon"), exports);
 __exportStar(require("./BlokIcon/BlokIconContext"), exports);
 __exportStar(require("./BlokIconButton/BlokIconButton"), exports);
 __exportStar(require("./BlokLabeledIcon/BlokLabeledIcon"), exports);
 __exportStar(require("./BlokLink/BlokLink"), exports);
+__exportStar(require("./BlokSearchBox/BlokSearchBox"), exports);
+__exportStar(require("./BlokSelect/BlokSelect"), exports);
 __exportStar(require("./BlokTag/BlokTag"), exports);
 __exportStar(require("./BlokTooltip/BlokTooltip"), exports);
 //# sourceMappingURL=index.js.map

package/dist/Components/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/Components/index.ts"],"names":[],"mappings":";;;;;;;;;;;;;;;;AAAA,wDAAsC;AACtC,wDAAsC;AACtC,0DAAwC;AACxC,sDAAoC;AACpC,6DAA2C;AAC3C,kEAAgD;AAChD,oEAAkD;AAClD,sDAAoC;AACpC,oDAAkC;AAClC,4DAA0C"}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/Components/index.ts"],"names":[],"mappings":";;;;;;;;;;;;;;;;AAAA,wDAAsC;AACtC,wDAAsC;AACtC,0DAAwC;AACxC,sEAAoD;AACpD,sDAAoC;AACpC,6DAA2C;AAC3C,kEAAgD;AAChD,oEAAkD;AAClD,sDAAoC;AACpC,gEAA8C;AAC9C,0DAAwC;AACxC,oDAAkC;AAClC,4DAA0C"}

package/dist/Foundations/utils.d.ts

@@ -6,3 +6,31 @@ export declare const transparentize: (color: string, amount: number) => string;
 export declare const capitalizeString: (str: string) => string;
 export declare const isFunction: (f: unknown) => f is (...args: never[]) => never;
 export declare const copyToClipboard: (text: string) => Promise<void>;
+export declare const EMPTY_IMMUTABLE_ARRAY: readonly [];
+/**
+ * Helper function returning an empty immutable array.
+ * This can for example be used as a default value for array props when so desired.
+ * Note: Errors will be thrown at runtime when code tries to modify the returned array.
+ * @returns An empty immutable array
+ */
+export declare const getEmptyImmutableArray: <T = readonly unknown[]>() => NonNullable<T>;
+export declare const EMPTY_IMMUTABLE_OBJECT: Readonly<{}>;
+/**
+ * Helper function returning an empty immutable object.
+ * This can for example be used as a default value for object props when so desired.
+ * Note: Errors will be thrown at runtime when code tries to modify the returned object.
+ * @returns An empty immutable array
+ */
+export declare const getEmptyImmutableObject: <T = Readonly<unknown>>() => NonNullable<T>;
+export type Nullable<T> = T | null;
+export type Optional<T> = T | undefined;
+export declare const isLTR: boolean;
+export declare const isRTL: boolean;
+export interface LabelValuePair<T> {
+    value: T;
+    label: string;
+}
+export interface KeyValuePair<T, K> {
+    key: T;
+    value: K;
+}

package/dist/Foundations/utils.js

@@ -3,7 +3,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.copyToClipboard = exports.isFunction = exports.capitalizeString = exports.transparentize = exports.normalizeFontNames = exports.getStyle = exports.normalizeColor = exports.documentStyle = void 0;
+exports.isRTL = exports.isLTR = exports.getEmptyImmutableObject = exports.EMPTY_IMMUTABLE_OBJECT = exports.getEmptyImmutableArray = exports.EMPTY_IMMUTABLE_ARRAY = exports.copyToClipboard = exports.isFunction = exports.capitalizeString = exports.transparentize = exports.normalizeFontNames = exports.getStyle = exports.normalizeColor = exports.documentStyle = void 0;
 const color_1 = __importDefault(require("color"));
 const color_string_1 = __importDefault(require("color-string"));
 exports.documentStyle = getComputedStyle(document.documentElement);
@@ -45,4 +45,24 @@ const copyToClipboard = async (text) => {
     await navigator.clipboard.writeText(text);
 };
 exports.copyToClipboard = copyToClipboard;
+exports.EMPTY_IMMUTABLE_ARRAY = Object.freeze([]);
+/**
+ * Helper function returning an empty immutable array.
+ * This can for example be used as a default value for array props when so desired.
+ * Note: Errors will be thrown at runtime when code tries to modify the returned array.
+ * @returns An empty immutable array
+ */
+const getEmptyImmutableArray = () => exports.EMPTY_IMMUTABLE_ARRAY;
+exports.getEmptyImmutableArray = getEmptyImmutableArray;
+exports.EMPTY_IMMUTABLE_OBJECT = Object.freeze({});
+/**
+ * Helper function returning an empty immutable object.
+ * This can for example be used as a default value for object props when so desired.
+ * Note: Errors will be thrown at runtime when code tries to modify the returned object.
+ * @returns An empty immutable array
+ */
+const getEmptyImmutableObject = () => exports.EMPTY_IMMUTABLE_OBJECT;
+exports.getEmptyImmutableObject = getEmptyImmutableObject;
+exports.isLTR = document?.dir ? document.dir === "ltr" : true;
+exports.isRTL = !exports.isLTR;
 //# sourceMappingURL=utils.js.map

package/dist/Foundations/utils.js.map

@@ -1 +1 @@
-{"version":3,"file":"utils.js","sourceRoot":"","sources":["../../src/Foundations/utils.ts"],"names":[],"mappings":";;;;;;AAAA,kDAA0B;AAC1B,gEAAuC;AAE1B,QAAA,aAAa,GAAG,gBAAgB,CAAC,QAAQ,CAAC,eAAe,CAAC,CAAC;AAEjE,MAAM,cAAc,GAAG,CAAC,KAAa,EAAU,EAAE;IACtD,OAAO,sBAAW,CAAC,EAAE,CAAC,GAAG,CACvB,sBAAW,CAAC,GAAG,CAAC,GAAG,CAAC,KAAK,CAAqC,CAC/D,CAAC;AACJ,CAAC,CAAC;AAJW,QAAA,cAAc,kBAIzB;AAEK,MAAM,QAAQ,GAAG,CAAC,SAAiB,EAAU,EAAE;IACpD,OAAO,qBAAa,CAAC,gBAAgB,CAAC,SAAS,CAAC,CAAC,QAAQ,EAAE,CAAC,IAAI,EAAE,CAAC;AACrE,CAAC,CAAC;AAFW,QAAA,QAAQ,YAEnB;AAEK,MAAM,kBAAkB,GAAG,CAAC,KAAoB,EAAU,EAAE;IACjE,IAAI,KAAK,KAAK,EAAE,IAAI,CAAC,KAAK,EAAE,CAAC;QAC3B,OAAO,EAAE,CAAC;IACZ,CAAC;IAED,OAAO,KAAK;SACT,OAAO,CAAC,WAAW,EAAE,EAAE,CAAC;SACxB,KAAK,CAAC,GAAG,CAAC;SACV,GAAG,CAAC,CAAC,QAAQ,EAAE,EAAE,CAAC,IAAI,QAAQ,CAAC,IAAI,EAAE,GAAG,CAAC;SACzC,IAAI,CAAC,GAAG,CAAC;SACT,IAAI,EAAE,CAAC;AACZ,CAAC,CAAC;AAXW,QAAA,kBAAkB,sBAW7B;AAEK,MAAM,cAAc,GAAG,CAAC,KAAa,EAAE,MAAc,EAAU,EAAE;IACtE,OAAO,IAAA,eAAK,EAAC,KAAK,CAAC,CAAC,IAAI,CAAC,MAAM,CAAC,CAAC,MAAM,EAAE,CAAC;AAC5C,CAAC,CAAC;AAFW,QAAA,cAAc,kBAEzB;AAEK,MAAM,gBAAgB,GAAG,CAAC,GAAW,EAAU,EAAE;IACtD,IAAI,CAAC,GAAG;QAAE,OAAO,GAAG,CAAC;IACrB,OAAO,GAAG,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC,WAAW,EAAE,GAAG,GAAG,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC;AACpD,CAAC,CAAC;AAHW,QAAA,gBAAgB,oBAG3B;AAEK,MAAM,UAAU,GAAG,CAAC,CAAU,EAAoC,EAAE;IACzE,OAAO,OAAO,CAAC,KAAK,UAAU,CAAC;AACjC,CAAC,CAAC;AAFW,QAAA,UAAU,cAErB;AAEK,MAAM,eAAe,GAAG,KAAK,EAAE,IAAY,EAAiB,EAAE;IACnE,MAAM,SAAS,CAAC,SAAS,CAAC,SAAS,CAAC,IAAI,CAAC,CAAC;AAC5C,CAAC,CAAC;AAFW,QAAA,eAAe,mBAE1B"}
+{"version":3,"file":"utils.js","sourceRoot":"","sources":["../../src/Foundations/utils.ts"],"names":[],"mappings":";;;;;;AAAA,kDAA0B;AAC1B,gEAAuC;AAE1B,QAAA,aAAa,GAAG,gBAAgB,CAAC,QAAQ,CAAC,eAAe,CAAC,CAAC;AAEjE,MAAM,cAAc,GAAG,CAAC,KAAa,EAAU,EAAE;IACtD,OAAO,sBAAW,CAAC,EAAE,CAAC,GAAG,CACvB,sBAAW,CAAC,GAAG,CAAC,GAAG,CAAC,KAAK,CAAqC,CAC/D,CAAC;AACJ,CAAC,CAAC;AAJW,QAAA,cAAc,kBAIzB;AAEK,MAAM,QAAQ,GAAG,CAAC,SAAiB,EAAU,EAAE;IACpD,OAAO,qBAAa,CAAC,gBAAgB,CAAC,SAAS,CAAC,CAAC,QAAQ,EAAE,CAAC,IAAI,EAAE,CAAC;AACrE,CAAC,CAAC;AAFW,QAAA,QAAQ,YAEnB;AAEK,MAAM,kBAAkB,GAAG,CAAC,KAAoB,EAAU,EAAE;IACjE,IAAI,KAAK,KAAK,EAAE,IAAI,CAAC,KAAK,EAAE,CAAC;QAC3B,OAAO,EAAE,CAAC;IACZ,CAAC;IAED,OAAO,KAAK;SACT,OAAO,CAAC,WAAW,EAAE,EAAE,CAAC;SACxB,KAAK,CAAC,GAAG,CAAC;SACV,GAAG,CAAC,CAAC,QAAQ,EAAE,EAAE,CAAC,IAAI,QAAQ,CAAC,IAAI,EAAE,GAAG,CAAC;SACzC,IAAI,CAAC,GAAG,CAAC;SACT,IAAI,EAAE,CAAC;AACZ,CAAC,CAAC;AAXW,QAAA,kBAAkB,sBAW7B;AAEK,MAAM,cAAc,GAAG,CAAC,KAAa,EAAE,MAAc,EAAU,EAAE;IACtE,OAAO,IAAA,eAAK,EAAC,KAAK,CAAC,CAAC,IAAI,CAAC,MAAM,CAAC,CAAC,MAAM,EAAE,CAAC;AAC5C,CAAC,CAAC;AAFW,QAAA,cAAc,kBAEzB;AAEK,MAAM,gBAAgB,GAAG,CAAC,GAAW,EAAU,EAAE;IACtD,IAAI,CAAC,GAAG;QAAE,OAAO,GAAG,CAAC;IACrB,OAAO,GAAG,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC,WAAW,EAAE,GAAG,GAAG,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC;AACpD,CAAC,CAAC;AAHW,QAAA,gBAAgB,oBAG3B;AAEK,MAAM,UAAU,GAAG,CAAC,CAAU,EAAoC,EAAE;IACzE,OAAO,OAAO,CAAC,KAAK,UAAU,CAAC;AACjC,CAAC,CAAC;AAFW,QAAA,UAAU,cAErB;AAEK,MAAM,eAAe,GAAG,KAAK,EAAE,IAAY,EAAiB,EAAE;IACnE,MAAM,SAAS,CAAC,SAAS,CAAC,SAAS,CAAC,IAAI,CAAC,CAAC;AAC5C,CAAC,CAAC;AAFW,QAAA,eAAe,mBAE1B;AAEW,QAAA,qBAAqB,GAAG,MAAM,CAAC,MAAM,CAAC,EAAW,CAAC,CAAC;AAEhE;;;;;GAKG;AACI,MAAM,sBAAsB,GAAG,GAElB,EAAE,CAAC,6BAAkD,CAAC;AAF7D,QAAA,sBAAsB,0BAEuC;AAE7D,QAAA,sBAAsB,GAAG,MAAM,CAAC,MAAM,CAAC,EAAW,CAAC,CAAC;AAEjE;;;;;GAKG;AACI,MAAM,uBAAuB,GAAG,GAEnB,EAAE,CAAC,8BAAmD,CAAC;AAF9D,QAAA,uBAAuB,2BAEuC;AAI9D,QAAA,KAAK,GAAG,QAAQ,EAAE,GAAG,CAAC,CAAC,CAAC,QAAQ,CAAC,GAAG,KAAK,KAAK,CAAC,CAAC,CAAC,IAAI,CAAC;AACtD,QAAA,KAAK,GAAG,CAAC,aAAK,CAAC"}

package/dist/customHooks/useIsMounted.d.ts

@@ -0,0 +1,7 @@
+import { RefObject } from "react";
+/**
+ * Returns a RefObject to check if the component is mounted.
+ * @returns An object with readonly current property to check the mounted state.
+ */
+declare const useIsMounted: () => RefObject<boolean>;
+export default useIsMounted;

package/dist/customHooks/useIsMounted.js

@@ -0,0 +1,19 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const react_1 = require("react");
+/**
+ * Returns a RefObject to check if the component is mounted.
+ * @returns An object with readonly current property to check the mounted state.
+ */
+const useIsMounted = () => {
+    const isMounted = (0, react_1.useRef)(false);
+    (0, react_1.useEffect)(() => {
+        isMounted.current = true;
+        return () => {
+            isMounted.current = false;
+        };
+    }, []);
+    return isMounted;
+};
+exports.default = useIsMounted;
+//# sourceMappingURL=useIsMounted.js.map

package/dist/customHooks/useIsMounted.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useIsMounted.js","sourceRoot":"","sources":["../../src/customHooks/useIsMounted.ts"],"names":[],"mappings":";;AAAA,iCAAqD;AAErD;;;GAGG;AACH,MAAM,YAAY,GAAG,GAAuB,EAAE;IAC5C,MAAM,SAAS,GAAG,IAAA,cAAM,EAAC,KAAK,CAAC,CAAC;IAEhC,IAAA,iBAAS,EAAC,GAAG,EAAE;QACb,SAAS,CAAC,OAAO,GAAG,IAAI,CAAC;QAEzB,OAAO,GAAG,EAAE;YACV,SAAS,CAAC,OAAO,GAAG,KAAK,CAAC;QAC5B,CAAC,CAAC;IACJ,CAAC,EAAE,EAAE,CAAC,CAAC;IAEP,OAAO,SAAS,CAAC;AACnB,CAAC,CAAC;AAEF,kBAAe,YAAY,CAAC"}

package/esm/Components/BlokButton/BlokButton.js

@@ -30,6 +30,6 @@ const MuiButtonVariantMap = {
  * BlokButton component that wraps the MUI Button component with additional props and styles.
  */
 export const BlokButton = forwardRef(function BlokButton({ colorScheme = "neutral", variant = "ghost", id, children, isDisabled, isLoading, isActive, className, isFloating, loadingText, size = "medium", startIcon, endIcon, href, target, buttonType = "button", onClick, onMouseDown, onMouseOver, count, onContextMenu, ...extraProps }, ref) {
-    return (_jsxs(Button, { variant: MuiButtonVariantMap[variant], color: MuiButtonColorMap[colorScheme], "data-testid": id, disabled: isDisabled || isLoading, className: cx(className, isActive && "button-active", isFloating && `shadow-md`), size: size, startIcon: startIcon, endIcon: endIcon, href: href, role: href != null ? "link" : "button", disableRipple: true, type: buttonType, onClick: onClick, onMouseDown: onMouseDown, onMouseOver: onMouseOver, onContextMenu: onContextMenu, ref: ref, ...extraProps, ...(href ? { target } : {}), children: [isLoading && (_jsx(CircularProgress, { size: 14, color: MuiButtonColorMap[colorScheme] })), loadingText ? loadingText : children, count != null && count !== 0 && count !== "0" && (_jsx("span", { "data-style-name": "operation-count", className: "button-count", children: count }))] }));
+    return (_jsxs(Button, { variant: MuiButtonVariantMap[variant], color: MuiButtonColorMap[colorScheme], "data-testid": id, disabled: isDisabled || isLoading, className: cx(isActive && "button-active", isFloating && `shadow-md`, className), size: size, startIcon: startIcon, endIcon: endIcon, href: href, role: href != null ? "link" : "button", disableRipple: true, type: buttonType, onClick: onClick, onMouseDown: onMouseDown, onMouseOver: onMouseOver, onContextMenu: onContextMenu, ref: ref, ...extraProps, ...(href ? { target } : {}), children: [isLoading && (_jsx(CircularProgress, { size: 14, color: MuiButtonColorMap[colorScheme] })), loadingText ? loadingText : children, count != null && count !== 0 && count !== "0" && (_jsx("span", { "data-style-name": "operation-count", className: "button-count", children: count }))] }));
 });
 //# sourceMappingURL=BlokButton.js.map

package/esm/Components/BlokButton/BlokButton.js.map

@@ -1 +1 @@
-{"version":3,"file":"BlokButton.js","sourceRoot":"","sources":["../../../src/Components/BlokButton/BlokButton.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,EAAE,EAAE,MAAM,cAAc,CAAC;AAClC,OAAO,EACL,UAAU,GAGX,MAAM,OAAO,CAAC;AAEf,OAAO,EACL,MAAM,EAGN,gBAAgB,GACjB,MAAM,mBAAmB,CAAC;AA8D3B;;GAEG;AACH,MAAM,iBAAiB,GAAuD;IAC5E,OAAO,EAAE,SAAS;IAClB,MAAM,EAAE,OAAO;IACf,OAAO,EAAE,SAAS;IAClB,OAAO,EAAE,SAAS;IAClB,IAAI,EAAE,MAAM;IACZ,OAAO,EAAE,SAAS;CACV,CAAC;AAEX;;GAEG;AACH,MAAM,mBAAmB,GAAqD;IAC5E,KAAK,EAAE,WAAW;IAClB,OAAO,EAAE,UAAU;IACnB,KAAK,EAAE,MAAM;IACb,IAAI,EAAE,MAAM;IACZ,MAAM,EAAE,QAAQ;IAChB,EAAE,EAAE,IAAI;IACR,UAAU,EAAE,YAAY;IACxB,MAAM,EAAE,QAAQ;CACjB,CAAC;AAEF;;GAEG;AACH,MAAM,CAAC,MAAM,UAAU,GAAG,UAAU,CAGlC,SAAS,UAAU,CACnB,EACE,WAAW,GAAG,SAAS,EACvB,OAAO,GAAG,OAAO,EACjB,EAAE,EACF,QAAQ,EACR,UAAU,EACV,SAAS,EACT,QAAQ,EACR,SAAS,EACT,UAAU,EACV,WAAW,EACX,IAAI,GAAG,QAAQ,EACf,SAAS,EACT,OAAO,EACP,IAAI,EACJ,MAAM,EACN,UAAU,GAAG,QAAQ,EACrB,OAAO,EACP,WAAW,EACX,WAAW,EACX,KAAK,EACL,aAAa,EACb,GAAG,UAAU,EACd,EACD,GAAG;IAEH,OAAO,CACL,MAAC,MAAM,IACL,OAAO,EAAE,mBAAmB,CAAC,OAAO,CAAC,EACrC,KAAK,EAAE,iBAAiB,CAAC,WAAW,CAAC,iBACxB,EAAE,EACf,QAAQ,EAAE,UAAU,IAAI,SAAS,EACjC,SAAS,EAAE,EAAE,CACX,SAAS,EACT,QAAQ,IAAI,eAAe,EAC3B,UAAU,IAAI,WAAW,CAC1B,EACD,IAAI,EAAE,IAAI,EACV,SAAS,EAAE,SAAS,EACpB,OAAO,EAAE,OAAO,EAChB,IAAI,EAAE,IAAc,EACpB,IAAI,EAAE,IAAI,IAAI,IAAI,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,QAAQ,EACtC,aAAa,QACb,IAAI,EAAE,UAAU,EAChB,OAAO,EAAE,OAAO,EAChB,WAAW,EAAE,WAAW,EACxB,WAAW,EAAE,WAAW,EACxB,aAAa,EAAE,aAAa,EAC5B,GAAG,EAAE,GAAG,KACJ,UAAU,KACV,CAAC,IAAI,CAAC,CAAC,CAAC,EAAE,MAAM,EAAE,CAAC,CAAC,CAAC,EAAE,CAAC,aAE3B,SAAS,IAAI,CACZ,KAAC,gBAAgB,IAAC,IAAI,EAAE,EAAE,EAAE,KAAK,EAAE,iBAAiB,CAAC,WAAW,CAAC,GAAI,CACtE,EACA,WAAW,CAAC,CAAC,CAAC,WAAW,CAAC,CAAC,CAAC,QAAQ,EACpC,KAAK,IAAI,IAAI,IAAI,KAAK,KAAK,CAAC,IAAI,KAAK,KAAK,GAAG,IAAI,CAChD,kCAAsB,iBAAiB,EAAC,SAAS,EAAC,cAAc,YAC7D,KAAK,GACD,CACR,IACM,CACV,CAAC;AACJ,CAAC,CAAC,CAAC"}
+{"version":3,"file":"BlokButton.js","sourceRoot":"","sources":["../../../src/Components/BlokButton/BlokButton.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,EAAE,EAAE,MAAM,cAAc,CAAC;AAClC,OAAO,EACL,UAAU,GAGX,MAAM,OAAO,CAAC;AAEf,OAAO,EACL,MAAM,EAGN,gBAAgB,GACjB,MAAM,mBAAmB,CAAC;AA8D3B;;GAEG;AACH,MAAM,iBAAiB,GAAuD;IAC5E,OAAO,EAAE,SAAS;IAClB,MAAM,EAAE,OAAO;IACf,OAAO,EAAE,SAAS;IAClB,OAAO,EAAE,SAAS;IAClB,IAAI,EAAE,MAAM;IACZ,OAAO,EAAE,SAAS;CACV,CAAC;AAEX;;GAEG;AACH,MAAM,mBAAmB,GAAqD;IAC5E,KAAK,EAAE,WAAW;IAClB,OAAO,EAAE,UAAU;IACnB,KAAK,EAAE,MAAM;IACb,IAAI,EAAE,MAAM;IACZ,MAAM,EAAE,QAAQ;IAChB,EAAE,EAAE,IAAI;IACR,UAAU,EAAE,YAAY;IACxB,MAAM,EAAE,QAAQ;CACjB,CAAC;AAEF;;GAEG;AACH,MAAM,CAAC,MAAM,UAAU,GAAG,UAAU,CAGlC,SAAS,UAAU,CACnB,EACE,WAAW,GAAG,SAAS,EACvB,OAAO,GAAG,OAAO,EACjB,EAAE,EACF,QAAQ,EACR,UAAU,EACV,SAAS,EACT,QAAQ,EACR,SAAS,EACT,UAAU,EACV,WAAW,EACX,IAAI,GAAG,QAAQ,EACf,SAAS,EACT,OAAO,EACP,IAAI,EACJ,MAAM,EACN,UAAU,GAAG,QAAQ,EACrB,OAAO,EACP,WAAW,EACX,WAAW,EACX,KAAK,EACL,aAAa,EACb,GAAG,UAAU,EACd,EACD,GAAG;IAEH,OAAO,CACL,MAAC,MAAM,IACL,OAAO,EAAE,mBAAmB,CAAC,OAAO,CAAC,EACrC,KAAK,EAAE,iBAAiB,CAAC,WAAW,CAAC,iBACxB,EAAE,EACf,QAAQ,EAAE,UAAU,IAAI,SAAS,EACjC,SAAS,EAAE,EAAE,CACX,QAAQ,IAAI,eAAe,EAC3B,UAAU,IAAI,WAAW,EAEzB,SAAS,CACV,EACD,IAAI,EAAE,IAAI,EACV,SAAS,EAAE,SAAS,EACpB,OAAO,EAAE,OAAO,EAChB,IAAI,EAAE,IAAc,EACpB,IAAI,EAAE,IAAI,IAAI,IAAI,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,QAAQ,EACtC,aAAa,QACb,IAAI,EAAE,UAAU,EAChB,OAAO,EAAE,OAAO,EAChB,WAAW,EAAE,WAAW,EACxB,WAAW,EAAE,WAAW,EACxB,aAAa,EAAE,aAAa,EAC5B,GAAG,EAAE,GAAG,KACJ,UAAU,KACV,CAAC,IAAI,CAAC,CAAC,CAAC,EAAE,MAAM,EAAE,CAAC,CAAC,CAAC,EAAE,CAAC,aAE3B,SAAS,IAAI,CACZ,KAAC,gBAAgB,IAAC,IAAI,EAAE,EAAE,EAAE,KAAK,EAAE,iBAAiB,CAAC,WAAW,CAAC,GAAI,CACtE,EACA,WAAW,CAAC,CAAC,CAAC,WAAW,CAAC,CAAC,CAAC,QAAQ,EACpC,KAAK,IAAI,IAAI,IAAI,KAAK,KAAK,CAAC,IAAI,KAAK,KAAK,GAAG,IAAI,CAChD,kCAAsB,iBAAiB,EAAC,SAAS,EAAC,cAAc,YAC7D,KAAK,GACD,CACR,IACM,CACV,CAAC;AACJ,CAAC,CAAC,CAAC"}