@veeqo/ui 15.15.0 → 15.15.1
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/dist/components/DataTable/components/DataTable.module.scss.cjs +2 -2
- package/dist/components/DataTable/components/DataTable.module.scss.cjs.map +1 -1
- package/dist/components/DataTable/components/DataTable.module.scss.js +2 -2
- package/dist/components/DataTable/components/DataTable.module.scss.js.map +1 -1
- package/package.json +1 -1
|
@@ -2,8 +2,8 @@
|
|
|
2
2
|
|
|
3
3
|
var ___$insertStyle = require('../../../_virtual/____insertStyle.cjs');
|
|
4
4
|
|
|
5
|
-
___$insertStyle("/* DataTable sub-component styles */\n/* ScrollContainer */\n.
|
|
6
|
-
var styles = {"scrollContainer":"
|
|
5
|
+
___$insertStyle("/* DataTable sub-component styles */\n/* ScrollContainer */\n._scrollContainer_uiqwq_3 {\n position: relative;\n width: 100%;\n overflow-x: auto;\n overflow-y: hidden;\n}\n\n/* NoWrap */\n._noWrap_uiqwq_11 {\n white-space: nowrap;\n}\n\n/* Truncate */\n._truncate_uiqwq_16 {\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n}\n\n/* LoadingCellContent */\n._loadingCellContent_uiqwq_23 {\n height: 20px;\n width: 75%;\n border-radius: var(--radius-base);\n background: var(--colors-neutral-grey-base);\n background-image: linear-gradient(to right, var(--colors-neutral-grey-base) 0%, var(--colors-neutral-grey-dark) 20%, var(--colors-neutral-grey-base) 40%, var(--colors-neutral-grey-base) 100%);\n background-repeat: no-repeat;\n background-size: 800px 104px;\n animation-duration: 1s;\n animation-fill-mode: forwards;\n animation-iteration-count: infinite;\n animation-name: _placeholderShimmer_uiqwq_1;\n animation-timing-function: linear;\n}\n\n@keyframes _placeholderShimmer_uiqwq_1 {\n 0% {\n background-position: -468px 0;\n }\n 100% {\n background-position: 468px 0;\n }\n}\n/* EmptyBodyContent */\n._emptyBodyContent_uiqwq_47 {\n padding-top: var(--sizes-lg);\n padding-bottom: var(--sizes-lg);\n grid-column: 1/span var(--column-span);\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n gap: var(--sizes-md);\n}\n\n._emptyBodyGlyphWrapper_uiqwq_58 {\n padding: var(--sizes-md);\n background-color: var(--colors-neutral-grey-light);\n border-radius: var(--radius-full);\n}\n\n/* Cell */\n._cell_uiqwq_65 {\n display: flex;\n align-items: center;\n justify-content: var(--cell-align, flex-start);\n background-color: white;\n padding-bottom: var(--density);\n padding-top: var(--density);\n padding-left: var(--cell-spacing, var(--sizes-3));\n padding-right: var(--cell-spacing, var(--sizes-3));\n color: var(--text-body-small-color);\n font-family: var(--text-body-small-font-family);\n font-size: var(--text-body-small-font-size);\n font-style: var(--text-body-small-font-style);\n font-weight: var(--text-body-small-font-weight);\n line-height: var(--text-body-small-line-height);\n grid-column-end: span var(--cell-span, 1);\n}\ntfoot ._cell_uiqwq_65 {\n min-height: 56px;\n border-top: 1px solid var(--colors-secondary-blue-base);\n background-color: var(--colors-neutral-grey-lightest);\n}\n\n/* Header */\n._header_uiqwq_89 {\n height: 56px;\n position: relative;\n display: flex;\n align-items: center;\n justify-content: var(--cell-align, flex-start);\n z-index: var(--header-z-index, 0);\n background-color: white;\n padding-left: var(--cell-spacing, var(--sizes-3));\n padding-right: var(--cell-spacing, var(--sizes-3));\n border-bottom: 1px solid var(--colors-neutral-grey-base);\n grid-column-end: span var(--cell-span, 1);\n}\n\n/* Row */\n._row_uiqwq_104 {\n display: contents;\n}\n\n/* Selected rows must beat two higher-specificity rules that also paint the\n cell background:\n - striping: [data-table-id] tr:nth-child(odd) > td (0,2,2), injected per table by generateTableCss\n - hover: .tableGrid.tableGrid tr:hover td (0,3,2), defined below\n Doubling the class selectors lifts this rule to (0,4,2) so selection always\n wins, regardless of source order. Mirrors the pre-CSS-Modules `&&&& > td` (0,4,1). */\n._tableGrid_uiqwq_111._tableGrid_uiqwq_111 tr._rowSelected_uiqwq_114._rowSelected_uiqwq_114 > td {\n background-color: var(--colors-brand-blue-lightest);\n}\n\n._rowAccentColor_uiqwq_118 > *:first-child {\n position: relative;\n}\n\n._rowAccentColor_uiqwq_118 > *:first-child::before {\n content: \"\";\n position: absolute;\n top: 0;\n left: 0;\n bottom: 0;\n width: 4px;\n background-color: var(--row-accent-color);\n}\n\n/* Wrapper */\n._wrapper_uiqwq_133 {\n width: 100%;\n position: relative;\n border-style: solid;\n border-color: var(--colors-neutral-grey-dark);\n}\n._wrapper_uiqwq_133, ._wrapper_uiqwq_133 * {\n box-sizing: border-box;\n}\n._wrapper_uiqwq_133 .hideHeaderDetails th > * {\n opacity: 0.1;\n}\n._wrapper_uiqwq_133 .hideHeaderDetails th .th-divider {\n opacity: 1;\n}\n\n._borderFull_uiqwq_149 {\n border-width: 1px;\n border-radius: var(--radius-base);\n}\n\n._borderVertical_uiqwq_154 {\n border-width: 0;\n border-top-width: 1px;\n border-bottom-width: 1px;\n}\n\n._borderNone_uiqwq_160 {\n border-width: 0;\n}\n\n/* TableGrid */\n._tableGrid_uiqwq_111 {\n min-width: 100%;\n width: max-content;\n display: grid;\n --density: var(--sizes-base);\n}\n._tableGrid_uiqwq_111 thead, ._tableGrid_uiqwq_111 tbody, ._tableGrid_uiqwq_111 tfoot {\n display: contents;\n}\n\n._tableGrid_uiqwq_111._tableGrid_uiqwq_111 tr:hover td {\n /* No 1:1 theme token exists for this shade */\n background-color: #f2f8fc;\n}\n\n/* ColumnHeader */\n._sortIndicator_uiqwq_181 {\n width: 20px;\n height: 20px;\n display: flex;\n align-items: center;\n justify-content: center;\n background-color: white;\n color: var(--colors-neutral-ink-lightest);\n}\n\n._headerContent_uiqwq_191 {\n display: flex;\n height: 28px;\n align-items: center;\n gap: var(--sizes-xs);\n white-space: nowrap;\n color: var(--text-heading-table-color);\n font-family: var(--text-heading-table-font-family);\n font-size: var(--text-heading-table-font-size);\n font-style: var(--text-heading-table-font-style);\n font-weight: var(--text-heading-table-font-weight);\n line-height: var(--text-heading-table-line-height);\n}\n\n._clickableHeaderContent_uiqwq_205 {\n display: flex;\n height: 28px;\n align-items: center;\n gap: var(--sizes-xs);\n white-space: nowrap;\n color: var(--text-heading-table-color);\n font-family: var(--text-heading-table-font-family);\n font-size: var(--text-heading-table-font-size);\n font-style: var(--text-heading-table-font-style);\n font-weight: var(--text-heading-table-font-weight);\n line-height: var(--text-heading-table-line-height);\n appearance: none;\n padding: 0;\n border: 0;\n border-radius: var(--radius-base);\n background-color: transparent;\n}\n._clickableHeaderContent_uiqwq_205:not(:disabled):hover {\n cursor: pointer;\n}\n._clickableHeaderContent_uiqwq_205:hover ._sortIndicator_uiqwq_181 {\n background-color: var(--colors-neutral-grey-light);\n color: var(--colors-neutral-ink-base);\n}\n._clickableHeaderContent_uiqwq_205:focus-visible {\n outline: 0;\n box-shadow: 0px 0px 0px 2px var(--colors-secondary-blue-light);\n}\n\n/* ColumnDivider ResizerBar */\n._resizerBar_uiqwq_236 {\n position: absolute;\n right: 0;\n top: 37.5%;\n width: 1px;\n background: var(--colors-neutral-grey-dark);\n min-height: 25%;\n cursor: col-resize;\n user-select: none;\n}\n._resizerBar_uiqwq_236::before {\n content: \"\";\n position: absolute;\n top: -150%;\n left: 0;\n width: 12px;\n min-height: 400%;\n z-index: 1;\n transform: translateX(-6px);\n}\n\n/* ActionBar */\n._actionBarContainer_uiqwq_258 {\n display: grid;\n grid-template-columns: auto 1fr;\n align-items: center;\n position: absolute;\n top: 0;\n left: 0;\n right: 0;\n z-index: 50;\n height: 56px;\n background-color: white;\n}\n\n._actionBarContent_uiqwq_271 {\n width: 100%;\n height: 100%;\n display: flex;\n align-items: center;\n padding: 0 var(--sizes-sm);\n border-bottom: 1px solid var(--colors-neutral-grey-base);\n}\n._actionBarContent_uiqwq_271 > * {\n flex: 1;\n}");
|
|
6
|
+
var styles = {"scrollContainer":"_scrollContainer_uiqwq_3","noWrap":"_noWrap_uiqwq_11","truncate":"_truncate_uiqwq_16","loadingCellContent":"_loadingCellContent_uiqwq_23","emptyBodyContent":"_emptyBodyContent_uiqwq_47","emptyBodyGlyphWrapper":"_emptyBodyGlyphWrapper_uiqwq_58","cell":"_cell_uiqwq_65","header":"_header_uiqwq_89","row":"_row_uiqwq_104","tableGrid":"_tableGrid_uiqwq_111","rowSelected":"_rowSelected_uiqwq_114","rowAccentColor":"_rowAccentColor_uiqwq_118","wrapper":"_wrapper_uiqwq_133","borderFull":"_borderFull_uiqwq_149","borderVertical":"_borderVertical_uiqwq_154","borderNone":"_borderNone_uiqwq_160","sortIndicator":"_sortIndicator_uiqwq_181","headerContent":"_headerContent_uiqwq_191","clickableHeaderContent":"_clickableHeaderContent_uiqwq_205","resizerBar":"_resizerBar_uiqwq_236","actionBarContainer":"_actionBarContainer_uiqwq_258","actionBarContent":"_actionBarContent_uiqwq_271"};
|
|
7
7
|
|
|
8
8
|
module.exports = styles;
|
|
9
9
|
//# sourceMappingURL=DataTable.module.scss.cjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"DataTable.module.scss.cjs","sources":["../../../../src/components/DataTable/components/DataTable.module.scss"],"sourcesContent":["/* DataTable sub-component styles */\n\n/* ScrollContainer */\n.scrollContainer {\n position: relative;\n width: 100%;\n overflow-x: auto;\n overflow-y: hidden;\n}\n\n/* NoWrap */\n.noWrap {\n white-space: nowrap;\n}\n\n/* Truncate */\n.truncate {\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n}\n\n/* LoadingCellContent */\n.loadingCellContent {\n height: 20px;\n width: 75%;\n border-radius: var(--radius-base);\n\n background: var(--colors-neutral-grey-base);\n background-image: linear-gradient(\n to right,\n var(--colors-neutral-grey-base) 0%,\n var(--colors-neutral-grey-dark) 20%,\n var(--colors-neutral-grey-base) 40%,\n var(--colors-neutral-grey-base) 100%\n );\n background-repeat: no-repeat;\n background-size: 800px 104px;\n\n animation-duration: 1s;\n animation-fill-mode: forwards;\n animation-iteration-count: infinite;\n animation-name: placeholderShimmer;\n animation-timing-function: linear;\n}\n\n@keyframes placeholderShimmer {\n 0% {\n background-position: -468px 0;\n }\n\n 100% {\n background-position: 468px 0;\n }\n}\n\n/* EmptyBodyContent */\n.emptyBodyContent {\n padding-top: var(--sizes-lg);\n padding-bottom: var(--sizes-lg);\n grid-column: 1 / span var(--column-span);\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n gap: var(--sizes-md);\n}\n\n.emptyBodyGlyphWrapper {\n padding: var(--sizes-md);\n background-color: var(--colors-neutral-grey-light);\n border-radius: var(--radius-full);\n}\n\n/* Cell */\n.cell {\n display: flex;\n align-items: center;\n justify-content: var(--cell-align, flex-start);\n\n background-color: white;\n padding-bottom: var(--density);\n padding-top: var(--density);\n padding-left: var(--cell-spacing, var(--sizes-3));\n padding-right: var(--cell-spacing, var(--sizes-3));\n\n color: var(--text-body-small-color);\n font-family: var(--text-body-small-font-family);\n font-size: var(--text-body-small-font-size);\n font-style: var(--text-body-small-font-style);\n font-weight: var(--text-body-small-font-weight);\n line-height: var(--text-body-small-line-height);\n\n grid-column-end: span var(--cell-span, 1);\n\n tfoot & {\n min-height: 56px;\n border-top: 1px solid var(--colors-secondary-blue-base);\n background-color: var(--colors-neutral-grey-lightest);\n }\n}\n\n/* Header */\n.header {\n height: 56px;\n position: relative;\n display: flex;\n align-items: center;\n justify-content: var(--cell-align, flex-start);\n z-index: var(--header-z-index, 0);\n\n background-color: white;\n padding-left: var(--cell-spacing, var(--sizes-3));\n padding-right: var(--cell-spacing, var(--sizes-3));\n border-bottom: 1px solid var(--colors-neutral-grey-base);\n\n grid-column-end: span var(--cell-span, 1);\n}\n\n/* Row */\n.row {\n display: contents;\n}\n\n.rowSelected > td {\n background-color: var(--colors-brand-blue-lightest);\n}\n\n.rowAccentColor > *:first-child {\n position: relative;\n}\n\n.rowAccentColor > *:first-child::before {\n content: '';\n position: absolute;\n top: 0;\n left: 0;\n bottom: 0;\n width: 4px;\n background-color: var(--row-accent-color);\n}\n\n/* Wrapper */\n.wrapper {\n width: 100%;\n position: relative;\n border-style: solid;\n border-color: var(--colors-neutral-grey-dark);\n\n &,\n & * {\n box-sizing: border-box;\n }\n\n :global(.hideHeaderDetails) th {\n > * {\n opacity: 0.1;\n }\n\n :global(.th-divider) {\n opacity: 1;\n }\n }\n}\n\n.borderFull {\n border-width: 1px;\n border-radius: var(--radius-base);\n}\n\n.borderVertical {\n border-width: 0;\n border-top-width: 1px;\n border-bottom-width: 1px;\n}\n\n.borderNone {\n border-width: 0;\n}\n\n/* TableGrid */\n.tableGrid {\n min-width: 100%;\n width: max-content;\n display: grid;\n\n & thead,\n & tbody,\n & tfoot {\n display: contents;\n }\n\n --density: var(--sizes-base);\n}\n\n.tableGrid.tableGrid tr:hover td {\n /* No 1:1 theme token exists for this shade */\n background-color: #f2f8fc;\n}\n\n/* ColumnHeader */\n.sortIndicator {\n width: 20px;\n height: 20px;\n display: flex;\n align-items: center;\n justify-content: center;\n background-color: white;\n color: var(--colors-neutral-ink-lightest);\n}\n\n.headerContent {\n display: flex;\n height: 28px;\n align-items: center;\n gap: var(--sizes-xs);\n white-space: nowrap;\n\n color: var(--text-heading-table-color);\n font-family: var(--text-heading-table-font-family);\n font-size: var(--text-heading-table-font-size);\n font-style: var(--text-heading-table-font-style);\n font-weight: var(--text-heading-table-font-weight);\n line-height: var(--text-heading-table-line-height);\n}\n\n.clickableHeaderContent {\n display: flex;\n height: 28px;\n align-items: center;\n gap: var(--sizes-xs);\n white-space: nowrap;\n\n color: var(--text-heading-table-color);\n font-family: var(--text-heading-table-font-family);\n font-size: var(--text-heading-table-font-size);\n font-style: var(--text-heading-table-font-style);\n font-weight: var(--text-heading-table-font-weight);\n line-height: var(--text-heading-table-line-height);\n\n appearance: none;\n padding: 0;\n border: 0;\n border-radius: var(--radius-base);\n background-color: transparent;\n\n &:not(:disabled):hover {\n cursor: pointer;\n }\n\n &:hover .sortIndicator {\n background-color: var(--colors-neutral-grey-light);\n color: var(--colors-neutral-ink-base);\n }\n\n &:focus-visible {\n outline: 0;\n box-shadow: 0px 0px 0px 2px var(--colors-secondary-blue-light);\n }\n}\n\n/* ColumnDivider ResizerBar */\n.resizerBar {\n position: absolute;\n right: 0;\n top: 37.5%;\n width: 1px;\n background: var(--colors-neutral-grey-dark);\n min-height: 25%;\n cursor: col-resize;\n user-select: none;\n\n &::before {\n content: '';\n position: absolute;\n top: -150%;\n left: 0;\n width: 12px;\n min-height: 400%;\n z-index: 1;\n transform: translateX(-6px);\n }\n}\n\n/* ActionBar */\n.actionBarContainer {\n display: grid;\n grid-template-columns: auto 1fr;\n align-items: center;\n position: absolute;\n top: 0;\n left: 0;\n right: 0;\n z-index: 50;\n height: 56px;\n background-color: white;\n}\n\n.actionBarContent {\n width: 100%;\n height: 100%;\n display: flex;\n align-items: center;\n padding: 0 var(--sizes-sm);\n border-bottom: 1px solid var(--colors-neutral-grey-base);\n\n & > * {\n flex: 1;\n }\n}\n"],"names":[],"mappings":";;;;AAEA,eAAA,CAAA,
|
|
1
|
+
{"version":3,"file":"DataTable.module.scss.cjs","sources":["../../../../src/components/DataTable/components/DataTable.module.scss"],"sourcesContent":["/* DataTable sub-component styles */\n\n/* ScrollContainer */\n.scrollContainer {\n position: relative;\n width: 100%;\n overflow-x: auto;\n overflow-y: hidden;\n}\n\n/* NoWrap */\n.noWrap {\n white-space: nowrap;\n}\n\n/* Truncate */\n.truncate {\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n}\n\n/* LoadingCellContent */\n.loadingCellContent {\n height: 20px;\n width: 75%;\n border-radius: var(--radius-base);\n\n background: var(--colors-neutral-grey-base);\n background-image: linear-gradient(\n to right,\n var(--colors-neutral-grey-base) 0%,\n var(--colors-neutral-grey-dark) 20%,\n var(--colors-neutral-grey-base) 40%,\n var(--colors-neutral-grey-base) 100%\n );\n background-repeat: no-repeat;\n background-size: 800px 104px;\n\n animation-duration: 1s;\n animation-fill-mode: forwards;\n animation-iteration-count: infinite;\n animation-name: placeholderShimmer;\n animation-timing-function: linear;\n}\n\n@keyframes placeholderShimmer {\n 0% {\n background-position: -468px 0;\n }\n\n 100% {\n background-position: 468px 0;\n }\n}\n\n/* EmptyBodyContent */\n.emptyBodyContent {\n padding-top: var(--sizes-lg);\n padding-bottom: var(--sizes-lg);\n grid-column: 1 / span var(--column-span);\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n gap: var(--sizes-md);\n}\n\n.emptyBodyGlyphWrapper {\n padding: var(--sizes-md);\n background-color: var(--colors-neutral-grey-light);\n border-radius: var(--radius-full);\n}\n\n/* Cell */\n.cell {\n display: flex;\n align-items: center;\n justify-content: var(--cell-align, flex-start);\n\n background-color: white;\n padding-bottom: var(--density);\n padding-top: var(--density);\n padding-left: var(--cell-spacing, var(--sizes-3));\n padding-right: var(--cell-spacing, var(--sizes-3));\n\n color: var(--text-body-small-color);\n font-family: var(--text-body-small-font-family);\n font-size: var(--text-body-small-font-size);\n font-style: var(--text-body-small-font-style);\n font-weight: var(--text-body-small-font-weight);\n line-height: var(--text-body-small-line-height);\n\n grid-column-end: span var(--cell-span, 1);\n\n tfoot & {\n min-height: 56px;\n border-top: 1px solid var(--colors-secondary-blue-base);\n background-color: var(--colors-neutral-grey-lightest);\n }\n}\n\n/* Header */\n.header {\n height: 56px;\n position: relative;\n display: flex;\n align-items: center;\n justify-content: var(--cell-align, flex-start);\n z-index: var(--header-z-index, 0);\n\n background-color: white;\n padding-left: var(--cell-spacing, var(--sizes-3));\n padding-right: var(--cell-spacing, var(--sizes-3));\n border-bottom: 1px solid var(--colors-neutral-grey-base);\n\n grid-column-end: span var(--cell-span, 1);\n}\n\n/* Row */\n.row {\n display: contents;\n}\n\n/* Selected rows must beat two higher-specificity rules that also paint the\n cell background:\n - striping: [data-table-id] tr:nth-child(odd) > td (0,2,2), injected per table by generateTableCss\n - hover: .tableGrid.tableGrid tr:hover td (0,3,2), defined below\n Doubling the class selectors lifts this rule to (0,4,2) so selection always\n wins, regardless of source order. Mirrors the pre-CSS-Modules `&&&& > td` (0,4,1). */\n.tableGrid.tableGrid tr.rowSelected.rowSelected > td {\n background-color: var(--colors-brand-blue-lightest);\n}\n\n.rowAccentColor > *:first-child {\n position: relative;\n}\n\n.rowAccentColor > *:first-child::before {\n content: '';\n position: absolute;\n top: 0;\n left: 0;\n bottom: 0;\n width: 4px;\n background-color: var(--row-accent-color);\n}\n\n/* Wrapper */\n.wrapper {\n width: 100%;\n position: relative;\n border-style: solid;\n border-color: var(--colors-neutral-grey-dark);\n\n &,\n & * {\n box-sizing: border-box;\n }\n\n :global(.hideHeaderDetails) th {\n > * {\n opacity: 0.1;\n }\n\n :global(.th-divider) {\n opacity: 1;\n }\n }\n}\n\n.borderFull {\n border-width: 1px;\n border-radius: var(--radius-base);\n}\n\n.borderVertical {\n border-width: 0;\n border-top-width: 1px;\n border-bottom-width: 1px;\n}\n\n.borderNone {\n border-width: 0;\n}\n\n/* TableGrid */\n.tableGrid {\n min-width: 100%;\n width: max-content;\n display: grid;\n\n & thead,\n & tbody,\n & tfoot {\n display: contents;\n }\n\n --density: var(--sizes-base);\n}\n\n.tableGrid.tableGrid tr:hover td {\n /* No 1:1 theme token exists for this shade */\n background-color: #f2f8fc;\n}\n\n/* ColumnHeader */\n.sortIndicator {\n width: 20px;\n height: 20px;\n display: flex;\n align-items: center;\n justify-content: center;\n background-color: white;\n color: var(--colors-neutral-ink-lightest);\n}\n\n.headerContent {\n display: flex;\n height: 28px;\n align-items: center;\n gap: var(--sizes-xs);\n white-space: nowrap;\n\n color: var(--text-heading-table-color);\n font-family: var(--text-heading-table-font-family);\n font-size: var(--text-heading-table-font-size);\n font-style: var(--text-heading-table-font-style);\n font-weight: var(--text-heading-table-font-weight);\n line-height: var(--text-heading-table-line-height);\n}\n\n.clickableHeaderContent {\n display: flex;\n height: 28px;\n align-items: center;\n gap: var(--sizes-xs);\n white-space: nowrap;\n\n color: var(--text-heading-table-color);\n font-family: var(--text-heading-table-font-family);\n font-size: var(--text-heading-table-font-size);\n font-style: var(--text-heading-table-font-style);\n font-weight: var(--text-heading-table-font-weight);\n line-height: var(--text-heading-table-line-height);\n\n appearance: none;\n padding: 0;\n border: 0;\n border-radius: var(--radius-base);\n background-color: transparent;\n\n &:not(:disabled):hover {\n cursor: pointer;\n }\n\n &:hover .sortIndicator {\n background-color: var(--colors-neutral-grey-light);\n color: var(--colors-neutral-ink-base);\n }\n\n &:focus-visible {\n outline: 0;\n box-shadow: 0px 0px 0px 2px var(--colors-secondary-blue-light);\n }\n}\n\n/* ColumnDivider ResizerBar */\n.resizerBar {\n position: absolute;\n right: 0;\n top: 37.5%;\n width: 1px;\n background: var(--colors-neutral-grey-dark);\n min-height: 25%;\n cursor: col-resize;\n user-select: none;\n\n &::before {\n content: '';\n position: absolute;\n top: -150%;\n left: 0;\n width: 12px;\n min-height: 400%;\n z-index: 1;\n transform: translateX(-6px);\n }\n}\n\n/* ActionBar */\n.actionBarContainer {\n display: grid;\n grid-template-columns: auto 1fr;\n align-items: center;\n position: absolute;\n top: 0;\n left: 0;\n right: 0;\n z-index: 50;\n height: 56px;\n background-color: white;\n}\n\n.actionBarContent {\n width: 100%;\n height: 100%;\n display: flex;\n align-items: center;\n padding: 0 var(--sizes-sm);\n border-bottom: 1px solid var(--colors-neutral-grey-base);\n\n & > * {\n flex: 1;\n }\n}\n"],"names":[],"mappings":";;;;AAEA,eAAA,CAAA,iyOAAA;AACA,aAAA,CAAA,iBAAA,CAAA,0BAAA,CAAA,QAAA,CAAA,kBAAA,CAAA,UAAA,CAAA,oBAAA,CAAA,oBAAA,CAAA,8BAAA,CAAA,kBAAA,CAAA,4BAAA,CAAA,uBAAA,CAAA,iCAAA,CAAA,MAAA,CAAA,gBAAA,CAAA,QAAA,CAAA,kBAAA,CAAA,KAAA,CAAA,gBAAA,CAAA,WAAA,CAAA,sBAAA,CAAA,aAAA,CAAA,wBAAA,CAAA,gBAAA,CAAA,2BAAA,CAAA,SAAA,CAAA,oBAAA,CAAA,YAAA,CAAA,uBAAA,CAAA,gBAAA,CAAA,2BAAA,CAAA,YAAA,CAAA,uBAAA,CAAA,eAAA,CAAA,0BAAA,CAAA,eAAA,CAAA,0BAAA,CAAA,wBAAA,CAAA,mCAAA,CAAA,YAAA,CAAA,uBAAA,CAAA,oBAAA,CAAA,+BAAA,CAAA,kBAAA,CAAA,6BAAA;;;;"}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import insertStyle from '../../../_virtual/____insertStyle.js';
|
|
2
2
|
|
|
3
|
-
insertStyle("/* DataTable sub-component styles */\n/* ScrollContainer */\n.
|
|
4
|
-
var styles = {"scrollContainer":"
|
|
3
|
+
insertStyle("/* DataTable sub-component styles */\n/* ScrollContainer */\n._scrollContainer_uiqwq_3 {\n position: relative;\n width: 100%;\n overflow-x: auto;\n overflow-y: hidden;\n}\n\n/* NoWrap */\n._noWrap_uiqwq_11 {\n white-space: nowrap;\n}\n\n/* Truncate */\n._truncate_uiqwq_16 {\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n}\n\n/* LoadingCellContent */\n._loadingCellContent_uiqwq_23 {\n height: 20px;\n width: 75%;\n border-radius: var(--radius-base);\n background: var(--colors-neutral-grey-base);\n background-image: linear-gradient(to right, var(--colors-neutral-grey-base) 0%, var(--colors-neutral-grey-dark) 20%, var(--colors-neutral-grey-base) 40%, var(--colors-neutral-grey-base) 100%);\n background-repeat: no-repeat;\n background-size: 800px 104px;\n animation-duration: 1s;\n animation-fill-mode: forwards;\n animation-iteration-count: infinite;\n animation-name: _placeholderShimmer_uiqwq_1;\n animation-timing-function: linear;\n}\n\n@keyframes _placeholderShimmer_uiqwq_1 {\n 0% {\n background-position: -468px 0;\n }\n 100% {\n background-position: 468px 0;\n }\n}\n/* EmptyBodyContent */\n._emptyBodyContent_uiqwq_47 {\n padding-top: var(--sizes-lg);\n padding-bottom: var(--sizes-lg);\n grid-column: 1/span var(--column-span);\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n gap: var(--sizes-md);\n}\n\n._emptyBodyGlyphWrapper_uiqwq_58 {\n padding: var(--sizes-md);\n background-color: var(--colors-neutral-grey-light);\n border-radius: var(--radius-full);\n}\n\n/* Cell */\n._cell_uiqwq_65 {\n display: flex;\n align-items: center;\n justify-content: var(--cell-align, flex-start);\n background-color: white;\n padding-bottom: var(--density);\n padding-top: var(--density);\n padding-left: var(--cell-spacing, var(--sizes-3));\n padding-right: var(--cell-spacing, var(--sizes-3));\n color: var(--text-body-small-color);\n font-family: var(--text-body-small-font-family);\n font-size: var(--text-body-small-font-size);\n font-style: var(--text-body-small-font-style);\n font-weight: var(--text-body-small-font-weight);\n line-height: var(--text-body-small-line-height);\n grid-column-end: span var(--cell-span, 1);\n}\ntfoot ._cell_uiqwq_65 {\n min-height: 56px;\n border-top: 1px solid var(--colors-secondary-blue-base);\n background-color: var(--colors-neutral-grey-lightest);\n}\n\n/* Header */\n._header_uiqwq_89 {\n height: 56px;\n position: relative;\n display: flex;\n align-items: center;\n justify-content: var(--cell-align, flex-start);\n z-index: var(--header-z-index, 0);\n background-color: white;\n padding-left: var(--cell-spacing, var(--sizes-3));\n padding-right: var(--cell-spacing, var(--sizes-3));\n border-bottom: 1px solid var(--colors-neutral-grey-base);\n grid-column-end: span var(--cell-span, 1);\n}\n\n/* Row */\n._row_uiqwq_104 {\n display: contents;\n}\n\n/* Selected rows must beat two higher-specificity rules that also paint the\n cell background:\n - striping: [data-table-id] tr:nth-child(odd) > td (0,2,2), injected per table by generateTableCss\n - hover: .tableGrid.tableGrid tr:hover td (0,3,2), defined below\n Doubling the class selectors lifts this rule to (0,4,2) so selection always\n wins, regardless of source order. Mirrors the pre-CSS-Modules `&&&& > td` (0,4,1). */\n._tableGrid_uiqwq_111._tableGrid_uiqwq_111 tr._rowSelected_uiqwq_114._rowSelected_uiqwq_114 > td {\n background-color: var(--colors-brand-blue-lightest);\n}\n\n._rowAccentColor_uiqwq_118 > *:first-child {\n position: relative;\n}\n\n._rowAccentColor_uiqwq_118 > *:first-child::before {\n content: \"\";\n position: absolute;\n top: 0;\n left: 0;\n bottom: 0;\n width: 4px;\n background-color: var(--row-accent-color);\n}\n\n/* Wrapper */\n._wrapper_uiqwq_133 {\n width: 100%;\n position: relative;\n border-style: solid;\n border-color: var(--colors-neutral-grey-dark);\n}\n._wrapper_uiqwq_133, ._wrapper_uiqwq_133 * {\n box-sizing: border-box;\n}\n._wrapper_uiqwq_133 .hideHeaderDetails th > * {\n opacity: 0.1;\n}\n._wrapper_uiqwq_133 .hideHeaderDetails th .th-divider {\n opacity: 1;\n}\n\n._borderFull_uiqwq_149 {\n border-width: 1px;\n border-radius: var(--radius-base);\n}\n\n._borderVertical_uiqwq_154 {\n border-width: 0;\n border-top-width: 1px;\n border-bottom-width: 1px;\n}\n\n._borderNone_uiqwq_160 {\n border-width: 0;\n}\n\n/* TableGrid */\n._tableGrid_uiqwq_111 {\n min-width: 100%;\n width: max-content;\n display: grid;\n --density: var(--sizes-base);\n}\n._tableGrid_uiqwq_111 thead, ._tableGrid_uiqwq_111 tbody, ._tableGrid_uiqwq_111 tfoot {\n display: contents;\n}\n\n._tableGrid_uiqwq_111._tableGrid_uiqwq_111 tr:hover td {\n /* No 1:1 theme token exists for this shade */\n background-color: #f2f8fc;\n}\n\n/* ColumnHeader */\n._sortIndicator_uiqwq_181 {\n width: 20px;\n height: 20px;\n display: flex;\n align-items: center;\n justify-content: center;\n background-color: white;\n color: var(--colors-neutral-ink-lightest);\n}\n\n._headerContent_uiqwq_191 {\n display: flex;\n height: 28px;\n align-items: center;\n gap: var(--sizes-xs);\n white-space: nowrap;\n color: var(--text-heading-table-color);\n font-family: var(--text-heading-table-font-family);\n font-size: var(--text-heading-table-font-size);\n font-style: var(--text-heading-table-font-style);\n font-weight: var(--text-heading-table-font-weight);\n line-height: var(--text-heading-table-line-height);\n}\n\n._clickableHeaderContent_uiqwq_205 {\n display: flex;\n height: 28px;\n align-items: center;\n gap: var(--sizes-xs);\n white-space: nowrap;\n color: var(--text-heading-table-color);\n font-family: var(--text-heading-table-font-family);\n font-size: var(--text-heading-table-font-size);\n font-style: var(--text-heading-table-font-style);\n font-weight: var(--text-heading-table-font-weight);\n line-height: var(--text-heading-table-line-height);\n appearance: none;\n padding: 0;\n border: 0;\n border-radius: var(--radius-base);\n background-color: transparent;\n}\n._clickableHeaderContent_uiqwq_205:not(:disabled):hover {\n cursor: pointer;\n}\n._clickableHeaderContent_uiqwq_205:hover ._sortIndicator_uiqwq_181 {\n background-color: var(--colors-neutral-grey-light);\n color: var(--colors-neutral-ink-base);\n}\n._clickableHeaderContent_uiqwq_205:focus-visible {\n outline: 0;\n box-shadow: 0px 0px 0px 2px var(--colors-secondary-blue-light);\n}\n\n/* ColumnDivider ResizerBar */\n._resizerBar_uiqwq_236 {\n position: absolute;\n right: 0;\n top: 37.5%;\n width: 1px;\n background: var(--colors-neutral-grey-dark);\n min-height: 25%;\n cursor: col-resize;\n user-select: none;\n}\n._resizerBar_uiqwq_236::before {\n content: \"\";\n position: absolute;\n top: -150%;\n left: 0;\n width: 12px;\n min-height: 400%;\n z-index: 1;\n transform: translateX(-6px);\n}\n\n/* ActionBar */\n._actionBarContainer_uiqwq_258 {\n display: grid;\n grid-template-columns: auto 1fr;\n align-items: center;\n position: absolute;\n top: 0;\n left: 0;\n right: 0;\n z-index: 50;\n height: 56px;\n background-color: white;\n}\n\n._actionBarContent_uiqwq_271 {\n width: 100%;\n height: 100%;\n display: flex;\n align-items: center;\n padding: 0 var(--sizes-sm);\n border-bottom: 1px solid var(--colors-neutral-grey-base);\n}\n._actionBarContent_uiqwq_271 > * {\n flex: 1;\n}");
|
|
4
|
+
var styles = {"scrollContainer":"_scrollContainer_uiqwq_3","noWrap":"_noWrap_uiqwq_11","truncate":"_truncate_uiqwq_16","loadingCellContent":"_loadingCellContent_uiqwq_23","emptyBodyContent":"_emptyBodyContent_uiqwq_47","emptyBodyGlyphWrapper":"_emptyBodyGlyphWrapper_uiqwq_58","cell":"_cell_uiqwq_65","header":"_header_uiqwq_89","row":"_row_uiqwq_104","tableGrid":"_tableGrid_uiqwq_111","rowSelected":"_rowSelected_uiqwq_114","rowAccentColor":"_rowAccentColor_uiqwq_118","wrapper":"_wrapper_uiqwq_133","borderFull":"_borderFull_uiqwq_149","borderVertical":"_borderVertical_uiqwq_154","borderNone":"_borderNone_uiqwq_160","sortIndicator":"_sortIndicator_uiqwq_181","headerContent":"_headerContent_uiqwq_191","clickableHeaderContent":"_clickableHeaderContent_uiqwq_205","resizerBar":"_resizerBar_uiqwq_236","actionBarContainer":"_actionBarContainer_uiqwq_258","actionBarContent":"_actionBarContent_uiqwq_271"};
|
|
5
5
|
|
|
6
6
|
export { styles as default };
|
|
7
7
|
//# sourceMappingURL=DataTable.module.scss.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"DataTable.module.scss.js","sources":["../../../../src/components/DataTable/components/DataTable.module.scss"],"sourcesContent":["/* DataTable sub-component styles */\n\n/* ScrollContainer */\n.scrollContainer {\n position: relative;\n width: 100%;\n overflow-x: auto;\n overflow-y: hidden;\n}\n\n/* NoWrap */\n.noWrap {\n white-space: nowrap;\n}\n\n/* Truncate */\n.truncate {\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n}\n\n/* LoadingCellContent */\n.loadingCellContent {\n height: 20px;\n width: 75%;\n border-radius: var(--radius-base);\n\n background: var(--colors-neutral-grey-base);\n background-image: linear-gradient(\n to right,\n var(--colors-neutral-grey-base) 0%,\n var(--colors-neutral-grey-dark) 20%,\n var(--colors-neutral-grey-base) 40%,\n var(--colors-neutral-grey-base) 100%\n );\n background-repeat: no-repeat;\n background-size: 800px 104px;\n\n animation-duration: 1s;\n animation-fill-mode: forwards;\n animation-iteration-count: infinite;\n animation-name: placeholderShimmer;\n animation-timing-function: linear;\n}\n\n@keyframes placeholderShimmer {\n 0% {\n background-position: -468px 0;\n }\n\n 100% {\n background-position: 468px 0;\n }\n}\n\n/* EmptyBodyContent */\n.emptyBodyContent {\n padding-top: var(--sizes-lg);\n padding-bottom: var(--sizes-lg);\n grid-column: 1 / span var(--column-span);\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n gap: var(--sizes-md);\n}\n\n.emptyBodyGlyphWrapper {\n padding: var(--sizes-md);\n background-color: var(--colors-neutral-grey-light);\n border-radius: var(--radius-full);\n}\n\n/* Cell */\n.cell {\n display: flex;\n align-items: center;\n justify-content: var(--cell-align, flex-start);\n\n background-color: white;\n padding-bottom: var(--density);\n padding-top: var(--density);\n padding-left: var(--cell-spacing, var(--sizes-3));\n padding-right: var(--cell-spacing, var(--sizes-3));\n\n color: var(--text-body-small-color);\n font-family: var(--text-body-small-font-family);\n font-size: var(--text-body-small-font-size);\n font-style: var(--text-body-small-font-style);\n font-weight: var(--text-body-small-font-weight);\n line-height: var(--text-body-small-line-height);\n\n grid-column-end: span var(--cell-span, 1);\n\n tfoot & {\n min-height: 56px;\n border-top: 1px solid var(--colors-secondary-blue-base);\n background-color: var(--colors-neutral-grey-lightest);\n }\n}\n\n/* Header */\n.header {\n height: 56px;\n position: relative;\n display: flex;\n align-items: center;\n justify-content: var(--cell-align, flex-start);\n z-index: var(--header-z-index, 0);\n\n background-color: white;\n padding-left: var(--cell-spacing, var(--sizes-3));\n padding-right: var(--cell-spacing, var(--sizes-3));\n border-bottom: 1px solid var(--colors-neutral-grey-base);\n\n grid-column-end: span var(--cell-span, 1);\n}\n\n/* Row */\n.row {\n display: contents;\n}\n\n.rowSelected > td {\n background-color: var(--colors-brand-blue-lightest);\n}\n\n.rowAccentColor > *:first-child {\n position: relative;\n}\n\n.rowAccentColor > *:first-child::before {\n content: '';\n position: absolute;\n top: 0;\n left: 0;\n bottom: 0;\n width: 4px;\n background-color: var(--row-accent-color);\n}\n\n/* Wrapper */\n.wrapper {\n width: 100%;\n position: relative;\n border-style: solid;\n border-color: var(--colors-neutral-grey-dark);\n\n &,\n & * {\n box-sizing: border-box;\n }\n\n :global(.hideHeaderDetails) th {\n > * {\n opacity: 0.1;\n }\n\n :global(.th-divider) {\n opacity: 1;\n }\n }\n}\n\n.borderFull {\n border-width: 1px;\n border-radius: var(--radius-base);\n}\n\n.borderVertical {\n border-width: 0;\n border-top-width: 1px;\n border-bottom-width: 1px;\n}\n\n.borderNone {\n border-width: 0;\n}\n\n/* TableGrid */\n.tableGrid {\n min-width: 100%;\n width: max-content;\n display: grid;\n\n & thead,\n & tbody,\n & tfoot {\n display: contents;\n }\n\n --density: var(--sizes-base);\n}\n\n.tableGrid.tableGrid tr:hover td {\n /* No 1:1 theme token exists for this shade */\n background-color: #f2f8fc;\n}\n\n/* ColumnHeader */\n.sortIndicator {\n width: 20px;\n height: 20px;\n display: flex;\n align-items: center;\n justify-content: center;\n background-color: white;\n color: var(--colors-neutral-ink-lightest);\n}\n\n.headerContent {\n display: flex;\n height: 28px;\n align-items: center;\n gap: var(--sizes-xs);\n white-space: nowrap;\n\n color: var(--text-heading-table-color);\n font-family: var(--text-heading-table-font-family);\n font-size: var(--text-heading-table-font-size);\n font-style: var(--text-heading-table-font-style);\n font-weight: var(--text-heading-table-font-weight);\n line-height: var(--text-heading-table-line-height);\n}\n\n.clickableHeaderContent {\n display: flex;\n height: 28px;\n align-items: center;\n gap: var(--sizes-xs);\n white-space: nowrap;\n\n color: var(--text-heading-table-color);\n font-family: var(--text-heading-table-font-family);\n font-size: var(--text-heading-table-font-size);\n font-style: var(--text-heading-table-font-style);\n font-weight: var(--text-heading-table-font-weight);\n line-height: var(--text-heading-table-line-height);\n\n appearance: none;\n padding: 0;\n border: 0;\n border-radius: var(--radius-base);\n background-color: transparent;\n\n &:not(:disabled):hover {\n cursor: pointer;\n }\n\n &:hover .sortIndicator {\n background-color: var(--colors-neutral-grey-light);\n color: var(--colors-neutral-ink-base);\n }\n\n &:focus-visible {\n outline: 0;\n box-shadow: 0px 0px 0px 2px var(--colors-secondary-blue-light);\n }\n}\n\n/* ColumnDivider ResizerBar */\n.resizerBar {\n position: absolute;\n right: 0;\n top: 37.5%;\n width: 1px;\n background: var(--colors-neutral-grey-dark);\n min-height: 25%;\n cursor: col-resize;\n user-select: none;\n\n &::before {\n content: '';\n position: absolute;\n top: -150%;\n left: 0;\n width: 12px;\n min-height: 400%;\n z-index: 1;\n transform: translateX(-6px);\n }\n}\n\n/* ActionBar */\n.actionBarContainer {\n display: grid;\n grid-template-columns: auto 1fr;\n align-items: center;\n position: absolute;\n top: 0;\n left: 0;\n right: 0;\n z-index: 50;\n height: 56px;\n background-color: white;\n}\n\n.actionBarContent {\n width: 100%;\n height: 100%;\n display: flex;\n align-items: center;\n padding: 0 var(--sizes-sm);\n border-bottom: 1px solid var(--colors-neutral-grey-base);\n\n & > * {\n flex: 1;\n }\n}\n"],"names":["___$insertStyle"],"mappings":";;AAEAA,WAAA,CAAA,
|
|
1
|
+
{"version":3,"file":"DataTable.module.scss.js","sources":["../../../../src/components/DataTable/components/DataTable.module.scss"],"sourcesContent":["/* DataTable sub-component styles */\n\n/* ScrollContainer */\n.scrollContainer {\n position: relative;\n width: 100%;\n overflow-x: auto;\n overflow-y: hidden;\n}\n\n/* NoWrap */\n.noWrap {\n white-space: nowrap;\n}\n\n/* Truncate */\n.truncate {\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n}\n\n/* LoadingCellContent */\n.loadingCellContent {\n height: 20px;\n width: 75%;\n border-radius: var(--radius-base);\n\n background: var(--colors-neutral-grey-base);\n background-image: linear-gradient(\n to right,\n var(--colors-neutral-grey-base) 0%,\n var(--colors-neutral-grey-dark) 20%,\n var(--colors-neutral-grey-base) 40%,\n var(--colors-neutral-grey-base) 100%\n );\n background-repeat: no-repeat;\n background-size: 800px 104px;\n\n animation-duration: 1s;\n animation-fill-mode: forwards;\n animation-iteration-count: infinite;\n animation-name: placeholderShimmer;\n animation-timing-function: linear;\n}\n\n@keyframes placeholderShimmer {\n 0% {\n background-position: -468px 0;\n }\n\n 100% {\n background-position: 468px 0;\n }\n}\n\n/* EmptyBodyContent */\n.emptyBodyContent {\n padding-top: var(--sizes-lg);\n padding-bottom: var(--sizes-lg);\n grid-column: 1 / span var(--column-span);\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n gap: var(--sizes-md);\n}\n\n.emptyBodyGlyphWrapper {\n padding: var(--sizes-md);\n background-color: var(--colors-neutral-grey-light);\n border-radius: var(--radius-full);\n}\n\n/* Cell */\n.cell {\n display: flex;\n align-items: center;\n justify-content: var(--cell-align, flex-start);\n\n background-color: white;\n padding-bottom: var(--density);\n padding-top: var(--density);\n padding-left: var(--cell-spacing, var(--sizes-3));\n padding-right: var(--cell-spacing, var(--sizes-3));\n\n color: var(--text-body-small-color);\n font-family: var(--text-body-small-font-family);\n font-size: var(--text-body-small-font-size);\n font-style: var(--text-body-small-font-style);\n font-weight: var(--text-body-small-font-weight);\n line-height: var(--text-body-small-line-height);\n\n grid-column-end: span var(--cell-span, 1);\n\n tfoot & {\n min-height: 56px;\n border-top: 1px solid var(--colors-secondary-blue-base);\n background-color: var(--colors-neutral-grey-lightest);\n }\n}\n\n/* Header */\n.header {\n height: 56px;\n position: relative;\n display: flex;\n align-items: center;\n justify-content: var(--cell-align, flex-start);\n z-index: var(--header-z-index, 0);\n\n background-color: white;\n padding-left: var(--cell-spacing, var(--sizes-3));\n padding-right: var(--cell-spacing, var(--sizes-3));\n border-bottom: 1px solid var(--colors-neutral-grey-base);\n\n grid-column-end: span var(--cell-span, 1);\n}\n\n/* Row */\n.row {\n display: contents;\n}\n\n/* Selected rows must beat two higher-specificity rules that also paint the\n cell background:\n - striping: [data-table-id] tr:nth-child(odd) > td (0,2,2), injected per table by generateTableCss\n - hover: .tableGrid.tableGrid tr:hover td (0,3,2), defined below\n Doubling the class selectors lifts this rule to (0,4,2) so selection always\n wins, regardless of source order. Mirrors the pre-CSS-Modules `&&&& > td` (0,4,1). */\n.tableGrid.tableGrid tr.rowSelected.rowSelected > td {\n background-color: var(--colors-brand-blue-lightest);\n}\n\n.rowAccentColor > *:first-child {\n position: relative;\n}\n\n.rowAccentColor > *:first-child::before {\n content: '';\n position: absolute;\n top: 0;\n left: 0;\n bottom: 0;\n width: 4px;\n background-color: var(--row-accent-color);\n}\n\n/* Wrapper */\n.wrapper {\n width: 100%;\n position: relative;\n border-style: solid;\n border-color: var(--colors-neutral-grey-dark);\n\n &,\n & * {\n box-sizing: border-box;\n }\n\n :global(.hideHeaderDetails) th {\n > * {\n opacity: 0.1;\n }\n\n :global(.th-divider) {\n opacity: 1;\n }\n }\n}\n\n.borderFull {\n border-width: 1px;\n border-radius: var(--radius-base);\n}\n\n.borderVertical {\n border-width: 0;\n border-top-width: 1px;\n border-bottom-width: 1px;\n}\n\n.borderNone {\n border-width: 0;\n}\n\n/* TableGrid */\n.tableGrid {\n min-width: 100%;\n width: max-content;\n display: grid;\n\n & thead,\n & tbody,\n & tfoot {\n display: contents;\n }\n\n --density: var(--sizes-base);\n}\n\n.tableGrid.tableGrid tr:hover td {\n /* No 1:1 theme token exists for this shade */\n background-color: #f2f8fc;\n}\n\n/* ColumnHeader */\n.sortIndicator {\n width: 20px;\n height: 20px;\n display: flex;\n align-items: center;\n justify-content: center;\n background-color: white;\n color: var(--colors-neutral-ink-lightest);\n}\n\n.headerContent {\n display: flex;\n height: 28px;\n align-items: center;\n gap: var(--sizes-xs);\n white-space: nowrap;\n\n color: var(--text-heading-table-color);\n font-family: var(--text-heading-table-font-family);\n font-size: var(--text-heading-table-font-size);\n font-style: var(--text-heading-table-font-style);\n font-weight: var(--text-heading-table-font-weight);\n line-height: var(--text-heading-table-line-height);\n}\n\n.clickableHeaderContent {\n display: flex;\n height: 28px;\n align-items: center;\n gap: var(--sizes-xs);\n white-space: nowrap;\n\n color: var(--text-heading-table-color);\n font-family: var(--text-heading-table-font-family);\n font-size: var(--text-heading-table-font-size);\n font-style: var(--text-heading-table-font-style);\n font-weight: var(--text-heading-table-font-weight);\n line-height: var(--text-heading-table-line-height);\n\n appearance: none;\n padding: 0;\n border: 0;\n border-radius: var(--radius-base);\n background-color: transparent;\n\n &:not(:disabled):hover {\n cursor: pointer;\n }\n\n &:hover .sortIndicator {\n background-color: var(--colors-neutral-grey-light);\n color: var(--colors-neutral-ink-base);\n }\n\n &:focus-visible {\n outline: 0;\n box-shadow: 0px 0px 0px 2px var(--colors-secondary-blue-light);\n }\n}\n\n/* ColumnDivider ResizerBar */\n.resizerBar {\n position: absolute;\n right: 0;\n top: 37.5%;\n width: 1px;\n background: var(--colors-neutral-grey-dark);\n min-height: 25%;\n cursor: col-resize;\n user-select: none;\n\n &::before {\n content: '';\n position: absolute;\n top: -150%;\n left: 0;\n width: 12px;\n min-height: 400%;\n z-index: 1;\n transform: translateX(-6px);\n }\n}\n\n/* ActionBar */\n.actionBarContainer {\n display: grid;\n grid-template-columns: auto 1fr;\n align-items: center;\n position: absolute;\n top: 0;\n left: 0;\n right: 0;\n z-index: 50;\n height: 56px;\n background-color: white;\n}\n\n.actionBarContent {\n width: 100%;\n height: 100%;\n display: flex;\n align-items: center;\n padding: 0 var(--sizes-sm);\n border-bottom: 1px solid var(--colors-neutral-grey-base);\n\n & > * {\n flex: 1;\n }\n}\n"],"names":["___$insertStyle"],"mappings":";;AAEAA,WAAA,CAAA,iyOAAA;AACA,aAAA,CAAA,iBAAA,CAAA,0BAAA,CAAA,QAAA,CAAA,kBAAA,CAAA,UAAA,CAAA,oBAAA,CAAA,oBAAA,CAAA,8BAAA,CAAA,kBAAA,CAAA,4BAAA,CAAA,uBAAA,CAAA,iCAAA,CAAA,MAAA,CAAA,gBAAA,CAAA,QAAA,CAAA,kBAAA,CAAA,KAAA,CAAA,gBAAA,CAAA,WAAA,CAAA,sBAAA,CAAA,aAAA,CAAA,wBAAA,CAAA,gBAAA,CAAA,2BAAA,CAAA,SAAA,CAAA,oBAAA,CAAA,YAAA,CAAA,uBAAA,CAAA,gBAAA,CAAA,2BAAA,CAAA,YAAA,CAAA,uBAAA,CAAA,eAAA,CAAA,0BAAA,CAAA,eAAA,CAAA,0BAAA,CAAA,wBAAA,CAAA,mCAAA,CAAA,YAAA,CAAA,uBAAA,CAAA,oBAAA,CAAA,+BAAA,CAAA,kBAAA,CAAA,6BAAA;;;;"}
|