@kaizen/components 0.0.0-canary-bump-react-intl-20230830002428 → 0.0.0-canary-cg-test-20231009044311

package/dist/cjs/packages/components/src/FilterMultiSelect/context/MenuTriggerProvider/MenuTriggerProvider.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"MenuTriggerProvider.js","sources":["../../../../../../../../src/FilterMultiSelect/context/MenuTriggerProvider/MenuTriggerProvider.tsx"],"sourcesContent":["import React, { ButtonHTMLAttributes, HTMLAttributes, useContext } from \"react\"\nimport { useButton } from \"@react-aria/button\"\nimport { AriaMenuOptions, useMenuTrigger } from \"@react-aria/menu\"\nimport { MenuTriggerState, useMenuTriggerState } from \"@react-stately/menu\"\nimport { ItemType } from \"../../types\"\n\nexport type MenuTriggerProviderProps = {\n  isOpen?: boolean\n  defaultOpen?: boolean\n  onOpenChange?: (isOpen: boolean) => void\n  children: React.ReactNode\n}\n\nexport type MenuTriggerProviderContextType = {\n  menuTriggerProps: HTMLAttributes<HTMLElement>\n  buttonProps: ButtonHTMLAttributes<HTMLButtonElement>\n  menuProps: AriaMenuOptions<ItemType>\n  menuTriggerState: MenuTriggerState\n  buttonRef: React.RefObject<HTMLButtonElement>\n}\n\nconst MenuTriggerContext = React.createContext<MenuTriggerProviderContextType>(\n  {} as MenuTriggerProviderContextType\n)\nexport function MenuTriggerProvider({\n  isOpen,\n  defaultOpen,\n  onOpenChange,\n  children,\n}: MenuTriggerProviderProps): JSX.Element {\n  // Create state based on the incoming props to manage the open/close\n  const state = useMenuTriggerState({ isOpen, defaultOpen, onOpenChange })\n\n  // Get A11y attributes and events for the menu trigger and menu elements\n  const ref = React.createRef<HTMLButtonElement>()\n  const { menuTriggerProps, menuProps } = useMenuTrigger<ItemType>(\n    {},\n    state,\n    ref\n  )\n\n  // Get A11y attributes and events for the button based on the trigger props from useMenuTrigger\n  const { buttonProps } = useButton(menuTriggerProps, ref)\n\n  return (\n    <MenuTriggerContext.Provider\n      value={{\n        menuTriggerProps,\n        buttonProps,\n        menuProps,\n        menuTriggerState: state,\n        buttonRef: ref,\n      }}\n    >\n      {children}\n    </MenuTriggerContext.Provider>\n  )\n}\n\nexport const useMenuTriggerContext = (): MenuTriggerProviderContextType =>\n  useContext(MenuTriggerContext)\n\nexport const MenuTriggerConsumer = MenuTriggerContext.Consumer\n\nMenuTriggerContext.displayName = \"MenuTriggerContext\"\n"],"names":["useMenuTriggerState","useMenuTrigger","useButton","useContext"],"mappings":";;;;;;;AAqBA,IAAM,kBAAqB,GAAA,KAAA,CAAM,aAC/B,CAAA,EAAoC,CAAA,CAAA;AAEhC,SAAU,oBAAoB,EAKT,EAAA;EAJzB,IAAA,MAAA,GAAM,EAAA,CAAA,MAAA,EACN,WAAW,GAAA,EAAA,CAAA,aACX,YAAY,GAAA,EAAA,CAAA,YACZ,EAAA,QAAA,GAAQ,EAAA,CAAA,QAAA,CAAA;AAGR,EAAA,IAAM,QAAQA,wBAAoB,CAAA,EAAE,MAAQ,EAAA,WAAA,EAAa,cAAc,CAAA,CAAA;AAGvE,EAAM,IAAA,GAAA,GAAM,MAAM;AACZ,EAAA,IAAA,EAAA,GAAkCC,qBACtC,CAAA,EACA,EAAA,KAAA,EACA,GAAG,CAAA,EAHG,gBAAgB,GAAA,EAAA,CAAA,gBAAE,EAAA,SAAA;AAOlB,EAAA,IAAA,WAAgB,GAAAC,gBAAA,CAAU,gBAAkB,EAAA,GAAG,CAAC,CAAA,WAAA,CAAA;AAExD,EAAA,OACE,KAAC,CAAA,aAAA,CAAA,kBAAmB,CAAA,QAAA,EAAQ,EAC1B,KAAO,EAAA;AAAA,IACL,gBAAA;AAAA,IACA,WAAA;AAAA,IACA,SAAA;AAAA,IACA,gBAAkB,EAAA,KAAA;AAAA,IAClB,SAAW,EAAA,GAAA;AAAA,OAGZ,QAAQ,CAAA,CAAA;AAGf,CAAA;AAEO,IAAM,wBAAwB,WAAA;AACnC,EAAA,OAAAC,iBAAW,kBAAkB,CAAA,CAAA;AAA7B,EAAA;AAEK,IAAM,sBAAsB,kBAAmB,CAAA,SAAA;AAEtD,kBAAA,CAAmB,WAAc,GAAA,oBAAA;;;;;;"}

package/dist/cjs/packages/components/src/FilterMultiSelect/context/SelectionProvider/SelectionProvider.js

@@ -0,0 +1,54 @@
+'use strict';
+
+var tslib_es6 = require('../../../../../../node_modules/tslib/tslib.es6.js');
+var React = require('react');
+var listbox = require('@react-aria/listbox');
+var collections = require('@react-stately/collections');
+var list = require('@react-stately/list');
+var a11y = require('@kaizen/a11y');
+var MenuTriggerProvider = require('../MenuTriggerProvider/MenuTriggerProvider.js');
+
+var SelectionContext = React.createContext({});
+var SelectionProvider = function(props) {
+  var onSearchInputChange = props.onSearchInputChange, otherProps = tslib_es6.__rest(props, ["onSearchInputChange"]);
+  var _a = React.useState(""), searchQuery = _a[0], setSearchQuery = _a[1];
+  var menuProps = MenuTriggerProvider.useMenuTriggerContext().menuProps;
+  React.useEffect(function() {
+    if (onSearchInputChange) {
+      onSearchInputChange(searchQuery);
+    }
+  }, [searchQuery, onSearchInputChange]);
+  var searchFilter = React.useCallback(function(nodes) {
+    return searchQuery ? Array.from(nodes).filter(function(f) {
+      return f.textValue.toLowerCase().includes(searchQuery.toLowerCase());
+    }) : nodes;
+  }, [searchQuery]);
+  var state = list.useListState(tslib_es6.__assign(tslib_es6.__assign({}, otherProps), { children: function(item) {
+    return React.createElement(collections.Item, { key: item.value }, item.label);
+  }, filter: onSearchInputChange ? void 0 : searchFilter }));
+  var ref = React.createRef();
+  var _b = listbox.useListBox(tslib_es6.__assign(tslib_es6.__assign(tslib_es6.__assign({}, menuProps), otherProps), { disallowEmptySelection: true }), state, ref), listBoxProps = _b.listBoxProps, labelProps = _b.labelProps;
+  return React.createElement(
+    SelectionContext.Provider,
+    { value: {
+      listBoxProps,
+      labelProps,
+      selectionState: state,
+      listRef: ref,
+      setSearchQuery,
+      searchQuery
+    } },
+    React.createElement(a11y.VisuallyHidden, tslib_es6.__assign({}, labelProps), otherProps.label),
+    otherProps.children
+  );
+};
+var useSelectionContext = function() {
+  return React.useContext(SelectionContext);
+};
+var SelectionConsumer = SelectionContext.Consumer;
+SelectionProvider.displayName = "SelectionProvider";
+
+exports.SelectionConsumer = SelectionConsumer;
+exports.SelectionProvider = SelectionProvider;
+exports.useSelectionContext = useSelectionContext;
+//# sourceMappingURL=SelectionProvider.js.map

