@lobehub/ui 5.63.0 → 5.63.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (26) hide show
  1. package/es/ThemeProvider/GlobalStyle/essential.mjs +11 -0
  2. package/es/ThemeProvider/GlobalStyle/essential.mjs.map +1 -1
  3. package/es/base-ui/Table/FixedFrost.mjs +120 -0
  4. package/es/base-ui/Table/FixedFrost.mjs.map +1 -0
  5. package/es/base-ui/Table/Table.mjs +52 -47
  6. package/es/base-ui/Table/Table.mjs.map +1 -1
  7. package/es/base-ui/Table/style.mjs +188 -82
  8. package/es/base-ui/Table/style.mjs.map +1 -1
  9. package/es/base-ui/Text/style.d.mts +1 -1
  10. package/es/dashboard/ConsoleNav/style.mjs +2 -2
  11. package/es/dashboard/ConsoleNav/style.mjs.map +1 -1
  12. package/es/dashboard/FilterSidebar/style.mjs +2 -2
  13. package/es/dashboard/FilterSidebar/style.mjs.map +1 -1
  14. package/es/dashboard/FilterStrip/style.mjs +1 -1
  15. package/es/dashboard/FilterStrip/style.mjs.map +1 -1
  16. package/es/dashboard/MetricStrip/style.mjs +1 -1
  17. package/es/dashboard/MetricStrip/style.mjs.map +1 -1
  18. package/es/dashboard/PageSkeleton/style.mjs +1 -1
  19. package/es/dashboard/PageSkeleton/style.mjs.map +1 -1
  20. package/es/dashboard/Surface/link.d.mts +1 -1
  21. package/es/dashboard/Surface/link.mjs +1 -1
  22. package/es/dashboard/Surface/link.mjs.map +1 -1
  23. package/es/dashboard/Surface/style.d.mts +9 -8
  24. package/es/dashboard/Surface/style.mjs +19 -18
  25. package/es/dashboard/Surface/style.mjs.map +1 -1
  26. package/package.json +1 -1
