@antscorp/antsomi-ui 1.3.5-beta.13 → 1.3.5-beta.14

package/es/components/template/TemplateListing/components/CategoryListing/index.js

@@ -1,108 +1,108 @@
-var __rest = (this && this.__rest) || function (s, e) {
-    var t = {};
-    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
-        t[p] = s[p];
-    if (s != null && typeof Object.getOwnPropertySymbols === "function")
-        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
-            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
-                t[p[i]] = s[p[i]];
-        }
-    return t;
-};
-// Libraries
-import React, { memo, useCallback, useMemo } from 'react';
-import { isEmpty, isNumber } from 'lodash';
-import Icon from '@antscorp/icons';
-// Styled
-import { CustomLabelStyled, CustomRootLabel, MenuWrapper, TextWrapper } from './styled';
-// Components
-import { Checkbox } from '../../../../atoms';
-import { Menu } from '../../../../organism';
-// Utils
-import { handleError } from '@antscorp/antsomi-ui/es/utils';
-// Constants
-import { CATEGORY_LISTING_WITH } from '../../constants';
-const PATH = 'src/components/template/TemplateListing/components/CategoryListing/index.tsx';
-export const CategoryListing = memo(props => {
-    const { width = CATEGORY_LISTING_WITH, items = [], visible = true, checkedCategories = {}, onMenuChange } = props, restOfProps = __rest(props, ["width", "items", "visible", "checkedCategories", "onMenuChange"]);
-    // Handlers
-    const handleClickMenu = e => {
-        var _a;
-        try {
-            const { key, keyPath } = e;
-            const parentId = keyPath === null || keyPath === void 0 ? void 0 : keyPath[1];
-            if (parentId) {
-                const newCheckedCategories = ((_a = checkedCategories === null || checkedCategories === void 0 ? void 0 : checkedCategories[parentId]) === null || _a === void 0 ? void 0 : _a.includes(key))
-                    ? Object.assign(Object.assign({}, checkedCategories), { [parentId]: checkedCategories[parentId].filter(item => item !== key) }) : Object.assign(Object.assign({}, checkedCategories), { [parentId]: [...((checkedCategories === null || checkedCategories === void 0 ? void 0 : checkedCategories[parentId]) || []), key] });
-                onMenuChange === null || onMenuChange === void 0 ? void 0 : onMenuChange(newCheckedCategories);
-            }
-        }
-        catch (error) {
-            handleError(error, {
-                path: PATH,
-                name: 'handleClickMenu()',
-                args: { e },
-            });
-        }
-    };
-    // Render components
-    const renderCustomLabel = useCallback((args) => {
-        var _a;
-        try {
-            const { key, parentId, label, total } = args;
-            const isChecked = !!(!!parentId && ((_a = checkedCategories === null || checkedCategories === void 0 ? void 0 : checkedCategories[parentId]) === null || _a === void 0 ? void 0 : _a.includes(key)));
-            return (React.createElement(CustomLabelStyled, { onClick: e => e.preventDefault() },
-                React.createElement("div", { className: "label" },
-                    React.createElement(Checkbox, { checked: isChecked },
-                        React.createElement(TextWrapper, { ellipsis: { tooltip: label } }, label))),
-                React.createElement("span", { className: "total" }, isNumber(total) ? total : '')));
-        }
-        catch (error) {
-            handleError(error, {
-                path: PATH,
-                name: 'renderCustomLabel()',
-                args,
-            });
-            return null;
-        }
-    }, [checkedCategories]);
-    const getItem = useCallback((item, isRoot) => {
-        try {
-            const { key, label, children } = item;
-            return Object.assign(Object.assign(Object.assign({}, item), (isRoot
-                ? {
-                    label: (React.createElement(CustomRootLabel, null,
-                        React.createElement(TextWrapper, { ellipsis: { tooltip: label } }, label))),
-                }
-                : {})), { children: !!children && !isEmpty(children)
-                    ? children === null || children === void 0 ? void 0 : children.map(child => {
-                        const childItem = Object.assign(Object.assign({}, child), { parentId: key });
-                        return getItem(Object.assign(Object.assign({}, childItem), { label: renderCustomLabel(childItem) }));
-                    })
-                    : undefined });
-        }
-        catch (error) {
-            handleError(error, {
-                path: PATH,
-                name: 'getItem()',
-                args: { item, isRoot },
-            });
-            return undefined;
-        }
-    }, [renderCustomLabel]);
-    // Memo
-    const menuItems = useMemo(() => {
-        const menuItems = [];
-        items === null || items === void 0 ? void 0 : items.forEach((item, index) => {
-            if (index > 0)
-                menuItems.push({ type: 'divider' });
-            const menuItem = getItem(Object.assign(Object.assign({}, item), { parentId: null }), true);
-            if (menuItem)
-                menuItems.push(menuItem);
-        });
-        return menuItems;
-    }, [getItem, items]);
-    return visible ? (React.createElement(MenuWrapper, { "$width": width },
-        React.createElement(Menu, Object.assign({ items: menuItems, inlineIndent: 0, mode: "inline", defaultOpenKeys: items === null || items === void 0 ? void 0 : items.map(item => String(item.key)), expandIcon: React.createElement(Icon, { type: "icon-ants-expand-more", style: { fontSize: 20, color: '#595959' } }), onClick: handleClickMenu }, restOfProps)))) : null;
-});
-CategoryListing.displayName = 'CategoryListing';
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+// Libraries
+import React, { memo, useCallback, useMemo } from 'react';
+import { isEmpty, isNumber } from 'lodash';
+import Icon from '@antscorp/icons';
+// Styled
+import { CustomLabelStyled, CustomRootLabel, MenuWrapper, TextWrapper } from './styled';
+// Components
+import { Checkbox } from '../../../../atoms';
+import { Menu } from '../../../../organism';
+// Utils
+import { handleError } from '@antscorp/antsomi-ui/es/utils';
+// Constants
+import { CATEGORY_LISTING_WITH } from '../../constants';
+const PATH = 'src/components/template/TemplateListing/components/CategoryListing/index.tsx';
+export const CategoryListing = memo(props => {
+    const { width = CATEGORY_LISTING_WITH, items = [], visible = true, checkedCategories = {}, onMenuChange } = props, restOfProps = __rest(props, ["width", "items", "visible", "checkedCategories", "onMenuChange"]);
+    // Handlers
+    const handleClickMenu = e => {
+        var _a;
+        try {
+            const { key, keyPath } = e;
+            const parentId = keyPath === null || keyPath === void 0 ? void 0 : keyPath[1];
+            if (parentId) {
+                const newCheckedCategories = ((_a = checkedCategories === null || checkedCategories === void 0 ? void 0 : checkedCategories[parentId]) === null || _a === void 0 ? void 0 : _a.includes(key))
+                    ? Object.assign(Object.assign({}, checkedCategories), { [parentId]: checkedCategories[parentId].filter(item => item !== key) }) : Object.assign(Object.assign({}, checkedCategories), { [parentId]: [...((checkedCategories === null || checkedCategories === void 0 ? void 0 : checkedCategories[parentId]) || []), key] });
+                onMenuChange === null || onMenuChange === void 0 ? void 0 : onMenuChange(newCheckedCategories);
+            }
+        }
+        catch (error) {
+            handleError(error, {
+                path: PATH,
+                name: 'handleClickMenu()',
+                args: { e },
+            });
+        }
+    };
+    // Render components
+    const renderCustomLabel = useCallback((args) => {
+        var _a;
+        try {
+            const { key, parentId, label, total } = args;
+            const isChecked = !!(!!parentId && ((_a = checkedCategories === null || checkedCategories === void 0 ? void 0 : checkedCategories[parentId]) === null || _a === void 0 ? void 0 : _a.includes(key)));
+            return (React.createElement(CustomLabelStyled, { onClick: e => e.preventDefault() },
+                React.createElement("div", { className: "label" },
+                    React.createElement(Checkbox, { checked: isChecked },
+                        React.createElement(TextWrapper, { ellipsis: { tooltip: label } }, label))),
+                React.createElement("span", { className: "total" }, isNumber(total) ? total : '')));
+        }
+        catch (error) {
+            handleError(error, {
+                path: PATH,
+                name: 'renderCustomLabel()',
+                args,
+            });
+            return null;
+        }
+    }, [checkedCategories]);
+    const getItem = useCallback((item, isRoot) => {
+        try {
+            const { key, label, children } = item;
+            return Object.assign(Object.assign(Object.assign({}, item), (isRoot
+                ? {
+                    label: (React.createElement(CustomRootLabel, null,
+                        React.createElement(TextWrapper, { ellipsis: { tooltip: label } }, label))),
+                }
+                : {})), { children: !!children && !isEmpty(children)
+                    ? children === null || children === void 0 ? void 0 : children.map(child => {
+                        const childItem = Object.assign(Object.assign({}, child), { parentId: key });
+                        return getItem(Object.assign(Object.assign({}, childItem), { label: renderCustomLabel(childItem) }));
+                    })
+                    : undefined });
+        }
+        catch (error) {
+            handleError(error, {
+                path: PATH,
+                name: 'getItem()',
+                args: { item, isRoot },
+            });
+            return undefined;
+        }
+    }, [renderCustomLabel]);
+    // Memo
+    const menuItems = useMemo(() => {
+        const menuItems = [];
+        items === null || items === void 0 ? void 0 : items.forEach((item, index) => {
+            if (index > 0)
+                menuItems.push({ type: 'divider' });
+            const menuItem = getItem(Object.assign(Object.assign({}, item), { parentId: null }), true);
+            if (menuItem)
+                menuItems.push(menuItem);
+        });
+        return menuItems;
+    }, [getItem, items]);
+    return visible ? (React.createElement(MenuWrapper, { "$width": width },
+        React.createElement(Menu, Object.assign({ items: menuItems, inlineIndent: 0, mode: "inline", defaultOpenKeys: items === null || items === void 0 ? void 0 : items.map(item => String(item.key)), expandIcon: React.createElement(Icon, { type: "icon-ants-expand-more", style: { fontSize: 20, color: '#595959' } }), onClick: handleClickMenu }, restOfProps)))) : null;
+});
+CategoryListing.displayName = 'CategoryListing';

