@dynatrace/strato-components 3.9.0 → 3.10.0

package/esm/tables/DataTable/components/Toolbar/ColumnSettings/ColumnOrderSettings/ColumnOrderSettingsDragAndDrop.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../../../../src/tables/DataTable/components/Toolbar/ColumnSettings/ColumnOrderSettings/ColumnOrderSettingsDragAndDrop.tsx"],
-  "sourcesContent": ["import {\n  type CollisionDetection,\n  DndContext as DragAndDropContext,\n  type DragEndEvent,\n  type DragOverEvent,\n  DragOverlay,\n  type DragStartEvent,\n  KeyboardSensor,\n  Modifier,\n  MouseSensor,\n  TouchSensor,\n  useSensor,\n  useSensors,\n} from '@dnd-kit/core';\nimport type {\n  ColumnPinningState,\n  Column,\n  RowData,\n  TableFeatures,\n} from '@tanstack/react-table';\nimport { type Virtualizer } from '@tanstack/react-virtual';\nimport clsx from 'clsx';\nimport { type ReactNode, useCallback, useMemo, useRef, useState } from 'react';\n\nimport {\n  createColumnOrderSettingsCollisionDetection,\n  createRestrictToColumnsListAreaModifier,\n  DATA_TABLE_COLUMNS_LIST_ITEM_MIN_HEIGHT,\n  COLUMNS_LIST_ITEM_BORDER_HEIGHT,\n  type DraggingColumnInfo,\n  getAllColumns,\n  getColumnById,\n  getDragHandleForColumn,\n  getDragIndexes,\n  getLeafColumnsForColumn,\n  hideChildColumns,\n  hideChildColumnsOnScroll,\n  resetAllColumnsStyles,\n  styleNonTargetColumns,\n  transformColumnsOnDragOver,\n} from './column-order-settings-dnd-utils.js';\nimport * as styles from './ColumnOrderSettingsDragAndDrop.sty.js';\nimport { devLog } from '../../../../../../core/utils/logging.js';\n\n// Threshold for detecting sudden jumps caused by virtualizer scroll corrections\n// vs. gradual user/auto-scroll during drag.\nconst SCROLL_JUMP_THRESHOLD = DATA_TABLE_COLUMNS_LIST_ITEM_MIN_HEIGHT * 10;\n\n/**\n * Drag and drop context for ordering in the column settings modal.\n * @internal\n */\nexport function ColumnOrderSettingsDragAndDropContext<\n  TFeatures extends TableFeatures,\n  TData extends RowData,\n>({\n  children,\n  localColumnOrder,\n  updateLocalColumnOrder,\n  localColumnPinning,\n  itemVirtualizer,\n}: Readonly<{\n  children: ReactNode;\n  localColumnOrder: string[];\n  updateLocalColumnOrder: (newColumnOrder: string[]) => void;\n  localColumnPinning: ColumnPinningState;\n  itemVirtualizer: Virtualizer<HTMLDivElement, Element>;\n}>) {\n  const [dragOverlayContent, setDragOverlayContent] =\n    useState<HTMLElement | null>(null);\n  const [dragOverlaySize, setDragOverlaySize] = useState<{\n    width: number;\n    height: number;\n  }>({ width: 0, height: 0 });\n  const [draggingColumnInfo, setDraggingColumnInfo] =\n    useState<DraggingColumnInfo<TFeatures, TData> | null>(null);\n\n  const modalContentRef = useRef<HTMLDivElement | null>(null);\n  const scrollHandlerRef = useRef<(() => void) | null>(null);\n\n  const sensors = useSensors(\n    useSensor(MouseSensor, {}),\n    useSensor(TouchSensor, {}),\n    useSensor(KeyboardSensor, {}),\n  );\n\n  const columnsListCollisionDetection = useMemo<CollisionDetection>(\n    () =>\n      createColumnOrderSettingsCollisionDetection(\n        localColumnOrder,\n        localColumnPinning,\n        draggingColumnInfo,\n      ),\n    [draggingColumnInfo, localColumnOrder, localColumnPinning],\n  );\n\n  const restrictToColumnsListAreaModifier = useCallback<Modifier>(\n    (args) => {\n      return createRestrictToColumnsListAreaModifier(\n        itemVirtualizer.scrollElement as HTMLDivElement | null,\n      )(args);\n    },\n    [itemVirtualizer],\n  );\n\n  const resetDragging = (): void => {\n    // Remove scroll event listener\n    const scrollElement = itemVirtualizer.scrollElement;\n    if (scrollElement && scrollHandlerRef.current) {\n      scrollElement.removeEventListener('scroll', scrollHandlerRef.current);\n      scrollHandlerRef.current = null;\n    }\n\n    // Reset all transforms\n    if (modalContentRef.current) {\n      const allColumns = getAllColumns(modalContentRef.current);\n      resetAllColumnsStyles(allColumns);\n    }\n\n    modalContentRef.current = null;\n    setDraggingColumnInfo(null);\n    setDragOverlayContent(null);\n    setDragOverlaySize({ width: 0, height: 0 });\n  };\n\n  const resetDraggingAndFocusLastActive = (activeId: string): void => {\n    requestAnimationFrame(() => {\n      // wait for the next frame to ensure the columns list finished updating\n      getDragHandleForColumn(activeId, modalContentRef.current)?.focus();\n      resetDragging();\n    });\n  };\n\n  const handleOnDragStart = ({ active }: DragStartEvent): void => {\n    const activeLocalColumn = active.data.current?.column as Column<\n      TFeatures,\n      TData\n    >;\n\n    if (!activeLocalColumn) {\n      return;\n    }\n\n    const scrollElement = itemVirtualizer.scrollElement as HTMLDivElement;\n    modalContentRef.current =\n      (scrollElement?.firstElementChild as HTMLDivElement) || scrollElement;\n\n    const localColumn = getColumnById(\n      modalContentRef.current,\n      activeLocalColumn.id,\n    );\n\n    if (!localColumn) {\n      devLog(\n        '[DataTable] Could not find column element in DOM',\n        activeLocalColumn.id,\n      );\n      return;\n    }\n\n    // Keep track of the dragged column\n    // This is necessary because the active column may get virtualized out of the DOM during drag\n    const columnInfo: DraggingColumnInfo<TFeatures, TData> = {\n      id: active.id as string,\n      index: active.data.current?.columnIndex,\n      column: activeLocalColumn,\n    };\n    setDraggingColumnInfo(columnInfo);\n\n    let lastScrollOffset =\n      itemVirtualizer.scrollOffset ?? scrollElement?.scrollTop ?? 0;\n\n    // Attach scroll event listener to handle virtualization during drag\n    const handleScroll = (): void => {\n      const innerContainer = modalContentRef.current;\n      if (!innerContainer || !columnInfo.column) {\n        return;\n      }\n\n      // Reapply disabled styles to non-target columns (including newly rendered ones)\n      styleNonTargetColumns(innerContainer, columnInfo.column.parent?.id);\n      // Reapply hidden styles to child columns of the dragged parent column\n      hideChildColumnsOnScroll(innerContainer);\n\n      const currentOffset = scrollElement.scrollTop;\n      const scrollDelta = Math.abs(currentOffset - lastScrollOffset);\n      if (scrollDelta >= SCROLL_JUMP_THRESHOLD) {\n        // Large sudden jump - virtualizer correction, prevent it\n        scrollElement.scrollTop = lastScrollOffset;\n        return;\n      }\n      lastScrollOffset = currentOffset;\n    };\n    scrollHandlerRef.current = handleScroll;\n    scrollElement?.addEventListener('scroll', handleScroll);\n\n    // Apply styling to non-target columns once at drag start\n    styleNonTargetColumns(\n      modalContentRef.current,\n      activeLocalColumn.parent?.id,\n    );\n\n    const dragOverlaySize = {\n      width: localColumn.clientWidth,\n      height: localColumn.clientHeight,\n    };\n\n    // Clone local column for drag overlay\n    const clonedElement = localColumn.cloneNode(true) as HTMLElement;\n    if (activeLocalColumn.columns.length === 0) {\n      setDragOverlayContent(clonedElement);\n    } else {\n      // for nested columns, create a container and append the cloned parent and child columns\n      // and use that container as the drag overlay content\n      const wrapper = document.createElement('div');\n      wrapper.appendChild(clonedElement);\n\n      const childColumnIds = getLeafColumnsForColumn(\n        activeLocalColumn,\n        localColumnOrder,\n      );\n\n      // Clone each child column FIRST (before hiding them)\n      for (const childColumnId of childColumnIds) {\n        const childColumn = getColumnById(\n          modalContentRef.current,\n          childColumnId,\n        );\n\n        if (childColumn) {\n          const clonedChild = childColumn.cloneNode(true) as HTMLElement;\n          wrapper.appendChild(clonedChild);\n\n          dragOverlaySize.height +=\n            childColumn.clientHeight + COLUMNS_LIST_ITEM_BORDER_HEIGHT;\n        }\n      }\n\n      // Now hide child columns in the list and track them for virtualization\n      // This must happen AFTER cloning so the clones don't have the isDragging class\n      hideChildColumns(modalContentRef.current, childColumnIds);\n\n      setDragOverlayContent(wrapper);\n    }\n    setDragOverlaySize(dragOverlaySize);\n  };\n\n  const handleOnDragOver = (event: DragOverEvent): void => {\n    transformColumnsOnDragOver(\n      modalContentRef.current,\n      event,\n      localColumnOrder,\n      dragOverlaySize.height,\n      draggingColumnInfo?.column,\n    );\n  };\n\n  const handleOnDragEnd = ({ over }: DragEndEvent): void => {\n    if (!draggingColumnInfo) {\n      devLog('[Table] On drag end: dragging column info is undefined');\n      resetDragging();\n      return;\n    }\n\n    const activeColumn = draggingColumnInfo.column;\n    const activeId = activeColumn.id;\n    if (over === undefined || over === null) {\n      devLog('[Table] On drag end: over info is undefined or null', over);\n      resetDraggingAndFocusLastActive(activeId);\n      return;\n    }\n\n    const overId = over.data.current?.columnId as string;\n    // column order did not change\n    if (overId === activeId) {\n      resetDraggingAndFocusLastActive(activeId);\n      return;\n    }\n\n    // Update the column order if dropped on a valid target\n    const { fromIndex, toIndex } = getDragIndexes(\n      localColumnOrder,\n      activeId,\n      overId,\n    );\n\n    const columnsToMove: string[] = [activeId];\n    if (activeColumn.columns.length > 0) {\n      // move all child columns if a parent column is moved\n      const childColumnIds = getLeafColumnsForColumn(\n        activeColumn,\n        localColumnOrder,\n      );\n      columnsToMove.push(...childColumnIds);\n    }\n\n    const directionOffset = fromIndex < toIndex ? 1 : -1;\n    const adjustedTargetIndex =\n      fromIndex < toIndex\n        ? Math.max(0, toIndex - columnsToMove.length + directionOffset)\n        : toIndex;\n\n    const newColumnOrder = [...localColumnOrder];\n    newColumnOrder.splice(fromIndex, columnsToMove.length);\n    newColumnOrder.splice(adjustedTargetIndex, 0, ...columnsToMove);\n    updateLocalColumnOrder(newColumnOrder);\n    resetDraggingAndFocusLastActive(activeId);\n  };\n\n  const onDragCancel = (): void => {\n    const activeId = draggingColumnInfo?.id;\n    if (activeId) {\n      resetDraggingAndFocusLastActive(activeId);\n    }\n  };\n\n  return (\n    <DragAndDropContext\n      // when the column order is updated, the DOM elements are re-rendered and the focus is lost\n      // therefore, we need to manually restore the focus to the last active drag handle\n      accessibility={{ restoreFocus: false }}\n      sensors={sensors}\n      collisionDetection={columnsListCollisionDetection}\n      modifiers={[restrictToColumnsListAreaModifier]}\n      onDragStart={handleOnDragStart}\n      onDragOver={handleOnDragOver}\n      onDragEnd={handleOnDragEnd}\n      onDragCancel={onDragCancel}\n    >\n      {children}\n      <DragOverlay\n        dropAnimation={null}\n        className={clsx(styles.columnDndOverlay)}\n        style={{\n          height: dragOverlaySize.height,\n          width: dragOverlaySize.width,\n        }}\n      >\n        <div\n          ref={(node) =>\n            dragOverlayContent && node?.appendChild(dragOverlayContent)\n          }\n        />\n      </DragOverlay>\n    </DragAndDropContext>\n  );\n}\n"],
-  "mappings": "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",
+  "sourcesContent": ["import {\n  type CollisionDetection,\n  DndContext as DragAndDropContext,\n  type DragEndEvent,\n  type DragOverEvent,\n  DragOverlay,\n  type DragStartEvent,\n  KeyboardSensor,\n  Modifier,\n  MouseSensor,\n  TouchSensor,\n  useSensor,\n  useSensors,\n} from '@dnd-kit/core';\nimport type {\n  ColumnPinningState,\n  Column,\n  RowData,\n  TableFeatures,\n} from '@tanstack/react-table';\nimport { type Virtualizer } from '@tanstack/react-virtual';\nimport clsx from 'clsx';\nimport { type ReactNode, useCallback, useMemo, useRef, useState } from 'react';\n\nimport {\n  createColumnOrderSettingsCollisionDetection,\n  createRestrictToColumnsListAreaModifier,\n  DATA_TABLE_COLUMNS_LIST_ITEM_MIN_HEIGHT,\n  COLUMNS_LIST_ITEM_BORDER_HEIGHT,\n  type DraggingColumnInfo,\n  getAllColumns,\n  getColumnById,\n  getDragHandleForColumn,\n  getDragIndexes,\n  getLeafColumnsForColumn,\n  hideChildColumns,\n  hideChildColumnsOnScroll,\n  resetAllColumnsStyles,\n  styleNonTargetColumns,\n  transformColumnsOnDragOver,\n} from './column-order-settings-dnd-utils.js';\nimport * as styles from './ColumnOrderSettingsDragAndDrop.sty.js';\nimport { devLog } from '../../../../../../core/utils/logging.js';\n\n// Threshold for detecting sudden jumps caused by virtualizer scroll corrections\n// vs. gradual user/auto-scroll during drag.\nconst SCROLL_JUMP_THRESHOLD = DATA_TABLE_COLUMNS_LIST_ITEM_MIN_HEIGHT * 10;\n\n/**\n * Drag and drop context for ordering in the column settings modal.\n * @internal\n */\nexport function ColumnOrderSettingsDragAndDropContext<\n  TFeatures extends TableFeatures,\n  TData extends RowData,\n>({\n  children,\n  localColumnOrder,\n  updateLocalColumnOrder,\n  localColumnPinning,\n  itemVirtualizer,\n}: Readonly<{\n  children: ReactNode;\n  localColumnOrder: string[];\n  updateLocalColumnOrder: (newColumnOrder: string[]) => void;\n  localColumnPinning: ColumnPinningState;\n  itemVirtualizer: Virtualizer<HTMLDivElement, Element>;\n}>) {\n  const [dragOverlayContent, setDragOverlayContent] =\n    useState<HTMLElement | null>(null);\n  const [dragOverlaySize, setDragOverlaySize] = useState<{\n    width: number;\n    height: number;\n  }>({ width: 0, height: 0 });\n  const [draggingColumnInfo, setDraggingColumnInfo] =\n    useState<DraggingColumnInfo<TFeatures, TData> | null>(null);\n\n  const modalContentRef = useRef<HTMLDivElement | null>(null);\n  const scrollHandlerRef = useRef<(() => void) | null>(null);\n\n  const sensors = useSensors(\n    useSensor(MouseSensor, {}),\n    useSensor(TouchSensor, {}),\n    useSensor(KeyboardSensor, {}),\n  );\n\n  const columnsListCollisionDetection = useMemo<CollisionDetection>(\n    () =>\n      createColumnOrderSettingsCollisionDetection(\n        localColumnOrder,\n        localColumnPinning,\n        draggingColumnInfo,\n      ),\n    [draggingColumnInfo, localColumnOrder, localColumnPinning],\n  );\n\n  const restrictToColumnsListAreaModifier = useCallback<Modifier>(\n    (args) => {\n      return createRestrictToColumnsListAreaModifier(\n        itemVirtualizer.scrollElement as HTMLDivElement | null,\n      )(args);\n    },\n    [itemVirtualizer],\n  );\n\n  const resetDragging = (): void => {\n    // Remove scroll event listener\n    const scrollElement = itemVirtualizer.scrollElement;\n    if (scrollElement && scrollHandlerRef.current) {\n      scrollElement.removeEventListener('scroll', scrollHandlerRef.current);\n      scrollHandlerRef.current = null;\n    }\n\n    // Reset all transforms\n    if (modalContentRef.current) {\n      const allColumns = getAllColumns(modalContentRef.current);\n      resetAllColumnsStyles(allColumns);\n    }\n\n    modalContentRef.current = null;\n    setDraggingColumnInfo(null);\n    setDragOverlayContent(null);\n    setDragOverlaySize({ width: 0, height: 0 });\n  };\n\n  const resetDraggingAndFocusLastActive = (activeId: string): void => {\n    requestAnimationFrame(() => {\n      // wait for the next frame to ensure the columns list finished updating\n      getDragHandleForColumn(activeId, modalContentRef.current)?.focus();\n      resetDragging();\n    });\n  };\n\n  const handleOnDragStart = ({ active }: DragStartEvent): void => {\n    const activeLocalColumn = active.data.current?.column as Column<\n      TFeatures,\n      TData\n    >;\n\n    if (!activeLocalColumn) {\n      return;\n    }\n\n    const scrollElement = itemVirtualizer.scrollElement as HTMLDivElement;\n    modalContentRef.current =\n      (scrollElement?.firstElementChild as HTMLDivElement) || scrollElement;\n\n    const localColumn = getColumnById(\n      modalContentRef.current,\n      activeLocalColumn.id,\n    );\n\n    if (!localColumn) {\n      devLog(\n        '[DataTable] Could not find column element in DOM',\n        activeLocalColumn.id,\n      );\n      return;\n    }\n\n    // Keep track of the dragged column\n    // This is necessary because the active column may get virtualized out of the DOM during drag\n    const columnInfo: DraggingColumnInfo<TFeatures, TData> = {\n      id: active.id as string,\n      index: active.data.current?.columnIndex,\n      column: activeLocalColumn,\n    };\n    setDraggingColumnInfo(columnInfo);\n\n    let lastScrollOffset =\n      itemVirtualizer.scrollOffset ?? scrollElement?.scrollTop ?? 0;\n\n    // Attach scroll event listener to handle virtualization during drag\n    const handleScroll = (): void => {\n      const innerContainer = modalContentRef.current;\n      if (!innerContainer || !columnInfo.column) {\n        return;\n      }\n\n      // Reapply disabled styles to non-target columns (including newly rendered ones)\n      styleNonTargetColumns(innerContainer, columnInfo.column.parent?.id);\n      // Reapply hidden styles to child columns of the dragged parent column\n      hideChildColumnsOnScroll(innerContainer);\n\n      const currentOffset = scrollElement.scrollTop;\n      const scrollDelta = Math.abs(currentOffset - lastScrollOffset);\n      if (scrollDelta >= SCROLL_JUMP_THRESHOLD) {\n        // Large sudden jump - virtualizer correction, prevent it\n        scrollElement.scrollTop = lastScrollOffset;\n        return;\n      }\n      lastScrollOffset = currentOffset;\n    };\n    scrollHandlerRef.current = handleScroll;\n    scrollElement?.addEventListener('scroll', handleScroll);\n\n    // Apply styling to non-target columns once at drag start\n    styleNonTargetColumns(\n      modalContentRef.current,\n      activeLocalColumn.parent?.id,\n    );\n\n    const dragOverlaySize = {\n      width: localColumn.clientWidth,\n      height: localColumn.clientHeight,\n    };\n\n    // Clone local column for drag overlay\n    const clonedElement = localColumn.cloneNode(true) as HTMLElement;\n    if (activeLocalColumn.columns.length === 0) {\n      setDragOverlayContent(clonedElement);\n    } else {\n      // for nested columns, create a container and append the cloned parent and child columns\n      // and use that container as the drag overlay content\n      const wrapper = document.createElement('div');\n      wrapper.appendChild(clonedElement);\n\n      const childColumnIds = getLeafColumnsForColumn(\n        activeLocalColumn,\n        localColumnOrder,\n      );\n\n      // Clone each child column FIRST (before hiding them)\n      for (const childColumnId of childColumnIds) {\n        const childColumn = getColumnById(\n          modalContentRef.current,\n          childColumnId,\n        );\n\n        if (childColumn) {\n          const clonedChild = childColumn.cloneNode(true) as HTMLElement;\n          wrapper.appendChild(clonedChild);\n\n          dragOverlaySize.height +=\n            childColumn.clientHeight + COLUMNS_LIST_ITEM_BORDER_HEIGHT;\n        }\n      }\n\n      // Now hide child columns in the list and track them for virtualization\n      // This must happen AFTER cloning so the clones don't have the isDragging class\n      hideChildColumns(modalContentRef.current, childColumnIds);\n\n      setDragOverlayContent(wrapper);\n    }\n    setDragOverlaySize(dragOverlaySize);\n  };\n\n  const handleOnDragOver = (event: DragOverEvent): void => {\n    transformColumnsOnDragOver(\n      modalContentRef.current,\n      event,\n      localColumnOrder,\n      dragOverlaySize.height,\n      draggingColumnInfo?.column,\n    );\n  };\n\n  const handleOnDragEnd = ({ over }: DragEndEvent): void => {\n    if (!draggingColumnInfo) {\n      devLog('[Table] On drag end: dragging column info is undefined');\n      resetDragging();\n      return;\n    }\n\n    const activeColumn = draggingColumnInfo.column;\n    const activeId = activeColumn.id;\n    if (over === undefined || over === null) {\n      devLog('[Table] On drag end: over info is undefined or null', over);\n      resetDraggingAndFocusLastActive(activeId);\n      return;\n    }\n\n    const overId = over.data.current?.columnId as string;\n    // column order did not change\n    if (overId === activeId) {\n      resetDraggingAndFocusLastActive(activeId);\n      return;\n    }\n\n    // Update the column order if dropped on a valid target\n    const { fromIndex, toIndex } = getDragIndexes(\n      localColumnOrder,\n      activeId,\n      overId,\n    );\n\n    const columnsToMove: string[] = [activeId];\n    if (activeColumn.columns.length > 0) {\n      // move all child columns if a parent column is moved\n      const childColumnIds = getLeafColumnsForColumn(\n        activeColumn,\n        localColumnOrder,\n      );\n      columnsToMove.push(...childColumnIds);\n    }\n\n    const directionOffset = fromIndex < toIndex ? 1 : -1;\n    const adjustedTargetIndex =\n      fromIndex < toIndex\n        ? Math.max(0, toIndex - columnsToMove.length + directionOffset)\n        : toIndex;\n\n    const newColumnOrder = [...localColumnOrder];\n    newColumnOrder.splice(fromIndex, columnsToMove.length);\n    newColumnOrder.splice(adjustedTargetIndex, 0, ...columnsToMove);\n    updateLocalColumnOrder(newColumnOrder);\n    resetDraggingAndFocusLastActive(activeId);\n  };\n\n  const onDragCancel = (): void => {\n    const activeId = draggingColumnInfo?.id;\n    if (activeId) {\n      resetDraggingAndFocusLastActive(activeId);\n    }\n  };\n\n  return (\n    <DragAndDropContext\n      // when the column order is updated, the DOM elements are re-rendered and the focus is lost\n      // therefore, we need to manually restore the focus to the last active drag handle\n      accessibility={{ restoreFocus: false }}\n      sensors={sensors}\n      collisionDetection={columnsListCollisionDetection}\n      modifiers={[restrictToColumnsListAreaModifier]}\n      onDragStart={handleOnDragStart}\n      onDragOver={handleOnDragOver}\n      onDragEnd={handleOnDragEnd}\n      onDragCancel={onDragCancel}\n    >\n      {children}\n      <DragOverlay\n        dropAnimation={null}\n        className={clsx(styles.columnDndOverlay)}\n        style={{\n          height: dragOverlaySize.height,\n          width: dragOverlaySize.width,\n        }}\n      >\n        <div\n          ref={(node) => {\n            dragOverlayContent && node?.appendChild(dragOverlayContent);\n          }}\n        />\n      </DragOverlay>\n    </DragAndDropContext>\n  );\n}\n"],
+  "mappings": "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",
   "names": ["dragOverlaySize"]
 }