package/dist/cjs/packages/components/src/FilterMultiSelect/context/SelectionProvider/SelectionProvider.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SelectionProvider.js","sources":["../../../../../../../../src/FilterMultiSelect/context/SelectionProvider/SelectionProvider.tsx"],"sourcesContent":["import React, { HTMLAttributes, useCallback, useContext, useState } from \"react\"\nimport { useListBox } from \"@react-aria/listbox\"\nimport { Item } from \"@react-stately/collections\"\nimport { ListState, useListState } from \"@react-stately/list\"\nimport { SelectionMode, Selection } from \"@react-types/shared\"\nimport { VisuallyHidden } from \"@kaizen/a11y\"\nimport { ItemType, MultiSelectItem } from \"../../types\"\nimport { useMenuTriggerContext } from \"../MenuTriggerProvider\"\n\nexport type SelectionProviderProps = {\n  selectionMode: SelectionMode\n  children: React.ReactNode // control how menu should look like\n  items?: ItemType[]\n  onSelectionChange?: (keys: Selection) => void\n  /** The currently selected keys in the collection (controlled). */\n  selectedKeys?: Selection\n  /** The initial selected keys in the collection (uncontrolled). */\n  defaultSelectedKeys?: Selection\n  label: string\n  disabledKeys?: Selection\n  onSearchInputChange?: (searchInput: string) => void\n}\n\nexport type SelectionProviderContextType = {\n  listBoxProps: HTMLAttributes<HTMLElement>\n  labelProps: HTMLAttributes<HTMLElement>\n  selectionState: ListState<ItemType>\n  listRef: React.RefObject<HTMLUListElement>\n  searchQuery?: string\n  setSearchQuery: React.Dispatch<React.SetStateAction<string>>\n}\n\nconst SelectionContext = React.createContext<SelectionProviderContextType>(\n  {} as SelectionProviderContextType\n)\n\nexport const SelectionProvider = (\n  props: SelectionProviderProps\n): JSX.Element => {\n  const { onSearchInputChange, ...otherProps } = props\n  const [searchQuery, setSearchQuery] = useState<string>(\"\")\n  const { menuProps } = useMenuTriggerContext()\n  /**\n   * While the onSearchInputChange  is a side-effect, this useEffect should be fine.\n   * If the search input state becomes controlled, this useEffect could cause synchronisation\n   * issues and should be replaced.\n   */\n\n  React.useEffect(() => {\n    if (onSearchInputChange) {\n      onSearchInputChange(searchQuery)\n    }\n  }, [searchQuery, onSearchInputChange])\n\n  const searchFilter = useCallback(\n    (nodes: Iterable<MultiSelectItem>): Iterable<MultiSelectItem> =>\n      searchQuery\n        ? Array.from(nodes).filter(f =>\n            f.textValue.toLowerCase().includes(searchQuery.toLowerCase())\n          )\n        : nodes,\n    [searchQuery]\n  )\n\n  // Create state based on the incoming props to manage the selection\n  const state = useListState({\n    ...otherProps,\n    children: item => <Item key={item.value}>{item.label}</Item>, // For initialising selection and determined item.renderer, can be only Item or Section\n    filter: onSearchInputChange ? undefined : searchFilter, // If the user has passed an `onSearchInputChange` we opt them out of the default filtering\n  })\n\n  // Get A11y attributes and events for the listbox\n  const ref = React.createRef<HTMLUListElement>()\n  const { listBoxProps, labelProps } = useListBox(\n    {\n      ...menuProps,\n      ...otherProps,\n      disallowEmptySelection: true, // stop escape key from clearing selection\n    },\n    state,\n    ref\n  )\n\n  return (\n    <SelectionContext.Provider\n      value={{\n        listBoxProps,\n        labelProps,\n        selectionState: state,\n        listRef: ref,\n        setSearchQuery,\n        searchQuery,\n      }}\n    >\n      <VisuallyHidden {...labelProps}>{otherProps.label}</VisuallyHidden>\n      {otherProps.children}\n    </SelectionContext.Provider>\n  )\n}\n\nexport const useSelectionContext = (): SelectionProviderContextType =>\n  useContext(SelectionContext)\n\nexport const SelectionConsumer = SelectionContext.Consumer\n\nSelectionProvider.displayName = \"SelectionProvider\"\n"],"names":["__rest","useState","useMenuTriggerContext","useCallback","useListState","Item","useListBox","__assign","VisuallyHidden","useContext"],"mappings":";;;;;;;;;;AAgCA,IAAM,gBAAmB,GAAA,KAAA,CAAM,aAC7B,CAAA,EAAkC,CAAA,CAAA;AAGvB,IAAA,iBAAA,GAAoB,SAC/B,KAA6B,EAAA;AAErB,EAAA,IAAA,mBAAA,GAAuC,MAApB,mBAAK,EAAA,UAAA,GAAUA,iBAAK,KAAzC,EAAA,CAAsC,qBAAA,CAAA,CAAA,CAAA;AACtC,EAAA,IAAA,EAAA,GAAgCC,cAAiB,CAAA,EAAE,CAAlD,EAAA,WAAA,GAAW,GAAA,CAAA,CAAA,EAAE,cAAc,GAAA,EAAA,CAAA,CAAA,CAAA,CAAA;AAC1B,EAAA,IAAA,SAAA,GAAcC;AAOtB,EAAA,KAAA,CAAM,UAAU,WAAA;AACd,IAAA,IAAI,mBAAqB,EAAA;AACvB,MAAA,mBAAA,CAAoB,WAAW,CAAA,CAAA;AAAA,KAChC;AAAA,GACA,EAAA,CAAC,WAAa,EAAA,mBAAmB,CAAC,CAAA,CAAA;AAErC,EAAM,IAAA,YAAA,GAAeC,iBACnB,CAAA,SAAC,KAAgC,EAAA;AAC/B,IAAA,OAAA,cACI,KAAM,CAAA,IAAA,CAAK,KAAK,CAAE,CAAA,MAAA,CAAO,SAAA,CAAC,EAAA;AACxB,MAAA,OAAA,EAAE,SAAU,CAAA,WAAA,GAAc,QAAS,CAAA,WAAA,CAAY,aAAa,CAAA,CAAA;AAAA,KAAC,CAE/D,GAAA,KAAA,CAAA;AAAA,GAJJ,EAKF,CAAC,WAAW,CAAC,CAAA,CAAA;AAIf,EAAM,IAAA,KAAA,GAAQC,0DACT,EAAA,UAAU,CAAA,EAAA,EACb,QAAU,EAAA,SAAA,IAAI,EAAA;AAAI,IAAA,OAAA,KAAA,CAAC,cAAAC,oBAAK,KAAK,IAAK,CAAA,KAAA,EAAQ,EAAA,IAAA,CAAK,KAAK,CAAA,CAAA;AAAA,KACpD,MAAQ,EAAA,mBAAA,GAAsB,KAAY,CAAA,GAAA,YAAA;AAI5C,EAAM,IAAA,GAAA,GAAM,MAAM;AACZ,EAAA,IAAA,EAAA,GAA+BC,mBAE9BC,kBAAA,CAAAA,kBAAA,CAAAA,mBAAA,EAAA,EAAA,SAAS,CAAA,EACT,UAAU,CAAA,EAAA,EACb,sBAAwB,EAAA,IAAA,KAE1B,KACA,EAAA,GAAG,GAPG,YAAY,GAAA,EAAA,CAAA,YAAE,EAAA,UAAA,GAAU,EAAA,CAAA,UAAA,CAAA;AAUhC,EAAA,OACE,KAAC,CAAA,aAAA;AAAA,IAAA,gBAAiB,CAAA,QAAA;AAAA,IAAQ,EACxB,KAAO,EAAA;AAAA,MACL,YAAA;AAAA,MACA,UAAA;AAAA,MACA,cAAgB,EAAA,KAAA;AAAA,MAChB,OAAS,EAAA,GAAA;AAAA,MACT,cAAA;AAAA,MACA,WAAA;AAAA,KACD,EAAA;AAAA,IAED,KAAA,CAAA,cAACC,mBAAmB,EAAAD,kBAAA,CAAA,EAAA,EAAA,UAAU,CAAG,EAAA,UAAA,CAAW,KAAK,CAAA;AAAA,IAChD,UAAW,CAAA,QAAA;AAAA,GAAQ,CAAA;AAG1B,EAAA;AAEO,IAAM,sBAAsB,WAAA;AACjC,EAAA,OAAAE,iBAAW,gBAAgB,CAAA,CAAA;AAA3B,EAAA;AAEK,IAAM,oBAAoB,gBAAiB,CAAA,SAAA;AAElD,iBAAA,CAAkB,WAAc,GAAA,mBAAA;;;;;;"}

package/dist/cjs/packages/components/src/FilterMultiSelect/subcomponents/ListBox/ListBox.js

@@ -0,0 +1,64 @@
+'use strict';
+
+var tslib_es6 = require('../../../../../../node_modules/tslib/tslib.es6.js');
+var React = require('react');
+var classnames = require('classnames');
+var SelectionProvider = require('../../context/SelectionProvider/SelectionProvider.js');
+var ListBox_module = require('./ListBox.module.scss.js');
+
+var getItemsFromKeys = function(items, keys) {
+  var itemKeys = Array.from(keys);
+  return itemKeys.reduce(function(acc, itemKey) {
+    var item = items.getItem(itemKey);
+    return item ? tslib_es6.__spreadArray(tslib_es6.__spreadArray([], acc, true), [item], false) : acc;
+  }, []);
+};
+var ListBox = function(_a) {
+  var children = _a.children;
+  var _b = SelectionProvider.useSelectionContext(), listBoxProps = _b.listBoxProps, listRef = _b.listRef, selectionState = _b.selectionState;
+  var _c = React.useState(false), isOverflown = _c[0], setIsOverflown = _c[1];
+  React.useEffect(function() {
+    var listElement = listRef.current;
+    if (!listElement) {
+      return;
+    }
+    setIsOverflown(listElement.scrollHeight > listElement.clientHeight);
+  }, [listRef]);
+  var items = selectionState.collection, disabledKeys = selectionState.disabledKeys, selectedKeys = selectionState.selectionManager.selectedKeys;
+  var disabledItems = getItemsFromKeys(items, disabledKeys);
+  var selectedItems = getItemsFromKeys(items, selectedKeys);
+  var unselectedItems = Array.from(items).filter(function(item) {
+    return !disabledKeys.has(item.key) && !selectedKeys.has(item.key);
+  });
+  var allItems = Array.from(items);
+  var hasNoItems = allItems.length === 0;
+  var _d = React.useState({
+    selectedItems,
+    unselectedItems,
+    disabledItems,
+    allItems,
+    hasNoItems
+  }), itemsState = _d[0], setItemsState = _d[1];
+  React.useEffect(function() {
+    setItemsState({
+      selectedItems,
+      disabledItems,
+      unselectedItems,
+      allItems,
+      hasNoItems
+    });
+  }, [selectionState.collection.size]);
+  if (hasNoItems) {
+    return React.createElement(
+      React.Fragment,
+      null,
+      React.createElement("div", { className: ListBox_module.noResultsWrapper }, children(itemsState)),
+      React.createElement("ul", { ref: listRef, className: ListBox_module.hidden })
+    );
+  }
+  return React.createElement("ul", tslib_es6.__assign({}, listBoxProps, { ref: listRef, className: classnames(ListBox_module.listBox, isOverflown && ListBox_module.overflown) }), children(itemsState));
+};
+ListBox.displayName = "FilterMultiSelect.ListBox";
+
+exports.ListBox = ListBox;
+//# sourceMappingURL=ListBox.js.map

