@mailstep/design-system 0.8.31-beta.4 → 0.8.31

package/ui/Blocks/CommonGrid/components/MobileSortModal.js

@@ -1,34 +1,70 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { useCallback } from 'react';
-import Button from '../../../Elements/Button';
-import { Modal } from '../../Modal/Modal';
-import { getSortName } from '../utils';
-import { SortingUp, SortingDown } from './icons/Sorting';
-import { Trans } from '@lingui/react';
-import { x } from '@xstyled/styled-components';
-var AscIcon = _jsx(SortingUp, { width: "16", fill: "white" });
-var DescIcon = _jsx(SortingDown, { width: "16", fill: "white" });
-var SortRow = function (_a) {
-    var column = _a.column, currentDirection = _a.currentDirection, onCycle = _a.onCycle;
-    var handleClick = useCallback(function () {
-        onCycle(column);
-    }, [column, onCycle]);
-    var icon = currentDirection === 'asc' ? AscIcon : currentDirection === 'desc' ? DescIcon : null;
-    return (_jsx(Button, { type: "button", onClick: handleClick, appearance: currentDirection ? 'primary' : 'secondary', iconRight: icon, fullWidth: true, children: column.title }));
+import Button_default from "../../../Elements/Button/index.js";
+import { getSortName } from "../utils/index.js";
+import { Modal } from "../../Modal/Modal.js";
+import { SortingDown, SortingUp } from "./icons/Sorting.js";
+import { useCallback } from "react";
+import { x } from "@xstyled/styled-components";
+import { jsx } from "react/jsx-runtime";
+import { Trans } from "@lingui/react";
+//#region packages/ui/Blocks/CommonGrid/components/MobileSortModal.tsx
+const AscIcon = /* @__PURE__ */ jsx(SortingUp, {
+	width: "16",
+	fill: "white"
+});
+const DescIcon = /* @__PURE__ */ jsx(SortingDown, {
+	width: "16",
+	fill: "white"
+});
+const SortRow = ({ column, currentDirection, onCycle }) => {
+	return /* @__PURE__ */ jsx(Button_default, {
+		type: "button",
+		onClick: useCallback(() => {
+			onCycle(column);
+		}, [column, onCycle]),
+		appearance: currentDirection ? "primary" : "secondary",
+		iconRight: currentDirection === "asc" ? AscIcon : currentDirection === "desc" ? DescIcon : null,
+		fullWidth: true,
+		children: column.title
+	});
 };
-var MobileSortModal = function (_a) {
-    var isShown = _a.isShown, onClose = _a.onClose, columns = _a.columns, _b = _a.sortingValues, sortingValues = _b === void 0 ? [] : _b, onAddSorting = _a.onAddSorting, onResetSorting = _a.onResetSorting;
-    var sortableColumns = columns.filter(function (col) { return col.sorting; });
-    var getCurrentDirection = useCallback(function (column) { var _a; return ((_a = sortingValues.find(function (s) { return s.column === getSortName(column); })) === null || _a === void 0 ? void 0 : _a.direction) || null; }, [sortingValues]);
-    var activeSortedColumn = sortableColumns.find(function (col) { return getCurrentDirection(col) !== null; });
-    var handleCycle = useCallback(function (column) {
-        var current = getCurrentDirection(column);
-        var next = current ? (current === 'asc' ? 'desc' : null) : 'asc';
-        onAddSorting(getSortName(column), next);
-    }, [getCurrentDirection, onAddSorting]);
-    var handleClearSort = useCallback(function () {
-        onResetSorting === null || onResetSorting === void 0 ? void 0 : onResetSorting();
-    }, [onResetSorting]);
-    return (_jsx(Modal, { isShown: isShown, onClose: onClose, title: _jsx(Trans, { id: "dataGrid.sort", message: "Sort" }), onConfirm: activeSortedColumn ? handleClearSort : undefined, confirmLabel: _jsx(Trans, { id: "dataGrid.buttonClearSettings", message: "Reset" }), width: "narrow", ignoreClickOutside: true, children: _jsx(x.div, { display: "flex", flexDirection: "column", gap: "8px", p: "8px 4px", children: sortableColumns.map(function (column) { return (_jsx(SortRow, { column: column, currentDirection: getCurrentDirection(column), onCycle: handleCycle }, column.name)); }) }) }));
+const MobileSortModal = ({ isShown, onClose, columns, sortingValues = [], onAddSorting, onResetSorting }) => {
+	const sortableColumns = columns.filter((col) => col.sorting);
+	const getCurrentDirection = useCallback((column) => sortingValues.find((s) => s.column === getSortName(column))?.direction || null, [sortingValues]);
+	const activeSortedColumn = sortableColumns.find((col) => getCurrentDirection(col) !== null);
+	const handleCycle = useCallback((column) => {
+		const current = getCurrentDirection(column);
+		const next = current ? current === "asc" ? "desc" : null : "asc";
+		onAddSorting(getSortName(column), next);
+	}, [getCurrentDirection, onAddSorting]);
+	const handleClearSort = useCallback(() => {
+		onResetSorting?.();
+	}, [onResetSorting]);
+	return /* @__PURE__ */ jsx(Modal, {
+		isShown,
+		onClose,
+		title: /* @__PURE__ */ jsx(Trans, {
+			id: "dataGrid.sort",
+			message: "Sort"
+		}),
+		onConfirm: activeSortedColumn ? handleClearSort : void 0,
+		confirmLabel: /* @__PURE__ */ jsx(Trans, {
+			id: "dataGrid.buttonClearSettings",
+			message: "Reset"
+		}),
+		width: "narrow",
+		ignoreClickOutside: true,
+		children: /* @__PURE__ */ jsx(x.div, {
+			display: "flex",
+			flexDirection: "column",
+			gap: "8px",
+			p: "8px 4px",
+			children: sortableColumns.map((column) => /* @__PURE__ */ jsx(SortRow, {
+				column,
+				currentDirection: getCurrentDirection(column),
+				onCycle: handleCycle
+			}, column.name))
+		})
+	});
 };
-export default MobileSortModal;
+//#endregion
+export { MobileSortModal as default };

package/ui/Blocks/CommonGrid/components/OversizedScroll.d.ts

@@ -1,6 +1,5 @@
-import { default as React, FC } from 'react';
-import { CommonGridProps } from '../types';
-
+import React, { type FC } from 'react';
+import type { CommonGridProps } from '../types';
 type OversizedScrollProps = {
     columnLayout: Required<CommonGridProps>['columnLayout'];
     children: React.ReactNode;

package/ui/Blocks/CommonGrid/components/OversizedScroll.js

@@ -1,19 +1,36 @@
-var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
-    if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
-    return cooked;
+import "react";
+import styled$1, { css } from "@xstyled/styled-components";
+import { jsx, jsxs } from "react/jsx-runtime";
+//#region packages/ui/Blocks/CommonGrid/components/OversizedScroll.tsx
+const ScrollWrapper = styled$1.div`
+  ${(props) => props.columnLayout !== "no-scroll" && css`
+      overflow-x: ${props.columnLayout === "sticky" ? "inherit" : "auto"};
+      position: relative;
+      @media (min-width: 1024px) {
+        overflow-x: auto;
+      }
+    `};
+`;
+const ScrollSizer = styled$1.div`
+  ${(props) => props.columnLayout !== "no-scroll" && css`
+      width: ${props.totalColumnsWidth}px;
+    `};
+`;
+const FloatPosition = styled$1.div`
+  position: sticky;
+  left: 0;
+`;
+const OversizedScroll = ({ columnLayout, children, floatingChildren, totalColumnsWidth, ref }) => {
+	return /* @__PURE__ */ jsxs(ScrollWrapper, {
+		columnLayout,
+		className: "gridWrapper",
+		ref,
+		children: [/* @__PURE__ */ jsx(ScrollSizer, {
+			columnLayout,
+			totalColumnsWidth,
+			children
+		}), floatingChildren && /* @__PURE__ */ jsx(FloatPosition, { children: floatingChildren })]
+	});
 };
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import styled, { css } from '@xstyled/styled-components';
-var ScrollWrapper = styled.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  ", ";\n"], ["\n  ", ";\n"])), function (props) {
-    return props.columnLayout !== 'no-scroll' && css(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n      overflow-x: ", ";\n      position: relative;\n      @media (min-width: 1024px) {\n        overflow-x: auto;\n      }\n    "], ["\n      overflow-x: ", ";\n      position: relative;\n      @media (min-width: 1024px) {\n        overflow-x: auto;\n      }\n    "])), props.columnLayout === 'sticky' ? 'inherit' : 'auto');
-});
-var ScrollSizer = styled.div(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n  ", ";\n"], ["\n  ", ";\n"])), function (props) {
-    return props.columnLayout !== 'no-scroll' && css(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n      width: ", "px;\n    "], ["\n      width: ", "px;\n    "])), props.totalColumnsWidth);
-});
-var FloatPosition = styled.div(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n  position: sticky;\n  left: 0;\n"], ["\n  position: sticky;\n  left: 0;\n"])));
-var OversizedScroll = function (_a) {
-    var columnLayout = _a.columnLayout, children = _a.children, floatingChildren = _a.floatingChildren, totalColumnsWidth = _a.totalColumnsWidth, ref = _a.ref;
-    return (_jsxs(ScrollWrapper, { columnLayout: columnLayout, className: "gridWrapper", ref: ref, children: [_jsx(ScrollSizer, { columnLayout: columnLayout, totalColumnsWidth: totalColumnsWidth, children: children }), floatingChildren && _jsx(FloatPosition, { children: floatingChildren })] }));
-};
-export default OversizedScroll;
-var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5;
+//#endregion
+export { OversizedScroll as default };

package/ui/Blocks/CommonGrid/components/PresetsModalBody/components/TagRemove.d.ts

@@ -1 +1 @@
-export declare const TagRemove: import('styled-components').StyledComponent<"div", import('@xstyled/system').Theme, {}, never>;
+export declare const TagRemove: import("styled-components").StyledComponent<"div", import("@xstyled/styled-components").Theme, {}, never>;

package/ui/Blocks/CommonGrid/components/PresetsModalBody/components/TagRemove.js

@@ -1,7 +1,19 @@
-var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
-    if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
-    return cooked;
-};
-import { styled } from '@xstyled/styled-components';
-export var TagRemove = styled.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  cursor: pointer;\n  margin-left: 6px;\n  height: fit-content;\n  width: 17px;\n  display: flex;\n  align-items: center;\n  justify-content: flex-end;\n\n  &:hover {\n    svg {\n      fill: black;\n    }\n  }\n"], ["\n  cursor: pointer;\n  margin-left: 6px;\n  height: fit-content;\n  width: 17px;\n  display: flex;\n  align-items: center;\n  justify-content: flex-end;\n\n  &:hover {\n    svg {\n      fill: black;\n    }\n  }\n"])));
-var templateObject_1;
+import { styled } from "@xstyled/styled-components";
+//#region packages/ui/Blocks/CommonGrid/components/PresetsModalBody/components/TagRemove.tsx
+const TagRemove = styled.div`
+  cursor: pointer;
+  margin-left: 6px;
+  height: fit-content;
+  width: 17px;
+  display: flex;
+  align-items: center;
+  justify-content: flex-end;
+
+  &:hover {
+    svg {
+      fill: black;
+    }
+  }
+`;
+//#endregion
+export { TagRemove };

package/ui/Blocks/CommonGrid/components/PresetsModalBody/index.d.ts

@@ -1,6 +1,5 @@
-import { ChangeEvent, FC, MouseEvent, RefObject } from 'react';
-import { Filtering, GridPresets } from '../../types';
-
+import { type ChangeEvent, type FC, type MouseEvent, type RefObject } from 'react';
+import { type Filtering, type GridPresets } from '../../types';
 type PresetsModalBodyProps = {
     onOpenCreatePresetModal: () => void;
     gridPresets?: GridPresets;

package/ui/Blocks/CommonGrid/components/PresetsModalBody/index.js

@@ -1,32 +1,92 @@
-var __assign = (this && this.__assign) || function () {
-    __assign = Object.assign || function(t) {
-        for (var s, i = 1, n = arguments.length; i < n; i++) {
-            s = arguments[i];
-            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
-                t[p] = s[p];
-        }
-        return t;
-    };
-    return __assign.apply(this, arguments);
-};
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { useMemo } from 'react';
-import Button from '../../../../Elements/Button/Button';
-import { Cancel } from '../../../../Elements/Icon/icons/Cancel';
-import Tag from '../../../../Elements/Tag/Tag';
-import { palettes } from '../../../../Elements/Tag/palettes';
-import { H6 } from '../../../../Elements/Typography/Typography';
-import { TagRemove } from './components/TagRemove';
-import { Trans } from '@lingui/react';
-import { x } from '@xstyled/styled-components';
-import isEmpty from 'lodash/isEmpty';
-export var PresetsModalBody = function (_a) {
-    var onOpenCreatePresetModal = _a.onOpenCreatePresetModal, gridPresets = _a.gridPresets, handleSelectPreset = _a.handleSelectPreset, handleOpenDeletePresetModal = _a.handleOpenDeletePresetModal, selectedPresetName = _a.selectedPresetName, handleExportPresets = _a.handleExportPresets, handleImportButtonClick = _a.handleImportButtonClick, handleImportPresets = _a.handleImportPresets, fileInputRef = _a.fileInputRef, filters = _a.filters;
-    var presets = useMemo(function () { return Object.entries(gridPresets || {}); }, [gridPresets]);
-    var hasPresets = !!(presets === null || presets === void 0 ? void 0 : presets.length);
-    return (_jsxs(x.div, { children: [_jsx(x.div, { display: "flex", rowGap: "12px", flexWrap: "wrap", children: hasPresets ? (presets === null || presets === void 0 ? void 0 : presets.map(function (_a, index) {
-                    var presetName = _a[0], filters = _a[1];
-                    var isSelected = presetName === selectedPresetName;
-                    return (_jsxs(Tag, __assign({ size: "big", onClick: handleSelectPreset(presetName, filters) }, (isSelected ? palettes.redWhite : palettes.redRed), { pointer: true, children: [_jsx(H6, { mt: 0, mb: 0, variant: "semiBold", children: presetName }), _jsx(TagRemove, { onClick: handleOpenDeletePresetModal(presetName), children: _jsx(Cancel, { fill: isSelected ? 'white' : '#DB2B19', width: "11px", height: "11px" }) })] }), "".concat(presetName, "_").concat(index)));
-                })) : (_jsx(Trans, { id: "dataGrid.noPresets.title", message: "No presets available" })) }), _jsx(x.input, { type: "file", accept: ".json", onChange: handleImportPresets, ref: fileInputRef, display: "none" }), _jsxs(x.div, { display: "flex", mt: "34px", gap: "12px", justifyContent: "space-between", children: [_jsxs(x.div, { display: "flex", gap: "12px", children: [hasPresets && (_jsx(Button, { onClick: handleExportPresets, type: "button", appearance: "secondary", children: _jsx(Trans, { id: "dataGrid.exportPreset.title", message: "Export presets" }) })), _jsx(Button, { onClick: handleImportButtonClick, type: "button", appearance: "secondary", children: _jsx(Trans, { id: "dataGrid.importPreset.title", message: "Import presets" }) })] }), _jsx(Button, { type: "button", onClick: onOpenCreatePresetModal, disabled: isEmpty(filters), children: _jsx(Trans, { id: "dataGrid.createNewPreset.title", message: "Create new preset" }) })] })] }));
+import { Cancel } from "../../../../Elements/Icon/icons/Cancel.js";
+import Button from "../../../../Elements/Button/Button.js";
+import Tag from "../../../../Elements/Tag/Tag.js";
+import { palettes } from "../../../../Elements/Tag/palettes.js";
+import { H6 } from "../../../../Elements/Typography/Typography.js";
+import { TagRemove } from "./components/TagRemove.js";
+import { useMemo } from "react";
+import { x } from "@xstyled/styled-components";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { Trans } from "@lingui/react";
+import isEmpty from "lodash/isEmpty";
+//#region packages/ui/Blocks/CommonGrid/components/PresetsModalBody/index.tsx
+const PresetsModalBody = ({ onOpenCreatePresetModal, gridPresets, handleSelectPreset, handleOpenDeletePresetModal, selectedPresetName, handleExportPresets, handleImportButtonClick, handleImportPresets, fileInputRef, filters }) => {
+	const presets = useMemo(() => Object.entries(gridPresets || {}), [gridPresets]);
+	const hasPresets = !!presets?.length;
+	return /* @__PURE__ */ jsxs(x.div, { children: [
+		/* @__PURE__ */ jsx(x.div, {
+			display: "flex",
+			rowGap: "12px",
+			flexWrap: "wrap",
+			children: hasPresets ? presets?.map(([presetName, filters], index) => {
+				const isSelected = presetName === selectedPresetName;
+				return /* @__PURE__ */ jsxs(Tag, {
+					size: "big",
+					onClick: handleSelectPreset(presetName, filters),
+					...isSelected ? palettes.redWhite : palettes.redRed,
+					pointer: true,
+					children: [/* @__PURE__ */ jsx(H6, {
+						mt: 0,
+						mb: 0,
+						variant: "semiBold",
+						children: presetName
+					}), /* @__PURE__ */ jsx(TagRemove, {
+						onClick: handleOpenDeletePresetModal(presetName),
+						children: /* @__PURE__ */ jsx(Cancel, {
+							fill: isSelected ? "white" : "#DB2B19",
+							width: "11px",
+							height: "11px"
+						})
+					})]
+				}, `${presetName}_${index}`);
+			}) : /* @__PURE__ */ jsx(Trans, {
+				id: "dataGrid.noPresets.title",
+				message: "No presets available"
+			})
+		}),
+		/* @__PURE__ */ jsx(x.input, {
+			type: "file",
+			accept: ".json",
+			onChange: handleImportPresets,
+			ref: fileInputRef,
+			display: "none"
+		}),
+		/* @__PURE__ */ jsxs(x.div, {
+			display: "flex",
+			mt: "34px",
+			gap: "12px",
+			justifyContent: "space-between",
+			children: [/* @__PURE__ */ jsxs(x.div, {
+				display: "flex",
+				gap: "12px",
+				children: [hasPresets && /* @__PURE__ */ jsx(Button, {
+					onClick: handleExportPresets,
+					type: "button",
+					appearance: "secondary",
+					children: /* @__PURE__ */ jsx(Trans, {
+						id: "dataGrid.exportPreset.title",
+						message: "Export presets"
+					})
+				}), /* @__PURE__ */ jsx(Button, {
+					onClick: handleImportButtonClick,
+					type: "button",
+					appearance: "secondary",
+					children: /* @__PURE__ */ jsx(Trans, {
+						id: "dataGrid.importPreset.title",
+						message: "Import presets"
+					})
+				})]
+			}), /* @__PURE__ */ jsx(Button, {
+				type: "button",
+				onClick: onOpenCreatePresetModal,
+				disabled: isEmpty(filters),
+				children: /* @__PURE__ */ jsx(Trans, {
+					id: "dataGrid.createNewPreset.title",
+					message: "Create new preset"
+				})
+			})]
+		})
+	] });
 };
+//#endregion
+export { PresetsModalBody };

package/ui/Blocks/CommonGrid/components/QuickFilter/QuickFilter.d.ts

@@ -1,5 +1,4 @@
-import { ChangeEvent } from 'react';
-
+import { type ChangeEvent } from 'react';
 type QuickFilterProps = {
     searchedValue: string;
     placeholderText?: string;

package/ui/Blocks/CommonGrid/components/QuickFilter/QuickFilter.js

@@ -1,21 +1,31 @@
-var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
-    if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
-    return cooked;
-};
-import { jsx as _jsx } from "react/jsx-runtime";
-import Button from '../../../../Elements/Button';
-import Input from '../../../../Forms/Input';
-import styled, { x } from '@xstyled/styled-components';
-var StyledInput = styled(Input)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  position: ", ";\n  z-index: ", ";\n  width: auto;\n"], ["\n  position: ", ";\n  z-index: ", ";\n  width: auto;\n"])), function (_a) {
-    var isMobileInputView = _a.isMobileInputView;
-    return (isMobileInputView ? 'absolute' : 'relative');
-}, function (_a) {
-    var isMobileInputView = _a.isMobileInputView;
-    return (isMobileInputView ? '3' : '1');
+import Button_default from "../../../../Elements/Button/index.js";
+import Input_default from "../../../../Forms/Input/index.js";
+import styled$1, { x } from "@xstyled/styled-components";
+import { jsx } from "react/jsx-runtime";
+//#region packages/ui/Blocks/CommonGrid/components/QuickFilter/QuickFilter.tsx
+const StyledInput = styled$1(Input_default)`
+  position: ${({ isMobileInputView }) => isMobileInputView ? "absolute" : "relative"};
+  z-index: ${({ isMobileInputView }) => isMobileInputView ? "3" : "1"};
+  width: auto;
+`;
+const QuickFilter = ({ searchedValue, placeholderText, onChange, onClick, displayInput, onClear, isMobileInputView, alwaysShowClear }) => /* @__PURE__ */ jsx(x.div, {
+	mr: "12px",
+	children: displayInput ? /* @__PURE__ */ jsx(StyledInput, {
+		icon: "search",
+		type: "text",
+		value: searchedValue,
+		placeholder: placeholderText,
+		onChange,
+		variant: "gray",
+		onClear,
+		alwaysShowClear,
+		isMobileInputView
+	}) : /* @__PURE__ */ jsx(Button_default, {
+		variant: "icon",
+		appearance: "secondary",
+		icon: "search",
+		onClick
+	})
 });
-var QuickFilter = function (_a) {
-    var searchedValue = _a.searchedValue, placeholderText = _a.placeholderText, onChange = _a.onChange, onClick = _a.onClick, displayInput = _a.displayInput, onClear = _a.onClear, isMobileInputView = _a.isMobileInputView, alwaysShowClear = _a.alwaysShowClear;
-    return (_jsx(x.div, { mr: "12px", children: displayInput ? (_jsx(StyledInput, { icon: "search", type: "text", value: searchedValue, placeholder: placeholderText, onChange: onChange, variant: "gray", onClear: onClear, alwaysShowClear: alwaysShowClear, isMobileInputView: isMobileInputView })) : (_jsx(Button, { variant: "icon", appearance: "secondary", icon: "search", onClick: onClick })) }));
-};
-export default QuickFilter;
-var templateObject_1;
+//#endregion
+export { QuickFilter as default };

package/ui/Blocks/CommonGrid/components/QuickFilter/index.d.ts

@@ -1,3 +1,2 @@
-import { default as QuickFilter } from './QuickFilter';
-
+import QuickFilter from './QuickFilter';
 export default QuickFilter;

package/ui/Blocks/CommonGrid/components/QuickFilter/index.js

@@ -1,2 +1,5 @@
-import QuickFilter from './QuickFilter';
-export default QuickFilter;
+import QuickFilter from "./QuickFilter.js";
+//#region packages/ui/Blocks/CommonGrid/components/QuickFilter/index.tsx
+var QuickFilter_default = QuickFilter;
+//#endregion
+export { QuickFilter_default as default };

package/ui/Blocks/CommonGrid/components/Resize.d.ts

@@ -1,5 +1,4 @@
-import { FC } from 'react';
-
+import { type FC } from 'react';
 interface Resize {
     onResize: (width: number) => void;
     onResizeOver: () => void;

package/ui/Blocks/CommonGrid/components/Resize.js

@@ -1,33 +1,48 @@
-var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
-    if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
-    return cooked;
+import { useCallback } from "react";
+import styled$1 from "@xstyled/styled-components";
+import { jsx } from "react/jsx-runtime";
+//#region packages/ui/Blocks/CommonGrid/components/Resize.tsx
+const Resizer = styled$1.div`
+  height: 100%;
+  width: 7px;
+  cursor: col-resize;
+  position: absolute;
+  z-index: 2;
+  right: 0px;
+  top: 0px;
+  border-left: 1px dotted;
+  border-right: 1px dotted;
+  border-left-color: primary;
+  border-right-color: primary;
+  opacity: 0;
+  transition: opacity 0.6s;
+  &:hover {
+    opacity: 1;
+  }
+`;
+const Resize = ({ onResize, onResizeOver, onResizeOut }) => {
+	return /* @__PURE__ */ jsx(Resizer, {
+		className: "resizer",
+		onMouseDown: useCallback((downEvent) => {
+			if (downEvent?.button !== 0) return;
+			const initialPosX = downEvent?.pageX;
+			const handleMouseMove = (moveEvent) => {
+				onResize(moveEvent.pageX - initialPosX);
+			};
+			const handleMouseUp = (upEvent) => {
+				document.removeEventListener("mousemove", handleMouseMove);
+				document.removeEventListener("mouseup", handleMouseUp);
+				upEvent.stopPropagation();
+				upEvent.preventDefault();
+			};
+			document.addEventListener("mousemove", handleMouseMove);
+			document.addEventListener("mouseup", handleMouseUp);
+			downEvent.stopPropagation();
+			downEvent.preventDefault();
+		}, [onResize]),
+		onMouseOver: onResizeOver,
+		onMouseOut: onResizeOut
+	});
 };
-import { jsx as _jsx } from "react/jsx-runtime";
-import { useCallback } from 'react';
-import styled from '@xstyled/styled-components';
-var Resizer = styled.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  height: 100%;\n  width: 7px;\n  cursor: col-resize;\n  position: absolute;\n  z-index: 2;\n  right: 0px;\n  top: 0px;\n  border-left: 1px dotted;\n  border-right: 1px dotted;\n  border-left-color: primary;\n  border-right-color: primary;\n  opacity: 0;\n  transition: opacity 0.6s;\n  &:hover {\n    opacity: 1;\n  }\n"], ["\n  height: 100%;\n  width: 7px;\n  cursor: col-resize;\n  position: absolute;\n  z-index: 2;\n  right: 0px;\n  top: 0px;\n  border-left: 1px dotted;\n  border-right: 1px dotted;\n  border-left-color: primary;\n  border-right-color: primary;\n  opacity: 0;\n  transition: opacity 0.6s;\n  &:hover {\n    opacity: 1;\n  }\n"])));
-var Resize = function (_a) {
-    var onResize = _a.onResize, onResizeOver = _a.onResizeOver, onResizeOut = _a.onResizeOut;
-    var handleMouseDown = useCallback(function (downEvent) {
-        if ((downEvent === null || downEvent === void 0 ? void 0 : downEvent.button) !== 0) {
-            return;
-        }
-        var initialPosX = downEvent === null || downEvent === void 0 ? void 0 : downEvent.pageX;
-        var handleMouseMove = function (moveEvent) {
-            onResize(moveEvent.pageX - initialPosX);
-        };
-        var handleMouseUp = function (upEvent) {
-            document.removeEventListener('mousemove', handleMouseMove);
-            document.removeEventListener('mouseup', handleMouseUp);
-            upEvent.stopPropagation();
-            upEvent.preventDefault();
-        };
-        document.addEventListener('mousemove', handleMouseMove);
-        document.addEventListener('mouseup', handleMouseUp);
-        downEvent.stopPropagation();
-        downEvent.preventDefault();
-    }, [onResize]);
-    return _jsx(Resizer, { className: "resizer", onMouseDown: handleMouseDown, onMouseOver: onResizeOver, onMouseOut: onResizeOut });
-};
-export default Resize;
-var templateObject_1;
+//#endregion
+export { Resize as default };

package/ui/Blocks/CommonGrid/components/Table.d.ts

@@ -1,48 +1,48 @@
-export declare const Row: import('styled-components').StyledComponent<"div", import('@xstyled/system').Theme, {
-    hasRowClick?: boolean | undefined;
-    align?: string | undefined;
+export declare const Row: import("styled-components").StyledComponent<"div", import("@xstyled/styled-components").Theme, {
+    hasRowClick?: boolean;
+    align?: string;
 }, never>;
-export declare const Cell: import('styled-components').StyledComponent<"div", import('@xstyled/system').Theme, {
-    align?: string | undefined;
-    flexBasis?: number | undefined;
-    flexGrow?: number | undefined;
-    flexShrink?: number | undefined;
-    transition?: string | undefined;
-    transform?: string | undefined;
+export declare const Cell: import("styled-components").StyledComponent<"div", import("@xstyled/styled-components").Theme, {
+    align?: string;
+    flexBasis?: number;
+    flexGrow?: number;
+    flexShrink?: number;
+    transition?: string;
+    transform?: string;
 }, never>;
-export declare const StyledDataRow: import('styled-components').StyledComponent<"div", import('@xstyled/system').Theme, {
-    hasRowClick?: boolean | undefined;
-    align?: string | undefined;
+export declare const StyledDataRow: import("styled-components").StyledComponent<"div", import("@xstyled/styled-components").Theme, {
+    hasRowClick?: boolean;
+    align?: string;
 } & {
     isEven: boolean;
 }, never>;
-export declare const TextCell: import('styled-components').StyledComponent<"div", import('@xstyled/system').Theme, {
-    align?: string | undefined;
-    flexBasis?: number | undefined;
-    flexGrow?: number | undefined;
-    flexShrink?: number | undefined;
-    transition?: string | undefined;
-    transform?: string | undefined;
+export declare const TextCell: import("styled-components").StyledComponent<"div", import("@xstyled/styled-components").Theme, {
+    align?: string;
+    flexBasis?: number;
+    flexGrow?: number;
+    flexShrink?: number;
+    transition?: string;
+    transform?: string;
 }, never>;
-export declare const MessageCell: import('styled-components').StyledComponent<"div", import('@xstyled/system').Theme, {
-    align?: string | undefined;
-    flexBasis?: number | undefined;
-    flexGrow?: number | undefined;
-    flexShrink?: number | undefined;
-    transition?: string | undefined;
-    transform?: string | undefined;
+export declare const MessageCell: import("styled-components").StyledComponent<"div", import("@xstyled/styled-components").Theme, {
+    align?: string;
+    flexBasis?: number;
+    flexGrow?: number;
+    flexShrink?: number;
+    transition?: string;
+    transform?: string;
 }, never>;
 declare const variantColors: {
-    error: (props: import('@xstyled/util').Props<import('@xstyled/system').Theme>) => import('@xstyled/system').CSSScalar;
-    info: (props: import('@xstyled/util').Props<import('@xstyled/system').Theme>) => import('@xstyled/system').CSSScalar;
+    error: (props: import("@xstyled/util").Props<import("@xstyled/styled-components").Theme>) => import("@xstyled/styled-components").CSSScalar;
+    info: (props: import("@xstyled/util").Props<import("@xstyled/styled-components").Theme>) => import("@xstyled/styled-components").CSSScalar;
 };
-export declare const MessageCellBody: import('styled-components').StyledComponent<"div", import('@xstyled/system').Theme, {
-    align?: string | undefined;
-    flexBasis?: number | undefined;
-    flexGrow?: number | undefined;
-    flexShrink?: number | undefined;
-    transition?: string | undefined;
-    transform?: string | undefined;
+export declare const MessageCellBody: import("styled-components").StyledComponent<"div", import("@xstyled/styled-components").Theme, {
+    align?: string;
+    flexBasis?: number;
+    flexGrow?: number;
+    flexShrink?: number;
+    transition?: string;
+    transform?: string;
 } & {
     variant: keyof typeof variantColors;
 }, never>;