@ozen-ui/data-grid 0.73.0

package/__inner__/cjs/ui/DataGrid/components/DataGridRow/DataGridRow.js

@@ -0,0 +1,40 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.DataGridRow = exports.cnDataGridRow = void 0;
+var tslib_1 = require("tslib");
+var react_1 = tslib_1.__importDefault(require("react"));
+var Table_1 = require("@ozen-ui/kit/Table");
+var utils_1 = require("@ozen-ui/kit/utils");
+var core_1 = require("../../../../core");
+var shared_1 = require("../../../../shared");
+var cells_1 = require("../../../cells");
+var DataGridSubRow_1 = require("../DataGridSubRow");
+var components_1 = require("./components");
+exports.cnDataGridRow = (0, shared_1.cn)('DataGridRow');
+exports.DataGridRow = (0, core_1.dataGridObserver)(function (_a) {
+    var id = _a.id, row = _a.row, index = _a.index;
+    var store = (0, core_1.useDataGridStore)();
+    var columnsInfo = (0, core_1.useDataGridColumnsInfo)();
+    var isSubRowEnabled = store.subRows.isEnabled;
+    return (react_1.default.createElement(react_1.default.Fragment, null,
+        react_1.default.createElement(Table_1.TableRow, { className: (0, exports.cnDataGridRow)() },
+            react_1.default.createElement(components_1.DataGridRowSelection, { id: id }),
+            isSubRowEnabled && store.subRows.isLeft && (react_1.default.createElement(components_1.DataGridRowExpand, { id: id, index: index })),
+            store.columns.map(function (column) {
+                var cell = column.cell;
+                var value = column.accessor(row, index);
+                var renderedCell = (0, utils_1.isFunction)(cell)
+                    ? cell(value, row, index)
+                    : cell;
+                var cellComponent = (function () {
+                    if ((0, utils_1.isString)(renderedCell) || (0, utils_1.isNumber)(renderedCell)) {
+                        return (react_1.default.createElement(cells_1.DataGridCellItem, { align: column.align }, renderedCell));
+                    }
+                    return renderedCell;
+                })();
+                return (react_1.default.createElement(components_1.DataGridRowCell, { key: "".concat(id, "_").concat(column.id), width: column.width, align: column.align, verticalAlign: columnsInfo.verticalAlign }, cellComponent));
+            }),
+            isSubRowEnabled && store.subRows.isRight && (react_1.default.createElement(components_1.DataGridRowExpand, { id: id, index: index }))),
+        isSubRowEnabled &&
+            store.subRows.rows.map(function (subRow) { return (react_1.default.createElement(DataGridSubRow_1.DataGridSubRow, { key: "".concat(subRow.generateId(index), "_").concat(id), subRow: subRow, row: row, id: id, index: index })); })));
+});

package/__inner__/cjs/ui/DataGrid/components/DataGridRow/components/DataGridRowCell/DataGridRowCell.css

@@ -0,0 +1,16 @@
+.DataGridRowCell-Inner {
+    display: flex;
+    align-items: center;
+    min-block-size: 56px;
+
+    box-sizing: border-box;
+    padding-block: 8px;
+    padding-inline: var(--data-grid-column-inline-gap);
+    overflow: hidden;
+  }
+  .DataGridRowCell-Inner_align_left {
+    justify-content: flex-start;
+  }
+  .DataGridRowCell-Inner_align_right {
+    justify-content: flex-end;
+  }

package/__inner__/cjs/ui/DataGrid/components/DataGridRow/components/DataGridRowCell/DataGridRowCell.js

@@ -0,0 +1,16 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.DataGridRowCell = exports.cnDataGridRowCell = void 0;
+var tslib_1 = require("tslib");
+var react_1 = tslib_1.__importDefault(require("react"));
+var core_1 = require("../../../../../../core");
+var shared_1 = require("../../../../../../shared");
+var DataGridCell_1 = require("../../../DataGridCell");
+exports.cnDataGridRowCell = (0, shared_1.cn)('DataGridRowCell');
+exports.DataGridRowCell = (0, core_1.dataGridObserver)(function (_a) {
+    var children = _a.children, width = _a.width, align = _a.align, verticalAlign = _a.verticalAlign, className = _a.className;
+    return (react_1.default.createElement(DataGridCell_1.DataGridCell, { className: (0, exports.cnDataGridRowCell)('', [className]), align: align, verticalAlign: verticalAlign, style: {
+            width: width === 'responsive' ? undefined : width,
+        } },
+        react_1.default.createElement("div", { className: (0, exports.cnDataGridRowCell)('Inner', { align: align }) }, children)));
+});