package/dist/cjs/packages/components/src/FilterMultiSelect/subcomponents/ListBox/ListBox.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ListBox.js","sources":["../../../../../../../../src/FilterMultiSelect/subcomponents/ListBox/ListBox.tsx"],"sourcesContent":["import React, { useState, useEffect } from \"react\"\nimport { Collection } from \"@react-types/shared\"\nimport classnames from \"classnames\"\nimport { useSelectionContext } from \"../../context/SelectionProvider\"\nimport { MultiSelectItem } from \"../../types\"\nimport styles from \"./ListBox.module.scss\"\n\nexport type ListBoxItems = {\n  selectedItems: MultiSelectItem[]\n  unselectedItems: MultiSelectItem[]\n  disabledItems: MultiSelectItem[]\n  allItems: MultiSelectItem[]\n  hasNoItems: boolean\n}\n\nexport type ListBoxProps = {\n  children: (items: ListBoxItems) => React.ReactNode\n}\n\nconst getItemsFromKeys = (\n  items: Collection<MultiSelectItem>,\n  keys: Set<React.Key>\n): MultiSelectItem[] => {\n  const itemKeys = Array.from(keys)\n  return itemKeys.reduce<MultiSelectItem[]>((acc, itemKey) => {\n    const item = items.getItem(itemKey)\n    return item ? [...acc, item] : acc\n  }, [])\n}\n\nexport const ListBox = ({ children }: ListBoxProps): JSX.Element => {\n  const { listBoxProps, listRef, selectionState } = useSelectionContext()\n  const [isOverflown, setIsOverflown] = useState(false)\n  useEffect(() => {\n    const listElement = listRef.current\n    if (!listElement) {\n      return\n    }\n    setIsOverflown(listElement.scrollHeight > listElement.clientHeight)\n  }, [listRef])\n  const {\n    collection: items,\n    disabledKeys,\n    selectionManager: { selectedKeys },\n  } = selectionState\n\n  const disabledItems = getItemsFromKeys(items, disabledKeys)\n  const selectedItems = getItemsFromKeys(items, selectedKeys)\n\n  const unselectedItems = Array.from(items).filter(\n    item => !disabledKeys.has(item.key) && !selectedKeys.has(item.key)\n  )\n  const allItems = Array.from(items)\n  const hasNoItems = allItems.length === 0\n\n  const [itemsState, setItemsState] = useState<ListBoxItems>({\n    selectedItems,\n    unselectedItems,\n    disabledItems,\n    allItems,\n    hasNoItems,\n  })\n\n  // Only update rendering of items when filtering.\n  // Avoids re-ordering of items when making a selection\n  useEffect(() => {\n    setItemsState({\n      selectedItems,\n      disabledItems,\n      unselectedItems,\n      allItems,\n      hasNoItems,\n    })\n  }, [selectionState.collection.size])\n\n  if (hasNoItems) {\n    return (\n      <>\n        <div className={styles.noResultsWrapper}>{children(itemsState)}</div>\n        {/* This ul with the ref needs to exist otherwise it fatals */}\n        <ul ref={listRef} className={styles.hidden} />\n      </>\n    )\n  }\n\n  return (\n    <ul\n      {...listBoxProps}\n      ref={listRef}\n      className={classnames(styles.listBox, isOverflown && styles.overflown)}\n    >\n      {children(itemsState)}\n    </ul>\n  )\n}\n\nListBox.displayName = \"FilterMultiSelect.ListBox\"\n"],"names":["__spreadArray","useSelectionContext","useState","useEffect","styles","__assign"],"mappings":"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"}

package/dist/cjs/packages/components/src/FilterMultiSelect/subcomponents/ListBox/ListBox.module.scss.js

@@ -0,0 +1,6 @@
+'use strict';
+
+var styles = {"listBox":"ListBox-module_listBox__UNOzJ","overflown":"ListBox-module_overflown__ATtxj","hidden":"ListBox-module_hidden__tQP6S","noResultsWrapper":"ListBox-module_noResultsWrapper__iJ-x6"};
+
+module.exports = styles;
+//# sourceMappingURL=ListBox.module.scss.js.map

package/dist/cjs/packages/components/src/FilterMultiSelect/subcomponents/ListBox/ListBox.module.scss.js.map

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

package/dist/cjs/packages/components/src/FilterMultiSelect/subcomponents/ListBoxSection/ListBoxSection.js

@@ -0,0 +1,39 @@
+'use strict';
+
+var tslib_es6 = require('../../../../../../node_modules/tslib/tslib.es6.js');
+var React = require('react');
+var uuid = require('uuid');
+var a11y = require('@kaizen/a11y');
+var ListBoxSection_module = require('./ListBoxSection.module.scss.js');
+
+var ListBoxSection = function(_a) {
+  var items = _a.items, children = _a.children, sectionName = _a.sectionName, restProps = tslib_es6.__rest(_a, ["items", "children", "sectionName"]);
+  var listSectionId = React.useState(uuid.v4())[0];
+  var hasSectionHeader = "sectionHeader" in restProps;
+  return React.createElement(
+    "li",
+    { role: "presentation" },
+    React.createElement(
+      "ul",
+      { className: ListBoxSection_module.listBoxSection, "aria-label": !hasSectionHeader ? sectionName : void 0, "aria-labelledby": hasSectionHeader ? listSectionId : void 0, role: "group" },
+      hasSectionHeader && React.createElement(
+        "li",
+        { className: ListBoxSection_module.listBoxSectionHeader, id: listSectionId, role: "presentation" },
+        sectionName && React.createElement(
+          a11y.VisuallyHidden,
+          null,
+          sectionName,
+          ". "
+        ),
+        restProps.sectionHeader
+      ),
+      Array.from(items).map(function(node) {
+        return node != void 0 && children(node);
+      })
+    )
+  );
+};
+ListBoxSection.displayName = "ListBoxSection";
+
+exports.ListBoxSection = ListBoxSection;
+//# sourceMappingURL=ListBoxSection.js.map

package/dist/cjs/packages/components/src/FilterMultiSelect/subcomponents/ListBoxSection/ListBoxSection.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ListBoxSection.js","sources":["../../../../../../../../src/FilterMultiSelect/subcomponents/ListBoxSection/ListBoxSection.tsx"],"sourcesContent":["import React, { ReactNode, useState } from \"react\"\nimport { v4 } from \"uuid\"\nimport { VisuallyHidden } from \"@kaizen/a11y\"\nimport { MultiSelectItem } from \"../../types\"\nimport styles from \"./ListBoxSection.module.scss\"\n\ntype SectionNameProps = {\n  /**\n   * Becomes an aria-label on the section, informing\n   * unsighted users\n   */\n  sectionName: string\n}\n\ntype SectionHeaderProps = {\n  /**\n   * Becomes an aria-label on the section, informing\n   * unsighted users\n   */\n  sectionName?: string\n  /**\n   * Can be used for a visual title of the ListBoxSection or to provide addition information in a React node.\n   * If this is the same title as sectionName, you should only pass in a sectionHeader to avoid duplicate descriptions.\n   */\n  sectionHeader: ReactNode\n}\n\nexport type ListBoxSectionProps = {\n  items: MultiSelectItem[]\n  children: (item: MultiSelectItem) => React.ReactNode\n} & (SectionHeaderProps | SectionNameProps)\n\nexport const ListBoxSection = ({\n  items,\n  children,\n  sectionName,\n  ...restProps\n}: ListBoxSectionProps): JSX.Element => {\n  const [listSectionId] = useState<string>(v4())\n  const hasSectionHeader = \"sectionHeader\" in restProps\n  return (\n    <li role=\"presentation\">\n      <ul\n        className={styles.listBoxSection}\n        aria-label={!hasSectionHeader ? sectionName : undefined}\n        aria-labelledby={hasSectionHeader ? listSectionId : undefined}\n        role=\"group\"\n      >\n        {hasSectionHeader && (\n          <li\n            className={styles.listBoxSectionHeader}\n            id={listSectionId}\n            role=\"presentation\"\n          >\n            {sectionName && <VisuallyHidden>{sectionName}. </VisuallyHidden>}\n            {restProps.sectionHeader}\n          </li>\n        )}\n        {/*\n         * This seems semantically strange but most closely aligns to WCAGs suggested pattern:\n         https://www.w3.org/WAI/ARIA/apg/patterns/listbox/examples/listbox-grouped/\n         * the role=\"presentation\" will throw an error a11y warning \"Element has children which are not allowed\".\n         This is expected and is an accepted issue / potential limitation with axe\n         */}\n        {Array.from(items).map(node => node != undefined && children(node))}\n      </ul>\n    </li>\n  )\n}\nListBoxSection.displayName = \"ListBoxSection\"\n"],"names":["__rest","useState","v4","styles","VisuallyHidden"],"mappings":";;;;;;;;AAgCa,IAAA,cAAA,GAAiB,SAAC,EAKT,EAAA;AAJpB,EAAA,IAAA,QAAK,EAAA,CAAA,KAAA,EACL,QAAQ,GAAA,EAAA,CAAA,UACR,WAAW,GAAA,EAAA,CAAA,WACR,EAAA,SAAA,GAJ0BA,iBAAA,EAAA,EAAA,CAAA,OAAA,EAAA,UAAA,EAAA,aAAA,CAK9B,CAAA,CAAA;AACQ,EAAA,IAAA,aAAiB,GAAAC,cAAA,CAAiBC,OAAI,EAAA;AAC7C,EAAA,IAAM,mBAAmB,eAAmB,IAAA,SAAA,CAAA;AAC5C,EAAA,OACE,KAAA,CAAA,aAAA;AAAA,IAAA,IAAA;AAAA,IAAA,EAAI,MAAK,cAAc,EAAA;AAAA,IACrB,KAAA,CAAA,aAAA;AAAA,MAAA,IAAA;AAAA,MAAA,EACE,SAAA,EAAWC,qBAAO,CAAA,cAAA,EAAc,cACpB,CAAC,gBAAA,GAAmB,WAAc,GAAA,KAAA,CAAA,EAC7B,iBAAA,EAAA,gBAAA,GAAmB,aAAgB,GAAA,KAAA,CAAA,EACpD,MAAK,OAAO,EAAA;AAAA,MAEX,oBACC,KACE,CAAA,aAAA;AAAA,QAAA,IAAA;AAAA,QAAA,EAAA,SAAW,EAAAA,qBAAA,CAAO,sBAClB,EAAI,EAAA,aAAA,EACJ,MAAK,cAAc,EAAA;AAAA,QAElB,eAAe;UAACC,mBAAA;AAAA,UAAc,IAAA;AAAA,UAAE,WAAA;AAAA,UAA+B,IAAA;AAAA,SAAA;AAAA,QAC/D,SAAU,CAAA,aAAA;AAAA,OAAa;AAAA,MAS3B,MAAM,IAAK,CAAA,KAAK,CAAE,CAAA,GAAA,CAAI,SAAA,IAAI,EAAA;AAAI,QAAA,OAAA,IAAA,IAAQ,KAAa,CAAA,IAAA,QAAA,CAAS,IAAI,CAAA,CAAA;AAAA,OAAC,CAAA;AAAA,KAAC;AAAA,GAChE,CAAA;AAGX,EAAA;AACA,cAAA,CAAe,WAAc,GAAA,gBAAA;;;;"}

