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.
Files changed (38) hide show
  1. package/README.md +39 -39
  2. package/dist/App.d.ts +3 -0
  3. package/dist/components/antd/modal/OdsAdvanceModal.d.ts +7 -0
  4. package/dist/components/devextreme/DataGrid/OdsDataGrid/index.d.ts +3 -2
  5. package/dist/components/devextreme/DataGrid/styles/styles.d.ts +2 -0
  6. package/dist/components/devextreme/DataGrid/styles/theme/sizes/default.d.ts +14 -0
  7. package/dist/components/devextreme/OdsBasicDataGrid/OdsBasicDataGrid.Types.d.ts +0 -1
  8. package/dist/components/devextreme/OdsInlineEditDataGrid/handlers/ContentHandlers.d.ts +14 -0
  9. package/dist/components/devextreme/OdsInlineEditDataGrid/handlers/EditorPreparedHandlers.d.ts +7 -0
  10. package/dist/components/devextreme/OdsInlineEditDataGrid/handlers/OnExportingHandlers.d.ts +19 -0
  11. package/dist/components/devextreme/OdsInlineEditDataGrid/handlers/OptionHandlers.d.ts +7 -0
  12. package/dist/components/devextreme/OdsInlineEditDataGrid/handlers/SummaryHandlers.d.ts +21 -0
  13. package/dist/components/devextreme/OdsInlineEditDataGrid/partials/ActionCellRender.d.ts +15 -0
  14. package/dist/components/devextreme/OdsInlineEditDataGrid/partials/EditingPartial.d.ts +9 -0
  15. package/dist/components/devextreme/OdsInlineEditDataGrid/partials/PageTitle.d.ts +8 -0
  16. package/dist/components/devextreme/OdsInlineEditDataGrid/utils.d.ts +19 -0
  17. package/dist/components/devextreme/OdsTimeline/OdsTimeline.Constants.d.ts +4 -0
  18. package/dist/components/devextreme/OdsTimeline/OdsTimeline.Functions.d.ts +6 -0
  19. package/dist/components/devextreme/OdsTimeline/OdsTimeline.Types.d.ts +77 -0
  20. package/dist/components/devextreme/OdsTimeline/OdsTimeline.d.ts +5 -0
  21. package/dist/components/devextreme/OdsTimeline/OdsTimelineDateFilter.d.ts +3 -0
  22. package/dist/components/devextreme/OdsTimeline/OdsTimelineSelectionColumn.d.ts +2 -0
  23. package/dist/components/devextreme/OdsTimelineTable/OdsTimelineTableSearchBox.d.ts +3 -0
  24. package/dist/index.css +267 -267
  25. package/dist/index.js +43 -8
  26. package/dist/index.js.map +1 -1
  27. package/dist/index.modern.js +43 -8
  28. package/dist/index.modern.js.map +1 -1
  29. package/dist/index.umd.js +2 -0
  30. package/dist/index.umd.js.map +1 -0
  31. package/dist/stories/OdsAdvanceModal/OdsAdvanceModal.stories.d.ts +42 -0
  32. package/dist/stories/OdsAdvanceModal/Samples/BasicOdsAdvanceModal.sample.d.ts +8 -0
  33. package/dist/stories/OdsModal/Samples/OdsModal.Sample.d.ts +1 -0
  34. package/dist/stories/OdsTimePicker/Samples/TimeRangePicker.d.ts +2 -0
  35. package/dist/stories/OdsTimeline/OdsTimeline.Constants.d.ts +3 -0
  36. package/dist/stories/OdsTimeline/OdsTimeline.Functions.d.ts +6 -0
  37. package/dist/stories/OdsTimeline/OdsTimeline.MockData.d.ts +39 -0
  38. package/package.json +101 -101
package/dist/index.js CHANGED
@@ -2644,6 +2644,20 @@ var defaultSizes = {
2644
2644
  dxToolbarMenuContentPaddingBlock: 5,
2645
2645
  dxToolbarMenuContentTextPaddingRight: 27,
2646
2646
  dxToolbarMenuItemBorderRadius: 4
2647
+ },
2648
+ dxPager: {
2649
+ dxPagerPaddingBlock: 16,
2650
+ dxPagerPaddingInline: 16,
2651
+ dxPagerPageIndexesGap: 4,
2652
+ dxPagerNavigationButtonWidth: 24,
2653
+ dxPagerNavigationButtonHeight: 24,
2654
+ dxPagerNavigationButtonFontSize: 11,
2655
+ dxPagerNavigationButtonBeforeWidth: 14,
2656
+ dxPagerNavigationButtonBeforeHeight: 14,
2657
+ dxPagerPageButtonWidth: 24,
2658
+ dxPagerPageButtonHeight: 24,
2659
+ dxPagerPageButtonBorderRadius: 6,
2660
+ dxPagerPageButtonFontSize: 14
2647
2661
  }
2648
2662
  };
2649
2663
 
@@ -2752,6 +2766,20 @@ var compactSizes = {
2752
2766
  dxToolbarMenuContentPaddingBlock: 5,
2753
2767
  dxToolbarMenuContentTextPaddingRight: 27,
2754
2768
  dxToolbarMenuItemBorderRadius: 4
2769
+ },
2770
+ dxPager: {
2771
+ dxPagerPaddingBlock: 8,
2772
+ dxPagerPaddingInline: 8,
2773
+ dxPagerPageIndexesGap: 4,
2774
+ dxPagerNavigationButtonWidth: 18,
2775
+ dxPagerNavigationButtonHeight: 18,
2776
+ dxPagerNavigationButtonFontSize: 9,
2777
+ dxPagerNavigationButtonBeforeWidth: 12,
2778
+ dxPagerNavigationButtonBeforeHeight: 12,
2779
+ dxPagerPageButtonWidth: 18,
2780
+ dxPagerPageButtonHeight: 18,
2781
+ dxPagerPageButtonBorderRadius: 4,
2782
+ dxPagerPageButtonFontSize: 12
2755
2783
  }