package/__inner__/cjs/ui/DataGrid/components/DataGridRow/components/DataGridRowCell/index.js

@@ -0,0 +1,5 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+var tslib_1 = require("tslib");
+tslib_1.__exportStar(require("./DataGridRowCell"), exports);
+tslib_1.__exportStar(require("./types"), exports);

package/__inner__/cjs/ui/DataGrid/components/DataGridRow/components/DataGridRowCell/types.js

@@ -0,0 +1,2 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });

package/__inner__/cjs/ui/DataGrid/components/DataGridRow/components/DataGridRowExpand/DataGridRowExpand.css

@@ -0,0 +1,12 @@
+.DataGridRowExpand {
+  inline-size: var(--data-grid-expand-width);
+  box-sizing: border-box;
+}
+
+  .DataGridRowExpand .DataGridRowCell-Inner {
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    padding-inline: 0;
+    padding-block: var(--spacing-4xs);
+  }

package/__inner__/cjs/ui/DataGrid/components/DataGridRow/components/DataGridRowExpand/DataGridRowExpand.js

@@ -0,0 +1,24 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.DataGridRowExpand = exports.cnDataGridRowExpand = void 0;
+var tslib_1 = require("tslib");
+var react_1 = tslib_1.__importDefault(require("react"));
+var icons_1 = require("@ozen-ui/icons");
+var IconButtonNext_1 = require("@ozen-ui/kit/IconButtonNext");
+var core_1 = require("../../../../../../core");
+var shared_1 = require("../../../../../../shared");
+var DataGridRowCell_1 = require("../DataGridRowCell");
+exports.cnDataGridRowExpand = (0, shared_1.cn)('DataGridRowExpand');
+exports.DataGridRowExpand = (0, core_1.dataGridObserver)(function (_a) {
+    var id = _a.id, index = _a.index;
+    var store = (0, core_1.useDataGridStore)();
+    var columnsInfo = (0, core_1.useDataGridColumnsInfo)();
+    if (!store.subRows.canExpandRoot) {
+        return null;
+    }
+    return (react_1.default.createElement(DataGridRowCell_1.DataGridRowCell, { className: (0, exports.cnDataGridRowExpand)(), verticalAlign: columnsInfo.verticalAlign }, store.subRows.isSomeRowsVisible(id, index) && (react_1.default.createElement(IconButtonNext_1.IconButton, { icon: store.subRows.getIsExpandedRoot(id)
+            ? icons_1.ChevronUpIcon
+            : icons_1.ChevronDownIcon, size: "s", onClick: function () {
+            store.subRows.toggleRoot(id);
+        }, variant: 'ghost', compressed: true }))));
+});

package/__inner__/cjs/ui/DataGrid/components/DataGridRow/components/DataGridRowExpand/index.js

@@ -0,0 +1,5 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+var tslib_1 = require("tslib");
+tslib_1.__exportStar(require("./DataGridRowExpand"), exports);
+tslib_1.__exportStar(require("./types"), exports);

package/__inner__/cjs/ui/DataGrid/components/DataGridRow/components/DataGridRowExpand/types.js

@@ -0,0 +1,2 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });

package/__inner__/cjs/ui/DataGrid/components/DataGridRow/components/DataGridRowSelection/DataGridRowSelection.css

@@ -0,0 +1,9 @@
+.DataGridRowSelection {
+  inline-size: var(--data-grid-selection-width);
+}
+
+  .DataGridRowSelection .DataGridRowCell-Inner {
+    display: flex;
+    align-items: center;
+    padding-inline: var(--data-grid-column-inline-gap);
+  }

package/__inner__/cjs/ui/DataGrid/components/DataGridRow/components/DataGridRowSelection/DataGridRowSelection.js

