@cloudscape-design/components 3.0.220 → 3.0.222

package/internal/components/chart-popover/index.js

@@ -1,4 +1,4 @@
-import { __assign, __rest } from "tslib";
+import { __rest } from "tslib";
 // Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
 // SPDX-License-Identifier: Apache-2.0
 import React, { useEffect, useRef } from 'react';
@@ -12,13 +12,12 @@ import { useMergeRefs } from '../../hooks/use-merge-refs';
 import styles from './styles.css.js';
 export default React.forwardRef(ChartPopover);
 function ChartPopover(_a, ref) {
-    var _b;
-    var _c = _a.position, position = _c === void 0 ? 'right' : _c, _d = _a.size, size = _d === void 0 ? 'medium' : _d, _e = _a.fixedWidth, fixedWidth = _e === void 0 ? false : _e, _f = _a.dismissButton, dismissButton = _f === void 0 ? false : _f, dismissAriaLabel = _a.dismissAriaLabel, children = _a.children, title = _a.title, trackRef = _a.trackRef, trackKey = _a.trackKey, onDismiss = _a.onDismiss, container = _a.container, onMouseEnter = _a.onMouseEnter, onMouseLeave = _a.onMouseLeave, restProps = __rest(_a, ["position", "size", "fixedWidth", "dismissButton", "dismissAriaLabel", "children", "title", "trackRef", "trackKey", "onDismiss", "container", "onMouseEnter", "onMouseLeave"]);
-    var baseProps = getBaseProps(restProps);
-    var popoverObjectRef = useRef(null);
-    var popoverRef = useMergeRefs(popoverObjectRef, ref);
-    useEffect(function () {
-        var onDocumentClick = function (event) {
+    var { position = 'right', size = 'medium', fixedWidth = false, dismissButton = false, dismissAriaLabel, children, title, trackRef, trackKey, onDismiss, container, onMouseEnter, onMouseLeave } = _a, restProps = __rest(_a, ["position", "size", "fixedWidth", "dismissButton", "dismissAriaLabel", "children", "title", "trackRef", "trackKey", "onDismiss", "container", "onMouseEnter", "onMouseLeave"]);
+    const baseProps = getBaseProps(restProps);
+    const popoverObjectRef = useRef(null);
+    const popoverRef = useMergeRefs(popoverObjectRef, ref);
+    useEffect(() => {
+        const onDocumentClick = (event) => {
             if (event.target &&
                 !nodeContains(popoverObjectRef.current, event.target) && // click not in popover
                 !nodeContains(container, event.target) // click not in segment
@@ -27,14 +26,14 @@ function ChartPopover(_a, ref) {
             }
         };
         document.addEventListener('mousedown', onDocumentClick, { capture: true });
-        return function () {
+        return () => {
             document.removeEventListener('mousedown', onDocumentClick, { capture: true });
         };
     }, [container, onDismiss]);
-    return (React.createElement("div", __assign({}, baseProps, { className: clsx(popoverStyles.root, styles.root, baseProps.className, (_b = {}, _b[styles.dismissable] = dismissButton, _b)), ref: popoverRef, onMouseEnter: onMouseEnter, onMouseLeave: onMouseLeave }),
-        React.createElement(PopoverContainer, { size: size, fixedWidth: fixedWidth, position: position, trackRef: trackRef, trackKey: trackKey, arrow: function (position) { return (React.createElement("div", { className: clsx(popoverStyles.arrow, popoverStyles["arrow-position-".concat(position)]) },
+    return (React.createElement("div", Object.assign({}, baseProps, { className: clsx(popoverStyles.root, styles.root, baseProps.className, { [styles.dismissable]: dismissButton }), ref: popoverRef, onMouseEnter: onMouseEnter, onMouseLeave: onMouseLeave }),
+        React.createElement(PopoverContainer, { size: size, fixedWidth: fixedWidth, position: position, trackRef: trackRef, trackKey: trackKey, arrow: position => (React.createElement("div", { className: clsx(popoverStyles.arrow, popoverStyles[`arrow-position-${position}`]) },
                 React.createElement("div", { className: popoverStyles['arrow-outer'] }),
-                React.createElement("div", { className: popoverStyles['arrow-inner'] }))); } },
+                React.createElement("div", { className: popoverStyles['arrow-inner'] }))) },
             React.createElement("div", { className: styles['hover-area'] },
                 React.createElement(PopoverBody, { dismissButton: dismissButton, dismissAriaLabel: dismissAriaLabel, header: title, onDismiss: onDismiss, className: styles['popover-body'] }, children)))));
 }

package/internal/components/chart-popover/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../src/internal/components/chart-popover/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 clsx from 'clsx';\n\nimport { getBaseProps } from '../../base-component';\n\nimport { PopoverProps } from '../../../popover/interfaces';\nimport PopoverContainer from '../../../popover/container';\nimport PopoverBody from '../../../popover/body';\nimport popoverStyles from '../../../popover/styles.css.js';\nimport { nodeContains } from '../../utils/dom';\nimport { useMergeRefs } from '../../hooks/use-merge-refs';\n\nimport styles from './styles.css.js';\n\nexport interface ChartPopoverProps extends PopoverProps {\n  /** Title of the popover */\n  title?: React.ReactNode;\n\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\n  /** Optional container element that prevents any clicks in there from dismissing the popover */\n  container: Element | null;\n\n  /** Event that is fired when the popover is dismissed */\n  onDismiss: (outsideClick?: boolean) => void;\n\n  /** Fired when the pointer enters the hoverable area around the popover */\n  onMouseEnter?: (event: React.MouseEvent) => void;\n\n  /** Fired when the pointer leaves the hoverable area around the popover */\n  onMouseLeave?: (event: React.MouseEvent) => void;\n\n  /** Popover content */\n  children?: React.ReactNode;\n}\n\nexport default React.forwardRef(ChartPopover);\n\nfunction ChartPopover(\n  {\n    position = 'right',\n    size = 'medium',\n    fixedWidth = false,\n    dismissButton = false,\n    dismissAriaLabel,\n\n    children,\n\n    title,\n    trackRef,\n    trackKey,\n    onDismiss,\n    container,\n\n    onMouseEnter,\n    onMouseLeave,\n\n    ...restProps\n  }: ChartPopoverProps,\n  ref: React.Ref<HTMLElement>\n) {\n  const baseProps = getBaseProps(restProps);\n  const popoverObjectRef = useRef<HTMLDivElement | null>(null);\n\n  const popoverRef = useMergeRefs(popoverObjectRef, ref);\n\n  useEffect(() => {\n    const onDocumentClick = (event: MouseEvent) => {\n      if (\n        event.target &&\n        !nodeContains(popoverObjectRef.current, event.target as Element) && // click not in popover\n        !nodeContains(container, event.target as Element) // click not in segment\n      ) {\n        onDismiss(true);\n      }\n    };\n\n    document.addEventListener('mousedown', onDocumentClick, { capture: true });\n    return () => {\n      document.removeEventListener('mousedown', onDocumentClick, { capture: true });\n    };\n  }, [container, onDismiss]);\n\n  return (\n    <div\n      {...baseProps}\n      className={clsx(popoverStyles.root, styles.root, baseProps.className, { [styles.dismissable]: dismissButton })}\n      ref={popoverRef}\n      onMouseEnter={onMouseEnter}\n      onMouseLeave={onMouseLeave}\n    >\n      <PopoverContainer\n        size={size}\n        fixedWidth={fixedWidth}\n        position={position}\n        trackRef={trackRef}\n        trackKey={trackKey}\n        arrow={position => (\n          <div className={clsx(popoverStyles.arrow, popoverStyles[`arrow-position-${position}`])}>\n            <div className={popoverStyles['arrow-outer']} />\n            <div className={popoverStyles['arrow-inner']} />\n          </div>\n        )}\n      >\n        <div className={styles['hover-area']}>\n          <PopoverBody\n            dismissButton={dismissButton}\n            dismissAriaLabel={dismissAriaLabel}\n            header={title}\n            onDismiss={onDismiss}\n            className={styles['popover-body']}\n          >\n            {children}\n          </PopoverBody>\n        </div>\n      </PopoverContainer>\n    </div>\n  );\n}\n"]}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../src/internal/components/chart-popover/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 clsx from 'clsx';\n\nimport { getBaseProps } from '../../base-component';\n\nimport { PopoverProps } from '../../../popover/interfaces';\nimport PopoverContainer from '../../../popover/container';\nimport PopoverBody from '../../../popover/body';\nimport popoverStyles from '../../../popover/styles.css.js';\nimport { nodeContains } from '../../utils/dom';\nimport { useMergeRefs } from '../../hooks/use-merge-refs';\n\nimport styles from './styles.css.js';\n\nexport interface ChartPopoverProps extends PopoverProps {\n  /** Title of the popover */\n  title?: React.ReactNode;\n\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\n  /** Optional container element that prevents any clicks in there from dismissing the popover */\n  container: Element | null;\n\n  /** Event that is fired when the popover is dismissed */\n  onDismiss: (outsideClick?: boolean) => void;\n\n  /** Fired when the pointer enters the hoverable area around the popover */\n  onMouseEnter?: (event: React.MouseEvent) => void;\n\n  /** Fired when the pointer leaves the hoverable area around the popover */\n  onMouseLeave?: (event: React.MouseEvent) => void;\n\n  /** Popover content */\n  children?: React.ReactNode;\n}\n\nexport default React.forwardRef(ChartPopover);\n\nfunction ChartPopover(\n  {\n    position = 'right',\n    size = 'medium',\n    fixedWidth = false,\n    dismissButton = false,\n    dismissAriaLabel,\n\n    children,\n\n    title,\n    trackRef,\n    trackKey,\n    onDismiss,\n    container,\n\n    onMouseEnter,\n    onMouseLeave,\n\n    ...restProps\n  }: ChartPopoverProps,\n  ref: React.Ref<HTMLElement>\n) {\n  const baseProps = getBaseProps(restProps);\n  const popoverObjectRef = useRef<HTMLDivElement | null>(null);\n\n  const popoverRef = useMergeRefs(popoverObjectRef, ref);\n\n  useEffect(() => {\n    const onDocumentClick = (event: MouseEvent) => {\n      if (\n        event.target &&\n        !nodeContains(popoverObjectRef.current, event.target as Element) && // click not in popover\n        !nodeContains(container, event.target as Element) // click not in segment\n      ) {\n        onDismiss(true);\n      }\n    };\n\n    document.addEventListener('mousedown', onDocumentClick, { capture: true });\n    return () => {\n      document.removeEventListener('mousedown', onDocumentClick, { capture: true });\n    };\n  }, [container, onDismiss]);\n\n  return (\n    <div\n      {...baseProps}\n      className={clsx(popoverStyles.root, styles.root, baseProps.className, { [styles.dismissable]: dismissButton })}\n      ref={popoverRef}\n      onMouseEnter={onMouseEnter}\n      onMouseLeave={onMouseLeave}\n    >\n      <PopoverContainer\n        size={size}\n        fixedWidth={fixedWidth}\n        position={position}\n        trackRef={trackRef}\n        trackKey={trackKey}\n        arrow={position => (\n          <div className={clsx(popoverStyles.arrow, popoverStyles[`arrow-position-${position}`])}>\n            <div className={popoverStyles['arrow-outer']} />\n            <div className={popoverStyles['arrow-inner']} />\n          </div>\n        )}\n      >\n        <div className={styles['hover-area']}>\n          <PopoverBody\n            dismissButton={dismissButton}\n            dismissAriaLabel={dismissAriaLabel}\n            header={title}\n            onDismiss={onDismiss}\n            className={styles['popover-body']}\n          >\n            {children}\n          </PopoverBody>\n        </div>\n      </PopoverContainer>\n    </div>\n  );\n}\n"]}

package/internal/components/chart-series-details/index.js

@@ -1,4 +1,4 @@
-import { __assign, __rest } from "tslib";
+import { __rest } from "tslib";
 // Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
 // SPDX-License-Identifier: Apache-2.0
 import React, { memo } from 'react';
@@ -9,21 +9,17 @@ import ChartSeriesMarker from '../chart-series-marker';
 import styles from './styles.css.js';
 export default memo(ChartSeriesDetails);
 function ChartSeriesDetails(_a) {
-    var details = _a.details, restProps = __rest(_a, ["details"]);
-    var baseProps = getBaseProps(restProps);
-    var className = clsx(baseProps.className, styles.root);
-    return (React.createElement("div", __assign({}, baseProps, { className: className }),
-        React.createElement("ul", { className: styles.list }, details.map(function (_a, index) {
-            var _b;
-            var key = _a.key, value = _a.value, markerType = _a.markerType, color = _a.color, isDimmed = _a.isDimmed;
-            return (React.createElement("li", { key: index, className: clsx((_b = {},
-                    _b[styles.dimmed] = isDimmed,
-                    _b[styles['list-item']] = true,
-                    _b)) },
-                React.createElement("div", { className: styles.key },
-                    markerType && color && React.createElement(ChartSeriesMarker, { type: markerType, color: color }),
-                    React.createElement("span", null, key)),
-                React.createElement(InternalBox, { textAlign: "right" }, value)));
-        }))));
+    var { details } = _a, restProps = __rest(_a, ["details"]);
+    const baseProps = getBaseProps(restProps);
+    const className = clsx(baseProps.className, styles.root);
+    return (React.createElement("div", Object.assign({}, baseProps, { className: className }),
+        React.createElement("ul", { className: styles.list }, details.map(({ key, value, markerType, color, isDimmed }, index) => (React.createElement("li", { key: index, className: clsx({
+                [styles.dimmed]: isDimmed,
+                [styles['list-item']]: true,
+            }) },
+            React.createElement("div", { className: styles.key },
+                markerType && color && React.createElement(ChartSeriesMarker, { type: markerType, color: color }),
+                React.createElement("span", null, key)),
+            React.createElement(InternalBox, { textAlign: "right" }, value)))))));
 }
 //# sourceMappingURL=index.js.map

package/internal/components/chart-series-details/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../src/internal/components/chart-series-details/index.tsx"],"names":[],"mappings":";AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,KAAK,EAAE,EAAE,IAAI,EAAE,MAAM,OAAO,CAAC;AACpC,OAAO,IAAI,MAAM,MAAM,CAAC;AAExB,OAAO,EAAsB,YAAY,EAAE,MAAM,sBAAsB,CAAC;AACxE,OAAO,WAAW,MAAM,uBAAuB,CAAC;AAEhD,OAAO,iBAA4C,MAAM,wBAAwB,CAAC;AAClF,OAAO,MAAM,MAAM,iBAAiB,CAAC;AAYrC,eAAe,IAAI,CAAC,kBAAkB,CAAC,CAAC;AAExC,SAAS,kBAAkB,CAAC,EAAkD;IAAhD,IAAA,OAAO,aAAA,EAAK,SAAS,cAAvB,WAAyB,CAAF;IACjD,IAAM,SAAS,GAAG,YAAY,CAAC,SAAS,CAAC,CAAC;IAC1C,IAAM,SAAS,GAAG,IAAI,CAAC,SAAS,CAAC,SAAS,EAAE,MAAM,CAAC,IAAI,CAAC,CAAC;IAEzD,OAAO,CACL,wCAAS,SAAS,IAAE,SAAS,EAAE,SAAS;QACtC,4BAAI,SAAS,EAAE,MAAM,CAAC,IAAI,IACvB,OAAO,CAAC,GAAG,CAAC,UAAC,EAA2C,EAAE,KAAK;;gBAAhD,GAAG,SAAA,EAAE,KAAK,WAAA,EAAE,UAAU,gBAAA,EAAE,KAAK,WAAA,EAAE,QAAQ,cAAA;YAAc,OAAA,CACnE,4BACE,GAAG,EAAE,KAAK,EACV,SAAS,EAAE,IAAI;oBACb,GAAC,MAAM,CAAC,MAAM,IAAG,QAAQ;oBACzB,GAAC,MAAM,CAAC,WAAW,CAAC,IAAG,IAAI;wBAC3B;gBAEF,6BAAK,SAAS,EAAE,MAAM,CAAC,GAAG;oBACvB,UAAU,IAAI,KAAK,IAAI,oBAAC,iBAAiB,IAAC,IAAI,EAAE,UAAU,EAAE,KAAK,EAAE,KAAK,GAAI;oBAC7E,kCAAO,GAAG,CAAQ,CACd;gBACN,oBAAC,WAAW,IAAC,SAAS,EAAC,OAAO,IAAE,KAAK,CAAe,CACjD,CACN;QAdoE,CAcpE,CAAC,CACC,CACD,CACP,CAAC;AACJ,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React, { memo } from 'react';\nimport clsx from 'clsx';\n\nimport { BaseComponentProps, getBaseProps } from '../../base-component';\nimport InternalBox from '../../../box/internal';\nimport { ChartDetailPair } from '../../../pie-chart/interfaces';\nimport ChartSeriesMarker, { ChartSeriesMarkerType } from '../chart-series-marker';\nimport styles from './styles.css.js';\n\nexport interface ChartSeriesDetailItem extends ChartDetailPair {\n  markerType?: ChartSeriesMarkerType;\n  color?: string;\n  isDimmed?: boolean;\n}\n\nexport interface ChartSeriesDetailsProps extends BaseComponentProps {\n  details: ReadonlyArray<ChartSeriesDetailItem>;\n}\n\nexport default memo(ChartSeriesDetails);\n\nfunction ChartSeriesDetails({ details, ...restProps }: ChartSeriesDetailsProps) {\n  const baseProps = getBaseProps(restProps);\n  const className = clsx(baseProps.className, styles.root);\n\n  return (\n    <div {...baseProps} className={className}>\n      <ul className={styles.list}>\n        {details.map(({ key, value, markerType, color, isDimmed }, index) => (\n          <li\n            key={index}\n            className={clsx({\n              [styles.dimmed]: isDimmed,\n              [styles['list-item']]: true,\n            })}\n          >\n            <div className={styles.key}>\n              {markerType && color && <ChartSeriesMarker type={markerType} color={color} />}\n              <span>{key}</span>\n            </div>\n            <InternalBox textAlign=\"right\">{value}</InternalBox>\n          </li>\n        ))}\n      </ul>\n    </div>\n  );\n}\n"]}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../src/internal/components/chart-series-details/index.tsx"],"names":[],"mappings":";AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,KAAK,EAAE,EAAE,IAAI,EAAE,MAAM,OAAO,CAAC;AACpC,OAAO,IAAI,MAAM,MAAM,CAAC;AAExB,OAAO,EAAsB,YAAY,EAAE,MAAM,sBAAsB,CAAC;AACxE,OAAO,WAAW,MAAM,uBAAuB,CAAC;AAEhD,OAAO,iBAA4C,MAAM,wBAAwB,CAAC;AAClF,OAAO,MAAM,MAAM,iBAAiB,CAAC;AAYrC,eAAe,IAAI,CAAC,kBAAkB,CAAC,CAAC;AAExC,SAAS,kBAAkB,CAAC,EAAkD;QAAlD,EAAE,OAAO,OAAyC,EAApC,SAAS,cAAvB,WAAyB,CAAF;IACjD,MAAM,SAAS,GAAG,YAAY,CAAC,SAAS,CAAC,CAAC;IAC1C,MAAM,SAAS,GAAG,IAAI,CAAC,SAAS,CAAC,SAAS,EAAE,MAAM,CAAC,IAAI,CAAC,CAAC;IAEzD,OAAO,CACL,6CAAS,SAAS,IAAE,SAAS,EAAE,SAAS;QACtC,4BAAI,SAAS,EAAE,MAAM,CAAC,IAAI,IACvB,OAAO,CAAC,GAAG,CAAC,CAAC,EAAE,GAAG,EAAE,KAAK,EAAE,UAAU,EAAE,KAAK,EAAE,QAAQ,EAAE,EAAE,KAAK,EAAE,EAAE,CAAC,CACnE,4BACE,GAAG,EAAE,KAAK,EACV,SAAS,EAAE,IAAI,CAAC;gBACd,CAAC,MAAM,CAAC,MAAM,CAAC,EAAE,QAAQ;gBACzB,CAAC,MAAM,CAAC,WAAW,CAAC,CAAC,EAAE,IAAI;aAC5B,CAAC;YAEF,6BAAK,SAAS,EAAE,MAAM,CAAC,GAAG;gBACvB,UAAU,IAAI,KAAK,IAAI,oBAAC,iBAAiB,IAAC,IAAI,EAAE,UAAU,EAAE,KAAK,EAAE,KAAK,GAAI;gBAC7E,kCAAO,GAAG,CAAQ,CACd;YACN,oBAAC,WAAW,IAAC,SAAS,EAAC,OAAO,IAAE,KAAK,CAAe,CACjD,CACN,CAAC,CACC,CACD,CACP,CAAC;AACJ,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React, { memo } from 'react';\nimport clsx from 'clsx';\n\nimport { BaseComponentProps, getBaseProps } from '../../base-component';\nimport InternalBox from '../../../box/internal';\nimport { ChartDetailPair } from '../../../pie-chart/interfaces';\nimport ChartSeriesMarker, { ChartSeriesMarkerType } from '../chart-series-marker';\nimport styles from './styles.css.js';\n\nexport interface ChartSeriesDetailItem extends ChartDetailPair {\n  markerType?: ChartSeriesMarkerType;\n  color?: string;\n  isDimmed?: boolean;\n}\n\nexport interface ChartSeriesDetailsProps extends BaseComponentProps {\n  details: ReadonlyArray<ChartSeriesDetailItem>;\n}\n\nexport default memo(ChartSeriesDetails);\n\nfunction ChartSeriesDetails({ details, ...restProps }: ChartSeriesDetailsProps) {\n  const baseProps = getBaseProps(restProps);\n  const className = clsx(baseProps.className, styles.root);\n\n  return (\n    <div {...baseProps} className={className}>\n      <ul className={styles.list}>\n        {details.map(({ key, value, markerType, color, isDimmed }, index) => (\n          <li\n            key={index}\n            className={clsx({\n              [styles.dimmed]: isDimmed,\n              [styles['list-item']]: true,\n            })}\n          >\n            <div className={styles.key}>\n              {markerType && color && <ChartSeriesMarker type={markerType} color={color} />}\n              <span>{key}</span>\n            </div>\n            <InternalBox textAlign=\"right\">{value}</InternalBox>\n          </li>\n        ))}\n      </ul>\n    </div>\n  );\n}\n"]}

package/internal/components/chart-series-marker/index.js

@@ -4,8 +4,7 @@ import React, { memo } from 'react';
 import clsx from 'clsx';
 import styles from './styles.css.js';
 export default memo(ChartSeriesMarker);
-function ChartSeriesMarker(_a) {
-    var _b = _a.type, type = _b === void 0 ? 'line' : _b, color = _a.color;
-    return (React.createElement("span", { className: clsx(styles.marker, styles["marker--".concat(type)]), style: { backgroundColor: color }, "aria-hidden": "true" }));
+function ChartSeriesMarker({ type = 'line', color }) {
+    return (React.createElement("span", { className: clsx(styles.marker, styles[`marker--${type}`]), style: { backgroundColor: color }, "aria-hidden": "true" }));
 }
 //# sourceMappingURL=index.js.map

package/internal/components/chart-series-marker/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../src/internal/components/chart-series-marker/index.tsx"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,KAAK,EAAE,EAAE,IAAI,EAAE,MAAM,OAAO,CAAC;AACpC,OAAO,IAAI,MAAM,MAAM,CAAC;AAGxB,OAAO,MAAM,MAAM,iBAAiB,CAAC;AASrC,eAAe,IAAI,CAAC,iBAAiB,CAAC,CAAC;AAEvC,SAAS,iBAAiB,CAAC,EAAgD;QAA9C,YAAa,EAAb,IAAI,mBAAG,MAAM,KAAA,EAAE,KAAK,WAAA;IAC/C,OAAO,CACL,8BACE,SAAS,EAAE,IAAI,CAAC,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,kBAAW,IAAI,CAAE,CAAC,CAAC,EACzD,KAAK,EAAE,EAAE,eAAe,EAAE,KAAK,EAAE,iBACrB,MAAM,GACZ,CACT,CAAC;AACJ,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React, { memo } from 'react';\nimport clsx from 'clsx';\n\nimport { BaseComponentProps } from '../../base-component';\nimport styles from './styles.css.js';\n\nexport type ChartSeriesMarkerType = 'line' | 'rectangle' | 'dashed' | 'hollow-rectangle';\n\ninterface ChartSeriesMarkerProps extends BaseComponentProps {\n  type: ChartSeriesMarkerType;\n  color: string;\n}\n\nexport default memo(ChartSeriesMarker);\n\nfunction ChartSeriesMarker({ type = 'line', color }: ChartSeriesMarkerProps) {\n  return (\n    <span\n      className={clsx(styles.marker, styles[`marker--${type}`])}\n      style={{ backgroundColor: color }}\n      aria-hidden=\"true\"\n    ></span>\n  );\n}\n"]}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../src/internal/components/chart-series-marker/index.tsx"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,KAAK,EAAE,EAAE,IAAI,EAAE,MAAM,OAAO,CAAC;AACpC,OAAO,IAAI,MAAM,MAAM,CAAC;AAGxB,OAAO,MAAM,MAAM,iBAAiB,CAAC;AASrC,eAAe,IAAI,CAAC,iBAAiB,CAAC,CAAC;AAEvC,SAAS,iBAAiB,CAAC,EAAE,IAAI,GAAG,MAAM,EAAE,KAAK,EAA0B;IACzE,OAAO,CACL,8BACE,SAAS,EAAE,IAAI,CAAC,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,WAAW,IAAI,EAAE,CAAC,CAAC,EACzD,KAAK,EAAE,EAAE,eAAe,EAAE,KAAK,EAAE,iBACrB,MAAM,GACZ,CACT,CAAC;AACJ,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React, { memo } from 'react';\nimport clsx from 'clsx';\n\nimport { BaseComponentProps } from '../../base-component';\nimport styles from './styles.css.js';\n\nexport type ChartSeriesMarkerType = 'line' | 'rectangle' | 'dashed' | 'hollow-rectangle';\n\ninterface ChartSeriesMarkerProps extends BaseComponentProps {\n  type: ChartSeriesMarkerType;\n  color: string;\n}\n\nexport default memo(ChartSeriesMarker);\n\nfunction ChartSeriesMarker({ type = 'line', color }: ChartSeriesMarkerProps) {\n  return (\n    <span\n      className={clsx(styles.marker, styles[`marker--${type}`])}\n      style={{ backgroundColor: color }}\n      aria-hidden=\"true\"\n    ></span>\n  );\n}\n"]}

package/internal/components/chart-status-container/index.js

@@ -5,17 +5,15 @@ import { fireNonCancelableEvent } from '../../events';
 import InternalStatusIndicator from '../../../status-indicator/internal';
 import InternalLink from '../../../link/internal';
 import styles from './styles.css.js';
-export function getChartStatus(_a) {
-    var externalData = _a.externalData, visibleData = _a.visibleData, statusType = _a.statusType;
-    var isEmpty = !visibleData || visibleData.length === 0;
-    var isNoMatch = isEmpty && visibleData.length !== externalData.length;
-    var showChart = statusType === 'finished' && !isEmpty;
-    return { isEmpty: isEmpty, isNoMatch: isNoMatch, showChart: showChart };
+export function getChartStatus({ externalData, visibleData, statusType, }) {
+    const isEmpty = !visibleData || visibleData.length === 0;
+    const isNoMatch = isEmpty && visibleData.length !== externalData.length;
+    const showChart = statusType === 'finished' && !isEmpty;
+    return { isEmpty, isNoMatch, showChart };
 }
-export default function ChartStatusContainer(_a) {
-    var statusType = _a.statusType, errorText = _a.errorText, loadingText = _a.loadingText, recoveryText = _a.recoveryText, noMatch = _a.noMatch, empty = _a.empty, onRecoveryClick = _a.onRecoveryClick, isNoMatch = _a.isNoMatch, isEmpty = _a.isEmpty, showChart = _a.showChart;
-    var statusContainer = useMemo(function () {
-        var handleRecoveryClick = function (event) {
+export default function ChartStatusContainer({ statusType, errorText, loadingText, recoveryText, noMatch, empty, onRecoveryClick, isNoMatch, isEmpty, showChart, }) {
+    const statusContainer = useMemo(() => {
+        const handleRecoveryClick = (event) => {
             event.preventDefault();
             fireNonCancelableEvent(onRecoveryClick);
         };

package/internal/components/chart-status-container/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../src/internal/components/chart-status-container/index.tsx"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,KAAK,EAAE,EAAE,OAAO,EAAE,MAAM,OAAO,CAAC;AAGvC,OAAO,EAAE,sBAAsB,EAA6B,MAAM,cAAc,CAAC;AACjF,OAAO,uBAAuB,MAAM,oCAAoC,CAAC;AACzE,OAAO,YAAY,MAAM,wBAAwB,CAAC;AAElD,OAAO,MAAM,MAAM,iBAAiB,CAAC;AAoBrC,MAAM,UAAU,cAAc,CAAO,EAQpC;QAPC,YAAY,kBAAA,EACZ,WAAW,iBAAA,EACX,UAAU,gBAAA;IAMV,IAAM,OAAO,GAAG,CAAC,WAAW,IAAI,WAAW,CAAC,MAAM,KAAK,CAAC,CAAC;IACzD,IAAM,SAAS,GAAG,OAAO,IAAI,WAAW,CAAC,MAAM,KAAK,YAAY,CAAC,MAAM,CAAC;IACxE,IAAM,SAAS,GAAG,UAAU,KAAK,UAAU,IAAI,CAAC,OAAO,CAAC;IACxD,OAAO,EAAE,OAAO,SAAA,EAAE,SAAS,WAAA,EAAE,SAAS,WAAA,EAAE,CAAC;AAC3C,CAAC;AAED,MAAM,CAAC,OAAO,UAAU,oBAAoB,CAAC,EAWjB;QAV1B,UAAU,gBAAA,EACV,SAAS,eAAA,EACT,WAAW,iBAAA,EACX,YAAY,kBAAA,EACZ,OAAO,aAAA,EACP,KAAK,WAAA,EACL,eAAe,qBAAA,EACf,SAAS,eAAA,EACT,OAAO,aAAA,EACP,SAAS,eAAA;IAET,IAAM,eAAe,GAAG,OAAO,CAAC;QAC9B,IAAM,mBAAmB,GAAG,UAAC,KAAkB;YAC7C,KAAK,CAAC,cAAc,EAAE,CAAC;YACvB,sBAAsB,CAAC,eAAe,CAAC,CAAC;QAC1C,CAAC,CAAC;QACF,IAAI,UAAU,KAAK,OAAO,EAAE;YAC1B,OAAO,CACL;gBACE,oBAAC,uBAAuB,IAAC,IAAI,EAAC,OAAO,IAAE,SAAS,CAA2B;gBAAC,GAAG;gBAC9E,YAAY,IAAI,CACf,oBAAC,YAAY,IAAC,QAAQ,EAAE,mBAAmB,EAAE,OAAO,EAAC,UAAU,IAC5D,YAAY,CACA,CAChB,CACI,CACR,CAAC;SACH;QAED,IAAI,UAAU,KAAK,SAAS,EAAE;YAC5B,OAAO,oBAAC,uBAAuB,IAAC,IAAI,EAAC,SAAS,IAAE,WAAW,CAA2B,CAAC;SACxF;QAED,IAAI,SAAS,EAAE;YACb,OAAO,6BAAK,SAAS,EAAE,MAAM,CAAC,KAAK,IAAG,OAAO,CAAO,CAAC;SACtD;QAED,IAAI,OAAO,EAAE;YACX,OAAO,6BAAK,SAAS,EAAE,MAAM,CAAC,KAAK,IAAG,KAAK,CAAO,CAAC;SACpD;IACH,CAAC,EAAE,CAAC,UAAU,EAAE,eAAe,EAAE,OAAO,EAAE,SAAS,EAAE,YAAY,EAAE,WAAW,EAAE,SAAS,EAAE,KAAK,EAAE,OAAO,CAAC,CAAC,CAAC;IAE5G,OAAO,CACL,6BAAK,SAAS,EAAE,MAAM,CAAC,IAAI,eAAY,QAAQ,iBAAa,MAAM,IAC/D,CAAC,SAAS,IAAI,eAAe,CAC1B,CACP,CAAC;AACJ,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React, { useMemo } from 'react';\n\nimport { BaseComponentProps } from '../../base-component';\nimport { fireNonCancelableEvent, NonCancelableEventHandler } from '../../events';\nimport InternalStatusIndicator from '../../../status-indicator/internal';\nimport InternalLink from '../../../link/internal';\n\nimport styles from './styles.css.js';\n\ninterface ChartStatusContainerProps extends BaseComponentProps {\n  statusType: 'loading' | 'finished' | 'error';\n\n  empty?: React.ReactNode;\n  noMatch?: React.ReactNode;\n\n  loadingText?: string;\n  errorText?: string;\n  recoveryText?: string;\n\n  onRecoveryClick?: NonCancelableEventHandler;\n\n  // From `getChartStatus`\n  isEmpty?: boolean;\n  isNoMatch?: boolean;\n  showChart?: boolean;\n}\n\nexport function getChartStatus<T, U>({\n  externalData,\n  visibleData,\n  statusType,\n}: {\n  externalData: ReadonlyArray<T>;\n  visibleData: ReadonlyArray<U>;\n  statusType: 'loading' | 'finished' | 'error';\n}) {\n  const isEmpty = !visibleData || visibleData.length === 0;\n  const isNoMatch = isEmpty && visibleData.length !== externalData.length;\n  const showChart = statusType === 'finished' && !isEmpty;\n  return { isEmpty, isNoMatch, showChart };\n}\n\nexport default function ChartStatusContainer({\n  statusType,\n  errorText,\n  loadingText,\n  recoveryText,\n  noMatch,\n  empty,\n  onRecoveryClick,\n  isNoMatch,\n  isEmpty,\n  showChart,\n}: ChartStatusContainerProps) {\n  const statusContainer = useMemo(() => {\n    const handleRecoveryClick = (event: CustomEvent) => {\n      event.preventDefault();\n      fireNonCancelableEvent(onRecoveryClick);\n    };\n    if (statusType === 'error') {\n      return (\n        <span>\n          <InternalStatusIndicator type=\"error\">{errorText}</InternalStatusIndicator>{' '}\n          {recoveryText && (\n            <InternalLink onFollow={handleRecoveryClick} variant=\"recovery\">\n              {recoveryText}\n            </InternalLink>\n          )}\n        </span>\n      );\n    }\n\n    if (statusType === 'loading') {\n      return <InternalStatusIndicator type=\"loading\">{loadingText}</InternalStatusIndicator>;\n    }\n\n    if (isNoMatch) {\n      return <div className={styles.empty}>{noMatch}</div>;\n    }\n\n    if (isEmpty) {\n      return <div className={styles.empty}>{empty}</div>;\n    }\n  }, [statusType, onRecoveryClick, isEmpty, isNoMatch, recoveryText, loadingText, errorText, empty, noMatch]);\n\n  return (\n    <div className={styles.root} aria-live=\"polite\" aria-atomic=\"true\">\n      {!showChart && statusContainer}\n    </div>\n  );\n}\n"]}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../src/internal/components/chart-status-container/index.tsx"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,KAAK,EAAE,EAAE,OAAO,EAAE,MAAM,OAAO,CAAC;AAGvC,OAAO,EAAE,sBAAsB,EAA6B,MAAM,cAAc,CAAC;AACjF,OAAO,uBAAuB,MAAM,oCAAoC,CAAC;AACzE,OAAO,YAAY,MAAM,wBAAwB,CAAC;AAElD,OAAO,MAAM,MAAM,iBAAiB,CAAC;AAoBrC,MAAM,UAAU,cAAc,CAAO,EACnC,YAAY,EACZ,WAAW,EACX,UAAU,GAKX;IACC,MAAM,OAAO,GAAG,CAAC,WAAW,IAAI,WAAW,CAAC,MAAM,KAAK,CAAC,CAAC;IACzD,MAAM,SAAS,GAAG,OAAO,IAAI,WAAW,CAAC,MAAM,KAAK,YAAY,CAAC,MAAM,CAAC;IACxE,MAAM,SAAS,GAAG,UAAU,KAAK,UAAU,IAAI,CAAC,OAAO,CAAC;IACxD,OAAO,EAAE,OAAO,EAAE,SAAS,EAAE,SAAS,EAAE,CAAC;AAC3C,CAAC;AAED,MAAM,CAAC,OAAO,UAAU,oBAAoB,CAAC,EAC3C,UAAU,EACV,SAAS,EACT,WAAW,EACX,YAAY,EACZ,OAAO,EACP,KAAK,EACL,eAAe,EACf,SAAS,EACT,OAAO,EACP,SAAS,GACiB;IAC1B,MAAM,eAAe,GAAG,OAAO,CAAC,GAAG,EAAE;QACnC,MAAM,mBAAmB,GAAG,CAAC,KAAkB,EAAE,EAAE;YACjD,KAAK,CAAC,cAAc,EAAE,CAAC;YACvB,sBAAsB,CAAC,eAAe,CAAC,CAAC;QAC1C,CAAC,CAAC;QACF,IAAI,UAAU,KAAK,OAAO,EAAE;YAC1B,OAAO,CACL;gBACE,oBAAC,uBAAuB,IAAC,IAAI,EAAC,OAAO,IAAE,SAAS,CAA2B;gBAAC,GAAG;gBAC9E,YAAY,IAAI,CACf,oBAAC,YAAY,IAAC,QAAQ,EAAE,mBAAmB,EAAE,OAAO,EAAC,UAAU,IAC5D,YAAY,CACA,CAChB,CACI,CACR,CAAC;SACH;QAED,IAAI,UAAU,KAAK,SAAS,EAAE;YAC5B,OAAO,oBAAC,uBAAuB,IAAC,IAAI,EAAC,SAAS,IAAE,WAAW,CAA2B,CAAC;SACxF;QAED,IAAI,SAAS,EAAE;YACb,OAAO,6BAAK,SAAS,EAAE,MAAM,CAAC,KAAK,IAAG,OAAO,CAAO,CAAC;SACtD;QAED,IAAI,OAAO,EAAE;YACX,OAAO,6BAAK,SAAS,EAAE,MAAM,CAAC,KAAK,IAAG,KAAK,CAAO,CAAC;SACpD;IACH,CAAC,EAAE,CAAC,UAAU,EAAE,eAAe,EAAE,OAAO,EAAE,SAAS,EAAE,YAAY,EAAE,WAAW,EAAE,SAAS,EAAE,KAAK,EAAE,OAAO,CAAC,CAAC,CAAC;IAE5G,OAAO,CACL,6BAAK,SAAS,EAAE,MAAM,CAAC,IAAI,eAAY,QAAQ,iBAAa,MAAM,IAC/D,CAAC,SAAS,IAAI,eAAe,CAC1B,CACP,CAAC;AACJ,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React, { useMemo } from 'react';\n\nimport { BaseComponentProps } from '../../base-component';\nimport { fireNonCancelableEvent, NonCancelableEventHandler } from '../../events';\nimport InternalStatusIndicator from '../../../status-indicator/internal';\nimport InternalLink from '../../../link/internal';\n\nimport styles from './styles.css.js';\n\ninterface ChartStatusContainerProps extends BaseComponentProps {\n  statusType: 'loading' | 'finished' | 'error';\n\n  empty?: React.ReactNode;\n  noMatch?: React.ReactNode;\n\n  loadingText?: string;\n  errorText?: string;\n  recoveryText?: string;\n\n  onRecoveryClick?: NonCancelableEventHandler;\n\n  // From `getChartStatus`\n  isEmpty?: boolean;\n  isNoMatch?: boolean;\n  showChart?: boolean;\n}\n\nexport function getChartStatus<T, U>({\n  externalData,\n  visibleData,\n  statusType,\n}: {\n  externalData: ReadonlyArray<T>;\n  visibleData: ReadonlyArray<U>;\n  statusType: 'loading' | 'finished' | 'error';\n}) {\n  const isEmpty = !visibleData || visibleData.length === 0;\n  const isNoMatch = isEmpty && visibleData.length !== externalData.length;\n  const showChart = statusType === 'finished' && !isEmpty;\n  return { isEmpty, isNoMatch, showChart };\n}\n\nexport default function ChartStatusContainer({\n  statusType,\n  errorText,\n  loadingText,\n  recoveryText,\n  noMatch,\n  empty,\n  onRecoveryClick,\n  isNoMatch,\n  isEmpty,\n  showChart,\n}: ChartStatusContainerProps) {\n  const statusContainer = useMemo(() => {\n    const handleRecoveryClick = (event: CustomEvent) => {\n      event.preventDefault();\n      fireNonCancelableEvent(onRecoveryClick);\n    };\n    if (statusType === 'error') {\n      return (\n        <span>\n          <InternalStatusIndicator type=\"error\">{errorText}</InternalStatusIndicator>{' '}\n          {recoveryText && (\n            <InternalLink onFollow={handleRecoveryClick} variant=\"recovery\">\n              {recoveryText}\n            </InternalLink>\n          )}\n        </span>\n      );\n    }\n\n    if (statusType === 'loading') {\n      return <InternalStatusIndicator type=\"loading\">{loadingText}</InternalStatusIndicator>;\n    }\n\n    if (isNoMatch) {\n      return <div className={styles.empty}>{noMatch}</div>;\n    }\n\n    if (isEmpty) {\n      return <div className={styles.empty}>{empty}</div>;\n    }\n  }, [statusType, onRecoveryClick, isEmpty, isNoMatch, recoveryText, loadingText, errorText, empty, noMatch]);\n\n  return (\n    <div className={styles.root} aria-live=\"polite\" aria-atomic=\"true\">\n      {!showChart && statusContainer}\n    </div>\n  );\n}\n"]}

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

@@ -1,4 +1,4 @@
-import { __assign, __rest } from "tslib";
+import { __rest } from "tslib";
 // Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
 // SPDX-License-Identifier: Apache-2.0
 import clsx from 'clsx';
@@ -7,14 +7,14 @@ import { getBaseProps } from '../../base-component';
 import { useVisualRefresh } from '../../hooks/use-visual-mode';
 import styles from './styles.css.js';
 // Can't use css variables for svg attributes
-export var dimensionsByTheme = {
-    "default": {
+export const dimensionsByTheme = {
+    default: {
         viewBox: '0 0 14 14',
         indeterminate: '2.5,7 11.5,7',
         checked: '2.5,7 6,10 11,3',
         xy: 0.5,
         r: 1.5,
-        size: 13
+        size: 13,
     },
     refresh: {
         viewBox: '0 0 16 16',
@@ -22,22 +22,21 @@ export var dimensionsByTheme = {
         checked: '3.5,8 7,11 12,4',
         xy: 1,
         r: 2,
-        size: 14
-    }
+        size: 14,
+    },
 };
-var CheckboxIcon = function (_a) {
-    var _b, _c;
-    var checked = _a.checked, indeterminate = _a.indeterminate, _d = _a.disabled, disabled = _d === void 0 ? false : _d, restProps = __rest(_a, ["checked", "indeterminate", "disabled"]);
-    var baseProps = getBaseProps(restProps);
-    var theme = useVisualRefresh() ? 'refresh' : 'default';
-    var dimensions = dimensionsByTheme[theme];
-    return (React.createElement("svg", __assign({ className: styles.root, viewBox: dimensions.viewBox, "aria-hidden": "true", focusable: "false" }, baseProps),
-        React.createElement("rect", { className: clsx(styles['styled-box'], (_b = {},
-                _b[styles['styled-box-checked']] = checked,
-                _b[styles['styled-box-indeterminate']] = indeterminate,
-                _b[styles['styled-box-disabled']] = disabled,
-                _b)), x: dimensions.xy, y: dimensions.xy, rx: dimensions.r, ry: dimensions.r, width: dimensions.size, height: dimensions.size }),
-        checked || indeterminate ? (React.createElement("polyline", { className: clsx(styles['styled-line'], (_c = {}, _c[styles['styled-line-disabled']] = disabled, _c)), points: indeterminate ? dimensions.indeterminate : dimensions.checked })) : null));
+const CheckboxIcon = (_a) => {
+    var { checked, indeterminate, disabled = false } = _a, restProps = __rest(_a, ["checked", "indeterminate", "disabled"]);
+    const baseProps = getBaseProps(restProps);
+    const theme = useVisualRefresh() ? 'refresh' : 'default';
+    const dimensions = dimensionsByTheme[theme];
+    return (React.createElement("svg", Object.assign({ className: styles.root, viewBox: dimensions.viewBox, "aria-hidden": "true", focusable: "false" }, baseProps),
+        React.createElement("rect", { className: clsx(styles['styled-box'], {
+                [styles['styled-box-checked']]: checked,
+                [styles['styled-box-indeterminate']]: indeterminate,
+                [styles['styled-box-disabled']]: disabled,
+            }), x: dimensions.xy, y: dimensions.xy, rx: dimensions.r, ry: dimensions.r, width: dimensions.size, height: dimensions.size }),
+        checked || indeterminate ? (React.createElement("polyline", { className: clsx(styles['styled-line'], { [styles['styled-line-disabled']]: disabled }), points: indeterminate ? dimensions.indeterminate : dimensions.checked })) : null));
 };
 export default CheckboxIcon;
 //# sourceMappingURL=index.js.map

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"]}