package/dist/cjs/packages/components/src/FilterMultiSelect/subcomponents/ListBoxSection/ListBoxSection.module.scss.js

@@ -0,0 +1,6 @@
+'use strict';
+
+var styles = {"listBoxSection":"ListBoxSection-module_listBoxSection__zH8wd","listBoxSectionHeader":"ListBoxSection-module_listBoxSectionHeader__NcTZR"};
+
+module.exports = styles;
+//# sourceMappingURL=ListBoxSection.module.scss.js.map

package/dist/cjs/packages/components/src/FilterMultiSelect/subcomponents/ListBoxSection/ListBoxSection.module.scss.js.map

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

package/dist/cjs/packages/components/src/FilterMultiSelect/subcomponents/LoadMoreButton/LoadMoreButton.js

@@ -0,0 +1,21 @@
+'use strict';
+
+var tslib_es6 = require('../../../../../../node_modules/tslib/tslib.es6.js');
+var React = require('react');
+var Button = require('../../../Button/Button/Button.js');
+require('../../../Button/IconButton/IconButton.js');
+require('../../../Button/PaginationLink/PaginationLink.js');
+require('../../../Button/DirectionalLink/DirectionalLink.js');
+var LoadMoreButton_module = require('./LoadMoreButton.module.scss.js');
+
+var LoadMoreButton = function(props) {
+  return React.createElement(
+    "div",
+    { className: LoadMoreButton_module.container },
+    React.createElement(Button.Button, tslib_es6.__assign({}, props, { fullWidth: true }))
+  );
+};
+LoadMoreButton.displayName = "FilterMultiSelect.LoadMoreButton";
+
+exports.LoadMoreButton = LoadMoreButton;
+//# sourceMappingURL=LoadMoreButton.js.map

package/dist/cjs/packages/components/src/FilterMultiSelect/subcomponents/LoadMoreButton/LoadMoreButton.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"LoadMoreButton.js","sources":["../../../../../../../../src/FilterMultiSelect/subcomponents/LoadMoreButton/LoadMoreButton.tsx"],"sourcesContent":["import React from \"react\"\nimport { Button, ButtonProps } from \"~components/Button\"\nimport styles from \"./LoadMoreButton.module.scss\"\n\nexport type LoadMoreButtonProps = ButtonProps\n\nexport const LoadMoreButton = (props: LoadMoreButtonProps): JSX.Element => (\n  <div className={styles.container}>\n    <Button {...props} fullWidth />\n  </div>\n)\n\nLoadMoreButton.displayName = \"FilterMultiSelect.LoadMoreButton\"\n"],"names":["styles","Button","__assign"],"mappings":";;;;;;;;;;AAMa,IAAA,cAAA,GAAiB,SAAC,KAA0B,EAAA;AAAkB,EAAA,OACzE,KAAK,CAAA,aAAA;AAAA,IAAA,KAAA;AAAA,IAAA,EAAA,SAAW,EAAAA,qBAAA,CAAO,SAAS,EAAA;AAAA,IAC9B,KAAA,CAAC,aAAA,CAAAC,aAAA,EAAWC,kBAAA,CAAA,EAAA,EAAA,KAAA,EAAO,EAAA,SAAA;GAAY,CAAA;AAFwC,EAAA;AAM3E,cAAA,CAAe,WAAc,GAAA,kCAAA;;;;"}

package/dist/cjs/packages/components/src/FilterMultiSelect/subcomponents/LoadMoreButton/LoadMoreButton.module.scss.js

@@ -0,0 +1,6 @@
+'use strict';
+
+var styles = {"container":"LoadMoreButton-module_container__5VoUY"};
+
+module.exports = styles;
+//# sourceMappingURL=LoadMoreButton.module.scss.js.map

package/dist/cjs/packages/components/src/FilterMultiSelect/subcomponents/LoadMoreButton/LoadMoreButton.module.scss.js.map

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

package/dist/cjs/packages/components/src/FilterMultiSelect/subcomponents/MenuLayout/MenuFooter/MenuFooter.js

@@ -0,0 +1,13 @@
+'use strict';
+
+var React = require('react');
+var MenuFooter_module = require('./MenuFooter.module.scss.js');
+
+var MenuFooter = function(_a) {
+  var children = _a.children;
+  return React.createElement("div", { className: MenuFooter_module.footer }, children);
+};
+MenuFooter.displayName = "FilterMultiSelect.MenuFooter";
+
+exports.MenuFooter = MenuFooter;
+//# sourceMappingURL=MenuFooter.js.map

package/dist/cjs/packages/components/src/FilterMultiSelect/subcomponents/MenuLayout/MenuFooter/MenuFooter.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"MenuFooter.js","sources":["../../../../../../../../../src/FilterMultiSelect/subcomponents/MenuLayout/MenuFooter/MenuFooter.tsx"],"sourcesContent":["import React from \"react\"\nimport styles from \"./MenuFooter.module.scss\"\n\nexport type MenuFooterProps = {\n  children: React.ReactNode\n}\n\nexport const MenuFooter = ({ children }: MenuFooterProps): JSX.Element => (\n  <div className={styles.footer}>{children}</div>\n)\n\nMenuFooter.displayName = \"FilterMultiSelect.MenuFooter\"\n"],"names":["styles"],"mappings":";;;;;AAOa,IAAA,UAAA,GAAa,SAAC,EAA6B,EAAA;AAA3B,EAAA,IAAA,WAAQ,EAAA,CAAA,QAAA,CAAA;AAAqC,EACxE,OAAA,KAAA,CAAK,cAAA,KAAA,EAAA,EAAA,WAAWA,iBAAO,CAAA,MAAA,IAAS,QAAQ,CAAA,CAAA;AADgC,EAAA;AAI1E,UAAA,CAAW,WAAc,GAAA,8BAAA;;;;"}

package/dist/cjs/packages/components/src/FilterMultiSelect/subcomponents/MenuLayout/MenuFooter/MenuFooter.module.scss.js

@@ -0,0 +1,6 @@
+'use strict';
+
+var styles = {"footer":"MenuFooter-module_footer__EAJQH"};
+
+module.exports = styles;
+//# sourceMappingURL=MenuFooter.module.scss.js.map

package/dist/cjs/packages/components/src/FilterMultiSelect/subcomponents/MenuLayout/MenuFooter/MenuFooter.module.scss.js.map

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

package/dist/cjs/packages/components/src/FilterMultiSelect/subcomponents/MenuLayout/MenuLoadingSkeleton/MenuLoadingSkeleton.js

