npm - @cloudscape-design/components-themeable - Versions diffs - 3.0.332 → 3.0.334 - Mend

@cloudscape-design/components-themeable 3.0.332 → 3.0.334

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (111) hide show

package/lib/internal/template/popover/internal.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"internal.js","sourceRoot":"lib/default/","sources":["popover/internal.tsx"],"names":[],"mappings":"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","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React, { useCallback, useEffect, useRef, useState, useImperativeHandle } from 'react';\nimport clsx from 'clsx';\n\nimport { KeyCode } from '../internal/keycode';\nimport { getBaseProps } from '../internal/base-component';\nimport { FormFieldContext } from '../internal/context/form-field-context';\n\nimport Arrow from './arrow';\nimport Portal from '../internal/components/portal';\nimport { PopoverProps } from './interfaces';\nimport PopoverContainer from './container';\nimport PopoverBody from './body';\n\nimport styles from './styles.css.js';\nimport { NonCancelableEventHandler, fireNonCancelableEvent } from '../internal/events/index';\nimport { InternalBaseComponentProps } from '../internal/hooks/use-base-component';\nimport { useMergeRefs } from '../internal/hooks/use-merge-refs';\nimport { usePortalModeClasses } from '../internal/hooks/use-portal-mode-classes';\nimport { useInternalI18n } from '../internal/i18n/context';\n\nexport interface InternalPopoverProps extends PopoverProps, InternalBaseComponentProps {\n __onOpen?: NonCancelableEventHandler<null>;\n}\n\nexport interface InternalPopoverRef {\n dismissPopover: () => void;\n}\n\nexport default React.forwardRef(InternalPopover);\n\nfunction InternalPopover(\n {\n position = 'right',\n size = 'medium',\n fixedWidth = false,\n triggerType = 'text',\n dismissButton = true,\n\n children,\n header,\n content,\n\n renderWithPortal = false,\n\n __onOpen,\n __internalRootRef = null,\n ...restProps\n }: InternalPopoverProps,\n ref: React.Ref<InternalPopoverRef>\n) {\n const baseProps = getBaseProps(restProps);\n const triggerRef = useRef<HTMLElement \| null>(null);\n const popoverRef = useRef<HTMLDivElement \| null>(null);\n const clickFrameId = useRef<number \| null>(null);\n\n const i18n = useInternalI18n('popover');\n const dismissAriaLabel = i18n('dismissAriaLabel', restProps.dismissAriaLabel);\n\n const [visible, setVisible] = useState(false);\n\n const focusTrigger = useCallback(() => {\n triggerRef.current?.focus();\n }, []);\n\n const onTriggerClick = useCallback(() => {\n fireNonCancelableEvent(__onOpen);\n setVisible(true);\n }, [__onOpen]);\n\n const onDismiss = useCallback(() => {\n setVisible(false);\n focusTrigger();\n }, [focusTrigger]);\n\n const onTriggerKeyDown = useCallback((event: React.KeyboardEvent) => {\n if (event.keyCode === KeyCode.tab \|\| event.keyCode === KeyCode.escape) {\n setVisible(false);\n }\n }, []);\n\n useImperativeHandle(ref, () => ({\n dismissPopover: onDismiss,\n }));\n\n useEffect(() => {\n if (!triggerRef.current) {\n return;\n }\n const document = triggerRef.current.ownerDocument;\n\n const onDocumentClick = () => {\n // Dismiss popover unless there was a click inside within the last animation frame.\n if (clickFrameId.current === null) {\n setVisible(false);\n }\n };\n\n // useCapture=false makes sure this listener is called after the one attached to the element.\n // the options.capture notation is unsupported by IE.\n document.addEventListener('mousedown', onDocumentClick, false);\n\n return () => {\n document.removeEventListener('mousedown', onDocumentClick, false);\n };\n }, []);\n\n const popoverClasses = usePortalModeClasses(triggerRef);\n\n const triggerProps = {\n // https://github.com/microsoft/TypeScript/issues/36659\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n ref: triggerRef as any,\n onClick: onTriggerClick,\n onKeyDown: onTriggerKeyDown,\n className: clsx(styles.trigger, styles[`trigger-type-${triggerType}`]),\n };\n\n const popoverContent = (\n <div\n aria-live={dismissButton ? undefined : 'polite'}\n aria-atomic={dismissButton ? undefined : true}\n className={clsx(popoverClasses, styles['popover-content'])}\n >\n {visible && (\n <PopoverContainer\n size={size}\n fixedWidth={fixedWidth}\n position={position}\n trackRef={triggerRef}\n arrow={position => <Arrow position={position} />}\n renderWithPortal={renderWithPortal}\n zIndex={renderWithPortal ? 7000 : undefined}\n >\n <PopoverBody\n dismissButton={dismissButton}\n dismissAriaLabel={dismissAriaLabel}\n header={header}\n onDismiss={onDismiss}\n overflowVisible=\"both\"\n >\n {content}\n </PopoverBody>\n </PopoverContainer>\n )}\n </div>\n );\n\n const mergedRef = useMergeRefs(popoverRef, __internalRootRef);\n\n return (\n <span\n {...baseProps}\n className={clsx(styles.root, baseProps.className)}\n ref={mergedRef}\n onMouseDown={() => {\n // Indicate there was a click inside popover recently, including nested portals.\n clickFrameId.current = requestAnimationFrame(() => {\n clickFrameId.current = null;\n });\n }}\n >\n {triggerType === 'text' ? (\n <button {...triggerProps} type=\"button\" aria-haspopup=\"dialog\">\n <span className={styles['trigger-inner-text']}>{children}</span>\n </button>\n ) : (\n <span {...triggerProps}>{children}</span>\n )}\n <FormFieldContext.Provider value={{}}>\n {renderWithPortal ? <Portal>{popoverContent}</Portal> : popoverContent}\n </FormFieldContext.Provider>\n </span>\n );\n}\n"]}
1	+ {"version":3,"file":"internal.js","sourceRoot":"lib/default/","sources":["popover/internal.tsx"],"names":[],"mappings":"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","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React, { useCallback, useEffect, useRef, useState, useImperativeHandle } from 'react';\nimport clsx from 'clsx';\n\nimport { KeyCode } from '../internal/keycode';\nimport { getBaseProps } from '../internal/base-component';\nimport { FormFieldContext } from '../internal/context/form-field-context';\n\nimport Arrow from './arrow';\nimport Portal from '../internal/components/portal';\nimport { PopoverProps } from './interfaces';\nimport PopoverContainer from './container';\nimport PopoverBody from './body';\n\nimport styles from './styles.css.js';\nimport { NonCancelableEventHandler, fireNonCancelableEvent } from '../internal/events/index';\nimport { InternalBaseComponentProps } from '../internal/hooks/use-base-component';\nimport { useMergeRefs } from '../internal/hooks/use-merge-refs';\nimport { usePortalModeClasses } from '../internal/hooks/use-portal-mode-classes';\nimport { useInternalI18n } from '../internal/i18n/context';\nimport { useUniqueId } from '../internal/hooks/use-unique-id';\n\nexport interface InternalPopoverProps extends PopoverProps, InternalBaseComponentProps {\n __onOpen?: NonCancelableEventHandler<null>;\n}\n\nexport interface InternalPopoverRef {\n dismissPopover: () => void;\n}\n\nexport default React.forwardRef(InternalPopover);\n\nfunction InternalPopover(\n {\n position = 'right',\n size = 'medium',\n fixedWidth = false,\n triggerType = 'text',\n dismissButton = true,\n\n children,\n header,\n content,\n\n renderWithPortal = false,\n\n __onOpen,\n __internalRootRef = null,\n ...restProps\n }: InternalPopoverProps,\n ref: React.Ref<InternalPopoverRef>\n) {\n const baseProps = getBaseProps(restProps);\n const triggerRef = useRef<HTMLElement \| null>(null);\n const popoverRef = useRef<HTMLDivElement \| null>(null);\n const clickFrameId = useRef<number \| null>(null);\n\n const i18n = useInternalI18n('popover');\n const dismissAriaLabel = i18n('dismissAriaLabel', restProps.dismissAriaLabel);\n\n const [visible, setVisible] = useState(false);\n\n const focusTrigger = useCallback(() => {\n triggerRef.current?.focus();\n }, []);\n\n const onTriggerClick = useCallback(() => {\n fireNonCancelableEvent(__onOpen);\n setVisible(true);\n }, [__onOpen]);\n\n const onDismiss = useCallback(() => {\n setVisible(false);\n focusTrigger();\n }, [focusTrigger]);\n\n const onTriggerKeyDown = useCallback((event: React.KeyboardEvent) => {\n if (event.keyCode === KeyCode.tab \|\| event.keyCode === KeyCode.escape) {\n setVisible(false);\n }\n }, []);\n\n useImperativeHandle(ref, () => ({\n dismissPopover: onDismiss,\n }));\n\n useEffect(() => {\n if (!triggerRef.current) {\n return;\n }\n const document = triggerRef.current.ownerDocument;\n\n const onDocumentClick = () => {\n // Dismiss popover unless there was a click inside within the last animation frame.\n if (clickFrameId.current === null) {\n setVisible(false);\n }\n };\n\n // useCapture=false makes sure this listener is called after the one attached to the element.\n // the options.capture notation is unsupported by IE.\n document.addEventListener('mousedown', onDocumentClick, false);\n\n return () => {\n document.removeEventListener('mousedown', onDocumentClick, false);\n };\n }, []);\n\n const popoverClasses = usePortalModeClasses(triggerRef);\n\n const triggerProps = {\n // https://github.com/microsoft/TypeScript/issues/36659\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n ref: triggerRef as any,\n onClick: onTriggerClick,\n onKeyDown: onTriggerKeyDown,\n className: clsx(styles.trigger, styles[`trigger-type-${triggerType}`]),\n };\n\n const referrerId = useUniqueId();\n const popoverContent = (\n <div\n aria-live={dismissButton ? undefined : 'polite'}\n aria-atomic={dismissButton ? undefined : true}\n className={clsx(popoverClasses, styles['popover-content'])}\n data-awsui-referrer-id={referrerId}\n >\n {visible && (\n <PopoverContainer\n size={size}\n fixedWidth={fixedWidth}\n position={position}\n trackRef={triggerRef}\n arrow={position => <Arrow position={position} />}\n renderWithPortal={renderWithPortal}\n zIndex={renderWithPortal ? 7000 : undefined}\n >\n <PopoverBody\n dismissButton={dismissButton}\n dismissAriaLabel={dismissAriaLabel}\n header={header}\n onDismiss={onDismiss}\n overflowVisible=\"both\"\n >\n {content}\n </PopoverBody>\n </PopoverContainer>\n )}\n </div>\n );\n\n const mergedRef = useMergeRefs(popoverRef, __internalRootRef);\n\n return (\n <span\n {...baseProps}\n className={clsx(styles.root, baseProps.className)}\n ref={mergedRef}\n onMouseDown={() => {\n // Indicate there was a click inside popover recently, including nested portals.\n clickFrameId.current = requestAnimationFrame(() => {\n clickFrameId.current = null;\n });\n }}\n >\n {triggerType === 'text' ? (\n <button {...triggerProps} type=\"button\" aria-haspopup=\"dialog\" id={referrerId}>\n <span className={styles['trigger-inner-text']}>{children}</span>\n </button>\n ) : (\n <span {...triggerProps} id={referrerId}>\n {children}\n </span>\n )}\n <FormFieldContext.Provider value={{}}>\n {renderWithPortal ? <Portal>{popoverContent}</Portal> : popoverContent}\n </FormFieldContext.Provider>\n </span>\n );\n}\n"]}