package/es/components/template/TemplateListing/components/CategoryListing/styled.d.ts

@@ -1,7 +1,7 @@
-/// <reference types="react" />
-export declare const MenuWrapper: import("styled-components").StyledComponent<"div", any, {
-    $width?: number | undefined;
-}, never>;
-export declare const CustomLabelStyled: import("styled-components").StyledComponent<"div", any, {}, never>;
-export declare const CustomRootLabel: import("styled-components").StyledComponent<"div", any, {}, never>;
-export declare const TextWrapper: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<import("antd/es/typography/Text").TextProps & import("react").RefAttributes<HTMLSpanElement>>, any, {}, never>;
+/// <reference types="react" />
+export declare const MenuWrapper: import("styled-components").StyledComponent<"div", any, {
+    $width?: number | undefined;
+}, never>;
+export declare const CustomLabelStyled: import("styled-components").StyledComponent<"div", any, {}, never>;
+export declare const CustomRootLabel: import("styled-components").StyledComponent<"div", any, {}, never>;
+export declare const TextWrapper: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<import("antd/es/typography/Text").TextProps & import("react").RefAttributes<HTMLSpanElement>>, any, {}, never>;

package/es/components/template/TemplateListing/components/CategoryListing/styled.js

@@ -1,77 +1,77 @@
-import styled from 'styled-components';
-import { Typography } from '../../../../atoms';
-const { Text } = Typography;
-export const MenuWrapper = styled.div `
-  width: ${({ $width }) => ($width !== undefined ? `${$width}px` : 'auto')};
-  overflow: auto;
-
-  .antsomi-menu {
-    height: 100%;
-
-    [role='menuitem'] {
-      width: 100%;
-      border-radius: 0;
-      height: 30px;
-      padding: 0 10px !important;
-      margin-left: 0 !important;
-      margin-right: 0 !important;
-
-      .antsomi-menu-title-content {
-        height: 100%;
-      }
-    }
-  }
-`;
-export const CustomLabelStyled = styled.div `
-  display: flex;
-  justify-content: space-between;
-  height: 100%;
-  align-items: center;
-
-  .label {
-    flex: 1 1 0%;
-    display: flex;
-    gap: 9px;
-    overflow: auto;
-
-    .antsomi-checkbox-wrapper {
-      width: 100%;
-      display: flex;
-      align-items: center;
-
-      .antsomi-checkbox-wrapper {
-        flex-shrink: 0;
-      }
-
-      span:nth-child(2) {
-        flex: 1 1 0%;
-        overflow: auto;
-      }
-    }
-  }
-
-  .total {
-    flex-shrink: 0;
-    font-size: 11px;
-    font-weight: 400;
-    color: #595959;
-    line-height: 1 !important;
-    height: fit-content;
-  }
-`;
-// TODO: tách class dùng chung
-export const CustomRootLabel = styled.div `
-  font-size: 11px;
-  font-weight: 400;
-  color: #595959;
-  height: 100%;
-  display: flex;
-  align-items: center;
-  padding-right: 20px;
-`;
-export const TextWrapper = styled(Text) `
-  max-width: 100%;
-  color: inherit;
-  height: fit-content;
-  font-size: inherit;
-`;
+import styled from 'styled-components';
+import { Typography } from '../../../../atoms';
+const { Text } = Typography;
+export const MenuWrapper = styled.div `
+  width: ${({ $width }) => ($width !== undefined ? `${$width}px` : 'auto')};
+  overflow: auto;
+
+  .antsomi-menu {
+    height: 100%;
+
+    [role='menuitem'] {
+      width: 100%;
+      border-radius: 0;
+      height: 30px;
+      padding: 0 10px !important;
+      margin-left: 0 !important;
+      margin-right: 0 !important;
+
+      .antsomi-menu-title-content {
+        height: 100%;
+      }
+    }
+  }
+`;
+export const CustomLabelStyled = styled.div `
+  display: flex;
+  justify-content: space-between;
+  height: 100%;
+  align-items: center;
+
+  .label {
+    flex: 1 1 0%;
+    display: flex;
+    gap: 9px;
+    overflow: auto;
+
+    .antsomi-checkbox-wrapper {
+      width: 100%;
+      display: flex;
+      align-items: center;
+
+      .antsomi-checkbox-wrapper {
+        flex-shrink: 0;
+      }
+
+      span:nth-child(2) {
+        flex: 1 1 0%;
+        overflow: auto;
+      }
+    }
+  }
+
+  .total {
+    flex-shrink: 0;
+    font-size: 11px;
+    font-weight: 400;
+    color: #595959;
+    line-height: 1 !important;
+    height: fit-content;
+  }
+`;
+// TODO: tách class dùng chung
+export const CustomRootLabel = styled.div `
+  font-size: 11px;
+  font-weight: 400;
+  color: #595959;
+  height: 100%;
+  display: flex;
+  align-items: center;
+  padding-right: 20px;
+`;
+export const TextWrapper = styled(Text) `
+  max-width: 100%;
+  color: inherit;
+  height: fit-content;
+  font-size: inherit;
+`;

