@cloudscape-design/components 3.0.0

package/select/utils/use-announcement.d.ts

@@ -0,0 +1,20 @@
+import { OptionDefinition, OptionGroup } from '../../internal/components/option/interfaces';
+import { SelectProps } from '../interfaces';
+interface OptionHolder {
+    option?: OptionDefinition | OptionGroup;
+}
+/**
+ * The hook produces the live region string to be announced when an option is highlighted.
+ * This is a workaround to account for the issues with assistive technologies.
+ *
+ * If the testing reveals no issues with the native announcements the live-region can be removed.
+ */
+export declare function useAnnouncement<Option extends OptionHolder>({ announceSelected, highlightedOption, getParent, selectedAriaLabel, renderHighlightedAriaLive, }: {
+    announceSelected: boolean;
+    highlightedOption?: Option;
+    getParent: (option: Option) => undefined | OptionGroup;
+    selectedAriaLabel?: string;
+    renderHighlightedAriaLive?: SelectProps.ContainingOptionAndGroupString;
+}): string;
+export {};
+//# sourceMappingURL=use-announcement.d.ts.map

package/select/utils/use-announcement.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-announcement.d.ts","sourceRoot":"","sources":["../../../../src/select/utils/use-announcement.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,gBAAgB,EAAE,WAAW,EAAE,MAAM,6CAA6C,CAAC;AAC5F,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;AAI5C,UAAU,YAAY;IACpB,MAAM,CAAC,EAAE,gBAAgB,GAAG,WAAW,CAAC;CACzC;AAED;;;;;GAKG;AACH,wBAAgB,eAAe,CAAC,MAAM,SAAS,YAAY,EAAE,EAC3D,gBAAgB,EAChB,iBAAiB,EACjB,SAAS,EACT,iBAAiB,EACjB,yBAAyB,GAC1B,EAAE;IACD,gBAAgB,EAAE,OAAO,CAAC;IAC1B,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAC3B,SAAS,EAAE,CAAC,MAAM,EAAE,MAAM,KAAK,SAAS,GAAG,WAAW,CAAC;IACvD,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAC3B,yBAAyB,CAAC,EAAE,WAAW,CAAC,8BAA8B,CAAC;CACxE,UA+BA"}

package/select/utils/use-announcement.js

@@ -0,0 +1,37 @@
+import { useEffect, useRef } from 'react';
+import defaultOptionDescription from '../../internal/components/option/option-announcer';
+/**
+ * The hook produces the live region string to be announced when an option is highlighted.
+ * This is a workaround to account for the issues with assistive technologies.
+ *
+ * If the testing reveals no issues with the native announcements the live-region can be removed.
+ */
+export function useAnnouncement(_a) {
+    var announceSelected = _a.announceSelected, highlightedOption = _a.highlightedOption, getParent = _a.getParent, selectedAriaLabel = _a.selectedAriaLabel, renderHighlightedAriaLive = _a.renderHighlightedAriaLive;
+    var prevAnnouncedGroup = useRef(undefined);
+    // Record previously announced group with a delay to account for possible re-renders of the hook.
+    useEffect(function () {
+        if (highlightedOption) {
+            var frameId_1 = requestAnimationFrame(function () {
+                prevAnnouncedGroup.current = getParent(highlightedOption);
+            });
+            return function () { return cancelAnimationFrame(frameId_1); };
+        }
+    });
+    if (!highlightedOption) {
+        return '';
+    }
+    var option = highlightedOption.option;
+    var parent = getParent(highlightedOption);
+    // Only announce parent group if it wasn't announced with previous option.
+    var group = parent && parent !== prevAnnouncedGroup.current ? parent : undefined;
+    // Use custom renderer if provided.
+    if (renderHighlightedAriaLive) {
+        return renderHighlightedAriaLive(option, group);
+    }
+    // Use default renderer with selected ARIA label if defined and relevant.
+    var selectedPrefix = announceSelected && selectedAriaLabel ? selectedAriaLabel : '';
+    var defaultDescription = defaultOptionDescription(option, group);
+    return [selectedPrefix, defaultDescription].filter(Boolean).join(' ');
+}
+//# sourceMappingURL=use-announcement.js.map

