@cloudscape-design/components 3.0.443 → 3.0.444

package/table/resizer/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"lib/default/","sources":["table/resizer/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, { useEffect, useRef, useState } from 'react';\nimport styles from './styles.css.js';\nimport { KeyCode } from '../../internal/keycode';\nimport { DEFAULT_COLUMN_WIDTH } from '../use-column-widths';\nimport { useStableCallback } from '@cloudscape-design/component-toolkit/internal';\nimport { useUniqueId } from '../../internal/hooks/use-unique-id';\nimport { getHeaderWidth, getResizerElements } from './resizer-lookup';\n\ninterface ResizerProps {\n  onWidthUpdate: (newWidth: number) => void;\n  onWidthUpdateCommit: () => void;\n  ariaLabelledby?: string;\n  minWidth?: number;\n  tabIndex?: number;\n  focusId?: string;\n  showFocusRing?: boolean;\n  roleDescription?: string;\n}\n\nconst AUTO_GROW_START_TIME = 10;\nconst AUTO_GROW_INTERVAL = 10;\nconst AUTO_GROW_INCREMENT = 5;\n\nexport function Resizer({\n  onWidthUpdate,\n  onWidthUpdateCommit,\n  ariaLabelledby,\n  minWidth = DEFAULT_COLUMN_WIDTH,\n  tabIndex,\n  showFocusRing,\n  focusId,\n  roleDescription,\n}: ResizerProps) {\n  onWidthUpdate = useStableCallback(onWidthUpdate);\n  onWidthUpdateCommit = useStableCallback(onWidthUpdateCommit);\n\n  const separatorId = useUniqueId();\n  const resizerToggleRef = useRef<HTMLButtonElement>(null);\n  const resizerSeparatorRef = useRef<HTMLSpanElement>(null);\n\n  const [isDragging, setIsDragging] = useState(false);\n  const [isKeyboardDragging, setIsKeyboardDragging] = useState(false);\n  const autoGrowTimeout = useRef<ReturnType<typeof setTimeout> | undefined>();\n  const [resizerHasFocus, setResizerHasFocus] = useState(false);\n  const [headerCellWidth, setHeaderCellWidth] = useState(0);\n\n  // Read header width after mounting for it to be available in the element's ARIA label before it gets focused.\n  useEffect(() => {\n    setHeaderCellWidth(getHeaderWidth(resizerToggleRef.current));\n  }, []);\n\n  useEffect(() => {\n    const elements = getResizerElements(resizerToggleRef.current);\n    if ((!isDragging && !resizerHasFocus) || !elements) {\n      return;\n    }\n\n    const { left: leftEdge, right: rightEdge } = elements.scrollParent.getBoundingClientRect();\n\n    const updateTrackerPosition = (newOffset: number) => {\n      const { left: scrollParentLeft } = elements.table.getBoundingClientRect();\n      elements.tracker.style.top = elements.header.getBoundingClientRect().height + 'px';\n      // minus one pixel to offset the cell border\n      elements.tracker.style.left = newOffset - scrollParentLeft - 1 + 'px';\n    };\n\n    const updateColumnWidth = (newWidth: number) => {\n      const { right, width } = elements.header.getBoundingClientRect();\n      const updatedWidth = newWidth < minWidth ? minWidth : newWidth;\n      updateTrackerPosition(right + updatedWidth - width);\n      if (newWidth >= minWidth) {\n        setHeaderCellWidth(newWidth);\n      }\n      // callbacks must be the last calls in the handler, because they may cause an extra update\n      onWidthUpdate(newWidth);\n    };\n\n    const resizeColumn = (offset: number) => {\n      if (offset > leftEdge) {\n        const cellLeft = elements.header.getBoundingClientRect().left;\n        const newWidth = offset - cellLeft;\n        // callbacks must be the last calls in the handler, because they may cause an extra update\n        updateColumnWidth(newWidth);\n      }\n    };\n\n    const onAutoGrow = () => {\n      const width = elements.header.getBoundingClientRect().width;\n      autoGrowTimeout.current = setTimeout(onAutoGrow, AUTO_GROW_INTERVAL);\n      // callbacks must be the last calls in the handler, because they may cause an extra update\n      updateColumnWidth(width + AUTO_GROW_INCREMENT);\n      elements.scrollParent.scrollLeft += AUTO_GROW_INCREMENT;\n    };\n\n    const onMouseMove = (event: MouseEvent) => {\n      clearTimeout(autoGrowTimeout.current);\n      const offset = event.pageX;\n      if (offset > rightEdge) {\n        autoGrowTimeout.current = setTimeout(onAutoGrow, AUTO_GROW_START_TIME);\n      } else {\n        resizeColumn(offset);\n      }\n    };\n\n    const onMouseUp = (event: MouseEvent) => {\n      resizeColumn(event.pageX);\n      setIsDragging(false);\n      onWidthUpdateCommit();\n      clearTimeout(autoGrowTimeout.current);\n    };\n\n    const onKeyDown = (event: KeyboardEvent) => {\n      if (isKeyboardDragging) {\n        // Update width\n        if (event.keyCode === KeyCode.left) {\n          event.preventDefault();\n          updateColumnWidth(elements.header.getBoundingClientRect().width - 10);\n        }\n        if (event.keyCode === KeyCode.right) {\n          event.preventDefault();\n          updateColumnWidth(elements.header.getBoundingClientRect().width + 10);\n        }\n        // Exit keyboard dragging mode\n        if (event.keyCode === KeyCode.enter || event.keyCode === KeyCode.space || event.keyCode === KeyCode.escape) {\n          event.preventDefault();\n          setIsKeyboardDragging(false);\n          resizerToggleRef.current?.focus();\n          // The onWidthUpdateCommit is fired from the separator's blur event handler.\n        }\n      }\n      // Enter keyboard dragging mode\n      else if (event.keyCode === KeyCode.enter || event.keyCode === KeyCode.space) {\n        event.preventDefault();\n        setIsKeyboardDragging(true);\n        resizerSeparatorRef.current?.focus();\n      }\n    };\n\n    updateTrackerPosition(elements.header.getBoundingClientRect().right);\n\n    if (isDragging) {\n      document.body.classList.add(styles['resize-active']);\n      document.addEventListener('mousemove', onMouseMove);\n      document.addEventListener('mouseup', onMouseUp);\n    }\n    if (resizerHasFocus) {\n      document.body.classList.add(styles['resize-active-with-focus']);\n      elements.header.addEventListener('keydown', onKeyDown);\n    }\n    if (isKeyboardDragging) {\n      document.body.classList.add(styles['resize-active']);\n    }\n\n    return () => {\n      clearTimeout(autoGrowTimeout.current);\n      document.body.classList.remove(styles['resize-active']);\n      document.body.classList.remove(styles['resize-active-with-focus']);\n      document.removeEventListener('mousemove', onMouseMove);\n      document.removeEventListener('mouseup', onMouseUp);\n      elements.header.removeEventListener('keydown', onKeyDown);\n    };\n  }, [minWidth, isDragging, isKeyboardDragging, resizerHasFocus, onWidthUpdate, onWidthUpdateCommit]);\n\n  return (\n    <>\n      <button\n        ref={resizerToggleRef}\n        className={clsx(\n          styles.resizer,\n          isDragging && styles['resizer-active'],\n          (resizerHasFocus || showFocusRing || isKeyboardDragging) && styles['has-focus']\n        )}\n        onMouseDown={event => {\n          if (event.button !== 0) {\n            return;\n          }\n          event.preventDefault();\n          setIsDragging(true);\n        }}\n        onClick={() => {\n          // Prevent mouse drag activation and activate keyboard dragging for VO+Space click.\n          setIsDragging(false);\n          setResizerHasFocus(true);\n          setIsKeyboardDragging(true);\n          resizerSeparatorRef.current?.focus();\n        }}\n        onFocus={() => {\n          setHeaderCellWidth(getHeaderWidth(resizerToggleRef.current));\n          setResizerHasFocus(true);\n        }}\n        onBlur={event => {\n          // Ignoring blur event when focus moves to the resizer separator element.\n          // (This focus transition is done programmatically when the resizer button is clicked).\n          if (event.relatedTarget !== resizerSeparatorRef.current) {\n            setResizerHasFocus(false);\n          }\n        }}\n        // Using a custom role-description to make the element's purpose better clear.\n        // The role-description must include the word \"button\" to imply the interaction model.\n        // See https://www.w3.org/TR/wai-aria-1.1/#aria-roledescription\n        aria-roledescription={roleDescription}\n        aria-labelledby={ariaLabelledby}\n        tabIndex={tabIndex}\n        data-focus-id={focusId}\n      />\n      <span\n        ref={resizerSeparatorRef}\n        id={separatorId}\n        role=\"separator\"\n        tabIndex={-1}\n        aria-hidden={!isKeyboardDragging}\n        aria-orientation=\"vertical\"\n        aria-valuenow={headerCellWidth}\n        // aria-valuetext is needed because the VO announces \"collapsed\" when only aria-valuenow set without aria-valuemax\n        aria-valuetext={headerCellWidth.toFixed(0)}\n        aria-valuemin={minWidth}\n        data-focus-id={focusId}\n        onBlur={() => {\n          setResizerHasFocus(false);\n          if (isKeyboardDragging) {\n            setIsKeyboardDragging(false);\n          }\n          onWidthUpdateCommit();\n        }}\n      />\n    </>\n  );\n}\n\nexport function ResizeTracker() {\n  return <span className={styles.tracker} />;\n}\n"]}
+{"version":3,"file":"index.js","sourceRoot":"lib/default/","sources":["table/resizer/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, { useEffect, useRef, useState } from 'react';\nimport styles from './styles.css.js';\nimport { KeyCode } from '../../internal/keycode';\nimport { DEFAULT_COLUMN_WIDTH } from '../use-column-widths';\nimport { useStableCallback } from '@cloudscape-design/component-toolkit/internal';\nimport { useUniqueId } from '../../internal/hooks/use-unique-id';\nimport { getHeaderWidth, getResizerElements } from './resizer-lookup';\n\ninterface ResizerProps {\n  onWidthUpdate: (newWidth: number) => void;\n  onWidthUpdateCommit: () => void;\n  ariaLabelledby?: string;\n  minWidth?: number;\n  tabIndex?: number;\n  focusId?: string;\n  showFocusRing?: boolean;\n  roleDescription?: string;\n}\n\nconst AUTO_GROW_START_TIME = 10;\nconst AUTO_GROW_INTERVAL = 10;\nconst AUTO_GROW_INCREMENT = 5;\n\nexport function Divider({ className }: { className?: string }) {\n  return <span className={clsx(styles.divider, styles['divider-disabled'], className)} />;\n}\n\nexport function Resizer({\n  onWidthUpdate,\n  onWidthUpdateCommit,\n  ariaLabelledby,\n  minWidth = DEFAULT_COLUMN_WIDTH,\n  tabIndex,\n  showFocusRing,\n  focusId,\n  roleDescription,\n}: ResizerProps) {\n  onWidthUpdate = useStableCallback(onWidthUpdate);\n  onWidthUpdateCommit = useStableCallback(onWidthUpdateCommit);\n\n  const separatorId = useUniqueId();\n  const resizerToggleRef = useRef<HTMLButtonElement>(null);\n  const resizerSeparatorRef = useRef<HTMLSpanElement>(null);\n\n  const [isDragging, setIsDragging] = useState(false);\n  const [isKeyboardDragging, setIsKeyboardDragging] = useState(false);\n  const autoGrowTimeout = useRef<ReturnType<typeof setTimeout> | undefined>();\n  const [resizerHasFocus, setResizerHasFocus] = useState(false);\n  const [headerCellWidth, setHeaderCellWidth] = useState(0);\n\n  // Read header width after mounting for it to be available in the element's ARIA label before it gets focused.\n  useEffect(() => {\n    setHeaderCellWidth(getHeaderWidth(resizerToggleRef.current));\n  }, []);\n\n  useEffect(() => {\n    const elements = getResizerElements(resizerToggleRef.current);\n    if ((!isDragging && !resizerHasFocus) || !elements) {\n      return;\n    }\n\n    const { left: leftEdge, right: rightEdge } = elements.scrollParent.getBoundingClientRect();\n\n    const updateTrackerPosition = (newOffset: number) => {\n      const { left: scrollParentLeft } = elements.table.getBoundingClientRect();\n      elements.tracker.style.top = elements.header.getBoundingClientRect().height + 'px';\n      // minus one pixel to offset the cell border\n      elements.tracker.style.left = newOffset - scrollParentLeft - 1 + 'px';\n    };\n\n    const updateColumnWidth = (newWidth: number) => {\n      const { right, width } = elements.header.getBoundingClientRect();\n      const updatedWidth = newWidth < minWidth ? minWidth : newWidth;\n      updateTrackerPosition(right + updatedWidth - width);\n      if (newWidth >= minWidth) {\n        setHeaderCellWidth(newWidth);\n      }\n      // callbacks must be the last calls in the handler, because they may cause an extra update\n      onWidthUpdate(newWidth);\n    };\n\n    const resizeColumn = (offset: number) => {\n      if (offset > leftEdge) {\n        const cellLeft = elements.header.getBoundingClientRect().left;\n        const newWidth = offset - cellLeft;\n        // callbacks must be the last calls in the handler, because they may cause an extra update\n        updateColumnWidth(newWidth);\n      }\n    };\n\n    const onAutoGrow = () => {\n      const width = elements.header.getBoundingClientRect().width;\n      autoGrowTimeout.current = setTimeout(onAutoGrow, AUTO_GROW_INTERVAL);\n      // callbacks must be the last calls in the handler, because they may cause an extra update\n      updateColumnWidth(width + AUTO_GROW_INCREMENT);\n      elements.scrollParent.scrollLeft += AUTO_GROW_INCREMENT;\n    };\n\n    const onMouseMove = (event: MouseEvent) => {\n      clearTimeout(autoGrowTimeout.current);\n      const offset = event.pageX;\n      if (offset > rightEdge) {\n        autoGrowTimeout.current = setTimeout(onAutoGrow, AUTO_GROW_START_TIME);\n      } else {\n        resizeColumn(offset);\n      }\n    };\n\n    const onMouseUp = (event: MouseEvent) => {\n      resizeColumn(event.pageX);\n      setIsDragging(false);\n      onWidthUpdateCommit();\n      clearTimeout(autoGrowTimeout.current);\n    };\n\n    const onKeyDown = (event: KeyboardEvent) => {\n      if (isKeyboardDragging) {\n        // Update width\n        if (event.keyCode === KeyCode.left) {\n          event.preventDefault();\n          updateColumnWidth(elements.header.getBoundingClientRect().width - 10);\n        }\n        if (event.keyCode === KeyCode.right) {\n          event.preventDefault();\n          updateColumnWidth(elements.header.getBoundingClientRect().width + 10);\n        }\n        // Exit keyboard dragging mode\n        if (event.keyCode === KeyCode.enter || event.keyCode === KeyCode.space || event.keyCode === KeyCode.escape) {\n          event.preventDefault();\n          setIsKeyboardDragging(false);\n          resizerToggleRef.current?.focus();\n          // The onWidthUpdateCommit is fired from the separator's blur event handler.\n        }\n      }\n      // Enter keyboard dragging mode\n      else if (event.keyCode === KeyCode.enter || event.keyCode === KeyCode.space) {\n        event.preventDefault();\n        setIsKeyboardDragging(true);\n        resizerSeparatorRef.current?.focus();\n      }\n    };\n\n    updateTrackerPosition(elements.header.getBoundingClientRect().right);\n\n    if (isDragging) {\n      document.body.classList.add(styles['resize-active']);\n      document.addEventListener('mousemove', onMouseMove);\n      document.addEventListener('mouseup', onMouseUp);\n    }\n    if (resizerHasFocus) {\n      document.body.classList.add(styles['resize-active-with-focus']);\n      elements.header.addEventListener('keydown', onKeyDown);\n    }\n    if (isKeyboardDragging) {\n      document.body.classList.add(styles['resize-active']);\n    }\n\n    return () => {\n      clearTimeout(autoGrowTimeout.current);\n      document.body.classList.remove(styles['resize-active']);\n      document.body.classList.remove(styles['resize-active-with-focus']);\n      document.removeEventListener('mousemove', onMouseMove);\n      document.removeEventListener('mouseup', onMouseUp);\n      elements.header.removeEventListener('keydown', onKeyDown);\n    };\n  }, [minWidth, isDragging, isKeyboardDragging, resizerHasFocus, onWidthUpdate, onWidthUpdateCommit]);\n\n  return (\n    <>\n      <button\n        ref={resizerToggleRef}\n        className={clsx(\n          styles.resizer,\n          (resizerHasFocus || showFocusRing || isKeyboardDragging) && styles['has-focus']\n        )}\n        onMouseDown={event => {\n          if (event.button !== 0) {\n            return;\n          }\n          event.preventDefault();\n          setIsDragging(true);\n        }}\n        onClick={() => {\n          // Prevent mouse drag activation and activate keyboard dragging for VO+Space click.\n          setIsDragging(false);\n          setResizerHasFocus(true);\n          setIsKeyboardDragging(true);\n          resizerSeparatorRef.current?.focus();\n        }}\n        onFocus={() => {\n          setHeaderCellWidth(getHeaderWidth(resizerToggleRef.current));\n          setResizerHasFocus(true);\n        }}\n        onBlur={event => {\n          // Ignoring blur event when focus moves to the resizer separator element.\n          // (This focus transition is done programmatically when the resizer button is clicked).\n          if (event.relatedTarget !== resizerSeparatorRef.current) {\n            setResizerHasFocus(false);\n          }\n        }}\n        // Using a custom role-description to make the element's purpose better clear.\n        // The role-description must include the word \"button\" to imply the interaction model.\n        // See https://www.w3.org/TR/wai-aria-1.1/#aria-roledescription\n        aria-roledescription={roleDescription}\n        aria-labelledby={ariaLabelledby}\n        tabIndex={tabIndex}\n        data-focus-id={focusId}\n      />\n      <span\n        className={clsx(styles.divider, isDragging && styles['divider-active'])}\n        ref={resizerSeparatorRef}\n        id={separatorId}\n        role=\"separator\"\n        tabIndex={-1}\n        aria-hidden={!isKeyboardDragging}\n        aria-orientation=\"vertical\"\n        aria-valuenow={headerCellWidth}\n        // aria-valuetext is needed because the VO announces \"collapsed\" when only aria-valuenow set without aria-valuemax\n        aria-valuetext={headerCellWidth.toFixed(0)}\n        aria-valuemin={minWidth}\n        data-focus-id={focusId}\n        onBlur={() => {\n          setResizerHasFocus(false);\n          if (isKeyboardDragging) {\n            setIsKeyboardDragging(false);\n          }\n          onWidthUpdateCommit();\n        }}\n      />\n    </>\n  );\n}\n\nexport function ResizeTracker() {\n  return <span className={styles.tracker} />;\n}\n"]}