package/esm/tables/DataTable/components/Toolbar/ColumnSettings/ColumnOrderSettings/ColumnOrderSettingsDragAndDrop.sty.js

@@ -1,7 +1,7 @@
 import "./ColumnOrderSettingsDragAndDrop.css";
-var columnDndHandle = "_11d1m5j1-3-9-0";
-var columnDndOverlay = "_11d1m5j0-3-9-0";
-var disabledNonTargetLocalColumn = "_11d1m5j2-3-9-0";
+var columnDndHandle = "_11d1m5j1-3-10-0";
+var columnDndOverlay = "_11d1m5j0-3-10-0";
+var disabledNonTargetLocalColumn = "_11d1m5j2-3-10-0";
 export {
   columnDndHandle,
   columnDndOverlay,

package/esm/tables/DataTable/components/Toolbar/ColumnSettings/ColumnOrderSettings/ColumnOrderSettingsDragAndDrop.sty.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../../../../src/tables/DataTable/components/Toolbar/ColumnSettings/ColumnOrderSettings/ColumnOrderSettingsDragAndDrop.css.ts"],
-  "sourcesContent": ["import './ColumnOrderSettingsDragAndDrop.css';\nexport var columnDndHandle = '_11d1m5j1-3-9-0';\nexport var columnDndOverlay = '_11d1m5j0-3-9-0';\nexport var disabledNonTargetLocalColumn = '_11d1m5j2-3-9-0';"],
+  "sourcesContent": ["import './ColumnOrderSettingsDragAndDrop.css';\nexport var columnDndHandle = '_11d1m5j1-3-10-0';\nexport var columnDndOverlay = '_11d1m5j0-3-10-0';\nexport var disabledNonTargetLocalColumn = '_11d1m5j2-3-10-0';"],
   "mappings": "AAAA,OAAO;AACA,IAAI,kBAAkB;AACtB,IAAI,mBAAmB;AACvB,IAAI,+BAA+B;",
   "names": []
 }

package/esm/tables/DataTable/components/Toolbar/ColumnSettings/ColumnPinningMenu.js

@@ -55,7 +55,7 @@ function ColumnPinningMenu(props) {
         Menu.Item,
         {
           onSelect: () => pin("left"),
-          "data-dt-name": "ColumnSettingsPinLeft",
+          "data-dt-children-name": "ColumnSettingsPinLeft",
           children: /* @__PURE__ */ jsx(FormattedMessage, { ...dataTableMessages.pinColumnLeftLabel })
         }
       ),
@@ -63,7 +63,7 @@ function ColumnPinningMenu(props) {
         Menu.Item,
         {
           onSelect: () => pin("right"),
-          "data-dt-name": "ColumnSettingsPinRight",
+          "data-dt-children-name": "ColumnSettingsPinRight",
           children: /* @__PURE__ */ jsx(FormattedMessage, { ...dataTableMessages.pinColumnRightLabel })
         }
       ),
@@ -71,7 +71,7 @@ function ColumnPinningMenu(props) {
         Menu.Item,
         {
           onSelect: () => pin(false),
-          "data-dt-name": "ColumnSettingsUnpin",
+          "data-dt-children-name": "ColumnSettingsUnpin",
           children: /* @__PURE__ */ jsx(FormattedMessage, { ...dataTableMessages.unpinColumnLabel })
         }
       )

