@cloudscape-design/components-themeable 3.0.1137 → 3.0.1139

package/lib/internal/template/internal/hooks/use-intersection-observer/index.js

@@ -28,7 +28,7 @@ export function useIntersectionObserver({ initialState = false, } = {}) {
                     TopLevelIntersectionObserver = window.top.IntersectionObserver;
                 }
             }
-            catch (_a) {
+            catch {
                 // Tried to access a cross-origin iframe. Fall back to current IntersectionObserver.
             }
             observerRef.current = new TopLevelIntersectionObserver(entries => {

package/lib/internal/template/internal/hooks/use-intersection-observer/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../src/internal/hooks/use-intersection-observer/index.ts"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AAEtC,OAAO,EAAe,WAAW,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAMnE;;;GAGG;AACH,MAAM,UAAU,uBAAuB,CAAwB,EAC7D,YAAY,GAAG,KAAK,MACa,EAAE;IACnC,MAAM,WAAW,GAAG,MAAM,CAA8B,IAAI,CAAC,CAAC;IAC9D,MAAM,CAAC,cAAc,EAAE,iBAAiB,CAAC,GAAG,QAAQ,CAAC,YAAY,CAAC,CAAC;IAEnE,MAAM,GAAG,GAAG,WAAW,CAAiB,aAAa,CAAC,EAAE;QACtD,IAAI,OAAO,oBAAoB,KAAK,WAAW,EAAE,CAAC;YAChD,wCAAwC;YACxC,OAAO;QACT,CAAC;QAED,IAAI,WAAW,CAAC,OAAO,EAAE,CAAC;YACxB,uDAAuD;YACvD,WAAW,CAAC,OAAO,CAAC,UAAU,EAAE,CAAC;QACnC,CAAC;QAED,gDAAgD;QAChD,IAAI,aAAa,EAAE,CAAC;YAClB,4EAA4E;YAC5E,iFAAiF;YACjF,2FAA2F;YAC3F,IAAI,4BAA4B,GAAG,oBAAoB,CAAC;YACxD,IAAI,CAAC;gBACH,IAAI,MAAM,CAAC,GAAG,EAAE,CAAC;oBACf,4BAA4B,GAAI,MAAM,CAAC,GAAqB,CAAC,oBAAoB,CAAC;gBACpF,CAAC;YACH,CAAC;YAAC,WAAM,CAAC;gBACP,oFAAoF;YACtF,CAAC;YACD,WAAW,CAAC,OAAO,GAAG,IAAI,4BAA4B,CAAC,OAAO,CAAC,EAAE;gBAC/D,IAAI,WAAW,GAAG,OAAO,CAAC,CAAC,CAAC,CAAC;gBAC7B,KAAK,MAAM,KAAK,IAAI,OAAO,EAAE,CAAC;oBAC5B,IAAI,KAAK,CAAC,IAAI,GAAG,WAAW,CAAC,IAAI,EAAE,CAAC;wBAClC,WAAW,GAAG,KAAK,CAAC;oBACtB,CAAC;gBACH,CAAC;gBACD,iBAAiB,CAAC,WAAW,CAAC,cAAc,CAAC,CAAC;YAChD,CAAC,CAAC,CAAC;YACH,WAAW,CAAC,OAAO,CAAC,OAAO,CAAC,aAAa,CAAC,CAAC;QAC7C,CAAC;IACH,CAAC,EAAE,EAAE,CAAC,CAAC;IAEP,OAAO,EAAE,GAAG,EAAE,cAAc,EAAE,CAAC;AACjC,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\n\nimport { RefCallback, useCallback, useRef, useState } from 'react';\n\ninterface UseIntersectionObserverConfig {\n  initialState?: boolean;\n}\n\n/**\n * A hook that uses an Intersection Observer on the target element ref\n * and detects if the element is intersecting with its parent.\n */\nexport function useIntersectionObserver<T extends HTMLElement>({\n  initialState = false,\n}: UseIntersectionObserverConfig = {}) {\n  const observerRef = useRef<IntersectionObserver | null>(null);\n  const [isIntersecting, setIsIntersecting] = useState(initialState);\n\n  const ref = useCallback<RefCallback<T>>(targetElement => {\n    if (typeof IntersectionObserver === 'undefined') {\n      // Do nothing in environments like JSDOM\n      return;\n    }\n\n    if (observerRef.current) {\n      // Dismiss previous observer because the target changed\n      observerRef.current.disconnect();\n    }\n\n    // Create a new observer with the target element\n    if (targetElement) {\n      // Fix for AWSUI-60898: In Firefox, IntersectionObserver instances inside an\n      //   iframe context can't detect visibility changes caused by changes to elements\n      //   outside the iframe (e.g. if an element wrapping the iframe is set to `display: none`).\n      let TopLevelIntersectionObserver = IntersectionObserver;\n      try {\n        if (window.top) {\n          TopLevelIntersectionObserver = (window.top as typeof window).IntersectionObserver;\n        }\n      } catch {\n        // Tried to access a cross-origin iframe. Fall back to current IntersectionObserver.\n      }\n      observerRef.current = new TopLevelIntersectionObserver(entries => {\n        let latestEntry = entries[0];\n        for (const entry of entries) {\n          if (entry.time > latestEntry.time) {\n            latestEntry = entry;\n          }\n        }\n        setIsIntersecting(latestEntry.isIntersecting);\n      });\n      observerRef.current.observe(targetElement);\n    }\n  }, []);\n\n  return { ref, isIntersecting };\n}\n"]}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../src/internal/hooks/use-intersection-observer/index.ts"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AAEtC,OAAO,EAAe,WAAW,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAMnE;;;GAGG;AACH,MAAM,UAAU,uBAAuB,CAAwB,EAC7D,YAAY,GAAG,KAAK,MACa,EAAE;IACnC,MAAM,WAAW,GAAG,MAAM,CAA8B,IAAI,CAAC,CAAC;IAC9D,MAAM,CAAC,cAAc,EAAE,iBAAiB,CAAC,GAAG,QAAQ,CAAC,YAAY,CAAC,CAAC;IAEnE,MAAM,GAAG,GAAG,WAAW,CAAiB,aAAa,CAAC,EAAE;QACtD,IAAI,OAAO,oBAAoB,KAAK,WAAW,EAAE,CAAC;YAChD,wCAAwC;YACxC,OAAO;QACT,CAAC;QAED,IAAI,WAAW,CAAC,OAAO,EAAE,CAAC;YACxB,uDAAuD;YACvD,WAAW,CAAC,OAAO,CAAC,UAAU,EAAE,CAAC;QACnC,CAAC;QAED,gDAAgD;QAChD,IAAI,aAAa,EAAE,CAAC;YAClB,4EAA4E;YAC5E,iFAAiF;YACjF,2FAA2F;YAC3F,IAAI,4BAA4B,GAAG,oBAAoB,CAAC;YACxD,IAAI,CAAC;gBACH,IAAI,MAAM,CAAC,GAAG,EAAE,CAAC;oBACf,4BAA4B,GAAI,MAAM,CAAC,GAAqB,CAAC,oBAAoB,CAAC;gBACpF,CAAC;YACH,CAAC;YAAC,MAAM,CAAC;gBACP,oFAAoF;YACtF,CAAC;YACD,WAAW,CAAC,OAAO,GAAG,IAAI,4BAA4B,CAAC,OAAO,CAAC,EAAE;gBAC/D,IAAI,WAAW,GAAG,OAAO,CAAC,CAAC,CAAC,CAAC;gBAC7B,KAAK,MAAM,KAAK,IAAI,OAAO,EAAE,CAAC;oBAC5B,IAAI,KAAK,CAAC,IAAI,GAAG,WAAW,CAAC,IAAI,EAAE,CAAC;wBAClC,WAAW,GAAG,KAAK,CAAC;oBACtB,CAAC;gBACH,CAAC;gBACD,iBAAiB,CAAC,WAAW,CAAC,cAAc,CAAC,CAAC;YAChD,CAAC,CAAC,CAAC;YACH,WAAW,CAAC,OAAO,CAAC,OAAO,CAAC,aAAa,CAAC,CAAC;QAC7C,CAAC;IACH,CAAC,EAAE,EAAE,CAAC,CAAC;IAEP,OAAO,EAAE,GAAG,EAAE,cAAc,EAAE,CAAC;AACjC,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\n\nimport { RefCallback, useCallback, useRef, useState } from 'react';\n\ninterface UseIntersectionObserverConfig {\n  initialState?: boolean;\n}\n\n/**\n * A hook that uses an Intersection Observer on the target element ref\n * and detects if the element is intersecting with its parent.\n */\nexport function useIntersectionObserver<T extends HTMLElement>({\n  initialState = false,\n}: UseIntersectionObserverConfig = {}) {\n  const observerRef = useRef<IntersectionObserver | null>(null);\n  const [isIntersecting, setIsIntersecting] = useState(initialState);\n\n  const ref = useCallback<RefCallback<T>>(targetElement => {\n    if (typeof IntersectionObserver === 'undefined') {\n      // Do nothing in environments like JSDOM\n      return;\n    }\n\n    if (observerRef.current) {\n      // Dismiss previous observer because the target changed\n      observerRef.current.disconnect();\n    }\n\n    // Create a new observer with the target element\n    if (targetElement) {\n      // Fix for AWSUI-60898: In Firefox, IntersectionObserver instances inside an\n      //   iframe context can't detect visibility changes caused by changes to elements\n      //   outside the iframe (e.g. if an element wrapping the iframe is set to `display: none`).\n      let TopLevelIntersectionObserver = IntersectionObserver;\n      try {\n        if (window.top) {\n          TopLevelIntersectionObserver = (window.top as typeof window).IntersectionObserver;\n        }\n      } catch {\n        // Tried to access a cross-origin iframe. Fall back to current IntersectionObserver.\n      }\n      observerRef.current = new TopLevelIntersectionObserver(entries => {\n        let latestEntry = entries[0];\n        for (const entry of entries) {\n          if (entry.time > latestEntry.time) {\n            latestEntry = entry;\n          }\n        }\n        setIsIntersecting(latestEntry.isIntersecting);\n      });\n      observerRef.current.observe(targetElement);\n    }\n  }, []);\n\n  return { ref, isIntersecting };\n}\n"]}

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