package/lib/internal/template/segmented-control/styles.css.js CHANGED Viewed

@@ -1,19 +1,19 @@
     import './styles.scoped.css';
     export default {
-  "segment": "awsui_segment_8cbea_1qk2d_97",
-  "disabled": "awsui_disabled_8cbea_1qk2d_166",
-  "selected": "awsui_selected_8cbea_1qk2d_174",
-  "icon": "awsui_icon_8cbea_1qk2d_195",
-  "with-text": "awsui_with-text_8cbea_1qk2d_199",
-  "with-no-text": "awsui_with-no-text_8cbea_1qk2d_205",
-  "root": "awsui_root_8cbea_1qk2d_216",
-  "segment-part": "awsui_segment-part_8cbea_1qk2d_229",
-  "select": "awsui_select_8cbea_1qk2d_174",
-  "segment-count-2": "awsui_segment-count-2_8cbea_1qk2d_248",
-  "segment-count-3": "awsui_segment-count-3_8cbea_1qk2d_253",
-  "segment-count-4": "awsui_segment-count-4_8cbea_1qk2d_258",
-  "segment-count-5": "awsui_segment-count-5_8cbea_1qk2d_263",
-  "segment-count-6": "awsui_segment-count-6_8cbea_1qk2d_268"
+  "segment": "awsui_segment_8cbea_1ybg3_97",
+  "disabled": "awsui_disabled_8cbea_1ybg3_166",
+  "selected": "awsui_selected_8cbea_1ybg3_174",
+  "icon": "awsui_icon_8cbea_1ybg3_195",
+  "with-text": "awsui_with-text_8cbea_1ybg3_199",
+  "with-no-text": "awsui_with-no-text_8cbea_1ybg3_205",
+  "root": "awsui_root_8cbea_1ybg3_216",
+  "segment-part": "awsui_segment-part_8cbea_1ybg3_229",
+  "select": "awsui_select_8cbea_1ybg3_174",
+  "segment-count-2": "awsui_segment-count-2_8cbea_1ybg3_248",
+  "segment-count-3": "awsui_segment-count-3_8cbea_1ybg3_253",
+  "segment-count-4": "awsui_segment-count-4_8cbea_1ybg3_258",
+  "segment-count-5": "awsui_segment-count-5_8cbea_1ybg3_263",
+  "segment-count-6": "awsui_segment-count-6_8cbea_1ybg3_268"
 };

package/lib/internal/template/segmented-control/styles.scoped.css CHANGED Viewed

@@ -94,7 +94,7 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
  Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
  SPDX-License-Identifier: Apache-2.0
 */