package/esm/tables/DataTable/components/Toolbar/ColumnSettings/ColumnPinningMenu.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../../../src/tables/DataTable/components/Toolbar/ColumnSettings/ColumnPinningMenu.tsx"],
-  "sourcesContent": ["import type {\n  ColumnPinningPosition,\n  ColumnPinningState,\n  RowData,\n  TableFeatures,\n} from '@tanstack/react-table';\nimport { JSX } from 'react';\nimport { FormattedMessage, useIntl } from 'react-intl';\n\nimport { PinIcon, UnpinIcon } from '@dynatrace/strato-icons';\n\nimport type { ColumnListItem } from './column-settings-types.js';\nimport { Button } from '../../../../../buttons/button/Button.js';\nimport { Menu } from '../../../../../navigation/menu/Menu.js';\nimport { Tooltip } from '../../../../../overlays/tooltip/Tooltip.js';\nimport { pinColumns } from '../../../features/ColumnPinning/column-pinning-utils.js';\nimport { dataTableMessages } from '../../../messages.js';\n\ninterface ColumnPinningMenuProps<\n  TFeatures extends TableFeatures,\n  TData extends RowData,\n> {\n  /**\n   * The column to render the pinning menu for.\n   */\n  column: ColumnListItem<TFeatures, TData>;\n  /**\n   * The ordered flat columns, grouped by pinning position.\n   */\n  orderedFlatColumns: {\n    left: ColumnListItem<TFeatures, TData>[];\n    center: ColumnListItem<TFeatures, TData>[];\n    right: ColumnListItem<TFeatures, TData>[];\n  };\n  /**\n   * The column pinning state in the settings modal.\n   */\n  localColumnPinning: ColumnPinningState;\n  /**\n   * Callback to update the pinning state in the settings modal.\n   */\n  updateLocalColumnPinning: (newState: ColumnPinningState) => void;\n}\n\n/**\n * Menu component for pinning/unpinning columns in the DataTable column settings.\n * @internal\n */\nexport function ColumnPinningMenu<\n  TFeatures extends TableFeatures,\n  TData extends RowData,\n>(props: Readonly<ColumnPinningMenuProps<TFeatures, TData>>): JSX.Element {\n  const {\n    column,\n    orderedFlatColumns,\n    localColumnPinning,\n    updateLocalColumnPinning,\n  } = props;\n\n  const intl = useIntl();\n  const columnId = column.id;\n  const pinnedPosition = column.pinned;\n  const pinningLabel = intl.formatMessage(dataTableMessages.pinColumnLabel, {\n    isUnpinned: pinnedPosition === false,\n  });\n\n  /**\n   * Returns all columns that belong to the same pinning region as the current column.\n   * If the current column is not pinned, the function returns the unpinned (\"center\") columns.\n   *\n   * @returns An array of columns from the same pinning region (left, right, or unpinned).\n   */\n  function getColumnsInSamePinningRegion(): ColumnListItem<TFeatures, TData>[] {\n    const position = pinnedPosition === false ? 'center' : pinnedPosition;\n    return orderedFlatColumns[position];\n  }\n\n  /**\n   * Returns the ID of the current column or, if it has nested columns,\n   * the IDs of its nested child columns in the same pinning region (left, right, or unpinned).\n   *\n   * @returns An array of column IDs that should be pinned or unpinned together.\n   */\n  function getIdsToPin(): string[] {\n    const hasNestedColumns = column.columns.length;\n    if (!hasNestedColumns) {\n      return [columnId];\n    }\n\n    const idsToPin: string[] = [];\n    const columns = getColumnsInSamePinningRegion();\n\n    // find parent column\n    // use key instead of ID, as the same parent (with same ID) can appear multiple times,\n    // even within the same pinned area\n    const startIndex = columns.findIndex((col) => col.key === column.key);\n    if (startIndex < 0) {\n      return [];\n    }\n    // get first nested child\n    let index = startIndex + 1;\n    let current = columns.at(index);\n    // collect all adjacent children\n    while (current?.parent?.id === columnId) {\n      idsToPin.push(current.id);\n      index++;\n      current = columns.at(index);\n    }\n    return idsToPin;\n  }\n\n  const pin = (position: ColumnPinningPosition): void => {\n    const idsToPin = getIdsToPin();\n    const newState = pinColumns(idsToPin, localColumnPinning, position);\n    updateLocalColumnPinning(newState);\n  };\n\n  return (\n    <Tooltip text={pinningLabel} placement=\"right\">\n      <Menu>\n        <Menu.Trigger>\n          <Button size=\"condensed\" aria-label={pinningLabel}>\n            <Button.Prefix>\n              {pinnedPosition === false ? <PinIcon /> : <UnpinIcon />}\n            </Button.Prefix>\n          </Button>\n        </Menu.Trigger>\n        <Menu.Content>\n          {pinnedPosition !== 'left' && (\n            <Menu.Item\n              onSelect={() => pin('left')}\n              data-dt-name=\"ColumnSettingsPinLeft\"\n            >\n              <FormattedMessage {...dataTableMessages.pinColumnLeftLabel} />\n            </Menu.Item>\n          )}\n          {pinnedPosition !== 'right' && (\n            <Menu.Item\n              onSelect={() => pin('right')}\n              data-dt-name=\"ColumnSettingsPinRight\"\n            >\n              <FormattedMessage {...dataTableMessages.pinColumnRightLabel} />\n            </Menu.Item>\n          )}\n          {pinnedPosition !== false && (\n            <Menu.Item\n              onSelect={() => pin(false)}\n              data-dt-name=\"ColumnSettingsUnpin\"\n            >\n              <FormattedMessage {...dataTableMessages.unpinColumnLabel} />\n            </Menu.Item>\n          )}\n        </Menu.Content>\n      </Menu>\n    </Tooltip>\n  );\n}\n"],
-  "mappings": "AA2H0C,cAIlC,YAJkC;AApH1C,SAAS,kBAAkB,eAAe;AAE1C,SAAS,SAAS,iBAAiB;AAGnC,SAAS,cAAc;AACvB,SAAS,YAAY;AACrB,SAAS,eAAe;AACxB,SAAS,kBAAkB;AAC3B,SAAS,yBAAyB;AAgC3B,SAAS,kBAGd,OAAwE;AACxE,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,IAAI;AAEJ,QAAM,OAAO,QAAQ;AACrB,QAAM,WAAW,OAAO;AACxB,QAAM,iBAAiB,OAAO;AAC9B,QAAM,eAAe,KAAK,cAAc,kBAAkB,gBAAgB;AAAA,IACxE,YAAY,mBAAmB;AAAA,EACjC,CAAC;AAQD,WAAS,gCAAoE;AAC3E,UAAM,WAAW,mBAAmB,QAAQ,WAAW;AACvD,WAAO,mBAAmB,QAAQ;AAAA,EACpC;AAQA,WAAS,cAAwB;AAC/B,UAAM,mBAAmB,OAAO,QAAQ;AACxC,QAAI,CAAC,kBAAkB;AACrB,aAAO,CAAC,QAAQ;AAAA,IAClB;AAEA,UAAM,WAAqB,CAAC;AAC5B,UAAM,UAAU,8BAA8B;AAK9C,UAAM,aAAa,QAAQ,UAAU,CAAC,QAAQ,IAAI,QAAQ,OAAO,GAAG;AACpE,QAAI,aAAa,GAAG;AAClB,aAAO,CAAC;AAAA,IACV;AAEA,QAAI,QAAQ,aAAa;AACzB,QAAI,UAAU,QAAQ,GAAG,KAAK;AAE9B,WAAO,SAAS,QAAQ,OAAO,UAAU;AACvC,eAAS,KAAK,QAAQ,EAAE;AACxB;AACA,gBAAU,QAAQ,GAAG,KAAK;AAAA,IAC5B;AACA,WAAO;AAAA,EACT;AAEA,QAAM,MAAM,CAAC,aAA0C;AACrD,UAAM,WAAW,YAAY;AAC7B,UAAM,WAAW,WAAW,UAAU,oBAAoB,QAAQ;AAClE,6BAAyB,QAAQ;AAAA,EACnC;AAEA,SACE,oBAAC,WAAQ,MAAM,cAAc,WAAU,SACrC,+BAAC,QACC;AAAA,wBAAC,KAAK,SAAL,EACC,8BAAC,UAAO,MAAK,aAAY,cAAY,cACnC,8BAAC,OAAO,QAAP,EACE,6BAAmB,QAAQ,oBAAC,WAAQ,IAAK,oBAAC,aAAU,GACvD,GACF,GACF;AAAA,IACA,qBAAC,KAAK,SAAL,EACE;AAAA,yBAAmB,UAClB;AAAA,QAAC,KAAK;AAAA,QAAL;AAAA,UACC,UAAU,MAAM,IAAI,MAAM;AAAA,UAC1B,gBAAa;AAAA,UAEb,8BAAC,oBAAkB,GAAG,kBAAkB,oBAAoB;AAAA;AAAA,MAC9D;AAAA,MAED,mBAAmB,WAClB;AAAA,QAAC,KAAK;AAAA,QAAL;AAAA,UACC,UAAU,MAAM,IAAI,OAAO;AAAA,UAC3B,gBAAa;AAAA,UAEb,8BAAC,oBAAkB,GAAG,kBAAkB,qBAAqB;AAAA;AAAA,MAC/D;AAAA,MAED,mBAAmB,SAClB;AAAA,QAAC,KAAK;AAAA,QAAL;AAAA,UACC,UAAU,MAAM,IAAI,KAAK;AAAA,UACzB,gBAAa;AAAA,UAEb,8BAAC,oBAAkB,GAAG,kBAAkB,kBAAkB;AAAA;AAAA,MAC5D;AAAA,OAEJ;AAAA,KACF,GACF;AAEJ;",
+  "sourcesContent": ["import type {\n  ColumnPinningPosition,\n  ColumnPinningState,\n  RowData,\n  TableFeatures,\n} from '@tanstack/react-table';\nimport { JSX } from 'react';\nimport { FormattedMessage, useIntl } from 'react-intl';\n\nimport { PinIcon, UnpinIcon } from '@dynatrace/strato-icons';\n\nimport type { ColumnListItem } from './column-settings-types.js';\nimport { Button } from '../../../../../buttons/button/Button.js';\nimport { Menu } from '../../../../../navigation/menu/Menu.js';\nimport { Tooltip } from '../../../../../overlays/tooltip/Tooltip.js';\nimport { pinColumns } from '../../../features/ColumnPinning/column-pinning-utils.js';\nimport { dataTableMessages } from '../../../messages.js';\n\ninterface ColumnPinningMenuProps<\n  TFeatures extends TableFeatures,\n  TData extends RowData,\n> {\n  /**\n   * The column to render the pinning menu for.\n   */\n  column: ColumnListItem<TFeatures, TData>;\n  /**\n   * The ordered flat columns, grouped by pinning position.\n   */\n  orderedFlatColumns: {\n    left: ColumnListItem<TFeatures, TData>[];\n    center: ColumnListItem<TFeatures, TData>[];\n    right: ColumnListItem<TFeatures, TData>[];\n  };\n  /**\n   * The column pinning state in the settings modal.\n   */\n  localColumnPinning: ColumnPinningState;\n  /**\n   * Callback to update the pinning state in the settings modal.\n   */\n  updateLocalColumnPinning: (newState: ColumnPinningState) => void;\n}\n\n/**\n * Menu component for pinning/unpinning columns in the DataTable column settings.\n * @internal\n */\nexport function ColumnPinningMenu<\n  TFeatures extends TableFeatures,\n  TData extends RowData,\n>(props: Readonly<ColumnPinningMenuProps<TFeatures, TData>>): JSX.Element {\n  const {\n    column,\n    orderedFlatColumns,\n    localColumnPinning,\n    updateLocalColumnPinning,\n  } = props;\n\n  const intl = useIntl();\n  const columnId = column.id;\n  const pinnedPosition = column.pinned;\n  const pinningLabel = intl.formatMessage(dataTableMessages.pinColumnLabel, {\n    isUnpinned: pinnedPosition === false,\n  });\n\n  /**\n   * Returns all columns that belong to the same pinning region as the current column.\n   * If the current column is not pinned, the function returns the unpinned (\"center\") columns.\n   *\n   * @returns An array of columns from the same pinning region (left, right, or unpinned).\n   */\n  function getColumnsInSamePinningRegion(): ColumnListItem<TFeatures, TData>[] {\n    const position = pinnedPosition === false ? 'center' : pinnedPosition;\n    return orderedFlatColumns[position];\n  }\n\n  /**\n   * Returns the ID of the current column or, if it has nested columns,\n   * the IDs of its nested child columns in the same pinning region (left, right, or unpinned).\n   *\n   * @returns An array of column IDs that should be pinned or unpinned together.\n   */\n  function getIdsToPin(): string[] {\n    const hasNestedColumns = column.columns.length;\n    if (!hasNestedColumns) {\n      return [columnId];\n    }\n\n    const idsToPin: string[] = [];\n    const columns = getColumnsInSamePinningRegion();\n\n    // find parent column\n    // use key instead of ID, as the same parent (with same ID) can appear multiple times,\n    // even within the same pinned area\n    const startIndex = columns.findIndex((col) => col.key === column.key);\n    if (startIndex < 0) {\n      return [];\n    }\n    // get first nested child\n    let index = startIndex + 1;\n    let current = columns.at(index);\n    // collect all adjacent children\n    while (current?.parent?.id === columnId) {\n      idsToPin.push(current.id);\n      index++;\n      current = columns.at(index);\n    }\n    return idsToPin;\n  }\n\n  const pin = (position: ColumnPinningPosition): void => {\n    const idsToPin = getIdsToPin();\n    const newState = pinColumns(idsToPin, localColumnPinning, position);\n    updateLocalColumnPinning(newState);\n  };\n\n  return (\n    <Tooltip text={pinningLabel} placement=\"right\">\n      <Menu>\n        <Menu.Trigger>\n          <Button size=\"condensed\" aria-label={pinningLabel}>\n            <Button.Prefix>\n              {pinnedPosition === false ? <PinIcon /> : <UnpinIcon />}\n            </Button.Prefix>\n          </Button>\n        </Menu.Trigger>\n        <Menu.Content>\n          {pinnedPosition !== 'left' && (\n            <Menu.Item\n              onSelect={() => pin('left')}\n              data-dt-children-name=\"ColumnSettingsPinLeft\"\n            >\n              <FormattedMessage {...dataTableMessages.pinColumnLeftLabel} />\n            </Menu.Item>\n          )}\n          {pinnedPosition !== 'right' && (\n            <Menu.Item\n              onSelect={() => pin('right')}\n              data-dt-children-name=\"ColumnSettingsPinRight\"\n            >\n              <FormattedMessage {...dataTableMessages.pinColumnRightLabel} />\n            </Menu.Item>\n          )}\n          {pinnedPosition !== false && (\n            <Menu.Item\n              onSelect={() => pin(false)}\n              data-dt-children-name=\"ColumnSettingsUnpin\"\n            >\n              <FormattedMessage {...dataTableMessages.unpinColumnLabel} />\n            </Menu.Item>\n          )}\n        </Menu.Content>\n      </Menu>\n    </Tooltip>\n  );\n}\n"],
+  "mappings": "AA2H0C,cAIlC,YAJkC;AApH1C,SAAS,kBAAkB,eAAe;AAE1C,SAAS,SAAS,iBAAiB;AAGnC,SAAS,cAAc;AACvB,SAAS,YAAY;AACrB,SAAS,eAAe;AACxB,SAAS,kBAAkB;AAC3B,SAAS,yBAAyB;AAgC3B,SAAS,kBAGd,OAAwE;AACxE,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,IAAI;AAEJ,QAAM,OAAO,QAAQ;AACrB,QAAM,WAAW,OAAO;AACxB,QAAM,iBAAiB,OAAO;AAC9B,QAAM,eAAe,KAAK,cAAc,kBAAkB,gBAAgB;AAAA,IACxE,YAAY,mBAAmB;AAAA,EACjC,CAAC;AAQD,WAAS,gCAAoE;AAC3E,UAAM,WAAW,mBAAmB,QAAQ,WAAW;AACvD,WAAO,mBAAmB,QAAQ;AAAA,EACpC;AAQA,WAAS,cAAwB;AAC/B,UAAM,mBAAmB,OAAO,QAAQ;AACxC,QAAI,CAAC,kBAAkB;AACrB,aAAO,CAAC,QAAQ;AAAA,IAClB;AAEA,UAAM,WAAqB,CAAC;AAC5B,UAAM,UAAU,8BAA8B;AAK9C,UAAM,aAAa,QAAQ,UAAU,CAAC,QAAQ,IAAI,QAAQ,OAAO,GAAG;AACpE,QAAI,aAAa,GAAG;AAClB,aAAO,CAAC;AAAA,IACV;AAEA,QAAI,QAAQ,aAAa;AACzB,QAAI,UAAU,QAAQ,GAAG,KAAK;AAE9B,WAAO,SAAS,QAAQ,OAAO,UAAU;AACvC,eAAS,KAAK,QAAQ,EAAE;AACxB;AACA,gBAAU,QAAQ,GAAG,KAAK;AAAA,IAC5B;AACA,WAAO;AAAA,EACT;AAEA,QAAM,MAAM,CAAC,aAA0C;AACrD,UAAM,WAAW,YAAY;AAC7B,UAAM,WAAW,WAAW,UAAU,oBAAoB,QAAQ;AAClE,6BAAyB,QAAQ;AAAA,EACnC;AAEA,SACE,oBAAC,WAAQ,MAAM,cAAc,WAAU,SACrC,+BAAC,QACC;AAAA,wBAAC,KAAK,SAAL,EACC,8BAAC,UAAO,MAAK,aAAY,cAAY,cACnC,8BAAC,OAAO,QAAP,EACE,6BAAmB,QAAQ,oBAAC,WAAQ,IAAK,oBAAC,aAAU,GACvD,GACF,GACF;AAAA,IACA,qBAAC,KAAK,SAAL,EACE;AAAA,yBAAmB,UAClB;AAAA,QAAC,KAAK;AAAA,QAAL;AAAA,UACC,UAAU,MAAM,IAAI,MAAM;AAAA,UAC1B,yBAAsB;AAAA,UAEtB,8BAAC,oBAAkB,GAAG,kBAAkB,oBAAoB;AAAA;AAAA,MAC9D;AAAA,MAED,mBAAmB,WAClB;AAAA,QAAC,KAAK;AAAA,QAAL;AAAA,UACC,UAAU,MAAM,IAAI,OAAO;AAAA,UAC3B,yBAAsB;AAAA,UAEtB,8BAAC,oBAAkB,GAAG,kBAAkB,qBAAqB;AAAA;AAAA,MAC/D;AAAA,MAED,mBAAmB,SAClB;AAAA,QAAC,KAAK;AAAA,QAAL;AAAA,UACC,UAAU,MAAM,IAAI,KAAK;AAAA,UACzB,yBAAsB;AAAA,UAEtB,8BAAC,oBAAkB,GAAG,kBAAkB,kBAAkB;AAAA;AAAA,MAC5D;AAAA,OAEJ;AAAA,KACF,GACF;AAEJ;",
   "names": []
 }

