@12-apps/ui 6.41.2 → 6.43.0

package/dist/{chunk-F7JTIHV5.js → chunk-ICDAYOJ6.js}

@@ -45,7 +45,8 @@ function HeaderCell({
   sortable,
   stickyHeader,
   headerHeight,
-  onSort
+  onSort,
+  copy
 }) {
   const theme = useTheme();
   const content = column.headerCell ? column.headerCell(column) : column.header;
@@ -79,7 +80,7 @@ function HeaderCell({
             "&:hover": { backgroundColor: "transparent", opacity: 0.8 }
           },
           endIcon: /* @__PURE__ */ jsx(SortIcon, { dir: sort?.dir }),
-          "aria-label": column.ariaLabel ?? `Sort by ${String(column.header)}`,
+          "aria-label": column.ariaLabel ?? copy.sortBy(String(column.header)),
           children: content
         }
       ) : /* @__PURE__ */ jsx(Typography, { variant: "subtitle2", fontWeight: 500, children: content })
@@ -140,7 +141,7 @@ function RowControls({
       {
         checked: isSelected,
         onChange: (event) => model.onToggleRow(rowId, event.target.checked),
-        inputProps: { "aria-label": `Select row ${index + 1}` }
+        inputProps: { "aria-label": props.copy.selectRow(index + 1) }
       }
     ) }),
     expansion && /* @__PURE__ */ jsx(TableCell, { padding: "checkbox", children: expansion.isRowExpandable?.(row) === false ? null : /* @__PURE__ */ jsx(
@@ -152,7 +153,7 @@ function RowControls({
           model.onToggleExpansion(rowId);
         },
         "aria-expanded": isExpanded,
-        "aria-label": isExpanded ? expansion.collapseLabel ?? "Collapse row" : expansion.expandLabel ?? "Expand row",
+        "aria-label": isExpanded ? expansion.collapseLabel ?? props.copy.collapseRow : expansion.expandLabel ?? props.copy.expandRow,
         "data-slot": "expand-toggle",
         children: isExpanded ? /* @__PURE__ */ jsx(ExpandLess, {}) : /* @__PURE__ */ jsx(ExpandMore, {})
       }
@@ -204,4 +205,4 @@ export {
   DataCell,
   GridRow
 };
-//# sourceMappingURL=chunk-F7JTIHV5.js.map
+//# sourceMappingURL=chunk-ICDAYOJ6.js.map

package/dist/chunk-ICDAYOJ6.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/data-display/DataGrid/DataGrid.cells.tsx"],"sourcesContent":["/**\n * The DataGrid's cell and row renderers.\n *\n * Components rather than closures over the grid's scope: as inline `render*`\n * functions they could reach every piece of the component's state, which is how\n * the body grew past 700 lines. Each one now states exactly what it needs.\n */\nimport ArrowDownward from '@mui/icons-material/ArrowDownward';\nimport ArrowUpward from '@mui/icons-material/ArrowUpward';\nimport ExpandLess from '@mui/icons-material/ExpandLess';\nimport ExpandMore from '@mui/icons-material/ExpandMore';\nimport UnfoldMore from '@mui/icons-material/UnfoldMore';\nimport Button from '@mui/material/Button/index.js';\nimport Checkbox from '@mui/material/Checkbox/index.js';\nimport IconButton from '@mui/material/IconButton/index.js';\nimport TableCell from '@mui/material/TableCell/index.js';\nimport TableRow from '@mui/material/TableRow/index.js';\nimport Typography from '@mui/material/Typography/index.js';\nimport { useTheme, type Theme } from '@mui/material/styles/index.js';\nimport React from 'react';\n\nimport { rem } from '../../../tokens/relative';\n\nimport { cellValue } from './DataGrid.rows';\nimport type { DataGridModel } from './DataGrid.model';\nimport type { DataGridProps, GridColumn, GridSort } from './DataGrid.types';\nimport type { DataGridCopy } from '../../../copy';\n\n/** The glyph for a column's current sort state — unsorted included. */\nfunction SortIcon({ dir }: { dir: GridSort['dir'] | undefined }): React.JSX.Element {\n  if (!dir) return <UnfoldMore fontSize=\"small\" sx={{ opacity: 0.5 }} />;\n  return dir === 'asc' ? <ArrowUpward fontSize=\"small\" /> : <ArrowDownward fontSize=\"small\" />;\n}\n\n/** `aria-sort`'s three values, which are not the same words as `SortDirection`. */\nfunction ariaSort(dir: GridSort['dir'] | undefined): 'none' | 'ascending' | 'descending' {\n  if (!dir) return 'none';\n  return dir === 'asc' ? 'ascending' : 'descending';\n}\n\n/**\n * One of a column's `width`/`minWidth`/`maxWidth` as CSS. A number is design\n * px through the type scale — except 1 or less, which `sx` has always read as a\n * fraction of the table and still does; a string (`'312px'`, `'20%'`) is used as\n * given.\n */\nfunction columnLength(theme: Theme, value: number | string | undefined): string | undefined {\n  if (typeof value !== 'number') return value;\n  return value <= 1 && value !== 0 ? `${value * 100}%` : rem(theme, value);\n}\n\n/** A column's size constraints, as the `sx` of its header and its cells. */\nfunction columnBox<T extends Record<string, unknown>>(\n  theme: Theme,\n  column: GridColumn<T>,\n): { minWidth?: string; maxWidth?: string; width?: string } {\n  return {\n    minWidth: columnLength(theme, column.minWidth),\n    maxWidth: columnLength(theme, column.maxWidth),\n    width: columnLength(theme, column.width),\n  };\n}\n\nexport interface HeaderCellProps<T extends Record<string, unknown>> {\n  column: GridColumn<T>;\n  sort: GridSort | undefined;\n  sortable: boolean;\n  stickyHeader: boolean;\n  /** The header row's height, as CSS. */\n  headerHeight: string;\n  onSort: (columnId: string) => void;\n  copy: DataGridCopy;\n}\n\nexport function HeaderCell<T extends Record<string, unknown>>({\n  column,\n  sort,\n  sortable,\n  stickyHeader,\n  headerHeight,\n  onSort,\n  copy,\n}: HeaderCellProps<T>): React.JSX.Element {\n  const theme = useTheme();\n  const content = column.headerCell ? column.headerCell(column) : column.header;\n  return (\n    <TableCell\n      data-slot=\"header-cell\"\n      data-sort={sort?.dir ?? 'none'}\n      sx={{\n        position: stickyHeader ? 'sticky' : 'static',\n        top: 0,\n        zIndex: 1,\n        backgroundColor: theme.palette.background.paper,\n        borderBottom: `1px solid ${theme.palette.divider}`,\n        height: headerHeight,\n        ...columnBox(theme, column),\n      }}\n      role=\"columnheader\"\n      aria-sort={ariaSort(sort?.dir)}\n    >\n      {sortable ? (\n        <Button\n          onClick={() => onSort(column.id)}\n          sx={{\n            justifyContent: 'flex-start',\n            textTransform: 'none',\n            fontWeight: 500,\n            color: 'inherit',\n            p: 0,\n            minWidth: 0,\n            '&:hover': { backgroundColor: 'transparent', opacity: 0.8 },\n          }}\n          endIcon={<SortIcon dir={sort?.dir} />}\n          aria-label={column.ariaLabel ?? copy.sortBy(String(column.header))}\n        >\n          {content}\n        </Button>\n      ) : (\n        <Typography variant=\"subtitle2\" fontWeight={500}>\n          {content}\n        </Typography>\n      )}\n    </TableCell>\n  );\n}\n\nexport interface DataCellProps<T extends Record<string, unknown>> {\n  row: T;\n  rowIndex: number;\n  rowId: string | number;\n  column: GridColumn<T>;\n  /** The row's height, as CSS — `DataGridModel.rowHeight`. */\n  rowHeight: string;\n  editing: NonNullable<DataGridProps<T>['editing']>;\n  model: Pick<DataGridModel<T>, 'editingCell' | 'setEditingCell'>;\n}\n\nexport function DataCell<T extends Record<string, unknown>>({\n  row,\n  rowIndex,\n  rowId,\n  column,\n  rowHeight,\n  editing,\n  model,\n}: DataCellProps<T>): React.JSX.Element {\n  const theme = useTheme();\n  const value = cellValue(row, column);\n  const isEditing =\n    model.editingCell?.rowId === rowId && model.editingCell?.colId === column.id;\n  const content = column.cell\n    ? column.cell({ value, row, rowIndex, col: column })\n    : String(value ?? '');\n  return (\n    <TableCell\n      data-slot=\"cell\"\n      data-col-id={column.id}\n      data-editing={isEditing}\n      sx={{\n        ...columnBox(theme, column),\n        height: rowHeight,\n      }}\n      role=\"gridcell\"\n      tabIndex={-1}\n    >\n      {isEditing && column.editor\n        ? column.editor({\n            value,\n            row,\n            onChange: () => undefined,\n            commit: () => {\n              editing.onEditCommit?.({ rowId, colId: column.id, value, row });\n              model.setEditingCell(null);\n            },\n            cancel: () => model.setEditingCell(null),\n          })\n        : content}\n    </TableCell>\n  );\n}\n\nexport interface GridRowProps<T extends Record<string, unknown>> {\n  row: T;\n  index: number;\n  rowId: string | number;\n  isSelected: boolean;\n  isExpanded: boolean;\n  totalColumns: number;\n  model: DataGridModel<T>;\n  props: DataGridProps<T>;\n}\n\n/** The leading checkbox / chevron cells, which exist only for enabled features. */\nfunction RowControls<T extends Record<string, unknown>>({\n  row,\n  index,\n  rowId,\n  isSelected,\n  isExpanded,\n  model,\n  props,\n}: GridRowProps<T>): React.JSX.Element {\n  const { selection = { mode: 'none' }, expansion } = props;\n  return (\n    <>\n      {selection.mode !== 'none' && (\n        <TableCell padding=\"checkbox\">\n          <Checkbox\n            checked={isSelected}\n            onChange={(event) => model.onToggleRow(rowId, event.target.checked)}\n            inputProps={{ 'aria-label': props.copy.selectRow(index + 1) }}\n          />\n        </TableCell>\n      )}\n      {expansion && (\n        <TableCell padding=\"checkbox\">\n          {expansion.isRowExpandable?.(row) === false ? null : (\n            <IconButton\n              size=\"small\"\n              // Stopped so a host that opens the record on a row click does not\n              // ALSO open it here: the chevron is its own control.\n              onClick={(event) => {\n                event.stopPropagation();\n                model.onToggleExpansion(rowId);\n              }}\n              aria-expanded={isExpanded}\n              aria-label={\n                isExpanded\n                  ? (expansion.collapseLabel ?? props.copy.collapseRow)\n                  : (expansion.expandLabel ?? props.copy.expandRow)\n              }\n              data-slot=\"expand-toggle\"\n            >\n              {isExpanded ? <ExpandLess /> : <ExpandMore />}\n            </IconButton>\n          )}\n        </TableCell>\n      )}\n    </>\n  );\n}\n\nexport function GridRow<T extends Record<string, unknown>>(\n  rowProps: GridRowProps<T>,\n): React.JSX.Element {\n  const { row, index, rowId, isSelected, isExpanded, totalColumns, model, props } = rowProps;\n  const theme = useTheme();\n  const expansion = props.expansion;\n  return (\n    <React.Fragment>\n      <TableRow\n        data-slot=\"row\"\n        data-selected={isSelected}\n        data-expanded={isExpanded}\n        sx={{\n          '&:hover': { backgroundColor: theme.palette.action.hover },\n          ...(isSelected && { backgroundColor: theme.palette.action.selected }),\n          height: model.rowHeight,\n        }}\n        role=\"row\"\n        aria-selected={isSelected}\n      >\n        <RowControls {...rowProps} />\n        {model.visibleColumns.map((column) => (\n          <DataCell\n            key={column.id}\n            row={row}\n            rowIndex={index}\n            rowId={rowId}\n            column={column}\n            rowHeight={model.rowHeight}\n            editing={props.editing ?? { mode: 'none' }}\n            model={model}\n          />\n        ))}\n      </TableRow>\n      {expansion && isExpanded && expansion.isRowExpandable?.(row) !== false && (\n        <TableRow data-slot=\"row-detail\">\n          <TableCell colSpan={totalColumns}>{expansion.render(row, index)}</TableCell>\n        </TableRow>\n      )}\n    </React.Fragment>\n  );\n}\n"],"mappings":"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","names":[]}

package/dist/{chunk-ASCUWG55.js → chunk-IOCY5G43.js}

@@ -1,3 +1,7 @@
+import {
+  useLightboxCopy
+} from "./chunk-TEQYTEM2.js";
+
 // src/components/data-display/Lightbox/LightboxMedia.tsx
 import { jsx } from "react/jsx-runtime";
 var cursorFor = (zoomLevel, zoomable) => {
@@ -18,6 +22,7 @@ var LightboxMedia = ({
   onWheel,
   onDoubleClick
 }) => {
+  const copy = useLightboxCopy();
   if (item.type === "video") {
     return /* @__PURE__ */ jsx(
       "video",
@@ -27,7 +32,7 @@ var LightboxMedia = ({
         style: { maxWidth: "90vw", maxHeight: "80vh", objectFit: "contain" },
         onLoadStart,
         onLoadedData: onLoaded,
-        "aria-label": item.alt || `Video ${index + 1} of ${total}`,
+        "aria-label": item.alt || copy.videoFallback(index + 1, total),
         "data-testid": testId("video")
       }
     );
@@ -36,7 +41,7 @@ var LightboxMedia = ({
     "img",
     {
       src: item.src,
-      alt: item.alt || `Image ${index + 1} of ${total}`,
+      alt: item.alt || copy.imageFallback(index + 1, total),
       style: {
         // At 1x the image is bounded by the viewport; once zoomed it is allowed
         // to overflow so there is something to pan around.
@@ -60,4 +65,4 @@ var LightboxMedia = ({
 export {
   LightboxMedia
 };
-//# sourceMappingURL=chunk-ASCUWG55.js.map
+//# sourceMappingURL=chunk-IOCY5G43.js.map

package/dist/chunk-IOCY5G43.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/data-display/Lightbox/LightboxMedia.tsx"],"sourcesContent":["import type { FC } from 'react';\nimport React from 'react';\n\nimport { useLightboxCopy } from './lightbox-copy-context';\nimport type { LightboxItem } from './Lightbox.types';\n\nexport interface LightboxMediaProps {\n  item: LightboxItem;\n  index: number;\n  total: number;\n  zoomLevel: number;\n  panOffset: { x: number; y: number };\n  zoomable: boolean;\n  isDragging: boolean;\n  testId: (suffix: string) => string;\n  onLoadStart: () => void;\n  onLoaded: () => void;\n  onWheel: (event: React.WheelEvent) => void;\n  onDoubleClick: () => void;\n}\n\nconst cursorFor = (zoomLevel: number, zoomable: boolean): string => {\n  if (zoomLevel > 1) return 'move';\n  return zoomable ? 'zoom-in' : 'default';\n};\n\nexport const LightboxMedia: FC<LightboxMediaProps> = ({\n  item,\n  index,\n  total,\n  zoomLevel,\n  panOffset,\n  zoomable,\n  isDragging,\n  testId,\n  onLoadStart,\n  onLoaded,\n  onWheel,\n  onDoubleClick,\n}) => {\n  const copy = useLightboxCopy();\n\n  if (item.type === 'video') {\n    return (\n      <video\n        src={item.src}\n        controls\n        style={{ maxWidth: '90vw', maxHeight: '80vh', objectFit: 'contain' }}\n        onLoadStart={onLoadStart}\n        onLoadedData={onLoaded}\n        aria-label={item.alt || copy.videoFallback(index + 1, total)}\n        data-testid={testId('video')}\n      />\n    );\n  }\n\n  return (\n    <img\n      src={item.src}\n      alt={item.alt || copy.imageFallback(index + 1, total)}\n      style={{\n        // At 1x the image is bounded by the viewport; once zoomed it is allowed\n        // to overflow so there is something to pan around.\n        maxWidth: zoomLevel === 1 ? '90vw' : 'none',\n        maxHeight: zoomLevel === 1 ? '80vh' : 'none',\n        transform: `scale(${zoomLevel}) translate(${panOffset.x}px, ${panOffset.y}px)`,\n        transformOrigin: 'center',\n        cursor: cursorFor(zoomLevel, zoomable),\n        transition: isDragging ? 'none' : 'transform 0.2s ease',\n        objectFit: 'contain',\n      }}\n      onLoad={onLoaded}\n      onWheel={onWheel}\n      onDoubleClick={onDoubleClick}\n      draggable={false}\n      data-testid={testId('image')}\n    />\n  );\n};\n"],"mappings":";;;;;AA4CM;AAvBN,IAAM,YAAY,CAAC,WAAmB,aAA8B;AAClE,MAAI,YAAY,EAAG,QAAO;AAC1B,SAAO,WAAW,YAAY;AAChC;AAEO,IAAM,gBAAwC,CAAC;AAAA,EACpD;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,MAAM;AACJ,QAAM,OAAO,gBAAgB;AAE7B,MAAI,KAAK,SAAS,SAAS;AACzB,WACE;AAAA,MAAC;AAAA;AAAA,QACC,KAAK,KAAK;AAAA,QACV,UAAQ;AAAA,QACR,OAAO,EAAE,UAAU,QAAQ,WAAW,QAAQ,WAAW,UAAU;AAAA,QACnE;AAAA,QACA,cAAc;AAAA,QACd,cAAY,KAAK,OAAO,KAAK,cAAc,QAAQ,GAAG,KAAK;AAAA,QAC3D,eAAa,OAAO,OAAO;AAAA;AAAA,IAC7B;AAAA,EAEJ;AAEA,SACE;AAAA,IAAC;AAAA;AAAA,MACC,KAAK,KAAK;AAAA,MACV,KAAK,KAAK,OAAO,KAAK,cAAc,QAAQ,GAAG,KAAK;AAAA,MACpD,OAAO;AAAA;AAAA;AAAA,QAGL,UAAU,cAAc,IAAI,SAAS;AAAA,QACrC,WAAW,cAAc,IAAI,SAAS;AAAA,QACtC,WAAW,SAAS,SAAS,eAAe,UAAU,CAAC,OAAO,UAAU,CAAC;AAAA,QACzE,iBAAiB;AAAA,QACjB,QAAQ,UAAU,WAAW,QAAQ;AAAA,QACrC,YAAY,aAAa,SAAS;AAAA,QAClC,WAAW;AAAA,MACb;AAAA,MACA,QAAQ;AAAA,MACR;AAAA,MACA;AAAA,MACA,WAAW;AAAA,MACX,eAAa,OAAO,OAAO;AAAA;AAAA,EAC7B;AAEJ;","names":[]}

package/dist/{chunk-4XHVGUOM.js → chunk-J2SFOLGZ.js}

@@ -6,7 +6,7 @@ import {
 } from "./chunk-6DPAWXZ3.js";
 import {
   Text
-} from "./chunk-MKLIMY3D.js";
+} from "./chunk-YZHX2HTC.js";
 import {
   rem
 } from "./chunk-YKCAJ2TN.js";
@@ -191,4 +191,4 @@ export {
   groupRows,
   DataViewsBoard
 };
-//# sourceMappingURL=chunk-4XHVGUOM.js.map
+//# sourceMappingURL=chunk-J2SFOLGZ.js.map

package/dist/{chunk-7TE4TMS3.js → chunk-JSOJKHEI.js}

@@ -3,7 +3,7 @@ import {
 } from "./chunk-INGPH3YQ.js";
 import {
   Heading
-} from "./chunk-X66E5WSX.js";
+} from "./chunk-C4QKXFZN.js";
 import {
   Separator
 } from "./chunk-RWXYND4H.js";
@@ -16,7 +16,7 @@ import {
 } from "./chunk-K6LNHHSH.js";
 import {
   Text
-} from "./chunk-MKLIMY3D.js";
+} from "./chunk-YZHX2HTC.js";
 import {
   uiInk
 } from "./chunk-FQ6UW7IY.js";
@@ -217,4 +217,4 @@ export {
   SocialLoginButton,
   SocialLoginContainer
 };
-//# sourceMappingURL=chunk-7TE4TMS3.js.map
+//# sourceMappingURL=chunk-JSOJKHEI.js.map

package/dist/{chunk-ZNBLGS66.js → chunk-K62RHTFB.js}

@@ -3,10 +3,10 @@ import {
 } from "./chunk-XZTRZ3HO.js";
 import {
   muiThemeOptionsFrom
-} from "./chunk-ZH2SZ6B3.js";
+} from "./chunk-652PYSML.js";
 import {
   createUiTheme
-} from "./chunk-YFODI4KT.js";
+} from "./chunk-6WZUZHJM.js";
 
 // src/provider/UiProvider.tsx
 import { createTheme, ThemeProvider } from "@mui/material/styles/index.js";
@@ -22,4 +22,4 @@ UiProvider.displayName = "UiProvider";
 export {
   UiProvider
 };
-//# sourceMappingURL=chunk-ZNBLGS66.js.map
+//# sourceMappingURL=chunk-K62RHTFB.js.map

package/dist/{chunk-6N2EDWMG.js → chunk-KWU62UPM.js}

@@ -3,7 +3,7 @@ import {
 } from "./chunk-PL2AB5HJ.js";
 import {
   useDataViewsLayout
-} from "./chunk-XZJM6EPC.js";
+} from "./chunk-HUAQQ5ZL.js";
 
 // src/components/data-display/DataViews/data-views-scope-tabs.tsx
 import { jsx } from "react/jsx-runtime";
@@ -34,4 +34,4 @@ function ScopeTabsSlot({
 export {
   ScopeTabsSlot
 };
-//# sourceMappingURL=chunk-6N2EDWMG.js.map
+//# sourceMappingURL=chunk-KWU62UPM.js.map

package/dist/{chunk-NHEWST3N.js → chunk-L3MRRAZM.js}

@@ -4,6 +4,7 @@ import {
 
 // src/components/data-display/Table/Table.helpers.ts
 var tableRowHeight = (rowHeight) => rowHeight ?? 52;
+var resolveTableDensity = (explicit, themeLevel) => explicit ?? themeLevel ?? "normal";
 var scrollHeight = (theme, containerHeight) => {
   const box = containerHeight || 400;
   return typeof box === "number" ? rem(theme, box) : box;
@@ -24,7 +25,6 @@ var TABLE_DEFAULTS = {
   pulse: false,
   hoverable: false,
   loading: false,
-  density: "normal",
   stickyHeader: false,
   selectable: false,
   selectedRows: [],
@@ -84,6 +84,7 @@ var tableDomProps = (props) => Object.fromEntries(Object.entries(props).filter((
 
 export {
   tableRowHeight,
+  resolveTableDensity,
   scrollerStyle,
   scrollerRadiusStyle,
   containerStyle,
@@ -93,4 +94,4 @@ export {
   definedProps,
   tableDomProps
 };
-//# sourceMappingURL=chunk-NHEWST3N.js.map
+//# sourceMappingURL=chunk-L3MRRAZM.js.map

package/dist/chunk-L3MRRAZM.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/data-display/Table/Table.helpers.ts"],"sourcesContent":["import type { TableProps as MuiTableProps } from '@mui/material/Table/index.js';\nimport type { Theme } from '@mui/material/styles/index.js';\nimport type React from 'react';\n\nimport { rem } from '../../../tokens/relative';\nimport type { DensityLevel } from '../../../tokens/density';\n\nimport type { TableDensity, TableProps } from './Table.types';\n\n/**\n * A virtualised row's height in design px: the caller's `rowHeight`, else 52.\n * Resolved here rather than in {@link TABLE_DEFAULTS} so the one number is read\n * where it is drawn (`rem`) and where the window is positioned with it (`remPx`).\n */\nexport const tableRowHeight = (rowHeight: number | undefined): number => rowHeight ?? 52;\n\n/**\n * `density`'s default (FUT-2769): the caller's own prop, else the theme's\n * level — `'normal'` for a theme with no density at all (`useDensity()`'s own\n * fallback) or an unnamed numeric one. `TableDensity` is a verbatim match for\n * the theme's `DensityLevel`, so no alias table is needed, unlike `DataGrid`'s\n * `mapThemeToGridDensity` or `DataViews`' `mapThemeToDataViewsDensity`.\n */\nexport const resolveTableDensity = (\n  explicit: TableDensity | undefined,\n  themeLevel: DensityLevel | undefined,\n): TableDensity => explicit ?? themeLevel ?? 'normal';\n\n/** The scroll box's height: a number is design px, 400 unless the caller says otherwise. */\nconst scrollHeight = (theme: Theme, containerHeight: number | string | undefined): string => {\n  const box = containerHeight || 400;\n  return typeof box === 'number' ? rem(theme, box) : box;\n};\n\n/**\n * The table's one scroll container (FUT-2658): `containerHeight` tall\n * whenever it is set, or 400 when `virtualScrolling` is on and it is not,\n * holding the header and the body. `containerHeight` sizes the scroller with\n * or without `virtualScrolling` (FUT-2677) — no consumer relies on the old\n * virtual-only gate, and `stickyHeader` needs this box to stick inside.\n * Inline, so the height it was given reads back off the element. A\n * `containerHeight` of 0 counts as unset: a zero-height scroller shows nothing.\n */\nexport const scrollerStyle = (theme: Theme, p: TableProps): React.CSSProperties | undefined =>\n  p.virtualScrolling || p.containerHeight\n    ? { height: scrollHeight(theme, p.containerHeight), overflow: 'auto' }\n    : undefined;\n\n/**\n * With `stickyHeader`, the scroller takes over the rounded clip the `<table>`\n * gives up (`tableStyles`, FUT-2677) — the caller's container owns it on the\n * basic (children) path, and the loading/empty shells get it too, so their\n * corners do not change between states.\n */\nexport const scrollerRadiusStyle = (\n  theme: Theme,\n  stickyHeader: boolean | undefined,\n): React.CSSProperties | undefined => (stickyHeader ? { borderRadius: theme.spacing(1) } : undefined);\n\n/** `scrollerStyle` and, with `stickyHeader`, the rounded clip it takes over. */\nexport const containerStyle = (theme: Theme, p: TableProps): React.CSSProperties | undefined => {\n  const scroller = scrollerStyle(theme, p);\n  const radius = scrollerRadiusStyle(theme, p.stickyHeader);\n  return scroller || radius ? { ...scroller, ...radius } : undefined;\n};\n\n/**\n * Only a virtualised table needs its header measured — a plain one never\n * reads `scroll.headerPx`, so it gets no `ResizeObserver` either (FUT-2678).\n */\nexport const headerRefFor = (\n  windowHeight: number | undefined,\n  headRef: React.RefObject<globalThis.HTMLTableSectionElement | null>,\n): React.RefObject<globalThis.HTMLTableSectionElement | null> | undefined =>\n  windowHeight ? headRef : undefined;\n\n/**\n * The window's height in design px when the body is virtualised — only a\n * numeric `containerHeight` virtualises; a string sizes the scroller alone.\n */\nexport const virtualHeight = (p: TableProps): number | undefined =>\n  p.virtualScrolling && typeof p.containerHeight === 'number' && p.containerHeight > 0 &&\n  tableRowHeight(p.rowHeight) > 0\n    ? p.containerHeight\n    : undefined;\n\n// `density` is NOT here (FUT-2769): `TableDensity` is a verbatim match for\n// the theme's `DensityLevel`, so `Table.tsx` resolves it itself —\n// `props.density ?? (useDensity().level ?? 'normal')` — reading the theme\n// requires a hook, which this module-level constant cannot call. At\n// `theme.density` unset, or its level `'normal'`, that reproduces this\n// object's OTHER defaults' shape exactly: today's literal `'normal'`.\nexport const TABLE_DEFAULTS: Partial<TableProps> = {\n  variant: 'default',\n  stripeColor: 'neutral',\n  glow: false,\n  pulse: false,\n  hoverable: false,\n  loading: false,\n  stickyHeader: false,\n  selectable: false,\n  selectedRows: [],\n  sortable: false,\n  virtualScrolling: false,\n  overscan: 5,\n  responsive: false,\n  showColumnToggle: true,\n};\n\n// Strips explicitly-undefined props before the merge, so `prop={undefined}` still\n// falls back to the default as a destructuring default would. Eighteen separate\n// destructuring defaults were most of this component's branch count.\nexport const definedProps = (props: TableProps): Partial<TableProps> =>\n  Object.fromEntries(\n    Object.entries(props).filter(([, value]) => value !== undefined),\n  ) as Partial<TableProps>;\n\n// The container + styled table + optional header, shared by the loading, empty\n// and populated renders.\n\n/** A key `Table` declares on top of MUI's own `TableProps`. */\ntype TableOwnKey = Exclude<keyof TableProps, keyof MuiTableProps>;\n\n/**\n * Every key {@link TableOwnKey} names. None is an HTML attribute: each is read\n * by the table and drawn by its parts, so none may reach the `<table>`\n * (FUT-2658). A `Record` over the key union makes the list exhaustive — a prop\n * added to `Table.types.ts` does not compile until it is named here.\n */\nconst TABLE_OWN_KEYS: Record<TableOwnKey, true> = {\n  emptyText: true,\n  variant: true,\n  stripeColor: true,\n  glow: true,\n  pulse: true,\n  hoverable: true,\n  loading: true,\n  onRowClick: true,\n  onRowFocus: true,\n  onRowBlur: true,\n  density: true,\n  selectable: true,\n  selectedRows: true,\n  onSelectionChange: true,\n  rowKeyExtractor: true,\n  sortable: true,\n  sortConfig: true,\n  onSortChange: true,\n  filterable: true,\n  filterConfig: true,\n  onFilterChange: true,\n  columns: true,\n  data: true,\n  virtualScrolling: true,\n  rowHeight: true,\n  overscan: true,\n  responsive: true,\n  columnPriorities: true,\n  responsiveBreakpoints: true,\n  showColumnToggle: true,\n  containerHeight: true,\n  loadingComponent: true,\n  emptyStateComponent: true,\n  keyboardNavigation: true,\n  renderRow: true,\n  renderCell: true,\n  draggableRows: true,\n  onRowsReorder: true,\n  fixedColumns: true,\n  rowStyleConfig: true,\n};\n\nconst NOT_FORWARDED = new Set<string>([...Object.keys(TABLE_OWN_KEYS), 'children']);\n\n/**\n * What the caller passed that is MUI's or the DOM's — `className`, `id`,\n * `style`, `aria-*`, `data-*`, DOM handlers, `sx`, `size`, `padding`,\n * `component` — for `MuiTable` to spread onto the `<table>`. `children` is\n * placed by the table itself.\n */\nexport const tableDomProps = (props: TableProps): Record<string, unknown> =>\n  Object.fromEntries(Object.entries(props).filter(([key]) => !NOT_FORWARDED.has(key)));\n"],"mappings":";;;;;AAcO,IAAM,iBAAiB,CAAC,cAA0C,aAAa;AAS/E,IAAM,sBAAsB,CACjC,UACA,eACiB,YAAY,cAAc;AAG7C,IAAM,eAAe,CAAC,OAAc,oBAAyD;AAC3F,QAAM,MAAM,mBAAmB;AAC/B,SAAO,OAAO,QAAQ,WAAW,IAAI,OAAO,GAAG,IAAI;AACrD;AAWO,IAAM,gBAAgB,CAAC,OAAc,MAC1C,EAAE,oBAAoB,EAAE,kBACpB,EAAE,QAAQ,aAAa,OAAO,EAAE,eAAe,GAAG,UAAU,OAAO,IACnE;AAQC,IAAM,sBAAsB,CACjC,OACA,iBACqC,eAAe,EAAE,cAAc,MAAM,QAAQ,CAAC,EAAE,IAAI;AAGpF,IAAM,iBAAiB,CAAC,OAAc,MAAmD;AAC9F,QAAM,WAAW,cAAc,OAAO,CAAC;AACvC,QAAM,SAAS,oBAAoB,OAAO,EAAE,YAAY;AACxD,SAAO,YAAY,SAAS,EAAE,GAAG,UAAU,GAAG,OAAO,IAAI;AAC3D;AAMO,IAAM,eAAe,CAC1B,cACA,YAEA,eAAe,UAAU;AAMpB,IAAM,gBAAgB,CAAC,MAC5B,EAAE,oBAAoB,OAAO,EAAE,oBAAoB,YAAY,EAAE,kBAAkB,KACnF,eAAe,EAAE,SAAS,IAAI,IAC1B,EAAE,kBACF;AAQC,IAAM,iBAAsC;AAAA,EACjD,SAAS;AAAA,EACT,aAAa;AAAA,EACb,MAAM;AAAA,EACN,OAAO;AAAA,EACP,WAAW;AAAA,EACX,SAAS;AAAA,EACT,cAAc;AAAA,EACd,YAAY;AAAA,EACZ,cAAc,CAAC;AAAA,EACf,UAAU;AAAA,EACV,kBAAkB;AAAA,EAClB,UAAU;AAAA,EACV,YAAY;AAAA,EACZ,kBAAkB;AACpB;AAKO,IAAM,eAAe,CAAC,UAC3B,OAAO;AAAA,EACL,OAAO,QAAQ,KAAK,EAAE,OAAO,CAAC,CAAC,EAAE,KAAK,MAAM,UAAU,MAAS;AACjE;AAcF,IAAM,iBAA4C;AAAA,EAChD,WAAW;AAAA,EACX,SAAS;AAAA,EACT,aAAa;AAAA,EACb,MAAM;AAAA,EACN,OAAO;AAAA,EACP,WAAW;AAAA,EACX,SAAS;AAAA,EACT,YAAY;AAAA,EACZ,YAAY;AAAA,EACZ,WAAW;AAAA,EACX,SAAS;AAAA,EACT,YAAY;AAAA,EACZ,cAAc;AAAA,EACd,mBAAmB;AAAA,EACnB,iBAAiB;AAAA,EACjB,UAAU;AAAA,EACV,YAAY;AAAA,EACZ,cAAc;AAAA,EACd,YAAY;AAAA,EACZ,cAAc;AAAA,EACd,gBAAgB;AAAA,EAChB,SAAS;AAAA,EACT,MAAM;AAAA,EACN,kBAAkB;AAAA,EAClB,WAAW;AAAA,EACX,UAAU;AAAA,EACV,YAAY;AAAA,EACZ,kBAAkB;AAAA,EAClB,uBAAuB;AAAA,EACvB,kBAAkB;AAAA,EAClB,iBAAiB;AAAA,EACjB,kBAAkB;AAAA,EAClB,qBAAqB;AAAA,EACrB,oBAAoB;AAAA,EACpB,WAAW;AAAA,EACX,YAAY;AAAA,EACZ,eAAe;AAAA,EACf,eAAe;AAAA,EACf,cAAc;AAAA,EACd,gBAAgB;AAClB;AAEA,IAAM,gBAAgB,oBAAI,IAAY,CAAC,GAAG,OAAO,KAAK,cAAc,GAAG,UAAU,CAAC;AAQ3E,IAAM,gBAAgB,CAAC,UAC5B,OAAO,YAAY,OAAO,QAAQ,KAAK,EAAE,OAAO,CAAC,CAAC,GAAG,MAAM,CAAC,cAAc,IAAI,GAAG,CAAC,CAAC;","names":[]}

package/dist/{chunk-3MEIGSDK.js → chunk-LTTYUSJ2.js}

@@ -3,7 +3,10 @@ var PT_BR_TUTORIAL_COPY = {
   skip: "Pular",
   previous: "Anterior",
   next: "Pr\xF3ximo",
-  restart: "Recome\xE7ar"
+  restart: "Recome\xE7ar",
+  complete: "Concluir",
+  finish: "Finalizar",
+  requiresAction: "Conclua a a\xE7\xE3o obrigat\xF3ria primeiro"
 };
 var PT_BR_CHROME_COPY = {
   dismissToast: "Fechar o aviso",
@@ -85,4 +88,4 @@ export {
   PT_BR_CHROME_COPY,
   PT_BR_NOTIFICATION_UNBLOCK_COPY
 };
-//# sourceMappingURL=chunk-3MEIGSDK.js.map
+//# sourceMappingURL=chunk-LTTYUSJ2.js.map

package/dist/chunk-LTTYUSJ2.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/pt-BR.feedback.ts"],"sourcesContent":["/**\n * The pt-BR pack for the feedback family. Split out of `pt-BR.ts`, which is a\n * barrel over this folder — see that file for why.\n */\nimport type {\n  ChromeCopy,\n  NotificationUnblockCopy,\n  TutorialCopy,\n} from './copy';\n\nexport const PT_BR_TUTORIAL_COPY: TutorialCopy = {\n  skip: \"Pular\",\n  previous: \"Anterior\",\n  next: \"Próximo\",\n  restart: \"Recomeçar\",\n  complete: \"Concluir\",\n  finish: \"Finalizar\",\n  requiresAction: \"Conclua a ação obrigatória primeiro\",\n};\n\nexport const PT_BR_CHROME_COPY: ChromeCopy = {\n  dismissToast: \"Fechar o aviso\",\n  goBack: \"Voltar\",\n  closePanel: \"Fechar\",\n  closeTab: \"Fechar a aba\",\n  scrollRegion: \"Conteúdo rolável\",\n  scrollToTop: \"Voltar ao topo\",\n  share: \"Compartilhar\",\n};\n\nconst PT_BR_CHROMIUM_DESKTOP = [\n  \"Clique no ícone à esquerda do endereço do site.\",\n  \"Abra \\\"Configurações do site\\\".\",\n  \"Em \\\"Notificações\\\", escolha \\\"Permitir\\\".\",\n  \"Volte a esta página e recarregue.\",\n] as const;\n\nconst PT_BR_CHROMIUM_ANDROID = [\n  \"Toque no ícone à esquerda do endereço do site.\",\n  \"Toque em \\\"Permissões\\\".\",\n  \"Toque em \\\"Notificações\\\" e escolha \\\"Permitir\\\".\",\n  \"Volte a esta página e recarregue.\",\n] as const;\n\nexport const PT_BR_NOTIFICATION_UNBLOCK_COPY: NotificationUnblockCopy = {\n  ios: [\n    \"Abra os Ajustes do iPhone.\",\n    \"Toque em \\\"Notificações\\\".\",\n    \"Encontre este app na lista e ative \\\"Permitir Notificações\\\".\",\n  ],\n  chrome: { desktop: PT_BR_CHROMIUM_DESKTOP, android: PT_BR_CHROMIUM_ANDROID },\n  edge: {\n    desktop: [\n      \"Clique no cadeado à esquerda do endereço do site.\",\n      \"Abra \\\"Permissões para este site\\\".\",\n      \"Em \\\"Notificações\\\", escolha \\\"Permitir\\\".\",\n      \"Volte a esta página e recarregue.\",\n    ],\n    android: PT_BR_CHROMIUM_ANDROID,\n  },\n  firefox: {\n    desktop: [\n      \"Clique no ícone de permissões à esquerda do endereço do site.\",\n      \"Ao lado de \\\"Enviar notificações\\\", clique no X para tirar o bloqueio.\",\n      \"Recarregue a página e ative as notificações de novo.\",\n    ],\n    android: [\n      \"Abra o menu do navegador e toque em \\\"Configurações\\\".\",\n      \"Toque em \\\"Permissões de sites\\\" e depois em \\\"Notificações\\\".\",\n      \"Encontre este site e escolha \\\"Permitir\\\".\",\n      \"Volte a esta página e recarregue.\",\n    ],\n  },\n  opera: { desktop: PT_BR_CHROMIUM_DESKTOP, android: PT_BR_CHROMIUM_ANDROID },\n  safari: {\n    desktop: [\n      \"No menu Safari, abra \\\"Ajustes\\\".\",\n      \"Vá na aba \\\"Sites\\\" e, na lateral, em \\\"Notificações\\\".\",\n      \"Encontre este site e escolha \\\"Permitir\\\".\",\n      \"Volte a esta página e recarregue.\",\n    ],\n  },\n  samsung: {\n    android: [\n      \"Abra o menu do navegador e toque em \\\"Configurações\\\".\",\n      \"Toque em \\\"Sites e downloads\\\" e depois em \\\"Notificações\\\".\",\n      \"Encontre este site e permita as notificações.\",\n      \"Volte a esta página e recarregue.\",\n    ],\n  },\n  other: [\n    \"Abra as configurações do navegador.\",\n    \"Procure as permissões dos sites e depois \\\"Notificações\\\".\",\n    \"Permita as notificações para este site.\",\n    \"Volte a esta página e recarregue.\",\n  ],\n};\n"],"mappings":";AAUO,IAAM,sBAAoC;AAAA,EAC/C,MAAM;AAAA,EACN,UAAU;AAAA,EACV,MAAM;AAAA,EACN,SAAS;AAAA,EACT,UAAU;AAAA,EACV,QAAQ;AAAA,EACR,gBAAgB;AAClB;AAEO,IAAM,oBAAgC;AAAA,EAC3C,cAAc;AAAA,EACd,QAAQ;AAAA,EACR,YAAY;AAAA,EACZ,UAAU;AAAA,EACV,cAAc;AAAA,EACd,aAAa;AAAA,EACb,OAAO;AACT;AAEA,IAAM,yBAAyB;AAAA,EAC7B;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF;AAEA,IAAM,yBAAyB;AAAA,EAC7B;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF;AAEO,IAAM,kCAA2D;AAAA,EACtE,KAAK;AAAA,IACH;AAAA,IACA;AAAA,IACA;AAAA,EACF;AAAA,EACA,QAAQ,EAAE,SAAS,wBAAwB,SAAS,uBAAuB;AAAA,EAC3E,MAAM;AAAA,IACJ,SAAS;AAAA,MACP;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IACF;AAAA,IACA,SAAS;AAAA,EACX;AAAA,EACA,SAAS;AAAA,IACP,SAAS;AAAA,MACP;AAAA,MACA;AAAA,MACA;AAAA,IACF;AAAA,IACA,SAAS;AAAA,MACP;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IACF;AAAA,EACF;AAAA,EACA,OAAO,EAAE,SAAS,wBAAwB,SAAS,uBAAuB;AAAA,EAC1E,QAAQ;AAAA,IACN,SAAS;AAAA,MACP;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IACF;AAAA,EACF;AAAA,EACA,SAAS;AAAA,IACP,SAAS;AAAA,MACP;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IACF;AAAA,EACF;AAAA,EACA,OAAO;AAAA,IACL;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF;AACF;","names":[]}

package/dist/{chunk-CJ45OL7L.js → chunk-M2GVHVE4.js}

@@ -1,6 +1,6 @@
 import {
   FONT_WEIGHTS
-} from "./chunk-YFODI4KT.js";
+} from "./chunk-6WZUZHJM.js";
 import {
   HEADING_SCALE
 } from "./chunk-FZXKH2ZT.js";
@@ -57,4 +57,4 @@ export {
   headingGradient,
   headingGradientStops
 };
-//# sourceMappingURL=chunk-CJ45OL7L.js.map
+//# sourceMappingURL=chunk-M2GVHVE4.js.map

package/dist/{chunk-3AQD2EA6.js → chunk-M42ZOCO7.js}

@@ -3,7 +3,7 @@ import {
   StackedView,
   WaterfallView,
   phaseColors
-} from "./chunk-WFAJTO2B.js";
+} from "./chunk-UVFZQCC7.js";
 import {
   rem
 } from "./chunk-YKCAJ2TN.js";
@@ -55,12 +55,12 @@ var calculatePercentages = (data) => {
     response: (data.response || 0) / total * 100
   };
 };
-var phasesOf = (data) => [
-  { key: "dns", label: "DNS Lookup", value: data.dns },
-  { key: "connect", label: "Connection", value: data.connect },
-  { key: "ssl", label: "SSL/TLS", value: data.ssl },
-  { key: "request", label: "Request", value: data.request },
-  { key: "response", label: "Response", value: data.response }
+var phasesOf = (data, copy) => [
+  { key: "dns", label: copy.dns, value: data.dns },
+  { key: "connect", label: copy.connect, value: data.connect },
+  { key: "ssl", label: copy.ssl, value: data.ssl },
+  { key: "request", label: copy.request, value: data.request },
+  { key: "response", label: copy.response, value: data.response }
 ].filter((phase) => phase.value !== void 0 && phase.value > 0);
 var VIEWS = {
   waterfall: WaterfallView,
@@ -77,7 +77,7 @@ var TimingDiagram = ({
   variant = "waterfall"
 }) => {
   const percentages = useMemo(() => calculatePercentages(data), [data]);
-  const phases = phasesOf(data);
+  const phases = phasesOf(data, copy);
   const View = VIEWS[variant];
   return /* @__PURE__ */ jsxs(DiagramContainer, { elevation: 2, role: "region", "aria-label": copy.regionLabel, tabIndex: 0, children: [
     /* @__PURE__ */ jsx(Typography, { variant: "h6", fontWeight: "bold", gutterBottom: true, children: copy.heading }),
@@ -87,6 +87,7 @@ var TimingDiagram = ({
         phases,
         percentages,
         data,
+        copy,
         animated,
         showLabels,
         showTooltips,
@@ -111,4 +112,4 @@ export {
   TimingDiagram,
   TimingDiagram_default
 };
-//# sourceMappingURL=chunk-3AQD2EA6.js.map
+//# sourceMappingURL=chunk-M42ZOCO7.js.map

package/dist/chunk-M42ZOCO7.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/data-display/TimingDiagram/TimingDiagram.tsx"],"sourcesContent":["import Box from '@mui/material/Box/index.js';\nimport Paper from '@mui/material/Paper/index.js';\nimport Typography from '@mui/material/Typography/index.js';\nimport { alpha, styled } from '@mui/material/styles/index.js';\nimport type { FC } from 'react';\nimport React, { useMemo } from 'react';\n\nimport type { TimingDiagramCopy } from '../../../copy';\n\nimport type { TimingData, TimingDiagramProps } from './TimingDiagram.types';\nimport type { Phase, PhaseKey, TimingViewProps } from './TimingDiagram.views';\nimport {\n  HorizontalView,\n  phaseColors,\n  StackedView,\n  WaterfallView,\n} from './TimingDiagram.views';\nimport { rem } from '../../../tokens/relative';\n\n// Styled components\nconst DiagramContainer = styled(Paper)(({ theme }) => ({\n  padding: theme.spacing(3),\n  background: `linear-gradient(135deg, ${alpha(theme.palette.background.paper, 0.9)} 0%, ${alpha(theme.palette.background.paper, 0.8)} 100%)`,\n  backdropFilter: `blur(${rem(theme, 10)})`,\n  WebkitBackdropFilter: `blur(${rem(theme, 10)})`,\n  border: `1px solid ${alpha(theme.palette.divider, 0.18)}`,\n  borderRadius: theme.shape.borderRadius * 2,\n}));\n\nconst Legend = styled(Box)(({ theme }) => ({\n  display: 'flex',\n  flexWrap: 'wrap',\n  gap: theme.spacing(2),\n  marginTop: theme.spacing(2),\n  paddingTop: theme.spacing(2),\n  borderTop: `1px solid ${alpha(theme.palette.divider, 0.2)}`,\n}));\n\nconst LegendItem = styled(Box)(({ theme }) => ({\n  display: 'flex',\n  alignItems: 'center',\n  gap: theme.spacing(1),\n  '& .color': {\n    width: rem(theme, 12),\n    height: rem(theme, 12),\n    borderRadius: rem(theme, 2),\n  },\n  '& .label': {\n    fontSize: rem(theme, 12.8),\n    color: theme.palette.text.secondary,\n  },\n}));\n\n// Helper functions\nconst calculatePercentages = (data: TimingData): Record<string, number> => {\n  const total = data.total || 1;\n  return {\n    dns: ((data.dns || 0) / total) * 100,\n    connect: ((data.connect || 0) / total) * 100,\n    ssl: ((data.ssl || 0) / total) * 100,\n    request: ((data.request || 0) / total) * 100,\n    response: ((data.response || 0) / total) * 100,\n  };\n};\n\n// A phase with no recorded time never happened — an HTTP request has no SSL\n// handshake, for instance — so it gets no bar and no legend entry.\nconst phasesOf = (data: TimingData, copy: TimingDiagramCopy): Phase[] =>\n  [\n    { key: 'dns', label: copy.dns, value: data.dns },\n    { key: 'connect', label: copy.connect, value: data.connect },\n    { key: 'ssl', label: copy.ssl, value: data.ssl },\n    { key: 'request', label: copy.request, value: data.request },\n    { key: 'response', label: copy.response, value: data.response },\n  ].filter((phase) => phase.value !== undefined && phase.value > 0);\n\nconst VIEWS: Record<string, FC<TimingViewProps>> = {\n  waterfall: WaterfallView,\n  stacked: StackedView,\n  horizontal: HorizontalView,\n};\n\n// Main component\nexport const TimingDiagram: FC<TimingDiagramProps> = ({\n  copy,\n  data,\n  showLabels = true,\n  height,\n  animated = true,\n  showTooltips = true,\n  variant = 'waterfall',\n}) => {\n  const percentages = useMemo(() => calculatePercentages(data), [data]);\n  const phases = phasesOf(data, copy);\n  const View = VIEWS[variant];\n\n  return (\n    <DiagramContainer elevation={2} role=\"region\" aria-label={copy.regionLabel} tabIndex={0}>\n      <Typography variant=\"h6\" fontWeight=\"bold\" gutterBottom>\n        {copy.heading}\n      </Typography>\n\n      {View && (\n        <View\n          phases={phases}\n          percentages={percentages}\n          data={data}\n          copy={copy}\n          animated={animated}\n          showLabels={showLabels}\n          showTooltips={showTooltips}\n          // The waterfall's plot height, 40 design px unless the caller says otherwise.\n          plotHeightPx={height ?? 40}\n        />\n      )}\n\n      {showLabels && (\n        <Legend>\n          {phases.map((phase) => (\n            <LegendItem key={phase.key}>\n              <Box\n                className=\"color\"\n                sx={(theme) => ({ backgroundColor: phaseColors(theme)[phase.key as PhaseKey] })}\n              />\n              <Typography className=\"label\">{phase.label}</Typography>\n            </LegendItem>\n          ))}\n        </Legend>\n      )}\n    </DiagramContainer>\n  );\n};\n\n// Export default\nexport default TimingDiagram;\n"],"mappings":"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","names":[]}

package/dist/{chunk-MEBQKYH4.js → chunk-MBNXCCRG.js}

@@ -1,16 +1,16 @@
 import {
   DataViewsGrid
-} from "./chunk-UT73NGRS.js";
+} from "./chunk-MLUUF7OZ.js";
 import {
   DeleteViewDialog
-} from "./chunk-DH5UJD2I.js";
+} from "./chunk-5FHPZOYK.js";
 import {
   viewStateKey
 } from "./chunk-ZOLAYP2D.js";
 import {
   ViewDialogs,
   ViewMutationErrorAlert
-} from "./chunk-KHOAXZW2.js";
+} from "./chunk-H3GYVR7S.js";
 import {
   useSavedViewsController
 } from "./chunk-3AOOI2NR.js";
@@ -178,4 +178,4 @@ function renderViewDialogs(ctl, fields, columns, views, testIdPrefix, onSaved) {
 export {
   DataViewsTableBase
 };
-//# sourceMappingURL=chunk-MEBQKYH4.js.map
+//# sourceMappingURL=chunk-MBNXCCRG.js.map

package/dist/{chunk-UT73NGRS.js → chunk-MLUUF7OZ.js}

@@ -1,6 +1,6 @@
 import {
   GridShell
-} from "./chunk-HFVYWHJT.js";
+} from "./chunk-NYT3UVOH.js";
 import {
   useDataViewsState
 } from "./chunk-HKBJZX3C.js";
@@ -27,4 +27,4 @@ function DataViewsGrid(props) {
 export {
   DataViewsGrid
 };
-//# sourceMappingURL=chunk-UT73NGRS.js.map
+//# sourceMappingURL=chunk-MLUUF7OZ.js.map

package/dist/{chunk-KW3H5FUS.js → chunk-MPYIEIBA.js}

@@ -3,7 +3,7 @@ import {
 } from "./chunk-6DPAWXZ3.js";
 import {
   Text
-} from "./chunk-MKLIMY3D.js";
+} from "./chunk-YZHX2HTC.js";
 
 // src/components/data-display/DataViews/data-views-header-row.tsx
 import { jsx, jsxs } from "react/jsx-runtime";
@@ -36,4 +36,4 @@ function GridHeaderRow({
 export {
   GridHeaderRow
 };
-//# sourceMappingURL=chunk-KW3H5FUS.js.map
+//# sourceMappingURL=chunk-MPYIEIBA.js.map

package/dist/{chunk-DFI2RKVQ.js → chunk-MRWYKNBY.js}

@@ -1,6 +1,6 @@
 import {
   GREY
-} from "./chunk-YFODI4KT.js";
+} from "./chunk-6WZUZHJM.js";
 import {
   contrastText
 } from "./chunk-2BYKTBDL.js";
@@ -67,4 +67,4 @@ export {
   LINEAR_INDETERMINATE,
   progressPalette
 };
-//# sourceMappingURL=chunk-DFI2RKVQ.js.map
+//# sourceMappingURL=chunk-MRWYKNBY.js.map

package/dist/{chunk-HFVYWHJT.js → chunk-NYT3UVOH.js}

@@ -4,16 +4,16 @@ import {
 } from "./chunk-BKZERHNC.js";
 import {
   DataViewsEmpty
-} from "./chunk-3UEZ6NUI.js";
+} from "./chunk-OCQ6GDCF.js";
 import {
   InlineFilterControls
-} from "./chunk-DH77PLFF.js";
+} from "./chunk-YTVXT5TD.js";
 import {
   GridHeaderRow
-} from "./chunk-KW3H5FUS.js";
+} from "./chunk-MPYIEIBA.js";
 import {
   GridMain
-} from "./chunk-LODMNSLR.js";
+} from "./chunk-UP7SSTCZ.js";
 import {
   DataViewsPagination
 } from "./chunk-BA6Z52QN.js";
@@ -23,10 +23,10 @@ import {
 } from "./chunk-6QYKZMEE.js";
 import {
   ScopeTabsSlot
-} from "./chunk-6N2EDWMG.js";
+} from "./chunk-KWU62UPM.js";
 import {
   ShellToolbar
-} from "./chunk-C6OVO6AT.js";
+} from "./chunk-I6MVJWUO.js";
 import {
   resolveSelectionExtra
 } from "./chunk-KX75HM5U.js";
@@ -36,7 +36,7 @@ import {
 import {
   DataViewsLayoutProvider,
   useDataViewsLayout
-} from "./chunk-XZJM6EPC.js";
+} from "./chunk-HUAQQ5ZL.js";
 import {
   useDataViewsCopy
 } from "./chunk-KHG57NAE.js";
@@ -238,4 +238,4 @@ function GridShell(props) {
 export {
   GridShell
 };
-//# sourceMappingURL=chunk-HFVYWHJT.js.map
+//# sourceMappingURL=chunk-NYT3UVOH.js.map

package/dist/{chunk-YWJDUJAR.js → chunk-O6IF4BZT.js}

@@ -9,7 +9,7 @@ import {
 } from "./chunk-K6LNHHSH.js";
 import {
   Text
-} from "./chunk-MKLIMY3D.js";
+} from "./chunk-YZHX2HTC.js";
 
 // src/user-avatar/user-avatar.tsx
 import Box from "@mui/material/Box/index.js";
@@ -74,4 +74,4 @@ export {
   UserAvatar,
   UserMenu
 };
-//# sourceMappingURL=chunk-YWJDUJAR.js.map
+//# sourceMappingURL=chunk-O6IF4BZT.js.map

package/dist/{chunk-3UEZ6NUI.js → chunk-OCQ6GDCF.js}

@@ -9,7 +9,7 @@ import {
 } from "./chunk-K6LNHHSH.js";
 import {
   Text
-} from "./chunk-MKLIMY3D.js";
+} from "./chunk-YZHX2HTC.js";
 import {
   sxRem
 } from "./chunk-YKCAJ2TN.js";
@@ -80,4 +80,4 @@ function DataViewsEmpty({
 export {
   DataViewsEmpty
 };
-//# sourceMappingURL=chunk-3UEZ6NUI.js.map
+//# sourceMappingURL=chunk-OCQ6GDCF.js.map

package/dist/{chunk-JAGAFEZL.js → chunk-OD3L6GX5.js}

@@ -9,7 +9,7 @@ import {
 } from "./chunk-RTSK5OZT.js";
 import {
   useUiTheme
-} from "./chunk-C2TERIB4.js";
+} from "./chunk-QSNLIWEB.js";
 import {
   resolveTestId
 } from "./chunk-TYJR4GOF.js";
@@ -48,4 +48,4 @@ Icon.displayName = "Icon";
 export {
   Icon
 };
-//# sourceMappingURL=chunk-JAGAFEZL.js.map
+//# sourceMappingURL=chunk-OD3L6GX5.js.map

package/dist/{chunk-RPBGUWNF.js → chunk-ON4TRXCM.js}

@@ -7,7 +7,7 @@ import {
   SaveError,
   SettingHeader,
   partTestId
-} from "./chunk-PEOOCQ2T.js";
+} from "./chunk-6IRJAIS4.js";
 import {
   SETTING_CARD_OPEN_ATTR,
   actionsStyles,
@@ -17,7 +17,7 @@ import {
 } from "./chunk-3DO5AJCG.js";
 import {
   Icon
-} from "./chunk-JAGAFEZL.js";
+} from "./chunk-OD3L6GX5.js";
 import {
   Button
 } from "./chunk-K6LNHHSH.js";
@@ -165,4 +165,4 @@ SettingCard.displayName = "SettingCard";
 export {
   SettingCard
 };
-//# sourceMappingURL=chunk-RPBGUWNF.js.map
+//# sourceMappingURL=chunk-ON4TRXCM.js.map

package/dist/{chunk-GJFAI3J5.js → chunk-OOB3YWPX.js}

@@ -6,22 +6,22 @@ import {
 } from "./chunk-N2GEKC4J.js";
 import {
   LightboxOverlay
-} from "./chunk-IVJKILIX.js";
+} from "./chunk-VZ4VAQX3.js";
 import {
   LightboxCurrentMedia
-} from "./chunk-2DWBJJK6.js";
+} from "./chunk-RBGUS7WO.js";
 import {
   useLightbox
 } from "./chunk-HJPPNVCF.js";
-import {
-  LightboxCopyProvider
-} from "./chunk-TEQYTEM2.js";
 import {
   LightboxThumbnails
-} from "./chunk-BAFDSAWY.js";
+} from "./chunk-SV4FYSDL.js";
 import {
   makeTestId
 } from "./chunk-3KA6MYIR.js";
+import {
+  LightboxCopyProvider
+} from "./chunk-TEQYTEM2.js";
 import {
   scrim
 } from "./chunk-FQ6UW7IY.js";
@@ -42,7 +42,13 @@ var DIALOG_STATIC_PROPS = {
   TransitionComponent: Fade,
   TransitionProps: { timeout: 300 },
   PaperProps: { sx: { background: (theme) => scrim(theme, 0.9), backdropFilter: (theme) => `blur(${rem(theme, 2)})` } },
-  "aria-label": "Lightbox",
+  // `aria-labelledby` is the one accessible name for the modal itself: MUI
+  // forwards it (with `aria-modal` and its own `role="dialog"`) onto the
+  // Paper, the element that is actually the WAI-ARIA dialog. A plain
+  // `aria-label` alongside it would land on the OUTER root instead — a
+  // second, non-modal `role="dialog"` this component sets of its own accord
+  // — duplicating (and, as a static English literal, contradicting) the name
+  // the Paper already carries.
   "aria-labelledby": "lightbox-title",
   role: "dialog",
   "aria-modal": "true"
@@ -67,8 +73,9 @@ var Lightbox = React.forwardRef((componentProps, ref) => {
       "data-testid": dataTestId || "lightbox",
       children: [
         /* @__PURE__ */ jsxs(Typography, { id: "lightbox-title", variant: "h6", sx: { position: "absolute", left: sxRem(-1e4) }, children: [
-          "Lightbox - ",
-          currentItem?.alt || `Item ${currentIndex + 1} of ${items.length}`
+          props.copy.dialogLabel,
+          " - ",
+          currentItem?.alt || props.copy.itemPosition(currentIndex + 1, items.length)
         ] }),
         /* @__PURE__ */ jsx(
           LightboxOverlay,
@@ -135,4 +142,4 @@ export {
   Lightbox,
   Lightbox_default
 };
-//# sourceMappingURL=chunk-GJFAI3J5.js.map
+//# sourceMappingURL=chunk-OOB3YWPX.js.map