@dynatrace/strato-components 3.13.3 → 3.14.0

package/esm/tables/DataTable/features/MeterBarChart/MeterBarChart.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../../src/tables/DataTable/features/MeterBarChart/MeterBarChart.tsx"],
-  "sourcesContent": ["/* eslint-disable react-hooks/immutability */\nimport type {\n  CellData,\n  Column,\n  RowData,\n  TableFeature,\n} from '@tanstack/react-table';\nimport clsx from 'clsx';\nimport { isEmpty, isNumber } from 'lodash-es';\nimport { useEffect, useMemo, useRef, type JSX } from 'react';\n\nimport Spacings from '@dynatrace/strato-design-tokens/spacings';\nimport {\n  type ConvertibleUnit,\n  format,\n  type FormatOptions,\n  type Unit,\n} from '@dynatrace-sdk/units';\n\nimport * as styles from './MeterBarChart.sty.js';\nimport {\n  isFormatterOptions,\n  type Formatter,\n} from '../../../../charts/core/types/formatter.js';\nimport { MultiMeterBarChart } from '../../../../charts/meter-bar/multi-meter-bar/MultiMeterBarChart.js';\nimport { METER_BAR_SIZE } from '../../../../charts/meter-bar/shared/constants.js';\nimport type { MeterBarChartElementRef } from '../../../../charts/meter-bar/shared/types/meter-bars.js';\nimport { collapseThresholdShowIndicators } from '../../../../charts/meter-bar/shared/utils/collapse-threshold-show-indicators.js';\nimport { MeterBarChart } from '../../../../charts/meter-bar/single-meter-bar/MeterBarChart.js';\nimport { devLog } from '../../../../core/utils/logging.js';\nimport { isDisplayColumnDefConfig } from '../../hooks/useTable/datatable-typeguards.js';\nimport type {\n  DataTableColumnDef,\n  DataTableDisplayColumnDef,\n  DataTableRowData,\n} from '../../public.api.js';\nimport { isDatatableMeterBarColumnConfig } from '../ColumnTypes/column-types-types.js';\nimport type { DataTableMeterbarColumnConfig } from '../ColumnTypes/column-types-types.js';\nimport type { TDataTableFeatures } from '../types/features.types.js';\nimport type { DataTableOptions } from '../types/table.types.js';\n\n/** Default max value for meterbar column. */\nconst DEFAULT_MAX_VALUE = 100;\n\n/**\n * Type guard function ensures that the defined column contains the 'accessor' property.\n * @internal\n */\nfunction isColumnDefWithAccessor<TData extends DataTableRowData, TValue>(\n  column: unknown,\n): column is DataTableDisplayColumnDef<TData, TValue> {\n  return (\n    column !== null &&\n    column !== undefined &&\n    typeof column === 'object' &&\n    'accessor' in column\n  );\n}\n\ntype MeterBarChartRendererType<\n  TData extends RowData,\n  TValue extends CellData = CellData,\n> = {\n  value: number | { name: string; value: number; color?: string }[];\n  column: Column<TDataTableFeatures, TData, TValue>;\n};\n\n/**\n * Type guard to check value against MultiMeterBar values.\n * @internal\n */\nexport function isMultiMeterBarData(\n  value: unknown,\n): value is Array<{ name: string; value: number; color?: string }> {\n  return (\n    Array.isArray(value) &&\n    value.every(\n      (item) =>\n        typeof item === 'object' &&\n        typeof item.name === 'string' &&\n        typeof item.value === 'number' &&\n        (item.color === undefined || typeof item.color === 'string'),\n    )\n  );\n}\n\n/**\n * Formats the value for the meterbar chart based on the provided formatter or format options.\n * @param value - The numeric value to be formatted.\n * @param formatter - Optional formatter function or format options to format the value.\n * @returns The formatted value as a string.\n * @internal\n */\nfunction formatMeterBarValue(\n  value: number,\n  formatter?: Formatter | FormatOptions<Unit, ConvertibleUnit>,\n): string {\n  if (!formatter) {\n    return String(value);\n  }\n  if (isFormatterOptions(formatter)) {\n    return format(value, formatter);\n  }\n  return formatter(value);\n}\n\n/**\n * Resolves the effective column-level `showThresholdIndicators` value.\n *\n * The new column-level `showThresholdIndicators` flag always takes precedence.\n * When it is omitted, we fall back to the deprecated per-threshold\n * `showIndicator` flags so existing configs keep working without a breaking\n * change.\n * @internal\n */\nexport function resolveShowThresholdIndicators(\n  config: DataTableMeterbarColumnConfig,\n): boolean | undefined {\n  if (config?.showThresholdIndicators !== undefined) {\n    return config.showThresholdIndicators;\n  }\n\n  return collapseThresholdShowIndicators(\n    // oxlint-disable-next-line typescript/no-deprecated\n    (config?.thresholds ?? []).map((threshold) => threshold.showIndicator),\n    '[Table - MeterBar] The deprecated per-threshold `showIndicator` config ' +\n      'has mixed values and can no longer be represented per threshold. Use ' +\n      'the column-level `showThresholdIndicators` config to show or hide all ' +\n      'threshold indicators at once.',\n  );\n}\n\n/**\n * Intended for configuring and rendering the meterbar chart component.\n */\nexport function MeterBarChartRenderer<\n  TData extends RowData,\n  TValue extends CellData = CellData,\n>({\n  value,\n  column,\n}: Readonly<MeterBarChartRendererType<TData, TValue>>): JSX.Element {\n  const chartRef = useRef<MeterBarChartElementRef>(null);\n\n  let config: DataTableMeterbarColumnConfig = {};\n  if (\n    column?.columnDef.meta &&\n    isDatatableMeterBarColumnConfig(\n      column.columnDef.meta.config,\n      column.columnDef.columnType,\n    )\n  ) {\n    config = column.columnDef.meta.config;\n  }\n\n  const columnId = column.columnDef.id ?? '';\n\n  const maxValuesFromState = column.table.atoms.meterbarChartMaxValues?.get();\n\n  const maxValue = !isEmpty(maxValuesFromState)\n    ? maxValuesFromState[columnId]\n    : DEFAULT_MAX_VALUE;\n\n  const listenerRef = useRef<((e?: PointerEvent) => void) | null>(null);\n\n  useEffect(() => {\n    // clean possible leftover event on unmount\n    return () => {\n      listenerRef.current?.();\n    };\n  }, []);\n\n  const registerUnpinOnPointerUp = config?.showTooltip\n    ? () => {\n        if (listenerRef.current) {\n          return;\n        }\n        const handler = (event: PointerEvent) => {\n          if (\n            (event.target as HTMLElement).closest('[role=\"tooltip\"]') !== null\n          ) {\n            return;\n          }\n\n          chartRef.current?.unpinTooltip();\n          listenerRef.current?.();\n          listenerRef.current = null;\n        };\n        listenerRef.current = () =>\n          document.removeEventListener('pointerup', handler);\n        document.addEventListener('pointerup', handler);\n      }\n    : undefined;\n\n  // simple MeterBar\n  if (typeof value === 'number') {\n    const showValue = config?.showValue ?? false;\n    const showThresholdIndicators = resolveShowThresholdIndicators(config);\n    const hasVisibleThresholds =\n      showThresholdIndicators !== false &&\n      (config?.thresholds?.length ?? 0) > 0;\n\n    const chart = (\n      <MeterBarChart\n        value={value}\n        min={config?.min}\n        max={maxValue}\n        color={config?.color as string}\n        size={METER_BAR_SIZE.Size8}\n        width=\"100%\"\n        // Override the chart's default height: '100%'.\n        height=\"auto\"\n        showThresholdIndicators={showThresholdIndicators}\n        // The threshold interval bars add height below the bar\n        // so trim the vertical padding when they are visible\n        // to keep the cell height consistent.\n        style={{\n          padding: `${\n            hasVisibleThresholds ? Spacings.Size4 : Spacings.Size6\n          } 0`,\n        }}\n        formatter={config?.formatter}\n        ref={chartRef}\n      >\n        <MeterBarChart.Tooltip hidden={!config?.showTooltip} />\n        {config?.thresholds?.map((threshold) => (\n          <MeterBarChart.ThresholdIndicator\n            key={`threshold-${threshold.color}-${threshold.value}`}\n            // DEPRECATION: [APPDEV-15843] BREAKING-CHANGE: Remove `name` from `thresholds`\n            // oxlint-disable-next-line typescript/no-deprecated\n            name={threshold.name}\n            color={threshold.color}\n            value={threshold.value}\n          />\n        ))}\n      </MeterBarChart>\n    );\n\n    return (\n      <span\n        className={clsx({\n          [styles.wrapperVariants.shown]: showValue !== false,\n          [styles.wrapperVariants.hidden]: showValue === false,\n        })}\n        onClick={registerUnpinOnPointerUp}\n        role=\"none\"\n      >\n        {showValue !== false && (\n          <span className={styles.inlineValueVariants[showValue]}>\n            {formatMeterBarValue(value, config?.formatter)}\n          </span>\n        )}\n        {chart}\n      </span>\n    );\n  }\n\n  const isMultiMeterData = isMultiMeterBarData(value);\n  if (!isMultiMeterData) {\n    devLog('Invalid meter chart data.');\n  }\n\n  return (\n    <span\n      style={{ display: 'contents' }}\n      onClick={registerUnpinOnPointerUp}\n      role=\"none\"\n    >\n      <MultiMeterBarChart\n        size={METER_BAR_SIZE.Size8}\n        min={config?.min}\n        max={maxValue}\n        colorPalette={config?.colorPalette || 'categorical'}\n        width=\"100%\"\n        // Override the chart's default height: '100%'.\n        height=\"auto\"\n        style={{ padding: `${Spacings.Size6} 0` }}\n        formatter={config?.formatter}\n        ref={chartRef}\n      >\n        {\n          // only if this is multi meter data render segments\n          isMultiMeterData &&\n            value.map((data) => (\n              <MultiMeterBarChart.Segment\n                key={`${data.name}-${data.value}`}\n                name={data.name}\n                value={data.value}\n                color={data?.color}\n              />\n            ))\n        }\n        <MultiMeterBarChart.Tooltip\n          variant=\"shared\"\n          hidden={!config?.showTooltip}\n        />\n      </MultiMeterBarChart>\n    </span>\n  );\n}\n\n/**\n * Gets the highest total max values in a meterbar column.\n *\n * @param data - table data\n * @param columns - table column definition\n * @returns record of highest total max value per column\n * @internal\n */\nexport function getTotalMaxFromMeterbarChartData<\n  TData extends DataTableRowData,\n>(data: TData[], columns: DataTableColumnDef<TData>[]): Record<string, number> {\n  const meterbarColumns = columns.filter(\n    (columnDef) =>\n      isDisplayColumnDefConfig<TData>(columnDef) &&\n      columnDef.columnType === 'meterbar',\n  );\n\n  const maxValuesStorage: Record<string, number> = {};\n\n  for (const row of data) {\n    for (const columnDef of meterbarColumns) {\n      if (isColumnDefWithAccessor(columnDef)) {\n        const { accessor, config, id: columnId } = columnDef;\n\n        const configuredMax: number | 'data-max' | undefined =\n          isDatatableMeterBarColumnConfig(config, columnDef.columnType)\n            ? config.max\n            : undefined;\n\n        const meterbarValue = row as Record<string, unknown>;\n\n        const meterbarDataEntry =\n          typeof accessor === 'string'\n            ? meterbarValue[accessor]\n            : accessor(row);\n\n        let totalValue = DEFAULT_MAX_VALUE;\n\n        if (isNumber(configuredMax)) {\n          maxValuesStorage[columnId] = configuredMax;\n          continue;\n        }\n\n        if (meterbarDataEntry) {\n          if (Array.isArray(meterbarDataEntry)) {\n            totalValue = meterbarDataEntry.reduce(\n              (acc, current) => acc + current.value,\n              0,\n            );\n          } else {\n            const entry = isNumber(meterbarDataEntry)\n              ? meterbarDataEntry\n              : DEFAULT_MAX_VALUE;\n            totalValue =\n              configuredMax === 'data-max'\n                ? entry\n                : Math.max(entry, DEFAULT_MAX_VALUE);\n          }\n        }\n\n        maxValuesStorage[columnId] = Math.max(\n          maxValuesStorage[columnId] ?? totalValue,\n          totalValue,\n        );\n      }\n    }\n  }\n\n  return maxValuesStorage;\n}\n\n/**\n * Configuration hook for the DataTable Meterbar Chart feature.\n * @internal\n */\nexport function useMeterBarChartMaxValuesCalc<TData extends DataTableRowData>(\n  props: {\n    data: TData[];\n    columns: DataTableColumnDef<TData>[];\n  },\n  options: DataTableOptions<Exclude<TData, unknown>>,\n): void {\n  const meterbarChartMaxValues = useMemo(\n    () => getTotalMaxFromMeterbarChartData<TData>(props.data, props.columns),\n    [props.columns, props.data],\n  );\n\n  options.state = {\n    ...options.state,\n    meterbarChartMaxValues,\n  };\n}\n\nexport function constructMeterBarChartColumnTypeFeature(): TableFeature {\n  return {\n    getInitialState: (initialState) => {\n      return {\n        meterbarChartMaxValues: null,\n        ...initialState,\n      };\n    },\n  };\n}\n\n/**\n * DataTableMeterBarChartColumnTypeFeature is the plugin that provides the loading state for the DataTable,\n * which can be used to display a loading indicator while the table's columns and/or data are being loaded.\n */\nexport const DataTableMeterBarChartColumnTypeFeature =\n  constructMeterBarChartColumnTypeFeature();\n"],
+  "sourcesContent": ["/* oxlint-disable react/immutability */\nimport type {\n  CellData,\n  Column,\n  RowData,\n  TableFeature,\n} from '@tanstack/react-table';\nimport clsx from 'clsx';\nimport { isEmpty, isNumber } from 'lodash-es';\nimport { useEffect, useMemo, useRef, type JSX } from 'react';\n\nimport Spacings from '@dynatrace/strato-design-tokens/spacings';\nimport {\n  type ConvertibleUnit,\n  format,\n  type FormatOptions,\n  type Unit,\n} from '@dynatrace-sdk/units';\n\nimport * as styles from './MeterBarChart.sty.js';\nimport {\n  isFormatterOptions,\n  type Formatter,\n} from '../../../../charts/core/types/formatter.js';\nimport { MultiMeterBarChart } from '../../../../charts/meter-bar/multi-meter-bar/MultiMeterBarChart.js';\nimport { METER_BAR_SIZE } from '../../../../charts/meter-bar/shared/constants.js';\nimport type { MeterBarChartElementRef } from '../../../../charts/meter-bar/shared/types/meter-bars.js';\nimport { collapseThresholdShowIndicators } from '../../../../charts/meter-bar/shared/utils/collapse-threshold-show-indicators.js';\nimport { MeterBarChart } from '../../../../charts/meter-bar/single-meter-bar/MeterBarChart.js';\nimport { devLog } from '../../../../core/utils/logging.js';\nimport { isDisplayColumnDefConfig } from '../../hooks/useTable/datatable-typeguards.js';\nimport type {\n  DataTableColumnDef,\n  DataTableDisplayColumnDef,\n  DataTableRowData,\n} from '../../public.api.js';\nimport { isDatatableMeterBarColumnConfig } from '../ColumnTypes/column-types-types.js';\nimport type { DataTableMeterbarColumnConfig } from '../ColumnTypes/column-types-types.js';\nimport type { TDataTableFeatures } from '../types/features.types.js';\nimport type { DataTableOptions } from '../types/table.types.js';\n\n/** Default max value for meterbar column. */\nconst DEFAULT_MAX_VALUE = 100;\n\n/**\n * Type guard function ensures that the defined column contains the 'accessor' property.\n * @internal\n */\nfunction isColumnDefWithAccessor<TData extends DataTableRowData, TValue>(\n  column: unknown,\n): column is DataTableDisplayColumnDef<TData, TValue> {\n  return (\n    column !== null &&\n    column !== undefined &&\n    typeof column === 'object' &&\n    'accessor' in column\n  );\n}\n\ntype MeterBarChartRendererType<\n  TData extends RowData,\n  TValue extends CellData = CellData,\n> = {\n  value: number | { name: string; value: number; color?: string }[];\n  column: Column<TDataTableFeatures, TData, TValue>;\n};\n\n/**\n * Type guard to check value against MultiMeterBar values.\n * @internal\n */\nexport function isMultiMeterBarData(\n  value: unknown,\n): value is Array<{ name: string; value: number; color?: string }> {\n  return (\n    Array.isArray(value) &&\n    value.every(\n      (item) =>\n        typeof item === 'object' &&\n        typeof item.name === 'string' &&\n        typeof item.value === 'number' &&\n        (item.color === undefined || typeof item.color === 'string'),\n    )\n  );\n}\n\n/**\n * Formats the value for the meterbar chart based on the provided formatter or format options.\n * @param value - The numeric value to be formatted.\n * @param formatter - Optional formatter function or format options to format the value.\n * @returns The formatted value as a string.\n * @internal\n */\nfunction formatMeterBarValue(\n  value: number,\n  formatter?: Formatter | FormatOptions<Unit, ConvertibleUnit>,\n): string {\n  if (!formatter) {\n    return String(value);\n  }\n  if (isFormatterOptions(formatter)) {\n    return format(value, formatter);\n  }\n  return formatter(value);\n}\n\n/**\n * Resolves the effective column-level `showThresholdIndicators` value.\n *\n * The new column-level `showThresholdIndicators` flag always takes precedence.\n * When it is omitted, we fall back to the deprecated per-threshold\n * `showIndicator` flags so existing configs keep working without a breaking\n * change.\n * @internal\n */\nexport function resolveShowThresholdIndicators(\n  config: DataTableMeterbarColumnConfig,\n): boolean | undefined {\n  if (config?.showThresholdIndicators !== undefined) {\n    return config.showThresholdIndicators;\n  }\n\n  return collapseThresholdShowIndicators(\n    // oxlint-disable-next-line typescript/no-deprecated\n    (config?.thresholds ?? []).map((threshold) => threshold.showIndicator),\n    '[Table - MeterBar] The deprecated per-threshold `showIndicator` config ' +\n      'has mixed values and can no longer be represented per threshold. Use ' +\n      'the column-level `showThresholdIndicators` config to show or hide all ' +\n      'threshold indicators at once.',\n  );\n}\n\n/**\n * Intended for configuring and rendering the meterbar chart component.\n */\nexport function MeterBarChartRenderer<\n  TData extends RowData,\n  TValue extends CellData = CellData,\n>({\n  value,\n  column,\n}: Readonly<MeterBarChartRendererType<TData, TValue>>): JSX.Element {\n  const chartRef = useRef<MeterBarChartElementRef>(null);\n\n  let config: DataTableMeterbarColumnConfig = {};\n  if (\n    column?.columnDef.meta &&\n    isDatatableMeterBarColumnConfig(\n      column.columnDef.meta.config,\n      column.columnDef.columnType,\n    )\n  ) {\n    config = column.columnDef.meta.config;\n  }\n\n  const columnId = column.columnDef.id ?? '';\n\n  const maxValuesFromState = column.table.atoms.meterbarChartMaxValues?.get();\n\n  const maxValue = !isEmpty(maxValuesFromState)\n    ? maxValuesFromState[columnId]\n    : DEFAULT_MAX_VALUE;\n\n  const listenerRef = useRef<((e?: PointerEvent) => void) | null>(null);\n\n  useEffect(() => {\n    // clean possible leftover event on unmount\n    return () => {\n      listenerRef.current?.();\n    };\n  }, []);\n\n  const registerUnpinOnPointerUp = config?.showTooltip\n    ? () => {\n        if (listenerRef.current) {\n          return;\n        }\n        const handler = (event: PointerEvent) => {\n          if (\n            (event.target as HTMLElement).closest('[role=\"tooltip\"]') !== null\n          ) {\n            return;\n          }\n\n          chartRef.current?.unpinTooltip();\n          listenerRef.current?.();\n          listenerRef.current = null;\n        };\n        listenerRef.current = () =>\n          document.removeEventListener('pointerup', handler);\n        document.addEventListener('pointerup', handler);\n      }\n    : undefined;\n\n  // simple MeterBar\n  if (typeof value === 'number') {\n    const showValue = config?.showValue ?? false;\n    const showThresholdIndicators = resolveShowThresholdIndicators(config);\n    const hasVisibleThresholds =\n      showThresholdIndicators !== false &&\n      (config?.thresholds?.length ?? 0) > 0;\n\n    const chart = (\n      <MeterBarChart\n        value={value}\n        min={config?.min}\n        max={maxValue}\n        color={config?.color as string}\n        size={METER_BAR_SIZE.Size8}\n        width=\"100%\"\n        // Override the chart's default height: '100%'.\n        height=\"auto\"\n        showThresholdIndicators={showThresholdIndicators}\n        // The threshold interval bars add height below the bar\n        // so trim the vertical padding when they are visible\n        // to keep the cell height consistent.\n        style={{\n          padding: `${\n            hasVisibleThresholds ? Spacings.Size4 : Spacings.Size6\n          } 0`,\n        }}\n        formatter={config?.formatter}\n        ref={chartRef}\n      >\n        <MeterBarChart.Tooltip hidden={!config?.showTooltip} />\n        {config?.thresholds?.map((threshold) => (\n          <MeterBarChart.ThresholdIndicator\n            key={`threshold-${threshold.color}-${threshold.value}`}\n            // DEPRECATION: [APPDEV-15843] BREAKING-CHANGE: Remove `name` from `thresholds`\n            // oxlint-disable-next-line typescript/no-deprecated\n            name={threshold.name}\n            color={threshold.color}\n            value={threshold.value}\n          />\n        ))}\n      </MeterBarChart>\n    );\n\n    return (\n      <span\n        className={clsx({\n          [styles.wrapperVariants.shown]: showValue !== false,\n          [styles.wrapperVariants.hidden]: showValue === false,\n        })}\n        onClick={registerUnpinOnPointerUp}\n        role=\"none\"\n      >\n        {showValue !== false && (\n          <span className={styles.inlineValueVariants[showValue]}>\n            {formatMeterBarValue(value, config?.formatter)}\n          </span>\n        )}\n        {chart}\n      </span>\n    );\n  }\n\n  const isMultiMeterData = isMultiMeterBarData(value);\n  if (!isMultiMeterData) {\n    devLog('Invalid meter chart data.');\n  }\n\n  return (\n    <span\n      style={{ display: 'contents' }}\n      onClick={registerUnpinOnPointerUp}\n      role=\"none\"\n    >\n      <MultiMeterBarChart\n        size={METER_BAR_SIZE.Size8}\n        min={config?.min}\n        max={maxValue}\n        colorPalette={config?.colorPalette || 'categorical'}\n        width=\"100%\"\n        // Override the chart's default height: '100%'.\n        height=\"auto\"\n        style={{ padding: `${Spacings.Size6} 0` }}\n        formatter={config?.formatter}\n        ref={chartRef}\n      >\n        {\n          // only if this is multi meter data render segments\n          isMultiMeterData &&\n            value.map((data) => (\n              <MultiMeterBarChart.Segment\n                key={`${data.name}-${data.value}`}\n                name={data.name}\n                value={data.value}\n                color={data?.color}\n              />\n            ))\n        }\n        <MultiMeterBarChart.Tooltip\n          variant=\"shared\"\n          hidden={!config?.showTooltip}\n        />\n      </MultiMeterBarChart>\n    </span>\n  );\n}\n\n/**\n * Gets the highest total max values in a meterbar column.\n *\n * @param data - table data\n * @param columns - table column definition\n * @returns record of highest total max value per column\n * @internal\n */\nexport function getTotalMaxFromMeterbarChartData<\n  TData extends DataTableRowData,\n>(data: TData[], columns: DataTableColumnDef<TData>[]): Record<string, number> {\n  const meterbarColumns = columns.filter(\n    (columnDef) =>\n      isDisplayColumnDefConfig<TData>(columnDef) &&\n      columnDef.columnType === 'meterbar',\n  );\n\n  const maxValuesStorage: Record<string, number> = {};\n\n  for (const row of data) {\n    for (const columnDef of meterbarColumns) {\n      if (isColumnDefWithAccessor(columnDef)) {\n        const { accessor, config, id: columnId } = columnDef;\n\n        const configuredMax: number | 'data-max' | undefined =\n          isDatatableMeterBarColumnConfig(config, columnDef.columnType)\n            ? config.max\n            : undefined;\n\n        const meterbarValue = row as Record<string, unknown>;\n\n        const meterbarDataEntry =\n          typeof accessor === 'string'\n            ? meterbarValue[accessor]\n            : accessor(row);\n\n        let totalValue = DEFAULT_MAX_VALUE;\n\n        if (isNumber(configuredMax)) {\n          maxValuesStorage[columnId] = configuredMax;\n          continue;\n        }\n\n        if (meterbarDataEntry) {\n          if (Array.isArray(meterbarDataEntry)) {\n            totalValue = meterbarDataEntry.reduce(\n              (acc, current) => acc + current.value,\n              0,\n            );\n          } else {\n            const entry = isNumber(meterbarDataEntry)\n              ? meterbarDataEntry\n              : DEFAULT_MAX_VALUE;\n            totalValue =\n              configuredMax === 'data-max'\n                ? entry\n                : Math.max(entry, DEFAULT_MAX_VALUE);\n          }\n        }\n\n        maxValuesStorage[columnId] = Math.max(\n          maxValuesStorage[columnId] ?? totalValue,\n          totalValue,\n        );\n      }\n    }\n  }\n\n  return maxValuesStorage;\n}\n\n/**\n * Configuration hook for the DataTable Meterbar Chart feature.\n * @internal\n */\nexport function useMeterBarChartMaxValuesCalc<TData extends DataTableRowData>(\n  props: {\n    data: TData[];\n    columns: DataTableColumnDef<TData>[];\n  },\n  options: DataTableOptions<Exclude<TData, unknown>>,\n): void {\n  const meterbarChartMaxValues = useMemo(\n    () => getTotalMaxFromMeterbarChartData<TData>(props.data, props.columns),\n    [props.columns, props.data],\n  );\n\n  options.state = {\n    ...options.state,\n    meterbarChartMaxValues,\n  };\n}\n\nexport function constructMeterBarChartColumnTypeFeature(): TableFeature {\n  return {\n    getInitialState: (initialState) => {\n      return {\n        meterbarChartMaxValues: null,\n        ...initialState,\n      };\n    },\n  };\n}\n\n/**\n * DataTableMeterBarChartColumnTypeFeature is the plugin that provides the loading state for the DataTable,\n * which can be used to display a loading indicator while the table's columns and/or data are being loaded.\n */\nexport const DataTableMeterBarChartColumnTypeFeature =\n  constructMeterBarChartColumnTypeFeature();\n"],
   "mappings": "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",
   "names": []
 }

