@cloudscape-design/components-themeable 3.0.959 → 3.0.961

package/lib/internal/template/internal/hooks/use-performance-marks/index.js

@@ -5,6 +5,7 @@ import { useModalContext } from '../../context/modal-context';
 import { useDOMAttribute } from '../use-dom-attribute';
 import { useEffectOnUpdate } from '../use-effect-on-update';
 import { useRandomId } from '../use-unique-id';
+import { isInViewport } from './is-in-viewport';
 const EVALUATE_COMPONENT_VISIBILITY_EVENT = 'awsui-evaluate-component-visibility';
 /**
  * This hook manages a boolean state (`evaluateComponentVisibility`) that toggles
@@ -45,10 +46,14 @@ export function usePerformanceMarks(name, enabled, elementRef, getDetails, depen
         if (!elementVisible) {
             return;
         }
-        const renderedMarkName = `${name}Rendered`;
-        performance.mark(renderedMarkName, {
-            detail: Object.assign({ source: 'awsui', instanceIdentifier: id }, getDetails()),
+        const timestamp = performance.now();
+        const cleanup = isInViewport(elementRef.current, inViewport => {
+            performance.mark(`${name}Rendered`, {
+                startTime: timestamp,
+                detail: Object.assign({ source: 'awsui', instanceIdentifier: id, inViewport }, getDetails()),
+            });
         });
+        return cleanup;
         // eslint-disable-next-line react-hooks/exhaustive-deps
     }, []);
     useEffectOnUpdate(() => {
@@ -61,10 +66,14 @@ export function usePerformanceMarks(name, enabled, elementRef, getDetails, depen
         if (!elementVisible) {
             return;
         }
-        const updatedMarkName = `${name}Updated`;
-        performance.mark(updatedMarkName, {
-            detail: Object.assign({ source: 'awsui', instanceIdentifier: id }, getDetails()),
+        const timestamp = performance.now();
+        const cleanup = isInViewport(elementRef.current, inViewport => {
+            performance.mark(`${name}Updated`, {
+                startTime: timestamp,
+                detail: Object.assign({ source: 'awsui', instanceIdentifier: id, inViewport }, getDetails()),
+            });
         });
+        return cleanup;
         // eslint-disable-next-line react-hooks/exhaustive-deps
     }, [evaluateComponentVisibility, ...dependencies]);
     return attributes;

package/lib/internal/template/internal/hooks/use-performance-marks/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../src/internal/hooks/use-performance-marks/index.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\n\nimport { useEffect, useState } from 'react';\n\nimport { useModalContext } from '../../context/modal-context';\nimport { useDOMAttribute } from '../use-dom-attribute';\nimport { useEffectOnUpdate } from '../use-effect-on-update';\nimport { useRandomId } from '../use-unique-id';\n\nconst EVALUATE_COMPONENT_VISIBILITY_EVENT = 'awsui-evaluate-component-visibility';\n\n/**\n * This hook manages a boolean state (`evaluateComponentVisibility`) that toggles\n * whenever a custom DOM event (`EVALUATE_COMPONENT_VISIBILITY_EVENT`) is triggered.\n *\n * @returns\n */\nconst useEvaluateComponentVisibility = () => {\n  const [evaluateComponentVisibility, setEvaluateComponentVisibility] = useState(false);\n\n  useEffect(() => {\n    const handleEvaluateComponentVisibility = () => {\n      setEvaluateComponentVisibility(prev => !prev);\n    };\n\n    document.addEventListener(EVALUATE_COMPONENT_VISIBILITY_EVENT, handleEvaluateComponentVisibility);\n\n    return () => {\n      document.removeEventListener(EVALUATE_COMPONENT_VISIBILITY_EVENT, handleEvaluateComponentVisibility);\n    };\n  }, []);\n\n  return evaluateComponentVisibility;\n};\n\n/**\n * This function returns an object that needs to be spread onto the same\n * element as the `elementRef`, so that the data attribute is applied\n * correctly.\n */\nexport function usePerformanceMarks(\n  name: string,\n  enabled: () => boolean,\n  elementRef: React.RefObject<HTMLElement>,\n  getDetails: () => Record<string, string | boolean | number | undefined>,\n  dependencies: React.DependencyList\n) {\n  const id = useRandomId();\n  const { isInModal } = useModalContext();\n  const attributes = useDOMAttribute(elementRef, 'data-analytics-performance-mark', id);\n  const evaluateComponentVisibility = useEvaluateComponentVisibility();\n  useEffect(() => {\n    if (!enabled() || !elementRef.current || isInModal) {\n      return;\n    }\n    const elementVisible =\n      elementRef.current.offsetWidth > 0 &&\n      elementRef.current.offsetHeight > 0 &&\n      getComputedStyle(elementRef.current).visibility !== 'hidden';\n\n    if (!elementVisible) {\n      return;\n    }\n\n    const renderedMarkName = `${name}Rendered`;\n    performance.mark(renderedMarkName, {\n      detail: {\n        source: 'awsui',\n        instanceIdentifier: id,\n        ...getDetails(),\n      },\n    });\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, []);\n\n  useEffectOnUpdate(() => {\n    if (!enabled() || !elementRef.current || isInModal) {\n      return;\n    }\n    const elementVisible =\n      elementRef.current.offsetWidth > 0 &&\n      elementRef.current.offsetHeight > 0 &&\n      getComputedStyle(elementRef.current).visibility !== 'hidden';\n\n    if (!elementVisible) {\n      return;\n    }\n    const updatedMarkName = `${name}Updated`;\n    performance.mark(updatedMarkName, {\n      detail: {\n        source: 'awsui',\n        instanceIdentifier: id,\n        ...getDetails(),\n      },\n    });\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [evaluateComponentVisibility, ...dependencies]);\n\n  return attributes;\n}\n"]}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../src/internal/hooks/use-performance-marks/index.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\n\nimport { useEffect, useState } from 'react';\n\nimport { useModalContext } from '../../context/modal-context';\nimport { useDOMAttribute } from '../use-dom-attribute';\nimport { useEffectOnUpdate } from '../use-effect-on-update';\nimport { useRandomId } from '../use-unique-id';\nimport { isInViewport } from './is-in-viewport';\n\nconst EVALUATE_COMPONENT_VISIBILITY_EVENT = 'awsui-evaluate-component-visibility';\n\n/**\n * This hook manages a boolean state (`evaluateComponentVisibility`) that toggles\n * whenever a custom DOM event (`EVALUATE_COMPONENT_VISIBILITY_EVENT`) is triggered.\n *\n * @returns\n */\nconst useEvaluateComponentVisibility = () => {\n  const [evaluateComponentVisibility, setEvaluateComponentVisibility] = useState(false);\n\n  useEffect(() => {\n    const handleEvaluateComponentVisibility = () => {\n      setEvaluateComponentVisibility(prev => !prev);\n    };\n\n    document.addEventListener(EVALUATE_COMPONENT_VISIBILITY_EVENT, handleEvaluateComponentVisibility);\n\n    return () => {\n      document.removeEventListener(EVALUATE_COMPONENT_VISIBILITY_EVENT, handleEvaluateComponentVisibility);\n    };\n  }, []);\n\n  return evaluateComponentVisibility;\n};\n\n/**\n * This function returns an object that needs to be spread onto the same\n * element as the `elementRef`, so that the data attribute is applied\n * correctly.\n */\nexport function usePerformanceMarks(\n  name: string,\n  enabled: () => boolean,\n  elementRef: React.RefObject<HTMLElement>,\n  getDetails: () => Record<string, string | boolean | number | undefined>,\n  dependencies: React.DependencyList\n) {\n  const id = useRandomId();\n  const { isInModal } = useModalContext();\n  const attributes = useDOMAttribute(elementRef, 'data-analytics-performance-mark', id);\n  const evaluateComponentVisibility = useEvaluateComponentVisibility();\n\n  useEffect(() => {\n    if (!enabled() || !elementRef.current || isInModal) {\n      return;\n    }\n    const elementVisible =\n      elementRef.current.offsetWidth > 0 &&\n      elementRef.current.offsetHeight > 0 &&\n      getComputedStyle(elementRef.current).visibility !== 'hidden';\n\n    if (!elementVisible) {\n      return;\n    }\n\n    const timestamp = performance.now();\n\n    const cleanup = isInViewport(elementRef.current, inViewport => {\n      performance.mark(`${name}Rendered`, {\n        startTime: timestamp,\n        detail: {\n          source: 'awsui',\n          instanceIdentifier: id,\n          inViewport,\n          ...getDetails(),\n        },\n      });\n    });\n\n    return cleanup;\n\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, []);\n\n  useEffectOnUpdate(() => {\n    if (!enabled() || !elementRef.current || isInModal) {\n      return;\n    }\n    const elementVisible =\n      elementRef.current.offsetWidth > 0 &&\n      elementRef.current.offsetHeight > 0 &&\n      getComputedStyle(elementRef.current).visibility !== 'hidden';\n\n    if (!elementVisible) {\n      return;\n    }\n\n    const timestamp = performance.now();\n\n    const cleanup = isInViewport(elementRef.current, inViewport => {\n      performance.mark(`${name}Updated`, {\n        startTime: timestamp,\n        detail: {\n          source: 'awsui',\n          instanceIdentifier: id,\n          inViewport,\n          ...getDetails(),\n        },\n      });\n    });\n    return cleanup;\n\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [evaluateComponentVisibility, ...dependencies]);\n\n  return attributes;\n}\n"]}

package/lib/internal/template/internal/hooks/use-performance-marks/is-in-viewport.d.ts

@@ -0,0 +1,9 @@
+type Callback = (inViewport: boolean) => void;
+/**
+ * This function determines whether an element is in the viewport. The callback
+ * is batched with other elements that also use this function, in order to improve
+ * performance.
+ */
+export declare function isInViewport(element: Element, callback: Callback): () => void;
+export {};
+//# sourceMappingURL=is-in-viewport.d.ts.map

package/lib/internal/template/internal/hooks/use-performance-marks/is-in-viewport.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"is-in-viewport.d.ts","sourceRoot":"","sources":["../../../../../src/internal/hooks/use-performance-marks/is-in-viewport.ts"],"names":[],"mappings":"AAGA,KAAK,QAAQ,GAAG,CAAC,UAAU,EAAE,OAAO,KAAK,IAAI,CAAC;AAK9C;;;;GAIG;AACH,wBAAgB,YAAY,CAAC,OAAO,EAAE,OAAO,EAAE,QAAQ,EAAE,QAAQ,cAuBhE"}

package/lib/internal/template/internal/hooks/use-performance-marks/is-in-viewport.js

@@ -0,0 +1,48 @@
+// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
+// SPDX-License-Identifier: Apache-2.0
+const map = new WeakMap();
+const MANUAL_TRIGGER_DELAY = 150;
+/**
+ * This function determines whether an element is in the viewport. The callback
+ * is batched with other elements that also use this function, in order to improve
+ * performance.
+ */
+export function isInViewport(element, callback) {
+    let resolve = (value) => {
+        resolve = () => { }; // Prevent multiple execution
+        callback(value);
+    };
+    map.set(element, inViewport => resolve(inViewport));
+    observer.observe(element);
+    /*
+       If the IntersectionObserver does not fire in reasonable time (for example
+       in a background page in Chrome), we need to call the callback manually.
+    
+       See https://issues.chromium.org/issues/41383759
+       */
+    const timeoutHandle = setTimeout(() => resolve(false), MANUAL_TRIGGER_DELAY);
+    // Cleanup
+    return () => {
+        clearTimeout(timeoutHandle);
+        map.delete(element);
+        observer.unobserve(element);
+    };
+}
+function createIntersectionObserver(callback) {
+    if (typeof IntersectionObserver === 'undefined') {
+        return {
+            observe: () => { },
+            unobserve: () => { },
+        };
+    }
+    return new IntersectionObserver(callback);
+}
+const observer = createIntersectionObserver(function isInViewportObserver(entries) {
+    var _a;
+    for (const entry of entries) {
+        observer.unobserve(entry.target); // We only want the first run of the observer for each element.
+        (_a = map.get(entry.target)) === null || _a === void 0 ? void 0 : _a(entry.isIntersecting);
+        map.delete(entry.target);
+    }
+});
+//# sourceMappingURL=is-in-viewport.js.map