@@ -0,0 +1,31 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.DataGridRowSelection = exports.cnDataGridRowSelection = void 0;
+var tslib_1 = require("tslib");
+var react_1 = tslib_1.__importDefault(require("react"));
+var CheckboxNext_1 = require("@ozen-ui/kit/CheckboxNext");
+var RadioNext_1 = require("@ozen-ui/kit/RadioNext");
+var core_1 = require("../../../../../../core");
+var shared_1 = require("../../../../../../shared");
+var DataGridRowCell_1 = require("../DataGridRowCell");
+exports.cnDataGridRowSelection = (0, shared_1.cn)('DataGridRowSelection');
+exports.DataGridRowSelection = (0, core_1.dataGridObserver)(function (_a) {
+    var id = _a.id;
+    var store = (0, core_1.useDataGridStore)();
+    var columnsInfo = (0, core_1.useDataGridColumnsInfo)();
+    if (!store.selection.isEnabled) {
+        return null;
+    }
+    var isSelected = store.selection.getIsSelectedRow(id);
+    return (react_1.default.createElement(DataGridRowCell_1.DataGridRowCell, { className: (0, exports.cnDataGridRowSelection)(), align: "left", verticalAlign: columnsInfo.verticalAlign },
+        store.selection.isSingle && (react_1.default.createElement(RadioNext_1.Radio, { size: "s", className: (0, exports.cnDataGridRowSelection)('Select', {
+                single: true,
+            }), checked: isSelected, onChange: function (event) {
+                store.selection.setRowSelected(id, event.target.checked);
+            } })),
+        store.selection.isMultiple && (react_1.default.createElement(CheckboxNext_1.Checkbox, { size: "s", className: (0, exports.cnDataGridRowSelection)('Select', {
+                multiple: true,
+            }), checked: isSelected, onChange: function (event) {
+                store.selection.setRowSelected(id, event.target.checked);
+            } }))));
+});

package/__inner__/cjs/ui/DataGrid/components/DataGridRow/components/DataGridRowSelection/index.js

@@ -0,0 +1,5 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+var tslib_1 = require("tslib");
+tslib_1.__exportStar(require("./DataGridRowSelection"), exports);
+tslib_1.__exportStar(require("./types"), exports);

package/__inner__/cjs/ui/DataGrid/components/DataGridRow/components/DataGridRowSelection/types.js

@@ -0,0 +1,2 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });

package/__inner__/cjs/ui/DataGrid/components/DataGridRow/components/index.js

@@ -0,0 +1,6 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+var tslib_1 = require("tslib");
+tslib_1.__exportStar(require("./DataGridRowCell"), exports);
+tslib_1.__exportStar(require("./DataGridRowExpand"), exports);
+tslib_1.__exportStar(require("./DataGridRowSelection"), exports);

package/__inner__/cjs/ui/DataGrid/components/DataGridRow/index.js

@@ -0,0 +1,5 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+var tslib_1 = require("tslib");
+tslib_1.__exportStar(require("./DataGridRow"), exports);
+tslib_1.__exportStar(require("./types"), exports);

package/__inner__/cjs/ui/DataGrid/components/DataGridRow/types.js

@@ -0,0 +1,2 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });

package/__inner__/cjs/ui/DataGrid/components/DataGridSubRow/DataGridSubRow.css

@@ -0,0 +1,43 @@
+.DataGridSubRow {
+  --data-grid-sub-row-background: var(--color-background-main-pressed);
+  --data-grid-sub-row-total-depth-margin: 0px;
+  --data-grid-sub-row-selection-margin: 0px;
+  background-color: var(--data-grid-sub-row-background);
+}
+
+  .DataGridSubRow:not(.DataGridSubRow_expanded) .TableCell {
+      border-block-end: 0;
+    }
+
+  .DataGridSubRow-Collapse .Collapse-Inner {
+      padding-block: 8px;
+      padding-inline: 16px;
+
+      display: flex;
+      align-items: center;
+    }
+
+  .DataGridSubRow_withMargin {
+    --data-grid-sub-row-total-depth-margin: calc((var(--data-grid-sub-row-depth) + 1) * var(--data-grid-expand-width));
+    --data-grid-sub-row-selection-margin: var(--data-grid-selection-width);
+  }
+
+  .DataGridSubRow_withMargin .Collapse-Inner {
+      padding-inline: 0 16px;
+    }
+
+  .DataGridSubRow_position_left .Collapse-Inner {
+      margin-inline-start: calc(var(--data-grid-sub-row-total-depth-margin) + var(--data-grid-sub-row-selection-margin));
+    }
+
+  .DataGridSubRow_position_right .Collapse-Inner {
+      margin-inline: var(--data-grid-sub-row-selection-margin) var(--data-grid-sub-row-total-depth-margin);
+    }
+
+  .DataGridSubRow_depth_0 {
+    --data-grid-sub-row-background: var(--color-background-main-hover);
+  }
+
+  .DataGridSubRow_depth_1 {
+    --data-grid-sub-row-background: var(--color-background-main-pressed);
+  }