package/select/utils/use-announcement.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-announcement.js","sourceRoot":"","sources":["../../../../src/select/utils/use-announcement.ts"],"names":[],"mappings":"AAIA,OAAO,EAAE,SAAS,EAAE,MAAM,EAAE,MAAM,OAAO,CAAC;AAC1C,OAAO,wBAAwB,MAAM,mDAAmD,CAAC;AAMzF;;;;;GAKG;AACH,MAAM,UAAU,eAAe,CAA8B,EAY5D;QAXC,gBAAgB,sBAAA,EAChB,iBAAiB,uBAAA,EACjB,SAAS,eAAA,EACT,iBAAiB,uBAAA,EACjB,yBAAyB,+BAAA;IAQzB,IAAM,kBAAkB,GAAG,MAAM,CAA0B,SAAS,CAAC,CAAC;IAEtE,iGAAiG;IACjG,SAAS,CAAC;QACR,IAAI,iBAAiB,EAAE;YACrB,IAAM,SAAO,GAAG,qBAAqB,CAAC;gBACpC,kBAAkB,CAAC,OAAO,GAAG,SAAS,CAAC,iBAAiB,CAAC,CAAC;YAC5D,CAAC,CAAC,CAAC;YACH,OAAO,cAAM,OAAA,oBAAoB,CAAC,SAAO,CAAC,EAA7B,CAA6B,CAAC;SAC5C;IACH,CAAC,CAAC,CAAC;IAEH,IAAI,CAAC,iBAAiB,EAAE;QACtB,OAAO,EAAE,CAAC;KACX;IAED,IAAM,MAAM,GAAG,iBAAiB,CAAC,MAA0B,CAAC;IAC5D,IAAM,MAAM,GAAG,SAAS,CAAC,iBAAiB,CAAC,CAAC;IAC5C,0EAA0E;IAC1E,IAAM,KAAK,GAAG,MAAM,IAAI,MAAM,KAAK,kBAAkB,CAAC,OAAO,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,SAAS,CAAC;IAEnF,mCAAmC;IACnC,IAAI,yBAAyB,EAAE;QAC7B,OAAO,yBAAyB,CAAC,MAAM,EAAE,KAAK,CAAC,CAAC;KACjD;IAED,yEAAyE;IACzE,IAAM,cAAc,GAAG,gBAAgB,IAAI,iBAAiB,CAAC,CAAC,CAAC,iBAAiB,CAAC,CAAC,CAAC,EAAE,CAAC;IACtF,IAAM,kBAAkB,GAAG,wBAAwB,CAAC,MAAM,EAAE,KAAK,CAAC,CAAC;IACnE,OAAO,CAAC,cAAc,EAAE,kBAAkB,CAAC,CAAC,MAAM,CAAC,OAAO,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC;AACxE,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport { OptionDefinition, OptionGroup } from '../../internal/components/option/interfaces';\nimport { SelectProps } from '../interfaces';\nimport { useEffect, useRef } from 'react';\nimport defaultOptionDescription from '../../internal/components/option/option-announcer';\n\ninterface OptionHolder {\n  option?: OptionDefinition | OptionGroup;\n}\n\n/**\n * The hook produces the live region string to be announced when an option is highlighted.\n * This is a workaround to account for the issues with assistive technologies.\n *\n * If the testing reveals no issues with the native announcements the live-region can be removed.\n */\nexport function useAnnouncement<Option extends OptionHolder>({\n  announceSelected,\n  highlightedOption,\n  getParent,\n  selectedAriaLabel,\n  renderHighlightedAriaLive,\n}: {\n  announceSelected: boolean;\n  highlightedOption?: Option;\n  getParent: (option: Option) => undefined | OptionGroup;\n  selectedAriaLabel?: string;\n  renderHighlightedAriaLive?: SelectProps.ContainingOptionAndGroupString;\n}) {\n  const prevAnnouncedGroup = useRef<OptionGroup | undefined>(undefined);\n\n  // Record previously announced group with a delay to account for possible re-renders of the hook.\n  useEffect(() => {\n    if (highlightedOption) {\n      const frameId = requestAnimationFrame(() => {\n        prevAnnouncedGroup.current = getParent(highlightedOption);\n      });\n      return () => cancelAnimationFrame(frameId);\n    }\n  });\n\n  if (!highlightedOption) {\n    return '';\n  }\n\n  const option = highlightedOption.option as OptionDefinition;\n  const parent = getParent(highlightedOption);\n  // Only announce parent group if it wasn't announced with previous option.\n  const group = parent && parent !== prevAnnouncedGroup.current ? parent : undefined;\n\n  // Use custom renderer if provided.\n  if (renderHighlightedAriaLive) {\n    return renderHighlightedAriaLive(option, group);\n  }\n\n  // Use default renderer with selected ARIA label if defined and relevant.\n  const selectedPrefix = announceSelected && selectedAriaLabel ? selectedAriaLabel : '';\n  const defaultDescription = defaultOptionDescription(option, group);\n  return [selectedPrefix, defaultDescription].filter(Boolean).join(' ');\n}\n"]}

package/select/utils/use-load-items.d.ts

@@ -0,0 +1,15 @@
+import { SelectProps } from '../interfaces';
+import { OptionDefinition, OptionGroup } from '../../internal/components/option/interfaces';
+import { DropdownStatusProps } from '../../internal/components/dropdown-status';
+interface UseLoadItemsProps {
+    onLoadItems: SelectProps['onLoadItems'];
+    options: ReadonlyArray<OptionDefinition | OptionGroup>;
+    statusType: DropdownStatusProps.StatusType;
+}
+export declare const useLoadItems: ({ onLoadItems, options, statusType }: UseLoadItemsProps) => {
+    fireLoadItems: (filteringText: string) => void;
+    handleLoadMore: () => void;
+    handleRecoveryClick: () => void;
+};
+export {};
+//# sourceMappingURL=use-load-items.d.ts.map

package/select/utils/use-load-items.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-load-items.d.ts","sourceRoot":"","sources":["../../../../src/select/utils/use-load-items.ts"],"names":[],"mappings":"AAIA,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;AAC5C,OAAO,EAAE,gBAAgB,EAAE,WAAW,EAAE,MAAM,6CAA6C,CAAC;AAC5F,OAAO,EAAE,mBAAmB,EAAE,MAAM,2CAA2C,CAAC;AAEhF,UAAU,iBAAiB;IACzB,WAAW,EAAE,WAAW,CAAC,aAAa,CAAC,CAAC;IACxC,OAAO,EAAE,aAAa,CAAC,gBAAgB,GAAG,WAAW,CAAC,CAAC;IACvD,UAAU,EAAE,mBAAmB,CAAC,UAAU,CAAC;CAC5C;AAED,eAAO,MAAM,YAAY,yCAA0C,iBAAiB;mCAG5C,MAAM;;;CA8B7C,CAAC"}

package/select/utils/use-load-items.js

@@ -0,0 +1,37 @@
+// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
+// SPDX-License-Identifier: Apache-2.0
+import { useRef } from 'react';
+import { fireNonCancelableEvent } from '../../internal/events';
+export var useLoadItems = function (_a) {
+    var onLoadItems = _a.onLoadItems, options = _a.options, statusType = _a.statusType;
+    var prevFilteringText = useRef(undefined);
+    var fireLoadItems = function (filteringText) {
+        if (prevFilteringText.current === filteringText) {
+            return;
+        }
+        prevFilteringText.current = filteringText;
+        fireNonCancelableEvent(onLoadItems, { filteringText: filteringText, firstPage: true, samePage: false });
+    };
+    var handleLoadMore = function () {
+        var firstPage = options.length === 0;
+        statusType === 'pending' &&
+            fireNonCancelableEvent(onLoadItems, {
+                firstPage: firstPage,
+                samePage: false,
+                filteringText: prevFilteringText.current || ''
+            });
+    };
+    var handleRecoveryClick = function () {
+        return fireNonCancelableEvent(onLoadItems, {
+            firstPage: false,
+            samePage: true,
+            filteringText: prevFilteringText.current || ''
+        });
+    };
+    return {
+        fireLoadItems: fireLoadItems,
+        handleLoadMore: handleLoadMore,
+        handleRecoveryClick: handleRecoveryClick
+    };
+};
+//# sourceMappingURL=use-load-items.js.map

package/select/utils/use-load-items.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-load-items.js","sourceRoot":"","sources":["../../../../src/select/utils/use-load-items.ts"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,EAAE,MAAM,EAAE,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAE,sBAAsB,EAAE,MAAM,uBAAuB,CAAC;AAW/D,MAAM,CAAC,IAAM,YAAY,GAAG,UAAC,EAAuD;QAArD,WAAW,iBAAA,EAAE,OAAO,aAAA,EAAE,UAAU,gBAAA;IAC7D,IAAM,iBAAiB,GAAG,MAAM,CAAqB,SAAS,CAAC,CAAC;IAEhE,IAAM,aAAa,GAAG,UAAC,aAAqB;QAC1C,IAAI,iBAAiB,CAAC,OAAO,KAAK,aAAa,EAAE;YAC/C,OAAO;SACR;QACD,iBAAiB,CAAC,OAAO,GAAG,aAAa,CAAC;QAC1C,sBAAsB,CAAC,WAAW,EAAE,EAAE,aAAa,eAAA,EAAE,SAAS,EAAE,IAAI,EAAE,QAAQ,EAAE,KAAK,EAAE,CAAC,CAAC;IAC3F,CAAC,CAAC;IAEF,IAAM,cAAc,GAAG;QACrB,IAAM,SAAS,GAAG,OAAO,CAAC,MAAM,KAAK,CAAC,CAAC;QACvC,UAAU,KAAK,SAAS;YACtB,sBAAsB,CAAC,WAAW,EAAE;gBAClC,SAAS,WAAA;gBACT,QAAQ,EAAE,KAAK;gBACf,aAAa,EAAE,iBAAiB,CAAC,OAAO,IAAI,EAAE;aAC/C,CAAC,CAAC;IACP,CAAC,CAAC;IAEF,IAAM,mBAAmB,GAAG;QAC1B,OAAA,sBAAsB,CAAC,WAAW,EAAE;YAClC,SAAS,EAAE,KAAK;YAChB,QAAQ,EAAE,IAAI;YACd,aAAa,EAAE,iBAAiB,CAAC,OAAO,IAAI,EAAE;SAC/C,CAAC;IAJF,CAIE,CAAC;IAEL,OAAO;QACL,aAAa,eAAA;QACb,cAAc,gBAAA;QACd,mBAAmB,qBAAA;KACpB,CAAC;AACJ,CAAC,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport { useRef } from 'react';\nimport { fireNonCancelableEvent } from '../../internal/events';\nimport { SelectProps } from '../interfaces';\nimport { OptionDefinition, OptionGroup } from '../../internal/components/option/interfaces';\nimport { DropdownStatusProps } from '../../internal/components/dropdown-status';\n\ninterface UseLoadItemsProps {\n  onLoadItems: SelectProps['onLoadItems'];\n  options: ReadonlyArray<OptionDefinition | OptionGroup>;\n  statusType: DropdownStatusProps.StatusType;\n}\n\nexport const useLoadItems = ({ onLoadItems, options, statusType }: UseLoadItemsProps) => {\n  const prevFilteringText = useRef<string | undefined>(undefined);\n\n  const fireLoadItems = (filteringText: string) => {\n    if (prevFilteringText.current === filteringText) {\n      return;\n    }\n    prevFilteringText.current = filteringText;\n    fireNonCancelableEvent(onLoadItems, { filteringText, firstPage: true, samePage: false });\n  };\n\n  const handleLoadMore = () => {\n    const firstPage = options.length === 0;\n    statusType === 'pending' &&\n      fireNonCancelableEvent(onLoadItems, {\n        firstPage,\n        samePage: false,\n        filteringText: prevFilteringText.current || '',\n      });\n  };\n\n  const handleRecoveryClick = () =>\n    fireNonCancelableEvent(onLoadItems, {\n      firstPage: false,\n      samePage: true,\n      filteringText: prevFilteringText.current || '',\n    });\n\n  return {\n    fireLoadItems,\n    handleLoadMore,\n    handleRecoveryClick,\n  };\n};\n"]}

package/select/utils/use-native-search.d.ts

@@ -0,0 +1,15 @@
+import React from 'react';
+import { DropdownOption, OptionDefinition } from '../../internal/components/option/interfaces';
+export declare const isChar: (keyCode: number) => boolean;
+export declare const isRepeatedChar: (str: string) => boolean;
+interface UseNativeSearchProps {
+    isEnabled: boolean;
+    isKeyboard: React.MutableRefObject<boolean>;
+    options: ReadonlyArray<DropdownOption>;
+    highlightOption: (option: DropdownOption) => void;
+    highlightedOption: OptionDefinition | undefined | null;
+    useInteractiveGroups?: boolean;
+}
+export declare function useNativeSearch({ isEnabled, options, isKeyboard, highlightOption, highlightedOption, useInteractiveGroups, }: UseNativeSearchProps): (event: React.KeyboardEvent) => void;
+export {};
+//# sourceMappingURL=use-native-search.d.ts.map

package/select/utils/use-native-search.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-native-search.d.ts","sourceRoot":"","sources":["../../../../src/select/utils/use-native-search.ts"],"names":[],"mappings":"AAEA,OAAO,KAAiB,MAAM,OAAO,CAAC;AAQtC,OAAO,EAAE,cAAc,EAAE,gBAAgB,EAAe,MAAM,6CAA6C,CAAC;AAG5G,eAAO,MAAM,MAAM,YAAa,MAAM,KAAG,OAExC,CAAC;AAEF,eAAO,MAAM,cAAc,QAAS,MAAM,YAA2C,CAAC;AAEtF,UAAU,oBAAoB;IAC5B,SAAS,EAAE,OAAO,CAAC;IACnB,UAAU,EAAE,KAAK,CAAC,gBAAgB,CAAC,OAAO,CAAC,CAAC;IAC5C,OAAO,EAAE,aAAa,CAAC,cAAc,CAAC,CAAC;IACvC,eAAe,EAAE,CAAC,MAAM,EAAE,cAAc,KAAK,IAAI,CAAC;IAClD,iBAAiB,EAAE,gBAAgB,GAAG,SAAS,GAAG,IAAI,CAAC;IACvD,oBAAoB,CAAC,EAAE,OAAO,CAAC;CAChC;AA6CD,wBAAgB,eAAe,CAAC,EAC9B,SAAS,EACT,OAAO,EACP,UAAU,EACV,eAAe,EACf,iBAAiB,EACjB,oBAAoB,GACrB,EAAE,oBAAoB,WAKN,mBAAmB,UAmBnC"}

package/select/utils/use-native-search.js

