ods-component-lib 1.19.8 → 1.19.11
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/README.md +39 -39
- package/dist/App.d.ts +3 -0
- package/dist/components/antd/modal/OdsAdvanceModal.d.ts +7 -0
- package/dist/components/devextreme/DataGrid/OdsDataGrid/index.d.ts +3 -2
- package/dist/components/devextreme/DataGrid/styles/styles.d.ts +2 -0
- package/dist/components/devextreme/DataGrid/styles/theme/sizes/default.d.ts +14 -0
- package/dist/components/devextreme/OdsBasicDataGrid/OdsBasicDataGrid.Types.d.ts +0 -1
- package/dist/components/devextreme/OdsInlineEditDataGrid/handlers/ContentHandlers.d.ts +14 -0
- package/dist/components/devextreme/OdsInlineEditDataGrid/handlers/EditorPreparedHandlers.d.ts +7 -0
- package/dist/components/devextreme/OdsInlineEditDataGrid/handlers/OnExportingHandlers.d.ts +19 -0
- package/dist/components/devextreme/OdsInlineEditDataGrid/handlers/OptionHandlers.d.ts +7 -0
- package/dist/components/devextreme/OdsInlineEditDataGrid/handlers/SummaryHandlers.d.ts +21 -0
- package/dist/components/devextreme/OdsInlineEditDataGrid/partials/ActionCellRender.d.ts +15 -0
- package/dist/components/devextreme/OdsInlineEditDataGrid/partials/EditingPartial.d.ts +9 -0
- package/dist/components/devextreme/OdsInlineEditDataGrid/partials/PageTitle.d.ts +8 -0
- package/dist/components/devextreme/OdsInlineEditDataGrid/utils.d.ts +19 -0
- package/dist/components/devextreme/OdsTimeline/OdsTimeline.Constants.d.ts +4 -0
- package/dist/components/devextreme/OdsTimeline/OdsTimeline.Functions.d.ts +6 -0
- package/dist/components/devextreme/OdsTimeline/OdsTimeline.Types.d.ts +77 -0
- package/dist/components/devextreme/OdsTimeline/OdsTimeline.d.ts +5 -0
- package/dist/components/devextreme/OdsTimeline/OdsTimelineDateFilter.d.ts +3 -0
- package/dist/components/devextreme/OdsTimeline/OdsTimelineSelectionColumn.d.ts +2 -0
- package/dist/components/devextreme/OdsTimelineTable/OdsTimelineTableSearchBox.d.ts +3 -0
- package/dist/index.css +267 -267
- package/dist/index.js +43 -8
- package/dist/index.js.map +1 -1
- package/dist/index.modern.js +43 -8
- package/dist/index.modern.js.map +1 -1
- package/dist/index.umd.js +2 -0
- package/dist/index.umd.js.map +1 -0
- package/dist/stories/OdsAdvanceModal/OdsAdvanceModal.stories.d.ts +42 -0
- package/dist/stories/OdsAdvanceModal/Samples/BasicOdsAdvanceModal.sample.d.ts +8 -0
- package/dist/stories/OdsModal/Samples/OdsModal.Sample.d.ts +1 -0
- package/dist/stories/OdsTimePicker/Samples/TimeRangePicker.d.ts +2 -0
- package/dist/stories/OdsTimeline/OdsTimeline.Constants.d.ts +3 -0
- package/dist/stories/OdsTimeline/OdsTimeline.Functions.d.ts +6 -0
- package/dist/stories/OdsTimeline/OdsTimeline.MockData.d.ts +39 -0
- package/package.json +101 -101
package/dist/index.modern.js
CHANGED
|
@@ -2619,6 +2619,20 @@ var defaultSizes = {
|
|
|
2619
2619
|
dxToolbarMenuContentPaddingBlock: 5,
|
|
2620
2620
|
dxToolbarMenuContentTextPaddingRight: 27,
|
|
2621
2621
|
dxToolbarMenuItemBorderRadius: 4
|
|
2622
|
+
},
|
|
2623
|
+
dxPager: {
|
|
2624
|
+
dxPagerPaddingBlock: 16,
|
|
2625
|
+
dxPagerPaddingInline: 16,
|
|
2626
|
+
dxPagerPageIndexesGap: 4,
|
|
2627
|
+
dxPagerNavigationButtonWidth: 24,
|
|
2628
|
+
dxPagerNavigationButtonHeight: 24,
|
|
2629
|
+
dxPagerNavigationButtonFontSize: 11,
|
|
2630
|
+
dxPagerNavigationButtonBeforeWidth: 14,
|
|
2631
|
+
dxPagerNavigationButtonBeforeHeight: 14,
|
|
2632
|
+
dxPagerPageButtonWidth: 24,
|
|
2633
|
+
dxPagerPageButtonHeight: 24,
|
|
2634
|
+
dxPagerPageButtonBorderRadius: 6,
|
|
2635
|
+
dxPagerPageButtonFontSize: 14
|
|
2622
2636
|
}
|
|
2623
2637
|
};
|
|
2624
2638
|
|
|
@@ -2727,6 +2741,20 @@ var compactSizes = {
|
|
|
2727
2741
|
dxToolbarMenuContentPaddingBlock: 5,
|
|
2728
2742
|
dxToolbarMenuContentTextPaddingRight: 27,
|
|
2729
2743
|
dxToolbarMenuItemBorderRadius: 4
|
|
2744
|
+
},
|
|
2745
|
+
dxPager: {
|
|
2746
|
+
dxPagerPaddingBlock: 8,
|
|
2747
|
+
dxPagerPaddingInline: 8,
|
|
2748
|
+
dxPagerPageIndexesGap: 4,
|
|
2749
|
+
dxPagerNavigationButtonWidth: 18,
|
|
2750
|
+
dxPagerNavigationButtonHeight: 18,
|
|
2751
|
+
dxPagerNavigationButtonFontSize: 9,
|
|
2752
|
+
dxPagerNavigationButtonBeforeWidth: 12,
|
|
2753
|
+
dxPagerNavigationButtonBeforeHeight: 12,
|
|
2754
|
+
dxPagerPageButtonWidth: 18,
|
|
2755
|
+
dxPagerPageButtonHeight: 18,
|
|
2756
|
+
dxPagerPageButtonBorderRadius: 4,
|
|
2757
|
+
dxPagerPageButtonFontSize: 12
|
|
2730
2758
|
}
|
|
2731
2759
|
};
|
|
2732
2760
|
|
|
@@ -2879,12 +2907,15 @@ var useStyles$4 = createStyles(function (_ref, props) {
|
|
|
2879
2907
|
dxToolbar = _getSizes.dxToolbar,
|
|
2880
2908
|
dxSearchBoxSizes = _getSizes.dxSearchBoxSizes,
|
|
2881
2909
|
dxSummarySizes = _getSizes.dxSummarySizes,
|
|
2882
|
-
dxColumnTagSizes = _getSizes.dxColumnTagSizes
|
|
2910
|
+
dxColumnTagSizes = _getSizes.dxColumnTagSizes,
|
|
2911
|
+
dxPager = _getSizes.dxPager;
|
|
2883
2912
|
var dxCommonSelectionStyles = css(_templateObject$u || (_templateObject$u = _taggedTemplateLiteralLoose(["\n width: ", "px;\n min-width: ", "px;\n max-width: ", "px;\n "])), dxSelectionColumnWidth, dxSelectionColumnWidth, dxSelectionColumnWidth);
|
|
2884
2913
|
var dxColumnColors = css(_templateObject2$2 || (_templateObject2$2 = _taggedTemplateLiteralLoose(["\n color: ", ";\n background-color: transparent;\n "])), columnTextColor);
|
|
2914
|
+
var odsDataGridBorderRadius = props.dataGridBorderRadius ? typeof props.dataGridBorderRadius === "number" ? props.dataGridBorderRadius + "px" : props.dataGridBorderRadius : dxDataGridBorderRadius + "px";
|
|
2915
|
+
var odsDataGridHeight = typeof props.height === "function" ? props.height() : typeof props.height === "number" ? props.height + "px" : props.height;
|
|
2885
2916
|
return {
|
|
2886
|
-
gridWrapper: cx("ods-datagrid", css(_templateObject3$1 || (_templateObject3$1 = _taggedTemplateLiteralLoose(["\n &.ods-datagrid {\n background-color: ", ";\n box-shadow: none;\n border: 1px solid ", ";\n border-radius: ", "
|
|
2887
|
-
grid: cx("ods-datagrid-grid", css(_templateObject4 || (_templateObject4 = _taggedTemplateLiteralLoose(["\n &.ods-datagrid-grid {\n &.dx-widget {\n font-family: \"Manrope\", sans-serif;\n font-size: ", "px;\n }\n\n & .dx-datagrid {\n ", ";\n line-height: 1;\n\n .dx-datagrid-content-fixed {\n .dx-datagrid-table {\n .dx-col-fixed {\n background-color: transparent;\n }\n }\n }\n\n & .dx-datagrid-header-panel {\n border-bottom: 0.5px solid ", ";\n background-color: transparent;\n padding: ", "px\n ", "px\n ", "px;\n\n .dx-toolbar {\n background-color: transparent;\n margin-bottom: 0;\n\n .dx-toolbar-items-container {\n display: flex;\n justify-content: space-between;\n gap: ", "px;\n height: unset;\n\n .dx-toolbar-before,\n .dx-toolbar-after {\n display: flex;\n align-items: center;\n gap: ", "px;\n margin: 0;\n padding: 0;\n position: relative;\n left: unset;\n right: unset;\n top: unset;\n bottom: unset;\n flex: 0 1 auto;\n max-width: 100%;\n overflow: hidden;\n white-space: nowrap;\n }\n\n .dx-toolbar-before {\n .dx-item.dx-toolbar-item {\n display: flex;\n justify-content: flex-end;\n align-items: center;\n margin: 0;\n padding: 0;\n\n &.ods-toolbar-title {\n font-size: ", "px;\n line-height: 1;\n color: ", ";\n font-weight: 600;\n max-width: unset !important;\n\n & > div {\n margin: 0;\n padding: 0;\n }\n }\n\n &.ods-toolbar-left-item-menu {\n &.dx-toolbar-item {\n .ods-toolbar-left-menu {\n &.dx-menu {\n &.dx-menu-base .dx-menu-item {\n &.dx-state-hover,\n &:hover {\n background-color: ", ";\n border-radius: ", "px;\n }\n }\n &.dx-menu-base\n .dx-menu-item\n .dx-menu-item-content {\n padding-block: ", "px;\n padding-inline: ", "px;\n border: none;\n\n .dx-menu-item-popout-container {\n display: none;\n }\n }\n .dx-menu-item-has-icon.dx-menu-item-has-submenu\n .dx-icon {\n padding: 0;\n margin: 0;\n width: auto;\n height: auto;\n font-size: unset;\n line-height: unset;\n }\n\n .dx-context-menu-container-border {\n display: none;\n }\n }\n }\n }\n }\n\n &.ods-toolbar-left-item {\n height: 100%;\n .ods-toolbar-left-menu-dropdown {\n display: inline-flex;\n vertical-align: unset;\n }\n }\n }\n\n .dx-button {\n border-radius: ", "px;\n\n .dx-button-content {\n font-size: ", "px;\n padding-inline: ", "px;\n padding-block: ", "px;\n\n .dx-button-text {\n line-height: ", "px;\n }\n }\n\n &.dx-button-mode-outlined {\n background-color: ", ";\n box-shadow: 0px 2px 0px 0px ", ";\n\n &.dx-button-default {\n background-color: ", ";\n border-color: ", ";\n color: ", ";\n\n &.dx-state-hover,\n &:hover {\n background-color: ", ";\n border-color: ", ";\n color: ", ";\n }\n\n &.dx-state-focused,\n &:focus,\n &:active {\n background-color: ", ";\n border-color: ", ";\n color: ", ";\n }\n }\n\n &.dx-button-danger {\n background-color: ", ";\n border-color: ", ";\n color: ", ";\n\n &.dx-state-hover,\n &:hover {\n background-color: ", ";\n border-color: ", ";\n color: ", ";\n }\n\n &.dx-state-focused,\n &:focus,\n &:active {\n background-color: ", ";\n border-color: ", ";\n color: ", ";\n }\n }\n\n &.dx-button-success {\n background-color: ", ";\n border-color: ", ";\n color: ", ";\n\n &.dx-state-hover,\n &:hover {\n background-color: ", ";\n border-color: ", ";\n color: ", ";\n }\n\n &.dx-state-focused,\n &:focus,\n &:active {\n background-color: ", ";\n border-color: ", ";\n color: ", ";\n }\n }\n\n &.dx-button-normal {\n color: ", ";\n border-color: ", ";\n background-color: ", ";\n\n &.dx-state-hover,\n &:hover {\n color: ", ";\n border-color: ", ";\n background-color: ", ";\n }\n\n &.dx-state-focused,\n &:focus,\n &:active {\n color: ", ";\n border-color: ", ";\n background-color: ", ";\n }\n }\n }\n\n &.dx-button-mode-text {\n background-color: transparent;\n\n &.dx-button-default {\n background-color: transparent;\n color: ", ";\n\n &.dx-state-hover,\n &:hover {\n background-color: ", ";\n color: ", ";\n }\n\n &.dx-state-focused,\n &:focus,\n &:active {\n background-color: ", ";\n color: ", ";\n }\n }\n\n &.dx-button-danger {\n background-color: transparent;\n color: ", ";\n\n &.dx-state-hover,\n &:hover {\n background-color: ", ";\n color: ", ";\n }\n\n &.dx-state-focused,\n &:focus,\n &:active {\n background-color: ", ";\n color: ", ";\n }\n }\n\n &.dx-button-success {\n background-color: transparent;\n color: ", ";\n\n &.dx-state-hover,\n &:hover {\n background-color: ", ";\n color: ", ";\n }\n\n &.dx-state-focused,\n &:focus,\n &:active {\n background-color: ", ";\n color: ", ";\n }\n }\n\n &.dx-button-normal {\n background-color: transparent;\n color: ", ";\n\n &.dx-state-hover,\n &:hover {\n background-color: ", ";\n }\n\n &.dx-state-focused,\n &:focus,\n &:active {\n background-color: ", ";\n }\n }\n }\n\n &.dx-button-mode-contained {\n box-shadow: 0px 2px 0px 0px ", ";\n\n &.dx-button-default {\n background-color: ", ";\n\n &.dx-state-hover,\n &:hover {\n background-color: ", ";\n }\n\n &.dx-state-focused,\n &:focus,\n &:active {\n background-color: ", ";\n }\n }\n\n &.dx-button-danger {\n background-color: ", ";\n\n &.dx-state-hover,\n &:hover {\n background-color: ", ";\n }\n\n &.dx-state-focused,\n &:focus,\n &:active {\n background-color: ", ";\n }\n }\n\n &.dx-button-success {\n background-color: ", ";\n\n &.dx-state-hover,\n &:hover {\n background-color: ", ";\n }\n\n &.dx-state-focused,\n &:focus,\n &:active {\n background-color: ", ";\n }\n }\n\n &.dx-button-normal {\n background-color: ", ";\n color: ", ";\n\n &.dx-state-hover,\n &:hover {\n background-color: ", ";\n }\n\n &.dx-state-focused,\n &:focus,\n &:active {\n background-color: ", ";\n }\n }\n }\n }\n }\n\n .dx-toolbar-after {\n flex: 0 0 auto;\n overflow: unset;\n\n .dx-item.dx-toolbar-item {\n display: flex;\n justify-content: flex-end;\n align-items: center;\n margin: 0;\n padding: 0;\n\n &.ods-toolbar-after-settings-button {\n .ods-toolbar-after-settings-dropdown {\n &.dx-dropdownbutton-popup-wrapper\n .dx-popup-content {\n padding: 0;\n\n .dx-scrollable-container {\n height: auto;\n }\n\n .dx-list:not(.dx-list-select-decorator-enabled) {\n min-height: unset;\n padding-block: ", "px;\n padding-inline: ", "px;\n\n .dx-list-item {\n &.dx-state-hover {\n background-color: transparent;\n color: ", ";\n\n .dx-list-item-content {\n color: ", ";\n }\n }\n &.dx-state-focused {\n background-color: transparent;\n color: ", ";\n\n .dx-list-item-content {\n color: ", ";\n }\n }\n }\n\n .dx-list-item-content {\n padding-block: ", "px;\n padding-inline: ", "px;\n\n display: flex;\n justify-content: flex-start;\n align-items: center;\n gap: ", "px;\n\n font-size: ", "px;\n line-height: 1;\n color: ", ";\n\n .dx-list-item-icon-container {\n width: ", "px;\n height: ", "px;\n\n .dx-list-item-icon {\n font-size: ", "px;\n line-height: 1;\n width: ", "px;\n height: ", "px;\n display: inline-flex;\n justify-content: center;\n align-items: center;\n }\n }\n\n &::before {\n display: none;\n }\n }\n }\n }\n &.dx-popup-wrapper > .dx-overlay-content {\n background-color: ", ";\n box-shadow: 0px 2px 4px 0px rgba(0, 0, 0, 0.06),\n 0px 2px 6px -1px rgba(0, 0, 0, 0.04),\n 0px 6px 8px 0px rgba(0, 0, 0, 0.04);\n border: none;\n border-radius: ", "px;\n top: ", "px;\n }\n }\n }\n }\n\n .dx-searchbox {\n &.dx-texteditor {\n &.dx-editor-outlined {\n margin: 0;\n border-radius: ", "px;\n border-color: ", ";\n }\n }\n .dx-icon-search {\n color: ", ";\n font-size: ", "px;\n line-height: 1;\n position: absolute;\n top: 50%;\n left: 0;\n margin: unset;\n transform: translateY(-50%);\n width: ", "px;\n height: ", "px;\n background-position: unset;\n background-size: unset;\n padding: 0;\n display: flex;\n justify-content: center;\n align-items: center;\n\n &::before {\n color: ", ";\n }\n }\n\n .dx-texteditor-input {\n min-height: ", "px;\n padding-top: ", "px;\n padding-right: ", "px;\n padding-bottom: ", "px;\n padding-left: ", "px;\n font-size: ", "px;\n line-height: ", "px;\n color: ", ";\n }\n\n .dx-placeholder {\n &::before {\n padding-top: ", "px;\n padding-right: ", "px;\n padding-bottom: ", "px;\n padding-left: ", "px;\n font-size: ", "px;\n line-height: ", "px;\n color: ", ";\n }\n }\n\n &.dx-show-clear-button {\n .dx-clear-button-area {\n width: ", "px;\n min-width: ", "px;\n\n .dx-icon-clear {\n color: ", ";\n margin-top: 0;\n transform: translateY(-50%);\n padding: ", "px;\n width: ", "px;\n height: ", "px;\n background-position: ", "px\n ", "px;\n background-size: ", "px\n ", "px;\n font-size: ", "px;\n line-height: 1;\n }\n }\n }\n }\n\n .dx-button {\n border-radius: ", "px;\n border-color: ", ";\n\n .dx-icon {\n font-size: ", "px;\n line-height: 1;\n width: ", "px;\n height: ", "px;\n color: ", ";\n\n &.dx-svg-icon {\n font-size: unset;\n line-height: 1;\n width: ", "px;\n height: ", "px;\n color: unset;\n }\n }\n\n .dx-button-content {\n padding: ", "px;\n }\n\n &.dx-state-hover,\n &.dx-state-focused {\n background-color: ", ";\n border-color: ", ";\n\n .dx-icon {\n color: ", ";\n\n &.dx-svg-icon svg.ods-toolbar-after-settings-icon {\n & > path {\n fill: ", ";\n }\n\n & > circle {\n stroke: ", ";\n }\n }\n }\n }\n\n &.dx-state-active {\n background-color: ", ";\n border-color: ", ";\n\n .dx-icon {\n color: ", ";\n\n &.dx-svg-icon svg.ods-toolbar-after-settings-icon {\n & > path {\n fill: ", ";\n }\n\n & > circle {\n stroke: ", ";\n }\n }\n }\n }\n }\n\n .dx-texteditor.dx-state-active.dx-editor-filled,\n .dx-texteditor.dx-state-active.dx-editor-outlined,\n .dx-texteditor.dx-state-active.dx-editor-underlined,\n .dx-texteditor.dx-state-focused.dx-editor-filled,\n .dx-texteditor.dx-state-focused.dx-editor-outlined,\n .dx-texteditor.dx-state-focused.dx-editor-underlined {\n border-color: ", ";\n }\n }\n }\n }\n }\n\n & .dx-datagrid-headers {\n border-bottom: none;\n ", ";\n font-weight: 600;\n\n &.dx-datagrid-nowrap {\n }\n\n .dx-datagrid-content {\n margin-bottom: unset;\n\n &.dx-datagrid-scrollable-simulated:not(\n .dx-empty\n ).dx-datagrid-content-fixed {\n .dx-datagrid-table {\n &.dx-pointer-events-none {\n .dx-row {\n &.dx-header-row {\n & > td {\n border-bottom-width: 0.5px;\n border-bottom-color: transparent;\n border-left-color: ", ";\n border-right-color: ", ";\n border-left-width: 0.5px;\n border-right-width: 0.5px;\n background-color: ", ";\n\n &.dx-command-select {\n background-color: ", ";\n border-bottom-color: ", ";\n }\n &.dx-command-edit {\n background-color: ", ";\n border-bottom-color: ", ";\n }\n\n .dx-datagrid-text-content {\n white-space: nowrap;\n }\n }\n }\n }\n }\n }\n }\n\n &.dx-datagrid-scrollable-simulated:not(.dx-empty) {\n .dx-datagrid-table {\n .dx-row {\n &.dx-header-row {\n & > td {\n border-bottom-width: 0.5px;\n border-bottom-color: ", ";\n border-left-color: ", ";\n border-right-color: ", ";\n\n &:not(.dx-command-select):not(.dx-command-edit) {\n background-color: ", ";\n }\n\n &.dx-command-select {\n border-bottom-color: transparent;\n }\n\n &.dx-command-edit {\n border-bottom-color: transparent;\n }\n\n .dx-datagrid-text-content {\n white-space: nowrap;\n }\n }\n }\n }\n }\n }\n }\n\n & .dx-datagrid-table {\n & .dx-row {\n &.dx-datagrid-filter-row {\n .dx-editor-cell {\n .dx-editor-with-menu {\n padding: 0 1px;\n }\n }\n\n & > td {\n border-bottom: none;\n border-left-color: transparent;\n border-right-color: transparent;\n padding: 0;\n background-color: ", ";\n\n .dx-editor-with-menu\n .dx-filter-menu\n .dx-menu-item-content\n .dx-icon.dx-icon-filter-operation-default,\n .dx-filter-menu\n .dx-menu-item-content\n .dx-icon.dx-icon-filter-operation-default {\n margin-top: 1px;\n }\n\n .dx-menu-item-content {\n .dx-icon {\n width: ", "px;\n height: ", "px;\n font-size: ", "px;\n line-height: ", "px;\n color: ", ";\n margin: 0 2px;\n }\n\n .dx-menu-item-popout-container {\n width: ", "px;\n }\n }\n }\n }\n }\n }\n\n & + .dx-datagrid-rowsview {\n border-top: 0.5px solid ", ";\n }\n\n .dx-texteditor-input {\n min-height: ", "px;\n padding-top: 0;\n padding-bottom: 0;\n }\n\n .dx-datagrid-focus-overlay {\n border-color: transparent;\n }\n }\n\n & .dx-datagrid-rowsview:not(.dx-empty) {\n &.dx-datagrid-after-headers {\n border-top: 0.5px solid ", ";\n }\n\n .dx-scrollable-wrapper {\n .dx-scrollable-container {\n .dx-scrollable-content {\n .dx-datagrid-content {\n .dx-datagrid-table {\n .dx-row {\n &.dx-row-lines,\n &.dx-freespace-row {\n & > td {\n border-bottom-color: ", ";\n border-left-color: ", ";\n border-right-color: ", ";\n\n & > .ant-tag {\n font-size: ", "px;\n line-height: ", "px;\n padding-inline: ", "px;\n margin: 0;\n }\n }\n }\n }\n }\n }\n }\n }\n }\n\n .dx-datagrid-content {\n &.dx-datagrid-content-fixed {\n .dx-datagrid-table {\n &.dx-pointer-events-none {\n .dx-row {\n &.dx-row-lines,\n &.dx-freespace-row {\n & > td {\n border-bottom-color: transparent;\n border-left-color: ", ";\n border-right-color: ", ";\n border-left-width: 0.5px;\n border-right-width: 0.5px;\n background-color: ", ";\n\n &.dx-command-edit {\n padding: 0;\n }\n }\n }\n }\n }\n }\n }\n }\n }\n\n & .dx-datagrid-rowsview.dx-empty {\n &.dx-datagrid-after-headers {\n border-top: 0.5px solid ", ";\n }\n\n .dx-scrollable-wrapper {\n .dx-scrollable-container {\n .dx-scrollable-content {\n .dx-datagrid-content {\n .dx-datagrid-table {\n .dx-row {\n &.dx-row-lines,\n &.dx-freespace-row {\n & > td {\n border-bottom-color: transparent;\n border-left-color: transparent;\n border-right-color: transparent;\n }\n }\n }\n }\n }\n }\n }\n }\n\n .dx-datagrid-content {\n &.dx-datagrid-content-fixed {\n .dx-datagrid-table {\n &.dx-pointer-events-none {\n .dx-row {\n &.dx-row-lines,\n &.dx-freespace-row {\n & > td {\n border-bottom-color: transparent;\n border-left-color: transparent;\n border-right-color: transparent;\n\n &.dx-command-edit {\n padding: 0;\n }\n }\n }\n }\n }\n }\n }\n }\n }\n\n & .dx-datagrid-filter-panel {\n padding-left: ", "px;\n padding-top: ", "px;\n padding-bottom: ", "px;\n padding-right: ", "px;\n\n border-top-color: ", ";\n\n .dx-datagrid-filter-panel-left {\n display: flex;\n justify-content: flex-start;\n align-items: center;\n gap: ", "px;\n min-height: ", "px;\n\n .dx-datagrid-filter-panel-checkbox {\n padding-right: 0;\n }\n }\n .dx-datagrid-filter-panel-clear-filter,\n .dx-datagrid-filter-panel-text,\n .dx-icon-filter {\n display: inline-flex;\n align-items: center;\n color: ", ";\n font-size: ", "px;\n line-height: ", "px;\n margin: 0;\n }\n }\n\n & .dx-row > td {\n padding: 0 ", "px;\n height: ", "px;\n vertical-align: middle;\n }\n\n .dx-column-lines {\n & > td {\n border-bottom-color: ", ";\n border-left-color: ", ";\n border-right-color: ", ";\n }\n }\n\n .dx-header-filter {\n font-size: ", "px;\n }\n\n .dx-datagrid-total-footer {\n border-top: 0.5px solid ", ";\n\n & > .dx-datagrid-content {\n padding-top: 0;\n padding-bottom: 0;\n\n &.dx-datagrid-content-fixed {\n .dx-datagrid-table {\n &.dx-pointer-events-none {\n .dx-row {\n &.dx-footer-row {\n & > td {\n border-left-color: ", ";\n border-right-color: ", ";\n border-left-width: 0.5px;\n border-right-width: 0.5px;\n background-color: ", ";\n }\n }\n }\n }\n }\n }\n\n .dx-datagrid-table {\n .dx-row {\n & > td {\n border-left: 1px solid ", ";\n border-right: 1px solid ", ";\n background-color: ", ";\n\n .dx-datagrid-summary-item {\n font-weight: 400;\n color: ", ";\n }\n }\n }\n }\n }\n }\n\n .dx-overlay-wrapper {\n &.dx-loadpanel-wrapper {\n .dx-loadindicator-wrapper {\n .dx-loadindicator-icon {\n .dx-loadindicator-segment {\n background-color: ", ";\n }\n }\n }\n .dx-overlay-content {\n &.dx-loadpanel-content {\n .dx-loadpanel-content-wrapper {\n display: inline-flex;\n justify-content: center;\n align-items: center;\n position: relative;\n gap: ", "px;\n }\n\n .dx-loadpanel-message {\n color: ", ";\n font-size: ", "px;\n }\n }\n }\n }\n }\n }\n\n & .dx-datagrid-rowsview {\n .dx-selection {\n &.dx-row {\n &:not(.dx-row-focused) {\n & > td,\n & > tr > td {\n ", ";\n }\n\n &:hover {\n & > td,\n & > tr > td {\n ", ";\n }\n }\n }\n }\n }\n\n & > div:not(.dx-scrollable-wrapper) {\n &.dx-datagrid-content.dx-datagrid-content-fixed {\n .dx-datagrid-table {\n .dx-row.dx-virtual-row.dx-column-lines {\n & > td {\n border-bottom-color: transparent;\n border-left-color: ", ";\n border-right-color: ", ";\n border-left-width: 0.5px;\n border-right-width: 0.5px;\n }\n }\n }\n }\n }\n\n &.dx-empty {\n .dx-datagrid-content {\n .dx-datagrid-table {\n .dx-row {\n & > td {\n border-bottom-color: transparent;\n border-left-color: transparent;\n border-right-color: transparent;\n }\n }\n }\n }\n }\n }\n\n & .dx-datagrid-table {\n .dx-datagrid-content &,\n & {\n .dx-row {\n .dx-command-select {\n ", ";\n }\n }\n }\n }\n\n & .grid-cell-disable-text-selection {\n user-select: none;\n }\n\n .dx-checkbox {\n &.dx-datagrid-checkbox-size {\n padding-bottom: 0;\n }\n\n .dx-checkbox-container {\n .dx-checkbox-icon {\n border-color: ", ";\n width: ", "px;\n height: ", "px;\n border-radius: ", "px;\n }\n }\n\n &.dx-state-focused,\n &.dx-state-hover {\n .dx-checkbox-container {\n .dx-checkbox-icon {\n border-color: ", ";\n }\n }\n }\n\n &.dx-checkbox-checked {\n .dx-checkbox-container {\n .dx-checkbox-icon {\n background-color: ", ";\n border-color: ", ";\n display: inline-flex;\n justify-content: center;\n align-items: center;\n\n &::before {\n color: ", ";\n display: inline-flex;\n width: ", "px;\n font-size: ", "px;\n height: ", "px;\n line-height: ", "px;\n position: relative;\n top: unset;\n left: unset;\n margin: 0;\n }\n }\n }\n }\n }\n }\n "])), dxWidgetFontSize, dxColumnColors, borderColor, dxToolbar.dxToolbarPaddingVertical, dxToolbar.dxToolbarPaddingHorizontal, dxToolbar.dxToolbarPaddingVertical - 1, dxToolbar.dxToolbarTtemsContainerGap, dxToolbar.dxToolbarTtemsContainerBeforeAfterGap, dxToolbar.dxToolbarTitleFontSize, columnTextColor, colorFillTertiary, dxButton.dxButtonBorderRadius, dxToolbar.dxToolbarPaddingVertical, dxToolbar.dxToolbarPaddingVertical, dxButton.dxButtonBorderRadius, dxButton.dxButtonFontSize, dxButton.dxButtonPaddingInline, dxButton.dxButtonPaddingBlock, dxButton.dxButtonLineHeight, whiteColor, boxShadowColor, whiteColor, primaryColor, primaryColor, whiteColor, primaryColorHover, primaryColorHover, whiteColor, primaryColorActive, primaryColorActive, whiteColor, colorErrorText, colorErrorText, whiteColor, colorErrorTextHover, colorErrorTextHover, whiteColor, colorErrorTextActive, colorErrorTextActive, whiteColor, colorSuccessText, colorSuccessText, whiteColor, colorSuccessTextHover, colorSuccessTextHover, whiteColor, colorSuccessTextActive, colorSuccessTextActive, columnTextColor, toolbarBorderColor, whiteColor, primaryColorHover, primaryColorHover, whiteColor, primaryColorActive, primaryColorActive, whiteColor, primaryColor, primaryColorBg, primaryColorHover, primaryColorBorder, primaryColorActive, colorErrorText, colorErrorBg, colorErrorTextHover, colorErrorBgActive, colorErrorTextActive, colorSuccessText, colorSuccessBg, colorSuccessTextHover, colorSuccessBorder, colorSuccessTextActive, columnTextColor, colorFillTertiary, checkboxBorderColor, boxShadowColor, primaryColor, primaryColorHover, primaryColorActive, colorErrorText, colorErrorTextHover, colorErrorTextActive, colorSuccessText, colorSuccessTextHover, colorSuccessTextActive, columnTextColor, whiteColor, solidColorBgHover, solidColorBgActive, dxToolbarSettings.dxPopupOverlayPopupPaddingVertical, dxToolbarSettings.dxPopupOverlayPopupPaddingHorizontal, primaryColor, primaryColor, primaryColorActive, primaryColor, dxToolbarSettings.dxPopupOverlayPopupItemPaddingVertical, dxToolbarSettings.dxPopupOverlayPopupItemPaddingHorizontal, dxToolbarSettings.dxPopupOverlayPopupItemGap, dxWidgetFontSize, columnTextColor, dxIconFontSize, dxIconFontSize, dxIconFontSize, dxIconFontSize, dxIconFontSize, whiteColor, dxToolbarSettings.dxPopupOverlayBorderRadius, dxToolbarSettings.dxPopupOverlayMarginTop * 2, dxToolbar.dxToolbarItemBorderRadius, toolbarBorderColor, iconColor, dxIconFontSize, dxSearchBoxSizes.dxSearchBoxIconWidth, dxSearchBoxSizes.dxSearchBoxIconHeight, iconColor, dxSearchBoxSizes.dxSearchBoxInputMinHeight, dxSearchBoxSizes.dxSearchBoxInputPaddingTop, dxSearchBoxSizes.dxSearchBoxInputPaddingRight, dxSearchBoxSizes.dxSearchBoxInputPaddingBottom, dxSearchBoxSizes.dxSearchBoxInputPaddingLeft, dxSearchBoxSizes.dxSearchBoxInputFontSize, dxSearchBoxSizes.dxSearchBoxInputLineHeight, columnTextColor, dxSearchBoxSizes.dxSearchBoxInputPaddingTop, dxSearchBoxSizes.dxSearchBoxInputPaddingRight, dxSearchBoxSizes.dxSearchBoxInputPaddingBottom, dxSearchBoxSizes.dxSearchBoxInputPaddingLeft, dxSearchBoxSizes.dxSearchBoxInputFontSize, dxSearchBoxSizes.dxSearchBoxInputLineHeight + 1, textDescriptionColor, dxSearchBoxSizes.dxSearchBoxClearButtonWidth, dxSearchBoxSizes.dxSearchBoxClearButtonWidth, iconColor, dxSearchBoxSizes.dxSearchBoxClearButtonPadding, dxSearchBoxSizes.dxSearchBoxClearButtonWidth, dxSearchBoxSizes.dxSearchBoxClearButtonHeight, dxSearchBoxSizes.dxSearchBoxClearButtonBackgroundPosition, dxSearchBoxSizes.dxSearchBoxClearButtonBackgroundPosition, dxSearchBoxSizes.dxSearchBoxClearButtonBackgroundSize, dxSearchBoxSizes.dxSearchBoxClearButtonBackgroundSize, dxSearchBoxSizes.dxSearchBoxClearButtonFontSize, dxToolbar.dxToolbarItemBorderRadius, toolbarBorderColor, dxIconFontSize, dxIconFontSize, dxIconFontSize, iconColor, dxToolbarSettings.dxSettingsIconSize, dxToolbarSettings.dxSettingsIconSize, dxToolbar.dxToolbarButtonsPadding, whiteColor, primaryColor, primaryColor, primaryColor, primaryColor, whiteColor, primaryColorActive, primaryColorActive, primaryColorActive, primaryColorActive, primaryColor, dxColumnColors, borderColor, borderColor, controlItemBgActive, headerCommandSelectBg, borderColor, controlItemBgActive, borderColor, borderColor, headerBorderColor, headerBorderColor, controlItemBgActive, whiteColor, dxFilterMenu.dxMenuItemIconSize, dxFilterMenu.dxMenuItemIconSize, dxFilterMenu.dxMenuItemIconSize, dxFilterMenu.dxMenuItemIconSize, iconColor, dxFilterMenu.dxMenuItemPopoutContainerWidth, borderColor, dxTextEditorInputMinHeight, borderColor, borderColor, borderColor, borderColor, dxColumnTagSizes.dxColumnTagFontSize, dxColumnTagSizes.dxColumnTagLineHeight, dxColumnTagSizes.dxColumnTagPaddingInline, borderColor, borderColor, whiteColor, borderColor, dxSummarySizes.dxFiltersPanelPaddingLeft, dxSummarySizes.dxFiltersPanelPaddingTop, dxSummarySizes.dxFiltersPanelPaddingBottom, props.hasSummaryButton ? dxSummarySizes.dxFiltersPanelPaddingRight : dxSummarySizes.dxFiltersPanelPaddingRightDefault, borderColor, dxSummarySizes.dxFiltersPanelLeftGap, dxSummarySizes.dxFilterPanelMinHeight, primaryColor, dxIconFilterFontSize, dxSummarySizes.dxFiltersPanelTextLineHeight, dxDataColumnsPaddingInline, dxDataColumnsHeight, borderColor, borderColor, borderColor, dxHeaderFilterFontSize, borderColor, borderColor, borderColor, headerCommandSelectBg, borderColor, borderColor, headerCommandSelectBg, columnTextColor, primaryColor, dxLoadPanelContentWrapperGap, columnTextColor, dxWidgetFontSize, dxColumnColors, dxColumnColors, borderColor, borderColor, dxCommonSelectionStyles, checkboxBorderColor, dxCheckboxSize, dxCheckboxSize, dxCheckboxBorderRadiusSize, primaryColor, primaryColor, primaryColor, whiteColor, dxCheckboxCheckIconSize, dxCheckboxCheckIconSize, dxCheckboxCheckIconSize, dxCheckboxCheckIconSize))
|
|
2917
|
+
gridWrapper: cx("ods-datagrid", css(_templateObject3$1 || (_templateObject3$1 = _taggedTemplateLiteralLoose(["\n &.ods-datagrid {\n background-color: ", ";\n box-shadow: none;\n border: 1px solid ", ";\n border-radius: ", ";\n overflow: hidden;\n height: ", ";\n }\n\n .ods-datagrid-with-summary-wrapper > & {\n &.ods-datagrid {\n border-radius: 0;\n border: none;\n height: 100%;\n }\n }\n "])), whiteColor, borderColor, odsDataGridBorderRadius, odsDataGridHeight)),
|
|
2918
|
+
grid: cx("ods-datagrid-grid", css(_templateObject4 || (_templateObject4 = _taggedTemplateLiteralLoose(["\n &.ods-datagrid-grid {\n height: 100%;\n\n &.dx-widget {\n font-family: \"Manrope\", sans-serif;\n font-size: ", "px;\n }\n\n & .dx-datagrid {\n ", ";\n line-height: 1;\n\n .dx-datagrid-content-fixed {\n .dx-datagrid-table {\n .dx-col-fixed {\n background-color: transparent;\n }\n }\n }\n\n & .dx-datagrid-header-panel {\n border-bottom: 0.5px solid ", ";\n background-color: transparent;\n padding: ", "px ", "px ", "px;\n\n .dx-toolbar {\n background-color: transparent;\n margin-bottom: 0;\n\n .dx-toolbar-items-container {\n display: flex;\n justify-content: space-between;\n gap: ", "px;\n height: unset;\n\n .dx-toolbar-before,\n .dx-toolbar-after {\n display: flex;\n align-items: center;\n gap: ", "px;\n margin: 0;\n padding: 0;\n position: relative;\n left: unset;\n right: unset;\n top: unset;\n bottom: unset;\n flex: 0 1 auto;\n max-width: 100%;\n overflow: hidden;\n white-space: nowrap;\n }\n\n .dx-toolbar-before {\n .dx-item.dx-toolbar-item {\n display: flex;\n justify-content: flex-end;\n align-items: center;\n margin: 0;\n padding: 0;\n\n &.ods-toolbar-title {\n font-size: ", "px;\n line-height: 1;\n color: ", ";\n font-weight: 600;\n max-width: unset !important;\n\n & > div {\n margin: 0;\n padding: 0;\n }\n }\n\n &.ods-toolbar-left-item-menu {\n &.dx-toolbar-item {\n .ods-toolbar-left-menu {\n &.dx-menu {\n &.dx-menu-base .dx-menu-item {\n &.dx-state-hover,\n &:hover {\n background-color: ", ";\n border-radius: ", "px;\n }\n }\n &.dx-menu-base .dx-menu-item .dx-menu-item-content {\n padding-block: ", "px;\n padding-inline: ", "px;\n border: none;\n\n .dx-menu-item-popout-container {\n display: none;\n }\n }\n .dx-menu-item-has-icon.dx-menu-item-has-submenu .dx-icon {\n padding: 0;\n margin: 0;\n width: auto;\n height: auto;\n font-size: unset;\n line-height: unset;\n }\n\n .dx-context-menu-container-border {\n display: none;\n }\n }\n }\n }\n }\n\n &.ods-toolbar-left-item {\n height: 100%;\n .ods-toolbar-left-menu-dropdown {\n display: inline-flex;\n vertical-align: unset;\n }\n }\n }\n\n .dx-button {\n border-radius: ", "px;\n\n .dx-button-content {\n font-size: ", "px;\n padding-inline: ", "px;\n padding-block: ", "px;\n\n .dx-button-text {\n line-height: ", "px;\n }\n }\n\n &.dx-button-mode-outlined {\n background-color: ", ";\n box-shadow: 0px 2px 0px 0px ", ";\n\n &.dx-button-default {\n background-color: ", ";\n border-color: ", ";\n color: ", ";\n\n &.dx-state-hover,\n &:hover {\n background-color: ", ";\n border-color: ", ";\n color: ", ";\n }\n\n &.dx-state-focused,\n &:focus,\n &:active {\n background-color: ", ";\n border-color: ", ";\n color: ", ";\n }\n }\n\n &.dx-button-danger {\n background-color: ", ";\n border-color: ", ";\n color: ", ";\n\n &.dx-state-hover,\n &:hover {\n background-color: ", ";\n border-color: ", ";\n color: ", ";\n }\n\n &.dx-state-focused,\n &:focus,\n &:active {\n background-color: ", ";\n border-color: ", ";\n color: ", ";\n }\n }\n\n &.dx-button-success {\n background-color: ", ";\n border-color: ", ";\n color: ", ";\n\n &.dx-state-hover,\n &:hover {\n background-color: ", ";\n border-color: ", ";\n color: ", ";\n }\n\n &.dx-state-focused,\n &:focus,\n &:active {\n background-color: ", ";\n border-color: ", ";\n color: ", ";\n }\n }\n\n &.dx-button-normal {\n color: ", ";\n border-color: ", ";\n background-color: ", ";\n\n &.dx-state-hover,\n &:hover {\n color: ", ";\n border-color: ", ";\n background-color: ", ";\n }\n\n &.dx-state-focused,\n &:focus,\n &:active {\n color: ", ";\n border-color: ", ";\n background-color: ", ";\n }\n }\n }\n\n &.dx-button-mode-text {\n background-color: transparent;\n\n &.dx-button-default {\n background-color: transparent;\n color: ", ";\n\n &.dx-state-hover,\n &:hover {\n background-color: ", ";\n color: ", ";\n }\n\n &.dx-state-focused,\n &:focus,\n &:active {\n background-color: ", ";\n color: ", ";\n }\n }\n\n &.dx-button-danger {\n background-color: transparent;\n color: ", ";\n\n &.dx-state-hover,\n &:hover {\n background-color: ", ";\n color: ", ";\n }\n\n &.dx-state-focused,\n &:focus,\n &:active {\n background-color: ", ";\n color: ", ";\n }\n }\n\n &.dx-button-success {\n background-color: transparent;\n color: ", ";\n\n &.dx-state-hover,\n &:hover {\n background-color: ", ";\n color: ", ";\n }\n\n &.dx-state-focused,\n &:focus,\n &:active {\n background-color: ", ";\n color: ", ";\n }\n }\n\n &.dx-button-normal {\n background-color: transparent;\n color: ", ";\n\n &.dx-state-hover,\n &:hover {\n background-color: ", ";\n }\n\n &.dx-state-focused,\n &:focus,\n &:active {\n background-color: ", ";\n }\n }\n }\n\n &.dx-button-mode-contained {\n box-shadow: 0px 2px 0px 0px ", ";\n\n &.dx-button-default {\n background-color: ", ";\n\n &.dx-state-hover,\n &:hover {\n background-color: ", ";\n }\n\n &.dx-state-focused,\n &:focus,\n &:active {\n background-color: ", ";\n }\n }\n\n &.dx-button-danger {\n background-color: ", ";\n\n &.dx-state-hover,\n &:hover {\n background-color: ", ";\n }\n\n &.dx-state-focused,\n &:focus,\n &:active {\n background-color: ", ";\n }\n }\n\n &.dx-button-success {\n background-color: ", ";\n\n &.dx-state-hover,\n &:hover {\n background-color: ", ";\n }\n\n &.dx-state-focused,\n &:focus,\n &:active {\n background-color: ", ";\n }\n }\n\n &.dx-button-normal {\n background-color: ", ";\n color: ", ";\n\n &.dx-state-hover,\n &:hover {\n background-color: ", ";\n }\n\n &.dx-state-focused,\n &:focus,\n &:active {\n background-color: ", ";\n }\n }\n }\n }\n }\n\n .dx-toolbar-after {\n flex: 0 0 auto;\n overflow: unset;\n\n .dx-item.dx-toolbar-item {\n display: flex;\n justify-content: flex-end;\n align-items: center;\n margin: 0;\n padding: 0;\n\n &.ods-toolbar-after-settings-button {\n .ods-toolbar-after-settings-dropdown {\n &.dx-dropdownbutton-popup-wrapper .dx-popup-content {\n padding: 0;\n\n .dx-scrollable-container {\n height: auto;\n }\n\n .dx-list:not(.dx-list-select-decorator-enabled) {\n min-height: unset;\n padding-block: ", "px;\n padding-inline: ", "px;\n\n .dx-list-item {\n &.dx-state-hover {\n background-color: transparent;\n color: ", ";\n\n .dx-list-item-content {\n color: ", ";\n }\n }\n &.dx-state-focused {\n background-color: transparent;\n color: ", ";\n\n .dx-list-item-content {\n color: ", ";\n }\n }\n }\n\n .dx-list-item-content {\n padding-block: ", "px;\n padding-inline: ", "px;\n\n display: flex;\n justify-content: flex-start;\n align-items: center;\n gap: ", "px;\n\n font-size: ", "px;\n line-height: 1;\n color: ", ";\n\n .dx-list-item-icon-container {\n width: ", "px;\n height: ", "px;\n\n .dx-list-item-icon {\n font-size: ", "px;\n line-height: 1;\n width: ", "px;\n height: ", "px;\n display: inline-flex;\n justify-content: center;\n align-items: center;\n }\n }\n\n &::before {\n display: none;\n }\n }\n }\n }\n &.dx-popup-wrapper > .dx-overlay-content {\n background-color: ", ";\n box-shadow:\n 0px 2px 4px 0px rgba(0, 0, 0, 0.06),\n 0px 2px 6px -1px rgba(0, 0, 0, 0.04),\n 0px 6px 8px 0px rgba(0, 0, 0, 0.04);\n border: none;\n border-radius: ", "px;\n top: ", "px;\n }\n }\n }\n }\n\n .dx-searchbox {\n &.dx-texteditor {\n &.dx-editor-outlined {\n margin: 0;\n border-radius: ", "px;\n border-color: ", ";\n }\n }\n .dx-icon-search {\n color: ", ";\n font-size: ", "px;\n line-height: 1;\n position: absolute;\n top: 50%;\n left: 0;\n margin: unset;\n transform: translateY(-50%);\n width: ", "px;\n height: ", "px;\n background-position: unset;\n background-size: unset;\n padding: 0;\n display: flex;\n justify-content: center;\n align-items: center;\n\n &::before {\n color: ", ";\n }\n }\n\n .dx-texteditor-input {\n min-height: ", "px;\n padding-top: ", "px;\n padding-right: ", "px;\n padding-bottom: ", "px;\n padding-left: ", "px;\n font-size: ", "px;\n line-height: ", "px;\n color: ", ";\n }\n\n .dx-placeholder {\n &::before {\n padding-top: ", "px;\n padding-right: ", "px;\n padding-bottom: ", "px;\n padding-left: ", "px;\n font-size: ", "px;\n line-height: ", "px;\n color: ", ";\n }\n }\n\n &.dx-show-clear-button {\n .dx-clear-button-area {\n width: ", "px;\n min-width: ", "px;\n\n .dx-icon-clear {\n color: ", ";\n margin-top: 0;\n transform: translateY(-50%);\n padding: ", "px;\n width: ", "px;\n height: ", "px;\n background-position: ", "px\n ", "px;\n background-size: ", "px\n ", "px;\n font-size: ", "px;\n line-height: 1;\n }\n }\n }\n }\n\n .dx-button {\n border-radius: ", "px;\n border-color: ", ";\n\n .dx-icon {\n font-size: ", "px;\n line-height: 1;\n width: ", "px;\n height: ", "px;\n color: ", ";\n\n &.dx-svg-icon {\n font-size: unset;\n line-height: 1;\n width: ", "px;\n height: ", "px;\n color: unset;\n }\n }\n\n .dx-button-content {\n padding: ", "px;\n }\n\n &.dx-state-hover,\n &.dx-state-focused {\n background-color: ", ";\n border-color: ", ";\n\n .dx-icon {\n color: ", ";\n\n &.dx-svg-icon svg.ods-toolbar-after-settings-icon {\n & > path {\n fill: ", ";\n }\n\n & > circle {\n stroke: ", ";\n }\n }\n }\n }\n\n &.dx-state-active {\n background-color: ", ";\n border-color: ", ";\n\n .dx-icon {\n color: ", ";\n\n &.dx-svg-icon svg.ods-toolbar-after-settings-icon {\n & > path {\n fill: ", ";\n }\n\n & > circle {\n stroke: ", ";\n }\n }\n }\n }\n }\n\n .dx-texteditor.dx-state-active.dx-editor-filled,\n .dx-texteditor.dx-state-active.dx-editor-outlined,\n .dx-texteditor.dx-state-active.dx-editor-underlined,\n .dx-texteditor.dx-state-focused.dx-editor-filled,\n .dx-texteditor.dx-state-focused.dx-editor-outlined,\n .dx-texteditor.dx-state-focused.dx-editor-underlined {\n border-color: ", ";\n }\n }\n }\n }\n }\n\n & .dx-datagrid-headers {\n border-bottom: none;\n ", ";\n font-weight: 600;\n\n &.dx-datagrid-nowrap {\n }\n\n .dx-datagrid-content {\n margin-bottom: unset;\n\n &.dx-datagrid-scrollable-simulated:not(.dx-empty).dx-datagrid-content-fixed {\n .dx-datagrid-table {\n &.dx-pointer-events-none {\n .dx-row {\n &.dx-header-row {\n & > td {\n border-bottom-width: 0.5px;\n border-bottom-color: transparent;\n border-left-color: ", ";\n border-right-color: ", ";\n border-left-width: 0.5px;\n border-right-width: 0.5px;\n background-color: ", ";\n\n &.dx-command-select {\n background-color: ", ";\n border-bottom-color: ", ";\n }\n &.dx-command-edit {\n background-color: ", ";\n border-bottom-color: ", ";\n }\n\n .dx-datagrid-text-content {\n white-space: nowrap;\n }\n }\n }\n }\n }\n }\n }\n\n &.dx-datagrid-scrollable-simulated:not(.dx-empty) {\n .dx-datagrid-table {\n .dx-row {\n &.dx-header-row {\n & > td {\n border-bottom-width: 0.5px;\n border-bottom-color: ", ";\n border-left-color: ", ";\n border-right-color: ", ";\n\n &:not(.dx-command-select):not(.dx-command-edit) {\n background-color: ", ";\n }\n\n &.dx-command-select {\n border-bottom-color: transparent;\n }\n\n &.dx-command-edit {\n border-bottom-color: transparent;\n }\n\n .dx-datagrid-text-content {\n white-space: nowrap;\n }\n }\n }\n }\n }\n }\n }\n\n & .dx-datagrid-table {\n & .dx-row {\n &.dx-datagrid-filter-row {\n .dx-editor-cell {\n .dx-editor-with-menu {\n padding: 0 1px;\n }\n }\n\n & > td {\n border-bottom: none;\n border-left-color: transparent;\n border-right-color: transparent;\n padding: 0;\n background-color: ", ";\n\n .dx-editor-with-menu .dx-filter-menu .dx-menu-item-content .dx-icon.dx-icon-filter-operation-default,\n .dx-filter-menu .dx-menu-item-content .dx-icon.dx-icon-filter-operation-default {\n margin-top: 1px;\n }\n\n .dx-menu-item-content {\n .dx-icon {\n width: ", "px;\n height: ", "px;\n font-size: ", "px;\n line-height: ", "px;\n color: ", ";\n margin: 0 2px;\n }\n\n .dx-menu-item-popout-container {\n width: ", "px;\n }\n }\n }\n }\n }\n }\n\n & + .dx-datagrid-rowsview {\n border-top: 0.5px solid ", ";\n }\n\n .dx-texteditor-input {\n min-height: ", "px;\n padding-top: 0;\n padding-bottom: 0;\n }\n\n .dx-datagrid-focus-overlay {\n border-color: transparent;\n }\n }\n\n & .dx-datagrid-rowsview:not(.dx-empty) {\n &.dx-datagrid-after-headers {\n border-top: 0.5px solid ", ";\n }\n\n .dx-scrollable-wrapper {\n .dx-scrollable-container {\n .dx-scrollable-content {\n .dx-datagrid-content {\n .dx-datagrid-table {\n .dx-row {\n &.dx-row-lines,\n &.dx-freespace-row {\n & > td {\n border-bottom-color: ", ";\n border-left-color: ", ";\n border-right-color: ", ";\n\n & > .ant-tag {\n font-size: ", "px;\n line-height: ", "px;\n padding-inline: ", "px;\n margin: 0;\n }\n }\n }\n }\n }\n }\n }\n }\n }\n\n .dx-datagrid-content {\n &.dx-datagrid-content-fixed {\n .dx-datagrid-table {\n &.dx-pointer-events-none {\n .dx-row {\n &.dx-row-lines,\n &.dx-freespace-row {\n & > td {\n border-bottom-color: transparent;\n border-left-color: ", ";\n border-right-color: ", ";\n border-left-width: 0.5px;\n border-right-width: 0.5px;\n background-color: ", ";\n\n &.dx-command-edit {\n padding: 0;\n }\n }\n }\n }\n }\n }\n }\n }\n }\n\n & .dx-datagrid-rowsview.dx-empty {\n &.dx-datagrid-after-headers {\n border-top: 0.5px solid ", ";\n }\n\n .dx-scrollable-wrapper {\n .dx-scrollable-container {\n .dx-scrollable-content {\n .dx-datagrid-content {\n .dx-datagrid-table {\n .dx-row {\n &.dx-row-lines,\n &.dx-freespace-row {\n & > td {\n border-bottom-color: transparent;\n border-left-color: transparent;\n border-right-color: transparent;\n }\n }\n }\n }\n }\n }\n }\n }\n\n .dx-datagrid-content {\n &.dx-datagrid-content-fixed {\n .dx-datagrid-table {\n &.dx-pointer-events-none {\n .dx-row {\n &.dx-row-lines,\n &.dx-freespace-row {\n & > td {\n border-bottom-color: transparent;\n border-left-color: transparent;\n border-right-color: transparent;\n\n &.dx-command-edit {\n padding: 0;\n }\n }\n }\n }\n }\n }\n }\n }\n }\n\n & .dx-datagrid-filter-panel {\n padding-left: ", "px;\n padding-top: ", "px;\n padding-bottom: ", "px;\n padding-right: ", "px;\n\n border-top-color: ", ";\n\n .dx-datagrid-filter-panel-left {\n display: flex;\n justify-content: flex-start;\n align-items: center;\n gap: ", "px;\n min-height: ", "px;\n\n .dx-datagrid-filter-panel-checkbox {\n padding-right: 0;\n }\n }\n .dx-datagrid-filter-panel-clear-filter,\n .dx-datagrid-filter-panel-text,\n .dx-icon-filter {\n display: inline-flex;\n align-items: center;\n color: ", ";\n font-size: ", "px;\n line-height: ", "px;\n margin: 0;\n }\n }\n\n & .dx-datagrid-pager {\n border-top: 0.5px solid ", ";\n padding: ", "px ", "px;\n\n .dx-pages .dx-page-indexes {\n display: flex;\n justify-content: center;\n align-items: center;\n gap: ", "px;\n }\n\n .dx-pages .dx-page {\n display: inline-flex;\n justify-content: center;\n align-items: center;\n width: ", "px;\n height: ", "px;\n border-radius: ", "px;\n border: 0.5px solid transparent;\n font-size: ", "px;\n line-height: 1;\n font-weight: 400;\n color: ", ";\n margin: 0;\n padding: 0;\n\n &:hover {\n background-color: ", ";\n color: ", ";\n }\n\n &.dx-selection {\n background-color: transparent;\n color: ", ";\n border-color: ", ";\n font-weight: 600;\n }\n }\n\n .dx-pages .dx-separator {\n padding: 0;\n font-size: ", "px;\n color: ", ";\n line-height: 1;\n }\n\n .dx-pages .dx-navigate-button {\n width: ", "px;\n height: ", "px;\n padding: 0;\n\n &.dx-next-button,\n &.dx-prev-button {\n font-size: ", "px;\n line-height: 1;\n display: inline-flex;\n justify-content: center;\n align-items: center;\n\n &::before {\n width: ", "px;\n height: ", "px;\n line-height: 1;\n display: inline-flex;\n justify-content: center;\n align-items: center;\n position: relative;\n top: unset;\n left: unset;\n margin: 0;\n }\n }\n }\n }\n\n & .dx-row > td {\n padding: 0 ", "px;\n height: ", "px;\n vertical-align: middle;\n }\n\n .dx-column-lines {\n & > td {\n border-bottom-color: ", ";\n border-left-color: ", ";\n border-right-color: ", ";\n }\n }\n\n .dx-header-filter {\n font-size: ", "px;\n }\n\n .dx-datagrid-total-footer {\n border-top: 0.5px solid ", ";\n\n & > .dx-datagrid-content {\n padding-top: 0;\n padding-bottom: 0;\n\n &.dx-datagrid-content-fixed {\n .dx-datagrid-table {\n &.dx-pointer-events-none {\n .dx-row {\n &.dx-footer-row {\n & > td {\n border-left-color: ", ";\n border-right-color: ", ";\n border-left-width: 0.5px;\n border-right-width: 0.5px;\n background-color: ", ";\n }\n }\n }\n }\n }\n }\n\n .dx-datagrid-table {\n .dx-row {\n & > td {\n border-left: 1px solid ", ";\n border-right: 1px solid ", ";\n background-color: ", ";\n\n .dx-datagrid-summary-item {\n font-weight: 400;\n color: ", ";\n }\n }\n }\n }\n }\n }\n\n .dx-overlay-wrapper {\n &.dx-loadpanel-wrapper {\n .dx-loadindicator-wrapper {\n .dx-loadindicator-icon {\n .dx-loadindicator-segment {\n background-color: ", ";\n }\n }\n }\n .dx-overlay-content {\n &.dx-loadpanel-content {\n .dx-loadpanel-content-wrapper {\n display: inline-flex;\n justify-content: center;\n align-items: center;\n position: relative;\n gap: ", "px;\n }\n\n .dx-loadpanel-message {\n color: ", ";\n font-size: ", "px;\n }\n }\n }\n }\n }\n }\n\n & .dx-datagrid-rowsview {\n .dx-selection {\n &.dx-row {\n &:not(.dx-row-focused) {\n & > td,\n & > tr > td {\n ", ";\n }\n\n &:hover {\n & > td,\n & > tr > td {\n ", ";\n }\n }\n }\n }\n }\n\n & > div:not(.dx-scrollable-wrapper) {\n &.dx-datagrid-content.dx-datagrid-content-fixed {\n .dx-datagrid-table {\n .dx-row.dx-virtual-row.dx-column-lines {\n & > td {\n border-bottom-color: transparent;\n border-left-color: ", ";\n border-right-color: ", ";\n border-left-width: 0.5px;\n border-right-width: 0.5px;\n }\n }\n }\n }\n }\n\n &.dx-empty {\n .dx-datagrid-content {\n .dx-datagrid-table {\n .dx-row {\n & > td {\n border-bottom-color: transparent;\n border-left-color: transparent;\n border-right-color: transparent;\n }\n }\n }\n }\n }\n }\n\n & .dx-datagrid-table {\n .dx-datagrid-content &,\n & {\n .dx-row {\n .dx-command-select {\n ", ";\n }\n }\n }\n }\n\n & .grid-cell-disable-text-selection {\n user-select: none;\n }\n\n .dx-checkbox {\n &.dx-datagrid-checkbox-size {\n padding-bottom: 0;\n }\n\n .dx-checkbox-container {\n .dx-checkbox-icon {\n border-color: ", ";\n width: ", "px;\n height: ", "px;\n border-radius: ", "px;\n }\n }\n\n &.dx-state-focused,\n &.dx-state-hover {\n .dx-checkbox-container {\n .dx-checkbox-icon {\n border-color: ", ";\n }\n }\n }\n\n &.dx-checkbox-checked {\n .dx-checkbox-container {\n .dx-checkbox-icon {\n background-color: ", ";\n border-color: ", ";\n display: inline-flex;\n justify-content: center;\n align-items: center;\n\n &::before {\n color: ", ";\n display: inline-flex;\n width: ", "px;\n font-size: ", "px;\n height: ", "px;\n line-height: ", "px;\n position: relative;\n top: unset;\n left: unset;\n margin: 0;\n }\n }\n }\n }\n }\n }\n "])), dxWidgetFontSize, dxColumnColors, borderColor, dxToolbar.dxToolbarPaddingVertical, dxToolbar.dxToolbarPaddingHorizontal, dxToolbar.dxToolbarPaddingVertical - 1, dxToolbar.dxToolbarTtemsContainerGap, dxToolbar.dxToolbarTtemsContainerBeforeAfterGap, dxToolbar.dxToolbarTitleFontSize, columnTextColor, colorFillTertiary, dxButton.dxButtonBorderRadius, dxToolbar.dxToolbarPaddingVertical, dxToolbar.dxToolbarPaddingVertical, dxButton.dxButtonBorderRadius, dxButton.dxButtonFontSize, dxButton.dxButtonPaddingInline, dxButton.dxButtonPaddingBlock, dxButton.dxButtonLineHeight, whiteColor, boxShadowColor, whiteColor, primaryColor, primaryColor, whiteColor, primaryColorHover, primaryColorHover, whiteColor, primaryColorActive, primaryColorActive, whiteColor, colorErrorText, colorErrorText, whiteColor, colorErrorTextHover, colorErrorTextHover, whiteColor, colorErrorTextActive, colorErrorTextActive, whiteColor, colorSuccessText, colorSuccessText, whiteColor, colorSuccessTextHover, colorSuccessTextHover, whiteColor, colorSuccessTextActive, colorSuccessTextActive, columnTextColor, toolbarBorderColor, whiteColor, primaryColorHover, primaryColorHover, whiteColor, primaryColorActive, primaryColorActive, whiteColor, primaryColor, primaryColorBg, primaryColorHover, primaryColorBorder, primaryColorActive, colorErrorText, colorErrorBg, colorErrorTextHover, colorErrorBgActive, colorErrorTextActive, colorSuccessText, colorSuccessBg, colorSuccessTextHover, colorSuccessBorder, colorSuccessTextActive, columnTextColor, colorFillTertiary, checkboxBorderColor, boxShadowColor, primaryColor, primaryColorHover, primaryColorActive, colorErrorText, colorErrorTextHover, colorErrorTextActive, colorSuccessText, colorSuccessTextHover, colorSuccessTextActive, columnTextColor, whiteColor, solidColorBgHover, solidColorBgActive, dxToolbarSettings.dxPopupOverlayPopupPaddingVertical, dxToolbarSettings.dxPopupOverlayPopupPaddingHorizontal, primaryColor, primaryColor, primaryColorActive, primaryColor, dxToolbarSettings.dxPopupOverlayPopupItemPaddingVertical, dxToolbarSettings.dxPopupOverlayPopupItemPaddingHorizontal, dxToolbarSettings.dxPopupOverlayPopupItemGap, dxWidgetFontSize, columnTextColor, dxIconFontSize, dxIconFontSize, dxIconFontSize, dxIconFontSize, dxIconFontSize, whiteColor, dxToolbarSettings.dxPopupOverlayBorderRadius, dxToolbarSettings.dxPopupOverlayMarginTop * 2, dxToolbar.dxToolbarItemBorderRadius, toolbarBorderColor, iconColor, dxIconFontSize, dxSearchBoxSizes.dxSearchBoxIconWidth, dxSearchBoxSizes.dxSearchBoxIconHeight, iconColor, dxSearchBoxSizes.dxSearchBoxInputMinHeight, dxSearchBoxSizes.dxSearchBoxInputPaddingTop, dxSearchBoxSizes.dxSearchBoxInputPaddingRight, dxSearchBoxSizes.dxSearchBoxInputPaddingBottom, dxSearchBoxSizes.dxSearchBoxInputPaddingLeft, dxSearchBoxSizes.dxSearchBoxInputFontSize, dxSearchBoxSizes.dxSearchBoxInputLineHeight, columnTextColor, dxSearchBoxSizes.dxSearchBoxInputPaddingTop, dxSearchBoxSizes.dxSearchBoxInputPaddingRight, dxSearchBoxSizes.dxSearchBoxInputPaddingBottom, dxSearchBoxSizes.dxSearchBoxInputPaddingLeft, dxSearchBoxSizes.dxSearchBoxInputFontSize, dxSearchBoxSizes.dxSearchBoxInputLineHeight + 1, textDescriptionColor, dxSearchBoxSizes.dxSearchBoxClearButtonWidth, dxSearchBoxSizes.dxSearchBoxClearButtonWidth, iconColor, dxSearchBoxSizes.dxSearchBoxClearButtonPadding, dxSearchBoxSizes.dxSearchBoxClearButtonWidth, dxSearchBoxSizes.dxSearchBoxClearButtonHeight, dxSearchBoxSizes.dxSearchBoxClearButtonBackgroundPosition, dxSearchBoxSizes.dxSearchBoxClearButtonBackgroundPosition, dxSearchBoxSizes.dxSearchBoxClearButtonBackgroundSize, dxSearchBoxSizes.dxSearchBoxClearButtonBackgroundSize, dxSearchBoxSizes.dxSearchBoxClearButtonFontSize, dxToolbar.dxToolbarItemBorderRadius, toolbarBorderColor, dxIconFontSize, dxIconFontSize, dxIconFontSize, iconColor, dxToolbarSettings.dxSettingsIconSize, dxToolbarSettings.dxSettingsIconSize, dxToolbar.dxToolbarButtonsPadding, whiteColor, primaryColor, primaryColor, primaryColor, primaryColor, whiteColor, primaryColorActive, primaryColorActive, primaryColorActive, primaryColorActive, primaryColor, dxColumnColors, borderColor, borderColor, controlItemBgActive, headerCommandSelectBg, borderColor, controlItemBgActive, borderColor, borderColor, headerBorderColor, headerBorderColor, controlItemBgActive, whiteColor, dxFilterMenu.dxMenuItemIconSize, dxFilterMenu.dxMenuItemIconSize, dxFilterMenu.dxMenuItemIconSize, dxFilterMenu.dxMenuItemIconSize, iconColor, dxFilterMenu.dxMenuItemPopoutContainerWidth, borderColor, dxTextEditorInputMinHeight, borderColor, borderColor, borderColor, borderColor, dxColumnTagSizes.dxColumnTagFontSize, dxColumnTagSizes.dxColumnTagLineHeight, dxColumnTagSizes.dxColumnTagPaddingInline, borderColor, borderColor, whiteColor, borderColor, dxSummarySizes.dxFiltersPanelPaddingLeft, dxSummarySizes.dxFiltersPanelPaddingTop, dxSummarySizes.dxFiltersPanelPaddingBottom, props.hasSummaryButton ? dxSummarySizes.dxFiltersPanelPaddingRight : dxSummarySizes.dxFiltersPanelPaddingRightDefault, borderColor, dxSummarySizes.dxFiltersPanelLeftGap, dxSummarySizes.dxFilterPanelMinHeight, primaryColor, dxIconFilterFontSize, dxSummarySizes.dxFiltersPanelTextLineHeight, borderColor, dxPager.dxPagerPaddingBlock, dxPager.dxPagerPaddingInline, dxPager.dxPagerPageIndexesGap, dxPager.dxPagerPageButtonWidth, dxPager.dxPagerPageButtonHeight, dxPager.dxPagerPageButtonBorderRadius, dxPager.dxPagerPageButtonFontSize, columnTextColor, primaryColorBg, primaryColorHover, primaryColor, primaryColor, dxPager.dxPagerPageButtonFontSize, columnTextColor, dxPager.dxPagerNavigationButtonWidth, dxPager.dxPagerNavigationButtonHeight, dxPager.dxPagerNavigationButtonFontSize, dxPager.dxPagerNavigationButtonBeforeWidth, dxPager.dxPagerNavigationButtonBeforeHeight, dxDataColumnsPaddingInline, dxDataColumnsHeight, borderColor, borderColor, borderColor, dxHeaderFilterFontSize, borderColor, borderColor, borderColor, headerCommandSelectBg, borderColor, borderColor, headerCommandSelectBg, columnTextColor, primaryColor, dxLoadPanelContentWrapperGap, columnTextColor, dxWidgetFontSize, dxColumnColors, dxColumnColors, borderColor, borderColor, dxCommonSelectionStyles, checkboxBorderColor, dxCheckboxSize, dxCheckboxSize, dxCheckboxBorderRadiusSize, primaryColor, primaryColor, primaryColor, whiteColor, dxCheckboxCheckIconSize, dxCheckboxCheckIconSize, dxCheckboxCheckIconSize, dxCheckboxCheckIconSize))
|
|
2888
2919
|
};
|
|
2889
2920
|
});
|
|
2890
2921
|
|
|
@@ -2935,7 +2966,7 @@ var useBodyClasses = function useBodyClasses(_ref) {
|
|
|
2935
2966
|
}, [classes, enabled, cleanupStrategy]);
|
|
2936
2967
|
};
|
|
2937
2968
|
|
|
2938
|
-
var _excluded$6 = ["dataGridRef", "compact", "hasSummaryButton", "disableBodyClasses"];
|
|
2969
|
+
var _excluded$6 = ["dataGridRef", "compact", "hasSummaryButton", "disableBodyClasses", "dataGridBorderRadius", "height"];
|
|
2939
2970
|
var DATA_GRID_CLASSES = {
|
|
2940
2971
|
generic: "ods-datagrid-generic",
|
|
2941
2972
|
compact: "ods-datagrid-compact"
|
|
@@ -2963,10 +2994,14 @@ var OdsDataGrid = function OdsDataGrid(_ref) {
|
|
|
2963
2994
|
hasSummaryButton = _ref.hasSummaryButton,
|
|
2964
2995
|
_ref$disableBodyClass = _ref.disableBodyClasses,
|
|
2965
2996
|
disableBodyClasses = _ref$disableBodyClass === void 0 ? false : _ref$disableBodyClass,
|
|
2997
|
+
dataGridBorderRadius = _ref.dataGridBorderRadius,
|
|
2998
|
+
height = _ref.height,
|
|
2966
2999
|
props = _objectWithoutPropertiesLoose(_ref, _excluded$6);
|
|
2967
3000
|
var _useStyles = useStyles$4({
|
|
2968
3001
|
compact: compact != null ? compact : false,
|
|
2969
|
-
hasSummaryButton: hasSummaryButton != null ? hasSummaryButton : false
|
|
3002
|
+
hasSummaryButton: hasSummaryButton != null ? hasSummaryButton : false,
|
|
3003
|
+
dataGridBorderRadius: dataGridBorderRadius,
|
|
3004
|
+
height: height
|
|
2970
3005
|
}),
|
|
2971
3006
|
styles = _useStyles.styles,
|
|
2972
3007
|
cx = _useStyles.cx;
|
|
@@ -34915,7 +34950,7 @@ var OdsBasicDataGrid = function OdsBasicDataGrid(props) {
|
|
|
34915
34950
|
scrollingProps = _props$scrollingProps === void 0 ? {} : _props$scrollingProps,
|
|
34916
34951
|
onContentReady = props.onContentReady,
|
|
34917
34952
|
onRowPrepared = props.onRowPrepared,
|
|
34918
|
-
|
|
34953
|
+
children = props.children;
|
|
34919
34954
|
var _useToken = useToken$1(),
|
|
34920
34955
|
token = _useToken.token;
|
|
34921
34956
|
var _AntForm$useForm = Form.useForm(),
|
|
@@ -35749,9 +35784,9 @@ var OdsBasicDataGrid = function OdsBasicDataGrid(props) {
|
|
|
35749
35784
|
type: "custom",
|
|
35750
35785
|
customLoad: customLoad,
|
|
35751
35786
|
customSave: customSave
|
|
35752
|
-
})), renderTotal() && React.createElement("div", {
|
|
35787
|
+
}), children), renderTotal() && React.createElement("div", {
|
|
35753
35788
|
className: gridStyle.gridCustomSummary
|
|
35754
|
-
}, React.createElement("p", null, renderTotal()))
|
|
35789
|
+
}, React.createElement("p", null, renderTotal())));
|
|
35755
35790
|
};
|
|
35756
35791
|
|
|
35757
35792
|
var useToken$2 = theme.useToken;
|