@@ -50,7 +50,12 @@ export function usePerformanceMarks(name, enabled, elementRef, getDetails, depen
         const cleanup = isInViewport(elementRef.current, inViewport => {
             performance.mark(`${name}Rendered`, {
                 startTime: timestamp,
-                detail: Object.assign({ source: 'awsui', instanceIdentifier: id, inViewport }, getDetails()),
+                detail: {
+                    source: 'awsui',
+                    instanceIdentifier: id,
+                    inViewport,
+                    ...getDetails(),
+                },
             });
         });
         return cleanup;
@@ -70,7 +75,12 @@ export function usePerformanceMarks(name, enabled, elementRef, getDetails, depen
         const cleanup = isInViewport(elementRef.current, inViewport => {
             performance.mark(`${name}Updated`, {
                 startTime: timestamp,
-                detail: Object.assign({ source: 'awsui', instanceIdentifier: id, inViewport }, getDetails()),
+                detail: {
+                    source: 'awsui',
+                    instanceIdentifier: id,
+                    inViewport,
+                    ...getDetails(),
+                },
             });
         });
         return cleanup;

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 { useRandomId } from '@cloudscape-design/component-toolkit/internal';\n\nimport { useModalContext } from '../../context/modal-context';\nimport { useDOMAttribute } from '../use-dom-attribute';\nimport { useEffectOnUpdate } from '../use-effect-on-update';\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"]}
+{"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 { useRandomId } from '@cloudscape-design/component-toolkit/internal';\n\nimport { useModalContext } from '../../context/modal-context';\nimport { useDOMAttribute } from '../use-dom-attribute';\nimport { useEffectOnUpdate } from '../use-effect-on-update';\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-virtual/index.js

@@ -35,14 +35,17 @@ export function useVirtual({ items, parentRef, estimateSize, firstItemSticky, })
     useEffect(() => {
         measuresCache.current = new WeakMap();
     }, [indicesKey, items, estimateSize]);
-    const virtualItems = useMemo(() => rowVirtualizer.virtualItems.map(virtualItem => (Object.assign(Object.assign({}, virtualItem), { measureRef: (node) => {
+    const virtualItems = useMemo(() => rowVirtualizer.virtualItems.map(virtualItem => ({
+        ...virtualItem,
+        measureRef: (node) => {
             var _a;
             const mountedCount = (_a = measuresCache.current.get(items[virtualItem.index])) !== null && _a !== void 0 ? _a : 0;
             if (mountedCount < MAX_ITEM_MOUNTS) {
                 virtualItem.measureRef(node);
                 measuresCache.current.set(items[virtualItem.index], mountedCount + 1);
             }
-        } }))), [items, rowVirtualizer.virtualItems]);
+        },
+    })), [items, rowVirtualizer.virtualItems]);
     return {
         virtualItems,
         totalSize: rowVirtualizer.totalSize,

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

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../src/internal/hooks/use-virtual/index.ts"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAc,EAAE,SAAS,EAAE,OAAO,EAAE,MAAM,EAAE,MAAM,OAAO,CAAC;AAE1D,OAAO,EAAE,UAAU,IAAI,iBAAiB,EAAe,MAAM,4BAA4B,CAAC;AAC1F,OAAO,oBAAoB,MAAM,0BAA0B,CAAC;AAE5D,8EAA8E;AAC9E,sEAAsE;AACtE,sFAAsF;AACtF,yFAAyF;AACzF,MAAM,eAAe,GAAG,EAAE,GAAG,CAAC,CAAC;AAe/B;;;;;;;;;;;GAWG;AACH,MAAM,UAAU,UAAU,CAAsB,EAC9C,KAAK,EACL,SAAS,EACT,YAAY,EACZ,eAAe,GACO;IACtB,MAAM,cAAc,GAAG,iBAAiB,CAAC;QACvC,IAAI,EAAE,KAAK,CAAC,MAAM;QAClB,SAAS;QACT,YAAY;QACZ,QAAQ,EAAE,CAAC;QACX,cAAc,EAAE,eAAe,CAAC,CAAC,CAAC,oBAAoB,CAAC,CAAC,CAAC,SAAS;KACnE,CAAC,CAAC;IAEH,oEAAoE;IACpE,MAAM,aAAa,GAAG,MAAM,CAAC,IAAI,OAAO,EAAgB,CAAC,CAAC;IAE1D,yEAAyE;IACzE,MAAM,UAAU,GAAG,cAAc,CAAC,YAAY,CAAC,GAAG,CAAC,IAAI,CAAC,EAAE,CAAC,GAAG,IAAI,CAAC,KAAK,EAAE,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC;IACtF,SAAS,CAAC,GAAG,EAAE;QACb,aAAa,CAAC,OAAO,GAAG,IAAI,OAAO,EAAE,CAAC;IACxC,CAAC,EAAE,CAAC,UAAU,EAAE,KAAK,EAAE,YAAY,CAAC,CAAC,CAAC;IAEtC,MAAM,YAAY,GAAG,OAAO,CAC1B,GAAG,EAAE,CACH,cAAc,CAAC,YAAY,CAAC,GAAG,CAAC,WAAW,CAAC,EAAE,CAAC,iCAC1C,WAAW,KACd,UAAU,EAAE,CAAC,IAAwB,EAAE,EAAE;;YACvC,MAAM,YAAY,GAAG,MAAA,aAAa,CAAC,OAAO,CAAC,GAAG,CAAC,KAAK,CAAC,WAAW,CAAC,KAAK,CAAC,CAAC,mCAAI,CAAC,CAAC;YAC9E,IAAI,YAAY,GAAG,eAAe,EAAE,CAAC;gBACnC,WAAW,CAAC,UAAU,CAAC,IAAI,CAAC,CAAC;gBAC7B,aAAa,CAAC,OAAO,CAAC,GAAG,CAAC,KAAK,CAAC,WAAW,CAAC,KAAK,CAAC,EAAE,YAAY,GAAG,CAAC,CAAC,CAAC;YACxE,CAAC;QACH,CAAC,IACD,CAAC,EACL,CAAC,KAAK,EAAE,cAAc,CAAC,YAAY,CAAC,CACrC,CAAC;IAEF,OAAO;QACL,YAAY;QACZ,SAAS,EAAE,cAAc,CAAC,SAAS;QACnC,aAAa,EAAE,cAAc,CAAC,aAAa;KAC5C,CAAC;AACJ,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React, { useEffect, useMemo, useRef } from 'react';\n\nimport { useVirtual as useVirtualDefault, VirtualItem } from '../../vendor/react-virtual';\nimport stickyRangeExtractor from './sticky-range-extractor';\n\n// Maximum allowed synchronous (nested) item mounts before forcing a bail-out.\n// Mirrors React’s internal safeguard for nested updates: React throws\n// \"Maximum update depth exceeded\" once >50 sync updates occur within a single commit.\n// See: https://github.com/facebook/react/commit/d8c90fa48d3addefe4b805ec56a3c65e4ee39127\nconst MAX_ITEM_MOUNTS = 50 - 1;\n\ninterface UseVirtualProps<Item> {\n  items: readonly Item[];\n  parentRef: React.RefObject<HTMLElement>;\n  estimateSize: () => number;\n  firstItemSticky?: boolean;\n}\n\ninterface RowVirtualizer {\n  virtualItems: VirtualItem[];\n  totalSize: number;\n  scrollToIndex: (index: number) => void;\n}\n\n/**\n * The useVirtual from react-virtual@2 might produce an infinite update loop caused by setting\n * measured item sizes in the render cycle (as part of the measureRef assignment):\n *      The sum of all measured item sizes is returned as totalSize which is then set on the list container.\n *      Enforcing new container height might result in an items size change e.g. when the content wraps.\n *\n * The infinite update cycle causes React \"Maximum update depth exceeded\" error and can be additionally confirmed\n * by logging the totalSize which should then bounce between two values.\n *\n * The number of item refs assignments is limited to MAX_ITEM_MOUNTS unless items or indices change.\n * That is based on the assumption the item height stays constant after its first render.\n */\nexport function useVirtual<Item extends object>({\n  items,\n  parentRef,\n  estimateSize,\n  firstItemSticky,\n}: UseVirtualProps<Item>): RowVirtualizer {\n  const rowVirtualizer = useVirtualDefault({\n    size: items.length,\n    parentRef,\n    estimateSize,\n    overscan: 5,\n    rangeExtractor: firstItemSticky ? stickyRangeExtractor : undefined,\n  });\n\n  // Cache virtual item mounts to limit the amount of mounts per item.\n  const measuresCache = useRef(new WeakMap<Item, number>());\n\n  // Clear mounts cache every time indices, items, or size estimate change.\n  const indicesKey = rowVirtualizer.virtualItems.map(item => `${item.index}`).join(':');\n  useEffect(() => {\n    measuresCache.current = new WeakMap();\n  }, [indicesKey, items, estimateSize]);\n\n  const virtualItems = useMemo(\n    () =>\n      rowVirtualizer.virtualItems.map(virtualItem => ({\n        ...virtualItem,\n        measureRef: (node: null | HTMLElement) => {\n          const mountedCount = measuresCache.current.get(items[virtualItem.index]) ?? 0;\n          if (mountedCount < MAX_ITEM_MOUNTS) {\n            virtualItem.measureRef(node);\n            measuresCache.current.set(items[virtualItem.index], mountedCount + 1);\n          }\n        },\n      })),\n    [items, rowVirtualizer.virtualItems]\n  );\n\n  return {\n    virtualItems,\n    totalSize: rowVirtualizer.totalSize,\n    scrollToIndex: rowVirtualizer.scrollToIndex,\n  };\n}\n"]}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../src/internal/hooks/use-virtual/index.ts"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAc,EAAE,SAAS,EAAE,OAAO,EAAE,MAAM,EAAE,MAAM,OAAO,CAAC;AAE1D,OAAO,EAAE,UAAU,IAAI,iBAAiB,EAAe,MAAM,4BAA4B,CAAC;AAC1F,OAAO,oBAAoB,MAAM,0BAA0B,CAAC;AAE5D,8EAA8E;AAC9E,sEAAsE;AACtE,sFAAsF;AACtF,yFAAyF;AACzF,MAAM,eAAe,GAAG,EAAE,GAAG,CAAC,CAAC;AAe/B;;;;;;;;;;;GAWG;AACH,MAAM,UAAU,UAAU,CAAsB,EAC9C,KAAK,EACL,SAAS,EACT,YAAY,EACZ,eAAe,GACO;IACtB,MAAM,cAAc,GAAG,iBAAiB,CAAC;QACvC,IAAI,EAAE,KAAK,CAAC,MAAM;QAClB,SAAS;QACT,YAAY;QACZ,QAAQ,EAAE,CAAC;QACX,cAAc,EAAE,eAAe,CAAC,CAAC,CAAC,oBAAoB,CAAC,CAAC,CAAC,SAAS;KACnE,CAAC,CAAC;IAEH,oEAAoE;IACpE,MAAM,aAAa,GAAG,MAAM,CAAC,IAAI,OAAO,EAAgB,CAAC,CAAC;IAE1D,yEAAyE;IACzE,MAAM,UAAU,GAAG,cAAc,CAAC,YAAY,CAAC,GAAG,CAAC,IAAI,CAAC,EAAE,CAAC,GAAG,IAAI,CAAC,KAAK,EAAE,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC;IACtF,SAAS,CAAC,GAAG,EAAE;QACb,aAAa,CAAC,OAAO,GAAG,IAAI,OAAO,EAAE,CAAC;IACxC,CAAC,EAAE,CAAC,UAAU,EAAE,KAAK,EAAE,YAAY,CAAC,CAAC,CAAC;IAEtC,MAAM,YAAY,GAAG,OAAO,CAC1B,GAAG,EAAE,CACH,cAAc,CAAC,YAAY,CAAC,GAAG,CAAC,WAAW,CAAC,EAAE,CAAC,CAAC;QAC9C,GAAG,WAAW;QACd,UAAU,EAAE,CAAC,IAAwB,EAAE,EAAE;;YACvC,MAAM,YAAY,GAAG,MAAA,aAAa,CAAC,OAAO,CAAC,GAAG,CAAC,KAAK,CAAC,WAAW,CAAC,KAAK,CAAC,CAAC,mCAAI,CAAC,CAAC;YAC9E,IAAI,YAAY,GAAG,eAAe,EAAE,CAAC;gBACnC,WAAW,CAAC,UAAU,CAAC,IAAI,CAAC,CAAC;gBAC7B,aAAa,CAAC,OAAO,CAAC,GAAG,CAAC,KAAK,CAAC,WAAW,CAAC,KAAK,CAAC,EAAE,YAAY,GAAG,CAAC,CAAC,CAAC;YACxE,CAAC;QACH,CAAC;KACF,CAAC,CAAC,EACL,CAAC,KAAK,EAAE,cAAc,CAAC,YAAY,CAAC,CACrC,CAAC;IAEF,OAAO;QACL,YAAY;QACZ,SAAS,EAAE,cAAc,CAAC,SAAS;QACnC,aAAa,EAAE,cAAc,CAAC,aAAa;KAC5C,CAAC;AACJ,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React, { useEffect, useMemo, useRef } from 'react';\n\nimport { useVirtual as useVirtualDefault, VirtualItem } from '../../vendor/react-virtual';\nimport stickyRangeExtractor from './sticky-range-extractor';\n\n// Maximum allowed synchronous (nested) item mounts before forcing a bail-out.\n// Mirrors React’s internal safeguard for nested updates: React throws\n// \"Maximum update depth exceeded\" once >50 sync updates occur within a single commit.\n// See: https://github.com/facebook/react/commit/d8c90fa48d3addefe4b805ec56a3c65e4ee39127\nconst MAX_ITEM_MOUNTS = 50 - 1;\n\ninterface UseVirtualProps<Item> {\n  items: readonly Item[];\n  parentRef: React.RefObject<HTMLElement>;\n  estimateSize: () => number;\n  firstItemSticky?: boolean;\n}\n\ninterface RowVirtualizer {\n  virtualItems: VirtualItem[];\n  totalSize: number;\n  scrollToIndex: (index: number) => void;\n}\n\n/**\n * The useVirtual from react-virtual@2 might produce an infinite update loop caused by setting\n * measured item sizes in the render cycle (as part of the measureRef assignment):\n *      The sum of all measured item sizes is returned as totalSize which is then set on the list container.\n *      Enforcing new container height might result in an items size change e.g. when the content wraps.\n *\n * The infinite update cycle causes React \"Maximum update depth exceeded\" error and can be additionally confirmed\n * by logging the totalSize which should then bounce between two values.\n *\n * The number of item refs assignments is limited to MAX_ITEM_MOUNTS unless items or indices change.\n * That is based on the assumption the item height stays constant after its first render.\n */\nexport function useVirtual<Item extends object>({\n  items,\n  parentRef,\n  estimateSize,\n  firstItemSticky,\n}: UseVirtualProps<Item>): RowVirtualizer {\n  const rowVirtualizer = useVirtualDefault({\n    size: items.length,\n    parentRef,\n    estimateSize,\n    overscan: 5,\n    rangeExtractor: firstItemSticky ? stickyRangeExtractor : undefined,\n  });\n\n  // Cache virtual item mounts to limit the amount of mounts per item.\n  const measuresCache = useRef(new WeakMap<Item, number>());\n\n  // Clear mounts cache every time indices, items, or size estimate change.\n  const indicesKey = rowVirtualizer.virtualItems.map(item => `${item.index}`).join(':');\n  useEffect(() => {\n    measuresCache.current = new WeakMap();\n  }, [indicesKey, items, estimateSize]);\n\n  const virtualItems = useMemo(\n    () =>\n      rowVirtualizer.virtualItems.map(virtualItem => ({\n        ...virtualItem,\n        measureRef: (node: null | HTMLElement) => {\n          const mountedCount = measuresCache.current.get(items[virtualItem.index]) ?? 0;\n          if (mountedCount < MAX_ITEM_MOUNTS) {\n            virtualItem.measureRef(node);\n            measuresCache.current.set(items[virtualItem.index], mountedCount + 1);\n          }\n        },\n      })),\n    [items, rowVirtualizer.virtualItems]\n  );\n\n  return {\n    virtualItems,\n    totalSize: rowVirtualizer.totalSize,\n    scrollToIndex: rowVirtualizer.scrollToIndex,\n  };\n}\n"]}

package/lib/internal/template/internal/plugins/controllers/drawers.js