package/esm/tables/DataTable/components/Toolbar/ColumnSettings/DataTableAllColumnsHiddenEmptyState.css

@@ -0,0 +1,3 @@
+._srhgvd0-3-10-0 {
+  text-align: center;
+}

package/esm/tables/DataTable/components/Toolbar/ColumnSettings/DataTableAllColumnsHiddenEmptyState.js

@@ -0,0 +1,47 @@
+import { jsx, jsxs } from "react/jsx-runtime";
+import { useIntl } from "react-intl";
+import { HideIcon } from "@dynatrace/strato-icons";
+import * as styles from "./DataTableAllColumnsHiddenEmptyState.sty.js";
+import { Button } from "../../../../../buttons/button/Button.js";
+import { Flex } from "../../../../../layouts/flex/Flex.js";
+import { globalSprinkles } from "../../../../../styles/safe-sprinkles.js";
+import { Heading } from "../../../../../typography/heading/Heading.js";
+import { Text } from "../../../../../typography/text/Text.js";
+import { dataTableMessages } from "../../../messages.js";
+function DataTableAllColumnsHiddenEmptyState({
+  onListHiddenColumns
+}) {
+  const intl = useIntl();
+  return /* @__PURE__ */ jsxs(
+    Flex,
+    {
+      flexDirection: "column",
+      alignItems: "center",
+      justifyContent: "center",
+      flex: 1,
+      paddingY: 24,
+      paddingX: 16,
+      gap: 8,
+      className: styles.emptyState,
+      children: [
+        /* @__PURE__ */ jsx(HideIcon, {}),
+        /* @__PURE__ */ jsx(Heading, { level: 6, as: "h2", children: intl.formatMessage(dataTableMessages.allColumnsHiddenTitle) }),
+        /* @__PURE__ */ jsx(Text, { children: intl.formatMessage(dataTableMessages.allColumnsHiddenDescription) }),
+        /* @__PURE__ */ jsx(
+          Button,
+          {
+            variant: "emphasized",
+            className: globalSprinkles({ marginTop: 8 }),
+            onClick: onListHiddenColumns,
+            "data-dt-children-name": "ColumnSettingsListHiddenColumnsAction",
+            children: intl.formatMessage(dataTableMessages.listHiddenColumnsAction)
+          }
+        )
+      ]
+    }
+  );
+}
+export {
+  DataTableAllColumnsHiddenEmptyState
+};
+//# sourceMappingURL=DataTableAllColumnsHiddenEmptyState.js.map

package/esm/tables/DataTable/components/Toolbar/ColumnSettings/DataTableAllColumnsHiddenEmptyState.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../../../../src/tables/DataTable/components/Toolbar/ColumnSettings/DataTableAllColumnsHiddenEmptyState.tsx"],
+  "sourcesContent": ["import { type JSX } from 'react';\nimport { useIntl } from 'react-intl';\n\nimport { HideIcon } from '@dynatrace/strato-icons';\n\nimport * as styles from './DataTableAllColumnsHiddenEmptyState.sty.js';\nimport { Button } from '../../../../../buttons/button/Button.js';\nimport { Flex } from '../../../../../layouts/flex/Flex.js';\nimport { globalSprinkles } from '../../../../../styles/safe-sprinkles.js';\nimport { Heading } from '../../../../../typography/heading/Heading.js';\nimport { Text } from '../../../../../typography/text/Text.js';\nimport { dataTableMessages } from '../../../messages.js';\n\n/**\n * Props for the empty state shown when all columns are hidden and hidden-column listing is disabled.\n * @internal\n */\ninterface DataTableAllColumnsHiddenEmptyStateProps {\n  /**\n   * Callback invoked when the user clicks the CTA to enable the \"list hidden columns\" switch.\n   */\n  onListHiddenColumns: () => void;\n}\n\n/**\n * Empty state shown in the column settings modal when all columns are hidden\n * and the \"list hidden columns\" switch is off.\n * @internal\n */\nexport function DataTableAllColumnsHiddenEmptyState({\n  onListHiddenColumns,\n}: Readonly<DataTableAllColumnsHiddenEmptyStateProps>): JSX.Element {\n  const intl = useIntl();\n\n  return (\n    <Flex\n      flexDirection=\"column\"\n      alignItems=\"center\"\n      justifyContent=\"center\"\n      flex={1}\n      paddingY={24}\n      paddingX={16}\n      gap={8}\n      className={styles.emptyState}\n    >\n      <HideIcon />\n      <Heading level={6} as=\"h2\">\n        {intl.formatMessage(dataTableMessages.allColumnsHiddenTitle)}\n      </Heading>\n      <Text>\n        {intl.formatMessage(dataTableMessages.allColumnsHiddenDescription)}\n      </Text>\n      <Button\n        variant=\"emphasized\"\n        className={globalSprinkles({ marginTop: 8 })}\n        onClick={onListHiddenColumns}\n        data-dt-children-name=\"ColumnSettingsListHiddenColumnsAction\"\n      >\n        {intl.formatMessage(dataTableMessages.listHiddenColumnsAction)}\n      </Button>\n    </Flex>\n  );\n}\n"],
+  "mappings": "AAmCI,SAUE,KAVF;AAlCJ,SAAS,eAAe;AAExB,SAAS,gBAAgB;AAEzB,YAAY,YAAY;AACxB,SAAS,cAAc;AACvB,SAAS,YAAY;AACrB,SAAS,uBAAuB;AAChC,SAAS,eAAe;AACxB,SAAS,YAAY;AACrB,SAAS,yBAAyB;AAkB3B,SAAS,oCAAoC;AAAA,EAClD;AACF,GAAoE;AAClE,QAAM,OAAO,QAAQ;AAErB,SACE;AAAA,IAAC;AAAA;AAAA,MACC,eAAc;AAAA,MACd,YAAW;AAAA,MACX,gBAAe;AAAA,MACf,MAAM;AAAA,MACN,UAAU;AAAA,MACV,UAAU;AAAA,MACV,KAAK;AAAA,MACL,WAAW,OAAO;AAAA,MAElB;AAAA,4BAAC,YAAS;AAAA,QACV,oBAAC,WAAQ,OAAO,GAAG,IAAG,MACnB,eAAK,cAAc,kBAAkB,qBAAqB,GAC7D;AAAA,QACA,oBAAC,QACE,eAAK,cAAc,kBAAkB,2BAA2B,GACnE;AAAA,QACA;AAAA,UAAC;AAAA;AAAA,YACC,SAAQ;AAAA,YACR,WAAW,gBAAgB,EAAE,WAAW,EAAE,CAAC;AAAA,YAC3C,SAAS;AAAA,YACT,yBAAsB;AAAA,YAErB,eAAK,cAAc,kBAAkB,uBAAuB;AAAA;AAAA,QAC/D;AAAA;AAAA;AAAA,EACF;AAEJ;",
+  "names": []
+}

package/esm/tables/DataTable/components/Toolbar/ColumnSettings/DataTableAllColumnsHiddenEmptyState.sty.js

@@ -0,0 +1,6 @@
+import "./DataTableAllColumnsHiddenEmptyState.css";
+var emptyState = "_srhgvd0-3-10-0";
+export {
+  emptyState
+};
+//# sourceMappingURL=DataTableAllColumnsHiddenEmptyState.sty.js.map

package/esm/tables/DataTable/components/Toolbar/ColumnSettings/DataTableAllColumnsHiddenEmptyState.sty.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../../../../src/tables/DataTable/components/Toolbar/ColumnSettings/DataTableAllColumnsHiddenEmptyState.css.ts"],
+  "sourcesContent": ["import './DataTableAllColumnsHiddenEmptyState.css';\nexport var emptyState = '_srhgvd0-3-10-0';"],
+  "mappings": "AAAA,OAAO;AACA,IAAI,aAAa;",
+  "names": []
+}

package/esm/tables/DataTable/components/Toolbar/ColumnSettings/DataTableColumnSettingsModal.js