package/lib/internal/template/internal/hooks/use-performance-marks/is-in-viewport.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"is-in-viewport.js","sourceRoot":"","sources":["../../../../../src/internal/hooks/use-performance-marks/is-in-viewport.ts"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AAGtC,MAAM,GAAG,GAAG,IAAI,OAAO,EAAqB,CAAC;AAE7C,MAAM,oBAAoB,GAAG,GAAG,CAAC;AAEjC;;;;GAIG;AACH,MAAM,UAAU,YAAY,CAAC,OAAgB,EAAE,QAAkB;IAC/D,IAAI,OAAO,GAAG,CAAC,KAAc,EAAE,EAAE;QAC/B,OAAO,GAAG,GAAG,EAAE,GAAE,CAAC,CAAC,CAAC,6BAA6B;QACjD,QAAQ,CAAC,KAAK,CAAC,CAAC;IAClB,CAAC,CAAC;IAEF,GAAG,CAAC,GAAG,CAAC,OAAO,EAAE,UAAU,CAAC,EAAE,CAAC,OAAO,CAAC,UAAU,CAAC,CAAC,CAAC;IACpD,QAAQ,CAAC,OAAO,CAAC,OAAO,CAAC,CAAC;IAE1B;;;;;SAKE;IACF,MAAM,aAAa,GAAG,UAAU,CAAC,GAAG,EAAE,CAAC,OAAO,CAAC,KAAK,CAAC,EAAE,oBAAoB,CAAC,CAAC;IAE7E,UAAU;IACV,OAAO,GAAG,EAAE;QACV,YAAY,CAAC,aAAa,CAAC,CAAC;QAC5B,GAAG,CAAC,MAAM,CAAC,OAAO,CAAC,CAAC;QACpB,QAAQ,CAAC,SAAS,CAAC,OAAO,CAAC,CAAC;IAC9B,CAAC,CAAC;AACJ,CAAC;AAED,SAAS,0BAA0B,CAAC,QAAsC;IACxE,IAAI,OAAO,oBAAoB,KAAK,WAAW,EAAE;QAC/C,OAAO;YACL,OAAO,EAAE,GAAG,EAAE,GAAE,CAAC;YACjB,SAAS,EAAE,GAAG,EAAE,GAAE,CAAC;SACpB,CAAC;KACH;IACD,OAAO,IAAI,oBAAoB,CAAC,QAAQ,CAAC,CAAC;AAC5C,CAAC;AAED,MAAM,QAAQ,GAAG,0BAA0B,CAAC,SAAS,oBAAoB,CAAC,OAAO;;IAC/E,KAAK,MAAM,KAAK,IAAI,OAAO,EAAE;QAC3B,QAAQ,CAAC,SAAS,CAAC,KAAK,CAAC,MAAM,CAAC,CAAC,CAAC,+DAA+D;QACjG,MAAA,GAAG,CAAC,GAAG,CAAC,KAAK,CAAC,MAAM,CAAC,0CAAG,KAAK,CAAC,cAAc,CAAC,CAAC;QAC9C,GAAG,CAAC,MAAM,CAAC,KAAK,CAAC,MAAM,CAAC,CAAC;KAC1B;AACH,CAAC,CAAC,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\n\ntype Callback = (inViewport: boolean) => void;\nconst map = new WeakMap<Element, Callback>();\n\nconst MANUAL_TRIGGER_DELAY = 150;\n\n/**\n * This function determines whether an element is in the viewport. The callback\n * is batched with other elements that also use this function, in order to improve\n * performance.\n */\nexport function isInViewport(element: Element, callback: Callback) {\n  let resolve = (value: boolean) => {\n    resolve = () => {}; // Prevent multiple execution\n    callback(value);\n  };\n\n  map.set(element, inViewport => resolve(inViewport));\n  observer.observe(element);\n\n  /*\n\t If the IntersectionObserver does not fire in reasonable time (for example\n\t in a background page in Chrome), we need to call the callback manually.\n  \n\t See https://issues.chromium.org/issues/41383759\n\t */\n  const timeoutHandle = setTimeout(() => resolve(false), MANUAL_TRIGGER_DELAY);\n\n  // Cleanup\n  return () => {\n    clearTimeout(timeoutHandle);\n    map.delete(element);\n    observer.unobserve(element);\n  };\n}\n\nfunction createIntersectionObserver(callback: IntersectionObserverCallback) {\n  if (typeof IntersectionObserver === 'undefined') {\n    return {\n      observe: () => {},\n      unobserve: () => {},\n    };\n  }\n  return new IntersectionObserver(callback);\n}\n\nconst observer = createIntersectionObserver(function isInViewportObserver(entries) {\n  for (const entry of entries) {\n    observer.unobserve(entry.target); // We only want the first run of the observer for each element.\n    map.get(entry.target)?.(entry.isIntersecting);\n    map.delete(entry.target);\n  }\n});\n"]}

package/lib/internal/template/key-value-pairs/interfaces.d.ts

@@ -53,7 +53,7 @@ export declare namespace KeyValuePairsProps {
     }
     interface Pair extends BaseComponentProps {
         type?: 'pair';
-        label: string;
+        label: React.ReactNode;
         value: React.ReactNode;
         info?: React.ReactNode;
     }

package/lib/internal/template/key-value-pairs/interfaces.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"interfaces.d.ts","sourceRoot":"","sources":["../../../src/key-value-pairs/interfaces.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAE,kBAAkB,EAAE,MAAM,4BAA4B,CAAC;AAEhE,MAAM,WAAW,kBAAmB,SAAQ,kBAAkB;IAC5D;;;OAGG;IACH,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB;;;;;;;;;;;;;;;;OAgBG;IACH,KAAK,EAAE,aAAa,CAAC,kBAAkB,CAAC,IAAI,CAAC,CAAC;IAC9C;;;OAGG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB;;;;OAIG;IACH,cAAc,CAAC,EAAE,MAAM,CAAC;IAExB;;;;;;OAMG;IACH,cAAc,CAAC,EAAE,MAAM,CAAC;CACzB;AAED,yBAAiB,kBAAkB,CAAC;IAClC,KAAY,IAAI,GAAG,KAAK,GAAG,IAAI,CAAC;IAEhC,UAAiB,KAAK;QACpB,IAAI,EAAE,OAAO,CAAC;QACd,KAAK,CAAC,EAAE,MAAM,CAAC;QACf,KAAK,EAAE,aAAa,CAAC,IAAI,CAAC,CAAC;KAC5B;IAED,UAAiB,IAAK,SAAQ,kBAAkB;QAC9C,IAAI,CAAC,EAAE,MAAM,CAAC;QACd,KAAK,EAAE,MAAM,CAAC;QACd,KAAK,EAAE,KAAK,CAAC,SAAS,CAAC;QACvB,IAAI,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;KACxB;CACF"}
+{"version":3,"file":"interfaces.d.ts","sourceRoot":"","sources":["../../../src/key-value-pairs/interfaces.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAE,kBAAkB,EAAE,MAAM,4BAA4B,CAAC;AAEhE,MAAM,WAAW,kBAAmB,SAAQ,kBAAkB;IAC5D;;;OAGG;IACH,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB;;;;;;;;;;;;;;;;OAgBG;IACH,KAAK,EAAE,aAAa,CAAC,kBAAkB,CAAC,IAAI,CAAC,CAAC;IAC9C;;;OAGG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB;;;;OAIG;IACH,cAAc,CAAC,EAAE,MAAM,CAAC;IAExB;;;;;;OAMG;IACH,cAAc,CAAC,EAAE,MAAM,CAAC;CACzB;AAED,yBAAiB,kBAAkB,CAAC;IAClC,KAAY,IAAI,GAAG,KAAK,GAAG,IAAI,CAAC;IAEhC,UAAiB,KAAK;QACpB,IAAI,EAAE,OAAO,CAAC;QACd,KAAK,CAAC,EAAE,MAAM,CAAC;QACf,KAAK,EAAE,aAAa,CAAC,IAAI,CAAC,CAAC;KAC5B;IAED,UAAiB,IAAK,SAAQ,kBAAkB;QAC9C,IAAI,CAAC,EAAE,MAAM,CAAC;QACd,KAAK,EAAE,KAAK,CAAC,SAAS,CAAC;QACvB,KAAK,EAAE,KAAK,CAAC,SAAS,CAAC;QACvB,IAAI,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;KACxB;CACF"}

package/lib/internal/template/key-value-pairs/interfaces.js.map

@@ -1 +1 @@
-{"version":3,"file":"interfaces.js","sourceRoot":"","sources":["../../../src/key-value-pairs/interfaces.ts"],"names":[],"mappings":"","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React from 'react';\n\nimport { BaseComponentProps } from '../internal/base-component';\n\nexport interface KeyValuePairsProps extends BaseComponentProps {\n  /**\n   * Specifies the number of columns in each grid row.\n   * Valid values are any integer between 1 and 4. It defaults to 1.\n   */\n  columns?: number;\n  /**\n   * An array of either key-value pairs individual items or groups.\n   * They could be combined.\n   * Each item has `type` prop, which might be either `group` or `pair`. Defaults to `pair` if not specified.\n   *\n   * Each key-value pair definition has the following properties:\n   *   * `type` (string) - (Optional) Item type (pair).\n   *   * `label` (string) - The key label.\n   *   * `info` (React.ReactNode) - (Optional) Area next to the key to display an info link.\n   *   * `value` (React.ReactNode) - The corresponding value for the key.\n   *\n   * Each group definition has the following properties:\n   *   * `type` (string) - Item type (group).\n   *   * `title` (string) - (Optional) An optional title for this column.\n   *   * `items` (ReadonlyArray<KeyValuePairProps.KeyValuePair>) - An array of\n   *     key-value pair items.\n   */\n  items: ReadonlyArray<KeyValuePairsProps.Item>;\n  /**\n   * Provides an `aria-label` to the Key-value pairs container.\n   * Don't use `ariaLabel` and `ariaLabelledby` at the same time.\n   */\n  ariaLabel?: string;\n  /**\n   * Sets the `aria-labelledby` property on the Key-value pairs container.\n   * If there's a visible label element that you can reference, use this instead of `ariaLabel`.\n   * Don't use `ariaLabel` and `ariaLabelledby` at the same time.\n   */\n  ariaLabelledby?: string;\n\n  /**\n   * Use to specify the desired minimum width for each column in pixels.\n   *\n   * The number of columns is determined by the value of this property, the available space,\n   * and the maximum number of columns as defined by the `columns` property.\n   * If not set, defaults to 150.\n   */\n  minColumnWidth?: number;\n}\n\nexport namespace KeyValuePairsProps {\n  export type Item = Group | Pair;\n\n  export interface Group {\n    type: 'group';\n    title?: string;\n    items: ReadonlyArray<Pair>;\n  }\n\n  export interface Pair extends BaseComponentProps {\n    type?: 'pair';\n    label: string;\n    value: React.ReactNode;\n    info?: React.ReactNode;\n  }\n}\n"]}
+{"version":3,"file":"interfaces.js","sourceRoot":"","sources":["../../../src/key-value-pairs/interfaces.ts"],"names":[],"mappings":"","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React from 'react';\n\nimport { BaseComponentProps } from '../internal/base-component';\n\nexport interface KeyValuePairsProps extends BaseComponentProps {\n  /**\n   * Specifies the number of columns in each grid row.\n   * Valid values are any integer between 1 and 4. It defaults to 1.\n   */\n  columns?: number;\n  /**\n   * An array of either key-value pairs individual items or groups.\n   * They could be combined.\n   * Each item has `type` prop, which might be either `group` or `pair`. Defaults to `pair` if not specified.\n   *\n   * Each key-value pair definition has the following properties:\n   *   * `type` (string) - (Optional) Item type (pair).\n   *   * `label` (string) - The key label.\n   *   * `info` (React.ReactNode) - (Optional) Area next to the key to display an info link.\n   *   * `value` (React.ReactNode) - The corresponding value for the key.\n   *\n   * Each group definition has the following properties:\n   *   * `type` (string) - Item type (group).\n   *   * `title` (string) - (Optional) An optional title for this column.\n   *   * `items` (ReadonlyArray<KeyValuePairProps.KeyValuePair>) - An array of\n   *     key-value pair items.\n   */\n  items: ReadonlyArray<KeyValuePairsProps.Item>;\n  /**\n   * Provides an `aria-label` to the Key-value pairs container.\n   * Don't use `ariaLabel` and `ariaLabelledby` at the same time.\n   */\n  ariaLabel?: string;\n  /**\n   * Sets the `aria-labelledby` property on the Key-value pairs container.\n   * If there's a visible label element that you can reference, use this instead of `ariaLabel`.\n   * Don't use `ariaLabel` and `ariaLabelledby` at the same time.\n   */\n  ariaLabelledby?: string;\n\n  /**\n   * Use to specify the desired minimum width for each column in pixels.\n   *\n   * The number of columns is determined by the value of this property, the available space,\n   * and the maximum number of columns as defined by the `columns` property.\n   * If not set, defaults to 150.\n   */\n  minColumnWidth?: number;\n}\n\nexport namespace KeyValuePairsProps {\n  export type Item = Group | Pair;\n\n  export interface Group {\n    type: 'group';\n    title?: string;\n    items: ReadonlyArray<Pair>;\n  }\n\n  export interface Pair extends BaseComponentProps {\n    type?: 'pair';\n    label: React.ReactNode;\n    value: React.ReactNode;\n    info?: React.ReactNode;\n  }\n}\n"]}

package/lib/internal/template/key-value-pairs/styles.css.js

@@ -1,13 +1,13 @@
 
     import './styles.scoped.css';
     export default {
-  "key-value-pairs": "awsui_key-value-pairs_1y9fy_z8tgn_145",
-  "group-title": "awsui_group-title_1y9fy_z8tgn_177",
-  "group-list": "awsui_group-list_1y9fy_z8tgn_181",
-  "group-list-item": "awsui_group-list-item_1y9fy_z8tgn_191",
-  "term": "awsui_term_1y9fy_z8tgn_195",
-  "key-label": "awsui_key-label_1y9fy_z8tgn_203",
-  "detail": "awsui_detail_1y9fy_z8tgn_211",
-  "info": "awsui_info_1y9fy_z8tgn_246"
+  "key-value-pairs": "awsui_key-value-pairs_1y9fy_gscxd_145",
+  "group-title": "awsui_group-title_1y9fy_gscxd_177",
+  "group-list": "awsui_group-list_1y9fy_gscxd_181",
+  "group-list-item": "awsui_group-list-item_1y9fy_gscxd_191",
+  "term": "awsui_term_1y9fy_gscxd_195",
+  "key-label": "awsui_key-label_1y9fy_gscxd_203",
+  "detail": "awsui_detail_1y9fy_gscxd_212",
+  "info": "awsui_info_1y9fy_gscxd_247"
 };
   

package/lib/internal/template/key-value-pairs/styles.scoped.css

@@ -142,7 +142,7 @@
 */
 /* Style used for links in slots/components that are text heavy, to help links stand out among
 surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F73#description */
-.awsui_key-value-pairs_1y9fy_z8tgn_145:not(#\9) {
+.awsui_key-value-pairs_1y9fy_gscxd_145:not(#\9) {
   border-collapse: separate;
   border-spacing: 0;
   box-sizing: border-box;
@@ -175,11 +175,11 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
   -moz-osx-font-smoothing: auto;
 }
 
-.awsui_group-title_1y9fy_z8tgn_177:not(#\9) {
+.awsui_group-title_1y9fy_gscxd_177:not(#\9) {
   padding-block-end: var(--space-scaled-m-3uxq9h, 16px);
 }
 
-.awsui_group-list_1y9fy_z8tgn_181:not(#\9) {
+.awsui_group-list_1y9fy_gscxd_181:not(#\9) {
   margin-block-start: 0;
   margin-block-end: 0;
   margin-inline-start: 0;
@@ -189,11 +189,11 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
   row-gap: var(--space-scaled-m-3uxq9h, 16px);
 }
 
-.awsui_group-list-item_1y9fy_z8tgn_191:not(#\9) {
+.awsui_group-list-item_1y9fy_gscxd_191:not(#\9) {
   /* used in test-utils */
 }
 
-.awsui_term_1y9fy_z8tgn_195:not(#\9) {
+.awsui_term_1y9fy_gscxd_195:not(#\9) {
   font-size: var(--font-size-body-m-6wxxs5, 14px);
   line-height: var(--line-height-body-m-gw0130, 22px);
   font-weight: var(--font-display-label-weight-5p8eav, 400);
@@ -201,15 +201,16 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
   margin-block-end: var(--space-key-value-gap-v0snfq, 2px);
 }
 
-.awsui_key-label_1y9fy_z8tgn_203:not(#\9) {
+.awsui_key-label_1y9fy_gscxd_203:not(#\9) {
+  display: inline-flex;
   margin-inline-end: var(--space-xs-6dgkww, 8px);
 }
-.awsui_key-label_1y9fy_z8tgn_203:not(#\9):only-child {
+.awsui_key-label_1y9fy_gscxd_203:not(#\9):only-child {
   margin-block: 0;
   margin-inline: 0;
 }
 
-.awsui_detail_1y9fy_z8tgn_211:not(#\9) {
+.awsui_detail_1y9fy_gscxd_212:not(#\9) {
   border-collapse: separate;
   border-spacing: 0;
   box-sizing: border-box;
@@ -245,7 +246,7 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
   margin-block-end: 0;
 }
 
-.awsui_info_1y9fy_z8tgn_246:not(#\9) {
+.awsui_info_1y9fy_gscxd_247:not(#\9) {
   display: inline-flex;
   padding-inline-start: var(--space-xs-6dgkww, 8px);
   border-inline-start: var(--border-divider-section-width-iueskx, 1px) solid var(--color-border-divider-default-u5ytia, #eaeded);

package/lib/internal/template/key-value-pairs/styles.selectors.js

@@ -2,13 +2,13 @@
     // es-module interop with Babel and Typescript
     Object.defineProperty(exports, "__esModule", { value: true });
     module.exports.default = {
-  "key-value-pairs": "awsui_key-value-pairs_1y9fy_z8tgn_145",
-  "group-title": "awsui_group-title_1y9fy_z8tgn_177",
-  "group-list": "awsui_group-list_1y9fy_z8tgn_181",
-  "group-list-item": "awsui_group-list-item_1y9fy_z8tgn_191",
-  "term": "awsui_term_1y9fy_z8tgn_195",
-  "key-label": "awsui_key-label_1y9fy_z8tgn_203",
-  "detail": "awsui_detail_1y9fy_z8tgn_211",
-  "info": "awsui_info_1y9fy_z8tgn_246"
+  "key-value-pairs": "awsui_key-value-pairs_1y9fy_gscxd_145",
+  "group-title": "awsui_group-title_1y9fy_gscxd_177",
+  "group-list": "awsui_group-list_1y9fy_gscxd_181",
+  "group-list-item": "awsui_group-list-item_1y9fy_gscxd_191",
+  "term": "awsui_term_1y9fy_gscxd_195",
+  "key-label": "awsui_key-label_1y9fy_gscxd_203",
+  "detail": "awsui_detail_1y9fy_gscxd_212",
+  "info": "awsui_info_1y9fy_gscxd_247"
 };
   

package/lib/internal/template/multiselect/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/multiselect/index.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,MAAM,OAAO,CAAC;AAO1B,OAAO,EAAE,gBAAgB,EAAE,MAAM,cAAc,CAAC;AAKhD,OAAO,EAAE,gBAAgB,EAAE,CAAC;AAE5B,QAAA,MAAM,WAAW,+FAsDhB,CAAC;AAGF,eAAe,WAAW,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/multiselect/index.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,MAAM,OAAO,CAAC;AAO1B,OAAO,EAAE,gBAAgB,EAAE,MAAM,cAAc,CAAC;AAKhD,OAAO,EAAE,gBAAgB,EAAE,CAAC;AAE5B,QAAA,MAAM,WAAW,+FAuDhB,CAAC;AAGF,eAAe,WAAW,CAAC"}

package/lib/internal/template/multiselect/index.js

@@ -20,6 +20,7 @@ const Multiselect = React.forwardRef((_a, ref) => {
             tokenLimit: restProps.tokenLimit,
             virtualScroll: restProps.virtualScroll,
             readOnly: restProps.readOnly,
+            enableSelectAll: restProps.enableSelectAll,
         },
         metadata: {
             hasDisabledReasons: options.some(option => Boolean(option.disabledReason)),

package/lib/internal/template/multiselect/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/multiselect/index.tsx"],"names":[],"mappings":";AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAE,6BAA6B,EAAE,MAAM,kEAAkE,CAAC;AAEjH,OAAO,gBAAgB,MAAM,sCAAsC,CAAC;AACpE,OAAO,EAAE,gBAAgB,EAAE,MAAM,sCAAsC,CAAC;AAGxE,OAAO,mBAAmB,MAAM,YAAY,CAAC;AAE7C,OAAO,+BAA+B,MAAM,wEAAwE,CAAC;AAIrH,MAAM,WAAW,GAAG,KAAK,CAAC,UAAU,CAClC,CACE,EAQmB,EACnB,GAAoC,EACpC,EAAE;QAVF,EACE,OAAO,GAAG,EAAE,EACZ,aAAa,GAAG,MAAM,EACtB,UAAU,GAAG,UAAU,EACvB,eAAe,GAAG,EAAE,EACpB,QAAQ,GAAG,IAAI,EACf,UAAU,GAAG,KAAK,OAED,EADd,SAAS,cAPd,uFAQC,CADa;IAId,MAAM,kBAAkB,GAAG,gBAAgB,CAAC,aAAa,EAAE;QACzD,KAAK,EAAE;YACL,YAAY,EAAE,SAAS,CAAC,YAAY;YACpC,SAAS,EAAE,SAAS,CAAC,SAAS;YAC9B,gBAAgB,EAAE,SAAS,CAAC,gBAAgB;YAC5C,aAAa;YACb,UAAU;YACV,QAAQ;YACR,UAAU,EAAE,SAAS,CAAC,UAAU;YAChC,aAAa,EAAE,SAAS,CAAC,aAAa;YACtC,QAAQ,EAAE,SAAS,CAAC,QAAQ;SAC7B;QACD,QAAQ,EAAE;YACR,kBAAkB,EAAE,OAAO,CAAC,IAAI,CAAC,MAAM,CAAC,EAAE,CAAC,OAAO,CAAC,MAAM,CAAC,cAAc,CAAC,CAAC;SAC3E;KACF,CAAC,CAAC;IAEH,MAAM,0BAA0B,GAAmD;QACjF,IAAI,EAAE,mBAAmB;QACzB,KAAK,EAAE,IAAI,+BAA+B,CAAC,gBAAgB,CAAC,EAAE;QAC9D,UAAU,EAAE;YACV,QAAQ,EAAE,GAAG,CAAC,CAAC,SAAS,CAAC,QAAQ,EAAE;YACnC,oBAAoB,EAAE,GAAG,eAAe,CAAC,MAAM,EAAE;SAClD;KACF,CAAC;IAEF,OAAO,CACL,oBAAC,mBAAmB,kBAClB,OAAO,EAAE,OAAO,EAChB,aAAa,EAAE,aAAa,EAC5B,UAAU,EAAE,UAAU,EACtB,eAAe,EAAE,eAAe,EAChC,QAAQ,EAAE,QAAQ,EAClB,UAAU,EAAE,UAAU,IAClB,SAAS,EACT,kBAAkB,IACtB,GAAG,EAAE,GAAG,IACJ,6BAA6B,CAAC,EAAE,SAAS,EAAE,0BAA0B,EAAE,CAAC,EAC5E,CACH,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,gBAAgB,CAAC,WAAW,EAAE,aAAa,CAAC,CAAC;AAC7C,eAAe,WAAW,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React from 'react';\n\nimport { getAnalyticsMetadataAttribute } from '@cloudscape-design/component-toolkit/internal/analytics-metadata';\n\nimport useBaseComponent from '../internal/hooks/use-base-component';\nimport { applyDisplayName } from '../internal/utils/apply-display-name';\nimport { GeneratedAnalyticsMetadataMultiselectComponent } from './analytics-metadata/interfaces';\nimport { MultiselectProps } from './interfaces';\nimport InternalMultiselect from './internal';\n\nimport buttonTriggerAnalyticsSelectors from '../internal/components/button-trigger/analytics-metadata/styles.css.js';\n\nexport { MultiselectProps };\n\nconst Multiselect = React.forwardRef(\n  (\n    {\n      options = [],\n      filteringType = 'none',\n      statusType = 'finished',\n      selectedOptions = [],\n      keepOpen = true,\n      hideTokens = false,\n      ...restProps\n    }: MultiselectProps,\n    ref: React.Ref<MultiselectProps.Ref>\n  ) => {\n    const baseComponentProps = useBaseComponent('Multiselect', {\n      props: {\n        inlineTokens: restProps.inlineTokens,\n        autoFocus: restProps.autoFocus,\n        expandToViewport: restProps.expandToViewport,\n        filteringType,\n        hideTokens,\n        keepOpen,\n        tokenLimit: restProps.tokenLimit,\n        virtualScroll: restProps.virtualScroll,\n        readOnly: restProps.readOnly,\n      },\n      metadata: {\n        hasDisabledReasons: options.some(option => Boolean(option.disabledReason)),\n      },\n    });\n\n    const componentAnalyticsMetadata: GeneratedAnalyticsMetadataMultiselectComponent = {\n      name: 'awsui.Multiselect',\n      label: `.${buttonTriggerAnalyticsSelectors['button-trigger']}`,\n      properties: {\n        disabled: `${!!restProps.disabled}`,\n        selectedOptionsCount: `${selectedOptions.length}`,\n      },\n    };\n\n    return (\n      <InternalMultiselect\n        options={options}\n        filteringType={filteringType}\n        statusType={statusType}\n        selectedOptions={selectedOptions}\n        keepOpen={keepOpen}\n        hideTokens={hideTokens}\n        {...restProps}\n        {...baseComponentProps}\n        ref={ref}\n        {...getAnalyticsMetadataAttribute({ component: componentAnalyticsMetadata })}\n      />\n    );\n  }\n);\n\napplyDisplayName(Multiselect, 'Multiselect');\nexport default Multiselect;\n"]}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/multiselect/index.tsx"],"names":[],"mappings":";AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAE,6BAA6B,EAAE,MAAM,kEAAkE,CAAC;AAEjH,OAAO,gBAAgB,MAAM,sCAAsC,CAAC;AACpE,OAAO,EAAE,gBAAgB,EAAE,MAAM,sCAAsC,CAAC;AAGxE,OAAO,mBAAmB,MAAM,YAAY,CAAC;AAE7C,OAAO,+BAA+B,MAAM,wEAAwE,CAAC;AAIrH,MAAM,WAAW,GAAG,KAAK,CAAC,UAAU,CAClC,CACE,EAQmB,EACnB,GAAoC,EACpC,EAAE;QAVF,EACE,OAAO,GAAG,EAAE,EACZ,aAAa,GAAG,MAAM,EACtB,UAAU,GAAG,UAAU,EACvB,eAAe,GAAG,EAAE,EACpB,QAAQ,GAAG,IAAI,EACf,UAAU,GAAG,KAAK,OAED,EADd,SAAS,cAPd,uFAQC,CADa;IAId,MAAM,kBAAkB,GAAG,gBAAgB,CAAC,aAAa,EAAE;QACzD,KAAK,EAAE;YACL,YAAY,EAAE,SAAS,CAAC,YAAY;YACpC,SAAS,EAAE,SAAS,CAAC,SAAS;YAC9B,gBAAgB,EAAE,SAAS,CAAC,gBAAgB;YAC5C,aAAa;YACb,UAAU;YACV,QAAQ;YACR,UAAU,EAAE,SAAS,CAAC,UAAU;YAChC,aAAa,EAAE,SAAS,CAAC,aAAa;YACtC,QAAQ,EAAE,SAAS,CAAC,QAAQ;YAC5B,eAAe,EAAE,SAAS,CAAC,eAAe;SAC3C;QACD,QAAQ,EAAE;YACR,kBAAkB,EAAE,OAAO,CAAC,IAAI,CAAC,MAAM,CAAC,EAAE,CAAC,OAAO,CAAC,MAAM,CAAC,cAAc,CAAC,CAAC;SAC3E;KACF,CAAC,CAAC;IAEH,MAAM,0BAA0B,GAAmD;QACjF,IAAI,EAAE,mBAAmB;QACzB,KAAK,EAAE,IAAI,+BAA+B,CAAC,gBAAgB,CAAC,EAAE;QAC9D,UAAU,EAAE;YACV,QAAQ,EAAE,GAAG,CAAC,CAAC,SAAS,CAAC,QAAQ,EAAE;YACnC,oBAAoB,EAAE,GAAG,eAAe,CAAC,MAAM,EAAE;SAClD;KACF,CAAC;IAEF,OAAO,CACL,oBAAC,mBAAmB,kBAClB,OAAO,EAAE,OAAO,EAChB,aAAa,EAAE,aAAa,EAC5B,UAAU,EAAE,UAAU,EACtB,eAAe,EAAE,eAAe,EAChC,QAAQ,EAAE,QAAQ,EAClB,UAAU,EAAE,UAAU,IAClB,SAAS,EACT,kBAAkB,IACtB,GAAG,EAAE,GAAG,IACJ,6BAA6B,CAAC,EAAE,SAAS,EAAE,0BAA0B,EAAE,CAAC,EAC5E,CACH,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,gBAAgB,CAAC,WAAW,EAAE,aAAa,CAAC,CAAC;AAC7C,eAAe,WAAW,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React from 'react';\n\nimport { getAnalyticsMetadataAttribute } from '@cloudscape-design/component-toolkit/internal/analytics-metadata';\n\nimport useBaseComponent from '../internal/hooks/use-base-component';\nimport { applyDisplayName } from '../internal/utils/apply-display-name';\nimport { GeneratedAnalyticsMetadataMultiselectComponent } from './analytics-metadata/interfaces';\nimport { MultiselectProps } from './interfaces';\nimport InternalMultiselect from './internal';\n\nimport buttonTriggerAnalyticsSelectors from '../internal/components/button-trigger/analytics-metadata/styles.css.js';\n\nexport { MultiselectProps };\n\nconst Multiselect = React.forwardRef(\n  (\n    {\n      options = [],\n      filteringType = 'none',\n      statusType = 'finished',\n      selectedOptions = [],\n      keepOpen = true,\n      hideTokens = false,\n      ...restProps\n    }: MultiselectProps,\n    ref: React.Ref<MultiselectProps.Ref>\n  ) => {\n    const baseComponentProps = useBaseComponent('Multiselect', {\n      props: {\n        inlineTokens: restProps.inlineTokens,\n        autoFocus: restProps.autoFocus,\n        expandToViewport: restProps.expandToViewport,\n        filteringType,\n        hideTokens,\n        keepOpen,\n        tokenLimit: restProps.tokenLimit,\n        virtualScroll: restProps.virtualScroll,\n        readOnly: restProps.readOnly,\n        enableSelectAll: restProps.enableSelectAll,\n      },\n      metadata: {\n        hasDisabledReasons: options.some(option => Boolean(option.disabledReason)),\n      },\n    });\n\n    const componentAnalyticsMetadata: GeneratedAnalyticsMetadataMultiselectComponent = {\n      name: 'awsui.Multiselect',\n      label: `.${buttonTriggerAnalyticsSelectors['button-trigger']}`,\n      properties: {\n        disabled: `${!!restProps.disabled}`,\n        selectedOptionsCount: `${selectedOptions.length}`,\n      },\n    };\n\n    return (\n      <InternalMultiselect\n        options={options}\n        filteringType={filteringType}\n        statusType={statusType}\n        selectedOptions={selectedOptions}\n        keepOpen={keepOpen}\n        hideTokens={hideTokens}\n        {...restProps}\n        {...baseComponentProps}\n        ref={ref}\n        {...getAnalyticsMetadataAttribute({ component: componentAnalyticsMetadata })}\n      />\n    );\n  }\n);\n\napplyDisplayName(Multiselect, 'Multiselect');\nexport default Multiselect;\n"]}

package/lib/internal/template/multiselect/internal.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"internal.d.ts","sourceRoot":"","sources":["../../../src/multiselect/internal.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAmB,MAAM,OAAO,CAAC;AASxC,OAAO,EAAE,0BAA0B,EAAE,MAAM,+CAA+C,CAAC;AAU3F,OAAO,EAAE,gBAAgB,EAAE,MAAM,cAAc,CAAC;AAWhD,QAAA,MAAM,mBAAmB;;;;;;;gFA+KxB,CAAC;AAEF,eAAe,mBAAmB,CAAC"}
+{"version":3,"file":"internal.d.ts","sourceRoot":"","sources":["../../../src/multiselect/internal.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAmB,MAAM,OAAO,CAAC;AASxC,OAAO,EAAE,0BAA0B,EAAE,MAAM,+CAA+C,CAAC;AAU3F,OAAO,EAAE,gBAAgB,EAAE,MAAM,cAAc,CAAC;AAWhD,QAAA,MAAM,mBAAmB;;;;;;;gFAgLxB,CAAC;AAEF,eAAe,mBAAmB,CAAC"}

package/lib/internal/template/multiselect/internal.js

@@ -64,9 +64,10 @@ const InternalMultiselect = React.forwardRef((_a, externalRef) => {
     };
     const dropdownStatus = multiselectProps.dropdownStatus;
     const dropdownProps = multiselectProps.getDropdownProps();
+    const hasFilteredOptions = multiselectProps.filteredOptions.length > 0;
     return (React.createElement("div", Object.assign({}, baseProps, { ref: __internalRootRef, className: clsx(styles.root, baseProps.className) }, multiselectProps.getWrapperProps()),
         React.createElement(Dropdown, Object.assign({}, dropdownProps, { ariaLabelledby: dropdownProps.dropdownContentRole ? joinStrings(ariaLabelId, controlId) : undefined, ariaDescribedby: dropdownProps.dropdownContentRole ? (dropdownStatus.content ? footerId : undefined) : undefined, open: multiselectProps.isOpen, trigger: trigger, header: filter, footer: dropdownStatus.isSticky ? (React.createElement(DropdownFooter, { content: multiselectProps.isOpen ? dropdownStatus.content : null, id: footerId })) : null, expandToViewport: expandToViewport, stretchBeyondTriggerWidth: true }),
-            React.createElement(ListComponent, { listBottom: !dropdownStatus.isSticky ? (React.createElement(DropdownFooter, { content: multiselectProps.isOpen ? dropdownStatus.content : null, id: footerId })) : null, menuProps: multiselectProps.getMenuProps(), getOptionProps: multiselectProps.getOptionProps, filteredOptions: multiselectProps.filteredOptions, filteringValue: filteringValue, ref: multiselectProps.scrollToIndex, hasDropdownStatus: dropdownStatus.content !== null, checkboxes: true, useInteractiveGroups: true, screenReaderContent: multiselectProps.announcement, highlightType: multiselectProps.highlightType, firstOptionSticky: enableSelectAll })),
+            React.createElement(ListComponent, { listBottom: !dropdownStatus.isSticky ? (React.createElement(DropdownFooter, { content: multiselectProps.isOpen ? dropdownStatus.content : null, id: footerId })) : null, menuProps: multiselectProps.getMenuProps(), getOptionProps: multiselectProps.getOptionProps, filteredOptions: multiselectProps.filteredOptions, filteringValue: filteringValue, ref: multiselectProps.scrollToIndex, hasDropdownStatus: dropdownStatus.content !== null, checkboxes: true, useInteractiveGroups: true, screenReaderContent: multiselectProps.announcement, highlightType: multiselectProps.highlightType, firstOptionSticky: hasFilteredOptions && enableSelectAll })),
         showTokens && (React.createElement(InternalTokenGroup, Object.assign({}, multiselectProps.getTokenProps(), { className: styles.tokens, alignment: "horizontal", limit: tokenLimit, items: tokens, i18nStrings: tokenGroupI18nStrings, limitShowMoreAriaLabel: tokenLimitShowMoreAriaLabel, limitShowFewerAriaLabel: tokenLimitShowFewerAriaLabel, disableOuterPadding: true, readOnly: readOnly }))),
         React.createElement(ScreenreaderOnly, { id: ariaLabelId }, ariaLabel)));
 });

package/lib/internal/template/multiselect/internal.js.map

@@ -1 +1 @@
-{"version":3,"file":"internal.js","sourceRoot":"","sources":["../../../src/multiselect/internal.tsx"],"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, { useState } from 'react';\nimport clsx from 'clsx';\n\nimport { useInternalI18n } from '../i18n/context';\nimport { getBaseProps } from '../internal/base-component';\nimport Dropdown from '../internal/components/dropdown';\nimport DropdownFooter from '../internal/components/dropdown-footer/index.js';\nimport ScreenreaderOnly from '../internal/components/screenreader-only';\nimport { useFormFieldContext } from '../internal/context/form-field-context';\nimport { InternalBaseComponentProps } from '../internal/hooks/use-base-component/index.js';\nimport { useUniqueId } from '../internal/hooks/use-unique-id';\nimport { SomeRequired } from '../internal/types';\nimport { joinStrings } from '../internal/utils/strings';\nimport Filter from '../select/parts/filter';\nimport PlainList from '../select/parts/plain-list';\nimport Trigger from '../select/parts/trigger';\nimport VirtualList from '../select/parts/virtual-list';\nimport { TokenGroupProps } from '../token-group/interfaces';\nimport InternalTokenGroup from '../token-group/internal';\nimport { MultiselectProps } from './interfaces';\nimport { useMultiselect } from './use-multiselect';\n\nimport styles from './styles.css.js';\n\ntype InternalMultiselectProps = SomeRequired<\n  MultiselectProps,\n  'options' | 'selectedOptions' | 'filteringType' | 'statusType' | 'keepOpen' | 'hideTokens'\n> &\n  InternalBaseComponentProps;\n\nconst InternalMultiselect = React.forwardRef(\n  (\n    {\n      options,\n      filteringType,\n      filteringPlaceholder,\n      filteringAriaLabel,\n      filteringClearAriaLabel,\n      ariaRequired,\n      placeholder,\n      disabled,\n      readOnly,\n      ariaLabel,\n      selectedOptions,\n      deselectAriaLabel,\n      tokenLimit,\n      i18nStrings,\n      virtualScroll,\n      inlineTokens = false,\n      hideTokens,\n      expandToViewport,\n      tokenLimitShowFewerAriaLabel,\n      tokenLimitShowMoreAriaLabel,\n      __internalRootRef = null,\n      autoFocus,\n      enableSelectAll,\n      ...restProps\n    }: InternalMultiselectProps,\n    externalRef: React.Ref<MultiselectProps.Ref>\n  ) => {\n    const baseProps = getBaseProps(restProps);\n    const formFieldContext = useFormFieldContext(restProps);\n    const i18n = useInternalI18n('multiselect');\n\n    const selfControlId = useUniqueId('trigger');\n    const controlId = formFieldContext.controlId ?? selfControlId;\n    const ariaLabelId = useUniqueId('multiselect-ariaLabel-');\n    const footerId = useUniqueId('multiselect-footer-');\n\n    const [filteringValue, setFilteringValue] = useState('');\n    const multiselectProps = useMultiselect({\n      options,\n      selectedOptions,\n      filteringType,\n      disabled,\n      deselectAriaLabel,\n      controlId,\n      ariaLabelId,\n      footerId,\n      filteringValue,\n      setFilteringValue,\n      externalRef,\n      enableSelectAll,\n      i18nStrings,\n      ...restProps,\n    });\n\n    const filter = (\n      <Filter\n        clearAriaLabel={filteringClearAriaLabel}\n        filteringType={filteringType}\n        placeholder={filteringPlaceholder}\n        ariaLabel={filteringAriaLabel}\n        ariaRequired={ariaRequired}\n        value={filteringValue}\n        {...multiselectProps.getFilterProps()}\n      />\n    );\n\n    const trigger = (\n      <Trigger\n        placeholder={placeholder}\n        disabled={disabled}\n        readOnly={readOnly}\n        triggerProps={multiselectProps.getTriggerProps(disabled, autoFocus)}\n        selectedOption={null}\n        selectedOptions={selectedOptions}\n        triggerVariant={inlineTokens ? 'tokens' : 'placeholder'}\n        isOpen={multiselectProps.isOpen}\n        {...formFieldContext}\n        controlId={controlId}\n        ariaLabelledby={joinStrings(formFieldContext.ariaLabelledby, ariaLabelId)}\n      />\n    );\n\n    const tokens: TokenGroupProps['items'] = selectedOptions.map(option => ({\n      label: option.label,\n      disabled: disabled || option.disabled,\n      labelTag: option.labelTag,\n      description: option.description,\n      iconAlt: option.iconAlt,\n      iconName: option.iconName,\n      iconUrl: option.iconUrl,\n      iconSvg: option.iconSvg,\n      tags: option.tags,\n      dismissLabel: i18n('deselectAriaLabel', deselectAriaLabel?.(option), format =>\n        format({ option__label: option.label ?? '' })\n      ),\n    }));\n\n    const ListComponent = virtualScroll ? VirtualList : PlainList;\n\n    const showTokens = !hideTokens && !inlineTokens && tokens.length > 0;\n\n    const tokenGroupI18nStrings: TokenGroupProps.I18nStrings = {\n      limitShowFewer: i18nStrings?.tokenLimitShowFewer,\n      limitShowMore: i18nStrings?.tokenLimitShowMore,\n    };\n\n    const dropdownStatus = multiselectProps.dropdownStatus;\n    const dropdownProps = multiselectProps.getDropdownProps();\n\n    return (\n      <div\n        {...baseProps}\n        ref={__internalRootRef}\n        className={clsx(styles.root, baseProps.className)}\n        {...multiselectProps.getWrapperProps()}\n      >\n        <Dropdown\n          {...dropdownProps}\n          ariaLabelledby={dropdownProps.dropdownContentRole ? joinStrings(ariaLabelId, controlId) : undefined}\n          ariaDescribedby={\n            dropdownProps.dropdownContentRole ? (dropdownStatus.content ? footerId : undefined) : undefined\n          }\n          open={multiselectProps.isOpen}\n          trigger={trigger}\n          header={filter}\n          footer={\n            dropdownStatus.isSticky ? (\n              <DropdownFooter content={multiselectProps.isOpen ? dropdownStatus.content : null} id={footerId} />\n            ) : null\n          }\n          expandToViewport={expandToViewport}\n          stretchBeyondTriggerWidth={true}\n        >\n          <ListComponent\n            listBottom={\n              !dropdownStatus.isSticky ? (\n                <DropdownFooter content={multiselectProps.isOpen ? dropdownStatus.content : null} id={footerId} />\n              ) : null\n            }\n            menuProps={multiselectProps.getMenuProps()}\n            getOptionProps={multiselectProps.getOptionProps}\n            filteredOptions={multiselectProps.filteredOptions}\n            filteringValue={filteringValue}\n            ref={multiselectProps.scrollToIndex}\n            hasDropdownStatus={dropdownStatus.content !== null}\n            checkboxes={true}\n            useInteractiveGroups={true}\n            screenReaderContent={multiselectProps.announcement}\n            highlightType={multiselectProps.highlightType}\n            firstOptionSticky={enableSelectAll}\n          />\n        </Dropdown>\n\n        {showTokens && (\n          <InternalTokenGroup\n            {...multiselectProps.getTokenProps()}\n            className={styles.tokens}\n            alignment=\"horizontal\"\n            limit={tokenLimit}\n            items={tokens}\n            i18nStrings={tokenGroupI18nStrings}\n            limitShowMoreAriaLabel={tokenLimitShowMoreAriaLabel}\n            limitShowFewerAriaLabel={tokenLimitShowFewerAriaLabel}\n            disableOuterPadding={true}\n            readOnly={readOnly}\n          />\n        )}\n\n        <ScreenreaderOnly id={ariaLabelId}>{ariaLabel}</ScreenreaderOnly>\n      </div>\n    );\n  }\n);\n\nexport default InternalMultiselect;\n"]}
+{"version":3,"file":"internal.js","sourceRoot":"","sources":["../../../src/multiselect/internal.tsx"],"names":[],"mappings":";AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,KAAK,EAAE,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AACxC,OAAO,IAAI,MAAM,MAAM,CAAC;AAExB,OAAO,EAAE,eAAe,EAAE,MAAM,iBAAiB,CAAC;AAClD,OAAO,EAAE,YAAY,EAAE,MAAM,4BAA4B,CAAC;AAC1D,OAAO,QAAQ,MAAM,iCAAiC,CAAC;AACvD,OAAO,cAAc,MAAM,iDAAiD,CAAC;AAC7E,OAAO,gBAAgB,MAAM,0CAA0C,CAAC;AACxE,OAAO,EAAE,mBAAmB,EAAE,MAAM,wCAAwC,CAAC;AAE7E,OAAO,EAAE,WAAW,EAAE,MAAM,iCAAiC,CAAC;AAE9D,OAAO,EAAE,WAAW,EAAE,MAAM,2BAA2B,CAAC;AACxD,OAAO,MAAM,MAAM,wBAAwB,CAAC;AAC5C,OAAO,SAAS,MAAM,4BAA4B,CAAC;AACnD,OAAO,OAAO,MAAM,yBAAyB,CAAC;AAC9C,OAAO,WAAW,MAAM,8BAA8B,CAAC;AAEvD,OAAO,kBAAkB,MAAM,yBAAyB,CAAC;AAEzD,OAAO,EAAE,cAAc,EAAE,MAAM,mBAAmB,CAAC;AAEnD,OAAO,MAAM,MAAM,iBAAiB,CAAC;AAQrC,MAAM,mBAAmB,GAAG,KAAK,CAAC,UAAU,CAC1C,CACE,EAyB2B,EAC3B,WAA4C,EAC5C,EAAE;;QA3BF,EACE,OAAO,EACP,aAAa,EACb,oBAAoB,EACpB,kBAAkB,EAClB,uBAAuB,EACvB,YAAY,EACZ,WAAW,EACX,QAAQ,EACR,QAAQ,EACR,SAAS,EACT,eAAe,EACf,iBAAiB,EACjB,UAAU,EACV,WAAW,EACX,aAAa,EACb,YAAY,GAAG,KAAK,EACpB,UAAU,EACV,gBAAgB,EAChB,4BAA4B,EAC5B,2BAA2B,EAC3B,iBAAiB,GAAG,IAAI,EACxB,SAAS,EACT,eAAe,OAEU,EADtB,SAAS,cAxBd,qaAyBC,CADa;IAId,MAAM,SAAS,GAAG,YAAY,CAAC,SAAS,CAAC,CAAC;IAC1C,MAAM,gBAAgB,GAAG,mBAAmB,CAAC,SAAS,CAAC,CAAC;IACxD,MAAM,IAAI,GAAG,eAAe,CAAC,aAAa,CAAC,CAAC;IAE5C,MAAM,aAAa,GAAG,WAAW,CAAC,SAAS,CAAC,CAAC;IAC7C,MAAM,SAAS,GAAG,MAAA,gBAAgB,CAAC,SAAS,mCAAI,aAAa,CAAC;IAC9D,MAAM,WAAW,GAAG,WAAW,CAAC,wBAAwB,CAAC,CAAC;IAC1D,MAAM,QAAQ,GAAG,WAAW,CAAC,qBAAqB,CAAC,CAAC;IAEpD,MAAM,CAAC,cAAc,EAAE,iBAAiB,CAAC,GAAG,QAAQ,CAAC,EAAE,CAAC,CAAC;IACzD,MAAM,gBAAgB,GAAG,cAAc,iBACrC,OAAO;QACP,eAAe;QACf,aAAa;QACb,QAAQ;QACR,iBAAiB;QACjB,SAAS;QACT,WAAW;QACX,QAAQ;QACR,cAAc;QACd,iBAAiB;QACjB,WAAW;QACX,eAAe;QACf,WAAW,IACR,SAAS,EACZ,CAAC;IAEH,MAAM,MAAM,GAAG,CACb,oBAAC,MAAM,kBACL,cAAc,EAAE,uBAAuB,EACvC,aAAa,EAAE,aAAa,EAC5B,WAAW,EAAE,oBAAoB,EACjC,SAAS,EAAE,kBAAkB,EAC7B,YAAY,EAAE,YAAY,EAC1B,KAAK,EAAE,cAAc,IACjB,gBAAgB,CAAC,cAAc,EAAE,EACrC,CACH,CAAC;IAEF,MAAM,OAAO,GAAG,CACd,oBAAC,OAAO,kBACN,WAAW,EAAE,WAAW,EACxB,QAAQ,EAAE,QAAQ,EAClB,QAAQ,EAAE,QAAQ,EAClB,YAAY,EAAE,gBAAgB,CAAC,eAAe,CAAC,QAAQ,EAAE,SAAS,CAAC,EACnE,cAAc,EAAE,IAAI,EACpB,eAAe,EAAE,eAAe,EAChC,cAAc,EAAE,YAAY,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,aAAa,EACvD,MAAM,EAAE,gBAAgB,CAAC,MAAM,IAC3B,gBAAgB,IACpB,SAAS,EAAE,SAAS,EACpB,cAAc,EAAE,WAAW,CAAC,gBAAgB,CAAC,cAAc,EAAE,WAAW,CAAC,IACzE,CACH,CAAC;IAEF,MAAM,MAAM,GAA6B,eAAe,CAAC,GAAG,CAAC,MAAM,CAAC,EAAE,CAAC,CAAC;QACtE,KAAK,EAAE,MAAM,CAAC,KAAK;QACnB,QAAQ,EAAE,QAAQ,IAAI,MAAM,CAAC,QAAQ;QACrC,QAAQ,EAAE,MAAM,CAAC,QAAQ;QACzB,WAAW,EAAE,MAAM,CAAC,WAAW;QAC/B,OAAO,EAAE,MAAM,CAAC,OAAO;QACvB,QAAQ,EAAE,MAAM,CAAC,QAAQ;QACzB,OAAO,EAAE,MAAM,CAAC,OAAO;QACvB,OAAO,EAAE,MAAM,CAAC,OAAO;QACvB,IAAI,EAAE,MAAM,CAAC,IAAI;QACjB,YAAY,EAAE,IAAI,CAAC,mBAAmB,EAAE,iBAAiB,aAAjB,iBAAiB,uBAAjB,iBAAiB,CAAG,MAAM,CAAC,EAAE,MAAM,CAAC,EAAE,WAC5E,OAAA,MAAM,CAAC,EAAE,aAAa,EAAE,MAAA,MAAM,CAAC,KAAK,mCAAI,EAAE,EAAE,CAAC,CAAA,EAAA,CAC9C;KACF,CAAC,CAAC,CAAC;IAEJ,MAAM,aAAa,GAAG,aAAa,CAAC,CAAC,CAAC,WAAW,CAAC,CAAC,CAAC,SAAS,CAAC;IAE9D,MAAM,UAAU,GAAG,CAAC,UAAU,IAAI,CAAC,YAAY,IAAI,MAAM,CAAC,MAAM,GAAG,CAAC,CAAC;IAErE,MAAM,qBAAqB,GAAgC;QACzD,cAAc,EAAE,WAAW,aAAX,WAAW,uBAAX,WAAW,CAAE,mBAAmB;QAChD,aAAa,EAAE,WAAW,aAAX,WAAW,uBAAX,WAAW,CAAE,kBAAkB;KAC/C,CAAC;IAEF,MAAM,cAAc,GAAG,gBAAgB,CAAC,cAAc,CAAC;IACvD,MAAM,aAAa,GAAG,gBAAgB,CAAC,gBAAgB,EAAE,CAAC;IAC1D,MAAM,kBAAkB,GAAG,gBAAgB,CAAC,eAAe,CAAC,MAAM,GAAG,CAAC,CAAC;IAEvE,OAAO,CACL,6CACM,SAAS,IACb,GAAG,EAAE,iBAAiB,EACtB,SAAS,EAAE,IAAI,CAAC,MAAM,CAAC,IAAI,EAAE,SAAS,CAAC,SAAS,CAAC,IAC7C,gBAAgB,CAAC,eAAe,EAAE;QAEtC,oBAAC,QAAQ,oBACH,aAAa,IACjB,cAAc,EAAE,aAAa,CAAC,mBAAmB,CAAC,CAAC,CAAC,WAAW,CAAC,WAAW,EAAE,SAAS,CAAC,CAAC,CAAC,CAAC,SAAS,EACnG,eAAe,EACb,aAAa,CAAC,mBAAmB,CAAC,CAAC,CAAC,CAAC,cAAc,CAAC,OAAO,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,CAAC,SAAS,EAEjG,IAAI,EAAE,gBAAgB,CAAC,MAAM,EAC7B,OAAO,EAAE,OAAO,EAChB,MAAM,EAAE,MAAM,EACd,MAAM,EACJ,cAAc,CAAC,QAAQ,CAAC,CAAC,CAAC,CACxB,oBAAC,cAAc,IAAC,OAAO,EAAE,gBAAgB,CAAC,MAAM,CAAC,CAAC,CAAC,cAAc,CAAC,OAAO,CAAC,CAAC,CAAC,IAAI,EAAE,EAAE,EAAE,QAAQ,GAAI,CACnG,CAAC,CAAC,CAAC,IAAI,EAEV,gBAAgB,EAAE,gBAAgB,EAClC,yBAAyB,EAAE,IAAI;YAE/B,oBAAC,aAAa,IACZ,UAAU,EACR,CAAC,cAAc,CAAC,QAAQ,CAAC,CAAC,CAAC,CACzB,oBAAC,cAAc,IAAC,OAAO,EAAE,gBAAgB,CAAC,MAAM,CAAC,CAAC,CAAC,cAAc,CAAC,OAAO,CAAC,CAAC,CAAC,IAAI,EAAE,EAAE,EAAE,QAAQ,GAAI,CACnG,CAAC,CAAC,CAAC,IAAI,EAEV,SAAS,EAAE,gBAAgB,CAAC,YAAY,EAAE,EAC1C,cAAc,EAAE,gBAAgB,CAAC,cAAc,EAC/C,eAAe,EAAE,gBAAgB,CAAC,eAAe,EACjD,cAAc,EAAE,cAAc,EAC9B,GAAG,EAAE,gBAAgB,CAAC,aAAa,EACnC,iBAAiB,EAAE,cAAc,CAAC,OAAO,KAAK,IAAI,EAClD,UAAU,EAAE,IAAI,EAChB,oBAAoB,EAAE,IAAI,EAC1B,mBAAmB,EAAE,gBAAgB,CAAC,YAAY,EAClD,aAAa,EAAE,gBAAgB,CAAC,aAAa,EAC7C,iBAAiB,EAAE,kBAAkB,IAAI,eAAe,GACxD,CACO;QAEV,UAAU,IAAI,CACb,oBAAC,kBAAkB,oBACb,gBAAgB,CAAC,aAAa,EAAE,IACpC,SAAS,EAAE,MAAM,CAAC,MAAM,EACxB,SAAS,EAAC,YAAY,EACtB,KAAK,EAAE,UAAU,EACjB,KAAK,EAAE,MAAM,EACb,WAAW,EAAE,qBAAqB,EAClC,sBAAsB,EAAE,2BAA2B,EACnD,uBAAuB,EAAE,4BAA4B,EACrD,mBAAmB,EAAE,IAAI,EACzB,QAAQ,EAAE,QAAQ,IAClB,CACH;QAED,oBAAC,gBAAgB,IAAC,EAAE,EAAE,WAAW,IAAG,SAAS,CAAoB,CAC7D,CACP,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,eAAe,mBAAmB,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React, { useState } from 'react';\nimport clsx from 'clsx';\n\nimport { useInternalI18n } from '../i18n/context';\nimport { getBaseProps } from '../internal/base-component';\nimport Dropdown from '../internal/components/dropdown';\nimport DropdownFooter from '../internal/components/dropdown-footer/index.js';\nimport ScreenreaderOnly from '../internal/components/screenreader-only';\nimport { useFormFieldContext } from '../internal/context/form-field-context';\nimport { InternalBaseComponentProps } from '../internal/hooks/use-base-component/index.js';\nimport { useUniqueId } from '../internal/hooks/use-unique-id';\nimport { SomeRequired } from '../internal/types';\nimport { joinStrings } from '../internal/utils/strings';\nimport Filter from '../select/parts/filter';\nimport PlainList from '../select/parts/plain-list';\nimport Trigger from '../select/parts/trigger';\nimport VirtualList from '../select/parts/virtual-list';\nimport { TokenGroupProps } from '../token-group/interfaces';\nimport InternalTokenGroup from '../token-group/internal';\nimport { MultiselectProps } from './interfaces';\nimport { useMultiselect } from './use-multiselect';\n\nimport styles from './styles.css.js';\n\ntype InternalMultiselectProps = SomeRequired<\n  MultiselectProps,\n  'options' | 'selectedOptions' | 'filteringType' | 'statusType' | 'keepOpen' | 'hideTokens'\n> &\n  InternalBaseComponentProps;\n\nconst InternalMultiselect = React.forwardRef(\n  (\n    {\n      options,\n      filteringType,\n      filteringPlaceholder,\n      filteringAriaLabel,\n      filteringClearAriaLabel,\n      ariaRequired,\n      placeholder,\n      disabled,\n      readOnly,\n      ariaLabel,\n      selectedOptions,\n      deselectAriaLabel,\n      tokenLimit,\n      i18nStrings,\n      virtualScroll,\n      inlineTokens = false,\n      hideTokens,\n      expandToViewport,\n      tokenLimitShowFewerAriaLabel,\n      tokenLimitShowMoreAriaLabel,\n      __internalRootRef = null,\n      autoFocus,\n      enableSelectAll,\n      ...restProps\n    }: InternalMultiselectProps,\n    externalRef: React.Ref<MultiselectProps.Ref>\n  ) => {\n    const baseProps = getBaseProps(restProps);\n    const formFieldContext = useFormFieldContext(restProps);\n    const i18n = useInternalI18n('multiselect');\n\n    const selfControlId = useUniqueId('trigger');\n    const controlId = formFieldContext.controlId ?? selfControlId;\n    const ariaLabelId = useUniqueId('multiselect-ariaLabel-');\n    const footerId = useUniqueId('multiselect-footer-');\n\n    const [filteringValue, setFilteringValue] = useState('');\n    const multiselectProps = useMultiselect({\n      options,\n      selectedOptions,\n      filteringType,\n      disabled,\n      deselectAriaLabel,\n      controlId,\n      ariaLabelId,\n      footerId,\n      filteringValue,\n      setFilteringValue,\n      externalRef,\n      enableSelectAll,\n      i18nStrings,\n      ...restProps,\n    });\n\n    const filter = (\n      <Filter\n        clearAriaLabel={filteringClearAriaLabel}\n        filteringType={filteringType}\n        placeholder={filteringPlaceholder}\n        ariaLabel={filteringAriaLabel}\n        ariaRequired={ariaRequired}\n        value={filteringValue}\n        {...multiselectProps.getFilterProps()}\n      />\n    );\n\n    const trigger = (\n      <Trigger\n        placeholder={placeholder}\n        disabled={disabled}\n        readOnly={readOnly}\n        triggerProps={multiselectProps.getTriggerProps(disabled, autoFocus)}\n        selectedOption={null}\n        selectedOptions={selectedOptions}\n        triggerVariant={inlineTokens ? 'tokens' : 'placeholder'}\n        isOpen={multiselectProps.isOpen}\n        {...formFieldContext}\n        controlId={controlId}\n        ariaLabelledby={joinStrings(formFieldContext.ariaLabelledby, ariaLabelId)}\n      />\n    );\n\n    const tokens: TokenGroupProps['items'] = selectedOptions.map(option => ({\n      label: option.label,\n      disabled: disabled || option.disabled,\n      labelTag: option.labelTag,\n      description: option.description,\n      iconAlt: option.iconAlt,\n      iconName: option.iconName,\n      iconUrl: option.iconUrl,\n      iconSvg: option.iconSvg,\n      tags: option.tags,\n      dismissLabel: i18n('deselectAriaLabel', deselectAriaLabel?.(option), format =>\n        format({ option__label: option.label ?? '' })\n      ),\n    }));\n\n    const ListComponent = virtualScroll ? VirtualList : PlainList;\n\n    const showTokens = !hideTokens && !inlineTokens && tokens.length > 0;\n\n    const tokenGroupI18nStrings: TokenGroupProps.I18nStrings = {\n      limitShowFewer: i18nStrings?.tokenLimitShowFewer,\n      limitShowMore: i18nStrings?.tokenLimitShowMore,\n    };\n\n    const dropdownStatus = multiselectProps.dropdownStatus;\n    const dropdownProps = multiselectProps.getDropdownProps();\n    const hasFilteredOptions = multiselectProps.filteredOptions.length > 0;\n\n    return (\n      <div\n        {...baseProps}\n        ref={__internalRootRef}\n        className={clsx(styles.root, baseProps.className)}\n        {...multiselectProps.getWrapperProps()}\n      >\n        <Dropdown\n          {...dropdownProps}\n          ariaLabelledby={dropdownProps.dropdownContentRole ? joinStrings(ariaLabelId, controlId) : undefined}\n          ariaDescribedby={\n            dropdownProps.dropdownContentRole ? (dropdownStatus.content ? footerId : undefined) : undefined\n          }\n          open={multiselectProps.isOpen}\n          trigger={trigger}\n          header={filter}\n          footer={\n            dropdownStatus.isSticky ? (\n              <DropdownFooter content={multiselectProps.isOpen ? dropdownStatus.content : null} id={footerId} />\n            ) : null\n          }\n          expandToViewport={expandToViewport}\n          stretchBeyondTriggerWidth={true}\n        >\n          <ListComponent\n            listBottom={\n              !dropdownStatus.isSticky ? (\n                <DropdownFooter content={multiselectProps.isOpen ? dropdownStatus.content : null} id={footerId} />\n              ) : null\n            }\n            menuProps={multiselectProps.getMenuProps()}\n            getOptionProps={multiselectProps.getOptionProps}\n            filteredOptions={multiselectProps.filteredOptions}\n            filteringValue={filteringValue}\n            ref={multiselectProps.scrollToIndex}\n            hasDropdownStatus={dropdownStatus.content !== null}\n            checkboxes={true}\n            useInteractiveGroups={true}\n            screenReaderContent={multiselectProps.announcement}\n            highlightType={multiselectProps.highlightType}\n            firstOptionSticky={hasFilteredOptions && enableSelectAll}\n          />\n        </Dropdown>\n\n        {showTokens && (\n          <InternalTokenGroup\n            {...multiselectProps.getTokenProps()}\n            className={styles.tokens}\n            alignment=\"horizontal\"\n            limit={tokenLimit}\n            items={tokens}\n            i18nStrings={tokenGroupI18nStrings}\n            limitShowMoreAriaLabel={tokenLimitShowMoreAriaLabel}\n            limitShowFewerAriaLabel={tokenLimitShowFewerAriaLabel}\n            disableOuterPadding={true}\n            readOnly={readOnly}\n          />\n        )}\n\n        <ScreenreaderOnly id={ariaLabelId}>{ariaLabel}</ScreenreaderOnly>\n      </div>\n    );\n  }\n);\n\nexport default InternalMultiselect;\n"]}

package/lib/internal/template/test-utils/dom/copy-to-clipboard/index.d.ts

@@ -6,5 +6,13 @@ export default class CopyToClipboardWrapper extends ComponentWrapper {
     findStatusText(options?: {
         popoverRenderWithPortal: boolean;
     }): null | ElementWrapper;
+    /**
+     * @deprecated Use `findDisplayedText` instead.
+     */
     findTextToCopy(): null | ElementWrapper;
+    /**
+     * Used to get the text displayed next to the copy icon button when `variant='inline'`.
+     * Returns either the `textToCopy` value or the `textToDisplay` value if it has been set.
+     */
+    findDisplayedText(): null | ElementWrapper;
 }

package/lib/internal/template/test-utils/dom/copy-to-clipboard/index.js

@@ -15,9 +15,19 @@ class CopyToClipboardWrapper extends dom_1.ComponentWrapper {
             renderWithPortal: options.popoverRenderWithPortal,
         });
     }
+    /**
+     * @deprecated Use `findDisplayedText` instead.
+     */
     findTextToCopy() {
         return this.findByClassName(styles_selectors_js_1.default['text-to-copy']);
     }
+    /**
+     * Used to get the text displayed next to the copy icon button when `variant='inline'`.
+     * Returns either the `textToCopy` value or the `textToDisplay` value if it has been set.
+     */
+    findDisplayedText() {
+        return this.findByClassName(styles_selectors_js_1.default['text-to-display']);
+    }
 }
 exports.default = CopyToClipboardWrapper;
 CopyToClipboardWrapper.rootSelector = styles_selectors_js_1.default.root;

package/lib/internal/template/test-utils/dom/copy-to-clipboard/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../src/test-utils/dom/copy-to-clipboard/index.ts"],"names":[],"mappings":";;AAAA,qEAAqE;AACrE,sCAAsC;AACtC,gEAA0F;AAE1F,sCAAsC;AACtC,wCAAwC;AAExC,qGAAqF;AAErF,MAAqB,sBAAuB,SAAQ,sBAAgB;IAGlE,cAAc;QACZ,OAAO,IAAI,CAAC,aAAa,CAAC,IAAI,gBAAa,CAAC,YAAY,EAAE,EAAE,gBAAa,CAAE,CAAC;IAC9E,CAAC;IAED,cAAc,CAAC,OAAO,GAAG,EAAE,uBAAuB,EAAE,KAAK,EAAE;QACzD,OAAO,IAAI,CAAC,aAAa,CAAC,IAAI,iBAAc,CAAC,YAAY,EAAE,EAAE,iBAAc,CAAE,CAAC,WAAW,CAAC;YACxF,gBAAgB,EAAE,OAAO,CAAC,uBAAuB;SAClD,CAAC,CAAC;IACL,CAAC;IAED,cAAc;QACZ,OAAO,IAAI,CAAC,eAAe,CAAC,6BAAU,CAAC,cAAc,CAAC,CAAC,CAAC;IAC1D,CAAC;;AAfH,yCAgBC;AAfQ,mCAAY,GAAW,6BAAU,CAAC,IAAI,CAAC"}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../src/test-utils/dom/copy-to-clipboard/index.ts"],"names":[],"mappings":";;AAAA,qEAAqE;AACrE,sCAAsC;AACtC,gEAA0F;AAE1F,sCAAsC;AACtC,wCAAwC;AAExC,qGAAqF;AAErF,MAAqB,sBAAuB,SAAQ,sBAAgB;IAGlE,cAAc;QACZ,OAAO,IAAI,CAAC,aAAa,CAAC,IAAI,gBAAa,CAAC,YAAY,EAAE,EAAE,gBAAa,CAAE,CAAC;IAC9E,CAAC;IAED,cAAc,CAAC,OAAO,GAAG,EAAE,uBAAuB,EAAE,KAAK,EAAE;QACzD,OAAO,IAAI,CAAC,aAAa,CAAC,IAAI,iBAAc,CAAC,YAAY,EAAE,EAAE,iBAAc,CAAE,CAAC,WAAW,CAAC;YACxF,gBAAgB,EAAE,OAAO,CAAC,uBAAuB;SAClD,CAAC,CAAC;IACL,CAAC;IAED;;OAEG;IACH,cAAc;QACZ,OAAO,IAAI,CAAC,eAAe,CAAC,6BAAU,CAAC,cAAc,CAAC,CAAC,CAAC;IAC1D,CAAC;IAED;;;OAGG;IACH,iBAAiB;QACf,OAAO,IAAI,CAAC,eAAe,CAAC,6BAAU,CAAC,iBAAiB,CAAC,CAAC,CAAC;IAC7D,CAAC;;AA1BH,yCA2BC;AA1BQ,mCAAY,GAAW,6BAAU,CAAC,IAAI,CAAC"}

package/lib/internal/template/test-utils/dom/hotspot/index.js

@@ -3,6 +3,7 @@ Object.defineProperty(exports, "__esModule", { value: true });
 // Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
 // SPDX-License-Identifier: Apache-2.0
 const dom_1 = require("@cloudscape-design/test-utils-core/dom");
+const index_1 = require("../index");
 const index_js_1 = require("../index.js");
 const styles_selectors_js_1 = require("../../../annotation-context/annotation/styles.selectors.js");
 const styles_selectors_js_2 = require("../../../hotspot/styles.selectors.js");
@@ -11,7 +12,7 @@ class HotspotWrapper extends dom_1.ComponentWrapper {
         return this.findByClassName(styles_selectors_js_1.default.hotspot);
     }
     findAnnotation() {
-        return this.findComponent(`.${styles_selectors_js_1.default.annotation}`, index_js_1.AnnotationWrapper);
+        return (0, index_1.default)().findComponent(`.${styles_selectors_js_1.default.annotation}`, index_js_1.AnnotationWrapper);
     }
 }
 exports.default = HotspotWrapper;

package/lib/internal/template/test-utils/dom/hotspot/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../src/test-utils/dom/hotspot/index.ts"],"names":[],"mappings":";;AAAA,qEAAqE;AACrE,sCAAsC;AACtC,gEAA0F;AAE1F,0CAAgD;AAEhD,oGAA0F;AAC1F,8EAAiE;AAEjE,MAAqB,cAAe,SAAQ,sBAAgB;IAG1D,WAAW;QACT,OAAO,IAAI,CAAC,eAAe,CAAC,6BAAgB,CAAC,OAAO,CAAE,CAAC;IACzD,CAAC;IAED,cAAc;QACZ,OAAO,IAAI,CAAC,aAAa,CAAC,IAAI,6BAAgB,CAAC,UAAU,EAAE,EAAE,4BAAiB,CAAC,CAAC;IAClF,CAAC;;AATH,iCAUC;AATQ,2BAAY,GAAW,6BAAa,CAAC,IAAI,CAAC"}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../src/test-utils/dom/hotspot/index.ts"],"names":[],"mappings":";;AAAA,qEAAqE;AACrE,sCAAsC;AACtC,gEAA0F;AAE1F,oCAAqC;AACrC,0CAAgD;AAEhD,oGAA0F;AAC1F,8EAAiE;AAEjE,MAAqB,cAAe,SAAQ,sBAAgB;IAG1D,WAAW;QACT,OAAO,IAAI,CAAC,eAAe,CAAC,6BAAgB,CAAC,OAAO,CAAE,CAAC;IACzD,CAAC;IAED,cAAc;QACZ,OAAO,IAAA,eAAa,GAAE,CAAC,aAAa,CAAC,IAAI,6BAAgB,CAAC,UAAU,EAAE,EAAE,4BAAiB,CAAE,CAAC;IAC9F,CAAC;;AATH,iCAUC;AATQ,2BAAY,GAAW,6BAAa,CAAC,IAAI,CAAC"}

package/lib/internal/template/test-utils/selectors/copy-to-clipboard/index.d.ts

@@ -6,5 +6,13 @@ export default class CopyToClipboardWrapper extends ComponentWrapper {
     findStatusText(options?: {
         popoverRenderWithPortal: boolean;
     }): ElementWrapper;
+    /**
+     * @deprecated Use `findDisplayedText` instead.
+     */
     findTextToCopy(): ElementWrapper;
+    /**
+     * Used to get the text displayed next to the copy icon button when `variant='inline'`.
+     * Returns either the `textToCopy` value or the `textToDisplay` value if it has been set.
+     */
+    findDisplayedText(): ElementWrapper;
 }

package/lib/internal/template/test-utils/selectors/copy-to-clipboard/index.js

@@ -17,9 +17,19 @@ class CopyToClipboardWrapper extends selectors_1.ComponentWrapper {
             renderWithPortal: options.popoverRenderWithPortal
         });
     }