package/table/resizer/styles.css.js

@@ -1,11 +1,13 @@
 
     import './styles.scoped.css';
     export default {
-  "resize-active": "awsui_resize-active_x7peu_k905k_93",
-  "resize-active-with-focus": "awsui_resize-active-with-focus_x7peu_k905k_93",
-  "resizer": "awsui_resizer_x7peu_k905k_98",
-  "resizer-active": "awsui_resizer-active_x7peu_k905k_130",
-  "has-focus": "awsui_has-focus_x7peu_k905k_142",
-  "tracker": "awsui_tracker_x7peu_k905k_165"
+  "resize-active": "awsui_resize-active_x7peu_5n0qa_93",
+  "resize-active-with-focus": "awsui_resize-active-with-focus_x7peu_5n0qa_93",
+  "divider": "awsui_divider_x7peu_5n0qa_98",
+  "divider-disabled": "awsui_divider-disabled_x7peu_5n0qa_111",
+  "divider-active": "awsui_divider-active_x7peu_5n0qa_114",
+  "resizer": "awsui_resizer_x7peu_5n0qa_118",
+  "has-focus": "awsui_has-focus_x7peu_5n0qa_153",
+  "tracker": "awsui_tracker_x7peu_5n0qa_173"
 };
   

package/table/resizer/styles.scoped.css

