@cloudscape-design/components 3.0.221 → 3.0.223

package/internal/components/checkbox-icon/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../src/internal/components/checkbox-icon/index.tsx"],"names":[],"mappings":";AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,IAAI,MAAM,MAAM,CAAC;AACxB,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAsB,YAAY,EAAE,MAAM,sBAAsB,CAAC;AACxE,OAAO,EAAE,gBAAgB,EAAE,MAAM,6BAA6B,CAAC;AAC/D,OAAO,MAAM,MAAM,iBAAiB,CAAC;AAgBrC,6CAA6C;AAC7C,MAAM,CAAC,IAAM,iBAAiB,GAA0D;IACtF,SAAO,EAAE;QACP,OAAO,EAAE,WAAW;QACpB,aAAa,EAAE,cAAc;QAC7B,OAAO,EAAE,iBAAiB;QAC1B,EAAE,EAAE,GAAG;QACP,CAAC,EAAE,GAAG;QACN,IAAI,EAAE,EAAE;KACT;IACD,OAAO,EAAE;QACP,OAAO,EAAE,WAAW;QACpB,aAAa,EAAE,cAAc;QAC7B,OAAO,EAAE,iBAAiB;QAC1B,EAAE,EAAE,CAAC;QACL,CAAC,EAAE,CAAC;QACJ,IAAI,EAAE,EAAE;KACT;CACF,CAAC;AAEF,IAAM,YAAY,GAAG,UAAC,EAA6E;;IAA3E,IAAA,OAAO,aAAA,EAAE,aAAa,mBAAA,EAAE,gBAAgB,EAAhB,QAAQ,mBAAG,KAAK,KAAA,EAAK,SAAS,cAAxD,wCAA0D,CAAF;IAC5E,IAAM,SAAS,GAAG,YAAY,CAAC,SAAS,CAAC,CAAC;IAC1C,IAAM,KAAK,GAAG,gBAAgB,EAAE,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,SAAS,CAAC;IACzD,IAAM,UAAU,GAAG,iBAAiB,CAAC,KAAK,CAAC,CAAC;IAC5C,OAAO,CACL,sCAAK,SAAS,EAAE,MAAM,CAAC,IAAI,EAAE,OAAO,EAAE,UAAU,CAAC,OAAO,iBAAc,MAAM,EAAC,SAAS,EAAC,OAAO,IAAK,SAAS;QAC1G,8BACE,SAAS,EAAE,IAAI,CAAC,MAAM,CAAC,YAAY,CAAC;gBAClC,GAAC,MAAM,CAAC,oBAAoB,CAAC,IAAG,OAAO;gBACvC,GAAC,MAAM,CAAC,0BAA0B,CAAC,IAAG,aAAa;gBACnD,GAAC,MAAM,CAAC,qBAAqB,CAAC,IAAG,QAAQ;oBACzC,EACF,CAAC,EAAE,UAAU,CAAC,EAAE,EAChB,CAAC,EAAE,UAAU,CAAC,EAAE,EAChB,EAAE,EAAE,UAAU,CAAC,CAAC,EAChB,EAAE,EAAE,UAAU,CAAC,CAAC,EAChB,KAAK,EAAE,UAAU,CAAC,IAAI,EACtB,MAAM,EAAE,UAAU,CAAC,IAAI,GACvB;QACD,OAAO,IAAI,aAAa,CAAC,CAAC,CAAC,CAC1B,kCACE,SAAS,EAAE,IAAI,CAAC,MAAM,CAAC,aAAa,CAAC,YAAI,GAAC,MAAM,CAAC,sBAAsB,CAAC,IAAG,QAAQ,MAAG,EACtF,MAAM,EAAE,aAAa,CAAC,CAAC,CAAC,UAAU,CAAC,aAAa,CAAC,CAAC,CAAC,UAAU,CAAC,OAAO,GACrE,CACH,CAAC,CAAC,CAAC,IAAI,CACJ,CACP,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,YAAY,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport clsx from 'clsx';\nimport React from 'react';\nimport { BaseComponentProps, getBaseProps } from '../../base-component';\nimport { useVisualRefresh } from '../../hooks/use-visual-mode';\nimport styles from './styles.css.js';\n\nexport interface CheckboxIconProps extends BaseComponentProps {\n  checked?: boolean;\n  indeterminate?: boolean;\n  disabled?: boolean;\n}\nexport interface Dimension {\n  viewBox: string;\n  indeterminate: string;\n  checked: string;\n  xy: number;\n  r: number;\n  size: number;\n}\n\n// Can't use css variables for svg attributes\nexport const dimensionsByTheme: Record<NonNullable<'default' | 'refresh'>, Dimension> = {\n  default: {\n    viewBox: '0 0 14 14',\n    indeterminate: '2.5,7 11.5,7',\n    checked: '2.5,7 6,10 11,3',\n    xy: 0.5,\n    r: 1.5,\n    size: 13,\n  },\n  refresh: {\n    viewBox: '0 0 16 16',\n    indeterminate: '3.5,8 12.5,8',\n    checked: '3.5,8 7,11 12,4',\n    xy: 1,\n    r: 2,\n    size: 14,\n  },\n};\n\nconst CheckboxIcon = ({ checked, indeterminate, disabled = false, ...restProps }: CheckboxIconProps) => {\n  const baseProps = getBaseProps(restProps);\n  const theme = useVisualRefresh() ? 'refresh' : 'default';\n  const dimensions = dimensionsByTheme[theme];\n  return (\n    <svg className={styles.root} viewBox={dimensions.viewBox} aria-hidden=\"true\" focusable=\"false\" {...baseProps}>\n      <rect\n        className={clsx(styles['styled-box'], {\n          [styles['styled-box-checked']]: checked,\n          [styles['styled-box-indeterminate']]: indeterminate,\n          [styles['styled-box-disabled']]: disabled,\n        })}\n        x={dimensions.xy}\n        y={dimensions.xy}\n        rx={dimensions.r}\n        ry={dimensions.r}\n        width={dimensions.size}\n        height={dimensions.size}\n      />\n      {checked || indeterminate ? (\n        <polyline\n          className={clsx(styles['styled-line'], { [styles['styled-line-disabled']]: disabled })}\n          points={indeterminate ? dimensions.indeterminate : dimensions.checked}\n        />\n      ) : null}\n    </svg>\n  );\n};\n\nexport default CheckboxIcon;\n"]}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../src/internal/components/checkbox-icon/index.tsx"],"names":[],"mappings":";AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,IAAI,MAAM,MAAM,CAAC;AACxB,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAsB,YAAY,EAAE,MAAM,sBAAsB,CAAC;AACxE,OAAO,EAAE,gBAAgB,EAAE,MAAM,6BAA6B,CAAC;AAC/D,OAAO,MAAM,MAAM,iBAAiB,CAAC;AAgBrC,6CAA6C;AAC7C,MAAM,CAAC,MAAM,iBAAiB,GAA0D;IACtF,OAAO,EAAE;QACP,OAAO,EAAE,WAAW;QACpB,aAAa,EAAE,cAAc;QAC7B,OAAO,EAAE,iBAAiB;QAC1B,EAAE,EAAE,GAAG;QACP,CAAC,EAAE,GAAG;QACN,IAAI,EAAE,EAAE;KACT;IACD,OAAO,EAAE;QACP,OAAO,EAAE,WAAW;QACpB,aAAa,EAAE,cAAc;QAC7B,OAAO,EAAE,iBAAiB;QAC1B,EAAE,EAAE,CAAC;QACL,CAAC,EAAE,CAAC;QACJ,IAAI,EAAE,EAAE;KACT;CACF,CAAC;AAEF,MAAM,YAAY,GAAG,CAAC,EAA6E,EAAE,EAAE;QAAjF,EAAE,OAAO,EAAE,aAAa,EAAE,QAAQ,GAAG,KAAK,OAAmC,EAA9B,SAAS,cAAxD,wCAA0D,CAAF;IAC5E,MAAM,SAAS,GAAG,YAAY,CAAC,SAAS,CAAC,CAAC;IAC1C,MAAM,KAAK,GAAG,gBAAgB,EAAE,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,SAAS,CAAC;IACzD,MAAM,UAAU,GAAG,iBAAiB,CAAC,KAAK,CAAC,CAAC;IAC5C,OAAO,CACL,2CAAK,SAAS,EAAE,MAAM,CAAC,IAAI,EAAE,OAAO,EAAE,UAAU,CAAC,OAAO,iBAAc,MAAM,EAAC,SAAS,EAAC,OAAO,IAAK,SAAS;QAC1G,8BACE,SAAS,EAAE,IAAI,CAAC,MAAM,CAAC,YAAY,CAAC,EAAE;gBACpC,CAAC,MAAM,CAAC,oBAAoB,CAAC,CAAC,EAAE,OAAO;gBACvC,CAAC,MAAM,CAAC,0BAA0B,CAAC,CAAC,EAAE,aAAa;gBACnD,CAAC,MAAM,CAAC,qBAAqB,CAAC,CAAC,EAAE,QAAQ;aAC1C,CAAC,EACF,CAAC,EAAE,UAAU,CAAC,EAAE,EAChB,CAAC,EAAE,UAAU,CAAC,EAAE,EAChB,EAAE,EAAE,UAAU,CAAC,CAAC,EAChB,EAAE,EAAE,UAAU,CAAC,CAAC,EAChB,KAAK,EAAE,UAAU,CAAC,IAAI,EACtB,MAAM,EAAE,UAAU,CAAC,IAAI,GACvB;QACD,OAAO,IAAI,aAAa,CAAC,CAAC,CAAC,CAC1B,kCACE,SAAS,EAAE,IAAI,CAAC,MAAM,CAAC,aAAa,CAAC,EAAE,EAAE,CAAC,MAAM,CAAC,sBAAsB,CAAC,CAAC,EAAE,QAAQ,EAAE,CAAC,EACtF,MAAM,EAAE,aAAa,CAAC,CAAC,CAAC,UAAU,CAAC,aAAa,CAAC,CAAC,CAAC,UAAU,CAAC,OAAO,GACrE,CACH,CAAC,CAAC,CAAC,IAAI,CACJ,CACP,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,YAAY,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport clsx from 'clsx';\nimport React from 'react';\nimport { BaseComponentProps, getBaseProps } from '../../base-component';\nimport { useVisualRefresh } from '../../hooks/use-visual-mode';\nimport styles from './styles.css.js';\n\nexport interface CheckboxIconProps extends BaseComponentProps {\n  checked?: boolean;\n  indeterminate?: boolean;\n  disabled?: boolean;\n}\nexport interface Dimension {\n  viewBox: string;\n  indeterminate: string;\n  checked: string;\n  xy: number;\n  r: number;\n  size: number;\n}\n\n// Can't use css variables for svg attributes\nexport const dimensionsByTheme: Record<NonNullable<'default' | 'refresh'>, Dimension> = {\n  default: {\n    viewBox: '0 0 14 14',\n    indeterminate: '2.5,7 11.5,7',\n    checked: '2.5,7 6,10 11,3',\n    xy: 0.5,\n    r: 1.5,\n    size: 13,\n  },\n  refresh: {\n    viewBox: '0 0 16 16',\n    indeterminate: '3.5,8 12.5,8',\n    checked: '3.5,8 7,11 12,4',\n    xy: 1,\n    r: 2,\n    size: 14,\n  },\n};\n\nconst CheckboxIcon = ({ checked, indeterminate, disabled = false, ...restProps }: CheckboxIconProps) => {\n  const baseProps = getBaseProps(restProps);\n  const theme = useVisualRefresh() ? 'refresh' : 'default';\n  const dimensions = dimensionsByTheme[theme];\n  return (\n    <svg className={styles.root} viewBox={dimensions.viewBox} aria-hidden=\"true\" focusable=\"false\" {...baseProps}>\n      <rect\n        className={clsx(styles['styled-box'], {\n          [styles['styled-box-checked']]: checked,\n          [styles['styled-box-indeterminate']]: indeterminate,\n          [styles['styled-box-disabled']]: disabled,\n        })}\n        x={dimensions.xy}\n        y={dimensions.xy}\n        rx={dimensions.r}\n        ry={dimensions.r}\n        width={dimensions.size}\n        height={dimensions.size}\n      />\n      {checked || indeterminate ? (\n        <polyline\n          className={clsx(styles['styled-line'], { [styles['styled-line-disabled']]: disabled })}\n          points={indeterminate ? dimensions.indeterminate : dimensions.checked}\n        />\n      ) : null}\n    </svg>\n  );\n};\n\nexport default CheckboxIcon;\n"]}