+    /**
+     * @deprecated Use `findDisplayedText` instead.
+     */
     findTextToCopy() {
         return this.findByClassName(styles_selectors_js_1.default['text-to-copy']);
     }
+    /**
+     * Used to get the text displayed next to the copy icon button when `variant='inline'`.
+     * Returns either the `textToCopy` value or the `textToDisplay` value if it has been set.
+     */
+    findDisplayedText() {
+        return this.findByClassName(styles_selectors_js_1.default['text-to-display']);
+    }
 }
 exports.default = CopyToClipboardWrapper;
 CopyToClipboardWrapper.rootSelector = styles_selectors_js_1.default.root;

package/lib/internal/template/test-utils/selectors/copy-to-clipboard/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../src/test-utils/selectors/copy-to-clipboard/index.ts"],"names":[],"mappings":";;AAAA,qEAAqE;AACrE,sCAAsC;AACtC,4EAAgG;AAChG,sCAAsC;AACtC,wCAAwC;AACxC,qGAAqF;AACrF,MAAqB,sBAAuB,SAAQ,4BAAgB;IAElE,cAAc;QACZ,OAAO,IAAI,CAAC,aAAa,CAAC,IAAI,gBAAa,CAAC,YAAY,EAAE,EAAE,gBAAa,CAAE,CAAC;IAC9E,CAAC;IACD,cAAc,CAAC,OAAO,GAAG;QACvB,uBAAuB,EAAE,KAAK;KAC/B;QACC,OAAO,IAAI,CAAC,aAAa,CAAC,IAAI,iBAAc,CAAC,YAAY,EAAE,EAAE,iBAAc,CAAE,CAAC,WAAW,CAAC;YACxF,gBAAgB,EAAE,OAAO,CAAC,uBAAuB;SAClD,CAAC,CAAC;IACL,CAAC;IACD,cAAc;QACZ,OAAO,IAAI,CAAC,eAAe,CAAC,6BAAU,CAAC,cAAc,CAAC,CAAC,CAAC;IAC1D,CAAC;;AAdH,yCAeC;AAdQ,mCAAY,GAAW,6BAAU,CAAC,IAAI,CAAC"}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../src/test-utils/selectors/copy-to-clipboard/index.ts"],"names":[],"mappings":";;AAAA,qEAAqE;AACrE,sCAAsC;AACtC,4EAAgG;AAChG,sCAAsC;AACtC,wCAAwC;AACxC,qGAAqF;AACrF,MAAqB,sBAAuB,SAAQ,4BAAgB;IAElE,cAAc;QACZ,OAAO,IAAI,CAAC,aAAa,CAAC,IAAI,gBAAa,CAAC,YAAY,EAAE,EAAE,gBAAa,CAAE,CAAC;IAC9E,CAAC;IACD,cAAc,CAAC,OAAO,GAAG;QACvB,uBAAuB,EAAE,KAAK;KAC/B;QACC,OAAO,IAAI,CAAC,aAAa,CAAC,IAAI,iBAAc,CAAC,YAAY,EAAE,EAAE,iBAAc,CAAE,CAAC,WAAW,CAAC;YACxF,gBAAgB,EAAE,OAAO,CAAC,uBAAuB;SAClD,CAAC,CAAC;IACL,CAAC;IAED;;OAEG;IACH,cAAc;QACZ,OAAO,IAAI,CAAC,eAAe,CAAC,6BAAU,CAAC,cAAc,CAAC,CAAC,CAAC;IAC1D,CAAC;IAED;;;OAGG;IACH,iBAAiB;QACf,OAAO,IAAI,CAAC,eAAe,CAAC,6BAAU,CAAC,iBAAiB,CAAC,CAAC,CAAC;IAC7D,CAAC;;AA1BH,yCA2BC;AA1BQ,mCAAY,GAAW,6BAAU,CAAC,IAAI,CAAC"}