@@ -0,0 +1,34 @@
+'use strict';
+
+var React = require('react');
+var loadingSkeleton = require('@kaizen/loading-skeleton');
+var MenuFooter = require('../MenuFooter/MenuFooter.js');
+var MenuLoadingSkeleton_module = require('./MenuLoadingSkeleton.module.scss.js');
+
+var MenuLoadingSkeleton = function(_a) {
+  var _b = _a.isAnimated, isAnimated = _b === void 0 ? false : _b;
+  return React.createElement(
+    React.Fragment,
+    null,
+    React.createElement(
+      "div",
+      { className: MenuLoadingSkeleton_module.loadingContainer },
+      React.createElement(loadingSkeleton.LoadingInput, { classNameOverride: MenuLoadingSkeleton_module.loadingInput, isAnimated }),
+      React.createElement(loadingSkeleton.LoadingParagraph, { isAnimated }),
+      React.createElement(loadingSkeleton.LoadingParagraph, { isAnimated }),
+      React.createElement(loadingSkeleton.LoadingParagraph, { isAnimated }),
+      React.createElement(loadingSkeleton.LoadingParagraph, { isAnimated }),
+      React.createElement(loadingSkeleton.LoadingParagraph, { isAnimated })
+    ),
+    React.createElement(
+      MenuFooter.MenuFooter,
+      null,
+      React.createElement(loadingSkeleton.LoadingInput, { width: 40, height: 36, isAnimated }),
+      React.createElement(loadingSkeleton.LoadingInput, { width: 30, height: 36, isAnimated })
+    )
+  );
+};
+MenuLoadingSkeleton.displayName = "FilterMultiSelect.MenuLoadingSkeleton";
+
+exports.MenuLoadingSkeleton = MenuLoadingSkeleton;
+//# sourceMappingURL=MenuLoadingSkeleton.js.map

package/dist/cjs/packages/components/src/FilterMultiSelect/subcomponents/MenuLayout/MenuLoadingSkeleton/MenuLoadingSkeleton.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"MenuLoadingSkeleton.js","sources":["../../../../../../../../../src/FilterMultiSelect/subcomponents/MenuLayout/MenuLoadingSkeleton/MenuLoadingSkeleton.tsx"],"sourcesContent":["import React from \"react\"\nimport { LoadingInput, LoadingParagraph } from \"@kaizen/loading-skeleton\"\nimport { MenuFooter } from \"../MenuFooter\"\nimport styles from \"./MenuLoadingSkeleton.module.scss\"\n\nexport type MenuLoadingSkeletonProps = {\n  isAnimated?: boolean\n}\n\nexport const MenuLoadingSkeleton = ({\n  isAnimated = false,\n}: MenuLoadingSkeletonProps): JSX.Element => (\n  <>\n    <div className={styles.loadingContainer}>\n      <LoadingInput\n        classNameOverride={styles.loadingInput}\n        isAnimated={isAnimated}\n      />\n      <LoadingParagraph isAnimated={isAnimated} />\n      <LoadingParagraph isAnimated={isAnimated} />\n      <LoadingParagraph isAnimated={isAnimated} />\n      <LoadingParagraph isAnimated={isAnimated} />\n      <LoadingParagraph isAnimated={isAnimated} />\n    </div>\n    <MenuFooter>\n      <LoadingInput width={40} height={36} isAnimated={isAnimated} />\n      <LoadingInput width={30} height={36} isAnimated={isAnimated} />\n    </MenuFooter>\n  </>\n)\n\nMenuLoadingSkeleton.displayName = \"FilterMultiSelect.MenuLoadingSkeleton\"\n"],"names":["styles","LoadingInput","LoadingParagraph","MenuFooter"],"mappings":";;;;;;;AASa,IAAA,mBAAA,GAAsB,SAAC,EAET,EAAA;AADzB,EAAA,IAAA,KAAA,EAAA,CAAA,UAAA,EAAA,UAAa,GAAA,EAAA,KAAA,SAAA,KAAK,GAAA,EAAA,CAAA;AACyB,EAAA,OAC3C,KAAA,CAAA,aAAA;AAAA,IAAA,KAAA,CAAA,QAAA;AAAA,IAAA,IAAA;AAAA,IACE,KAAA,CAAA,aAAA;AAAA,MAAA,KAAA;AAAA,MAAA,EAAK,SAAW,EAAAA,0BAAA,CAAO,gBAAgB,EAAA;AAAA,MACrC,KAAA,CAAC,cAAAC,4BACC,EAAA,EAAA,mBAAmBD,0BAAO,CAAA,YAAA,EAC1B,YACA,CAAA;AAAA,MACF,KAAA,CAAA,aAAA,CAACE,gCAAgB,EAAA,EAAC,YAA0B,CAAA;AAAA,MAC5C,KAAA,CAAA,aAAA,CAACA,gCAAgB,EAAA,EAAC,YAA0B,CAAA;AAAA,MAC5C,KAAA,CAAA,aAAA,CAACA,gCAAgB,EAAA,EAAC,YAA0B,CAAA;AAAA,MAC5C,KAAA,CAAA,aAAA,CAACA,gCAAgB,EAAA,EAAC,YAA0B,CAAA;AAAA,MAC5C,KAAA,CAAA,aAAA,CAACA,gCAAiB,EAAA,EAAA;KAA0B;AAAA,IAE9C,KAAA,CAAA,aAAA;AAAA,MAACC,qBAAA;AAAA,MAAU,IAAA;AAAA,MACT,KAAA,CAAA,cAACF,4BAAY,EAAA,EAAC,OAAO,EAAI,EAAA,MAAA,EAAQ,EAAI,EAAA,UAAA,EAA0B,CAAA;AAAA,MAC/D,KAAA,CAAA,cAACA,4BAAa,EAAA,EAAA,OAAO,EAAI,EAAA,MAAA,EAAQ,EAAI,EAAA,UAAA,EAA0B,CAAA;AAAA,KAAA;AAAA,GACpD,CAAA;AAhB4B,EAAA;AAoB7C,mBAAA,CAAoB,WAAc,GAAA,uCAAA;;;;"}

package/dist/cjs/packages/components/src/FilterMultiSelect/subcomponents/MenuLayout/MenuLoadingSkeleton/MenuLoadingSkeleton.module.scss.js

@@ -0,0 +1,6 @@
+'use strict';
+
+var styles = {"loadingInput":"MenuLoadingSkeleton-module_loadingInput__XjXUs","loadingContainer":"MenuLoadingSkeleton-module_loadingContainer__Re0NU"};
+
+module.exports = styles;
+//# sourceMappingURL=MenuLoadingSkeleton.module.scss.js.map

package/dist/cjs/packages/components/src/FilterMultiSelect/subcomponents/MenuLayout/MenuLoadingSkeleton/MenuLoadingSkeleton.module.scss.js.map

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

package/dist/cjs/packages/components/src/FilterMultiSelect/subcomponents/MenuPopup/MenuPopup.js

@@ -0,0 +1,43 @@
+'use strict';
+
+var tslib_es6 = require('../../../../../../node_modules/tslib/tslib.es6.js');
+var React = require('react');
+var focus = require('@react-aria/focus');
+var overlays = require('@react-aria/overlays');
+var MenuTriggerProvider = require('../../context/MenuTriggerProvider/MenuTriggerProvider.js');
+require('../../context/SelectionProvider/SelectionProvider.js');
+var MenuPopup_module = require('./MenuPopup.module.scss.js');
+
+var MenuPopup = function(_a) {
+  var isLoading = _a.isLoading, loadingSkeleton = _a.loadingSkeleton, children = _a.children;
+  var menuTriggerState = MenuTriggerProvider.useMenuTriggerContext().menuTriggerState;
+  var onClose = function() {
+    return menuTriggerState.close();
+  };
+  var overlayRef = React.createRef();
+  var overlayProps = overlays.useOverlay({
+    onClose,
+    isOpen: menuTriggerState.isOpen,
+    isDismissable: true
+  }, overlayRef).overlayProps;
+  return menuTriggerState.isOpen ? React.createElement("div", tslib_es6.__assign({}, overlayProps, { ref: overlayRef, className: MenuPopup_module.menuPopup }), isLoading && loadingSkeleton ? React.createElement(
+    React.Fragment,
+    null,
+    React.createElement(overlays.DismissButton, { onDismiss: onClose }),
+    loadingSkeleton,
+    React.createElement(overlays.DismissButton, { onDismiss: onClose })
+  ) : (
+    // eslint-disable-next-line jsx-a11y/no-autofocus
+    React.createElement(
+      focus.FocusScope,
+      { contain: true, autoFocus: true, restoreFocus: true },
+      React.createElement(overlays.DismissButton, { onDismiss: onClose }),
+      children,
+      React.createElement(overlays.DismissButton, { onDismiss: onClose })
+    )
+  )) : React.createElement(React.Fragment, null);
+};
+MenuPopup.displayName = "FilterMultiSelect.MenuPopup";
+
+exports.MenuPopup = MenuPopup;
+//# sourceMappingURL=MenuPopup.js.map