@@ -1,15 +1,18 @@
 import { jsx, jsxs } from "react/jsx-runtime";
 import {
   forwardRef,
+  useCallback,
+  useEffect,
   useImperativeHandle,
   useMemo,
+  useRef,
   useState
 } from "react";
 import { useIntl } from "react-intl";
 import {
   generateColumnOrderWithParentIds,
   generateColumnVisibilityObject,
-  getCombinedVisibilityCheckboxState,
+  getCombinedVisibilityState,
   getHasColumnOrderChanged,
   getHasColumnPinningChanged,
   getHasVisibilityChanged,
@@ -19,8 +22,10 @@ import {
   getIsSettingEnabled,
   resolveEffectiveLimit
 } from "./column-settings-utils.js";
+import { DataTableAllColumnsHiddenEmptyState } from "./DataTableAllColumnsHiddenEmptyState.js";
 import { DataTableColumnsList } from "./DataTableColumnsList.js";
 import { DataTableVisibilityFilterControls } from "./DataTableVisibilityFilterControls.js";
+import { Flex } from "../../../../../layouts/flex/Flex.js";
 import { useDataTable } from "../../../contexts/DataTableContext.js";
 import { dataTableMessages } from "../../../messages.js";
 import { DataTableSettingsModal } from "../../SettingsModal/DataTableSettingsModal.js";
@@ -75,7 +80,12 @@ function ColumnSettingsModal(props) {
     table.getColumn,
     table.atoms.columnOrder?.get() ?? []
   );
+  const [filterInputValue, setFilterInputValue] = useState("");
   const [activeFilterValue, setActiveFilterValue] = useState("");
+  const clearFilter = useCallback(() => {
+    setFilterInputValue("");
+    setActiveFilterValue("");
+  }, []);
   const initialColumnVisibility = useMemo(
     () => generateColumnVisibilityObject(leafColumnsWithoutBuiltin),
     [leafColumnsWithoutBuiltin]
@@ -88,6 +98,32 @@ function ColumnSettingsModal(props) {
   );
   const [showResetStatus, setShowResetStatus] = useState(false);
   const [showMinError, setShowMinError] = useState(false);
+  const [listHiddenColumns, setListHiddenColumns] = useState(true);
+  const onListHiddenColumnsChange = () => {
+    setListHiddenColumns((prev) => !prev);
+  };
+  const contentRef = useRef(null);
+  useEffect(() => {
+    const contentNode = contentRef.current;
+    if (!contentNode) {
+      return;
+    }
+    const modalDialog = contentNode.closest('[role="dialog"]');
+    if (!modalDialog) {
+      return;
+    }
+    const observer = new ResizeObserver((entries) => {
+      const height = entries[0]?.contentRect?.height;
+      if (height && height > 0) {
+        modalDialog.style.minHeight = CSS.supports("min-height", "1dvh") ? `min(${height}px, 96dvh)` : `min(${height}px, 96vh)`;
+        observer.disconnect();
+      }
+    });
+    observer.observe(modalDialog);
+    return () => {
+      observer.disconnect();
+    };
+  }, []);
   const columnOrderToReset = getOverrideValue(columnOrderOverride, "resetColumnOrder") ?? resetColumnOrder ?? table.options.originalColumnOrder;
   const columnVisibilityToReset = getOverrideValue(visibilityOverride, "resetColumnVisibility") ?? resetColumnVisibility ?? table.options.originalColumnVisibility;
   const columnPinningToReset = getOverrideValue(columnPinningOverride, "resetColumnPinning") ?? resetColumnPinning ?? table.options.originalColumnPinning;
@@ -109,13 +145,16 @@ function ColumnSettingsModal(props) {
     },
     localColumnPinning
   );
-  const showHideAllState = getCombinedVisibilityCheckboxState(
+  const showHideAllState = getCombinedVisibilityState(
     localColumnVisibility,
-    leafColumnsWithoutBuiltin
+    leafColumnsWithoutBuiltin,
+    true
   );
   const visibleColumnCount = Object.values(localColumnVisibility).filter(
     Boolean
   ).length;
+  const totalColumnCount = Object.values(localColumnVisibility).length;
+  const hiddenColumnCount = totalColumnCount - visibleColumnCount;
   const exceedsError = errorLimit !== void 0 && visibleColumnCount > errorLimit;
   const limitMessage = getVisibilityLimitMessage(
     showMinError,
@@ -151,19 +190,36 @@ function ColumnSettingsModal(props) {
     setLocalColumnPinning(newState);
     showResetStatus && setShowResetStatus(false);
   };
-  const onShowHideAllChange = () => {
+  const clearStatusMessages = () => {
+    showResetStatus && setShowResetStatus(false);
+    showMinError && setShowMinError(false);
+  };
+  const onShowAll = () => {
     setLocalColumnVisibility(
       (prevState) => getMultipleLocalColumnVisibility(
         leafColumnsWithoutBuiltin,
-        showHideAllState,
+        // passing false sets all hideable columns to visible
+        false,
         prevState
       )
     );
-    showResetStatus && setShowResetStatus(false);
-    showMinError && setShowMinError(false);
+    clearStatusMessages();
+  };
+  const onHideAll = () => {
+    setLocalColumnVisibility(
+      (prevState) => getMultipleLocalColumnVisibility(
+        leafColumnsWithoutBuiltin,
+        // passing true sets all hideable columns to hidden
+        true,
+        prevState
+      )
+    );
+    clearStatusMessages();
   };
-  const showVisibilityControl = visibilitySettingsEnabled && activeFilterValue.length === 0;
   const showFilterControl = visibilitySettingsEnabled || columnPinningSettingsEnabled;
+  const showVisibilityControlRow = visibilitySettingsEnabled && !filterInputValue;
+  const effectiveListHiddenColumns = listHiddenColumns || activeFilterValue.length > 0;
+  const showAllColumnsHiddenEmptyState = visibilitySettingsEnabled && visibleColumnCount === 0 && !effectiveListHiddenColumns;
   const onReset = () => {
     let didReset = false;
     if (visibilitySettingsEnabled && columnVisibilityToReset) {
@@ -203,7 +259,7 @@ function ColumnSettingsModal(props) {
     table.setColumnPinning(localColumnPinning);
     onModalClose();
   };
-  return /* @__PURE__ */ jsxs(
+  return /* @__PURE__ */ jsx(
     DataTableSettingsModal,
     {
       title: intl.formatMessage(dataTableMessages.columnSettingsTitle),
@@ -224,35 +280,52 @@ function ColumnSettingsModal(props) {
         cancel: intl.formatMessage(dataTableMessages.cancelButtonText),
         apply: intl.formatMessage(dataTableMessages.applyButtonText)
       },
-      children: [
+      children: /* @__PURE__ */ jsxs(Flex, { ref: contentRef, flexDirection: "column", gap: 12, flex: 1, children: [
         /* @__PURE__ */ jsx(
           DataTableVisibilityFilterControls,
           {
-            showVisibilityControl,
+            showVisibilityControl: visibilitySettingsEnabled,
             showFilterControl,
+            filterValue: filterInputValue,
+            onFilterValueChange: setFilterInputValue,
             setActiveFilterValue,
-            showHideAllState,
-            onShowHideAllChange
+            showAllDisabled: showHideAllState === true,
+            hideAllDisabled: showHideAllState === false,
+            onShowAll,
+            onHideAll,
+            listHiddenColumns,
+            onListHiddenColumnsChange,
+            hiddenColumnCount,
+            visibleColumnCount,
+            totalColumnCount
           }
         ),
-        /* @__PURE__ */ jsx(
+        showAllColumnsHiddenEmptyState ? /* @__PURE__ */ jsx(Flex, { flex: 1, alignItems: "center", justifyContent: "center", children: /* @__PURE__ */ jsx(
+          DataTableAllColumnsHiddenEmptyState,
+          {
+            onListHiddenColumns: onListHiddenColumnsChange
+          }
+        ) }) : /* @__PURE__ */ jsx(
           DataTableColumnsList,
           {
             visibilitySettings: visibilitySettingsEnabled,
             columnOrderSettings: columnOrderSettingsEnabled,
             columnPinningSettings: columnPinningSettingsEnabled,
             activeFilterValue,
+            listHiddenColumns: effectiveListHiddenColumns,
             localColumnVisibility,
             updateLocalColumnVisibility,
             localColumnOrder,
             updateLocalColumnOrder,
             localColumnPinning,
             updateLocalColumnPinning,
-            hasFilterBar: showFilterControl || showVisibilityControl,
-            hasMessage: limitMessage !== void 0
+            hasFilterBar: showFilterControl,
+            hasVisibilityControl: showVisibilityControlRow,
+            hasMessage: limitMessage !== void 0,
+            onClearFilter: clearFilter
           }
         )
-      ]
+      ] })
     }
   );
 }

package/esm/tables/DataTable/components/Toolbar/ColumnSettings/DataTableColumnSettingsModal.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../../../src/tables/DataTable/components/Toolbar/ColumnSettings/DataTableColumnSettingsModal.tsx"],
-  "sourcesContent": ["import {\n  type Column,\n  type ColumnPinningState,\n  type RowData,\n} from '@tanstack/react-table';\nimport {\n  forwardRef,\n  useImperativeHandle,\n  useMemo,\n  useState,\n  type JSX,\n  type Ref,\n} from 'react';\nimport { useIntl } from 'react-intl';\n\nimport type { DataTableColumnSettingsModalRef } from './column-settings-types.js';\nimport {\n  generateColumnOrderWithParentIds,\n  generateColumnVisibilityObject,\n  getCombinedVisibilityCheckboxState,\n  getHasColumnOrderChanged,\n  getHasColumnPinningChanged,\n  getHasVisibilityChanged,\n  getMultipleLocalColumnVisibility,\n  getVisibilityLimitMessage,\n  getOverrideValue,\n  getIsSettingEnabled,\n  resolveEffectiveLimit,\n} from './column-settings-utils.js';\nimport { DataTableColumnsList } from './DataTableColumnsList.js';\nimport { DataTableVisibilityFilterControls } from './DataTableVisibilityFilterControls.js';\nimport { useDataTable } from '../../../contexts/DataTableContext.js';\nimport type { DataTablePinnedColumnState } from '../../../features/ColumnPinning/column-pinning-types.js';\nimport type {\n  DataTableColumnVisibilityState,\n  DataTableVisibleColumnLimits,\n} from '../../../features/ColumnVisibility/column-visibility-types.js';\nimport type { TDataTableFeatures } from '../../../features/types/features.types.js';\nimport { dataTableMessages } from '../../../messages.js';\nimport type { DataTableColumnSettingsConfig } from '../../../public.api.js';\nimport { DataTableSettingsModal } from '../../SettingsModal/DataTableSettingsModal.js';\n\ninterface DataTableColumnSettingsModalProps {\n  /**\n   * Whether column visibility settings are available in the modal.\n   */\n  visibilitySettings: boolean;\n  /**\n   * Whether column order settings are available in the modal.\n   */\n  columnOrderSettings: boolean;\n  /**\n   * Whether column pinning settings are available in the modal.\n   */\n  columnPinningSettings: boolean;\n  /**\n   * Default column visibility when settings are reset.\n   */\n  resetColumnVisibility?: DataTableColumnVisibilityState;\n  /**\n   * Default column order when settings are reset.\n   */\n  resetColumnOrder?: string[];\n  /**\n   * Default column pinning state when settings are reset.\n   */\n  resetColumnPinning?: DataTablePinnedColumnState;\n  /**\n   * Optional upper limits for the number of visible columns from the toolbar slot.\n   */\n  visibleColumnLimits?: DataTableVisibleColumnLimits;\n}\n\n/**\n * Modal combining UI controls for column visibility and column ordering.\n * All changes that made within the modal are only applied once the user click the Confirm button.\n * When clicking Close, the changes won't be applied and discarded.\n */\nfunction ColumnSettingsModal<\n  TFeatures extends TDataTableFeatures,\n  TData extends RowData,\n>(\n  props: DataTableColumnSettingsModalProps & {\n    onModalClose: () => void;\n    columnSettingsOverride?: DataTableColumnSettingsConfig;\n  },\n): JSX.Element {\n  const {\n    visibilitySettings: toolbarVisibilitySettings,\n    columnOrderSettings: toolbarColumnOrderSettings,\n    columnPinningSettings: toolbarColumnPinningSettings,\n    resetColumnOrder,\n    resetColumnVisibility,\n    resetColumnPinning,\n    visibleColumnLimits: slotVisibleColumnLimits,\n    onModalClose,\n    columnSettingsOverride,\n  } = props;\n\n  const intl = useIntl();\n  const table = useDataTable();\n  const leafColumnsWithoutBuiltin = table.getLeafColumnsWithoutBuiltin();\n\n  const visibilityOverride = columnSettingsOverride?.columnVisibility;\n  const columnOrderOverride = columnSettingsOverride?.columnOrder;\n  const columnPinningOverride = columnSettingsOverride?.columnPinning;\n\n  // Programmatic override takes precedence over the slot value\n  const rawVisibleColumnLimits =\n    getOverrideValue(visibilityOverride, 'visibleColumnLimits') ??\n    slotVisibleColumnLimits;\n\n  const mandatoryVisibleColumnsCount = useMemo(\n    () =>\n      leafColumnsWithoutBuiltin.filter(\n        (col) => col.columnDef.enableHiding === false,\n      ).length,\n    [leafColumnsWithoutBuiltin],\n  );\n\n  const { warningLimit, errorLimit } = useMemo(\n    () =>\n      resolveEffectiveLimit(\n        rawVisibleColumnLimits,\n        mandatoryVisibleColumnsCount,\n      ),\n    [rawVisibleColumnLimits, mandatoryVisibleColumnsCount],\n  );\n\n  const visibilitySettingsEnabled = getIsSettingEnabled(\n    visibilityOverride,\n    toolbarVisibilitySettings,\n  );\n  const columnOrderSettingsEnabled = getIsSettingEnabled(\n    columnOrderOverride,\n    toolbarColumnOrderSettings,\n  );\n  const columnPinningSettingsEnabled = getIsSettingEnabled(\n    columnPinningOverride,\n    toolbarColumnPinningSettings,\n  );\n\n  // original column order state\n  const {\n    columnOrderWithParents: tableColumnOrder,\n    uniqueParentIds: allLocalColumnsParentIds,\n  } = generateColumnOrderWithParentIds(\n    table.getColumn,\n    table.atoms.columnOrder?.get() ?? [],\n  );\n\n  const [activeFilterValue, setActiveFilterValue] = useState<string>('');\n\n  // original column visibility state\n  const initialColumnVisibility = useMemo(\n    () => generateColumnVisibilityObject(leafColumnsWithoutBuiltin),\n    [leafColumnsWithoutBuiltin],\n  );\n\n  // current column visibility state while modal is open\n  const [localColumnVisibility, setLocalColumnVisibility] = useState<\n    Record<string, boolean>\n  >(initialColumnVisibility);\n\n  // current column order state while modal is open\n  const [localColumnOrder, setLocalColumnOrder] =\n    useState<string[]>(tableColumnOrder);\n\n  // current column pinning state while modal is open\n  const [localColumnPinning, setLocalColumnPinning] =\n    useState<ColumnPinningState>(\n      // original column pinning state\n      () => table.store.state.columnPinning,\n    );\n\n  // flag whether the \"Reset to default\" status message for screen readers should be displayed\n  const [showResetStatus, setShowResetStatus] = useState(false);\n  // flag whether the lower-bound (min=1) error should be displayed\n  const [showMinError, setShowMinError] = useState(false);\n\n  const columnOrderToReset =\n    getOverrideValue(columnOrderOverride, 'resetColumnOrder') ??\n    resetColumnOrder ??\n    table.options.originalColumnOrder;\n  const columnVisibilityToReset =\n    getOverrideValue(visibilityOverride, 'resetColumnVisibility') ??\n    resetColumnVisibility ??\n    table.options.originalColumnVisibility;\n  const columnPinningToReset =\n    getOverrideValue(columnPinningOverride, 'resetColumnPinning') ??\n    resetColumnPinning ??\n    table.options.originalColumnPinning;\n\n  // Memoize filtered column order for comparison\n  const filteredLocalColumnOrder = useMemo(\n    () =>\n      localColumnOrder.filter(\n        (colId) => !allLocalColumnsParentIds.includes(colId),\n      ),\n    [localColumnOrder, allLocalColumnsParentIds],\n  );\n\n  // checks if local default column visibility has changed\n  const hasVisibilityChanged = useMemo(\n    () =>\n      visibilitySettingsEnabled &&\n      getHasVisibilityChanged(columnVisibilityToReset, localColumnVisibility),\n    [visibilitySettingsEnabled, columnVisibilityToReset, localColumnVisibility],\n  );\n\n  // checks if local default column order has changed\n  const hasColumnOrderChanged =\n    columnOrderSettingsEnabled &&\n    getHasColumnOrderChanged(columnOrderToReset, filteredLocalColumnOrder);\n\n  // checks if local default column pinning state has changed\n  const hasColumnPinningChanged =\n    columnPinningSettingsEnabled &&\n    getHasColumnPinningChanged(\n      {\n        left: columnPinningToReset?.left ?? [],\n        right: columnPinningToReset?.right ?? [],\n      },\n      localColumnPinning,\n    );\n\n  // determines whether all columns are visible\n  const showHideAllState = getCombinedVisibilityCheckboxState(\n    localColumnVisibility,\n    leafColumnsWithoutBuiltin,\n  );\n\n  const visibleColumnCount = Object.values(localColumnVisibility).filter(\n    Boolean,\n  ).length;\n\n  const exceedsError =\n    errorLimit !== undefined && visibleColumnCount > errorLimit;\n\n  const limitMessage = getVisibilityLimitMessage(\n    showMinError,\n    errorLimit,\n    warningLimit,\n    visibleColumnCount,\n    intl,\n  );\n\n  /**\n   * Updates the local column visibility state.\n   * @param column - the column to update.\n   * @param currentVisibilityState - the current visibility state of the column.\n   */\n  const updateLocalColumnVisibility = (\n    column: Column<TFeatures, TData>,\n    currentVisibilityState: boolean | 'indeterminate',\n  ): void => {\n    const childColumns = column.columns;\n    if (childColumns.length === 0) {\n      setLocalColumnVisibility((prevState) => ({\n        ...prevState,\n        [column.id]: !currentVisibilityState,\n      }));\n    } else {\n      setLocalColumnVisibility((prevState) =>\n        getMultipleLocalColumnVisibility(\n          childColumns,\n          currentVisibilityState,\n          prevState,\n        ),\n      );\n    }\n    showResetStatus && setShowResetStatus(false);\n    showMinError && setShowMinError(false);\n  };\n\n  /**\n   * Updates the local column order state.\n   * @param newColumnOrder - the new column order.\n   */\n  const updateLocalColumnOrder = (newColumnOrder: string[]): void => {\n    setLocalColumnOrder(newColumnOrder);\n    showResetStatus && setShowResetStatus(false);\n  };\n\n  /**\n   * Updates the local column pinning state.\n   * @param newState - the new column pinning state.\n   */\n  const updateLocalColumnPinning = (newState: ColumnPinningState): void => {\n    setLocalColumnPinning(newState);\n    showResetStatus && setShowResetStatus(false);\n  };\n\n  const onShowHideAllChange = () => {\n    setLocalColumnVisibility((prevState) =>\n      getMultipleLocalColumnVisibility(\n        leafColumnsWithoutBuiltin,\n        showHideAllState,\n        prevState,\n      ),\n    );\n    showResetStatus && setShowResetStatus(false);\n    showMinError && setShowMinError(false);\n  };\n\n  const showVisibilityControl =\n    visibilitySettingsEnabled && activeFilterValue.length === 0;\n  const showFilterControl =\n    visibilitySettingsEnabled || columnPinningSettingsEnabled;\n\n  const onReset = () => {\n    let didReset = false;\n\n    // reset visibility, order and/or pinning state if they are enabled\n    if (visibilitySettingsEnabled && columnVisibilityToReset) {\n      setLocalColumnVisibility(\n        generateColumnVisibilityObject(\n          leafColumnsWithoutBuiltin,\n          columnVisibilityToReset,\n        ),\n      );\n      didReset = true;\n    }\n\n    if (columnOrderSettingsEnabled && columnOrderToReset) {\n      const { columnOrderWithParents } = generateColumnOrderWithParentIds(\n        table.getColumn,\n        columnOrderToReset,\n      );\n\n      setLocalColumnOrder(columnOrderWithParents);\n      didReset = true;\n    }\n\n    if (columnPinningSettingsEnabled && columnPinningToReset) {\n      setLocalColumnPinning({\n        left: columnPinningToReset?.left ?? [],\n        right: columnPinningToReset?.right ?? [],\n      });\n      didReset = true;\n    }\n\n    // if settings were successfully reset,\n    // show a status message for the screen reader\n    didReset && setShowResetStatus(true);\n    showMinError && setShowMinError(false);\n  };\n\n  const onApply = () => {\n    if (visibilitySettingsEnabled && visibleColumnCount < 1) {\n      setShowMinError(true);\n      return;\n    }\n    table.setColumnVisibility(localColumnVisibility);\n    table.setColumnOrder(filteredLocalColumnOrder);\n    table.setColumnPinning(localColumnPinning);\n    onModalClose();\n  };\n\n  return (\n    <DataTableSettingsModal\n      title={intl.formatMessage(dataTableMessages.columnSettingsTitle)}\n      show={true}\n      showResetStatus={showResetStatus}\n      onDismiss={onModalClose}\n      onReset={onReset}\n      onApply={onApply}\n      disableButtons={{\n        reset:\n          !hasColumnOrderChanged &&\n          !hasVisibilityChanged &&\n          !hasColumnPinningChanged,\n        apply: exceedsError,\n      }}\n      footerMessage={limitMessage}\n      controlLabels={{\n        reset: intl.formatMessage(\n          dataTableMessages.resetColumnSettingsButtonText,\n        ),\n        cancel: intl.formatMessage(dataTableMessages.cancelButtonText),\n        apply: intl.formatMessage(dataTableMessages.applyButtonText),\n      }}\n    >\n      <DataTableVisibilityFilterControls\n        showVisibilityControl={showVisibilityControl}\n        showFilterControl={showFilterControl}\n        setActiveFilterValue={setActiveFilterValue}\n        showHideAllState={showHideAllState}\n        onShowHideAllChange={onShowHideAllChange}\n      />\n      <DataTableColumnsList\n        visibilitySettings={visibilitySettingsEnabled}\n        columnOrderSettings={columnOrderSettingsEnabled}\n        columnPinningSettings={columnPinningSettingsEnabled}\n        activeFilterValue={activeFilterValue}\n        localColumnVisibility={localColumnVisibility}\n        updateLocalColumnVisibility={updateLocalColumnVisibility}\n        localColumnOrder={localColumnOrder}\n        updateLocalColumnOrder={updateLocalColumnOrder}\n        localColumnPinning={localColumnPinning}\n        updateLocalColumnPinning={updateLocalColumnPinning}\n        hasFilterBar={showFilterControl || showVisibilityControl}\n        hasMessage={limitMessage !== undefined}\n      />\n    </DataTableSettingsModal>\n  );\n}\n\nfunction DataTableColumnSettingsModalFwd(\n  props: DataTableColumnSettingsModalProps,\n  forwardedRef: Ref<DataTableColumnSettingsModalRef>,\n): JSX.Element | null {\n  const [modalOpen, setModalOpen] = useState(false);\n  const [columnSettingsOverride, setColumnSettingsOverride] =\n    useState<DataTableColumnSettingsConfig>();\n\n  // open the modal from outside\n  useImperativeHandle(forwardedRef, () => ({\n    openColumnSettings: (columnSettings?: DataTableColumnSettingsConfig) => {\n      setColumnSettingsOverride(columnSettings);\n      setModalOpen(true);\n    },\n  }));\n\n  if (modalOpen) {\n    return (\n      <ColumnSettingsModal\n        {...props}\n        columnSettingsOverride={columnSettingsOverride}\n        onModalClose={() => setModalOpen(false)}\n      />\n    );\n  }\n  return null;\n}\n\n/**\n * @internal\n */\nexport const DataTableColumnSettingsModal = forwardRef(\n  DataTableColumnSettingsModalFwd,\n);\n"],
-  "mappings": "AAwWI,SAuBE,KAvBF;AAnWJ;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OAGK;AACP,SAAS,eAAe;AAGxB;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACK;AACP,SAAS,4BAA4B;AACrC,SAAS,yCAAyC;AAClD,SAAS,oBAAoB;AAO7B,SAAS,yBAAyB;AAElC,SAAS,8BAA8B;AAsCvC,SAAS,oBAIP,OAIa;AACb,QAAM;AAAA,IACJ,oBAAoB;AAAA,IACpB,qBAAqB;AAAA,IACrB,uBAAuB;AAAA,IACvB;AAAA,IACA;AAAA,IACA;AAAA,IACA,qBAAqB;AAAA,IACrB;AAAA,IACA;AAAA,EACF,IAAI;AAEJ,QAAM,OAAO,QAAQ;AACrB,QAAM,QAAQ,aAAa;AAC3B,QAAM,4BAA4B,MAAM,6BAA6B;AAErE,QAAM,qBAAqB,wBAAwB;AACnD,QAAM,sBAAsB,wBAAwB;AACpD,QAAM,wBAAwB,wBAAwB;AAGtD,QAAM,yBACJ,iBAAiB,oBAAoB,qBAAqB,KAC1D;AAEF,QAAM,+BAA+B;AAAA,IACnC,MACE,0BAA0B;AAAA,MACxB,CAAC,QAAQ,IAAI,UAAU,iBAAiB;AAAA,IAC1C,EAAE;AAAA,IACJ,CAAC,yBAAyB;AAAA,EAC5B;AAEA,QAAM,EAAE,cAAc,WAAW,IAAI;AAAA,IACnC,MACE;AAAA,MACE;AAAA,MACA;AAAA,IACF;AAAA,IACF,CAAC,wBAAwB,4BAA4B;AAAA,EACvD;AAEA,QAAM,4BAA4B;AAAA,IAChC;AAAA,IACA;AAAA,EACF;AACA,QAAM,6BAA6B;AAAA,IACjC;AAAA,IACA;AAAA,EACF;AACA,QAAM,+BAA+B;AAAA,IACnC;AAAA,IACA;AAAA,EACF;AAGA,QAAM;AAAA,IACJ,wBAAwB;AAAA,IACxB,iBAAiB;AAAA,EACnB,IAAI;AAAA,IACF,MAAM;AAAA,IACN,MAAM,MAAM,aAAa,IAAI,KAAK,CAAC;AAAA,EACrC;AAEA,QAAM,CAAC,mBAAmB,oBAAoB,IAAI,SAAiB,EAAE;AAGrE,QAAM,0BAA0B;AAAA,IAC9B,MAAM,+BAA+B,yBAAyB;AAAA,IAC9D,CAAC,yBAAyB;AAAA,EAC5B;AAGA,QAAM,CAAC,uBAAuB,wBAAwB,IAAI,SAExD,uBAAuB;AAGzB,QAAM,CAAC,kBAAkB,mBAAmB,IAC1C,SAAmB,gBAAgB;AAGrC,QAAM,CAAC,oBAAoB,qBAAqB,IAC9C;AAAA;AAAA,IAEE,MAAM,MAAM,MAAM,MAAM;AAAA,EAC1B;AAGF,QAAM,CAAC,iBAAiB,kBAAkB,IAAI,SAAS,KAAK;AAE5D,QAAM,CAAC,cAAc,eAAe,IAAI,SAAS,KAAK;AAEtD,QAAM,qBACJ,iBAAiB,qBAAqB,kBAAkB,KACxD,oBACA,MAAM,QAAQ;AAChB,QAAM,0BACJ,iBAAiB,oBAAoB,uBAAuB,KAC5D,yBACA,MAAM,QAAQ;AAChB,QAAM,uBACJ,iBAAiB,uBAAuB,oBAAoB,KAC5D,sBACA,MAAM,QAAQ;AAGhB,QAAM,2BAA2B;AAAA,IAC/B,MACE,iBAAiB;AAAA,MACf,CAAC,UAAU,CAAC,yBAAyB,SAAS,KAAK;AAAA,IACrD;AAAA,IACF,CAAC,kBAAkB,wBAAwB;AAAA,EAC7C;AAGA,QAAM,uBAAuB;AAAA,IAC3B,MACE,6BACA,wBAAwB,yBAAyB,qBAAqB;AAAA,IACxE,CAAC,2BAA2B,yBAAyB,qBAAqB;AAAA,EAC5E;AAGA,QAAM,wBACJ,8BACA,yBAAyB,oBAAoB,wBAAwB;AAGvE,QAAM,0BACJ,gCACA;AAAA,IACE;AAAA,MACE,MAAM,sBAAsB,QAAQ,CAAC;AAAA,MACrC,OAAO,sBAAsB,SAAS,CAAC;AAAA,IACzC;AAAA,IACA;AAAA,EACF;AAGF,QAAM,mBAAmB;AAAA,IACvB;AAAA,IACA;AAAA,EACF;AAEA,QAAM,qBAAqB,OAAO,OAAO,qBAAqB,EAAE;AAAA,IAC9D;AAAA,EACF,EAAE;AAEF,QAAM,eACJ,eAAe,UAAa,qBAAqB;AAEnD,QAAM,eAAe;AAAA,IACnB;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF;AAOA,QAAM,8BAA8B,CAClC,QACA,2BACS;AACT,UAAM,eAAe,OAAO;AAC5B,QAAI,aAAa,WAAW,GAAG;AAC7B,+BAAyB,CAAC,eAAe;AAAA,QACvC,GAAG;AAAA,QACH,CAAC,OAAO,EAAE,GAAG,CAAC;AAAA,MAChB,EAAE;AAAA,IACJ,OAAO;AACL;AAAA,QAAyB,CAAC,cACxB;AAAA,UACE;AAAA,UACA;AAAA,UACA;AAAA,QACF;AAAA,MACF;AAAA,IACF;AACA,uBAAmB,mBAAmB,KAAK;AAC3C,oBAAgB,gBAAgB,KAAK;AAAA,EACvC;AAMA,QAAM,yBAAyB,CAAC,mBAAmC;AACjE,wBAAoB,cAAc;AAClC,uBAAmB,mBAAmB,KAAK;AAAA,EAC7C;AAMA,QAAM,2BAA2B,CAAC,aAAuC;AACvE,0BAAsB,QAAQ;AAC9B,uBAAmB,mBAAmB,KAAK;AAAA,EAC7C;AAEA,QAAM,sBAAsB,MAAM;AAChC;AAAA,MAAyB,CAAC,cACxB;AAAA,QACE;AAAA,QACA;AAAA,QACA;AAAA,MACF;AAAA,IACF;AACA,uBAAmB,mBAAmB,KAAK;AAC3C,oBAAgB,gBAAgB,KAAK;AAAA,EACvC;AAEA,QAAM,wBACJ,6BAA6B,kBAAkB,WAAW;AAC5D,QAAM,oBACJ,6BAA6B;AAE/B,QAAM,UAAU,MAAM;AACpB,QAAI,WAAW;AAGf,QAAI,6BAA6B,yBAAyB;AACxD;AAAA,QACE;AAAA,UACE;AAAA,UACA;AAAA,QACF;AAAA,MACF;AACA,iBAAW;AAAA,IACb;AAEA,QAAI,8BAA8B,oBAAoB;AACpD,YAAM,EAAE,uBAAuB,IAAI;AAAA,QACjC,MAAM;AAAA,QACN;AAAA,MACF;AAEA,0BAAoB,sBAAsB;AAC1C,iBAAW;AAAA,IACb;AAEA,QAAI,gCAAgC,sBAAsB;AACxD,4BAAsB;AAAA,QACpB,MAAM,sBAAsB,QAAQ,CAAC;AAAA,QACrC,OAAO,sBAAsB,SAAS,CAAC;AAAA,MACzC,CAAC;AACD,iBAAW;AAAA,IACb;AAIA,gBAAY,mBAAmB,IAAI;AACnC,oBAAgB,gBAAgB,KAAK;AAAA,EACvC;AAEA,QAAM,UAAU,MAAM;AACpB,QAAI,6BAA6B,qBAAqB,GAAG;AACvD,sBAAgB,IAAI;AACpB;AAAA,IACF;AACA,UAAM,oBAAoB,qBAAqB;AAC/C,UAAM,eAAe,wBAAwB;AAC7C,UAAM,iBAAiB,kBAAkB;AACzC,iBAAa;AAAA,EACf;AAEA,SACE;AAAA,IAAC;AAAA;AAAA,MACC,OAAO,KAAK,cAAc,kBAAkB,mBAAmB;AAAA,MAC/D,MAAM;AAAA,MACN;AAAA,MACA,WAAW;AAAA,MACX;AAAA,MACA;AAAA,MACA,gBAAgB;AAAA,QACd,OACE,CAAC,yBACD,CAAC,wBACD,CAAC;AAAA,QACH,OAAO;AAAA,MACT;AAAA,MACA,eAAe;AAAA,MACf,eAAe;AAAA,QACb,OAAO,KAAK;AAAA,UACV,kBAAkB;AAAA,QACpB;AAAA,QACA,QAAQ,KAAK,cAAc,kBAAkB,gBAAgB;AAAA,QAC7D,OAAO,KAAK,cAAc,kBAAkB,eAAe;AAAA,MAC7D;AAAA,MAEA;AAAA;AAAA,UAAC;AAAA;AAAA,YACC;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA;AAAA,QACF;AAAA,QACA;AAAA,UAAC;AAAA;AAAA,YACC,oBAAoB;AAAA,YACpB,qBAAqB;AAAA,YACrB,uBAAuB;AAAA,YACvB;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA,YACA,cAAc,qBAAqB;AAAA,YACnC,YAAY,iBAAiB;AAAA;AAAA,QAC/B;AAAA;AAAA;AAAA,EACF;AAEJ;AAEA,SAAS,gCACP,OACA,cACoB;AACpB,QAAM,CAAC,WAAW,YAAY,IAAI,SAAS,KAAK;AAChD,QAAM,CAAC,wBAAwB,yBAAyB,IACtD,SAAwC;AAG1C,sBAAoB,cAAc,OAAO;AAAA,IACvC,oBAAoB,CAAC,mBAAmD;AACtE,gCAA0B,cAAc;AACxC,mBAAa,IAAI;AAAA,IACnB;AAAA,EACF,EAAE;AAEF,MAAI,WAAW;AACb,WACE;AAAA,MAAC;AAAA;AAAA,QACE,GAAG;AAAA,QACJ;AAAA,QACA,cAAc,MAAM,aAAa,KAAK;AAAA;AAAA,IACxC;AAAA,EAEJ;AACA,SAAO;AACT;AAKO,MAAM,+BAA+B;AAAA,EAC1C;AACF;",
+  "sourcesContent": ["import {\n  type Column,\n  type ColumnPinningState,\n  type RowData,\n} from '@tanstack/react-table';\nimport {\n  forwardRef,\n  useCallback,\n  useEffect,\n  useImperativeHandle,\n  useMemo,\n  useRef,\n  useState,\n  type JSX,\n  type Ref,\n} from 'react';\nimport { useIntl } from 'react-intl';\n\nimport type { DataTableColumnSettingsModalRef } from './column-settings-types.js';\nimport {\n  generateColumnOrderWithParentIds,\n  generateColumnVisibilityObject,\n  getCombinedVisibilityState,\n  getHasColumnOrderChanged,\n  getHasColumnPinningChanged,\n  getHasVisibilityChanged,\n  getMultipleLocalColumnVisibility,\n  getVisibilityLimitMessage,\n  getOverrideValue,\n  getIsSettingEnabled,\n  resolveEffectiveLimit,\n} from './column-settings-utils.js';\nimport { DataTableAllColumnsHiddenEmptyState } from './DataTableAllColumnsHiddenEmptyState.js';\nimport { DataTableColumnsList } from './DataTableColumnsList.js';\nimport { DataTableVisibilityFilterControls } from './DataTableVisibilityFilterControls.js';\nimport { Flex } from '../../../../../layouts/flex/Flex.js';\nimport { useDataTable } from '../../../contexts/DataTableContext.js';\nimport type { DataTablePinnedColumnState } from '../../../features/ColumnPinning/column-pinning-types.js';\nimport type {\n  DataTableColumnVisibilityState,\n  DataTableVisibleColumnLimits,\n} from '../../../features/ColumnVisibility/column-visibility-types.js';\nimport type { TDataTableFeatures } from '../../../features/types/features.types.js';\nimport { dataTableMessages } from '../../../messages.js';\nimport type { DataTableColumnSettingsConfig } from '../../../public.api.js';\nimport { DataTableSettingsModal } from '../../SettingsModal/DataTableSettingsModal.js';\n\ninterface DataTableColumnSettingsModalProps {\n  /**\n   * Whether column visibility settings are available in the modal.\n   */\n  visibilitySettings: boolean;\n  /**\n   * Whether column order settings are available in the modal.\n   */\n  columnOrderSettings: boolean;\n  /**\n   * Whether column pinning settings are available in the modal.\n   */\n  columnPinningSettings: boolean;\n  /**\n   * Default column visibility when settings are reset.\n   */\n  resetColumnVisibility?: DataTableColumnVisibilityState;\n  /**\n   * Default column order when settings are reset.\n   */\n  resetColumnOrder?: string[];\n  /**\n   * Default column pinning state when settings are reset.\n   */\n  resetColumnPinning?: DataTablePinnedColumnState;\n  /**\n   * Optional upper limits for the number of visible columns from the toolbar slot.\n   */\n  visibleColumnLimits?: DataTableVisibleColumnLimits;\n}\n\n/**\n * Modal combining UI controls for column visibility and column ordering.\n * All changes that made within the modal are only applied once the user click the Confirm button.\n * When clicking Close, the changes won't be applied and discarded.\n */\nfunction ColumnSettingsModal<\n  TFeatures extends TDataTableFeatures,\n  TData extends RowData,\n>(\n  props: DataTableColumnSettingsModalProps & {\n    onModalClose: () => void;\n    columnSettingsOverride?: DataTableColumnSettingsConfig;\n  },\n): JSX.Element {\n  const {\n    visibilitySettings: toolbarVisibilitySettings,\n    columnOrderSettings: toolbarColumnOrderSettings,\n    columnPinningSettings: toolbarColumnPinningSettings,\n    resetColumnOrder,\n    resetColumnVisibility,\n    resetColumnPinning,\n    visibleColumnLimits: slotVisibleColumnLimits,\n    onModalClose,\n    columnSettingsOverride,\n  } = props;\n\n  const intl = useIntl();\n  const table = useDataTable();\n  const leafColumnsWithoutBuiltin = table.getLeafColumnsWithoutBuiltin();\n\n  const visibilityOverride = columnSettingsOverride?.columnVisibility;\n  const columnOrderOverride = columnSettingsOverride?.columnOrder;\n  const columnPinningOverride = columnSettingsOverride?.columnPinning;\n\n  // Programmatic override takes precedence over the slot value\n  const rawVisibleColumnLimits =\n    getOverrideValue(visibilityOverride, 'visibleColumnLimits') ??\n    slotVisibleColumnLimits;\n\n  const mandatoryVisibleColumnsCount = useMemo(\n    () =>\n      leafColumnsWithoutBuiltin.filter(\n        (col) => col.columnDef.enableHiding === false,\n      ).length,\n    [leafColumnsWithoutBuiltin],\n  );\n\n  const { warningLimit, errorLimit } = useMemo(\n    () =>\n      resolveEffectiveLimit(\n        rawVisibleColumnLimits,\n        mandatoryVisibleColumnsCount,\n      ),\n    [rawVisibleColumnLimits, mandatoryVisibleColumnsCount],\n  );\n\n  const visibilitySettingsEnabled = getIsSettingEnabled(\n    visibilityOverride,\n    toolbarVisibilitySettings,\n  );\n  const columnOrderSettingsEnabled = getIsSettingEnabled(\n    columnOrderOverride,\n    toolbarColumnOrderSettings,\n  );\n  const columnPinningSettingsEnabled = getIsSettingEnabled(\n    columnPinningOverride,\n    toolbarColumnPinningSettings,\n  );\n\n  // original column order state\n  const {\n    columnOrderWithParents: tableColumnOrder,\n    uniqueParentIds: allLocalColumnsParentIds,\n  } = generateColumnOrderWithParentIds(\n    table.getColumn,\n    table.atoms.columnOrder?.get() ?? [],\n  );\n\n  // immediate search input value (drives the controlled input and clear button)\n  const [filterInputValue, setFilterInputValue] = useState('');\n  // debounced value that actually filters the column list\n  const [activeFilterValue, setActiveFilterValue] = useState<string>('');\n\n  const clearFilter = useCallback(() => {\n    setFilterInputValue('');\n    setActiveFilterValue('');\n  }, []);\n\n  // original column visibility state\n  const initialColumnVisibility = useMemo(\n    () => generateColumnVisibilityObject(leafColumnsWithoutBuiltin),\n    [leafColumnsWithoutBuiltin],\n  );\n\n  // current column visibility state while modal is open\n  const [localColumnVisibility, setLocalColumnVisibility] = useState<\n    Record<string, boolean>\n  >(initialColumnVisibility);\n\n  // current column order state while modal is open\n  const [localColumnOrder, setLocalColumnOrder] =\n    useState<string[]>(tableColumnOrder);\n\n  // current column pinning state while modal is open\n  const [localColumnPinning, setLocalColumnPinning] =\n    useState<ColumnPinningState>(\n      // original column pinning state\n      () => table.store.state.columnPinning,\n    );\n\n  // flag whether the \"Reset to default\" status message for screen readers should be displayed\n  const [showResetStatus, setShowResetStatus] = useState(false);\n  // flag whether the lower-bound (min=1) error should be displayed\n  const [showMinError, setShowMinError] = useState(false);\n\n  const [listHiddenColumns, setListHiddenColumns] = useState(true);\n\n  const onListHiddenColumnsChange = () => {\n    setListHiddenColumns((prev) => !prev);\n  };\n\n  const contentRef = useRef<HTMLDivElement>(null);\n\n  useEffect(() => {\n    const contentNode = contentRef.current;\n    if (!contentNode) {\n      return;\n    }\n\n    const modalDialog = contentNode.closest<HTMLDivElement>('[role=\"dialog\"]');\n    if (!modalDialog) {\n      return;\n    }\n\n    const observer = new ResizeObserver((entries) => {\n      const height = entries[0]?.contentRect?.height;\n      if (height && height > 0) {\n        modalDialog.style.minHeight = CSS.supports('min-height', '1dvh')\n          ? `min(${height}px, 96dvh)`\n          : `min(${height}px, 96vh)`;\n        observer.disconnect();\n      }\n    });\n    observer.observe(modalDialog);\n    return () => {\n      observer.disconnect();\n    };\n  }, []);\n\n  const columnOrderToReset =\n    getOverrideValue(columnOrderOverride, 'resetColumnOrder') ??\n    resetColumnOrder ??\n    table.options.originalColumnOrder;\n  const columnVisibilityToReset =\n    getOverrideValue(visibilityOverride, 'resetColumnVisibility') ??\n    resetColumnVisibility ??\n    table.options.originalColumnVisibility;\n  const columnPinningToReset =\n    getOverrideValue(columnPinningOverride, 'resetColumnPinning') ??\n    resetColumnPinning ??\n    table.options.originalColumnPinning;\n\n  // Memoize filtered column order for comparison\n  const filteredLocalColumnOrder = useMemo(\n    () =>\n      localColumnOrder.filter(\n        (colId) => !allLocalColumnsParentIds.includes(colId),\n      ),\n    [localColumnOrder, allLocalColumnsParentIds],\n  );\n\n  // checks if local default column visibility has changed\n  const hasVisibilityChanged = useMemo(\n    () =>\n      visibilitySettingsEnabled &&\n      getHasVisibilityChanged(columnVisibilityToReset, localColumnVisibility),\n    [visibilitySettingsEnabled, columnVisibilityToReset, localColumnVisibility],\n  );\n\n  // checks if local default column order has changed\n  const hasColumnOrderChanged =\n    columnOrderSettingsEnabled &&\n    getHasColumnOrderChanged(columnOrderToReset, filteredLocalColumnOrder);\n\n  // checks if local default column pinning state has changed\n  const hasColumnPinningChanged =\n    columnPinningSettingsEnabled &&\n    getHasColumnPinningChanged(\n      {\n        left: columnPinningToReset?.left ?? [],\n        right: columnPinningToReset?.right ?? [],\n      },\n      localColumnPinning,\n    );\n\n  // Drives the \"Show all\"/\"Hide all\" button disabled states.\n  const showHideAllState = getCombinedVisibilityState(\n    localColumnVisibility,\n    leafColumnsWithoutBuiltin,\n    true,\n  );\n\n  const visibleColumnCount = Object.values(localColumnVisibility).filter(\n    Boolean,\n  ).length;\n  const totalColumnCount = Object.values(localColumnVisibility).length;\n  const hiddenColumnCount = totalColumnCount - visibleColumnCount;\n\n  const exceedsError =\n    errorLimit !== undefined && visibleColumnCount > errorLimit;\n\n  const limitMessage = getVisibilityLimitMessage(\n    showMinError,\n    errorLimit,\n    warningLimit,\n    visibleColumnCount,\n    intl,\n  );\n\n  /**\n   * Updates the local column visibility state.\n   * @param column - the column to update.\n   * @param currentVisibilityState - the current visibility state of the column.\n   */\n  const updateLocalColumnVisibility = (\n    column: Column<TFeatures, TData>,\n    currentVisibilityState: boolean | 'indeterminate',\n  ): void => {\n    const childColumns = column.columns;\n    if (childColumns.length === 0) {\n      setLocalColumnVisibility((prevState) => ({\n        ...prevState,\n        [column.id]: !currentVisibilityState,\n      }));\n    } else {\n      setLocalColumnVisibility((prevState) =>\n        getMultipleLocalColumnVisibility(\n          childColumns,\n          currentVisibilityState,\n          prevState,\n        ),\n      );\n    }\n    showResetStatus && setShowResetStatus(false);\n    showMinError && setShowMinError(false);\n  };\n\n  /**\n   * Updates the local column order state.\n   * @param newColumnOrder - the new column order.\n   */\n  const updateLocalColumnOrder = (newColumnOrder: string[]): void => {\n    setLocalColumnOrder(newColumnOrder);\n    showResetStatus && setShowResetStatus(false);\n  };\n\n  /**\n   * Updates the local column pinning state.\n   * @param newState - the new column pinning state.\n   */\n  const updateLocalColumnPinning = (newState: ColumnPinningState): void => {\n    setLocalColumnPinning(newState);\n    showResetStatus && setShowResetStatus(false);\n  };\n\n  const clearStatusMessages = () => {\n    showResetStatus && setShowResetStatus(false);\n    showMinError && setShowMinError(false);\n  };\n\n  const onShowAll = () => {\n    setLocalColumnVisibility((prevState) =>\n      getMultipleLocalColumnVisibility(\n        leafColumnsWithoutBuiltin,\n        // passing false sets all hideable columns to visible\n        false,\n        prevState,\n      ),\n    );\n    clearStatusMessages();\n  };\n\n  const onHideAll = () => {\n    setLocalColumnVisibility((prevState) =>\n      getMultipleLocalColumnVisibility(\n        leafColumnsWithoutBuiltin,\n        // passing true sets all hideable columns to hidden\n        true,\n        prevState,\n      ),\n    );\n    clearStatusMessages();\n  };\n\n  const showFilterControl =\n    visibilitySettingsEnabled || columnPinningSettingsEnabled;\n\n  // The visibility control row (the \"list hidden columns\" switch + counter)\n  // is hidden while a search is active.\n  const showVisibilityControlRow =\n    visibilitySettingsEnabled && !filterInputValue;\n\n  // During search, always include hidden columns so they can be found by name.\n  const effectiveListHiddenColumns =\n    listHiddenColumns || activeFilterValue.length > 0;\n\n  // Show the empty state when all columns are hidden and hidden columns are not listed\n  const showAllColumnsHiddenEmptyState =\n    visibilitySettingsEnabled &&\n    visibleColumnCount === 0 &&\n    !effectiveListHiddenColumns;\n\n  const onReset = () => {\n    let didReset = false;\n\n    // reset visibility, order and/or pinning state if they are enabled\n    if (visibilitySettingsEnabled && columnVisibilityToReset) {\n      setLocalColumnVisibility(\n        generateColumnVisibilityObject(\n          leafColumnsWithoutBuiltin,\n          columnVisibilityToReset,\n        ),\n      );\n      didReset = true;\n    }\n\n    if (columnOrderSettingsEnabled && columnOrderToReset) {\n      const { columnOrderWithParents } = generateColumnOrderWithParentIds(\n        table.getColumn,\n        columnOrderToReset,\n      );\n\n      setLocalColumnOrder(columnOrderWithParents);\n      didReset = true;\n    }\n\n    if (columnPinningSettingsEnabled && columnPinningToReset) {\n      setLocalColumnPinning({\n        left: columnPinningToReset?.left ?? [],\n        right: columnPinningToReset?.right ?? [],\n      });\n      didReset = true;\n    }\n\n    // if settings were successfully reset,\n    // show a status message for the screen reader\n    didReset && setShowResetStatus(true);\n    showMinError && setShowMinError(false);\n  };\n\n  const onApply = () => {\n    if (visibilitySettingsEnabled && visibleColumnCount < 1) {\n      setShowMinError(true);\n      return;\n    }\n    table.setColumnVisibility(localColumnVisibility);\n    table.setColumnOrder(filteredLocalColumnOrder);\n    table.setColumnPinning(localColumnPinning);\n    onModalClose();\n  };\n\n  return (\n    <DataTableSettingsModal\n      title={intl.formatMessage(dataTableMessages.columnSettingsTitle)}\n      show={true}\n      showResetStatus={showResetStatus}\n      onDismiss={onModalClose}\n      onReset={onReset}\n      onApply={onApply}\n      disableButtons={{\n        reset:\n          !hasColumnOrderChanged &&\n          !hasVisibilityChanged &&\n          !hasColumnPinningChanged,\n        apply: exceedsError,\n      }}\n      footerMessage={limitMessage}\n      controlLabels={{\n        reset: intl.formatMessage(\n          dataTableMessages.resetColumnSettingsButtonText,\n        ),\n        cancel: intl.formatMessage(dataTableMessages.cancelButtonText),\n        apply: intl.formatMessage(dataTableMessages.applyButtonText),\n      }}\n    >\n      <Flex ref={contentRef} flexDirection=\"column\" gap={12} flex={1}>\n        <DataTableVisibilityFilterControls\n          showVisibilityControl={visibilitySettingsEnabled}\n          showFilterControl={showFilterControl}\n          filterValue={filterInputValue}\n          onFilterValueChange={setFilterInputValue}\n          setActiveFilterValue={setActiveFilterValue}\n          showAllDisabled={showHideAllState === true}\n          hideAllDisabled={showHideAllState === false}\n          onShowAll={onShowAll}\n          onHideAll={onHideAll}\n          listHiddenColumns={listHiddenColumns}\n          onListHiddenColumnsChange={onListHiddenColumnsChange}\n          hiddenColumnCount={hiddenColumnCount}\n          visibleColumnCount={visibleColumnCount}\n          totalColumnCount={totalColumnCount}\n        />\n        {showAllColumnsHiddenEmptyState ? (\n          <Flex flex={1} alignItems=\"center\" justifyContent=\"center\">\n            <DataTableAllColumnsHiddenEmptyState\n              onListHiddenColumns={onListHiddenColumnsChange}\n            />\n          </Flex>\n        ) : (\n          <DataTableColumnsList\n            visibilitySettings={visibilitySettingsEnabled}\n            columnOrderSettings={columnOrderSettingsEnabled}\n            columnPinningSettings={columnPinningSettingsEnabled}\n            activeFilterValue={activeFilterValue}\n            listHiddenColumns={effectiveListHiddenColumns}\n            localColumnVisibility={localColumnVisibility}\n            updateLocalColumnVisibility={updateLocalColumnVisibility}\n            localColumnOrder={localColumnOrder}\n            updateLocalColumnOrder={updateLocalColumnOrder}\n            localColumnPinning={localColumnPinning}\n            updateLocalColumnPinning={updateLocalColumnPinning}\n            hasFilterBar={showFilterControl}\n            hasVisibilityControl={showVisibilityControlRow}\n            hasMessage={limitMessage !== undefined}\n            onClearFilter={clearFilter}\n          />\n        )}\n      </Flex>\n    </DataTableSettingsModal>\n  );\n}\n\nfunction DataTableColumnSettingsModalFwd(\n  props: DataTableColumnSettingsModalProps,\n  forwardedRef: Ref<DataTableColumnSettingsModalRef>,\n): JSX.Element | null {\n  const [modalOpen, setModalOpen] = useState(false);\n  const [columnSettingsOverride, setColumnSettingsOverride] =\n    useState<DataTableColumnSettingsConfig>();\n\n  // open the modal from outside\n  useImperativeHandle(forwardedRef, () => ({\n    openColumnSettings: (columnSettings?: DataTableColumnSettingsConfig) => {\n      setColumnSettingsOverride(columnSettings);\n      setModalOpen(true);\n    },\n  }));\n\n  if (modalOpen) {\n    return (\n      <ColumnSettingsModal\n        {...props}\n        columnSettingsOverride={columnSettingsOverride}\n        onModalClose={() => setModalOpen(false)}\n      />\n    );\n  }\n  return null;\n}\n\n/**\n * @internal\n */\nexport const DataTableColumnSettingsModal = forwardRef(\n  DataTableColumnSettingsModalFwd,\n);\n"],
+  "mappings": "AA+cM,SACE,KADF;AA1cN;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OAGK;AACP,SAAS,eAAe;AAGxB;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACK;AACP,SAAS,2CAA2C;AACpD,SAAS,4BAA4B;AACrC,SAAS,yCAAyC;AAClD,SAAS,YAAY;AACrB,SAAS,oBAAoB;AAO7B,SAAS,yBAAyB;AAElC,SAAS,8BAA8B;AAsCvC,SAAS,oBAIP,OAIa;AACb,QAAM;AAAA,IACJ,oBAAoB;AAAA,IACpB,qBAAqB;AAAA,IACrB,uBAAuB;AAAA,IACvB;AAAA,IACA;AAAA,IACA;AAAA,IACA,qBAAqB;AAAA,IACrB;AAAA,IACA;AAAA,EACF,IAAI;AAEJ,QAAM,OAAO,QAAQ;AACrB,QAAM,QAAQ,aAAa;AAC3B,QAAM,4BAA4B,MAAM,6BAA6B;AAErE,QAAM,qBAAqB,wBAAwB;AACnD,QAAM,sBAAsB,wBAAwB;AACpD,QAAM,wBAAwB,wBAAwB;AAGtD,QAAM,yBACJ,iBAAiB,oBAAoB,qBAAqB,KAC1D;AAEF,QAAM,+BAA+B;AAAA,IACnC,MACE,0BAA0B;AAAA,MACxB,CAAC,QAAQ,IAAI,UAAU,iBAAiB;AAAA,IAC1C,EAAE;AAAA,IACJ,CAAC,yBAAyB;AAAA,EAC5B;AAEA,QAAM,EAAE,cAAc,WAAW,IAAI;AAAA,IACnC,MACE;AAAA,MACE;AAAA,MACA;AAAA,IACF;AAAA,IACF,CAAC,wBAAwB,4BAA4B;AAAA,EACvD;AAEA,QAAM,4BAA4B;AAAA,IAChC;AAAA,IACA;AAAA,EACF;AACA,QAAM,6BAA6B;AAAA,IACjC;AAAA,IACA;AAAA,EACF;AACA,QAAM,+BAA+B;AAAA,IACnC;AAAA,IACA;AAAA,EACF;AAGA,QAAM;AAAA,IACJ,wBAAwB;AAAA,IACxB,iBAAiB;AAAA,EACnB,IAAI;AAAA,IACF,MAAM;AAAA,IACN,MAAM,MAAM,aAAa,IAAI,KAAK,CAAC;AAAA,EACrC;AAGA,QAAM,CAAC,kBAAkB,mBAAmB,IAAI,SAAS,EAAE;AAE3D,QAAM,CAAC,mBAAmB,oBAAoB,IAAI,SAAiB,EAAE;AAErE,QAAM,cAAc,YAAY,MAAM;AACpC,wBAAoB,EAAE;AACtB,yBAAqB,EAAE;AAAA,EACzB,GAAG,CAAC,CAAC;AAGL,QAAM,0BAA0B;AAAA,IAC9B,MAAM,+BAA+B,yBAAyB;AAAA,IAC9D,CAAC,yBAAyB;AAAA,EAC5B;AAGA,QAAM,CAAC,uBAAuB,wBAAwB,IAAI,SAExD,uBAAuB;AAGzB,QAAM,CAAC,kBAAkB,mBAAmB,IAC1C,SAAmB,gBAAgB;AAGrC,QAAM,CAAC,oBAAoB,qBAAqB,IAC9C;AAAA;AAAA,IAEE,MAAM,MAAM,MAAM,MAAM;AAAA,EAC1B;AAGF,QAAM,CAAC,iBAAiB,kBAAkB,IAAI,SAAS,KAAK;AAE5D,QAAM,CAAC,cAAc,eAAe,IAAI,SAAS,KAAK;AAEtD,QAAM,CAAC,mBAAmB,oBAAoB,IAAI,SAAS,IAAI;AAE/D,QAAM,4BAA4B,MAAM;AACtC,yBAAqB,CAAC,SAAS,CAAC,IAAI;AAAA,EACtC;AAEA,QAAM,aAAa,OAAuB,IAAI;AAE9C,YAAU,MAAM;AACd,UAAM,cAAc,WAAW;AAC/B,QAAI,CAAC,aAAa;AAChB;AAAA,IACF;AAEA,UAAM,cAAc,YAAY,QAAwB,iBAAiB;AACzE,QAAI,CAAC,aAAa;AAChB;AAAA,IACF;AAEA,UAAM,WAAW,IAAI,eAAe,CAAC,YAAY;AAC/C,YAAM,SAAS,QAAQ,CAAC,GAAG,aAAa;AACxC,UAAI,UAAU,SAAS,GAAG;AACxB,oBAAY,MAAM,YAAY,IAAI,SAAS,cAAc,MAAM,IAC3D,OAAO,MAAM,eACb,OAAO,MAAM;AACjB,iBAAS,WAAW;AAAA,MACtB;AAAA,IACF,CAAC;AACD,aAAS,QAAQ,WAAW;AAC5B,WAAO,MAAM;AACX,eAAS,WAAW;AAAA,IACtB;AAAA,EACF,GAAG,CAAC,CAAC;AAEL,QAAM,qBACJ,iBAAiB,qBAAqB,kBAAkB,KACxD,oBACA,MAAM,QAAQ;AAChB,QAAM,0BACJ,iBAAiB,oBAAoB,uBAAuB,KAC5D,yBACA,MAAM,QAAQ;AAChB,QAAM,uBACJ,iBAAiB,uBAAuB,oBAAoB,KAC5D,sBACA,MAAM,QAAQ;AAGhB,QAAM,2BAA2B;AAAA,IAC/B,MACE,iBAAiB;AAAA,MACf,CAAC,UAAU,CAAC,yBAAyB,SAAS,KAAK;AAAA,IACrD;AAAA,IACF,CAAC,kBAAkB,wBAAwB;AAAA,EAC7C;AAGA,QAAM,uBAAuB;AAAA,IAC3B,MACE,6BACA,wBAAwB,yBAAyB,qBAAqB;AAAA,IACxE,CAAC,2BAA2B,yBAAyB,qBAAqB;AAAA,EAC5E;AAGA,QAAM,wBACJ,8BACA,yBAAyB,oBAAoB,wBAAwB;AAGvE,QAAM,0BACJ,gCACA;AAAA,IACE;AAAA,MACE,MAAM,sBAAsB,QAAQ,CAAC;AAAA,MACrC,OAAO,sBAAsB,SAAS,CAAC;AAAA,IACzC;AAAA,IACA;AAAA,EACF;AAGF,QAAM,mBAAmB;AAAA,IACvB;AAAA,IACA;AAAA,IACA;AAAA,EACF;AAEA,QAAM,qBAAqB,OAAO,OAAO,qBAAqB,EAAE;AAAA,IAC9D;AAAA,EACF,EAAE;AACF,QAAM,mBAAmB,OAAO,OAAO,qBAAqB,EAAE;AAC9D,QAAM,oBAAoB,mBAAmB;AAE7C,QAAM,eACJ,eAAe,UAAa,qBAAqB;AAEnD,QAAM,eAAe;AAAA,IACnB;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF;AAOA,QAAM,8BAA8B,CAClC,QACA,2BACS;AACT,UAAM,eAAe,OAAO;AAC5B,QAAI,aAAa,WAAW,GAAG;AAC7B,+BAAyB,CAAC,eAAe;AAAA,QACvC,GAAG;AAAA,QACH,CAAC,OAAO,EAAE,GAAG,CAAC;AAAA,MAChB,EAAE;AAAA,IACJ,OAAO;AACL;AAAA,QAAyB,CAAC,cACxB;AAAA,UACE;AAAA,UACA;AAAA,UACA;AAAA,QACF;AAAA,MACF;AAAA,IACF;AACA,uBAAmB,mBAAmB,KAAK;AAC3C,oBAAgB,gBAAgB,KAAK;AAAA,EACvC;AAMA,QAAM,yBAAyB,CAAC,mBAAmC;AACjE,wBAAoB,cAAc;AAClC,uBAAmB,mBAAmB,KAAK;AAAA,EAC7C;AAMA,QAAM,2BAA2B,CAAC,aAAuC;AACvE,0BAAsB,QAAQ;AAC9B,uBAAmB,mBAAmB,KAAK;AAAA,EAC7C;AAEA,QAAM,sBAAsB,MAAM;AAChC,uBAAmB,mBAAmB,KAAK;AAC3C,oBAAgB,gBAAgB,KAAK;AAAA,EACvC;AAEA,QAAM,YAAY,MAAM;AACtB;AAAA,MAAyB,CAAC,cACxB;AAAA,QACE;AAAA;AAAA,QAEA;AAAA,QACA;AAAA,MACF;AAAA,IACF;AACA,wBAAoB;AAAA,EACtB;AAEA,QAAM,YAAY,MAAM;AACtB;AAAA,MAAyB,CAAC,cACxB;AAAA,QACE;AAAA;AAAA,QAEA;AAAA,QACA;AAAA,MACF;AAAA,IACF;AACA,wBAAoB;AAAA,EACtB;AAEA,QAAM,oBACJ,6BAA6B;AAI/B,QAAM,2BACJ,6BAA6B,CAAC;AAGhC,QAAM,6BACJ,qBAAqB,kBAAkB,SAAS;AAGlD,QAAM,iCACJ,6BACA,uBAAuB,KACvB,CAAC;AAEH,QAAM,UAAU,MAAM;AACpB,QAAI,WAAW;AAGf,QAAI,6BAA6B,yBAAyB;AACxD;AAAA,QACE;AAAA,UACE;AAAA,UACA;AAAA,QACF;AAAA,MACF;AACA,iBAAW;AAAA,IACb;AAEA,QAAI,8BAA8B,oBAAoB;AACpD,YAAM,EAAE,uBAAuB,IAAI;AAAA,QACjC,MAAM;AAAA,QACN;AAAA,MACF;AAEA,0BAAoB,sBAAsB;AAC1C,iBAAW;AAAA,IACb;AAEA,QAAI,gCAAgC,sBAAsB;AACxD,4BAAsB;AAAA,QACpB,MAAM,sBAAsB,QAAQ,CAAC;AAAA,QACrC,OAAO,sBAAsB,SAAS,CAAC;AAAA,MACzC,CAAC;AACD,iBAAW;AAAA,IACb;AAIA,gBAAY,mBAAmB,IAAI;AACnC,oBAAgB,gBAAgB,KAAK;AAAA,EACvC;AAEA,QAAM,UAAU,MAAM;AACpB,QAAI,6BAA6B,qBAAqB,GAAG;AACvD,sBAAgB,IAAI;AACpB;AAAA,IACF;AACA,UAAM,oBAAoB,qBAAqB;AAC/C,UAAM,eAAe,wBAAwB;AAC7C,UAAM,iBAAiB,kBAAkB;AACzC,iBAAa;AAAA,EACf;AAEA,SACE;AAAA,IAAC;AAAA;AAAA,MACC,OAAO,KAAK,cAAc,kBAAkB,mBAAmB;AAAA,MAC/D,MAAM;AAAA,MACN;AAAA,MACA,WAAW;AAAA,MACX;AAAA,MACA;AAAA,MACA,gBAAgB;AAAA,QACd,OACE,CAAC,yBACD,CAAC,wBACD,CAAC;AAAA,QACH,OAAO;AAAA,MACT;AAAA,MACA,eAAe;AAAA,MACf,eAAe;AAAA,QACb,OAAO,KAAK;AAAA,UACV,kBAAkB;AAAA,QACpB;AAAA,QACA,QAAQ,KAAK,cAAc,kBAAkB,gBAAgB;AAAA,QAC7D,OAAO,KAAK,cAAc,kBAAkB,eAAe;AAAA,MAC7D;AAAA,MAEA,+BAAC,QAAK,KAAK,YAAY,eAAc,UAAS,KAAK,IAAI,MAAM,GAC3D;AAAA;AAAA,UAAC;AAAA;AAAA,YACC,uBAAuB;AAAA,YACvB;AAAA,YACA,aAAa;AAAA,YACb,qBAAqB;AAAA,YACrB;AAAA,YACA,iBAAiB,qBAAqB;AAAA,YACtC,iBAAiB,qBAAqB;AAAA,YACtC;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA;AAAA,QACF;AAAA,QACC,iCACC,oBAAC,QAAK,MAAM,GAAG,YAAW,UAAS,gBAAe,UAChD;AAAA,UAAC;AAAA;AAAA,YACC,qBAAqB;AAAA;AAAA,QACvB,GACF,IAEA;AAAA,UAAC;AAAA;AAAA,YACC,oBAAoB;AAAA,YACpB,qBAAqB;AAAA,YACrB,uBAAuB;AAAA,YACvB;AAAA,YACA,mBAAmB;AAAA,YACnB;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA,YACA,cAAc;AAAA,YACd,sBAAsB;AAAA,YACtB,YAAY,iBAAiB;AAAA,YAC7B,eAAe;AAAA;AAAA,QACjB;AAAA,SAEJ;AAAA;AAAA,EACF;AAEJ;AAEA,SAAS,gCACP,OACA,cACoB;AACpB,QAAM,CAAC,WAAW,YAAY,IAAI,SAAS,KAAK;AAChD,QAAM,CAAC,wBAAwB,yBAAyB,IACtD,SAAwC;AAG1C,sBAAoB,cAAc,OAAO;AAAA,IACvC,oBAAoB,CAAC,mBAAmD;AACtE,gCAA0B,cAAc;AACxC,mBAAa,IAAI;AAAA,IACnB;AAAA,EACF,EAAE;AAEF,MAAI,WAAW;AACb,WACE;AAAA,MAAC;AAAA;AAAA,QACE,GAAG;AAAA,QACJ;AAAA,QACA,cAAc,MAAM,aAAa,KAAK;AAAA;AAAA,IACxC;AAAA,EAEJ;AACA,SAAO;AACT;AAKO,MAAM,+BAA+B;AAAA,EAC1C;AACF;",
   "names": []
 }