@@ -1,4 +1,3 @@
-import { __rest } from "tslib";
 import debounce from '../../debounce';
 import { reportRuntimeApiWarning } from '../helpers/metrics';
 const updatableProperties = [
@@ -31,16 +30,15 @@ export class DrawersController {
             this.drawers = this.drawers.concat(config);
             this.scheduleUpdate();
         };
-        this.updateDrawer = (_a) => {
-            var _b;
-            var { id: drawerId } = _a, rest = __rest(_a, ["id"]);
+        this.updateDrawer = ({ id: drawerId, ...rest }) => {
+            var _a;
             const drawerIndex = this.drawers.findIndex(({ id }) => id === drawerId);
-            const oldDrawerConfig = (_b = this.drawers) === null || _b === void 0 ? void 0 : _b[drawerIndex];
+            const oldDrawerConfig = (_a = this.drawers) === null || _a === void 0 ? void 0 : _a[drawerIndex];
             if (!oldDrawerConfig) {
                 throw new Error(`[AwsUi] [runtime drawers] drawer with id ${drawerId} not found`);
             }
             const drawers = this.drawers.slice();
-            const updatedDrawer = Object.assign({}, oldDrawerConfig);
+            const updatedDrawer = { ...oldDrawerConfig };
             for (const key of updatableProperties) {
                 if (key in rest) {
                     updatedDrawer[key] = rest[key];

package/lib/internal/template/internal/plugins/controllers/drawers.js.map

@@ -1 +1 @@
-{"version":3,"file":"drawers.js","sourceRoot":"","sources":["../../../../../src/internal/plugins/controllers/drawers.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 { ButtonGroupProps } from '../../../button-group/interfaces';\nimport debounce from '../../debounce';\nimport { NonCancelableEventHandler } from '../../events';\nimport { reportRuntimeApiWarning } from '../helpers/metrics';\n\ntype DrawerVisibilityChange = (callback: (isVisible: boolean) => void) => void;\n\ninterface MountContentContext {\n  onVisibilityChange: DrawerVisibilityChange;\n}\n\nexport interface DrawerStateChangeParams {\n  isOpen: boolean;\n  initiatedByUserAction?: boolean;\n}\n\nexport interface DrawerConfig {\n  id: string;\n  type?: 'local' | 'global';\n  ariaLabels: {\n    content?: string;\n    closeButton?: string;\n    triggerButton?: string;\n    resizeHandle?: string;\n    resizeHandleTooltipText?: string;\n    expandedModeButton?: string;\n  };\n  isExpandable?: boolean;\n  badge?: boolean;\n  resizable?: boolean;\n  defaultSize?: number;\n  onResize?: NonCancelableEventHandler<{ size: number; id: string }>;\n  orderPriority?: number;\n  defaultActive?: boolean;\n  trigger?: {\n    iconSvg?: string;\n  };\n  mountContent: (container: HTMLElement, mountContext: MountContentContext) => void;\n  unmountContent: (container: HTMLElement) => void;\n  preserveInactiveContent?: boolean;\n  onToggle?: NonCancelableEventHandler<DrawerStateChangeParams>;\n  headerActions?: ReadonlyArray<ButtonGroupProps.Item>;\n  onHeaderActionClick?: NonCancelableEventHandler<ButtonGroupProps.ItemClickDetails>;\n}\n\nconst updatableProperties = [\n  'badge',\n  'resizable',\n  'defaultSize',\n  'orderPriority',\n  'defaultActive',\n  'onResize',\n] as const;\n\nexport type UpdateDrawerConfig = { id: DrawerConfig['id'] } & Partial<\n  Pick<DrawerConfig, (typeof updatableProperties)[number]>\n>;\n\ntype DrawersRegistrationListener = (drawers: Array<DrawerConfig>) => void;\ntype DrawersUpdateListener = (drawers: Array<DrawerConfig>) => void;\n\nexport type DrawersToggledListener = (drawerId: string, params?: OpenCloseDrawerParams) => void;\ntype DrawersResizeListener = (drawerId: string, size: number) => void;\n\ninterface OpenCloseDrawerParams {\n  initiatedByUserAction: boolean;\n}\n\nexport interface DrawersApiPublic {\n  registerDrawer(config: DrawerConfig): void;\n  updateDrawer(config: UpdateDrawerConfig): void;\n  openDrawer(drawerId: string, params?: OpenCloseDrawerParams): void;\n  closeDrawer(drawerId: string, params?: OpenCloseDrawerParams): void;\n  resizeDrawer(drawerId: string, size: number): void;\n}\n\nexport interface DrawersApiInternal {\n  clearRegisteredDrawers(): void;\n  onDrawersRegistered(listener: DrawersRegistrationListener): () => void;\n  onDrawerOpened(listener: DrawersToggledListener): () => void;\n  onDrawerClosed(listener: DrawersToggledListener): () => void;\n  onDrawerResize(listener: DrawersResizeListener): () => void;\n  onDrawersUpdated(listener: DrawersUpdateListener): void;\n  getDrawersState(): Array<DrawerConfig>;\n}\n\nexport class DrawersController {\n  private drawers: Array<DrawerConfig> = [];\n  private drawersRegistrationListener: DrawersRegistrationListener | null = null;\n  private drawerOpenedListener: DrawersToggledListener | null = null;\n  private drawerClosedListener: DrawersToggledListener | null = null;\n  private drawersUpdateListeners: Array<DrawersUpdateListener> = [];\n  private drawerResizeListener: DrawersResizeListener | null = null;\n\n  scheduleUpdate = debounce(() => {\n    this.drawersRegistrationListener?.(this.drawers);\n    this.drawersUpdateListeners.forEach(drawersUpdateListeners => {\n      drawersUpdateListeners?.(this.drawers);\n    });\n  }, 0);\n\n  registerDrawer = (config: DrawerConfig) => {\n    if (this.drawers.find(drawer => drawer.id === config.id)) {\n      reportRuntimeApiWarning('app-layout-drawers', `drawer with id \"${config.id}\" is already registered`);\n    }\n    this.drawers = this.drawers.concat(config);\n    this.scheduleUpdate();\n  };\n\n  updateDrawer = ({ id: drawerId, ...rest }: UpdateDrawerConfig) => {\n    const drawerIndex = this.drawers.findIndex(({ id }) => id === drawerId);\n    const oldDrawerConfig = this.drawers?.[drawerIndex];\n    if (!oldDrawerConfig) {\n      throw new Error(`[AwsUi] [runtime drawers] drawer with id ${drawerId} not found`);\n    }\n    const drawers = this.drawers.slice();\n    const updatedDrawer = { ...oldDrawerConfig };\n    for (const key of updatableProperties) {\n      if (key in rest) {\n        updatedDrawer[key] = (rest as any)[key];\n      }\n    }\n    drawers[drawerIndex] = updatedDrawer;\n    this.drawers = drawers;\n    this.scheduleUpdate();\n  };\n\n  onDrawersRegistered = (listener: DrawersRegistrationListener) => {\n    if (this.drawersRegistrationListener !== null) {\n      reportRuntimeApiWarning(\n        'app-layout-drawers',\n        'multiple app layout instances detected when calling onDrawersRegistered'\n      );\n    }\n    this.drawersRegistrationListener = listener;\n    this.scheduleUpdate();\n    return () => {\n      this.drawersRegistrationListener = null;\n      this.drawersUpdateListeners = [];\n    };\n  };\n\n  clearRegisteredDrawers = () => {\n    this.drawers = [];\n  };\n\n  onDrawerOpened = (listener: DrawersToggledListener) => {\n    if (this.drawerOpenedListener !== null) {\n      reportRuntimeApiWarning(\n        'app-layout-drawers',\n        'multiple app layout instances detected when calling onDrawerOpened'\n      );\n    }\n\n    this.drawerOpenedListener = listener;\n\n    return () => {\n      this.drawerOpenedListener = null;\n    };\n  };\n\n  onDrawerClosed = (listener: DrawersToggledListener) => {\n    if (this.drawerClosedListener !== null) {\n      reportRuntimeApiWarning(\n        'app-layout-drawers',\n        'multiple app layout instances detected when calling onDrawerClosed'\n      );\n    }\n\n    this.drawerClosedListener = listener;\n\n    return () => {\n      this.drawerClosedListener = null;\n    };\n  };\n\n  openDrawer = (drawerId: string, params?: OpenCloseDrawerParams) => {\n    this.drawerOpenedListener?.(drawerId, params);\n  };\n\n  closeDrawer = (drawerId: string, params?: OpenCloseDrawerParams) => {\n    this.drawerClosedListener?.(drawerId, params);\n  };\n\n  onDrawersUpdated = (listener: DrawersUpdateListener) => {\n    this.drawersUpdateListeners.push(listener);\n\n    return () => {\n      this.drawersUpdateListeners = this.drawersUpdateListeners.filter(item => item !== listener);\n    };\n  };\n\n  onDrawerResize = (listener: DrawersResizeListener) => {\n    if (this.drawerResizeListener !== null) {\n      reportRuntimeApiWarning(\n        'app-layout-drawers',\n        'multiple app layout instances detected when calling onDrawerResize'\n      );\n    }\n\n    this.drawerResizeListener = listener;\n\n    return () => {\n      this.drawerResizeListener = null;\n    };\n  };\n\n  resizeDrawer = (drawerId: string, size: number) => {\n    this.drawerResizeListener?.(drawerId, size);\n  };\n\n  getDrawersState = () => {\n    return this.drawers;\n  };\n\n  installPublic(api: Partial<DrawersApiPublic> = {}): DrawersApiPublic {\n    api.registerDrawer ??= this.registerDrawer;\n    api.updateDrawer ??= this.updateDrawer;\n    api.openDrawer ??= this.openDrawer;\n    api.closeDrawer ??= this.closeDrawer;\n    api.resizeDrawer ??= this.resizeDrawer;\n    return api as DrawersApiPublic;\n  }\n\n  installInternal(internalApi: Partial<DrawersApiInternal> = {}): DrawersApiInternal {\n    internalApi.clearRegisteredDrawers ??= this.clearRegisteredDrawers;\n    internalApi.onDrawersRegistered ??= this.onDrawersRegistered;\n    internalApi.onDrawerOpened ??= this.onDrawerOpened;\n    internalApi.onDrawerClosed ??= this.onDrawerClosed;\n    internalApi.onDrawerResize ??= this.onDrawerResize;\n    internalApi.onDrawersUpdated ??= this.onDrawersUpdated;\n    internalApi.getDrawersState ??= this.getDrawersState;\n    return internalApi as DrawersApiInternal;\n  }\n}\n"]}
+{"version":3,"file":"drawers.js","sourceRoot":"","sources":["../../../../../src/internal/plugins/controllers/drawers.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 { ButtonGroupProps } from '../../../button-group/interfaces';\nimport debounce from '../../debounce';\nimport { NonCancelableEventHandler } from '../../events';\nimport { reportRuntimeApiWarning } from '../helpers/metrics';\n\ntype DrawerVisibilityChange = (callback: (isVisible: boolean) => void) => void;\n\ninterface MountContentContext {\n  onVisibilityChange: DrawerVisibilityChange;\n}\n\nexport interface DrawerStateChangeParams {\n  isOpen: boolean;\n  initiatedByUserAction?: boolean;\n}\n\nexport interface DrawerConfig {\n  id: string;\n  type?: 'local' | 'global';\n  ariaLabels: {\n    content?: string;\n    closeButton?: string;\n    triggerButton?: string;\n    resizeHandle?: string;\n    resizeHandleTooltipText?: string;\n    expandedModeButton?: string;\n  };\n  isExpandable?: boolean;\n  badge?: boolean;\n  resizable?: boolean;\n  defaultSize?: number;\n  onResize?: NonCancelableEventHandler<{ size: number; id: string }>;\n  orderPriority?: number;\n  defaultActive?: boolean;\n  trigger?: {\n    iconSvg?: string;\n  };\n  mountContent: (container: HTMLElement, mountContext: MountContentContext) => void;\n  unmountContent: (container: HTMLElement) => void;\n  preserveInactiveContent?: boolean;\n  onToggle?: NonCancelableEventHandler<DrawerStateChangeParams>;\n  headerActions?: ReadonlyArray<ButtonGroupProps.Item>;\n  onHeaderActionClick?: NonCancelableEventHandler<ButtonGroupProps.ItemClickDetails>;\n}\n\nconst updatableProperties = [\n  'badge',\n  'resizable',\n  'defaultSize',\n  'orderPriority',\n  'defaultActive',\n  'onResize',\n] as const;\n\nexport type UpdateDrawerConfig = { id: DrawerConfig['id'] } & Partial<\n  Pick<DrawerConfig, (typeof updatableProperties)[number]>\n>;\n\ntype DrawersRegistrationListener = (drawers: Array<DrawerConfig>) => void;\ntype DrawersUpdateListener = (drawers: Array<DrawerConfig>) => void;\n\nexport type DrawersToggledListener = (drawerId: string, params?: OpenCloseDrawerParams) => void;\ntype DrawersResizeListener = (drawerId: string, size: number) => void;\n\ninterface OpenCloseDrawerParams {\n  initiatedByUserAction: boolean;\n}\n\nexport interface DrawersApiPublic {\n  registerDrawer(config: DrawerConfig): void;\n  updateDrawer(config: UpdateDrawerConfig): void;\n  openDrawer(drawerId: string, params?: OpenCloseDrawerParams): void;\n  closeDrawer(drawerId: string, params?: OpenCloseDrawerParams): void;\n  resizeDrawer(drawerId: string, size: number): void;\n}\n\nexport interface DrawersApiInternal {\n  clearRegisteredDrawers(): void;\n  onDrawersRegistered(listener: DrawersRegistrationListener): () => void;\n  onDrawerOpened(listener: DrawersToggledListener): () => void;\n  onDrawerClosed(listener: DrawersToggledListener): () => void;\n  onDrawerResize(listener: DrawersResizeListener): () => void;\n  onDrawersUpdated(listener: DrawersUpdateListener): void;\n  getDrawersState(): Array<DrawerConfig>;\n}\n\nexport class DrawersController {\n  private drawers: Array<DrawerConfig> = [];\n  private drawersRegistrationListener: DrawersRegistrationListener | null = null;\n  private drawerOpenedListener: DrawersToggledListener | null = null;\n  private drawerClosedListener: DrawersToggledListener | null = null;\n  private drawersUpdateListeners: Array<DrawersUpdateListener> = [];\n  private drawerResizeListener: DrawersResizeListener | null = null;\n\n  scheduleUpdate = debounce(() => {\n    this.drawersRegistrationListener?.(this.drawers);\n    this.drawersUpdateListeners.forEach(drawersUpdateListeners => {\n      drawersUpdateListeners?.(this.drawers);\n    });\n  }, 0);\n\n  registerDrawer = (config: DrawerConfig) => {\n    if (this.drawers.find(drawer => drawer.id === config.id)) {\n      reportRuntimeApiWarning('app-layout-drawers', `drawer with id \"${config.id}\" is already registered`);\n    }\n    this.drawers = this.drawers.concat(config);\n    this.scheduleUpdate();\n  };\n\n  updateDrawer = ({ id: drawerId, ...rest }: UpdateDrawerConfig) => {\n    const drawerIndex = this.drawers.findIndex(({ id }) => id === drawerId);\n    const oldDrawerConfig = this.drawers?.[drawerIndex];\n    if (!oldDrawerConfig) {\n      throw new Error(`[AwsUi] [runtime drawers] drawer with id ${drawerId} not found`);\n    }\n    const drawers = this.drawers.slice();\n    const updatedDrawer = { ...oldDrawerConfig };\n    for (const key of updatableProperties) {\n      if (key in rest) {\n        updatedDrawer[key] = (rest as any)[key];\n      }\n    }\n    drawers[drawerIndex] = updatedDrawer;\n    this.drawers = drawers;\n    this.scheduleUpdate();\n  };\n\n  onDrawersRegistered = (listener: DrawersRegistrationListener) => {\n    if (this.drawersRegistrationListener !== null) {\n      reportRuntimeApiWarning(\n        'app-layout-drawers',\n        'multiple app layout instances detected when calling onDrawersRegistered'\n      );\n    }\n    this.drawersRegistrationListener = listener;\n    this.scheduleUpdate();\n    return () => {\n      this.drawersRegistrationListener = null;\n      this.drawersUpdateListeners = [];\n    };\n  };\n\n  clearRegisteredDrawers = () => {\n    this.drawers = [];\n  };\n\n  onDrawerOpened = (listener: DrawersToggledListener) => {\n    if (this.drawerOpenedListener !== null) {\n      reportRuntimeApiWarning(\n        'app-layout-drawers',\n        'multiple app layout instances detected when calling onDrawerOpened'\n      );\n    }\n\n    this.drawerOpenedListener = listener;\n\n    return () => {\n      this.drawerOpenedListener = null;\n    };\n  };\n\n  onDrawerClosed = (listener: DrawersToggledListener) => {\n    if (this.drawerClosedListener !== null) {\n      reportRuntimeApiWarning(\n        'app-layout-drawers',\n        'multiple app layout instances detected when calling onDrawerClosed'\n      );\n    }\n\n    this.drawerClosedListener = listener;\n\n    return () => {\n      this.drawerClosedListener = null;\n    };\n  };\n\n  openDrawer = (drawerId: string, params?: OpenCloseDrawerParams) => {\n    this.drawerOpenedListener?.(drawerId, params);\n  };\n\n  closeDrawer = (drawerId: string, params?: OpenCloseDrawerParams) => {\n    this.drawerClosedListener?.(drawerId, params);\n  };\n\n  onDrawersUpdated = (listener: DrawersUpdateListener) => {\n    this.drawersUpdateListeners.push(listener);\n\n    return () => {\n      this.drawersUpdateListeners = this.drawersUpdateListeners.filter(item => item !== listener);\n    };\n  };\n\n  onDrawerResize = (listener: DrawersResizeListener) => {\n    if (this.drawerResizeListener !== null) {\n      reportRuntimeApiWarning(\n        'app-layout-drawers',\n        'multiple app layout instances detected when calling onDrawerResize'\n      );\n    }\n\n    this.drawerResizeListener = listener;\n\n    return () => {\n      this.drawerResizeListener = null;\n    };\n  };\n\n  resizeDrawer = (drawerId: string, size: number) => {\n    this.drawerResizeListener?.(drawerId, size);\n  };\n\n  getDrawersState = () => {\n    return this.drawers;\n  };\n\n  installPublic(api: Partial<DrawersApiPublic> = {}): DrawersApiPublic {\n    api.registerDrawer ??= this.registerDrawer;\n    api.updateDrawer ??= this.updateDrawer;\n    api.openDrawer ??= this.openDrawer;\n    api.closeDrawer ??= this.closeDrawer;\n    api.resizeDrawer ??= this.resizeDrawer;\n    return api as DrawersApiPublic;\n  }\n\n  installInternal(internalApi: Partial<DrawersApiInternal> = {}): DrawersApiInternal {\n    internalApi.clearRegisteredDrawers ??= this.clearRegisteredDrawers;\n    internalApi.onDrawersRegistered ??= this.onDrawersRegistered;\n    internalApi.onDrawerOpened ??= this.onDrawerOpened;\n    internalApi.onDrawerClosed ??= this.onDrawerClosed;\n    internalApi.onDrawerResize ??= this.onDrawerResize;\n    internalApi.onDrawersUpdated ??= this.onDrawersUpdated;\n    internalApi.getDrawersState ??= this.getDrawersState;\n    return internalApi as DrawersApiInternal;\n  }\n}\n"]}

package/lib/internal/template/internal/plugins/helpers/use-global-breadcrumbs.js

@@ -1,4 +1,3 @@
-import { __rest } from "tslib";
 // Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
 // SPDX-License-Identifier: Apache-2.0
 import { useContext, useEffect, useLayoutEffect, useRef, useState } from 'react';
@@ -6,11 +5,10 @@ import { useAppLayoutFlagEnabled } from '../../../app-layout/utils/feature-flags
 import { AppLayoutVisibilityContext, BreadcrumbsSlotContext, } from '../../../app-layout/visual-refresh-toolbar/contexts';
 import { metrics } from '../../metrics';
 import { awsuiPluginsInternal } from '../api';
-function useSetGlobalBreadcrumbsImplementation(_a) {
-    var _b, _c;
-    var { __disableGlobalization } = _a, props = __rest(_a, ["__disableGlobalization"]);
-    const { isInToolbar } = (_b = useContext(BreadcrumbsSlotContext)) !== null && _b !== void 0 ? _b : {};
-    const isLayoutVisible = (_c = useContext(AppLayoutVisibilityContext)) !== null && _c !== void 0 ? _c : true;
+function useSetGlobalBreadcrumbsImplementation({ __disableGlobalization, ...props }) {
+    var _a, _b;
+    const { isInToolbar } = (_a = useContext(BreadcrumbsSlotContext)) !== null && _a !== void 0 ? _a : {};
+    const isLayoutVisible = (_b = useContext(AppLayoutVisibilityContext)) !== null && _b !== void 0 ? _b : true;
     const registrationRef = useRef();
     const [registered, setRegistered] = useState(false);
     useEffect(() => {

package/lib/internal/template/internal/plugins/helpers/use-global-breadcrumbs.js.map

@@ -1 +1 @@
-{"version":3,"file":"use-global-breadcrumbs.js","sourceRoot":"","sources":["../../../../../src/internal/plugins/helpers/use-global-breadcrumbs.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 { useContext, useEffect, useLayoutEffect, useRef, useState } from 'react';\n\nimport { useAppLayoutFlagEnabled } from '../../../app-layout/utils/feature-flags';\nimport {\n  AppLayoutVisibilityContext,\n  BreadcrumbsSlotContext,\n} from '../../../app-layout/visual-refresh-toolbar/contexts';\nimport { BreadcrumbGroupProps } from '../../../breadcrumb-group/interfaces';\nimport { metrics } from '../../metrics';\nimport { awsuiPluginsInternal } from '../api';\nimport { BreadcrumbsGlobalRegistration } from '../controllers/breadcrumbs';\n\nfunction useSetGlobalBreadcrumbsImplementation({\n  __disableGlobalization,\n  ...props\n}: BreadcrumbGroupProps<any> & { __disableGlobalization?: boolean }) {\n  const { isInToolbar } = useContext(BreadcrumbsSlotContext) ?? {};\n  const isLayoutVisible = useContext(AppLayoutVisibilityContext) ?? true;\n  const registrationRef = useRef<BreadcrumbsGlobalRegistration<BreadcrumbGroupProps> | null>();\n  const [registered, setRegistered] = useState(false);\n\n  useEffect(() => {\n    if (isInToolbar || __disableGlobalization || !isLayoutVisible) {\n      return;\n    }\n    const registration = awsuiPluginsInternal.breadcrumbs.registerBreadcrumbs(props, isRegistered => {\n      setRegistered(isRegistered ?? true);\n      if (isRegistered) {\n        const breadcrumbs = props.items.map(item => item.text).join(' > ');\n        metrics.sendOpsMetricObject('awsui-global-breadcrumbs-used', { breadcrumbs });\n      }\n    });\n    registrationRef.current = registration;\n\n    return () => {\n      registration.cleanup();\n    };\n    // subsequent prop changes are handled by another effect\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [isInToolbar, __disableGlobalization, isLayoutVisible]);\n\n  useLayoutEffect(() => {\n    registrationRef.current?.update(props);\n  });\n\n  return registered;\n}\n\nexport function useSetGlobalBreadcrumbs<T extends BreadcrumbGroupProps.Item>(props: BreadcrumbGroupProps<T>) {\n  // avoid additional side effects when this feature is not active\n  if (!useAppLayoutFlagEnabled()) {\n    return false;\n  }\n  // getGlobalFlag() value does not change without full page reload\n  // eslint-disable-next-line react-hooks/rules-of-hooks\n  return useSetGlobalBreadcrumbsImplementation(props);\n}\n\nexport function useGetGlobalBreadcrumbs(enabled: boolean) {\n  const [discoveredBreadcrumbs, setDiscoveredBreadcrumbs] = useState<BreadcrumbGroupProps<any> | null>(null);\n\n  useEffect(() => {\n    if (!enabled) {\n      return;\n    }\n    const unregisterAppLayout = awsuiPluginsInternal.breadcrumbs.registerAppLayout(breadcrumbs => {\n      setDiscoveredBreadcrumbs(breadcrumbs);\n    });\n    return () => {\n      unregisterAppLayout?.();\n      setDiscoveredBreadcrumbs(null);\n    };\n  }, [enabled]);\n\n  return discoveredBreadcrumbs;\n}\n"]}
+{"version":3,"file":"use-global-breadcrumbs.js","sourceRoot":"","sources":["../../../../../src/internal/plugins/helpers/use-global-breadcrumbs.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 { useContext, useEffect, useLayoutEffect, useRef, useState } from 'react';\n\nimport { useAppLayoutFlagEnabled } from '../../../app-layout/utils/feature-flags';\nimport {\n  AppLayoutVisibilityContext,\n  BreadcrumbsSlotContext,\n} from '../../../app-layout/visual-refresh-toolbar/contexts';\nimport { BreadcrumbGroupProps } from '../../../breadcrumb-group/interfaces';\nimport { metrics } from '../../metrics';\nimport { awsuiPluginsInternal } from '../api';\nimport { BreadcrumbsGlobalRegistration } from '../controllers/breadcrumbs';\n\nfunction useSetGlobalBreadcrumbsImplementation({\n  __disableGlobalization,\n  ...props\n}: BreadcrumbGroupProps<any> & { __disableGlobalization?: boolean }) {\n  const { isInToolbar } = useContext(BreadcrumbsSlotContext) ?? {};\n  const isLayoutVisible = useContext(AppLayoutVisibilityContext) ?? true;\n  const registrationRef = useRef<BreadcrumbsGlobalRegistration<BreadcrumbGroupProps> | null>();\n  const [registered, setRegistered] = useState(false);\n\n  useEffect(() => {\n    if (isInToolbar || __disableGlobalization || !isLayoutVisible) {\n      return;\n    }\n    const registration = awsuiPluginsInternal.breadcrumbs.registerBreadcrumbs(props, isRegistered => {\n      setRegistered(isRegistered ?? true);\n      if (isRegistered) {\n        const breadcrumbs = props.items.map(item => item.text).join(' > ');\n        metrics.sendOpsMetricObject('awsui-global-breadcrumbs-used', { breadcrumbs });\n      }\n    });\n    registrationRef.current = registration;\n\n    return () => {\n      registration.cleanup();\n    };\n    // subsequent prop changes are handled by another effect\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [isInToolbar, __disableGlobalization, isLayoutVisible]);\n\n  useLayoutEffect(() => {\n    registrationRef.current?.update(props);\n  });\n\n  return registered;\n}\n\nexport function useSetGlobalBreadcrumbs<T extends BreadcrumbGroupProps.Item>(props: BreadcrumbGroupProps<T>) {\n  // avoid additional side effects when this feature is not active\n  if (!useAppLayoutFlagEnabled()) {\n    return false;\n  }\n  // getGlobalFlag() value does not change without full page reload\n  // eslint-disable-next-line react-hooks/rules-of-hooks\n  return useSetGlobalBreadcrumbsImplementation(props);\n}\n\nexport function useGetGlobalBreadcrumbs(enabled: boolean) {\n  const [discoveredBreadcrumbs, setDiscoveredBreadcrumbs] = useState<BreadcrumbGroupProps<any> | null>(null);\n\n  useEffect(() => {\n    if (!enabled) {\n      return;\n    }\n    const unregisterAppLayout = awsuiPluginsInternal.breadcrumbs.registerAppLayout(breadcrumbs => {\n      setDiscoveredBreadcrumbs(breadcrumbs);\n    });\n    return () => {\n      unregisterAppLayout?.();\n      setDiscoveredBreadcrumbs(null);\n    };\n  }, [enabled]);\n\n  return discoveredBreadcrumbs;\n}\n"]}

package/lib/internal/template/internal/plugins/widget/index.js

@@ -17,7 +17,7 @@ export function registerLeftDrawer(drawer) {
  */
 export function registerBottomDrawer(drawer) {
     var _a;
-    const message = { type: 'registerBottomDrawer', payload: Object.assign(Object.assign({}, drawer), { position: 'bottom' }) };
+    const message = { type: 'registerBottomDrawer', payload: { ...drawer, position: 'bottom' } };
     pushInitialMessage(message);
     (_a = getAppLayoutMessageHandler()) === null || _a === void 0 ? void 0 : _a(message);
 }

package/lib/internal/template/internal/plugins/widget/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../src/internal/plugins/widget/index.ts"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AAEtC,OAAO,EAAE,0BAA0B,EAAE,kBAAkB,EAAE,MAAM,QAAQ,CAAC;AAGxE;;;GAGG;AACH,MAAM,UAAU,kBAAkB,CAAC,MAAqB;;IACtD,MAAM,OAAO,GAA0B,EAAE,IAAI,EAAE,oBAAoB,EAAE,OAAO,EAAE,MAAM,EAAE,CAAC;IACvF,kBAAkB,CAAC,OAAO,CAAC,CAAC;IAC5B,MAAA,0BAA0B,EAAE,0CAAG,OAAO,CAAC,CAAC;AAC1C,CAAC;AAED;;;GAGG;AACH,MAAM,UAAU,oBAAoB,CAAC,MAAqB;;IACxD,MAAM,OAAO,GAA0B,EAAE,IAAI,EAAE,sBAAsB,EAAE,OAAO,kCAAO,MAAM,KAAE,QAAQ,EAAE,QAAQ,GAAE,EAAE,CAAC;IACpH,kBAAkB,CAAC,OAAO,CAAC,CAAC;IAC5B,MAAA,0BAA0B,EAAE,0CAAG,OAAO,CAAC,CAAC;AAC1C,CAAC;AAED;;;GAGG;AACH,MAAM,UAAU,YAAY,CAAC,OAA+B;;IAC1D,MAAA,0BAA0B,EAAE,0CAAG,OAAO,CAAC,CAAC;AAC1C,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\n\nimport { getAppLayoutMessageHandler, pushInitialMessage } from './core';\nimport { AppLayoutUpdateMessage, DrawerPayload, RegisterDrawerMessage } from './interfaces';\n\n/**\n * Registers a new left runtime drawer to app layout\n * @param drawer\n */\nexport function registerLeftDrawer(drawer: DrawerPayload) {\n  const message: RegisterDrawerMessage = { type: 'registerLeftDrawer', payload: drawer };\n  pushInitialMessage(message);\n  getAppLayoutMessageHandler()?.(message);\n}\n\n/**\n * Registers a new bottom runtime drawer to app layout\n * @param drawer\n */\nexport function registerBottomDrawer(drawer: DrawerPayload) {\n  const message: RegisterDrawerMessage = { type: 'registerBottomDrawer', payload: { ...drawer, position: 'bottom' } };\n  pushInitialMessage(message);\n  getAppLayoutMessageHandler()?.(message);\n}\n\n/**\n * Interact with already registered app layout drawers\n * @param message\n */\nexport function updateDrawer(message: AppLayoutUpdateMessage) {\n  getAppLayoutMessageHandler()?.(message);\n}\n"]}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../src/internal/plugins/widget/index.ts"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AAEtC,OAAO,EAAE,0BAA0B,EAAE,kBAAkB,EAAE,MAAM,QAAQ,CAAC;AAGxE;;;GAGG;AACH,MAAM,UAAU,kBAAkB,CAAC,MAAqB;;IACtD,MAAM,OAAO,GAA0B,EAAE,IAAI,EAAE,oBAAoB,EAAE,OAAO,EAAE,MAAM,EAAE,CAAC;IACvF,kBAAkB,CAAC,OAAO,CAAC,CAAC;IAC5B,MAAA,0BAA0B,EAAE,0CAAG,OAAO,CAAC,CAAC;AAC1C,CAAC;AAED;;;GAGG;AACH,MAAM,UAAU,oBAAoB,CAAC,MAAqB;;IACxD,MAAM,OAAO,GAA0B,EAAE,IAAI,EAAE,sBAAsB,EAAE,OAAO,EAAE,EAAE,GAAG,MAAM,EAAE,QAAQ,EAAE,QAAQ,EAAE,EAAE,CAAC;IACpH,kBAAkB,CAAC,OAAO,CAAC,CAAC;IAC5B,MAAA,0BAA0B,EAAE,0CAAG,OAAO,CAAC,CAAC;AAC1C,CAAC;AAED;;;GAGG;AACH,MAAM,UAAU,YAAY,CAAC,OAA+B;;IAC1D,MAAA,0BAA0B,EAAE,0CAAG,OAAO,CAAC,CAAC;AAC1C,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\n\nimport { getAppLayoutMessageHandler, pushInitialMessage } from './core';\nimport { AppLayoutUpdateMessage, DrawerPayload, RegisterDrawerMessage } from './interfaces';\n\n/**\n * Registers a new left runtime drawer to app layout\n * @param drawer\n */\nexport function registerLeftDrawer(drawer: DrawerPayload) {\n  const message: RegisterDrawerMessage = { type: 'registerLeftDrawer', payload: drawer };\n  pushInitialMessage(message);\n  getAppLayoutMessageHandler()?.(message);\n}\n\n/**\n * Registers a new bottom runtime drawer to app layout\n * @param drawer\n */\nexport function registerBottomDrawer(drawer: DrawerPayload) {\n  const message: RegisterDrawerMessage = { type: 'registerBottomDrawer', payload: { ...drawer, position: 'bottom' } };\n  pushInitialMessage(message);\n  getAppLayoutMessageHandler()?.(message);\n}\n\n/**\n * Interact with already registered app layout drawers\n * @param message\n */\nexport function updateDrawer(message: AppLayoutUpdateMessage) {\n  getAppLayoutMessageHandler()?.(message);\n}\n"]}

package/lib/internal/template/internal/utils/with-native-attributes.js

@@ -1,4 +1,3 @@
-import { __rest } from "tslib";
 // Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
 // SPDX-License-Identifier: Apache-2.0
 import React from 'react';
@@ -12,7 +11,7 @@ export function processAttributes(rest, nativeAttributes, componentName, skipWar
             // merge style
         }
         else if (key === 'style') {
-            acc[key] = Object.assign(Object.assign({}, rest.style), value);
+            acc[key] = { ...rest.style, ...value };
             // chain event handlers
         }
         else if (key.match(/^on[A-Z]/) && typeof value === 'function' && key in rest) {
@@ -31,12 +30,11 @@ export function processAttributes(rest, nativeAttributes, componentName, skipWar
             acc[key] = value;
         }
         return acc;
-    }, Object.assign({}, rest));
+    }, { ...rest });
 }
-export default React.forwardRef((_a, ref) => {
-    var { tag, nativeAttributes, children, skipWarnings, componentName } = _a, rest = __rest(_a, ["tag", "nativeAttributes", "children", "skipWarnings", "componentName"]);
+export default React.forwardRef(({ tag, nativeAttributes, children, skipWarnings, componentName, ...rest }, ref) => {
     const Tag = tag;
     const processedAttributes = processAttributes(rest, nativeAttributes, componentName, skipWarnings);
-    return (React.createElement(Tag, Object.assign({}, processedAttributes, { ref: ref }), children));
+    return (React.createElement(Tag, { ...processedAttributes, ref: ref }, children));
 });
 //# sourceMappingURL=with-native-attributes.js.map

package/lib/internal/template/internal/utils/with-native-attributes.js.map

@@ -1 +1 @@
-{"version":3,"file":"with-native-attributes.js","sourceRoot":"","sources":["../../../../src/internal/utils/with-native-attributes.tsx"],"names":[],"mappings":";AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,KAAoB,MAAM,OAAO,CAAC;AACzC,OAAO,IAAI,MAAM,MAAM,CAAC;AAExB,OAAO,EAAE,QAAQ,EAAE,MAAM,+CAA+C,CAAC;AAqBzE,MAAM,UAAU,iBAAiB,CAC/B,IAAiH,EACjH,gBAAsC,EACtC,aAAqB,EACrB,YAA2B;IAE3B,OAAO,MAAM,CAAC,OAAO,CAAC,gBAAgB,IAAI,EAAE,CAAC,CAAC,MAAM,CAClD,CAAC,GAAG,EAAE,CAAC,GAAG,EAAE,KAAK,CAAC,EAAE,EAAE;QACpB,wBAAwB;QACxB,IAAI,GAAG,KAAK,WAAW,EAAE,CAAC;YACxB,GAAG,CAAC,GAAG,CAAC,GAAG,IAAI,CAAC,IAAI,CAAC,SAAS,EAAE,KAAK,CAAC,CAAC;YAEvC,cAAc;QAChB,CAAC;aAAM,IAAI,GAAG,KAAK,OAAO,EAAE,CAAC;YAC3B,GAAG,CAAC,GAAG,CAAC,mCAAQ,IAAI,CAAC,KAAK,GAAK,KAAK,CAAE,CAAC;YAEvC,uBAAuB;QACzB,CAAC;aAAM,IAAI,GAAG,CAAC,KAAK,CAAC,UAAU,CAAC,IAAI,OAAO,KAAK,KAAK,UAAU,IAAI,GAAG,IAAI,IAAI,EAAE,CAAC;YAC/E,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,KAAY,EAAE,EAAE;gBAC1B,KAAK,CAAC,KAAK,CAAC,CAAC;gBACb,IAAI,CAAC,KAAK,CAAC,gBAAgB,EAAE,CAAC;oBAC3B,IAAY,CAAC,GAAG,CAAC,CAAC,KAAK,CAAC,CAAC;gBAC5B,CAAC;YACH,CAAC,CAAC;YAEF,0DAA0D;QAC5D,CAAC;aAAM,CAAC;YACN,IAAI,GAAG,IAAI,IAAI,IAAI,CAAC,CAAC,YAAY,IAAI,CAAC,YAAY,KAAK,IAAI,IAAI,CAAC,YAAY,CAAC,QAAQ,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,CAAC;gBAC7F,QAAQ,CAAC,aAAa,EAAE,gCAAgC,GAAG,yCAAyC,CAAC,CAAC;YACxG,CAAC;YACD,GAAG,CAAC,GAAG,CAAC,GAAG,KAAK,CAAC;QACnB,CAAC;QACD,OAAO,GAAG,CAAC;IACb,CAAC,EACD,kBAAK,IAAI,CAAS,CACnB,CAAC;AACJ,CAAC;AAED,eAAe,KAAK,CAAC,UAAU,CAC7B,CACE,EAAoG,EACpG,GAAkB,EAClB,EAAE;QAFF,EAAE,GAAG,EAAE,gBAAgB,EAAE,QAAQ,EAAE,YAAY,EAAE,aAAa,OAAsC,EAAjC,IAAI,cAAvE,wEAAyE,CAAF;IAGvE,MAAM,GAAG,GAAG,GAAG,CAAC;IAEhB,MAAM,mBAAmB,GAAG,iBAAiB,CAAS,IAAI,EAAE,gBAAgB,EAAE,aAAa,EAAE,YAAY,CAAC,CAAC;IAE3G,OAAO,CACL,oBAAC,GAAG,oBAAK,mBAAmB,IAAE,GAAG,EAAE,GAAG,KACnC,QAAQ,CACL,CACP,CAAC;AACJ,CAAC,CACgB,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React, { ReactNode } from 'react';\nimport clsx from 'clsx';\n\nimport { warnOnce } from '@cloudscape-design/component-toolkit/internal';\n\nexport type NativeAttributes<T extends React.HTMLAttributes<HTMLElement>> =\n  | (Omit<T, 'children'> & Record<`data-${string}`, string>)\n  | undefined;\n\nexport type SkipWarnings = boolean | string[];\n\ntype NativeAttributesProps<AT extends React.HTMLAttributes<HTMLElement>> = {\n  tag: string;\n  children?: ReactNode;\n  skipWarnings?: SkipWarnings;\n  nativeAttributes: NativeAttributes<AT>;\n  componentName: string;\n} & NativeAttributes<AT>;\ninterface ForwardRefType {\n  <ET extends HTMLElement, AT extends React.HTMLAttributes<ET>>(\n    props: NativeAttributesProps<AT> & { ref?: React.Ref<ET> }\n  ): JSX.Element;\n}\n\nexport function processAttributes<ET extends HTMLElement, AT extends React.HTMLAttributes<ET>>(\n  rest: Omit<NativeAttributesProps<AT>, 'children' | 'tag' | 'skipWarnings' | 'componentName' | 'nativeAttributes'>,\n  nativeAttributes: NativeAttributes<AT>,\n  componentName: string,\n  skipWarnings?: SkipWarnings\n) {\n  return Object.entries(nativeAttributes || {}).reduce(\n    (acc, [key, value]) => {\n      // concatenate className\n      if (key === 'className') {\n        acc[key] = clsx(rest.className, value);\n\n        // merge style\n      } else if (key === 'style') {\n        acc[key] = { ...rest.style, ...value };\n\n        // chain event handlers\n      } else if (key.match(/^on[A-Z]/) && typeof value === 'function' && key in rest) {\n        acc[key] = (event: Event) => {\n          value(event);\n          if (!event.defaultPrevented) {\n            (rest as any)[key](event);\n          }\n        };\n\n        // override other attributes, warning if it already exists\n      } else {\n        if (key in rest && (!skipWarnings || (skipWarnings !== true && !skipWarnings.includes(key)))) {\n          warnOnce(componentName, `Overriding native attribute [${key}] which has a Cloudscape-provided value`);\n        }\n        acc[key] = value;\n      }\n      return acc;\n    },\n    { ...rest } as any\n  );\n}\n\nexport default React.forwardRef(\n  <ET extends HTMLElement, AT extends React.HTMLAttributes<ET>>(\n    { tag, nativeAttributes, children, skipWarnings, componentName, ...rest }: NativeAttributesProps<AT>,\n    ref: React.Ref<ET>\n  ) => {\n    const Tag = tag;\n\n    const processedAttributes = processAttributes<ET, AT>(rest, nativeAttributes, componentName, skipWarnings);\n\n    return (\n      <Tag {...processedAttributes} ref={ref}>\n        {children}\n      </Tag>\n    );\n  }\n) as ForwardRefType;\n"]}
+{"version":3,"file":"with-native-attributes.js","sourceRoot":"","sources":["../../../../src/internal/utils/with-native-attributes.tsx"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,KAAoB,MAAM,OAAO,CAAC;AACzC,OAAO,IAAI,MAAM,MAAM,CAAC;AAExB,OAAO,EAAE,QAAQ,EAAE,MAAM,+CAA+C,CAAC;AAqBzE,MAAM,UAAU,iBAAiB,CAC/B,IAAiH,EACjH,gBAAsC,EACtC,aAAqB,EACrB,YAA2B;IAE3B,OAAO,MAAM,CAAC,OAAO,CAAC,gBAAgB,IAAI,EAAE,CAAC,CAAC,MAAM,CAClD,CAAC,GAAG,EAAE,CAAC,GAAG,EAAE,KAAK,CAAC,EAAE,EAAE;QACpB,wBAAwB;QACxB,IAAI,GAAG,KAAK,WAAW,EAAE,CAAC;YACxB,GAAG,CAAC,GAAG,CAAC,GAAG,IAAI,CAAC,IAAI,CAAC,SAAS,EAAE,KAAK,CAAC,CAAC;YAEvC,cAAc;QAChB,CAAC;aAAM,IAAI,GAAG,KAAK,OAAO,EAAE,CAAC;YAC3B,GAAG,CAAC,GAAG,CAAC,GAAG,EAAE,GAAG,IAAI,CAAC,KAAK,EAAE,GAAG,KAAK,EAAE,CAAC;YAEvC,uBAAuB;QACzB,CAAC;aAAM,IAAI,GAAG,CAAC,KAAK,CAAC,UAAU,CAAC,IAAI,OAAO,KAAK,KAAK,UAAU,IAAI,GAAG,IAAI,IAAI,EAAE,CAAC;YAC/E,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,KAAY,EAAE,EAAE;gBAC1B,KAAK,CAAC,KAAK,CAAC,CAAC;gBACb,IAAI,CAAC,KAAK,CAAC,gBAAgB,EAAE,CAAC;oBAC3B,IAAY,CAAC,GAAG,CAAC,CAAC,KAAK,CAAC,CAAC;gBAC5B,CAAC;YACH,CAAC,CAAC;YAEF,0DAA0D;QAC5D,CAAC;aAAM,CAAC;YACN,IAAI,GAAG,IAAI,IAAI,IAAI,CAAC,CAAC,YAAY,IAAI,CAAC,YAAY,KAAK,IAAI,IAAI,CAAC,YAAY,CAAC,QAAQ,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,CAAC;gBAC7F,QAAQ,CAAC,aAAa,EAAE,gCAAgC,GAAG,yCAAyC,CAAC,CAAC;YACxG,CAAC;YACD,GAAG,CAAC,GAAG,CAAC,GAAG,KAAK,CAAC;QACnB,CAAC;QACD,OAAO,GAAG,CAAC;IACb,CAAC,EACD,EAAE,GAAG,IAAI,EAAS,CACnB,CAAC;AACJ,CAAC;AAED,eAAe,KAAK,CAAC,UAAU,CAC7B,CACE,EAAE,GAAG,EAAE,gBAAgB,EAAE,QAAQ,EAAE,YAAY,EAAE,aAAa,EAAE,GAAG,IAAI,EAA6B,EACpG,GAAkB,EAClB,EAAE;IACF,MAAM,GAAG,GAAG,GAAG,CAAC;IAEhB,MAAM,mBAAmB,GAAG,iBAAiB,CAAS,IAAI,EAAE,gBAAgB,EAAE,aAAa,EAAE,YAAY,CAAC,CAAC;IAE3G,OAAO,CACL,oBAAC,GAAG,OAAK,mBAAmB,EAAE,GAAG,EAAE,GAAG,IACnC,QAAQ,CACL,CACP,CAAC;AACJ,CAAC,CACgB,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React, { ReactNode } from 'react';\nimport clsx from 'clsx';\n\nimport { warnOnce } from '@cloudscape-design/component-toolkit/internal';\n\nexport type NativeAttributes<T extends React.HTMLAttributes<HTMLElement>> =\n  | (Omit<T, 'children'> & Record<`data-${string}`, string>)\n  | undefined;\n\nexport type SkipWarnings = boolean | string[];\n\ntype NativeAttributesProps<AT extends React.HTMLAttributes<HTMLElement>> = {\n  tag: string;\n  children?: ReactNode;\n  skipWarnings?: SkipWarnings;\n  nativeAttributes: NativeAttributes<AT>;\n  componentName: string;\n} & NativeAttributes<AT>;\ninterface ForwardRefType {\n  <ET extends HTMLElement, AT extends React.HTMLAttributes<ET>>(\n    props: NativeAttributesProps<AT> & { ref?: React.Ref<ET> }\n  ): JSX.Element;\n}\n\nexport function processAttributes<ET extends HTMLElement, AT extends React.HTMLAttributes<ET>>(\n  rest: Omit<NativeAttributesProps<AT>, 'children' | 'tag' | 'skipWarnings' | 'componentName' | 'nativeAttributes'>,\n  nativeAttributes: NativeAttributes<AT>,\n  componentName: string,\n  skipWarnings?: SkipWarnings\n) {\n  return Object.entries(nativeAttributes || {}).reduce(\n    (acc, [key, value]) => {\n      // concatenate className\n      if (key === 'className') {\n        acc[key] = clsx(rest.className, value);\n\n        // merge style\n      } else if (key === 'style') {\n        acc[key] = { ...rest.style, ...value };\n\n        // chain event handlers\n      } else if (key.match(/^on[A-Z]/) && typeof value === 'function' && key in rest) {\n        acc[key] = (event: Event) => {\n          value(event);\n          if (!event.defaultPrevented) {\n            (rest as any)[key](event);\n          }\n        };\n\n        // override other attributes, warning if it already exists\n      } else {\n        if (key in rest && (!skipWarnings || (skipWarnings !== true && !skipWarnings.includes(key)))) {\n          warnOnce(componentName, `Overriding native attribute [${key}] which has a Cloudscape-provided value`);\n        }\n        acc[key] = value;\n      }\n      return acc;\n    },\n    { ...rest } as any\n  );\n}\n\nexport default React.forwardRef(\n  <ET extends HTMLElement, AT extends React.HTMLAttributes<ET>>(\n    { tag, nativeAttributes, children, skipWarnings, componentName, ...rest }: NativeAttributesProps<AT>,\n    ref: React.Ref<ET>\n  ) => {\n    const Tag = tag;\n\n    const processedAttributes = processAttributes<ET, AT>(rest, nativeAttributes, componentName, skipWarnings);\n\n    return (\n      <Tag {...processedAttributes} ref={ref}>\n        {children}\n      </Tag>\n    );\n  }\n) as ForwardRefType;\n"]}

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

@@ -8,9 +8,9 @@ export function createWidgetizedComponent(Implementation, Skeleton) {
         return (props => {
             const isRefresh = useVisualRefresh();
             if (isRefresh && getGlobalFlag('appLayoutWidget') && Loader) {
-                return React.createElement(Loader, Object.assign({ Skeleton: Skeleton }, props));
+                return React.createElement(Loader, { Skeleton: Skeleton, ...props });
             }
-            return React.createElement(Implementation, Object.assign({}, props));
+            return React.createElement(Implementation, { ...props });
         });
     };
 }

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

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/internal/widgets/index.tsx"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAE,aAAa,EAAE,MAAM,+CAA+C,CAAC;AAE9E,OAAO,EAAE,gBAAgB,EAAE,MAAM,0BAA0B,CAAC;AAO5D,MAAM,UAAU,yBAAyB,CACvC,cAAyB,EACzB,QAAmG;IAEnG,OAAO,CAAC,MAAkB,EAAa,EAAE;QACvC,OAAO,CAAC,KAAK,CAAC,EAAE;YACd,MAAM,SAAS,GAAG,gBAAgB,EAAE,CAAC;YACrC,IAAI,SAAS,IAAI,aAAa,CAAC,iBAAiB,CAAC,IAAI,MAAM,EAAE,CAAC;gBAC5D,OAAO,oBAAC,MAAM,kBAAC,QAAQ,EAAE,QAAQ,IAAO,KAAa,EAAI,CAAC;YAC5D,CAAC;YAED,OAAO,oBAAC,cAAc,oBAAM,KAAa,EAAI,CAAC;QAChD,CAAC,CAAc,CAAC;IAClB,CAAC,CAAC;AACJ,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 { getGlobalFlag } from '@cloudscape-design/component-toolkit/internal';\n\nimport { useVisualRefresh } from '../hooks/use-visual-mode';\n\n// Built-in React.FunctionComponent has always present `children` property which is not desired\nexport type FunctionComponent<Props extends object> = (props: Props) => JSX.Element | null;\nexport type PropsType<Component extends FunctionComponent<any>> =\n  Component extends FunctionComponent<infer Props> ? Props : never;\n\nexport function createWidgetizedComponent<Component extends FunctionComponent<any>>(\n  Implementation: Component,\n  Skeleton?: React.ForwardRefExoticComponent<PropsType<Component> & React.RefAttributes<HTMLElement>>\n) {\n  return (Loader?: Component): Component => {\n    return (props => {\n      const isRefresh = useVisualRefresh();\n      if (isRefresh && getGlobalFlag('appLayoutWidget') && Loader) {\n        return <Loader Skeleton={Skeleton} {...(props as any)} />;\n      }\n\n      return <Implementation {...(props as any)} />;\n    }) as Component;\n  };\n}\n"]}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/internal/widgets/index.tsx"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAE,aAAa,EAAE,MAAM,+CAA+C,CAAC;AAE9E,OAAO,EAAE,gBAAgB,EAAE,MAAM,0BAA0B,CAAC;AAO5D,MAAM,UAAU,yBAAyB,CACvC,cAAyB,EACzB,QAAmG;IAEnG,OAAO,CAAC,MAAkB,EAAa,EAAE;QACvC,OAAO,CAAC,KAAK,CAAC,EAAE;YACd,MAAM,SAAS,GAAG,gBAAgB,EAAE,CAAC;YACrC,IAAI,SAAS,IAAI,aAAa,CAAC,iBAAiB,CAAC,IAAI,MAAM,EAAE,CAAC;gBAC5D,OAAO,oBAAC,MAAM,IAAC,QAAQ,EAAE,QAAQ,KAAO,KAAa,GAAI,CAAC;YAC5D,CAAC;YAED,OAAO,oBAAC,cAAc,OAAM,KAAa,GAAI,CAAC;QAChD,CAAC,CAAc,CAAC;IAClB,CAAC,CAAC;AACJ,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 { getGlobalFlag } from '@cloudscape-design/component-toolkit/internal';\n\nimport { useVisualRefresh } from '../hooks/use-visual-mode';\n\n// Built-in React.FunctionComponent has always present `children` property which is not desired\nexport type FunctionComponent<Props extends object> = (props: Props) => JSX.Element | null;\nexport type PropsType<Component extends FunctionComponent<any>> =\n  Component extends FunctionComponent<infer Props> ? Props : never;\n\nexport function createWidgetizedComponent<Component extends FunctionComponent<any>>(\n  Implementation: Component,\n  Skeleton?: React.ForwardRefExoticComponent<PropsType<Component> & React.RefAttributes<HTMLElement>>\n) {\n  return (Loader?: Component): Component => {\n    return (props => {\n      const isRefresh = useVisualRefresh();\n      if (isRefresh && getGlobalFlag('appLayoutWidget') && Loader) {\n        return <Loader Skeleton={Skeleton} {...(props as any)} />;\n      }\n\n      return <Implementation {...(props as any)} />;\n    }) as Component;\n  };\n}\n"]}

package/lib/internal/template/internal/widgets/loader-mock.js

@@ -33,11 +33,11 @@ export function createLoadableComponent(Component) {
             };
         }, []);
         if (mounted) {
-            return React.createElement(Component, Object.assign({}, props));
+            return React.createElement(Component, { ...props });
         }
         // this prop is injected in `createWidgetizedComponent` and is not a part of the component signature
         const { Skeleton } = props;
-        return Skeleton ? React.createElement(Skeleton, Object.assign({}, props)) : React.createElement("div", null);
+        return Skeleton ? React.createElement(Skeleton, { ...props }) : React.createElement("div", null);
     });
 }
 //# sourceMappingURL=loader-mock.js.map