package/dist/cjs/packages/components/src/FilterMultiSelect/subcomponents/MenuPopup/MenuPopup.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"MenuPopup.js","sources":["../../../../../../../../src/FilterMultiSelect/subcomponents/MenuPopup/MenuPopup.tsx"],"sourcesContent":["import React from \"react\"\nimport { FocusScope } from \"@react-aria/focus\"\nimport { useOverlay, DismissButton } from \"@react-aria/overlays\"\nimport { useMenuTriggerContext } from \"../../context\"\nimport styles from \"./MenuPopup.module.scss\"\n\nexport type MenuPopupProps = {\n  isLoading?: boolean\n  loadingSkeleton?: React.ReactNode\n  children: React.ReactNode\n}\n\nexport const MenuPopup = ({\n  isLoading,\n  loadingSkeleton,\n  children,\n}: MenuPopupProps): JSX.Element => {\n  const { menuTriggerState } = useMenuTriggerContext()\n\n  const onClose = (): void => menuTriggerState.close()\n\n  // Handle events that should cause the menu to close,\n  // e.g. blur, clicking outside, or pressing the escape key.\n  const overlayRef = React.createRef<HTMLDivElement>()\n  const { overlayProps } = useOverlay(\n    {\n      onClose,\n      isOpen: menuTriggerState.isOpen,\n      isDismissable: true,\n    },\n    overlayRef\n  )\n\n  // Wrap in <FocusScope> so that focus is restored back to the trigger when the menu is closed\n  // and auto focus on the first focusable item after loading. (disable eslint no-autofocus error for it)\n  // In addition, add hidden <DismissButton> components at the start and end of the list\n  // to allow screen reader users to dismiss the popup easily.\n  return menuTriggerState.isOpen ? (\n    <div {...overlayProps} ref={overlayRef} className={styles.menuPopup}>\n      {isLoading && loadingSkeleton ? (\n        <>\n          <DismissButton onDismiss={onClose} />\n          {loadingSkeleton}\n          <DismissButton onDismiss={onClose} />\n        </>\n      ) : (\n        // eslint-disable-next-line jsx-a11y/no-autofocus\n        <FocusScope contain autoFocus restoreFocus>\n          <DismissButton onDismiss={onClose} />\n\n          {children}\n          <DismissButton onDismiss={onClose} />\n        </FocusScope>\n      )}\n    </div>\n  ) : (\n    <></>\n  )\n}\n\nMenuPopup.displayName = \"FilterMultiSelect.MenuPopup\"\n"],"names":["useMenuTriggerContext","useOverlay","__assign","styles","DismissButton","FocusScope"],"mappings":";;;;;;;;;;AAYa,IAAA,SAAA,GAAY,SAAC,EAIT,EAAA;AAHf,EAAA,IAAA,0BACA,kBAAe,EAAA,CAAA,eAAA,EACf,WAAQ,EAAA,CAAA,QAAA,CAAA;AAEA,EAAA,IAAA,gBAAA,GAAqBA;AAE7B,EAAA,IAAM,UAAU,WAAA;AAAY,IAAA,OAAA,iBAAiB,KAAK,EAAA,CAAA;AAAA,GAAtB,CAAA;AAI5B,EAAM,IAAA,UAAA,GAAa,MAAM;AACjB,EAAA,IAAA,eAAiBC,mBACvB,CAAA;AAAA,IACE,OAAA;AAAA,IACA,QAAQ,gBAAiB,CAAA,MAAA;AAAA,IACzB,aAAe,EAAA,IAAA;AAAA,KAEjB,UAAU,CACX,CAAA,YAAA,CAAA;AAMD,EAAA,OAAO,iBAAiB,MACtB,GAAA,KAAA,CAAS,cAAA,KAAA,EAAAC,kBAAA,CAAA,EAAA,EAAA,YAAA,EAAc,EAAA,GAAK,EAAA,UAAA,EAAY,WAAWC,gBAAO,CAAA,SAAA,EAAS,CAChE,EAAA,SAAA,IAAa,kBACZ,KAAA,CAAA,aAAA;AAAA,IAAA,KAAA,CAAA,QAAA;AAAA,IAAA,IAAA;AAAA,IACE,MAAA,aAAC,CAAAC,sBAAA,EAAa,EAAC,SAAA,EAAW,SAAW,CAAA;AAAA,IACpC,eAAA;AAAA,IACD,MAAC,aAAA,CAAAA,sBAAA,EAAc,EAAA,SAAA,EAAW;GAAW;AAAA;AAAA,IAIvC,KAAA,CAAA,aAAA;AAAA,MAACC,gBAAA;AAAA,MAAW,EAAA,OAAQ,EAAA,IAAA,EAAA,iBAAU,cAAY,IAAA,EAAA;AAAA,MACxC,MAAA,aAAC,CAAAD,sBAAA,EAAa,EAAC,SAAA,EAAW,SAAW,CAAA;AAAA,MAEpC,QAAA;AAAA,MACD,MAAA,aAAC,CAAAA,sBAAA,EAAc,EAAA,SAAA,EAAW;KAAW;AAAA,GAExC,CAGH,GAAA,KAAA,CAAA,aAAA,CAAA,KAAA,CAAA,UAAA,IAAA,CAAA,CAAA;AAEJ,EAAA;AAEA,SAAA,CAAU,WAAc,GAAA,6BAAA;;;;"}

package/dist/cjs/packages/components/src/FilterMultiSelect/subcomponents/MenuPopup/MenuPopup.module.scss.js

@@ -0,0 +1,6 @@
+'use strict';
+
+var styles = {"menuPopup":"MenuPopup-module_menuPopup__JlPk3"};
+
+module.exports = styles;
+//# sourceMappingURL=MenuPopup.module.scss.js.map

package/dist/cjs/packages/components/src/FilterMultiSelect/subcomponents/MenuPopup/MenuPopup.module.scss.js.map

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

package/dist/cjs/packages/components/src/FilterMultiSelect/subcomponents/MultiSelectOption/MultiSelectOption.js

@@ -0,0 +1,44 @@
+'use strict';
+
+var tslib_es6 = require('../../../../../../node_modules/tslib/tslib.es6.js');
+var React = require('react');
+var focus = require('@react-aria/focus');
+var listbox = require('@react-aria/listbox');
+var utils = require('@react-aria/utils');
+var classnames = require('classnames');
+var uuid = require('uuid');
+var a11y = require('@kaizen/a11y');
+var draftBadge = require('@kaizen/draft-badge');
+require('../../../Icon/subcomponents/SVG/SVG.js');
+var CheckIcon = require('../../../Icon/CheckIcon.js');
+require('../../context/MenuTriggerProvider/MenuTriggerProvider.js');
+var SelectionProvider = require('../../context/SelectionProvider/SelectionProvider.js');
+var MultiSelectOption_module = require('./MultiSelectOption.module.scss.js');
+
+var MultiSelectOption = function(_a) {
+  var _b, _c, _d;
+  var classNameOverride = _a.classNameOverride, item = _a.item;
+  var state = SelectionProvider.useSelectionContext().selectionState;
+  var ref = React.createRef();
+  var _e = listbox.useOption({ key: item.key }, state, ref), optionProps = _e.optionProps, isSelected = _e.isSelected, isDisabled = _e.isDisabled;
+  var _f = focus.useFocusRing(), isFocusVisible = _f.isFocusVisible, focusProps = _f.focusProps;
+  var countElementId = React.useMemo(function() {
+    return uuid.v4();
+  }, []);
+  return React.createElement(
+    "li",
+    tslib_es6.__assign({}, utils.mergeProps(optionProps, focusProps), { ref, className: classnames(MultiSelectOption_module.option, classNameOverride, isSelected && MultiSelectOption_module.isSelected, isFocusVisible && MultiSelectOption_module.isFocusVisible, isDisabled && MultiSelectOption_module.isDisabled), "aria-label": (_b = item.value) === null || _b === void 0 ? void 0 : _b.label, "aria-describedby": ((_c = item.value) === null || _c === void 0 ? void 0 : _c.count) ? countElementId : void 0 }),
+    React.createElement("span", { className: classnames(MultiSelectOption_module.icon, isSelected && MultiSelectOption_module.isSelected) }, isSelected && React.createElement(CheckIcon.CheckIcon, { role: "presentation" })),
+    item.rendered,
+    ((_d = item.value) === null || _d === void 0 ? void 0 : _d.count) && React.createElement(
+      "span",
+      { id: countElementId, className: MultiSelectOption_module.badgeContainer },
+      React.createElement(draftBadge.Badge, { classNameOverride: MultiSelectOption_module.badge }, item.value.count),
+      React.createElement(a11y.VisuallyHidden, null, " available")
+    )
+  );
+};
+MultiSelectOption.displayName = "FilterMultiSelect.Option";
+
+exports.MultiSelectOption = MultiSelectOption;
+//# sourceMappingURL=MultiSelectOption.js.map