package/es/components/template/TemplateListing/components/CategoryListing/types.d.ts

@@ -1,11 +1,11 @@
-/// <reference types="react" />
-import { MenuProps } from 'antd';
-import { TCategoryItemId } from '../../types';
-export type TMenuItem = Required<MenuProps>['items'][number];
-export type TItem = {
-    key: TCategoryItemId;
-    label: React.ReactNode | string;
-    total?: number;
-    children?: TItem[];
-    parentId?: string | number | null;
-};
+/// <reference types="react" />
+import { MenuProps } from 'antd';
+import { TCategoryItemId } from '../../types';
+export type TMenuItem = Required<MenuProps>['items'][number];
+export type TItem = {
+    key: TCategoryItemId;
+    label: React.ReactNode | string;
+    total?: number;
+    children?: TItem[];
+    parentId?: string | number | null;
+};

package/es/components/template/TemplateListing/components/CategoryListing/types.js

@@ -1 +1 @@
-export {};
+export {};

package/es/components/template/TemplateListing/components/index.d.ts

@@ -1,2 +1,2 @@
-export { BlankTemplate } from './BlankTemplate';
-export { CategoryListing } from './CategoryListing';
+export { BlankTemplate } from './BlankTemplate';
+export { CategoryListing } from './CategoryListing';