package/lib/internal/template/test-utils/selectors/hotspot/index.js

@@ -3,6 +3,7 @@ Object.defineProperty(exports, "__esModule", { value: true });
 // Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
 // SPDX-License-Identifier: Apache-2.0
 const selectors_1 = require("@cloudscape-design/test-utils-core/selectors");
+const index_1 = require("../index");
 const index_js_1 = require("../index.js");
 const styles_selectors_js_1 = require("../../../annotation-context/annotation/styles.selectors.js");
 const styles_selectors_js_2 = require("../../../hotspot/styles.selectors.js");
@@ -11,7 +12,7 @@ class HotspotWrapper extends selectors_1.ComponentWrapper {
         return this.findByClassName(styles_selectors_js_1.default.hotspot);
     }
     findAnnotation() {
-        return this.findComponent(`.${styles_selectors_js_1.default.annotation}`, index_js_1.AnnotationWrapper);
+        return (0, index_1.default)().findComponent(`.${styles_selectors_js_1.default.annotation}`, index_js_1.AnnotationWrapper);
     }
 }
 exports.default = HotspotWrapper;

package/lib/internal/template/test-utils/selectors/hotspot/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../src/test-utils/selectors/hotspot/index.ts"],"names":[],"mappings":";;AAAA,qEAAqE;AACrE,sCAAsC;AACtC,4EAAgG;AAChG,0CAAgD;AAChD,oGAA0F;AAC1F,8EAAiE;AACjE,MAAqB,cAAe,SAAQ,4BAAgB;IAE1D,WAAW;QACT,OAAO,IAAI,CAAC,eAAe,CAAC,6BAAgB,CAAC,OAAO,CAAE,CAAC;IACzD,CAAC;IACD,cAAc;QACZ,OAAO,IAAI,CAAC,aAAa,CAAC,IAAI,6BAAgB,CAAC,UAAU,EAAE,EAAE,4BAAiB,CAAC,CAAC;IAClF,CAAC;;AAPH,iCAQC;AAPQ,2BAAY,GAAW,6BAAa,CAAC,IAAI,CAAC"}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../src/test-utils/selectors/hotspot/index.ts"],"names":[],"mappings":";;AAAA,qEAAqE;AACrE,sCAAsC;AACtC,4EAAgG;AAChG,oCAAqC;AACrC,0CAAgD;AAChD,oGAA0F;AAC1F,8EAAiE;AACjE,MAAqB,cAAe,SAAQ,4BAAgB;IAE1D,WAAW;QACT,OAAO,IAAI,CAAC,eAAe,CAAC,6BAAgB,CAAC,OAAO,CAAE,CAAC;IACzD,CAAC;IACD,cAAc;QACZ,OAAO,IAAA,eAAa,GAAE,CAAC,aAAa,CAAC,IAAI,6BAAgB,CAAC,UAAU,EAAE,EAAE,4BAAiB,CAAE,CAAC;IAC9F,CAAC;;AAPH,iCAQC;AAPQ,2BAAY,GAAW,6BAAa,CAAC,IAAI,CAAC"}