package/es/base-ui/Table/style.mjs.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"style.mjs","names":[],"sources":["../../../src/base-ui/Table/style.ts"],"sourcesContent":["import { createStaticStyles } from 'antd-style';\n\n/** Own prefix so rc-table classNames never collide with antd's global `.ant-table` CSS. */\nexport const PREFIX_CLS = 'lobe-table';\n\nconst p = `.${PREFIX_CLS}`;\n\n// Cell padding comes from the size class through these vars, so title / footer / expanded rows\n// can reuse (and negate) it.\nconst PADDING_BLOCK = '--lobe-table-padding-block';\nconst PADDING_INLINE = '--lobe-table-padding-inline';\n\n// Matches antd's `zIndexTableFixed`.\nconst Z_FIXED = 2;\n\n// antd `expandColumnWidth`; nested tables start after it.\nexport const EXPAND_COLUMN_WIDTH = 48;\n\n// antd `selectionColumnWidth`, plus the `selections` trigger when there is one.\nexport const SELECTION_COLUMN_WIDTH = 32;\nexport const SELECTION_DROPDOWN_WIDTH = 24;\n\n/** Rows of this table's own sections only, so the rules never leak into nested tables. */\nconst ownRows = ['content', 'header', 'body', 'summary']\n .map((section) => `& > ${p}-container > ${p}-${section} > table > * > tr`)\n .join(', ');\nconst ownCells = (cell: string) =>\n ownRows\n .split(', ')\n .map((row) => `${row} > ${cell}`)\n .join(', ');\n\nexport const styles = createStaticStyles(({ css, cssVar }) => {\n const border = `1px solid ${cssVar.colorBorderSecondary}`;\n const fixShadowBase = `\n pointer-events: none;\n content: '';\n position: absolute;\n inset-block: 0 -1px;\n width: 30px;\n transition: box-shadow ${cssVar.motionDurationSlow};\n `;\n const startShadow = `box-shadow: inset 10px 0 8px -8px ${cssVar.colorSplit};`;\n const endShadow = `box-shadow: inset -10px 0 8px -8px ${cssVar.colorSplit};`;\n\n return {\n outlined: css`\n &${p}-outlined {\n /* The square root must not paint behind the rounded frame: the container\n (clipped to its radius) carries the colorBgContainer body instead. */\n background: transparent;\n\n & > ${p}-container {\n background: ${cssVar.colorBgContainer};\n }\n\n & > ${p}-title, & > ${p}-footer {\n background: ${cssVar.colorBgContainer};\n }\n\n & > ${p}-title {\n border: ${border};\n border-block-end: 0;\n border-start-start-radius: ${cssVar.borderRadiusLG};\n border-start-end-radius: ${cssVar.borderRadiusLG};\n }\n\n /* The container draws the top and both side edges; the last row draws the bottom.\n No column dividers (grouped headers included): rows are split horizontally only. */\n & > ${p}-container {\n overflow: clip;\n border-block-start: ${border};\n border-inline: ${border};\n border-radius: ${cssVar.borderRadiusLG};\n }\n\n & > ${p}-title + ${p}-container {\n border-start-start-radius: 0;\n border-start-end-radius: 0;\n }\n\n &:has(> ${p}-footer) > ${p}-container {\n border-end-start-radius: 0;\n border-end-end-radius: 0;\n }\n\n & > ${p}-footer {\n border: ${border};\n border-block-start: 0;\n border-end-start-radius: ${cssVar.borderRadiusLG};\n border-end-end-radius: ${cssVar.borderRadiusLG};\n }\n\n /* Every header row (including the last) draws one bottom edge — no inset\n shadow underneath, or group headers look double-thick. */\n & > ${p}-container > * > table > thead > tr > th {\n border-block-end: ${border};\n box-shadow: inset 0 999px 0 ${cssVar.colorFillQuaternary};\n }\n }\n `,\n\n /* Mirrors Block \\`filled\\`: one colorFillTertiary surface straight on the parent (no\n colorBgContainer underneath, no stacked header fill) and no frame border. */\n filled: css`\n &${p}-filled {\n background: transparent;\n\n & > ${p}-title, & > ${p}-footer {\n border-radius: ${cssVar.borderRadiusLG};\n background: ${cssVar.colorFillQuaternary};\n }\n\n & > ${p}-title {\n border-end-start-radius: 0;\n border-end-end-radius: 0;\n }\n\n & > ${p}-footer {\n border-start-start-radius: 0;\n border-start-end-radius: 0;\n }\n\n & > ${p}-container {\n overflow: clip;\n border-radius: ${cssVar.borderRadiusLG};\n background: ${cssVar.colorFillTertiary};\n }\n\n & > ${p}-title + ${p}-container {\n border-start-start-radius: 0;\n border-start-end-radius: 0;\n }\n\n &:has(> ${p}-footer) > ${p}-container {\n border-end-start-radius: 0;\n border-end-end-radius: 0;\n }\n\n /* Header band: only the FillQuaternary wash over the container fill (stacking a\n second FillTertiary made dark mode too bright). */\n & ${p}-thead > tr > th,\n & ${p}-thead > tr > td {\n background: transparent;\n box-shadow:\n inset 0 -1px 0 ${cssVar.colorBorderSecondary},\n inset 0 999px 0 ${cssVar.colorFillQuaternary};\n }\n\n /* Row dividers stay on (base colorBorderSecondary rule); only the fill is the container's. */\n & ${p}-tbody > tr > td,\n & ${p}-tbody > tr > th,\n & ${p}-tbody-virtual ${p}-cell {\n background: transparent;\n }\n\n /* Fixed cells must be opaque: colorBgContainer painted with the same fill(s), the\n closest opaque match to the translucent surface around them. */\n & ${p}-thead > tr > th${p}-cell-fix, & ${p}-thead > tr > td${p}-cell-fix {\n background: ${cssVar.colorBgContainer};\n box-shadow:\n inset 0 -1px 0 ${cssVar.colorBorderSecondary},\n inset 0 999px 0 ${cssVar.colorFillQuaternary},\n inset 0 999px 0 ${cssVar.colorFillTertiary};\n }\n\n & ${p}-tbody > tr > td${p}-cell-fix {\n background: ${cssVar.colorBgContainer};\n box-shadow: inset 0 999px 0 ${cssVar.colorFillTertiary};\n }\n }\n `,\n /**\n * Borderless: everything but the header is see-through, so the table sits on whatever\n * surface hosts it. Hover / selected rows are translucent fills. Fixed (sticky) cells\n * stay opaque in colorBgContainer so scrolled content never shows underneath them.\n */\n borderless: css`\n && {\n background: transparent;\n }\n\n && ${p}-tbody > tr > td,\n && ${p}-tbody > tr > th,\n && ${p}-tbody-virtual ${p}-cell, && ${p}-summary, && ${p}-summary > tr > td,\n && ${p}-summary > tr > th,\n && > ${p}-footer {\n background: transparent;\n }\n\n && ${p}-tbody > tr > td${p}-cell-row-hover, && ${p}-tbody-virtual ${p}-row:hover > ${p}-cell {\n background: color-mix(in srgb, ${cssVar.colorText} 3%, transparent);\n }\n\n && ${p}-tbody > tr${p}-row-selected > td {\n background: color-mix(in srgb, ${cssVar.colorPrimary} 6%, transparent);\n\n &${p}-cell-row-hover {\n background: color-mix(in srgb, ${cssVar.colorPrimary} 10%, transparent);\n }\n }\n\n &&\n ${p}-tbody\n > tr\n > td${p}-cell-fix,\n &&\n ${p}-tbody\n > tr\n > th${p}-cell-fix,\n &&\n ${p}-tbody-virtual\n ${p}-cell${p}-cell-fix {\n background: ${cssVar.colorBgContainer};\n }\n\n && ${p}-tbody > tr > td${p}-cell-fix${p}-cell-row-hover {\n background: color-mix(in srgb, ${cssVar.colorBgContainer}, ${cssVar.colorText} 3%);\n }\n\n && ${p}-tbody > tr${p}-row-selected > td${p}-cell-fix {\n background: color-mix(in srgb, ${cssVar.colorBgContainer}, ${cssVar.colorPrimary} 6%);\n\n &${p}-cell-row-hover {\n background: color-mix(in srgb, ${cssVar.colorBgContainer}, ${cssVar.colorPrimary} 10%);\n }\n }\n `,\n /**\n * Grouped (multi-level) headers only: column dividers in header and body so the\n * group spans stay readable. Plain tables never get vertical dividers.\n */\n grouped: css`\n ${ownCells('th')}, ${ownCells('td')} {\n border-inline-end: ${border};\n }\n\n & ${p}-tbody-virtual ${p}-cell {\n border-inline-end: ${border};\n }\n\n /* Outlined: the container already draws the trailing edge. Other variants: the\n rightmost body cell and first header row cell stop at the table edge. */\n &:not(${p}-outlined) ${p}-tbody > tr > td:last-child,\n &:not(${p}-outlined) ${p}-thead > tr:first-child > th:last-child,\n &${p}-outlined ${p}-tbody > tr > td:last-child,\n &${p}-outlined ${p}-thead > tr:first-child > th:last-child {\n border-inline-end: 0;\n }\n `,\n clickable: css`\n cursor: pointer;\n `,\n /** Title text of an `ellipsis` column; truncates inside the sort button / header controls. */\n columnTitle: css`\n overflow: hidden;\n\n min-width: 0;\n\n text-overflow: ellipsis;\n word-break: keep-all;\n white-space: nowrap;\n `,\n filterActive: css`\n &&,\n &&:hover {\n color: ${cssVar.colorPrimary};\n }\n `,\n filterButton: css`\n flex: none;\n margin-block: -4px;\n `,\n filterButtons: css`\n display: flex;\n gap: 8px;\n align-items: center;\n justify-content: space-between;\n\n padding-block: 7px;\n padding-inline: 8px;\n border-block-start: 1px solid ${cssVar.colorSplit};\n `,\n filterCheckAll: css`\n margin-block-end: 4px;\n padding-inline: 4px;\n `,\n filterDropdown: css`\n display: flex;\n flex-direction: column;\n min-width: 120px;\n `,\n filterEmpty: css`\n padding-block: 16px;\n padding-inline: 0;\n `,\n filterGroup: css`\n display: flex;\n flex-direction: column;\n\n & > div:not(:first-child) {\n padding-inline-start: 20px;\n }\n `,\n filterGroupTitle: css`\n padding-block: 5px;\n padding-inline: 8px;\n font-size: 12px;\n color: ${cssVar.colorTextDescription};\n `,\n filterItem: css`\n display: flex;\n align-items: center;\n\n padding-block: 5px;\n padding-inline: 8px;\n border-radius: ${cssVar.borderRadiusSM};\n\n white-space: nowrap;\n\n &:hover {\n background: ${cssVar.colorFillTertiary};\n }\n\n & > label {\n cursor: pointer;\n flex: 1;\n }\n `,\n filterMenu: css`\n overflow: auto;\n display: flex;\n flex-direction: column;\n\n max-height: 264px;\n padding: 4px;\n `,\n filterPopup: css`\n overflow: hidden;\n padding: 0;\n `,\n filterSearch: css`\n padding: 8px;\n border-block-end: 1px solid ${cssVar.colorSplit};\n `,\n filterTree: css`\n overflow: auto;\n max-height: 264px;\n padding: 8px;\n `,\n headerInner: css`\n display: inline-flex;\n gap: 6px;\n align-items: center;\n\n min-width: 0;\n max-width: 100%;\n\n vertical-align: middle;\n `,\n hoverable: css`\n & ${p}-tbody > tr > ${p}-cell-row-hover, & ${p}-tbody-virtual ${p}-row:hover > ${p}-cell {\n background: color-mix(in srgb, ${cssVar.colorBgContainer}, ${cssVar.colorText} 3%);\n }\n `,\n loading: css`\n position: absolute;\n z-index: calc(var(--columns-count, 1) * 2 + ${Z_FIXED} + 2);\n inset: 0;\n\n display: flex;\n flex-direction: column;\n gap: 8px;\n align-items: center;\n justify-content: center;\n\n color: ${cssVar.colorTextSecondary};\n\n background: color-mix(in srgb, ${cssVar.colorBgContainer} 60%, transparent);\n `,\n /**\n * Empty-state loading body. Tracks follow leaf column widths so bars sit under the\n * live header; cell padding reuses the size CSS vars on the table ancestor.\n */\n skeleton: css`\n display: flex;\n flex-direction: column;\n\n width: 100%;\n min-width: 0;\n\n text-align: start;\n `,\n skeletonCell: css`\n display: flex;\n align-items: center;\n\n min-width: 0;\n padding-block: var(${PADDING_BLOCK});\n padding-inline: var(${PADDING_INLINE});\n `,\n skeletonRow: css`\n display: grid;\n align-items: stretch;\n\n width: 100%;\n min-width: 0;\n border-block-end: 1px solid ${cssVar.colorBorderSecondary};\n\n &:last-child {\n border-block-end: 0;\n }\n `,\n // antd `paginationMargin` (token.margin): keep the pager off the table above and off\n // whatever sits below the table.\n pagination: css`\n display: flex;\n margin-block: 16px;\n `,\n paginationCenter: css`\n justify-content: center;\n `,\n paginationEnd: css`\n justify-content: flex-end;\n `,\n paginationStart: css`\n justify-content: flex-start;\n `,\n paginationTop: css`\n margin-block: 0 16px;\n `,\n root: css`\n min-width: 0;\n `,\n /** Header box of the selection column; `selectionExtra` hangs off its end. */\n selection: css`\n position: relative;\n display: inline-flex;\n flex-direction: column;\n vertical-align: middle;\n `,\n selectionColumn: css`\n && {\n padding-inline: 8px;\n text-align: center;\n }\n\n & > * {\n vertical-align: middle;\n }\n `,\n selectionExtra: css`\n position: absolute;\n z-index: 1;\n inset-block-start: 0;\n\n display: flex;\n align-items: center;\n\n height: 100%;\n margin-inline-start: 100%;\n padding-inline-start: 2px;\n `,\n selectionRadioGroup: css`\n display: inline-flex;\n vertical-align: middle;\n `,\n selectionTrigger: css`\n flex: none;\n margin-block: -4px;\n `,\n sizeLarge: css`\n ${PADDING_BLOCK}: 16px;\n ${PADDING_INLINE}: 16px;\n `,\n sizeMedium: css`\n ${PADDING_BLOCK}: 12px;\n ${PADDING_INLINE}: 16px;\n `,\n sizeSmall: css`\n ${PADDING_BLOCK}: 8px;\n ${PADDING_INLINE}: 12px;\n `,\n // Title + sort ActionIcon row (not a button — the ActionIcon owns the click).\n sortButton: css`\n display: inline-flex;\n gap: 4px;\n align-items: center;\n\n min-width: 0;\n max-width: 100%;\n `,\n // Matches the filter trigger: small ActionIcon with a slight negative margin so the\n // 24px block does not grow the header.\n sortCaret: css`\n flex: none;\n margin-block: -4px;\n `,\n sortTitle: css`\n cursor: pointer;\n min-width: 0;\n `,\n sortedColumn: css`\n ${p}-tbody > tr > &${p}-cell {\n background: ${cssVar.colorFillQuaternary};\n }\n `,\n spinContainer: css`\n position: relative;\n `,\n table: css`\n font-size: 14px;\n color: ${cssVar.colorText};\n background: ${cssVar.colorBgContainer};\n\n & table {\n border-spacing: 0;\n border-collapse: separate;\n width: 100%;\n text-align: start;\n }\n\n /* ============================== Cell ============================== */\n & ${p}-cell, & ${p}-thead > tr > th,\n & ${p}-tbody > tr > td,\n & tfoot > tr > th,\n & tfoot > tr > td {\n position: relative;\n padding-block: var(${PADDING_BLOCK});\n padding-inline: var(${PADDING_INLINE});\n overflow-wrap: break-word;\n }\n\n & ${p}-thead > tr > th,\n & ${p}-thead > tr > td {\n font-size: 13px;\n font-weight: 500;\n color: ${cssVar.colorTextSecondary};\n text-align: start;\n\n background: ${cssVar.colorBgContainer};\n box-shadow:\n inset 0 -1px 0 ${cssVar.colorBorderSecondary},\n inset 0 999px 0 ${cssVar.colorFillQuaternary};\n\n &[colspan]:not([colspan='1']) {\n text-align: center;\n }\n }\n\n /* th covers rowScope row headers. */\n & ${p}-tbody > tr > td,\n & ${p}-tbody > tr > th {\n border-block-end: ${border};\n\n font-weight: inherit;\n font-variant-numeric: tabular-nums;\n text-align: start;\n\n background: ${cssVar.colorBgContainer};\n\n transition: background-color ${cssVar.motionDurationMid};\n }\n\n &:not(${p}-outlined) ${p}-tbody > tr:last-child > td,\n &:not(${p}-outlined) ${p}-tbody > tr:last-child > th {\n border-block-end: 0;\n }\n\n & ${p}-tbody > tr${p}-placeholder > td {\n padding-block: 32px;\n color: ${cssVar.colorTextDescription};\n text-align: center;\n }\n\n /* Skeleton loading fills the placeholder like real body rows. */\n & ${p}-tbody > tr${p}-placeholder > td:has([data-table-skeleton]) {\n padding: 0;\n color: inherit;\n text-align: start;\n vertical-align: top;\n }\n\n & ${p}-cell-scrollbar:not([rowspan]) {\n box-shadow: 0 1px 0 1px ${cssVar.colorFillQuaternary};\n }\n\n /* ============================ Ellipsis ============================ */\n & ${p}-cell-ellipsis {\n overflow: hidden;\n text-overflow: ellipsis;\n word-break: keep-all;\n white-space: nowrap;\n\n &${p}-cell-fix-start-shadow, &${p}-cell-fix-end-shadow {\n overflow: visible;\n\n & ${p}-cell-content {\n overflow: hidden;\n display: block;\n text-overflow: ellipsis;\n white-space: nowrap;\n }\n }\n }\n\n /* ========================== Title / Footer ========================= */\n & > ${p}-title, & > ${p}-footer {\n padding-block: var(${PADDING_BLOCK});\n padding-inline: var(${PADDING_INLINE});\n }\n\n & > ${p}-footer {\n color: ${cssVar.colorText};\n background: ${cssVar.colorFillQuaternary};\n }\n\n /* ============================== Fixed ============================= */\n & ${p}-container {\n position: relative;\n\n &::before,\n &::after {\n ${fixShadowBase}\n z-index: calc(var(--columns-count, 1) * 2 + ${Z_FIXED} + 1);\n }\n\n &::before {\n inset-inline-start: 0;\n }\n\n &::after {\n inset-inline-end: 0;\n }\n }\n\n &${p}-has-fix-start > ${p}-container::before, &${p}-has-fix-end > ${p}-container::after {\n display: none;\n }\n\n &${p}-fix-start-shadow-show > ${p}-container::before {\n ${startShadow}\n }\n\n &${p}-fix-end-shadow-show > ${p}-container::after {\n ${endShadow}\n }\n\n /* Must outrank the generic cell rule that sets position: relative. */\n &\n ${p}-thead\n > tr\n > th${p}-cell-fix,\n &\n ${p}-tbody\n > tr\n > td${p}-cell-fix,\n &\n ${p}-cell${p}-cell-fix {\n position: sticky;\n z-index: calc(var(--z-offset-reverse) + ${Z_FIXED});\n }\n\n & ${p}-cell-fix {\n background: ${cssVar.colorBgContainer};\n\n &::after {\n ${fixShadowBase}\n }\n }\n\n & ${p}-cell-fix-start::after {\n inset-inline-start: 100%;\n }\n\n & ${p}-cell-fix-end::after {\n inset-inline-end: 100%;\n }\n\n & ${p}-cell-fix-start-shadow-show::after {\n ${startShadow}\n }\n\n & ${p}-cell-fix-end-shadow-show::after {\n ${endShadow}\n }\n\n /* ============================= Sticky ============================= */\n & ${p}-sticky-holder {\n position: sticky;\n z-index: calc(var(--columns-count, 1) * 2 + ${Z_FIXED} + 1);\n background: ${cssVar.colorBgContainer};\n }\n\n & ${p}-sticky-scroll {\n position: sticky;\n z-index: calc(var(--columns-count, 1) * 2 + ${Z_FIXED} + 1);\n inset-block-end: 0;\n\n display: flex;\n align-items: center;\n\n height: 8px !important;\n border-block-start: ${border};\n\n opacity: 0.65;\n background: ${cssVar.colorFillQuaternary};\n\n &-bar {\n position: absolute;\n inset-block-end: 0;\n\n height: 8px;\n border-radius: 100px;\n\n background-color: ${cssVar.colorFill};\n\n transition:\n all ${cssVar.motionDurationSlow},\n transform 0s;\n\n &:hover,\n &-active {\n background-color: ${cssVar.colorFillSecondary};\n }\n }\n }\n\n /* ============================ Selection =========================== */\n & ${p}-selection-col {\n width: ${SELECTION_COLUMN_WIDTH}px;\n\n &${p}-selection-col-with-dropdown {\n width: ${SELECTION_COLUMN_WIDTH + SELECTION_DROPDOWN_WIDTH}px;\n }\n }\n\n &${p}-outlined ${p}-selection-col {\n width: ${SELECTION_COLUMN_WIDTH + 16}px;\n\n &${p}-selection-col-with-dropdown {\n width: ${SELECTION_COLUMN_WIDTH + SELECTION_DROPDOWN_WIDTH + 16}px;\n }\n }\n\n & ${p}-tbody > tr${p}-row-selected > td {\n background: color-mix(in srgb, ${cssVar.colorBgContainer}, ${cssVar.colorPrimary} 6%);\n\n &${p}-cell-row-hover {\n background: color-mix(in srgb, ${cssVar.colorBgContainer}, ${cssVar.colorPrimary} 10%);\n }\n }\n\n /* ========================= Expand / Tree ========================== */\n & ${p}-expand-icon-col {\n width: ${EXPAND_COLUMN_WIDTH}px;\n }\n\n & ${p}-row-expand-icon-cell {\n text-align: center;\n\n & ${p}-row-expand-icon {\n float: none;\n display: inline-flex;\n vertical-align: sub;\n }\n }\n\n & ${p}-row-indent {\n float: inline-start;\n height: 1px;\n }\n\n & ${p}-row-expand-icon {\n float: inline-start;\n flex: none;\n vertical-align: middle;\n\n &${p}-row-expand-icon-spaced {\n display: inline-block;\n width: 24px;\n height: 24px;\n visibility: hidden;\n }\n }\n\n & ${p}-row-indent + ${p}-row-expand-icon {\n margin-block: -1px;\n margin-inline-end: 8px;\n }\n\n & tr${p}-expanded-row > td,\n & tr${p}-expanded-row:hover > td {\n background: ${cssVar.colorFillQuaternary};\n }\n\n & ${p}-expanded-row-fixed {\n position: relative;\n\n margin-block: calc(var(${PADDING_BLOCK}) * -1);\n margin-inline: calc(var(${PADDING_INLINE}) * -1);\n padding-block: var(${PADDING_BLOCK});\n padding-inline: var(${PADDING_INLINE});\n }\n\n /* ========================== Nested table ========================== */\n\n /* A table alone in a cell fills it, starting after the expand column. */\n &\n ${p}-tbody\n > tr\n > td\n > ${p}-wrapper:only-child,\n &\n ${p}-tbody\n > tr\n > td\n > ${p}-expanded-row-fixed\n > ${p}-wrapper:only-child {\n & ${p} {\n margin-block: calc(var(${PADDING_BLOCK}) * -1);\n margin-inline: calc(${EXPAND_COLUMN_WIDTH}px - var(${PADDING_INLINE}))\n calc(var(${PADDING_INLINE}) * -1);\n }\n\n & ${p}-tbody > tr:last-child > td {\n border-block-end: 0;\n }\n\n /* The outer cell already draws the frame: keep only the start edge of a bordered nest. */\n & ${p}${p}-outlined {\n & > ${p}-title, & > ${p}-container, & > ${p}-footer {\n border-block: 0;\n border-inline-end: 0;\n border-radius: 0;\n }\n\n & > ${p}-title + ${p}-container {\n border-block-start: ${border};\n }\n\n &:has(> ${p}-footer) > ${p}-container {\n border-block-end: ${border};\n }\n }\n }\n\n &${p}-outlined ${p}-tbody > tr > td > ${p}-expanded-row-fixed {\n margin-inline: calc((var(${PADDING_INLINE}) + 1px) * -1);\n }\n\n /* ============================= Summary ============================ */\n & ${p}-summary {\n position: relative;\n z-index: ${Z_FIXED};\n background: ${cssVar.colorBgContainer};\n\n & > tr > th,\n & > tr > td {\n border-block-end: ${border};\n }\n }\n\n & div${p}-summary {\n box-shadow: 0 -1px 0 ${cssVar.colorBorderSecondary};\n }\n\n /* A fixed summary under \\`sticky\\` is a sticky holder too; keep it sticky (antd orders sticky last). */\n & ${p}-summary${p}-sticky-holder {\n position: sticky;\n z-index: calc(var(--columns-count, 1) * 2 + ${Z_FIXED} + 1);\n }\n\n & tfoot > tr > th,\n & tfoot > tr > td {\n border-block-start: ${border};\n }\n\n /* ============================= Virtual ============================ */\n & ${p}-tbody-virtual {\n &\n ${p}-tbody-virtual-holder-inner\n > ${p}-row,\n &\n ${p}-tbody-virtual-holder-inner\n > div:not(${p}-row)\n > ${p}-row {\n display: flex;\n box-sizing: border-box;\n width: 100%;\n\n & > ${p}-cell {\n align-content: center;\n }\n }\n\n & ${p}-cell {\n border-block-end: ${border};\n background: ${cssVar.colorBgContainer};\n transition: background-color ${cssVar.motionDurationMid};\n }\n\n & ${p}-tbody-virtual-scrollbar {\n cursor: pointer;\n\n &:hover {\n background-color: ${cssVar.colorFillQuaternary};\n }\n }\n\n & ${p}-expanded-row ${p}-expanded-row-cell${p}-expanded-row-cell-fixed {\n position: sticky;\n inset-inline-start: 0;\n overflow: hidden;\n width: calc(var(--virtual-width) - 1px);\n }\n }\n `,\n };\n});\n"],"mappings":"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"}
1
+ {"version":3,"file":"style.mjs","names":[],"sources":["../../../src/base-ui/Table/style.ts"],"sourcesContent":["import { createStaticStyles } from 'antd-style';\n\n/** Own prefix so rc-table classNames never collide with antd's global `.ant-table` CSS. */\nexport const PREFIX_CLS = 'lobe-table';\n\nconst p = `.${PREFIX_CLS}`;\n\n// Cell padding comes from the size class through these vars, so title / footer / expanded rows\n// can reuse (and negate) it.\nconst PADDING_BLOCK = '--lobe-table-padding-block';\nconst PADDING_INLINE = '--lobe-table-padding-inline';\n\n// Matches antd's `zIndexTableFixed`.\nconst Z_FIXED = 2;\n\n// antd `expandColumnWidth`; nested tables start after it.\nexport const EXPAND_COLUMN_WIDTH = 48;\n\n// antd `selectionColumnWidth`, plus the `selections` trigger when there is one.\nexport const SELECTION_COLUMN_WIDTH = 32;\nexport const SELECTION_DROPDOWN_WIDTH = 24;\n\n/** Rows of this table's own sections only, so the rules never leak into nested tables. */\nconst ownRows = ['content', 'header', 'body', 'summary']\n .map((section) => `& > ${p}-container > ${p}-${section} > table > * > tr`)\n .join(', ');\nconst ownCells = (cell: string) =>\n ownRows\n .split(', ')\n .map((row) => `${row} > ${cell}`)\n .join(', ');\n\nexport const styles = createStaticStyles(({ css, cssVar }) => {\n // Light colorFill / dark colorFillSecondary (see --lobe-fill-border in ThemeProvider).\n const borderColor = `var(--lobe-fill-border, ${cssVar.colorFill})`;\n const border = `1px solid ${borderColor}`;\n // Dark: colorFillQuaternary on the clipped container; unset in light so variants keep their fills.\n const surface = (light: string) => `var(--lobe-table-surface, ${light})`;\n // Cell background. Every table root resets it to colorBgContainer (so nested / borderless\n // tables never inherit it); outlined / filled switch it to transparent in dark.\n const cellBg = `var(--lobe-table-cell, ${cssVar.colorBgContainer})`;\n // The variant fill that opaque composites (fixed cells, sticky holder, summary) repeat\n // once. Reset to transparent per root; outlined / filled set it to the dark surface.\n const fill = 'var(--lobe-table-fill, transparent)';\n // Row states: translucent fills on the cell only (never on tr), same for every variant,\n // normal / fixed cells and the virtual body.\n const hoverBg = cssVar.colorFillTertiary;\n const selectedBg = `color-mix(in srgb, ${cssVar.colorPrimary} 6%, transparent)`;\n const selectedHoverBg = `color-mix(in srgb, ${cssVar.colorPrimary} 10%, transparent)`;\n // Fixed cells are see-through. Their frosted backdrop is not painted per cell (each box\n // would blur on its own and show seams at every row): FixedFrost portals one sticky pane\n // per fixed side into each scroll host (frostRail / frostStart / frostEnd below). The\n // sticky header is a single element and blurs itself.\n const frost = `\n -webkit-backdrop-filter: blur(16px);\n backdrop-filter: blur(16px);\n `;\n const variantVars = `\n --lobe-table-cell: var(--lobe-table-cell-bg, ${cssVar.colorBgContainer});\n --lobe-table-fill: var(--lobe-table-surface, transparent);\n `;\n const fixShadowBase = `\n pointer-events: none;\n content: '';\n position: absolute;\n inset-block: 0 -1px;\n width: 30px;\n transition: box-shadow ${cssVar.motionDurationSlow};\n `;\n const startShadow = `box-shadow: inset 10px 0 8px -8px ${cssVar.colorSplit};`;\n const endShadow = `box-shadow: inset -10px 0 8px -8px ${cssVar.colorSplit};`;\n\n return {\n outlined: css`\n &${p}-outlined {\n ${variantVars}\n /* The square root must not paint behind the rounded frame: the clipped container\n is the ONE layer carrying the body (light colorBgContainer, dark\n colorFillQuaternary). Title / footer are siblings, so they paint it once too. */\n background: transparent;\n\n & > ${p}-container {\n background: ${surface(cssVar.colorBgContainer)};\n }\n\n & > ${p}-title, & > ${p}-footer {\n background: ${surface(cssVar.colorBgContainer)};\n }\n\n & > ${p}-title {\n border: ${border};\n border-block-end: 0;\n border-start-start-radius: ${cssVar.borderRadiusLG};\n border-start-end-radius: ${cssVar.borderRadiusLG};\n }\n\n /* The container draws the full frame (incl. bottom). Last-row borders used to stand\n in for the bottom edge, but with scroll.y / virtual the last row sits inside the\n body viewport - overflow:clip + radius then eats that line at the rounded corners.\n No column dividers (grouped headers included): rows are split horizontally only. */\n & > ${p}-container {\n overflow: clip;\n border: ${border};\n border-radius: ${cssVar.borderRadiusLG};\n\n /* Same lift as the dashboard Surface card (both modes). Outer shadow on the framed\n container is not clipped by its own overflow. */\n box-shadow: rgb(0 0 0 / 4%) 0 1px 2px 0;\n }\n\n & > ${p}-title + ${p}-container {\n border-start-start-radius: 0;\n border-start-end-radius: 0;\n }\n\n &:has(> ${p}-footer) > ${p}-container {\n border-block-end: 0;\n border-end-start-radius: 0;\n border-end-end-radius: 0;\n }\n\n & > ${p}-footer {\n border: ${border};\n border-block-start: 0;\n border-end-start-radius: ${cssVar.borderRadiusLG};\n border-end-end-radius: ${cssVar.borderRadiusLG};\n }\n\n /* Every header row (including the last) draws one bottom edge — no inset\n shadow underneath, or group headers look double-thick. */\n & > ${p}-container > * > table > thead > tr > th {\n border-block-end: ${border};\n\n /* Extra FillQuaternary layer on top of the container fill. */\n background: ${cellBg};\n box-shadow: inset 0 999px 0 ${cssVar.colorFillQuaternary};\n }\n\n /* Fixed cells: see-through (container fill shows) + backdrop blur only. */\n & ${p}-tbody > tr > td${p}-cell-fix, & ${p}-tbody-virtual ${p}-cell${p}-cell-fix {\n background: transparent;\n box-shadow: none;\n }\n\n /* Header: container fill + one Quaternary wash (box-shadow), like other th. */\n & ${p}-thead > tr > th${p}-cell-fix, & ${p}-thead > tr > td${p}-cell-fix {\n background: transparent;\n box-shadow: inset 0 999px 0 ${cssVar.colorFillQuaternary};\n }\n }\n `,\n\n /* Mirrors Block \\`filled\\`: one colorFillTertiary (dark: colorFillQuaternary on the clipped\n container) surface straight on the parent and no frame border. */\n /* FixedFrost rail: absolute over the table (or the virtual row layer), z-index 1 puts it\n above scrolling cells (z auto) and under fixed cells (z >= 2). */\n frostRail: css`\n pointer-events: none;\n\n position: absolute;\n z-index: 1;\n inset-block-start: 0;\n inset-inline-start: 0;\n\n display: flex;\n `,\n frostStart: css`\n position: sticky;\n inset-inline-start: 0;\n flex: none;\n height: 100%;\n ${frost}\n `,\n frostEnd: css`\n position: sticky;\n inset-inline-end: 0;\n\n flex: none;\n\n height: 100%;\n margin-inline-start: auto;\n ${frost}\n `,\n filled: css`\n &${p}-filled {\n ${variantVars}\n /* Filled owns its fill in both modes (Block filled = colorFillTertiary; dark uses the\n Quaternary surface) and its opaque base is the page behind it, not colorBgContainer. */\n --lobe-table-fill: var(--lobe-table-surface, ${cssVar.colorFillTertiary});\n\n /* Root stays clear (square box, would bleed past the rounded corners); the clipped\n container is the ONE fill layer: light FillTertiary, dark colorFillQuaternary. */\n background: transparent;\n\n & > ${p}-title, & > ${p}-footer {\n border-radius: ${cssVar.borderRadiusLG};\n background: ${fill};\n }\n\n & > ${p}-title {\n border-end-start-radius: 0;\n border-end-end-radius: 0;\n }\n\n & > ${p}-footer {\n border-start-start-radius: 0;\n border-start-end-radius: 0;\n }\n\n & > ${p}-container {\n overflow: clip;\n border-radius: ${cssVar.borderRadiusLG};\n background: ${fill};\n }\n\n & > ${p}-title + ${p}-container {\n border-start-start-radius: 0;\n border-start-end-radius: 0;\n }\n\n &:has(> ${p}-footer) > ${p}-container {\n border-end-start-radius: 0;\n border-end-end-radius: 0;\n }\n\n /* Header band: one extra FillQuaternary wash over the container fill. */\n & ${p}-thead > tr > th,\n & ${p}-thead > tr > td {\n background: transparent;\n box-shadow:\n inset 0 -1px 0 ${borderColor},\n inset 0 999px 0 ${cssVar.colorFillQuaternary};\n }\n\n /* Row dividers stay on (base border rule); body is clear over the container fill. */\n & ${p}-tbody > tr > td,\n & ${p}-tbody > tr > th,\n & ${p}-tbody-virtual ${p}-cell {\n background: transparent;\n }\n\n /* Fixed cells: see-through + blur; header keeps the same divider + wash as every th. */\n & ${p}-thead > tr > th${p}-cell-fix, & ${p}-thead > tr > td${p}-cell-fix {\n background: transparent;\n box-shadow:\n inset 0 -1px 0 ${borderColor},\n inset 0 999px 0 ${cssVar.colorFillQuaternary};\n }\n\n & ${p}-tbody > tr > td${p}-cell-fix {\n background: transparent;\n box-shadow: none;\n }\n }\n `,\n /**\n * Borderless: everything but the header is see-through, so the table sits on whatever\n * surface hosts it. Hover / selected rows are translucent fills. Fixed (sticky) cells\n * are see-through with a frosted backdrop so scrolled content stays obscured.\n */\n borderless: css`\n && {\n background: transparent;\n }\n\n && ${p}-tbody > tr > td,\n && ${p}-tbody > tr > th,\n && ${p}-tbody-virtual ${p}-cell, && ${p}-summary, && ${p}-summary > tr > td,\n && ${p}-summary > tr > th,\n && > ${p}-footer {\n background: transparent;\n }\n\n && ${p}-tbody > tr > td${p}-cell-row-hover, && ${p}-tbody-virtual ${p}-row:hover > ${p}-cell {\n background: ${hoverBg};\n }\n\n && ${p}-tbody > tr${p}-row-selected > td {\n background: ${selectedBg};\n\n &${p}-cell-row-hover {\n background: ${selectedHoverBg};\n }\n }\n\n &&\n ${p}-tbody\n > tr\n > td${p}-cell-fix,\n &&\n ${p}-tbody\n > tr\n > th${p}-cell-fix,\n &&\n ${p}-tbody-virtual\n ${p}-cell${p}-cell-fix {\n background: transparent;\n }\n\n && ${p}-tbody > tr > td${p}-cell-fix${p}-cell-row-hover {\n background: ${hoverBg};\n }\n\n && ${p}-tbody > tr${p}-row-selected > td${p}-cell-fix {\n background: ${selectedBg};\n\n &${p}-cell-row-hover {\n background: ${selectedHoverBg};\n }\n }\n `,\n /**\n * Grouped (multi-level) headers only: column dividers in header and body so the\n * group spans stay readable. Plain tables never get vertical dividers.\n */\n grouped: css`\n ${ownCells('th')}, ${ownCells('td')} {\n border-inline-end: ${border};\n }\n\n & ${p}-tbody-virtual ${p}-cell {\n border-inline-end: ${border};\n }\n\n /* Outlined: the container already draws the trailing edge. Other variants: the\n rightmost body cell and first header row cell stop at the table edge. */\n &:not(${p}-outlined) ${p}-tbody > tr > td:last-child,\n &:not(${p}-outlined) ${p}-thead > tr:first-child > th:last-child,\n &${p}-outlined ${p}-tbody > tr > td:last-child,\n &${p}-outlined ${p}-thead > tr:first-child > th:last-child {\n border-inline-end: 0;\n }\n `,\n clickable: css`\n cursor: pointer;\n `,\n /** Title text of an `ellipsis` column; truncates inside the sort button / header controls. */\n columnTitle: css`\n overflow: hidden;\n\n min-width: 0;\n\n text-overflow: ellipsis;\n word-break: keep-all;\n white-space: nowrap;\n `,\n filterActive: css`\n &&,\n &&:hover {\n color: ${cssVar.colorPrimary};\n }\n `,\n filterButton: css`\n flex: none;\n margin-block: -4px;\n `,\n filterButtons: css`\n display: flex;\n gap: 8px;\n align-items: center;\n justify-content: space-between;\n\n padding-block: 7px;\n padding-inline: 8px;\n border-block-start: 1px solid ${cssVar.colorSplit};\n `,\n filterCheckAll: css`\n margin-block-end: 4px;\n padding-inline: 4px;\n `,\n filterDropdown: css`\n display: flex;\n flex-direction: column;\n min-width: 120px;\n `,\n filterEmpty: css`\n padding-block: 16px;\n padding-inline: 0;\n `,\n filterGroup: css`\n display: flex;\n flex-direction: column;\n\n & > div:not(:first-child) {\n padding-inline-start: 20px;\n }\n `,\n filterGroupTitle: css`\n padding-block: 5px;\n padding-inline: 8px;\n font-size: 12px;\n color: ${cssVar.colorTextDescription};\n `,\n filterItem: css`\n display: flex;\n align-items: center;\n\n padding-block: 5px;\n padding-inline: 8px;\n border-radius: ${cssVar.borderRadiusSM};\n\n white-space: nowrap;\n\n &:hover {\n background: ${cssVar.colorFillTertiary};\n }\n\n & > label {\n cursor: pointer;\n flex: 1;\n }\n `,\n filterMenu: css`\n overflow: auto;\n display: flex;\n flex-direction: column;\n\n max-height: 264px;\n padding: 4px;\n `,\n filterPopup: css`\n overflow: hidden;\n padding: 0;\n `,\n filterSearch: css`\n padding: 8px;\n border-block-end: 1px solid ${cssVar.colorSplit};\n `,\n filterTree: css`\n overflow: auto;\n max-height: 264px;\n padding: 8px;\n `,\n headerInner: css`\n display: inline-flex;\n gap: 6px;\n align-items: center;\n\n min-width: 0;\n max-width: 100%;\n\n vertical-align: middle;\n `,\n hoverable: css`\n /* &&& outranks the variant cell rules (filled clear cells, transparent fixed cells). */\n &&& ${p}-tbody > tr > ${p}-cell-row-hover, &&& ${p}-tbody-virtual ${p}-row:hover > ${p}-cell {\n background: ${hoverBg};\n }\n `,\n loading: css`\n position: absolute;\n z-index: calc(var(--columns-count, 1) * 2 + ${Z_FIXED} + 2);\n inset: 0;\n\n display: flex;\n flex-direction: column;\n gap: 8px;\n align-items: center;\n justify-content: center;\n\n color: ${cssVar.colorTextSecondary};\n\n background: color-mix(in srgb, ${cssVar.colorBgContainer} 60%, transparent);\n `,\n /**\n * Empty-state loading body. Tracks follow leaf column widths so bars sit under the\n * live header; cell padding reuses the size CSS vars on the table ancestor.\n */\n skeleton: css`\n display: flex;\n flex-direction: column;\n\n width: 100%;\n min-width: 0;\n\n text-align: start;\n `,\n skeletonCell: css`\n display: flex;\n align-items: center;\n\n min-width: 0;\n padding-block: var(${PADDING_BLOCK});\n padding-inline: var(${PADDING_INLINE});\n `,\n skeletonRow: css`\n display: grid;\n align-items: stretch;\n\n width: 100%;\n min-width: 0;\n border-block-end: 1px solid ${borderColor};\n\n &:last-child {\n border-block-end: 0;\n }\n `,\n // antd `paginationMargin` (token.margin): keep the pager off the table above and off\n // whatever sits below the table.\n pagination: css`\n display: flex;\n margin-block: 16px;\n `,\n paginationCenter: css`\n justify-content: center;\n `,\n paginationEnd: css`\n justify-content: flex-end;\n `,\n paginationStart: css`\n justify-content: flex-start;\n `,\n paginationTop: css`\n margin-block: 0 16px;\n `,\n root: css`\n min-width: 0;\n `,\n /** Header box of the selection column; `selectionExtra` hangs off its end. */\n selection: css`\n position: relative;\n display: inline-flex;\n flex-direction: column;\n vertical-align: middle;\n `,\n selectionColumn: css`\n && {\n padding-inline: 8px;\n text-align: center;\n }\n\n & > * {\n vertical-align: middle;\n }\n `,\n selectionExtra: css`\n position: absolute;\n z-index: 1;\n inset-block-start: 0;\n\n display: flex;\n align-items: center;\n\n height: 100%;\n margin-inline-start: 100%;\n padding-inline-start: 2px;\n `,\n selectionRadioGroup: css`\n display: inline-flex;\n vertical-align: middle;\n `,\n selectionTrigger: css`\n flex: none;\n margin-block: -4px;\n `,\n sizeLarge: css`\n ${PADDING_BLOCK}: 16px;\n ${PADDING_INLINE}: 16px;\n\n /* Same as VIRTUAL_ROW_HEIGHT in Table.tsx (padding * 2 + 22px line + 1px divider). */\n --lobe-table-virtual-row-height: calc(16px * 2 + 23px);\n `,\n sizeMedium: css`\n ${PADDING_BLOCK}: 12px;\n ${PADDING_INLINE}: 16px;\n\n /* Same as VIRTUAL_ROW_HEIGHT in Table.tsx (padding * 2 + 22px line + 1px divider). */\n --lobe-table-virtual-row-height: calc(12px * 2 + 23px);\n `,\n sizeSmall: css`\n ${PADDING_BLOCK}: 8px;\n ${PADDING_INLINE}: 12px;\n\n /* Same as VIRTUAL_ROW_HEIGHT in Table.tsx (padding * 2 + 22px line + 1px divider). */\n --lobe-table-virtual-row-height: calc(8px * 2 + 23px);\n `,\n // Title + sort ActionIcon row (not a button — the ActionIcon owns the click).\n sortButton: css`\n display: inline-flex;\n gap: 4px;\n align-items: center;\n\n min-width: 0;\n max-width: 100%;\n `,\n // Matches the filter trigger: small ActionIcon with a slight negative margin so the\n // 24px block does not grow the header.\n sortCaret: css`\n flex: none;\n margin-block: -4px;\n `,\n sortTitle: css`\n cursor: pointer;\n min-width: 0;\n `,\n sortedColumn: css`\n ${p}-tbody > tr > &${p}-cell {\n background: ${cssVar.colorFillQuaternary};\n }\n `,\n spinContainer: css`\n position: relative;\n `,\n table: css`\n /* Reset per root so nested / borderless tables never inherit a parent's variant vars. */\n --lobe-table-cell: ${cssVar.colorBgContainer};\n --lobe-table-fill: transparent;\n\n font-size: 14px;\n color: ${cssVar.colorText};\n background: ${cssVar.colorBgContainer};\n\n & table {\n border-spacing: 0;\n border-collapse: separate;\n width: 100%;\n text-align: start;\n }\n\n /* ============================== Cell ============================== */\n & ${p}-cell, & ${p}-thead > tr > th,\n & ${p}-tbody > tr > td,\n & tfoot > tr > th,\n & tfoot > tr > td {\n position: relative;\n\n padding-block: var(${PADDING_BLOCK});\n padding-inline: var(${PADDING_INLINE});\n\n overflow-wrap: break-word;\n\n /* The global \\`* { vertical-align: baseline }\\` reset drops the UA's middle for cells. */\n vertical-align: middle;\n }\n\n /* Row-merged body cells (rowSpan > 1, table and virtual body alike) get vertical\n dividers so the block reads apart from the neighbour rows' lines. Drawn on ::before\n (::after is the fixed-column scroll shadow) so cell box-shadows stay untouched. The\n first / last column skip the edge the frame or table edge already provides. */\n & ${p}-tbody > tr > td[rowspan]:not([rowspan='0'], [rowspan='1'])::before,\n & ${p}-tbody-virtual ${p}-cell[rowspan]:not([rowspan='0'], [rowspan='1'])::before {\n pointer-events: none;\n content: '';\n\n position: absolute;\n inset: 0;\n\n border-inline: ${border};\n }\n\n & ${p}-tbody > tr > td[rowspan]:first-child::before,\n & ${p}-tbody-virtual ${p}-cell[rowspan]:first-child::before {\n border-inline-start: 0;\n }\n\n & ${p}-tbody > tr > td[rowspan]:last-child::before,\n & ${p}-tbody-virtual ${p}-cell[rowspan]:last-child::before {\n border-inline-end: 0;\n }\n\n & ${p}-thead > tr > th,\n & ${p}-thead > tr > td {\n font-size: 13px;\n font-weight: 500;\n color: ${cssVar.colorTextSecondary};\n text-align: start;\n\n /* Clear in dark (outlined) so the container fill shows; Quaternary is the extra header layer. */\n background: ${cellBg};\n box-shadow:\n inset 0 -1px 0 ${borderColor},\n inset 0 999px 0 ${cssVar.colorFillQuaternary};\n\n &[colspan]:not([colspan='1']) {\n text-align: center;\n }\n }\n\n /* th covers rowScope row headers. */\n & ${p}-tbody > tr > td,\n & ${p}-tbody > tr > th {\n border-block-end: ${border};\n\n font-weight: inherit;\n font-variant-numeric: tabular-nums;\n text-align: start;\n\n /* Clear in dark (outlined) so the container fill shows through. */\n background: ${cellBg};\n\n transition: background-color ${cssVar.motionDurationMid};\n }\n\n /* Filled / outlined drop the last body divider: filled because its fill is the edge,\n outlined because the container now draws the frame bottom (avoids a double line, and\n keeps the outline when scroll.y / virtual would otherwise scroll the last-row edge\n away). Borderless keeps it as the closing rule under the rows. */\n &${p}-filled ${p}-tbody > tr:last-child > td,\n &${p}-filled ${p}-tbody > tr:last-child > th,\n &${p}-outlined ${p}-tbody > tr:last-child > td,\n &${p}-outlined ${p}-tbody > tr:last-child > th {\n border-block-end: 0;\n }\n\n /* Borderless with a summary: tfoot draws its own top rule, so skip the last-row one. */\n &${p}-borderless table:has(> tfoot) > ${p}-tbody > tr:last-child > td,\n &${p}-borderless table:has(> tfoot) > ${p}-tbody > tr:last-child > th {\n border-block-end: 0;\n }\n\n & ${p}-tbody > tr${p}-placeholder > td {\n padding-block: 32px;\n color: ${cssVar.colorTextDescription};\n text-align: center;\n }\n\n /* Skeleton loading fills the placeholder like real body rows. */\n & ${p}-tbody > tr${p}-placeholder > td:has([data-table-skeleton]) {\n padding: 0;\n color: inherit;\n text-align: start;\n vertical-align: top;\n }\n\n & ${p}-cell-scrollbar:not([rowspan]) {\n box-shadow: 0 1px 0 1px ${cssVar.colorFillQuaternary};\n }\n\n /* ============================ Ellipsis ============================ */\n & ${p}-cell-ellipsis {\n overflow: hidden;\n text-overflow: ellipsis;\n word-break: keep-all;\n white-space: nowrap;\n\n &${p}-cell-fix-start-shadow, &${p}-cell-fix-end-shadow {\n overflow: visible;\n\n & ${p}-cell-content {\n overflow: hidden;\n display: block;\n text-overflow: ellipsis;\n white-space: nowrap;\n }\n }\n }\n\n /* ========================== Title / Footer ========================= */\n & > ${p}-title, & > ${p}-footer {\n padding-block: var(${PADDING_BLOCK});\n padding-inline: var(${PADDING_INLINE});\n }\n\n & > ${p}-footer {\n color: ${cssVar.colorText};\n background: ${cssVar.colorFillQuaternary};\n }\n\n /* ============================== Fixed ============================= */\n & ${p}-container {\n position: relative;\n\n &::before,\n &::after {\n ${fixShadowBase}\n z-index: calc(var(--columns-count, 1) * 2 + ${Z_FIXED} + 1);\n }\n\n &::before {\n inset-inline-start: 0;\n }\n\n &::after {\n inset-inline-end: 0;\n }\n }\n\n &${p}-has-fix-start > ${p}-container::before, &${p}-has-fix-end > ${p}-container::after {\n display: none;\n }\n\n &${p}-fix-start-shadow-show > ${p}-container::before {\n ${startShadow}\n }\n\n &${p}-fix-end-shadow-show > ${p}-container::after {\n ${endShadow}\n }\n\n /* Must outrank the generic cell rule that sets position: relative. */\n &\n ${p}-thead\n > tr\n > th${p}-cell-fix,\n &\n ${p}-tbody\n > tr\n > td${p}-cell-fix,\n &\n ${p}-cell${p}-cell-fix {\n position: sticky;\n z-index: calc(var(--z-offset-reverse) + ${Z_FIXED});\n }\n\n & ${p}-cell-fix {\n background: transparent;\n\n &::after {\n ${fixShadowBase}\n }\n }\n\n & ${p}-cell-fix-start::after {\n inset-inline-start: 100%;\n }\n\n & ${p}-cell-fix-end::after {\n inset-inline-end: 100%;\n }\n\n & ${p}-cell-fix-start-shadow-show::after {\n ${startShadow}\n }\n\n & ${p}-cell-fix-end-shadow-show::after {\n ${endShadow}\n }\n\n /* ============================= Sticky ============================= */\n & ${p}-sticky-holder {\n position: sticky;\n z-index: calc(var(--columns-count, 1) * 2 + ${Z_FIXED} + 1);\n background: transparent;\n\n /* The whole sticky header is one element, so it blurs as one continuous block. */\n ${frost}\n }\n\n & ${p}-sticky-scroll {\n position: sticky;\n z-index: calc(var(--columns-count, 1) * 2 + ${Z_FIXED} + 1);\n inset-block-end: 0;\n }\n\n /* ============================ Selection =========================== */\n & ${p}-selection-col {\n width: ${SELECTION_COLUMN_WIDTH}px;\n\n &${p}-selection-col-with-dropdown {\n width: ${SELECTION_COLUMN_WIDTH + SELECTION_DROPDOWN_WIDTH}px;\n }\n }\n\n &${p}-outlined ${p}-selection-col {\n width: ${SELECTION_COLUMN_WIDTH + 16}px;\n\n &${p}-selection-col-with-dropdown {\n width: ${SELECTION_COLUMN_WIDTH + SELECTION_DROPDOWN_WIDTH + 16}px;\n }\n }\n\n /* The table css carries no hoverable class, so use a fourth & to outrank hover too. */\n &&&& ${p}-tbody > tr${p}-row-selected > td {\n background: ${selectedBg};\n\n &${p}-cell-row-hover {\n background: ${selectedHoverBg};\n }\n }\n\n /* ========================= Expand / Tree ========================== */\n & ${p}-expand-icon-col {\n width: ${EXPAND_COLUMN_WIDTH}px;\n }\n\n & ${p}-row-expand-icon-cell {\n text-align: center;\n\n & ${p}-row-expand-icon {\n float: none;\n display: inline-flex;\n vertical-align: sub;\n }\n }\n\n & ${p}-row-indent {\n float: inline-start;\n height: 1px;\n }\n\n & ${p}-row-expand-icon {\n float: inline-start;\n flex: none;\n vertical-align: middle;\n\n &${p}-row-expand-icon-spaced {\n display: inline-block;\n width: 24px;\n height: 24px;\n visibility: hidden;\n }\n }\n\n & ${p}-row-indent + ${p}-row-expand-icon {\n margin-block: -1px;\n margin-inline-end: 8px;\n }\n\n & tr${p}-expanded-row > td,\n & tr${p}-expanded-row:hover > td {\n background: ${cssVar.colorFillQuaternary};\n }\n\n & ${p}-expanded-row-fixed {\n position: relative;\n\n margin-block: calc(var(${PADDING_BLOCK}) * -1);\n margin-inline: calc(var(${PADDING_INLINE}) * -1);\n padding-block: var(${PADDING_BLOCK});\n padding-inline: var(${PADDING_INLINE});\n }\n\n /* ========================== Nested table ========================== */\n\n /* A table alone in a cell fills it, starting after the expand column. */\n &\n ${p}-tbody\n > tr\n > td\n > ${p}-wrapper:only-child,\n &\n ${p}-tbody\n > tr\n > td\n > ${p}-expanded-row-fixed\n > ${p}-wrapper:only-child {\n & ${p} {\n margin-block: calc(var(${PADDING_BLOCK}) * -1);\n margin-inline: calc(${EXPAND_COLUMN_WIDTH}px - var(${PADDING_INLINE}))\n calc(var(${PADDING_INLINE}) * -1);\n }\n\n & ${p}-tbody > tr:last-child > td {\n border-block-end: 0;\n }\n\n /* The outer cell already draws the frame: keep only the start edge of a bordered nest. */\n & ${p}${p}-outlined {\n & > ${p}-title, & > ${p}-container, & > ${p}-footer {\n border-block: 0;\n border-inline-end: 0;\n border-radius: 0;\n box-shadow: none;\n }\n\n & > ${p}-title + ${p}-container {\n border-block-start: ${border};\n }\n\n &:has(> ${p}-footer) > ${p}-container {\n border-block-end: ${border};\n }\n }\n }\n\n &${p}-outlined ${p}-tbody > tr > td > ${p}-expanded-row-fixed {\n margin-inline: calc((var(${PADDING_INLINE}) + 1px) * -1);\n }\n\n /* ============================= Summary ============================ */\n & ${p}-summary {\n position: relative;\n z-index: ${Z_FIXED};\n\n /* See-through; a sticky summary is a sticky holder and gets its frost there. */\n background: transparent;\n\n & > tr > th,\n & > tr > td {\n border-block-end: ${border};\n }\n }\n\n & div${p}-summary {\n box-shadow: 0 -1px 0 ${borderColor};\n }\n\n /* A fixed summary under \\`sticky\\` is a sticky holder too; keep it sticky (antd orders sticky last). */\n & ${p}-summary${p}-sticky-holder {\n position: sticky;\n z-index: calc(var(--columns-count, 1) * 2 + ${Z_FIXED} + 1);\n }\n\n & tfoot > tr > th,\n & tfoot > tr > td {\n border-block-start: ${border};\n }\n\n /* ============================= Virtual ============================ */\n & ${p}-tbody-virtual {\n &\n ${p}-tbody-virtual-holder-inner\n > ${p}-row,\n &\n ${p}-tbody-virtual-holder-inner\n > div:not(${p}-row)\n > ${p}-row {\n display: flex;\n box-sizing: border-box;\n width: 100%;\n\n /* Virtual rows are locked to the listItemHeight estimate (an integer). Measured\n heights then equal the estimate, so a rowSpan cell (height = summed row sizes)\n ends exactly on the neighbour rows' divider instead of drifting by sub-pixel\n rounding or unmeasured-row estimates. */\n &:not(${p}-row-extra, ${p}-expanded-row) {\n height: var(--lobe-table-virtual-row-height);\n }\n\n & > ${p}-cell {\n align-content: center;\n }\n }\n\n & ${p}-cell {\n border-block-end: ${border};\n background: ${cellBg};\n transition: background-color ${cssVar.motionDurationMid};\n }\n\n & ${p}-expanded-row ${p}-expanded-row-cell${p}-expanded-row-cell-fixed {\n position: sticky;\n inset-inline-start: 0;\n overflow: hidden;\n width: calc(var(--virtual-width) - 1px);\n }\n }\n `,\n };\n});\n"],"mappings":"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"}
package/es/base-ui/Text/style.d.mts CHANGED
@@ -42,7 +42,7 @@ declare const variants: (props?: ({
42
42
  mark?: boolean | null | undefined;
43
43
  shiny?: boolean | null | undefined;
44
44
  strong?: boolean | null | undefined;
45
- type?: "danger" | "success" | "info" | "warning" | "secondary" | null | undefined;
45
+ type?: "danger" | "warning" | "success" | "info" | "secondary" | null | undefined;
46
46
  underline?: boolean | null | undefined;
47
47
  } & import("class-variance-authority/types").ClassProp) | undefined) => string;
