@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.
- package/es/ThemeProvider/GlobalStyle/essential.mjs +11 -0
- package/es/ThemeProvider/GlobalStyle/essential.mjs.map +1 -1
- package/es/base-ui/Table/FixedFrost.mjs +120 -0
- package/es/base-ui/Table/FixedFrost.mjs.map +1 -0
- package/es/base-ui/Table/Table.mjs +52 -47
- package/es/base-ui/Table/Table.mjs.map +1 -1
- package/es/base-ui/Table/style.mjs +188 -82
- package/es/base-ui/Table/style.mjs.map +1 -1
- package/es/base-ui/Text/style.d.mts +1 -1
- package/es/dashboard/ConsoleNav/style.mjs +2 -2
- package/es/dashboard/ConsoleNav/style.mjs.map +1 -1
- package/es/dashboard/FilterSidebar/style.mjs +2 -2
- package/es/dashboard/FilterSidebar/style.mjs.map +1 -1
- package/es/dashboard/FilterStrip/style.mjs +1 -1
- package/es/dashboard/FilterStrip/style.mjs.map +1 -1
- package/es/dashboard/MetricStrip/style.mjs +1 -1
- package/es/dashboard/MetricStrip/style.mjs.map +1 -1
- package/es/dashboard/PageSkeleton/style.mjs +1 -1
- package/es/dashboard/PageSkeleton/style.mjs.map +1 -1
- package/es/dashboard/Surface/link.d.mts +1 -1
- package/es/dashboard/Surface/link.mjs +1 -1
- package/es/dashboard/Surface/link.mjs.map +1 -1
- package/es/dashboard/Surface/style.d.mts +9 -8
- package/es/dashboard/Surface/style.mjs +19 -18
- package/es/dashboard/Surface/style.mjs.map +1 -1
- package/package.json +1 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"style.mjs","names":[],"sources":["../../../src/dashboard/Surface/style.ts"],"sourcesContent":["import { createStaticStyles } from 'antd-style';\n\n/**\n * A content card sitting on the workspace.\n *\n * Backgrounds: light mode uses `colorBgContainer`. Dark mode uses the translucent\n * `colorFillTertiary` (white 6%): on the #0d0d0d workspace it reads as about #1c1c1c, a subtle\n * raised step. `colorFillQuaternary` (white 2%, about #111) would barely separate from the page.\n *\n * Borders and inner dividers (table, header and cell lines, PageSkeleton, strip seams) all use the\n * outer border token `colorBorderSecondary` (light and dark); hover and focus use the stronger\n * `colorFill`. The card follows Block: light is Block `outlined` (`colorBgContainer` +\n * `colorBorderSecondary`), dark uses the Block `filled` background (`colorFillTertiary`) with the\n * same `colorBorderSecondary` border.\n *\n * Anything that must hide content scrolled beneath it (table header cells, pinned and sticky\n * cells, their scroll shadows) uses `--lobe-surface-bg-solid`: the same white 6% blended onto\n * `--lobe-surface-canvas` (default `colorBgContainer`, the ConsoleShell workspace). `color-mix`\n * in srgb with an opaque base is plain alpha compositing, so it matches the translucent card.\n * Set `--lobe-surface-canvas` when a card sits on another page color.\n *\n * A Surface inside another Surface (`useSurfaceDepth() > 0`) drops its own fill so fills do not\n * stack. Row hover backgrounds keep their own mix. Layout containers (ConsoleShell, ConsoleNav,\n * FilterSidebar split divider, AuthLayout page canvas) keep their own tokens.\n *\n * Apply the card with `useSurfaceCardClassName()`; plain `surfaceStyles.card` is the light look.\n */\nexport const styles = createStaticStyles(({ css, cssVar }) => ({\n card: css`\n --lobe-surface-bg: ${cssVar.colorBgContainer};\n --lobe-surface-bg-solid: ${cssVar.colorBgContainer};\n\n &&,\n &&:hover {\n border: 1px solid ${cssVar.colorBorderSecondary};\n border-radius: ${cssVar.borderRadiusLG};\n background: var(--lobe-surface-bg);\n box-shadow: rgb(0 0 0 / 4%) 0 1px 2px 0;\n }\n `,\n cardDark: css`\n &&& {\n --lobe-surface-bg: ${cssVar.colorFillTertiary};\n\n /* colorFillTertiary is white 6% in dark; blend the same amount onto the page. */\n --lobe-surface-bg-solid: color-mix(\n in srgb,\n #fff 6%,\n var(--lobe-surface-canvas, ${cssVar.colorBgContainer})\n );\n\n /* Border: Block's border token (colorBorderSecondary) in both modes, from \\`card\\`. */\n }\n `,\n cardNested: css`\n &&&,\n &&&:hover {\n background: transparent;\n }\n `,\n chart: css`\n min-inline-size: 0;\n `,\n /**\n * Rounded corners clip whatever reaches the edge: a bled table, header rule, chart, or a\n * tab / segmented indicator. \\`clip\\` (not \\`hidden\\`) creates no scroll container, so sticky\n * table headers keep sticking to the page scroller; popups are portaled and unaffected.\n */\n clip: css`\n overflow: clip;\n `,\n loading: css`\n padding-block: 4px 8px;\n `,\n arrow: css`\n flex: none;\n\n margin-block-start: 8px;\n margin-inline-start: auto;\n\n color: ${cssVar.colorTextTertiary};\n\n transition:\n color 150ms ease-out,\n transform 150ms ease-out;\n `,\n arrowLink: css`\n display: flex;\n flex: none;\n align-items: center;\n color: inherit;\n\n & [data-surface-arrow] {\n margin-block-start: 0;\n }\n `,\n bleed: css`\n && th,\n && td {\n padding-inline: 16px;\n }\n\n && th {\n white-space: nowrap;\n }\n `,\n body: css`\n --surface-pad-inline: 16px;\n --surface-pad-block: 16px;\n\n padding: 16px;\n `,\n /** Table and header rules for the rich card. Kept off `card` so the shared class stays a plain frame. */\n content: css`\n min-inline-size: 0;\n\n /* Ant Design paints its own container color on .ant-table and the cells.\n Clear it so the card background shows through; the card owns the fill. */\n && .ant-table,\n && th,\n && td {\n background: transparent;\n }\n\n && .ant-table-css-var,\n && .ant-table-wrapper {\n --ant-table-border-color: ${cssVar.colorBorderSecondary};\n --ant-table-row-hover-bg: color-mix(\n in srgb,\n ${cssVar.colorText} 6%,\n ${cssVar.colorBgElevated}\n );\n }\n\n && th {\n font-weight: 500;\n color: ${cssVar.colorTextSecondary};\n white-space: nowrap;\n\n background: var(--lobe-surface-bg-solid, ${cssVar.colorBgContainer});\n box-shadow: inset 0 -1px 0 ${cssVar.colorBorderSecondary};\n }\n\n /* Pinned body cells inherit the transparent body, so a scrolled cell paints\n straight through them. Frost with the card color. Header pins stay the\n same solid fill as the rest of the header — a translucent header reads\n as a lighter strip in dark mode. */\n && td.ant-table-cell-fix-start,\n && td.ant-table-cell-fix-end {\n background: var(--lobe-surface-bg-solid, ${cssVar.colorBgContainer});\n backdrop-filter: blur(12px);\n }\n\n && td.ant-table-cell-fix-end-shadow-show::after {\n background: linear-gradient(\n to left,\n color-mix(\n in srgb,\n var(--lobe-surface-bg-solid, ${cssVar.colorBgContainer}) 72%,\n transparent\n ),\n transparent\n );\n backdrop-filter: blur(8px);\n }\n\n && td.ant-table-cell-fix-start-shadow-show::after {\n background: linear-gradient(\n to right,\n color-mix(\n in srgb,\n var(--lobe-surface-bg-solid, ${cssVar.colorBgContainer}) 72%,\n transparent\n ),\n transparent\n );\n backdrop-filter: blur(8px);\n }\n\n [dir='rtl'] && td.ant-table-cell-fix-end-shadow-show::after {\n background: linear-gradient(\n to right,\n color-mix(\n in srgb,\n var(--lobe-surface-bg-solid, ${cssVar.colorBgContainer}) 72%,\n transparent\n ),\n transparent\n );\n }\n\n [dir='rtl'] && td.ant-table-cell-fix-start-shadow-show::after {\n background: linear-gradient(\n to left,\n color-mix(\n in srgb,\n var(--lobe-surface-bg-solid, ${cssVar.colorBgContainer}) 72%,\n transparent\n ),\n transparent\n );\n }\n\n && td {\n border-block-end-color: ${cssVar.colorBorderSecondary};\n }\n\n && tr:hover > td,\n && .ant-table-tbody > tr.ant-table-row:hover > td {\n background: color-mix(in srgb, ${cssVar.colorText} 6%, ${cssVar.colorBgElevated});\n }\n\n /* base-ui Table pins with inline position:sticky, not .ant-table-cell-fix-*.\n The transparent body rule above would let scrolled text show through. */\n && td[style*='sticky'] {\n background: var(--lobe-surface-bg-solid, ${cssVar.colorBgContainer});\n }\n\n && tr:hover > td[style*='sticky'] {\n background: color-mix(in srgb, ${cssVar.colorText} 6%, ${cssVar.colorBgElevated});\n }\n `,\n /** Whole card answers hover when its header drills into another page. */\n cardLinked: css`\n &&:hover,\n &&:focus-within {\n border-color: ${cssVar.colorFill};\n }\n\n &&:hover [data-surface-arrow] {\n transform: translate(1px, -1px);\n color: ${cssVar.colorText};\n }\n `,\n desc: css`\n margin-block-start: -4px;\n\n font-size: 13px;\n font-weight: 400;\n line-height: 1.45;\n color: ${cssVar.colorTextSecondary};\n `,\n /* One fixed control row (32px, the height of a small Segmented or a default ActionIcon), so a\n header with controls is exactly as tall as one without, and the controls sit centered with\n 8px clear above the divider. */\n extra: css`\n display: flex;\n flex: none;\n gap: 8px;\n align-items: center;\n\n block-size: 32px;\n `,\n header: css`\n display: flex;\n gap: 12px;\n align-items: flex-start;\n justify-content: space-between;\n\n box-sizing: border-box;\n min-block-size: 48px;\n padding-block: 8px;\n padding-inline: 16px;\n border-block-end: 1px solid ${cssVar.colorBorderSecondary};\n `,\n heading: css`\n min-inline-size: 0;\n `,\n headingLink: css`\n display: flex;\n flex: 1;\n gap: 12px;\n align-items: flex-start;\n\n min-inline-size: 0;\n\n color: inherit;\n text-decoration: none;\n\n &:hover {\n color: inherit;\n }\n `,\n /**\n * A table inside padded card body meets the card's left, right, and bottom\n * edges. A table that is the only body content also meets the header.\n * Padding amounts come from `--surface-pad-*` on the same element.\n */\n tableBleed: css`\n /* A table nested in a cell keeps the cell's own inset. */\n && :has(> [data-table-wrapper]):not(td :has(> [data-table-wrapper])) {\n width: calc(100% + 2 * var(--surface-pad-inline, 16px));\n margin-inline: calc(-1 * var(--surface-pad-inline, 16px));\n }\n\n && :has(> [data-table-wrapper]):not(td :has(> [data-table-wrapper])):last-child {\n margin-block-end: calc(-1 * var(--surface-pad-block, 16px));\n }\n\n && :has(> [data-table-wrapper]):not(td :has(> [data-table-wrapper])):first-child:last-child {\n margin-block-start: calc(-1 * var(--surface-pad-block, 16px));\n }\n\n /* ProTable keeps its search and toolbar in the padding. The table itself\n meets the card's left, right, and bottom edges. Lower-specificity\n selectors stay above the :has(th/td) rules for stylelint. */\n && .ant-table-css-var,\n && .ant-table-wrapper {\n --ant-table-cell-padding-inline: var(--surface-pad-inline, 16px);\n --ant-table-cell-padding-inline-md: var(--surface-pad-inline, 16px);\n --ant-table-cell-padding-inline-sm: var(--surface-pad-inline, 16px);\n --ant-table-header-border-radius: 0;\n }\n\n && .ant-table-wrapper {\n width: calc(100% + 2 * var(--surface-pad-inline, 16px));\n max-width: none;\n margin-inline: calc(-1 * var(--surface-pad-inline, 16px));\n }\n\n /* A plain table that is the card body meets the header and the bottom edge.\n Its own corner radius would otherwise float inside the card padding. */\n && > .lobe-flex:only-child > .ant-table-wrapper:only-child {\n margin-block: calc(-1 * var(--surface-pad-block, 16px));\n }\n\n && .ant-pro-table:last-child {\n margin-block-end: calc(-1 * var(--surface-pad-block, 16px));\n }\n\n && .ant-table-wrapper .ant-table,\n && .ant-table-wrapper .ant-table-container,\n && .ant-table-thead > tr > th,\n && .ant-table-thead > tr > th:first-child,\n && .ant-table-thead > tr > th:last-child {\n border-radius: 0;\n }\n\n && .ant-table-wrapper .ant-table-cell {\n padding-inline: var(--surface-pad-inline, 16px);\n }\n\n && .ant-table-wrapper .ant-pagination {\n margin-block: 0;\n padding-block: 12px;\n padding-inline: var(--surface-pad-inline, 16px);\n }\n\n && :has(> [data-table-wrapper]):not(td :has(> [data-table-wrapper])) th,\n && :has(> [data-table-wrapper]):not(td :has(> [data-table-wrapper])) td {\n padding-inline: var(--surface-pad-inline, 16px);\n }\n\n /* The root's negative bottom margin includes this sibling. Without block\n padding the pager sits on the card edge. Same inset as the ant pagination. */\n &&\n :has(> [data-table-wrapper]):not(td :has(> [data-table-wrapper]))\n > :not([data-table-wrapper]) {\n margin-block: 0;\n padding-block: 12px;\n padding-inline: var(--surface-pad-inline, 16px);\n }\n `,\n title: css`\n overflow: hidden;\n\n min-inline-size: 0;\n\n font-size: 14px;\n font-weight: 500;\n\n /* The title line is the 32px control row; extra and the arrow center on it, and a\n description adds its own line below without moving them. */\n line-height: 32px;\n color: ${cssVar.colorText};\n text-overflow: ellipsis;\n white-space: nowrap;\n `,\n}));\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;AA2BA,MAAa,SAAS,oBAAoB,EAAE,KAAK,cAAc;CAC7D,MAAM,GAAG;yBACc,OAAO,iBAAiB;+BAClB,OAAO,iBAAiB;;;;0BAI7B,OAAO,qBAAqB;uBAC/B,OAAO,eAAe;;;;;CAK3C,UAAU,GAAG;;2BAEY,OAAO,kBAAkB;;;;;;qCAMf,OAAO,iBAAiB;;;;;;CAM3D,YAAY,GAAG;;;;;;CAMf,OAAO,GAAG;;;;;;;;CAQV,MAAM,GAAG;;;CAGT,SAAS,GAAG;;;CAGZ,OAAO,GAAG;;;;;;aAMC,OAAO,kBAAkB;;;;;;CAMpC,WAAW,GAAG;;;;;;;;;;CAUd,OAAO,GAAG;;;;;;;;;;CAUV,MAAM,GAAG;;;;;;;CAOT,SAAS,GAAG;;;;;;;;;;;;;kCAaoB,OAAO,qBAAqB;;;UAGpD,OAAO,UAAU;UACjB,OAAO,gBAAgB;;;;;;eAMlB,OAAO,mBAAmB;;;iDAGQ,OAAO,iBAAiB;mCACtC,OAAO,qBAAqB;;;;;;;;;iDASd,OAAO,iBAAiB;;;;;;;;;yCAShC,OAAO,iBAAiB;;;;;;;;;;;;;yCAaxB,OAAO,iBAAiB;;;;;;;;;;;;;yCAaxB,OAAO,iBAAiB;;;;;;;;;;;;yCAYxB,OAAO,iBAAiB;;;;;;;;gCAQjC,OAAO,qBAAqB;;;;;uCAKrB,OAAO,UAAU,OAAO,OAAO,gBAAgB;;;;;;iDAMrC,OAAO,iBAAiB;;;;uCAIlC,OAAO,UAAU,OAAO,OAAO,gBAAgB;;;;CAIpF,YAAY,GAAG;;;sBAGK,OAAO,UAAU;;;;;eAKxB,OAAO,UAAU;;;CAG9B,MAAM,GAAG;;;;;;aAME,OAAO,mBAAmB;;CAKrC,OAAO,GAAG;;;;;;;;CAQV,QAAQ,GAAG;;;;;;;;;;kCAUqB,OAAO,qBAAqB;;CAE5D,SAAS,GAAG;;;CAGZ,aAAa,GAAG;;;;;;;;;;;;;;;;;;;;CAoBhB,YAAY,GAAG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA2Ef,OAAO,GAAG;;;;;;;;;;;aAWC,OAAO,UAAU;;;;AAI9B,EAAE"}
|
|
1
|
+
{"version":3,"file":"style.mjs","names":[],"sources":["../../../src/dashboard/Surface/style.ts"],"sourcesContent":["import { createStaticStyles } from 'antd-style';\n\n/**\n * A content card sitting on the workspace.\n *\n * Backgrounds: light mode uses `colorBgContainer`. Dark mode uses the translucent\n * `colorFillQuaternary` (white 2%), one step below `colorFillTertiary`, for a quieter raised\n * step on the workspace.\n *\n * Borders and inner dividers (table, header and cell lines, PageSkeleton, strip seams) all use\n * `--lobe-fill-border` (`colorFill` in light, `colorFillSecondary` in dark; set on `:root` by\n * ThemeProvider). Hover / focus / stronger edges use `--lobe-fill-border-strong` (light:\n * `colorFill` mixed 15% toward `colorText`; dark: `colorFill`). Light is Block `outlined`\n * (`colorBgContainer` + border); dark uses translucent `colorFillQuaternary` with the same\n * border var.\n *\n * Anything that must hide content scrolled beneath it (table header cells, pinned and sticky\n * cells, their scroll shadows) uses `--lobe-surface-bg-solid`: the same white 2% blended onto\n * `--lobe-surface-canvas` (default `colorBgContainer`, the ConsoleShell workspace). `color-mix`\n * in srgb with an opaque base is plain alpha compositing, so it matches the translucent card.\n * Set `--lobe-surface-canvas` when a card sits on another page color.\n *\n * A Surface inside another Surface (`useSurfaceDepth() > 0`) drops its own fill so fills do not\n * stack. Row hover backgrounds keep their own mix. Layout containers (ConsoleShell, ConsoleNav,\n * FilterSidebar split divider, AuthLayout page canvas) keep their own tokens.\n *\n * Apply the card with `useSurfaceCardClassName()`; plain `surfaceStyles.card` is the light look.\n */\nexport const styles = createStaticStyles(({ css, cssVar }) => ({\n card: css`\n --lobe-surface-bg: ${cssVar.colorBgContainer};\n --lobe-surface-bg-solid: ${cssVar.colorBgContainer};\n\n &&,\n &&:hover {\n border: 1px solid var(--lobe-fill-border, ${cssVar.colorFill});\n border-radius: ${cssVar.borderRadiusLG};\n background: var(--lobe-surface-bg);\n box-shadow: rgb(0 0 0 / 4%) 0 1px 2px 0;\n }\n `,\n cardDark: css`\n &&& {\n --lobe-surface-bg: ${cssVar.colorFillQuaternary};\n\n /* colorFillQuaternary is white 2% in dark; blend the same amount onto the page. */\n --lobe-surface-bg-solid: color-mix(\n in srgb,\n #fff 2%,\n var(--lobe-surface-canvas, ${cssVar.colorBgContainer})\n );\n\n /* Border: --lobe-fill-border (dark: colorFillSecondary) from \\`card\\`. */\n }\n `,\n cardNested: css`\n &&&,\n &&&:hover {\n background: transparent;\n }\n `,\n chart: css`\n min-inline-size: 0;\n `,\n /**\n * Rounded corners clip whatever reaches the edge: a bled table, header rule, chart, or a\n * tab / segmented indicator. \\`clip\\` (not \\`hidden\\`) creates no scroll container, so sticky\n * table headers keep sticking to the page scroller; popups are portaled and unaffected.\n */\n clip: css`\n overflow: clip;\n `,\n loading: css`\n padding-block: 4px 8px;\n `,\n arrow: css`\n flex: none;\n\n margin-block-start: 8px;\n margin-inline-start: auto;\n\n color: ${cssVar.colorTextTertiary};\n\n transition:\n color 150ms ease-out,\n transform 150ms ease-out;\n `,\n arrowLink: css`\n display: flex;\n flex: none;\n align-items: center;\n color: inherit;\n\n & [data-surface-arrow] {\n margin-block-start: 0;\n }\n `,\n bleed: css`\n && th,\n && td {\n padding-inline: 16px;\n }\n\n && th {\n white-space: nowrap;\n }\n `,\n body: css`\n --surface-pad-inline: 16px;\n --surface-pad-block: 16px;\n\n padding: 16px;\n `,\n /** Table and header rules for the rich card. Kept off `card` so the shared class stays a plain frame. */\n content: css`\n min-inline-size: 0;\n\n /* Ant Design paints its own container color on .ant-table and the cells.\n Clear it so the card background shows through; the card owns the fill. */\n && .ant-table,\n && th,\n && td {\n background: transparent;\n }\n\n && .ant-table-css-var,\n && .ant-table-wrapper {\n --ant-table-border-color: var(--lobe-fill-border, ${cssVar.colorFill});\n --ant-table-row-hover-bg: color-mix(\n in srgb,\n ${cssVar.colorText} 6%,\n ${cssVar.colorBgElevated}\n );\n }\n\n && th {\n font-weight: 500;\n color: ${cssVar.colorTextSecondary};\n white-space: nowrap;\n\n background: var(--lobe-surface-bg-solid, ${cssVar.colorBgContainer});\n box-shadow: inset 0 -1px 0 var(--lobe-fill-border, ${cssVar.colorFill});\n }\n\n /* Pinned body cells inherit the transparent body, so a scrolled cell paints\n straight through them. Frost with the card color. Header pins stay the\n same solid fill as the rest of the header — a translucent header reads\n as a lighter strip in dark mode. */\n && td.ant-table-cell-fix-start,\n && td.ant-table-cell-fix-end {\n background: var(--lobe-surface-bg-solid, ${cssVar.colorBgContainer});\n backdrop-filter: blur(12px);\n }\n\n && td.ant-table-cell-fix-end-shadow-show::after {\n background: linear-gradient(\n to left,\n color-mix(\n in srgb,\n var(--lobe-surface-bg-solid, ${cssVar.colorBgContainer}) 72%,\n transparent\n ),\n transparent\n );\n backdrop-filter: blur(8px);\n }\n\n && td.ant-table-cell-fix-start-shadow-show::after {\n background: linear-gradient(\n to right,\n color-mix(\n in srgb,\n var(--lobe-surface-bg-solid, ${cssVar.colorBgContainer}) 72%,\n transparent\n ),\n transparent\n );\n backdrop-filter: blur(8px);\n }\n\n [dir='rtl'] && td.ant-table-cell-fix-end-shadow-show::after {\n background: linear-gradient(\n to right,\n color-mix(\n in srgb,\n var(--lobe-surface-bg-solid, ${cssVar.colorBgContainer}) 72%,\n transparent\n ),\n transparent\n );\n }\n\n [dir='rtl'] && td.ant-table-cell-fix-start-shadow-show::after {\n background: linear-gradient(\n to left,\n color-mix(\n in srgb,\n var(--lobe-surface-bg-solid, ${cssVar.colorBgContainer}) 72%,\n transparent\n ),\n transparent\n );\n }\n\n && td {\n border-block-end-color: var(--lobe-fill-border, ${cssVar.colorFill});\n }\n\n && tr:hover > td,\n && .ant-table-tbody > tr.ant-table-row:hover > td {\n background: color-mix(in srgb, ${cssVar.colorText} 6%, ${cssVar.colorBgElevated});\n }\n\n /* base-ui Table pins with inline position:sticky, not .ant-table-cell-fix-*.\n The transparent body rule above would let scrolled text show through. */\n && td[style*='sticky'] {\n background: var(--lobe-surface-bg-solid, ${cssVar.colorBgContainer});\n }\n\n && tr:hover > td[style*='sticky'] {\n background: color-mix(in srgb, ${cssVar.colorText} 6%, ${cssVar.colorBgElevated});\n }\n `,\n /** Whole card answers hover when its header drills into another page. */\n cardLinked: css`\n &&:hover,\n &&:focus-within {\n border-color: var(--lobe-fill-border-strong, ${cssVar.colorFill});\n }\n\n &&:hover [data-surface-arrow] {\n transform: translate(1px, -1px);\n color: ${cssVar.colorText};\n }\n `,\n desc: css`\n margin-block-start: -4px;\n\n font-size: 13px;\n font-weight: 400;\n line-height: 1.45;\n color: ${cssVar.colorTextSecondary};\n `,\n /* One fixed control row (32px, the height of a small Segmented or a default ActionIcon), so a\n header with controls is exactly as tall as one without, and the controls sit centered with\n 8px clear above the divider. */\n extra: css`\n display: flex;\n flex: none;\n gap: 8px;\n align-items: center;\n\n block-size: 32px;\n `,\n header: css`\n display: flex;\n gap: 12px;\n align-items: flex-start;\n justify-content: space-between;\n\n box-sizing: border-box;\n min-block-size: 48px;\n padding-block: 8px;\n padding-inline: 16px;\n border-block-end: 1px solid var(--lobe-fill-border, ${cssVar.colorFill});\n `,\n heading: css`\n min-inline-size: 0;\n `,\n headingLink: css`\n display: flex;\n flex: 1;\n gap: 12px;\n align-items: flex-start;\n\n min-inline-size: 0;\n\n color: inherit;\n text-decoration: none;\n\n &:hover {\n color: inherit;\n }\n `,\n /**\n * A table inside padded card body meets the card's left, right, and bottom\n * edges. A table that is the only body content also meets the header.\n * Padding amounts come from `--surface-pad-*` on the same element.\n */\n tableBleed: css`\n /* A table nested in a cell keeps the cell's own inset. */\n && :has(> [data-table-wrapper]):not(td :has(> [data-table-wrapper])) {\n width: calc(100% + 2 * var(--surface-pad-inline, 16px));\n margin-inline: calc(-1 * var(--surface-pad-inline, 16px));\n }\n\n && :has(> [data-table-wrapper]):not(td :has(> [data-table-wrapper])):last-child {\n margin-block-end: calc(-1 * var(--surface-pad-block, 16px));\n }\n\n && :has(> [data-table-wrapper]):not(td :has(> [data-table-wrapper])):first-child:last-child {\n margin-block-start: calc(-1 * var(--surface-pad-block, 16px));\n }\n\n /* ProTable keeps its search and toolbar in the padding. The table itself\n meets the card's left, right, and bottom edges. Lower-specificity\n selectors stay above the :has(th/td) rules for stylelint. */\n && .ant-table-css-var,\n && .ant-table-wrapper {\n --ant-table-cell-padding-inline: var(--surface-pad-inline, 16px);\n --ant-table-cell-padding-inline-md: var(--surface-pad-inline, 16px);\n --ant-table-cell-padding-inline-sm: var(--surface-pad-inline, 16px);\n --ant-table-header-border-radius: 0;\n }\n\n && .ant-table-wrapper {\n width: calc(100% + 2 * var(--surface-pad-inline, 16px));\n max-width: none;\n margin-inline: calc(-1 * var(--surface-pad-inline, 16px));\n }\n\n /* A plain table that is the card body meets the header and the bottom edge.\n Its own corner radius would otherwise float inside the card padding. */\n && > .lobe-flex:only-child > .ant-table-wrapper:only-child {\n margin-block: calc(-1 * var(--surface-pad-block, 16px));\n }\n\n && .ant-pro-table:last-child {\n margin-block-end: calc(-1 * var(--surface-pad-block, 16px));\n }\n\n && .ant-table-wrapper .ant-table,\n && .ant-table-wrapper .ant-table-container,\n && .ant-table-thead > tr > th,\n && .ant-table-thead > tr > th:first-child,\n && .ant-table-thead > tr > th:last-child {\n border-radius: 0;\n }\n\n && .ant-table-wrapper .ant-table-cell {\n padding-inline: var(--surface-pad-inline, 16px);\n }\n\n && .ant-table-wrapper .ant-pagination {\n margin-block: 0;\n padding-block: 12px;\n padding-inline: var(--surface-pad-inline, 16px);\n }\n\n && :has(> [data-table-wrapper]):not(td :has(> [data-table-wrapper])) th,\n && :has(> [data-table-wrapper]):not(td :has(> [data-table-wrapper])) td {\n padding-inline: var(--surface-pad-inline, 16px);\n }\n\n /* The root's negative bottom margin includes this sibling. Without block\n padding the pager sits on the card edge. Same inset as the ant pagination. */\n &&\n :has(> [data-table-wrapper]):not(td :has(> [data-table-wrapper]))\n > :not([data-table-wrapper]) {\n margin-block: 0;\n padding-block: 12px;\n padding-inline: var(--surface-pad-inline, 16px);\n }\n `,\n title: css`\n overflow: hidden;\n\n min-inline-size: 0;\n\n font-size: 14px;\n font-weight: 500;\n\n /* The title line is the 32px control row; extra and the arrow center on it, and a\n description adds its own line below without moving them. */\n line-height: 32px;\n color: ${cssVar.colorText};\n text-overflow: ellipsis;\n white-space: nowrap;\n `,\n}));\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;AA4BA,MAAa,SAAS,oBAAoB,EAAE,KAAK,cAAc;CAC7D,MAAM,GAAG;yBACc,OAAO,iBAAiB;+BAClB,OAAO,iBAAiB;;;;kDAIL,OAAO,UAAU;uBAC5C,OAAO,eAAe;;;;;CAK3C,UAAU,GAAG;;2BAEY,OAAO,oBAAoB;;;;;;qCAMjB,OAAO,iBAAiB;;;;;;CAM3D,YAAY,GAAG;;;;;;CAMf,OAAO,GAAG;;;;;;;;CAQV,MAAM,GAAG;;;CAGT,SAAS,GAAG;;;CAGZ,OAAO,GAAG;;;;;;aAMC,OAAO,kBAAkB;;;;;;CAMpC,WAAW,GAAG;;;;;;;;;;CAUd,OAAO,GAAG;;;;;;;;;;CAUV,MAAM,GAAG;;;;;;;CAOT,SAAS,GAAG;;;;;;;;;;;;;0DAa4C,OAAO,UAAU;;;UAGjE,OAAO,UAAU;UACjB,OAAO,gBAAgB;;;;;;eAMlB,OAAO,mBAAmB;;;iDAGQ,OAAO,iBAAiB;2DACd,OAAO,UAAU;;;;;;;;;iDAS3B,OAAO,iBAAiB;;;;;;;;;yCAShC,OAAO,iBAAiB;;;;;;;;;;;;;yCAaxB,OAAO,iBAAiB;;;;;;;;;;;;;yCAaxB,OAAO,iBAAiB;;;;;;;;;;;;yCAYxB,OAAO,iBAAiB;;;;;;;;wDAQT,OAAO,UAAU;;;;;uCAKlC,OAAO,UAAU,OAAO,OAAO,gBAAgB;;;;;;iDAMrC,OAAO,iBAAiB;;;;uCAIlC,OAAO,UAAU,OAAO,OAAO,gBAAgB;;;;CAIpF,YAAY,GAAG;;;qDAGoC,OAAO,UAAU;;;;;eAKvD,OAAO,UAAU;;;CAG9B,MAAM,GAAG;;;;;;aAME,OAAO,mBAAmB;;CAKrC,OAAO,GAAG;;;;;;;;CAQV,QAAQ,GAAG;;;;;;;;;;0DAU6C,OAAO,UAAU;;CAEzE,SAAS,GAAG;;;CAGZ,aAAa,GAAG;;;;;;;;;;;;;;;;;;;;CAoBhB,YAAY,GAAG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA2Ef,OAAO,GAAG;;;;;;;;;;;aAWC,OAAO,UAAU;;;;AAI9B,EAAE"}
|