@@ -0,0 +1,72 @@
+// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
+// SPDX-License-Identifier: Apache-2.0
+import { useRef } from 'react';
+import { KeyCode } from '../../internal/keycode';
+import { filterOptions, isInteractive, isGroupInteractive, isGroup, } from '../../internal/components/option/utils/filter-options';
+import { useDebounceCallback } from '../../internal/hooks/use-debounce-callback';
+export var isChar = function (keyCode) {
+    return [0, KeyCode.enter, KeyCode.space, KeyCode.tab].indexOf(keyCode) === -1;
+};
+export var isRepeatedChar = function (str) { return str.split('').every(function (c) { return c === str[0]; }); };
+function findMatchingOption(options, searchText, currentHighlight, useInteractiveGroups) {
+    var interactivityCheck = useInteractiveGroups ? isGroupInteractive : isInteractive;
+    var filter = function (searchText) {
+        return filterOptions(options, searchText, true).filter(function (option) { return interactivityCheck(option); });
+    };
+    var matchingOptions = filter(searchText);
+    if (matchingOptions.length === 1) {
+        return matchingOptions[0];
+    }
+    // Hit the same char over and over, we assume they want to cycle through
+    if (currentHighlight && searchText.length > 1 && isRepeatedChar(searchText)) {
+        var matchingOptions_1 = filter(searchText[0]);
+        if (matchingOptions_1.length > 0) {
+            //handling OptionGroups when useInteractiveGroups is set
+            var active = isGroup(currentHighlight)
+                ? matchingOptions_1.map(function (_a) {
+                    var option = _a.option;
+                    return option;
+                }).indexOf(currentHighlight)
+                : matchingOptions_1
+                    .map(function (_a) {
+                    var option = _a.option;
+                    return option.value;
+                })
+                    .indexOf(currentHighlight.value);
+            // Pick the next thing (if something with this prefix wasn't selected
+            // we'll end up with the first option)
+            active += 1;
+            active = active % matchingOptions_1.length;
+            return matchingOptions_1[active];
+        }
+    }
+    // We have multiple things that start with this prefix.  Based on the
+    // behavior of native select, this is considered after the repeated case
+    if (matchingOptions.length > 0) {
+        return matchingOptions[0];
+    }
+    return null;
+}
+export function useNativeSearch(_a) {
+    var isEnabled = _a.isEnabled, options = _a.options, isKeyboard = _a.isKeyboard, highlightOption = _a.highlightOption, highlightedOption = _a.highlightedOption, useInteractiveGroups = _a.useInteractiveGroups;
+    var value = useRef('');
+    var delayedResetValue = useDebounceCallback(function () { return (value.current = ''); }, 500);
+    return function (event) {
+        isKeyboard.current = true;
+        if (!isEnabled) {
+            return;
+        }
+        var charCode = event.charCode;
+        if (!isChar(charCode)) {
+            return;
+        }
+        delayedResetValue();
+        var newValue = value.current + String.fromCharCode(charCode);
+        value.current = newValue;
+        var nextHighlight = findMatchingOption(options, newValue, highlightedOption, useInteractiveGroups);
+        if (nextHighlight) {
+            highlightOption(nextHighlight);
+        }
+    };
+}
+//# sourceMappingURL=use-native-search.js.map