package/__inner__/cjs/ui/DataGrid/components/DataGridSubRow/DataGridSubRow.js

@@ -0,0 +1,58 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.DataGridSubRow = exports.cnDataGridSubRow = void 0;
+var tslib_1 = require("tslib");
+var react_1 = tslib_1.__importDefault(require("react"));
+var icons_1 = require("@ozen-ui/icons");
+var Collapse_1 = require("@ozen-ui/kit/Collapse");
+var IconButtonNext_1 = require("@ozen-ui/kit/IconButtonNext");
+var Table_1 = require("@ozen-ui/kit/Table");
+var utils_1 = require("@ozen-ui/kit/utils");
+var core_1 = require("../../../../core");
+var shared_1 = require("../../../../shared");
+var DataGridCell_1 = require("../DataGridCell");
+var constants_1 = require("./constants");
+exports.cnDataGridSubRow = (0, shared_1.cn)('DataGridSubRow');
+exports.DataGridSubRow = (0, core_1.dataGridObserver)(function (_a) {
+    var _b;
+    var _c;
+    var row = _a.row, id = _a.id, subRow = _a.subRow, index = _a.index;
+    var store = (0, core_1.useDataGridStore)();
+    var subRows = (0, core_1.useDataGridSubRows)();
+    var isVisible = subRow.isVisible(row, index);
+    if (!isVisible) {
+        return null;
+    }
+    var isExpanded = subRow.isRoot
+        ? store.subRows.getIsExpandedRoot(id)
+        : !!((_c = subRow.root) === null || _c === void 0 ? void 0 : _c.getIsExpanded(id));
+    var canExpand = subRow.canExpand;
+    var rendered = subRow.render(row, index);
+    var expandButton = (react_1.default.createElement(IconButtonNext_1.IconButton, { icon: subRow.getIsExpanded(id) ? icons_1.ChevronUpIcon : icons_1.ChevronDownIcon, size: "s", onClick: function () {
+            subRow.toggle(id);
+        }, compressed: true }));
+    var isSomeRowsVisible = subRow.isSomeRowsVisible(row, index);
+    return (react_1.default.createElement(react_1.default.Fragment, null,
+        react_1.default.createElement(Table_1.TableRow, { className: (0, exports.cnDataGridSubRow)({
+                expanded: isExpanded,
+                depth: subRow.depth.toString(),
+                withMargin: subRows.isWithMargin,
+                position: subRows.position,
+            }), style: (0, utils_1.generateCSSVariables)((_b = {},
+                _b[constants_1.DATA_GRID_SUB_ROW_CSS_VARIABLES.DEPTH] = subRow.depth,
+                _b)) },
+            react_1.default.createElement(DataGridCell_1.DataGridCell, { colSpan: store.colSpan, style: { padding: 0 } },
+                react_1.default.createElement(Collapse_1.Collapse, { className: (0, exports.cnDataGridSubRow)('Collapse'), expanded: isExpanded },
+                    isSomeRowsVisible &&
+                        canExpand &&
+                        store.subRows.isLeft &&
+                        expandButton,
+                    rendered,
+                    isSomeRowsVisible &&
+                        canExpand &&
+                        store.subRows.isRight &&
+                        expandButton))),
+        isExpanded &&
+            canExpand &&
+            subRow.rows.map(function (subRow) { return (react_1.default.createElement(exports.DataGridSubRow, { key: subRow.generateId(index), row: row, subRow: subRow, id: id, index: index })); })));
+});