package/esm/tables/DataTable/features/MeterBarChart/MeterBarChart.sty.js

@@ -1,6 +1,6 @@
 import "./MeterBarChart.css";
-var inlineValueVariants = { left: "_116rojq3-3-13-3 _116rojq2-3-13-3", right: "_116rojq4-3-13-3 _116rojq2-3-13-3" };
-var wrapperVariants = { shown: "_116rojq0-3-13-3", hidden: "_116rojq1-3-13-3" };
+var inlineValueVariants = { left: "_116rojq3-3-14-0 _116rojq2-3-14-0", right: "_116rojq4-3-14-0 _116rojq2-3-14-0" };
+var wrapperVariants = { shown: "_116rojq0-3-14-0", hidden: "_116rojq1-3-14-0" };
 export {
   inlineValueVariants,
   wrapperVariants

package/esm/tables/DataTable/features/MeterBarChart/MeterBarChart.sty.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../../src/tables/DataTable/features/MeterBarChart/MeterBarChart.css.ts"],
-  "sourcesContent": ["import './MeterBarChart.css';\nexport var inlineValueVariants = {left:'_116rojq3-3-13-3 _116rojq2-3-13-3',right:'_116rojq4-3-13-3 _116rojq2-3-13-3'};\nexport var wrapperVariants = {shown:'_116rojq0-3-13-3',hidden:'_116rojq1-3-13-3'};"],
+  "sourcesContent": ["import './MeterBarChart.css';\nexport var inlineValueVariants = {left:'_116rojq3-3-14-0 _116rojq2-3-14-0',right:'_116rojq4-3-14-0 _116rojq2-3-14-0'};\nexport var wrapperVariants = {shown:'_116rojq0-3-14-0',hidden:'_116rojq1-3-14-0'};"],
   "mappings": "AAAA,OAAO;AACA,IAAI,sBAAsB,EAAC,MAAK,qCAAoC,OAAM,oCAAmC;AAC7G,IAAI,kBAAkB,EAAC,OAAM,oBAAmB,QAAO,mBAAkB;",
   "names": []
 }