48
48
  //#endregion
package/es/dashboard/ConsoleNav/style.mjs CHANGED
@@ -135,7 +135,7 @@ const styles = createStaticStyles(({ css, cssVar, responsive }) => {
135
135
  block-size: 1px;
136
136
 
137
137
  opacity: 0;
138
- background: ${cssVar.colorBorderSecondary};
138
+ background: var(--lobe-fill-border, ${cssVar.colorFill});
139
139
 
140
140
  transition: opacity 200ms ease;
141
141
  }
@@ -400,7 +400,7 @@ const styles = createStaticStyles(({ css, cssVar, responsive }) => {
400
400
  &[data-divided='true'] {
401
401
  margin-block-end: 6px;
402
402
  padding-block-end: 8px;
403
- border-block-end: 1px solid ${cssVar.colorBorderSecondary};
403
+ border-block-end: 1px solid var(--lobe-fill-border, ${cssVar.colorFill});
404
404
  }
405
405
 
406
406
  [data-collapsed='true'] &[data-rail-empty='true'] {
package/es/dashboard/ConsoleNav/style.mjs.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"style.mjs","names":[],"sources":["../../../src/dashboard/ConsoleNav/style.ts"],"sourcesContent":["import { createStaticStyles } from 'antd-style';\n\nexport const styles = createStaticStyles(({ css, cssVar, responsive }) => {\n // Fades out at once on collapse, but waits on expand until the width has room for the text.\n const railFade = `\n transition: opacity 120ms ease 80ms;\n\n [data-collapsed='true'] & {\n opacity: 0;\n transition-delay: 0s;\n }\n\n @media (prefers-reduced-motion: reduce) {\n transition: none;\n }\n `;\n\n return {\n badge: css`\n flex: none;\n\n min-inline-size: 20px;\n padding-inline: 6px;\n border-radius: 999px;\n\n font-size: ${cssVar.fontSizeSM};\n font-variant-numeric: tabular-nums;\n color: ${cssVar.colorError};\n text-align: center;\n\n background: color-mix(in srgb, ${cssVar.colorError} 12%, transparent);\n\n ${railFade}\n `,\n chevron: css`\n flex: none;\n transition:\n transform 160ms ease,\n opacity 120ms ease 80ms;\n\n &[data-expanded='false'] {\n transform: rotate(-90deg);\n }\n\n [data-collapsed='true'] & {\n opacity: 0;\n transition-delay: 0s;\n }\n\n @media (prefers-reduced-motion: reduce) {\n transition: none;\n }\n `,\n indicator: css`\n display: flex;\n flex: none;\n align-items: center;\n justify-content: center;\n\n width: 18px;\n height: 18px;\n margin-inline-start: -6px;\n\n color: ${cssVar.colorTextDescription};\n\n transition: transform 160ms ease;\n\n &[data-expanded='true'] {\n transform: rotate(90deg);\n }\n `,\n dot: css`\n position: absolute;\n inset-block-start: 7px;\n inset-inline-end: 9px;\n\n inline-size: 7px;\n block-size: 7px;\n border-radius: 999px;\n\n opacity: 0;\n background: ${cssVar.colorError};\n\n transition: opacity 120ms ease;\n\n [data-collapsed='true'] & {\n opacity: 1;\n }\n\n @media (prefers-reduced-motion: reduce) {\n transition: none;\n }\n `,\n fold: css`\n display: grid;\n grid-template-rows: 1fr;\n transition:\n grid-template-rows 200ms ease,\n margin 200ms ease,\n opacity 120ms ease;\n\n > div {\n overflow: hidden;\n min-block-size: 0;\n }\n\n &[data-folded='true'] {\n grid-template-rows: 0fr;\n opacity: 0;\n }\n\n &[data-folded='true']:not(:first-child) {\n margin-block-start: -2px;\n }\n\n @media (prefers-reduced-motion: reduce) {\n transition: none;\n }\n `,\n group: css`\n position: relative;\n\n display: flex;\n flex-direction: column;\n\n margin-block-start: 12px;\n\n transition: margin 200ms ease;\n\n &::before {\n content: '';\n\n position: absolute;\n inset-block-start: -6px;\n inset-inline: 0;\n\n block-size: 1px;\n\n opacity: 0;\n background: ${cssVar.colorBorderSecondary};\n\n transition: opacity 200ms ease;\n }\n\n &[data-level='0'][data-icon='true'] {\n margin-block-start: 2px;\n }\n\n &:not([data-level='0']) {\n margin-block-start: 6px;\n }\n\n [data-collapsed='true'] & + &[data-level='0'][data-icon='false']::before {\n opacity: 1;\n }\n\n [data-collapsed='true'] &[data-rail-empty='true'] {\n margin-block-start: 0;\n\n &::before {\n opacity: 0;\n }\n }\n\n @media (prefers-reduced-motion: reduce) {\n transition: none;\n\n &::before {\n transition: none;\n }\n }\n `,\n groupHead: css`\n position: relative;\n display: flex;\n flex-direction: column;\n `,\n groupHeader: css`\n cursor: pointer;\n\n display: flex;\n gap: 8px;\n align-items: center;\n justify-content: space-between;\n\n min-block-size: 32px;\n padding-inline: 10px;\n border: none;\n border-radius: ${cssVar.borderRadius};\n\n font-size: ${cssVar.fontSizeSM};\n font-weight: 500;\n color: ${cssVar.colorTextSecondary};\n text-align: start;\n white-space: nowrap;\n\n background: none;\n\n &:hover,\n &[data-active='true'] {\n color: ${cssVar.colorText};\n }\n\n &[data-icon='true'] {\n gap: 10px;\n justify-content: flex-start;\n min-block-size: 36px;\n font-size: ${cssVar.fontSize};\n\n > [role='img'] {\n justify-content: center;\n inline-size: 18px;\n }\n }\n\n &[data-level='0'][data-icon='true']:hover {\n background: ${cssVar.colorFillTertiary};\n }\n\n /* Nested groups read as quiet subheadings with the indicator right after the label. */\n &:not([data-level='0']) {\n gap: 8px;\n justify-content: flex-start;\n\n min-block-size: 26px;\n\n font-size: ${cssVar.fontSizeSM};\n font-weight: 400;\n color: ${cssVar.colorTextDescription};\n\n > [data-label] {\n flex: 0 1 auto;\n }\n\n &:hover,\n &[data-active='true'] {\n color: ${cssVar.colorTextSecondary};\n }\n }\n\n &[data-indent='1'] {\n padding-inline-start: 38px;\n }\n\n &[data-indent='2'] {\n padding-inline-start: 56px;\n }\n\n > [role='img'] {\n display: flex;\n flex: none;\n }\n `,\n groupItems: css`\n display: flex;\n flex-direction: column;\n gap: 2px;\n min-block-size: 0;\n `,\n groupPanel: css`\n display: grid;\n grid-template-rows: 1fr;\n transition: grid-template-rows 160ms ease;\n\n > div {\n overflow: hidden;\n }\n\n &[data-expanded='false'] {\n grid-template-rows: 0fr;\n }\n\n &[data-instant='true'] {\n transition: none;\n }\n `,\n item: css`\n position: relative;\n\n display: flex;\n gap: 10px;\n align-items: center;\n\n min-block-size: 36px;\n padding-inline: 10px;\n border-radius: ${cssVar.borderRadius};\n\n color: ${cssVar.colorTextSecondary};\n text-decoration: none;\n white-space: nowrap;\n\n transition:\n background 120ms ease,\n color 120ms ease;\n\n &:hover {\n color: ${cssVar.colorText};\n background: ${cssVar.colorFillTertiary};\n }\n\n &[data-active='true'] {\n font-weight: 500;\n color: ${cssVar.colorText};\n background: ${cssVar.colorFillSecondary};\n }\n\n &[data-indent='1'],\n &[data-indent='2'] {\n min-block-size: 32px;\n color: ${cssVar.colorText};\n }\n\n &[data-indent='1'] {\n padding-inline-start: 38px;\n }\n\n &[data-indent='2'] {\n padding-inline-start: 56px;\n }\n\n [data-collapsed='true'] &:not([data-indent='0']) {\n padding-inline-start: 10px;\n }\n\n > [role='img'] {\n display: flex;\n flex: none;\n }\n\n ${responsive.mobile} {\n min-block-size: 44px;\n }\n `,\n itemLabel: css`\n overflow: hidden;\n flex: 1;\n text-overflow: ellipsis;\n white-space: nowrap;\n\n [data-collapsed='true'] & {\n text-overflow: clip;\n }\n\n ${railFade}\n `,\n nav: css`\n /* Scroll anchoring would jump the list in one frame while rail rows fold and unfold. */\n overflow-anchor: none;\n scrollbar-width: thin;\n\n display: flex;\n flex: 1;\n flex-direction: column;\n gap: 2px;\n\n min-block-size: 0;\n padding-block-end: 12px;\n padding-inline: 8px;\n `,\n railLink: css`\n position: absolute;\n inset: 0;\n border-radius: ${cssVar.borderRadius};\n transition: background 120ms ease;\n\n &:hover {\n background: ${cssVar.colorFillTertiary};\n }\n\n &[data-active='true'] {\n background: ${cssVar.colorFillSecondary};\n }\n\n @starting-style {\n background: transparent;\n }\n `,\n skeletonFooter: css`\n display: flex;\n gap: 10px;\n align-items: center;\n padding-inline: 4px;\n `,\n skeletonGroup: css`\n display: flex;\n flex-direction: column;\n gap: 2px;\n margin-block-start: 12px;\n `,\n skeletonRow: css`\n pointer-events: none;\n `,\n topItems: css`\n display: flex;\n flex-direction: column;\n gap: 2px;\n transition:\n margin 200ms ease,\n padding 200ms ease,\n border-color 200ms ease;\n\n &[data-divided='true'] {\n margin-block-end: 6px;\n padding-block-end: 8px;\n border-block-end: 1px solid ${cssVar.colorBorderSecondary};\n }\n\n [data-collapsed='true'] &[data-rail-empty='true'] {\n margin-block-end: 0;\n padding-block-end: 0;\n border-block-end-color: transparent;\n }\n\n @media (prefers-reduced-motion: reduce) {\n transition: none;\n }\n `,\n };\n});\n"],"mappings":";;AAEA,MAAa,SAAS,oBAAoB,EAAE,KAAK,QAAQ,iBAAiB;CAExE,MAAM,WAAW;;;;;;;;;;;;CAajB,OAAO;EACL,OAAO,GAAG;;;;;;;mBAOK,OAAO,WAAW;;eAEtB,OAAO,WAAW;;;uCAGM,OAAO,WAAW;;QAEjD,SAAS;;EAEb,SAAS,GAAG;;;;;;;;;;;;;;;;;;;EAmBZ,WAAW,GAAG;;;;;;;;;;eAUH,OAAO,qBAAqB;;;;;;;;EAQvC,KAAK,GAAG;;;;;;;;;;oBAUQ,OAAO,WAAW;;;;;;;;;;;;EAYlC,MAAM,GAAG;;;;;;;;;;;;;;;;;;;;;;;;;;EA0BT,OAAO,GAAG;;;;;;;;;;;;;;;;;;;;sBAoBQ,OAAO,qBAAqB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAiC9C,WAAW,GAAG;;;;;EAKd,aAAa,GAAG;;;;;;;;;;;uBAWG,OAAO,aAAa;;mBAExB,OAAO,WAAW;;eAEtB,OAAO,mBAAmB;;;;;;;;iBAQxB,OAAO,UAAU;;;;;;;qBAOb,OAAO,SAAS;;;;;;;;;sBASf,OAAO,kBAAkB;;;;;;;;;;qBAU1B,OAAO,WAAW;;iBAEtB,OAAO,qBAAqB;;;;;;;;mBAQ1B,OAAO,mBAAmB;;;;;;;;;;;;;;;;;EAiBzC,YAAY,GAAG;;;;;;EAMf,YAAY,GAAG;;;;;;;;;;;;;;;;;EAiBf,MAAM,GAAG;;;;;;;;;uBASU,OAAO,aAAa;;eAE5B,OAAO,mBAAmB;;;;;;;;;iBASxB,OAAO,UAAU;sBACZ,OAAO,kBAAkB;;;;;iBAK9B,OAAO,UAAU;sBACZ,OAAO,mBAAmB;;;;;;iBAM/B,OAAO,UAAU;;;;;;;;;;;;;;;;;;;;QAoB1B,WAAW,OAAO;;;;EAItB,WAAW,GAAG;;;;;;;;;;QAUV,SAAS;;EAEb,KAAK,GAAG;;;;;;;;;;;;;;EAcR,UAAU,GAAG;;;uBAGM,OAAO,aAAa;;;;sBAIrB,OAAO,kBAAkB;;;;sBAIzB,OAAO,mBAAmB;;;;;;;EAO5C,gBAAgB,GAAG;;;;;;EAMnB,eAAe,GAAG;;;;;;EAMlB,aAAa,GAAG;;;EAGhB,UAAU,GAAG;;;;;;;;;;;;sCAYqB,OAAO,qBAAqB;;;;;;;;;;;;;CAahE;AACF,CAAC"}
1
+ {"version":3,"file":"style.mjs","names":[],"sources":["../../../src/dashboard/ConsoleNav/style.ts"],"sourcesContent":["import { createStaticStyles } from 'antd-style';\n\nexport const styles = createStaticStyles(({ css, cssVar, responsive }) => {\n // Fades out at once on collapse, but waits on expand until the width has room for the text.\n const railFade = `\n transition: opacity 120ms ease 80ms;\n\n [data-collapsed='true'] & {\n opacity: 0;\n transition-delay: 0s;\n }\n\n @media (prefers-reduced-motion: reduce) {\n transition: none;\n }\n `;\n\n return {\n badge: css`\n flex: none;\n\n min-inline-size: 20px;\n padding-inline: 6px;\n border-radius: 999px;\n\n font-size: ${cssVar.fontSizeSM};\n font-variant-numeric: tabular-nums;\n color: ${cssVar.colorError};\n text-align: center;\n\n background: color-mix(in srgb, ${cssVar.colorError} 12%, transparent);\n\n ${railFade}\n `,\n chevron: css`\n flex: none;\n transition:\n transform 160ms ease,\n opacity 120ms ease 80ms;\n\n &[data-expanded='false'] {\n transform: rotate(-90deg);\n }\n\n [data-collapsed='true'] & {\n opacity: 0;\n transition-delay: 0s;\n }\n\n @media (prefers-reduced-motion: reduce) {\n transition: none;\n }\n `,\n indicator: css`\n display: flex;\n flex: none;\n align-items: center;\n justify-content: center;\n\n width: 18px;\n height: 18px;\n margin-inline-start: -6px;\n\n color: ${cssVar.colorTextDescription};\n\n transition: transform 160ms ease;\n\n &[data-expanded='true'] {\n transform: rotate(90deg);\n }\n `,\n dot: css`\n position: absolute;\n inset-block-start: 7px;\n inset-inline-end: 9px;\n\n inline-size: 7px;\n block-size: 7px;\n border-radius: 999px;\n\n opacity: 0;\n background: ${cssVar.colorError};\n\n transition: opacity 120ms ease;\n\n [data-collapsed='true'] & {\n opacity: 1;\n }\n\n @media (prefers-reduced-motion: reduce) {\n transition: none;\n }\n `,\n fold: css`\n display: grid;\n grid-template-rows: 1fr;\n transition:\n grid-template-rows 200ms ease,\n margin 200ms ease,\n opacity 120ms ease;\n\n > div {\n overflow: hidden;\n min-block-size: 0;\n }\n\n &[data-folded='true'] {\n grid-template-rows: 0fr;\n opacity: 0;\n }\n\n &[data-folded='true']:not(:first-child) {\n margin-block-start: -2px;\n }\n\n @media (prefers-reduced-motion: reduce) {\n transition: none;\n }\n `,\n group: css`\n position: relative;\n\n display: flex;\n flex-direction: column;\n\n margin-block-start: 12px;\n\n transition: margin 200ms ease;\n\n &::before {\n content: '';\n\n position: absolute;\n inset-block-start: -6px;\n inset-inline: 0;\n\n block-size: 1px;\n\n opacity: 0;\n background: var(--lobe-fill-border, ${cssVar.colorFill});\n\n transition: opacity 200ms ease;\n }\n\n &[data-level='0'][data-icon='true'] {\n margin-block-start: 2px;\n }\n\n &:not([data-level='0']) {\n margin-block-start: 6px;\n }\n\n [data-collapsed='true'] & + &[data-level='0'][data-icon='false']::before {\n opacity: 1;\n }\n\n [data-collapsed='true'] &[data-rail-empty='true'] {\n margin-block-start: 0;\n\n &::before {\n opacity: 0;\n }\n }\n\n @media (prefers-reduced-motion: reduce) {\n transition: none;\n\n &::before {\n transition: none;\n }\n }\n `,\n groupHead: css`\n position: relative;\n display: flex;\n flex-direction: column;\n `,\n groupHeader: css`\n cursor: pointer;\n\n display: flex;\n gap: 8px;\n align-items: center;\n justify-content: space-between;\n\n min-block-size: 32px;\n padding-inline: 10px;\n border: none;\n border-radius: ${cssVar.borderRadius};\n\n font-size: ${cssVar.fontSizeSM};\n font-weight: 500;\n color: ${cssVar.colorTextSecondary};\n text-align: start;\n white-space: nowrap;\n\n background: none;\n\n &:hover,\n &[data-active='true'] {\n color: ${cssVar.colorText};\n }\n\n &[data-icon='true'] {\n gap: 10px;\n justify-content: flex-start;\n min-block-size: 36px;\n font-size: ${cssVar.fontSize};\n\n > [role='img'] {\n justify-content: center;\n inline-size: 18px;\n }\n }\n\n &[data-level='0'][data-icon='true']:hover {\n background: ${cssVar.colorFillTertiary};\n }\n\n /* Nested groups read as quiet subheadings with the indicator right after the label. */\n &:not([data-level='0']) {\n gap: 8px;\n justify-content: flex-start;\n\n min-block-size: 26px;\n\n font-size: ${cssVar.fontSizeSM};\n font-weight: 400;\n color: ${cssVar.colorTextDescription};\n\n > [data-label] {\n flex: 0 1 auto;\n }\n\n &:hover,\n &[data-active='true'] {\n color: ${cssVar.colorTextSecondary};\n }\n }\n\n &[data-indent='1'] {\n padding-inline-start: 38px;\n }\n\n &[data-indent='2'] {\n padding-inline-start: 56px;\n }\n\n > [role='img'] {\n display: flex;\n flex: none;\n }\n `,\n groupItems: css`\n display: flex;\n flex-direction: column;\n gap: 2px;\n min-block-size: 0;\n `,\n groupPanel: css`\n display: grid;\n grid-template-rows: 1fr;\n transition: grid-template-rows 160ms ease;\n\n > div {\n overflow: hidden;\n }\n\n &[data-expanded='false'] {\n grid-template-rows: 0fr;\n }\n\n &[data-instant='true'] {\n transition: none;\n }\n `,\n item: css`\n position: relative;\n\n display: flex;\n gap: 10px;\n align-items: center;\n\n min-block-size: 36px;\n padding-inline: 10px;\n border-radius: ${cssVar.borderRadius};\n\n color: ${cssVar.colorTextSecondary};\n text-decoration: none;\n white-space: nowrap;\n\n transition:\n background 120ms ease,\n color 120ms ease;\n\n &:hover {\n color: ${cssVar.colorText};\n background: ${cssVar.colorFillTertiary};\n }\n\n &[data-active='true'] {\n font-weight: 500;\n color: ${cssVar.colorText};\n background: ${cssVar.colorFillSecondary};\n }\n\n &[data-indent='1'],\n &[data-indent='2'] {\n min-block-size: 32px;\n color: ${cssVar.colorText};\n }\n\n &[data-indent='1'] {\n padding-inline-start: 38px;\n }\n\n &[data-indent='2'] {\n padding-inline-start: 56px;\n }\n\n [data-collapsed='true'] &:not([data-indent='0']) {\n padding-inline-start: 10px;\n }\n\n > [role='img'] {\n display: flex;\n flex: none;\n }\n\n ${responsive.mobile} {\n min-block-size: 44px;\n }\n `,\n itemLabel: css`\n overflow: hidden;\n flex: 1;\n text-overflow: ellipsis;\n white-space: nowrap;\n\n [data-collapsed='true'] & {\n text-overflow: clip;\n }\n\n ${railFade}\n `,\n nav: css`\n /* Scroll anchoring would jump the list in one frame while rail rows fold and unfold. */\n overflow-anchor: none;\n scrollbar-width: thin;\n\n display: flex;\n flex: 1;\n flex-direction: column;\n gap: 2px;\n\n min-block-size: 0;\n padding-block-end: 12px;\n padding-inline: 8px;\n `,\n railLink: css`\n position: absolute;\n inset: 0;\n border-radius: ${cssVar.borderRadius};\n transition: background 120ms ease;\n\n &:hover {\n background: ${cssVar.colorFillTertiary};\n }\n\n &[data-active='true'] {\n background: ${cssVar.colorFillSecondary};\n }\n\n @starting-style {\n background: transparent;\n }\n `,\n skeletonFooter: css`\n display: flex;\n gap: 10px;\n align-items: center;\n padding-inline: 4px;\n `,\n skeletonGroup: css`\n display: flex;\n flex-direction: column;\n gap: 2px;\n margin-block-start: 12px;\n `,\n skeletonRow: css`\n pointer-events: none;\n `,\n topItems: css`\n display: flex;\n flex-direction: column;\n gap: 2px;\n transition:\n margin 200ms ease,\n padding 200ms ease,\n border-color 200ms ease;\n\n &[data-divided='true'] {\n margin-block-end: 6px;\n padding-block-end: 8px;\n border-block-end: 1px solid var(--lobe-fill-border, ${cssVar.colorFill});\n }\n\n [data-collapsed='true'] &[data-rail-empty='true'] {\n margin-block-end: 0;\n padding-block-end: 0;\n border-block-end-color: transparent;\n }\n\n @media (prefers-reduced-motion: reduce) {\n transition: none;\n }\n `,\n };\n});\n"],"mappings":";;AAEA,MAAa,SAAS,oBAAoB,EAAE,KAAK,QAAQ,iBAAiB;CAExE,MAAM,WAAW;;;;;;;;;;;;CAajB,OAAO;EACL,OAAO,GAAG;;;;;;;mBAOK,OAAO,WAAW;;eAEtB,OAAO,WAAW;;;uCAGM,OAAO,WAAW;;QAEjD,SAAS;;EAEb,SAAS,GAAG;;;;;;;;;;;;;;;;;;;EAmBZ,WAAW,GAAG;;;;;;;;;;eAUH,OAAO,qBAAqB;;;;;;;;EAQvC,KAAK,GAAG;;;;;;;;;;oBAUQ,OAAO,WAAW;;;;;;;;;;;;EAYlC,MAAM,GAAG;;;;;;;;;;;;;;;;;;;;;;;;;;EA0BT,OAAO,GAAG;;;;;;;;;;;;;;;;;;;;8CAoBgC,OAAO,UAAU;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAiC3D,WAAW,GAAG;;;;;EAKd,aAAa,GAAG;;;;;;;;;;;uBAWG,OAAO,aAAa;;mBAExB,OAAO,WAAW;;eAEtB,OAAO,mBAAmB;;;;;;;;iBAQxB,OAAO,UAAU;;;;;;;qBAOb,OAAO,SAAS;;;;;;;;;sBASf,OAAO,kBAAkB;;;;;;;;;;qBAU1B,OAAO,WAAW;;iBAEtB,OAAO,qBAAqB;;;;;;;;mBAQ1B,OAAO,mBAAmB;;;;;;;;;;;;;;;;;EAiBzC,YAAY,GAAG;;;;;;EAMf,YAAY,GAAG;;;;;;;;;;;;;;;;;EAiBf,MAAM,GAAG;;;;;;;;;uBASU,OAAO,aAAa;;eAE5B,OAAO,mBAAmB;;;;;;;;;iBASxB,OAAO,UAAU;sBACZ,OAAO,kBAAkB;;;;;iBAK9B,OAAO,UAAU;sBACZ,OAAO,mBAAmB;;;;;;iBAM/B,OAAO,UAAU;;;;;;;;;;;;;;;;;;;;QAoB1B,WAAW,OAAO;;;;EAItB,WAAW,GAAG;;;;;;;;;;QAUV,SAAS;;EAEb,KAAK,GAAG;;;;;;;;;;;;;;EAcR,UAAU,GAAG;;;uBAGM,OAAO,aAAa;;;;sBAIrB,OAAO,kBAAkB;;;;sBAIzB,OAAO,mBAAmB;;;;;;;EAO5C,gBAAgB,GAAG;;;;;;EAMnB,eAAe,GAAG;;;;;;EAMlB,aAAa,GAAG;;;EAGhB,UAAU,GAAG;;;;;;;;;;;;8DAY6C,OAAO,UAAU;;;;;;;;;;;;;CAa7E;AACF,CAAC"}
package/es/dashboard/FilterSidebar/style.mjs CHANGED
@@ -133,11 +133,11 @@ const styles = createStaticStyles(({ css, cssVar, responsive }) => ({
133
133
  flex-direction: column;
134
134
 
135
135
  min-block-size: 0;
136
- border-inline-end: 1px solid ${cssVar.colorBorderSecondary};
136
+ border-inline-end: 1px solid var(--lobe-fill-border, ${cssVar.colorFill});
137
137
 
138
138
  [data-split-card='true'] & {
139
139
  block-size: 100%;
140
- border-inline-end-color: ${cssVar.colorBorder};
140
+ border-inline-end-color: var(--lobe-fill-border-strong, ${cssVar.colorFill});
141
141
  }
142
142
  `,
143
143
  sidebar: css`
package/es/dashboard/FilterSidebar/style.mjs.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"style.mjs","names":[],"sources":["../../../src/dashboard/FilterSidebar/style.ts"],"sourcesContent":["import { createStaticStyles } from 'antd-style';\n\nexport const styles = createStaticStyles(({ css, cssVar, responsive }) => ({\n body: css`\n overflow-y: auto;\n max-block-size: 360px;\n padding-block-end: 16px;\n padding-inline: 12px;\n\n &[data-flush='true'] {\n flex: 1;\n min-block-size: 0;\n max-block-size: none;\n }\n `,\n content: css`\n display: flex;\n flex: 1;\n flex-direction: column;\n gap: 16px;\n\n min-inline-size: 0;\n padding-inline-start: 20px;\n\n &[data-flush='true'] {\n overflow-y: auto;\n padding: 24px;\n }\n\n [data-split-card='true'] & {\n padding-block: 16px 0;\n padding-inline: 16px;\n\n > :last-child {\n margin-inline: -16px;\n }\n }\n\n ${responsive.laptop} {\n overflow: visible;\n padding: 0;\n\n > :last-child {\n margin-inline: 0;\n }\n }\n `,\n count: css`\n flex: none;\n font-size: ${cssVar.fontSizeSM};\n font-variant-numeric: tabular-nums;\n color: ${cssVar.colorTextTertiary};\n `,\n drawerPanel: css`\n display: flex;\n flex-direction: column;\n gap: 8px;\n `,\n head: css`\n display: flex;\n flex: none;\n flex-direction: column;\n gap: 8px;\n\n padding: 12px;\n `,\n layout: css`\n display: flex;\n\n &[data-flush='true'] {\n flex: 1;\n min-block-size: 0;\n }\n\n &[data-split-card='true'] {\n overflow: hidden;\n align-items: stretch;\n }\n\n ${responsive.laptop} {\n flex-direction: column;\n gap: 12px;\n }\n `,\n name: css`\n overflow: hidden;\n flex: 1;\n\n min-inline-size: 0;\n\n text-align: start;\n text-overflow: ellipsis;\n white-space: nowrap;\n `,\n option: css`\n cursor: pointer;\n\n display: flex;\n gap: 6px;\n align-items: center;\n\n inline-size: 100%;\n min-block-size: 36px;\n padding-inline: 8px;\n border: none;\n border-radius: ${cssVar.borderRadius};\n\n font: inherit;\n color: ${cssVar.colorText};\n\n background: none;\n\n &:hover {\n background: ${cssVar.colorFillTertiary};\n }\n\n &[aria-pressed='true'] {\n font-weight: 500;\n background: ${cssVar.controlItemBgActive};\n }\n `,\n row: css`\n display: flex;\n flex: 1;\n gap: 6px;\n align-items: center;\n\n min-inline-size: 0;\n `,\n panel: css`\n overflow: hidden;\n display: flex;\n flex-direction: column;\n\n min-block-size: 0;\n border-inline-end: 1px solid ${cssVar.colorBorderSecondary};\n\n [data-split-card='true'] & {\n block-size: 100%;\n border-inline-end-color: ${cssVar.colorBorder};\n }\n `,\n sidebar: css`\n align-self: stretch;\n min-block-size: 0;\n\n &[data-flush='true'] {\n block-size: 100%;\n }\n `,\n}));\n"],"mappings":";;AAEA,MAAa,SAAS,oBAAoB,EAAE,KAAK,QAAQ,kBAAkB;CACzE,MAAM,GAAG;;;;;;;;;;;;CAYT,SAAS,GAAG;;;;;;;;;;;;;;;;;;;;;;;MAuBR,WAAW,OAAO;;;;;;;;;CAStB,OAAO,GAAG;;iBAEK,OAAO,WAAW;;aAEtB,OAAO,kBAAkB;;CAEpC,aAAa,GAAG;;;;;CAKhB,MAAM,GAAG;;;;;;;;CAQT,QAAQ,GAAG;;;;;;;;;;;;;MAaP,WAAW,OAAO;;;;;CAKtB,MAAM,GAAG;;;;;;;;;;CAUT,QAAQ,GAAG;;;;;;;;;;;qBAWQ,OAAO,aAAa;;;aAG5B,OAAO,UAAU;;;;;oBAKV,OAAO,kBAAkB;;;;;oBAKzB,OAAO,oBAAoB;;;CAG7C,KAAK,GAAG;;;;;;;;CAQR,OAAO,GAAG;;;;;;mCAMuB,OAAO,qBAAqB;;;;iCAI9B,OAAO,YAAY;;;CAGlD,SAAS,GAAG;;;;;;;;AAQd,EAAE"}
1
+ {"version":3,"file":"style.mjs","names":[],"sources":["../../../src/dashboard/FilterSidebar/style.ts"],"sourcesContent":["import { createStaticStyles } from 'antd-style';\n\nexport const styles = createStaticStyles(({ css, cssVar, responsive }) => ({\n body: css`\n overflow-y: auto;\n max-block-size: 360px;\n padding-block-end: 16px;\n padding-inline: 12px;\n\n &[data-flush='true'] {\n flex: 1;\n min-block-size: 0;\n max-block-size: none;\n }\n `,\n content: css`\n display: flex;\n flex: 1;\n flex-direction: column;\n gap: 16px;\n\n min-inline-size: 0;\n padding-inline-start: 20px;\n\n &[data-flush='true'] {\n overflow-y: auto;\n padding: 24px;\n }\n\n [data-split-card='true'] & {\n padding-block: 16px 0;\n padding-inline: 16px;\n\n > :last-child {\n margin-inline: -16px;\n }\n }\n\n ${responsive.laptop} {\n overflow: visible;\n padding: 0;\n\n > :last-child {\n margin-inline: 0;\n }\n }\n `,\n count: css`\n flex: none;\n font-size: ${cssVar.fontSizeSM};\n font-variant-numeric: tabular-nums;\n color: ${cssVar.colorTextTertiary};\n `,\n drawerPanel: css`\n display: flex;\n flex-direction: column;\n gap: 8px;\n `,\n head: css`\n display: flex;\n flex: none;\n flex-direction: column;\n gap: 8px;\n\n padding: 12px;\n `,\n layout: css`\n display: flex;\n\n &[data-flush='true'] {\n flex: 1;\n min-block-size: 0;\n }\n\n &[data-split-card='true'] {\n overflow: hidden;\n align-items: stretch;\n }\n\n ${responsive.laptop} {\n flex-direction: column;\n gap: 12px;\n }\n `,\n name: css`\n overflow: hidden;\n flex: 1;\n\n min-inline-size: 0;\n\n text-align: start;\n text-overflow: ellipsis;\n white-space: nowrap;\n `,\n option: css`\n cursor: pointer;\n\n display: flex;\n gap: 6px;\n align-items: center;\n\n inline-size: 100%;\n min-block-size: 36px;\n padding-inline: 8px;\n border: none;\n border-radius: ${cssVar.borderRadius};\n\n font: inherit;\n color: ${cssVar.colorText};\n\n background: none;\n\n &:hover {\n background: ${cssVar.colorFillTertiary};\n }\n\n &[aria-pressed='true'] {\n font-weight: 500;\n background: ${cssVar.controlItemBgActive};\n }\n `,\n row: css`\n display: flex;\n flex: 1;\n gap: 6px;\n align-items: center;\n\n min-inline-size: 0;\n `,\n panel: css`\n overflow: hidden;\n display: flex;\n flex-direction: column;\n\n min-block-size: 0;\n border-inline-end: 1px solid var(--lobe-fill-border, ${cssVar.colorFill});\n\n [data-split-card='true'] & {\n block-size: 100%;\n border-inline-end-color: var(--lobe-fill-border-strong, ${cssVar.colorFill});\n }\n `,\n sidebar: css`\n align-self: stretch;\n min-block-size: 0;\n\n &[data-flush='true'] {\n block-size: 100%;\n }\n `,\n}));\n"],"mappings":";;AAEA,MAAa,SAAS,oBAAoB,EAAE,KAAK,QAAQ,kBAAkB;CACzE,MAAM,GAAG;;;;;;;;;;;;CAYT,SAAS,GAAG;;;;;;;;;;;;;;;;;;;;;;;MAuBR,WAAW,OAAO;;;;;;;;;CAStB,OAAO,GAAG;;iBAEK,OAAO,WAAW;;aAEtB,OAAO,kBAAkB;;CAEpC,aAAa,GAAG;;;;;CAKhB,MAAM,GAAG;;;;;;;;CAQT,QAAQ,GAAG;;;;;;;;;;;;;MAaP,WAAW,OAAO;;;;;CAKtB,MAAM,GAAG;;;;;;;;;;CAUT,QAAQ,GAAG;;;;;;;;;;;qBAWQ,OAAO,aAAa;;;aAG5B,OAAO,UAAU;;;;;oBAKV,OAAO,kBAAkB;;;;;oBAKzB,OAAO,oBAAoB;;;CAG7C,KAAK,GAAG;;;;;;;;CAQR,OAAO,GAAG;;;;;;2DAM+C,OAAO,UAAU;;;;gEAIZ,OAAO,UAAU;;;CAG/E,SAAS,GAAG;;;;;;;;AAQd,EAAE"}
package/es/dashboard/FilterStrip/style.mjs CHANGED
@@ -67,7 +67,7 @@ const styles = createStaticStyles(({ css, cssVar }) => ({
67
67
  color: ${cssVar.colorWarning};
68
68
  `,
69
69
  frame: css`
70
- --filter-seam: ${cssVar.colorBorderSecondary};
70
+ --filter-seam: var(--lobe-fill-border, ${cssVar.colorFill});
71
71
 
72
72
  overflow: hidden;
73
73
  border-radius: inherit;
package/es/dashboard/FilterStrip/style.mjs.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"style.mjs","names":[],"sources":["../../../src/dashboard/FilterStrip/style.ts"],"sourcesContent":["import { createStaticStyles } from 'antd-style';\n\nexport const styles = createStaticStyles(({ css, cssVar }) => ({\n cell: css`\n cursor: pointer;\n\n position: relative;\n\n display: flex;\n flex-direction: column;\n gap: 6px;\n align-items: flex-start;\n\n min-inline-size: 0;\n margin: 0;\n padding-block: 14px 16px;\n padding-inline: 16px;\n border: 0;\n\n font: inherit;\n color: inherit;\n text-align: start;\n\n background: transparent;\n box-shadow:\n inset -1px 0 0 var(--filter-seam),\n inset 0 -1px 0 var(--filter-seam);\n\n &::after {\n content: '';\n\n position: absolute;\n inset-block-end: 1px;\n inset-inline: 0;\n\n block-size: 3px;\n\n background: transparent;\n }\n\n &:hover {\n background: ${cssVar.colorFillQuaternary};\n }\n `,\n cellActive: css`\n background: ${cssVar.colorFillTertiary};\n\n &::after {\n background: ${cssVar.colorText};\n }\n\n &:hover {\n background: ${cssVar.colorFillTertiary};\n }\n `,\n count: css`\n font-size: ${cssVar.fontSizeHeading4};\n font-weight: 600;\n font-variant-numeric: tabular-nums;\n line-height: 1.15;\n color: ${cssVar.colorText};\n `,\n countDanger: css`\n color: ${cssVar.colorError};\n `,\n countWarning: css`\n color: ${cssVar.colorWarning};\n `,\n frame: css`\n --filter-seam: ${cssVar.colorBorderSecondary};\n\n overflow: hidden;\n border-radius: inherit;\n `,\n grid: css`\n display: grid;\n grid-template-columns: repeat(auto-fit, minmax(148px, 1fr));\n inline-size: calc(100% + 1px);\n margin-block-end: -1px;\n `,\n label: css`\n font-size: 13px;\n font-weight: 500;\n line-height: 1.4;\n color: ${cssVar.colorTextSecondary};\n `,\n labelActive: css`\n color: ${cssVar.colorText};\n `,\n}));\n"],"mappings":";;AAEA,MAAa,SAAS,oBAAoB,EAAE,KAAK,cAAc;CAC7D,MAAM,GAAG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;oBAsCS,OAAO,oBAAoB;;;CAG7C,YAAY,GAAG;kBACC,OAAO,kBAAkB;;;oBAGvB,OAAO,UAAU;;;;oBAIjB,OAAO,kBAAkB;;;CAG3C,OAAO,GAAG;iBACK,OAAO,iBAAiB;;;;aAI5B,OAAO,UAAU;;CAE5B,aAAa,GAAG;aACL,OAAO,WAAW;;CAE7B,cAAc,GAAG;aACN,OAAO,aAAa;;CAE/B,OAAO,GAAG;qBACS,OAAO,qBAAqB;;;;;CAK/C,MAAM,GAAG;;;;;;CAMT,OAAO,GAAG;;;;aAIC,OAAO,mBAAmB;;CAErC,aAAa,GAAG;aACL,OAAO,UAAU;;AAE9B,EAAE"}
1
+ {"version":3,"file":"style.mjs","names":[],"sources":["../../../src/dashboard/FilterStrip/style.ts"],"sourcesContent":["import { createStaticStyles } from 'antd-style';\n\nexport const styles = createStaticStyles(({ css, cssVar }) => ({\n cell: css`\n cursor: pointer;\n\n position: relative;\n\n display: flex;\n flex-direction: column;\n gap: 6px;\n align-items: flex-start;\n\n min-inline-size: 0;\n margin: 0;\n padding-block: 14px 16px;\n padding-inline: 16px;\n border: 0;\n\n font: inherit;\n color: inherit;\n text-align: start;\n\n background: transparent;\n box-shadow:\n inset -1px 0 0 var(--filter-seam),\n inset 0 -1px 0 var(--filter-seam);\n\n &::after {\n content: '';\n\n position: absolute;\n inset-block-end: 1px;\n inset-inline: 0;\n\n block-size: 3px;\n\n background: transparent;\n }\n\n &:hover {\n background: ${cssVar.colorFillQuaternary};\n }\n `,\n cellActive: css`\n background: ${cssVar.colorFillTertiary};\n\n &::after {\n background: ${cssVar.colorText};\n }\n\n &:hover {\n background: ${cssVar.colorFillTertiary};\n }\n `,\n count: css`\n font-size: ${cssVar.fontSizeHeading4};\n font-weight: 600;\n font-variant-numeric: tabular-nums;\n line-height: 1.15;\n color: ${cssVar.colorText};\n `,\n countDanger: css`\n color: ${cssVar.colorError};\n `,\n countWarning: css`\n color: ${cssVar.colorWarning};\n `,\n frame: css`\n --filter-seam: var(--lobe-fill-border, ${cssVar.colorFill});\n\n overflow: hidden;\n border-radius: inherit;\n `,\n grid: css`\n display: grid;\n grid-template-columns: repeat(auto-fit, minmax(148px, 1fr));\n inline-size: calc(100% + 1px);\n margin-block-end: -1px;\n `,\n label: css`\n font-size: 13px;\n font-weight: 500;\n line-height: 1.4;\n color: ${cssVar.colorTextSecondary};\n `,\n labelActive: css`\n color: ${cssVar.colorText};\n `,\n}));\n"],"mappings":";;AAEA,MAAa,SAAS,oBAAoB,EAAE,KAAK,cAAc;CAC7D,MAAM,GAAG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;oBAsCS,OAAO,oBAAoB;;;CAG7C,YAAY,GAAG;kBACC,OAAO,kBAAkB;;;oBAGvB,OAAO,UAAU;;;;oBAIjB,OAAO,kBAAkB;;;CAG3C,OAAO,GAAG;iBACK,OAAO,iBAAiB;;;;aAI5B,OAAO,UAAU;;CAE5B,aAAa,GAAG;aACL,OAAO,WAAW;;CAE7B,cAAc,GAAG;aACN,OAAO,aAAa;;CAE/B,OAAO,GAAG;6CACiC,OAAO,UAAU;;;;;CAK5D,MAAM,GAAG;;;;;;CAMT,OAAO,GAAG;;;;aAIC,OAAO,mBAAmB;;CAErC,aAAa,GAAG;aACL,OAAO,UAAU;;AAE9B,EAAE"}
package/es/dashboard/MetricStrip/style.mjs CHANGED
@@ -99,7 +99,7 @@ const styles = createStaticStyles(({ css, cssVar }) => ({
99
99
  * track, which reads louder than the cells.
100
100
  */
101
101
  frame: css`
102
- --metric-seam: ${cssVar.colorBorderSecondary};
102
+ --metric-seam: var(--lobe-fill-border, ${cssVar.colorFill});
103
103
 
104
104
  overflow: hidden;
105
105
  border-radius: inherit;
package/es/dashboard/MetricStrip/style.mjs.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"style.mjs","names":[],"sources":["../../../src/dashboard/MetricStrip/style.ts"],"sourcesContent":["import { createStaticStyles } from 'antd-style';\n\nexport const styles = createStaticStyles(({ css, cssVar }) => ({\n cell: css`\n display: flex;\n flex-direction: column;\n gap: 6px;\n\n min-inline-size: 0;\n padding-block: 16px;\n padding-inline: 20px;\n\n background: transparent;\n `,\n /** Joined strip only: the divider on the cell's trailing and bottom edges. */\n cellSeam: css`\n box-shadow:\n inset -1px 0 0 var(--metric-seam),\n inset 0 -1px 0 var(--metric-seam);\n `,\n /** Split strip and StatCard: one card per item. */\n card: css`\n display: grid;\n min-inline-size: 0;\n `,\n /* One fixed 32px row (a small Segmented or ActionIcon fits): an action or mark in the head must not push the value down, so cells with and\n without header controls line up across a split strip or a row of StatCards. */\n head: css`\n display: flex;\n gap: 8px;\n align-items: center;\n justify-content: space-between;\n\n box-sizing: border-box;\n min-inline-size: 0;\n block-size: 32px;\n `,\n headCopy: css`\n display: flex;\n flex: 1;\n gap: 6px;\n align-items: center;\n\n min-inline-size: 0;\n `,\n /** Label-row control, pushed to the trailing edge. */\n headAction: css`\n display: flex;\n flex: none;\n align-items: center;\n `,\n /** Full-width chart slot under the delta and hint. */\n chart: css`\n inline-size: 100%;\n min-inline-size: 0;\n margin-block-start: 6px;\n `,\n mark: css`\n display: inline-flex;\n flex: none;\n align-items: center;\n justify-content: center;\n\n inline-size: 24px;\n block-size: 24px;\n border: 1px solid ${cssVar.colorFillSecondary};\n border-radius: ${cssVar.borderRadiusSM};\n\n color: ${cssVar.colorTextTertiary};\n\n background: ${cssVar.colorFillTertiary};\n `,\n split: css`\n display: grid;\n grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));\n gap: 12px;\n `,\n delta: css`\n font-size: 13px;\n font-variant-numeric: tabular-nums;\n line-height: 1.4;\n `,\n deltaDown: css`\n color: ${cssVar.colorError};\n `,\n deltaFlat: css`\n color: ${cssVar.colorTextSecondary};\n `,\n deltaUp: css`\n color: ${cssVar.colorSuccess};\n `,\n foot: css`\n display: flex;\n flex-wrap: wrap;\n gap: 8px;\n align-items: baseline;\n `,\n /**\n * Clips the seam that would otherwise sit on the card's trailing and bottom\n * edges. A short last row used to show the seam color across the empty\n * track, which reads louder than the cells.\n */\n frame: css`\n --metric-seam: ${cssVar.colorBorderSecondary};\n\n overflow: hidden;\n border-radius: inherit;\n background: transparent;\n `,\n grid: css`\n display: grid;\n grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));\n\n inline-size: calc(100% + 1px);\n margin-block-end: -1px;\n\n background: transparent;\n `,\n hint: css`\n font-size: 13px;\n line-height: 1.4;\n color: ${cssVar.colorTextSecondary};\n `,\n label: css`\n font-size: 13px;\n font-weight: 500;\n line-height: 1.4;\n color: ${cssVar.colorTextSecondary};\n `,\n link: css`\n color: inherit;\n text-decoration: none;\n\n &:hover {\n background: ${cssVar.colorFillQuaternary};\n }\n `,\n press: css`\n cursor: pointer;\n\n border: none;\n\n font: inherit;\n color: inherit;\n text-align: start;\n\n &:hover {\n background: ${cssVar.colorFillQuaternary};\n }\n `,\n /** Grid cell around a rendered link, so the link fills it. */\n slot: css`\n display: grid;\n min-inline-size: 0;\n `,\n value: css`\n overflow: hidden;\n\n font-size: ${cssVar.fontSizeHeading3};\n font-weight: 600;\n font-variant-numeric: tabular-nums;\n line-height: 1.15;\n color: ${cssVar.colorText};\n text-overflow: ellipsis;\n white-space: nowrap;\n `,\n valueDanger: css`\n color: ${cssVar.colorError};\n `,\n valueWarning: css`\n color: ${cssVar.colorWarning};\n `,\n}));\n"],"mappings":";;AAEA,MAAa,SAAS,oBAAoB,EAAE,KAAK,cAAc;CAC7D,MAAM,GAAG;;;;;;;;;;;;CAYT,UAAU,GAAG;;;;;;CAMb,MAAM,GAAG;;;;CAMT,MAAM,GAAG;;;;;;;;;;CAUT,UAAU,GAAG;;;;;;;;;CASb,YAAY,GAAG;;;;;;CAMf,OAAO,GAAG;;;;;CAKV,MAAM,GAAG;;;;;;;;wBAQa,OAAO,mBAAmB;qBAC7B,OAAO,eAAe;;aAE9B,OAAO,kBAAkB;;kBAEpB,OAAO,kBAAkB;;CAEzC,OAAO,GAAG;;;;;CAKV,OAAO,GAAG;;;;;CAKV,WAAW,GAAG;aACH,OAAO,WAAW;;CAE7B,WAAW,GAAG;aACH,OAAO,mBAAmB;;CAErC,SAAS,GAAG;aACD,OAAO,aAAa;;CAE/B,MAAM,GAAG;;;;;;;;;;;CAWT,OAAO,GAAG;qBACS,OAAO,qBAAqB;;;;;;CAM/C,MAAM,GAAG;;;;;;;;;CAST,MAAM,GAAG;;;aAGE,OAAO,mBAAmB;;CAErC,OAAO,GAAG;;;;aAIC,OAAO,mBAAmB;;CAErC,MAAM,GAAG;;;;;oBAKS,OAAO,oBAAoB;;;CAG7C,OAAO,GAAG;;;;;;;;;;oBAUQ,OAAO,oBAAoB;;;;CAI7C,MAAM,GAAG;;;;CAIT,OAAO,GAAG;;;iBAGK,OAAO,iBAAiB;;;;aAI5B,OAAO,UAAU;;;;CAI5B,aAAa,GAAG;aACL,OAAO,WAAW;;CAE7B,cAAc,GAAG;aACN,OAAO,aAAa;;AAEjC,EAAE"}
1
+ {"version":3,"file":"style.mjs","names":[],"sources":["../../../src/dashboard/MetricStrip/style.ts"],"sourcesContent":["import { createStaticStyles } from 'antd-style';\n\nexport const styles = createStaticStyles(({ css, cssVar }) => ({\n cell: css`\n display: flex;\n flex-direction: column;\n gap: 6px;\n\n min-inline-size: 0;\n padding-block: 16px;\n padding-inline: 20px;\n\n background: transparent;\n `,\n /** Joined strip only: the divider on the cell's trailing and bottom edges. */\n cellSeam: css`\n box-shadow:\n inset -1px 0 0 var(--metric-seam),\n inset 0 -1px 0 var(--metric-seam);\n `,\n /** Split strip and StatCard: one card per item. */\n card: css`\n display: grid;\n min-inline-size: 0;\n `,\n /* One fixed 32px row (a small Segmented or ActionIcon fits): an action or mark in the head must not push the value down, so cells with and\n without header controls line up across a split strip or a row of StatCards. */\n head: css`\n display: flex;\n gap: 8px;\n align-items: center;\n justify-content: space-between;\n\n box-sizing: border-box;\n min-inline-size: 0;\n block-size: 32px;\n `,\n headCopy: css`\n display: flex;\n flex: 1;\n gap: 6px;\n align-items: center;\n\n min-inline-size: 0;\n `,\n /** Label-row control, pushed to the trailing edge. */\n headAction: css`\n display: flex;\n flex: none;\n align-items: center;\n `,\n /** Full-width chart slot under the delta and hint. */\n chart: css`\n inline-size: 100%;\n min-inline-size: 0;\n margin-block-start: 6px;\n `,\n mark: css`\n display: inline-flex;\n flex: none;\n align-items: center;\n justify-content: center;\n\n inline-size: 24px;\n block-size: 24px;\n border: 1px solid ${cssVar.colorFillSecondary};\n border-radius: ${cssVar.borderRadiusSM};\n\n color: ${cssVar.colorTextTertiary};\n\n background: ${cssVar.colorFillTertiary};\n `,\n split: css`\n display: grid;\n grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));\n gap: 12px;\n `,\n delta: css`\n font-size: 13px;\n font-variant-numeric: tabular-nums;\n line-height: 1.4;\n `,\n deltaDown: css`\n color: ${cssVar.colorError};\n `,\n deltaFlat: css`\n color: ${cssVar.colorTextSecondary};\n `,\n deltaUp: css`\n color: ${cssVar.colorSuccess};\n `,\n foot: css`\n display: flex;\n flex-wrap: wrap;\n gap: 8px;\n align-items: baseline;\n `,\n /**\n * Clips the seam that would otherwise sit on the card's trailing and bottom\n * edges. A short last row used to show the seam color across the empty\n * track, which reads louder than the cells.\n */\n frame: css`\n --metric-seam: var(--lobe-fill-border, ${cssVar.colorFill});\n\n overflow: hidden;\n border-radius: inherit;\n background: transparent;\n `,\n grid: css`\n display: grid;\n grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));\n\n inline-size: calc(100% + 1px);\n margin-block-end: -1px;\n\n background: transparent;\n `,\n hint: css`\n font-size: 13px;\n line-height: 1.4;\n color: ${cssVar.colorTextSecondary};\n `,\n label: css`\n font-size: 13px;\n font-weight: 500;\n line-height: 1.4;\n color: ${cssVar.colorTextSecondary};\n `,\n link: css`\n color: inherit;\n text-decoration: none;\n\n &:hover {\n background: ${cssVar.colorFillQuaternary};\n }\n `,\n press: css`\n cursor: pointer;\n\n border: none;\n\n font: inherit;\n color: inherit;\n text-align: start;\n\n &:hover {\n background: ${cssVar.colorFillQuaternary};\n }\n `,\n /** Grid cell around a rendered link, so the link fills it. */\n slot: css`\n display: grid;\n min-inline-size: 0;\n `,\n value: css`\n overflow: hidden;\n\n font-size: ${cssVar.fontSizeHeading3};\n font-weight: 600;\n font-variant-numeric: tabular-nums;\n line-height: 1.15;\n color: ${cssVar.colorText};\n text-overflow: ellipsis;\n white-space: nowrap;\n `,\n valueDanger: css`\n color: ${cssVar.colorError};\n `,\n valueWarning: css`\n color: ${cssVar.colorWarning};\n `,\n}));\n"],"mappings":";;AAEA,MAAa,SAAS,oBAAoB,EAAE,KAAK,cAAc;CAC7D,MAAM,GAAG;;;;;;;;;;;;CAYT,UAAU,GAAG;;;;;;CAMb,MAAM,GAAG;;;;CAMT,MAAM,GAAG;;;;;;;;;;CAUT,UAAU,GAAG;;;;;;;;;CASb,YAAY,GAAG;;;;;;CAMf,OAAO,GAAG;;;;;CAKV,MAAM,GAAG;;;;;;;;wBAQa,OAAO,mBAAmB;qBAC7B,OAAO,eAAe;;aAE9B,OAAO,kBAAkB;;kBAEpB,OAAO,kBAAkB;;CAEzC,OAAO,GAAG;;;;;CAKV,OAAO,GAAG;;;;;CAKV,WAAW,GAAG;aACH,OAAO,WAAW;;CAE7B,WAAW,GAAG;aACH,OAAO,mBAAmB;;CAErC,SAAS,GAAG;aACD,OAAO,aAAa;;CAE/B,MAAM,GAAG;;;;;;;;;;;CAWT,OAAO,GAAG;6CACiC,OAAO,UAAU;;;;;;CAM5D,MAAM,GAAG;;;;;;;;;CAST,MAAM,GAAG;;;aAGE,OAAO,mBAAmB;;CAErC,OAAO,GAAG;;;;aAIC,OAAO,mBAAmB;;CAErC,MAAM,GAAG;;;;;oBAKS,OAAO,oBAAoB;;;CAG7C,OAAO,GAAG;;;;;;;;;;oBAUQ,OAAO,oBAAoB;;;;CAI7C,MAAM,GAAG;;;;CAIT,OAAO,GAAG;;;iBAGK,OAAO,iBAAiB;;;;aAI5B,OAAO,UAAU;;;;CAI5B,aAAa,GAAG;aACL,OAAO,WAAW;;CAE7B,cAAc,GAAG;aACN,OAAO,aAAa;;AAEjC,EAAE"}
package/es/dashboard/PageSkeleton/style.mjs CHANGED
@@ -52,7 +52,7 @@ const styles = createStaticStyles(({ css, cssVar, responsive }) => ({
52
52
  min-block-size: 54px;
53
53
  padding-block: 12px;
54
54
  padding-inline: 16px;
55
- border-block-end: 1px solid ${cssVar.colorBorderSecondary};
55
+ border-block-end: 1px solid var(--lobe-fill-border, ${cssVar.colorFill});
56
56
 
57
57
  &:last-child {
58
58
  border-block-end: none;
package/es/dashboard/PageSkeleton/style.mjs.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"style.mjs","names":[],"sources":["../../../src/dashboard/PageSkeleton/style.ts"],"sourcesContent":["import { createStaticStyles } from 'antd-style';\n\nexport const styles = createStaticStyles(({ css, cssVar, responsive }) => ({\n action: css`\n flex: none;\n inline-size: 96px;\n block-size: 32px;\n\n ${responsive.mobile} {\n inline-size: 100%;\n block-size: 44px;\n }\n `,\n cell: css`\n flex: none;\n inline-size: 88px;\n block-size: 14px;\n `,\n copy: css`\n flex: 1;\n min-inline-size: 0;\n `,\n header: css`\n display: flex;\n gap: 16px;\n align-items: flex-start;\n justify-content: space-between;\n\n ${responsive.mobile} {\n flex-direction: column;\n align-items: stretch;\n }\n `,\n headerCopy: css`\n display: flex;\n flex: 1;\n flex-direction: column;\n gap: 8px;\n\n min-inline-size: 0;\n `,\n page: css`\n display: flex;\n flex-direction: column;\n gap: 20px;\n `,\n row: css`\n display: flex;\n gap: 12px;\n align-items: center;\n\n min-block-size: 54px;\n padding-block: 12px;\n padding-inline: 16px;\n border-block-end: 1px solid ${cssVar.colorBorderSecondary};\n\n &:last-child {\n border-block-end: none;\n }\n `,\n srOnly: css`\n position: absolute;\n\n overflow: hidden;\n\n inline-size: 1px;\n block-size: 1px;\n\n white-space: nowrap;\n\n clip-path: inset(50%);\n `,\n statGrid: css`\n display: grid;\n grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));\n gap: 12px;\n `,\n stat: css`\n overflow: clip;\n display: flex;\n flex-direction: column;\n padding: 16px;\n `,\n statValue: css`\n inline-size: 42%;\n block-size: ${cssVar.fontSizeHeading2};\n margin-block: 6px 14px;\n `,\n table: css`\n overflow: hidden;\n min-inline-size: 0;\n `,\n tag: css`\n flex: none;\n inline-size: 72px;\n block-size: 22px;\n border-radius: ${cssVar.borderRadiusSM};\n `,\n thead: css`\n display: flex;\n gap: 12px;\n align-items: center;\n\n min-block-size: 39px;\n padding-block: 10px;\n padding-inline: 16px;\n\n background: ${cssVar.colorFillTertiary};\n `,\n theadCell: css`\n flex: none;\n block-size: 12px;\n `,\n title: css`\n inline-size: 220px;\n max-inline-size: 70%;\n block-size: ${cssVar.fontSizeHeading3};\n `,\n}));\n"],"mappings":";;AAEA,MAAa,SAAS,oBAAoB,EAAE,KAAK,QAAQ,kBAAkB;CACzE,QAAQ,GAAG;;;;;MAKP,WAAW,OAAO;;;;;CAKtB,MAAM,GAAG;;;;;CAKT,MAAM,GAAG;;;;CAIT,QAAQ,GAAG;;;;;;MAMP,WAAW,OAAO;;;;;CAKtB,YAAY,GAAG;;;;;;;;CAQf,MAAM,GAAG;;;;;CAKT,KAAK,GAAG;;;;;;;;kCAQwB,OAAO,qBAAqB;;;;;;CAM5D,QAAQ,GAAG;;;;;;;;;;;;CAYX,UAAU,GAAG;;;;;CAKb,MAAM,GAAG;;;;;;CAMT,WAAW,GAAG;;kBAEE,OAAO,iBAAiB;;;CAGxC,OAAO,GAAG;;;;CAIV,KAAK,GAAG;;;;qBAIW,OAAO,eAAe;;CAEzC,OAAO,GAAG;;;;;;;;;kBASM,OAAO,kBAAkB;;CAEzC,WAAW,GAAG;;;;CAId,OAAO,GAAG;;;kBAGM,OAAO,iBAAiB;;AAE1C,EAAE"}
1
+ {"version":3,"file":"style.mjs","names":[],"sources":["../../../src/dashboard/PageSkeleton/style.ts"],"sourcesContent":["import { createStaticStyles } from 'antd-style';\n\nexport const styles = createStaticStyles(({ css, cssVar, responsive }) => ({\n action: css`\n flex: none;\n inline-size: 96px;\n block-size: 32px;\n\n ${responsive.mobile} {\n inline-size: 100%;\n block-size: 44px;\n }\n `,\n cell: css`\n flex: none;\n inline-size: 88px;\n block-size: 14px;\n `,\n copy: css`\n flex: 1;\n min-inline-size: 0;\n `,\n header: css`\n display: flex;\n gap: 16px;\n align-items: flex-start;\n justify-content: space-between;\n\n ${responsive.mobile} {\n flex-direction: column;\n align-items: stretch;\n }\n `,\n headerCopy: css`\n display: flex;\n flex: 1;\n flex-direction: column;\n gap: 8px;\n\n min-inline-size: 0;\n `,\n page: css`\n display: flex;\n flex-direction: column;\n gap: 20px;\n `,\n row: css`\n display: flex;\n gap: 12px;\n align-items: center;\n\n min-block-size: 54px;\n padding-block: 12px;\n padding-inline: 16px;\n border-block-end: 1px solid var(--lobe-fill-border, ${cssVar.colorFill});\n\n &:last-child {\n border-block-end: none;\n }\n `,\n srOnly: css`\n position: absolute;\n\n overflow: hidden;\n\n inline-size: 1px;\n block-size: 1px;\n\n white-space: nowrap;\n\n clip-path: inset(50%);\n `,\n statGrid: css`\n display: grid;\n grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));\n gap: 12px;\n `,\n stat: css`\n overflow: clip;\n display: flex;\n flex-direction: column;\n padding: 16px;\n `,\n statValue: css`\n inline-size: 42%;\n block-size: ${cssVar.fontSizeHeading2};\n margin-block: 6px 14px;\n `,\n table: css`\n overflow: hidden;\n min-inline-size: 0;\n `,\n tag: css`\n flex: none;\n inline-size: 72px;\n block-size: 22px;\n border-radius: ${cssVar.borderRadiusSM};\n `,\n thead: css`\n display: flex;\n gap: 12px;\n align-items: center;\n\n min-block-size: 39px;\n padding-block: 10px;\n padding-inline: 16px;\n\n background: ${cssVar.colorFillTertiary};\n `,\n theadCell: css`\n flex: none;\n block-size: 12px;\n `,\n title: css`\n inline-size: 220px;\n max-inline-size: 70%;\n block-size: ${cssVar.fontSizeHeading3};\n `,\n}));\n"],"mappings":";;AAEA,MAAa,SAAS,oBAAoB,EAAE,KAAK,QAAQ,kBAAkB;CACzE,QAAQ,GAAG;;;;;MAKP,WAAW,OAAO;;;;;CAKtB,MAAM,GAAG;;;;;CAKT,MAAM,GAAG;;;;CAIT,QAAQ,GAAG;;;;;;MAMP,WAAW,OAAO;;;;;CAKtB,YAAY,GAAG;;;;;;;;CAQf,MAAM,GAAG;;;;;CAKT,KAAK,GAAG;;;;;;;;0DAQgD,OAAO,UAAU;;;;;;CAMzE,QAAQ,GAAG;;;;;;;;;;;;CAYX,UAAU,GAAG;;;;;CAKb,MAAM,GAAG;;;;;;CAMT,WAAW,GAAG;;kBAEE,OAAO,iBAAiB;;;CAGxC,OAAO,GAAG;;;;CAIV,KAAK,GAAG;;;;qBAIW,OAAO,eAAe;;CAEzC,OAAO,GAAG;;;;;;;;;kBASM,OAAO,kBAAkB;;CAEzC,WAAW,GAAG;;;;CAId,OAAO,GAAG;;;kBAGM,OAAO,iBAAiB;;AAE1C,EAAE"}
package/es/dashboard/Surface/link.d.mts CHANGED
@@ -10,7 +10,7 @@ declare const useSurfaceLink: (override?: SurfaceRenderLink) => SurfaceRenderLin
10
10
  /** How many Surface cards wrap this node. A table can skip its own card when already inside one. */
11
11
  declare const useSurfaceDepth: () => number;
12
12
  /**
13
- * Class for a dashboard card: `colorBgContainer` in light, translucent `colorFillTertiary` in
13
+ * Class for a dashboard card: `colorBgContainer` in light, translucent `colorFillQuaternary` in
14
14
  * dark, and no fill of its own when nested in another Surface.
15
15
  */
16
16
  declare const useSurfaceCardClassName: () => string;
package/es/dashboard/Surface/link.mjs CHANGED
@@ -19,7 +19,7 @@ const useSurfaceLink = (override) => override ?? use(SurfaceLinkContext);
19
19
  /** How many Surface cards wrap this node. A table can skip its own card when already inside one. */
20
20
  const useSurfaceDepth = () => use(SurfaceDepthContext);
21
21
  /**
22
- * Class for a dashboard card: `colorBgContainer` in light, translucent `colorFillTertiary` in
22
+ * Class for a dashboard card: `colorBgContainer` in light, translucent `colorFillQuaternary` in
23
23
  * dark, and no fill of its own when nested in another Surface.
24
24
  */
25
25
  const useSurfaceCardClassName = () => {
package/es/dashboard/Surface/link.mjs.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"link.mjs","names":[],"sources":["../../../src/dashboard/Surface/link.tsx"],"sourcesContent":["'use client';\n\nimport { cx, useThemeMode } from 'antd-style';\nimport { createContext, type ReactNode, use } from 'react';\n\nimport { styles } from './style';\nimport type { SurfaceLinkProps, SurfaceRenderLink } from './type';\n\nconst defaultRenderLink: SurfaceRenderLink = ({ children, ...rest }: SurfaceLinkProps) => (\n <a {...rest}>{children}</a>\n);\n\nconst SurfaceLinkContext = createContext<SurfaceRenderLink>(defaultRenderLink);\n\nconst SurfaceDepthContext = createContext(0);\n\n/** Plugs the app router into every dashboard card link (Surface, MetricStrip, Section). */\nexport const SurfaceLinkProvider = ({\n children,\n renderLink,\n}: {\n children?: ReactNode;\n renderLink: SurfaceRenderLink;\n}) => <SurfaceLinkContext value={renderLink}>{children}</SurfaceLinkContext>;\n\nexport const useSurfaceLink = (override?: SurfaceRenderLink) => override ?? use(SurfaceLinkContext);\n\n/** How many Surface cards wrap this node. A table can skip its own card when already inside one. */\nexport const useSurfaceDepth = () => use(SurfaceDepthContext);\n\nexport { SurfaceDepthContext };\n\n/**\n * Class for a dashboard card: `colorBgContainer` in light, translucent `colorFillTertiary` in\n * dark, and no fill of its own when nested in another Surface.\n */\nexport const useSurfaceCardClassName = () => {\n const { isDarkMode } = useThemeMode();\n const depth = useSurfaceDepth();\n return cx(styles.card, isDarkMode && styles.cardDark, depth > 0 && styles.cardNested);\n};\n"],"mappings":";;;;;;AAQA,MAAM,qBAAwC,EAAE,UAAU,GAAG,WAC3D,oBAAC,KAAD;CAAG,GAAI;CAAO;AAAY,CAAA;AAG5B,MAAM,qBAAqB,cAAiC,iBAAiB;AAE7E,MAAM,sBAAsB,cAAc,CAAC;;AAG3C,MAAa,uBAAuB,EAClC,UACA,iBAII,oBAAC,oBAAD;CAAoB,OAAO;CAAa;AAA6B,CAAA;AAE3E,MAAa,kBAAkB,aAAiC,YAAY,IAAI,kBAAkB;;AAGlG,MAAa,wBAAwB,IAAI,mBAAmB;;;;;AAQ5D,MAAa,gCAAgC;CAC3C,MAAM,EAAE,eAAe,aAAa;CACpC,MAAM,QAAQ,gBAAgB;CAC9B,OAAO,GAAG,OAAO,MAAM,cAAc,OAAO,UAAU,QAAQ,KAAK,OAAO,UAAU;AACtF"}
1
+ {"version":3,"file":"link.mjs","names":[],"sources":["../../../src/dashboard/Surface/link.tsx"],"sourcesContent":["'use client';\n\nimport { cx, useThemeMode } from 'antd-style';\nimport { createContext, type ReactNode, use } from 'react';\n\nimport { styles } from './style';\nimport type { SurfaceLinkProps, SurfaceRenderLink } from './type';\n\nconst defaultRenderLink: SurfaceRenderLink = ({ children, ...rest }: SurfaceLinkProps) => (\n <a {...rest}>{children}</a>\n);\n\nconst SurfaceLinkContext = createContext<SurfaceRenderLink>(defaultRenderLink);\n\nconst SurfaceDepthContext = createContext(0);\n\n/** Plugs the app router into every dashboard card link (Surface, MetricStrip, Section). */\nexport const SurfaceLinkProvider = ({\n children,\n renderLink,\n}: {\n children?: ReactNode;\n renderLink: SurfaceRenderLink;\n}) => <SurfaceLinkContext value={renderLink}>{children}</SurfaceLinkContext>;\n\nexport const useSurfaceLink = (override?: SurfaceRenderLink) => override ?? use(SurfaceLinkContext);\n\n/** How many Surface cards wrap this node. A table can skip its own card when already inside one. */\nexport const useSurfaceDepth = () => use(SurfaceDepthContext);\n\nexport { SurfaceDepthContext };\n\n/**\n * Class for a dashboard card: `colorBgContainer` in light, translucent `colorFillQuaternary` in\n * dark, and no fill of its own when nested in another Surface.\n */\nexport const useSurfaceCardClassName = () => {\n const { isDarkMode } = useThemeMode();\n const depth = useSurfaceDepth();\n return cx(styles.card, isDarkMode && styles.cardDark, depth > 0 && styles.cardNested);\n};\n"],"mappings":";;;;;;AAQA,MAAM,qBAAwC,EAAE,UAAU,GAAG,WAC3D,oBAAC,KAAD;CAAG,GAAI;CAAO;AAAY,CAAA;AAG5B,MAAM,qBAAqB,cAAiC,iBAAiB;AAE7E,MAAM,sBAAsB,cAAc,CAAC;;AAG3C,MAAa,uBAAuB,EAClC,UACA,iBAII,oBAAC,oBAAD;CAAoB,OAAO;CAAa;AAA6B,CAAA;AAE3E,MAAa,kBAAkB,aAAiC,YAAY,IAAI,kBAAkB;;AAGlG,MAAa,wBAAwB,IAAI,mBAAmB;;;;;AAQ5D,MAAa,gCAAgC;CAC3C,MAAM,EAAE,eAAe,aAAa;CACpC,MAAM,QAAQ,gBAAgB;CAC9B,OAAO,GAAG,OAAO,MAAM,cAAc,OAAO,UAAU,QAAQ,KAAK,OAAO,UAAU;AACtF"}
package/es/dashboard/Surface/style.d.mts CHANGED
@@ -3,17 +3,18 @@
3
3
  * A content card sitting on the workspace.
4
4
  *
5
5
  * Backgrounds: light mode uses `colorBgContainer`. Dark mode uses the translucent
6
- * `colorFillTertiary` (white 6%): on the #0d0d0d workspace it reads as about #1c1c1c, a subtle
7
- * raised step. `colorFillQuaternary` (white 2%, about #111) would barely separate from the page.
6
+ * `colorFillQuaternary` (white 2%), one step below `colorFillTertiary`, for a quieter raised
7
+ * step on the workspace.
8
8
  *
9
- * Borders and inner dividers (table, header and cell lines, PageSkeleton, strip seams) all use the
10
- * outer border token `colorBorderSecondary` (light and dark); hover and focus use the stronger
11
- * `colorFill`. The card follows Block: light is Block `outlined` (`colorBgContainer` +
12
- * `colorBorderSecondary`), dark uses the Block `filled` background (`colorFillTertiary`) with the
13
- * same `colorBorderSecondary` border.
9
+ * Borders and inner dividers (table, header and cell lines, PageSkeleton, strip seams) all use
10
+ * `--lobe-fill-border` (`colorFill` in light, `colorFillSecondary` in dark; set on `:root` by
11
+ * ThemeProvider). Hover / focus / stronger edges use `--lobe-fill-border-strong` (light:
12
+ * `colorFill` mixed 15% toward `colorText`; dark: `colorFill`). Light is Block `outlined`
13
+ * (`colorBgContainer` + border); dark uses translucent `colorFillQuaternary` with the same
14
+ * border var.
14
15
  *
15
16
  * Anything that must hide content scrolled beneath it (table header cells, pinned and sticky
16
- * cells, their scroll shadows) uses `--lobe-surface-bg-solid`: the same white 6% blended onto
17
+ * cells, their scroll shadows) uses `--lobe-surface-bg-solid`: the same white 2% blended onto
17
18
  * `--lobe-surface-canvas` (default `colorBgContainer`, the ConsoleShell workspace). `color-mix`
18
19
  * in srgb with an opaque base is plain alpha compositing, so it matches the translucent card.
19
20
  * Set `--lobe-surface-canvas` when a card sits on another page color.
package/es/dashboard/Surface/style.mjs CHANGED
@@ -4,17 +4,18 @@ import { createStaticStyles } from "antd-style";
4
4
  * A content card sitting on the workspace.
5
5
  *
6
6
  * Backgrounds: light mode uses `colorBgContainer`. Dark mode uses the translucent
7
- * `colorFillTertiary` (white 6%): on the #0d0d0d workspace it reads as about #1c1c1c, a subtle
8
- * raised step. `colorFillQuaternary` (white 2%, about #111) would barely separate from the page.
7
+ * `colorFillQuaternary` (white 2%), one step below `colorFillTertiary`, for a quieter raised
8
+ * step on the workspace.
9
9
  *
10
- * Borders and inner dividers (table, header and cell lines, PageSkeleton, strip seams) all use the
11
- * outer border token `colorBorderSecondary` (light and dark); hover and focus use the stronger
12
- * `colorFill`. The card follows Block: light is Block `outlined` (`colorBgContainer` +
13
- * `colorBorderSecondary`), dark uses the Block `filled` background (`colorFillTertiary`) with the
14
- * same `colorBorderSecondary` border.
10
+ * Borders and inner dividers (table, header and cell lines, PageSkeleton, strip seams) all use
11
+ * `--lobe-fill-border` (`colorFill` in light, `colorFillSecondary` in dark; set on `:root` by
12
+ * ThemeProvider). Hover / focus / stronger edges use `--lobe-fill-border-strong` (light:
13
+ * `colorFill` mixed 15% toward `colorText`; dark: `colorFill`). Light is Block `outlined`
14
+ * (`colorBgContainer` + border); dark uses translucent `colorFillQuaternary` with the same
15
+ * border var.
15
16
  *
16
17
  * Anything that must hide content scrolled beneath it (table header cells, pinned and sticky
17
- * cells, their scroll shadows) uses `--lobe-surface-bg-solid`: the same white 6% blended onto
18
+ * cells, their scroll shadows) uses `--lobe-surface-bg-solid`: the same white 2% blended onto
18
19
  * `--lobe-surface-canvas` (default `colorBgContainer`, the ConsoleShell workspace). `color-mix`
19
20
  * in srgb with an opaque base is plain alpha compositing, so it matches the translucent card.
20
21
  * Set `--lobe-surface-canvas` when a card sits on another page color.
@@ -32,7 +33,7 @@ const styles = createStaticStyles(({ css, cssVar }) => ({
32
33
 
33
34
  &&,
34
35
  &&:hover {
35
- border: 1px solid ${cssVar.colorBorderSecondary};
36
+ border: 1px solid var(--lobe-fill-border, ${cssVar.colorFill});
36
37
  border-radius: ${cssVar.borderRadiusLG};
37
38
  background: var(--lobe-surface-bg);
38
39
  box-shadow: rgb(0 0 0 / 4%) 0 1px 2px 0;
@@ -40,16 +41,16 @@ const styles = createStaticStyles(({ css, cssVar }) => ({
40
41
  `,
