@cloudscape-design/components 3.0.608 → 3.0.610

package/internal/utils/scrollable-containers.js.map

@@ -1 +1 @@
-{"version":3,"file":"scrollable-containers.js","sourceRoot":"","sources":["../../../../src/internal/utils/scrollable-containers.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 { findUpUntil } from './dom';\nexport interface BoundingBox {\n  height: number;\n  width: number;\n  top: number;\n  left: number;\n}\n\nexport const getOverflowParents = (element: HTMLElement): HTMLElement[] => {\n  const parents = [];\n  let node: HTMLElement | null = element;\n\n  while ((node = node.parentElement) && node !== document.body) {\n    getComputedStyle(node).overflow !== 'visible' && parents.push(node);\n  }\n  return parents;\n};\n\nexport const getOverflowParentDimensions = ({\n  element,\n  excludeClosestParent = false,\n  expandToViewport = false,\n  canExpandOutsideViewport = false,\n}: {\n  element: HTMLElement;\n  excludeClosestParent: boolean;\n  expandToViewport: boolean;\n  canExpandOutsideViewport: boolean;\n}): BoundingBox[] => {\n  const parents = expandToViewport\n    ? []\n    : getOverflowParents(element).map(el => {\n        const { height, width, top, left } = el.getBoundingClientRect();\n        return {\n          // Treat the whole scrollable area as the available height\n          // if we're allowed to expand past the viewport.\n          height: canExpandOutsideViewport ? el.scrollHeight : height,\n          width,\n          top,\n          left,\n        };\n      });\n\n  if (canExpandOutsideViewport && !expandToViewport) {\n    const documentDimensions = document.documentElement.getBoundingClientRect();\n    parents.push({\n      width: Math.max(documentDimensions.width, document.documentElement.clientWidth),\n      height: Math.max(documentDimensions.height, document.documentElement.clientHeight),\n      top: documentDimensions.top,\n      left: documentDimensions.left,\n    });\n  } else {\n    parents.push({\n      height: window.innerHeight,\n      width: window.innerWidth,\n      top: 0,\n      left: 0,\n    });\n  }\n\n  if (excludeClosestParent && !expandToViewport) {\n    parents.shift();\n  }\n\n  return parents;\n};\n\ntype ScrollIntoViewOptions = Parameters<HTMLElement['scrollIntoView']>[0];\n\n/**\n * Calls `scrollIntoView` on the provided element with sensible defaults. If\n * the element does not exist or does not support the `scrollIntoView`\n * method, it will do nothing. This wrapper is created to support environments\n * where the native function is not available like JSDom (feature request:\n * https://github.com/jsdom/jsdom/issues/1422).\n *\n * @param element to be scrolled into view\n * @param options native options for `scrollIntoView`\n */\nexport function scrollElementIntoView(\n  element: HTMLElement | undefined,\n  options: ScrollIntoViewOptions = { block: 'nearest', inline: 'nearest' }\n) {\n  element?.scrollIntoView?.(options);\n}\n\nexport function calculateScroll({ top, height }: BoundingBox) {\n  if (top < 0) {\n    return top;\n  } else if (top + height > window.innerHeight) {\n    if (height > window.innerHeight) {\n      return top;\n    } else {\n      return top + height - window.innerHeight;\n    }\n  }\n  return 0;\n}\n\n/**\n * For elements with fixed position, the browser's native scrollIntoView API doesn't work,\n * so we need to manually scroll to the element's position.\n * Supports only vertical scrolling.\n */\nexport function scrollRectangleIntoView(box: BoundingBox, scrollableParent?: HTMLElement) {\n  const scrollAmount = calculateScroll(box);\n  if (scrollAmount) {\n    (scrollableParent || window).scrollBy(0, scrollAmount);\n  }\n}\n\nexport function getFirstScrollableParent(element: HTMLElement): HTMLElement | undefined {\n  return (\n    findUpUntil(element, el => {\n      const overflows = el.scrollHeight > el.clientHeight;\n      return overflows && ['scroll', 'auto'].includes(getComputedStyle(el).overflowY);\n    }) || undefined\n  );\n}\n"]}
+{"version":3,"file":"scrollable-containers.js","sourceRoot":"","sources":["../../../../src/internal/utils/scrollable-containers.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 { findUpUntil } from './dom';\nexport interface BoundingBox {\n  blockSize: number;\n  inlineSize: number;\n  insetBlockStart: number;\n  insetInlineStart: number;\n}\n\nexport const getOverflowParents = (element: HTMLElement): HTMLElement[] => {\n  const parents = [];\n  let node: HTMLElement | null = element;\n\n  while ((node = node.parentElement) && node !== document.body) {\n    getComputedStyle(node).overflow !== 'visible' && parents.push(node);\n  }\n  return parents;\n};\n\nexport const getOverflowParentDimensions = ({\n  element,\n  excludeClosestParent = false,\n  expandToViewport = false,\n  canExpandOutsideViewport = false,\n}: {\n  element: HTMLElement;\n  excludeClosestParent: boolean;\n  expandToViewport: boolean;\n  canExpandOutsideViewport: boolean;\n}): BoundingBox[] => {\n  const parents = expandToViewport\n    ? []\n    : getOverflowParents(element).map(el => {\n        const { height, width, top, left } = el.getBoundingClientRect();\n        return {\n          // Treat the whole scrollable area as the available height\n          // if we're allowed to expand past the viewport.\n          blockSize: canExpandOutsideViewport ? el.scrollHeight : height,\n          inlineSize: width,\n          insetBlockStart: top,\n          insetInlineStart: left,\n        };\n      });\n\n  if (canExpandOutsideViewport && !expandToViewport) {\n    const documentDimensions = document.documentElement.getBoundingClientRect();\n    parents.push({\n      inlineSize: Math.max(documentDimensions.width, document.documentElement.clientWidth),\n      blockSize: Math.max(documentDimensions.height, document.documentElement.clientHeight),\n      insetBlockStart: documentDimensions.top,\n      insetInlineStart: documentDimensions.left,\n    });\n  } else {\n    parents.push({\n      blockSize: window.innerHeight,\n      inlineSize: window.innerWidth,\n      insetBlockStart: 0,\n      insetInlineStart: 0,\n    });\n  }\n\n  if (excludeClosestParent && !expandToViewport) {\n    parents.shift();\n  }\n\n  return parents;\n};\n\ntype ScrollIntoViewOptions = Parameters<HTMLElement['scrollIntoView']>[0];\n\n/**\n * Calls `scrollIntoView` on the provided element with sensible defaults. If\n * the element does not exist or does not support the `scrollIntoView`\n * method, it will do nothing. This wrapper is created to support environments\n * where the native function is not available like JSDom (feature request:\n * https://github.com/jsdom/jsdom/issues/1422).\n *\n * @param element to be scrolled into view\n * @param options native options for `scrollIntoView`\n */\nexport function scrollElementIntoView(\n  element: HTMLElement | undefined,\n  options: ScrollIntoViewOptions = { block: 'nearest', inline: 'nearest' }\n) {\n  element?.scrollIntoView?.(options);\n}\n\nexport function calculateScroll({ insetBlockStart, blockSize }: BoundingBox) {\n  if (insetBlockStart < 0) {\n    return insetBlockStart;\n  } else if (insetBlockStart + blockSize > window.innerHeight) {\n    if (blockSize > window.innerHeight) {\n      return insetBlockStart;\n    } else {\n      return insetBlockStart + blockSize - window.innerHeight;\n    }\n  }\n  return 0;\n}\n\n/**\n * For elements with fixed position, the browser's native scrollIntoView API doesn't work,\n * so we need to manually scroll to the element's position.\n * Supports only vertical scrolling.\n */\nexport function scrollRectangleIntoView(box: BoundingBox, scrollableParent?: HTMLElement) {\n  const scrollAmount = calculateScroll(box);\n  if (scrollAmount) {\n    (scrollableParent || window).scrollBy(0, scrollAmount);\n  }\n}\n\nexport function getFirstScrollableParent(element: HTMLElement): HTMLElement | undefined {\n  return (\n    findUpUntil(element, el => {\n      const overflows = el.scrollHeight > el.clientHeight;\n      return overflows && ['scroll', 'auto'].includes(getComputedStyle(el).overflowY);\n    }) || undefined\n  );\n}\n"]}