package/esm/tables/DataTable/features/RowDetails/RowDetails.css

@@ -1,4 +1,4 @@
-._2twyod0-3-13-3::before {
+._2twyod0-3-14-0::before {
   content: "";
   display: block;
   top: 0;
@@ -8,10 +8,10 @@
   width: 100%;
   z-index: 4;
 }
-._or8s40-3-13-3 ._2twyod0-3-13-3::before, ._2twyod0-3-13-3:not(:first-child)::before {
+._or8s40-3-14-0 ._2twyod0-3-14-0::before, ._2twyod0-3-14-0:not(:first-child)::before {
   background-color: var(--dt-colors-border-neutral-accent, #595a7d);
 }
-._2twyod1-3-13-3 {
+._2twyod1-3-14-0 {
   position: relative;
   box-sizing: border-box;
   border-bottom-width: 1px;
@@ -19,40 +19,40 @@
   border-bottom-color: transparent;
   overflow: hidden;
 }
-._2twyod1-3-13-3:not(:has(+ ._2twyod0-3-13-3)) {
+._2twyod1-3-14-0:not(:has(+ ._2twyod0-3-14-0)) {
   border-bottom-color: var(--dt-colors-border-neutral-accent, #595a7d);
 }
-._2twyod4-3-13-3:not(._or8s40-3-13-3 ._2twyod4-3-13-3) {
+._2twyod4-3-14-0:not(._or8s40-3-14-0 ._2twyod4-3-14-0) {
   opacity: 0;
 }
-._2twyod6-3-13-3 {
+._2twyod6-3-14-0 {
   border-top: var(--dt-borders-width-default, 1px) var(--dt-borders-style-default, solid) var(--dt-colors-border-neutral-default, #dadbe4);
 }
-._2twyod7-3-13-3 {
+._2twyod7-3-14-0 {
   border-top: var(--dt-borders-width-default, 1px) var(--dt-borders-style-default, solid) var(--dt-colors-border-neutral-default, #dadbe4);
 }
-._2twyod8-3-13-3 {
+._2twyod8-3-14-0 {
   border-bottom-width: 0;
 }
-._2twyod9-3-13-3 {
+._2twyod9-3-14-0 {
   background-color: var(--dt-colors-background-surface-default, #fff);
 }
-._2twyoda-3-13-3 {
+._2twyoda-3-14-0 {
   background-color: var(--dt-colors-background-container-neutral-subdued, #f9f9fa);
 }
-._2twyodc-3-13-3 {
+._2twyodc-3-14-0 {
   padding-top: var(--dt-spacings-size-8, 8px);
   padding-right: var(--dt-spacings-size-12, 12px);
   padding-bottom: var(--dt-spacings-size-8, 8px);
   padding-left: var(--dt-spacings-size-12, 12px);
 }
-._2twyodd-3-13-3 {
+._2twyodd-3-14-0 {
   padding-top: var(--dt-spacings-size-2, 2px);
   padding-right: var(--dt-spacings-size-6, 6px);
   padding-bottom: var(--dt-spacings-size-2, 2px);
   padding-left: var(--dt-spacings-size-6, 6px);
 }
-._2twyode-3-13-3 {
+._2twyode-3-14-0 {
   padding-top: var(--dt-spacings-size-12, 12px);
   padding-right: var(--dt-spacings-size-16, 16px);
   padding-bottom: var(--dt-spacings-size-12, 12px);

package/esm/tables/DataTable/features/RowDetails/RowDetails.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../../src/tables/DataTable/features/RowDetails/RowDetails.tsx"],
-  "sourcesContent": ["import {\n  assignPrototypeAPIs,\n  assignTableAPIs,\n  type CellData,\n  type ColumnDef,\n  type Row,\n  type RowData,\n  type Table,\n  type TableFeature,\n} from '@tanstack/react-table';\nimport { uniqueId } from 'lodash-es';\nimport {\n  Children,\n  isValidElement,\n  type PropsWithChildren,\n  type ReactElement,\n  type ReactNode,\n  useMemo,\n} from 'react';\n\nimport type {\n  DataTableExpandableRowProps,\n  DataTableRowDetailState,\n} from './row-details-types.js';\nimport { useControllableState } from '../../../../core/hooks/useControllableState.js';\nimport { isSlot } from '../../../../core/utils/is-slot.js';\nimport { DATA_TABLE_ROW_DETAILS_COLUMN_ID } from '../../constants.js';\nimport type { DataTableRowData } from '../../public.api.js';\nimport type { TDataTableFeatures } from '../types/features.types.js';\nimport {\n  createPrototypeConstructor,\n  createTableConstructor,\n} from '../types/table.types.js';\nimport type { DataTableOptions } from '../types/table.types.js';\n\n/**\n * DataTable slot selection for expandable rows.\n * @public\n */\nexport function DataTableExpandableRowTemplate<TData extends DataTableRowData>(\n  props: DataTableExpandableRowProps<TData>,\n) {\n  return null;\n}\n\n/**\n * Type guard to ensure that a react element is a `DataTable.ExpandableRow` element.\n * @internal\n */\nfunction isDataTableExpandableRowTemplate<TData extends DataTableRowData>(\n  child: unknown,\n): child is ReactElement<DataTableExpandableRowProps<TData>> {\n  return isValidElement(child) && isSlot(child, DataTableExpandableRowTemplate);\n}\n\n/**\n * Helper function to identify the ROW_DETAILS_COLUMN\n * @internal\n */\nexport function isRowDetailsColumnDef<\n  TData extends RowData,\n  TValue extends CellData = CellData,\n>(column: ColumnDef<TDataTableFeatures, TData, TValue>): boolean {\n  return column.id === DATA_TABLE_ROW_DETAILS_COLUMN_ID;\n}\n\n/**\n * Configuration hook for expandable rows of the DataTable.\n * @internal\n */\nexport function useRowDetails<TData extends DataTableRowData>(\n  props: PropsWithChildren,\n  options: DataTableOptions<Exclude<TData, unknown>>,\n): void {\n  const { children } = props;\n  const rowDetailsTemplateProps = useMemo(() => {\n    for (const child of Children.toArray(children)) {\n      if (isDataTableExpandableRowTemplate<TData>(child)) {\n        return child?.props;\n      }\n    }\n  }, [children]);\n\n  const [openRowDetails, setOpenRowDetails] = useControllableState({\n    value: rowDetailsTemplateProps?.expandedRows,\n    defaultValue: rowDetailsTemplateProps?.defaultExpandedRows,\n    onChange: (value) => {\n      if (value !== true) {\n        rowDetailsTemplateProps?.onExpandedRowsChange?.(value);\n      }\n    },\n  });\n\n  const template = rowDetailsTemplateProps?.children;\n  if (template !== undefined && typeof template === 'function') {\n    // eslint-disable-next-line react-hooks/immutability\n    options.enableRowDetails = true;\n    // Cast is necessary to align the public template interface with the internal rowData\n    // eslint-disable-next-line react-hooks/immutability\n    options.rowDetailsTemplate = template as (params: {\n      row: RowData;\n    }) => ReactNode;\n    // Cast is necessary to align the public template interface with the internal rowData\n    // eslint-disable-next-line react-hooks/immutability\n    options.rowDetailsDisableRow = rowDetailsTemplateProps?.disableExpand as (\n      row: DataTableRowData,\n    ) => boolean;\n\n    // eslint-disable-next-line react-hooks/immutability\n    options.state = {\n      ...options.state,\n      rowDetails: openRowDetails,\n    };\n    // eslint-disable-next-line react-hooks/immutability\n    options.onRowDetailsOpenChange = setOpenRowDetails;\n  }\n}\n\n/**\n * Allows access to the row model coming before the row details.\n */\nexport function table_getPreRowDetailsRowModel<TData extends RowData>(\n  table: Table<TDataTableFeatures, TData>,\n) {\n  return table.getPaginatedRowModel();\n}\n\n/**\n * Allows access to the row details model if available.\n */\nexport function table_getRowDetailsRowModel<TData extends RowData>(\n  table: Table<TDataTableFeatures, TData>,\n) {\n  table._rowModels.detailsRowModel ??= table.options.detailsRowModel?.(table);\n\n  if (!table.options.enableRowDetails || !table._rowModels.detailsRowModel) {\n    return table.getPreRowDetailsRowModel();\n  }\n\n  return table._rowModels.detailsRowModel();\n}\n\n/**\n * Helper to get a unique id for the table instance.\n * @internal\n */\nexport function table_rowDetailsTableId<TData extends RowData>(\n  table: Table<TDataTableFeatures, TData>,\n) {\n  if (!table._rowDetailsTableId) {\n    table._rowDetailsTableId = uniqueId('DataTable-');\n  }\n  return table._rowDetailsTableId;\n}\n\n/**\n * Determines if the details row for a particular row is open.\n * @internal\n */\nexport function row_getIsDetailsOpen<TData extends RowData>(\n  row: Row<TDataTableFeatures, TData>,\n): boolean {\n  const detailOpenState = row.table.atoms.rowDetails?.get() ?? false;\n\n  if (typeof detailOpenState === 'boolean') {\n    return detailOpenState;\n  }\n  return detailOpenState[row.id] === true;\n}\n\n/**\n * Defines the grid position for the row details row.\n * @internal\n */\nexport function row_getRowDetailsGridPosition<TData extends RowData>(\n  row: Row<TDataTableFeatures, TData>,\n) {\n  return {\n    gridColumnStart: 1,\n    gridColumnEnd: `span ${row.table.getVisibleLeafColumns().length}`,\n  };\n}\n\n/**\n * Returns the aria control id to connect the expanding button to the\n * row details wrapper.\n * @internal\n */\nexport function row_getRowDetailsAriaControlsId<TData extends RowData>(\n  row: Row<TDataTableFeatures, TData>,\n): string {\n  return `${row.table.rowDetailsTableId()}-${row.id}-expand`;\n}\n\n/**\n * Determines if the details for this row can be shown.\n * @internal\n */\nexport function row_getCanOpenDetails<TData extends RowData>(\n  row: Row<TDataTableFeatures, TData>,\n): boolean {\n  if (typeof row.table.options.rowDetailsDisableRow === 'function') {\n    return !row.table.options.rowDetailsDisableRow(row.original);\n  }\n  return true;\n}\n\n/**\n * Control command to toggle the state of the rowDetails.\n * @internal\n */\nexport function row_toggleDetails<TData extends RowData>(\n  row: Row<TDataTableFeatures, TData>,\n) {\n  // remember current scroll position\n  const scrollOffset = row.table.getRowScrollOffset();\n\n  // expand/collapse details\n  row.table.options.onRowDetailsOpenChange?.(\n    (prev: DataTableRowDetailState) => {\n      let newRowDetailsState: DataTableRowDetailState = {};\n      if (typeof prev === 'boolean' && prev === true) {\n        const flatRows = row.table.getRowModel().flatRows;\n        for (const flatRow of flatRows) {\n          if (row.getCanOpenDetails() && row.id !== flatRow.id) {\n            newRowDetailsState[flatRow.id] = true;\n          }\n        }\n        return newRowDetailsState;\n      }\n\n      newRowDetailsState = { ...prev };\n      if (newRowDetailsState[row.id] === true) {\n        delete newRowDetailsState[row.id];\n      } else {\n        newRowDetailsState[row.id] = true;\n      }\n      return newRowDetailsState;\n    },\n  );\n\n  // scroll back to original scroll position to avoid row jumping\n  requestAnimationFrame(() => {\n    row.table.scrollToRowOffset(scrollOffset);\n  });\n}\n\n/**\n * Constructs the column row details for the table,\n * including API implementations and prototype assignments.\n * @internal\n */\nexport function constructRowDetailsFeature(): TableFeature {\n  return {\n    getInitialState: (initialState) => {\n      return {\n        rowDetails: {},\n        ...initialState,\n      };\n    },\n    assignRowPrototype: createPrototypeConstructor(\n      (\n        prototype: Record<string, unknown>,\n        table: Table<TDataTableFeatures, RowData>,\n      ) => {\n        assignPrototypeAPIs('DataTableRowDetailsFeature', prototype, table, {\n          row_getIsDetailsOpen: { fn: (row) => row_getIsDetailsOpen(row) },\n          row_getRowDetailsGridPosition: {\n            fn: (row) => row_getRowDetailsGridPosition(row),\n          },\n          row_getRowDetailsAriaControlsId: {\n            fn: (row) => row_getRowDetailsAriaControlsId(row),\n          },\n          row_getCanOpenDetails: { fn: (row) => row_getCanOpenDetails(row) },\n          row_toggleDetails: { fn: (row) => row_toggleDetails(row) },\n        });\n      },\n    ),\n    constructTableAPIs: createTableConstructor(\n      (table: Table<TDataTableFeatures, RowData>) => {\n        assignTableAPIs('DataTableRowDetailsFeature', table, {\n          table_rowDetailsTableId: {\n            fn: () => table_rowDetailsTableId(table),\n          },\n          table_getPreRowDetailsRowModel: {\n            fn: () => table_getPreRowDetailsRowModel(table),\n          },\n          table_getRowDetailsRowModel: {\n            fn: () => table_getRowDetailsRowModel(table),\n          },\n          table_getRowModel: {\n            fn: () => table_getRowDetailsRowModel(table),\n          },\n        });\n      },\n    ),\n  };\n}\n\n/**\n * Feature implementation for Row Details.\n * @internal\n */\nexport const DataTableRowDetailsFeature = constructRowDetailsFeature();\n"],
+  "sourcesContent": ["import {\n  assignPrototypeAPIs,\n  assignTableAPIs,\n  type CellData,\n  type ColumnDef,\n  type Row,\n  type RowData,\n  type Table,\n  type TableFeature,\n} from '@tanstack/react-table';\nimport { uniqueId } from 'lodash-es';\nimport {\n  Children,\n  isValidElement,\n  type PropsWithChildren,\n  type ReactElement,\n  type ReactNode,\n  useMemo,\n} from 'react';\n\nimport type {\n  DataTableExpandableRowProps,\n  DataTableRowDetailState,\n} from './row-details-types.js';\nimport { useControllableState } from '../../../../core/hooks/useControllableState.js';\nimport { isSlot } from '../../../../core/utils/is-slot.js';\nimport { DATA_TABLE_ROW_DETAILS_COLUMN_ID } from '../../constants.js';\nimport type { DataTableRowData } from '../../public.api.js';\nimport type { TDataTableFeatures } from '../types/features.types.js';\nimport {\n  createPrototypeConstructor,\n  createTableConstructor,\n} from '../types/table.types.js';\nimport type { DataTableOptions } from '../types/table.types.js';\n\n/**\n * DataTable slot selection for expandable rows.\n * @public\n */\nexport function DataTableExpandableRowTemplate<TData extends DataTableRowData>(\n  props: DataTableExpandableRowProps<TData>,\n) {\n  return null;\n}\n\n/**\n * Type guard to ensure that a react element is a `DataTable.ExpandableRow` element.\n * @internal\n */\nfunction isDataTableExpandableRowTemplate<TData extends DataTableRowData>(\n  child: unknown,\n): child is ReactElement<DataTableExpandableRowProps<TData>> {\n  return isValidElement(child) && isSlot(child, DataTableExpandableRowTemplate);\n}\n\n/**\n * Helper function to identify the ROW_DETAILS_COLUMN\n * @internal\n */\nexport function isRowDetailsColumnDef<\n  TData extends RowData,\n  TValue extends CellData = CellData,\n>(column: ColumnDef<TDataTableFeatures, TData, TValue>): boolean {\n  return column.id === DATA_TABLE_ROW_DETAILS_COLUMN_ID;\n}\n\n/**\n * Configuration hook for expandable rows of the DataTable.\n * @internal\n */\nexport function useRowDetails<TData extends DataTableRowData>(\n  props: PropsWithChildren,\n  options: DataTableOptions<Exclude<TData, unknown>>,\n): void {\n  const { children } = props;\n  const rowDetailsTemplateProps = useMemo(() => {\n    for (const child of Children.toArray(children)) {\n      if (isDataTableExpandableRowTemplate<TData>(child)) {\n        return child?.props;\n      }\n    }\n  }, [children]);\n\n  const [openRowDetails, setOpenRowDetails] = useControllableState({\n    value: rowDetailsTemplateProps?.expandedRows,\n    defaultValue: rowDetailsTemplateProps?.defaultExpandedRows,\n    onChange: (value) => {\n      if (value !== true) {\n        rowDetailsTemplateProps?.onExpandedRowsChange?.(value);\n      }\n    },\n  });\n\n  const template = rowDetailsTemplateProps?.children;\n  if (template !== undefined && typeof template === 'function') {\n    // oxlint-disable-next-line react/immutability\n    options.enableRowDetails = true;\n    // Cast is necessary to align the public template interface with the internal rowData\n    // oxlint-disable-next-line react/immutability\n    options.rowDetailsTemplate = template as (params: {\n      row: RowData;\n    }) => ReactNode;\n    // Cast is necessary to align the public template interface with the internal rowData\n    // oxlint-disable-next-line react/immutability\n    options.rowDetailsDisableRow = rowDetailsTemplateProps?.disableExpand as (\n      row: DataTableRowData,\n    ) => boolean;\n\n    // oxlint-disable-next-line react/immutability\n    options.state = {\n      ...options.state,\n      rowDetails: openRowDetails,\n    };\n    // oxlint-disable-next-line react/immutability\n    options.onRowDetailsOpenChange = setOpenRowDetails;\n  }\n}\n\n/**\n * Allows access to the row model coming before the row details.\n */\nexport function table_getPreRowDetailsRowModel<TData extends RowData>(\n  table: Table<TDataTableFeatures, TData>,\n) {\n  return table.getPaginatedRowModel();\n}\n\n/**\n * Allows access to the row details model if available.\n */\nexport function table_getRowDetailsRowModel<TData extends RowData>(\n  table: Table<TDataTableFeatures, TData>,\n) {\n  table._rowModels.detailsRowModel ??= table.options.detailsRowModel?.(table);\n\n  if (!table.options.enableRowDetails || !table._rowModels.detailsRowModel) {\n    return table.getPreRowDetailsRowModel();\n  }\n\n  return table._rowModels.detailsRowModel();\n}\n\n/**\n * Helper to get a unique id for the table instance.\n * @internal\n */\nexport function table_rowDetailsTableId<TData extends RowData>(\n  table: Table<TDataTableFeatures, TData>,\n) {\n  if (!table._rowDetailsTableId) {\n    table._rowDetailsTableId = uniqueId('DataTable-');\n  }\n  return table._rowDetailsTableId;\n}\n\n/**\n * Determines if the details row for a particular row is open.\n * @internal\n */\nexport function row_getIsDetailsOpen<TData extends RowData>(\n  row: Row<TDataTableFeatures, TData>,\n): boolean {\n  const detailOpenState = row.table.atoms.rowDetails?.get() ?? false;\n\n  if (typeof detailOpenState === 'boolean') {\n    return detailOpenState;\n  }\n  return detailOpenState[row.id] === true;\n}\n\n/**\n * Defines the grid position for the row details row.\n * @internal\n */\nexport function row_getRowDetailsGridPosition<TData extends RowData>(\n  row: Row<TDataTableFeatures, TData>,\n) {\n  return {\n    gridColumnStart: 1,\n    gridColumnEnd: `span ${row.table.getVisibleLeafColumns().length}`,\n  };\n}\n\n/**\n * Returns the aria control id to connect the expanding button to the\n * row details wrapper.\n * @internal\n */\nexport function row_getRowDetailsAriaControlsId<TData extends RowData>(\n  row: Row<TDataTableFeatures, TData>,\n): string {\n  return `${row.table.rowDetailsTableId()}-${row.id}-expand`;\n}\n\n/**\n * Determines if the details for this row can be shown.\n * @internal\n */\nexport function row_getCanOpenDetails<TData extends RowData>(\n  row: Row<TDataTableFeatures, TData>,\n): boolean {\n  if (typeof row.table.options.rowDetailsDisableRow === 'function') {\n    return !row.table.options.rowDetailsDisableRow(row.original);\n  }\n  return true;\n}\n\n/**\n * Control command to toggle the state of the rowDetails.\n * @internal\n */\nexport function row_toggleDetails<TData extends RowData>(\n  row: Row<TDataTableFeatures, TData>,\n) {\n  // remember current scroll position\n  const scrollOffset = row.table.getRowScrollOffset();\n\n  // expand/collapse details\n  row.table.options.onRowDetailsOpenChange?.(\n    (prev: DataTableRowDetailState) => {\n      let newRowDetailsState: DataTableRowDetailState = {};\n      if (typeof prev === 'boolean' && prev === true) {\n        const flatRows = row.table.getRowModel().flatRows;\n        for (const flatRow of flatRows) {\n          if (row.getCanOpenDetails() && row.id !== flatRow.id) {\n            newRowDetailsState[flatRow.id] = true;\n          }\n        }\n        return newRowDetailsState;\n      }\n\n      newRowDetailsState = { ...prev };\n      if (newRowDetailsState[row.id] === true) {\n        delete newRowDetailsState[row.id];\n      } else {\n        newRowDetailsState[row.id] = true;\n      }\n      return newRowDetailsState;\n    },\n  );\n\n  // scroll back to original scroll position to avoid row jumping\n  requestAnimationFrame(() => {\n    row.table.scrollToRowOffset(scrollOffset);\n  });\n}\n\n/**\n * Constructs the column row details for the table,\n * including API implementations and prototype assignments.\n * @internal\n */\nexport function constructRowDetailsFeature(): TableFeature {\n  return {\n    getInitialState: (initialState) => {\n      return {\n        rowDetails: {},\n        ...initialState,\n      };\n    },\n    assignRowPrototype: createPrototypeConstructor(\n      (\n        prototype: Record<string, unknown>,\n        table: Table<TDataTableFeatures, RowData>,\n      ) => {\n        assignPrototypeAPIs('DataTableRowDetailsFeature', prototype, table, {\n          row_getIsDetailsOpen: { fn: (row) => row_getIsDetailsOpen(row) },\n          row_getRowDetailsGridPosition: {\n            fn: (row) => row_getRowDetailsGridPosition(row),\n          },\n          row_getRowDetailsAriaControlsId: {\n            fn: (row) => row_getRowDetailsAriaControlsId(row),\n          },\n          row_getCanOpenDetails: { fn: (row) => row_getCanOpenDetails(row) },\n          row_toggleDetails: { fn: (row) => row_toggleDetails(row) },\n        });\n      },\n    ),\n    constructTableAPIs: createTableConstructor(\n      (table: Table<TDataTableFeatures, RowData>) => {\n        assignTableAPIs('DataTableRowDetailsFeature', table, {\n          table_rowDetailsTableId: {\n            fn: () => table_rowDetailsTableId(table),\n          },\n          table_getPreRowDetailsRowModel: {\n            fn: () => table_getPreRowDetailsRowModel(table),\n          },\n          table_getRowDetailsRowModel: {\n            fn: () => table_getRowDetailsRowModel(table),\n          },\n          table_getRowModel: {\n            fn: () => table_getRowDetailsRowModel(table),\n          },\n        });\n      },\n    ),\n  };\n}\n\n/**\n * Feature implementation for Row Details.\n * @internal\n */\nexport const DataTableRowDetailsFeature = constructRowDetailsFeature();\n"],
   "mappings": "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",
   "names": []
 }

package/esm/tables/DataTable/features/RowDetails/RowDetails.sty.js

@@ -1,9 +1,9 @@
 import "../RowOrder/RowOrder.css";
 import "./RowDetails.css";
 import { createRuntimeFn as _7a468 } from "@vanilla-extract/recipes/createRuntimeFn";
-var rowDetailsExpandedRowCell = "_2twyod0-3-13-3";
-var rowDetailsRow = _7a468({ defaultClassName: "_2twyod1-3-13-3", variantClassNames: { rowParity: { even: "_2twyod2-3-13-3", odd: "_2twyod3-3-13-3" }, isDraggedRow: { true: "_2twyod4-3-13-3" }, rowSeparation: { none: "_2twyod5-3-13-3", horizontalDividers: "_2twyod6-3-13-3", zebraStripes: "_2twyod7-3-13-3" }, isLastRow: { true: "_2twyod8-3-13-3" } }, defaultVariants: {}, compoundVariants: [[{ rowSeparation: "zebraStripes", rowParity: "even" }, "_2twyod9-3-13-3"], [{ rowSeparation: "zebraStripes", rowParity: "odd" }, "_2twyoda-3-13-3"]] });
-var rowDetailsWrapper = _7a468({ defaultClassName: "_2twyodb-3-13-3", variantClassNames: { rowDensity: { "default": "_2twyodc-3-13-3", condensed: "_2twyodd-3-13-3", comfortable: "_2twyode-3-13-3" } }, defaultVariants: { rowDensity: "default" }, compoundVariants: [] });
+var rowDetailsExpandedRowCell = "_2twyod0-3-14-0";
+var rowDetailsRow = _7a468({ defaultClassName: "_2twyod1-3-14-0", variantClassNames: { rowParity: { even: "_2twyod2-3-14-0", odd: "_2twyod3-3-14-0" }, isDraggedRow: { true: "_2twyod4-3-14-0" }, rowSeparation: { none: "_2twyod5-3-14-0", horizontalDividers: "_2twyod6-3-14-0", zebraStripes: "_2twyod7-3-14-0" }, isLastRow: { true: "_2twyod8-3-14-0" } }, defaultVariants: {}, compoundVariants: [[{ rowSeparation: "zebraStripes", rowParity: "even" }, "_2twyod9-3-14-0"], [{ rowSeparation: "zebraStripes", rowParity: "odd" }, "_2twyoda-3-14-0"]] });
+var rowDetailsWrapper = _7a468({ defaultClassName: "_2twyodb-3-14-0", variantClassNames: { rowDensity: { "default": "_2twyodc-3-14-0", condensed: "_2twyodd-3-14-0", comfortable: "_2twyode-3-14-0" } }, defaultVariants: { rowDensity: "default" }, compoundVariants: [] });
 export {
   rowDetailsExpandedRowCell,
   rowDetailsRow,

package/esm/tables/DataTable/features/RowDetails/RowDetails.sty.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../../src/tables/DataTable/features/RowDetails/RowDetails.css.ts"],
-  "sourcesContent": ["import '../RowOrder/RowOrder.css';\nimport './RowDetails.css';\nimport { createRuntimeFn as _7a468 } from '@vanilla-extract/recipes/createRuntimeFn';\nexport var rowDetailsExpandedRowCell = '_2twyod0-3-13-3';\nexport var rowDetailsRow = _7a468({defaultClassName:'_2twyod1-3-13-3',variantClassNames:{rowParity:{even:'_2twyod2-3-13-3',odd:'_2twyod3-3-13-3'},isDraggedRow:{true:'_2twyod4-3-13-3'},rowSeparation:{none:'_2twyod5-3-13-3',horizontalDividers:'_2twyod6-3-13-3',zebraStripes:'_2twyod7-3-13-3'},isLastRow:{true:'_2twyod8-3-13-3'}},defaultVariants:{},compoundVariants:[[{rowSeparation:'zebraStripes',rowParity:'even'},'_2twyod9-3-13-3'],[{rowSeparation:'zebraStripes',rowParity:'odd'},'_2twyoda-3-13-3']]});\nexport var rowDetailsWrapper = _7a468({defaultClassName:'_2twyodb-3-13-3',variantClassNames:{rowDensity:{'default':'_2twyodc-3-13-3',condensed:'_2twyodd-3-13-3',comfortable:'_2twyode-3-13-3'}},defaultVariants:{rowDensity:'default'},compoundVariants:[]});"],
+  "sourcesContent": ["import '../RowOrder/RowOrder.css';\nimport './RowDetails.css';\nimport { createRuntimeFn as _7a468 } from '@vanilla-extract/recipes/createRuntimeFn';\nexport var rowDetailsExpandedRowCell = '_2twyod0-3-14-0';\nexport var rowDetailsRow = _7a468({defaultClassName:'_2twyod1-3-14-0',variantClassNames:{rowParity:{even:'_2twyod2-3-14-0',odd:'_2twyod3-3-14-0'},isDraggedRow:{true:'_2twyod4-3-14-0'},rowSeparation:{none:'_2twyod5-3-14-0',horizontalDividers:'_2twyod6-3-14-0',zebraStripes:'_2twyod7-3-14-0'},isLastRow:{true:'_2twyod8-3-14-0'}},defaultVariants:{},compoundVariants:[[{rowSeparation:'zebraStripes',rowParity:'even'},'_2twyod9-3-14-0'],[{rowSeparation:'zebraStripes',rowParity:'odd'},'_2twyoda-3-14-0']]});\nexport var rowDetailsWrapper = _7a468({defaultClassName:'_2twyodb-3-14-0',variantClassNames:{rowDensity:{'default':'_2twyodc-3-14-0',condensed:'_2twyodd-3-14-0',comfortable:'_2twyode-3-14-0'}},defaultVariants:{rowDensity:'default'},compoundVariants:[]});"],
   "mappings": "AAAA,OAAO;AACP,OAAO;AACP,SAAS,mBAAmB,cAAc;AACnC,IAAI,4BAA4B;AAChC,IAAI,gBAAgB,OAAO,EAAC,kBAAiB,mBAAkB,mBAAkB,EAAC,WAAU,EAAC,MAAK,mBAAkB,KAAI,kBAAiB,GAAE,cAAa,EAAC,MAAK,kBAAiB,GAAE,eAAc,EAAC,MAAK,mBAAkB,oBAAmB,mBAAkB,cAAa,kBAAiB,GAAE,WAAU,EAAC,MAAK,kBAAiB,EAAC,GAAE,iBAAgB,CAAC,GAAE,kBAAiB,CAAC,CAAC,EAAC,eAAc,gBAAe,WAAU,OAAM,GAAE,iBAAiB,GAAE,CAAC,EAAC,eAAc,gBAAe,WAAU,MAAK,GAAE,iBAAiB,CAAC,EAAC,CAAC;AAC7e,IAAI,oBAAoB,OAAO,EAAC,kBAAiB,mBAAkB,mBAAkB,EAAC,YAAW,EAAC,WAAU,mBAAkB,WAAU,mBAAkB,aAAY,kBAAiB,EAAC,GAAE,iBAAgB,EAAC,YAAW,UAAS,GAAE,kBAAiB,CAAC,EAAC,CAAC;",
   "names": []
 }

package/esm/tables/DataTable/features/RowInteractivity/RowInteractivity.css

@@ -1,4 +1,4 @@
-._15silbj0-3-13-3 {
+._15silbj0-3-14-0 {
   box-sizing: border-box;
   appearance: none;
   outline: 0;
@@ -7,7 +7,7 @@
   position: relative;
   cursor: pointer;
 }
-._15silbj0-3-13-3::after {
+._15silbj0-3-14-0::after {
   content: "";
   position: absolute;
   top: 0;
@@ -20,55 +20,55 @@
   pointer-events: none;
   z-index: 4;
 }
-._15silbj1-3-13-3::after {
+._15silbj1-3-14-0::after {
   border-color: var(--dt-colors-border-primary-accent, #464cce);
 }
-._15silbj1-3-13-3:hover {
+._15silbj1-3-14-0:hover {
   background-color: var(--dt-colors-background-container-primary-default, #f1f2f9);
 }
-._15silbj1-3-13-3:hover::after {
+._15silbj1-3-14-0:hover::after {
   border-color: var(--dt-colors-border-primary-accent, #464cce);
 }
-._15silbj3-3-13-3 {
+._15silbj3-3-14-0 {
   background-color: var(--dt-colors-background-container-neutral-default, #f2f2f5);
 }
-._15silbj3-3-13-3::after {
+._15silbj3-3-14-0::after {
   box-shadow: inset 0 0 0 var(--dt-borders-width-emphasized, 2px) var(--dt-colors-border-neutral-accent, #595a7d), inset 0 0 0 calc(var(--dt-borders-width-emphasized, 2px) + 1px) var(--dt-colors-border-neutral-default, #dadbe4);
   border-width: 0;
 }
-._15silbj4-3-13-3 {
+._15silbj4-3-14-0 {
   background-color: var(--dt-colors-background-container-neutral-default, #f2f2f5);
 }
-._15silbj4-3-13-3::after {
+._15silbj4-3-14-0::after {
   border-color: var(--dt-colors-border-neutral-accent, #595a7d);
 }
-._ytdpswb-3-13-3 ._14sp6az6-3-13-3._15silbj7-3-13-3::after {
+._ytdpswb-3-14-0 ._14sp6az6-3-14-0._15silbj7-3-14-0::after {
   border-bottom-right-radius: calc(var(--dt-borders-radius-container-subdued, 6px) - var(--dt-borders-width-emphasized, 2px));
   border-bottom-left-radius: calc(var(--dt-borders-radius-container-subdued, 6px) - var(--dt-borders-width-emphasized, 2px));
 }
-._ytdpswd-3-13-3 ._14sp6az6-3-13-3._15silbj7-3-13-3::after {
+._ytdpswd-3-14-0 ._14sp6az6-3-14-0._15silbj7-3-14-0::after {
   border-bottom-right-radius: 0;
   border-bottom-left-radius: calc(var(--dt-borders-radius-container-subdued, 6px) - var(--dt-borders-width-emphasized, 2px));
 }
-._15silbj8-3-13-3 {
+._15silbj8-3-14-0 {
   border-bottom-right-radius: 0;
   border-bottom-left-radius: 0;
 }
-._15silbj9-3-13-3 {
+._15silbj9-3-14-0 {
   background-color: var(--dt-colors-background-container-primary-default, #f1f2f9);
 }
-._15silbj9-3-13-3::after {
+._15silbj9-3-14-0::after {
   border-width: 0;
   box-shadow: inset 0 0 0 var(--dt-borders-width-emphasized, 2px) var(--dt-colors-border-primary-accent, #464cce), inset 0 0 0 calc(var(--dt-borders-width-emphasized, 2px) + 1px) var(--dt-colors-border-neutral-default, #dadbe4);
 }
-._15silbja-3-13-3::after {
+._15silbja-3-14-0::after {
   border-width: 0;
   box-shadow: inset 0 0 0 var(--dt-borders-width-emphasized, 2px) var(--dt-colors-border-neutral-accent, #595a7d);
 }
-._15silbjb-3-13-3 {
+._15silbjb-3-14-0 {
   background-color: var(--dt-colors-background-container-primary-default, #f1f2f9);
 }
-._15silbjb-3-13-3::after {
+._15silbjb-3-14-0::after {
   border-width: 0;
   box-shadow: inset 0 0 0 var(--dt-borders-width-emphasized, 2px) var(--dt-colors-border-primary-accent, #464cce);
 }

package/esm/tables/DataTable/features/RowInteractivity/RowInteractivity.sty.js

@@ -3,7 +3,7 @@ import "../../components/DataTableVirtualizationContainer.css";
 import "../../DataTable.css";
 import "./RowInteractivity.css";
 import { createRuntimeFn as _7a468 } from "@vanilla-extract/recipes/createRuntimeFn";
-var interactiveRow = _7a468({ defaultClassName: "_15silbj0-3-13-3", variantClassNames: { active: { true: "_15silbj1-3-13-3", false: "_15silbj2-3-13-3" }, focus: { true: "_15silbj3-3-13-3" }, hovered: { true: "_15silbj4-3-13-3" }, singleTone: { true: "_15silbj5-3-13-3", false: "_15silbj6-3-13-3" }, contained: { true: "_15silbj7-3-13-3", false: "_15silbj8-3-13-3" } }, defaultVariants: {}, compoundVariants: [[{ active: true, focus: true }, "_15silbj9-3-13-3"], [{ focus: true, singleTone: true }, "_15silbja-3-13-3"], [{ active: true, focus: true, singleTone: true }, "_15silbjb-3-13-3"]] });
+var interactiveRow = _7a468({ defaultClassName: "_15silbj0-3-14-0", variantClassNames: { active: { true: "_15silbj1-3-14-0", false: "_15silbj2-3-14-0" }, focus: { true: "_15silbj3-3-14-0" }, hovered: { true: "_15silbj4-3-14-0" }, singleTone: { true: "_15silbj5-3-14-0", false: "_15silbj6-3-14-0" }, contained: { true: "_15silbj7-3-14-0", false: "_15silbj8-3-14-0" } }, defaultVariants: {}, compoundVariants: [[{ active: true, focus: true }, "_15silbj9-3-14-0"], [{ focus: true, singleTone: true }, "_15silbja-3-14-0"], [{ active: true, focus: true, singleTone: true }, "_15silbjb-3-14-0"]] });
 export {
   interactiveRow
 };

package/esm/tables/DataTable/features/RowInteractivity/RowInteractivity.sty.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../../src/tables/DataTable/features/RowInteractivity/RowInteractivity.css.ts"],
-  "sourcesContent": ["import '../../../../core/components/app-root/AppRoot.css';\nimport '../../components/DataTableVirtualizationContainer.css';\nimport '../../DataTable.css';\nimport './RowInteractivity.css';\nimport { createRuntimeFn as _7a468 } from '@vanilla-extract/recipes/createRuntimeFn';\nexport var interactiveRow = _7a468({defaultClassName:'_15silbj0-3-13-3',variantClassNames:{active:{true:'_15silbj1-3-13-3',false:'_15silbj2-3-13-3'},focus:{true:'_15silbj3-3-13-3'},hovered:{true:'_15silbj4-3-13-3'},singleTone:{true:'_15silbj5-3-13-3',false:'_15silbj6-3-13-3'},contained:{true:'_15silbj7-3-13-3',false:'_15silbj8-3-13-3'}},defaultVariants:{},compoundVariants:[[{active:true,focus:true},'_15silbj9-3-13-3'],[{focus:true,singleTone:true},'_15silbja-3-13-3'],[{active:true,focus:true,singleTone:true},'_15silbjb-3-13-3']]});"],
+  "sourcesContent": ["import '../../../../core/components/app-root/AppRoot.css';\nimport '../../components/DataTableVirtualizationContainer.css';\nimport '../../DataTable.css';\nimport './RowInteractivity.css';\nimport { createRuntimeFn as _7a468 } from '@vanilla-extract/recipes/createRuntimeFn';\nexport var interactiveRow = _7a468({defaultClassName:'_15silbj0-3-14-0',variantClassNames:{active:{true:'_15silbj1-3-14-0',false:'_15silbj2-3-14-0'},focus:{true:'_15silbj3-3-14-0'},hovered:{true:'_15silbj4-3-14-0'},singleTone:{true:'_15silbj5-3-14-0',false:'_15silbj6-3-14-0'},contained:{true:'_15silbj7-3-14-0',false:'_15silbj8-3-14-0'}},defaultVariants:{},compoundVariants:[[{active:true,focus:true},'_15silbj9-3-14-0'],[{focus:true,singleTone:true},'_15silbja-3-14-0'],[{active:true,focus:true,singleTone:true},'_15silbjb-3-14-0']]});"],
   "mappings": "AAAA,OAAO;AACP,OAAO;AACP,OAAO;AACP,OAAO;AACP,SAAS,mBAAmB,cAAc;AACnC,IAAI,iBAAiB,OAAO,EAAC,kBAAiB,oBAAmB,mBAAkB,EAAC,QAAO,EAAC,MAAK,oBAAmB,OAAM,mBAAkB,GAAE,OAAM,EAAC,MAAK,mBAAkB,GAAE,SAAQ,EAAC,MAAK,mBAAkB,GAAE,YAAW,EAAC,MAAK,oBAAmB,OAAM,mBAAkB,GAAE,WAAU,EAAC,MAAK,oBAAmB,OAAM,mBAAkB,EAAC,GAAE,iBAAgB,CAAC,GAAE,kBAAiB,CAAC,CAAC,EAAC,QAAO,MAAK,OAAM,KAAI,GAAE,kBAAkB,GAAE,CAAC,EAAC,OAAM,MAAK,YAAW,KAAI,GAAE,kBAAkB,GAAE,CAAC,EAAC,QAAO,MAAK,OAAM,MAAK,YAAW,KAAI,GAAE,kBAAkB,CAAC,EAAC,CAAC;",
   "names": []
 }

package/esm/tables/DataTable/features/RowOrder/RowOrder.css

@@ -1,11 +1,11 @@
-._or8s40-3-13-3 {
+._or8s40-3-14-0 {
   cursor: grabbing;
   box-shadow: var(--dt-box-shadows-surface-flat-drag, 0px 0px 0px 1px #2d2e4e08, 0px 1px 2px #2d2e4e0d, 0px 7px 17px -2px #2d2e4e52);
   background-color: var(--dt-colors-background-surface-default, #fff);
   z-index: 4;
   overflow: hidden;
 }
-._or8s41-3-13-3 {
+._or8s41-3-14-0 {
   vertical-align: middle;
   border-radius: var(--dt-borders-radius-field-subdued, 3px);
   padding-left: var(--dt-spacings-size-2, 2px);
@@ -14,21 +14,21 @@
   padding-bottom: 0;
   transition: none;
 }
-._or8s41-3-13-3:active {
+._or8s41-3-14-0:active {
   background: transparent;
 }
-._or8s41-3-13-3:hover {
+._or8s41-3-14-0:hover {
   background: transparent;
 }
-._or8s40-3-13-3 ._or8s41-3-13-3 {
+._or8s40-3-14-0 ._or8s41-3-14-0 {
   cursor: grabbing;
 }
-._or8s42-3-13-3 {
+._or8s42-3-14-0 {
   cursor: not-allowed;
 }
-._or8s43-3-13-3 {
+._or8s43-3-14-0 {
   cursor: grab;
 }
-._or8s44-3-13-3 {
+._or8s44-3-14-0 {
   opacity: 0.2;
 }

package/esm/tables/DataTable/features/RowOrder/RowOrder.sty.js

@@ -1,8 +1,8 @@
 import "./RowOrder.css";
 import { createRuntimeFn as _7a468 } from "@vanilla-extract/recipes/createRuntimeFn";
-var disabledNonTargetRow = "_or8s44-3-13-3";
-var dndHandle = _7a468({ defaultClassName: "_or8s41-3-13-3", variantClassNames: { disabled: { true: "_or8s42-3-13-3", false: "_or8s43-3-13-3" } }, defaultVariants: {}, compoundVariants: [] });
-var rowDndOverlay = "_or8s40-3-13-3";
+var disabledNonTargetRow = "_or8s44-3-14-0";
+var dndHandle = _7a468({ defaultClassName: "_or8s41-3-14-0", variantClassNames: { disabled: { true: "_or8s42-3-14-0", false: "_or8s43-3-14-0" } }, defaultVariants: {}, compoundVariants: [] });
+var rowDndOverlay = "_or8s40-3-14-0";
 export {
   disabledNonTargetRow,
   dndHandle,

package/esm/tables/DataTable/features/RowOrder/RowOrder.sty.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../../src/tables/DataTable/features/RowOrder/RowOrder.css.ts"],
-  "sourcesContent": ["import './RowOrder.css';\nimport { createRuntimeFn as _7a468 } from '@vanilla-extract/recipes/createRuntimeFn';\nexport var disabledNonTargetRow = '_or8s44-3-13-3';\nexport var dndHandle = _7a468({defaultClassName:'_or8s41-3-13-3',variantClassNames:{disabled:{true:'_or8s42-3-13-3',false:'_or8s43-3-13-3'}},defaultVariants:{},compoundVariants:[]});\nexport var rowDndOverlay = '_or8s40-3-13-3';"],
+  "sourcesContent": ["import './RowOrder.css';\nimport { createRuntimeFn as _7a468 } from '@vanilla-extract/recipes/createRuntimeFn';\nexport var disabledNonTargetRow = '_or8s44-3-14-0';\nexport var dndHandle = _7a468({defaultClassName:'_or8s41-3-14-0',variantClassNames:{disabled:{true:'_or8s42-3-14-0',false:'_or8s43-3-14-0'}},defaultVariants:{},compoundVariants:[]});\nexport var rowDndOverlay = '_or8s40-3-14-0';"],
   "mappings": "AAAA,OAAO;AACP,SAAS,mBAAmB,cAAc;AACnC,IAAI,uBAAuB;AAC3B,IAAI,YAAY,OAAO,EAAC,kBAAiB,kBAAiB,mBAAkB,EAAC,UAAS,EAAC,MAAK,kBAAiB,OAAM,iBAAgB,EAAC,GAAE,iBAAgB,CAAC,GAAE,kBAAiB,CAAC,EAAC,CAAC;AAC7K,IAAI,gBAAgB;",
   "names": []
 }

package/esm/tables/DataTable/features/RowSelection/useRowSelection.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../../src/tables/DataTable/features/RowSelection/useRowSelection.ts"],
-  "sourcesContent": ["import { type Row, type RowSelectionState } from '@tanstack/react-table';\nimport { useCallback } from 'react';\n\nimport type {\n  DataTableRowSelectionOptions,\n  DataTableRowSelectionProps,\n} from './row-selection-types.js';\nimport { useControllableState } from '../../../../core/hooks/useControllableState.js';\nimport { useDataTableConfigElement } from '../../../hooks/useDataTableConfig.js';\nimport type { DataTableRowData } from '../../row-data-types.js';\nimport type { TDataTableFeatures } from '../types/features.types.js';\nimport type { DataTableOptions } from '../types/table.types.js';\n\nconst fallbackState = {};\n\n/**\n * Converts the public `Record<string, boolean>` selection shape into the\n * `Record<string, true>` that TanStack Table v9.0.0-beta.52 expects, where an absent key is\n * the only way to express \"not selected\".\n */\nfunction toRowSelectionState(\n  selectedRows: Record<string, boolean>,\n): RowSelectionState {\n  const state: RowSelectionState = {};\n  for (const [rowId, isSelected] of Object.entries(selectedRows)) {\n    if (isSelected) {\n      state[rowId] = true;\n    }\n  }\n  return state;\n}\n\n/**\n * Configuration hook for the DataTable UserActions feature\n * @internal\n */\nexport function useRowSelection<TData extends DataTableRowData>(\n  props: DataTableRowSelectionProps<TData>,\n  options: DataTableOptions<Exclude<TData, unknown>>,\n): void {\n  const configSelectableRows = useDataTableConfigElement('selectableRows');\n  // Need to move that into a const here in order to make the typechecks\n  // work, because otherwise the selectableRows member could switch.\n\n  // note: for case where the selectableRows prop is an object, it needs\n  // to be memoized by the consumer, to avoid updates if it is identical\n  const selectableRows = props.selectableRows ?? configSelectableRows;\n  // options.enableRowSelection is used as dependency in useBuiltinColumns, therefore we need to cache this function to avoid infinite rerenders\n  const enableRowSelectionCallback = useCallback(\n    (row: Row<TDataTableFeatures, Exclude<TData, unknown>>) => {\n      // If there is a function defined that will allow for disabling certain\n      // row selections, we can apply this one.\n      if (\n        selectableRows !== undefined &&\n        typeof selectableRows !== 'boolean' &&\n        selectableRows.disableRowSelection\n      ) {\n        return !selectableRows.disableRowSelection(row.original);\n      }\n      return true;\n    },\n    [selectableRows],\n  );\n\n  if (selectableRows !== undefined) {\n    // eslint-disable-next-line react-hooks/immutability\n    options.enableRowSelection = true;\n    let rowSelectionMode: DataTableRowSelectionOptions<\n      TDataTableFeatures,\n      Row<TDataTableFeatures, Exclude<TData, unknown>>\n    >['rowSelectionSelectAllMode'] = 'page';\n\n    // If selectableRows is controlled via a boolean, we can default the options\n    if (selectableRows === true || selectableRows === false) {\n      // eslint-disable-next-line react-hooks/immutability\n      options.enableRowSelection = selectableRows;\n    } else {\n      const { selectAllBehavior, limit } = selectableRows;\n\n      // eslint-disable-next-line react-hooks/immutability\n      options.enableRowSelection = enableRowSelectionCallback;\n\n      // Change the rowSelectionMode for the _select all_ checkbox if it is defined.\n      if (selectAllBehavior) {\n        rowSelectionMode = selectAllBehavior;\n      }\n\n      // Defines a row selection limit for the maximum count of rows that are\n      // selectable.\n      // eslint-disable-next-line react-hooks/immutability\n      options.rowSelectionLimit =\n        limit !== undefined && limit >= 0 ? limit : undefined;\n    }\n\n    // eslint-disable-next-line react-hooks/immutability\n    options.enableMultiRowSelection = true;\n    // eslint-disable-next-line react-hooks/immutability\n    options.rowSelectionSelectAllMode = rowSelectionMode;\n  } else {\n    // eslint-disable-next-line react-hooks/immutability\n    options.enableRowSelection = false;\n  }\n\n  const [selectedRows, setSelectedRows] = useControllableState<\n    Record<string, boolean>\n  >({\n    value: props.selectedRows,\n    defaultValue: props.defaultSelectedRows,\n    onChange: props.onRowSelectionChange,\n  });\n\n  // eslint-disable-next-line react-hooks/immutability\n  options.state = {\n    ...options.state,\n    rowSelection: selectedRows\n      ? toRowSelectionState(selectedRows)\n      : fallbackState,\n  };\n\n  // eslint-disable-next-line react-hooks/immutability\n  options.onRowSelectionChange = useCallback(\n    (\n      updater:\n        | RowSelectionState\n        | ((state: RowSelectionState) => RowSelectionState),\n    ) => {\n      const state = selectedRows ? toRowSelectionState(selectedRows) : {};\n      const newValue = typeof updater === 'function' ? updater(state) : updater;\n      setSelectedRows(newValue);\n    },\n    [setSelectedRows, selectedRows],\n  );\n}\n"],
+  "sourcesContent": ["import { type Row, type RowSelectionState } from '@tanstack/react-table';\nimport { useCallback } from 'react';\n\nimport type {\n  DataTableRowSelectionOptions,\n  DataTableRowSelectionProps,\n} from './row-selection-types.js';\nimport { useControllableState } from '../../../../core/hooks/useControllableState.js';\nimport { useDataTableConfigElement } from '../../../hooks/useDataTableConfig.js';\nimport type { DataTableRowData } from '../../row-data-types.js';\nimport type { TDataTableFeatures } from '../types/features.types.js';\nimport type { DataTableOptions } from '../types/table.types.js';\n\nconst fallbackState = {};\n\n/**\n * Converts the public `Record<string, boolean>` selection shape into the\n * `Record<string, true>` that TanStack Table v9.0.0-beta.52 expects, where an absent key is\n * the only way to express \"not selected\".\n */\nfunction toRowSelectionState(\n  selectedRows: Record<string, boolean>,\n): RowSelectionState {\n  const state: RowSelectionState = {};\n  for (const [rowId, isSelected] of Object.entries(selectedRows)) {\n    if (isSelected) {\n      state[rowId] = true;\n    }\n  }\n  return state;\n}\n\n/**\n * Configuration hook for the DataTable UserActions feature\n * @internal\n */\nexport function useRowSelection<TData extends DataTableRowData>(\n  props: DataTableRowSelectionProps<TData>,\n  options: DataTableOptions<Exclude<TData, unknown>>,\n): void {\n  const configSelectableRows = useDataTableConfigElement('selectableRows');\n  // Need to move that into a const here in order to make the typechecks\n  // work, because otherwise the selectableRows member could switch.\n\n  // note: for case where the selectableRows prop is an object, it needs\n  // to be memoized by the consumer, to avoid updates if it is identical\n  const selectableRows = props.selectableRows ?? configSelectableRows;\n  // options.enableRowSelection is used as dependency in useBuiltinColumns, therefore we need to cache this function to avoid infinite rerenders\n  const enableRowSelectionCallback = useCallback(\n    (row: Row<TDataTableFeatures, Exclude<TData, unknown>>) => {\n      // If there is a function defined that will allow for disabling certain\n      // row selections, we can apply this one.\n      if (\n        selectableRows !== undefined &&\n        typeof selectableRows !== 'boolean' &&\n        selectableRows.disableRowSelection\n      ) {\n        return !selectableRows.disableRowSelection(row.original);\n      }\n      return true;\n    },\n    [selectableRows],\n  );\n\n  if (selectableRows !== undefined) {\n    // oxlint-disable-next-line react/immutability\n    options.enableRowSelection = true;\n    let rowSelectionMode: DataTableRowSelectionOptions<\n      TDataTableFeatures,\n      Row<TDataTableFeatures, Exclude<TData, unknown>>\n    >['rowSelectionSelectAllMode'] = 'page';\n\n    // If selectableRows is controlled via a boolean, we can default the options\n    if (selectableRows === true || selectableRows === false) {\n      // oxlint-disable-next-line react/immutability\n      options.enableRowSelection = selectableRows;\n    } else {\n      const { selectAllBehavior, limit } = selectableRows;\n\n      // oxlint-disable-next-line react/immutability\n      options.enableRowSelection = enableRowSelectionCallback;\n\n      // Change the rowSelectionMode for the _select all_ checkbox if it is defined.\n      if (selectAllBehavior) {\n        rowSelectionMode = selectAllBehavior;\n      }\n\n      // Defines a row selection limit for the maximum count of rows that are\n      // selectable.\n      // oxlint-disable-next-line react/immutability\n      options.rowSelectionLimit =\n        limit !== undefined && limit >= 0 ? limit : undefined;\n    }\n\n    // oxlint-disable-next-line react/immutability\n    options.enableMultiRowSelection = true;\n    // oxlint-disable-next-line react/immutability\n    options.rowSelectionSelectAllMode = rowSelectionMode;\n  } else {\n    // oxlint-disable-next-line react/immutability\n    options.enableRowSelection = false;\n  }\n\n  const [selectedRows, setSelectedRows] = useControllableState<\n    Record<string, boolean>\n  >({\n    value: props.selectedRows,\n    defaultValue: props.defaultSelectedRows,\n    onChange: props.onRowSelectionChange,\n  });\n\n  // oxlint-disable-next-line react/immutability\n  options.state = {\n    ...options.state,\n    rowSelection: selectedRows\n      ? toRowSelectionState(selectedRows)\n      : fallbackState,\n  };\n\n  // oxlint-disable-next-line react/immutability\n  options.onRowSelectionChange = useCallback(\n    (\n      updater:\n        | RowSelectionState\n        | ((state: RowSelectionState) => RowSelectionState),\n    ) => {\n      const state = selectedRows ? toRowSelectionState(selectedRows) : {};\n      const newValue = typeof updater === 'function' ? updater(state) : updater;\n      setSelectedRows(newValue);\n    },\n    [setSelectedRows, selectedRows],\n  );\n}\n"],
   "mappings": "AACA,SAAS,mBAAmB;AAM5B,SAAS,4BAA4B;AACrC,SAAS,iCAAiC;AAK1C,MAAM,gBAAgB,CAAC;AAOvB,SAAS,oBACP,cACmB;AACnB,QAAM,QAA2B,CAAC;AAClC,aAAW,CAAC,OAAO,UAAU,KAAK,OAAO,QAAQ,YAAY,GAAG;AAC9D,QAAI,YAAY;AACd,YAAM,KAAK,IAAI;AAAA,IACjB;AAAA,EACF;AACA,SAAO;AACT;AAMO,SAAS,gBACd,OACA,SACM;AACN,QAAM,uBAAuB,0BAA0B,gBAAgB;AAMvE,QAAM,iBAAiB,MAAM,kBAAkB;AAE/C,QAAM,6BAA6B;AAAA,IACjC,CAAC,QAA0D;AAGzD,UACE,mBAAmB,UACnB,OAAO,mBAAmB,aAC1B,eAAe,qBACf;AACA,eAAO,CAAC,eAAe,oBAAoB,IAAI,QAAQ;AAAA,MACzD;AACA,aAAO;AAAA,IACT;AAAA,IACA,CAAC,cAAc;AAAA,EACjB;AAEA,MAAI,mBAAmB,QAAW;AAEhC,YAAQ,qBAAqB;AAC7B,QAAI,mBAG6B;AAGjC,QAAI,mBAAmB,QAAQ,mBAAmB,OAAO;AAEvD,cAAQ,qBAAqB;AAAA,IAC/B,OAAO;AACL,YAAM,EAAE,mBAAmB,MAAM,IAAI;AAGrC,cAAQ,qBAAqB;AAG7B,UAAI,mBAAmB;AACrB,2BAAmB;AAAA,MACrB;AAKA,cAAQ,oBACN,UAAU,UAAa,SAAS,IAAI,QAAQ;AAAA,IAChD;AAGA,YAAQ,0BAA0B;AAElC,YAAQ,4BAA4B;AAAA,EACtC,OAAO;AAEL,YAAQ,qBAAqB;AAAA,EAC/B;AAEA,QAAM,CAAC,cAAc,eAAe,IAAI,qBAEtC;AAAA,IACA,OAAO,MAAM;AAAA,IACb,cAAc,MAAM;AAAA,IACpB,UAAU,MAAM;AAAA,EAClB,CAAC;AAGD,UAAQ,QAAQ;AAAA,IACd,GAAG,QAAQ;AAAA,IACX,cAAc,eACV,oBAAoB,YAAY,IAChC;AAAA,EACN;AAGA,UAAQ,uBAAuB;AAAA,IAC7B,CACE,YAGG;AACH,YAAM,QAAQ,eAAe,oBAAoB,YAAY,IAAI,CAAC;AAClE,YAAM,WAAW,OAAO,YAAY,aAAa,QAAQ,KAAK,IAAI;AAClE,sBAAgB,QAAQ;AAAA,IAC1B;AAAA,IACA,CAAC,iBAAiB,YAAY;AAAA,EAChC;AACF;",
   "names": []
 }