@persona/design-system 0.10.13 → 0.10.15

package/dist/{Table-9mNn8Q-d.mjs → Table-BsDubdR2.mjs}

@@ -1,19 +1,19 @@
 import { a as styled, i as keyframes, r as css } from "./styledComponentsInterop-Cs5CCPRy.mjs";
+import { isFocusedVisible, isHovered } from "./lib/pseudoClass.mjs";
 import { semanticColor, semanticOnly, semanticTokens } from "./lib/semanticColor.mjs";
+import { focusOutline } from "./mixins/focus.mjs";
+import "./variables/transitions.mjs";
+import { withAlpha } from "./lib/color.mjs";
+import { fadeIn } from "./variables/keyframes.mjs";
+import { semanticScrollbar } from "./mixins/scrollbar.mjs";
 import { paragraphMixins } from "./mixins/text.mjs";
 import "./variables/spacing.mjs";
 import { i as Paragraph } from "./Text-D0vEReED.mjs";
-import { fadeIn } from "./variables/keyframes.mjs";
-import "./variables/transitions.mjs";
-import { r as HelperTooltip } from "./Tooltip-CVBxc1yf.mjs";
-import { withAlpha } from "./lib/color.mjs";
-import { isFocusedVisible, isHovered } from "./lib/pseudoClass.mjs";
+import { r as HelperTooltip } from "./Tooltip-C2VB8I6y.mjs";
 import { Z_INDICES } from "./lib/zindex.mjs";
-import { focusOutline } from "./mixins/focus.mjs";
-import { semanticScrollbar } from "./mixins/scrollbar.mjs";
-import { t as Spinner } from "./Spinner-k9ZiOdTr.mjs";
-import { forwardRef } from "react";
+import { t as Spinner } from "./Spinner-B8KWWUWy.mjs";
 import { Color, Spacing } from "@persona/design-tokens";
+import { forwardRef } from "react";
 import { jsx, jsxs } from "react/jsx-runtime";
 import { CaretDownIcon, CaretUpIcon } from "@persona/icons";
 //#region src/components/Table/Table.tsx