package/__inner__/cjs/ui/DataGrid/components/DataGridSubRow/constants.js

@@ -0,0 +1,6 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.DATA_GRID_SUB_ROW_CSS_VARIABLES = void 0;
+exports.DATA_GRID_SUB_ROW_CSS_VARIABLES = {
+    DEPTH: 'data-grid-sub-row-depth',
+};

package/__inner__/cjs/ui/DataGrid/components/DataGridSubRow/index.js

@@ -0,0 +1,6 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+var tslib_1 = require("tslib");
+tslib_1.__exportStar(require("./constants"), exports);
+tslib_1.__exportStar(require("./DataGridSubRow"), exports);
+tslib_1.__exportStar(require("./types"), exports);

package/__inner__/cjs/ui/DataGrid/components/DataGridSubRow/types.js

@@ -0,0 +1,2 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });

package/__inner__/cjs/ui/DataGrid/components/DataGridTable/DataGridTable.css

@@ -0,0 +1,3 @@
+.DataGridTable_placeholder {
+    block-size: 100%;
+  }

package/__inner__/cjs/ui/DataGrid/components/DataGridTable/DataGridTable.js

@@ -0,0 +1,18 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.DataGridTable = exports.cnDataGridTable = void 0;
+var tslib_1 = require("tslib");
+var react_1 = tslib_1.__importStar(require("react"));
+var Table_1 = require("@ozen-ui/kit/Table");
+var core_1 = require("../../../../core");
+var shared_1 = require("../../../../shared");
+exports.cnDataGridTable = (0, shared_1.cn)('DataGridTable');
+var UnwrappedDataGridTable = (0, react_1.forwardRef)(function (_a, ref) {
+    var children = _a.children, stickyHeader = _a.stickyHeader, layout = _a.layout;
+    var store = (0, core_1.useDataGridStore)();
+    return (react_1.default.createElement(Table_1.Table, { ref: ref, size: "m", className: (0, exports.cnDataGridTable)({
+            placeholder: store.isPlaceholder,
+        }), fullWidth: true, stickyHeader: stickyHeader, layout: layout }, children));
+});
+UnwrappedDataGridTable.displayName = 'DataGridTable';
+exports.DataGridTable = (0, core_1.dataGridObserver)(UnwrappedDataGridTable);

package/__inner__/cjs/ui/DataGrid/components/DataGridTable/index.js

@@ -0,0 +1,5 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+var tslib_1 = require("tslib");
+tslib_1.__exportStar(require("./DataGridTable"), exports);
+tslib_1.__exportStar(require("./types"), exports);

package/__inner__/cjs/ui/DataGrid/components/DataGridTable/types.js

@@ -0,0 +1,2 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });

package/__inner__/cjs/ui/DataGrid/components/DataGridTop/DataGridTop.css

@@ -0,0 +1,7 @@
+.DataGridTop {
+  margin-block-end: var(--spacing-s);
+}
+
+  .DataGridTop-FiltersDivider {
+    block-size: 16px;
+  }

package/__inner__/cjs/ui/DataGrid/components/DataGridTop/DataGridTop.js