package/lib/internal/template/internal/widgets/loader-mock.js.map

@@ -1 +1 @@
-{"version":3,"file":"loader-mock.js","sourceRoot":"","sources":["../../../../src/internal/widgets/loader-mock.tsx"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,KAAK,EAAE,EAAE,SAAS,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAInD,MAAM,aAAa,GAAG,CAAC,QAAgB,EAAE,EAAE;;IACzC,MAAM,UAAU,GAAQ,OAAO,MAAM,KAAK,WAAW,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,UAAU,CAAC;IAC5E,MAAM,sBAAsB,GAAG,MAAM,CAAC,GAAG,CAAC,oBAAoB,CAAC,CAAC;IAChE,OAAO,MAAA,UAAU,aAAV,UAAU,uBAAV,UAAU,CAAG,sBAA6B,CAAC,0CAAG,QAAe,CAAC,CAAC;AACxE,CAAC,CAAC;AAEF,MAAM,wBAAwB,GAAG,GAAG,EAAE;IACpC,OAAO,CAAC,CAAC,aAAa,CAAC,wBAAwB,CAAC,CAAC;AACnD,CAAC,CAAC;AAEF,MAAM,uBAAuB,GAAG,wBAAwB,EAAE,CAAC;AAE3D,IAAI,WAA0B,CAAC;AAE/B,MAAM,UAAU,uBAAuB,CACrC,SAAwB;IAExB,IAAI,CAAC,uBAAuB,EAAE,CAAC;QAC7B,OAAO;IACT,CAAC;IACD,OAAO,CAAC,CAAC,KAA+B,EAAE,EAAE;QAC1C,MAAM,CAAC,OAAO,EAAE,UAAU,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAC;QAE9C,SAAS,CAAC,GAAG,EAAE;YACb,IAAI,CAAC,WAAW,EAAE,CAAC;gBACjB,WAAW,GAAG,IAAI,OAAO,CAAC,OAAO,CAAC,EAAE,CAAC,UAAU,CAAC,GAAG,EAAE,CAAC,OAAO,EAAE,EAAE,IAAI,CAAC,CAAC,CAAC;YAC1E,CAAC;YACD,IAAI,OAAO,GAAG,IAAI,CAAC;YACnB,WAAW,CAAC,IAAI,CAAC,GAAG,EAAE;gBACpB,IAAI,OAAO,EAAE,CAAC;oBACZ,UAAU,CAAC,IAAI,CAAC,CAAC;gBACnB,CAAC;YACH,CAAC,CAAC,CAAC;YACH,OAAO,GAAG,EAAE;gBACV,OAAO,GAAG,KAAK,CAAC;YAClB,CAAC,CAAC;QACJ,CAAC,EAAE,EAAE,CAAC,CAAC;QAEP,IAAI,OAAO,EAAE,CAAC;YACZ,OAAO,oBAAC,SAAS,oBAAK,KAAK,EAAI,CAAC;QAClC,CAAC;QACD,oGAAoG;QACpG,MAAM,EAAE,QAAQ,EAAE,GAAG,KAAY,CAAC;QAElC,OAAO,QAAQ,CAAC,CAAC,CAAC,oBAAC,QAAQ,oBAAK,KAAK,EAAI,CAAC,CAAC,CAAC,gCAAO,CAAC;IACtD,CAAC,CAAkB,CAAC;AACtB,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React, { useEffect, useState } from 'react';\n\nimport { FunctionComponent, PropsType } from './index';\n\nconst getCustomFlag = (flagName: string) => {\n  const flagHolder: any = typeof window !== 'undefined' ? window : globalThis;\n  const awsuiCustomFlagsSymbol = Symbol.for('awsui-custom-flags');\n  return flagHolder?.[awsuiCustomFlagsSymbol as any]?.[flagName as any];\n};\n\nconst isAppLayoutDelayedWidget = () => {\n  return !!getCustomFlag('appLayoutDelayedWidget');\n};\n\nconst enableDelayedComponents = isAppLayoutDelayedWidget();\n\nlet loadPromise: Promise<void>;\n\nexport function createLoadableComponent<ComponentType extends FunctionComponent<any>>(\n  Component: ComponentType\n): ComponentType | undefined {\n  if (!enableDelayedComponents) {\n    return;\n  }\n  return ((props: PropsType<ComponentType>) => {\n    const [mounted, setMounted] = useState(false);\n\n    useEffect(() => {\n      if (!loadPromise) {\n        loadPromise = new Promise(resolve => setTimeout(() => resolve(), 1000));\n      }\n      let mounted = true;\n      loadPromise.then(() => {\n        if (mounted) {\n          setMounted(true);\n        }\n      });\n      return () => {\n        mounted = false;\n      };\n    }, []);\n\n    if (mounted) {\n      return <Component {...props} />;\n    }\n    // this prop is injected in `createWidgetizedComponent` and is not a part of the component signature\n    const { Skeleton } = props as any;\n\n    return Skeleton ? <Skeleton {...props} /> : <div />;\n  }) as ComponentType;\n}\n"]}
+{"version":3,"file":"loader-mock.js","sourceRoot":"","sources":["../../../../src/internal/widgets/loader-mock.tsx"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,KAAK,EAAE,EAAE,SAAS,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAInD,MAAM,aAAa,GAAG,CAAC,QAAgB,EAAE,EAAE;;IACzC,MAAM,UAAU,GAAQ,OAAO,MAAM,KAAK,WAAW,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,UAAU,CAAC;IAC5E,MAAM,sBAAsB,GAAG,MAAM,CAAC,GAAG,CAAC,oBAAoB,CAAC,CAAC;IAChE,OAAO,MAAA,UAAU,aAAV,UAAU,uBAAV,UAAU,CAAG,sBAA6B,CAAC,0CAAG,QAAe,CAAC,CAAC;AACxE,CAAC,CAAC;AAEF,MAAM,wBAAwB,GAAG,GAAG,EAAE;IACpC,OAAO,CAAC,CAAC,aAAa,CAAC,wBAAwB,CAAC,CAAC;AACnD,CAAC,CAAC;AAEF,MAAM,uBAAuB,GAAG,wBAAwB,EAAE,CAAC;AAE3D,IAAI,WAA0B,CAAC;AAE/B,MAAM,UAAU,uBAAuB,CACrC,SAAwB;IAExB,IAAI,CAAC,uBAAuB,EAAE,CAAC;QAC7B,OAAO;IACT,CAAC;IACD,OAAO,CAAC,CAAC,KAA+B,EAAE,EAAE;QAC1C,MAAM,CAAC,OAAO,EAAE,UAAU,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAC;QAE9C,SAAS,CAAC,GAAG,EAAE;YACb,IAAI,CAAC,WAAW,EAAE,CAAC;gBACjB,WAAW,GAAG,IAAI,OAAO,CAAC,OAAO,CAAC,EAAE,CAAC,UAAU,CAAC,GAAG,EAAE,CAAC,OAAO,EAAE,EAAE,IAAI,CAAC,CAAC,CAAC;YAC1E,CAAC;YACD,IAAI,OAAO,GAAG,IAAI,CAAC;YACnB,WAAW,CAAC,IAAI,CAAC,GAAG,EAAE;gBACpB,IAAI,OAAO,EAAE,CAAC;oBACZ,UAAU,CAAC,IAAI,CAAC,CAAC;gBACnB,CAAC;YACH,CAAC,CAAC,CAAC;YACH,OAAO,GAAG,EAAE;gBACV,OAAO,GAAG,KAAK,CAAC;YAClB,CAAC,CAAC;QACJ,CAAC,EAAE,EAAE,CAAC,CAAC;QAEP,IAAI,OAAO,EAAE,CAAC;YACZ,OAAO,oBAAC,SAAS,OAAK,KAAK,GAAI,CAAC;QAClC,CAAC;QACD,oGAAoG;QACpG,MAAM,EAAE,QAAQ,EAAE,GAAG,KAAY,CAAC;QAElC,OAAO,QAAQ,CAAC,CAAC,CAAC,oBAAC,QAAQ,OAAK,KAAK,GAAI,CAAC,CAAC,CAAC,gCAAO,CAAC;IACtD,CAAC,CAAkB,CAAC;AACtB,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React, { useEffect, useState } from 'react';\n\nimport { FunctionComponent, PropsType } from './index';\n\nconst getCustomFlag = (flagName: string) => {\n  const flagHolder: any = typeof window !== 'undefined' ? window : globalThis;\n  const awsuiCustomFlagsSymbol = Symbol.for('awsui-custom-flags');\n  return flagHolder?.[awsuiCustomFlagsSymbol as any]?.[flagName as any];\n};\n\nconst isAppLayoutDelayedWidget = () => {\n  return !!getCustomFlag('appLayoutDelayedWidget');\n};\n\nconst enableDelayedComponents = isAppLayoutDelayedWidget();\n\nlet loadPromise: Promise<void>;\n\nexport function createLoadableComponent<ComponentType extends FunctionComponent<any>>(\n  Component: ComponentType\n): ComponentType | undefined {\n  if (!enableDelayedComponents) {\n    return;\n  }\n  return ((props: PropsType<ComponentType>) => {\n    const [mounted, setMounted] = useState(false);\n\n    useEffect(() => {\n      if (!loadPromise) {\n        loadPromise = new Promise(resolve => setTimeout(() => resolve(), 1000));\n      }\n      let mounted = true;\n      loadPromise.then(() => {\n        if (mounted) {\n          setMounted(true);\n        }\n      });\n      return () => {\n        mounted = false;\n      };\n    }, []);\n\n    if (mounted) {\n      return <Component {...props} />;\n    }\n    // this prop is injected in `createWidgetizedComponent` and is not a part of the component signature\n    const { Skeleton } = props as any;\n\n    return Skeleton ? <Skeleton {...props} /> : <div />;\n  }) as ComponentType;\n}\n"]}

package/lib/internal/template/key-value-pairs/index.js

@@ -1,19 +1,17 @@
 // Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
 // SPDX-License-Identifier: Apache-2.0
 'use client';
-import { __rest } from "tslib";
 import React from 'react';
 import { getBaseProps } from '../internal/base-component';
 import useBaseComponent from '../internal/hooks/use-base-component';
 import { applyDisplayName } from '../internal/utils/apply-display-name';
 import InternalKeyValuePairs from './internal';
-export default function KeyValuePairs(_a) {
-    var { columns = 1, items, ariaLabel, ariaLabelledby, minColumnWidth = 150 } = _a, rest = __rest(_a, ["columns", "items", "ariaLabel", "ariaLabelledby", "minColumnWidth"]);
+export default function KeyValuePairs({ columns = 1, items, ariaLabel, ariaLabelledby, minColumnWidth = 150, ...rest }) {
     const { __internalRootRef } = useBaseComponent('KeyValuePairs', {
         props: { columns },
     });
     const baseProps = getBaseProps(rest);
-    return (React.createElement(InternalKeyValuePairs, Object.assign({ columns: columns, items: items, ariaLabel: ariaLabel, ariaLabelledby: ariaLabelledby, minColumnWidth: minColumnWidth }, baseProps, { ref: __internalRootRef })));
+    return (React.createElement(InternalKeyValuePairs, { columns: columns, items: items, ariaLabel: ariaLabel, ariaLabelledby: ariaLabelledby, minColumnWidth: minColumnWidth, ...baseProps, ref: __internalRootRef }));
 }
 applyDisplayName(KeyValuePairs, 'KeyValuePairs');
 //# sourceMappingURL=index.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/key-value-pairs/index.tsx"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AACtC,YAAY,CAAC;;AACb,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAE,YAAY,EAAE,MAAM,4BAA4B,CAAC;AAC1D,OAAO,gBAAgB,MAAM,sCAAsC,CAAC;AACpE,OAAO,EAAE,gBAAgB,EAAE,MAAM,sCAAsC,CAAC;AAExE,OAAO,qBAAqB,MAAM,YAAY,CAAC;AAI/C,MAAM,CAAC,OAAO,UAAU,aAAa,CAAC,EAOjB;QAPiB,EACpC,OAAO,GAAG,CAAC,EACX,KAAK,EACL,SAAS,EACT,cAAc,EACd,cAAc,GAAG,GAAG,OAED,EADhB,IAAI,cAN6B,qEAOrC,CADQ;IAEP,MAAM,EAAE,iBAAiB,EAAE,GAAG,gBAAgB,CAAC,eAAe,EAAE;QAC9D,KAAK,EAAE,EAAE,OAAO,EAAE;KACnB,CAAC,CAAC;IACH,MAAM,SAAS,GAAG,YAAY,CAAC,IAAI,CAAC,CAAC;IAErC,OAAO,CACL,oBAAC,qBAAqB,kBACpB,OAAO,EAAE,OAAO,EAChB,KAAK,EAAE,KAAK,EACZ,SAAS,EAAE,SAAS,EACpB,cAAc,EAAE,cAAc,EAC9B,cAAc,EAAE,cAAc,IAC1B,SAAS,IACb,GAAG,EAAE,iBAAiB,IACtB,CACH,CAAC;AACJ,CAAC;AAED,gBAAgB,CAAC,aAAa,EAAE,eAAe,CAAC,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\n'use client';\nimport React from 'react';\n\nimport { getBaseProps } from '../internal/base-component';\nimport useBaseComponent from '../internal/hooks/use-base-component';\nimport { applyDisplayName } from '../internal/utils/apply-display-name';\nimport { KeyValuePairsProps } from './interfaces';\nimport InternalKeyValuePairs from './internal';\n\nexport { KeyValuePairsProps };\n\nexport default function KeyValuePairs({\n  columns = 1,\n  items,\n  ariaLabel,\n  ariaLabelledby,\n  minColumnWidth = 150,\n  ...rest\n}: KeyValuePairsProps) {\n  const { __internalRootRef } = useBaseComponent('KeyValuePairs', {\n    props: { columns },\n  });\n  const baseProps = getBaseProps(rest);\n\n  return (\n    <InternalKeyValuePairs\n      columns={columns}\n      items={items}\n      ariaLabel={ariaLabel}\n      ariaLabelledby={ariaLabelledby}\n      minColumnWidth={minColumnWidth}\n      {...baseProps}\n      ref={__internalRootRef}\n    />\n  );\n}\n\napplyDisplayName(KeyValuePairs, 'KeyValuePairs');\n"]}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/key-value-pairs/index.tsx"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AACtC,YAAY,CAAC;AACb,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAE,YAAY,EAAE,MAAM,4BAA4B,CAAC;AAC1D,OAAO,gBAAgB,MAAM,sCAAsC,CAAC;AACpE,OAAO,EAAE,gBAAgB,EAAE,MAAM,sCAAsC,CAAC;AAExE,OAAO,qBAAqB,MAAM,YAAY,CAAC;AAI/C,MAAM,CAAC,OAAO,UAAU,aAAa,CAAC,EACpC,OAAO,GAAG,CAAC,EACX,KAAK,EACL,SAAS,EACT,cAAc,EACd,cAAc,GAAG,GAAG,EACpB,GAAG,IAAI,EACY;IACnB,MAAM,EAAE,iBAAiB,EAAE,GAAG,gBAAgB,CAAC,eAAe,EAAE;QAC9D,KAAK,EAAE,EAAE,OAAO,EAAE;KACnB,CAAC,CAAC;IACH,MAAM,SAAS,GAAG,YAAY,CAAC,IAAI,CAAC,CAAC;IAErC,OAAO,CACL,oBAAC,qBAAqB,IACpB,OAAO,EAAE,OAAO,EAChB,KAAK,EAAE,KAAK,EACZ,SAAS,EAAE,SAAS,EACpB,cAAc,EAAE,cAAc,EAC9B,cAAc,EAAE,cAAc,KAC1B,SAAS,EACb,GAAG,EAAE,iBAAiB,GACtB,CACH,CAAC;AACJ,CAAC;AAED,gBAAgB,CAAC,aAAa,EAAE,eAAe,CAAC,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\n'use client';\nimport React from 'react';\n\nimport { getBaseProps } from '../internal/base-component';\nimport useBaseComponent from '../internal/hooks/use-base-component';\nimport { applyDisplayName } from '../internal/utils/apply-display-name';\nimport { KeyValuePairsProps } from './interfaces';\nimport InternalKeyValuePairs from './internal';\n\nexport { KeyValuePairsProps };\n\nexport default function KeyValuePairs({\n  columns = 1,\n  items,\n  ariaLabel,\n  ariaLabelledby,\n  minColumnWidth = 150,\n  ...rest\n}: KeyValuePairsProps) {\n  const { __internalRootRef } = useBaseComponent('KeyValuePairs', {\n    props: { columns },\n  });\n  const baseProps = getBaseProps(rest);\n\n  return (\n    <InternalKeyValuePairs\n      columns={columns}\n      items={items}\n      ariaLabel={ariaLabel}\n      ariaLabelledby={ariaLabelledby}\n      minColumnWidth={minColumnWidth}\n      {...baseProps}\n      ref={__internalRootRef}\n    />\n  );\n}\n\napplyDisplayName(KeyValuePairs, 'KeyValuePairs');\n"]}

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

@@ -1,4 +1,3 @@
-import { __rest } from "tslib";
 // Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
 // SPDX-License-Identifier: Apache-2.0
 import React from 'react';
@@ -20,14 +19,13 @@ const InternalKeyValuePair = ({ label, info, value, id }) => {
 const InternalKeyValuePairGroup = ({ label, value }) => (React.createElement(React.Fragment, null,
     label && React.createElement("dt", { className: styles['group-title'] }, label),
     React.createElement("dd", { className: styles.detail }, value)));
-const InternalKeyValuePairs = React.forwardRef((_a, ref) => {
-    var { columns, items, className, ariaLabel, ariaLabelledby, minColumnWidth } = _a, rest = __rest(_a, ["columns", "items", "className", "ariaLabel", "ariaLabelledby", "minColumnWidth"]);
+const InternalKeyValuePairs = React.forwardRef(({ columns, items, className, ariaLabel, ariaLabelledby, minColumnWidth, ...rest }, ref) => {
     const MAX_COLUMNS = 4;
     if (columns > MAX_COLUMNS) {
         warnOnce('Key-value pairs', `\`columns\` (${columns}) must be <= ${MAX_COLUMNS}. Using ${MAX_COLUMNS} as default.`);
     }
     return (React.createElement(LinkDefaultVariantContext.Provider, { value: { defaultVariant: 'primary' } },
-        React.createElement("div", Object.assign({}, rest, { className: clsx(styles['key-value-pairs'], className), "aria-label": ariaLabel, "aria-labelledby": ariaLabelledby, ref: ref }),
+        React.createElement("div", { ...rest, className: clsx(styles['key-value-pairs'], className), "aria-label": ariaLabel, "aria-labelledby": ariaLabelledby, ref: ref },
             React.createElement(ColumnLayout, { __tagOverride: "dl", columns: Math.min(columns, MAX_COLUMNS), variant: "text-grid", minColumnWidth: minColumnWidth }, items.map((pair, index) => {
                 if (pair.type === 'group') {
                     return (
@@ -36,9 +34,9 @@ const InternalKeyValuePairs = React.forwardRef((_a, ref) => {
                      * InternalKeyValuePairGroup is not wrapped by div tag, because it ruins a11y compatibility for dl -> dt/dd
                      *  */
                     React.createElement(InternalKeyValuePairGroup, { key: index, label: pair.title && (React.createElement(Box, { variant: "h3", padding: "n" }, pair.title)), value: React.createElement("dl", { className: styles['group-list'] }, pair.items.map((item, itemIndex) => (React.createElement("div", { key: itemIndex, className: styles['group-list-item'] },
-                            React.createElement(InternalKeyValuePair, Object.assign({}, item)))))) }));
+                            React.createElement(InternalKeyValuePair, { ...item }))))) }));
                 }
-                return React.createElement(InternalKeyValuePair, Object.assign({ key: index }, pair));
+                return React.createElement(InternalKeyValuePair, { key: index, ...pair });
             })))));
 });
 export default InternalKeyValuePairs;

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

@@ -1 +1 @@
-{"version":3,"file":"internal.js","sourceRoot":"","sources":["../../../src/key-value-pairs/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 from 'react';\nimport clsx from 'clsx';\n\nimport { useUniqueId, warnOnce } from '@cloudscape-design/component-toolkit/internal';\n\nimport Box from '../box/internal';\nimport ColumnLayout from '../column-layout/internal';\nimport { InfoLinkLabelContext } from '../internal/context/info-link-label-context';\nimport { LinkDefaultVariantContext } from '../internal/context/link-default-variant-context';\nimport { KeyValuePairsProps } from './interfaces';\n\nimport styles from './styles.css.js';\n\nconst InternalKeyValuePair = ({ label, info, value, id }: KeyValuePairsProps.Pair) => {\n  const kvPairId = useUniqueId('kv-pair-');\n\n  return (\n    <>\n      <dt className={styles.term}>\n        <div className={styles['key-label']} id={id || kvPairId}>\n          {label}\n        </div>\n        <InfoLinkLabelContext.Provider value={id || kvPairId}>\n          {info && <span className={styles.info}>{info}</span>}\n        </InfoLinkLabelContext.Provider>\n      </dt>\n      <dd className={styles.detail}>{value}</dd>\n    </>\n  );\n};\n\nconst InternalKeyValuePairGroup = ({ label, value }: { label?: React.ReactNode; value: React.ReactNode }) => (\n  <>\n    {label && <dt className={styles['group-title']}>{label}</dt>}\n    <dd className={styles.detail}>{value}</dd>\n  </>\n);\n\nconst InternalKeyValuePairs = React.forwardRef(\n  (\n    {\n      columns,\n      items,\n      className,\n      ariaLabel,\n      ariaLabelledby,\n      minColumnWidth,\n      ...rest\n    }: KeyValuePairsProps & Required<Pick<KeyValuePairsProps, 'columns'>>,\n    ref: React.Ref<HTMLDivElement>\n  ) => {\n    const MAX_COLUMNS = 4;\n\n    if (columns > MAX_COLUMNS) {\n      warnOnce(\n        'Key-value pairs',\n        `\\`columns\\` (${columns}) must be <= ${MAX_COLUMNS}. Using ${MAX_COLUMNS} as default.`\n      );\n    }\n\n    return (\n      <LinkDefaultVariantContext.Provider value={{ defaultVariant: 'primary' }}>\n        <div\n          {...rest}\n          className={clsx(styles['key-value-pairs'], className)}\n          aria-label={ariaLabel}\n          aria-labelledby={ariaLabelledby}\n          ref={ref}\n        >\n          {/*\n          minColumnWidth={150} is set to use FlexibleColumnLayout which has only 1 nested div wrapper for column items,\n          otherwise GridColumnLayout will be used, which has 2 nested div, therefore it is not a11y compatible for dl -> dt/dd relationship\n        */}\n          <ColumnLayout\n            __tagOverride=\"dl\"\n            columns={Math.min(columns, MAX_COLUMNS)}\n            variant=\"text-grid\"\n            minColumnWidth={minColumnWidth}\n          >\n            {items.map((pair, index) => {\n              if (pair.type === 'group') {\n                return (\n                  /* InternalKeyValuePairGroup tells react to treat the dt-dd pair as an individual layout item.\n                   * Otherwise, without this component, they will be rendered as a list, which ruins the html structure.\n                   * InternalKeyValuePairGroup is not wrapped by div tag, because it ruins a11y compatibility for dl -> dt/dd\n                   *  */\n                  <InternalKeyValuePairGroup\n                    key={index}\n                    label={\n                      pair.title && (\n                        <Box variant=\"h3\" padding=\"n\">\n                          {pair.title}\n                        </Box>\n                      )\n                    }\n                    value={\n                      <dl className={styles['group-list']}>\n                        {pair.items.map((item, itemIndex) => (\n                          <div key={itemIndex} className={styles['group-list-item']}>\n                            <InternalKeyValuePair {...item} />\n                          </div>\n                        ))}\n                      </dl>\n                    }\n                  />\n                );\n              }\n\n              return <InternalKeyValuePair key={index} {...pair} />;\n            })}\n          </ColumnLayout>\n        </div>\n      </LinkDefaultVariantContext.Provider>\n    );\n  }\n);\n\nexport default InternalKeyValuePairs;\n"]}
+{"version":3,"file":"internal.js","sourceRoot":"","sources":["../../../src/key-value-pairs/internal.tsx"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,IAAI,MAAM,MAAM,CAAC;AAExB,OAAO,EAAE,WAAW,EAAE,QAAQ,EAAE,MAAM,+CAA+C,CAAC;AAEtF,OAAO,GAAG,MAAM,iBAAiB,CAAC;AAClC,OAAO,YAAY,MAAM,2BAA2B,CAAC;AACrD,OAAO,EAAE,oBAAoB,EAAE,MAAM,6CAA6C,CAAC;AACnF,OAAO,EAAE,yBAAyB,EAAE,MAAM,kDAAkD,CAAC;AAG7F,OAAO,MAAM,MAAM,iBAAiB,CAAC;AAErC,MAAM,oBAAoB,GAAG,CAAC,EAAE,KAAK,EAAE,IAAI,EAAE,KAAK,EAAE,EAAE,EAA2B,EAAE,EAAE;IACnF,MAAM,QAAQ,GAAG,WAAW,CAAC,UAAU,CAAC,CAAC;IAEzC,OAAO,CACL;QACE,4BAAI,SAAS,EAAE,MAAM,CAAC,IAAI;YACxB,6BAAK,SAAS,EAAE,MAAM,CAAC,WAAW,CAAC,EAAE,EAAE,EAAE,EAAE,IAAI,QAAQ,IACpD,KAAK,CACF;YACN,oBAAC,oBAAoB,CAAC,QAAQ,IAAC,KAAK,EAAE,EAAE,IAAI,QAAQ,IACjD,IAAI,IAAI,8BAAM,SAAS,EAAE,MAAM,CAAC,IAAI,IAAG,IAAI,CAAQ,CACtB,CAC7B;QACL,4BAAI,SAAS,EAAE,MAAM,CAAC,MAAM,IAAG,KAAK,CAAM,CACzC,CACJ,CAAC;AACJ,CAAC,CAAC;AAEF,MAAM,yBAAyB,GAAG,CAAC,EAAE,KAAK,EAAE,KAAK,EAAuD,EAAE,EAAE,CAAC,CAC3G;IACG,KAAK,IAAI,4BAAI,SAAS,EAAE,MAAM,CAAC,aAAa,CAAC,IAAG,KAAK,CAAM;IAC5D,4BAAI,SAAS,EAAE,MAAM,CAAC,MAAM,IAAG,KAAK,CAAM,CACzC,CACJ,CAAC;AAEF,MAAM,qBAAqB,GAAG,KAAK,CAAC,UAAU,CAC5C,CACE,EACE,OAAO,EACP,KAAK,EACL,SAAS,EACT,SAAS,EACT,cAAc,EACd,cAAc,EACd,GAAG,IAAI,EAC4D,EACrE,GAA8B,EAC9B,EAAE;IACF,MAAM,WAAW,GAAG,CAAC,CAAC;IAEtB,IAAI,OAAO,GAAG,WAAW,EAAE,CAAC;QAC1B,QAAQ,CACN,iBAAiB,EACjB,gBAAgB,OAAO,gBAAgB,WAAW,WAAW,WAAW,cAAc,CACvF,CAAC;IACJ,CAAC;IAED,OAAO,CACL,oBAAC,yBAAyB,CAAC,QAAQ,IAAC,KAAK,EAAE,EAAE,cAAc,EAAE,SAAS,EAAE;QACtE,gCACM,IAAI,EACR,SAAS,EAAE,IAAI,CAAC,MAAM,CAAC,iBAAiB,CAAC,EAAE,SAAS,CAAC,gBACzC,SAAS,qBACJ,cAAc,EAC/B,GAAG,EAAE,GAAG;YAMR,oBAAC,YAAY,IACX,aAAa,EAAC,IAAI,EAClB,OAAO,EAAE,IAAI,CAAC,GAAG,CAAC,OAAO,EAAE,WAAW,CAAC,EACvC,OAAO,EAAC,WAAW,EACnB,cAAc,EAAE,cAAc,IAE7B,KAAK,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE,KAAK,EAAE,EAAE;gBACzB,IAAI,IAAI,CAAC,IAAI,KAAK,OAAO,EAAE,CAAC;oBAC1B,OAAO;oBACL;;;0BAGM;oBACN,oBAAC,yBAAyB,IACxB,GAAG,EAAE,KAAK,EACV,KAAK,EACH,IAAI,CAAC,KAAK,IAAI,CACZ,oBAAC,GAAG,IAAC,OAAO,EAAC,IAAI,EAAC,OAAO,EAAC,GAAG,IAC1B,IAAI,CAAC,KAAK,CACP,CACP,EAEH,KAAK,EACH,4BAAI,SAAS,EAAE,MAAM,CAAC,YAAY,CAAC,IAChC,IAAI,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE,SAAS,EAAE,EAAE,CAAC,CACnC,6BAAK,GAAG,EAAE,SAAS,EAAE,SAAS,EAAE,MAAM,CAAC,iBAAiB,CAAC;4BACvD,oBAAC,oBAAoB,OAAK,IAAI,GAAI,CAC9B,CACP,CAAC,CACC,GAEP,CACH,CAAC;gBACJ,CAAC;gBAED,OAAO,oBAAC,oBAAoB,IAAC,GAAG,EAAE,KAAK,KAAM,IAAI,GAAI,CAAC;YACxD,CAAC,CAAC,CACW,CACX,CAC6B,CACtC,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,eAAe,qBAAqB,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React from 'react';\nimport clsx from 'clsx';\n\nimport { useUniqueId, warnOnce } from '@cloudscape-design/component-toolkit/internal';\n\nimport Box from '../box/internal';\nimport ColumnLayout from '../column-layout/internal';\nimport { InfoLinkLabelContext } from '../internal/context/info-link-label-context';\nimport { LinkDefaultVariantContext } from '../internal/context/link-default-variant-context';\nimport { KeyValuePairsProps } from './interfaces';\n\nimport styles from './styles.css.js';\n\nconst InternalKeyValuePair = ({ label, info, value, id }: KeyValuePairsProps.Pair) => {\n  const kvPairId = useUniqueId('kv-pair-');\n\n  return (\n    <>\n      <dt className={styles.term}>\n        <div className={styles['key-label']} id={id || kvPairId}>\n          {label}\n        </div>\n        <InfoLinkLabelContext.Provider value={id || kvPairId}>\n          {info && <span className={styles.info}>{info}</span>}\n        </InfoLinkLabelContext.Provider>\n      </dt>\n      <dd className={styles.detail}>{value}</dd>\n    </>\n  );\n};\n\nconst InternalKeyValuePairGroup = ({ label, value }: { label?: React.ReactNode; value: React.ReactNode }) => (\n  <>\n    {label && <dt className={styles['group-title']}>{label}</dt>}\n    <dd className={styles.detail}>{value}</dd>\n  </>\n);\n\nconst InternalKeyValuePairs = React.forwardRef(\n  (\n    {\n      columns,\n      items,\n      className,\n      ariaLabel,\n      ariaLabelledby,\n      minColumnWidth,\n      ...rest\n    }: KeyValuePairsProps & Required<Pick<KeyValuePairsProps, 'columns'>>,\n    ref: React.Ref<HTMLDivElement>\n  ) => {\n    const MAX_COLUMNS = 4;\n\n    if (columns > MAX_COLUMNS) {\n      warnOnce(\n        'Key-value pairs',\n        `\\`columns\\` (${columns}) must be <= ${MAX_COLUMNS}. Using ${MAX_COLUMNS} as default.`\n      );\n    }\n\n    return (\n      <LinkDefaultVariantContext.Provider value={{ defaultVariant: 'primary' }}>\n        <div\n          {...rest}\n          className={clsx(styles['key-value-pairs'], className)}\n          aria-label={ariaLabel}\n          aria-labelledby={ariaLabelledby}\n          ref={ref}\n        >\n          {/*\n          minColumnWidth={150} is set to use FlexibleColumnLayout which has only 1 nested div wrapper for column items,\n          otherwise GridColumnLayout will be used, which has 2 nested div, therefore it is not a11y compatible for dl -> dt/dd relationship\n        */}\n          <ColumnLayout\n            __tagOverride=\"dl\"\n            columns={Math.min(columns, MAX_COLUMNS)}\n            variant=\"text-grid\"\n            minColumnWidth={minColumnWidth}\n          >\n            {items.map((pair, index) => {\n              if (pair.type === 'group') {\n                return (\n                  /* InternalKeyValuePairGroup tells react to treat the dt-dd pair as an individual layout item.\n                   * Otherwise, without this component, they will be rendered as a list, which ruins the html structure.\n                   * InternalKeyValuePairGroup is not wrapped by div tag, because it ruins a11y compatibility for dl -> dt/dd\n                   *  */\n                  <InternalKeyValuePairGroup\n                    key={index}\n                    label={\n                      pair.title && (\n                        <Box variant=\"h3\" padding=\"n\">\n                          {pair.title}\n                        </Box>\n                      )\n                    }\n                    value={\n                      <dl className={styles['group-list']}>\n                        {pair.items.map((item, itemIndex) => (\n                          <div key={itemIndex} className={styles['group-list-item']}>\n                            <InternalKeyValuePair {...item} />\n                          </div>\n                        ))}\n                      </dl>\n                    }\n                  />\n                );\n              }\n\n              return <InternalKeyValuePair key={index} {...pair} />;\n            })}\n          </ColumnLayout>\n        </div>\n      </LinkDefaultVariantContext.Provider>\n    );\n  }\n);\n\nexport default InternalKeyValuePairs;\n"]}

package/lib/internal/template/line-chart/index.js

@@ -1,7 +1,6 @@
 // Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
 // SPDX-License-Identifier: Apache-2.0
 'use client';
-import { __rest } from "tslib";
 import React from 'react';
 import clsx from 'clsx';
 import { getBaseProps } from '../internal/base-component';
@@ -9,8 +8,7 @@ import useBaseComponent from '../internal/hooks/use-base-component';
 import { applyDisplayName } from '../internal/utils/apply-display-name';
 import InternalMixedLineBarChart from '../mixed-line-bar-chart/internal';
 import styles from './styles.css.js';
-function LineChart(_a) {
-    var { series = [], height = 500, xScaleType = 'linear', yScaleType = 'linear', detailPopoverSize = 'medium', statusType = 'finished', emphasizeBaselineAxis = true } = _a, props = __rest(_a, ["series", "height", "xScaleType", "yScaleType", "detailPopoverSize", "statusType", "emphasizeBaselineAxis"]);
+function LineChart({ series = [], height = 500, xScaleType = 'linear', yScaleType = 'linear', detailPopoverSize = 'medium', statusType = 'finished', emphasizeBaselineAxis = true, ...props }) {
     const baseComponentProps = useBaseComponent('LineChart', {
         props: {
             detailPopoverSize,
@@ -24,7 +22,7 @@ function LineChart(_a) {
     });
     const baseProps = getBaseProps(props);
     const className = clsx(baseProps.className, styles.root);
-    return (React.createElement(InternalMixedLineBarChart, Object.assign({}, props, baseComponentProps, { className: className, height: height, xScaleType: xScaleType, yScaleType: yScaleType, stackedBars: false, horizontalBars: false, series: series, detailPopoverSize: detailPopoverSize, statusType: statusType, emphasizeBaselineAxis: emphasizeBaselineAxis })));
+    return (React.createElement(InternalMixedLineBarChart, { ...props, ...baseComponentProps, className: className, height: height, xScaleType: xScaleType, yScaleType: yScaleType, stackedBars: false, horizontalBars: false, series: series, detailPopoverSize: detailPopoverSize, statusType: statusType, emphasizeBaselineAxis: emphasizeBaselineAxis }));
 }
 applyDisplayName(LineChart, 'LineChart');
 export default LineChart;

package/lib/internal/template/line-chart/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/line-chart/index.tsx"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AACtC,YAAY,CAAC;;AACb,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,IAAI,MAAM,MAAM,CAAC;AAExB,OAAO,EAAE,YAAY,EAAE,MAAM,4BAA4B,CAAC;AAC1D,OAAO,gBAAgB,MAAM,sCAAsC,CAAC;AACpE,OAAO,EAAE,gBAAgB,EAAE,MAAM,sCAAsC,CAAC;AACxE,OAAO,yBAAyB,MAAM,kCAAkC,CAAC;AAGzE,OAAO,MAAM,MAAM,iBAAiB,CAAC;AAIrC,SAAS,SAAS,CAAmC,EASjC;QATiC,EACnD,MAAM,GAAG,EAAE,EACX,MAAM,GAAG,GAAG,EACZ,UAAU,GAAG,QAAQ,EACrB,UAAU,GAAG,QAAQ,EACrB,iBAAiB,GAAG,QAAQ,EAC5B,UAAU,GAAG,UAAU,EACvB,qBAAqB,GAAG,IAAI,OAEV,EADf,KAAK,cAR2C,4GASpD,CADS;IAER,MAAM,kBAAkB,GAAG,gBAAgB,CAAC,WAAW,EAAE;QACvD,KAAK,EAAE;YACL,iBAAiB;YACjB,qBAAqB;YACrB,SAAS,EAAE,KAAK,CAAC,SAAS;YAC1B,UAAU,EAAE,KAAK,CAAC,UAAU;YAC5B,UAAU,EAAE,KAAK,CAAC,UAAU;YAC5B,UAAU;YACV,UAAU;SACX;KACF,CAAC,CAAC;IACH,MAAM,SAAS,GAAG,YAAY,CAAC,KAAK,CAAC,CAAC;IACtC,MAAM,SAAS,GAAG,IAAI,CAAC,SAAS,CAAC,SAAS,EAAE,MAAM,CAAC,IAAI,CAAC,CAAC;IAEzD,OAAO,CACL,oBAAC,yBAAyB,oBACpB,KAAK,EACL,kBAAkB,IACtB,SAAS,EAAE,SAAS,EACpB,MAAM,EAAE,MAAM,EACd,UAAU,EAAE,UAAU,EACtB,UAAU,EAAE,UAAU,EACtB,WAAW,EAAE,KAAK,EAClB,cAAc,EAAE,KAAK,EACrB,MAAM,EAAE,MAAM,EACd,iBAAiB,EAAE,iBAAiB,EACpC,UAAU,EAAE,UAAU,EACtB,qBAAqB,EAAE,qBAAqB,IAC5C,CACH,CAAC;AACJ,CAAC;AAED,gBAAgB,CAAC,SAAS,EAAE,WAAW,CAAC,CAAC;AAEzC,eAAe,SAAS,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\n'use client';\nimport React from 'react';\nimport clsx from 'clsx';\n\nimport { getBaseProps } from '../internal/base-component';\nimport useBaseComponent from '../internal/hooks/use-base-component';\nimport { applyDisplayName } from '../internal/utils/apply-display-name';\nimport InternalMixedLineBarChart from '../mixed-line-bar-chart/internal';\nimport { LineChartProps } from './interfaces';\n\nimport styles from './styles.css.js';\n\nexport { LineChartProps };\n\nfunction LineChart<T extends number | string | Date>({\n  series = [],\n  height = 500,\n  xScaleType = 'linear',\n  yScaleType = 'linear',\n  detailPopoverSize = 'medium',\n  statusType = 'finished',\n  emphasizeBaselineAxis = true,\n  ...props\n}: LineChartProps<T>) {\n  const baseComponentProps = useBaseComponent('LineChart', {\n    props: {\n      detailPopoverSize,\n      emphasizeBaselineAxis,\n      fitHeight: props.fitHeight,\n      hideFilter: props.hideFilter,\n      hideLegend: props.hideLegend,\n      xScaleType,\n      yScaleType,\n    },\n  });\n  const baseProps = getBaseProps(props);\n  const className = clsx(baseProps.className, styles.root);\n\n  return (\n    <InternalMixedLineBarChart\n      {...props}\n      {...baseComponentProps}\n      className={className}\n      height={height}\n      xScaleType={xScaleType}\n      yScaleType={yScaleType}\n      stackedBars={false}\n      horizontalBars={false}\n      series={series}\n      detailPopoverSize={detailPopoverSize}\n      statusType={statusType}\n      emphasizeBaselineAxis={emphasizeBaselineAxis}\n    />\n  );\n}\n\napplyDisplayName(LineChart, 'LineChart');\n\nexport default LineChart;\n"]}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/line-chart/index.tsx"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AACtC,YAAY,CAAC;AACb,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,IAAI,MAAM,MAAM,CAAC;AAExB,OAAO,EAAE,YAAY,EAAE,MAAM,4BAA4B,CAAC;AAC1D,OAAO,gBAAgB,MAAM,sCAAsC,CAAC;AACpE,OAAO,EAAE,gBAAgB,EAAE,MAAM,sCAAsC,CAAC;AACxE,OAAO,yBAAyB,MAAM,kCAAkC,CAAC;AAGzE,OAAO,MAAM,MAAM,iBAAiB,CAAC;AAIrC,SAAS,SAAS,CAAmC,EACnD,MAAM,GAAG,EAAE,EACX,MAAM,GAAG,GAAG,EACZ,UAAU,GAAG,QAAQ,EACrB,UAAU,GAAG,QAAQ,EACrB,iBAAiB,GAAG,QAAQ,EAC5B,UAAU,GAAG,UAAU,EACvB,qBAAqB,GAAG,IAAI,EAC5B,GAAG,KAAK,EACU;IAClB,MAAM,kBAAkB,GAAG,gBAAgB,CAAC,WAAW,EAAE;QACvD,KAAK,EAAE;YACL,iBAAiB;YACjB,qBAAqB;YACrB,SAAS,EAAE,KAAK,CAAC,SAAS;YAC1B,UAAU,EAAE,KAAK,CAAC,UAAU;YAC5B,UAAU,EAAE,KAAK,CAAC,UAAU;YAC5B,UAAU;YACV,UAAU;SACX;KACF,CAAC,CAAC;IACH,MAAM,SAAS,GAAG,YAAY,CAAC,KAAK,CAAC,CAAC;IACtC,MAAM,SAAS,GAAG,IAAI,CAAC,SAAS,CAAC,SAAS,EAAE,MAAM,CAAC,IAAI,CAAC,CAAC;IAEzD,OAAO,CACL,oBAAC,yBAAyB,OACpB,KAAK,KACL,kBAAkB,EACtB,SAAS,EAAE,SAAS,EACpB,MAAM,EAAE,MAAM,EACd,UAAU,EAAE,UAAU,EACtB,UAAU,EAAE,UAAU,EACtB,WAAW,EAAE,KAAK,EAClB,cAAc,EAAE,KAAK,EACrB,MAAM,EAAE,MAAM,EACd,iBAAiB,EAAE,iBAAiB,EACpC,UAAU,EAAE,UAAU,EACtB,qBAAqB,EAAE,qBAAqB,GAC5C,CACH,CAAC;AACJ,CAAC;AAED,gBAAgB,CAAC,SAAS,EAAE,WAAW,CAAC,CAAC;AAEzC,eAAe,SAAS,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\n'use client';\nimport React from 'react';\nimport clsx from 'clsx';\n\nimport { getBaseProps } from '../internal/base-component';\nimport useBaseComponent from '../internal/hooks/use-base-component';\nimport { applyDisplayName } from '../internal/utils/apply-display-name';\nimport InternalMixedLineBarChart from '../mixed-line-bar-chart/internal';\nimport { LineChartProps } from './interfaces';\n\nimport styles from './styles.css.js';\n\nexport { LineChartProps };\n\nfunction LineChart<T extends number | string | Date>({\n  series = [],\n  height = 500,\n  xScaleType = 'linear',\n  yScaleType = 'linear',\n  detailPopoverSize = 'medium',\n  statusType = 'finished',\n  emphasizeBaselineAxis = true,\n  ...props\n}: LineChartProps<T>) {\n  const baseComponentProps = useBaseComponent('LineChart', {\n    props: {\n      detailPopoverSize,\n      emphasizeBaselineAxis,\n      fitHeight: props.fitHeight,\n      hideFilter: props.hideFilter,\n      hideLegend: props.hideLegend,\n      xScaleType,\n      yScaleType,\n    },\n  });\n  const baseProps = getBaseProps(props);\n  const className = clsx(baseProps.className, styles.root);\n\n  return (\n    <InternalMixedLineBarChart\n      {...props}\n      {...baseComponentProps}\n      className={className}\n      height={height}\n      xScaleType={xScaleType}\n      yScaleType={yScaleType}\n      stackedBars={false}\n      horizontalBars={false}\n      series={series}\n      detailPopoverSize={detailPopoverSize}\n      statusType={statusType}\n      emphasizeBaselineAxis={emphasizeBaselineAxis}\n    />\n  );\n}\n\napplyDisplayName(LineChart, 'LineChart');\n\nexport default LineChart;\n"]}