package/internal/components/dark-ribbon/index.js

@@ -9,33 +9,32 @@ function setIfChanged(oldValue, newValue, setter) {
         setter(newValue);
     }
 }
-export default function DarkRibbon(_a) {
-    var children = _a.children, isRefresh = _a.isRefresh, hasPlainStyling = _a.hasPlainStyling;
-    var containerRef = useRef(null);
-    var fillRef = useRef(null);
-    var syncSizes = useStableEventHandler(function (from, to) {
+export default function DarkRibbon({ children, isRefresh, hasPlainStyling }) {
+    const containerRef = useRef(null);
+    const fillRef = useRef(null);
+    const syncSizes = useStableEventHandler((from, to) => {
         // JSDOM calls mutation observer callback even if attribute did not change
         // https://github.com/jsdom/jsdom/issues/3305
         // To prevent infinite loops, we need to check the values before setting
-        var size = from.getBoundingClientRect();
-        var _a = to.style, oldHeight = _a.height, oldLeft = _a.left, oldRight = _a.right;
-        setIfChanged(oldHeight, "".concat(size.height, "px"), function (newHeight) { return (to.style.height = newHeight); });
-        setIfChanged(oldLeft, "".concat(-1 * size.left, "px"), function (newLeft) { return (to.style.left = newLeft); });
-        setIfChanged(oldRight, "".concat(-1 * (document.body.clientWidth - size.right), "px"), function (newRight) { return (to.style.right = newRight); });
+        const size = from.getBoundingClientRect();
+        const { height: oldHeight, left: oldLeft, right: oldRight } = to.style;
+        setIfChanged(oldHeight, `${size.height}px`, newHeight => (to.style.height = newHeight));
+        setIfChanged(oldLeft, `${-1 * size.left}px`, newLeft => (to.style.left = newLeft));
+        setIfChanged(oldRight, `${-1 * (document.body.clientWidth - size.right)}px`, newRight => (to.style.right = newRight));
     });
-    useMutationObserver(containerRef, function (node) {
+    useMutationObserver(containerRef, node => {
         if (fillRef.current) {
             syncSizes(node, fillRef.current);
         }
     });
-    useEffect(function () {
-        var handler = function () {
+    useEffect(() => {
+        const handler = () => {
             if (containerRef.current && fillRef.current) {
                 syncSizes(containerRef.current, fillRef.current);
             }
         };
         window.addEventListener('resize', handler);
-        return function () { return window.removeEventListener('resize', handler); };
+        return () => window.removeEventListener('resize', handler);
     }, [syncSizes]);
     if (hasPlainStyling === true || !isRefresh) {
         return React.createElement(React.Fragment, null, children);

package/internal/components/dark-ribbon/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../src/internal/components/dark-ribbon/index.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, { useEffect, useRef } from 'react';\nimport { useMutationObserver } from '../../hooks/use-mutation-observer';\nimport { useStableEventHandler } from '../../hooks/use-stable-event-handler';\nimport styles from './styles.css.js';\n\ninterface DarkRibbonProps {\n  children: React.ReactNode;\n  isRefresh: boolean;\n  hasPlainStyling?: boolean;\n}\n\nfunction setIfChanged(oldValue: string, newValue: string, setter: (newValue: string) => void) {\n  if (oldValue !== newValue) {\n    setter(newValue);\n  }\n}\n\nexport default function DarkRibbon({ children, isRefresh, hasPlainStyling }: DarkRibbonProps) {\n  const containerRef = useRef<HTMLDivElement>(null);\n  const fillRef = useRef<HTMLDivElement>(null);\n  const syncSizes = useStableEventHandler((from: HTMLElement, to: HTMLElement) => {\n    // JSDOM calls mutation observer callback even if attribute did not change\n    // https://github.com/jsdom/jsdom/issues/3305\n    // To prevent infinite loops, we need to check the values before setting\n    const size = from.getBoundingClientRect();\n    const { height: oldHeight, left: oldLeft, right: oldRight } = to.style;\n    setIfChanged(oldHeight, `${size.height}px`, newHeight => (to.style.height = newHeight));\n    setIfChanged(oldLeft, `${-1 * size.left}px`, newLeft => (to.style.left = newLeft));\n    setIfChanged(\n      oldRight,\n      `${-1 * (document.body.clientWidth - size.right)}px`,\n      newRight => (to.style.right = newRight)\n    );\n  });\n  useMutationObserver(containerRef, node => {\n    if (fillRef.current) {\n      syncSizes(node, fillRef.current);\n    }\n  });\n  useEffect(() => {\n    const handler = () => {\n      if (containerRef.current && fillRef.current) {\n        syncSizes(containerRef.current, fillRef.current);\n      }\n    };\n    window.addEventListener('resize', handler);\n    return () => window.removeEventListener('resize', handler);\n  }, [syncSizes]);\n\n  if (hasPlainStyling === true || !isRefresh) {\n    return <>{children}</>;\n  }\n\n  return (\n    <div ref={containerRef} className=\"awsui-context-content-header\">\n      <div ref={fillRef} className={styles['background-fill']} />\n      <div className={styles.content}>{children}</div>\n    </div>\n  );\n}\n"]}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../src/internal/components/dark-ribbon/index.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, { useEffect, useRef } from 'react';\nimport { useMutationObserver } from '../../hooks/use-mutation-observer';\nimport { useStableEventHandler } from '../../hooks/use-stable-event-handler';\nimport styles from './styles.css.js';\n\ninterface DarkRibbonProps {\n  children: React.ReactNode;\n  isRefresh: boolean;\n  hasPlainStyling?: boolean;\n}\n\nfunction setIfChanged(oldValue: string, newValue: string, setter: (newValue: string) => void) {\n  if (oldValue !== newValue) {\n    setter(newValue);\n  }\n}\n\nexport default function DarkRibbon({ children, isRefresh, hasPlainStyling }: DarkRibbonProps) {\n  const containerRef = useRef<HTMLDivElement>(null);\n  const fillRef = useRef<HTMLDivElement>(null);\n  const syncSizes = useStableEventHandler((from: HTMLElement, to: HTMLElement) => {\n    // JSDOM calls mutation observer callback even if attribute did not change\n    // https://github.com/jsdom/jsdom/issues/3305\n    // To prevent infinite loops, we need to check the values before setting\n    const size = from.getBoundingClientRect();\n    const { height: oldHeight, left: oldLeft, right: oldRight } = to.style;\n    setIfChanged(oldHeight, `${size.height}px`, newHeight => (to.style.height = newHeight));\n    setIfChanged(oldLeft, `${-1 * size.left}px`, newLeft => (to.style.left = newLeft));\n    setIfChanged(\n      oldRight,\n      `${-1 * (document.body.clientWidth - size.right)}px`,\n      newRight => (to.style.right = newRight)\n    );\n  });\n  useMutationObserver(containerRef, node => {\n    if (fillRef.current) {\n      syncSizes(node, fillRef.current);\n    }\n  });\n  useEffect(() => {\n    const handler = () => {\n      if (containerRef.current && fillRef.current) {\n        syncSizes(containerRef.current, fillRef.current);\n      }\n    };\n    window.addEventListener('resize', handler);\n    return () => window.removeEventListener('resize', handler);\n  }, [syncSizes]);\n\n  if (hasPlainStyling === true || !isRefresh) {\n    return <>{children}</>;\n  }\n\n  return (\n    <div ref={containerRef} className=\"awsui-context-content-header\">\n      <div ref={fillRef} className={styles['background-fill']} />\n      <div className={styles.content}>{children}</div>\n    </div>\n  );\n}\n"]}

package/internal/components/dropdown/context.js

@@ -1,12 +1,11 @@
 // Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
 // SPDX-License-Identifier: Apache-2.0
 import React, { useContext } from 'react';
-var DropdownContext = React.createContext({
-    position: 'bottom-right'
+const DropdownContext = React.createContext({
+    position: 'bottom-right',
 });
-export function DropdownContextProvider(_a) {
-    var children = _a.children, _b = _a.position, position = _b === void 0 ? 'bottom-right' : _b;
-    return React.createElement(DropdownContext.Provider, { value: { position: position } }, children);
+export function DropdownContextProvider({ children, position = 'bottom-right' }) {
+    return React.createElement(DropdownContext.Provider, { value: { position } }, children);
 }
 export function useDropdownContext() {
     return useContext(DropdownContext);

package/internal/components/dropdown/context.js.map

@@ -1 +1 @@
-{"version":3,"file":"context.js","sourceRoot":"","sources":["../../../../../src/internal/components/dropdown/context.tsx"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,KAAK,EAAE,EAAE,UAAU,EAAE,MAAM,OAAO,CAAC;AAI1C,IAAM,eAAe,GAAG,KAAK,CAAC,aAAa,CAAyB;IAClE,QAAQ,EAAE,cAAc;CACzB,CAAC,CAAC;AAOH,MAAM,UAAU,uBAAuB,CAAC,EAAqE;QAAnE,QAAQ,cAAA,EAAE,gBAAyB,EAAzB,QAAQ,mBAAG,cAAc,KAAA;IAC3E,OAAO,oBAAC,eAAe,CAAC,QAAQ,IAAC,KAAK,EAAE,EAAE,QAAQ,UAAA,EAAE,IAAG,QAAQ,CAA4B,CAAC;AAC9F,CAAC;AAED,MAAM,UAAU,kBAAkB;IAChC,OAAO,UAAU,CAAC,eAAe,CAAC,CAAC;AACrC,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React, { useContext } from 'react';\n\ntype Position = 'top-left' | 'top-right' | 'bottom-left' | 'bottom-right';\n\nconst DropdownContext = React.createContext<{ position: Position }>({\n  position: 'bottom-right',\n});\n\nexport interface DropdownContextProviderProps {\n  position?: Position;\n  children?: React.ReactNode;\n}\n\nexport function DropdownContextProvider({ children, position = 'bottom-right' }: DropdownContextProviderProps) {\n  return <DropdownContext.Provider value={{ position }}>{children}</DropdownContext.Provider>;\n}\n\nexport function useDropdownContext() {\n  return useContext(DropdownContext);\n}\n"]}
+{"version":3,"file":"context.js","sourceRoot":"","sources":["../../../../../src/internal/components/dropdown/context.tsx"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,KAAK,EAAE,EAAE,UAAU,EAAE,MAAM,OAAO,CAAC;AAI1C,MAAM,eAAe,GAAG,KAAK,CAAC,aAAa,CAAyB;IAClE,QAAQ,EAAE,cAAc;CACzB,CAAC,CAAC;AAOH,MAAM,UAAU,uBAAuB,CAAC,EAAE,QAAQ,EAAE,QAAQ,GAAG,cAAc,EAAgC;IAC3G,OAAO,oBAAC,eAAe,CAAC,QAAQ,IAAC,KAAK,EAAE,EAAE,QAAQ,EAAE,IAAG,QAAQ,CAA4B,CAAC;AAC9F,CAAC;AAED,MAAM,UAAU,kBAAkB;IAChC,OAAO,UAAU,CAAC,eAAe,CAAC,CAAC;AACrC,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React, { useContext } from 'react';\n\ntype Position = 'top-left' | 'top-right' | 'bottom-left' | 'bottom-right';\n\nconst DropdownContext = React.createContext<{ position: Position }>({\n  position: 'bottom-right',\n});\n\nexport interface DropdownContextProviderProps {\n  position?: Position;\n  children?: React.ReactNode;\n}\n\nexport function DropdownContextProvider({ children, position = 'bottom-right' }: DropdownContextProviderProps) {\n  return <DropdownContext.Provider value={{ position }}>{children}</DropdownContext.Provider>;\n}\n\nexport function useDropdownContext() {\n  return useContext(DropdownContext);\n}\n"]}

package/internal/components/dropdown/dropdown-fit-handler.js

@@ -2,85 +2,78 @@
 // SPDX-License-Identifier: Apache-2.0
 import { getOverflowParents, getOverflowParentDimensions } from '../../utils/scrollable-containers';
 import styles from './styles.css.js';
-var AVAILABLE_SPACE_RESERVE_DEFAULT = 50;
-var AVAILABLE_SPACE_RESERVE_MOBILE_VERTICAL = 19; // 50 - 31
-var AVAILABLE_SPACE_RESERVE_MOBILE_HORIZONTAL = 20;
-var getClosestParentDimensions = function (element) {
-    var parents = getOverflowParents(element).map(function (el) {
-        var _a = el.getBoundingClientRect(), height = _a.height, width = _a.width, top = _a.top, left = _a.left;
+const AVAILABLE_SPACE_RESERVE_DEFAULT = 50;
+const AVAILABLE_SPACE_RESERVE_MOBILE_VERTICAL = 19; // 50 - 31
+const AVAILABLE_SPACE_RESERVE_MOBILE_HORIZONTAL = 20;
+const getClosestParentDimensions = (element) => {
+    const parents = getOverflowParents(element).map(el => {
+        const { height, width, top, left } = el.getBoundingClientRect();
         return {
-            height: height,
-            width: width,
-            top: top,
-            left: left
+            height,
+            width,
+            top,
+            left,
         };
     });
     return parents.shift();
 };
-export var getAvailableSpace = function (trigger, dropdown, overflowParents, stretchWidth, stretchHeight, isMobile) {
-    if (stretchWidth === void 0) { stretchWidth = false; }
-    if (stretchHeight === void 0) { stretchHeight = false; }
-    var availableSpaceReserveVertical = stretchHeight
+export const getAvailableSpace = (trigger, dropdown, overflowParents, stretchWidth = false, stretchHeight = false, isMobile) => {
+    const availableSpaceReserveVertical = stretchHeight
         ? 0
         : isMobile
             ? AVAILABLE_SPACE_RESERVE_MOBILE_VERTICAL
             : AVAILABLE_SPACE_RESERVE_DEFAULT;
-    var availableSpaceReserveHorizontal = stretchWidth
+    const availableSpaceReserveHorizontal = stretchWidth
         ? 0
         : isMobile
             ? AVAILABLE_SPACE_RESERVE_MOBILE_HORIZONTAL
             : AVAILABLE_SPACE_RESERVE_DEFAULT;
-    var _a = trigger.getBoundingClientRect(), triggerBottom = _a.bottom, triggerLeft = _a.left, triggerRight = _a.right;
-    return overflowParents.reduce(function (_a, overflowParent) {
-        var above = _a.above, below = _a.below, left = _a.left, right = _a.right;
-        var offsetTop = triggerBottom - overflowParent.top;
-        var currentAbove = offsetTop - trigger.offsetHeight - availableSpaceReserveVertical;
-        var currentBelow = overflowParent.height - offsetTop - availableSpaceReserveVertical;
-        var currentLeft = triggerRight - overflowParent.left - availableSpaceReserveHorizontal;
-        var currentRight = overflowParent.left + overflowParent.width - triggerLeft - availableSpaceReserveHorizontal;
+    const { bottom: triggerBottom, left: triggerLeft, right: triggerRight } = trigger.getBoundingClientRect();
+    return overflowParents.reduce(({ above, below, left, right }, overflowParent) => {
+        const offsetTop = triggerBottom - overflowParent.top;
+        const currentAbove = offsetTop - trigger.offsetHeight - availableSpaceReserveVertical;
+        const currentBelow = overflowParent.height - offsetTop - availableSpaceReserveVertical;
+        const currentLeft = triggerRight - overflowParent.left - availableSpaceReserveHorizontal;
+        const currentRight = overflowParent.left + overflowParent.width - triggerLeft - availableSpaceReserveHorizontal;
         return {
             above: Math.min(above, currentAbove),
             below: Math.min(below, currentBelow),
             left: Math.min(left, currentLeft),
-            right: Math.min(right, currentRight)
+            right: Math.min(right, currentRight),
         };
     }, { above: Number.MAX_VALUE, below: Number.MAX_VALUE, left: Number.MAX_VALUE, right: Number.MAX_VALUE });
 };
-export var getInteriorAvailableSpace = function (trigger, dropdown, overflowParents, isMobile) {
-    var AVAILABLE_SPACE_RESERVE_VERTICAL = isMobile
+export const getInteriorAvailableSpace = (trigger, dropdown, overflowParents, isMobile) => {
+    const AVAILABLE_SPACE_RESERVE_VERTICAL = isMobile
         ? AVAILABLE_SPACE_RESERVE_MOBILE_VERTICAL
         : AVAILABLE_SPACE_RESERVE_DEFAULT;
-    var AVAILABLE_SPACE_RESERVE_HORIZONTAL = isMobile
+    const AVAILABLE_SPACE_RESERVE_HORIZONTAL = isMobile
         ? AVAILABLE_SPACE_RESERVE_MOBILE_HORIZONTAL
         : AVAILABLE_SPACE_RESERVE_DEFAULT;
-    var _a = trigger.getBoundingClientRect(), triggerBottom = _a.bottom, triggerTop = _a.top, triggerLeft = _a.left, triggerRight = _a.right;
-    return overflowParents.reduce(function (_a, overflowParent) {
-        var above = _a.above, below = _a.below, left = _a.left, right = _a.right;
-        var currentAbove = triggerBottom - overflowParent.top - AVAILABLE_SPACE_RESERVE_VERTICAL;
-        var currentBelow = overflowParent.height - triggerTop + overflowParent.top - AVAILABLE_SPACE_RESERVE_VERTICAL;
-        var currentLeft = triggerLeft - overflowParent.left - AVAILABLE_SPACE_RESERVE_HORIZONTAL;
-        var currentRight = overflowParent.left + overflowParent.width - triggerRight - AVAILABLE_SPACE_RESERVE_HORIZONTAL;
+    const { bottom: triggerBottom, top: triggerTop, left: triggerLeft, right: triggerRight, } = trigger.getBoundingClientRect();
+    return overflowParents.reduce(({ above, below, left, right }, overflowParent) => {
+        const currentAbove = triggerBottom - overflowParent.top - AVAILABLE_SPACE_RESERVE_VERTICAL;
+        const currentBelow = overflowParent.height - triggerTop + overflowParent.top - AVAILABLE_SPACE_RESERVE_VERTICAL;
+        const currentLeft = triggerLeft - overflowParent.left - AVAILABLE_SPACE_RESERVE_HORIZONTAL;
+        const currentRight = overflowParent.left + overflowParent.width - triggerRight - AVAILABLE_SPACE_RESERVE_HORIZONTAL;
         return {
             above: Math.min(above, currentAbove),
             below: Math.min(below, currentBelow),
             left: Math.min(left, currentLeft),
-            right: Math.min(right, currentRight)
+            right: Math.min(right, currentRight),
         };
     }, { above: Number.MAX_VALUE, below: Number.MAX_VALUE, left: Number.MAX_VALUE, right: Number.MAX_VALUE });
 };
-export var getDropdownPosition = function (trigger, dropdown, overflowParents, minWidth, preferCenter, stretchWidth, stretchHeight, isMobile) {
-    if (preferCenter === void 0) { preferCenter = false; }
-    if (stretchWidth === void 0) { stretchWidth = false; }
-    if (stretchHeight === void 0) { stretchHeight = false; }
-    var availableSpace = getAvailableSpace(trigger, dropdown, overflowParents, stretchWidth, stretchHeight, isMobile);
-    var triggerWidth = trigger.getBoundingClientRect().width;
+export const getDropdownPosition = (trigger, dropdown, overflowParents, minWidth, preferCenter = false, stretchWidth = false, stretchHeight = false, isMobile) => {
+    const availableSpace = getAvailableSpace(trigger, dropdown, overflowParents, stretchWidth, stretchHeight, isMobile);
+    const triggerWidth = trigger.getBoundingClientRect().width;
     minWidth = minWidth ? Math.min(triggerWidth, minWidth) : triggerWidth;
-    var requiredWidth = dropdown.getBoundingClientRect().width;
+    const requiredWidth = dropdown.getBoundingClientRect().width;
     // dropdown should not be smaller than the trigger
-    var idealWidth = Math.max(requiredWidth, minWidth);
-    var dropLeft;
-    var left = null;
-    var width = idealWidth;
+    const idealWidth = Math.max(requiredWidth, minWidth);
+    let dropLeft;
+    let left = null;
+    let width = idealWidth;
     //1. Can it be positioned with ideal width to the right?
     if (idealWidth <= availableSpace.right) {
         dropLeft = false;
@@ -95,34 +88,34 @@ export var getDropdownPosition = function (trigger, dropdown, overflowParents, m
         width = Math.max(availableSpace.left, availableSpace.right, minWidth);
     }
     if (preferCenter) {
-        var spillOver = (idealWidth - triggerWidth) / 2;
+        const spillOver = (idealWidth - triggerWidth) / 2;
         // availableSpace always includes the trigger width, but we want to exclude that
-        var availableOutsideLeft = availableSpace.left - triggerWidth;
-        var availableOutsideRight = availableSpace.right - triggerWidth;
-        var fitsInCenter = availableOutsideLeft >= spillOver && availableOutsideRight >= spillOver;
+        const availableOutsideLeft = availableSpace.left - triggerWidth;
+        const availableOutsideRight = availableSpace.right - triggerWidth;
+        const fitsInCenter = availableOutsideLeft >= spillOver && availableOutsideRight >= spillOver;
         if (fitsInCenter) {
             left = -spillOver;
         }
     }
-    var dropUp = availableSpace.below < dropdown.offsetHeight && availableSpace.above > availableSpace.below;
-    var availableHeight = dropUp ? availableSpace.above : availableSpace.below;
+    const dropUp = availableSpace.below < dropdown.offsetHeight && availableSpace.above > availableSpace.below;
+    const availableHeight = dropUp ? availableSpace.above : availableSpace.below;
     // Try and crop the bottom item when all options can't be displayed, affordance for "there's more"
-    var croppedHeight = stretchHeight ? availableHeight : Math.floor(availableHeight / 31) * 31 + 16;
+    const croppedHeight = stretchHeight ? availableHeight : Math.floor(availableHeight / 31) * 31 + 16;
     return {
-        dropUp: dropUp,
-        dropLeft: dropLeft,
-        left: left === null ? 'auto' : "".concat(left, "px"),
-        height: "".concat(croppedHeight, "px"),
-        width: "".concat(width, "px")
+        dropUp,
+        dropLeft,
+        left: left === null ? 'auto' : `${left}px`,
+        height: `${croppedHeight}px`,
+        width: `${width}px`,
     };
 };
-export var getInteriorDropdownPosition = function (trigger, dropdown, overflowParents, isMobile) {
-    var availableSpace = getInteriorAvailableSpace(trigger, dropdown, overflowParents, isMobile);
-    var _a = trigger.getBoundingClientRect(), triggerBottom = _a.bottom, triggerTop = _a.top, triggerWidth = _a.width;
-    var _b = getClosestParentDimensions(trigger), parentDropdownTop = _b.top, parentDropdownHeight = _b.height;
-    var dropLeft;
-    var width = dropdown.getBoundingClientRect().width;
-    var top = triggerTop - parentDropdownTop;
+export const getInteriorDropdownPosition = (trigger, dropdown, overflowParents, isMobile) => {
+    const availableSpace = getInteriorAvailableSpace(trigger, dropdown, overflowParents, isMobile);
+    const { bottom: triggerBottom, top: triggerTop, width: triggerWidth } = trigger.getBoundingClientRect();
+    const { top: parentDropdownTop, height: parentDropdownHeight } = getClosestParentDimensions(trigger);
+    let dropLeft;
+    let width = dropdown.getBoundingClientRect().width;
+    const top = triggerTop - parentDropdownTop;
     if (width <= availableSpace.right) {
         dropLeft = false;
     }
@@ -133,23 +126,23 @@ export var getInteriorDropdownPosition = function (trigger, dropdown, overflowPa
         dropLeft = availableSpace.left > availableSpace.right;
         width = Math.max(availableSpace.left, availableSpace.right);
     }
-    var left = dropLeft ? 0 - width : triggerWidth;
-    var dropUp = availableSpace.below < dropdown.offsetHeight && availableSpace.above > availableSpace.below;
-    var bottom = dropUp ? parentDropdownTop + parentDropdownHeight - triggerBottom : 0;
-    var availableHeight = dropUp ? availableSpace.above : availableSpace.below;
+    const left = dropLeft ? 0 - width : triggerWidth;
+    const dropUp = availableSpace.below < dropdown.offsetHeight && availableSpace.above > availableSpace.below;
+    const bottom = dropUp ? parentDropdownTop + parentDropdownHeight - triggerBottom : 0;
+    const availableHeight = dropUp ? availableSpace.above : availableSpace.below;
     // Try and crop the bottom item when all options can't be displayed, affordance for "there's more"
-    var croppedHeight = Math.floor(availableHeight / 31) * 31 + 16;
+    const croppedHeight = Math.floor(availableHeight / 31) * 31 + 16;
     return {
-        dropUp: dropUp,
-        dropLeft: dropLeft,
-        height: "".concat(croppedHeight, "px"),
-        width: "".concat(width, "px"),
-        top: "".concat(top, "px"),
-        bottom: "".concat(bottom, "px"),
-        left: "".concat(left, "px")
+        dropUp,
+        dropLeft,
+        height: `${croppedHeight}px`,
+        width: `${width}px`,
+        top: `${top}px`,
+        bottom: `${bottom}px`,
+        left: `${left}px`,
     };
 };
-export var calculatePosition = function (dropdownElement, triggerElement, verticalContainerElement, interior, expandToViewport, preferCenter, stretchWidth, stretchHeight, isMobile, minWidth) {
+export const calculatePosition = (dropdownElement, triggerElement, verticalContainerElement, interior, expandToViewport, preferCenter, stretchWidth, stretchHeight, isMobile, minWidth) => {
     // cleaning previously assigned values,
     // so that they are not reused in case of screen resize and similar events
     verticalContainerElement.style.maxHeight = '';
@@ -160,11 +153,11 @@ export var calculatePosition = function (dropdownElement, triggerElement, vertic
     dropdownElement.classList.remove(styles['dropdown-drop-left']);
     dropdownElement.classList.remove(styles['dropdown-drop-right']);
     dropdownElement.classList.remove(styles['dropdown-drop-up']);
-    var overflowParents = getOverflowParentDimensions(dropdownElement, interior, expandToViewport, stretchHeight);
-    var position = interior
+    const overflowParents = getOverflowParentDimensions(dropdownElement, interior, expandToViewport, stretchHeight);
+    const position = interior
         ? getInteriorDropdownPosition(triggerElement, dropdownElement, overflowParents, isMobile)
         : getDropdownPosition(triggerElement, dropdownElement, overflowParents, minWidth, preferCenter, stretchWidth, stretchHeight, isMobile);
-    var triggerBox = triggerElement.getBoundingClientRect();
+    const triggerBox = triggerElement.getBoundingClientRect();
     return [position, triggerBox];
 };
 //# sourceMappingURL=dropdown-fit-handler.js.map

package/internal/components/dropdown/dropdown-fit-handler.js.map

@@ -1 +1 @@
-{"version":3,"file":"dropdown-fit-handler.js","sourceRoot":"","sources":["../../../../../src/internal/components/dropdown/dropdown-fit-handler.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 { Dimensions, getOverflowParents, getOverflowParentDimensions } from '../../utils/scrollable-containers';\nimport styles from './styles.css.js';\n\nconst AVAILABLE_SPACE_RESERVE_DEFAULT = 50;\nconst AVAILABLE_SPACE_RESERVE_MOBILE_VERTICAL = 19; // 50 - 31\nconst AVAILABLE_SPACE_RESERVE_MOBILE_HORIZONTAL = 20;\n\ninterface AvailableSpace {\n  above: number;\n  below: number;\n  left: number;\n  right: number;\n}\nexport interface DropdownPosition {\n  height: string;\n  width: string;\n  dropUp: boolean;\n  dropLeft: boolean;\n  left: string;\n}\nexport interface InteriorDropdownPosition extends DropdownPosition {\n  bottom: string;\n  top: string;\n}\n\nconst getClosestParentDimensions = (element: HTMLElement): any => {\n  const parents = getOverflowParents(element).map(el => {\n    const { height, width, top, left } = el.getBoundingClientRect();\n    return {\n      height,\n      width,\n      top,\n      left,\n    };\n  });\n\n  return parents.shift();\n};\n\nexport const getAvailableSpace = (\n  trigger: HTMLElement,\n  dropdown: HTMLElement,\n  overflowParents: ReadonlyArray<Dimensions>,\n  stretchWidth = false,\n  stretchHeight = false,\n  isMobile?: boolean\n): AvailableSpace => {\n  const availableSpaceReserveVertical = stretchHeight\n    ? 0\n    : isMobile\n    ? AVAILABLE_SPACE_RESERVE_MOBILE_VERTICAL\n    : AVAILABLE_SPACE_RESERVE_DEFAULT;\n  const availableSpaceReserveHorizontal = stretchWidth\n    ? 0\n    : isMobile\n    ? AVAILABLE_SPACE_RESERVE_MOBILE_HORIZONTAL\n    : AVAILABLE_SPACE_RESERVE_DEFAULT;\n  const { bottom: triggerBottom, left: triggerLeft, right: triggerRight } = trigger.getBoundingClientRect();\n\n  return overflowParents.reduce(\n    ({ above, below, left, right }, overflowParent) => {\n      const offsetTop = triggerBottom - overflowParent.top;\n      const currentAbove = offsetTop - trigger.offsetHeight - availableSpaceReserveVertical;\n      const currentBelow = overflowParent.height - offsetTop - availableSpaceReserveVertical;\n      const currentLeft = triggerRight - overflowParent.left - availableSpaceReserveHorizontal;\n      const currentRight = overflowParent.left + overflowParent.width - triggerLeft - availableSpaceReserveHorizontal;\n\n      return {\n        above: Math.min(above, currentAbove),\n        below: Math.min(below, currentBelow),\n        left: Math.min(left, currentLeft),\n        right: Math.min(right, currentRight),\n      };\n    },\n    { above: Number.MAX_VALUE, below: Number.MAX_VALUE, left: Number.MAX_VALUE, right: Number.MAX_VALUE }\n  );\n};\n\nexport const getInteriorAvailableSpace = (\n  trigger: HTMLElement,\n  dropdown: HTMLElement,\n  overflowParents: ReadonlyArray<Dimensions>,\n  isMobile?: boolean\n): AvailableSpace => {\n  const AVAILABLE_SPACE_RESERVE_VERTICAL = isMobile\n    ? AVAILABLE_SPACE_RESERVE_MOBILE_VERTICAL\n    : AVAILABLE_SPACE_RESERVE_DEFAULT;\n  const AVAILABLE_SPACE_RESERVE_HORIZONTAL = isMobile\n    ? AVAILABLE_SPACE_RESERVE_MOBILE_HORIZONTAL\n    : AVAILABLE_SPACE_RESERVE_DEFAULT;\n  const {\n    bottom: triggerBottom,\n    top: triggerTop,\n    left: triggerLeft,\n    right: triggerRight,\n  } = trigger.getBoundingClientRect();\n\n  return overflowParents.reduce(\n    ({ above, below, left, right }, overflowParent) => {\n      const currentAbove = triggerBottom - overflowParent.top - AVAILABLE_SPACE_RESERVE_VERTICAL;\n      const currentBelow = overflowParent.height - triggerTop + overflowParent.top - AVAILABLE_SPACE_RESERVE_VERTICAL;\n      const currentLeft = triggerLeft - overflowParent.left - AVAILABLE_SPACE_RESERVE_HORIZONTAL;\n      const currentRight =\n        overflowParent.left + overflowParent.width - triggerRight - AVAILABLE_SPACE_RESERVE_HORIZONTAL;\n\n      return {\n        above: Math.min(above, currentAbove),\n        below: Math.min(below, currentBelow),\n        left: Math.min(left, currentLeft),\n        right: Math.min(right, currentRight),\n      };\n    },\n    { above: Number.MAX_VALUE, below: Number.MAX_VALUE, left: Number.MAX_VALUE, right: Number.MAX_VALUE }\n  );\n};\n\nexport const getDropdownPosition = (\n  trigger: HTMLElement,\n  dropdown: HTMLElement,\n  overflowParents: ReadonlyArray<Dimensions>,\n  minWidth?: number,\n  preferCenter = false,\n  stretchWidth = false,\n  stretchHeight = false,\n  isMobile?: boolean\n): DropdownPosition => {\n  const availableSpace = getAvailableSpace(trigger, dropdown, overflowParents, stretchWidth, stretchHeight, isMobile);\n  const triggerWidth = trigger.getBoundingClientRect().width;\n  minWidth = minWidth ? Math.min(triggerWidth, minWidth) : triggerWidth;\n  const requiredWidth = dropdown.getBoundingClientRect().width;\n  // dropdown should not be smaller than the trigger\n  const idealWidth = Math.max(requiredWidth, minWidth);\n\n  let dropLeft: boolean;\n  let left: number | null = null;\n  let width = idealWidth;\n\n  //1. Can it be positioned with ideal width to the right?\n  if (idealWidth <= availableSpace.right) {\n    dropLeft = false;\n    //2. Can it be positioned with ideal width to the left?\n  } else if (idealWidth <= availableSpace.left) {\n    dropLeft = true;\n    //3. Fit into biggest available space either on left or right\n  } else {\n    dropLeft = availableSpace.left > availableSpace.right;\n    width = Math.max(availableSpace.left, availableSpace.right, minWidth);\n  }\n\n  if (preferCenter) {\n    const spillOver = (idealWidth - triggerWidth) / 2;\n\n    // availableSpace always includes the trigger width, but we want to exclude that\n    const availableOutsideLeft = availableSpace.left - triggerWidth;\n    const availableOutsideRight = availableSpace.right - triggerWidth;\n\n    const fitsInCenter = availableOutsideLeft >= spillOver && availableOutsideRight >= spillOver;\n    if (fitsInCenter) {\n      left = -spillOver;\n    }\n  }\n\n  const dropUp = availableSpace.below < dropdown.offsetHeight && availableSpace.above > availableSpace.below;\n  const availableHeight = dropUp ? availableSpace.above : availableSpace.below;\n  // Try and crop the bottom item when all options can't be displayed, affordance for \"there's more\"\n  const croppedHeight = stretchHeight ? availableHeight : Math.floor(availableHeight / 31) * 31 + 16;\n\n  return {\n    dropUp,\n    dropLeft,\n    left: left === null ? 'auto' : `${left}px`,\n    height: `${croppedHeight}px`,\n    width: `${width}px`,\n  };\n};\n\nexport const getInteriorDropdownPosition = (\n  trigger: HTMLElement,\n  dropdown: HTMLElement,\n  overflowParents: ReadonlyArray<Dimensions>,\n  isMobile?: boolean\n): InteriorDropdownPosition => {\n  const availableSpace = getInteriorAvailableSpace(trigger, dropdown, overflowParents, isMobile);\n  const { bottom: triggerBottom, top: triggerTop, width: triggerWidth } = trigger.getBoundingClientRect();\n  const { top: parentDropdownTop, height: parentDropdownHeight } = getClosestParentDimensions(trigger);\n\n  let dropLeft;\n\n  let width = dropdown.getBoundingClientRect().width;\n  const top = triggerTop - parentDropdownTop;\n  if (width <= availableSpace.right) {\n    dropLeft = false;\n  } else if (width <= availableSpace.left) {\n    dropLeft = true;\n  } else {\n    dropLeft = availableSpace.left > availableSpace.right;\n    width = Math.max(availableSpace.left, availableSpace.right);\n  }\n\n  const left = dropLeft ? 0 - width : triggerWidth;\n\n  const dropUp = availableSpace.below < dropdown.offsetHeight && availableSpace.above > availableSpace.below;\n  const bottom = dropUp ? parentDropdownTop + parentDropdownHeight - triggerBottom : 0;\n  const availableHeight = dropUp ? availableSpace.above : availableSpace.below;\n  // Try and crop the bottom item when all options can't be displayed, affordance for \"there's more\"\n  const croppedHeight = Math.floor(availableHeight / 31) * 31 + 16;\n\n  return {\n    dropUp,\n    dropLeft,\n    height: `${croppedHeight}px`,\n    width: `${width}px`,\n    top: `${top}px`,\n    bottom: `${bottom}px`,\n    left: `${left}px`,\n  };\n};\n\nexport const calculatePosition = (\n  dropdownElement: HTMLDivElement,\n  triggerElement: HTMLDivElement,\n  verticalContainerElement: HTMLDivElement,\n  interior: boolean,\n  expandToViewport: boolean,\n  preferCenter: boolean,\n  stretchWidth: boolean,\n  stretchHeight: boolean,\n  isMobile: boolean,\n  minWidth?: number\n): [DropdownPosition, DOMRect] => {\n  // cleaning previously assigned values,\n  // so that they are not reused in case of screen resize and similar events\n  verticalContainerElement.style.maxHeight = '';\n  dropdownElement.style.width = '';\n  dropdownElement.style.top = '';\n  dropdownElement.style.bottom = '';\n  dropdownElement.style.left = '';\n\n  dropdownElement.classList.remove(styles['dropdown-drop-left']);\n  dropdownElement.classList.remove(styles['dropdown-drop-right']);\n  dropdownElement.classList.remove(styles['dropdown-drop-up']);\n\n  const overflowParents = getOverflowParentDimensions(dropdownElement, interior, expandToViewport, stretchHeight);\n  const position = interior\n    ? getInteriorDropdownPosition(triggerElement, dropdownElement, overflowParents, isMobile)\n    : getDropdownPosition(\n        triggerElement,\n        dropdownElement,\n        overflowParents,\n        minWidth,\n        preferCenter,\n        stretchWidth,\n        stretchHeight,\n        isMobile\n      );\n  const triggerBox = triggerElement.getBoundingClientRect();\n  return [position, triggerBox];\n};\n"]}
+{"version":3,"file":"dropdown-fit-handler.js","sourceRoot":"","sources":["../../../../../src/internal/components/dropdown/dropdown-fit-handler.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 { Dimensions, getOverflowParents, getOverflowParentDimensions } from '../../utils/scrollable-containers';\nimport styles from './styles.css.js';\n\nconst AVAILABLE_SPACE_RESERVE_DEFAULT = 50;\nconst AVAILABLE_SPACE_RESERVE_MOBILE_VERTICAL = 19; // 50 - 31\nconst AVAILABLE_SPACE_RESERVE_MOBILE_HORIZONTAL = 20;\n\ninterface AvailableSpace {\n  above: number;\n  below: number;\n  left: number;\n  right: number;\n}\nexport interface DropdownPosition {\n  height: string;\n  width: string;\n  dropUp: boolean;\n  dropLeft: boolean;\n  left: string;\n}\nexport interface InteriorDropdownPosition extends DropdownPosition {\n  bottom: string;\n  top: string;\n}\n\nconst getClosestParentDimensions = (element: HTMLElement): any => {\n  const parents = getOverflowParents(element).map(el => {\n    const { height, width, top, left } = el.getBoundingClientRect();\n    return {\n      height,\n      width,\n      top,\n      left,\n    };\n  });\n\n  return parents.shift();\n};\n\nexport const getAvailableSpace = (\n  trigger: HTMLElement,\n  dropdown: HTMLElement,\n  overflowParents: ReadonlyArray<Dimensions>,\n  stretchWidth = false,\n  stretchHeight = false,\n  isMobile?: boolean\n): AvailableSpace => {\n  const availableSpaceReserveVertical = stretchHeight\n    ? 0\n    : isMobile\n    ? AVAILABLE_SPACE_RESERVE_MOBILE_VERTICAL\n    : AVAILABLE_SPACE_RESERVE_DEFAULT;\n  const availableSpaceReserveHorizontal = stretchWidth\n    ? 0\n    : isMobile\n    ? AVAILABLE_SPACE_RESERVE_MOBILE_HORIZONTAL\n    : AVAILABLE_SPACE_RESERVE_DEFAULT;\n  const { bottom: triggerBottom, left: triggerLeft, right: triggerRight } = trigger.getBoundingClientRect();\n\n  return overflowParents.reduce(\n    ({ above, below, left, right }, overflowParent) => {\n      const offsetTop = triggerBottom - overflowParent.top;\n      const currentAbove = offsetTop - trigger.offsetHeight - availableSpaceReserveVertical;\n      const currentBelow = overflowParent.height - offsetTop - availableSpaceReserveVertical;\n      const currentLeft = triggerRight - overflowParent.left - availableSpaceReserveHorizontal;\n      const currentRight = overflowParent.left + overflowParent.width - triggerLeft - availableSpaceReserveHorizontal;\n\n      return {\n        above: Math.min(above, currentAbove),\n        below: Math.min(below, currentBelow),\n        left: Math.min(left, currentLeft),\n        right: Math.min(right, currentRight),\n      };\n    },\n    { above: Number.MAX_VALUE, below: Number.MAX_VALUE, left: Number.MAX_VALUE, right: Number.MAX_VALUE }\n  );\n};\n\nexport const getInteriorAvailableSpace = (\n  trigger: HTMLElement,\n  dropdown: HTMLElement,\n  overflowParents: ReadonlyArray<Dimensions>,\n  isMobile?: boolean\n): AvailableSpace => {\n  const AVAILABLE_SPACE_RESERVE_VERTICAL = isMobile\n    ? AVAILABLE_SPACE_RESERVE_MOBILE_VERTICAL\n    : AVAILABLE_SPACE_RESERVE_DEFAULT;\n  const AVAILABLE_SPACE_RESERVE_HORIZONTAL = isMobile\n    ? AVAILABLE_SPACE_RESERVE_MOBILE_HORIZONTAL\n    : AVAILABLE_SPACE_RESERVE_DEFAULT;\n  const {\n    bottom: triggerBottom,\n    top: triggerTop,\n    left: triggerLeft,\n    right: triggerRight,\n  } = trigger.getBoundingClientRect();\n\n  return overflowParents.reduce(\n    ({ above, below, left, right }, overflowParent) => {\n      const currentAbove = triggerBottom - overflowParent.top - AVAILABLE_SPACE_RESERVE_VERTICAL;\n      const currentBelow = overflowParent.height - triggerTop + overflowParent.top - AVAILABLE_SPACE_RESERVE_VERTICAL;\n      const currentLeft = triggerLeft - overflowParent.left - AVAILABLE_SPACE_RESERVE_HORIZONTAL;\n      const currentRight =\n        overflowParent.left + overflowParent.width - triggerRight - AVAILABLE_SPACE_RESERVE_HORIZONTAL;\n\n      return {\n        above: Math.min(above, currentAbove),\n        below: Math.min(below, currentBelow),\n        left: Math.min(left, currentLeft),\n        right: Math.min(right, currentRight),\n      };\n    },\n    { above: Number.MAX_VALUE, below: Number.MAX_VALUE, left: Number.MAX_VALUE, right: Number.MAX_VALUE }\n  );\n};\n\nexport const getDropdownPosition = (\n  trigger: HTMLElement,\n  dropdown: HTMLElement,\n  overflowParents: ReadonlyArray<Dimensions>,\n  minWidth?: number,\n  preferCenter = false,\n  stretchWidth = false,\n  stretchHeight = false,\n  isMobile?: boolean\n): DropdownPosition => {\n  const availableSpace = getAvailableSpace(trigger, dropdown, overflowParents, stretchWidth, stretchHeight, isMobile);\n  const triggerWidth = trigger.getBoundingClientRect().width;\n  minWidth = minWidth ? Math.min(triggerWidth, minWidth) : triggerWidth;\n  const requiredWidth = dropdown.getBoundingClientRect().width;\n  // dropdown should not be smaller than the trigger\n  const idealWidth = Math.max(requiredWidth, minWidth);\n\n  let dropLeft: boolean;\n  let left: number | null = null;\n  let width = idealWidth;\n\n  //1. Can it be positioned with ideal width to the right?\n  if (idealWidth <= availableSpace.right) {\n    dropLeft = false;\n    //2. Can it be positioned with ideal width to the left?\n  } else if (idealWidth <= availableSpace.left) {\n    dropLeft = true;\n    //3. Fit into biggest available space either on left or right\n  } else {\n    dropLeft = availableSpace.left > availableSpace.right;\n    width = Math.max(availableSpace.left, availableSpace.right, minWidth);\n  }\n\n  if (preferCenter) {\n    const spillOver = (idealWidth - triggerWidth) / 2;\n\n    // availableSpace always includes the trigger width, but we want to exclude that\n    const availableOutsideLeft = availableSpace.left - triggerWidth;\n    const availableOutsideRight = availableSpace.right - triggerWidth;\n\n    const fitsInCenter = availableOutsideLeft >= spillOver && availableOutsideRight >= spillOver;\n    if (fitsInCenter) {\n      left = -spillOver;\n    }\n  }\n\n  const dropUp = availableSpace.below < dropdown.offsetHeight && availableSpace.above > availableSpace.below;\n  const availableHeight = dropUp ? availableSpace.above : availableSpace.below;\n  // Try and crop the bottom item when all options can't be displayed, affordance for \"there's more\"\n  const croppedHeight = stretchHeight ? availableHeight : Math.floor(availableHeight / 31) * 31 + 16;\n\n  return {\n    dropUp,\n    dropLeft,\n    left: left === null ? 'auto' : `${left}px`,\n    height: `${croppedHeight}px`,\n    width: `${width}px`,\n  };\n};\n\nexport const getInteriorDropdownPosition = (\n  trigger: HTMLElement,\n  dropdown: HTMLElement,\n  overflowParents: ReadonlyArray<Dimensions>,\n  isMobile?: boolean\n): InteriorDropdownPosition => {\n  const availableSpace = getInteriorAvailableSpace(trigger, dropdown, overflowParents, isMobile);\n  const { bottom: triggerBottom, top: triggerTop, width: triggerWidth } = trigger.getBoundingClientRect();\n  const { top: parentDropdownTop, height: parentDropdownHeight } = getClosestParentDimensions(trigger);\n\n  let dropLeft;\n\n  let width = dropdown.getBoundingClientRect().width;\n  const top = triggerTop - parentDropdownTop;\n  if (width <= availableSpace.right) {\n    dropLeft = false;\n  } else if (width <= availableSpace.left) {\n    dropLeft = true;\n  } else {\n    dropLeft = availableSpace.left > availableSpace.right;\n    width = Math.max(availableSpace.left, availableSpace.right);\n  }\n\n  const left = dropLeft ? 0 - width : triggerWidth;\n\n  const dropUp = availableSpace.below < dropdown.offsetHeight && availableSpace.above > availableSpace.below;\n  const bottom = dropUp ? parentDropdownTop + parentDropdownHeight - triggerBottom : 0;\n  const availableHeight = dropUp ? availableSpace.above : availableSpace.below;\n  // Try and crop the bottom item when all options can't be displayed, affordance for \"there's more\"\n  const croppedHeight = Math.floor(availableHeight / 31) * 31 + 16;\n\n  return {\n    dropUp,\n    dropLeft,\n    height: `${croppedHeight}px`,\n    width: `${width}px`,\n    top: `${top}px`,\n    bottom: `${bottom}px`,\n    left: `${left}px`,\n  };\n};\n\nexport const calculatePosition = (\n  dropdownElement: HTMLDivElement,\n  triggerElement: HTMLDivElement,\n  verticalContainerElement: HTMLDivElement,\n  interior: boolean,\n  expandToViewport: boolean,\n  preferCenter: boolean,\n  stretchWidth: boolean,\n  stretchHeight: boolean,\n  isMobile: boolean,\n  minWidth?: number\n): [DropdownPosition, DOMRect] => {\n  // cleaning previously assigned values,\n  // so that they are not reused in case of screen resize and similar events\n  verticalContainerElement.style.maxHeight = '';\n  dropdownElement.style.width = '';\n  dropdownElement.style.top = '';\n  dropdownElement.style.bottom = '';\n  dropdownElement.style.left = '';\n\n  dropdownElement.classList.remove(styles['dropdown-drop-left']);\n  dropdownElement.classList.remove(styles['dropdown-drop-right']);\n  dropdownElement.classList.remove(styles['dropdown-drop-up']);\n\n  const overflowParents = getOverflowParentDimensions(dropdownElement, interior, expandToViewport, stretchHeight);\n  const position = interior\n    ? getInteriorDropdownPosition(triggerElement, dropdownElement, overflowParents, isMobile)\n    : getDropdownPosition(\n        triggerElement,\n        dropdownElement,\n        overflowParents,\n        minWidth,\n        preferCenter,\n        stretchWidth,\n        stretchHeight,\n        isMobile\n      );\n  const triggerBox = triggerElement.getBoundingClientRect();\n  return [position, triggerBox];\n};\n"]}