41
42
  cardDark: css`
42
43
  &&& {
43
- --lobe-surface-bg: ${cssVar.colorFillTertiary};
44
+ --lobe-surface-bg: ${cssVar.colorFillQuaternary};
44
45
 
45
- /* colorFillTertiary is white 6% in dark; blend the same amount onto the page. */
46
+ /* colorFillQuaternary is white 2% in dark; blend the same amount onto the page. */
46
47
  --lobe-surface-bg-solid: color-mix(
47
48
  in srgb,
48
- #fff 6%,
49
+ #fff 2%,
49
50
  var(--lobe-surface-canvas, ${cssVar.colorBgContainer})
50
51
  );
51
52
 
52
- /* Border: Block's border token (colorBorderSecondary) in both modes, from \`card\`. */
53
+ /* Border: --lobe-fill-border (dark: colorFillSecondary) from \`card\`. */
53
54
  }
54
55
  `,
55
56
  cardNested: css`
@@ -124,7 +125,7 @@ const styles = createStaticStyles(({ css, cssVar }) => ({
124
125
 
125
126
  && .ant-table-css-var,
126
127
  && .ant-table-wrapper {
127
- --ant-table-border-color: ${cssVar.colorBorderSecondary};
128
+ --ant-table-border-color: var(--lobe-fill-border, ${cssVar.colorFill});
128
129
  --ant-table-row-hover-bg: color-mix(
129
130
  in srgb,
130
131
  ${cssVar.colorText} 6%,
@@ -138,7 +139,7 @@ const styles = createStaticStyles(({ css, cssVar }) => ({
138
139
  white-space: nowrap;
139
140
 
140
141
  background: var(--lobe-surface-bg-solid, ${cssVar.colorBgContainer});
141
- box-shadow: inset 0 -1px 0 ${cssVar.colorBorderSecondary};
142
+ box-shadow: inset 0 -1px 0 var(--lobe-fill-border, ${cssVar.colorFill});
142
143
  }
143
144
 
144
145
  /* Pinned body cells inherit the transparent body, so a scrolled cell paints
@@ -202,7 +203,7 @@ const styles = createStaticStyles(({ css, cssVar }) => ({
202
203
  }
203
204
 
204
205
  && td {
205
- border-block-end-color: ${cssVar.colorBorderSecondary};
206
+ border-block-end-color: var(--lobe-fill-border, ${cssVar.colorFill});
206
207
  }
207
208
 
208
209
  && tr:hover > td,
@@ -224,7 +225,7 @@ const styles = createStaticStyles(({ css, cssVar }) => ({
224
225
  cardLinked: css`
225
226
  &&:hover,
226
227
  &&:focus-within {
227
- border-color: ${cssVar.colorFill};
228
+ border-color: var(--lobe-fill-border-strong, ${cssVar.colorFill});
228
229
  }
229
230
 
230
231
  &&:hover [data-surface-arrow] {
@@ -258,7 +259,7 @@ const styles = createStaticStyles(({ css, cssVar }) => ({
258
259
  min-block-size: 48px;
259
260
  padding-block: 8px;
260
261
  padding-inline: 16px;
261
- border-block-end: 1px solid ${cssVar.colorBorderSecondary};
262
+ border-block-end: 1px solid var(--lobe-fill-border, ${cssVar.colorFill});
262
263
  `,
263
264
  heading: css`
264
265
  min-inline-size: 0;