@mailstep/design-system 0.12.0-beta.1 → 0.13.0-beta.1

package/ui/{Blocks → Modules}/CommonGrid/hooks/useSelectPreset.js

@@ -1,6 +1,6 @@
 import { useCallback, useEffect } from "react";
 import isEqual from "lodash/isEqual";
-//#region packages/ui/Blocks/CommonGrid/hooks/useSelectPreset.ts
+//#region packages/ui/Modules/CommonGrid/hooks/useSelectPreset.ts
 const useSelectPreset = ({ gridName, gridActions, gridSelectors, setSelectedPresetName, onClosePresetsModal }) => {
 	const gridPresets = gridSelectors?.presets;
 	const filters = gridSelectors?.filter;

package/ui/{Blocks → Modules}/CommonGrid/hooks/useShareGrid.js

@@ -1,7 +1,7 @@
 import { buildShareUrl } from "../utils/shareUrl/buildShareUrl.js";
 import "../utils/shareUrl/index.js";
 import { useCallback, useEffect, useState } from "react";
-//#region packages/ui/Blocks/CommonGrid/hooks/useShareGrid.ts
+//#region packages/ui/Modules/CommonGrid/hooks/useShareGrid.ts
 const useShareGrid = ({ gridSelectors, columns }) => {
 	const [isCopied, setIsCopied] = useState(false);
 	useEffect(() => {

package/ui/{Blocks → Modules}/CommonGrid/hooks/useToggleAllCheckbox.js

@@ -1,5 +1,5 @@
 import { useCallback, useMemo } from "react";
-//#region packages/ui/Blocks/CommonGrid/hooks/useToggleAllCheckbox.ts
+//#region packages/ui/Modules/CommonGrid/hooks/useToggleAllCheckbox.ts
 const useToggleAllCheckbox = (rowsData, uxState, handleUxChange) => {
 	const allChecked = useMemo(() => rowsData && (rowsData || []).length >= 1 && rowsData.every((row) => uxState?.checkedRows?.[row.id]), [rowsData, uxState?.checkedRows]);
 	const toggleAllHandler = useCallback(() => {

package/ui/{Blocks → Modules}/CommonGrid/hooks/useUxReset.js

@@ -1,5 +1,5 @@
 import React from "react";
-//#region packages/ui/Blocks/CommonGrid/hooks/useUxReset.ts
+//#region packages/ui/Modules/CommonGrid/hooks/useUxReset.ts
 const useUxReset = (rowsData, uxState, clearUxState) => {
 	const [previous, setPrevious] = React.useState("|");
 	React.useEffect(() => {

package/ui/{Blocks → Modules}/CommonGrid/index.js

@@ -20,7 +20,7 @@ import store_default, { actionPrefix, actionTypes, createActions, createFullSele
 import CommonGridContainer from "./CommonGridContainer.js";
 import withReduxActions from "./HoC/withReduxActions.js";
 import useFloatingButton from "./hooks/useFloatingButton.js";
-//#region packages/ui/Blocks/CommonGrid/index.ts
+//#region packages/ui/Modules/CommonGrid/index.ts
 var CommonGrid_default = CommonGridContainer;
 //#endregion
 export { BoolIconCell, ButtonInCell, DateCell, DateTimeCell, EnumInCell, HoverBubble, IconButtonInCell, ImageCell, LinkInCell, RemoveCell, RowActionsCell, StringJoinCell, SwitchInCell, ToggleCell, types_exports as Types, actionPrefix, actionTypes, createActions, createFullSelector, createSelectors, CommonGrid_default as default, store_default as reducer, useAddFilter, useEvent, useFloatingButton, withReduxActions };

package/ui/{Blocks → Modules}/CommonGrid/store/index.js

@@ -3,7 +3,7 @@ import getOr from "lodash/fp/getOr";
 import omit from "lodash/omit";
 import produce from "immer";
 import { createSelector } from "reselect";
-//#region packages/ui/Blocks/CommonGrid/store/index.ts
+//#region packages/ui/Modules/CommonGrid/store/index.ts
 const initialState = {
 	page: 1,
 	presets: {},

package/ui/{Blocks → Modules}/CommonGrid/store/migrateState.js

@@ -1,4 +1,4 @@
-//#region packages/ui/Blocks/CommonGrid/store/migrateState.ts
+//#region packages/ui/Modules/CommonGrid/store/migrateState.ts
 const v2 = (draft) => {
 	Object.keys(draft).forEach((gridName) => {
 		if (draft[gridName].columnConfig && Array.isArray(draft[gridName].columnConfig)) draft[gridName].columnConfig = {};

package/ui/{Blocks → Modules}/CommonGrid/storybook/components/ComplexCell.js

@@ -1,6 +1,6 @@
 import { useCallback } from "react";
 import { jsxs } from "react/jsx-runtime";
-//#region packages/ui/Blocks/CommonGrid/storybook/components/ComplexCell.tsx
+//#region packages/ui/Modules/CommonGrid/storybook/components/ComplexCell.tsx
 const ComplexCell = (props) => {
 	return /* @__PURE__ */ jsxs("button", {
 		onClick: useCallback(() => {

package/ui/{Blocks → Modules}/CommonGrid/storybook/components/EnumCellExample.js

@@ -1,6 +1,6 @@
 import { EnumInCell } from "../../components/gridCells/EnumInCell.js";
 import { jsx } from "react/jsx-runtime";
-//#region packages/ui/Blocks/CommonGrid/storybook/components/EnumCellExample.tsx
+//#region packages/ui/Modules/CommonGrid/storybook/components/EnumCellExample.tsx
 const packagingTypeAppearance = {
 	"option A": "neutralSubtle",
 	"option B": "orangeSubtle",

package/ui/{Blocks → Modules}/CommonGrid/storybook/utils/actions.js

@@ -1,4 +1,4 @@
-//#region packages/ui/Blocks/CommonGrid/storybook/utils/actions.ts
+//#region packages/ui/Modules/CommonGrid/storybook/utils/actions.ts
 const onRowEditClick = (id, props) => console.log("onRowEditClick", id, props);
 const onRowReadClick = (id, props) => console.log("onRowReadClick", id, props);
 const onRowAction = (id, field, value) => console.log("onRowAction", id, field, value);

package/ui/{Blocks → Modules}/CommonGrid/storybook/utils/columnDefinition.js

@@ -1,7 +1,7 @@
 import { ComplexCell } from "../components/ComplexCell.js";
 import { EnumCellExample } from "../components/EnumCellExample.js";
 import { enumValues } from "./utils.js";
-//#region packages/ui/Blocks/CommonGrid/storybook/utils/columnDefinition.tsx
+//#region packages/ui/Modules/CommonGrid/storybook/utils/columnDefinition.tsx
 const oversizedArrayColumns = 25;
 const oversizedColumnDefinition = new Array(25).fill(null).map((unused, index) => ({
 	name: `column_${index}`,

package/ui/{Blocks → Modules}/CommonGrid/storybook/utils/utils.js

@@ -4,7 +4,7 @@ import withReduxActions from "../../HoC/withReduxActions.js";
 import React from "react";
 import { jsx } from "react/jsx-runtime";
 import faker from "faker";
-//#region packages/ui/Blocks/CommonGrid/storybook/utils/utils.tsx
+//#region packages/ui/Modules/CommonGrid/storybook/utils/utils.tsx
 const enumValues = [
 	"option A",
 	"option B",

package/ui/{Blocks → Modules}/CommonGrid/storybook/utils/withRedux.js

@@ -2,7 +2,7 @@ import store_default from "../../store/index.js";
 import { jsx } from "react/jsx-runtime";
 import { Provider } from "react-redux";
 import { combineReducers, compose, createStore } from "redux";
-//#region packages/ui/Blocks/CommonGrid/storybook/utils/withRedux.tsx
+//#region packages/ui/Modules/CommonGrid/storybook/utils/withRedux.tsx
 const reduxComposeEnhancer = window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__ || compose;
 const withProvider = (story) => {
 	return /* @__PURE__ */ jsx(Provider, {

package/ui/{Blocks → Modules}/CommonGrid/storybook/utils/withRouter.js

@@ -1,7 +1,7 @@
 import "react";
 import { jsx } from "react/jsx-runtime";
 import { MemoryRouter } from "react-router";
-//#region packages/ui/Blocks/CommonGrid/storybook/utils/withRouter.tsx
+//#region packages/ui/Modules/CommonGrid/storybook/utils/withRouter.tsx
 const withProvider = (story) => /* @__PURE__ */ jsx(MemoryRouter, { children: story() });
 //#endregion
 export { withProvider as default };

package/ui/{Blocks → Modules}/CommonGrid/storybook/utils/withTheme.js

@@ -1,4 +1,4 @@
-//#region packages/ui/Blocks/CommonGrid/storybook/utils/withTheme.tsx
+//#region packages/ui/Modules/CommonGrid/storybook/utils/withTheme.tsx
 const withProvider = (story) => story();
 //#endregion
 export { withProvider as default };

package/ui/{Blocks → Modules}/CommonGrid/styles.js

@@ -2,7 +2,7 @@ import "./utils/constants.js";
 import CommonGrid from "./CommonGrid.js";
 import styled$1, { x } from "@xstyled/styled-components";
 import { th as th$1 } from "@xstyled/system";
-//#region packages/ui/Blocks/CommonGrid/styles.tsx
+//#region packages/ui/Modules/CommonGrid/styles.tsx
 const BottomWrapper = styled$1(x.div)`
   position: relative;
   z-index: 2;

package/ui/{Blocks → Modules}/CommonGrid/types.js

@@ -1,5 +1,5 @@
 import { __exportAll } from "../../_virtual/_rolldown/runtime.js";
-//#region packages/ui/Blocks/CommonGrid/types.ts
+//#region packages/ui/Modules/CommonGrid/types.ts
 var types_exports = /* @__PURE__ */ __exportAll({
 	EditReadPosition: () => EditReadPosition,
 	ExtraControlButtonPosition: () => ExtraControlButtonPosition,

package/ui/{Blocks → Modules}/CommonGrid/utils/constants.js

@@ -1,4 +1,4 @@
-//#region packages/ui/Blocks/CommonGrid/utils/constants.ts
+//#region packages/ui/Modules/CommonGrid/utils/constants.ts
 const rowsPerPageOptions = [
 	{
 		value: 10,

package/ui/{Blocks → Modules}/CommonGrid/utils/getExtendedExtraControlButtons.js

@@ -2,7 +2,7 @@ import { Reload } from "../../../Elements/Icon/icons/Reload.js";
 import "../types.js";
 import { jsx } from "react/jsx-runtime";
 import compact from "lodash/compact";
-//#region packages/ui/Blocks/CommonGrid/utils/getExtendedExtraControlButtons.tsx
+//#region packages/ui/Modules/CommonGrid/utils/getExtendedExtraControlButtons.tsx
 const getExtendedExtraControlButtons = (extraControlButtons, onReload) => compact([onReload && {
 	onClick: onReload,
 	label: /* @__PURE__ */ jsx(Reload, {

package/ui/{Blocks → Modules}/CommonGrid/utils/getRowsPerPage.js

@@ -1,5 +1,5 @@
 import "./constants.js";
-//#region packages/ui/Blocks/CommonGrid/utils/getRowsPerPage.ts
+//#region packages/ui/Modules/CommonGrid/utils/getRowsPerPage.ts
 const getRowsPerPage = (ref, withPagination, withButtonStrip, hasGroupsOrFilters) => {
 	const containerHeight = ref?.current?.clientHeight;
 	const gridHeaderHeight = 40 + (hasGroupsOrFilters ? 39 : 0) + (withButtonStrip ? 75 : 0);

package/ui/{Blocks → Modules}/CommonGrid/utils/hasSortTerminated.js

@@ -1,4 +1,4 @@
-//#region packages/ui/Blocks/CommonGrid/utils/hasSortTerminated.ts
+//#region packages/ui/Modules/CommonGrid/utils/hasSortTerminated.ts
 const hasSortTerminated = ({ allowSortingOnlyUnderTotalRows, totalRowsCount }) => {
 	const allowSorting = allowSortingOnlyUnderTotalRows && totalRowsCount;
 	return {

package/ui/{Blocks → Modules}/CommonGrid/utils/index.js

@@ -5,7 +5,7 @@ import DatePickerRange_default from "../components/Filters/DatePickerRange/index
 import NumberRange_default from "../components/Filters/NumberRange/index.js";
 import TextRange_default from "../components/Filters/TextRange/index.js";
 import sum from "lodash/sum";
-//#region packages/ui/Blocks/CommonGrid/utils/index.ts
+//#region packages/ui/Modules/CommonGrid/utils/index.ts
 const isDefined = (val) => typeof val !== "undefined";
 const getCellSizeProps = (column, columnWidth) => {
 	if (!column) return {};
@@ -38,7 +38,8 @@ const calculatePaginator = (page, rowsPerPage) => ({
 const ROW_NUMBER_DIGIT_WIDTH = 8;
 const CHECKBOX_WIDTH = 18;
 const ICON_BUTTON_WIDTH = 20;
-const ACTIONS_CELL_GAP = 12;
+const ACTIONS_CELL_GAP_WITH_ROW_NUMBERS = 12;
+const ACTIONS_CELL_GAP = 18;
 const ACTIONS_CELL_PADDING = 16;
 const getRowNumbersExtraWidth = (maxRowNumber = 0) => {
 	return String(maxRowNumber).length * ROW_NUMBER_DIGIT_WIDTH;
@@ -50,7 +51,8 @@ const getActionsColumnExtraWidth = ({ addRowNumbers, withCheckboxes, canRowEdit,
 	if (addRowNumbers) parts.push(getRowNumbersExtraWidth(maxRowNumber));
 	if (hasActionIcon) parts.push(ICON_BUTTON_WIDTH);
 	if (!parts.length) return 0;
-	const gaps = (parts.length - 1) * ACTIONS_CELL_GAP;
+	const gap = addRowNumbers ? ACTIONS_CELL_GAP_WITH_ROW_NUMBERS : ACTIONS_CELL_GAP;
+	const gaps = (parts.length - 1) * gap;
 	parts.push(ACTIONS_CELL_PADDING);
 	return sum(parts) + gaps;
 };

package/ui/{Blocks → Modules}/CommonGrid/utils/shareUrl/buildShareUrl.js

@@ -1,6 +1,6 @@
 import { getFilterName } from "../index.js";
 import { FILTERS_PARAM, SORT_PARAM } from "./constants.js";
-//#region packages/ui/Blocks/CommonGrid/utils/shareUrl/buildShareUrl.ts
+//#region packages/ui/Modules/CommonGrid/utils/shareUrl/buildShareUrl.ts
 const enc = (value) => encodeURIComponent(value).replace(/\(/g, "%28").replace(/\)/g, "%29");
 const serializeValue = (value) => {
 	if (value == null || value === "") return null;

package/ui/{Blocks → Modules}/CommonGrid/utils/shareUrl/clearShareParams.js

@@ -1,5 +1,5 @@
 import { FILTERS_PARAM, SORT_PARAM } from "./constants.js";
-//#region packages/ui/Blocks/CommonGrid/utils/shareUrl/clearShareParams.ts
+//#region packages/ui/Modules/CommonGrid/utils/shareUrl/clearShareParams.ts
 const clearShareParams = () => {
 	const url = new URL(window.location.href);
 	if (!["gridFilters", "gridSort"].some((key) => url.searchParams.has(key))) return;

package/ui/{Blocks → Modules}/CommonGrid/utils/shareUrl/constants.js

@@ -1,4 +1,4 @@
-//#region packages/ui/Blocks/CommonGrid/utils/shareUrl/constants.ts
+//#region packages/ui/Modules/CommonGrid/utils/shareUrl/constants.ts
 const FILTERS_PARAM = "gridFilters";
 const SORT_PARAM = "gridSort";
 const GROUP_SEPARATOR = "-";

package/ui/{Blocks → Modules}/CommonGrid/utils/shareUrl/parseSharedGridState.js

@@ -1,6 +1,6 @@
 import { createFilterType, getFilterName } from "../index.js";
 import { FILTERS_PARAM, SORT_PARAM } from "./constants.js";
-//#region packages/ui/Blocks/CommonGrid/utils/shareUrl/parseSharedGridState.ts
+//#region packages/ui/Modules/CommonGrid/utils/shareUrl/parseSharedGridState.ts
 const dec = decodeURIComponent;
 const reconstructValue = (type, column, valuePart, comparator, labels) => {
 	if (type === "options") {

package/ui/index.d.ts

@@ -1,4 +1,4 @@
-import CommonGrid from './Blocks/CommonGrid';
+import CommonGrid from './Modules/CommonGrid';
 import CornerDialog from './Blocks/CornerDialog';
 import ImageList from './Blocks/ImageList';
 import LanguageSwitch from './Blocks/LanguageSwitch';
@@ -82,7 +82,7 @@ export * from './Forms/RadioButton';
 export * from './ThemeProvider';
 export * from './utils';
 export * from './Elements/DatePicker';
-export * from './Blocks/CommonGrid';
+export * from './Modules/CommonGrid';
 export * from './Blocks/Popover';
 export * from './Elements/SingleSelect';
 export * from './Elements/Select';

package/ui/index.js

@@ -136,32 +136,32 @@ import SingleSelect_default from "./Elements/SingleSelect/index.js";
 import { DatePickerRepeat, TimePickerRepeat } from "./Elements/DatePicker/Datetime/types.js";
 import Input_default from "./Forms/Input/index.js";
 import DatePicker_default from "./Elements/DatePicker/index.js";
-import { useEvent } from "./Blocks/CommonGrid/hooks/useEvent.js";
-import { useAddFilter } from "./Blocks/CommonGrid/hooks/useAddFilter.js";
-import { types_exports } from "./Blocks/CommonGrid/types.js";
+import { useEvent } from "./Modules/CommonGrid/hooks/useEvent.js";
+import { useAddFilter } from "./Modules/CommonGrid/hooks/useAddFilter.js";
+import { types_exports } from "./Modules/CommonGrid/types.js";
 import { Portal } from "./Elements/Portal/index.js";
 import Popover from "./Blocks/Popover/index.js";
 import { CustomSelectButton } from "./Elements/DropdownSelect/DropdownSelect.js";
 import DropdownSelect_default from "./Elements/DropdownSelect/index.js";
-import { DateCell } from "./Blocks/CommonGrid/components/gridCells/Date.js";
-import { DateTimeCell } from "./Blocks/CommonGrid/components/gridCells/DateTime.js";
-import { StringJoinCell } from "./Blocks/CommonGrid/components/gridCells/StringJoin.js";
-import { BoolIconCell } from "./Blocks/CommonGrid/components/gridCells/BoolIcon.js";
-import { RemoveCell } from "./Blocks/CommonGrid/components/gridCells/RemoveItem.js";
+import { DateCell } from "./Modules/CommonGrid/components/gridCells/Date.js";
+import { DateTimeCell } from "./Modules/CommonGrid/components/gridCells/DateTime.js";
+import { StringJoinCell } from "./Modules/CommonGrid/components/gridCells/StringJoin.js";
+import { BoolIconCell } from "./Modules/CommonGrid/components/gridCells/BoolIcon.js";
+import { RemoveCell } from "./Modules/CommonGrid/components/gridCells/RemoveItem.js";
 import SimpleLink_default from "./Elements/SimpleLink/index.js";
-import { LinkInCell } from "./Blocks/CommonGrid/components/gridCells/LinkInCell.js";
-import { ButtonInCell } from "./Blocks/CommonGrid/components/gridCells/ButtonInCell.js";
-import { IconButtonInCell } from "./Blocks/CommonGrid/components/gridCells/IconButtonInCell.js";
-import { SwitchInCell } from "./Blocks/CommonGrid/components/gridCells/SwitchInCell.js";
-import { ImageCell } from "./Blocks/CommonGrid/components/gridCells/ImageCell.js";
-import { EnumInCell } from "./Blocks/CommonGrid/components/gridCells/EnumInCell.js";
-import { HoverBubble } from "./Blocks/CommonGrid/components/gridCells/HoverBubble.js";
-import { RowActionsCell } from "./Blocks/CommonGrid/components/gridCells/RowActionsCell.js";
-import { ToggleCell } from "./Blocks/CommonGrid/components/gridCells/ToggleCell.js";
-import store_default, { actionPrefix, actionTypes, createActions, createFullSelector, createSelectors } from "./Blocks/CommonGrid/store/index.js";
-import withReduxActions from "./Blocks/CommonGrid/HoC/withReduxActions.js";
-import useFloatingButton from "./Blocks/CommonGrid/hooks/useFloatingButton.js";
-import CommonGrid_default from "./Blocks/CommonGrid/index.js";
+import { LinkInCell } from "./Modules/CommonGrid/components/gridCells/LinkInCell.js";
+import { ButtonInCell } from "./Modules/CommonGrid/components/gridCells/ButtonInCell.js";
+import { IconButtonInCell } from "./Modules/CommonGrid/components/gridCells/IconButtonInCell.js";
+import { SwitchInCell } from "./Modules/CommonGrid/components/gridCells/SwitchInCell.js";
+import { ImageCell } from "./Modules/CommonGrid/components/gridCells/ImageCell.js";
+import { EnumInCell } from "./Modules/CommonGrid/components/gridCells/EnumInCell.js";
+import { HoverBubble } from "./Modules/CommonGrid/components/gridCells/HoverBubble.js";
+import { RowActionsCell } from "./Modules/CommonGrid/components/gridCells/RowActionsCell.js";
+import { ToggleCell } from "./Modules/CommonGrid/components/gridCells/ToggleCell.js";
+import store_default, { actionPrefix, actionTypes, createActions, createFullSelector, createSelectors } from "./Modules/CommonGrid/store/index.js";
+import withReduxActions from "./Modules/CommonGrid/HoC/withReduxActions.js";
+import useFloatingButton from "./Modules/CommonGrid/hooks/useFloatingButton.js";
+import CommonGrid_default from "./Modules/CommonGrid/index.js";
 import CornerDialog_default from "./Blocks/CornerDialog/index.js";
 import Modal_default from "./Blocks/Modal/index.js";
 import { useLightBox } from "./Blocks/LightBox/hooks/useLightBox.js";