package/es/components/template/TemplateListing/components/index.js

@@ -1,2 +1,2 @@
-export { BlankTemplate } from './BlankTemplate';
-export { CategoryListing } from './CategoryListing';
+export { BlankTemplate } from './BlankTemplate';
+export { CategoryListing } from './CategoryListing';

package/es/components/template/TemplateListing/constants/defaultProps.d.ts

@@ -1,10 +1,10 @@
-import { ThumbnailCardProps } from '../../../molecules';
-import { BlankTemplateProps, CategoryListingProps, TemplateListingProps } from '../types';
-export declare const TEMPLATE_ITEM_WIDTH = 200;
-export declare const TEMPLATE_ITEM_HEIGHT = 200;
-export declare const CATEGORY_LISTING_WITH = 220;
-export declare const THUMBNAIL_URL = "https://st-media-template.antsomi.com/base64-img/37563.png";
-export declare const TEMPLATE_ITEM_DEFAULT: Omit<ThumbnailCardProps, 'id'>;
-export declare const BLANK_TEMPLATE_DEFAULT: BlankTemplateProps;
-export declare const CATEGORY_LISTING_DEFAULT: Omit<CategoryListingProps, 'items'>;
-export declare const TEMPLATE_LISTING_DEFAULT: TemplateListingProps;
+import { ThumbnailCardProps } from '../../../molecules';
+import { BlankTemplateProps, CategoryListingProps, TemplateListingProps } from '../types';
+export declare const TEMPLATE_ITEM_WIDTH = 200;
+export declare const TEMPLATE_ITEM_HEIGHT = 200;
+export declare const CATEGORY_LISTING_WITH = 220;
+export declare const THUMBNAIL_URL = "https://st-media-template.antsomi.com/base64-img/37563.png";
+export declare const TEMPLATE_ITEM_DEFAULT: Omit<ThumbnailCardProps, 'id'>;
+export declare const BLANK_TEMPLATE_DEFAULT: BlankTemplateProps;
+export declare const CATEGORY_LISTING_DEFAULT: Omit<CategoryListingProps, 'items'>;
+export declare const TEMPLATE_LISTING_DEFAULT: TemplateListingProps;