package/package.json

@@ -116,7 +116,7 @@
     "./internal/base-component/index.js",
     "./internal/base-component/styles.css.js"
   ],
-  "version": "3.0.608",
+  "version": "3.0.610",
   "repository": {
     "type": "git",
     "url": "https://github.com/cloudscape-design/components.git"

package/popover/container.d.ts

@@ -2,7 +2,7 @@ import React from 'react';
 import { InternalPosition, PopoverProps } from './interfaces';
 export interface PopoverContainerProps {
     /** References the element the container is positioned against. */
-    trackRef: React.RefObject<Element>;
+    trackRef: React.RefObject<HTMLElement | SVGElement>;
     /**
       Used to update the container position in case track or track position changes:
       

package/popover/container.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"container.d.ts","sourceRoot":"","sources":["../../../src/popover/container.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAkC,MAAM,OAAO,CAAC;AAKvD,OAAO,EAAE,gBAAgB,EAAE,YAAY,EAAE,MAAM,cAAc,CAAC;AAK9D,MAAM,WAAW,qBAAqB;IACpC,kEAAkE;IAClE,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC,OAAO,CAAC,CAAC;IACnC;;;;;;;;MAQE;IACF,QAAQ,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IAC3B,QAAQ,EAAE,YAAY,CAAC,QAAQ,CAAC;IAChC,MAAM,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC,QAAQ,CAAC,CAAC;IACvC,KAAK,EAAE,CAAC,QAAQ,EAAE,gBAAgB,GAAG,IAAI,KAAK,KAAK,CAAC,SAAS,CAAC;IAC9D,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B,IAAI,EAAE,YAAY,CAAC,IAAI,CAAC;IACxB,UAAU,EAAE,OAAO,CAAC;IACpB,OAAO,CAAC,EAAE,YAAY,CAAC;IAEvB,YAAY,CAAC,EAAE,OAAO,CAAC;IAGvB,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B,qBAAqB,CAAC,EAAE,OAAO,CAAC;CACjC;AAED,MAAM,CAAC,OAAO,UAAU,gBAAgB,CAAC,EACvC,QAAQ,EACR,QAAQ,EACR,QAAQ,EACR,KAAK,EACL,QAAQ,EACR,MAAM,EACN,gBAAgB,EAChB,IAAI,EACJ,UAAU,EACV,OAAO,EACP,YAAY,EACZ,gBAAgB,EAChB,qBAAqB,GACtB,EAAE,qBAAqB,eAgGvB"}
+{"version":3,"file":"container.d.ts","sourceRoot":"","sources":["../../../src/popover/container.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAkC,MAAM,OAAO,CAAC;AAKvD,OAAO,EAAE,gBAAgB,EAAE,YAAY,EAAE,MAAM,cAAc,CAAC;AAK9D,MAAM,WAAW,qBAAqB;IACpC,kEAAkE;IAClE,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC,WAAW,GAAG,UAAU,CAAC,CAAC;IACpD;;;;;;;;MAQE;IACF,QAAQ,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IAC3B,QAAQ,EAAE,YAAY,CAAC,QAAQ,CAAC;IAChC,MAAM,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC,QAAQ,CAAC,CAAC;IACvC,KAAK,EAAE,CAAC,QAAQ,EAAE,gBAAgB,GAAG,IAAI,KAAK,KAAK,CAAC,SAAS,CAAC;IAC9D,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B,IAAI,EAAE,YAAY,CAAC,IAAI,CAAC;IACxB,UAAU,EAAE,OAAO,CAAC;IACpB,OAAO,CAAC,EAAE,YAAY,CAAC;IAEvB,YAAY,CAAC,EAAE,OAAO,CAAC;IAGvB,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B,qBAAqB,CAAC,EAAE,OAAO,CAAC;CACjC;AAED,MAAM,CAAC,OAAO,UAAU,gBAAgB,CAAC,EACvC,QAAQ,EACR,QAAQ,EACR,QAAQ,EACR,KAAK,EACL,QAAQ,EACR,MAAM,EACN,gBAAgB,EAChB,IAAI,EACJ,UAAU,EACV,OAAO,EACP,YAAY,EACZ,gBAAgB,EAChB,qBAAqB,GACtB,EAAE,qBAAqB,eAgGvB"}

package/popover/container.js.map

@@ -1 +1 @@
-{"version":3,"file":"container.js","sourceRoot":"","sources":["../../../src/popover/container.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, { useLayoutEffect, useRef } from 'react';\nimport clsx from 'clsx';\nimport { nodeContains } from '@cloudscape-design/component-toolkit/dom';\nimport { useResizeObserver } from '@cloudscape-design/component-toolkit/internal';\n\nimport { InternalPosition, PopoverProps } from './interfaces';\nimport styles from './styles.css.js';\nimport { useVisualRefresh } from '../internal/hooks/use-visual-mode';\nimport usePopoverPosition from './use-popover-position.js';\n\nexport interface PopoverContainerProps {\n  /** References the element the container is positioned against. */\n  trackRef: React.RefObject<Element>;\n  /**\n    Used to update the container position in case track or track position changes:\n    \n    const trackRef = useRef<Element>(null)\n    return (<>\n      <Track style={getPosition(selectedItemId)} ref={trackRef} />\n      <PopoverContainer trackRef={trackRef} trackKey={selectedItemId} .../>\n    </>)\n  */\n  trackKey?: string | number;\n  position: PopoverProps.Position;\n  zIndex?: React.CSSProperties['zIndex'];\n  arrow: (position: InternalPosition | null) => React.ReactNode;\n  children: React.ReactNode;\n  renderWithPortal?: boolean;\n  size: PopoverProps.Size;\n  fixedWidth: boolean;\n  variant?: 'annotation';\n  // When keepPosition is true, the popover will not recalculate its position when it resizes nor when it receives clicks.\n  keepPosition?: boolean;\n  // When allowScrollToFit is true, we will scroll to the the popover if it overflows the viewport even when choosing the best possible position for it.\n  // Do not use this if the popover is open on hover, in order to avoid unexpected movement.\n  allowScrollToFit?: boolean;\n  allowVerticalOverflow?: boolean;\n}\n\nexport default function PopoverContainer({\n  position,\n  trackRef,\n  trackKey,\n  arrow,\n  children,\n  zIndex,\n  renderWithPortal,\n  size,\n  fixedWidth,\n  variant,\n  keepPosition,\n  allowScrollToFit,\n  allowVerticalOverflow,\n}: PopoverContainerProps) {\n  const bodyRef = useRef<HTMLDivElement | null>(null);\n  const contentRef = useRef<HTMLDivElement | null>(null);\n  const popoverRef = useRef<HTMLDivElement | null>(null);\n  const arrowRef = useRef<HTMLDivElement | null>(null);\n\n  const isRefresh = useVisualRefresh();\n\n  // Updates the position handler.\n  const { updatePositionHandler, popoverStyle, internalPosition, positionHandlerRef } = usePopoverPosition({\n    popoverRef,\n    bodyRef,\n    arrowRef,\n    trackRef,\n    contentRef,\n    allowScrollToFit,\n    allowVerticalOverflow,\n    preferredPosition: position,\n    renderWithPortal,\n    keepPosition,\n  });\n\n  // Recalculate position when properties change.\n  useLayoutEffect(() => {\n    updatePositionHandler();\n  }, [updatePositionHandler, trackKey]);\n\n  // Recalculate position when content size changes.\n  useResizeObserver(contentRef, () => {\n    updatePositionHandler(true);\n  });\n\n  // Recalculate position on DOM events.\n  useLayoutEffect(() => {\n    /*\n    This is a heuristic. Some layout changes are caused by user clicks (e.g. toggling the tools panel, submitting a form),\n    and by tracking the click event we can adapt the popover's position to the new layout.\n\n    TODO: extend this to Enter and Spacebar?\n    */\n\n    const onClick = (event: UIEvent | KeyboardEvent) => {\n      if (\n        // Do not update position if keepPosition is true.\n        keepPosition ||\n        // If the click was on the trigger, this will make the popover appear or disappear,\n        // so no need to update its position either in this case.\n        nodeContains(trackRef.current, event.target)\n      ) {\n        return;\n      }\n\n      requestAnimationFrame(() => {\n        updatePositionHandler();\n      });\n    };\n\n    const updatePositionOnResize = () => requestAnimationFrame(() => updatePositionHandler());\n    const refreshPosition = () => requestAnimationFrame(() => positionHandlerRef.current());\n\n    window.addEventListener('click', onClick);\n    window.addEventListener('resize', updatePositionOnResize);\n    window.addEventListener('scroll', refreshPosition, true);\n\n    return () => {\n      window.removeEventListener('click', onClick);\n      window.removeEventListener('resize', updatePositionOnResize);\n      window.removeEventListener('scroll', refreshPosition, true);\n    };\n  }, [keepPosition, positionHandlerRef, trackRef, updatePositionHandler]);\n\n  return (\n    <div\n      ref={popoverRef}\n      style={{ ...popoverStyle, zIndex }}\n      className={clsx(styles.container, isRefresh && styles.refresh)}\n    >\n      <div\n        ref={arrowRef}\n        className={clsx(styles[`container-arrow`], styles[`container-arrow-position-${internalPosition}`])}\n        aria-hidden={true}\n      >\n        {arrow(internalPosition)}\n      </div>\n\n      <div\n        ref={bodyRef}\n        className={clsx(styles['container-body'], styles[`container-body-size-${size}`], {\n          [styles['fixed-width']]: fixedWidth,\n          [styles[`container-body-variant-${variant}`]]: variant,\n        })}\n      >\n        <div ref={contentRef}>{children}</div>\n      </div>\n    </div>\n  );\n}\n"]}
+{"version":3,"file":"container.js","sourceRoot":"","sources":["../../../src/popover/container.tsx"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,KAAK,EAAE,EAAE,eAAe,EAAE,MAAM,EAAE,MAAM,OAAO,CAAC;AACvD,OAAO,IAAI,MAAM,MAAM,CAAC;AACxB,OAAO,EAAE,YAAY,EAAE,MAAM,0CAA0C,CAAC;AACxE,OAAO,EAAE,iBAAiB,EAAE,MAAM,+CAA+C,CAAC;AAGlF,OAAO,MAAM,MAAM,iBAAiB,CAAC;AACrC,OAAO,EAAE,gBAAgB,EAAE,MAAM,mCAAmC,CAAC;AACrE,OAAO,kBAAkB,MAAM,2BAA2B,CAAC;AA+B3D,MAAM,CAAC,OAAO,UAAU,gBAAgB,CAAC,EACvC,QAAQ,EACR,QAAQ,EACR,QAAQ,EACR,KAAK,EACL,QAAQ,EACR,MAAM,EACN,gBAAgB,EAChB,IAAI,EACJ,UAAU,EACV,OAAO,EACP,YAAY,EACZ,gBAAgB,EAChB,qBAAqB,GACC;IACtB,MAAM,OAAO,GAAG,MAAM,CAAwB,IAAI,CAAC,CAAC;IACpD,MAAM,UAAU,GAAG,MAAM,CAAwB,IAAI,CAAC,CAAC;IACvD,MAAM,UAAU,GAAG,MAAM,CAAwB,IAAI,CAAC,CAAC;IACvD,MAAM,QAAQ,GAAG,MAAM,CAAwB,IAAI,CAAC,CAAC;IAErD,MAAM,SAAS,GAAG,gBAAgB,EAAE,CAAC;IAErC,gCAAgC;IAChC,MAAM,EAAE,qBAAqB,EAAE,YAAY,EAAE,gBAAgB,EAAE,kBAAkB,EAAE,GAAG,kBAAkB,CAAC;QACvG,UAAU;QACV,OAAO;QACP,QAAQ;QACR,QAAQ;QACR,UAAU;QACV,gBAAgB;QAChB,qBAAqB;QACrB,iBAAiB,EAAE,QAAQ;QAC3B,gBAAgB;QAChB,YAAY;KACb,CAAC,CAAC;IAEH,+CAA+C;IAC/C,eAAe,CAAC,GAAG,EAAE;QACnB,qBAAqB,EAAE,CAAC;IAC1B,CAAC,EAAE,CAAC,qBAAqB,EAAE,QAAQ,CAAC,CAAC,CAAC;IAEtC,kDAAkD;IAClD,iBAAiB,CAAC,UAAU,EAAE,GAAG,EAAE;QACjC,qBAAqB,CAAC,IAAI,CAAC,CAAC;IAC9B,CAAC,CAAC,CAAC;IAEH,sCAAsC;IACtC,eAAe,CAAC,GAAG,EAAE;QACnB;;;;;UAKE;QAEF,MAAM,OAAO,GAAG,CAAC,KAA8B,EAAE,EAAE;YACjD;YACE,kDAAkD;YAClD,YAAY;gBACZ,mFAAmF;gBACnF,yDAAyD;gBACzD,YAAY,CAAC,QAAQ,CAAC,OAAO,EAAE,KAAK,CAAC,MAAM,CAAC,EAC5C;gBACA,OAAO;aACR;YAED,qBAAqB,CAAC,GAAG,EAAE;gBACzB,qBAAqB,EAAE,CAAC;YAC1B,CAAC,CAAC,CAAC;QACL,CAAC,CAAC;QAEF,MAAM,sBAAsB,GAAG,GAAG,EAAE,CAAC,qBAAqB,CAAC,GAAG,EAAE,CAAC,qBAAqB,EAAE,CAAC,CAAC;QAC1F,MAAM,eAAe,GAAG,GAAG,EAAE,CAAC,qBAAqB,CAAC,GAAG,EAAE,CAAC,kBAAkB,CAAC,OAAO,EAAE,CAAC,CAAC;QAExF,MAAM,CAAC,gBAAgB,CAAC,OAAO,EAAE,OAAO,CAAC,CAAC;QAC1C,MAAM,CAAC,gBAAgB,CAAC,QAAQ,EAAE,sBAAsB,CAAC,CAAC;QAC1D,MAAM,CAAC,gBAAgB,CAAC,QAAQ,EAAE,eAAe,EAAE,IAAI,CAAC,CAAC;QAEzD,OAAO,GAAG,EAAE;YACV,MAAM,CAAC,mBAAmB,CAAC,OAAO,EAAE,OAAO,CAAC,CAAC;YAC7C,MAAM,CAAC,mBAAmB,CAAC,QAAQ,EAAE,sBAAsB,CAAC,CAAC;YAC7D,MAAM,CAAC,mBAAmB,CAAC,QAAQ,EAAE,eAAe,EAAE,IAAI,CAAC,CAAC;QAC9D,CAAC,CAAC;IACJ,CAAC,EAAE,CAAC,YAAY,EAAE,kBAAkB,EAAE,QAAQ,EAAE,qBAAqB,CAAC,CAAC,CAAC;IAExE,OAAO,CACL,6BACE,GAAG,EAAE,UAAU,EACf,KAAK,kCAAO,YAAY,KAAE,MAAM,KAChC,SAAS,EAAE,IAAI,CAAC,MAAM,CAAC,SAAS,EAAE,SAAS,IAAI,MAAM,CAAC,OAAO,CAAC;QAE9D,6BACE,GAAG,EAAE,QAAQ,EACb,SAAS,EAAE,IAAI,CAAC,MAAM,CAAC,iBAAiB,CAAC,EAAE,MAAM,CAAC,4BAA4B,gBAAgB,EAAE,CAAC,CAAC,iBACrF,IAAI,IAEhB,KAAK,CAAC,gBAAgB,CAAC,CACpB;QAEN,6BACE,GAAG,EAAE,OAAO,EACZ,SAAS,EAAE,IAAI,CAAC,MAAM,CAAC,gBAAgB,CAAC,EAAE,MAAM,CAAC,uBAAuB,IAAI,EAAE,CAAC,EAAE;gBAC/E,CAAC,MAAM,CAAC,aAAa,CAAC,CAAC,EAAE,UAAU;gBACnC,CAAC,MAAM,CAAC,0BAA0B,OAAO,EAAE,CAAC,CAAC,EAAE,OAAO;aACvD,CAAC;YAEF,6BAAK,GAAG,EAAE,UAAU,IAAG,QAAQ,CAAO,CAClC,CACF,CACP,CAAC;AACJ,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React, { useLayoutEffect, useRef } from 'react';\nimport clsx from 'clsx';\nimport { nodeContains } from '@cloudscape-design/component-toolkit/dom';\nimport { useResizeObserver } from '@cloudscape-design/component-toolkit/internal';\n\nimport { InternalPosition, PopoverProps } from './interfaces';\nimport styles from './styles.css.js';\nimport { useVisualRefresh } from '../internal/hooks/use-visual-mode';\nimport usePopoverPosition from './use-popover-position.js';\n\nexport interface PopoverContainerProps {\n  /** References the element the container is positioned against. */\n  trackRef: React.RefObject<HTMLElement | SVGElement>;\n  /**\n    Used to update the container position in case track or track position changes:\n    \n    const trackRef = useRef<Element>(null)\n    return (<>\n      <Track style={getPosition(selectedItemId)} ref={trackRef} />\n      <PopoverContainer trackRef={trackRef} trackKey={selectedItemId} .../>\n    </>)\n  */\n  trackKey?: string | number;\n  position: PopoverProps.Position;\n  zIndex?: React.CSSProperties['zIndex'];\n  arrow: (position: InternalPosition | null) => React.ReactNode;\n  children: React.ReactNode;\n  renderWithPortal?: boolean;\n  size: PopoverProps.Size;\n  fixedWidth: boolean;\n  variant?: 'annotation';\n  // When keepPosition is true, the popover will not recalculate its position when it resizes nor when it receives clicks.\n  keepPosition?: boolean;\n  // When allowScrollToFit is true, we will scroll to the the popover if it overflows the viewport even when choosing the best possible position for it.\n  // Do not use this if the popover is open on hover, in order to avoid unexpected movement.\n  allowScrollToFit?: boolean;\n  allowVerticalOverflow?: boolean;\n}\n\nexport default function PopoverContainer({\n  position,\n  trackRef,\n  trackKey,\n  arrow,\n  children,\n  zIndex,\n  renderWithPortal,\n  size,\n  fixedWidth,\n  variant,\n  keepPosition,\n  allowScrollToFit,\n  allowVerticalOverflow,\n}: PopoverContainerProps) {\n  const bodyRef = useRef<HTMLDivElement | null>(null);\n  const contentRef = useRef<HTMLDivElement | null>(null);\n  const popoverRef = useRef<HTMLDivElement | null>(null);\n  const arrowRef = useRef<HTMLDivElement | null>(null);\n\n  const isRefresh = useVisualRefresh();\n\n  // Updates the position handler.\n  const { updatePositionHandler, popoverStyle, internalPosition, positionHandlerRef } = usePopoverPosition({\n    popoverRef,\n    bodyRef,\n    arrowRef,\n    trackRef,\n    contentRef,\n    allowScrollToFit,\n    allowVerticalOverflow,\n    preferredPosition: position,\n    renderWithPortal,\n    keepPosition,\n  });\n\n  // Recalculate position when properties change.\n  useLayoutEffect(() => {\n    updatePositionHandler();\n  }, [updatePositionHandler, trackKey]);\n\n  // Recalculate position when content size changes.\n  useResizeObserver(contentRef, () => {\n    updatePositionHandler(true);\n  });\n\n  // Recalculate position on DOM events.\n  useLayoutEffect(() => {\n    /*\n    This is a heuristic. Some layout changes are caused by user clicks (e.g. toggling the tools panel, submitting a form),\n    and by tracking the click event we can adapt the popover's position to the new layout.\n\n    TODO: extend this to Enter and Spacebar?\n    */\n\n    const onClick = (event: UIEvent | KeyboardEvent) => {\n      if (\n        // Do not update position if keepPosition is true.\n        keepPosition ||\n        // If the click was on the trigger, this will make the popover appear or disappear,\n        // so no need to update its position either in this case.\n        nodeContains(trackRef.current, event.target)\n      ) {\n        return;\n      }\n\n      requestAnimationFrame(() => {\n        updatePositionHandler();\n      });\n    };\n\n    const updatePositionOnResize = () => requestAnimationFrame(() => updatePositionHandler());\n    const refreshPosition = () => requestAnimationFrame(() => positionHandlerRef.current());\n\n    window.addEventListener('click', onClick);\n    window.addEventListener('resize', updatePositionOnResize);\n    window.addEventListener('scroll', refreshPosition, true);\n\n    return () => {\n      window.removeEventListener('click', onClick);\n      window.removeEventListener('resize', updatePositionOnResize);\n      window.removeEventListener('scroll', refreshPosition, true);\n    };\n  }, [keepPosition, positionHandlerRef, trackRef, updatePositionHandler]);\n\n  return (\n    <div\n      ref={popoverRef}\n      style={{ ...popoverStyle, zIndex }}\n      className={clsx(styles.container, isRefresh && styles.refresh)}\n    >\n      <div\n        ref={arrowRef}\n        className={clsx(styles[`container-arrow`], styles[`container-arrow-position-${internalPosition}`])}\n        aria-hidden={true}\n      >\n        {arrow(internalPosition)}\n      </div>\n\n      <div\n        ref={bodyRef}\n        className={clsx(styles['container-body'], styles[`container-body-size-${size}`], {\n          [styles['fixed-width']]: fixedWidth,\n          [styles[`container-body-variant-${variant}`]]: variant,\n        })}\n      >\n        <div ref={contentRef}>{children}</div>\n      </div>\n    </div>\n  );\n}\n"]}

package/popover/interfaces.d.ts

@@ -65,12 +65,12 @@ export interface PopoverProps extends BaseComponentProps {
  */
 export type InternalPosition = 'right-top' | 'right-bottom' | 'left-top' | 'left-bottom' | 'top-center' | 'top-right' | 'top-left' | 'bottom-center' | 'bottom-right' | 'bottom-left';
 export interface Offset {
-    left: number;
-    top: number;
+    insetInlineStart: number;
+    insetBlockStart: number;
 }
 export interface Dimensions {
-    width: number;
-    height: number;
+    inlineSize: number;
+    blockSize: number;
 }
 export type BoundingBox = Dimensions & Offset;
 export declare namespace PopoverProps {

package/popover/interfaces.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"interfaces.d.ts","sourceRoot":"","sources":["../../../src/popover/interfaces.ts"],"names":[],"mappings":";AAEA,OAAO,EAAE,kBAAkB,EAAE,MAAM,4BAA4B,CAAC;AAEhE,MAAM,WAAW,YAAa,SAAQ,kBAAkB;IACtD;;;;OAIG;IACH,QAAQ,CAAC,EAAE,YAAY,CAAC,QAAQ,CAAC;IAEjC;;OAEG;IACH,IAAI,CAAC,EAAE,YAAY,CAAC,IAAI,CAAC;IAEzB;;;OAGG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IAErB;;;;OAIG;IACH,WAAW,CAAC,EAAE,YAAY,CAAC,WAAW,CAAC;IAEvC;;;OAGG;IACH,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAE1B;;;OAGG;IACH,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAE3B;;OAEG;IACH,MAAM,CAAC,EAAE,MAAM,CAAC;IAEhB;;OAEG;IACH,OAAO,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAE1B;;OAEG;IACH,aAAa,CAAC,EAAE,OAAO,CAAC;IAExB;;;OAGG;IACH,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAE1B;;;;;;;;OAQG;IACH,gBAAgB,CAAC,EAAE,OAAO,CAAC;CAC5B;AAED;;GAEG;AACH,MAAM,MAAM,gBAAgB,GACxB,WAAW,GACX,cAAc,GACd,UAAU,GACV,aAAa,GACb,YAAY,GACZ,WAAW,GACX,UAAU,GACV,eAAe,GACf,cAAc,GACd,aAAa,CAAC;AAElB,MAAM,WAAW,MAAM;IACrB,IAAI,EAAE,MAAM,CAAC;IACb,GAAG,EAAE,MAAM,CAAC;CACb;AAED,MAAM,WAAW,UAAU;IACzB,KAAK,EAAE,MAAM,CAAC;IACd,MAAM,EAAE,MAAM,CAAC;CAChB;AAED,MAAM,MAAM,WAAW,GAAG,UAAU,GAAG,MAAM,CAAC;AAE9C,yBAAiB,YAAY,CAAC;IAC5B,KAAY,QAAQ,GAAG,KAAK,GAAG,OAAO,GAAG,QAAQ,GAAG,MAAM,CAAC;IAC3D,KAAY,IAAI,GAAG,OAAO,GAAG,QAAQ,GAAG,OAAO,CAAC;IAChD,KAAY,WAAW,GAAG,MAAM,GAAG,QAAQ,CAAC;CAC7C"}
+{"version":3,"file":"interfaces.d.ts","sourceRoot":"","sources":["../../../src/popover/interfaces.ts"],"names":[],"mappings":";AAEA,OAAO,EAAE,kBAAkB,EAAE,MAAM,4BAA4B,CAAC;AAEhE,MAAM,WAAW,YAAa,SAAQ,kBAAkB;IACtD;;;;OAIG;IACH,QAAQ,CAAC,EAAE,YAAY,CAAC,QAAQ,CAAC;IAEjC;;OAEG;IACH,IAAI,CAAC,EAAE,YAAY,CAAC,IAAI,CAAC;IAEzB;;;OAGG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IAErB;;;;OAIG;IACH,WAAW,CAAC,EAAE,YAAY,CAAC,WAAW,CAAC;IAEvC;;;OAGG;IACH,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAE1B;;;OAGG;IACH,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAE3B;;OAEG;IACH,MAAM,CAAC,EAAE,MAAM,CAAC;IAEhB;;OAEG;IACH,OAAO,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAE1B;;OAEG;IACH,aAAa,CAAC,EAAE,OAAO,CAAC;IAExB;;;OAGG;IACH,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAE1B;;;;;;;;OAQG;IACH,gBAAgB,CAAC,EAAE,OAAO,CAAC;CAC5B;AAED;;GAEG;AACH,MAAM,MAAM,gBAAgB,GACxB,WAAW,GACX,cAAc,GACd,UAAU,GACV,aAAa,GACb,YAAY,GACZ,WAAW,GACX,UAAU,GACV,eAAe,GACf,cAAc,GACd,aAAa,CAAC;AAElB,MAAM,WAAW,MAAM;IACrB,gBAAgB,EAAE,MAAM,CAAC;IACzB,eAAe,EAAE,MAAM,CAAC;CACzB;AAED,MAAM,WAAW,UAAU;IACzB,UAAU,EAAE,MAAM,CAAC;IACnB,SAAS,EAAE,MAAM,CAAC;CACnB;AAED,MAAM,MAAM,WAAW,GAAG,UAAU,GAAG,MAAM,CAAC;AAE9C,yBAAiB,YAAY,CAAC;IAC5B,KAAY,QAAQ,GAAG,KAAK,GAAG,OAAO,GAAG,QAAQ,GAAG,MAAM,CAAC;IAC3D,KAAY,IAAI,GAAG,OAAO,GAAG,QAAQ,GAAG,OAAO,CAAC;IAChD,KAAY,WAAW,GAAG,MAAM,GAAG,QAAQ,CAAC;CAC7C"}

package/popover/interfaces.js.map

@@ -1 +1 @@
-{"version":3,"file":"interfaces.js","sourceRoot":"","sources":["../../../src/popover/interfaces.ts"],"names":[],"mappings":"","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport { BaseComponentProps } from '../internal/base-component';\n\nexport interface PopoverProps extends BaseComponentProps {\n  /**\n   * Determines where the popover is displayed when opened, relative to the trigger.\n   * If the popover doesn't have enough space to open in this direction, it\n   * automatically chooses a better direction based on available space.\n   */\n  position?: PopoverProps.Position;\n\n  /**\n   * Determines the maximum width for the popover.\n   */\n  size?: PopoverProps.Size;\n\n  /**\n   * Expands the popover body to its maximum width regardless of content.\n   * For example, use it when you need to place a column layout in the popover content.\n   */\n  fixedWidth?: boolean;\n\n  /**\n   * Specifies the type of content inside the trigger region. The following types are available:\n   * - `text` - Use for inline text triggers.\n   * - `custom` - Use for the [button](/components/button/) component.\n   */\n  triggerType?: PopoverProps.TriggerType;\n\n  /**\n   * Adds `aria-label` to the text trigger button. Use this to provide an accessible name for triggers\n   * that don't have visible text, and to distinguish between multiple triggers with identical visible text.\n   */\n  triggerAriaLabel?: string;\n\n  /**\n   * Element that triggers the popover when selected by the user.\n   * @displayname trigger\n   */\n  children?: React.ReactNode;\n\n  /**\n   * Specifies optional header text for the popover.\n   */\n  header?: string;\n\n  /**\n   * Content of the popover.\n   */\n  content?: React.ReactNode;\n\n  /**\n   * Determines whether the dismiss button is shown in the popover body.\n   */\n  dismissButton?: boolean;\n\n  /**\n   * Adds an `aria-label` to the dismiss button for accessibility.\n   * @i18n\n   */\n  dismissAriaLabel?: string;\n\n  /**\n   * By default, the popover is constrained to fit inside its parent\n   * [stacking context](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Positioning/Understanding_z_index/The_stacking_context).\n   * Enabling this property will allow the popover to be rendered in the root stack context using\n   * [React Portals](https://reactjs.org/docs/portals.html).\n   * Enable this setting if you need the popover to ignore its parent stacking context, such as in side navigation.\n   *\n   * Note: Using popover rendered with portal within a Modal is not supported.\n   */\n  renderWithPortal?: boolean;\n}\n\n/**\n * The position the popover is actually in, given space constraints.\n */\nexport type InternalPosition =\n  | 'right-top'\n  | 'right-bottom'\n  | 'left-top'\n  | 'left-bottom'\n  | 'top-center'\n  | 'top-right'\n  | 'top-left'\n  | 'bottom-center'\n  | 'bottom-right'\n  | 'bottom-left';\n\nexport interface Offset {\n  left: number;\n  top: number;\n}\n\nexport interface Dimensions {\n  width: number;\n  height: number;\n}\n\nexport type BoundingBox = Dimensions & Offset;\n\nexport namespace PopoverProps {\n  export type Position = 'top' | 'right' | 'bottom' | 'left';\n  export type Size = 'small' | 'medium' | 'large';\n  export type TriggerType = 'text' | 'custom';\n}\n"]}
+{"version":3,"file":"interfaces.js","sourceRoot":"","sources":["../../../src/popover/interfaces.ts"],"names":[],"mappings":"","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport { BaseComponentProps } from '../internal/base-component';\n\nexport interface PopoverProps extends BaseComponentProps {\n  /**\n   * Determines where the popover is displayed when opened, relative to the trigger.\n   * If the popover doesn't have enough space to open in this direction, it\n   * automatically chooses a better direction based on available space.\n   */\n  position?: PopoverProps.Position;\n\n  /**\n   * Determines the maximum width for the popover.\n   */\n  size?: PopoverProps.Size;\n\n  /**\n   * Expands the popover body to its maximum width regardless of content.\n   * For example, use it when you need to place a column layout in the popover content.\n   */\n  fixedWidth?: boolean;\n\n  /**\n   * Specifies the type of content inside the trigger region. The following types are available:\n   * - `text` - Use for inline text triggers.\n   * - `custom` - Use for the [button](/components/button/) component.\n   */\n  triggerType?: PopoverProps.TriggerType;\n\n  /**\n   * Adds `aria-label` to the text trigger button. Use this to provide an accessible name for triggers\n   * that don't have visible text, and to distinguish between multiple triggers with identical visible text.\n   */\n  triggerAriaLabel?: string;\n\n  /**\n   * Element that triggers the popover when selected by the user.\n   * @displayname trigger\n   */\n  children?: React.ReactNode;\n\n  /**\n   * Specifies optional header text for the popover.\n   */\n  header?: string;\n\n  /**\n   * Content of the popover.\n   */\n  content?: React.ReactNode;\n\n  /**\n   * Determines whether the dismiss button is shown in the popover body.\n   */\n  dismissButton?: boolean;\n\n  /**\n   * Adds an `aria-label` to the dismiss button for accessibility.\n   * @i18n\n   */\n  dismissAriaLabel?: string;\n\n  /**\n   * By default, the popover is constrained to fit inside its parent\n   * [stacking context](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Positioning/Understanding_z_index/The_stacking_context).\n   * Enabling this property will allow the popover to be rendered in the root stack context using\n   * [React Portals](https://reactjs.org/docs/portals.html).\n   * Enable this setting if you need the popover to ignore its parent stacking context, such as in side navigation.\n   *\n   * Note: Using popover rendered with portal within a Modal is not supported.\n   */\n  renderWithPortal?: boolean;\n}\n\n/**\n * The position the popover is actually in, given space constraints.\n */\nexport type InternalPosition =\n  | 'right-top'\n  | 'right-bottom'\n  | 'left-top'\n  | 'left-bottom'\n  | 'top-center'\n  | 'top-right'\n  | 'top-left'\n  | 'bottom-center'\n  | 'bottom-right'\n  | 'bottom-left';\n\nexport interface Offset {\n  insetInlineStart: number;\n  insetBlockStart: number;\n}\n\nexport interface Dimensions {\n  inlineSize: number;\n  blockSize: number;\n}\n\nexport type BoundingBox = Dimensions & Offset;\n\nexport namespace PopoverProps {\n  export type Position = 'top' | 'right' | 'bottom' | 'left';\n  export type Size = 'small' | 'medium' | 'large';\n  export type TriggerType = 'text' | 'custom';\n}\n"]}

package/popover/styles.css.js

@@ -1,55 +1,55 @@
 
     import './styles.scoped.css';
     export default {
-  "arrow": "awsui_arrow_xjuzf_1xq78_197",
-  "arrow-outer": "awsui_arrow-outer_xjuzf_1xq78_201",
-  "arrow-inner": "awsui_arrow-inner_xjuzf_1xq78_201",
-  "refresh": "awsui_refresh_xjuzf_1xq78_231",
-  "arrow-position-right-top": "awsui_arrow-position-right-top_xjuzf_1xq78_241",
-  "arrow-position-right-bottom": "awsui_arrow-position-right-bottom_xjuzf_1xq78_241",
-  "arrow-position-left-top": "awsui_arrow-position-left-top_xjuzf_1xq78_244",
-  "arrow-position-left-bottom": "awsui_arrow-position-left-bottom_xjuzf_1xq78_244",
-  "arrow-position-top-center": "awsui_arrow-position-top-center_xjuzf_1xq78_247",
-  "arrow-position-top-right": "awsui_arrow-position-top-right_xjuzf_1xq78_247",
-  "arrow-position-top-left": "awsui_arrow-position-top-left_xjuzf_1xq78_247",
-  "arrow-position-top-responsive": "awsui_arrow-position-top-responsive_xjuzf_1xq78_247",
-  "arrow-position-bottom-center": "awsui_arrow-position-bottom-center_xjuzf_1xq78_250",
-  "arrow-position-bottom-right": "awsui_arrow-position-bottom-right_xjuzf_1xq78_250",
-  "arrow-position-bottom-left": "awsui_arrow-position-bottom-left_xjuzf_1xq78_250",
-  "arrow-position-bottom-responsive": "awsui_arrow-position-bottom-responsive_xjuzf_1xq78_250",
-  "body": "awsui_body_xjuzf_1xq78_352",
-  "body-overflow-visible": "awsui_body-overflow-visible_xjuzf_1xq78_391",
-  "has-dismiss": "awsui_has-dismiss_xjuzf_1xq78_395",
-  "dismiss": "awsui_dismiss_xjuzf_1xq78_400",
-  "dismiss-control": "awsui_dismiss-control_xjuzf_1xq78_408",
-  "header-row": "awsui_header-row_xjuzf_1xq78_412",
-  "header": "awsui_header_xjuzf_1xq78_412",
-  "content": "awsui_content_xjuzf_1xq78_438",
-  "content-overflow-visible": "awsui_content-overflow-visible_xjuzf_1xq78_446",
-  "container": "awsui_container_xjuzf_1xq78_548",
-  "container-body": "awsui_container-body_xjuzf_1xq78_556",
-  "container-body-variant-annotation": "awsui_container-body-variant-annotation_xjuzf_1xq78_599",
-  "container-body-size-small": "awsui_container-body-size-small_xjuzf_1xq78_604",
-  "fixed-width": "awsui_fixed-width_xjuzf_1xq78_607",
-  "container-body-size-medium": "awsui_container-body-size-medium_xjuzf_1xq78_611",
-  "container-body-size-large": "awsui_container-body-size-large_xjuzf_1xq78_618",
-  "container-arrow": "awsui_container-arrow_xjuzf_1xq78_630",
-  "container-arrow-position-right-top": "awsui_container-arrow-position-right-top_xjuzf_1xq78_634",
-  "container-arrow-position-right-bottom": "awsui_container-arrow-position-right-bottom_xjuzf_1xq78_634",
-  "container-arrow-position-left-top": "awsui_container-arrow-position-left-top_xjuzf_1xq78_646",
-  "container-arrow-position-left-bottom": "awsui_container-arrow-position-left-bottom_xjuzf_1xq78_646",
-  "container-arrow-position-top-center": "awsui_container-arrow-position-top-center_xjuzf_1xq78_658",
-  "container-arrow-position-top-right": "awsui_container-arrow-position-top-right_xjuzf_1xq78_658",
-  "container-arrow-position-top-left": "awsui_container-arrow-position-top-left_xjuzf_1xq78_658",
-  "container-arrow-position-top-responsive": "awsui_container-arrow-position-top-responsive_xjuzf_1xq78_658",
-  "container-arrow-position-bottom-center": "awsui_container-arrow-position-bottom-center_xjuzf_1xq78_674",
-  "container-arrow-position-bottom-right": "awsui_container-arrow-position-bottom-right_xjuzf_1xq78_678",
-  "container-arrow-position-bottom-left": "awsui_container-arrow-position-bottom-left_xjuzf_1xq78_682",
-  "awsui-motion-fade-in": "awsui_awsui-motion-fade-in_xjuzf_1xq78_1",
-  "root": "awsui_root_xjuzf_1xq78_828",
-  "trigger": "awsui_trigger_xjuzf_1xq78_864",
-  "trigger-type-text": "awsui_trigger-type-text_xjuzf_1xq78_871",
-  "trigger-inner-text": "awsui_trigger-inner-text_xjuzf_1xq78_906",
-  "popover-inline-content": "awsui_popover-inline-content_xjuzf_1xq78_910"
+  "arrow": "awsui_arrow_xjuzf_ov8et_197",
+  "arrow-outer": "awsui_arrow-outer_xjuzf_ov8et_201",
+  "arrow-inner": "awsui_arrow-inner_xjuzf_ov8et_201",
+  "refresh": "awsui_refresh_xjuzf_ov8et_235",
+  "arrow-position-right-top": "awsui_arrow-position-right-top_xjuzf_ov8et_245",
+  "arrow-position-right-bottom": "awsui_arrow-position-right-bottom_xjuzf_ov8et_245",
+  "arrow-position-left-top": "awsui_arrow-position-left-top_xjuzf_ov8et_248",
+  "arrow-position-left-bottom": "awsui_arrow-position-left-bottom_xjuzf_ov8et_248",
+  "arrow-position-top-center": "awsui_arrow-position-top-center_xjuzf_ov8et_251",
+  "arrow-position-top-right": "awsui_arrow-position-top-right_xjuzf_ov8et_251",
+  "arrow-position-top-left": "awsui_arrow-position-top-left_xjuzf_ov8et_251",
+  "arrow-position-top-responsive": "awsui_arrow-position-top-responsive_xjuzf_ov8et_251",
+  "arrow-position-bottom-center": "awsui_arrow-position-bottom-center_xjuzf_ov8et_254",
+  "arrow-position-bottom-right": "awsui_arrow-position-bottom-right_xjuzf_ov8et_254",
+  "arrow-position-bottom-left": "awsui_arrow-position-bottom-left_xjuzf_ov8et_254",
+  "arrow-position-bottom-responsive": "awsui_arrow-position-bottom-responsive_xjuzf_ov8et_254",
+  "body": "awsui_body_xjuzf_ov8et_356",
+  "body-overflow-visible": "awsui_body-overflow-visible_xjuzf_ov8et_395",
+  "has-dismiss": "awsui_has-dismiss_xjuzf_ov8et_399",
+  "dismiss": "awsui_dismiss_xjuzf_ov8et_404",
+  "dismiss-control": "awsui_dismiss-control_xjuzf_ov8et_412",
+  "header-row": "awsui_header-row_xjuzf_ov8et_416",
+  "header": "awsui_header_xjuzf_ov8et_416",
+  "content": "awsui_content_xjuzf_ov8et_442",
+  "content-overflow-visible": "awsui_content-overflow-visible_xjuzf_ov8et_450",
+  "container": "awsui_container_xjuzf_ov8et_552",
+  "container-body": "awsui_container-body_xjuzf_ov8et_560",
+  "container-body-variant-annotation": "awsui_container-body-variant-annotation_xjuzf_ov8et_603",
+  "container-body-size-small": "awsui_container-body-size-small_xjuzf_ov8et_608",
+  "fixed-width": "awsui_fixed-width_xjuzf_ov8et_611",
+  "container-body-size-medium": "awsui_container-body-size-medium_xjuzf_ov8et_615",
+  "container-body-size-large": "awsui_container-body-size-large_xjuzf_ov8et_622",
+  "container-arrow": "awsui_container-arrow_xjuzf_ov8et_634",
+  "container-arrow-position-right-top": "awsui_container-arrow-position-right-top_xjuzf_ov8et_638",
+  "container-arrow-position-right-bottom": "awsui_container-arrow-position-right-bottom_xjuzf_ov8et_638",
+  "container-arrow-position-left-top": "awsui_container-arrow-position-left-top_xjuzf_ov8et_654",
+  "container-arrow-position-left-bottom": "awsui_container-arrow-position-left-bottom_xjuzf_ov8et_654",
+  "container-arrow-position-top-center": "awsui_container-arrow-position-top-center_xjuzf_ov8et_670",
+  "container-arrow-position-top-right": "awsui_container-arrow-position-top-right_xjuzf_ov8et_670",
+  "container-arrow-position-top-left": "awsui_container-arrow-position-top-left_xjuzf_ov8et_670",
+  "container-arrow-position-top-responsive": "awsui_container-arrow-position-top-responsive_xjuzf_ov8et_670",
+  "container-arrow-position-bottom-center": "awsui_container-arrow-position-bottom-center_xjuzf_ov8et_686",
+  "container-arrow-position-bottom-right": "awsui_container-arrow-position-bottom-right_xjuzf_ov8et_690",
+  "container-arrow-position-bottom-left": "awsui_container-arrow-position-bottom-left_xjuzf_ov8et_694",
+  "awsui-motion-fade-in": "awsui_awsui-motion-fade-in_xjuzf_ov8et_1",
+  "root": "awsui_root_xjuzf_ov8et_840",
+  "trigger": "awsui_trigger_xjuzf_ov8et_876",
+  "trigger-type-text": "awsui_trigger-type-text_xjuzf_ov8et_883",
+  "trigger-inner-text": "awsui_trigger-inner-text_xjuzf_ov8et_918",
+  "popover-inline-content": "awsui_popover-inline-content_xjuzf_ov8et_922"
 };