@@ -0,0 +1,43 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.DataGridTop = exports.cnDataGridTop = void 0;
+var tslib_1 = require("tslib");
+var react_1 = tslib_1.__importStar(require("react"));
+var Stack_1 = require("@ozen-ui/kit/Stack");
+var core_1 = require("../../../../core");
+var shared_1 = require("../../../../shared");
+var filters_1 = require("../../../filters");
+var components_1 = require("./components");
+exports.cnDataGridTop = (0, shared_1.cn)('DataGridTop');
+var UnwrappedDataGridTop = (0, react_1.forwardRef)(function (_a, ref) {
+    var hasAllFilterDrawer = _a.hasAllFilterDrawer, hasSettingsDrawer = _a.hasSettingsDrawer, applyText = _a.applyText, clearText = _a.clearText, actions = _a.actions, className = _a.className, subControlsBefore = _a.subControlsBefore, subControlsAfter = _a.subControlsAfter;
+    var store = (0, core_1.useDataGridStore)();
+    var filtersType = store.filters
+        .isConfirmable
+        ? 'local'
+        : 'default';
+    var _b = store.filters, mainFilters = _b.mainFilters, subMainFilters = _b.subMainFilters, filters = _b.filters;
+    var hasMainFilters = mainFilters.length > 0 || subMainFilters.length > 0;
+    var hasAllFilterButton = filters.length > 0 && hasAllFilterDrawer;
+    var isWithActions = !!actions;
+    var hasHideElements = hasSettingsDrawer && store.columnsInfo.canHide;
+    var hasSubControls = !!subControlsBefore || !!subControlsAfter;
+    var hasSomeElement = isWithActions ||
+        hasAllFilterButton ||
+        hasMainFilters ||
+        hasHideElements ||
+        hasSubControls;
+    if (!hasSomeElement) {
+        return null;
+    }
+    return (react_1.default.createElement(Stack_1.Stack, { ref: ref, className: (0, exports.cnDataGridTop)('', [className]), gap: "l", direction: "column", fullWidth: true },
+        react_1.default.createElement(Stack_1.Stack, { className: (0, exports.cnDataGridTop)('Main'), gap: "l", justify: actions ? 'spaceBetween' : 'end', align: "center", fullWidth: true },
+            actions,
+            react_1.default.createElement(Stack_1.Stack, { gap: "l", align: "center", className: (0, exports.cnDataGridTop)('MainControls') },
+                mainFilters.map(function (filter) { return (react_1.default.createElement(filters_1.DataGridFilter, { key: filter.id, filter: filter, type: filtersType })); }),
+                react_1.default.createElement(components_1.DataGridTopControls, { applyText: applyText, clearText: clearText }),
+                react_1.default.createElement(components_1.DataGridTopSubControls, { hasAllFilterDrawer: hasAllFilterDrawer, hasSettingsDrawer: hasSettingsDrawer, before: subControlsBefore, after: subControlsAfter }))),
+        subMainFilters.length > 0 && (react_1.default.createElement(Stack_1.Stack, { gap: "l", align: "center", className: (0, exports.cnDataGridTop)('SubControls'), justify: "end", fullWidth: true }, subMainFilters.map(function (filter) { return (react_1.default.createElement(filters_1.DataGridFilter, { key: filter.id, filter: filter, type: filtersType })); })))));
+});
+UnwrappedDataGridTop.displayName = 'DataGridTop';
+exports.DataGridTop = (0, core_1.dataGridObserver)(UnwrappedDataGridTop);

package/__inner__/cjs/ui/DataGrid/components/DataGridTop/components/DataGridTopControls/DataGridTopControls.js

@@ -0,0 +1,26 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.DataGridTopControls = void 0;
+var tslib_1 = require("tslib");
+var react_1 = tslib_1.__importDefault(require("react"));
+var ButtonNext_1 = require("@ozen-ui/kit/ButtonNext");
+var Stack_1 = require("@ozen-ui/kit/Stack");
+var core_1 = require("../../../../../../core");
+exports.DataGridTopControls = (0, core_1.dataGridObserver)(function (_a) {
+    var applyText = _a.applyText, clearText = _a.clearText;
+    var store = (0, core_1.useDataGridStore)();
+    var filtersCount = store.filters.filters.length;
+    if (filtersCount === 0) {
+        return null;
+    }
+    var isClearActive = store.filters.isSomeEdited || store.filters.isSomeActive;
+    var hasSomeMainFilters = store.filters.mainFilters.length > 0 ||
+        store.filters.subMainFilters.length > 0;
+    return (react_1.default.createElement(Stack_1.Stack, { gap: "l", align: "center" },
+        store.filters.isConfirmable && hasSomeMainFilters && (react_1.default.createElement(ButtonNext_1.Button, { onClick: function () {
+                store.filters.applyMainLocals();
+            }, disabled: !store.filters.isSomeMainEdited, color: "tertiary", size: "xs" }, applyText)),
+        react_1.default.createElement(ButtonNext_1.Button, { onClick: function () {
+                store.filters.resetAll();
+            }, disabled: !isClearActive, variant: "contained-additional", color: "secondary", size: "xs" }, clearText)));
+});

package/__inner__/cjs/ui/DataGrid/components/DataGridTop/components/DataGridTopControls/index.js