-.awsui_segment_8cbea_1qk2d_97:not(#\9) {
+.awsui_segment_8cbea_1ybg3_97:not(#\9) {
   font-size: var(--font-body-m-size-0qqejn, 14px);
   line-height: var(--font-body-m-line-height-9vkzhc, 22px);
   word-wrap: break-word;
@@ -111,98 +111,98 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
   color: var(--color-text-segment-default-vxoghx, #545b64);
   overflow: visible;
 }
-.awsui_segment_8cbea_1qk2d_97:not(#\9):focus {
+.awsui_segment_8cbea_1ybg3_97:not(#\9):focus {
   outline: none;
 }
-.awsui_segment_8cbea_1qk2d_97:not(#\9):nth-child(1) {
+.awsui_segment_8cbea_1ybg3_97:not(#\9):nth-child(1) {
   grid-column: 1;
   -ms-grid-column: 1;
 }
-.awsui_segment_8cbea_1qk2d_97:not(#\9):nth-child(2) {
+.awsui_segment_8cbea_1ybg3_97:not(#\9):nth-child(2) {
   grid-column: 2;
   -ms-grid-column: 2;
 }
-.awsui_segment_8cbea_1qk2d_97:not(#\9):nth-child(3) {
+.awsui_segment_8cbea_1ybg3_97:not(#\9):nth-child(3) {
   grid-column: 3;
   -ms-grid-column: 3;
 }
-.awsui_segment_8cbea_1qk2d_97:not(#\9):nth-child(4) {
+.awsui_segment_8cbea_1ybg3_97:not(#\9):nth-child(4) {
   grid-column: 4;
   -ms-grid-column: 4;
 }
-.awsui_segment_8cbea_1qk2d_97:not(#\9):nth-child(5) {
+.awsui_segment_8cbea_1ybg3_97:not(#\9):nth-child(5) {
   grid-column: 5;
   -ms-grid-column: 5;
 }
-.awsui_segment_8cbea_1qk2d_97:not(#\9):nth-child(6) {
+.awsui_segment_8cbea_1ybg3_97:not(#\9):nth-child(6) {
   grid-column: 6;
   -ms-grid-column: 6;
 }
-body[data-awsui-focus-visible=true] .awsui_segment_8cbea_1qk2d_97:not(#\9):focus {
+body[data-awsui-focus-visible=true] .awsui_segment_8cbea_1ybg3_97:not(#\9):focus {
   position: relative;
 }
-body[data-awsui-focus-visible=true] .awsui_segment_8cbea_1qk2d_97:not(#\9):focus {
+body[data-awsui-focus-visible=true] .awsui_segment_8cbea_1ybg3_97:not(#\9):focus {
   outline: 2px dotted transparent;
-  outline-offset: calc(var(--space-segmented-control-focus-outline-gutter-vw40an, 0px) - 1px);
+  outline-offset: calc(var(--space-segmented-control-focus-outline-gutter-4e9yup, 3px) - 1px);
 }
-body[data-awsui-focus-visible=true] .awsui_segment_8cbea_1qk2d_97:not(#\9):focus::before {
+body[data-awsui-focus-visible=true] .awsui_segment_8cbea_1ybg3_97:not(#\9):focus::before {
   content: " ";
   display: block;
   position: absolute;
-  left: calc(-1 * var(--space-segmented-control-focus-outline-gutter-vw40an, 0px));
-  top: calc(-1 * var(--space-segmented-control-focus-outline-gutter-vw40an, 0px));
-  width: calc(100% + 2 * var(--space-segmented-control-focus-outline-gutter-vw40an, 0px));
-  height: calc(100% + 2 * var(--space-segmented-control-focus-outline-gutter-vw40an, 0px));
+  left: calc(-1 * var(--space-segmented-control-focus-outline-gutter-4e9yup, 3px));
+  top: calc(-1 * var(--space-segmented-control-focus-outline-gutter-4e9yup, 3px));
+  width: calc(100% + 2 * var(--space-segmented-control-focus-outline-gutter-4e9yup, 3px));
+  height: calc(100% + 2 * var(--space-segmented-control-focus-outline-gutter-4e9yup, 3px));
   border-radius: var(--border-radius-control-default-focus-ring-uu8qi4, 2px);
   box-shadow: 0 0 0 2px var(--color-border-item-focused-4clyb1, #0073bb);
 }
-.awsui_segment_8cbea_1qk2d_97:not(#\9):last-child {
+.awsui_segment_8cbea_1ybg3_97:not(#\9):last-child {
   border-right-width: var(--border-field-width-gmdyxy, 1px);
   border-radius: 0 var(--border-radius-button-auxdmc, 2px) var(--border-radius-button-auxdmc, 2px) 0;
 }
-.awsui_segment_8cbea_1qk2d_97:not(#\9):first-child {
+.awsui_segment_8cbea_1ybg3_97:not(#\9):first-child {
   border-radius: var(--border-radius-button-auxdmc, 2px) 0 0 var(--border-radius-button-auxdmc, 2px);
 }
-.awsui_segment_8cbea_1qk2d_97.awsui_disabled_8cbea_1qk2d_166:not(#\9) {
+.awsui_segment_8cbea_1ybg3_97.awsui_disabled_8cbea_1ybg3_166:not(#\9) {
   background: var(--color-background-segment-disabled-inuizc, #ffffff);
   border-color: var(--color-border-segment-disabled-ziyzhi, #d5dbdb);
   color: var(--color-text-interactive-disabled-48m1sz, #aab7b8);
 }
-.awsui_segment_8cbea_1qk2d_97:not(#\9):not(.awsui_disabled_8cbea_1qk2d_166) + .awsui_segment_8cbea_1qk2d_97.awsui_disabled_8cbea_1qk2d_166 {
+.awsui_segment_8cbea_1ybg3_97:not(#\9):not(.awsui_disabled_8cbea_1ybg3_166) + .awsui_segment_8cbea_1ybg3_97.awsui_disabled_8cbea_1ybg3_166 {
   border-left-color: var(--color-border-segment-default-wlnh48, #687078);
 }
-.awsui_segment_8cbea_1qk2d_97.awsui_selected_8cbea_1qk2d_174:not(#\9) {
+.awsui_segment_8cbea_1ybg3_97.awsui_selected_8cbea_1ybg3_174:not(#\9) {
   background: var(--color-background-segment-active-sn866x, #0073bb);
   border-color: var(--color-border-segment-active-8zm2yj, #16191f);
   color: var(--color-text-segment-active-lhvxxu, #ffffff);
 }
-.awsui_segment_8cbea_1qk2d_97.awsui_selected_8cbea_1qk2d_174 + .awsui_segment_8cbea_1qk2d_97:not(#\9), .awsui_segment_8cbea_1qk2d_97.awsui_selected_8cbea_1qk2d_174 + .awsui_segment_8cbea_1qk2d_97.awsui_disabled_8cbea_1qk2d_166:not(#\9) {
+.awsui_segment_8cbea_1ybg3_97.awsui_selected_8cbea_1ybg3_174 + .awsui_segment_8cbea_1ybg3_97:not(#\9), .awsui_segment_8cbea_1ybg3_97.awsui_selected_8cbea_1ybg3_174 + .awsui_segment_8cbea_1ybg3_97.awsui_disabled_8cbea_1ybg3_166:not(#\9) {
   border-left-color: var(--color-border-segment-active-8zm2yj, #16191f);
 }
-.awsui_segment_8cbea_1qk2d_97:not(#\9):hover:not(.awsui_selected_8cbea_1qk2d_174):not(.awsui_disabled_8cbea_1qk2d_166):not(:focus) {
+.awsui_segment_8cbea_1ybg3_97:not(#\9):hover:not(.awsui_selected_8cbea_1ybg3_174):not(.awsui_disabled_8cbea_1ybg3_166):not(:focus) {
   background: var(--color-background-segment-hover-dwy018, #ffffff);
   color: var(--color-text-segment-hover-fx0efi, #0073bb);
   border-color: var(--color-border-segment-hover-2zshg7, #16191f);
   cursor: pointer;
 }
-.awsui_segment_8cbea_1qk2d_97:not(#\9):hover:not(.awsui_selected_8cbea_1qk2d_174):not(.awsui_disabled_8cbea_1qk2d_166):not(:focus) + .awsui_segment_8cbea_1qk2d_97:not(.awsui_selected_8cbea_1qk2d_174) {
+.awsui_segment_8cbea_1ybg3_97:not(#\9):hover:not(.awsui_selected_8cbea_1ybg3_174):not(.awsui_disabled_8cbea_1ybg3_166):not(:focus) + .awsui_segment_8cbea_1ybg3_97:not(.awsui_selected_8cbea_1ybg3_174) {
   border-left-color: var(--color-border-segment-hover-2zshg7, #16191f);
 }
-.awsui_segment_8cbea_1qk2d_97.awsui_selected_8cbea_1qk2d_174 + .awsui_segment_8cbea_1qk2d_97:not(#\9):hover:not(.awsui_selected_8cbea_1qk2d_174):not(.awsui_disabled_8cbea_1qk2d_166):not(:focus) {
+.awsui_segment_8cbea_1ybg3_97.awsui_selected_8cbea_1ybg3_174 + .awsui_segment_8cbea_1ybg3_97:not(#\9):hover:not(.awsui_selected_8cbea_1ybg3_174):not(.awsui_disabled_8cbea_1ybg3_166):not(:focus) {
   border-left-color: var(--color-border-segment-active-8zm2yj, #16191f);
 }
-.awsui_icon_8cbea_1qk2d_195:not(#\9) {
+.awsui_icon_8cbea_1ybg3_195:not(#\9) {
   /* used in test-utils */
 }
-.awsui_with-text_8cbea_1qk2d_199:not(#\9) {
+.awsui_with-text_8cbea_1ybg3_199:not(#\9) {
   position: relative;
   left: calc(-1 * var(--space-xxs-xx079q, 4px));
   margin-right: var(--space-xxs-xx079q, 4px);
 }
-.awsui_with-no-text_8cbea_1qk2d_205:not(#\9) {
+.awsui_with-no-text_8cbea_1ybg3_205:not(#\9) {
   margin-right: auto;
   margin-left: auto;
   right: 0;
@@ -213,7 +213,7 @@ body[data-awsui-focus-visible=true] .awsui_segment_8cbea_1qk2d_97:not(#\9):focus
  Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
  SPDX-License-Identifier: Apache-2.0
 */
-.awsui_root_8cbea_1qk2d_216:not(#\9) {
+.awsui_root_8cbea_1ybg3_216:not(#\9) {
   /* stylelint-disable-next-line plugin/no-unsupported-browser-features */
   border-collapse: separate;
   border-spacing: 0;
@@ -252,40 +252,40 @@ body[data-awsui-focus-visible=true] .awsui_segment_8cbea_1qk2d_97:not(#\9):focus
   -moz-osx-font-smoothing: auto;
 }
-.awsui_segment-part_8cbea_1qk2d_229:not(#\9) {
+.awsui_segment-part_8cbea_1ybg3_229:not(#\9) {
   display: inline-grid;
 }
 @media (max-width: 688px) {
-  .awsui_segment-part_8cbea_1qk2d_229:not(#\9) {
+  .awsui_segment-part_8cbea_1ybg3_229:not(#\9) {
     display: none;
   }
 }
-.awsui_select_8cbea_1qk2d_174:not(#\9) {
+.awsui_select_8cbea_1ybg3_174:not(#\9) {
   display: none;
 }
 @media (max-width: 688px) {
-  .awsui_select_8cbea_1qk2d_174:not(#\9) {
+  .awsui_select_8cbea_1ybg3_174:not(#\9) {
     display: block;
   }
 }
-.awsui_segment-count-2_8cbea_1qk2d_248:not(#\9) {
+.awsui_segment-count-2_8cbea_1ybg3_248:not(#\9) {
   grid-template-columns: 1fr 1fr;
 }
-.awsui_segment-count-3_8cbea_1qk2d_253:not(#\9) {
+.awsui_segment-count-3_8cbea_1ybg3_253:not(#\9) {
   grid-template-columns: 1fr 1fr 1fr;
 }
-.awsui_segment-count-4_8cbea_1qk2d_258:not(#\9) {
+.awsui_segment-count-4_8cbea_1ybg3_258:not(#\9) {
   grid-template-columns: 1fr 1fr 1fr 1fr;
 }
-.awsui_segment-count-5_8cbea_1qk2d_263:not(#\9) {
+.awsui_segment-count-5_8cbea_1ybg3_263:not(#\9) {
   grid-template-columns: 1fr 1fr 1fr 1fr 1fr;
 }
-.awsui_segment-count-6_8cbea_1qk2d_268:not(#\9) {
+.awsui_segment-count-6_8cbea_1ybg3_268:not(#\9) {
   grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr;
 }

package/lib/internal/template/segmented-control/styles.selectors.js CHANGED Viewed

@@ -2,19 +2,19 @@
     // es-module interop with Babel and Typescript
     Object.defineProperty(exports, "__esModule", { value: true });
     module.exports.default = {
-  "segment": "awsui_segment_8cbea_1qk2d_97",
-  "disabled": "awsui_disabled_8cbea_1qk2d_166",
-  "selected": "awsui_selected_8cbea_1qk2d_174",
-  "icon": "awsui_icon_8cbea_1qk2d_195",
-  "with-text": "awsui_with-text_8cbea_1qk2d_199",
-  "with-no-text": "awsui_with-no-text_8cbea_1qk2d_205",
-  "root": "awsui_root_8cbea_1qk2d_216",
-  "segment-part": "awsui_segment-part_8cbea_1qk2d_229",
-  "select": "awsui_select_8cbea_1qk2d_174",
-  "segment-count-2": "awsui_segment-count-2_8cbea_1qk2d_248",
-  "segment-count-3": "awsui_segment-count-3_8cbea_1qk2d_253",
-  "segment-count-4": "awsui_segment-count-4_8cbea_1qk2d_258",
-  "segment-count-5": "awsui_segment-count-5_8cbea_1qk2d_263",
-  "segment-count-6": "awsui_segment-count-6_8cbea_1qk2d_268"
+  "segment": "awsui_segment_8cbea_1ybg3_97",
+  "disabled": "awsui_disabled_8cbea_1ybg3_166",
+  "selected": "awsui_selected_8cbea_1ybg3_174",
+  "icon": "awsui_icon_8cbea_1ybg3_195",
+  "with-text": "awsui_with-text_8cbea_1ybg3_199",
+  "with-no-text": "awsui_with-no-text_8cbea_1ybg3_205",
+  "root": "awsui_root_8cbea_1ybg3_216",
+  "segment-part": "awsui_segment-part_8cbea_1ybg3_229",
+  "select": "awsui_select_8cbea_1ybg3_174",
+  "segment-count-2": "awsui_segment-count-2_8cbea_1ybg3_248",
+  "segment-count-3": "awsui_segment-count-3_8cbea_1ybg3_253",
+  "segment-count-4": "awsui_segment-count-4_8cbea_1ybg3_258",
+  "segment-count-5": "awsui_segment-count-5_8cbea_1ybg3_263",
+  "segment-count-6": "awsui_segment-count-6_8cbea_1ybg3_268"
 };

package/lib/internal/template/table/body-cell/click-away.d.ts CHANGED Viewed

@@ -1,9 +1,3 @@
-import React from 'react';
-export declare function useClickAway(onClick: () => void): React.MutableRefObject<any>;
-interface ClickAwayActive {
-    onClick: () => void;
-    children: React.ReactNode;
-}
-export declare function ClickAway({ onClick, children }: ClickAwayActive): JSX.Element;
-export {};
+/// <reference types="react" />
+export declare function useClickAway(onClick: () => void): import("react").MutableRefObject<any>;
 //# sourceMappingURL=click-away.d.ts.map

package/lib/internal/template/table/body-cell/click-away.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"click-away.d.ts","sourceRoot":"lib/default/","sources":["table/body-cell/click-away.tsx"],"names":[],"mappings":"~~AAEA,OAAO,KAA4B,MAAM,OAAO,CAAC~~;~~AAIjD~~,wBAAgB,YAAY,CAAC,OAAO,EAAE,MAAM,IAAI~~,+BAgB~~/C~~;AAED,UAAU,eAAe;IACvB,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;CAC3B;AACD,wBAAgB,SAAS,CAAC,EAAE,OAAO,EAAE,QAAQ,EAAE,EAAE,eAAe,eAa/D~~"}
1	+ {"version":3,"file":"click-away.d.ts","sourceRoot":"lib/default/","sources":["table/body-cell/click-away.tsx"],"names":[],"mappings":";AAMA,wBAAgB,YAAY,CAAC,OAAO,EAAE,MAAM,IAAI,yCAgB/C"}

package/lib/internal/template/table/body-cell/click-away.js CHANGED Viewed

@@ -1,14 +1,14 @@
 // Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
 // SPDX-License-Identifier: Apache-2.0
-import React, { useEffect, useRef } from 'react';
-import { containsOrEqual } from '../../internal/utils/dom';
+import { useEffect, useRef } from 'react';
 import { useStableEventHandler } from '../../internal/hooks/use-stable-event-handler';
+import { nodeBelongs } from '../../internal/utils/node-belongs';
 export function useClickAway(onClick) {
     const awayRef = useRef(null);
     const onClickStable = useStableEventHandler(onClick);
     useEffect(() => {
         function handleClick(event) {
-            if (!containsOrEqual(awayRef.current, event.target)) {
+            if (!nodeBelongs(awayRef.current, event.target)) {
                 onClickStable();
             }
         }
@@ -20,18 +20,4 @@ export function useClickAway(onClick) {
     }, [onClickStable]);
     return awayRef;
 }
-export function ClickAway({ onClick, children }) {
-    const onClickStable = useStableEventHandler(onClick);
-    const ref = useRef(null);
-    useEffect(() => {
-        function handleClick(event) {
-            if (!containsOrEqual(ref.current, event.target)) {
-                onClickStable();
-            }
-        }
-        document.addEventListener('click', handleClick, true);
-        return () => document.removeEventListener('click', handleClick, true);
-    }, [onClickStable]);
-    return React.createElement("span", { ref: ref }, children);
-}
 //# sourceMappingURL=click-away.js.map

package/lib/internal/template/table/body-cell/click-away.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"click-away.js","sourceRoot":"lib/default/","sources":["table/body-cell/click-away.tsx"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,~~KAAK,~~EAAE,~~EAAE,~~SAAS,EAAE,MAAM,EAAE,MAAM,OAAO,CAAC;~~AACjD~~,OAAO,EAAE,~~eAAe~~,EAAE,MAAM,~~0BAA0B,~~CAAC;~~AAC3D~~,OAAO,EAAE,~~qBAAqB~~,EAAE,MAAM~~,+CAA+C~~,CAAC;~~AAEtF~~,MAAM,UAAU,YAAY,CAAC,OAAmB;IAC9C,MAAM,OAAO,GAAG,MAAM,CAAM,IAAI,CAAC,CAAC;IAClC,MAAM,aAAa,GAAG,qBAAqB,CAAC,OAAO,CAAC,CAAC;IACrD,SAAS,CAAC,GAAG,EAAE;QACb,SAAS,WAAW,CAAC,KAAY;YAC/B,IAAI,CAAC,~~eAAe~~,CAAC,OAAO,CAAC,OAAO,EAAE,KAAK,CAAC,~~MAAc~~,CAAC,EAAE;~~gBAC3D~~,aAAa,EAAE,CAAC;aACjB;QACH,CAAC;QACD,4EAA4E;QAC5E,yEAAyE;QACzE,sDAAsD;QACtD,QAAQ,CAAC,gBAAgB,CAAC,OAAO,EAAE,WAAW,EAAE,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC,CAAC;QACnE,OAAO,GAAG,EAAE,CAAC,QAAQ,CAAC,mBAAmB,CAAC,OAAO,EAAE,WAAW,EAAE,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC,CAAC;IACrF,CAAC,EAAE,CAAC,aAAa,CAAC,CAAC,CAAC;IACpB,OAAO,OAAO,CAAC;AACjB,CAAC;AAMD,MAAM,UAAU,SAAS,CAAC,EAAE,OAAO,EAAE,QAAQ,EAAmB;IAC9D,MAAM,aAAa,GAAG,qBAAqB,CAAC,OAAO,CAAC,CAAC;IACrD,MAAM,GAAG,GAAG,MAAM,CAAkB,IAAI,CAAC,CAAC;IAC1C,SAAS,CAAC,GAAG,EAAE;QACb,SAAS,WAAW,CAAC,KAAY;YAC/B,IAAI,CAAC,eAAe,CAAC,GAAG,CAAC,OAAO,EAAE,KAAK,CAAC,MAAc,CAAC,EAAE;gBACvD,aAAa,EAAE,CAAC;aACjB;QACH,CAAC;QACD,QAAQ,CAAC,gBAAgB,CAAC,OAAO,EAAE,WAAW,EAAE,IAAI,CAAC,CAAC;QACtD,OAAO,GAAG,EAAE,CAAC,QAAQ,CAAC,mBAAmB,CAAC,OAAO,EAAE,WAAW,EAAE,IAAI,CAAC,CAAC;IACxE,CAAC,EAAE,CAAC,aAAa,CAAC,CAAC,CAAC;IACpB,OAAO,8BAAM,GAAG,EAAE,GAAG,IAAG,QAAQ,CAAQ,CAAC;AAC3C,CAAC","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 { ~~containsOrEqual~~ } from '../../internal/~~utils~~/~~dom~~';\nimport { ~~useStableEventHandler~~ } from '../../internal/~~hooks~~/~~use~~-~~stable-event-handler~~';\n\nexport function useClickAway(onClick: () => void) {\n const awayRef = useRef<any>(null);\n const onClickStable = useStableEventHandler(onClick);\n useEffect(() => {\n function handleClick(event: Event) {\n if (!~~containsOrEqual~~(awayRef.current, event.target as ~~Node~~)) {\n onClickStable();\n }\n }\n // contains returns wrong result if the next render would remove the element\n // but capture phase happens before the render, so returns correct result\n // Ref: https://github.com/facebook/react/issues/20325\n document.addEventListener('click', handleClick, { capture: true });\n return () => document.removeEventListener('click', handleClick, { capture: true });\n }, [onClickStable]);\n return awayRef;\n}\n\ninterface ClickAwayActive {\n onClick: () => void;\n children: React.ReactNode;\n}\nexport function ClickAway({ onClick, children }: ClickAwayActive) {\n const onClickStable = useStableEventHandler(onClick);\n const ref = useRef<HTMLSpanElement>(null);\n useEffect(() => {\n function handleClick(event: Event) {\n if (!containsOrEqual(ref.current, event.target as Node)) {\n onClickStable();\n }\n }\n document.addEventListener('click', handleClick, true);\n return () => document.removeEventListener('click', handleClick, true);\n }, [onClickStable]);\n return <span ref={ref}>{children}</span>;\n}\n"]}
1	+ {"version":3,"file":"click-away.js","sourceRoot":"lib/default/","sources":["table/body-cell/click-away.tsx"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,EAAE,SAAS,EAAE,MAAM,EAAE,MAAM,OAAO,CAAC;AAC1C,OAAO,EAAE,qBAAqB,EAAE,MAAM,+CAA+C,CAAC;AACtF,OAAO,EAAE,WAAW,EAAE,MAAM,mCAAmC,CAAC;AAEhE,MAAM,UAAU,YAAY,CAAC,OAAmB;IAC9C,MAAM,OAAO,GAAG,MAAM,CAAM,IAAI,CAAC,CAAC;IAClC,MAAM,aAAa,GAAG,qBAAqB,CAAC,OAAO,CAAC,CAAC;IACrD,SAAS,CAAC,GAAG,EAAE;QACb,SAAS,WAAW,CAAC,KAAY;YAC/B,IAAI,CAAC,WAAW,CAAC,OAAO,CAAC,OAAO,EAAE,KAAK,CAAC,MAAqB,CAAC,EAAE;gBAC9D,aAAa,EAAE,CAAC;aACjB;QACH,CAAC;QACD,4EAA4E;QAC5E,yEAAyE;QACzE,sDAAsD;QACtD,QAAQ,CAAC,gBAAgB,CAAC,OAAO,EAAE,WAAW,EAAE,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC,CAAC;QACnE,OAAO,GAAG,EAAE,CAAC,QAAQ,CAAC,mBAAmB,CAAC,OAAO,EAAE,WAAW,EAAE,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC,CAAC;IACrF,CAAC,EAAE,CAAC,aAAa,CAAC,CAAC,CAAC;IACpB,OAAO,OAAO,CAAC;AACjB,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport { useEffect, useRef } from 'react';\nimport { useStableEventHandler } from '../../internal/hooks/use-stable-event-handler';\nimport { nodeBelongs } from '../../internal/utils/node-belongs';\n\nexport function useClickAway(onClick: () => void) {\n const awayRef = useRef<any>(null);\n const onClickStable = useStableEventHandler(onClick);\n useEffect(() => {\n function handleClick(event: Event) {\n if (!nodeBelongs(awayRef.current, event.target as HTMLElement)) {\n onClickStable();\n }\n }\n // contains returns wrong result if the next render would remove the element\n // but capture phase happens before the render, so returns correct result\n // Ref: https://github.com/facebook/react/issues/20325\n document.addEventListener('click', handleClick, { capture: true });\n return () => document.removeEventListener('click', handleClick, { capture: true });\n }, [onClickStable]);\n return awayRef;\n}\n"]}

package/lib/internal/template/table/header-cell/index.d.ts CHANGED Viewed

@@ -22,9 +22,10 @@ interface TableHeaderCellProps<ItemType> {
     isEditable?: boolean;
     columnId: PropertyKey;
     stickyState: StickyColumnsModel;
+    cellRef: React.RefCallback<HTMLElement>;
     focusedComponent?: InteractiveComponent | null;
     onFocusedComponentChange?: (element: InteractiveComponent | null) => void;
 }
-export declare function TableHeaderCell<ItemType>({ className, style, tabIndex, column, activeSortingColumn, sortingDescending, sortingDisabled, wrapLines, focusedComponent, onFocusedComponentChange, hidden, onClick, colIndex, updateColumn, resizableColumns, onResizeFinish, isEditable, columnId, stickyState, }: TableHeaderCellProps<ItemType>): JSX.Element;
+export declare function TableHeaderCell<ItemType>({ className, style, tabIndex, column, activeSortingColumn, sortingDescending, sortingDisabled, wrapLines, focusedComponent, onFocusedComponentChange, hidden, onClick, colIndex, updateColumn, resizableColumns, onResizeFinish, isEditable, columnId, stickyState, cellRef, }: TableHeaderCellProps<ItemType>): JSX.Element;
 export {};
 //# sourceMappingURL=index.d.ts.map

package/lib/internal/template/table/header-cell/index.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"index.d.ts","sourceRoot":"lib/default/","sources":["table/header-cell/index.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,MAAM,OAAO,CAAC;AAG1B,OAAO,EAAE,UAAU,EAAE,MAAM,eAAe,CAAC;AAK3C,OAAO,EAAE,oBAAoB,EAAE,MAAM,UAAU,CAAC;AAGhD,OAAO,EAAE,kBAAkB,EAAuB,MAAM,mBAAmB,CAAC;~~AAE5E~~,UAAU,oBAAoB,CAAC,QAAQ;IACrC,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,KAAK,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;IAC5B,QAAQ,EAAE,MAAM,CAAC;IACjB,MAAM,EAAE,UAAU,CAAC,gBAAgB,CAAC,QAAQ,CAAC,CAAC;IAC9C,mBAAmB,CAAC,EAAE,UAAU,CAAC,aAAa,CAAC,QAAQ,CAAC,CAAC;IACzD,iBAAiB,CAAC,EAAE,OAAO,CAAC;IAC5B,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,OAAO,CAAC,MAAM,EAAE,UAAU,CAAC,YAAY,CAAC,GAAG,CAAC,GAAG,IAAI,CAAC;IACpD,cAAc,EAAE,MAAM,IAAI,CAAC;IAC3B,QAAQ,EAAE,MAAM,CAAC;IACjB,YAAY,EAAE,CAAC,QAAQ,EAAE,WAAW,EAAE,QAAQ,EAAE,MAAM,KAAK,IAAI,CAAC;IAChE,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,MAAM,CAAC,EAAE,MAAM,IAAI,CAAC;IACpB,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,QAAQ,EAAE,WAAW,CAAC;IACtB,WAAW,EAAE,kBAAkB,CAAC;~~IAEhC~~,gBAAgB,CAAC,EAAE,oBAAoB,GAAG,IAAI,CAAC;IAC/C,wBAAwB,CAAC,EAAE,CAAC,OAAO,EAAE,oBAAoB,GAAG,IAAI,KAAK,IAAI,CAAC;CAC3E;AAED,wBAAgB,eAAe,CAAC,QAAQ,EAAE,EACxC,SAAS,EACT,KAAK,EACL,QAAQ,EACR,MAAM,EACN,mBAAmB,EACnB,iBAAiB,EACjB,eAAe,EACf,SAAS,EACT,gBAAgB,EAChB,wBAAwB,EACxB,MAAM,EACN,OAAO,EACP,QAAQ,EACR,YAAY,EACZ,gBAAgB,EAChB,cAAc,EACd,UAAU,EACV,QAAQ,EACR,WAAW,~~GACZ~~,EAAE,oBAAoB,CAAC,QAAQ,CAAC,~~eA4GhC~~"}
1	+ {"version":3,"file":"index.d.ts","sourceRoot":"lib/default/","sources":["table/header-cell/index.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,MAAM,OAAO,CAAC;AAG1B,OAAO,EAAE,UAAU,EAAE,MAAM,eAAe,CAAC;AAK3C,OAAO,EAAE,oBAAoB,EAAE,MAAM,UAAU,CAAC;AAGhD,OAAO,EAAE,kBAAkB,EAAuB,MAAM,mBAAmB,CAAC;AAG5E,UAAU,oBAAoB,CAAC,QAAQ;IACrC,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,KAAK,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;IAC5B,QAAQ,EAAE,MAAM,CAAC;IACjB,MAAM,EAAE,UAAU,CAAC,gBAAgB,CAAC,QAAQ,CAAC,CAAC;IAC9C,mBAAmB,CAAC,EAAE,UAAU,CAAC,aAAa,CAAC,QAAQ,CAAC,CAAC;IACzD,iBAAiB,CAAC,EAAE,OAAO,CAAC;IAC5B,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,OAAO,CAAC,MAAM,EAAE,UAAU,CAAC,YAAY,CAAC,GAAG,CAAC,GAAG,IAAI,CAAC;IACpD,cAAc,EAAE,MAAM,IAAI,CAAC;IAC3B,QAAQ,EAAE,MAAM,CAAC;IACjB,YAAY,EAAE,CAAC,QAAQ,EAAE,WAAW,EAAE,QAAQ,EAAE,MAAM,KAAK,IAAI,CAAC;IAChE,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,MAAM,CAAC,EAAE,MAAM,IAAI,CAAC;IACpB,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,QAAQ,EAAE,WAAW,CAAC;IACtB,WAAW,EAAE,kBAAkB,CAAC;IAChC,OAAO,EAAE,KAAK,CAAC,WAAW,CAAC,WAAW,CAAC,CAAC;IACxC,gBAAgB,CAAC,EAAE,oBAAoB,GAAG,IAAI,CAAC;IAC/C,wBAAwB,CAAC,EAAE,CAAC,OAAO,EAAE,oBAAoB,GAAG,IAAI,KAAK,IAAI,CAAC;CAC3E;AAED,wBAAgB,eAAe,CAAC,QAAQ,EAAE,EACxC,SAAS,EACT,KAAK,EACL,QAAQ,EACR,MAAM,EACN,mBAAmB,EACnB,iBAAiB,EACjB,eAAe,EACf,SAAS,EACT,gBAAgB,EAChB,wBAAwB,EACxB,MAAM,EACN,OAAO,EACP,QAAQ,EACR,YAAY,EACZ,gBAAgB,EAChB,cAAc,EACd,UAAU,EACV,QAAQ,EACR,WAAW,EACX,OAAO,GACR,EAAE,oBAAoB,CAAC,QAAQ,CAAC,eA8GhC"}

package/lib/internal/template/table/header-cell/index.js CHANGED Viewed

@@ -11,7 +11,8 @@ import { useUniqueId } from '../../internal/hooks/use-unique-id';
 import { getStickyClassNames } from '../utils';
 import { useInternalI18n } from '../../internal/i18n/context';
 import { useStickyCellStyles } from '../sticky-columns';
-export function TableHeaderCell({ className, style, tabIndex, column, activeSortingColumn, sortingDescending, sortingDisabled, wrapLines, focusedComponent, onFocusedComponentChange, hidden, onClick, colIndex, updateColumn, resizableColumns, onResizeFinish, isEditable, columnId, stickyState, }) {
+import { useMergeRefs } from '../../internal/hooks/use-merge-refs';
+export function TableHeaderCell({ className, style, tabIndex, column, activeSortingColumn, sortingDescending, sortingDisabled, wrapLines, focusedComponent, onFocusedComponentChange, hidden, onClick, colIndex, updateColumn, resizableColumns, onResizeFinish, isEditable, columnId, stickyState, cellRef, }) {
     var _a;
     const i18n = useInternalI18n('table');
     const sortable = !!column.sortingComparator || !!column.sortingField;
@@ -37,6 +38,7 @@ export function TableHeaderCell({ className, style, tabIndex, column, activeSort
         columnId,
         getClassName: props => getStickyClassNames(styles, props),
     });
+    const mergedRef = useMergeRefs(stickyStyles.ref, cellRef);
     return (React.createElement("th", { className: clsx(className, {
             [styles['header-cell-resizable']]: !!resizableColumns,
             [styles['header-cell-sortable']]: sortingStatus,
@@ -45,7 +47,7 @@ export function TableHeaderCell({ className, style, tabIndex, column, activeSort
             [styles['header-cell-ascending']]: sortingStatus === 'ascending',
             [styles['header-cell-descending']]: sortingStatus === 'descending',
             [styles['header-cell-hidden']]: hidden,
-        }, stickyStyles.className), "aria-sort": sortingStatus && getAriaSort(sortingStatus), style: Object.assign(Object.assign({}, style), stickyStyles.style), scope: "col", ref: stickyStyles.ref },
+        }, stickyStyles.className), "aria-sort": sortingStatus && getAriaSort(sortingStatus), style: Object.assign(Object.assign({}, style), stickyStyles.style), scope: "col", ref: mergedRef },
         React.createElement("div", Object.assign({ className: clsx(styles['header-cell-content'], {
                 [styles['header-cell-fake-focus']]: (focusedComponent === null || focusedComponent === void 0 ? void 0 : focusedComponent.type) === 'column' && focusedComponent.col === colIndex,
             }), "aria-label": column.ariaLabel

package/lib/internal/template/table/header-cell/index.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"index.js","sourceRoot":"lib/default/","sources":["table/header-cell/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 clsx from 'clsx';\nimport React from 'react';\nimport InternalIcon from '../../icon/internal';\nimport { KeyCode } from '../../internal/keycode';\nimport { TableProps } from '../interfaces';\nimport { getAriaSort, getSortingIconName, getSortingStatus, isSorted } from './utils';\nimport styles from './styles.css.js';\nimport { Resizer } from '../resizer';\nimport { useUniqueId } from '../../internal/hooks/use-unique-id';\nimport { InteractiveComponent } from '../thead';\nimport { getStickyClassNames } from '../utils';\nimport { useInternalI18n } from '../../internal/i18n/context';\nimport { StickyColumnsModel, useStickyCellStyles } from '../sticky-columns';\n\ninterface TableHeaderCellProps<ItemType> {\n className?: string;\n style?: React.CSSProperties;\n tabIndex: number;\n column: TableProps.ColumnDefinition<ItemType>;\n activeSortingColumn?: TableProps.SortingColumn<ItemType>;\n sortingDescending?: boolean;\n sortingDisabled?: boolean;\n wrapLines?: boolean;\n hidden?: boolean;\n onClick(detail: TableProps.SortingState<any>): void;\n onResizeFinish: () => void;\n colIndex: number;\n updateColumn: (columnId: PropertyKey, newWidth: number) => void;\n onFocus?: () => void;\n onBlur?: () => void;\n resizableColumns?: boolean;\n isEditable?: boolean;\n columnId: PropertyKey;\n stickyState: StickyColumnsModel;\n\n focusedComponent?: InteractiveComponent \| null;\n onFocusedComponentChange?: (element: InteractiveComponent \| null) => void;\n}\n\nexport function TableHeaderCell<ItemType>({\n className,\n style,\n tabIndex,\n column,\n activeSortingColumn,\n sortingDescending,\n sortingDisabled,\n wrapLines,\n focusedComponent,\n onFocusedComponentChange,\n hidden,\n onClick,\n colIndex,\n updateColumn,\n resizableColumns,\n onResizeFinish,\n isEditable,\n columnId,\n stickyState,\n}: TableHeaderCellProps<ItemType>) {\n const i18n = useInternalI18n('table');\n const sortable = !!column.sortingComparator \|\| !!column.sortingField;\n const sorted = !!activeSortingColumn && isSorted(column, activeSortingColumn);\n const sortingStatus = getSortingStatus(sortable, sorted, !!sortingDescending, !!sortingDisabled);\n const handleClick = () =>\n onClick({\n sortingColumn: column,\n isDescending: sorted ? !sortingDescending : false,\n });\n\n // Elements with role=\"button\" do not have the default behavior of <button>, where pressing\n // Enter or Space will trigger a click event. Therefore we need to add this ourselves.\n // The native <button> element cannot be used due to a misaligned implementation in Firefox:\n // https://bugzilla.mozilla.org/show_bug.cgi?id=843003\n const handleKeyPress = ({ nativeEvent: e }: React.KeyboardEvent) => {\n if (e.keyCode === KeyCode.enter \|\| e.keyCode === KeyCode.space) {\n e.preventDefault();\n handleClick();\n }\n };\n\n const headerId = useUniqueId('table-header-');\n\n const stickyStyles = useStickyCellStyles({\n stickyColumns: stickyState,\n columnId,\n getClassName: props => getStickyClassNames(styles, props),\n });\n\n return (\n <th\n className={clsx(\n className,\n {\n [styles['header-cell-resizable']]: !!resizableColumns,\n [styles['header-cell-sortable']]: sortingStatus,\n [styles['header-cell-sorted']]: sortingStatus === 'ascending' \|\| sortingStatus === 'descending',\n [styles['header-cell-disabled']]: sortingDisabled,\n [styles['header-cell-ascending']]: sortingStatus === 'ascending',\n [styles['header-cell-descending']]: sortingStatus === 'descending',\n [styles['header-cell-hidden']]: hidden,\n },\n stickyStyles.className\n )}\n aria-sort={sortingStatus && getAriaSort(sortingStatus)}\n style={{ ...style, ...stickyStyles.style }}\n scope=\"col\"\n ref={stickyStyles.ref}\n >\n <div\n className={clsx(styles['header-cell-content'], {\n [styles['header-cell-fake-focus']]: focusedComponent?.type === 'column' && focusedComponent.col === colIndex,\n })}\n aria-label={\n column.ariaLabel\n ? column.ariaLabel({\n sorted: sorted,\n descending: sorted && !!sortingDescending,\n disabled: !!sortingDisabled,\n })\n : undefined\n }\n {...(sortingStatus && !sortingDisabled\n ? {\n onKeyPress: handleKeyPress,\n tabIndex: tabIndex,\n role: 'button',\n onClick: handleClick,\n onFocus: () => onFocusedComponentChange?.({ type: 'column', col: colIndex }),\n onBlur: () => onFocusedComponentChange?.(null),\n }\n : {})}\n >\n <div className={clsx(styles['header-cell-text'], wrapLines && styles['header-cell-text-wrap'])} id={headerId}>\n {column.header}\n {isEditable ? (\n <span\n className={styles['edit-icon']}\n role=\"img\"\n aria-label={i18n('columnDefinitions.editConfig.editIconAriaLabel', column.editConfig?.editIconAriaLabel)}\n >\n <InternalIcon name=\"edit\" />\n </span>\n ) : null}\n </div>\n {sortingStatus && (\n <span className={styles['sorting-icon']}>\n <InternalIcon name={getSortingIconName(sortingStatus)} />\n </span>\n )}\n </div>\n {resizableColumns && (\n <>\n <Resizer\n tabIndex={tabIndex}\n showFocusRing={focusedComponent?.type === 'resizer' && focusedComponent.col === colIndex}\n onDragMove={newWidth => updateColumn(columnId, newWidth)}\n onFinish={onResizeFinish}\n ariaLabelledby={headerId}\n onFocus={() => onFocusedComponentChange?.({ type: 'resizer', col: colIndex })}\n onBlur={() => onFocusedComponentChange?.(null)}\n minWidth={typeof column.minWidth === 'string' ? parseInt(column.minWidth) : column.minWidth}\n />\n </>\n )}\n </th>\n );\n}\n"]}
1	+ {"version":3,"file":"index.js","sourceRoot":"lib/default/","sources":["table/header-cell/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 clsx from 'clsx';\nimport React from 'react';\nimport InternalIcon from '../../icon/internal';\nimport { KeyCode } from '../../internal/keycode';\nimport { TableProps } from '../interfaces';\nimport { getAriaSort, getSortingIconName, getSortingStatus, isSorted } from './utils';\nimport styles from './styles.css.js';\nimport { Resizer } from '../resizer';\nimport { useUniqueId } from '../../internal/hooks/use-unique-id';\nimport { InteractiveComponent } from '../thead';\nimport { getStickyClassNames } from '../utils';\nimport { useInternalI18n } from '../../internal/i18n/context';\nimport { StickyColumnsModel, useStickyCellStyles } from '../sticky-columns';\nimport { useMergeRefs } from '../../internal/hooks/use-merge-refs';\n\ninterface TableHeaderCellProps<ItemType> {\n className?: string;\n style?: React.CSSProperties;\n tabIndex: number;\n column: TableProps.ColumnDefinition<ItemType>;\n activeSortingColumn?: TableProps.SortingColumn<ItemType>;\n sortingDescending?: boolean;\n sortingDisabled?: boolean;\n wrapLines?: boolean;\n hidden?: boolean;\n onClick(detail: TableProps.SortingState<any>): void;\n onResizeFinish: () => void;\n colIndex: number;\n updateColumn: (columnId: PropertyKey, newWidth: number) => void;\n onFocus?: () => void;\n onBlur?: () => void;\n resizableColumns?: boolean;\n isEditable?: boolean;\n columnId: PropertyKey;\n stickyState: StickyColumnsModel;\n cellRef: React.RefCallback<HTMLElement>;\n focusedComponent?: InteractiveComponent \| null;\n onFocusedComponentChange?: (element: InteractiveComponent \| null) => void;\n}\n\nexport function TableHeaderCell<ItemType>({\n className,\n style,\n tabIndex,\n column,\n activeSortingColumn,\n sortingDescending,\n sortingDisabled,\n wrapLines,\n focusedComponent,\n onFocusedComponentChange,\n hidden,\n onClick,\n colIndex,\n updateColumn,\n resizableColumns,\n onResizeFinish,\n isEditable,\n columnId,\n stickyState,\n cellRef,\n}: TableHeaderCellProps<ItemType>) {\n const i18n = useInternalI18n('table');\n const sortable = !!column.sortingComparator \|\| !!column.sortingField;\n const sorted = !!activeSortingColumn && isSorted(column, activeSortingColumn);\n const sortingStatus = getSortingStatus(sortable, sorted, !!sortingDescending, !!sortingDisabled);\n const handleClick = () =>\n onClick({\n sortingColumn: column,\n isDescending: sorted ? !sortingDescending : false,\n });\n\n // Elements with role=\"button\" do not have the default behavior of <button>, where pressing\n // Enter or Space will trigger a click event. Therefore we need to add this ourselves.\n // The native <button> element cannot be used due to a misaligned implementation in Firefox:\n // https://bugzilla.mozilla.org/show_bug.cgi?id=843003\n const handleKeyPress = ({ nativeEvent: e }: React.KeyboardEvent) => {\n if (e.keyCode === KeyCode.enter \|\| e.keyCode === KeyCode.space) {\n e.preventDefault();\n handleClick();\n }\n };\n\n const headerId = useUniqueId('table-header-');\n\n const stickyStyles = useStickyCellStyles({\n stickyColumns: stickyState,\n columnId,\n getClassName: props => getStickyClassNames(styles, props),\n });\n\n const mergedRef = useMergeRefs(stickyStyles.ref, cellRef);\n\n return (\n <th\n className={clsx(\n className,\n {\n [styles['header-cell-resizable']]: !!resizableColumns,\n [styles['header-cell-sortable']]: sortingStatus,\n [styles['header-cell-sorted']]: sortingStatus === 'ascending' \|\| sortingStatus === 'descending',\n [styles['header-cell-disabled']]: sortingDisabled,\n [styles['header-cell-ascending']]: sortingStatus === 'ascending',\n [styles['header-cell-descending']]: sortingStatus === 'descending',\n [styles['header-cell-hidden']]: hidden,\n },\n stickyStyles.className\n )}\n aria-sort={sortingStatus && getAriaSort(sortingStatus)}\n style={{ ...style, ...stickyStyles.style }}\n scope=\"col\"\n ref={mergedRef}\n >\n <div\n className={clsx(styles['header-cell-content'], {\n [styles['header-cell-fake-focus']]: focusedComponent?.type === 'column' && focusedComponent.col === colIndex,\n })}\n aria-label={\n column.ariaLabel\n ? column.ariaLabel({\n sorted: sorted,\n descending: sorted && !!sortingDescending,\n disabled: !!sortingDisabled,\n })\n : undefined\n }\n {...(sortingStatus && !sortingDisabled\n ? {\n onKeyPress: handleKeyPress,\n tabIndex: tabIndex,\n role: 'button',\n onClick: handleClick,\n onFocus: () => onFocusedComponentChange?.({ type: 'column', col: colIndex }),\n onBlur: () => onFocusedComponentChange?.(null),\n }\n : {})}\n >\n <div className={clsx(styles['header-cell-text'], wrapLines && styles['header-cell-text-wrap'])} id={headerId}>\n {column.header}\n {isEditable ? (\n <span\n className={styles['edit-icon']}\n role=\"img\"\n aria-label={i18n('columnDefinitions.editConfig.editIconAriaLabel', column.editConfig?.editIconAriaLabel)}\n >\n <InternalIcon name=\"edit\" />\n </span>\n ) : null}\n </div>\n {sortingStatus && (\n <span className={styles['sorting-icon']}>\n <InternalIcon name={getSortingIconName(sortingStatus)} />\n </span>\n )}\n </div>\n {resizableColumns && (\n <>\n <Resizer\n tabIndex={tabIndex}\n showFocusRing={focusedComponent?.type === 'resizer' && focusedComponent.col === colIndex}\n onDragMove={newWidth => updateColumn(columnId, newWidth)}\n onFinish={onResizeFinish}\n ariaLabelledby={headerId}\n onFocus={() => onFocusedComponentChange?.({ type: 'resizer', col: colIndex })}\n onBlur={() => onFocusedComponentChange?.(null)}\n minWidth={typeof column.minWidth === 'string' ? parseInt(column.minWidth) : column.minWidth}\n />\n </>\n )}\n </th>\n );\n}\n"]}

package/lib/internal/template/table/internal.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"internal.d.ts","sourceRoot":"lib/default/","sources":["table/internal.tsx"],"names":[],"mappings":"AAIA,OAAO,EAAE,mBAAmB,EAAc,MAAM,cAAc,CAAC;AAwC/D,QAAA,MAAM,aAAa,~~qBAibK~~,CAAC;AAEzB,eAAe,aAAa,CAAC"}
1	+ {"version":3,"file":"internal.d.ts","sourceRoot":"lib/default/","sources":["table/internal.tsx"],"names":[],"mappings":"AAIA,OAAO,EAAE,mBAAmB,EAAc,MAAM,cAAc,CAAC;AAwC/D,QAAA,MAAM,aAAa,qBA+aK,CAAC;AAEzB,eAAe,aAAa,CAAC"}

package/lib/internal/template/table/internal.js CHANGED Viewed

@@ -2,7 +2,7 @@ import { __awaiter, __rest } from "tslib";
 // Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
 // SPDX-License-Identifier: Apache-2.0
 import clsx from 'clsx';
-import React, { useImperativeHandle, useMemo, useRef, useState } from 'react';
+import React, { useImperativeHandle, useRef, useState } from 'react';
 import { getVisualContextClassname } from '../internal/components/visual-context';
 import InternalContainer from '../container/internal';
 import { getBaseProps } from '../internal/base-component';
@@ -92,12 +92,19 @@ const InternalTable = React.forwardRef((_a, ref) => {
             : variant;
     const hasHeader = !!(header || filter || pagination || preferences);
     const hasSelection = !!selectionType;
-    const hasFooter = !!footer;
-    const visibleColumnsWithSelection = useMemo(() => {
-        const visible = visibleColumnDefinitions.map((column, columnIndex) => (Object.assign(Object.assign({}, column), { id: getColumnKey(column, columnIndex) })));
-        return hasSelection ? [{ id: selectionColumnId, width: SELECTION_COLUMN_WIDTH }, ...visible] : visible;
-    }, [visibleColumnDefinitions, hasSelection]);
-    const visibleColumnIdsWithSelection = useMemo(() => visibleColumnsWithSelection.map(c => c.id), [visibleColumnsWithSelection]);
+    const hasFooterPagination = variant === 'full-page' && !!pagination;
+    const hasFooter = !!footer || hasFooterPagination;
+    const visibleColumnWidthsWithSelection = [];
+    const visibleColumnIdsWithSelection = [];
+    if (hasSelection) {
+        visibleColumnWidthsWithSelection.push({ id: selectionColumnId, width: SELECTION_COLUMN_WIDTH });
+        visibleColumnIdsWithSelection.push(selectionColumnId);
+    }
+    for (let columnIndex = 0; columnIndex < visibleColumnDefinitions.length; columnIndex++) {
+        const columnId = getColumnKey(visibleColumnDefinitions[columnIndex], columnIndex);
+        visibleColumnWidthsWithSelection.push(Object.assign(Object.assign({}, visibleColumnDefinitions[columnIndex]), { id: columnId }));
+        visibleColumnIdsWithSelection.push(columnId);
+    }
     const stickyState = useStickyColumns({
         visibleColumns: visibleColumnIdsWithSelection,
         stickyColumnsFirst: ((_b = stickyColumns === null || stickyColumns === void 0 ? void 0 : stickyColumns.first) !== null && _b !== void 0 ? _b : 0) + ((stickyColumns === null || stickyColumns === void 0 ? void 0 : stickyColumns.first) && hasSelection ? 1 : 0),
@@ -156,13 +163,15 @@ const InternalTable = React.forwardRef((_a, ref) => {
     const toolsHeaderWrapper = useRef(null);
     // If is mobile, we take into consideration the AppLayout's mobile bar and we subtract the tools wrapper height so only the table header is sticky
     const toolsHeaderHeight = (_d = (_c = toolsHeaderWrapper === null || toolsHeaderWrapper === void 0 ? void 0 : toolsHeaderWrapper.current) === null || _c === void 0 ? void 0 : _c.getBoundingClientRect().height) !== null && _d !== void 0 ? _d : 0;
-    return (React.createElement(ColumnWidthsProvider, { tableRef: tableRefObject, visibleColumns: visibleColumnsWithSelection, resizableColumns: resizableColumns },
+    return (React.createElement(ColumnWidthsProvider, { visibleColumns: visibleColumnWidthsWithSelection, resizableColumns: resizableColumns },
         React.createElement(InternalContainer, Object.assign({}, baseProps, { __internalRootRef: __internalRootRef, className: clsx(baseProps.className, styles.root), header: React.createElement(React.Fragment, null,
                 hasHeader && (React.createElement("div", { ref: overlapElement, className: clsx(hasDynamicHeight && [styles['dark-header'], 'awsui-context-content-header']) },
                     React.createElement("div", { ref: toolsHeaderWrapper, className: clsx(styles['header-controls'], styles[`variant-${computedVariant}`]) },
                         React.createElement(ToolsHeader, { header: header, filter: filter, pagination: pagination, preferences: preferences })))),
-                stickyHeader && (React.createElement(StickyHeader, { ref: stickyHeaderRef, variant: computedVariant, theadProps: theadProps, wrapperRef: wrapperRefObject, theadRef: theadRef, secondaryWrapperRef: secondaryWrapperRef, tableRef: tableRefObject, onScroll: handleScroll, tableHasHeader: hasHeader, contentDensity: contentDensity }))), disableHeaderPaddings: true, disableContentPaddings: true, variant: toContainerVariant(computedVariant), __disableFooterPaddings: true, __disableFooterDivider: true, __disableStickyMobile: false, footer: footer && (React.createElement("div", { className: clsx(styles['footer-wrapper'], styles[`variant-${computedVariant}`]) },
-                React.createElement("div", { className: styles.footer }, footer))), __stickyHeader: stickyHeader, __mobileStickyOffset: toolsHeaderHeight, __stickyOffset: stickyHeaderVerticalOffset }, focusMarkers.root),
+                stickyHeader && (React.createElement(StickyHeader, { ref: stickyHeaderRef, variant: computedVariant, theadProps: theadProps, wrapperRef: wrapperRefObject, theadRef: theadRef, secondaryWrapperRef: secondaryWrapperRef, tableRef: tableRefObject, onScroll: handleScroll, tableHasHeader: hasHeader, contentDensity: contentDensity }))), disableHeaderPaddings: true, disableContentPaddings: true, variant: toContainerVariant(computedVariant), __disableFooterPaddings: true, __disableFooterDivider: true, __disableStickyMobile: false, footer: hasFooter ? (React.createElement("div", { className: clsx(styles['footer-wrapper'], styles[`variant-${computedVariant}`]) },
+                React.createElement("div", { className: clsx(styles.footer, hasFooterPagination && styles['footer-with-pagination']) },
+                    footer && React.createElement("span", null, footer),
+                    hasFooterPagination && React.createElement("div", { className: styles['footer-pagination'] }, pagination)))) : null, __stickyHeader: stickyHeader, __mobileStickyOffset: toolsHeaderHeight, __stickyOffset: stickyHeaderVerticalOffset }, focusMarkers.root),
             React.createElement("div", Object.assign({ ref: wrapperRef, className: clsx(styles.wrapper, styles[`variant-${computedVariant}`], {
                     [styles['has-footer']]: hasFooter,
                     [styles['has-header']]: hasHeader,