@antscorp/antsomi-ui 1.3.5-beta.52 → 1.3.5-beta.521

package/es/utils/templateListing.d.ts

@@ -1,2 +1,3 @@
-import { ObjectTemplate } from '../models/ObjectTemplate';
-export declare const getCategoriesFromObjectTemplate: (objectTemplate: ObjectTemplate) => {};
+import { ObjectTemplate, TObjectTemplate } from '../models/ObjectTemplate';
+export declare const getCategoriesFromObjectTemplate: (objectTemplate: ObjectTemplate | TObjectTemplate) => {};
+export declare const checkShowSkeletonBaseUrl: (url?: string) => boolean;

package/es/utils/templateListing.js

@@ -2,11 +2,31 @@
 import { TEMPLATE_CATEGORY_KEYS } from '../constants';
 export const getCategoriesFromObjectTemplate = (objectTemplate) => {
     const categories = {};
+    const cloneObjectTemplate = (objectTemplate.model
+        ? objectTemplate.model
+        : objectTemplate) || {};
     Object.values(TEMPLATE_CATEGORY_KEYS).forEach(key => {
-        var _a, _b, _c;
-        if (((_a = objectTemplate.model) === null || _a === void 0 ? void 0 : _a[key]) && ((_c = (_b = objectTemplate.model) === null || _b === void 0 ? void 0 : _b[key]) === null || _c === void 0 ? void 0 : _c.length)) {
-            categories[key] = objectTemplate.model[key];
+        var _a;
+        if (cloneObjectTemplate[key] && ((_a = cloneObjectTemplate[key]) === null || _a === void 0 ? void 0 : _a.length)) {
+            categories[key] = cloneObjectTemplate[key];
         }
     });
     return categories;
 };
+export const checkShowSkeletonBaseUrl = (url = '') => {
+    if (url.includes('type')) {
+        switch (true) {
+            case url.includes('type=media'):
+                return true;
+            case url.includes('type=email'):
+                return false;
+            case url.includes('type=tactic'):
+            default:
+                return false;
+        }
+    }
+    else {
+        return (`${url || ''}`.includes('base64-img') &&
+            ['jn_thumb_', 'v_thumb_'].every(prefix => !`${url || ''}`.includes(prefix)));
+    }
+};

package/es/utils/variables.d.ts

@@ -0,0 +1 @@
+export declare const breakdownMd: (style: any) => import("styled-components").FlattenSimpleInterpolation;

package/es/utils/variables.js

@@ -0,0 +1,9 @@
+import { css } from 'styled-components';
+export const breakdownMd = style => css `
+  /* @media (max-width: 1600px) {
+    ${style};
+  } */
+  ${style}/* @media (max-width: 1500px) {
+    ${style};
+  } */
+`;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@antscorp/antsomi-ui",
-  "version": "1.3.5-beta.52",
+  "version": "1.3.5-beta.521",
   "description": "An enterprise-class UI design language and React UI library.",
   "sideEffects": [
     "dist/*",
@@ -19,8 +19,7 @@
   "unpkg": "dist/index.js",
   "types": "es/index.d.ts",
   "scripts": {
-    "publish": "npm run clean && npm run build:es",
-    "build:es": "npm run copy-files && npm run ts-compile",
+    "build:es": "npm run clean && npm run copy-files && npm run ts-compile",
     "clean": "rimraf dist lib es",
     "dev": "vite",
     "build:dist": "webpack --config webpack.build.js",
@@ -28,8 +27,8 @@
     "eslint": "eslint --ext js,ts,tsx",
     "lint": "yarn run eslint src",
     "lint:fix": "yarn run eslint src --fix",
-    "storybook": "start-storybook -p 6006 -s public",
-    "build-storybook": "build-storybook",
+    "storybook": "storybook dev -p 6006",
+    "build-storybook": "storybook build",
     "serve-storybook": "serve storybook-static",
     "version": "auto-changelog -p && git add CHANGELOG.md",
     "test": "jest",
@@ -39,7 +38,8 @@
     "test:watch": "jest --watch",
     "test:coverage": "yarn test:clean && yarn jest --coverage",
     "ts-compile": "tsc -p tsconfig.esm.json",
-    "copy-files": "copyfiles -u 1 src/**/*.json src/**/*.svg src/**/*.scss src/**/*.png es"
+    "copy-files": "copyfiles -u 1 src/**/*.json src/**/*.svg src/**/*.scss src/**/*.png es",
+    "chromatic": "npx chromatic --project-token=chpt_23c659b2091917c"
   },
   "husky": {
     "hooks": {
@@ -59,27 +59,38 @@
     "not op_mini all"
   ],
   "dependencies": {
-    "@antscorp/icons": "0.27.6",
+    "@antscorp/icons": "latest",
     "@antscorp/image-editor": "1.0.2",
+    "@antscorp/processing-notification": "^1.0.3",
+    "@dnd-kit/core": "^6.1.0",
+    "@dnd-kit/modifiers": "^7.0.0",
+    "@dnd-kit/sortable": "^8.0.0",
+    "@dnd-kit/utilities": "^3.2.2",
     "@emotion/react": "^11.11.1",
     "@fortawesome/fontawesome-svg-core": "6.1.1",
     "@fortawesome/free-brands-svg-icons": "6.1.1",
     "@fortawesome/free-regular-svg-icons": "6.1.1",
     "@fortawesome/free-solid-svg-icons": "6.1.1",
     "@fortawesome/react-fontawesome": "0.2.0",
+    "@storybook/test": "^8.1.11",
     "@swiper/core": "^0.0.21",
     "@tanstack/react-query": "4.20.4",
     "@tanstack/react-query-devtools": "4.20.4",
     "@tinymce/tinymce-react": "^3.7.0",
     "@types/currency-formatter": "1.5.1",
+    "@types/react-custom-scrollbars": "^4.0.13",
+    "@types/react-frame-component": "^4.1.6",
+    "@types/react-router-dom": "^5.3.3",
+    "@types/react-window": "^1.8.8",
     "ace-builds": "1.4.14",
     "animate.css": "^4.1.1",
     "antd": "5.12.6",
     "axios": "^1.4.0",
     "babel-plugin-file-loader": "^2.0.0",
     "currency-formatter": "1.5.9",
-    "dayjs": "^1.11.10",
     "d3-interpolate": "^3.0.1",
+    "dayjs": "^1.11.10",
+    "fabric": "^5.3.0",
     "font-awesome": "4.7.0",
     "highlight.js": "^11.8.0",
     "html-entities": "^2.0.2",
@@ -88,6 +99,7 @@
     "i18next": "21.6.16",
     "i18next-browser-languagedetector": "6.1.2",
     "immer": "3.0.0",
+    "konva": "^9.3.6",
     "lodash": "^4.17.21",
     "moment": "2.29.2",
     "pako": "2.0.4",
@@ -95,19 +107,33 @@
     "react-ace": "9.5.0",
     "react-beautiful-dnd": "^13.1.1",
     "react-color": "2.19.3",
+    "react-cookie": "^7.1.4",
+    "react-custom-scrollbars": "^4.2.1",
     "react-draggable": "^4.4.5",
+    "react-frame-component": "^5.2.6",
+    "react-helmet": "^6.1.0",
+    "react-intersection-observer": "^9.10.3",
+    "react-konva": "^18.2.10",
     "react-markdown": "^8.0.7",
     "react-resizable": "^3.0.5",
+    "react-syntax-highlighter": "^15.5.0",
+    "react-virtualized-auto-sizer": "^1.0.24",
+    "react-window": "^1.8.10",
     "rehype-highlight": "^6.0.0",
     "remark-gfm": "^3.0.1",
+    "socket.io-client": "^4.7.5",
     "swiper": "^11.0.7",
     "ts-dedent": "^2.2.0",
-    "tui-image-editor": "^3.15.3"
+    "tui-image-editor": "^3.15.3",
+    "uniqid": "^5.4.0",
+    "use-context-selector": "^1.4.4",
+    "use-image": "^1.1.1",
+    "use-immer": "^0.9.0",
+    "zustand": "^4.5.2"
   },
   "devDependencies": {
     "@ant-design/cssinjs": "^1.6.2",
     "@antscorp/eslint-config-antsomi": "1.0.4",
-    "@antscorp/icons": "0.27.4",
     "@babel/cli": "^7.23.4",
     "@babel/core": "^7.21.3",
     "@babel/plugin-proposal-class-properties": "^7.18.6",
@@ -122,17 +148,21 @@
     "@babel/preset-env": "^7.20.2",
     "@babel/preset-react": "^7.18.6",
     "@babel/preset-typescript": "^7.23.3",
+    "@chromatic-com/storybook": "^1.6.1",
     "@commitlint/cli": "17.5.0",
     "@commitlint/config-conventional": "17.4.4",
-    "@storybook/addon-actions": "^6.5.16",
-    "@storybook/addon-essentials": "^6.5.16",
-    "@storybook/addon-interactions": "^6.5.16",
-    "@storybook/addon-links": "^6.5.16",
-    "@storybook/addon-postcss": "^2.0.0",
-    "@storybook/builder-webpack5": "^6.5.16",
-    "@storybook/manager-webpack5": "^6.5.16",
-    "@storybook/react": "^6.5.16",
-    "@storybook/testing-library": "^0.0.13",
+    "@storybook/addon-actions": "8.1.11",
+    "@storybook/addon-controls": "8.1.11",
+    "@storybook/addon-essentials": "8.1.11",
+    "@storybook/addon-interactions": "8.1.11",
+    "@storybook/addon-links": "8.1.11",
+    "@storybook/addon-styling-webpack": "^1.0.0",
+    "@storybook/addon-webpack5-compiler-babel": "^3.0.3",
+    "@storybook/blocks": "8.1.11",
+    "@storybook/manager-api": "8.1.11",
+    "@storybook/react": "8.1.11",
+    "@storybook/react-webpack5": "8.1.11",
+    "@storybook/theming": "8.1.11",
     "@testing-library/jest-dom": "^5.16.5",
     "@testing-library/react": "^14.0.0",
     "@types/jest": "^29.5.0",
@@ -141,6 +171,9 @@
     "@types/react": "^18.0.33",
     "@types/react-beautiful-dnd": "^13.1.8",
     "@types/react-dom": "^18.0.11",
+    "@types/react-helmet": "^6.1.11",
+    "@types/react-resizable": "^3.0.7",
+    "@types/react-syntax-highlighter": "^15.5.11",
     "@types/react-test-renderer": "^18.0.0",
     "@types/styled-components": "^5.1.26",
     "@typescript-eslint/eslint-plugin": "^5.55.0",
@@ -152,6 +185,7 @@
     "babel-plugin-import": "^1.13.8",
     "babel-plugin-module-resolver": "^5.0.0",
     "babel-plugin-styled-components": "^2.1.4",
+    "chromatic": "^11.3.0",
     "clsx": "^1.2.1",
     "copyfiles": "^2.4.1",
     "cross-env": "^7.0.3",
@@ -167,7 +201,7 @@
     "eslint-plugin-prettier": "^4.2.1",
     "eslint-plugin-react": "^7.32.2",
     "eslint-plugin-react-hooks": "^4.6.0",
-    "eslint-plugin-storybook": "^0.6.11",
+    "eslint-plugin-storybook": "^0.8.0",
     "file-loader": "^6.2.0",
     "husky": "^8.0.3",
     "jest": "^29.5.0",
@@ -181,8 +215,10 @@
     "react-dom": "18.2.0",
     "react-fast-compare": "^3.2.1",
     "react-i18next": "11.16.7",
+    "react-router-dom": "5.1.0 || 6.14.2",
     "sass": "^1.60.0",
     "sass-loader": "^13.2.2",
+    "storybook": "^8.1.11",
     "style-loader": "^3.3.2",
     "styled-components": "^5.3.9",
     "terser-webpack-plugin": "^5.3.7",
@@ -191,7 +227,7 @@
     "ts-node": "^10.9.1",
     "tsconfig-paths-webpack-plugin": "^4.0.1",
     "type-fest": "^4.10.2",
-    "typescript": "^4.9.4",
+    "typescript": "^5.4.3",
     "vite": "^4.2.1",
     "vite-plugin-mkcert": "^1.15.0",
     "webpack": "^5.78.0",
@@ -199,8 +235,8 @@
     "webpack-cli": "^5.0.1"
   },
   "peerDependencies": {
-    "@antscorp/icons": ">=0.27.5",
     "react": ">=16.9.0",
-    "react-dom": ">=16.9.0"
+    "react-dom": ">=16.9.0",
+    "react-router-dom": ">= 5.1.0"
   }
 }

package/es/components/common/ConfigProvider/ConfigProvider.js

@@ -1,59 +0,0 @@
-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 { StyleProvider } from '@ant-design/cssinjs';
-import { ConfigProvider as AntdConfigProvider, App } from 'antd';
-import dayjs from 'dayjs';
-import React, { useEffect } from 'react';
-import weekday from 'dayjs/plugin/weekday';
-import localeData from 'dayjs/plugin/localeData';
-/** dayjs plugins for timezone */
-import utc from 'dayjs/plugin/utc';
-import timezone from 'dayjs/plugin/timezone';
-// Constants
-import { THEME } from '@antscorp/antsomi-ui/es/constants';
-// Style
-import { GlobalStyle } from './GlobalStyle';
-import '@antscorp/antsomi-ui/es/assets/css/main.scss';
-// Initialize languages
-// import '@antscorp/antsomi-ui/es/locales/i18n';
-import i18next from '@antscorp/antsomi-ui/es/locales/i18n';
-import 'animate.css';
-// Providers
-import { QueryClientProviderAntsomiUI, QueryDevtoolsAntsomiUI, queryClientAntsomiUI, } from '@antscorp/antsomi-ui/es/queries';
-// NOTE: HOT fix DatePicker Advanced
-dayjs.extend(weekday);
-dayjs.extend(localeData);
-dayjs.extend(utc);
-dayjs.extend(timezone);
-const ConfigProvider = props => {
-    // Props
-    const { children, locale } = props, restOfProps = __rest(props, ["children", "locale"]);
-    // Effects
-    useEffect(() => {
-        if (locale) {
-            i18next.changeLanguage(locale);
-        }
-    }, [locale]);
-    return (React.createElement(AntdConfigProvider, Object.assign({}, restOfProps),
-        React.createElement(App, null,
-            React.createElement(QueryClientProviderAntsomiUI, { client: queryClientAntsomiUI },
-                React.createElement(GlobalStyle, null),
-                React.createElement(StyleProvider, { hashPriority: "high" }, children),
-                React.createElement(QueryDevtoolsAntsomiUI, null)))));
-};
-ConfigProvider.defaultProps = {
-    theme: THEME,
-    prefixCls: 'antsomi',
-    locale: 'en',
-};
-export default ConfigProvider;

package/es/components/common/index.d.ts

@@ -1 +0,0 @@
-export { ConfigProvider } from './ConfigProvider';

package/es/components/common/index.js

@@ -1 +0,0 @@
-export { ConfigProvider } from './ConfigProvider';

package/es/components/molecules/CalendarSelection/components/RangeSelectOptions/components/Option/styled.d.ts

@@ -1 +0,0 @@
-export declare const StyledMenu: any;

package/es/components/molecules/CalendarSelection/components/RangeSelectOptions/components/Option/styled.js

@@ -1,29 +0,0 @@
-import { Menu } from 'antd';
-import styled from 'styled-components';
-export const StyledMenu = styled(Menu) `
-  &.antsomi-menu-root {
-    .antsomi-menu-item {
-      position: relative;
-      color: black;
-      height: 32px;
-      line-height: 32px;
-      border-radius: 0;
-      width: 100%;
-      margin: 0;
-
-      &.antsomi-menu-item-selected {
-        font-weight: bold;
-
-        &:after {
-          content: '';
-          position: absolute;
-          left: 0;
-          top: 0;
-          width: 4px;
-          height: 100%;
-          background-color: #005fb8;
-        }
-      }
-    }
-  }
-`;