@@ -0,0 +1,5 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+var tslib_1 = require("tslib");
+tslib_1.__exportStar(require("./DataGridTopControls"), exports);
+tslib_1.__exportStar(require("./types"), exports);

package/__inner__/cjs/ui/DataGrid/components/DataGridTop/components/DataGridTopControls/types.js

@@ -0,0 +1,2 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });

package/__inner__/cjs/ui/DataGrid/components/DataGridTop/components/DataGridTopSubControls/DataGridTopSubControls.css

@@ -0,0 +1,8 @@
+.DataGridTopSubControls-FilterWrapper {
+    position: relative;
+  }
+  .DataGridTopSubControls-FilterIndicator {
+    position: absolute;
+    inset-block-start: 10px;
+    inset-inline-end: 10px;
+  }

package/__inner__/cjs/ui/DataGrid/components/DataGridTop/components/DataGridTopSubControls/DataGridTopSubControls.js

@@ -0,0 +1,30 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.DataGridTopSubControls = exports.cnDataGridTopSubControls = void 0;
+var tslib_1 = require("tslib");
+var react_1 = tslib_1.__importDefault(require("react"));
+var icons_1 = require("@ozen-ui/icons");
+var Indicator_1 = require("@ozen-ui/kit/Indicator");
+var Stack_1 = require("@ozen-ui/kit/Stack");
+var core_1 = require("../../../../../../core");
+var shared_1 = require("../../../../../../shared");
+var sub_controls_1 = require("../../../../../sub-controls");
+exports.cnDataGridTopSubControls = (0, shared_1.cn)('DataGridTopSubControls');
+exports.DataGridTopSubControls = (0, core_1.dataGridObserver)(function (_a) {
+    var hasAllFilterDrawer = _a.hasAllFilterDrawer, hasSettingsDrawer = _a.hasSettingsDrawer, before = _a.before, after = _a.after;
+    var store = (0, core_1.useDataGridStore)();
+    var isSettingsVisible = store.columnsInfo.canHide;
+    var isFiltersVisible = store.filters.filters.length > 0;
+    if (!isSettingsVisible && !isFiltersVisible) {
+        return null;
+    }
+    return (react_1.default.createElement(Stack_1.Stack, { className: (0, exports.cnDataGridTopSubControls)() },
+        before,
+        hasAllFilterDrawer && isFiltersVisible && (react_1.default.createElement("div", { className: (0, exports.cnDataGridTopSubControls)('FilterWrapper') },
+            react_1.default.createElement(sub_controls_1.DataGridSubControlIconButton, { icon: icons_1.FilterOutlineIcon, onClick: function () {
+                    store.modals.openFilters();
+                } }),
+            store.filters.isSomeActive && (react_1.default.createElement(Indicator_1.Indicator, { className: (0, exports.cnDataGridTopSubControls)('FilterIndicator'), variant: "error", size: "s" })))),
+        hasSettingsDrawer && isSettingsVisible && (react_1.default.createElement(sub_controls_1.DataGridSubControlIconButton, { icon: icons_1.SettingsIcon, onClick: function () { return store.modals.openColumnsSettings(); } })),
+        after));
+});

package/__inner__/cjs/ui/DataGrid/components/DataGridTop/components/DataGridTopSubControls/index.js

@@ -0,0 +1,5 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+var tslib_1 = require("tslib");
+tslib_1.__exportStar(require("./DataGridTopSubControls"), exports);
+tslib_1.__exportStar(require("./types"), exports);

package/__inner__/cjs/ui/DataGrid/components/DataGridTop/components/DataGridTopSubControls/types.js

@@ -0,0 +1,2 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });

package/__inner__/cjs/ui/DataGrid/components/DataGridTop/components/index.js

@@ -0,0 +1,5 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+var tslib_1 = require("tslib");
+tslib_1.__exportStar(require("./DataGridTopControls"), exports);
+tslib_1.__exportStar(require("./DataGridTopSubControls"), exports);

package/__inner__/cjs/ui/DataGrid/components/DataGridTop/index.js

@@ -0,0 +1,5 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+var tslib_1 = require("tslib");
+tslib_1.__exportStar(require("./DataGridTop"), exports);
+tslib_1.__exportStar(require("./types"), exports);

