@bitrise/bitkit-v2 0.3.385 → 0.3.386-beta.2467
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.
|
@@ -127,7 +127,7 @@ declare const tableSlotRecipe: import('@chakra-ui/react').SlotRecipeDefinition<"
|
|
|
127
127
|
};
|
|
128
128
|
body: {
|
|
129
129
|
'& :where(tr)': {
|
|
130
|
-
'&:has(input:checked), &[data-selected]': {
|
|
130
|
+
'&:has([data-scope="checkbox"] input:checked), &:has(input[type="radio"]:checked), &[data-selected]': {
|
|
131
131
|
backgroundColor: "background/selected";
|
|
132
132
|
_hover: {
|
|
133
133
|
backgroundColor: "background/selected";
|
|
@@ -262,7 +262,7 @@ var tableSlotRecipe = defineSlotRecipe({
|
|
|
262
262
|
}
|
|
263
263
|
},
|
|
264
264
|
body: {
|
|
265
|
-
"& :where(tr)": { "&:has(input:checked), &[data-selected]": {
|
|
265
|
+
"& :where(tr)": { "&:has([data-scope=\"checkbox\"] input:checked), &:has(input[type=\"radio\"]:checked), &[data-selected]": {
|
|
266
266
|
backgroundColor: "background/selected",
|
|
267
267
|
_hover: { backgroundColor: "background/selected" }
|
|
268
268
|
} },
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Table.recipe.js","names":[],"sources":["../../../lib/theme/slot-recipes/Table.recipe.ts"],"sourcesContent":["import { tableAnatomy } from '@chakra-ui/react/anatomy';\nimport { defineSlotRecipe } from '@chakra-ui/react/styled-system';\n\nimport { rem } from '../themeUtils';\n\n// A control like a checkbox renders as an inline-flex <label>, which sits on the line box's\n// baseline — so the text strut's descender space leaves it a pixel or two above the row's centre.\n// Making it block-level takes the line box out of the equation and lets vertical-align: middle\n// centre it exactly.\nconst controlOnlyCell = {\n '& > :where(label):only-child': {\n display: 'flex',\n },\n};\n\nconst tableSlotRecipe = defineSlotRecipe({\n className: 'table',\n slots: [\n ...tableAnatomy.keys(),\n 'actionsCell',\n 'actionsGroup',\n 'bulkActionsGroup',\n 'bulkActionsButtons',\n 'definitionTrigger',\n 'expandCell',\n 'expandTrigger',\n 'expandableRow',\n 'expandedCell',\n 'expandedContent',\n 'expandedRow',\n 'filterControls',\n 'linkedRow',\n 'rowLink',\n 'sortColumnHeader',\n 'sortTrigger',\n 'utilityCell',\n ],\n base: {\n root: {\n fontVariantNumeric: 'lining-nums tabular-nums',\n textAlign: 'start',\n width: 'full',\n },\n caption: {\n captionSide: 'top !important',\n textAlign: 'start',\n '& > * + *': {\n marginBlockStart: '4',\n },\n },\n cell: {\n color: 'text/body',\n textStyle: 'body/md/regular',\n },\n actionsCell: {\n textAlign: 'end',\n whiteSpace: 'nowrap',\n // Shrink-to-fit: a table cell can't go below its content width, so any value under the\n // content's own width collapses the column around the buttons and leaves the rest to\n // the data columns.\n width: '1%',\n },\n actionsGroup: {\n alignItems: 'center',\n display: 'inline-flex',\n gap: '8',\n position: 'relative',\n },\n bulkActionsGroup: {\n alignItems: 'center',\n display: 'flex',\n gap: '12',\n },\n bulkActionsButtons: {\n alignItems: 'center',\n display: 'flex',\n gap: '12',\n marginInlineStart: 'auto',\n },\n // The column header's own `heading/h5` has to survive, so the trigger inherits its type and\n // colour rather than setting them — which is what rules out BitkitDefinitionTooltip in a header,\n // since its recipe always pins a textStyle. The offset is that recipe's own value for 14px type.\n definitionTrigger: {\n color: 'inherit',\n cursor: 'pointer',\n font: 'inherit',\n letterSpacing: 'inherit',\n maxWidth: 'full',\n textDecoration: 'underline dotted',\n textDecorationColor: 'color/neutral/bold',\n textUnderlineOffset: '0.25em',\n _hover: {\n textDecorationColor: 'color/purple/base',\n },\n },\n expandCell: {\n paddingBlock: 0,\n paddingInline: 0,\n verticalAlign: 'middle',\n width: '48',\n },\n // A fixed 32x32 box (per the design), centred in the cell by the cell's own vertical-align.\n // Deriving the size from padding instead leaves it at the mercy of the Collapsible recipe's\n // asymmetric paddingBlockStart, which is what pushed the chevron 2px above the row's centre.\n expandTrigger: {\n alignItems: 'center',\n background: 'none',\n border: 'none',\n cursor: 'pointer',\n display: 'flex',\n height: '32',\n justifyContent: 'center',\n marginInlineStart: '12',\n padding: 0,\n width: '32',\n },\n expandableRow: {\n '& > td': {\n borderBottomWidth: 0,\n },\n },\n expandedCell: {\n height: 0,\n paddingBlock: 0,\n paddingInline: 0,\n },\n expandedContent: {\n borderBlockStartColor: 'border/minimal',\n borderBlockStartStyle: 'solid',\n borderBlockStartWidth: '1',\n marginInlineEnd: '16',\n marginInlineStart: '48',\n paddingBlockEnd: '24',\n paddingBlockStart: '16',\n paddingInlineEnd: '16',\n paddingInlineStart: '12',\n },\n expandedRow: {\n _hover: {\n background: 'none',\n },\n },\n filterControls: {\n alignItems: 'center',\n display: 'flex',\n flexWrap: 'wrap',\n gap: '16',\n width: 'full',\n },\n linkedRow: {\n position: 'relative',\n _hover: {\n backgroundColor: 'background/secondary',\n },\n '& :where(a:not([data-row-link]), button, input, label, select)': {\n position: 'relative',\n zIndex: '1',\n },\n },\n rowLink: {\n textDecoration: 'none',\n // The row's own background change is the hover affordance; the link recipe's hover\n // underline would fire on every row hover, since the stretched pseudo covers the row.\n _hover: {\n textDecoration: 'none',\n },\n _after: {\n content: '\"\"',\n inset: 0,\n position: 'absolute',\n },\n _focusVisible: {\n outline: 'none',\n _after: {\n outline: 'var(--focus-ring-width) var(--focus-ring-style) var(--focus-ring-color)',\n outlineOffset: 'calc(var(--focus-ring-width) * -1)',\n },\n },\n },\n sortColumnHeader: {\n paddingBlock: 0,\n paddingInline: 0,\n },\n sortTrigger: {\n alignItems: 'center',\n appearance: 'none',\n background: 'none',\n border: 'none',\n color: 'inherit',\n cursor: 'pointer',\n display: 'flex',\n font: 'inherit',\n gap: '8',\n height: 'full',\n paddingBlock: '12',\n paddingInline: '16',\n userSelect: 'none',\n width: 'full',\n _focusVisible: {\n outlineOffset: '-3px',\n },\n _hover: {\n backgroundColor: 'background/active',\n },\n },\n utilityCell: {\n height: 'auto',\n paddingBlock: '12',\n paddingInline: '16',\n },\n },\n variants: {\n variant: {\n default: {\n root: {\n borderColor: 'border/regular',\n borderRadius: '4',\n borderStyle: 'solid',\n borderWidth: '1',\n overflow: 'hidden',\n },\n header: {\n '& :where(th)': {\n backgroundColor: 'background/tertiary',\n },\n },\n columnHeader: {\n borderBottomColor: 'border/minimal',\n paddingBlock: '12',\n paddingInline: '16',\n },\n cell: {\n borderBottomColor: 'border/minimal',\n borderTopColor: 'border/minimal',\n paddingInline: '16',\n },\n footer: {\n borderTopColor: 'border/minimal',\n },\n },\n borderless: {\n columnHeader: {\n borderBottomColor: 'border/regular',\n padding: '12',\n },\n cell: {\n borderBottomColor: 'border/regular',\n borderTopColor: 'border/regular',\n paddingInline: '12',\n },\n footer: {\n borderTopColor: 'border/regular',\n },\n },\n card: {\n columnHeader: {\n borderBottomColor: 'border/minimal',\n height: '48',\n padding: '12',\n },\n cell: {\n borderBottomColor: 'border/minimal',\n borderTopColor: 'border/minimal',\n paddingInline: '12',\n },\n row: {\n 'thead &, tbody &': {\n '& > :where(td, th):first-child': {\n paddingInlineStart: '24',\n },\n '& > :where(td, th):last-child': {\n paddingInlineEnd: '24',\n },\n },\n },\n footer: {\n borderTopColor: 'border/minimal',\n },\n },\n },\n size: {\n sm: {\n cell: {\n height: '48',\n },\n },\n md: {\n cell: {\n height: rem(56),\n },\n },\n lg: {\n cell: {\n height: '64',\n },\n },\n },\n // Hovering a row tints it. Usually a reading aid on a long or wide table rather than a hint\n // that the row is clickable, so it says nothing about the row being interactive — turn it off\n // for short, static tables where there is no place to lose.\n rowHover: {\n true: {},\n false: {},\n },\n layout: {\n table: {\n root: {\n borderCollapse: 'separate',\n borderSpacing: '0',\n },\n caption: {\n marginBlockEnd: '24',\n },\n columnHeader: {\n borderBottomStyle: 'solid',\n borderBottomWidth: '1',\n color: 'text/primary',\n fontWeight: 'bold',\n textAlign: 'start',\n textStyle: 'heading/h5',\n verticalAlign: 'middle',\n ...controlOnlyCell,\n },\n cell: {\n borderBottomStyle: 'solid',\n borderBottomWidth: '1',\n verticalAlign: 'middle',\n ...controlOnlyCell,\n // border-collapse: separate ignores borders on tfoot itself (CSS 2.1 §17.6.1),\n // so the body/footer divider has to live on the footer's cells.\n // A footer holds one full-width block (pagination, a \"new item\" action) that brings its\n // own padding and height, so the body cell's 16px inset and fixed row height would\n // double up on it.\n 'tfoot &': {\n borderBottomWidth: 0,\n borderTopStyle: 'solid',\n borderTopWidth: '1',\n height: 'auto',\n paddingBlock: 0,\n paddingInline: 0,\n },\n },\n body: {\n '& :where(tr)': {\n '&:has(input:checked), &[data-selected]': {\n backgroundColor: 'background/selected',\n _hover: {\n backgroundColor: 'background/selected',\n },\n },\n },\n '& :where(tr:last-child) td': {\n borderBottomWidth: 0,\n },\n },\n },\n stacked: {\n root: {\n display: 'block',\n },\n caption: {\n display: 'block',\n padding: '16',\n backgroundColor: 'background/secondary',\n borderBottomColor: 'border/minimal',\n borderBottomStyle: 'solid',\n borderBottomWidth: '1',\n },\n header: {\n borderWidth: 0,\n clip: 'rect(0, 0, 0, 0)',\n height: '1',\n margin: '-1px',\n overflow: 'hidden',\n padding: 0,\n position: 'absolute',\n whiteSpace: 'nowrap',\n width: '1',\n },\n body: {\n display: 'block',\n },\n row: {\n borderBottomColor: 'border/minimal',\n borderBottomStyle: 'solid',\n borderBottomWidth: '1',\n display: 'block',\n paddingBlock: '12',\n '&:last-child': {\n borderBottomWidth: 0,\n },\n },\n cell: {\n alignItems: 'center',\n display: 'flex',\n minHeight: '48',\n paddingInline: '16',\n _before: {\n alignSelf: 'center',\n color: 'text/primary',\n content: 'attr(data-label)',\n flexShrink: 0,\n fontWeight: 'semibold',\n marginInlineEnd: '16',\n width: '96',\n },\n 'tfoot &': {\n display: 'block',\n paddingInline: 0,\n _before: {\n content: 'none',\n },\n },\n },\n // display: block takes tfoot out of the table model, so a border on it does render here\n footer: {\n borderTopStyle: 'solid',\n borderTopWidth: '1',\n display: 'block',\n },\n },\n },\n },\n compoundVariants: [\n {\n css: {\n row: {\n borderBottomColor: 'border/regular',\n },\n },\n layout: 'stacked',\n variant: 'borderless',\n },\n // The card gutter and the 12px cell padding are for the wide layout. Stacked rows are blocks\n // whose cells run vertically, so an inline indent on only the first and last one reads as a\n // misalignment — everything goes back to the stacked layout's own 16px.\n {\n css: {\n cell: {\n paddingInline: '16',\n },\n row: {\n 'thead &, tbody &': {\n '& > :where(td, th):first-child': {\n paddingInlineStart: '16',\n },\n '& > :where(td, th):last-child': {\n paddingInlineEnd: '16',\n },\n },\n },\n },\n layout: 'stacked',\n variant: 'card',\n },\n // The `size` variant pins a fixed cell height (48/56/64px), and it is merged after `layout`\n // regardless of declaration order — so only a compound variant can release it. Stacked cells\n // are flex containers whose content (label gutter + a multi-line value) routinely needs more\n // room than the fixed height, and the stacked `cell` keeps `minHeight: 48` as the floor.\n {\n css: {\n cell: {\n height: 'auto',\n },\n },\n layout: 'stacked',\n },\n // Scoped to `layout: table` because that is where the hover lived before: the stacked layout\n // renders rows as blocks and never tinted them.\n {\n css: {\n body: {\n '& :where(tr)': {\n _hover: {\n backgroundColor: 'background/secondary',\n },\n },\n },\n },\n layout: 'table',\n rowHover: true,\n },\n ],\n defaultVariants: {\n layout: 'table',\n rowHover: true,\n size: 'lg',\n variant: 'default',\n },\n});\n\nexport default tableSlotRecipe;\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"Table.recipe.js","names":[],"sources":["../../../lib/theme/slot-recipes/Table.recipe.ts"],"sourcesContent":["import { tableAnatomy } from '@chakra-ui/react/anatomy';\nimport { defineSlotRecipe } from '@chakra-ui/react/styled-system';\n\nimport { rem } from '../themeUtils';\n\n// A control like a checkbox renders as an inline-flex <label>, which sits on the line box's\n// baseline — so the text strut's descender space leaves it a pixel or two above the row's centre.\n// Making it block-level takes the line box out of the equation and lets vertical-align: middle\n// centre it exactly.\nconst controlOnlyCell = {\n '& > :where(label):only-child': {\n display: 'flex',\n },\n};\n\nconst tableSlotRecipe = defineSlotRecipe({\n className: 'table',\n slots: [\n ...tableAnatomy.keys(),\n 'actionsCell',\n 'actionsGroup',\n 'bulkActionsGroup',\n 'bulkActionsButtons',\n 'definitionTrigger',\n 'expandCell',\n 'expandTrigger',\n 'expandableRow',\n 'expandedCell',\n 'expandedContent',\n 'expandedRow',\n 'filterControls',\n 'linkedRow',\n 'rowLink',\n 'sortColumnHeader',\n 'sortTrigger',\n 'utilityCell',\n ],\n base: {\n root: {\n fontVariantNumeric: 'lining-nums tabular-nums',\n textAlign: 'start',\n width: 'full',\n },\n caption: {\n captionSide: 'top !important',\n textAlign: 'start',\n '& > * + *': {\n marginBlockStart: '4',\n },\n },\n cell: {\n color: 'text/body',\n textStyle: 'body/md/regular',\n },\n actionsCell: {\n textAlign: 'end',\n whiteSpace: 'nowrap',\n // Shrink-to-fit: a table cell can't go below its content width, so any value under the\n // content's own width collapses the column around the buttons and leaves the rest to\n // the data columns.\n width: '1%',\n },\n actionsGroup: {\n alignItems: 'center',\n display: 'inline-flex',\n gap: '8',\n position: 'relative',\n },\n bulkActionsGroup: {\n alignItems: 'center',\n display: 'flex',\n gap: '12',\n },\n bulkActionsButtons: {\n alignItems: 'center',\n display: 'flex',\n gap: '12',\n marginInlineStart: 'auto',\n },\n // The column header's own `heading/h5` has to survive, so the trigger inherits its type and\n // colour rather than setting them — which is what rules out BitkitDefinitionTooltip in a header,\n // since its recipe always pins a textStyle. The offset is that recipe's own value for 14px type.\n definitionTrigger: {\n color: 'inherit',\n cursor: 'pointer',\n font: 'inherit',\n letterSpacing: 'inherit',\n maxWidth: 'full',\n textDecoration: 'underline dotted',\n textDecorationColor: 'color/neutral/bold',\n textUnderlineOffset: '0.25em',\n _hover: {\n textDecorationColor: 'color/purple/base',\n },\n },\n expandCell: {\n paddingBlock: 0,\n paddingInline: 0,\n verticalAlign: 'middle',\n width: '48',\n },\n // A fixed 32x32 box (per the design), centred in the cell by the cell's own vertical-align.\n // Deriving the size from padding instead leaves it at the mercy of the Collapsible recipe's\n // asymmetric paddingBlockStart, which is what pushed the chevron 2px above the row's centre.\n expandTrigger: {\n alignItems: 'center',\n background: 'none',\n border: 'none',\n cursor: 'pointer',\n display: 'flex',\n height: '32',\n justifyContent: 'center',\n marginInlineStart: '12',\n padding: 0,\n width: '32',\n },\n expandableRow: {\n '& > td': {\n borderBottomWidth: 0,\n },\n },\n expandedCell: {\n height: 0,\n paddingBlock: 0,\n paddingInline: 0,\n },\n expandedContent: {\n borderBlockStartColor: 'border/minimal',\n borderBlockStartStyle: 'solid',\n borderBlockStartWidth: '1',\n marginInlineEnd: '16',\n marginInlineStart: '48',\n paddingBlockEnd: '24',\n paddingBlockStart: '16',\n paddingInlineEnd: '16',\n paddingInlineStart: '12',\n },\n expandedRow: {\n _hover: {\n background: 'none',\n },\n },\n filterControls: {\n alignItems: 'center',\n display: 'flex',\n flexWrap: 'wrap',\n gap: '16',\n width: 'full',\n },\n linkedRow: {\n position: 'relative',\n _hover: {\n backgroundColor: 'background/secondary',\n },\n '& :where(a:not([data-row-link]), button, input, label, select)': {\n position: 'relative',\n zIndex: '1',\n },\n },\n rowLink: {\n textDecoration: 'none',\n // The row's own background change is the hover affordance; the link recipe's hover\n // underline would fire on every row hover, since the stretched pseudo covers the row.\n _hover: {\n textDecoration: 'none',\n },\n _after: {\n content: '\"\"',\n inset: 0,\n position: 'absolute',\n },\n _focusVisible: {\n outline: 'none',\n _after: {\n outline: 'var(--focus-ring-width) var(--focus-ring-style) var(--focus-ring-color)',\n outlineOffset: 'calc(var(--focus-ring-width) * -1)',\n },\n },\n },\n sortColumnHeader: {\n paddingBlock: 0,\n paddingInline: 0,\n },\n sortTrigger: {\n alignItems: 'center',\n appearance: 'none',\n background: 'none',\n border: 'none',\n color: 'inherit',\n cursor: 'pointer',\n display: 'flex',\n font: 'inherit',\n gap: '8',\n height: 'full',\n paddingBlock: '12',\n paddingInline: '16',\n userSelect: 'none',\n width: 'full',\n _focusVisible: {\n outlineOffset: '-3px',\n },\n _hover: {\n backgroundColor: 'background/active',\n },\n },\n utilityCell: {\n height: 'auto',\n paddingBlock: '12',\n paddingInline: '16',\n },\n },\n variants: {\n variant: {\n default: {\n root: {\n borderColor: 'border/regular',\n borderRadius: '4',\n borderStyle: 'solid',\n borderWidth: '1',\n overflow: 'hidden',\n },\n header: {\n '& :where(th)': {\n backgroundColor: 'background/tertiary',\n },\n },\n columnHeader: {\n borderBottomColor: 'border/minimal',\n paddingBlock: '12',\n paddingInline: '16',\n },\n cell: {\n borderBottomColor: 'border/minimal',\n borderTopColor: 'border/minimal',\n paddingInline: '16',\n },\n footer: {\n borderTopColor: 'border/minimal',\n },\n },\n borderless: {\n columnHeader: {\n borderBottomColor: 'border/regular',\n padding: '12',\n },\n cell: {\n borderBottomColor: 'border/regular',\n borderTopColor: 'border/regular',\n paddingInline: '12',\n },\n footer: {\n borderTopColor: 'border/regular',\n },\n },\n card: {\n columnHeader: {\n borderBottomColor: 'border/minimal',\n height: '48',\n padding: '12',\n },\n cell: {\n borderBottomColor: 'border/minimal',\n borderTopColor: 'border/minimal',\n paddingInline: '12',\n },\n row: {\n 'thead &, tbody &': {\n '& > :where(td, th):first-child': {\n paddingInlineStart: '24',\n },\n '& > :where(td, th):last-child': {\n paddingInlineEnd: '24',\n },\n },\n },\n footer: {\n borderTopColor: 'border/minimal',\n },\n },\n },\n size: {\n sm: {\n cell: {\n height: '48',\n },\n },\n md: {\n cell: {\n height: rem(56),\n },\n },\n lg: {\n cell: {\n height: '64',\n },\n },\n },\n // Hovering a row tints it. Usually a reading aid on a long or wide table rather than a hint\n // that the row is clickable, so it says nothing about the row being interactive — turn it off\n // for short, static tables where there is no place to lose.\n rowHover: {\n true: {},\n false: {},\n },\n layout: {\n table: {\n root: {\n borderCollapse: 'separate',\n borderSpacing: '0',\n },\n caption: {\n marginBlockEnd: '24',\n },\n columnHeader: {\n borderBottomStyle: 'solid',\n borderBottomWidth: '1',\n color: 'text/primary',\n fontWeight: 'bold',\n textAlign: 'start',\n textStyle: 'heading/h5',\n verticalAlign: 'middle',\n ...controlOnlyCell,\n },\n cell: {\n borderBottomStyle: 'solid',\n borderBottomWidth: '1',\n verticalAlign: 'middle',\n ...controlOnlyCell,\n // border-collapse: separate ignores borders on tfoot itself (CSS 2.1 §17.6.1),\n // so the body/footer divider has to live on the footer's cells.\n // A footer holds one full-width block (pagination, a \"new item\" action) that brings its\n // own padding and height, so the body cell's 16px inset and fixed row height would\n // double up on it.\n 'tfoot &': {\n borderBottomWidth: 0,\n borderTopStyle: 'solid',\n borderTopWidth: '1',\n height: 'auto',\n paddingBlock: 0,\n paddingInline: 0,\n },\n },\n body: {\n '& :where(tr)': {\n // Only a selection control tints the row. A switch renders a hidden\n // input[type=\"checkbox\"] too, so a bare `input:checked` would read a toggle in a data\n // cell as a selected row — hence the checkbox part scope and the explicit radio type.\n '&:has([data-scope=\"checkbox\"] input:checked), &:has(input[type=\"radio\"]:checked), &[data-selected]': {\n backgroundColor: 'background/selected',\n _hover: {\n backgroundColor: 'background/selected',\n },\n },\n },\n '& :where(tr:last-child) td': {\n borderBottomWidth: 0,\n },\n },\n },\n stacked: {\n root: {\n display: 'block',\n },\n caption: {\n display: 'block',\n padding: '16',\n backgroundColor: 'background/secondary',\n borderBottomColor: 'border/minimal',\n borderBottomStyle: 'solid',\n borderBottomWidth: '1',\n },\n header: {\n borderWidth: 0,\n clip: 'rect(0, 0, 0, 0)',\n height: '1',\n margin: '-1px',\n overflow: 'hidden',\n padding: 0,\n position: 'absolute',\n whiteSpace: 'nowrap',\n width: '1',\n },\n body: {\n display: 'block',\n },\n row: {\n borderBottomColor: 'border/minimal',\n borderBottomStyle: 'solid',\n borderBottomWidth: '1',\n display: 'block',\n paddingBlock: '12',\n '&:last-child': {\n borderBottomWidth: 0,\n },\n },\n cell: {\n alignItems: 'center',\n display: 'flex',\n minHeight: '48',\n paddingInline: '16',\n _before: {\n alignSelf: 'center',\n color: 'text/primary',\n content: 'attr(data-label)',\n flexShrink: 0,\n fontWeight: 'semibold',\n marginInlineEnd: '16',\n width: '96',\n },\n 'tfoot &': {\n display: 'block',\n paddingInline: 0,\n _before: {\n content: 'none',\n },\n },\n },\n // display: block takes tfoot out of the table model, so a border on it does render here\n footer: {\n borderTopStyle: 'solid',\n borderTopWidth: '1',\n display: 'block',\n },\n },\n },\n },\n compoundVariants: [\n {\n css: {\n row: {\n borderBottomColor: 'border/regular',\n },\n },\n layout: 'stacked',\n variant: 'borderless',\n },\n // The card gutter and the 12px cell padding are for the wide layout. Stacked rows are blocks\n // whose cells run vertically, so an inline indent on only the first and last one reads as a\n // misalignment — everything goes back to the stacked layout's own 16px.\n {\n css: {\n cell: {\n paddingInline: '16',\n },\n row: {\n 'thead &, tbody &': {\n '& > :where(td, th):first-child': {\n paddingInlineStart: '16',\n },\n '& > :where(td, th):last-child': {\n paddingInlineEnd: '16',\n },\n },\n },\n },\n layout: 'stacked',\n variant: 'card',\n },\n // The `size` variant pins a fixed cell height (48/56/64px), and it is merged after `layout`\n // regardless of declaration order — so only a compound variant can release it. Stacked cells\n // are flex containers whose content (label gutter + a multi-line value) routinely needs more\n // room than the fixed height, and the stacked `cell` keeps `minHeight: 48` as the floor.\n {\n css: {\n cell: {\n height: 'auto',\n },\n },\n layout: 'stacked',\n },\n // Scoped to `layout: table` because that is where the hover lived before: the stacked layout\n // renders rows as blocks and never tinted them.\n {\n css: {\n body: {\n '& :where(tr)': {\n _hover: {\n backgroundColor: 'background/secondary',\n },\n },\n },\n },\n layout: 'table',\n rowHover: true,\n },\n ],\n defaultVariants: {\n layout: 'table',\n rowHover: true,\n size: 'lg',\n variant: 'default',\n },\n});\n\nexport default tableSlotRecipe;\n"],"mappings":"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"}
|
|
@@ -2241,7 +2241,7 @@ declare const slotRecipes: {
|
|
|
2241
2241
|
};
|
|
2242
2242
|
body: {
|
|
2243
2243
|
'& :where(tr)': {
|
|
2244
|
-
'&:has(input:checked), &[data-selected]': {
|
|
2244
|
+
'&:has([data-scope="checkbox"] input:checked), &:has(input[type="radio"]:checked), &[data-selected]': {
|
|
2245
2245
|
backgroundColor: "background/selected";
|
|
2246
2246
|
_hover: {
|
|
2247
2247
|
backgroundColor: "background/selected";
|