2756
2784
  };
2757
2785
 
@@ -2904,12 +2932,15 @@ var useStyles$4 = antdStyle.createStyles(function (_ref, props) {
2904
2932
  dxToolbar = _getSizes.dxToolbar,
2905
2933
  dxSearchBoxSizes = _getSizes.dxSearchBoxSizes,
2906
2934
  dxSummarySizes = _getSizes.dxSummarySizes,
2907
- dxColumnTagSizes = _getSizes.dxColumnTagSizes;
2935
+ dxColumnTagSizes = _getSizes.dxColumnTagSizes,
2936
+ dxPager = _getSizes.dxPager;
2908
2937
  var dxCommonSelectionStyles = css(_templateObject$u || (_templateObject$u = _taggedTemplateLiteralLoose(["\n width: ", "px;\n min-width: ", "px;\n max-width: ", "px;\n "])), dxSelectionColumnWidth, dxSelectionColumnWidth, dxSelectionColumnWidth);
2909
2938
  var dxColumnColors = css(_templateObject2$2 || (_templateObject2$2 = _taggedTemplateLiteralLoose(["\n color: ", ";\n background-color: transparent;\n "])), columnTextColor);
2939
+ var odsDataGridBorderRadius = props.dataGridBorderRadius ? typeof props.dataGridBorderRadius === "number" ? props.dataGridBorderRadius + "px" : props.dataGridBorderRadius : dxDataGridBorderRadius + "px";
2940
+ var odsDataGridHeight = typeof props.height === "function" ? props.height() : typeof props.height === "number" ? props.height + "px" : props.height;
2910
2941
  return {
2911
- 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: ", "px;\n overflow: hidden;\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, dxDataGridBorderRadius)),
2912
- 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))
2942
+ 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)),
2943
+ 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))
2913
2944
  };
2914
2945
  });
2915
2946
 
@@ -2960,7 +2991,7 @@ var useBodyClasses = function useBodyClasses(_ref) {
2960
2991
  }, [classes, enabled, cleanupStrategy]);
2961
2992
  };
2962
2993
 
2963
- var _excluded$6 = ["dataGridRef", "compact", "hasSummaryButton", "disableBodyClasses"];
2994
+ var _excluded$6 = ["dataGridRef", "compact", "hasSummaryButton", "disableBodyClasses", "dataGridBorderRadius", "height"];
2964
2995
  var DATA_GRID_CLASSES = {
2965
2996
  generic: "ods-datagrid-generic",
2966
2997
  compact: "ods-datagrid-compact"
@@ -2988,10 +3019,14 @@ var OdsDataGrid = function OdsDataGrid(_ref) {
2988
3019
  hasSummaryButton = _ref.hasSummaryButton,
2989
3020
  _ref$disableBodyClass = _ref.disableBodyClasses,
2990
3021
  disableBodyClasses = _ref$disableBodyClass === void 0 ? false : _ref$disableBodyClass,
3022
+ dataGridBorderRadius = _ref.dataGridBorderRadius,
3023
+ height = _ref.height,
2991
3024
  props = _objectWithoutPropertiesLoose(_ref, _excluded$6);
2992
3025
  var _useStyles = useStyles$4({
2993
3026
  compact: compact != null ? compact : false,
2994
- hasSummaryButton: hasSummaryButton != null ? hasSummaryButton : false
3027
+ hasSummaryButton: hasSummaryButton != null ? hasSummaryButton : false,
3028
+ dataGridBorderRadius: dataGridBorderRadius,
3029
+ height: height
2995
3030
  }),
2996
3031
  styles = _useStyles.styles,
2997
3032
  cx = _useStyles.cx;
@@ -34940,7 +34975,7 @@ var OdsBasicDataGrid = function OdsBasicDataGrid(props) {
34940
34975
  scrollingProps = _props$scrollingProps === void 0 ? {} : _props$scrollingProps,
34941
34976
  onContentReady = props.onContentReady,
34942
34977
  onRowPrepared = props.onRowPrepared,
34943
- summaryComponent = props.summaryComponent;
34978
+ children = props.children;
34944
34979
  var _useToken = useToken$1(),
34945
34980
  token = _useToken.token;
34946
34981
  var _AntForm$useForm = antd.Form.useForm(),
@@ -35774,9 +35809,9 @@ var OdsBasicDataGrid = function OdsBasicDataGrid(props) {
35774
35809
  type: "custom",
35775
35810
  customLoad: customLoad,
35776
35811
  customSave: customSave
35777
- })), renderTotal() && React__default.createElement("div", {
35812
+ }), children), renderTotal() && React__default.createElement("div", {
35778
35813
  className: gridStyle.gridCustomSummary
35779
- }, React__default.createElement("p", null, renderTotal())), summaryComponent != null ? summaryComponent : null);
35814
+ }, React__default.createElement("p", null, renderTotal())));
35780
35815
  };
35781
35816
 
35782
35817
  var useToken$2 = antd.theme.useToken;