package/__inner__/cjs/ui/DataGrid/components/DataGridTop/types.js

@@ -0,0 +1,2 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });

package/__inner__/cjs/ui/DataGrid/components/DataGridWrapper/DataGridWrapper.css

@@ -0,0 +1,12 @@
+.DataGridWrapper {
+  --data-grid-selection-width: 0px;
+  --data-grid-expand-width: 48px;
+  --data-grid-column-inline-gap: 16px;
+  display: flex;
+  flex-direction: column;
+  block-size: 100%;
+}
+
+  .DataGridWrapper_withSelection {
+    --data-grid-selection-width: 48px;
+  }

package/__inner__/cjs/ui/DataGrid/components/DataGridWrapper/DataGridWrapper.js

@@ -0,0 +1,19 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.DataGridWrapper = exports.cnDataGridWrapper = void 0;
+var tslib_1 = require("tslib");
+var react_1 = tslib_1.__importStar(require("react"));
+var core_1 = require("../../../../core");
+var shared_1 = require("../../../../shared");
+exports.cnDataGridWrapper = (0, shared_1.cn)('DataGridWrapper');
+var UnwrappedDataGridWrapper = (0, react_1.forwardRef)(function (_a, ref) {
+    var children = _a.children, className = _a.className;
+    var subRows = (0, core_1.useDataGridSubRows)();
+    var selection = (0, core_1.useDataGridSelection)();
+    return (react_1.default.createElement("div", { ref: ref, className: (0, exports.cnDataGridWrapper)({
+            withSelection: selection.isEnabled,
+            withSubRows: subRows.isEnabled,
+        }, [className]) }, children));
+});
+UnwrappedDataGridWrapper.displayName = 'DataGridWrapper';
+exports.DataGridWrapper = (0, core_1.dataGridObserver)(UnwrappedDataGridWrapper);

package/__inner__/cjs/ui/DataGrid/components/DataGridWrapper/index.js

@@ -0,0 +1,5 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+var tslib_1 = require("tslib");
+tslib_1.__exportStar(require("./DataGridWrapper"), exports);
+tslib_1.__exportStar(require("./types"), exports);

package/__inner__/cjs/ui/DataGrid/components/DataGridWrapper/types.js

@@ -0,0 +1,2 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });

package/__inner__/cjs/ui/DataGrid/components/index.js

@@ -0,0 +1,14 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+var tslib_1 = require("tslib");
+tslib_1.__exportStar(require("./DataGridBody"), exports);
+tslib_1.__exportStar(require("./DataGridCell"), exports);
+tslib_1.__exportStar(require("./DataGridFoot"), exports);
+tslib_1.__exportStar(require("./DataGridHead"), exports);
+tslib_1.__exportStar(require("./DataGridHeadFoot"), exports);
+tslib_1.__exportStar(require("./DataGridPagination"), exports);
+tslib_1.__exportStar(require("./DataGridRow"), exports);
+tslib_1.__exportStar(require("./DataGridSubRow"), exports);
+tslib_1.__exportStar(require("./DataGridTable"), exports);
+tslib_1.__exportStar(require("./DataGridTop"), exports);
+tslib_1.__exportStar(require("./DataGridWrapper"), exports);

package/__inner__/cjs/ui/DataGrid/entities/index.js

@@ -0,0 +1,5 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+var tslib_1 = require("tslib");
+tslib_1.__exportStar(require("./overflow"), exports);
+tslib_1.__exportStar(require("./refs"), exports);

package/__inner__/cjs/ui/DataGrid/entities/overflow.js

@@ -0,0 +1,10 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.dataGridOverflowVariant = void 0;
+exports.dataGridOverflowVariant = [
+    'auto',
+    'clip',
+    'hidden',
+    'scroll',
+    'visible',
+];

package/__inner__/cjs/ui/DataGrid/entities/refs.js

@@ -0,0 +1,2 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });

package/__inner__/cjs/ui/DataGrid/index.js

@@ -0,0 +1,6 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+var tslib_1 = require("tslib");
+tslib_1.__exportStar(require("./entities"), exports);
+tslib_1.__exportStar(require("./DataGrid"), exports);
+tslib_1.__exportStar(require("./types"), exports);