package/dist/cjs/packages/components/src/FilterMultiSelect/subcomponents/MultiSelectOption/MultiSelectOption.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"MultiSelectOption.js","sources":["../../../../../../../../src/FilterMultiSelect/subcomponents/MultiSelectOption/MultiSelectOption.tsx"],"sourcesContent":["import React, { useMemo } from \"react\"\nimport { useFocusRing } from \"@react-aria/focus\"\nimport { useOption } from \"@react-aria/listbox\"\nimport { mergeProps } from \"@react-aria/utils\"\nimport classnames from \"classnames\"\nimport { v4 } from \"uuid\"\nimport { VisuallyHidden } from \"@kaizen/a11y\"\nimport { Badge } from \"@kaizen/draft-badge\"\nimport { CheckIcon } from \"~components/Icon\"\nimport { useSelectionContext } from \"../../context\"\nimport { MultiSelectItem } from \"../../types\"\nimport styles from \"./MultiSelectOption.module.scss\"\n\nexport interface MultiSelectOptionProps {\n  classNameOverride?: string\n  item: MultiSelectItem\n}\n\nexport const MultiSelectOption = ({\n  classNameOverride,\n  item,\n}: MultiSelectOptionProps): JSX.Element => {\n  const { selectionState: state } = useSelectionContext()\n  // Get props for the option element\n  const ref = React.createRef<HTMLLIElement>()\n  const { optionProps, isSelected, isDisabled } = useOption(\n    { key: item.key },\n    state,\n    ref\n  )\n\n  // Determine whether we should show a keyboard\n  // focus ring for accessibility\n  const { isFocusVisible, focusProps } = useFocusRing()\n  const countElementId = useMemo(() => v4(), [])\n\n  return (\n    <li\n      {...mergeProps(optionProps, focusProps)}\n      ref={ref}\n      className={classnames(\n        styles.option,\n        classNameOverride,\n        isSelected && styles.isSelected,\n        isFocusVisible && styles.isFocusVisible,\n        isDisabled && styles.isDisabled\n      )}\n      aria-label={item.value?.label}\n      aria-describedby={item.value?.count ? countElementId : undefined}\n    >\n      <span\n        className={classnames(styles.icon, isSelected && styles.isSelected)}\n      >\n        {isSelected && <CheckIcon role=\"presentation\" />}\n      </span>\n      {/* can also be item.value since 'rendered' is defined as item.value in SelectionProvider*/}\n      {item.rendered}\n      {item.value?.count && (\n        <span id={countElementId} className={styles.badgeContainer}>\n          <Badge classNameOverride={styles.badge}>{item.value.count}</Badge>\n          <VisuallyHidden> available</VisuallyHidden>\n        </span>\n      )}\n    </li>\n  )\n}\n\nMultiSelectOption.displayName = \"FilterMultiSelect.Option\"\n"],"names":["useSelectionContext","useOption","useFocusRing","useMemo","v4","__assign","mergeProps","styles","CheckIcon","Badge","VisuallyHidden"],"mappings":";;;;;;;;;;;;;;;;;AAkBa,IAAA,iBAAA,GAAoB,SAAC,EAGT,EAAA;;MAFvB,iBAAiB,GAAA,EAAA,CAAA,iBACjB,EAAA,IAAA,GAAI,EAAA,CAAA,IAAA,CAAA;AAEI,EAAgB,IAAA,KAAA,GAAUA;AAElC,EAAM,IAAA,GAAA,GAAM,MAAM;AACZ,EAAA,IAAA,KAA0CC,iBAC9C,CAAA,EAAE,GAAK,EAAA,IAAA,CAAK,KACZ,EAAA,KAAA,EACA,GAAG,CAAA,EAHG,cAAW,EAAA,CAAA,WAAA,EAAE,aAAU,EAAA,CAAA,UAAA,EAAE,aAAU,EAAA,CAAA,UAAA,CAAA;AAQrC,EAAA,IAAA,KAAiCC,kBAAc,EAAA,EAA7C,iBAAc,EAAA,CAAA,cAAA,EAAE,aAAU,EAAA,CAAA,UAAA,CAAA;AAClC,EAAM,IAAA,cAAA,GAAiBC,cAAQ,WAAM;AAAA,IAAA,OAAAC,OAAE,EAAA,CAAA;AAAA,GAAF,EAAM,EAAE,CAAA,CAAA;AAE7C,EAAA,OACE,KAAA,CAAA,aAAA;AAAA,IAAA,IAAA;AAAA,IAAAC,kBAAA,CAAA,EACM,EAAAC,gBAAA,CAAW,aAAa,UAAU,CAAA,EACtC,EAAA,GACA,EAAA,SAAA,EAAW,WACTC,wBAAO,CAAA,MAAA,EACP,mBACA,UAAc,IAAAA,wBAAA,CAAO,YACrB,cAAkB,IAAAA,wBAAA,CAAO,cACzB,EAAA,UAAA,IAAcA,wBAAO,CAAA,UAAU,GAErB,YAAA,EAAA,CAAA,EAAA,GAAA,KAAK,KAAO,MAAA,IAAA,IAAA,OAAA,KAAA,CAAA,GAAA,KAAA,CAAA,GAAA,GAAA,KACN,EAAA,kBAAA,EAAA,CAAA,CAAA,KAAA,IAAK,CAAA,KAAA,MAAO,QAAA,EAAA,KAAA,KAAA,CAAA,GAAA,SAAA,EAAA,CAAA,KAAA,IAAQ,cAAiB,GAAA,KAAA,CAAA,EAAS,CAAA;AAAA,IAEhE,KAAA,CACE,cAAA,MAAA,EAAA,EAAA,WAAW,UAAW,CAAAA,wBAAA,CAAO,MAAM,UAAc,IAAAA,wBAAA,CAAO,UAAU,CAAC,EAAA,EAElE,cAAc,KAAC,CAAA,aAAA,CAAAC,uBAAU,IAAA,EAAK,cAAc,EAAA,CAAG,CAAA;AAAA,IAGjD,IAAK,CAAA,QAAA;AAAA,WACL,KAAK,KAAK,MAAA,IAAA,IAAA,OAAA,KAAA,CAAA,GAAA,KAAA,CAAA,GAAA,EAAE,CAAA,KAAA,KACX,KAAM,CAAA,aAAA;AAAA,MAAA,MAAA;AAAA,MAAA,EAAA,EAAA,EAAI,cAAgB,EAAA,SAAA,EAAWD,yBAAO,cAAc,EAAA;AAAA,MACxD,KAAA,CAAA,aAAC,CAAAE,gBAAA,EAAK,EAAC,iBAAA,EAAmBF,yBAAO,KAAK,EAAA,EAAG,IAAK,CAAA,KAAA,CAAM,KAAK,CAAA;AAAA,MACzD,KAAA,CAAA,aAAA,CAACG,mBAA0C,EAAA,IAAA,EAAA,YAAA,CAAA;AAAA,KAAA;AAAA,GAE9C,CAAA;AAGP,EAAA;AAEA,iBAAA,CAAkB,WAAc,GAAA,0BAAA;;;;"}

package/dist/cjs/packages/components/src/FilterMultiSelect/subcomponents/MultiSelectOption/MultiSelectOption.module.scss.js

@@ -0,0 +1,6 @@
+'use strict';
+
+var styles = {"icon":"MultiSelectOption-module_icon__rmfL-","option":"MultiSelectOption-module_option__1vbfi","badge":"MultiSelectOption-module_badge__VbnQR","isFocused":"MultiSelectOption-module_isFocused__XhwMs","isDisabled":"MultiSelectOption-module_isDisabled__FKH9f","badgeContainer":"MultiSelectOption-module_badgeContainer__6Xw7E","isSelected":"MultiSelectOption-module_isSelected__dXmuK"};
+
+module.exports = styles;
+//# sourceMappingURL=MultiSelectOption.module.scss.js.map

package/dist/cjs/packages/components/src/FilterMultiSelect/subcomponents/MultiSelectOption/MultiSelectOption.module.scss.js.map

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

package/dist/cjs/packages/components/src/FilterMultiSelect/subcomponents/NoResults/NoResults.js

@@ -0,0 +1,19 @@
+'use strict';
+
+var tslib_es6 = require('../../../../../../node_modules/tslib/tslib.es6.js');
+var React = require('react');
+var typography = require('@kaizen/typography');
+var NoResults_module = require('./NoResults.module.scss.js');
+
+var NoResults = function(_a) {
+  var children = _a.children, restProps = tslib_es6.__rest(_a, ["children"]);
+  return React.createElement(
+    "div",
+    tslib_es6.__assign({ className: NoResults_module.container }, restProps),
+    React.createElement(typography.Paragraph, { variant: "extra-small", color: "dark-reduced-opacity" }, children)
+  );
+};
+NoResults.displayName = "FilterMultiSelect.NoResults";
+
+exports.NoResults = NoResults;
+//# sourceMappingURL=NoResults.js.map

package/dist/cjs/packages/components/src/FilterMultiSelect/subcomponents/NoResults/NoResults.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"NoResults.js","sources":["../../../../../../../../src/FilterMultiSelect/subcomponents/NoResults/NoResults.tsx"],"sourcesContent":["import React, { HTMLAttributes } from \"react\"\nimport { Paragraph } from \"@kaizen/typography\"\nimport styles from \"./NoResults.module.scss\"\n\nexport type NoResultsProps = {\n  children: React.ReactNode\n} & HTMLAttributes<HTMLDivElement>\n\nexport const NoResults = ({\n  children,\n  ...restProps\n}: NoResultsProps): JSX.Element => (\n  <div className={styles.container} {...restProps}>\n    <Paragraph variant=\"extra-small\" color=\"dark-reduced-opacity\">\n      {children}\n    </Paragraph>\n  </div>\n)\n\nNoResults.displayName = \"FilterMultiSelect.NoResults\"\n"],"names":["__rest","styles","Paragraph"],"mappings":";;;;;;;AAQa,IAAA,SAAA,GAAY,SAAC,EAGT,EAAA;AAFf,EAAA,IAAA,QAAA,GAAQ,GAAA,QACL,EAAA,SAAA,GAASA,iBAAA,EAFY,EAAA,YAGzB,CAAA,CAAA;AAAkC,EAAA,OACjC;;yBAAK,SAAA,EAAWC,gBAAO,CAAA,SAAA,IAAe,SAAS,CAAA;AAAA,IAC7C,KAAA,CAAA,cAACC,oBAAS,EAAA,EAAC,SAAQ,aAAc,EAAA,KAAA,EAAM,sBACpC,EAAA,EAAA,QAAQ,CAAA;AAAA,GACC,CAAA;;AAIhB,SAAA,CAAU,WAAc,GAAA,6BAAA;;;;"}

package/dist/cjs/packages/components/src/FilterMultiSelect/subcomponents/NoResults/NoResults.module.scss.js