package/es/components/template/TemplateListing/constants/defaultProps.js

@@ -1,22 +1,22 @@
-export const TEMPLATE_ITEM_WIDTH = 200;
-export const TEMPLATE_ITEM_HEIGHT = 200;
-export const CATEGORY_LISTING_WITH = 220;
-export const THUMBNAIL_URL = 'https://st-media-template.antsomi.com/base64-img/37563.png';
-export const TEMPLATE_ITEM_DEFAULT = {
-    width: TEMPLATE_ITEM_WIDTH,
-    height: TEMPLATE_ITEM_HEIGHT,
-    removable: true,
-};
-export const BLANK_TEMPLATE_DEFAULT = { show: false };
-export const CATEGORY_LISTING_DEFAULT = {
-    width: CATEGORY_LISTING_WITH,
-    visible: true,
-    checkedCategories: {},
-    onMenuChange: () => { },
-};
-export const TEMPLATE_LISTING_DEFAULT = {
-    templateItems: [],
-    categoryItems: [],
-    templateItemProps: TEMPLATE_ITEM_DEFAULT,
-    blankTemplateProps: BLANK_TEMPLATE_DEFAULT,
-};
+export const TEMPLATE_ITEM_WIDTH = 200;
+export const TEMPLATE_ITEM_HEIGHT = 200;
+export const CATEGORY_LISTING_WITH = 220;
+export const THUMBNAIL_URL = 'https://st-media-template.antsomi.com/base64-img/37563.png';
+export const TEMPLATE_ITEM_DEFAULT = {
+    width: TEMPLATE_ITEM_WIDTH,
+    height: TEMPLATE_ITEM_HEIGHT,
+    removable: true,
+};
+export const BLANK_TEMPLATE_DEFAULT = { show: false };
+export const CATEGORY_LISTING_DEFAULT = {
+    width: CATEGORY_LISTING_WITH,
+    visible: true,
+    checkedCategories: {},
+    onMenuChange: () => { },
+};
+export const TEMPLATE_LISTING_DEFAULT = {
+    templateItems: [],
+    categoryItems: [],
+    templateItemProps: TEMPLATE_ITEM_DEFAULT,
+    blankTemplateProps: BLANK_TEMPLATE_DEFAULT,
+};

package/es/components/template/TemplateListing/constants/index.d.ts

@@ -1,2 +1,2 @@
-export * from './mockData';
-export * from './defaultProps';
+export * from './mockData';
+export * from './defaultProps';

package/es/components/template/TemplateListing/constants/index.js

@@ -1,2 +1,2 @@
-export * from './mockData';
-export * from './defaultProps';
+export * from './mockData';
+export * from './defaultProps';

package/es/components/template/TemplateListing/constants/mockData.d.ts

@@ -1,2 +1,2 @@
-import { TCategoryItem } from '../types';
-export declare const MENU_ITEMS_SAMPLE: TCategoryItem[];
+import { TCategoryItem } from '../types';
+export declare const MENU_ITEMS_SAMPLE: TCategoryItem[];