ods-ant 0.2.0 → 0.4.0

package/dist-lib/display/Table.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Table.js","names":[],"sources":["../../src/ds/display/Table.tsx"],"sourcesContent":["import React, { useEffect } from 'react';\nimport { Table as AntTable, type TableProps as AntTableProps } from 'antd';\nimport { Input } from 'antd';\nimport { dsSemanticTokens } from '../../theme/ontadaTheme';\nimport { Icon } from '../../utils/icons';\nimport { Pagination as DSPagination } from '../navigation/Pagination';\nimport type { DSPaginationProps } from '../navigation/Pagination';\nimport { ensureTooltipStyles, Tooltip as DSTooltip } from './Tooltip';\nimport type { DSTooltipSize } from './Tooltip';\n\nexport type DSTableStyle = 'styleA' | 'styleAEditable' | 'styleACustomizable' | 'styleAFixedHeaderFooter' | 'styleAResizable' | 'styleB';\nexport type DSTableHeaderVariant = 'default' | 'white';\nexport type DSTableFrozenColumns = 'none' | 'first' | 'last' | 'both';\nexport type DSTableColumnWidths = Record<string, number>;\n\nexport type DSTableProps<RecordType = Record<string, unknown>> = AntTableProps<RecordType> & {\n  /**\n   * DS table style from Figma documentation.\n  * styleA: full-width, white header, thicker header divider, no container border.\n  * styleAEditable: styleA base with inline editable cells for selected columns.\n   * styleB: warm layout background, cool header, 1px container border with 4px radius.\n   */\n  dsStyle?: DSTableStyle;\n  /**\n   * Header background variant for styleB.\n   * default: cool gray header\n   * white: white header (allowed alternative in Figma docs)\n   */\n  dsHeaderVariant?: DSTableHeaderVariant;\n  /**\n   * DS responsive frozen-column mode.\n   * none: no DS freezing behavior\n   * first: freeze first column on small screens\n   * last: freeze last column on small screens\n   * both: freeze first and last columns on small screens\n   */\n  dsFrozenColumns?: DSTableFrozenColumns;\n  /**\n   * Breakpoint (px) at or below which DS frozen columns become active.\n   */\n  dsFrozenBreakpoint?: number;\n  /**\n   * Default width for DS-frozen columns when column width is not defined.\n   */\n  dsFrozenColumnWidth?: number;\n  /**\n   * Truncates cell text based on available cell width.\n   */\n  dsTruncateCellText?: boolean;\n  /**\n   * Shows DS tooltip with the full value when truncated text is hovered.\n   */\n  dsTruncateTooltip?: boolean;\n  /**\n   * Delay (seconds) before showing the truncation tooltip on hover.\n   */\n  dsTruncateTooltipDelay?: number;\n  /**\n   * DS tooltip size variant used for truncation tooltips.\n   */\n  dsTruncateTooltipSize?: DSTooltipSize;\n  /**\n   * DS tooltip title used for truncation tooltips when using normal tooltip size.\n   */\n  dsTruncateTooltipTitle?: string;\n  /**\n   * Column keys or dataIndex values that are editable when dsStyle is styleAEditable.\n   */\n  dsEditableColumns?: string[] | string | Record<string, boolean>;\n  /**\n   * Called whenever editable table data changes.\n   */\n  dsOnEditableDataChange?: (nextData: RecordType[]) => void;\n  /**\n   * When true, enables column visibility controls above the table for dsStyle=\"styleACustomizable\".\n   */\n  dsCustomizable?: boolean;\n  /**\n   * Column keys or dataIndex values that are currently visible.\n   * Only used when dsStyle=\"styleACustomizable\".\n   */\n  dsVisibleColumns?: string[];\n  /**\n   * Called when user toggles column visibility.\n   */\n  dsOnVisibleColumnsChange?: (nextVisible: string[]) => void;\n  /**\n   * Scrollable body height for dsStyle=\"styleAFixedHeaderFooter\".\n   */\n  dsFixedBodyHeight?: number | string;\n  /**\n   * Enables column resizing. Automatically enabled for dsStyle=\"styleAResizable\".\n   */\n  dsResizableColumns?: boolean;\n  /**\n   * Controlled column widths by column key or dataIndex.\n   */\n  dsColumnWidths?: DSTableColumnWidths;\n  /**\n   * Called whenever a resizable column width changes.\n   */\n  dsOnColumnWidthsChange?: (nextWidths: DSTableColumnWidths) => void;\n  /**\n   * Minimum resizable column width in px.\n   */\n  dsResizableColumnMinWidth?: number;\n  /**\n   * Maximum resizable column width in px.\n   */\n  dsResizableColumnMaxWidth?: number;\n  /**\n   * Default width in px for resizable columns without an explicit width.\n   */\n  dsResizableDefaultColumnWidth?: number;\n};\n\nconst STYLE_ID = 'ds-table-styles';\n\nconst isTextValue = (value: unknown): value is string | number =>\n  typeof value === 'string' || typeof value === 'number';\n\nconst DSTruncatedCell: React.FC<{\n  value: string | number;\n  withTooltip: boolean;\n  tooltipDelay: number;\n  tooltipSize: DSTooltipSize;\n  tooltipTitle?: string;\n}> = ({ value, withTooltip, tooltipDelay, tooltipSize, tooltipTitle }) => {\n  const cellRef = React.useRef<HTMLSpanElement>(null);\n  const [isTruncated, setIsTruncated] = React.useState(false);\n  const text = String(value);\n\n  const updateTruncation = React.useCallback(() => {\n    const cell = cellRef.current;\n    if (!cell) return;\n    const nextValue = cell.scrollWidth > cell.clientWidth;\n    setIsTruncated((prev) => (prev === nextValue ? prev : nextValue));\n  }, []);\n\n  React.useEffect(() => {\n    const cell = cellRef.current;\n    if (!cell) return;\n\n    updateTruncation();\n\n    // Styles for truncation can be injected shortly after first render.\n    // Re-check on subsequent frames so measurement reflects final layout.\n    const rafId = requestAnimationFrame(() => {\n      updateTruncation();\n      requestAnimationFrame(updateTruncation);\n    });\n    const timeoutId = window.setTimeout(updateTruncation, 120);\n\n    const resizeObserver = typeof ResizeObserver !== 'undefined' ? new ResizeObserver(updateTruncation) : null;\n    if (resizeObserver) {\n      resizeObserver.observe(cell);\n    } else if (typeof window !== 'undefined') {\n      window.addEventListener('resize', updateTruncation);\n    }\n\n    return () => {\n      if (resizeObserver) {\n        resizeObserver.disconnect();\n      } else if (typeof window !== 'undefined') {\n        window.removeEventListener('resize', updateTruncation);\n      }\n      cancelAnimationFrame(rafId);\n      window.clearTimeout(timeoutId);\n    };\n  }, [text, updateTruncation]);\n\n  const content = (\n    <span\n      ref={cellRef}\n      className=\"ds-table-cell-truncate\"\n      onMouseOverCapture={updateTruncation}\n      onFocus={updateTruncation}\n    >\n      {text}\n    </span>\n  );\n\n  if (!withTooltip) {\n    return content;\n  }\n\n  return (\n    <DSTooltip\n      title={isTruncated ? undefined : null}\n      dsSize={tooltipSize}\n      dsTitle={tooltipTitle}\n      dsBody={text}\n      mouseEnterDelay={tooltipDelay}\n      trigger=\"hover\"\n    >\n      {content}\n    </DSTooltip>\n  );\n};\n\ntype DSTableSorterTooltip = Exclude<AntTableProps['showSorterTooltip'], boolean | undefined>;\n\nfunction mergeClassNames(...names: Array<string | undefined>) {\n  return names.filter(Boolean).join(' ');\n}\n\nfunction getDSSorterTooltipProps(showSorterTooltip?: AntTableProps['showSorterTooltip']): AntTableProps['showSorterTooltip'] {\n  if (showSorterTooltip === false) {\n    return false;\n  }\n\n  const { tooltip } = dsSemanticTokens;\n  const provided = showSorterTooltip && typeof showSorterTooltip === 'object'\n    ? showSorterTooltip as DSTableSorterTooltip\n    : undefined;\n\n  return {\n    ...provided,\n    color: provided?.color ?? tooltip.surface.background,\n    arrow: provided?.arrow ?? true,\n    classNames: {\n      ...provided?.classNames,\n      root: mergeClassNames('ds-tooltip-overlay', 'ds-tooltip-size-normal', provided?.classNames?.root, provided?.overlayClassName),\n    },\n    styles: {\n      ...provided?.styles,\n      container: {\n        borderRadius: tooltip.radius,\n        color: tooltip.surface.body,\n        letterSpacing: 0,\n        minWidth: tooltip.width.normal.min,\n        maxWidth: tooltip.width.normal.max,\n        padding: tooltip.padding.normal,\n        ...provided?.styles?.container,\n      },\n    },\n  };\n}\n\nfunction withDSSortIcons(\n  columns: any[] | undefined,\n  tableShowSorterTooltip?: AntTableProps['showSorterTooltip'],\n): any[] | undefined {\n  if (!columns) return columns;\n\n  return columns.map((column) => {\n    const nextColumn = { ...column };\n\n    if (Array.isArray(nextColumn.children) && nextColumn.children.length > 0) {\n      nextColumn.children = withDSSortIcons(nextColumn.children, tableShowSorterTooltip);\n    }\n\n    if (nextColumn.sorter) {\n      const columnShowSorterTooltip = nextColumn.showSorterTooltip === undefined\n        ? tableShowSorterTooltip\n        : nextColumn.showSorterTooltip;\n      nextColumn.showSorterTooltip = getDSSorterTooltipProps(columnShowSorterTooltip);\n    }\n\n    if (nextColumn.sorter && !nextColumn.sortIcon) {\n      nextColumn.sortIcon = ({ sortOrder }: { sortOrder?: 'ascend' | 'descend' }) => (\n        <span className=\"ds-table-sort-icon\" aria-hidden=\"true\">\n          <Icon\n            name={sortOrder === 'ascend' ? 'arrowThickUp' : 'arrowThickDown'}\n            size={10}\n            style={{ color: 'inherit' }}\n          />\n        </span>\n      );\n    }\n\n    return nextColumn;\n  });\n}\n\nfunction withDSFrozenColumns(\n  columns: any[] | undefined,\n  mode: DSTableFrozenColumns,\n  defaultFrozenWidth: number\n): any[] | undefined {\n  if (!columns || mode === 'none' || columns.length === 0) return columns;\n\n  const freezeFirst = mode === 'first' || mode === 'both';\n  const freezeLast = mode === 'last' || mode === 'both';\n  const lastIndex = columns.length - 1;\n\n  return columns.map((column, index) => {\n    const nextColumn = { ...column };\n\n    const shouldFreezeLeft = freezeFirst && index === 0;\n    const shouldFreezeRight = freezeLast && index === lastIndex;\n\n    if (shouldFreezeLeft) {\n      nextColumn.fixed = 'left';\n      if (nextColumn.width == null) {\n        nextColumn.width = defaultFrozenWidth;\n      }\n    }\n\n    if (shouldFreezeRight) {\n      nextColumn.fixed = 'right';\n      if (nextColumn.width == null) {\n        nextColumn.width = defaultFrozenWidth;\n      }\n    }\n\n    return nextColumn;\n  });\n}\n\nfunction withDSTruncatedCells(\n  columns: any[] | undefined,\n  withTooltip: boolean,\n  tooltipDelay: number,\n  tooltipSize: DSTooltipSize,\n  tooltipTitle?: string\n): any[] | undefined {\n  if (!columns) return columns;\n\n  return columns.map((column) => {\n    const nextColumn = { ...column };\n\n    if (Array.isArray(nextColumn.children) && nextColumn.children.length > 0) {\n      nextColumn.children = withDSTruncatedCells(nextColumn.children, withTooltip, tooltipDelay, tooltipSize, tooltipTitle);\n      return nextColumn;\n    }\n\n    const originalRender = nextColumn.render;\n\n    if (nextColumn.ellipsis == null) {\n      nextColumn.ellipsis = { showTitle: false };\n    } else if (nextColumn.ellipsis === true) {\n      nextColumn.ellipsis = { showTitle: false };\n    } else if (typeof nextColumn.ellipsis === 'object') {\n      nextColumn.ellipsis = { ...nextColumn.ellipsis, showTitle: false };\n    }\n\n    nextColumn.render = (value: unknown, record: unknown, index: number) => {\n      const rendered = originalRender ? originalRender(value, record, index) : value;\n\n      if (isTextValue(rendered)) {\n        return <DSTruncatedCell value={rendered} withTooltip={withTooltip} tooltipDelay={tooltipDelay} tooltipSize={tooltipSize} tooltipTitle={tooltipTitle} />;\n      }\n\n      if (!originalRender && isTextValue(value)) {\n        return <DSTruncatedCell value={value} withTooltip={withTooltip} tooltipDelay={tooltipDelay} tooltipSize={tooltipSize} tooltipTitle={tooltipTitle} />;\n      }\n\n      return rendered;\n    };\n\n    return nextColumn;\n  });\n}\n\nfunction getColumnIdentity(column: any): string | undefined {\n  if (typeof column?.key === 'string') return column.key;\n  if (typeof column?.dataIndex === 'string') return column.dataIndex;\n  if (typeof column?.dataIndex === 'number') return String(column.dataIndex);\n  return undefined;\n}\n\nfunction getNumericColumnWidth(width: unknown): number | undefined {\n  if (typeof width === 'number' && Number.isFinite(width)) return width;\n  if (typeof width === 'string' && width.endsWith('px')) {\n    const parsedWidth = Number(width.slice(0, -2));\n    return Number.isFinite(parsedWidth) ? parsedWidth : undefined;\n  }\n  return undefined;\n}\n\nfunction clampColumnWidth(width: number, minWidth: number, maxWidth?: number): number {\n  const widthWithMin = Math.max(minWidth, Math.round(width));\n  return typeof maxWidth === 'number' ? Math.min(maxWidth, widthWithMin) : widthWithMin;\n}\n\nfunction getInitialColumnWidths(\n  columns: any[] | undefined,\n  defaultWidth: number,\n  existingWidths: DSTableColumnWidths = {},\n): DSTableColumnWidths {\n  if (!columns) return existingWidths;\n\n  const nextWidths = { ...existingWidths };\n\n  const traverse = (cols: any[]) => {\n    cols.forEach((column) => {\n      if (Array.isArray(column.children) && column.children.length > 0) {\n        traverse(column.children);\n        return;\n      }\n\n      const identity = getColumnIdentity(column);\n      if (!identity || nextWidths[identity] != null) return;\n\n      nextWidths[identity] = getNumericColumnWidth(column.width) ?? defaultWidth;\n    });\n  };\n\n  traverse(columns);\n  return nextWidths;\n}\n\nfunction getValueByDataIndex(record: Record<string, unknown>, dataIndex: unknown): unknown {\n  if (Array.isArray(dataIndex)) {\n    return dataIndex.reduce<unknown>((acc, key) => {\n      if (acc && typeof acc === 'object') {\n        return (acc as Record<string, unknown>)[String(key)];\n      }\n      return undefined;\n    }, record);\n  }\n\n  if (typeof dataIndex === 'string' || typeof dataIndex === 'number') {\n    return record[String(dataIndex)];\n  }\n\n  return undefined;\n}\n\nfunction setValueByDataIndex(record: Record<string, unknown>, dataIndex: unknown, value: unknown): Record<string, unknown> {\n  if (Array.isArray(dataIndex) && dataIndex.length > 0) {\n    const next = { ...record };\n    let cursor: Record<string, unknown> = next;\n\n    for (let i = 0; i < dataIndex.length - 1; i += 1) {\n      const key = String(dataIndex[i]);\n      const current = cursor[key];\n      const cloned = current && typeof current === 'object' ? { ...(current as Record<string, unknown>) } : {};\n      cursor[key] = cloned;\n      cursor = cloned;\n    }\n\n    cursor[String(dataIndex[dataIndex.length - 1])] = value;\n    return next;\n  }\n\n  if (typeof dataIndex === 'string' || typeof dataIndex === 'number') {\n    return { ...record, [String(dataIndex)]: value };\n  }\n\n  return record;\n}\n\nfunction withDSEditableCells(\n  columns: any[] | undefined,\n  editableColumnKeys: Set<string>,\n  onValueChange: (rowIndex: number, dataIndex: unknown, nextValue: unknown) => void,\n): any[] | undefined {\n  if (!columns) return columns;\n\n  return columns.map((column) => {\n    const nextColumn = { ...column };\n\n    if (Array.isArray(nextColumn.children) && nextColumn.children.length > 0) {\n      nextColumn.children = withDSEditableCells(nextColumn.children, editableColumnKeys, onValueChange);\n      return nextColumn;\n    }\n\n    const identity = getColumnIdentity(nextColumn);\n    const isEditable = Boolean(identity && editableColumnKeys.has(identity));\n\n    if (!isEditable || nextColumn.dataIndex == null) {\n      return nextColumn;\n    }\n\n    nextColumn.render = (_value: unknown, record: Record<string, unknown>, rowIndex: number) => {\n      const currentValue = getValueByDataIndex(record, nextColumn.dataIndex);\n      const isNumberValue = typeof currentValue === 'number';\n      const inputValue = currentValue == null ? '' : String(currentValue);\n\n      return (\n        <Input\n          className=\"ds-table-edit-input\"\n          type={isNumberValue ? 'number' : 'text'}\n          size=\"small\"\n          value={inputValue}\n          onChange={(event) => {\n            const raw = event.target.value;\n            const nextValue = isNumberValue ? (raw === '' ? null : Number(raw)) : raw;\n            onValueChange(rowIndex, nextColumn.dataIndex, nextValue);\n          }}\n        />\n      );\n    };\n\n    return nextColumn;\n  });\n}\n\nfunction withDSVisibleColumnsFilter(\n  columns: any[] | undefined,\n  visibleColumnKeys: Set<string>,\n): any[] | undefined {\n  if (!columns) return columns;\n\n  return columns.map((column) => {\n    const nextColumn = { ...column };\n\n    if (Array.isArray(nextColumn.children) && nextColumn.children.length > 0) {\n      nextColumn.children = withDSVisibleColumnsFilter(nextColumn.children, visibleColumnKeys);\n      return nextColumn;\n    }\n\n    const identity = getColumnIdentity(nextColumn);\n    if (!identity || visibleColumnKeys.has(identity)) {\n      return nextColumn;\n    }\n\n    return null;\n  }).filter((col) => col !== null);\n}\n\nconst DSColumnVisibilityControl: React.FC<{\n  columns: any[];\n  visibleColumns: Set<string>;\n  onToggle: (colKey: string, visible: boolean) => void;\n}> = ({ columns, visibleColumns, onToggle }) => {\n  const columnOptions = React.useMemo(() => {\n    const opts: Array<{ key: string; label: string }> = [];\n\n    const traverse = (cols: any[]) => {\n      cols.forEach((col) => {\n        if (Array.isArray(col.children) && col.children.length > 0) {\n          traverse(col.children);\n        } else {\n          const identity = getColumnIdentity(col);\n          const label = col.title || (typeof col.dataIndex === 'string' ? col.dataIndex : 'Column');\n          if (identity) {\n            opts.push({ key: identity, label: String(label) });\n          }\n        }\n      });\n    };\n\n    traverse(columns);\n    return opts;\n  }, [columns]);\n\n  return (\n    <div className=\"ds-table-column-visibility-control\">\n      <label className=\"ds-table-control-label\">Columns:</label>\n      <div className=\"ds-table-control-checkboxes\">\n        {columnOptions.map(({ key, label }) => (\n          <label key={key} className=\"ds-table-control-checkbox\">\n            <input\n              type=\"checkbox\"\n              checked={visibleColumns.has(key)}\n              onChange={(e) => onToggle(key, e.target.checked)}\n            />\n            <span>{label}</span>\n          </label>\n        ))}\n      </div>\n    </div>\n  );\n};\n\ntype DSResizableHeaderCellProps = React.ThHTMLAttributes<HTMLTableCellElement> & {\n  width?: number;\n  minWidth?: number;\n  maxWidth?: number;\n  onResize?: (nextWidth: number) => void;\n};\n\nconst DSResizableHeaderCell: React.FC<DSResizableHeaderCellProps> = ({\n  width,\n  minWidth = 96,\n  maxWidth,\n  onResize,\n  children,\n  className,\n  style,\n  ...restProps\n}) => {\n  const startWidthRef = React.useRef(0);\n  const startXRef = React.useRef(0);\n\n  const updateWidth = React.useCallback((nextWidth: number) => {\n    if (!onResize) return;\n    onResize(clampColumnWidth(nextWidth, minWidth, maxWidth));\n  }, [maxWidth, minWidth, onResize]);\n\n  const handleMouseDown = React.useCallback((event: React.MouseEvent<HTMLButtonElement>) => {\n    if (!onResize || typeof document === 'undefined') return;\n\n    event.preventDefault();\n    event.stopPropagation();\n    startXRef.current = event.clientX;\n    startWidthRef.current = width ?? event.currentTarget.parentElement?.getBoundingClientRect().width ?? minWidth;\n\n    const handleMouseMove = (moveEvent: MouseEvent) => {\n      const delta = moveEvent.clientX - startXRef.current;\n      updateWidth(startWidthRef.current + delta);\n    };\n\n    const handleMouseUp = () => {\n      document.removeEventListener('mousemove', handleMouseMove);\n      document.removeEventListener('mouseup', handleMouseUp);\n      document.body.style.cursor = '';\n      document.body.style.userSelect = '';\n    };\n\n    document.body.style.cursor = 'col-resize';\n    document.body.style.userSelect = 'none';\n    document.addEventListener('mousemove', handleMouseMove);\n    document.addEventListener('mouseup', handleMouseUp);\n  }, [minWidth, onResize, updateWidth, width]);\n\n  const handleKeyDown = React.useCallback((event: React.KeyboardEvent<HTMLButtonElement>) => {\n    if (!onResize || width == null) return;\n\n    if (event.key !== 'ArrowLeft' && event.key !== 'ArrowRight') return;\n\n    event.preventDefault();\n    event.stopPropagation();\n    const direction = event.key === 'ArrowLeft' ? -1 : 1;\n    updateWidth(width + direction * (event.shiftKey ? 24 : 8));\n  }, [onResize, updateWidth, width]);\n\n  return (\n    <th\n      {...restProps}\n      className={mergeClassNames(className, onResize ? 'ds-table-resizable-header-cell' : undefined)}\n      style={{ ...style, width }}\n    >\n      {children}\n      {onResize ? (\n        <button\n          type=\"button\"\n          className=\"ds-table-resize-handle\"\n          aria-label=\"Resize column\"\n          onClick={(event) => event.stopPropagation()}\n          onMouseDown={handleMouseDown}\n          onKeyDown={handleKeyDown}\n        />\n      ) : null}\n    </th>\n  );\n};\n\nfunction withDSResizableColumns(\n  columns: any[] | undefined,\n  widths: DSTableColumnWidths,\n  onColumnResize: (columnKey: string, nextWidth: number) => void,\n  minWidth: number,\n  maxWidth: number | undefined,\n  defaultWidth: number,\n): any[] | undefined {\n  if (!columns) return columns;\n\n  return columns.map((column) => {\n    const nextColumn = { ...column };\n\n    if (Array.isArray(nextColumn.children) && nextColumn.children.length > 0) {\n      nextColumn.children = withDSResizableColumns(nextColumn.children, widths, onColumnResize, minWidth, maxWidth, defaultWidth);\n      return nextColumn;\n    }\n\n    const identity = getColumnIdentity(nextColumn);\n    if (!identity) return nextColumn;\n\n    const width = widths[identity] ?? getNumericColumnWidth(nextColumn.width) ?? defaultWidth;\n    const originalOnHeaderCell = nextColumn.onHeaderCell;\n    nextColumn.width = width;\n    nextColumn.onHeaderCell = (columnInstance: unknown) => {\n      const providedHeaderCellProps = originalOnHeaderCell?.(columnInstance) ?? {};\n      return {\n        ...providedHeaderCellProps,\n        width,\n        minWidth,\n        maxWidth,\n        onResize: (nextWidth: number) => onColumnResize(identity, nextWidth),\n        className: mergeClassNames(providedHeaderCellProps.className, 'ds-table-resizable-header'),\n      };\n    };\n\n    return nextColumn;\n  });\n}\n\nfunction injectStyles() {\n  if (typeof document === 'undefined') return;\n  const { table, checkbox } = dsSemanticTokens;\n\n  let style = document.getElementById(STYLE_ID) as HTMLStyleElement | null;\n  if (!style) {\n    style = document.createElement('style');\n    style.id = STYLE_ID;\n    document.head.appendChild(style);\n  }\n\n  style.textContent = `\n    .ds-table {\n      font-family: \"Nunito\", sans-serif;\n      color: ${table.text.body};\n    }\n\n    .ds-table .ant-table {\n      font-family: \"Nunito\", sans-serif;\n      color: ${table.text.body};\n      background: ${table.surface.container};\n    }\n\n    .ds-table .ant-table-thead > tr > th {\n      color: ${table.text.header} !important;\n      font-weight: ${table.typography.header.fontWeight} !important;\n      font-size: ${table.typography.header.fontSize} !important;\n      line-height: ${table.typography.header.lineHeight} !important;\n      letter-spacing: ${table.typography.header.letterSpacing} !important;\n      background: ${table.surface.container} !important;\n      border-bottom: ${table.border.headerDividerWidth} solid ${table.border.container} !important;\n      padding: ${table.padding.normal.header} !important;\n      height: ${table.rowHeight.normal.header} !important;\n      vertical-align: middle !important;\n      box-sizing: border-box !important;\n    }\n\n    .ds-table .ant-table-thead > tr > th::before {\n      display: none !important;\n    }\n\n    .ds-table .ant-table-tbody > tr > td {\n      color: ${table.text.body} !important;\n      font-weight: ${table.typography.body.fontWeight} !important;\n      font-size: ${table.typography.body.fontSize} !important;\n      line-height: ${table.typography.body.lineHeight} !important;\n      letter-spacing: ${table.typography.body.letterSpacing} !important;\n      border-bottom: 1px solid ${table.border.bodyDivider} !important;\n      background: transparent !important;\n      padding: ${table.padding.normal.body} !important;\n      height: ${table.rowHeight.normal.body} !important;\n      vertical-align: middle !important;\n      transition: none !important;\n      box-sizing: border-box !important;\n    }\n\n    .ds-table .ant-table-tbody > tr:hover > td {\n      background: ${table.surface.rowHover} !important;\n    }\n\n    .ds-table .ant-table-tbody > tr.ant-table-row-selected > td,\n    .ds-table .ant-table-tbody > tr.ant-table-row-selected:hover > td {\n      background: ${table.surface.rowSelected} !important;\n    }\n\n    .ds-table .ant-table-selection-column .ant-checkbox.ant-checkbox-indeterminate {\n      border-color: ${checkbox.border.checked} !important;\n      background-color: ${checkbox.background.checked} !important;\n    }\n\n    .ds-table .ant-table-selection-column .ant-checkbox.ant-checkbox-indeterminate::after {\n      content: '' !important;\n      position: absolute !important;\n      left: 50% !important;\n      top: 50% !important;\n      margin: 0 !important;\n      border: 0 !important;\n      border-radius: 1px !important;\n      background: ${checkbox.mark.indeterminate} !important;\n      width: ${checkbox.indeterminate.sm.width}px !important;\n      height: ${checkbox.indeterminate.sm.height}px !important;\n      transform: translate(-50%, -50%) !important;\n      opacity: 1 !important;\n    }\n\n    .ds-table .ant-table-thead > tr > th.ant-table-column-sort,\n    .ds-table .ant-table-thead > tr > th.ant-table-column-sort:hover {\n      color: ${table.text.header} !important;\n    }\n\n    .ds-table .ant-table-thead > tr > th.ant-table-column-has-sorters,\n    .ds-table .ant-table-thead > tr > th.ant-table-column-has-sorters:hover {\n      color: ${table.text.header} !important;\n    }\n\n    .ds-table .ant-table-thead > tr > th.ant-table-column-has-sorters .ant-table-column-sorters {\n      justify-content: flex-start !important;\n      gap: 6px !important;\n    }\n\n    .ds-table .ant-table-thead > tr > th.ant-table-column-has-sorters .ant-table-column-title {\n      flex: none !important;\n      font-weight: 600 !important;\n    }\n\n    .ds-table .ant-table-thead > tr > th.ant-table-column-has-sorters .ant-table-column-sorter {\n      opacity: 0 !important;\n      transition: none !important;\n      margin-inline-start: 0 !important;\n    }\n\n    .ds-table .ant-table-thead > tr > th.ant-table-column-has-sorters .ds-table-sort-icon {\n      display: inline-flex !important;\n      align-items: center !important;\n      justify-content: center !important;\n      width: 10px !important;\n      height: 10px !important;\n      opacity: 0 !important;\n      transition: none !important;\n      color: inherit !important;\n    }\n\n    .ds-table .ant-table-thead > tr > th.ant-table-column-has-sorters:hover .ant-table-column-sorter,\n    .ds-table .ant-table-thead > tr > th.ant-table-column-sort .ant-table-column-sorter {\n      opacity: 1 !important;\n    }\n\n    .ds-table .ant-table-thead > tr > th.ant-table-column-has-sorters:hover .ds-table-sort-icon,\n    .ds-table .ant-table-thead > tr > th.ant-table-column-sort .ds-table-sort-icon {\n      opacity: 1 !important;\n    }\n\n    .ds-table .ant-table-column-sorter,\n    .ds-table .ant-table-column-sorter-up,\n    .ds-table .ant-table-column-sorter-down {\n      color: ${table.text.sorterMuted} !important;\n    }\n\n    .ds-table .ant-table-column-sorter-up.active,\n    .ds-table .ant-table-column-sorter-down.active {\n      color: ${table.text.header} !important;\n    }\n\n    .ds-table .ant-table-pagination.ant-pagination {\n      margin-top: 16px !important;\n      margin-bottom: 0 !important;\n    }\n\n    .ds-table .ant-table-row-expand-icon-cell {\n      vertical-align: middle !important;\n    }\n\n    .ds-table .ant-table-row-expand-icon-cell .ds-table-expand-toggle {\n      display: flex !important;\n      align-items: center !important;\n      justify-content: center !important;\n      margin: 0 auto !important;\n      line-height: 0 !important;\n    }\n\n    .ds-table .ant-table-row-expand-icon-cell .ds-table-expand-toggle svg {\n      display: block !important;\n      width: 16px !important;\n      height: 16px !important;\n    }\n\n    .ds-table .ds-table-cell-truncate {\n      display: block !important;\n      width: 100% !important;\n      overflow: hidden !important;\n      white-space: nowrap !important;\n      text-overflow: ellipsis !important;\n    }\n\n    .ds-table.ds-table-size-small .ant-table-thead > tr > th,\n    .ds-table.ds-table-size-small .ant-table-tbody > tr > td {\n      vertical-align: middle !important;\n    }\n\n    .ds-table.ds-table-size-small .ant-table-thead > tr > th {\n      font-size: ${table.typography.compactHeader.fontSize} !important;\n      line-height: ${table.typography.compactHeader.lineHeight} !important;\n      font-weight: ${table.typography.compactHeader.fontWeight} !important;\n      letter-spacing: ${table.typography.compactHeader.letterSpacing} !important;\n      height: ${table.rowHeight.compact.header} !important;\n      padding: ${table.padding.compact.header} !important;\n      border-bottom: ${table.border.headerDividerWidth} solid ${table.border.container} !important;\n    }\n\n    .ds-table.ds-table-size-small .ant-table-tbody > tr > td {\n      font-size: ${table.typography.compactBody.fontSize} !important;\n      line-height: ${table.typography.compactBody.lineHeight} !important;\n      font-weight: ${table.typography.compactBody.fontWeight} !important;\n      letter-spacing: ${table.typography.compactBody.letterSpacing} !important;\n      height: ${table.rowHeight.compact.body} !important;\n      min-height: ${table.rowHeight.compact.body} !important;\n      max-height: ${table.rowHeight.compact.body} !important;\n      padding: ${table.padding.compact.body} !important;\n    }\n\n    .ds-table.ds-table-size-small .ant-table-tbody > tr {\n      height: ${table.rowHeight.compact.body} !important;\n      min-height: ${table.rowHeight.compact.body} !important;\n      max-height: ${table.rowHeight.compact.body} !important;\n    }\n\n    .ds-table.ds-table-size-small .ant-tag {\n      margin-inline-end: 0 !important;\n      padding: 0 4px !important;\n      height: 16px !important;\n      line-height: 16px !important;\n      font-size: 10px !important;\n      border-radius: 2px !important;\n      display: inline-flex !important;\n      align-items: center !important;\n    }\n\n    .ds-table.ds-table-size-middle .ant-table-thead > tr > th,\n    .ds-table.ds-table-size-middle .ant-table-tbody > tr > td {\n      padding: 0 16px !important;\n      vertical-align: middle !important;\n    }\n\n    .ds-table.ds-table-size-middle .ant-table-thead > tr > th {\n      font-size: ${table.typography.header.fontSize} !important;\n      line-height: ${table.typography.header.lineHeight} !important;\n      letter-spacing: ${table.typography.header.letterSpacing} !important;\n      height: ${table.rowHeight.normal.header} !important;\n      font-weight: ${table.typography.header.fontWeight} !important;\n    }\n\n    .ds-table.ds-table-size-middle .ant-table-tbody > tr > td {\n      font-size: ${table.typography.body.fontSize} !important;\n      line-height: ${table.typography.body.lineHeight} !important;\n      letter-spacing: ${table.typography.body.letterSpacing} !important;\n      height: ${table.rowHeight.normal.body} !important;\n    }\n\n    .ds-table.ds-table-size-large .ant-table-thead > tr > th,\n    .ds-table.ds-table-size-large .ant-table-tbody > tr > td {\n      padding: 0 16px !important;\n      vertical-align: middle !important;\n    }\n\n    .ds-table.ds-table-size-large .ant-table-thead > tr > th {\n      font-size: 18px !important;\n      line-height: 22px !important;\n      letter-spacing: -0.036px !important;\n      height: 50px !important;\n      font-weight: 600 !important;\n    }\n\n    .ds-table.ds-table-size-large .ant-table-tbody > tr > td {\n      font-size: 16px !important;\n      line-height: 20px !important;\n      letter-spacing: -0.016px !important;\n      height: 46px !important;\n    }\n\n    .ds-table .ant-table-thead > tr > th,\n    .ds-table .ant-table-thead > tr > th:hover {\n      color: ${table.text.body} !important;\n      font-weight: ${table.typography.body.fontWeight} !important;\n    }\n\n    .ds-table .ant-table-thead > tr > th .ant-table-column-title {\n      color: inherit !important;\n      font-weight: inherit !important;\n    }\n\n    .ds-table .ant-table-thead > tr > th.ant-table-column-has-sorters,\n    .ds-table .ant-table-thead > tr > th.ant-table-column-has-sorters:hover,\n    .ds-table .ant-table-thead > tr > th.ant-table-column-sort,\n    .ds-table .ant-table-thead > tr > th.ant-table-column-sort:hover {\n      color: ${table.text.header} !important;\n      font-weight: ${table.typography.header.fontWeight} !important;\n    }\n\n    .ds-table .ant-table-thead > tr > th.ant-table-column-has-sorters .ant-table-column-title,\n    .ds-table .ant-table-thead > tr > th.ant-table-column-sort .ant-table-column-title {\n      font-weight: ${table.typography.header.fontWeight} !important;\n    }\n\n    .ds-table.ds-table-styleA .ant-table {\n      background: ${table.surface.container} !important;\n    }\n\n    .ds-table.ds-table-styleA .ant-table-thead > tr > th {\n      border-bottom-width: 2px !important;\n    }\n\n    .ds-table.ds-table-styleA .ant-table-container {\n      border: none !important;\n      border-radius: 0 !important;\n      background: ${table.surface.container} !important;\n    }\n\n    .ds-table.ds-table-styleAEditable .ant-table {\n      background: ${table.surface.container} !important;\n    }\n\n    .ds-table.ds-table-styleAEditable .ant-table-thead > tr > th {\n      border-bottom-width: 2px !important;\n    }\n\n    .ds-table.ds-table-styleAEditable .ant-table-container {\n      border: none !important;\n      border-radius: 0 !important;\n      background: ${table.surface.container} !important;\n    }\n\n    .ds-table.ds-table-styleACustomizable .ant-table {\n      background: ${table.surface.container} !important;\n    }\n\n    .ds-table.ds-table-styleACustomizable .ant-table-thead > tr > th {\n      border-bottom-width: 2px !important;\n    }\n\n    .ds-table.ds-table-styleACustomizable .ant-table-container {\n      border: none !important;\n      border-radius: 0 !important;\n      background: ${table.surface.container} !important;\n    }\n\n    .ds-table.ds-table-styleAResizable .ant-table {\n      background: ${table.surface.container} !important;\n    }\n\n    .ds-table.ds-table-styleAResizable .ant-table-thead > tr > th {\n      border-bottom-width: 2px !important;\n    }\n\n    .ds-table.ds-table-styleAResizable .ant-table-container {\n      border: none !important;\n      border-radius: 0 !important;\n      background: ${table.surface.container} !important;\n    }\n\n    .ds-table .ds-table-resizable-header-cell {\n      position: relative !important;\n    }\n\n    .ds-table .ds-table-resize-handle {\n      position: absolute !important;\n      top: 8px !important;\n      inset-inline-end: 0 !important;\n      bottom: 8px !important;\n      width: 12px !important;\n      padding: 0 !important;\n      border: 0 !important;\n      border-radius: 0 !important;\n      background: transparent !important;\n      cursor: col-resize !important;\n      touch-action: none !important;\n      z-index: 2 !important;\n    }\n\n    .ds-table .ds-table-resize-handle::after {\n      content: '' !important;\n      position: absolute !important;\n      top: 0 !important;\n      bottom: 0 !important;\n      inset-inline-end: 5px !important;\n      width: 1px !important;\n      background: ${table.border.bodyDivider} !important;\n      opacity: 0 !important;\n      transition: opacity 120ms ease !important;\n    }\n\n    .ds-table .ds-table-resizable-header-cell:hover .ds-table-resize-handle::after,\n    .ds-table .ds-table-resize-handle:focus-visible::after {\n      opacity: 1 !important;\n      background: ${table.text.header} !important;\n    }\n\n    .ds-table .ds-table-resize-handle:focus-visible {\n      outline: 2px solid ${table.text.header} !important;\n      outline-offset: -2px !important;\n    }\n\n    .ds-table.ds-table-styleAFixedHeaderFooter .ant-table {\n      background: ${table.surface.container} !important;\n    }\n\n    .ds-table.ds-table-styleAFixedHeaderFooter .ant-table-thead > tr > th {\n      border-bottom-width: 2px !important;\n    }\n\n    .ds-table.ds-table-styleAFixedHeaderFooter .ant-table-container {\n      border: none !important;\n      border-radius: 0 !important;\n      background: ${table.surface.container} !important;\n    }\n\n    .ds-table-fixed-frame {\n      display: flex !important;\n      flex-direction: column !important;\n      width: 100% !important;\n      background: ${table.surface.container} !important;\n    }\n\n    .ds-table-fixed-frame > .ds-table.ant-table-wrapper,\n    .ds-table-fixed-frame > .ant-table-wrapper {\n      flex: 1 1 auto !important;\n      min-height: 0 !important;\n    }\n\n    .ds-table-fixed-frame .ant-table-body {\n      overflow-y: auto !important;\n    }\n\n    .ds-table-fixed-footer {\n      flex: 0 0 auto !important;\n      min-height: 56px !important;\n      display: flex !important;\n      align-items: center !important;\n      justify-content: flex-end !important;\n      padding: 12px 16px !important;\n      border-top: 1px solid ${table.border.bodyDivider} !important;\n      background: ${table.surface.container} !important;\n      box-sizing: border-box !important;\n    }\n\n    .ds-table-column-visibility-control {\n      display: flex !important;\n      align-items: center !important;\n      gap: 12px !important;\n      margin-bottom: 16px !important;\n      padding: 12px 0 !important;\n      flex-wrap: wrap !important;\n    }\n\n    .ds-table-control-label {\n      font-weight: 600 !important;\n      font-size: 14px !important;\n      color: ${table.text.body} !important;\n      margin: 0 !important;\n    }\n\n    .ds-table-control-checkboxes {\n      display: flex !important;\n      gap: 12px !important;\n      flex-wrap: wrap !important;\n    }\n\n    .ds-table-control-checkbox {\n      display: inline-flex !important;\n      align-items: center !important;\n      gap: 6px !important;\n      font-size: 14px !important;\n      color: ${table.text.body} !important;\n      cursor: pointer !important;\n      user-select: none !important;\n      margin: 0 !important;\n    }\n\n    .ds-table-control-checkbox input[type='checkbox'] {\n      width: 16px !important;\n      height: 16px !important;\n      cursor: pointer !important;\n      margin: 0 !important;\n    }\n\n    .ds-table .ds-table-edit-input.ant-input,\n    .ds-table .ds-table-edit-input.ant-input-affix-wrapper {\n      height: 26px !important;\n      min-height: 26px !important;\n      width: 100% !important;\n      min-width: 0 !important;\n      max-width: 100% !important;\n      box-sizing: border-box !important;\n      border-radius: 4px !important;\n      border: 1px solid ${dsSemanticTokens.input.border.default} !important;\n      background: ${dsSemanticTokens.input.background.default} !important;\n      color: ${dsSemanticTokens.input.text.focus} !important;\n      padding: 3px 8px !important;\n      font-size: 12px !important;\n      line-height: 16px !important;\n    }\n\n    .ds-table .ds-table-edit-input.ant-input:hover,\n    .ds-table .ds-table-edit-input.ant-input-affix-wrapper:hover {\n      border-color: ${dsSemanticTokens.input.border.hover} !important;\n    }\n\n    .ds-table .ds-table-edit-input.ant-input:focus,\n    .ds-table .ds-table-edit-input.ant-input-focused,\n    .ds-table .ds-table-edit-input.ant-input-affix-wrapper-focused {\n      border-color: ${dsSemanticTokens.input.border.focus} !important;\n      box-shadow: none !important;\n      outline: none !important;\n    }\n\n    .ds-table.ds-table-styleB {\n      background: ${table.surface.layout};\n      padding: 0;\n    }\n\n    .ds-table.ds-table-styleB .ant-table {\n      background: ${table.surface.layout} !important;\n    }\n\n    .ds-table.ds-table-styleB .ant-table-container {\n      border: 1px solid ${table.border.container} !important;\n      border-radius: ${table.border.radius} !important;\n      overflow: hidden !important;\n      background: ${table.surface.layout} !important;\n    }\n\n    .ds-table.ds-table-styleB .ant-table-thead > tr > th {\n      border-bottom-width: ${table.border.headerDividerWidth} !important;\n      background: ${table.surface.headerDefault} !important;\n    }\n\n\n    .ds-table.ds-table-styleB.ds-table-header-white .ant-table-thead > tr > th {\n      background: ${table.surface.headerWhite} !important;\n    }\n  `;\n}\n\nexport const Table: React.FC<DSTableProps> = ({\n  dsStyle = 'styleA',\n  dsHeaderVariant = 'default',\n  dsFrozenColumns = 'none',\n  dsFrozenBreakpoint = 768,\n  dsFrozenColumnWidth = 180,\n  dsTruncateCellText = false,\n  dsTruncateTooltip = true,\n  dsTruncateTooltipDelay = 0.25,\n  dsTruncateTooltipSize = 'normal',\n  dsTruncateTooltipTitle = 'Title Heading',\n  dsEditableColumns = [],\n  dsOnEditableDataChange,\n  dsCustomizable = false,\n  dsVisibleColumns,\n  dsOnVisibleColumnsChange,\n  dsFixedBodyHeight = 320,\n  dsResizableColumns = false,\n  dsColumnWidths,\n  dsOnColumnWidthsChange,\n  dsResizableColumnMinWidth = 96,\n  dsResizableColumnMaxWidth,\n  dsResizableDefaultColumnWidth = 180,\n  size = 'middle',\n  className,\n  columns,\n  dataSource,\n  pagination,\n  ...antProps\n}) => {\n  const [isAtOrBelowFrozenBreakpoint, setIsAtOrBelowFrozenBreakpoint] = React.useState(false);\n  const [editableData, setEditableData] = React.useState<Record<string, unknown>[]>(\n    Array.isArray(dataSource) ? (dataSource as Record<string, unknown>[]) : [],\n  );\n  const [localVisibleColumns, setLocalVisibleColumns] = React.useState<Set<string>>(() => {\n    if (Array.isArray(dsVisibleColumns)) {\n      return new Set(dsVisibleColumns.map(String));\n    }\n    if (columns && Array.isArray(columns)) {\n      return new Set(\n        columns\n          .map((col) => getColumnIdentity(col))\n          .filter((id) => Boolean(id)) as string[],\n      );\n    }\n    return new Set();\n  });\n  const [localColumnWidths, setLocalColumnWidths] = React.useState<DSTableColumnWidths>(() => (\n    dsColumnWidths ?? getInitialColumnWidths(columns as any[], dsResizableDefaultColumnWidth)\n  ));\n\n  useEffect(() => {\n    injectStyles();\n    ensureTooltipStyles();\n  }, []);\n\n  useEffect(() => {\n    if (typeof window === 'undefined') return;\n\n    const onResize = () => {\n      setIsAtOrBelowFrozenBreakpoint(window.innerWidth <= dsFrozenBreakpoint);\n    };\n\n    onResize();\n    window.addEventListener('resize', onResize);\n\n    return () => {\n      window.removeEventListener('resize', onResize);\n    };\n  }, [dsFrozenBreakpoint]);\n\n  useEffect(() => {\n    if (dsStyle !== 'styleAEditable') return;\n    setEditableData(Array.isArray(dataSource) ? (dataSource as Record<string, unknown>[]) : []);\n  }, [dataSource, dsStyle]);\n\n  const {\n    scroll: antScroll,\n    tableLayout: antTableLayout,\n    showSorterTooltip: antShowSorterTooltip,\n    components: antComponents,\n    ...restAntProps\n  } = antProps;\n  const useDSFrozenColumns = dsFrozenColumns !== 'none' && isAtOrBelowFrozenBreakpoint;\n  const useEditableVariant = dsStyle === 'styleAEditable';\n  const useCustomizableVariant = dsStyle === 'styleACustomizable' && dsCustomizable;\n  const useFixedHeaderFooterVariant = dsStyle === 'styleAFixedHeaderFooter';\n  const useResizableVariant = dsStyle === 'styleAResizable' || dsResizableColumns;\n  const paginationConfig = pagination && typeof pagination === 'object' ? pagination : undefined;\n  const [localCurrentPage, setLocalCurrentPage] = React.useState(paginationConfig?.defaultCurrent ?? 1);\n  const [localPageSize, setLocalPageSize] = React.useState(paginationConfig?.defaultPageSize ?? paginationConfig?.pageSize ?? 10);\n\n  useEffect(() => {\n    if (!useCustomizableVariant) return;\n    if (Array.isArray(dsVisibleColumns)) {\n      setLocalVisibleColumns(new Set(dsVisibleColumns.map(String)));\n    }\n  }, [dsVisibleColumns, useCustomizableVariant]);\n\n  useEffect(() => {\n    if (!useResizableVariant) return;\n\n    if (dsColumnWidths) {\n      setLocalColumnWidths(dsColumnWidths);\n      return;\n    }\n\n    setLocalColumnWidths((prev) => getInitialColumnWidths(columns as any[], dsResizableDefaultColumnWidth, prev));\n  }, [columns, dsColumnWidths, dsResizableDefaultColumnWidth, useResizableVariant]);\n\n  const handleColumnVisibilityToggle = React.useCallback(\n    (colKey: string, visible: boolean) => {\n      setLocalVisibleColumns((prev) => {\n        const next = new Set(prev);\n        if (visible) {\n          next.add(colKey);\n        } else {\n          next.delete(colKey);\n        }\n        const nextArray = Array.from(next);\n        dsOnVisibleColumnsChange?.(nextArray);\n        return next;\n      });\n    },\n    [dsOnVisibleColumnsChange],\n  );\n  const normalizedEditableColumns = React.useMemo(() => {\n    if (Array.isArray(dsEditableColumns)) {\n      return dsEditableColumns.map(String);\n    }\n\n    if (typeof dsEditableColumns === 'string') {\n      return dsEditableColumns\n        .split(',')\n        .map((entry) => entry.trim())\n        .filter(Boolean);\n    }\n\n    if (dsEditableColumns && typeof dsEditableColumns === 'object') {\n      return Object.entries(dsEditableColumns)\n        .filter(([, enabled]) => Boolean(enabled))\n        .map(([key]) => key);\n    }\n\n    return [] as string[];\n  }, [dsEditableColumns]);\n\n  const handleEditableCellChange = React.useCallback((rowIndex: number, dataIndex: unknown, nextValue: unknown) => {\n    setEditableData((prev) => {\n      if (!Array.isArray(prev) || !prev[rowIndex]) {\n        return prev;\n      }\n\n      const nextRows = [...prev];\n      const currentRow = nextRows[rowIndex] as Record<string, unknown>;\n      nextRows[rowIndex] = setValueByDataIndex(currentRow, dataIndex, nextValue);\n      dsOnEditableDataChange?.(nextRows as unknown[] as Record<string, unknown>[]);\n      return nextRows;\n    });\n  }, [dsOnEditableDataChange]);\n\n  const handleColumnResize = React.useCallback((columnKey: string, nextWidth: number) => {\n    const clampedWidth = clampColumnWidth(nextWidth, dsResizableColumnMinWidth, dsResizableColumnMaxWidth);\n\n    setLocalColumnWidths((prev) => {\n      const next = { ...prev, [columnKey]: clampedWidth };\n      dsOnColumnWidthsChange?.(next);\n      return next;\n    });\n  }, [dsOnColumnWidthsChange, dsResizableColumnMaxWidth, dsResizableColumnMinWidth]);\n\n  const columnsWithDSBehavior = React.useMemo(() => {\n    const withSortIcons = withDSSortIcons(columns as any[], antShowSorterTooltip);\n    const withFrozenColumns = useDSFrozenColumns\n      ? withDSFrozenColumns(withSortIcons, dsFrozenColumns, dsFrozenColumnWidth)\n      : withSortIcons;\n\n    const withVisibilityFilter = useCustomizableVariant\n      ? withDSVisibleColumnsFilter(withFrozenColumns, localVisibleColumns)\n      : withFrozenColumns;\n\n    const editableColumnKeys = new Set(normalizedEditableColumns);\n    const withEditableColumns = useEditableVariant\n      ? withDSEditableCells(withVisibilityFilter, editableColumnKeys, handleEditableCellChange)\n      : withVisibilityFilter;\n\n    const withResizableColumns = useResizableVariant\n      ? withDSResizableColumns(\n        withEditableColumns,\n        localColumnWidths,\n        handleColumnResize,\n        dsResizableColumnMinWidth,\n        dsResizableColumnMaxWidth,\n        dsResizableDefaultColumnWidth,\n      )\n      : withEditableColumns;\n\n    if (!dsTruncateCellText || useEditableVariant) {\n      return withResizableColumns;\n    }\n\n    return withDSTruncatedCells(\n      withResizableColumns,\n      dsTruncateTooltip,\n      dsTruncateTooltipDelay,\n      dsTruncateTooltipSize,\n      dsTruncateTooltipTitle\n    );\n  }, [\n    columns,\n    antShowSorterTooltip,\n    dsFrozenColumnWidth,\n    dsFrozenColumns,\n    dsTruncateCellText,\n    dsTruncateTooltip,\n    dsTruncateTooltipDelay,\n    dsTruncateTooltipSize,\n    dsTruncateTooltipTitle,\n    normalizedEditableColumns,\n    handleEditableCellChange,\n    useResizableVariant,\n    localColumnWidths,\n    handleColumnResize,\n    dsResizableColumnMinWidth,\n    dsResizableColumnMaxWidth,\n    dsResizableDefaultColumnWidth,\n    useDSFrozenColumns,\n    useEditableVariant,\n    localVisibleColumns,\n    useCustomizableVariant,\n    handleColumnVisibilityToggle,\n  ]);\n\n  const effectiveScroll = React.useMemo(() => {\n    if (useFixedHeaderFooterVariant) {\n      const scrollBase = antScroll && typeof antScroll === 'object' ? antScroll : {};\n      return {\n        ...scrollBase,\n        y: scrollBase.y ?? dsFixedBodyHeight,\n      };\n    }\n\n    if (useResizableVariant) {\n      if (!antScroll || typeof antScroll !== 'object') {\n        return { x: 'max-content' as const };\n      }\n\n      return {\n        ...antScroll,\n        x: antScroll.x ?? ('max-content' as const),\n      };\n    }\n\n    if (!useDSFrozenColumns) {\n      return antScroll;\n    }\n\n    if (!antScroll || typeof antScroll !== 'object') {\n      return { x: 'max-content' as const };\n    }\n\n    return {\n      ...antScroll,\n      x: antScroll.x ?? ('max-content' as const),\n    };\n  }, [antScroll, dsFixedBodyHeight, useDSFrozenColumns, useFixedHeaderFooterVariant, useResizableVariant]);\n\n  const effectiveTableLayout = (useEditableVariant || useResizableVariant) ? (antTableLayout ?? 'fixed') : antTableLayout;\n  const effectiveComponents = React.useMemo(() => {\n    if (!useResizableVariant) return antComponents;\n\n    return {\n      ...antComponents,\n      header: {\n        ...antComponents?.header,\n        cell: DSResizableHeaderCell,\n      },\n    };\n  }, [antComponents, useResizableVariant]);\n\n  const fixedPaginationTotal = paginationConfig?.total ?? (Array.isArray(dataSource) ? dataSource.length : 0);\n  const fixedCurrentPage = paginationConfig?.current ?? localCurrentPage;\n  const fixedPageSize = paginationConfig?.pageSize ?? localPageSize;\n  const fixedDataSource = React.useMemo(() => {\n    const source = useEditableVariant ? editableData : dataSource;\n    if (!useFixedHeaderFooterVariant || !Array.isArray(source)) {\n      return source;\n    }\n\n    if (paginationConfig?.total != null && paginationConfig.total > source.length) {\n      return source;\n    }\n\n    const start = (fixedCurrentPage - 1) * fixedPageSize;\n    return source.slice(start, start + fixedPageSize);\n  }, [dataSource, editableData, fixedCurrentPage, fixedPageSize, paginationConfig?.total, useEditableVariant, useFixedHeaderFooterVariant]);\n\n  const fixedFooterPaginationProps: DSPaginationProps = {\n    ...paginationConfig,\n    current: fixedCurrentPage,\n    pageSize: fixedPageSize,\n    total: fixedPaginationTotal,\n    showSizeChanger: paginationConfig?.showSizeChanger ?? false,\n    onChange: (page, pageSize) => {\n      setLocalCurrentPage(page);\n      setLocalPageSize(pageSize);\n      paginationConfig?.onChange?.(page, pageSize);\n    },\n    onShowSizeChange: (page, pageSize) => {\n      setLocalCurrentPage(page);\n      setLocalPageSize(pageSize);\n      paginationConfig?.onShowSizeChange?.(page, pageSize);\n    },\n  };\n\n  const dsClassName = [\n    'ds-table',\n    `ds-table-${dsStyle}`,\n    `ds-table-size-${size}`,\n    dsHeaderVariant === 'white' ? 'ds-table-header-white' : '',\n    className || '',\n  ]\n    .filter(Boolean)\n    .join(' ');\n\n  const tableElement = (\n    <AntTable\n      {...restAntProps}\n      columns={columnsWithDSBehavior}\n      dataSource={fixedDataSource}\n      pagination={useFixedHeaderFooterVariant ? false : pagination}\n      scroll={effectiveScroll}\n      tableLayout={effectiveTableLayout}\n      components={effectiveComponents}\n      size={size}\n      className={dsClassName}\n      showSorterTooltip={getDSSorterTooltipProps(antShowSorterTooltip)}\n    />\n  );\n\n  if (useFixedHeaderFooterVariant) {\n    return (\n      <div className={`${dsClassName} ds-table-fixed-frame`}>\n        {tableElement}\n        <div className=\"ds-table-fixed-footer\">\n          <DSPagination {...fixedFooterPaginationProps} />\n        </div>\n      </div>\n    );\n  }\n\n  return useCustomizableVariant ? (\n    <div className={dsClassName}>\n      <DSColumnVisibilityControl\n        columns={columns as any[]}\n        visibleColumns={localVisibleColumns}\n        onToggle={handleColumnVisibilityToggle}\n      />\n      {tableElement}\n    </div>\n  ) : (\n    tableElement\n  );\n};\n\nexport default Table;\n"],"mappings":"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"}

package/dist-lib/display/Tag.cjs

@@ -0,0 +1,35 @@
+Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require(`../chunk-Bmb41Sf3.cjs`),t=require(`../theme.cjs`);let n=require(`antd`),r=require(`react`);r=e.t(r,1);let i=require(`react/jsx-runtime`);var a=`ds-tag-styles`;function o(){if(typeof document>`u`)return;let{tag:e}=t.dsSemanticTokens,n=document.getElementById(a);n||(n=document.createElement(`style`),n.id=a,document.head.appendChild(n)),n.textContent=`
+    .ds-tag.ant-tag {
+      margin-inline-end: 0;
+      transition: none;
+    }
+
+    .ds-tag.ant-tag .ant-tag-close-icon {
+      margin-inline-start: 0;
+      transition: none;
+      display: inline-flex;
+      align-items: center;
+      justify-content: center;
+      line-height: 1;
+      color: inherit;
+    }
+
+    .ds-tag.ant-tag[data-ds-size='sm'] .ant-tag-close-icon {
+      width: ${e.closeIcon.size.sm};
+      height: ${e.closeIcon.size.sm};
+      font-size: ${e.closeIcon.size.sm};
+    }
+
+    .ds-tag.ant-tag[data-ds-size='md'] .ant-tag-close-icon {
+      width: ${e.closeIcon.size.md};
+      height: ${e.closeIcon.size.md};
+      font-size: ${e.closeIcon.size.md};
+    }
+
+    .ds-tag.ant-tag[data-ds-size='lg'] .ant-tag-close-icon {
+      width: ${e.closeIcon.size.lg};
+      height: ${e.closeIcon.size.lg};
+      font-size: ${e.closeIcon.size.lg};
+    }
+  `}function s(e,n,r,i,a){let{tag:o}=t.dsSemanticTokens,s=e===`custom`?{text:i.text??o.status.neutral.light.text,bg:i.background??o.status.neutral.light.bg,border:i.border??o.status.neutral.light.border}:o.status[e][n],c=o.size[r],l=c.typography,u={fontWeight:o.typography.fontWeight,textTransform:o.typography.textTransform,fontFamily:`inherit`,display:`inline-flex`,alignItems:`center`,justifyContent:`center`,padding:c.padding,borderRadius:c.radius,fontSize:l.fontSize,lineHeight:l.lineHeight,letterSpacing:l.letterSpacing,boxSizing:`border-box`,border:`none`,color:s.text,backgroundColor:s.bg??`transparent`};return(e===`custom`||n===`outline`||s.border)&&(u.border=`${o.borderWidth} solid ${s.border}`),{...u,...a}}var c=({dsStatus:e=`neutral`,dsVariant:t=`solid`,dsSize:a=`md`,dsCustomStatusText:c,dsCustomTextColor:l,dsCustomBackgroundColor:u,dsCustomBorderColor:d,style:f={},className:p=``,children:m,...h})=>{(0,r.useEffect)(()=>{o()},[]);let g=s(e,t,a,{text:l,background:u,border:d},f),_=`ds-tag${p?` ${p}`:``}`,v=e===`custom`&&c!==void 0?c:m;return(0,i.jsx)(n.Tag,{style:g,className:_,"data-ds-status":e,"data-ds-variant":t,"data-ds-size":a,...h,children:v})};c.displayName=`Tag`,c.CheckableTag=n.Tag.CheckableTag,exports.Tag=c;
+//# sourceMappingURL=Tag.cjs.map

package/dist-lib/display/Tag.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"Tag.cjs","names":[],"sources":["../../src/ds/display/Tag.tsx"],"sourcesContent":["import React, { useEffect } from 'react';\nimport { Tag as AntTag } from 'antd';\nimport type { TagProps as AntTagProps } from 'antd';\nimport type { CSSProperties } from 'react';\nimport { dsSemanticTokens } from '../../theme/ontadaTheme';\n\nexport type DSTagStatus = 'neutral' | 'success' | 'warning' | 'error' | 'inactive' | 'new' | 'custom';\nexport type DSTagVariant = 'solid' | 'light' | 'outline';\nexport type DSTagSize = 'sm' | 'md' | 'lg';\n\n/**\n * Ant visual props replaced by DS semantic API.\n * Use dsStatus + dsVariant instead of color/variant/bordered.\n */\ntype RestrictedAntProps = 'color' | 'variant' | 'bordered';\n\nexport type TagProps = Omit<AntTagProps, RestrictedAntProps> & {\n  /** DS semantic status — drives background, text, and border color. */\n  dsStatus?: DSTagStatus;\n  /** DS visual style — solid filled, light tinted, or outline only. */\n  dsVariant?: DSTagVariant;\n  /** DS size — sm (12px), md (14px, default), lg (16px). */\n  dsSize?: DSTagSize;\n  /** Custom status label rendered when dsStatus is custom. Falls back to children. */\n  dsCustomStatusText?: React.ReactNode;\n  /** Custom text color applied when dsStatus is custom. */\n  dsCustomTextColor?: string;\n  /** Custom background color applied when dsStatus is custom. */\n  dsCustomBackgroundColor?: string;\n  /** Custom border color applied when dsStatus is custom. */\n  dsCustomBorderColor?: string;\n};\n\nconst STYLE_ID = 'ds-tag-styles';\n\nfunction injectStyles() {\n  if (typeof document === 'undefined') return;\n\n  const { tag } = dsSemanticTokens;\n\n  let style = document.getElementById(STYLE_ID) as HTMLStyleElement | null;\n  if (!style) {\n    style = document.createElement('style');\n    style.id = STYLE_ID;\n    document.head.appendChild(style);\n  }\n\n  style.textContent = `\n    .ds-tag.ant-tag {\n      margin-inline-end: 0;\n      transition: none;\n    }\n\n    .ds-tag.ant-tag .ant-tag-close-icon {\n      margin-inline-start: 0;\n      transition: none;\n      display: inline-flex;\n      align-items: center;\n      justify-content: center;\n      line-height: 1;\n      color: inherit;\n    }\n\n    .ds-tag.ant-tag[data-ds-size='sm'] .ant-tag-close-icon {\n      width: ${tag.closeIcon.size.sm};\n      height: ${tag.closeIcon.size.sm};\n      font-size: ${tag.closeIcon.size.sm};\n    }\n\n    .ds-tag.ant-tag[data-ds-size='md'] .ant-tag-close-icon {\n      width: ${tag.closeIcon.size.md};\n      height: ${tag.closeIcon.size.md};\n      font-size: ${tag.closeIcon.size.md};\n    }\n\n    .ds-tag.ant-tag[data-ds-size='lg'] .ant-tag-close-icon {\n      width: ${tag.closeIcon.size.lg};\n      height: ${tag.closeIcon.size.lg};\n      font-size: ${tag.closeIcon.size.lg};\n    }\n  `;\n}\n\nfunction buildStyles(\n  status: DSTagStatus,\n  variant: DSTagVariant,\n  size: DSTagSize,\n  customColors: {\n    text?: string;\n    background?: string;\n    border?: string;\n  },\n  userStyle: CSSProperties,\n): CSSProperties {\n  const { tag } = dsSemanticTokens;\n  const palette = status === 'custom'\n    ? {\n        text: customColors.text ?? tag.status.neutral.light.text,\n        bg: customColors.background ?? tag.status.neutral.light.bg,\n        border: customColors.border ?? tag.status.neutral.light.border,\n      }\n    : tag.status[status][variant];\n  const sizeTokens = tag.size[size];\n  const typeTokens = sizeTokens.typography;\n\n  const base: CSSProperties = {\n    fontWeight: tag.typography.fontWeight,\n    textTransform: tag.typography.textTransform,\n    fontFamily: 'inherit',\n    display: 'inline-flex',\n    alignItems: 'center',\n    justifyContent: 'center',\n    padding: sizeTokens.padding,\n    borderRadius: sizeTokens.radius,\n    fontSize: typeTokens.fontSize,\n    lineHeight: typeTokens.lineHeight,\n    letterSpacing: typeTokens.letterSpacing,\n    boxSizing: 'border-box',\n    border: 'none',\n    color: palette.text,\n    backgroundColor: palette.bg ?? 'transparent',\n  };\n\n  if (status === 'custom' || variant === 'outline' || palette.border) {\n    base.border = `${tag.borderWidth} solid ${palette.border}`;\n  }\n\n  return { ...base, ...userStyle };\n}\n\n// ─── Component ───────────────────────────────────────────────────────────────\n\n/**\n * DS Tag — semantic status badge extending Ant Design's Tag.\n *\n * Use `dsStatus` + `dsVariant` + `dsSize` to drive all visual styling.\n * Ant Design's `color`, `variant`, and `bordered` props are intentionally\n * excluded so DS variants remain the source of truth.\n *\n * @example\n * <Tag dsStatus=\"success\" dsVariant=\"solid\">Active</Tag>\n * <Tag dsStatus=\"error\" dsVariant=\"outline\" dsSize=\"sm\">Error</Tag>\n * <Tag dsStatus=\"warning\" dsVariant=\"light\" dsSize=\"lg\">Warning</Tag>\n * <Tag dsStatus=\"custom\" dsCustomStatusText=\"Escalated\" dsCustomTextColor=\"#1e394e\" dsCustomBackgroundColor=\"#f2f6fa\" dsCustomBorderColor=\"#8da0b4\" />\n */\nexport const Tag = ({\n  dsStatus = 'neutral',\n  dsVariant = 'solid',\n  dsSize = 'md',\n  dsCustomStatusText,\n  dsCustomTextColor,\n  dsCustomBackgroundColor,\n  dsCustomBorderColor,\n  style: userStyle = {},\n  className: userClassName = '',\n  children,\n  ...restProps\n}: TagProps) => {\n  useEffect(() => {\n    injectStyles();\n  }, []);\n\n  const computedStyles = buildStyles(\n    dsStatus,\n    dsVariant,\n    dsSize,\n    {\n      text: dsCustomTextColor,\n      background: dsCustomBackgroundColor,\n      border: dsCustomBorderColor,\n    },\n    userStyle,\n  );\n  const className = `ds-tag${userClassName ? ` ${userClassName}` : ''}`;\n  const content = dsStatus === 'custom' && dsCustomStatusText !== undefined ? dsCustomStatusText : children;\n\n  return (\n    <AntTag\n      style={computedStyles}\n      className={className}\n      data-ds-status={dsStatus}\n      data-ds-variant={dsVariant}\n      data-ds-size={dsSize}\n      {...restProps}\n    >\n      {content}\n    </AntTag>\n  );\n};\n\nTag.displayName = 'Tag';\nTag.CheckableTag = AntTag.CheckableTag;\n"],"mappings":"6NAiCA,IAAM,EAAW,gBAEjB,SAAS,GAAe,CACtB,GAAI,OAAO,SAAa,IAAa,OAErC,GAAM,CAAE,OAAQ,EAAA,iBAEZ,EAAQ,SAAS,eAAe,EAAS,CACxC,IACH,EAAQ,SAAS,cAAc,QAAQ,CACvC,EAAM,GAAK,EACX,SAAS,KAAK,YAAY,EAAM,EAGlC,EAAM,YAAc;;;;;;;;;;;;;;;;;eAiBP,EAAI,UAAU,KAAK,GAAG;gBACrB,EAAI,UAAU,KAAK,GAAG;mBACnB,EAAI,UAAU,KAAK,GAAG;;;;eAI1B,EAAI,UAAU,KAAK,GAAG;gBACrB,EAAI,UAAU,KAAK,GAAG;mBACnB,EAAI,UAAU,KAAK,GAAG;;;;eAI1B,EAAI,UAAU,KAAK,GAAG;gBACrB,EAAI,UAAU,KAAK,GAAG;mBACnB,EAAI,UAAU,KAAK,GAAG;;IAKzC,SAAS,EACP,EACA,EACA,EACA,EAKA,EACe,CACf,GAAM,CAAE,OAAQ,EAAA,iBACV,EAAU,IAAW,SACvB,CACE,KAAM,EAAa,MAAQ,EAAI,OAAO,QAAQ,MAAM,KACpD,GAAI,EAAa,YAAc,EAAI,OAAO,QAAQ,MAAM,GACxD,OAAQ,EAAa,QAAU,EAAI,OAAO,QAAQ,MAAM,OACzD,CACD,EAAI,OAAO,GAAQ,GACjB,EAAa,EAAI,KAAK,GACtB,EAAa,EAAW,WAExB,EAAsB,CAC1B,WAAY,EAAI,WAAW,WAC3B,cAAe,EAAI,WAAW,cAC9B,WAAY,UACZ,QAAS,cACT,WAAY,SACZ,eAAgB,SAChB,QAAS,EAAW,QACpB,aAAc,EAAW,OACzB,SAAU,EAAW,SACrB,WAAY,EAAW,WACvB,cAAe,EAAW,cAC1B,UAAW,aACX,OAAQ,OACR,MAAO,EAAQ,KACf,gBAAiB,EAAQ,IAAM,cAChC,CAMD,OAJI,IAAW,UAAY,IAAY,WAAa,EAAQ,UAC1D,EAAK,OAAS,GAAG,EAAI,YAAY,SAAS,EAAQ,UAG7C,CAAE,GAAG,EAAM,GAAG,EAAW,CAkBlC,IAAa,GAAO,CAClB,WAAW,UACX,YAAY,QACZ,SAAS,KACT,qBACA,oBACA,0BACA,sBACA,MAAO,EAAY,EAAE,CACrB,UAAW,EAAgB,GAC3B,WACA,GAAG,KACW,EACd,EAAA,EAAA,eAAgB,CACd,GAAc,EACb,EAAE,CAAC,CAEN,IAAM,EAAiB,EACrB,EACA,EACA,EACA,CACE,KAAM,EACN,WAAY,EACZ,OAAQ,EACT,CACD,EACD,CACK,EAAY,SAAS,EAAgB,IAAI,IAAkB,KAC3D,EAAU,IAAa,UAAY,IAAuB,IAAA,GAAY,EAAqB,EAEjG,OACE,EAAA,EAAA,KAAC,EAAA,IAAD,CACE,MAAO,EACI,YACX,iBAAgB,EAChB,kBAAiB,EACjB,eAAc,EACd,GAAI,WAEH,EACM,CAAA,EAIb,EAAI,YAAc,MAClB,EAAI,aAAe,EAAA,IAAO"}

package/dist-lib/display/Tag.js

@@ -0,0 +1,95 @@
+import { dsSemanticTokens as e } from "../theme.js";
+import { Tag as t } from "antd";
+import { useEffect as n } from "react";
+import { jsx as r } from "react/jsx-runtime";
+//#region src/ds/display/Tag.tsx
+var i = "ds-tag-styles";
+function a() {
+	if (typeof document > "u") return;
+	let { tag: t } = e, n = document.getElementById(i);
+	n || (n = document.createElement("style"), n.id = i, document.head.appendChild(n)), n.textContent = `
+    .ds-tag.ant-tag {
+      margin-inline-end: 0;
+      transition: none;
+    }
+
+    .ds-tag.ant-tag .ant-tag-close-icon {
+      margin-inline-start: 0;
+      transition: none;
+      display: inline-flex;
+      align-items: center;
+      justify-content: center;
+      line-height: 1;
+      color: inherit;
+    }
+
+    .ds-tag.ant-tag[data-ds-size='sm'] .ant-tag-close-icon {
+      width: ${t.closeIcon.size.sm};
+      height: ${t.closeIcon.size.sm};
+      font-size: ${t.closeIcon.size.sm};
+    }
+
+    .ds-tag.ant-tag[data-ds-size='md'] .ant-tag-close-icon {
+      width: ${t.closeIcon.size.md};
+      height: ${t.closeIcon.size.md};
+      font-size: ${t.closeIcon.size.md};
+    }
+
+    .ds-tag.ant-tag[data-ds-size='lg'] .ant-tag-close-icon {
+      width: ${t.closeIcon.size.lg};
+      height: ${t.closeIcon.size.lg};
+      font-size: ${t.closeIcon.size.lg};
+    }
+  `;
+}
+function o(t, n, r, i, a) {
+	let { tag: o } = e, s = t === "custom" ? {
+		text: i.text ?? o.status.neutral.light.text,
+		bg: i.background ?? o.status.neutral.light.bg,
+		border: i.border ?? o.status.neutral.light.border
+	} : o.status[t][n], c = o.size[r], l = c.typography, u = {
+		fontWeight: o.typography.fontWeight,
+		textTransform: o.typography.textTransform,
+		fontFamily: "inherit",
+		display: "inline-flex",
+		alignItems: "center",
+		justifyContent: "center",
+		padding: c.padding,
+		borderRadius: c.radius,
+		fontSize: l.fontSize,
+		lineHeight: l.lineHeight,
+		letterSpacing: l.letterSpacing,
+		boxSizing: "border-box",
+		border: "none",
+		color: s.text,
+		backgroundColor: s.bg ?? "transparent"
+	};
+	return (t === "custom" || n === "outline" || s.border) && (u.border = `${o.borderWidth} solid ${s.border}`), {
+		...u,
+		...a
+	};
+}
+var s = ({ dsStatus: e = "neutral", dsVariant: i = "solid", dsSize: s = "md", dsCustomStatusText: c, dsCustomTextColor: l, dsCustomBackgroundColor: u, dsCustomBorderColor: d, style: f = {}, className: p = "", children: m, ...h }) => {
+	n(() => {
+		a();
+	}, []);
+	let g = o(e, i, s, {
+		text: l,
+		background: u,
+		border: d
+	}, f), _ = `ds-tag${p ? ` ${p}` : ""}`, v = e === "custom" && c !== void 0 ? c : m;
+	return /* @__PURE__ */ r(t, {
+		style: g,
+		className: _,
+		"data-ds-status": e,
+		"data-ds-variant": i,
+		"data-ds-size": s,
+		...h,
+		children: v
+	});
+};
+s.displayName = "Tag", s.CheckableTag = t.CheckableTag;
+//#endregion
+export { s as Tag };
+
+//# sourceMappingURL=Tag.js.map

package/dist-lib/display/Tag.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Tag.js","names":[],"sources":["../../src/ds/display/Tag.tsx"],"sourcesContent":["import React, { useEffect } from 'react';\nimport { Tag as AntTag } from 'antd';\nimport type { TagProps as AntTagProps } from 'antd';\nimport type { CSSProperties } from 'react';\nimport { dsSemanticTokens } from '../../theme/ontadaTheme';\n\nexport type DSTagStatus = 'neutral' | 'success' | 'warning' | 'error' | 'inactive' | 'new' | 'custom';\nexport type DSTagVariant = 'solid' | 'light' | 'outline';\nexport type DSTagSize = 'sm' | 'md' | 'lg';\n\n/**\n * Ant visual props replaced by DS semantic API.\n * Use dsStatus + dsVariant instead of color/variant/bordered.\n */\ntype RestrictedAntProps = 'color' | 'variant' | 'bordered';\n\nexport type TagProps = Omit<AntTagProps, RestrictedAntProps> & {\n  /** DS semantic status — drives background, text, and border color. */\n  dsStatus?: DSTagStatus;\n  /** DS visual style — solid filled, light tinted, or outline only. */\n  dsVariant?: DSTagVariant;\n  /** DS size — sm (12px), md (14px, default), lg (16px). */\n  dsSize?: DSTagSize;\n  /** Custom status label rendered when dsStatus is custom. Falls back to children. */\n  dsCustomStatusText?: React.ReactNode;\n  /** Custom text color applied when dsStatus is custom. */\n  dsCustomTextColor?: string;\n  /** Custom background color applied when dsStatus is custom. */\n  dsCustomBackgroundColor?: string;\n  /** Custom border color applied when dsStatus is custom. */\n  dsCustomBorderColor?: string;\n};\n\nconst STYLE_ID = 'ds-tag-styles';\n\nfunction injectStyles() {\n  if (typeof document === 'undefined') return;\n\n  const { tag } = dsSemanticTokens;\n\n  let style = document.getElementById(STYLE_ID) as HTMLStyleElement | null;\n  if (!style) {\n    style = document.createElement('style');\n    style.id = STYLE_ID;\n    document.head.appendChild(style);\n  }\n\n  style.textContent = `\n    .ds-tag.ant-tag {\n      margin-inline-end: 0;\n      transition: none;\n    }\n\n    .ds-tag.ant-tag .ant-tag-close-icon {\n      margin-inline-start: 0;\n      transition: none;\n      display: inline-flex;\n      align-items: center;\n      justify-content: center;\n      line-height: 1;\n      color: inherit;\n    }\n\n    .ds-tag.ant-tag[data-ds-size='sm'] .ant-tag-close-icon {\n      width: ${tag.closeIcon.size.sm};\n      height: ${tag.closeIcon.size.sm};\n      font-size: ${tag.closeIcon.size.sm};\n    }\n\n    .ds-tag.ant-tag[data-ds-size='md'] .ant-tag-close-icon {\n      width: ${tag.closeIcon.size.md};\n      height: ${tag.closeIcon.size.md};\n      font-size: ${tag.closeIcon.size.md};\n    }\n\n    .ds-tag.ant-tag[data-ds-size='lg'] .ant-tag-close-icon {\n      width: ${tag.closeIcon.size.lg};\n      height: ${tag.closeIcon.size.lg};\n      font-size: ${tag.closeIcon.size.lg};\n    }\n  `;\n}\n\nfunction buildStyles(\n  status: DSTagStatus,\n  variant: DSTagVariant,\n  size: DSTagSize,\n  customColors: {\n    text?: string;\n    background?: string;\n    border?: string;\n  },\n  userStyle: CSSProperties,\n): CSSProperties {\n  const { tag } = dsSemanticTokens;\n  const palette = status === 'custom'\n    ? {\n        text: customColors.text ?? tag.status.neutral.light.text,\n        bg: customColors.background ?? tag.status.neutral.light.bg,\n        border: customColors.border ?? tag.status.neutral.light.border,\n      }\n    : tag.status[status][variant];\n  const sizeTokens = tag.size[size];\n  const typeTokens = sizeTokens.typography;\n\n  const base: CSSProperties = {\n    fontWeight: tag.typography.fontWeight,\n    textTransform: tag.typography.textTransform,\n    fontFamily: 'inherit',\n    display: 'inline-flex',\n    alignItems: 'center',\n    justifyContent: 'center',\n    padding: sizeTokens.padding,\n    borderRadius: sizeTokens.radius,\n    fontSize: typeTokens.fontSize,\n    lineHeight: typeTokens.lineHeight,\n    letterSpacing: typeTokens.letterSpacing,\n    boxSizing: 'border-box',\n    border: 'none',\n    color: palette.text,\n    backgroundColor: palette.bg ?? 'transparent',\n  };\n\n  if (status === 'custom' || variant === 'outline' || palette.border) {\n    base.border = `${tag.borderWidth} solid ${palette.border}`;\n  }\n\n  return { ...base, ...userStyle };\n}\n\n// ─── Component ───────────────────────────────────────────────────────────────\n\n/**\n * DS Tag — semantic status badge extending Ant Design's Tag.\n *\n * Use `dsStatus` + `dsVariant` + `dsSize` to drive all visual styling.\n * Ant Design's `color`, `variant`, and `bordered` props are intentionally\n * excluded so DS variants remain the source of truth.\n *\n * @example\n * <Tag dsStatus=\"success\" dsVariant=\"solid\">Active</Tag>\n * <Tag dsStatus=\"error\" dsVariant=\"outline\" dsSize=\"sm\">Error</Tag>\n * <Tag dsStatus=\"warning\" dsVariant=\"light\" dsSize=\"lg\">Warning</Tag>\n * <Tag dsStatus=\"custom\" dsCustomStatusText=\"Escalated\" dsCustomTextColor=\"#1e394e\" dsCustomBackgroundColor=\"#f2f6fa\" dsCustomBorderColor=\"#8da0b4\" />\n */\nexport const Tag = ({\n  dsStatus = 'neutral',\n  dsVariant = 'solid',\n  dsSize = 'md',\n  dsCustomStatusText,\n  dsCustomTextColor,\n  dsCustomBackgroundColor,\n  dsCustomBorderColor,\n  style: userStyle = {},\n  className: userClassName = '',\n  children,\n  ...restProps\n}: TagProps) => {\n  useEffect(() => {\n    injectStyles();\n  }, []);\n\n  const computedStyles = buildStyles(\n    dsStatus,\n    dsVariant,\n    dsSize,\n    {\n      text: dsCustomTextColor,\n      background: dsCustomBackgroundColor,\n      border: dsCustomBorderColor,\n    },\n    userStyle,\n  );\n  const className = `ds-tag${userClassName ? ` ${userClassName}` : ''}`;\n  const content = dsStatus === 'custom' && dsCustomStatusText !== undefined ? dsCustomStatusText : children;\n\n  return (\n    <AntTag\n      style={computedStyles}\n      className={className}\n      data-ds-status={dsStatus}\n      data-ds-variant={dsVariant}\n      data-ds-size={dsSize}\n      {...restProps}\n    >\n      {content}\n    </AntTag>\n  );\n};\n\nTag.displayName = 'Tag';\nTag.CheckableTag = AntTag.CheckableTag;\n"],"mappings":";;;;;AAiCA,IAAM,IAAW;AAEjB,SAAS,IAAe;AACtB,KAAI,OAAO,WAAa,IAAa;CAErC,IAAM,EAAE,WAAQ,GAEZ,IAAQ,SAAS,eAAe,EAAS;AAO7C,CANK,MACH,IAAQ,SAAS,cAAc,QAAQ,EACvC,EAAM,KAAK,GACX,SAAS,KAAK,YAAY,EAAM,GAGlC,EAAM,cAAc;;;;;;;;;;;;;;;;;eAiBP,EAAI,UAAU,KAAK,GAAG;gBACrB,EAAI,UAAU,KAAK,GAAG;mBACnB,EAAI,UAAU,KAAK,GAAG;;;;eAI1B,EAAI,UAAU,KAAK,GAAG;gBACrB,EAAI,UAAU,KAAK,GAAG;mBACnB,EAAI,UAAU,KAAK,GAAG;;;;eAI1B,EAAI,UAAU,KAAK,GAAG;gBACrB,EAAI,UAAU,KAAK,GAAG;mBACnB,EAAI,UAAU,KAAK,GAAG;;;;AAKzC,SAAS,EACP,GACA,GACA,GACA,GAKA,GACe;CACf,IAAM,EAAE,WAAQ,GACV,IAAU,MAAW,WACvB;EACE,MAAM,EAAa,QAAQ,EAAI,OAAO,QAAQ,MAAM;EACpD,IAAI,EAAa,cAAc,EAAI,OAAO,QAAQ,MAAM;EACxD,QAAQ,EAAa,UAAU,EAAI,OAAO,QAAQ,MAAM;EACzD,GACD,EAAI,OAAO,GAAQ,IACjB,IAAa,EAAI,KAAK,IACtB,IAAa,EAAW,YAExB,IAAsB;EAC1B,YAAY,EAAI,WAAW;EAC3B,eAAe,EAAI,WAAW;EAC9B,YAAY;EACZ,SAAS;EACT,YAAY;EACZ,gBAAgB;EAChB,SAAS,EAAW;EACpB,cAAc,EAAW;EACzB,UAAU,EAAW;EACrB,YAAY,EAAW;EACvB,eAAe,EAAW;EAC1B,WAAW;EACX,QAAQ;EACR,OAAO,EAAQ;EACf,iBAAiB,EAAQ,MAAM;EAChC;AAMD,SAJI,MAAW,YAAY,MAAY,aAAa,EAAQ,YAC1D,EAAK,SAAS,GAAG,EAAI,YAAY,SAAS,EAAQ,WAG7C;EAAE,GAAG;EAAM,GAAG;EAAW;;AAkBlC,IAAa,KAAO,EAClB,cAAW,WACX,eAAY,SACZ,YAAS,MACT,uBACA,sBACA,4BACA,wBACA,OAAO,IAAY,EAAE,EACrB,WAAW,IAAgB,IAC3B,aACA,GAAG,QACW;AACd,SAAgB;AACd,KAAc;IACb,EAAE,CAAC;CAEN,IAAM,IAAiB,EACrB,GACA,GACA,GACA;EACE,MAAM;EACN,YAAY;EACZ,QAAQ;EACT,EACD,EACD,EACK,IAAY,SAAS,IAAgB,IAAI,MAAkB,MAC3D,IAAU,MAAa,YAAY,MAAuB,KAAA,IAAY,IAAqB;AAEjG,QACE,kBAAC,GAAD;EACE,OAAO;EACI;EACX,kBAAgB;EAChB,mBAAiB;EACjB,gBAAc;EACd,GAAI;YAEH;EACM,CAAA;;AAIb,EAAI,cAAc,OAClB,EAAI,eAAe,EAAO"}

package/dist-lib/display/Timeline.cjs

@@ -0,0 +1,138 @@
+Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`}),require(`../chunk-Bmb41Sf3.cjs`);const e=require(`../theme.cjs`),t=require(`./Icon.cjs`);let n=require(`antd`),r=require(`react`),i=require(`react/jsx-runtime`);var a=`ds-timeline-styles`,o=`ds-timeline`,s={auditTrail:{mode:`start`,orientation:`vertical`,density:`comfortable`},workflowHistory:{mode:`alternate`,orientation:`vertical`,density:`comfortable`},activityFeed:{mode:`start`,orientation:`vertical`,density:`comfortable`},clinicalTimeline:{mode:`start`,orientation:`vertical`,density:`comfortable`},compact:{mode:`start`,orientation:`vertical`,density:`compact`}},c={complete:`check`,inProgress:`sync`,blocked:`close`,warning:`alertTriangle`,neutral:`minus`},l={complete:`outlined`,inProgress:`filled`,blocked:`filled`,warning:`outlined`,neutral:`filled`};function u(...e){return e.filter(Boolean).join(` `).trim()}function d(){if(typeof document>`u`)return;let{timeline:t}=e.dsSemanticTokens,n=document.getElementById(a);n||(n=document.createElement(`style`),n.id=a,document.head.appendChild(n)),n.textContent=`
+    .${o}.ant-timeline {
+      font-family: 'Nunito', sans-serif;
+      color: ${t.text.content};
+      background: ${t.surface.default};
+      transition: none !important;
+      animation-duration: 0s !important;
+    }
+
+    .${o}.ant-timeline,
+    .${o}.ant-timeline .ant-timeline-item,
+    .${o}.ant-timeline .ant-timeline-item-tail,
+    .${o}.ant-timeline .ant-timeline-item-head,
+    .${o}.ant-timeline .ant-timeline-item-content {
+      transition: none !important;
+      animation-duration: 0s !important;
+    }
+
+    .${o}.ant-timeline .ant-timeline-item {
+      padding-bottom: var(--ds-timeline-item-padding-bottom);
+    }
+
+    .${o}.ant-timeline .ant-timeline-item-tail {
+      inset-inline-start: var(--ds-timeline-tail-left);
+      top: var(--ds-timeline-tail-top);
+      border-inline-start-width: ${t.line.width};
+      border-inline-start-color: ${t.line.default};
+    }
+
+    .${o}.ant-timeline .ant-timeline-item-head {
+      width: var(--ds-timeline-dot-size);
+      height: var(--ds-timeline-dot-size);
+      border: 0 !important;
+      background: transparent !important;
+      inset-inline-start: 0;
+      margin-top: calc((var(--ds-timeline-title-line-height) - var(--ds-timeline-dot-size)) / 2);
+      box-shadow: none !important;
+    }
+
+    .${o}.ant-timeline .ant-timeline-item-head-custom {
+      width: var(--ds-timeline-dot-size);
+      height: var(--ds-timeline-dot-size);
+      inset-inline-start: 0;
+      margin-top: calc((var(--ds-timeline-title-line-height) - var(--ds-timeline-dot-size)) / 2);
+      line-height: 0;
+      transform: none;
+      border: 0 !important;
+      background: transparent !important;
+      box-shadow: none !important;
+      padding: 0;
+    }
+
+    .${o}.ant-timeline .ant-timeline-item-content {
+      margin-inline-start: calc(var(--ds-timeline-dot-size) + var(--ds-timeline-item-gap));
+      min-height: var(--ds-timeline-title-line-height);
+      color: ${t.text.content};
+      font-size: var(--ds-timeline-content-font-size);
+      font-weight: var(--ds-timeline-content-font-weight);
+      line-height: var(--ds-timeline-content-line-height);
+    }
+
+    .${o}.ant-timeline .ds-timeline-title {
+      color: ${t.text.title};
+      font-size: var(--ds-timeline-title-font-size);
+      font-weight: var(--ds-timeline-title-font-weight);
+      line-height: var(--ds-timeline-title-line-height);
+      margin-bottom: 2px;
+      overflow-wrap: anywhere;
+    }
+
+    .${o}.ant-timeline .ds-timeline-content {
+      color: ${t.text.content};
+      font-size: var(--ds-timeline-content-font-size);
+      font-weight: var(--ds-timeline-content-font-weight);
+      line-height: var(--ds-timeline-content-line-height);
+      overflow-wrap: anywhere;
+    }
+
+    .${o}.ant-timeline .ds-timeline-meta {
+      margin-top: 2px;
+      color: ${t.text.meta};
+      font-size: 12px;
+      font-weight: 600;
+      line-height: 16px;
+      overflow-wrap: anywhere;
+    }
+
+    .${o}.ant-timeline .ds-timeline-dot {
+      width: var(--ds-timeline-dot-size);
+      height: var(--ds-timeline-dot-size);
+      min-width: var(--ds-timeline-dot-size);
+      min-height: var(--ds-timeline-dot-size);
+      max-width: var(--ds-timeline-dot-size);
+      max-height: var(--ds-timeline-dot-size);
+      flex: 0 0 var(--ds-timeline-dot-size);
+      aspect-ratio: 1 / 1;
+      padding: 0;
+      border-radius: 999px;
+      background: var(--ds-timeline-dot-color);
+      border: 1px solid color-mix(in srgb, var(--ds-timeline-dot-color) 72%, ${t.surface.default});
+      display: inline-flex;
+      align-items: center;
+      justify-content: center;
+      box-sizing: border-box;
+      line-height: 0;
+    }
+
+    .${o}.ant-timeline .ds-timeline-dot .ds-icon {
+      width: var(--ds-timeline-icon-size);
+      height: var(--ds-timeline-icon-size);
+      font-size: var(--ds-timeline-icon-size);
+      color: ${t.surface.default};
+    }
+
+    .${o}.ant-timeline .ds-timeline-dot[data-ds-timeline-visual='outlined'] {
+      background: ${t.surface.default};
+      border: 1px solid color-mix(in srgb, var(--ds-timeline-dot-color) 72%, ${t.surface.default});
+    }
+
+    .${o}.ant-timeline .ds-timeline-dot[data-ds-timeline-visual='outlined'] .ds-icon {
+      color: var(--ds-timeline-dot-color);
+    }
+
+    .${o}.ant-timeline.ds-timeline--clinicalTimeline {
+      background: ${t.surface.clinical};
+      border-radius: 4px;
+      padding: 12px 14px;
+    }
+
+    .${o}.ant-timeline.ds-timeline--activityFeed .ant-timeline-item-tail {
+      border-inline-start-color: ${t.line.muted};
+    }
+
+    .${o}.ant-timeline .ant-timeline-item-last > .ant-timeline-item-tail {
+      display: none;
+    }
+  `}function f(e){return e.dsStatus??`neutral`}function p(e,t){return t??s[e].density}function m(n,r,a){let o=a!==`compact`,s=o?`filled`:l[n],u=n===`complete`||n===`warning`?Math.max(r-4,8):r,d=s===`outlined`?e.dsSemanticTokens.timeline.status[n]:e.dsSemanticTokens.timeline.surface.default;return(0,i.jsx)(`span`,{className:`ds-timeline-dot`,"data-ds-timeline-has-icon":o?`true`:`false`,"data-ds-timeline-status":n,"data-ds-timeline-visual":s,style:{"--ds-timeline-dot-color":e.dsSemanticTokens.timeline.status[n],"--ds-timeline-icon-size":`${u}px`},children:o?(0,i.jsx)(t.Icon,{dsName:c[n],dsSize:u,"aria-label":`${n} timeline item`,style:{color:d}}):null})}function h(e,t,n){return e?e.map(e=>{let r=f(e),{children:a,color:o,dot:s,dsContent:c,dsMeta:l,dsStatus:u,dsTitle:d,...p}=e,h=d??p.title,g=c??a,_=l,v=!!(h||g||_);return{...p,icon:p.icon??s??m(r,t,n),title:void 0,content:v?(0,i.jsxs)(`div`,{children:[h?(0,i.jsx)(`div`,{className:`ds-timeline-title`,children:h}):null,g?(0,i.jsx)(`div`,{className:`ds-timeline-content`,children:g}):null,_?(0,i.jsx)(`div`,{className:`ds-timeline-meta`,children:_}):null]}):g}}):[]}function g(t,n){let r=e.dsSemanticTokens.timeline.size[t];return{"--ds-timeline-dot-size":r.dot,"--ds-timeline-icon-size":`${r.icon}px`,"--ds-timeline-item-gap":r.itemGap,"--ds-timeline-item-padding-bottom":r.itemPaddingBottom,"--ds-timeline-tail-top":r.tailTop,"--ds-timeline-tail-left":r.tailLeft,"--ds-timeline-title-font-size":r.title.fontSize,"--ds-timeline-title-line-height":r.title.lineHeight,"--ds-timeline-title-font-weight":r.title.fontWeight,"--ds-timeline-content-font-size":r.content.fontSize,"--ds-timeline-content-line-height":r.content.lineHeight,"--ds-timeline-content-font-weight":r.content.fontWeight,...n}}var _=({className:t,dsDensity:a,dsItems:c,dsVariant:l=`auditTrail`,style:f,...m})=>{(0,r.useEffect)(()=>{d()},[]);let _=s[l],v=p(l,a),y=e.dsSemanticTokens.timeline.size[v].icon,b=h(c,y,v);return(0,i.jsx)(n.Timeline,{...m,className:u(o,`ds-timeline--${l}`,`ds-timeline--density-${v}`,t),items:b,mode:_.mode,orientation:_.orientation,style:g(v,f)})};_.Item=n.Timeline.Item,_.displayName=`Timeline`,exports.Timeline=_;
+//# sourceMappingURL=Timeline.cjs.map

package/dist-lib/display/Timeline.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"Timeline.cjs","names":[],"sources":["../../src/ds/display/Timeline.tsx"],"sourcesContent":["import { Timeline as AntTimeline } from 'antd';\nimport type { TimelineProps as AntTimelineProps } from 'antd';\nimport type { TimelineItemProps as AntTimelineItemProps } from 'antd';\nimport { useEffect } from 'react';\nimport type { CSSProperties, FC, ReactNode } from 'react';\nimport { Icon } from './Icon';\nimport type { DSIconName } from './Icon';\nimport { dsSemanticTokens } from '../../theme/ontadaTheme';\n\nexport type DSTimelineVariant = 'auditTrail' | 'workflowHistory' | 'activityFeed' | 'clinicalTimeline' | 'compact';\nexport type DSTimelineDensity = 'comfortable' | 'compact';\nexport type DSTimelineStatus = 'complete' | 'inProgress' | 'blocked' | 'warning' | 'neutral';\ntype DSTimelineDotVisual = 'filled' | 'outlined';\n\nexport type DSTimelineItem = Omit<AntTimelineItemProps, 'color' | 'dot' | 'children'> & {\n  /** Semantic item status to drive dot color and status icon treatment. */\n  dsStatus?: DSTimelineStatus;\n  /** Optional title row for stronger hierarchy in audit and workflow entries. */\n  dsTitle?: ReactNode;\n  /** Main timeline content body. Falls back to `children` when omitted. */\n  dsContent?: ReactNode;\n  /** Optional metadata line under content for timestamp or actor labels. */\n  dsMeta?: ReactNode;\n};\n\ntype RestrictedAntVisualProps = 'items' | 'orientation' | 'mode';\n\nexport type TimelineProps = Omit<AntTimelineProps, RestrictedAntVisualProps> & {\n  /** Semantic DS timeline variant. */\n  dsVariant?: DSTimelineVariant;\n  /** Optional density override. */\n  dsDensity?: DSTimelineDensity;\n  /** Timeline item list with DS semantic fields. */\n  dsItems?: DSTimelineItem[];\n};\n\ntype DSTimelineComponent = FC<TimelineProps> & {\n  Item: typeof AntTimeline.Item;\n};\n\nconst STYLE_ID = 'ds-timeline-styles';\nconst DS_TIMELINE_CLASS = 'ds-timeline';\n\nconst DEFAULTS_BY_VARIANT: Record<DSTimelineVariant, {\n  mode: NonNullable<AntTimelineProps['mode']>;\n  orientation: NonNullable<AntTimelineProps['orientation']>;\n  density: DSTimelineDensity;\n}> = {\n  auditTrail: { mode: 'start', orientation: 'vertical', density: 'comfortable' },\n  workflowHistory: { mode: 'alternate', orientation: 'vertical', density: 'comfortable' },\n  activityFeed: { mode: 'start', orientation: 'vertical', density: 'comfortable' },\n  clinicalTimeline: { mode: 'start', orientation: 'vertical', density: 'comfortable' },\n  compact: { mode: 'start', orientation: 'vertical', density: 'compact' },\n};\n\nconst ICON_NAME_BY_TIMELINE_STATUS: Record<DSTimelineStatus, DSIconName> = {\n  complete: 'check',\n  inProgress: 'sync',\n  blocked: 'close',\n  warning: 'alertTriangle',\n  neutral: 'minus',\n};\n\nconst DOT_VISUAL_BY_STATUS: Record<DSTimelineStatus, DSTimelineDotVisual> = {\n  complete: 'outlined',\n  inProgress: 'filled',\n  blocked: 'filled',\n  warning: 'outlined',\n  neutral: 'filled',\n};\n\nfunction mergeClassNames(...classNames: Array<string | undefined>) {\n  return classNames.filter(Boolean).join(' ').trim();\n}\n\nfunction injectStyles() {\n  if (typeof document === 'undefined') return;\n\n  const { timeline } = dsSemanticTokens;\n  let style = document.getElementById(STYLE_ID) as HTMLStyleElement | null;\n  if (!style) {\n    style = document.createElement('style');\n    style.id = STYLE_ID;\n    document.head.appendChild(style);\n  }\n\n  style.textContent = `\n    .${DS_TIMELINE_CLASS}.ant-timeline {\n      font-family: 'Nunito', sans-serif;\n      color: ${timeline.text.content};\n      background: ${timeline.surface.default};\n      transition: none !important;\n      animation-duration: 0s !important;\n    }\n\n    .${DS_TIMELINE_CLASS}.ant-timeline,\n    .${DS_TIMELINE_CLASS}.ant-timeline .ant-timeline-item,\n    .${DS_TIMELINE_CLASS}.ant-timeline .ant-timeline-item-tail,\n    .${DS_TIMELINE_CLASS}.ant-timeline .ant-timeline-item-head,\n    .${DS_TIMELINE_CLASS}.ant-timeline .ant-timeline-item-content {\n      transition: none !important;\n      animation-duration: 0s !important;\n    }\n\n    .${DS_TIMELINE_CLASS}.ant-timeline .ant-timeline-item {\n      padding-bottom: var(--ds-timeline-item-padding-bottom);\n    }\n\n    .${DS_TIMELINE_CLASS}.ant-timeline .ant-timeline-item-tail {\n      inset-inline-start: var(--ds-timeline-tail-left);\n      top: var(--ds-timeline-tail-top);\n      border-inline-start-width: ${timeline.line.width};\n      border-inline-start-color: ${timeline.line.default};\n    }\n\n    .${DS_TIMELINE_CLASS}.ant-timeline .ant-timeline-item-head {\n      width: var(--ds-timeline-dot-size);\n      height: var(--ds-timeline-dot-size);\n      border: 0 !important;\n      background: transparent !important;\n      inset-inline-start: 0;\n      margin-top: calc((var(--ds-timeline-title-line-height) - var(--ds-timeline-dot-size)) / 2);\n      box-shadow: none !important;\n    }\n\n    .${DS_TIMELINE_CLASS}.ant-timeline .ant-timeline-item-head-custom {\n      width: var(--ds-timeline-dot-size);\n      height: var(--ds-timeline-dot-size);\n      inset-inline-start: 0;\n      margin-top: calc((var(--ds-timeline-title-line-height) - var(--ds-timeline-dot-size)) / 2);\n      line-height: 0;\n      transform: none;\n      border: 0 !important;\n      background: transparent !important;\n      box-shadow: none !important;\n      padding: 0;\n    }\n\n    .${DS_TIMELINE_CLASS}.ant-timeline .ant-timeline-item-content {\n      margin-inline-start: calc(var(--ds-timeline-dot-size) + var(--ds-timeline-item-gap));\n      min-height: var(--ds-timeline-title-line-height);\n      color: ${timeline.text.content};\n      font-size: var(--ds-timeline-content-font-size);\n      font-weight: var(--ds-timeline-content-font-weight);\n      line-height: var(--ds-timeline-content-line-height);\n    }\n\n    .${DS_TIMELINE_CLASS}.ant-timeline .ds-timeline-title {\n      color: ${timeline.text.title};\n      font-size: var(--ds-timeline-title-font-size);\n      font-weight: var(--ds-timeline-title-font-weight);\n      line-height: var(--ds-timeline-title-line-height);\n      margin-bottom: 2px;\n      overflow-wrap: anywhere;\n    }\n\n    .${DS_TIMELINE_CLASS}.ant-timeline .ds-timeline-content {\n      color: ${timeline.text.content};\n      font-size: var(--ds-timeline-content-font-size);\n      font-weight: var(--ds-timeline-content-font-weight);\n      line-height: var(--ds-timeline-content-line-height);\n      overflow-wrap: anywhere;\n    }\n\n    .${DS_TIMELINE_CLASS}.ant-timeline .ds-timeline-meta {\n      margin-top: 2px;\n      color: ${timeline.text.meta};\n      font-size: 12px;\n      font-weight: 600;\n      line-height: 16px;\n      overflow-wrap: anywhere;\n    }\n\n    .${DS_TIMELINE_CLASS}.ant-timeline .ds-timeline-dot {\n      width: var(--ds-timeline-dot-size);\n      height: var(--ds-timeline-dot-size);\n      min-width: var(--ds-timeline-dot-size);\n      min-height: var(--ds-timeline-dot-size);\n      max-width: var(--ds-timeline-dot-size);\n      max-height: var(--ds-timeline-dot-size);\n      flex: 0 0 var(--ds-timeline-dot-size);\n      aspect-ratio: 1 / 1;\n      padding: 0;\n      border-radius: 999px;\n      background: var(--ds-timeline-dot-color);\n      border: 1px solid color-mix(in srgb, var(--ds-timeline-dot-color) 72%, ${timeline.surface.default});\n      display: inline-flex;\n      align-items: center;\n      justify-content: center;\n      box-sizing: border-box;\n      line-height: 0;\n    }\n\n    .${DS_TIMELINE_CLASS}.ant-timeline .ds-timeline-dot .ds-icon {\n      width: var(--ds-timeline-icon-size);\n      height: var(--ds-timeline-icon-size);\n      font-size: var(--ds-timeline-icon-size);\n      color: ${timeline.surface.default};\n    }\n\n    .${DS_TIMELINE_CLASS}.ant-timeline .ds-timeline-dot[data-ds-timeline-visual='outlined'] {\n      background: ${timeline.surface.default};\n      border: 1px solid color-mix(in srgb, var(--ds-timeline-dot-color) 72%, ${timeline.surface.default});\n    }\n\n    .${DS_TIMELINE_CLASS}.ant-timeline .ds-timeline-dot[data-ds-timeline-visual='outlined'] .ds-icon {\n      color: var(--ds-timeline-dot-color);\n    }\n\n    .${DS_TIMELINE_CLASS}.ant-timeline.ds-timeline--clinicalTimeline {\n      background: ${timeline.surface.clinical};\n      border-radius: 4px;\n      padding: 12px 14px;\n    }\n\n    .${DS_TIMELINE_CLASS}.ant-timeline.ds-timeline--activityFeed .ant-timeline-item-tail {\n      border-inline-start-color: ${timeline.line.muted};\n    }\n\n    .${DS_TIMELINE_CLASS}.ant-timeline .ant-timeline-item-last > .ant-timeline-item-tail {\n      display: none;\n    }\n  `;\n}\n\nfunction resolveStatus(item: DSTimelineItem): DSTimelineStatus {\n  return item.dsStatus ?? 'neutral';\n}\n\nfunction resolveDensity(dsVariant: DSTimelineVariant, dsDensity: DSTimelineDensity | undefined): DSTimelineDensity {\n  return dsDensity ?? DEFAULTS_BY_VARIANT[dsVariant].density;\n}\n\nfunction getDot(status: DSTimelineStatus, iconSize: number, density: DSTimelineDensity) {\n  const hasIcon = density !== 'compact';\n  const dotVisual = hasIcon ? 'filled' : DOT_VISUAL_BY_STATUS[status];\n  const resolvedIconSize = status === 'complete' || status === 'warning'\n    ? Math.max(iconSize - 4, 8)\n    : iconSize;\n  const iconColor = dotVisual === 'outlined'\n    ? dsSemanticTokens.timeline.status[status]\n    : dsSemanticTokens.timeline.surface.default;\n\n  return (\n    <span\n      className=\"ds-timeline-dot\"\n      data-ds-timeline-has-icon={hasIcon ? 'true' : 'false'}\n      data-ds-timeline-status={status}\n      data-ds-timeline-visual={dotVisual}\n      style={{\n        '--ds-timeline-dot-color': dsSemanticTokens.timeline.status[status],\n        '--ds-timeline-icon-size': `${resolvedIconSize}px`,\n      } as CSSProperties}\n    >\n      {hasIcon ? <Icon dsName={ICON_NAME_BY_TIMELINE_STATUS[status]} dsSize={resolvedIconSize} aria-label={`${status} timeline item`} style={{ color: iconColor }} /> : null}\n    </span>\n  );\n}\n\nfunction normalizeItems(items: DSTimelineItem[] | undefined, iconSize: number, density: DSTimelineDensity): AntTimelineItemProps[] {\n  if (!items) return [];\n\n  return items.map((item) => {\n    const status = resolveStatus(item);\n    const {\n      children,\n      color: _unusedColor,\n      dot,\n      dsContent,\n      dsMeta,\n      dsStatus: _unusedDsStatus,\n      dsTitle,\n      ...rest\n    } = item;\n\n    const title = dsTitle ?? rest.title;\n    const content = dsContent ?? children;\n    const meta = dsMeta;\n    const hasStructuredContent = Boolean(title || content || meta);\n\n    return {\n      ...rest,\n      icon: rest.icon ?? dot ?? getDot(status, iconSize, density),\n      title: undefined,\n      content: hasStructuredContent ? (\n        <div>\n          {title ? <div className=\"ds-timeline-title\">{title}</div> : null}\n          {content ? <div className=\"ds-timeline-content\">{content}</div> : null}\n          {meta ? <div className=\"ds-timeline-meta\">{meta}</div> : null}\n        </div>\n      ) : content,\n    };\n  });\n}\n\nfunction getStyle(density: DSTimelineDensity, userStyle: CSSProperties | undefined) {\n  const size = dsSemanticTokens.timeline.size[density];\n\n  return {\n    '--ds-timeline-dot-size': size.dot,\n    '--ds-timeline-icon-size': `${size.icon}px`,\n    '--ds-timeline-item-gap': size.itemGap,\n    '--ds-timeline-item-padding-bottom': size.itemPaddingBottom,\n    '--ds-timeline-tail-top': size.tailTop,\n    '--ds-timeline-tail-left': size.tailLeft,\n    '--ds-timeline-title-font-size': size.title.fontSize,\n    '--ds-timeline-title-line-height': size.title.lineHeight,\n    '--ds-timeline-title-font-weight': size.title.fontWeight,\n    '--ds-timeline-content-font-size': size.content.fontSize,\n    '--ds-timeline-content-line-height': size.content.lineHeight,\n    '--ds-timeline-content-font-weight': size.content.fontWeight,\n    ...userStyle,\n  } as CSSProperties;\n}\n\nexport const Timeline: DSTimelineComponent = ({\n  className,\n  dsDensity,\n  dsItems,\n  dsVariant = 'auditTrail',\n  style,\n  ...props\n}: TimelineProps) => {\n  useEffect(() => {\n    injectStyles();\n  }, []);\n\n  const defaults = DEFAULTS_BY_VARIANT[dsVariant];\n  const density = resolveDensity(dsVariant, dsDensity);\n  const iconSize = dsSemanticTokens.timeline.size[density].icon;\n  const items = normalizeItems(dsItems, iconSize, density);\n\n  return (\n    <AntTimeline\n      {...props}\n      className={mergeClassNames(DS_TIMELINE_CLASS, `ds-timeline--${dsVariant}`, `ds-timeline--density-${density}`, className)}\n      items={items}\n      mode={defaults.mode}\n      orientation={defaults.orientation}\n      style={getStyle(density, style)}\n    />\n  );\n};\n\nTimeline.Item = AntTimeline.Item;\nTimeline.displayName = 'Timeline';\n"],"mappings":"oOAwCA,IAAM,EAAW,qBACX,EAAoB,cAEpB,EAID,CACH,WAAY,CAAE,KAAM,QAAS,YAAa,WAAY,QAAS,cAAe,CAC9E,gBAAiB,CAAE,KAAM,YAAa,YAAa,WAAY,QAAS,cAAe,CACvF,aAAc,CAAE,KAAM,QAAS,YAAa,WAAY,QAAS,cAAe,CAChF,iBAAkB,CAAE,KAAM,QAAS,YAAa,WAAY,QAAS,cAAe,CACpF,QAAS,CAAE,KAAM,QAAS,YAAa,WAAY,QAAS,UAAW,CACxE,CAEK,EAAqE,CACzE,SAAU,QACV,WAAY,OACZ,QAAS,QACT,QAAS,gBACT,QAAS,QACV,CAEK,EAAsE,CAC1E,SAAU,WACV,WAAY,SACZ,QAAS,SACT,QAAS,WACT,QAAS,SACV,CAED,SAAS,EAAgB,GAAG,EAAuC,CACjE,OAAO,EAAW,OAAO,QAAQ,CAAC,KAAK,IAAI,CAAC,MAAM,CAGpD,SAAS,GAAe,CACtB,GAAI,OAAO,SAAa,IAAa,OAErC,GAAM,CAAE,YAAa,EAAA,iBACjB,EAAQ,SAAS,eAAe,EAAS,CACxC,IACH,EAAQ,SAAS,cAAc,QAAQ,CACvC,EAAM,GAAK,EACX,SAAS,KAAK,YAAY,EAAM,EAGlC,EAAM,YAAc;OACf,EAAkB;;eAEV,EAAS,KAAK,QAAQ;oBACjB,EAAS,QAAQ,QAAQ;;;;;OAKtC,EAAkB;OAClB,EAAkB;OAClB,EAAkB;OAClB,EAAkB;OAClB,EAAkB;;;;;OAKlB,EAAkB;;;;OAIlB,EAAkB;;;mCAGU,EAAS,KAAK,MAAM;mCACpB,EAAS,KAAK,QAAQ;;;OAGlD,EAAkB;;;;;;;;;;OAUlB,EAAkB;;;;;;;;;;;;;OAalB,EAAkB;;;eAGV,EAAS,KAAK,QAAQ;;;;;;OAM9B,EAAkB;eACV,EAAS,KAAK,MAAM;;;;;;;;OAQ5B,EAAkB;eACV,EAAS,KAAK,QAAQ;;;;;;;OAO9B,EAAkB;;eAEV,EAAS,KAAK,KAAK;;;;;;;OAO3B,EAAkB;;;;;;;;;;;;+EAYsD,EAAS,QAAQ,QAAQ;;;;;;;;OAQjG,EAAkB;;;;eAIV,EAAS,QAAQ,QAAQ;;;OAGjC,EAAkB;oBACL,EAAS,QAAQ,QAAQ;+EACkC,EAAS,QAAQ,QAAQ;;;OAGjG,EAAkB;;;;OAIlB,EAAkB;oBACL,EAAS,QAAQ,SAAS;;;;;OAKvC,EAAkB;mCACU,EAAS,KAAK,MAAM;;;OAGhD,EAAkB;;;IAMzB,SAAS,EAAc,EAAwC,CAC7D,OAAO,EAAK,UAAY,UAG1B,SAAS,EAAe,EAA8B,EAA6D,CACjH,OAAO,GAAa,EAAoB,GAAW,QAGrD,SAAS,EAAO,EAA0B,EAAkB,EAA4B,CACtF,IAAM,EAAU,IAAY,UACtB,EAAY,EAAU,SAAW,EAAqB,GACtD,EAAmB,IAAW,YAAc,IAAW,UACzD,KAAK,IAAI,EAAW,EAAG,EAAE,CACzB,EACE,EAAY,IAAc,WAC5B,EAAA,iBAAiB,SAAS,OAAO,GACjC,EAAA,iBAAiB,SAAS,QAAQ,QAEtC,OACE,EAAA,EAAA,KAAC,OAAD,CACE,UAAU,kBACV,4BAA2B,EAAU,OAAS,QAC9C,0BAAyB,EACzB,0BAAyB,EACzB,MAAO,CACL,0BAA2B,EAAA,iBAAiB,SAAS,OAAO,GAC5D,0BAA2B,GAAG,EAAiB,IAChD,UAEA,GAAU,EAAA,EAAA,KAAC,EAAA,KAAD,CAAM,OAAQ,EAA6B,GAAS,OAAQ,EAAkB,aAAY,GAAG,EAAO,gBAAiB,MAAO,CAAE,MAAO,EAAW,CAAI,CAAA,CAAG,KAC7J,CAAA,CAIX,SAAS,EAAe,EAAqC,EAAkB,EAAoD,CAGjI,OAFK,EAEE,EAAM,IAAK,GAAS,CACzB,IAAM,EAAS,EAAc,EAAK,CAC5B,CACJ,WACA,MAAO,EACP,MACA,YACA,SACA,SAAU,EACV,UACA,GAAG,GACD,EAEE,EAAQ,GAAW,EAAK,MACxB,EAAU,GAAa,EACvB,EAAO,EACP,EAAuB,GAAQ,GAAS,GAAW,GAEzD,MAAO,CACL,GAAG,EACH,KAAM,EAAK,MAAQ,GAAO,EAAO,EAAQ,EAAU,EAAQ,CAC3D,MAAO,IAAA,GACP,QAAS,GACP,EAAA,EAAA,MAAC,MAAD,CAAA,SAAA,CACG,GAAQ,EAAA,EAAA,KAAC,MAAD,CAAK,UAAU,6BAAqB,EAAY,CAAA,CAAG,KAC3D,GAAU,EAAA,EAAA,KAAC,MAAD,CAAK,UAAU,+BAAuB,EAAc,CAAA,CAAG,KACjE,GAAO,EAAA,EAAA,KAAC,MAAD,CAAK,UAAU,4BAAoB,EAAW,CAAA,CAAG,KACrD,CAAA,CAAA,CACJ,EACL,EACD,CAhCiB,EAAE,CAmCvB,SAAS,EAAS,EAA4B,EAAsC,CAClF,IAAM,EAAO,EAAA,iBAAiB,SAAS,KAAK,GAE5C,MAAO,CACL,yBAA0B,EAAK,IAC/B,0BAA2B,GAAG,EAAK,KAAK,IACxC,yBAA0B,EAAK,QAC/B,oCAAqC,EAAK,kBAC1C,yBAA0B,EAAK,QAC/B,0BAA2B,EAAK,SAChC,gCAAiC,EAAK,MAAM,SAC5C,kCAAmC,EAAK,MAAM,WAC9C,kCAAmC,EAAK,MAAM,WAC9C,kCAAmC,EAAK,QAAQ,SAChD,oCAAqC,EAAK,QAAQ,WAClD,oCAAqC,EAAK,QAAQ,WAClD,GAAG,EACJ,CAGH,IAAa,GAAiC,CAC5C,YACA,YACA,UACA,YAAY,aACZ,QACA,GAAG,KACgB,EACnB,EAAA,EAAA,eAAgB,CACd,GAAc,EACb,EAAE,CAAC,CAEN,IAAM,EAAW,EAAoB,GAC/B,EAAU,EAAe,EAAW,EAAU,CAC9C,EAAW,EAAA,iBAAiB,SAAS,KAAK,GAAS,KACnD,EAAQ,EAAe,EAAS,EAAU,EAAQ,CAExD,OACE,EAAA,EAAA,KAAC,EAAA,SAAD,CACE,GAAI,EACJ,UAAW,EAAgB,EAAmB,gBAAgB,IAAa,wBAAwB,IAAW,EAAU,CACjH,QACP,KAAM,EAAS,KACf,YAAa,EAAS,YACtB,MAAO,EAAS,EAAS,EAAM,CAC/B,CAAA,EAIN,EAAS,KAAO,EAAA,SAAY,KAC5B,EAAS,YAAc"}