@@ -90,13 +90,33 @@ 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_resize-active_x7peu_k905k_93:not(#\9):not(.awsui_resize-active-with-focus_x7peu_k905k_93) * {
+.awsui_resize-active_x7peu_5n0qa_93:not(#\9):not(.awsui_resize-active-with-focus_x7peu_5n0qa_93) * {
   cursor: col-resize;
   -webkit-user-select: none;
           user-select: none;
 }
 
-.awsui_resizer_x7peu_k905k_98:not(#\9) {
+th:not(#\9):not(:last-child) > .awsui_divider_x7peu_5n0qa_98 {
+  position: absolute;
+  outline: none;
+  pointer-events: none;
+  right: 0;
+  bottom: 0;
+  top: 0;
+  min-height: var(--line-height-heading-xs-aeleja, 18px);
+  max-height: calc(100% - calc(2 * var(--space-xs-zb16t3, 8px) + var(--space-xxxs-zbmxqb, 2px)));
+  margin: auto;
+  border-left: var(--border-divider-section-width-8a5uu9, 2px) solid var(--color-border-divider-interactive-default-byy830, #7d8998);
+  box-sizing: border-box;
+}
+th:not(#\9):not(:last-child) > .awsui_divider-disabled_x7peu_5n0qa_111 {
+  border-left-color: var(--color-border-divider-default-et9j7s, #e9ebed);
+}
+th:not(#\9):not(:last-child) > .awsui_divider-active_x7peu_5n0qa_114 {
+  border-left: 2px solid var(--color-border-divider-active-k4haaf, #000716);
+}
+
+.awsui_resizer_x7peu_5n0qa_118:not(#\9) {
   /* stylelint-disable-next-line plugin/no-unsupported-browser-features */
   border-collapse: separate;
   border-spacing: 0;
@@ -143,53 +163,41 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
   width: var(--space-l-t419sm, 20px);
   z-index: 10;
 }
-.awsui_resizer_x7peu_k905k_98:not(#\9):focus {
+.awsui_resizer_x7peu_5n0qa_118:not(#\9):focus {
   outline: none;
   text-decoration: none;
 }
-.awsui_resize-active_x7peu_k905k_93 .awsui_resizer_x7peu_k905k_98:not(#\9) {
+.awsui_resize-active_x7peu_5n0qa_93 .awsui_resizer_x7peu_5n0qa_118:not(#\9) {
   pointer-events: none;
 }
-th:not(#\9):last-child > .awsui_resizer_x7peu_k905k_98 {
+th:not(#\9):last-child > .awsui_resizer_x7peu_5n0qa_118 {
   width: calc(var(--space-l-t419sm, 20px) / 2);
   right: 0;
 }
-th:not(#\9):not(:last-child) > .awsui_resizer_x7peu_k905k_98:hover::before, th:not(#\9):not(:last-child) > .awsui_resizer-active_x7peu_k905k_130::before {
-  content: "";
-  position: absolute;
-  left: calc(var(--space-l-t419sm, 20px) / 2 - 2px);
-  bottom: 0;
-  top: 0;
-  min-height: var(--line-height-heading-xs-aeleja, 18px);
-  max-height: calc(100% - calc(2 * var(--space-xs-zb16t3, 8px) + var(--space-xxxs-zbmxqb, 2px)));
-  margin: auto;
+.awsui_resizer_x7peu_5n0qa_118:not(#\9):hover + .awsui_divider_x7peu_5n0qa_98 {
   border-left: 2px solid var(--color-border-divider-active-k4haaf, #000716);
-  box-sizing: border-box;
 }
-body[data-awsui-focus-visible=true] .awsui_resizer_x7peu_k905k_98.awsui_has-focus_x7peu_k905k_142:not(#\9) {
+body[data-awsui-focus-visible=true] .awsui_resizer_x7peu_5n0qa_118.awsui_has-focus_x7peu_5n0qa_153:not(#\9) {
   position: relative;
   position: absolute;
 }
-body[data-awsui-focus-visible=true] .awsui_resizer_x7peu_k905k_98.awsui_has-focus_x7peu_k905k_142:not(#\9) {
+body[data-awsui-focus-visible=true] .awsui_resizer_x7peu_5n0qa_118.awsui_has-focus_x7peu_5n0qa_153:not(#\9) {
   outline: 2px dotted transparent;
-  outline-offset: calc(var(--space-table-header-focus-outline-gutter-7js4en, 0px) - 1px);
+  outline-offset: calc(calc(var(--space-table-header-focus-outline-gutter-7js4en, 0px) - 2px) - 1px);
 }
-body[data-awsui-focus-visible=true] .awsui_resizer_x7peu_k905k_98.awsui_has-focus_x7peu_k905k_142:not(#\9)::before {
+body[data-awsui-focus-visible=true] .awsui_resizer_x7peu_5n0qa_118.awsui_has-focus_x7peu_5n0qa_153:not(#\9)::before {
   content: " ";
   display: block;
   position: absolute;
-  left: calc(-1 * var(--space-table-header-focus-outline-gutter-7js4en, 0px));
-  top: calc(-1 * var(--space-table-header-focus-outline-gutter-7js4en, 0px));
-  width: calc(100% + 2 * var(--space-table-header-focus-outline-gutter-7js4en, 0px));
-  height: calc(100% + 2 * var(--space-table-header-focus-outline-gutter-7js4en, 0px));
+  left: calc(-1 * calc(var(--space-table-header-focus-outline-gutter-7js4en, 0px) - 2px));
+  top: calc(-1 * calc(var(--space-table-header-focus-outline-gutter-7js4en, 0px) - 2px));
+  width: calc(100% + 2 * calc(var(--space-table-header-focus-outline-gutter-7js4en, 0px) - 2px));
+  height: calc(100% + 2 * calc(var(--space-table-header-focus-outline-gutter-7js4en, 0px) - 2px));
   border-radius: var(--border-radius-control-default-focus-ring-u8zbsz, 4px);
   box-shadow: 0 0 0 2px var(--color-border-item-focused-b2ntyl, #0972d3);
 }
-body[data-awsui-focus-visible=true] .awsui_resizer_x7peu_k905k_98.awsui_has-focus_x7peu_k905k_142:not(#\9)::before {
-  box-shadow: inset 0 0 0 2px var(--color-border-item-focused-b2ntyl, #0972d3);
-}
 
-.awsui_tracker_x7peu_k905k_165:not(#\9) {
+.awsui_tracker_x7peu_5n0qa_173:not(#\9) {
   display: none;
   position: absolute;
   border-left: var(--border-divider-list-width-27y3k5, 1px) dashed var(--color-border-divider-active-k4haaf, #000716);
@@ -197,6 +205,6 @@ body[data-awsui-focus-visible=true] .awsui_resizer_x7peu_k905k_98.awsui_has-focu
   top: 0;
   bottom: 0;
 }
-.awsui_resize-active_x7peu_k905k_93 .awsui_tracker_x7peu_k905k_165:not(#\9) {
+.awsui_resize-active_x7peu_5n0qa_93 .awsui_tracker_x7peu_5n0qa_173:not(#\9) {
   display: block;
 }

package/table/resizer/styles.selectors.js

@@ -2,11 +2,13 @@
     // es-module interop with Babel and Typescript
     Object.defineProperty(exports, "__esModule", { value: true });
     module.exports.default = {
-  "resize-active": "awsui_resize-active_x7peu_k905k_93",
-  "resize-active-with-focus": "awsui_resize-active-with-focus_x7peu_k905k_93",
-  "resizer": "awsui_resizer_x7peu_k905k_98",
-  "resizer-active": "awsui_resizer-active_x7peu_k905k_130",
-  "has-focus": "awsui_has-focus_x7peu_k905k_142",
-  "tracker": "awsui_tracker_x7peu_k905k_165"
+  "resize-active": "awsui_resize-active_x7peu_5n0qa_93",
+  "resize-active-with-focus": "awsui_resize-active-with-focus_x7peu_5n0qa_93",
+  "divider": "awsui_divider_x7peu_5n0qa_98",
+  "divider-disabled": "awsui_divider-disabled_x7peu_5n0qa_111",
+  "divider-active": "awsui_divider-active_x7peu_5n0qa_114",
+  "resizer": "awsui_resizer_x7peu_5n0qa_118",
+  "has-focus": "awsui_has-focus_x7peu_5n0qa_153",
+  "tracker": "awsui_tracker_x7peu_5n0qa_173"
 };
   

package/table/thead.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"thead.d.ts","sourceRoot":"lib/default/","sources":["table/thead.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAC1C,OAAO,EAAkC,cAAc,EAAE,MAAM,aAAa,CAAC;AAC7E,OAAO,EAA0B,yBAAyB,EAAE,MAAM,oBAAoB,CAAC;AAQvF,OAAO,EAAE,kBAAkB,EAAE,MAAM,kBAAkB,CAAC;AACtD,OAAO,EAA8B,SAAS,EAAE,MAAM,cAAc,CAAC;AAIrE,MAAM,WAAW,UAAU;IACzB,cAAc,EAAE,IAAI,GAAG,MAAM,CAAC;IAC9B,aAAa,EAAE,UAAU,CAAC,aAAa,GAAG,SAAS,CAAC;IACpD,iBAAiB,EAAE,aAAa,CAAC,UAAU,CAAC,gBAAgB,CAAC,GAAG,CAAC,CAAC,CAAC;IACnE,aAAa,EAAE,UAAU,CAAC,aAAa,CAAC,GAAG,CAAC,GAAG,SAAS,CAAC;IACzD,iBAAiB,EAAE,OAAO,GAAG,SAAS,CAAC;IACvC,eAAe,EAAE,OAAO,GAAG,SAAS,CAAC;IACrC,OAAO,EAAE,UAAU,CAAC,OAAO,CAAC;IAC5B,SAAS,EAAE,OAAO,GAAG,SAAS,CAAC;IAC/B,gBAAgB,EAAE,OAAO,GAAG,SAAS,CAAC;IACtC,iBAAiB,EAAE,MAAM,cAAc,CAAC;IACxC,WAAW,EAAE,CAAC,CAAC,aAAa,EAAE,WAAW,EAAE,SAAS,EAAE,MAAM,EAAE,SAAS,EAAE,CAAC,CAAC,GAAG,CAAC,KAAK,IAAI,CAAC,GAAG,SAAS,CAAC;IACtG,cAAc,EAAE,CAAC,SAAS,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,KAAK,IAAI,CAAC;IAC5D,eAAe,EAAE,yBAAyB,CAAC,UAAU,CAAC,YAAY,CAAC,GAAG,CAAC,CAAC,GAAG,SAAS,CAAC;IACrF,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,8BAA8B,CAAC,EAAE,MAAM,CAAC;IACxC,sBAAsB,CAAC,EAAE,MAAM,CAAC;IAChC,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,WAAW,EAAE,kBAAkB,CAAC;IAChC,iBAAiB,EAAE,WAAW,CAAC;IAC/B,gBAAgB,CAAC,EAAE,IAAI,GAAG,MAAM,CAAC;IACjC,wBAAwB,CAAC,EAAE,CAAC,OAAO,EAAE,IAAI,GAAG,MAAM,KAAK,IAAI,CAAC;IAC5D,SAAS,EAAE,SAAS,CAAC;CACtB;AAED,QAAA,MAAM,KAAK,wFAwIV,CAAC;AAEF,eAAe,KAAK,CAAC"}
+{"version":3,"file":"thead.d.ts","sourceRoot":"lib/default/","sources":["table/thead.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAC1C,OAAO,EAAkC,cAAc,EAAE,MAAM,aAAa,CAAC;AAC7E,OAAO,EAA0B,yBAAyB,EAAE,MAAM,oBAAoB,CAAC;AAQvF,OAAO,EAAE,kBAAkB,EAAE,MAAM,kBAAkB,CAAC;AACtD,OAAO,EAA8B,SAAS,EAAE,MAAM,cAAc,CAAC;AAKrE,MAAM,WAAW,UAAU;IACzB,cAAc,EAAE,IAAI,GAAG,MAAM,CAAC;IAC9B,aAAa,EAAE,UAAU,CAAC,aAAa,GAAG,SAAS,CAAC;IACpD,iBAAiB,EAAE,aAAa,CAAC,UAAU,CAAC,gBAAgB,CAAC,GAAG,CAAC,CAAC,CAAC;IACnE,aAAa,EAAE,UAAU,CAAC,aAAa,CAAC,GAAG,CAAC,GAAG,SAAS,CAAC;IACzD,iBAAiB,EAAE,OAAO,GAAG,SAAS,CAAC;IACvC,eAAe,EAAE,OAAO,GAAG,SAAS,CAAC;IACrC,OAAO,EAAE,UAAU,CAAC,OAAO,CAAC;IAC5B,SAAS,EAAE,OAAO,GAAG,SAAS,CAAC;IAC/B,gBAAgB,EAAE,OAAO,GAAG,SAAS,CAAC;IACtC,iBAAiB,EAAE,MAAM,cAAc,CAAC;IACxC,WAAW,EAAE,CAAC,CAAC,aAAa,EAAE,WAAW,EAAE,SAAS,EAAE,MAAM,EAAE,SAAS,EAAE,CAAC,CAAC,GAAG,CAAC,KAAK,IAAI,CAAC,GAAG,SAAS,CAAC;IACtG,cAAc,EAAE,CAAC,SAAS,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,KAAK,IAAI,CAAC;IAC5D,eAAe,EAAE,yBAAyB,CAAC,UAAU,CAAC,YAAY,CAAC,GAAG,CAAC,CAAC,GAAG,SAAS,CAAC;IACrF,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,8BAA8B,CAAC,EAAE,MAAM,CAAC;IACxC,sBAAsB,CAAC,EAAE,MAAM,CAAC;IAChC,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,WAAW,EAAE,kBAAkB,CAAC;IAChC,iBAAiB,EAAE,WAAW,CAAC;IAC/B,gBAAgB,CAAC,EAAE,IAAI,GAAG,MAAM,CAAC;IACjC,wBAAwB,CAAC,EAAE,CAAC,OAAO,EAAE,IAAI,GAAG,MAAM,KAAK,IAAI,CAAC;IAC5D,SAAS,EAAE,SAAS,CAAC;CACtB;AAED,QAAA,MAAM,KAAK,wFAyIV,CAAC;AAEF,eAAe,KAAK,CAAC"}

package/table/thead.js

@@ -14,6 +14,7 @@ import ScreenreaderOnly from '../internal/components/screenreader-only';
 import { getTableHeaderRowRoleProps } from './table-role';
 import { TableThElement } from './header-cell/th-element';
 import { findUpUntil } from '@cloudscape-design/component-toolkit/dom';
+import { Divider } from './resizer';
 const Thead = React.forwardRef(({ containerWidth, selectionType, getSelectAllProps, columnDefinitions, sortingColumn, sortingDisabled, sortingDescending, resizableColumns, variant, wrapLines, onFocusMove, onSortingChange, onResizeFinish, singleSelectionHeaderAriaLabel, stripedRows, sticky = false, hidden = false, stuck = false, stickyState, selectionColumnId, focusedComponent, onFocusedComponentChange, tableRole, resizerRoleDescription, }, outerRef) => {
     const isVisualRefresh = useVisualRefresh();
     const headerCellClass = clsx(headerCellStyles['header-cell'], headerCellStyles[`header-cell-variant-${variant}`], sticky && headerCellStyles['header-cell-sticky'], stuck && headerCellStyles['header-cell-stuck'], stripedRows && headerCellStyles['has-striped-rows'], isVisualRefresh && headerCellStyles['is-visual-refresh']);
@@ -26,9 +27,11 @@ const Thead = React.forwardRef(({ containerWidth, selectionType, getSelectAllPro
                 const focusId = (_a = focusControlElement === null || focusControlElement === void 0 ? void 0 : focusControlElement.getAttribute('data-focus-id')) !== null && _a !== void 0 ? _a : null;
                 onFocusedComponentChange === null || onFocusedComponentChange === void 0 ? void 0 : onFocusedComponentChange(focusId);
             }, onBlur: () => onFocusedComponentChange === null || onFocusedComponentChange === void 0 ? void 0 : onFocusedComponentChange(null) }),
-            selectionType ? (React.createElement(TableThElement, { className: clsx(headerCellClass, selectionCellClass, hidden && headerCellStyles['header-cell-hidden']), hidden: hidden, tableRole: tableRole, colIndex: 0, columnId: selectionColumnId, stickyState: stickyState }, selectionType === 'multi' ? (React.createElement(SelectionControl, Object.assign({ onFocusDown: event => {
-                    onFocusMove(event.target, -1, +1);
-                }, focusedComponent: focusedComponent }, getSelectAllProps(), (sticky ? { tabIndex: -1 } : {})))) : (React.createElement(ScreenreaderOnly, null, singleSelectionHeaderAriaLabel)))) : null,
+            selectionType ? (React.createElement(TableThElement, { className: clsx(headerCellClass, selectionCellClass, hidden && headerCellStyles['header-cell-hidden']), hidden: hidden, tableRole: tableRole, colIndex: 0, columnId: selectionColumnId, stickyState: stickyState },
+                selectionType === 'multi' ? (React.createElement(SelectionControl, Object.assign({ onFocusDown: event => {
+                        onFocusMove(event.target, -1, +1);
+                    }, focusedComponent: focusedComponent }, getSelectAllProps(), (sticky ? { tabIndex: -1 } : {})))) : (React.createElement(ScreenreaderOnly, null, singleSelectionHeaderAriaLabel)),
+                React.createElement(Divider, { className: styles['resize-divider'] }))) : null,
             columnDefinitions.map((column, colIndex) => {
                 const columnId = getColumnKey(column, colIndex);
                 let widthOverride;

package/table/thead.js.map

@@ -1 +1 @@
-{"version":3,"file":"thead.js","sourceRoot":"lib/default/","sources":["table/thead.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 { TableProps } from './interfaces';\nimport { SelectionControl, focusMarkers, SelectionProps } from './selection';\nimport { fireNonCancelableEvent, NonCancelableEventHandler } from '../internal/events';\nimport { getColumnKey } from './utils';\nimport { TableHeaderCell } from './header-cell';\nimport { useColumnWidths } from './use-column-widths';\nimport { useVisualRefresh } from '../internal/hooks/use-visual-mode';\nimport styles from './styles.css.js';\nimport headerCellStyles from './header-cell/styles.css.js';\nimport ScreenreaderOnly from '../internal/components/screenreader-only';\nimport { StickyColumnsModel } from './sticky-columns';\nimport { getTableHeaderRowRoleProps, TableRole } from './table-role';\nimport { TableThElement } from './header-cell/th-element';\nimport { findUpUntil } from '@cloudscape-design/component-toolkit/dom';\n\nexport interface TheadProps {\n  containerWidth: null | number;\n  selectionType: TableProps.SelectionType | undefined;\n  columnDefinitions: ReadonlyArray<TableProps.ColumnDefinition<any>>;\n  sortingColumn: TableProps.SortingColumn<any> | undefined;\n  sortingDescending: boolean | undefined;\n  sortingDisabled: boolean | undefined;\n  variant: TableProps.Variant;\n  wrapLines: boolean | undefined;\n  resizableColumns: boolean | undefined;\n  getSelectAllProps: () => SelectionProps;\n  onFocusMove: ((sourceElement: HTMLElement, fromIndex: number, direction: -1 | 1) => void) | undefined;\n  onResizeFinish: (newWidths: Record<string, number>) => void;\n  onSortingChange: NonCancelableEventHandler<TableProps.SortingState<any>> | undefined;\n  sticky?: boolean;\n  hidden?: boolean;\n  stuck?: boolean;\n  singleSelectionHeaderAriaLabel?: string;\n  resizerRoleDescription?: string;\n  stripedRows?: boolean;\n  stickyState: StickyColumnsModel;\n  selectionColumnId: PropertyKey;\n  focusedComponent?: null | string;\n  onFocusedComponentChange?: (focusId: null | string) => void;\n  tableRole: TableRole;\n}\n\nconst Thead = React.forwardRef(\n  (\n    {\n      containerWidth,\n      selectionType,\n      getSelectAllProps,\n      columnDefinitions,\n      sortingColumn,\n      sortingDisabled,\n      sortingDescending,\n      resizableColumns,\n      variant,\n      wrapLines,\n      onFocusMove,\n      onSortingChange,\n      onResizeFinish,\n      singleSelectionHeaderAriaLabel,\n      stripedRows,\n      sticky = false,\n      hidden = false,\n      stuck = false,\n      stickyState,\n      selectionColumnId,\n      focusedComponent,\n      onFocusedComponentChange,\n      tableRole,\n      resizerRoleDescription,\n    }: TheadProps,\n    outerRef: React.Ref<HTMLTableRowElement>\n  ) => {\n    const isVisualRefresh = useVisualRefresh();\n\n    const headerCellClass = clsx(\n      headerCellStyles['header-cell'],\n      headerCellStyles[`header-cell-variant-${variant}`],\n      sticky && headerCellStyles['header-cell-sticky'],\n      stuck && headerCellStyles['header-cell-stuck'],\n      stripedRows && headerCellStyles['has-striped-rows'],\n      isVisualRefresh && headerCellStyles['is-visual-refresh']\n    );\n\n    const selectionCellClass = clsx(\n      styles['selection-control'],\n      styles['selection-control-header'],\n      isVisualRefresh && styles['is-visual-refresh']\n    );\n\n    const { columnWidths, totalWidth, updateColumn, setCell } = useColumnWidths();\n\n    return (\n      <thead className={clsx(!hidden && styles['thead-active'])}>\n        <tr\n          {...focusMarkers.all}\n          ref={outerRef}\n          aria-rowindex={1}\n          {...getTableHeaderRowRoleProps({ tableRole })}\n          onFocus={event => {\n            const focusControlElement = findUpUntil(event.target, element => !!element.getAttribute('data-focus-id'));\n            const focusId = focusControlElement?.getAttribute('data-focus-id') ?? null;\n            onFocusedComponentChange?.(focusId);\n          }}\n          onBlur={() => onFocusedComponentChange?.(null)}\n        >\n          {selectionType ? (\n            <TableThElement\n              className={clsx(headerCellClass, selectionCellClass, hidden && headerCellStyles['header-cell-hidden'])}\n              hidden={hidden}\n              tableRole={tableRole}\n              colIndex={0}\n              columnId={selectionColumnId}\n              stickyState={stickyState}\n            >\n              {selectionType === 'multi' ? (\n                <SelectionControl\n                  onFocusDown={event => {\n                    onFocusMove!(event.target as HTMLElement, -1, +1);\n                  }}\n                  focusedComponent={focusedComponent}\n                  {...getSelectAllProps()}\n                  {...(sticky ? { tabIndex: -1 } : {})}\n                />\n              ) : (\n                <ScreenreaderOnly>{singleSelectionHeaderAriaLabel}</ScreenreaderOnly>\n              )}\n            </TableThElement>\n          ) : null}\n\n          {columnDefinitions.map((column, colIndex) => {\n            const columnId = getColumnKey(column, colIndex);\n\n            let widthOverride;\n            if (resizableColumns) {\n              if (columnWidths) {\n                // use stateful value if available\n                widthOverride = columnWidths[columnId];\n              }\n              if (colIndex === columnDefinitions.length - 1 && containerWidth && containerWidth > totalWidth) {\n                // let the last column grow and fill the container width\n                widthOverride = 'auto';\n              }\n            }\n            return (\n              <TableHeaderCell\n                key={columnId}\n                className={headerCellClass}\n                style={{\n                  width: widthOverride || column.width,\n                  minWidth: sticky ? undefined : column.minWidth,\n                  maxWidth: resizableColumns || sticky ? undefined : column.maxWidth,\n                }}\n                tabIndex={sticky ? -1 : 0}\n                focusedComponent={focusedComponent}\n                column={column}\n                activeSortingColumn={sortingColumn}\n                sortingDescending={sortingDescending}\n                sortingDisabled={sortingDisabled}\n                wrapLines={wrapLines}\n                hidden={hidden}\n                colIndex={selectionType ? colIndex + 1 : colIndex}\n                columnId={columnId}\n                updateColumn={updateColumn}\n                onResizeFinish={() => onResizeFinish(columnWidths)}\n                resizableColumns={resizableColumns}\n                onClick={detail => fireNonCancelableEvent(onSortingChange, detail)}\n                isEditable={!!column.editConfig}\n                stickyState={stickyState}\n                cellRef={node => setCell(columnId, node)}\n                tableRole={tableRole}\n                resizerRoleDescription={resizerRoleDescription}\n              />\n            );\n          })}\n        </tr>\n      </thead>\n    );\n  }\n);\n\nexport default Thead;\n"]}
+{"version":3,"file":"thead.js","sourceRoot":"lib/default/","sources":["table/thead.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 { TableProps } from './interfaces';\nimport { SelectionControl, focusMarkers, SelectionProps } from './selection';\nimport { fireNonCancelableEvent, NonCancelableEventHandler } from '../internal/events';\nimport { getColumnKey } from './utils';\nimport { TableHeaderCell } from './header-cell';\nimport { useColumnWidths } from './use-column-widths';\nimport { useVisualRefresh } from '../internal/hooks/use-visual-mode';\nimport styles from './styles.css.js';\nimport headerCellStyles from './header-cell/styles.css.js';\nimport ScreenreaderOnly from '../internal/components/screenreader-only';\nimport { StickyColumnsModel } from './sticky-columns';\nimport { getTableHeaderRowRoleProps, TableRole } from './table-role';\nimport { TableThElement } from './header-cell/th-element';\nimport { findUpUntil } from '@cloudscape-design/component-toolkit/dom';\nimport { Divider } from './resizer';\n\nexport interface TheadProps {\n  containerWidth: null | number;\n  selectionType: TableProps.SelectionType | undefined;\n  columnDefinitions: ReadonlyArray<TableProps.ColumnDefinition<any>>;\n  sortingColumn: TableProps.SortingColumn<any> | undefined;\n  sortingDescending: boolean | undefined;\n  sortingDisabled: boolean | undefined;\n  variant: TableProps.Variant;\n  wrapLines: boolean | undefined;\n  resizableColumns: boolean | undefined;\n  getSelectAllProps: () => SelectionProps;\n  onFocusMove: ((sourceElement: HTMLElement, fromIndex: number, direction: -1 | 1) => void) | undefined;\n  onResizeFinish: (newWidths: Record<string, number>) => void;\n  onSortingChange: NonCancelableEventHandler<TableProps.SortingState<any>> | undefined;\n  sticky?: boolean;\n  hidden?: boolean;\n  stuck?: boolean;\n  singleSelectionHeaderAriaLabel?: string;\n  resizerRoleDescription?: string;\n  stripedRows?: boolean;\n  stickyState: StickyColumnsModel;\n  selectionColumnId: PropertyKey;\n  focusedComponent?: null | string;\n  onFocusedComponentChange?: (focusId: null | string) => void;\n  tableRole: TableRole;\n}\n\nconst Thead = React.forwardRef(\n  (\n    {\n      containerWidth,\n      selectionType,\n      getSelectAllProps,\n      columnDefinitions,\n      sortingColumn,\n      sortingDisabled,\n      sortingDescending,\n      resizableColumns,\n      variant,\n      wrapLines,\n      onFocusMove,\n      onSortingChange,\n      onResizeFinish,\n      singleSelectionHeaderAriaLabel,\n      stripedRows,\n      sticky = false,\n      hidden = false,\n      stuck = false,\n      stickyState,\n      selectionColumnId,\n      focusedComponent,\n      onFocusedComponentChange,\n      tableRole,\n      resizerRoleDescription,\n    }: TheadProps,\n    outerRef: React.Ref<HTMLTableRowElement>\n  ) => {\n    const isVisualRefresh = useVisualRefresh();\n\n    const headerCellClass = clsx(\n      headerCellStyles['header-cell'],\n      headerCellStyles[`header-cell-variant-${variant}`],\n      sticky && headerCellStyles['header-cell-sticky'],\n      stuck && headerCellStyles['header-cell-stuck'],\n      stripedRows && headerCellStyles['has-striped-rows'],\n      isVisualRefresh && headerCellStyles['is-visual-refresh']\n    );\n\n    const selectionCellClass = clsx(\n      styles['selection-control'],\n      styles['selection-control-header'],\n      isVisualRefresh && styles['is-visual-refresh']\n    );\n\n    const { columnWidths, totalWidth, updateColumn, setCell } = useColumnWidths();\n\n    return (\n      <thead className={clsx(!hidden && styles['thead-active'])}>\n        <tr\n          {...focusMarkers.all}\n          ref={outerRef}\n          aria-rowindex={1}\n          {...getTableHeaderRowRoleProps({ tableRole })}\n          onFocus={event => {\n            const focusControlElement = findUpUntil(event.target, element => !!element.getAttribute('data-focus-id'));\n            const focusId = focusControlElement?.getAttribute('data-focus-id') ?? null;\n            onFocusedComponentChange?.(focusId);\n          }}\n          onBlur={() => onFocusedComponentChange?.(null)}\n        >\n          {selectionType ? (\n            <TableThElement\n              className={clsx(headerCellClass, selectionCellClass, hidden && headerCellStyles['header-cell-hidden'])}\n              hidden={hidden}\n              tableRole={tableRole}\n              colIndex={0}\n              columnId={selectionColumnId}\n              stickyState={stickyState}\n            >\n              {selectionType === 'multi' ? (\n                <SelectionControl\n                  onFocusDown={event => {\n                    onFocusMove!(event.target as HTMLElement, -1, +1);\n                  }}\n                  focusedComponent={focusedComponent}\n                  {...getSelectAllProps()}\n                  {...(sticky ? { tabIndex: -1 } : {})}\n                />\n              ) : (\n                <ScreenreaderOnly>{singleSelectionHeaderAriaLabel}</ScreenreaderOnly>\n              )}\n              <Divider className={styles['resize-divider']} />\n            </TableThElement>\n          ) : null}\n\n          {columnDefinitions.map((column, colIndex) => {\n            const columnId = getColumnKey(column, colIndex);\n\n            let widthOverride;\n            if (resizableColumns) {\n              if (columnWidths) {\n                // use stateful value if available\n                widthOverride = columnWidths[columnId];\n              }\n              if (colIndex === columnDefinitions.length - 1 && containerWidth && containerWidth > totalWidth) {\n                // let the last column grow and fill the container width\n                widthOverride = 'auto';\n              }\n            }\n            return (\n              <TableHeaderCell\n                key={columnId}\n                className={headerCellClass}\n                style={{\n                  width: widthOverride || column.width,\n                  minWidth: sticky ? undefined : column.minWidth,\n                  maxWidth: resizableColumns || sticky ? undefined : column.maxWidth,\n                }}\n                tabIndex={sticky ? -1 : 0}\n                focusedComponent={focusedComponent}\n                column={column}\n                activeSortingColumn={sortingColumn}\n                sortingDescending={sortingDescending}\n                sortingDisabled={sortingDisabled}\n                wrapLines={wrapLines}\n                hidden={hidden}\n                colIndex={selectionType ? colIndex + 1 : colIndex}\n                columnId={columnId}\n                updateColumn={updateColumn}\n                onResizeFinish={() => onResizeFinish(columnWidths)}\n                resizableColumns={resizableColumns}\n                onClick={detail => fireNonCancelableEvent(onSortingChange, detail)}\n                isEditable={!!column.editConfig}\n                stickyState={stickyState}\n                cellRef={node => setCell(columnId, node)}\n                tableRole={tableRole}\n                resizerRoleDescription={resizerRoleDescription}\n              />\n            );\n          })}\n        </tr>\n      </thead>\n    );\n  }\n);\n\nexport default Thead;\n"]}