@@ -0,0 +1,6 @@
+'use strict';
+
+var styles = {"container":"NoResults-module_container__itPph"};
+
+module.exports = styles;
+//# sourceMappingURL=NoResults.module.scss.js.map

package/dist/cjs/packages/components/src/FilterMultiSelect/subcomponents/NoResults/NoResults.module.scss.js.map

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

package/dist/cjs/packages/components/src/FilterMultiSelect/subcomponents/Root/Root.js

@@ -0,0 +1,50 @@
+'use strict';
+
+var tslib_es6 = require('../../../../../../node_modules/tslib/tslib.es6.js');
+var React = require('react');
+var MenuTriggerProvider = require('../../context/MenuTriggerProvider/MenuTriggerProvider.js');
+var SelectionProvider = require('../../context/SelectionProvider/SelectionProvider.js');
+var MenuPopup = require('../MenuPopup/MenuPopup.js');
+
+var Root = function(_a) {
+  var trigger = _a.trigger, children = _a.children, isOpen = _a.isOpen, defaultOpen = _a.defaultOpen, onOpenChange = _a.onOpenChange, isLoading = _a.isLoading, loadingSkeleton = _a.loadingSkeleton, label = _a.label, items = _a.items, selectedKeys = _a.selectedKeys, defaultSelectedKeys = _a.defaultSelectedKeys, onSelectionChange = _a.onSelectionChange, _b = _a.selectionMode, selectionMode = _b === void 0 ? "multiple" : _b, onSearchInputChange = _a.onSearchInputChange;
+  var menuTriggerProps = { isOpen, defaultOpen, onOpenChange };
+  var menuPopupProps = { isLoading, loadingSkeleton };
+  var disabledKeys = new Set(items === null || items === void 0 ? void 0 : items.filter(function(item) {
+    return item.isDisabled === true;
+  }).map(function(disabledItem) {
+    return disabledItem.value;
+  }));
+  var selectionProps = {
+    label,
+    items,
+    selectedKeys,
+    defaultSelectedKeys,
+    onSelectionChange,
+    selectionMode,
+    disabledKeys,
+    onSearchInputChange
+  };
+  return React.createElement(
+    MenuTriggerProvider.MenuTriggerProvider,
+    tslib_es6.__assign({}, menuTriggerProps),
+    React.createElement(
+      "div",
+      null,
+      React.createElement(MenuTriggerProvider.MenuTriggerConsumer, null, trigger),
+      React.createElement(
+        MenuPopup.MenuPopup,
+        tslib_es6.__assign({}, menuPopupProps),
+        React.createElement(
+          SelectionProvider.SelectionProvider,
+          tslib_es6.__assign({}, selectionProps),
+          React.createElement(SelectionProvider.SelectionConsumer, null, children)
+        )
+      )
+    )
+  );
+};
+Root.displayName = "FilterMultiSelect";
+
+exports.Root = Root;
+//# sourceMappingURL=Root.js.map

package/dist/cjs/packages/components/src/FilterMultiSelect/subcomponents/Root/Root.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Root.js","sources":["../../../../../../../../src/FilterMultiSelect/subcomponents/Root/Root.tsx"],"sourcesContent":["import React from \"react\"\nimport { SelectionMode, Selection } from \"@react-types/shared\"\nimport {\n  MenuTriggerConsumer,\n  MenuTriggerProvider,\n  MenuTriggerProviderContextType,\n  MenuTriggerProviderProps,\n} from \"../../context/MenuTriggerProvider\"\nimport {\n  SelectionConsumer,\n  SelectionProvider,\n  SelectionProviderContextType,\n} from \"../../context/SelectionProvider\"\nimport { ItemType } from \"../../types\"\nimport { MenuPopup, MenuPopupProps } from \"../MenuPopup\"\n\ntype SelectionProps = {\n  label: string // provide A11y context for listbox\n  items: ItemType[]\n  selectedKeys?: Selection\n  defaultSelectedKeys?: Selection\n  onSelectionChange?: (keys: Selection) => void\n  selectionMode?: SelectionMode\n  onSearchInputChange?: (searchInput: string) => void\n}\n\nexport type RootProps = {\n  trigger: (value?: MenuTriggerProviderContextType) => React.ReactNode\n  children: (value?: SelectionProviderContextType) => React.ReactNode // the content of the menu\n} & Omit<MenuPopupProps, \"children\"> &\n  Omit<MenuTriggerProviderProps, \"children\"> &\n  SelectionProps\n\nexport const Root = ({\n  trigger,\n  children,\n  isOpen,\n  defaultOpen,\n  onOpenChange,\n  isLoading,\n  loadingSkeleton,\n  label,\n  items,\n  selectedKeys,\n  defaultSelectedKeys,\n  onSelectionChange,\n  selectionMode = \"multiple\",\n  onSearchInputChange,\n}: RootProps): JSX.Element => {\n  const menuTriggerProps = { isOpen, defaultOpen, onOpenChange }\n  const menuPopupProps = { isLoading, loadingSkeleton }\n  const disabledKeys: Selection = new Set(\n    items\n      ?.filter(item => item.isDisabled === true)\n      .map(disabledItem => disabledItem.value)\n  )\n  const selectionProps = {\n    label,\n    items,\n    selectedKeys,\n    defaultSelectedKeys,\n    onSelectionChange,\n    selectionMode,\n    disabledKeys,\n    onSearchInputChange,\n  }\n\n  return (\n    <MenuTriggerProvider {...menuTriggerProps}>\n      <div>\n        <MenuTriggerConsumer>{trigger}</MenuTriggerConsumer>\n        <MenuPopup {...menuPopupProps}>\n          <SelectionProvider {...selectionProps}>\n            <SelectionConsumer>{children}</SelectionConsumer>\n          </SelectionProvider>\n        </MenuPopup>\n      </div>\n    </MenuTriggerProvider>\n  )\n}\n\nRoot.displayName = \"FilterMultiSelect\"\n"],"names":["MenuTriggerProvider","__assign","MenuTriggerConsumer","MenuPopup","SelectionProvider","SelectionConsumer"],"mappings":";;;;;;;;AAiCa,IAAA,IAAA,GAAO,SAAC,EAeT,EAAA;AAdV,EAAA,IAAA,OAAA,aACA,EAAA,QAAA,cACA,EAAA,MAAA,YACA,EAAA,WAAA,iBACA,EAAA,YAAA,kBACA,EAAA,SAAA,eACA,EAAA,eAAA,qBACA,EAAA,KAAA,WACA,EAAA,KAAA,WACA,EAAA,YAAA,kBACA,EAAA,mBAAA,yBACA,EAAA,iBAAA,uBACA,EAAA,EAAA,GAAA,GAAA,aAAA,EAAA,aAAA,GAAa,OAAA,KAAG,CAAA,GAAA,UAAA,GAAU,EAC1B,EAAA,mBAAA,GAAmB,EAAA,CAAA,mBAAA,CAAA;AAEnB,EAAA,IAAM,gBAAmB,GAAA,EAAE,MAAQ,EAAA,WAAA,EAAa,YAAY,EAAA,CAAA;AAC5D,EAAM,IAAA,cAAA,GAAiB,EAAE,SAAA,EAAW,eAAe,EAAA,CAAA;AACnD,EAAM,IAAA,YAAA,GAA0B,IAAI,GAAA,CAClC,KAAA,KAAA,IAAA,IAAA,KAAA,KAAA,KAAA,CAAA,GAAA,KAAA,CAAA,GAAA,KAAA,CACI,MAAO,CAAA,SAAA,IAAI,EAAA;AAAI,IAAA,OAAA,KAAK,UAAe,KAAA,IAAA,CAAA;AAAA,GAAI,CAAA,CACxC,GAAI,CAAA,SAAA,YAAgB,EAAA;AAAA,IAAA,OAAA,YAAa,CAAA,KAAA,CAAA;AAAA,GAAK,CAAC,CAAA,CAAA;AAE5C,EAAA,IAAM,cAAiB,GAAA;AAAA,IACrB,KAAA;AAAA,IACA,KAAA;AAAA,IACA,YAAA;AAAA,IACA,mBAAA;AAAA,IACA,iBAAA;AAAA,IACA,aAAA;AAAA,IACA,YAAA;AAAA,IACA,mBAAA;AAAA;AAGF,EAAA,OACE,KAAA,CAAA,aAAA;AAAA,IAACA,uCAAA;AAAA,IAAmBC,kBAAA,CAAA,EAAA,EAAK,gBAAgB,CAAA;AAAA,IACvC,KAAA,CAAA,aAAA;AAAA,MAAA,KAAA;AAAA,MAAA,IAAA;AAAA,MACE,KAAC,CAAA,aAAA,CAAAC,uCAAqB,EAAA,IAAA,EAAA,OAAO,CAAA;AAAA,MAC7B,KAAC,CAAA,aAAA;AAAA,QAAAC,mBAAA;AAAA,+BAAc,cAAc,CAAA;AAAA,QAC3B,KAAC,CAAA,aAAA;AAAA,UAAAC,mCAAA;AAAA,iCAAsB,cAAc,CAAA;AAAA,UACnC,KAAC,CAAA,aAAA,CAAAC,2CAAmB,QAAQ,CAAA;AAAA,SAAqB;AAAA,OAC/B;AAAA,KACV;AAAA,GACR,CAAA;AAGZ,EAAA;AAEA,IAAA,CAAK,WAAc,GAAA,mBAAA;;;;"}