package/select/utils/use-native-search.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-native-search.js","sourceRoot":"","sources":["../../../../src/select/utils/use-native-search.ts"],"names":[],"mappings":"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","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React, { useRef } from 'react';\nimport { KeyCode } from '../../internal/keycode';\nimport {\n  filterOptions,\n  isInteractive,\n  isGroupInteractive,\n  isGroup,\n} from '../../internal/components/option/utils/filter-options';\nimport { DropdownOption, OptionDefinition, OptionGroup } from '../../internal/components/option/interfaces';\nimport { useDebounceCallback } from '../../internal/hooks/use-debounce-callback';\n\nexport const isChar = (keyCode: number): boolean => {\n  return [0, KeyCode.enter, KeyCode.space, KeyCode.tab].indexOf(keyCode) === -1;\n};\n\nexport const isRepeatedChar = (str: string) => str.split('').every(c => c === str[0]);\n\ninterface UseNativeSearchProps {\n  isEnabled: boolean;\n  isKeyboard: React.MutableRefObject<boolean>;\n  options: ReadonlyArray<DropdownOption>;\n  highlightOption: (option: DropdownOption) => void;\n  highlightedOption: OptionDefinition | undefined | null;\n  useInteractiveGroups?: boolean;\n}\n\nfunction findMatchingOption(\n  options: ReadonlyArray<DropdownOption>,\n  searchText: string,\n  currentHighlight: OptionDefinition | OptionGroup | undefined | null,\n  useInteractiveGroups?: boolean\n) {\n  const interactivityCheck = useInteractiveGroups ? isGroupInteractive : isInteractive;\n  const filter = (searchText: string) =>\n    filterOptions(options, searchText, true).filter(option => interactivityCheck(option));\n  const matchingOptions = filter(searchText);\n\n  if (matchingOptions.length === 1) {\n    return matchingOptions[0];\n  }\n\n  // Hit the same char over and over, we assume they want to cycle through\n  if (currentHighlight && searchText.length > 1 && isRepeatedChar(searchText)) {\n    const matchingOptions = filter(searchText[0]);\n\n    if (matchingOptions.length > 0) {\n      //handling OptionGroups when useInteractiveGroups is set\n      let active: number = isGroup(currentHighlight)\n        ? matchingOptions.map(({ option }) => option).indexOf(currentHighlight)\n        : matchingOptions\n            .map(({ option }) => (option as OptionDefinition).value)\n            .indexOf((currentHighlight as OptionDefinition).value);\n\n      // Pick the next thing (if something with this prefix wasn't selected\n      // we'll end up with the first option)\n      active += 1;\n      active = active % matchingOptions.length;\n      return matchingOptions[active];\n    }\n  }\n\n  // We have multiple things that start with this prefix.  Based on the\n  // behavior of native select, this is considered after the repeated case\n  if (matchingOptions.length > 0) {\n    return matchingOptions[0];\n  }\n  return null;\n}\n\nexport function useNativeSearch({\n  isEnabled,\n  options,\n  isKeyboard,\n  highlightOption,\n  highlightedOption,\n  useInteractiveGroups,\n}: UseNativeSearchProps) {\n  const value = useRef('');\n\n  const delayedResetValue = useDebounceCallback(() => (value.current = ''), 500);\n\n  return (event: React.KeyboardEvent) => {\n    isKeyboard.current = true;\n    if (!isEnabled) {\n      return;\n    }\n\n    const { charCode } = event;\n    if (!isChar(charCode)) {\n      return;\n    }\n    delayedResetValue();\n    const newValue = value.current + String.fromCharCode(charCode);\n    value.current = newValue;\n\n    const nextHighlight = findMatchingOption(options, newValue, highlightedOption, useInteractiveGroups);\n    if (nextHighlight) {\n      highlightOption(nextHighlight);\n    }\n  };\n}\n"]}

package/select/utils/use-select.d.ts

@@ -0,0 +1,49 @@
+import React, { RefObject } from 'react';
+import { DropdownOption, OptionDefinition } from '../../internal/components/option/interfaces';
+import { OptionsListProps } from '../../internal/components/options-list';
+import { FilterProps } from '../parts/filter';
+import { ItemProps } from '../parts/item';
+import { BaseKeyDetail } from '../../internal/events';
+import { CancelableEventHandler, NonCancelableEventHandler } from '../../internal/events/index';
+export declare type MenuProps = Omit<OptionsListProps, 'children'> & {
+    ref: React.RefObject<HTMLUListElement>;
+};
+export declare type GetOptionProps = (option: DropdownOption, index: number) => ItemProps;
+interface UseSelectProps {
+    selectedOptions: ReadonlyArray<OptionDefinition>;
+    updateSelectedOption: (option: OptionDefinition) => void;
+    options: ReadonlyArray<DropdownOption>;
+    filteringType: string;
+    keepOpen?: boolean;
+    onBlur?: CancelableEventHandler;
+    onFocus?: CancelableEventHandler;
+    externalRef: React.Ref<any>;
+    fireLoadItems: (filteringText: string) => void;
+    setFilteringValue: (filteringText: string) => void;
+    useInteractiveGroups?: boolean;
+}
+export interface SelectTriggerProps {
+    ref: RefObject<HTMLButtonElement>;
+    onMouseDown?: (event: CustomEvent) => void;
+    onKeyDown?: (event: CustomEvent<BaseKeyDetail>) => void;
+    ariaLabelledby?: string;
+    onFocus: NonCancelableEventHandler;
+    onBlur: NonCancelableEventHandler<{
+        relatedTarget: Node | null;
+    }>;
+}
+export declare function useSelect({ selectedOptions, updateSelectedOption, options, filteringType, onBlur, onFocus, externalRef, keepOpen, fireLoadItems, setFilteringValue, useInteractiveGroups, }: UseSelectProps): {
+    isOpen: boolean;
+    highlightedOption: DropdownOption | undefined;
+    highlightedIndex: number;
+    getTriggerProps: (disabled?: boolean) => SelectTriggerProps;
+    getMenuProps: () => MenuProps;
+    getFilterProps: () => Partial<FilterProps>;
+    getOptionProps: (option: DropdownOption, index: number) => any;
+    isKeyboard: React.MutableRefObject<boolean>;
+    highlightOption: (option: DropdownOption | undefined) => void;
+    selectOption: (option?: DropdownOption | undefined) => void;
+    announceSelected: boolean;
+};
+export {};
+//# sourceMappingURL=use-select.d.ts.map

package/select/utils/use-select.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-select.d.ts","sourceRoot":"","sources":["../../../../src/select/utils/use-select.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AACzC,OAAO,EAAE,cAAc,EAAE,gBAAgB,EAAe,MAAM,6CAA6C,CAAC;AAS5G,OAAO,EAAE,gBAAgB,EAAE,MAAM,wCAAwC,CAAC;AAC1E,OAAO,EAAE,WAAW,EAAE,MAAM,iBAAiB,CAAC;AAC9C,OAAO,EAAE,SAAS,EAAE,MAAM,eAAe,CAAC;AAE1C,OAAO,EAAE,aAAa,EAAE,MAAM,uBAAuB,CAAC;AACtD,OAAO,EAAE,sBAAsB,EAAuB,yBAAyB,EAAE,MAAM,6BAA6B,CAAC;AAGrH,oBAAY,SAAS,GAAG,IAAI,CAAC,gBAAgB,EAAE,UAAU,CAAC,GAAG;IAAE,GAAG,EAAE,KAAK,CAAC,SAAS,CAAC,gBAAgB,CAAC,CAAA;CAAE,CAAC;AACxG,oBAAY,cAAc,GAAG,CAAC,MAAM,EAAE,cAAc,EAAE,KAAK,EAAE,MAAM,KAAK,SAAS,CAAC;AAElF,UAAU,cAAc;IACtB,eAAe,EAAE,aAAa,CAAC,gBAAgB,CAAC,CAAC;IACjD,oBAAoB,EAAE,CAAC,MAAM,EAAE,gBAAgB,KAAK,IAAI,CAAC;IACzD,OAAO,EAAE,aAAa,CAAC,cAAc,CAAC,CAAC;IACvC,aAAa,EAAE,MAAM,CAAC;IACtB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,MAAM,CAAC,EAAE,sBAAsB,CAAC;IAChC,OAAO,CAAC,EAAE,sBAAsB,CAAC;IACjC,WAAW,EAAE,KAAK,CAAC,GAAG,CAAC,GAAG,CAAC,CAAC;IAC5B,aAAa,EAAE,CAAC,aAAa,EAAE,MAAM,KAAK,IAAI,CAAC;IAC/C,iBAAiB,EAAE,CAAC,aAAa,EAAE,MAAM,KAAK,IAAI,CAAC;IACnD,oBAAoB,CAAC,EAAE,OAAO,CAAC;CAChC;AAED,MAAM,WAAW,kBAAkB;IACjC,GAAG,EAAE,SAAS,CAAC,iBAAiB,CAAC,CAAC;IAClC,WAAW,CAAC,EAAE,CAAC,KAAK,EAAE,WAAW,KAAK,IAAI,CAAC;IAC3C,SAAS,CAAC,EAAE,CAAC,KAAK,EAAE,WAAW,CAAC,aAAa,CAAC,KAAK,IAAI,CAAC;IACxD,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,OAAO,EAAE,yBAAyB,CAAC;IACnC,MAAM,EAAE,yBAAyB,CAAC;QAAE,aAAa,EAAE,IAAI,GAAG,IAAI,CAAA;KAAE,CAAC,CAAC;CACnE;AAED,wBAAgB,SAAS,CAAC,EACxB,eAAe,EACf,oBAAoB,EACpB,OAAO,EACP,aAAa,EACb,MAAM,EACN,OAAO,EACP,WAAW,EACX,QAAQ,EACR,aAAa,EACb,iBAAiB,EACjB,oBAA4B,GAC7B,EAAE,cAAc;;;;;;0BAuHY,QAAQ,WAAW,CAAC;6BAgEf,cAAc,SAAS,MAAM;;;;;EA4D9D"}

package/select/utils/use-select.js

@@ -0,0 +1,236 @@
+import { isInteractive, isGroupInteractive, isGroup } from '../../internal/components/option/utils/filter-options';
+import { useEffect, useRef } from 'react';
+import { createHighlightedOptionHook } from '../../internal/components/options-list/utils/use-highlight-option';
+import { useOpenState } from '../../internal/components/options-list/utils/use-open-state';
+import { useMenuKeyboard, useTriggerKeyboard } from '../../internal/components/options-list/utils/use-keyboard';
+import { useIds, getOptionId } from '../../internal/components/options-list/utils/use-ids';
+import { connectOptionsByValue } from './connect-options';
+import useForwardFocus from '../../internal/hooks/forward-focus';
+import { usePrevious } from '../../internal/hooks/use-previous';
+import { fireCancelableEvent } from '../../internal/events/index';
+import { containsOrEqual } from '../../internal/utils/dom';
+export function useSelect(_a) {
+    var selectedOptions = _a.selectedOptions, updateSelectedOption = _a.updateSelectedOption, options = _a.options, filteringType = _a.filteringType, onBlur = _a.onBlur, onFocus = _a.onFocus, externalRef = _a.externalRef, keepOpen = _a.keepOpen, fireLoadItems = _a.fireLoadItems, setFilteringValue = _a.setFilteringValue, _b = _a.useInteractiveGroups, useInteractiveGroups = _b === void 0 ? false : _b;
+    var interactivityCheck = useInteractiveGroups ? isGroupInteractive : isInteractive;
+    var isHighlightable = function (option) { return !!option && (useInteractiveGroups || option.type !== 'parent'); };
+    var useHighlightedOption = createHighlightedOptionHook({ isHighlightable: isHighlightable });
+    var filterRef = useRef(null);
+    var triggerRef = useRef(null);
+    var menuRef = useRef(null);
+    var hasFilter = filteringType !== 'none';
+    var activeRef = hasFilter ? filterRef : menuRef;
+    var isKeyboard = useRef(false);
+    var isSelectingUsingSpace = useRef(false);
+    var __selectedOptions = connectOptionsByValue(options, selectedOptions);
+    var __selectedValuesSet = selectedOptions.reduce(function (selectedValuesSet, item) {
+        if (item.value) {
+            selectedValuesSet.add(item.value);
+        }
+        return selectedValuesSet;
+    }, new Set());
+    var _c = useHighlightedOption(options), highlightedOption = _c.highlightedOption, highlightedIndex = _c.highlightedIndex, moveHighlight = _c.moveHighlight, resetHighlight = _c.resetHighlight, setHighlightedIndex = _c.setHighlightedIndex, highlightOption = _c.highlightOption, goHome = _c.goHome, goEnd = _c.goEnd;
+    var _d = useOpenState({
+        onOpen: function () { return fireLoadItems(''); },
+        onClose: function () {
+            resetHighlight();
+            setFilteringValue('');
+        }
+    }), isOpen = _d.isOpen, openDropdown = _d.openDropdown, closeDropdown = _d.closeDropdown, toggleDropdown = _d.toggleDropdown;
+    var focused = useRef(false);
+    var handleFocus = function () {
+        if (!focused.current) {
+            fireCancelableEvent(onFocus, {});
+            focused.current = true;
+        }
+    };
+    var handleBlur = function (_a) {
+        var detail = _a.detail;
+        var relatedTarget = detail.relatedTarget;
+        var nextFocusedIsTrigger = relatedTarget ? containsOrEqual(triggerRef.current, relatedTarget) : false;
+        var nextFocusedInsideDropdown = relatedTarget
+            ? containsOrEqual(menuRef.current, relatedTarget) || containsOrEqual(filterRef.current, relatedTarget)
+            : false;
+        var nextFocusedInsideComponent = nextFocusedIsTrigger || nextFocusedInsideDropdown;
+        var focusingOut = focused.current && !nextFocusedInsideComponent;
+        if (nextFocusedIsTrigger || focusingOut) {
+            closeDropdown();
+        }
+        if (focusingOut) {
+            fireCancelableEvent(onBlur, {});
+            focused.current = false;
+        }
+    };
+    var hasSelectedOption = __selectedOptions.length > 0;
+    var _e = useIds({ hasSelectedOption: hasSelectedOption }), selectedOptionId = _e.selectedOptionId, menuId = _e.menuId;
+    var highlightedOptionId = getOptionId(menuId, highlightedIndex);
+    var selectOption = function (option) {
+        var _a;
+        isSelectingUsingSpace.current = false;
+        var optionToSelect = option || highlightedOption;
+        if (!optionToSelect || !interactivityCheck(optionToSelect)) {
+            return;
+        }
+        updateSelectedOption(optionToSelect.option);
+        if (!keepOpen) {
+            (_a = triggerRef.current) === null || _a === void 0 ? void 0 : _a.focus();
+            closeDropdown();
+        }
+    };
+    var activeKeyDownHandler = useMenuKeyboard({
+        moveHighlight: moveHighlight,
+        selectOption: selectOption,
+        goHome: goHome,
+        goEnd: goEnd,
+        closeDropdown: function () {
+            var _a;
+            (_a = triggerRef.current) === null || _a === void 0 ? void 0 : _a.focus();
+            closeDropdown();
+        },
+        isKeyboard: isKeyboard,
+        isSelectingUsingSpace: isSelectingUsingSpace,
+        preventNativeSpace: !hasFilter
+    });
+    var triggerKeyDownHandler = useTriggerKeyboard({ openDropdown: openDropdown, goHome: goHome, isKeyboard: isKeyboard });
+    var getTriggerProps = function (disabled) {
+        if (disabled === void 0) { disabled = false; }
+        var triggerProps = {
+            ref: triggerRef,
+            onFocus: handleFocus,
+            onBlur: handleBlur
+        };
+        if (!disabled) {
+            triggerProps.onMouseDown = function (event) {
+                var _a;
+                event.preventDefault(); // prevent current focus from blurring as it immediately closes the dropdown
+                if (isOpen) {
+                    (_a = triggerRef.current) === null || _a === void 0 ? void 0 : _a.focus();
+                }
+                toggleDropdown();
+            };
+            triggerProps.onKeyDown = triggerKeyDownHandler;
+        }
+        if (hasSelectedOption) {
+            triggerProps.ariaLabelledby = selectedOptionId;
+        }
+        return triggerProps;
+    };
+    var getFilterProps = function () {
+        var _a;
+        if (!hasFilter) {
+            return {};
+        }
+        return {
+            ref: filterRef,
+            onKeyDown: activeKeyDownHandler,
+            __onBlurWithDetail: handleBlur,
+            onFocus: handleFocus,
+            onChange: function (event) {
+                setFilteringValue(event.detail.value);
+                resetHighlight();
+            },
+            __onDelayedInput: function (event) {
+                fireLoadItems(event.detail.value);
+            },
+            __nativeAttributes: (_a = {
+                    'aria-activedescendant': highlightedOptionId
+                },
+                _a['aria-owns'] = menuId,
+                _a)
+        };
+    };
+    var getMenuProps = function () {
+        var menuProps = {
+            id: menuId,
+            ref: menuRef,
+            open: isOpen,
+            onFocus: handleFocus,
+            onBlur: handleBlur,
+            onMouseUp: function (itemIndex) {
+                isKeyboard.current = false;
+                if (itemIndex > -1) {
+                    selectOption(options[itemIndex]);
+                }
+            },
+            onMouseMove: function (itemIndex) {
+                isKeyboard.current = false;
+                if (itemIndex > -1) {
+                    setHighlightedIndex(itemIndex);
+                }
+            }
+        };
+        if (!hasFilter) {
+            menuProps.onKeyDown = activeKeyDownHandler;
+            menuProps.onBlur = handleBlur;
+            menuProps.onFocus = handleFocus;
+            menuProps.nativeAttributes = {
+                'aria-activedescendant': highlightedOptionId
+            };
+        }
+        return menuProps;
+    };
+    var getGroupState = function (option) {
+        var totalSelected = option.options.filter(function (item) { return !!item.value && __selectedValuesSet.has(item.value); }).length;
+        var hasSelected = totalSelected > 0;
+        var allSelected = totalSelected === option.options.length;
+        return {
+            selected: hasSelected && allSelected,
+            indeterminate: hasSelected && !allSelected
+        };
+    };
+    var getOptionProps = function (option, index) {
+        var _a;
+        var _b;
+        var highlighted = option === highlightedOption;
+        var groupState = isGroup(option.option) ? getGroupState(option.option) : undefined;
+        var selected = __selectedOptions.indexOf(option) > -1 || !!(groupState === null || groupState === void 0 ? void 0 : groupState.selected);
+        var nextOption = (_b = options[index + 1]) === null || _b === void 0 ? void 0 : _b.option;
+        var isNextSelected = !!nextOption && isGroup(nextOption)
+            ? getGroupState(nextOption).selected
+            : __selectedOptions.indexOf(options[index + 1]) > -1;
+        var optionProps = (_a = {
+                key: index,
+                option: option,
+                highlighted: highlighted,
+                selected: selected,
+                isNextSelected: isNextSelected,
+                indeterminate: !!(groupState === null || groupState === void 0 ? void 0 : groupState.indeterminate)
+            },
+            _a['data-mouse-target'] = isHighlightable(option) ? index : -1,
+            _a.id = getOptionId(menuId, index),
+            _a);
+        return optionProps;
+    };
+    var prevOpen = usePrevious(isOpen);
+    useEffect(function () {
+        // highlight the first selected option, when opening the Select component
+        if (isOpen && !prevOpen && hasSelectedOption) {
+            setHighlightedIndex(options.indexOf(__selectedOptions[0]));
+        }
+    }, [isOpen, __selectedOptions, hasSelectedOption, setHighlightedIndex, options, prevOpen]);
+    useEffect(function () {
+        var _a;
+        if (isOpen) {
+            // dropdown-fit calculations ensure that the dropdown will fit inside the current
+            // viewport, so prevent the browser from trying to scroll it into view (e.g. if
+            // scroll-padding-top is set on a parent)
+            (_a = activeRef.current) === null || _a === void 0 ? void 0 : _a.focus({ preventScroll: true });
+        }
+    }, [isOpen, activeRef]);
+    useForwardFocus(externalRef, triggerRef);
+    var highlightedGroupSelected = !!highlightedOption && isGroup(highlightedOption.option) && getGroupState(highlightedOption.option).selected;
+    var announceSelected = !!highlightedOption && (__selectedOptions.indexOf(highlightedOption) > -1 || highlightedGroupSelected);
+    return {
+        isOpen: isOpen,
+        highlightedOption: highlightedOption,
+        highlightedIndex: highlightedIndex,
+        getTriggerProps: getTriggerProps,
+        getMenuProps: getMenuProps,
+        getFilterProps: getFilterProps,
+        getOptionProps: getOptionProps,
+        isKeyboard: isKeyboard,
+        highlightOption: highlightOption,
+        selectOption: selectOption,
+        announceSelected: announceSelected
+    };
+}
+//# sourceMappingURL=use-select.js.map

package/select/utils/use-select.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-select.js","sourceRoot":"","sources":["../../../../src/select/utils/use-select.ts"],"names":[],"mappings":"AAIA,OAAO,EAAE,aAAa,EAAE,kBAAkB,EAAE,OAAO,EAAE,MAAM,uDAAuD,CAAC;AACnH,OAAO,EAAE,SAAS,EAAE,MAAM,EAAoB,MAAM,OAAO,CAAC;AAC5D,OAAO,EAAE,2BAA2B,EAAE,MAAM,mEAAmE,CAAC;AAChH,OAAO,EAAE,YAAY,EAAE,MAAM,6DAA6D,CAAC;AAC3F,OAAO,EAAE,eAAe,EAAE,kBAAkB,EAAE,MAAM,2DAA2D,CAAC;AAChH,OAAO,EAAE,MAAM,EAAE,WAAW,EAAE,MAAM,sDAAsD,CAAC;AAC3F,OAAO,EAAE,qBAAqB,EAAE,MAAM,mBAAmB,CAAC;AAC1D,OAAO,eAAe,MAAM,oCAAoC,CAAC;AAIjE,OAAO,EAAE,WAAW,EAAE,MAAM,mCAAmC,CAAC;AAEhE,OAAO,EAA0B,mBAAmB,EAA6B,MAAM,6BAA6B,CAAC;AACrH,OAAO,EAAE,eAAe,EAAE,MAAM,0BAA0B,CAAC;AA4B3D,MAAM,UAAU,SAAS,CAAC,EAYT;QAXf,eAAe,qBAAA,EACf,oBAAoB,0BAAA,EACpB,OAAO,aAAA,EACP,aAAa,mBAAA,EACb,MAAM,YAAA,EACN,OAAO,aAAA,EACP,WAAW,iBAAA,EACX,QAAQ,cAAA,EACR,aAAa,mBAAA,EACb,iBAAiB,uBAAA,EACjB,4BAA4B,EAA5B,oBAAoB,mBAAG,KAAK,KAAA;IAE5B,IAAM,kBAAkB,GAAG,oBAAoB,CAAC,CAAC,CAAC,kBAAkB,CAAC,CAAC,CAAC,aAAa,CAAC;IAErF,IAAM,eAAe,GAAG,UAAC,MAAuB,IAAK,OAAA,CAAC,CAAC,MAAM,IAAI,CAAC,oBAAoB,IAAI,MAAM,CAAC,IAAI,KAAK,QAAQ,CAAC,EAA9D,CAA8D,CAAC;IACpH,IAAM,oBAAoB,GAAG,2BAA2B,CAAC,EAAE,eAAe,EAAE,eAAe,EAAE,CAAC,CAAC;IAE/F,IAAM,SAAS,GAAG,MAAM,CAAmB,IAAI,CAAC,CAAC;IACjD,IAAM,UAAU,GAAG,MAAM,CAAoB,IAAI,CAAC,CAAC;IACnD,IAAM,OAAO,GAAG,MAAM,CAAmB,IAAI,CAAC,CAAC;IAC/C,IAAM,SAAS,GAAG,aAAa,KAAK,MAAM,CAAC;IAC3C,IAAM,SAAS,GAAG,SAAS,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,OAAO,CAAC;IAClD,IAAM,UAAU,GAAG,MAAM,CAAU,KAAK,CAAC,CAAC;IAC1C,IAAM,qBAAqB,GAAG,MAAM,CAAU,KAAK,CAAC,CAAC;IACrD,IAAM,iBAAiB,GAAG,qBAAqB,CAAC,OAAO,EAAE,eAAe,CAAC,CAAC;IAC1E,IAAM,mBAAmB,GAAG,eAAe,CAAC,MAAM,CAAC,UAAC,iBAA8B,EAAE,IAAsB;QACxG,IAAI,IAAI,CAAC,KAAK,EAAE;YACd,iBAAiB,CAAC,GAAG,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;SACnC;QACD,OAAO,iBAAiB,CAAC;IAC3B,CAAC,EAAE,IAAI,GAAG,EAAU,CAAC,CAAC;IAChB,IAAA,KASF,oBAAoB,CAAC,OAAO,CAAC,EAR/B,iBAAiB,uBAAA,EACjB,gBAAgB,sBAAA,EAChB,aAAa,mBAAA,EACb,cAAc,oBAAA,EACd,mBAAmB,yBAAA,EACnB,eAAe,qBAAA,EACf,MAAM,YAAA,EACN,KAAK,WAC0B,CAAC;IAE5B,IAAA,KAA0D,YAAY,CAAC;QAC3E,MAAM,EAAE,cAAM,OAAA,aAAa,CAAC,EAAE,CAAC,EAAjB,CAAiB;QAC/B,OAAO,EAAE;YACP,cAAc,EAAE,CAAC;YACjB,iBAAiB,CAAC,EAAE,CAAC,CAAC;QACxB,CAAC;KACF,CAAC,EANM,MAAM,YAAA,EAAE,YAAY,kBAAA,EAAE,aAAa,mBAAA,EAAE,cAAc,oBAMzD,CAAC;IAEH,IAAM,OAAO,GAA8B,MAAM,CAAU,KAAK,CAAC,CAAC;IAClE,IAAM,WAAW,GAAG;QAClB,IAAI,CAAC,OAAO,CAAC,OAAO,EAAE;YACpB,mBAAmB,CAAC,OAAO,EAAE,EAAE,CAAC,CAAC;YACjC,OAAO,CAAC,OAAO,GAAG,IAAI,CAAC;SACxB;IACH,CAAC,CAAC;IACF,IAAM,UAAU,GAAG,UAAC,EAAsD;YAApD,MAAM,YAAA;QAClB,IAAA,aAAa,GAAK,MAAM,cAAX,CAAY;QACjC,IAAM,oBAAoB,GAAG,aAAa,CAAC,CAAC,CAAC,eAAe,CAAC,UAAU,CAAC,OAAO,EAAE,aAAa,CAAC,CAAC,CAAC,CAAC,KAAK,CAAC;QACxG,IAAM,yBAAyB,GAAG,aAAa;YAC7C,CAAC,CAAC,eAAe,CAAC,OAAO,CAAC,OAAO,EAAE,aAAa,CAAC,IAAI,eAAe,CAAC,SAAS,CAAC,OAAO,EAAE,aAAa,CAAC;YACtG,CAAC,CAAC,KAAK,CAAC;QACV,IAAM,0BAA0B,GAAG,oBAAoB,IAAI,yBAAyB,CAAC;QACrF,IAAM,WAAW,GAAG,OAAO,CAAC,OAAO,IAAI,CAAC,0BAA0B,CAAC;QAEnE,IAAI,oBAAoB,IAAI,WAAW,EAAE;YACvC,aAAa,EAAE,CAAC;SACjB;QACD,IAAI,WAAW,EAAE;YACf,mBAAmB,CAAC,MAAM,EAAE,EAAE,CAAC,CAAC;YAChC,OAAO,CAAC,OAAO,GAAG,KAAK,CAAC;SACzB;IACH,CAAC,CAAC;IAEF,IAAM,iBAAiB,GAAG,iBAAiB,CAAC,MAAM,GAAG,CAAC,CAAC;IACjD,IAAA,KAA+B,MAAM,CAAC,EAAE,iBAAiB,mBAAA,EAAE,CAAC,EAA1D,gBAAgB,sBAAA,EAAE,MAAM,YAAkC,CAAC;IACnE,IAAM,mBAAmB,GAAG,WAAW,CAAC,MAAM,EAAE,gBAAgB,CAAC,CAAC;IAElE,IAAM,YAAY,GAAG,UAAC,MAAuB;;QAC3C,qBAAqB,CAAC,OAAO,GAAG,KAAK,CAAC;QACtC,IAAM,cAAc,GAAG,MAAM,IAAI,iBAAiB,CAAC;QACnD,IAAI,CAAC,cAAc,IAAI,CAAC,kBAAkB,CAAC,cAAc,CAAC,EAAE;YAC1D,OAAO;SACR;QACD,oBAAoB,CAAC,cAAc,CAAC,MAAM,CAAC,CAAC;QAC5C,IAAI,CAAC,QAAQ,EAAE;YACb,MAAA,UAAU,CAAC,OAAO,0CAAE,KAAK,EAAE,CAAC;YAC5B,aAAa,EAAE,CAAC;SACjB;IACH,CAAC,CAAC;IAEF,IAAM,oBAAoB,GAAG,eAAe,CAAC;QAC3C,aAAa,eAAA;QACb,YAAY,cAAA;QACZ,MAAM,QAAA;QACN,KAAK,OAAA;QACL,aAAa,EAAE;;YACb,MAAA,UAAU,CAAC,OAAO,0CAAE,KAAK,EAAE,CAAC;YAC5B,aAAa,EAAE,CAAC;QAClB,CAAC;QACD,UAAU,YAAA;QACV,qBAAqB,uBAAA;QACrB,kBAAkB,EAAE,CAAC,SAAS;KAC/B,CAAC,CAAC;IAEH,IAAM,qBAAqB,GAAG,kBAAkB,CAAC,EAAE,YAAY,cAAA,EAAE,MAAM,QAAA,EAAE,UAAU,YAAA,EAAE,CAAC,CAAC;IAEvF,IAAM,eAAe,GAAG,UAAC,QAAgB;QAAhB,yBAAA,EAAA,gBAAgB;QACvC,IAAM,YAAY,GAAuB;YACvC,GAAG,EAAE,UAAU;YACf,OAAO,EAAE,WAAW;YACpB,MAAM,EAAE,UAAU;SACnB,CAAC;QACF,IAAI,CAAC,QAAQ,EAAE;YACb,YAAY,CAAC,WAAW,GAAG,UAAC,KAAkB;;gBAC5C,KAAK,CAAC,cAAc,EAAE,CAAC,CAAC,4EAA4E;gBACpG,IAAI,MAAM,EAAE;oBACV,MAAA,UAAU,CAAC,OAAO,0CAAE,KAAK,EAAE,CAAC;iBAC7B;gBACD,cAAc,EAAE,CAAC;YACnB,CAAC,CAAC;YACF,YAAY,CAAC,SAAS,GAAG,qBAAqB,CAAC;SAChD;QACD,IAAI,iBAAiB,EAAE;YACrB,YAAY,CAAC,cAAc,GAAG,gBAAgB,CAAC;SAChD;QACD,OAAO,YAAY,CAAC;IACtB,CAAC,CAAC;IAEF,IAAM,cAAc,GAAG;;QACrB,IAAI,CAAC,SAAS,EAAE;YACd,OAAO,EAAE,CAAC;SACX;QAED,OAAO;YACL,GAAG,EAAE,SAAS;YACd,SAAS,EAAE,oBAAoB;YAC/B,kBAAkB,EAAE,UAAU;YAC9B,OAAO,EAAE,WAAW;YACpB,QAAQ,EAAE,UAAA,KAAK;gBACb,iBAAiB,CAAC,KAAK,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC;gBACtC,cAAc,EAAE,CAAC;YACnB,CAAC;YACD,gBAAgB,EAAE,UAAA,KAAK;gBACrB,aAAa,CAAC,KAAK,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC;YACpC,CAAC;YACD,kBAAkB;oBAChB,uBAAuB,EAAE,mBAAmB;;gBAC5C,GAAC,WAAW,IAAG,MAAM;mBACtB;SACF,CAAC;IACJ,CAAC,CAAC;IAEF,IAAM,YAAY,GAAG;QACnB,IAAM,SAAS,GAAc;YAC3B,EAAE,EAAE,MAAM;YACV,GAAG,EAAE,OAAO;YACZ,IAAI,EAAE,MAAM;YACZ,OAAO,EAAE,WAAW;YACpB,MAAM,EAAE,UAAU;YAClB,SAAS,EAAE,UAAA,SAAS;gBAClB,UAAU,CAAC,OAAO,GAAG,KAAK,CAAC;gBAC3B,IAAI,SAAS,GAAG,CAAC,CAAC,EAAE;oBAClB,YAAY,CAAC,OAAO,CAAC,SAAS,CAAC,CAAC,CAAC;iBAClC;YACH,CAAC;YACD,WAAW,EAAE,UAAA,SAAS;gBACpB,UAAU,CAAC,OAAO,GAAG,KAAK,CAAC;gBAC3B,IAAI,SAAS,GAAG,CAAC,CAAC,EAAE;oBAClB,mBAAmB,CAAC,SAAS,CAAC,CAAC;iBAChC;YACH,CAAC;SACF,CAAC;QACF,IAAI,CAAC,SAAS,EAAE;YACd,SAAS,CAAC,SAAS,GAAG,oBAAoB,CAAC;YAC3C,SAAS,CAAC,MAAM,GAAG,UAAU,CAAC;YAC9B,SAAS,CAAC,OAAO,GAAG,WAAW,CAAC;YAChC,SAAS,CAAC,gBAAgB,GAAG;gBAC3B,uBAAuB,EAAE,mBAAmB;aAC7C,CAAC;SACH;QACD,OAAO,SAAS,CAAC;IACnB,CAAC,CAAC;IACF,IAAM,aAAa,GAAG,UAAC,MAAmB;QACxC,IAAM,aAAa,GAAG,MAAM,CAAC,OAAO,CAAC,MAAM,CAAC,UAAA,IAAI,IAAI,OAAA,CAAC,CAAC,IAAI,CAAC,KAAK,IAAI,mBAAmB,CAAC,GAAG,CAAC,IAAI,CAAC,KAAK,CAAC,EAAnD,CAAmD,CAAC,CAAC,MAAM,CAAC;QAChH,IAAM,WAAW,GAAG,aAAa,GAAG,CAAC,CAAC;QACtC,IAAM,WAAW,GAAG,aAAa,KAAK,MAAM,CAAC,OAAO,CAAC,MAAM,CAAC;QAC5D,OAAO;YACL,QAAQ,EAAE,WAAW,IAAI,WAAW;YACpC,aAAa,EAAE,WAAW,IAAI,CAAC,WAAW;SAC3C,CAAC;IACJ,CAAC,CAAC;IAEF,IAAM,cAAc,GAAG,UAAC,MAAsB,EAAE,KAAa;;;QAC3D,IAAM,WAAW,GAAG,MAAM,KAAK,iBAAiB,CAAC;QACjD,IAAM,UAAU,GAAG,OAAO,CAAC,MAAM,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC,aAAa,CAAC,MAAM,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC,SAAS,CAAC;QACrF,IAAM,QAAQ,GAAG,iBAAiB,CAAC,OAAO,CAAC,MAAM,CAAC,GAAG,CAAC,CAAC,IAAI,CAAC,CAAC,CAAA,UAAU,aAAV,UAAU,uBAAV,UAAU,CAAE,QAAQ,CAAA,CAAC;QAClF,IAAM,UAAU,GAAG,MAAA,OAAO,CAAC,KAAK,GAAG,CAAC,CAAC,0CAAE,MAAM,CAAC;QAC9C,IAAM,cAAc,GAClB,CAAC,CAAC,UAAU,IAAI,OAAO,CAAC,UAAU,CAAC;YACjC,CAAC,CAAC,aAAa,CAAC,UAAU,CAAC,CAAC,QAAQ;YACpC,CAAC,CAAC,iBAAiB,CAAC,OAAO,CAAC,OAAO,CAAC,KAAK,GAAG,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC;QAEzD,IAAM,WAAW;gBACf,GAAG,EAAE,KAAK;gBACV,MAAM,QAAA;gBACN,WAAW,aAAA;gBACX,QAAQ,UAAA;gBACR,cAAc,gBAAA;gBACd,aAAa,EAAE,CAAC,CAAC,CAAA,UAAU,aAAV,UAAU,uBAAV,UAAU,CAAE,aAAa,CAAA;;YAC1C,GAAC,mBAAmB,IAAG,eAAe,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,CAAC;YAC3D,KAAE,GAAE,WAAW,CAAC,MAAM,EAAE,KAAK,CAAC;eAC/B,CAAC;QAEF,OAAO,WAAW,CAAC;IACrB,CAAC,CAAC;IAEF,IAAM,QAAQ,GAAG,WAAW,CAAU,MAAM,CAAC,CAAC;IAC9C,SAAS,CAAC;QACR,yEAAyE;QACzE,IAAI,MAAM,IAAI,CAAC,QAAQ,IAAI,iBAAiB,EAAE;YAC5C,mBAAmB,CAAC,OAAO,CAAC,OAAO,CAAC,iBAAiB,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;SAC5D;IACH,CAAC,EAAE,CAAC,MAAM,EAAE,iBAAiB,EAAE,iBAAiB,EAAE,mBAAmB,EAAE,OAAO,EAAE,QAAQ,CAAC,CAAC,CAAC;IAE3F,SAAS,CAAC;;QACR,IAAI,MAAM,EAAE;YACV,iFAAiF;YACjF,+EAA+E;YAC/E,yCAAyC;YACzC,MAAA,SAAS,CAAC,OAAO,0CAAE,KAAK,CAAC,EAAE,aAAa,EAAE,IAAI,EAAE,CAAC,CAAC;SACnD;IACH,CAAC,EAAE,CAAC,MAAM,EAAE,SAAS,CAAC,CAAC,CAAC;IAExB,eAAe,CAAC,WAAW,EAAE,UAA0C,CAAC,CAAC;IACzE,IAAM,wBAAwB,GAC5B,CAAC,CAAC,iBAAiB,IAAI,OAAO,CAAC,iBAAiB,CAAC,MAAM,CAAC,IAAI,aAAa,CAAC,iBAAiB,CAAC,MAAM,CAAC,CAAC,QAAQ,CAAC;IAC/G,IAAM,gBAAgB,GACpB,CAAC,CAAC,iBAAiB,IAAI,CAAC,iBAAiB,CAAC,OAAO,CAAC,iBAAiB,CAAC,GAAG,CAAC,CAAC,IAAI,wBAAwB,CAAC,CAAC;IAEzG,OAAO;QACL,MAAM,QAAA;QACN,iBAAiB,mBAAA;QACjB,gBAAgB,kBAAA;QAChB,eAAe,iBAAA;QACf,YAAY,cAAA;QACZ,cAAc,gBAAA;QACd,cAAc,gBAAA;QACd,UAAU,YAAA;QACV,eAAe,iBAAA;QACf,YAAY,cAAA;QACZ,gBAAgB,kBAAA;KACjB,CAAC;AACJ,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React, { RefObject } from 'react';\nimport { DropdownOption, OptionDefinition, OptionGroup } from '../../internal/components/option/interfaces';\nimport { isInteractive, isGroupInteractive, isGroup } from '../../internal/components/option/utils/filter-options';\nimport { useEffect, useRef, MutableRefObject } from 'react';\nimport { createHighlightedOptionHook } from '../../internal/components/options-list/utils/use-highlight-option';\nimport { useOpenState } from '../../internal/components/options-list/utils/use-open-state';\nimport { useMenuKeyboard, useTriggerKeyboard } from '../../internal/components/options-list/utils/use-keyboard';\nimport { useIds, getOptionId } from '../../internal/components/options-list/utils/use-ids';\nimport { connectOptionsByValue } from './connect-options';\nimport useForwardFocus from '../../internal/hooks/forward-focus';\nimport { OptionsListProps } from '../../internal/components/options-list';\nimport { FilterProps } from '../parts/filter';\nimport { ItemProps } from '../parts/item';\nimport { usePrevious } from '../../internal/hooks/use-previous';\nimport { BaseKeyDetail } from '../../internal/events';\nimport { CancelableEventHandler, fireCancelableEvent, NonCancelableEventHandler } from '../../internal/events/index';\nimport { containsOrEqual } from '../../internal/utils/dom';\n\nexport type MenuProps = Omit<OptionsListProps, 'children'> & { ref: React.RefObject<HTMLUListElement> };\nexport type GetOptionProps = (option: DropdownOption, index: number) => ItemProps;\n\ninterface UseSelectProps {\n  selectedOptions: ReadonlyArray<OptionDefinition>;\n  updateSelectedOption: (option: OptionDefinition) => void;\n  options: ReadonlyArray<DropdownOption>;\n  filteringType: string;\n  keepOpen?: boolean;\n  onBlur?: CancelableEventHandler;\n  onFocus?: CancelableEventHandler;\n  externalRef: React.Ref<any>;\n  fireLoadItems: (filteringText: string) => void;\n  setFilteringValue: (filteringText: string) => void;\n  useInteractiveGroups?: boolean;\n}\n\nexport interface SelectTriggerProps {\n  ref: RefObject<HTMLButtonElement>;\n  onMouseDown?: (event: CustomEvent) => void;\n  onKeyDown?: (event: CustomEvent<BaseKeyDetail>) => void;\n  ariaLabelledby?: string;\n  onFocus: NonCancelableEventHandler;\n  onBlur: NonCancelableEventHandler<{ relatedTarget: Node | null }>;\n}\n\nexport function useSelect({\n  selectedOptions,\n  updateSelectedOption,\n  options,\n  filteringType,\n  onBlur,\n  onFocus,\n  externalRef,\n  keepOpen,\n  fireLoadItems,\n  setFilteringValue,\n  useInteractiveGroups = false,\n}: UseSelectProps) {\n  const interactivityCheck = useInteractiveGroups ? isGroupInteractive : isInteractive;\n\n  const isHighlightable = (option?: DropdownOption) => !!option && (useInteractiveGroups || option.type !== 'parent');\n  const useHighlightedOption = createHighlightedOptionHook({ isHighlightable: isHighlightable });\n\n  const filterRef = useRef<HTMLInputElement>(null);\n  const triggerRef = useRef<HTMLButtonElement>(null);\n  const menuRef = useRef<HTMLUListElement>(null);\n  const hasFilter = filteringType !== 'none';\n  const activeRef = hasFilter ? filterRef : menuRef;\n  const isKeyboard = useRef<boolean>(false);\n  const isSelectingUsingSpace = useRef<boolean>(false);\n  const __selectedOptions = connectOptionsByValue(options, selectedOptions);\n  const __selectedValuesSet = selectedOptions.reduce((selectedValuesSet: Set<string>, item: OptionDefinition) => {\n    if (item.value) {\n      selectedValuesSet.add(item.value);\n    }\n    return selectedValuesSet;\n  }, new Set<string>());\n  const {\n    highlightedOption,\n    highlightedIndex,\n    moveHighlight,\n    resetHighlight,\n    setHighlightedIndex,\n    highlightOption,\n    goHome,\n    goEnd,\n  } = useHighlightedOption(options);\n\n  const { isOpen, openDropdown, closeDropdown, toggleDropdown } = useOpenState({\n    onOpen: () => fireLoadItems(''),\n    onClose: () => {\n      resetHighlight();\n      setFilteringValue('');\n    },\n  });\n\n  const focused: MutableRefObject<boolean> = useRef<boolean>(false);\n  const handleFocus = () => {\n    if (!focused.current) {\n      fireCancelableEvent(onFocus, {});\n      focused.current = true;\n    }\n  };\n  const handleBlur = ({ detail }: { detail: { relatedTarget: Node | null } }) => {\n    const { relatedTarget } = detail;\n    const nextFocusedIsTrigger = relatedTarget ? containsOrEqual(triggerRef.current, relatedTarget) : false;\n    const nextFocusedInsideDropdown = relatedTarget\n      ? containsOrEqual(menuRef.current, relatedTarget) || containsOrEqual(filterRef.current, relatedTarget)\n      : false;\n    const nextFocusedInsideComponent = nextFocusedIsTrigger || nextFocusedInsideDropdown;\n    const focusingOut = focused.current && !nextFocusedInsideComponent;\n\n    if (nextFocusedIsTrigger || focusingOut) {\n      closeDropdown();\n    }\n    if (focusingOut) {\n      fireCancelableEvent(onBlur, {});\n      focused.current = false;\n    }\n  };\n\n  const hasSelectedOption = __selectedOptions.length > 0;\n  const { selectedOptionId, menuId } = useIds({ hasSelectedOption });\n  const highlightedOptionId = getOptionId(menuId, highlightedIndex);\n\n  const selectOption = (option?: DropdownOption) => {\n    isSelectingUsingSpace.current = false;\n    const optionToSelect = option || highlightedOption;\n    if (!optionToSelect || !interactivityCheck(optionToSelect)) {\n      return;\n    }\n    updateSelectedOption(optionToSelect.option);\n    if (!keepOpen) {\n      triggerRef.current?.focus();\n      closeDropdown();\n    }\n  };\n\n  const activeKeyDownHandler = useMenuKeyboard({\n    moveHighlight,\n    selectOption,\n    goHome,\n    goEnd,\n    closeDropdown: () => {\n      triggerRef.current?.focus();\n      closeDropdown();\n    },\n    isKeyboard,\n    isSelectingUsingSpace,\n    preventNativeSpace: !hasFilter,\n  });\n\n  const triggerKeyDownHandler = useTriggerKeyboard({ openDropdown, goHome, isKeyboard });\n\n  const getTriggerProps = (disabled = false) => {\n    const triggerProps: SelectTriggerProps = {\n      ref: triggerRef,\n      onFocus: handleFocus,\n      onBlur: handleBlur,\n    };\n    if (!disabled) {\n      triggerProps.onMouseDown = (event: CustomEvent) => {\n        event.preventDefault(); // prevent current focus from blurring as it immediately closes the dropdown\n        if (isOpen) {\n          triggerRef.current?.focus();\n        }\n        toggleDropdown();\n      };\n      triggerProps.onKeyDown = triggerKeyDownHandler;\n    }\n    if (hasSelectedOption) {\n      triggerProps.ariaLabelledby = selectedOptionId;\n    }\n    return triggerProps;\n  };\n\n  const getFilterProps = (): Partial<FilterProps> => {\n    if (!hasFilter) {\n      return {};\n    }\n\n    return {\n      ref: filterRef,\n      onKeyDown: activeKeyDownHandler,\n      __onBlurWithDetail: handleBlur,\n      onFocus: handleFocus,\n      onChange: event => {\n        setFilteringValue(event.detail.value);\n        resetHighlight();\n      },\n      __onDelayedInput: event => {\n        fireLoadItems(event.detail.value);\n      },\n      __nativeAttributes: {\n        'aria-activedescendant': highlightedOptionId,\n        ['aria-owns']: menuId,\n      },\n    };\n  };\n\n  const getMenuProps = () => {\n    const menuProps: MenuProps = {\n      id: menuId,\n      ref: menuRef,\n      open: isOpen,\n      onFocus: handleFocus,\n      onBlur: handleBlur,\n      onMouseUp: itemIndex => {\n        isKeyboard.current = false;\n        if (itemIndex > -1) {\n          selectOption(options[itemIndex]);\n        }\n      },\n      onMouseMove: itemIndex => {\n        isKeyboard.current = false;\n        if (itemIndex > -1) {\n          setHighlightedIndex(itemIndex);\n        }\n      },\n    };\n    if (!hasFilter) {\n      menuProps.onKeyDown = activeKeyDownHandler;\n      menuProps.onBlur = handleBlur;\n      menuProps.onFocus = handleFocus;\n      menuProps.nativeAttributes = {\n        'aria-activedescendant': highlightedOptionId,\n      };\n    }\n    return menuProps;\n  };\n  const getGroupState = (option: OptionGroup) => {\n    const totalSelected = option.options.filter(item => !!item.value && __selectedValuesSet.has(item.value)).length;\n    const hasSelected = totalSelected > 0;\n    const allSelected = totalSelected === option.options.length;\n    return {\n      selected: hasSelected && allSelected,\n      indeterminate: hasSelected && !allSelected,\n    };\n  };\n\n  const getOptionProps = (option: DropdownOption, index: number) => {\n    const highlighted = option === highlightedOption;\n    const groupState = isGroup(option.option) ? getGroupState(option.option) : undefined;\n    const selected = __selectedOptions.indexOf(option) > -1 || !!groupState?.selected;\n    const nextOption = options[index + 1]?.option;\n    const isNextSelected =\n      !!nextOption && isGroup(nextOption)\n        ? getGroupState(nextOption).selected\n        : __selectedOptions.indexOf(options[index + 1]) > -1;\n\n    const optionProps: any = {\n      key: index,\n      option,\n      highlighted,\n      selected,\n      isNextSelected,\n      indeterminate: !!groupState?.indeterminate,\n      ['data-mouse-target']: isHighlightable(option) ? index : -1,\n      id: getOptionId(menuId, index),\n    };\n\n    return optionProps;\n  };\n\n  const prevOpen = usePrevious<boolean>(isOpen);\n  useEffect(() => {\n    // highlight the first selected option, when opening the Select component\n    if (isOpen && !prevOpen && hasSelectedOption) {\n      setHighlightedIndex(options.indexOf(__selectedOptions[0]));\n    }\n  }, [isOpen, __selectedOptions, hasSelectedOption, setHighlightedIndex, options, prevOpen]);\n\n  useEffect(() => {\n    if (isOpen) {\n      // dropdown-fit calculations ensure that the dropdown will fit inside the current\n      // viewport, so prevent the browser from trying to scroll it into view (e.g. if\n      // scroll-padding-top is set on a parent)\n      activeRef.current?.focus({ preventScroll: true });\n    }\n  }, [isOpen, activeRef]);\n\n  useForwardFocus(externalRef, triggerRef as React.RefObject<HTMLElement>);\n  const highlightedGroupSelected =\n    !!highlightedOption && isGroup(highlightedOption.option) && getGroupState(highlightedOption.option).selected;\n  const announceSelected =\n    !!highlightedOption && (__selectedOptions.indexOf(highlightedOption) > -1 || highlightedGroupSelected);\n\n  return {\n    isOpen,\n    highlightedOption,\n    highlightedIndex,\n    getTriggerProps,\n    getMenuProps,\n    getFilterProps,\n    getOptionProps,\n    isKeyboard,\n    highlightOption,\n    selectOption,\n    announceSelected,\n  };\n}\n"]}

package/side-navigation/index.d.ts

@@ -0,0 +1,4 @@
+import { SideNavigationProps } from './interfaces';
+export { SideNavigationProps };
+export default function SideNavigation({ header, activeHref, items, onFollow, onChange, ...props }: SideNavigationProps): JSX.Element;
+//# sourceMappingURL=index.d.ts.map

package/side-navigation/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/side-navigation/index.tsx"],"names":[],"mappings":"AAMA,OAAO,EAAE,mBAAmB,EAAE,MAAM,cAAc,CAAC;AAQnD,OAAO,EAAE,mBAAmB,EAAE,CAAC;AAE/B,MAAM,CAAC,OAAO,UAAU,cAAc,CAAC,EACrC,MAAM,EACN,UAAU,EACV,KAAU,EACV,QAAQ,EACR,QAAQ,EACR,GAAG,KAAK,EACT,EAAE,mBAAmB,eAoDrB"}

package/side-navigation/index.js

@@ -0,0 +1,38 @@
+import { __assign, __rest } from "tslib";
+// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
+// SPDX-License-Identifier: Apache-2.0
+import React, { useMemo, useCallback, useEffect } from 'react';
+import clsx from 'clsx';
+import { getBaseProps } from '../internal/base-component';
+import { fireNonCancelableEvent, fireCancelableEvent } from '../internal/events';
+import { Header, ItemList } from './internal';
+import { generateExpandableItemsMapping, checkDuplicateHrefs } from './util';
+import styles from './styles.css.js';
+import { isDevelopment } from '../internal/is-development';
+import { applyDisplayName } from '../internal/utils/apply-display-name';
+import useBaseComponent from '../internal/hooks/use-base-component';
+export default function SideNavigation(_a) {
+    var header = _a.header, activeHref = _a.activeHref, _b = _a.items, items = _b === void 0 ? [] : _b, onFollow = _a.onFollow, onChange = _a.onChange, props = __rest(_a, ["header", "activeHref", "items", "onFollow", "onChange"]);
+    var __internalRootRef = useBaseComponent('SideNavigation').__internalRootRef;
+    var baseProps = getBaseProps(props);
+    var parentMap = useMemo(function () { return generateExpandableItemsMapping(items); }, [items]);
+    if (isDevelopment) {
+        // This code should be wiped in production anyway.
+        // eslint-disable-next-line react-hooks/rules-of-hooks
+        useEffect(function () { return checkDuplicateHrefs(items); }, [items]);
+    }
+    var onChangeHandler = useCallback(function (item, expanded) {
+        // generateExpandableItemsMapping walks through the entire tree, so we're certain about getting a value.
+        // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
+        fireNonCancelableEvent(onChange, { item: item, expanded: expanded, expandableParents: parentMap.get(item) });
+    }, [onChange, parentMap]);
+    var onFollowHandler = useCallback(function (item, sourceEvent) {
+        fireCancelableEvent(onFollow, item, sourceEvent);
+    }, [onFollow]);
+    return (React.createElement("div", __assign({}, baseProps, { className: clsx(styles.root, baseProps.className), ref: __internalRootRef }),
+        header && (React.createElement(Header, { definition: header, activeHref: activeHref, fireChange: onChangeHandler, fireFollow: onFollowHandler })),
+        items && (React.createElement("div", { className: styles['list-container'] },
+            React.createElement(ItemList, { variant: "root", items: items, fireFollow: onFollowHandler, fireChange: onChangeHandler, activeHref: activeHref })))));
+}
+applyDisplayName(SideNavigation, 'SideNavigation');
+//# sourceMappingURL=index.js.map