@@ -460,4 +460,4 @@ const TableLayout = ({ children, className, containerMaxHeight, containerScrolls
 //#endregion
 export { StickyTH as a, TableCellTitle as c, TableTR as d, TableTH as f, Table as h, StickyTD as i, TableIconTD as l, TableHeaderCell as m, TableBody as n, TableActionTD as o, TableRow as p, TableHead as r, TableCell as s, TableLayout as t, TableTD as u };
 
-//# sourceMappingURL=Table-9mNn8Q-d.mjs.map
+//# sourceMappingURL=Table-BsDubdR2.mjs.map

package/dist/{Table-9mNn8Q-d.mjs.map → Table-BsDubdR2.mjs.map}

@@ -1 +1 @@
-{"version":3,"file":"Table-9mNn8Q-d.mjs","names":["slideKeyframes"],"sources":["../src/components/Table/Table.tsx","../src/components/Table/TableHeaderCell.tsx","../src/components/Table/TableRow.tsx","../src/components/Table/TableTH.tsx","../src/components/Table/TableCell.tsx","../src/components/Table/TableHead.tsx","../src/components/Table/TableBody.tsx","../src/components/Table/TableLayout.tsx"],"sourcesContent":["import styled, { css, keyframes } from 'styled-components';\n\nimport { Spacing } from '@persona/design-tokens';\n\nimport { semanticColor } from '#src/lib/semanticColor';\nimport { paragraphMixins } from '#src/mixins/text';\n\ninterface TableProps {\n  size?: 'sm' | 'md';\n  isLoading?: boolean;\n}\n\nconst slideKeyframes = keyframes`\n  0% {\n    transform: translateX(-50%) scaleX(0);\n  }\n  50% {\n    transform: translateX(0) scaleX(1);\n  }\n  100% {\n    transform: translateX(50%) scaleX(0);\n  }\n`;\n\nexport const Table = styled.table.attrs({ role: 'table' })<TableProps>`\n  display: table;\n  width: 100%;\n  border-spacing: 0;\n  ${paragraphMixins.md};\n\n  ${({ size }) =>\n    size === 'sm' &&\n    css`\n      td,\n      th {\n        padding: ${Spacing[2]};\n      }\n    `}\n\n  ${({ isLoading }) =>\n    isLoading &&\n    css`\n      thead {\n        &:after {\n          content: '';\n          display: block;\n          position: absolute;\n          bottom: 0;\n          left: 0;\n          width: 100%;\n          border-bottom: 3px solid ${({ theme }) => semanticColor(theme, 'FeedbackAccent3', theme.color.primary.brand)};\n          animation: ${slideKeyframes} 3s infinite cubic-bezier(0.5, 0, 0.5, 1);\n\n          @media (prefers-reduced-motion: reduce) {\n            animation: none;\n          }\n        }\n      }\n    `}\n`;\n\nexport default Table;\n","import { type ComponentPropsWithoutRef, forwardRef, type ReactNode } from 'react';\nimport styled, { css } from 'styled-components';\n\nimport { Spacing } from '@persona/design-tokens';\nimport { CaretDownIcon, CaretUpIcon } from '@persona/icons';\n\nimport { semanticColor, semanticOnly } from '#src/lib/semanticColor';\nimport { focusOutline } from '#src/mixins/focus';\nimport { paragraphMixins } from '#src/mixins/text';\nimport { BASE } from '#src/variables/spacing';\n\ninterface TableHeaderCellProps {\n  size?: 'sm' | 'md';\n  sortable?: boolean;\n  width?: 'auto' | 'min' | 'max' | string;\n  isSticky?: boolean;\n  align?: 'left' | 'right';\n  trailing?: ReactNode;\n}\n\nconst StyledTableHeaderCell = styled.th<TableHeaderCellProps>`\n  display: table-cell;\n  /* Self-contained box model: don't depend on a consumer's global\n     border-box reset, so header padding + border are included in the\n     declared width/height. */\n  box-sizing: border-box;\n\n  background-color: ${({ theme }) => semanticColor(theme, 'SurfaceSecondary', theme.color.background.secondary)};\n  ${semanticOnly((tokens) => `color: ${tokens.FgPrimary};`)}\n  padding: ${({ size }) => (size === 'sm' ? BASE : BASE * 1.5)}px;\n  text-align: left;\n  white-space: nowrap;\n  ${({ size }) => (size === 'sm' ? paragraphMixins.sm : paragraphMixins.md)};\n  line-height: 1;\n  width: ${({ width }) => {\n    switch (width) {\n      case 'min':\n        return '1px';\n      case 'max':\n        return '100%';\n      default:\n        if (width) {\n          return width;\n        } else {\n          return 'auto';\n        }\n    }\n  }};\n\n  &:first-child {\n    border-radius: ${({ theme }) =>\n      `${theme.element.borderRadius} 0 0 ${theme.element.borderRadius}`};\n  }\n\n  &:last-child {\n    border-radius: ${({ theme }) =>\n      `0 ${theme.element.borderRadius} ${theme.element.borderRadius} 0`};\n  }\n\n  ${({ sortable }) =>\n    sortable &&\n    css`\n      cursor: pointer;\n\n      &:hover ${TableIconContainer} {\n        display: inline;\n        visibility: visible;\n      }\n\n      ${SortButton}:focus-visible ${TableIconContainer} {\n        display: inline;\n        visibility: visible;\n      }\n    `};\n\n  ${({ isSticky }) =>\n    isSticky\n      ? css`\n          position: sticky;\n          top: 0;\n          z-index: 1;\n        `\n      : css`\n          position: relative;\n        `}\n`;\n\nconst VerticalAlign = styled.div<{ $align?: TableHeaderCellProps['align'] }>`\n  display: flex;\n  align-items: center;\n  gap: ${Spacing[1]};\n  flex-direction: ${({ $align }) => ($align === 'right' ? 'row-reverse' : 'row')};\n`;\n\nconst SortButton = styled.button`\n  background: none;\n  border: 0;\n  padding: 0;\n  margin: 0;\n  font: inherit;\n  color: inherit;\n  text-align: inherit;\n  cursor: pointer;\n  display: inline-flex;\n  align-items: center;\n  gap: ${Spacing[1]};\n  min-width: 0;\n  ${focusOutline}\n`;\n\ninterface TableIconContainerProps {\n  sortDirection?: 'asc' | 'desc' | false;\n}\n\nconst TableIconContainer = styled('div')<TableIconContainerProps>`\n  display: inline-block;\n\n  ${({ sortDirection }) => {\n    if (sortDirection) {\n      return css`\n        display: inline;\n      `;\n    } else {\n      return css`\n        display: inline;\n        visibility: hidden;\n        color: ${({ theme }) => semanticColor(theme, 'FgTertiary', theme.color.text.disabled)};\n      `;\n    }\n  }};\n`;\n\nconst TableHeaderCell = forwardRef<\n  HTMLTableCellElement,\n  ComponentPropsWithoutRef<'th'> & TableHeaderCellProps & TableIconContainerProps\n>(function TableHeaderCell(\n  { sortable, sortDirection, children, align, trailing, onClick, ...elemProps },\n  ref,\n) {\n  let ariaSort: 'none' | 'ascending' | 'descending' | undefined;\n\n  if (sortable && sortDirection) {\n    ariaSort = sortDirection === 'asc' ? 'ascending' : 'descending';\n  } else if (sortable) {\n    ariaSort = 'none';\n  }\n\n  return (\n    <StyledTableHeaderCell\n      sortable={sortable}\n      aria-sort={ariaSort}\n      onClick={sortable ? undefined : onClick}\n      {...elemProps}\n      ref={ref}\n    >\n      <VerticalAlign $align={align}>\n        {sortable ? (\n          <SortButton type='button' onClick={onClick}>\n            {children}\n            <TableIconContainer aria-hidden='true' sortDirection={sortDirection}>\n              {sortDirection === 'asc' ? <CaretUpIcon /> : <CaretDownIcon />}\n            </TableIconContainer>\n          </SortButton>\n        ) : (\n          children\n        )}\n        {trailing}\n      </VerticalAlign>\n    </StyledTableHeaderCell>\n  );\n});\n\nexport default TableHeaderCell;\n","import styled, { css } from 'styled-components';\n\nimport { withAlpha } from '#src/lib/color';\nimport { isFocusedVisible, isHovered } from '#src/lib/pseudoClass';\nimport { semanticTokens } from '#src/lib/semanticColor';\nimport type PseudoClassProps from '#src/types/PseudoClassProps';\nimport { TransitionDuration, TransitionEasing } from '#src/variables/transitions';\n\nexport interface TableRowProps extends PseudoClassProps {\n  disableHoverBackground?: boolean;\n}\n\nconst TableRow = styled.tr.attrs({\n  role: 'row',\n})<TableRowProps>`\n  display: table-row;\n\n  ${({ onClick }) =>\n    onClick != null &&\n    css`\n      cursor: pointer;\n    `}\n\n  ${({ disableHoverBackground, theme }) => {\n    if (disableHoverBackground) {\n      return null;\n    }\n    const tokens = semanticTokens(theme);\n    return css`\n      &${isHovered} {\n        background-color: ${\n          tokens\n            ? withAlpha(tokens.ActionAccent, tokens.Opacity25)\n            : theme.color.background.highlight\n        };\n        ${tokens ? `color: ${tokens.FgPrimary};` : ''}\n        transition-duration: ${TransitionDuration.Fast};\n        transition-timing-function: ${TransitionEasing.Move};\n      }\n    `;\n  }}\n\n  ${isFocusedVisible}\n`;\n\nexport default TableRow;\n","import { type ComponentPropsWithoutRef, forwardRef, type ReactNode } from 'react';\nimport styled from 'styled-components';\n\nimport { TableHeaderCell } from '@persona/design-system/components/Table';\nimport { HelperTooltip } from '@persona/design-system/components/Tooltip';\nimport { Spacing } from '@persona/design-tokens';\n\nconst StyledHelperTooltip = styled(HelperTooltip)`\n  height: 14px;\n  margin-left: ${Spacing[1]};\n`;\n\nexport interface TableTHProps extends ComponentPropsWithoutRef<typeof TableHeaderCell> {\n  canSort?: boolean;\n  isSorted?: boolean;\n  isDescending?: boolean;\n  isSticky?: boolean;\n  /**\n   * Display help icon and tooltip for column header\n   */\n  helpText?: ReactNode;\n  align?: 'left' | 'right';\n  size?: 'sm' | 'md';\n}\n\nconst TableTH = forwardRef<HTMLTableCellElement, TableTHProps>(function TableTH(\n  { children, canSort, isSorted, isSticky, isDescending, helpText, align, size, ...props },\n  ref,\n) {\n  return (\n    <TableHeaderCell\n      sortable={canSort}\n      sortDirection={canSort && isSorted ? (isDescending ? 'desc' : 'asc') : false}\n      ref={ref}\n      isSticky={isSticky}\n      align={align}\n      size={size}\n      trailing={helpText && <StyledHelperTooltip size='sm'>{helpText}</StyledHelperTooltip>}\n      {...props}\n    >\n      {/* We have to wrap the children to make it easier to use tooltips */}\n      <span className='th__text'>{children}</span>\n    </TableHeaderCell>\n  );\n});\n\nexport default TableTH;\n","import type { ComponentPropsWithoutRef, ReactNode } from 'react';\nimport styled, { css } from 'styled-components';\n\nimport { Color, Spacing } from '@persona/design-tokens';\n\nimport { Paragraph } from '#src/components/Text';\nimport { withAlpha } from '#src/lib/color';\nimport { isHovered } from '#src/lib/pseudoClass';\nimport {\n  type MaybeSemanticTheme,\n  semanticColor,\n  semanticOnly,\n  semanticTokens,\n} from '#src/lib/semanticColor';\nimport { paragraphMixins } from '#src/mixins/text';\nimport type { PersonaTheme } from '#src/theme';\nimport { BASE } from '#src/variables/spacing';\nimport { TransitionDuration, TransitionEasing } from '#src/variables/transitions';\n\nimport TableRow from './TableRow';\nimport TableTH from './TableTH';\n\nexport interface TableCellProps {\n  breakWord?: boolean;\n  size?: 'sm' | 'md';\n}\n\nconst TableCell = styled.td.attrs({ role: 'cell' })<TableCellProps>`\n  display: table-cell;\n  vertical-align: middle;\n  /* Self-contained box model: don't depend on a consumer's global\n     border-box reset, so a fixed cell height includes its padding + border\n     and rows stay compact. */\n  box-sizing: border-box;\n\n  border-bottom: 1px solid ${({ theme }) => semanticColor(theme, 'BorderDivider', theme.color.border.primary)};\n  text-align: left;\n  padding: ${({ size }) => (size === 'sm' ? BASE : BASE * 1.5)}px;\n  color: ${({ theme }) => semanticColor(theme, 'FgPrimary', theme.color.text.primary)};\n  white-space: nowrap;\n  ${paragraphMixins.md};\n  line-height: 1;\n  ${({ breakWord }) =>\n    breakWord\n      ? `white-space: normal;\n         overflow-wrap: break-word;`\n      : ''}\n`;\n\nexport default TableCell;\n\nconst CellTitleContainer = styled.div`\n  display: flex;\n  flex-direction: column;\n`;\n\nconst CellTitle = styled(Paragraph).attrs({ color: 'primary' })`\n  ${semanticOnly(() => 'color: inherit;')}\n  display: flex;\n  align-items: center;\n  gap: ${Spacing[2]};\n`;\n\nconst CellSubtitle = styled(Paragraph)`\n  ${semanticOnly((tokens) => `color: ${tokens.FgSecondary};`)}\n`;\n\nconst activeHighlight = (theme: PersonaTheme & MaybeSemanticTheme) =>\n  semanticColor(theme, 'ActionAccent', theme.color.background.highlight);\n\nconst hoverHighlight = (theme: PersonaTheme & MaybeSemanticTheme) => {\n  const tokens = semanticTokens(theme);\n  return tokens\n    ? withAlpha(tokens.ActionAccent, tokens.Opacity25)\n    : theme.color.background.highlight;\n};\n\n// Same page color unpinned cells show through, painted opaquely so scrolled text stays covered.\nconst pinnedBodyBackground = (theme: PersonaTheme & MaybeSemanticTheme) =>\n  semanticColor(\n    theme,\n    theme.color.text.primary === Color.TextInverse ? 'SurfacePage' : 'SurfacePrimary',\n    theme.color.background.primary,\n  );\n\ninterface TableCellTitleProps extends ComponentPropsWithoutRef<'div'> {\n  subtitle?: ReactNode;\n}\n\nexport const TableCellTitle = ({ children, subtitle, ...elemProps }: TableCellTitleProps) => {\n  return (\n    <CellTitleContainer {...elemProps}>\n      <CellTitle>{children}</CellTitle>\n      {subtitle && <CellSubtitle>{subtitle}</CellSubtitle>}\n    </CellTitleContainer>\n  );\n};\n\nexport const TableTD = styled(TableCell)<{ unclickable?: boolean }>`\n  white-space: normal;\n  overflow-wrap: break-word;\n  ${(props) =>\n    props.unclickable &&\n    css`\n      cursor: default;\n    `}\n`;\n\nexport const TableIconTD = styled(TableTD)`\n  text-align: right;\n  line-height: 0; /* To center icon; cannot use flex here */\n  padding: 0;\n  padding-left: ${Spacing[4]};\n  width: 36px;\n`;\n\nexport const TableActionTD = styled(TableTD)`\n  text-align: right;\n  padding: 0;\n  padding-right: ${Spacing[4]};\n  width: 48px;\n`;\n\nexport const StickyTD = styled(TableTD)<{\n  left?: number;\n  hasRightBorder?: boolean;\n}>`\n  position: sticky;\n  left: ${({ left = 0 }) => `${left}px`}; // Default to 0 if not specified\n  background-color: ${({ theme }) => pinnedBodyBackground(theme)};\n\n  ${({ hasRightBorder, theme }) =>\n    hasRightBorder &&\n    `border-right: 2px solid ${semanticColor(theme, 'BorderDivider', theme.color.border.primary)};`}\n  z-index: 2;\n`;\n\nexport const StickyTH = styled(TableTH)<{\n  left?: number;\n  hasRightBorder?: boolean;\n  size?: 'sm' | 'md';\n}>`\n  position: sticky;\n  left: ${({ left = 0 }) => `${left}px`}; // Default to 0 if not specified\n  z-index: 2;\n  max-width: 10%;\n  background-color: ${({ theme }) => semanticColor(theme, 'SurfaceSecondary', theme.color.background.secondary)};\n  ${({ hasRightBorder, theme }) =>\n    hasRightBorder &&\n    `border-right: 2px solid ${semanticColor(theme, 'BorderDivider', theme.color.border.primary)};`}\n`;\n\nexport const TableTR = styled(TableRow)<{ disableHoverBackground?: boolean; $isActive?: boolean }>`\n  ${({ disableHoverBackground }) =>\n    disableHoverBackground &&\n    css`\n      &:hover {\n        background-color: transparent !important;\n      }\n    `}\n\n  ${({ $isActive }) =>\n    $isActive &&\n    css`\n      background-color: ${({ theme }) => activeHighlight(theme)};\n      ${semanticOnly((tokens) => `color: ${tokens.FgPrimary};`)}\n      ${StickyTD} {\n        background-color: ${({ theme }) => activeHighlight(theme)};\n      }\n      &:hover {\n        background-color: ${({ theme }) => activeHighlight(theme)};\n      }\n      &:hover ${StickyTD} {\n        background-color: ${({ theme }) => activeHighlight(theme)};\n        background-image: none;\n      }\n    `}\n\n  ${({ disableHoverBackground, $isActive }) =>\n    !disableHoverBackground &&\n    !$isActive &&\n    css`\n      &${isHovered} ${StickyTD} {\n        background-image: linear-gradient(\n          ${({ theme }) => hoverHighlight(theme)},\n          ${({ theme }) => hoverHighlight(theme)}\n        );\n      }\n    `}\n\n  ${({ onClick, disableHoverBackground, $isActive }) =>\n    onClick != null &&\n    !disableHoverBackground &&\n    !$isActive &&\n    css`\n      cursor: pointer;\n      :hover {\n        background-color: ${({ theme }) => hoverHighlight(theme)};\n        ${semanticOnly((tokens) => `color: ${tokens.FgPrimary};`)}\n      }\n      transition-duration: ${TransitionDuration.Fast};\n      transition-timing-function: ${TransitionEasing.Move};\n    `}\n`;\n","import styled, { css } from 'styled-components';\n\ninterface TableHeadProps {\n  sticky?: boolean;\n}\n\nconst TableHead = styled.thead.attrs({ role: 'rowgroup' })<TableHeadProps>`\n  display: table-header-group;\n  ${({ sticky }) =>\n    sticky &&\n    css`\n      position: sticky;\n      top: 0;\n      z-index: 1;\n    `}\n`;\n\nexport default TableHead;\n","import styled from 'styled-components';\n\nconst TableBody = styled.tbody.attrs({ role: 'rowgroup' })`\n  display: table-row-group;\n`;\n\nexport default TableBody;\n","import type { FC, PropsWithChildren, ReactNode } from 'react';\nimport styled, { keyframes } from 'styled-components';\n\nimport { Color, Spacing } from '@persona/design-tokens';\n\nimport { Spinner } from '#src/components/Spinner';\nimport Table, { TableBody, TableHead, TableRow } from '#src/components/Table';\nimport { semanticColor } from '#src/lib/semanticColor';\nimport { Z_INDICES } from '#src/lib/zindex';\nimport { semanticScrollbar } from '#src/mixins/scrollbar';\nimport { fadeIn } from '#src/variables/keyframes';\nimport { TransitionDuration, TransitionEasing } from '#src/variables/transitions';\n\n// `visible` rather than a narrower opt-out because CSS blockifies the other axis: any\n// `overflow-x` other than `visible`/`clip` forces `overflow-y` to compute to `auto` too, which\n// makes this element the scrollport that descendant sticky offsets resolve against.\nconst Container = styled.div<{ maxHeight?: number; $scrollsHorizontally: boolean }>`\n    position: relative;\n    z-index: 0;\n    overflow-x: ${({ $scrollsHorizontally }) => ($scrollsHorizontally ? 'auto' : 'visible')};\n    ${semanticScrollbar}\n    ${({ maxHeight }) => {\n      if (maxHeight != null) {\n        return `max-height: ${maxHeight}px;`;\n      }\n    }}\n  `;\n\nconst slideKeyframes = keyframes`\n    0% {\n      transform: translateX(-50%) scaleX(0);\n    }\n    50% {\n      transform: translateX(0) scaleX(1);\n    }\n    100% {\n      transform: translateX(50%) scaleX(0);\n    }\n  `;\n\nconst Loader = styled.div`\n    position: absolute;\n    z-index: ${Z_INDICES.loadingOverlays};\n    border-bottom: 3px solid ${({ theme }) => semanticColor(theme, 'BorderAccent', theme.color.primary.brand)};\n    width: 100%;\n  \n    animation: ${slideKeyframes} 3s infinite cubic-bezier(0.5, 0, 0.5, 1);\n\n    @media (prefers-reduced-motion: reduce) {\n      animation: none;\n    }\n  `;\n\nconst Overlay = styled.div`\n    position: absolute;\n    z-index: ${Z_INDICES.loadingOverlays};\n    top: 0;\n    left: 0;\n    width: 100%;\n    height: 100%;\n    background: ${({ theme }) => semanticColor(theme, 'SurfacePrimary', theme.color.primary.white)};\n    opacity: 50%;\n  `;\n\nconst SpinnerWrapper = styled.div`\n    width: 100%;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    padding: ${Spacing[5]} 0;\n    animation: ${fadeIn} ${TransitionDuration.Fast} ${TransitionEasing.Enter} 500ms backwards;\n  `;\n\nconst TableSpinner = styled(Spinner)`\n    svg {\n      width: 120px;\n      height: 120px;\n    }\n  \n    path {\n      stroke: ${({ theme }) => semanticColor(theme, 'FeedbackAccent3', Color.CorePurple500)};\n      stroke-width: 0.46;\n    }\n  `;\n\ninterface TableLayoutProps {\n  className?: string;\n  containerMaxHeight?: number;\n  /**\n   * When false, the container does not scroll horizontally and an ancestor is expected to.\n   * Sticky offsets inside the table then resolve against that ancestor's scrollport rather\n   * than against the container.\n   */\n  containerScrollsHorizontally?: boolean;\n  dataTest?: string;\n  headerTR: JSX.Element;\n  isEmpty?: boolean;\n  isLoading?: boolean;\n  nullState: ReactNode;\n  showHeader?: boolean;\n  size?: 'sm' | 'md';\n  stickyHeader?: boolean;\n}\n\nconst TableLayout: FC<PropsWithChildren<TableLayoutProps>> = ({\n  children,\n  className,\n  containerMaxHeight,\n  containerScrollsHorizontally = true,\n  dataTest,\n  headerTR,\n  isEmpty,\n  isLoading,\n  nullState,\n  showHeader,\n  size = 'md',\n  stickyHeader = false,\n}) => {\n  if (isEmpty && !showHeader) {\n    if (isLoading) {\n      return (\n        <SpinnerWrapper\n          role='status'\n          aria-live='polite'\n          aria-busy='true'\n          aria-label='Loading...'\n          data-loading-indicator='true'\n        >\n          <TableSpinner size='md' />\n        </SpinnerWrapper>\n      );\n    } else {\n      return (\n        <Container data-test={dataTest} $scrollsHorizontally={containerScrollsHorizontally}>\n          {nullState}\n        </Container>\n      );\n    }\n  }\n\n  return (\n    <Container\n      data-test={dataTest}\n      maxHeight={containerMaxHeight}\n      className={className}\n      $scrollsHorizontally={containerScrollsHorizontally}\n    >\n      {isLoading && <Loader data-test='table-layout__loader' />}\n      {isLoading && <Overlay />}\n\n      <Table size={size} aria-busy={isLoading || undefined}>\n        <TableHead sticky={stickyHeader}>\n          <TableRow>{headerTR}</TableRow>\n        </TableHead>\n        {!isEmpty && <TableBody>{children}</TableBody>}\n      </Table>\n\n      {isEmpty && nullState}\n    </Container>\n  );\n};\n\nexport default TableLayout;\n"],"mappings":"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"}
+{"version":3,"file":"Table-BsDubdR2.mjs","names":["slideKeyframes"],"sources":["../src/components/Table/Table.tsx","../src/components/Table/TableHeaderCell.tsx","../src/components/Table/TableRow.tsx","../src/components/Table/TableTH.tsx","../src/components/Table/TableCell.tsx","../src/components/Table/TableHead.tsx","../src/components/Table/TableBody.tsx","../src/components/Table/TableLayout.tsx"],"sourcesContent":["import styled, { css, keyframes } from 'styled-components';\n\nimport { Spacing } from '@persona/design-tokens';\n\nimport { semanticColor } from '#src/lib/semanticColor';\nimport { paragraphMixins } from '#src/mixins/text';\n\ninterface TableProps {\n  size?: 'sm' | 'md';\n  isLoading?: boolean;\n}\n\nconst slideKeyframes = keyframes`\n  0% {\n    transform: translateX(-50%) scaleX(0);\n  }\n  50% {\n    transform: translateX(0) scaleX(1);\n  }\n  100% {\n    transform: translateX(50%) scaleX(0);\n  }\n`;\n\nexport const Table = styled.table.attrs({ role: 'table' })<TableProps>`\n  display: table;\n  width: 100%;\n  border-spacing: 0;\n  ${paragraphMixins.md};\n\n  ${({ size }) =>\n    size === 'sm' &&\n    css`\n      td,\n      th {\n        padding: ${Spacing[2]};\n      }\n    `}\n\n  ${({ isLoading }) =>\n    isLoading &&\n    css`\n      thead {\n        &:after {\n          content: '';\n          display: block;\n          position: absolute;\n          bottom: 0;\n          left: 0;\n          width: 100%;\n          border-bottom: 3px solid ${({ theme }) => semanticColor(theme, 'FeedbackAccent3', theme.color.primary.brand)};\n          animation: ${slideKeyframes} 3s infinite cubic-bezier(0.5, 0, 0.5, 1);\n\n          @media (prefers-reduced-motion: reduce) {\n            animation: none;\n          }\n        }\n      }\n    `}\n`;\n\nexport default Table;\n","import { type ComponentPropsWithoutRef, forwardRef, type ReactNode } from 'react';\nimport styled, { css } from 'styled-components';\n\nimport { Spacing } from '@persona/design-tokens';\nimport { CaretDownIcon, CaretUpIcon } from '@persona/icons';\n\nimport { semanticColor, semanticOnly } from '#src/lib/semanticColor';\nimport { focusOutline } from '#src/mixins/focus';\nimport { paragraphMixins } from '#src/mixins/text';\nimport { BASE } from '#src/variables/spacing';\n\ninterface TableHeaderCellProps {\n  size?: 'sm' | 'md';\n  sortable?: boolean;\n  width?: 'auto' | 'min' | 'max' | string;\n  isSticky?: boolean;\n  align?: 'left' | 'right';\n  trailing?: ReactNode;\n}\n\nconst StyledTableHeaderCell = styled.th<TableHeaderCellProps>`\n  display: table-cell;\n  /* Self-contained box model: don't depend on a consumer's global\n     border-box reset, so header padding + border are included in the\n     declared width/height. */\n  box-sizing: border-box;\n\n  background-color: ${({ theme }) => semanticColor(theme, 'SurfaceSecondary', theme.color.background.secondary)};\n  ${semanticOnly((tokens) => `color: ${tokens.FgPrimary};`)}\n  padding: ${({ size }) => (size === 'sm' ? BASE : BASE * 1.5)}px;\n  text-align: left;\n  white-space: nowrap;\n  ${({ size }) => (size === 'sm' ? paragraphMixins.sm : paragraphMixins.md)};\n  line-height: 1;\n  width: ${({ width }) => {\n    switch (width) {\n      case 'min':\n        return '1px';\n      case 'max':\n        return '100%';\n      default:\n        if (width) {\n          return width;\n        } else {\n          return 'auto';\n        }\n    }\n  }};\n\n  &:first-child {\n    border-radius: ${({ theme }) =>\n      `${theme.element.borderRadius} 0 0 ${theme.element.borderRadius}`};\n  }\n\n  &:last-child {\n    border-radius: ${({ theme }) =>\n      `0 ${theme.element.borderRadius} ${theme.element.borderRadius} 0`};\n  }\n\n  ${({ sortable }) =>\n    sortable &&\n    css`\n      cursor: pointer;\n\n      &:hover ${TableIconContainer} {\n        display: inline;\n        visibility: visible;\n      }\n\n      ${SortButton}:focus-visible ${TableIconContainer} {\n        display: inline;\n        visibility: visible;\n      }\n    `};\n\n  ${({ isSticky }) =>\n    isSticky\n      ? css`\n          position: sticky;\n          top: 0;\n          z-index: 1;\n        `\n      : css`\n          position: relative;\n        `}\n`;\n\nconst VerticalAlign = styled.div<{ $align?: TableHeaderCellProps['align'] }>`\n  display: flex;\n  align-items: center;\n  gap: ${Spacing[1]};\n  flex-direction: ${({ $align }) => ($align === 'right' ? 'row-reverse' : 'row')};\n`;\n\nconst SortButton = styled.button`\n  background: none;\n  border: 0;\n  padding: 0;\n  margin: 0;\n  font: inherit;\n  color: inherit;\n  text-align: inherit;\n  cursor: pointer;\n  display: inline-flex;\n  align-items: center;\n  gap: ${Spacing[1]};\n  min-width: 0;\n  ${focusOutline}\n`;\n\ninterface TableIconContainerProps {\n  sortDirection?: 'asc' | 'desc' | false;\n}\n\nconst TableIconContainer = styled('div')<TableIconContainerProps>`\n  display: inline-block;\n\n  ${({ sortDirection }) => {\n    if (sortDirection) {\n      return css`\n        display: inline;\n      `;\n    } else {\n      return css`\n        display: inline;\n        visibility: hidden;\n        color: ${({ theme }) => semanticColor(theme, 'FgTertiary', theme.color.text.disabled)};\n      `;\n    }\n  }};\n`;\n\nconst TableHeaderCell = forwardRef<\n  HTMLTableCellElement,\n  ComponentPropsWithoutRef<'th'> & TableHeaderCellProps & TableIconContainerProps\n>(function TableHeaderCell(\n  { sortable, sortDirection, children, align, trailing, onClick, ...elemProps },\n  ref,\n) {\n  let ariaSort: 'none' | 'ascending' | 'descending' | undefined;\n\n  if (sortable && sortDirection) {\n    ariaSort = sortDirection === 'asc' ? 'ascending' : 'descending';\n  } else if (sortable) {\n    ariaSort = 'none';\n  }\n\n  return (\n    <StyledTableHeaderCell\n      sortable={sortable}\n      aria-sort={ariaSort}\n      onClick={sortable ? undefined : onClick}\n      {...elemProps}\n      ref={ref}\n    >\n      <VerticalAlign $align={align}>\n        {sortable ? (\n          <SortButton type='button' onClick={onClick}>\n            {children}\n            <TableIconContainer aria-hidden='true' sortDirection={sortDirection}>\n              {sortDirection === 'asc' ? <CaretUpIcon /> : <CaretDownIcon />}\n            </TableIconContainer>\n          </SortButton>\n        ) : (\n          children\n        )}\n        {trailing}\n      </VerticalAlign>\n    </StyledTableHeaderCell>\n  );\n});\n\nexport default TableHeaderCell;\n","import styled, { css } from 'styled-components';\n\nimport { withAlpha } from '#src/lib/color';\nimport { isFocusedVisible, isHovered } from '#src/lib/pseudoClass';\nimport { semanticTokens } from '#src/lib/semanticColor';\nimport type PseudoClassProps from '#src/types/PseudoClassProps';\nimport { TransitionDuration, TransitionEasing } from '#src/variables/transitions';\n\nexport interface TableRowProps extends PseudoClassProps {\n  disableHoverBackground?: boolean;\n}\n\nconst TableRow = styled.tr.attrs({\n  role: 'row',\n})<TableRowProps>`\n  display: table-row;\n\n  ${({ onClick }) =>\n    onClick != null &&\n    css`\n      cursor: pointer;\n    `}\n\n  ${({ disableHoverBackground, theme }) => {\n    if (disableHoverBackground) {\n      return null;\n    }\n    const tokens = semanticTokens(theme);\n    return css`\n      &${isHovered} {\n        background-color: ${\n          tokens\n            ? withAlpha(tokens.ActionAccent, tokens.Opacity25)\n            : theme.color.background.highlight\n        };\n        ${tokens ? `color: ${tokens.FgPrimary};` : ''}\n        transition-duration: ${TransitionDuration.Fast};\n        transition-timing-function: ${TransitionEasing.Move};\n      }\n    `;\n  }}\n\n  ${isFocusedVisible}\n`;\n\nexport default TableRow;\n","import { type ComponentPropsWithoutRef, forwardRef, type ReactNode } from 'react';\nimport styled from 'styled-components';\n\nimport { TableHeaderCell } from '@persona/design-system/components/Table';\nimport { HelperTooltip } from '@persona/design-system/components/Tooltip';\nimport { Spacing } from '@persona/design-tokens';\n\nconst StyledHelperTooltip = styled(HelperTooltip)`\n  height: 14px;\n  margin-left: ${Spacing[1]};\n`;\n\nexport interface TableTHProps extends ComponentPropsWithoutRef<typeof TableHeaderCell> {\n  canSort?: boolean;\n  isSorted?: boolean;\n  isDescending?: boolean;\n  isSticky?: boolean;\n  /**\n   * Display help icon and tooltip for column header\n   */\n  helpText?: ReactNode;\n  align?: 'left' | 'right';\n  size?: 'sm' | 'md';\n}\n\nconst TableTH = forwardRef<HTMLTableCellElement, TableTHProps>(function TableTH(\n  { children, canSort, isSorted, isSticky, isDescending, helpText, align, size, ...props },\n  ref,\n) {\n  return (\n    <TableHeaderCell\n      sortable={canSort}\n      sortDirection={canSort && isSorted ? (isDescending ? 'desc' : 'asc') : false}\n      ref={ref}\n      isSticky={isSticky}\n      align={align}\n      size={size}\n      trailing={helpText && <StyledHelperTooltip size='sm'>{helpText}</StyledHelperTooltip>}\n      {...props}\n    >\n      {/* We have to wrap the children to make it easier to use tooltips */}\n      <span className='th__text'>{children}</span>\n    </TableHeaderCell>\n  );\n});\n\nexport default TableTH;\n","import type { ComponentPropsWithoutRef, ReactNode } from 'react';\nimport styled, { css } from 'styled-components';\n\nimport { Color, Spacing } from '@persona/design-tokens';\n\nimport { Paragraph } from '#src/components/Text';\nimport { withAlpha } from '#src/lib/color';\nimport { isHovered } from '#src/lib/pseudoClass';\nimport {\n  type MaybeSemanticTheme,\n  semanticColor,\n  semanticOnly,\n  semanticTokens,\n} from '#src/lib/semanticColor';\nimport { paragraphMixins } from '#src/mixins/text';\nimport type { PersonaTheme } from '#src/theme';\nimport { BASE } from '#src/variables/spacing';\nimport { TransitionDuration, TransitionEasing } from '#src/variables/transitions';\n\nimport TableRow from './TableRow';\nimport TableTH from './TableTH';\n\nexport interface TableCellProps {\n  breakWord?: boolean;\n  size?: 'sm' | 'md';\n}\n\nconst TableCell = styled.td.attrs({ role: 'cell' })<TableCellProps>`\n  display: table-cell;\n  vertical-align: middle;\n  /* Self-contained box model: don't depend on a consumer's global\n     border-box reset, so a fixed cell height includes its padding + border\n     and rows stay compact. */\n  box-sizing: border-box;\n\n  border-bottom: 1px solid ${({ theme }) => semanticColor(theme, 'BorderDivider', theme.color.border.primary)};\n  text-align: left;\n  padding: ${({ size }) => (size === 'sm' ? BASE : BASE * 1.5)}px;\n  color: ${({ theme }) => semanticColor(theme, 'FgPrimary', theme.color.text.primary)};\n  white-space: nowrap;\n  ${paragraphMixins.md};\n  line-height: 1;\n  ${({ breakWord }) =>\n    breakWord\n      ? `white-space: normal;\n         overflow-wrap: break-word;`\n      : ''}\n`;\n\nexport default TableCell;\n\nconst CellTitleContainer = styled.div`\n  display: flex;\n  flex-direction: column;\n`;\n\nconst CellTitle = styled(Paragraph).attrs({ color: 'primary' })`\n  ${semanticOnly(() => 'color: inherit;')}\n  display: flex;\n  align-items: center;\n  gap: ${Spacing[2]};\n`;\n\nconst CellSubtitle = styled(Paragraph)`\n  ${semanticOnly((tokens) => `color: ${tokens.FgSecondary};`)}\n`;\n\nconst activeHighlight = (theme: PersonaTheme & MaybeSemanticTheme) =>\n  semanticColor(theme, 'ActionAccent', theme.color.background.highlight);\n\nconst hoverHighlight = (theme: PersonaTheme & MaybeSemanticTheme) => {\n  const tokens = semanticTokens(theme);\n  return tokens\n    ? withAlpha(tokens.ActionAccent, tokens.Opacity25)\n    : theme.color.background.highlight;\n};\n\n// Same page color unpinned cells show through, painted opaquely so scrolled text stays covered.\nconst pinnedBodyBackground = (theme: PersonaTheme & MaybeSemanticTheme) =>\n  semanticColor(\n    theme,\n    theme.color.text.primary === Color.TextInverse ? 'SurfacePage' : 'SurfacePrimary',\n    theme.color.background.primary,\n  );\n\ninterface TableCellTitleProps extends ComponentPropsWithoutRef<'div'> {\n  subtitle?: ReactNode;\n}\n\nexport const TableCellTitle = ({ children, subtitle, ...elemProps }: TableCellTitleProps) => {\n  return (\n    <CellTitleContainer {...elemProps}>\n      <CellTitle>{children}</CellTitle>\n      {subtitle && <CellSubtitle>{subtitle}</CellSubtitle>}\n    </CellTitleContainer>\n  );\n};\n\nexport const TableTD = styled(TableCell)<{ unclickable?: boolean }>`\n  white-space: normal;\n  overflow-wrap: break-word;\n  ${(props) =>\n    props.unclickable &&\n    css`\n      cursor: default;\n    `}\n`;\n\nexport const TableIconTD = styled(TableTD)`\n  text-align: right;\n  line-height: 0; /* To center icon; cannot use flex here */\n  padding: 0;\n  padding-left: ${Spacing[4]};\n  width: 36px;\n`;\n\nexport const TableActionTD = styled(TableTD)`\n  text-align: right;\n  padding: 0;\n  padding-right: ${Spacing[4]};\n  width: 48px;\n`;\n\nexport const StickyTD = styled(TableTD)<{\n  left?: number;\n  hasRightBorder?: boolean;\n}>`\n  position: sticky;\n  left: ${({ left = 0 }) => `${left}px`}; // Default to 0 if not specified\n  background-color: ${({ theme }) => pinnedBodyBackground(theme)};\n\n  ${({ hasRightBorder, theme }) =>\n    hasRightBorder &&\n    `border-right: 2px solid ${semanticColor(theme, 'BorderDivider', theme.color.border.primary)};`}\n  z-index: 2;\n`;\n\nexport const StickyTH = styled(TableTH)<{\n  left?: number;\n  hasRightBorder?: boolean;\n  size?: 'sm' | 'md';\n}>`\n  position: sticky;\n  left: ${({ left = 0 }) => `${left}px`}; // Default to 0 if not specified\n  z-index: 2;\n  max-width: 10%;\n  background-color: ${({ theme }) => semanticColor(theme, 'SurfaceSecondary', theme.color.background.secondary)};\n  ${({ hasRightBorder, theme }) =>\n    hasRightBorder &&\n    `border-right: 2px solid ${semanticColor(theme, 'BorderDivider', theme.color.border.primary)};`}\n`;\n\nexport const TableTR = styled(TableRow)<{ disableHoverBackground?: boolean; $isActive?: boolean }>`\n  ${({ disableHoverBackground }) =>\n    disableHoverBackground &&\n    css`\n      &:hover {\n        background-color: transparent !important;\n      }\n    `}\n\n  ${({ $isActive }) =>\n    $isActive &&\n    css`\n      background-color: ${({ theme }) => activeHighlight(theme)};\n      ${semanticOnly((tokens) => `color: ${tokens.FgPrimary};`)}\n      ${StickyTD} {\n        background-color: ${({ theme }) => activeHighlight(theme)};\n      }\n      &:hover {\n        background-color: ${({ theme }) => activeHighlight(theme)};\n      }\n      &:hover ${StickyTD} {\n        background-color: ${({ theme }) => activeHighlight(theme)};\n        background-image: none;\n      }\n    `}\n\n  ${({ disableHoverBackground, $isActive }) =>\n    !disableHoverBackground &&\n    !$isActive &&\n    css`\n      &${isHovered} ${StickyTD} {\n        background-image: linear-gradient(\n          ${({ theme }) => hoverHighlight(theme)},\n          ${({ theme }) => hoverHighlight(theme)}\n        );\n      }\n    `}\n\n  ${({ onClick, disableHoverBackground, $isActive }) =>\n    onClick != null &&\n    !disableHoverBackground &&\n    !$isActive &&\n    css`\n      cursor: pointer;\n      :hover {\n        background-color: ${({ theme }) => hoverHighlight(theme)};\n        ${semanticOnly((tokens) => `color: ${tokens.FgPrimary};`)}\n      }\n      transition-duration: ${TransitionDuration.Fast};\n      transition-timing-function: ${TransitionEasing.Move};\n    `}\n`;\n","import styled, { css } from 'styled-components';\n\ninterface TableHeadProps {\n  sticky?: boolean;\n}\n\nconst TableHead = styled.thead.attrs({ role: 'rowgroup' })<TableHeadProps>`\n  display: table-header-group;\n  ${({ sticky }) =>\n    sticky &&\n    css`\n      position: sticky;\n      top: 0;\n      z-index: 1;\n    `}\n`;\n\nexport default TableHead;\n","import styled from 'styled-components';\n\nconst TableBody = styled.tbody.attrs({ role: 'rowgroup' })`\n  display: table-row-group;\n`;\n\nexport default TableBody;\n","import type { FC, PropsWithChildren, ReactNode } from 'react';\nimport styled, { keyframes } from 'styled-components';\n\nimport { Color, Spacing } from '@persona/design-tokens';\n\nimport { Spinner } from '#src/components/Spinner';\nimport Table, { TableBody, TableHead, TableRow } from '#src/components/Table';\nimport { semanticColor } from '#src/lib/semanticColor';\nimport { Z_INDICES } from '#src/lib/zindex';\nimport { semanticScrollbar } from '#src/mixins/scrollbar';\nimport { fadeIn } from '#src/variables/keyframes';\nimport { TransitionDuration, TransitionEasing } from '#src/variables/transitions';\n\n// `visible` rather than a narrower opt-out because CSS blockifies the other axis: any\n// `overflow-x` other than `visible`/`clip` forces `overflow-y` to compute to `auto` too, which\n// makes this element the scrollport that descendant sticky offsets resolve against.\nconst Container = styled.div<{ maxHeight?: number; $scrollsHorizontally: boolean }>`\n    position: relative;\n    z-index: 0;\n    overflow-x: ${({ $scrollsHorizontally }) => ($scrollsHorizontally ? 'auto' : 'visible')};\n    ${semanticScrollbar}\n    ${({ maxHeight }) => {\n      if (maxHeight != null) {\n        return `max-height: ${maxHeight}px;`;\n      }\n    }}\n  `;\n\nconst slideKeyframes = keyframes`\n    0% {\n      transform: translateX(-50%) scaleX(0);\n    }\n    50% {\n      transform: translateX(0) scaleX(1);\n    }\n    100% {\n      transform: translateX(50%) scaleX(0);\n    }\n  `;\n\nconst Loader = styled.div`\n    position: absolute;\n    z-index: ${Z_INDICES.loadingOverlays};\n    border-bottom: 3px solid ${({ theme }) => semanticColor(theme, 'BorderAccent', theme.color.primary.brand)};\n    width: 100%;\n  \n    animation: ${slideKeyframes} 3s infinite cubic-bezier(0.5, 0, 0.5, 1);\n\n    @media (prefers-reduced-motion: reduce) {\n      animation: none;\n    }\n  `;\n\nconst Overlay = styled.div`\n    position: absolute;\n    z-index: ${Z_INDICES.loadingOverlays};\n    top: 0;\n    left: 0;\n    width: 100%;\n    height: 100%;\n    background: ${({ theme }) => semanticColor(theme, 'SurfacePrimary', theme.color.primary.white)};\n    opacity: 50%;\n  `;\n\nconst SpinnerWrapper = styled.div`\n    width: 100%;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    padding: ${Spacing[5]} 0;\n    animation: ${fadeIn} ${TransitionDuration.Fast} ${TransitionEasing.Enter} 500ms backwards;\n  `;\n\nconst TableSpinner = styled(Spinner)`\n    svg {\n      width: 120px;\n      height: 120px;\n    }\n  \n    path {\n      stroke: ${({ theme }) => semanticColor(theme, 'FeedbackAccent3', Color.CorePurple500)};\n      stroke-width: 0.46;\n    }\n  `;\n\ninterface TableLayoutProps {\n  className?: string;\n  containerMaxHeight?: number;\n  /**\n   * When false, the container does not scroll horizontally and an ancestor is expected to.\n   * Sticky offsets inside the table then resolve against that ancestor's scrollport rather\n   * than against the container.\n   */\n  containerScrollsHorizontally?: boolean;\n  dataTest?: string;\n  headerTR: JSX.Element;\n  isEmpty?: boolean;\n  isLoading?: boolean;\n  nullState: ReactNode;\n  showHeader?: boolean;\n  size?: 'sm' | 'md';\n  stickyHeader?: boolean;\n}\n\nconst TableLayout: FC<PropsWithChildren<TableLayoutProps>> = ({\n  children,\n  className,\n  containerMaxHeight,\n  containerScrollsHorizontally = true,\n  dataTest,\n  headerTR,\n  isEmpty,\n  isLoading,\n  nullState,\n  showHeader,\n  size = 'md',\n  stickyHeader = false,\n}) => {\n  if (isEmpty && !showHeader) {\n    if (isLoading) {\n      return (\n        <SpinnerWrapper\n          role='status'\n          aria-live='polite'\n          aria-busy='true'\n          aria-label='Loading...'\n          data-loading-indicator='true'\n        >\n          <TableSpinner size='md' />\n        </SpinnerWrapper>\n      );\n    } else {\n      return (\n        <Container data-test={dataTest} $scrollsHorizontally={containerScrollsHorizontally}>\n          {nullState}\n        </Container>\n      );\n    }\n  }\n\n  return (\n    <Container\n      data-test={dataTest}\n      maxHeight={containerMaxHeight}\n      className={className}\n      $scrollsHorizontally={containerScrollsHorizontally}\n    >\n      {isLoading && <Loader data-test='table-layout__loader' />}\n      {isLoading && <Overlay />}\n\n      <Table size={size} aria-busy={isLoading || undefined}>\n        <TableHead sticky={stickyHeader}>\n          <TableRow>{headerTR}</TableRow>\n        </TableHead>\n        {!isEmpty && <TableBody>{children}</TableBody>}\n      </Table>\n\n      {isEmpty && nullState}\n    </Container>\n  );\n};\n\nexport default TableLayout;\n"],"mappings":"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"}

package/dist/{TableBox-RxpwflEb.mjs → TableBox-DmEfPlTG.mjs}

@@ -1,25 +1,25 @@
 import { a as styled, o as useTheme, r as css } from "./styledComponentsInterop-Cs5CCPRy.mjs";
 import { semanticColor, semanticTokens } from "./lib/semanticColor.mjs";
-import { paragraphMixins } from "./mixins/text.mjs";
-import { a as Tooltip, t as TextUnderlineTooltip } from "./Tooltip-CVBxc1yf.mjs";
-import { opaqueOver, withAlpha } from "./lib/color.mjs";
-import { findIndexByKey, moveItemByIndex } from "./lib/reorderItems.mjs";
-import { useScrollOverflow } from "./lib/useScrollOverflow.mjs";
-import { Z_INDICES } from "./lib/zindex.mjs";
 import { focusOutline } from "./mixins/focus.mjs";
 import "./variables/effect.mjs";
+import { opaqueOver, withAlpha } from "./lib/color.mjs";
 import { revealHidden, revealShown, revealTransition } from "./mixins/motion.mjs";
 import { semanticScrollbar } from "./mixins/scrollbar.mjs";
+import { paragraphMixins } from "./mixins/text.mjs";
+import { a as Tooltip, t as TextUnderlineTooltip } from "./Tooltip-C2VB8I6y.mjs";
+import { findIndexByKey, moveItemByIndex } from "./lib/reorderItems.mjs";
+import { useScrollOverflow } from "./lib/useScrollOverflow.mjs";
+import { Z_INDICES } from "./lib/zindex.mjs";
 import { n as Stack, t as HStack } from "./Stack-Bzom2BTR.mjs";
-import { t as IconButton } from "./IconButton-Bj1fry_K.mjs";
-import { t as FormGroupContext } from "./useFormGroup-DSQkoWLh.mjs";
-import { n as DropdownMenu_default } from "./DropdownMenu-Ip75l4Th.mjs";
-import { n as CaretButton, t as Combobox } from "./Combobox-DmFQ5cAy.mjs";
-import { h as Table, m as TableHeaderCell, n as TableBody, p as TableRow, r as TableHead, s as TableCell } from "./Table-9mNn8Q-d.mjs";
-import { s as Popover_default } from "./Popover-DP9DXReH.mjs";
-import { t as Container } from "./FormControl-BoKGiWdQ.mjs";
-import { Children, cloneElement, createContext, isValidElement, useCallback, useContext, useEffect, useLayoutEffect, useMemo, useRef, useState } from "react";
+import { t as IconButton } from "./IconButton-kSjnfhWt.mjs";
+import { t as FormGroupContext } from "./useFormGroup-CerJGY6Y.mjs";
+import { n as DropdownMenu_default } from "./DropdownMenu-CYZTQS02.mjs";
+import { n as CaretButton, t as Combobox } from "./Combobox-DPhX1GIR.mjs";
+import { h as Table, m as TableHeaderCell, n as TableBody, p as TableRow, r as TableHead, s as TableCell } from "./Table-BsDubdR2.mjs";
+import { s as Popover_default } from "./Popover-BMX-ff3L.mjs";
+import { t as Container } from "./FormControl--iW9afGv.mjs";
 import { BorderRadius, Color, Spacing, Typography } from "@persona/design-tokens";
+import { Children, cloneElement, createContext, isValidElement, useCallback, useContext, useEffect, useLayoutEffect, useMemo, useRef, useState } from "react";
 import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";
 import { DragIcon } from "@persona/icons";
 import { CircleAlertIcon as CircleAlertIcon$1, MoreIcon as MoreIcon$1, XIcon as XIcon$1 } from "@persona/icons/12px";
@@ -1439,4 +1439,4 @@ TableBox.Cell = TableBoxCell;
 //#endregion
 export { TableBoxContext as n, TableBox as t };
 
-//# sourceMappingURL=TableBox-RxpwflEb.mjs.map
+//# sourceMappingURL=TableBox-DmEfPlTG.mjs.map