@antscorp/antsomi-ui 2.0.13 → 2.0.15

package/es/test.js

@@ -1,12 +1,14 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 /* eslint-disable @typescript-eslint/no-unused-vars */
-import React, { useState } from 'react';
+import { useState } from 'react';
 import { createRoot } from 'react-dom/client';
 import '@antscorp/icons/main.css';
-import { Button, RequiredLabel, Login, } from './components';
+import { Button, RequiredLabel, } from './components';
 // Queries configs
 import { queryClientAntsomiUI, QueryClientProviderAntsomiUI } from './queries';
 import { ConfigProvider } from './providers';
 import { MatchesAnySelectTest } from './tests';
+import { AdvancedPicker } from './components/molecules/DatePicker/components/AdvancedPicker';
 export const BACKGROUND_COLOR_STYLE = {
     SOLID: {
         value: 'color',
@@ -114,7 +116,10 @@ export const App = () => {
             case 'ON_ADD_NEW_PRESET':
                 // eslint-disable-next-line no-case-declarations
                 const { customColors = [] } = dataIn;
-                setColorSettingState(prev => (Object.assign(Object.assign({}, prev), { customColors })));
+                setColorSettingState(prev => ({
+                    ...prev,
+                    customColors,
+                }));
                 break;
             case 'ON_EDIT_CLICKED': {
                 // eslint-disable-next-line no-console
@@ -126,7 +131,10 @@ export const App = () => {
         }
     };
     const handleChangeColorSetting = (colorOut) => {
-        setColorSettingState(prev => (Object.assign(Object.assign({}, prev), { color: colorOut })));
+        setColorSettingState(prev => ({
+            ...prev,
+            color: colorOut,
+        }));
     };
     const handleChangeRadio = e => {
         const { value = '' } = e.target;
@@ -152,14 +160,12 @@ export const App = () => {
     //   apiDomain: '//sandbox-permission.ants.vn',
     // };
     /* Login */
-    return React.createElement(Login, Object.assign({}, d));
+    return (_jsx(AdvancedPicker, { timezone: "Australia/Brisbane", disableBeforeDate: "2024-09-05", format: "YYYY-MM-DD HH:mm:ss", valueType: "YEAR_MONTH_DAY_SECOND" }));
+    // return <Login {...d} />;
     /* MatchesAnySelect */
-    return React.createElement(MatchesAnySelectTest, null);
+    return _jsx(MatchesAnySelectTest, {});
     /* Data Table */
-    return (React.createElement("div", null,
-        React.createElement(RequiredLabel, null, "this is Required"),
-        "THIS IS TEST VITE BUILD",
-        React.createElement(Button, null, "Click me")));
+    return (_jsxs("div", { children: [_jsx(RequiredLabel, { children: "this is Required" }), "THIS IS TEST VITE BUILD", _jsx(Button, { children: "Click me" })] }));
     // return <DataTableTest />;
     // --------------------------- Test Layout 2.0 -------------------------------------------
     // return (
@@ -436,6 +442,4 @@ export const App = () => {
 };
 const container = document.getElementById('root');
 const root = createRoot(container);
-root.render(React.createElement(QueryClientProviderAntsomiUI, { client: queryClientAntsomiUI },
-    React.createElement(ConfigProvider, { locale: "en" },
-        React.createElement(App, null))));
+root.render(_jsx(QueryClientProviderAntsomiUI, { client: queryClientAntsomiUI, children: _jsx(ConfigProvider, { locale: "en", children: _jsx(App, {}) }) }));

package/es/tests/DataTableTest.js

@@ -1,5 +1,4 @@
-// Libraries
-import React from 'react';
+import { jsx as _jsx } from "react/jsx-runtime";
 import { BrowserRouter } from 'react-router-dom';
 // Components
 import { DataTable } from '../components/organism/DataTable';
@@ -42,9 +41,8 @@ export const DataTableTest = () => {
                     general: {
                         url: `https://sandbox-survey.antsomi.com/api/v1/survey/filter/get-value-matches-any`,
                         params(filterItem) {
-                            var _a;
                             return {
-                                metric_code: (_a = filterItem === null || filterItem === void 0 ? void 0 : filterItem.column) === null || _a === void 0 ? void 0 : _a.toString().toLowerCase(),
+                                metric_code: filterItem?.column?.toString().toLowerCase(),
                             };
                         },
                     },
@@ -79,7 +77,7 @@ export const DataTableTest = () => {
                 return `/survey/${record.survey_id}`;
             },
             formatData(response) {
-                return (response === null || response === void 0 ? void 0 : response.body) || [];
+                return response?.body || [];
             },
         },
         queryOptions: {
@@ -91,7 +89,7 @@ export const DataTableTest = () => {
             matchesAny: {
                 general: {
                     formatData(response) {
-                        return response === null || response === void 0 ? void 0 : response.rows.map(record => ({
+                        return response?.rows.map(record => ({
                             key: record.value,
                             title: record.label,
                         }));
@@ -99,7 +97,7 @@ export const DataTableTest = () => {
                 },
                 survey_id: {
                     formatData(response) {
-                        return response === null || response === void 0 ? void 0 : response.body.map(record => ({
+                        return response?.body.map(record => ({
                             key: record.survey_id,
                             title: record.survey_id,
                         }));
@@ -123,9 +121,7 @@ export const DataTableTest = () => {
             expandColumnKey: 'survey_name',
         },
     });
-    return (React.createElement(BrowserRouter, null,
-        React.createElement(TableTestWrapper, null,
-            React.createElement(DataTable, { table: table, filter: filter, toolbar: {
+    return (_jsx(BrowserRouter, { children: _jsx(TableTestWrapper, { children: _jsx(DataTable, { table: table, filter: filter, toolbar: {
                     actionButtons: {
                         SEARCH: search,
                         COLUMN: modifyColumn,
@@ -145,5 +141,5 @@ export const DataTableTest = () => {
                             },
                         },
                     },
-                }, pagination: pagination }))));
+                }, pagination: pagination }) }) }));
 };

package/es/tests/MatchesAnySelect.d.ts

@@ -1,2 +1 @@
-import React from 'react';
-export declare const MatchesAnySelectTest: () => React.JSX.Element;
+export declare const MatchesAnySelectTest: () => import("react/jsx-runtime").JSX.Element;

package/es/tests/MatchesAnySelect.js

@@ -1,5 +1,6 @@
+import { jsx as _jsx } from "react/jsx-runtime";
 // Libraries
-import React, { useMemo, useState } from 'react';
+import { useMemo, useState } from 'react';
 import { MatchesAnySelect, Typography } from '../components';
 import { EXTRA_VALUE_SAMPLE_DATA } from '../components/molecules/MatchAnySelect/constants';
 import { recursiveSearchItems } from '../utils';
@@ -20,18 +21,15 @@ export const MatchesAnySelectTest = () => {
     };
     const [state, setState] = useState({
         selectedItems: [],
-        items: EXTRA_VALUE_SAMPLE_DATA.map(item => {
-            var _a;
-            return ({
-                key: item.id,
-                title: item.name,
-                segmentSize: item.segmentSize,
-                rowCount: item.rowCount,
-                subTitle: (_a = item.id) === null || _a === void 0 ? void 0 : _a.toString(),
-                status: item.status,
-                error: getError(item.status),
-            });
-        }),
+        items: EXTRA_VALUE_SAMPLE_DATA.map(item => ({
+            key: item.id,
+            title: item.name,
+            segmentSize: item.segmentSize,
+            rowCount: item.rowCount,
+            subTitle: item.id?.toString(),
+            status: item.status,
+            error: getError(item.status),
+        })),
         searchValue: '',
     });
     const memoItems = useMemo(() => recursiveSearchItems({
@@ -42,7 +40,7 @@ export const MatchesAnySelectTest = () => {
     }).results, [state.items, state.searchValue]);
     console.log('matchesAnyItems:: ', state.items);
     console.log('selectedItems:: ', state.selectedItems);
-    return (React.createElement(MatchesAnySelect, { items: memoItems, objectName: "Is member of", selectedItems: state.selectedItems, 
+    return (_jsx(MatchesAnySelect, { items: memoItems, objectName: "Is member of", selectedItems: state.selectedItems, 
         /** Support for render extra values */
         renderExtraValues: [
             {
@@ -61,16 +59,18 @@ export const MatchesAnySelectTest = () => {
         /** Support for custom item renders such as title, subtitle, status */
         customItemRenders: {
             title(item) {
-                var _a;
-                return (React.createElement(Typography.Link, { href: item.key.toString() }, (_a = item.title) === null || _a === void 0 ? void 0 : _a.toString()));
+                return (_jsx(Typography.Link, { href: item.key.toString(), children: item.title?.toString() }));
             },
         }, 
         /** Support for handle search outside  */
         onChangeSearch: searchValue => {
             console.log({ searchValue });
-            setState(prev => (Object.assign(Object.assign({}, prev), { searchValue })));
+            setState(prev => ({
+                ...prev,
+                searchValue,
+            }));
         }, onChange: selectedItems => {
             console.log({ selectedItems });
-            setState(prev => (Object.assign(Object.assign({}, prev), { selectedItems })));
+            setState(prev => ({ ...prev, selectedItems }));
         } }));
 };

package/es/utils/actionButtons.js

@@ -1,14 +1,3 @@
-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;
-};
 /**
  * Renders a set of action buttons based on the provided configuration.
  *
@@ -46,8 +35,15 @@ export function renderActionButtons({ renderComponent, actionButtons = {}, defau
         const option = defaultActionOptions[key] || {};
         const actionSettings = actionButtons[key];
         if (actionSettings) {
-            const { buttonProps, key, label, icon, customRender } = actionSettings, restOfAction = __rest(actionSettings, ["buttonProps", "key", "label", "icon", "customRender"]);
-            const ButtonComponent = renderComponent(Object.assign({ buttonProps, key: key || option.key, label: label || option.label, icon: icon || option.icon, customRender }, restOfAction), option);
+            const { buttonProps, key, label, icon, customRender, ...restOfAction } = actionSettings;
+            const ButtonComponent = renderComponent({
+                buttonProps,
+                key: key || option.key,
+                label: label || option.label,
+                icon: icon || option.icon,
+                customRender,
+                ...restOfAction,
+            }, option);
             /**
              * Handle custom render for action button
              * If customRender is a function, return the function callback the ButtonComponent

package/es/utils/common.js

@@ -536,7 +536,10 @@ export const recursiveSearchItems = ({ list = [], childrenKey = 'children', sear
                 matchingSubChildren = searchChildren(child[childrenKey], child);
             }
             if (childMatches || matchingSubChildren.length > 0) {
-                matchingChildren.push(Object.assign(Object.assign({}, child), (matchingSubChildren.length > 0 && { [childrenKey]: matchingSubChildren })));
+                matchingChildren.push({
+                    ...child,
+                    ...(matchingSubChildren.length > 0 && { [childrenKey]: matchingSubChildren }),
+                });
             }
         });
         if (matchingChildren.length > 0) {
@@ -560,7 +563,7 @@ export const recursiveSearchItems = ({ list = [], childrenKey = 'children', sear
         else if (item[childrenKey] && Array.isArray(item[childrenKey])) {
             const matchingChildren = searchChildren(item[childrenKey], item);
             if (matchingChildren.length > 0) {
-                results.push(Object.assign(Object.assign({}, item), { [childrenKey]: matchingChildren }));
+                results.push({ ...item, [childrenKey]: matchingChildren });
             }
         }
     });
@@ -617,9 +620,12 @@ export function parseJSONFromLocalStorage(key) {
  * @param {Array<keyof T>} [sortByKeys=[]] - The keys used to sort the objects.
  * @returns {T[]} - The sorted array with each object’s children arrays also sorted recursively.
  */
-export const recursiveSortBy = (arr, childrenKey = 'children', sortByKeys = []) => sortBy(arr, [...sortByKeys]).map(item => (Object.assign(Object.assign({}, item), (item[childrenKey] && {
-    [childrenKey]: recursiveSortBy(item[childrenKey], childrenKey, sortByKeys),
-}))));
+export const recursiveSortBy = (arr, childrenKey = 'children', sortByKeys = []) => sortBy(arr, [...sortByKeys]).map(item => ({
+    ...item,
+    ...(item[childrenKey] && {
+        [childrenKey]: recursiveSortBy(item[childrenKey], childrenKey, sortByKeys),
+    }),
+}));
 /**
  * Recursively finds all parent items of a given item in a list of objects.
  *
@@ -642,7 +648,7 @@ export const recursiveFindParents = (list, item, identifyKey, childrenKey) => {
             const matchingSubChildren = recursiveFindParents(child[childrenKey], item, identifyKey, childrenKey);
             // If any matching sub-children were found, add the current child to the matched parents array.
             if (matchingSubChildren.length > 0) {
-                matchedParents.push(Object.assign(Object.assign({}, child), { [childrenKey]: matchingSubChildren }));
+                matchedParents.push({ ...child, [childrenKey]: matchingSubChildren });
             }
         }
     });

package/es/utils/commonComponent.js

@@ -1,19 +1,9 @@
-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;
-};
+import { jsx as _jsx } from "react/jsx-runtime";
 // Libraries
-import React, { useMemo } from 'react';
+import { useMemo } from 'react';
 import { Tag } from '@antscorp/antsomi-ui/es/index';
 export const CustomTag = props => {
-    const { type, children } = props, restOfProps = __rest(props, ["type", "children"]);
+    const { type, children, ...restOfProps } = props;
     const settings = useMemo(() => {
         switch (type) {
             case 'link':
@@ -24,5 +14,5 @@ export const CustomTag = props => {
                 return { bordered: false };
         }
     }, [type]);
-    return (React.createElement(Tag, Object.assign({}, settings, restOfProps), children));
+    return (_jsx(Tag, { ...settings, ...restOfProps, children: children }));
 };

package/es/utils/cookie.js

@@ -8,7 +8,9 @@ const cookies = new Cookies(null, {
 });
 // Handle cookie
 export const setCookieSession = ({ name, value, cookieOptions }) => {
-    cookies.set(name, value, Object.assign({}, cookieOptions));
+    cookies.set(name, value, {
+        ...cookieOptions,
+    });
     if (typeof Storage !== undefined) {
         sessionStorage.setItem(name, name);
     }
@@ -16,9 +18,15 @@ export const setCookieSession = ({ name, value, cookieOptions }) => {
 // Handle cookie with subdomain
 export const removeCookieSubDomain = ({ name, env = 'development', cookieOptions, }) => {
     const arrTmp = location.hostname.split('.');
-    cookies.remove(name, Object.assign(Object.assign(Object.assign({}, (env !== ENV.DEV && {
-        domain: `.${arrTmp.length < 4 ? arrTmp.slice(-2).join('.') : arrTmp.slice(-3).join('.')}`,
-    })), { path: '/', sameSite: 'none', secure: true }), cookieOptions));
+    cookies.remove(name, {
+        ...(env !== ENV.DEV && {
+            domain: `.${arrTmp.length < 4 ? arrTmp.slice(-2).join('.') : arrTmp.slice(-3).join('.')}`,
+        }),
+        path: '/',
+        sameSite: 'none',
+        secure: true,
+        ...cookieOptions,
+    });
 };
 export const removeAppCookieSessionSubdomain = (args) => {
     removeCookieSubDomain(args);
@@ -27,7 +35,7 @@ export const removeAppCookieSessionSubdomain = (args) => {
     }
 };
 export const removeAppCookieSession = (args) => {
-    cookies.remove(args === null || args === void 0 ? void 0 : args.name, args === null || args === void 0 ? void 0 : args.cookieOptions);
+    cookies.remove(args?.name, args?.cookieOptions);
     if (typeof Storage !== undefined) {
         sessionStorage.removeItem(args.name);
     }
@@ -35,7 +43,10 @@ export const removeAppCookieSession = (args) => {
 export const removeAppCookieSessionSubdomainPrefix = (args) => {
     Object.keys(cookies.getAll()).forEach(cookieName => {
         if (cookieName.startsWith(args.name)) {
-            removeAppCookieSessionSubdomain(Object.assign(Object.assign({}, args), { name: cookieName }));
+            removeAppCookieSessionSubdomain({
+                ...args,
+                name: cookieName,
+            });
         }
     });
 };

package/es/utils/dataTable.js

@@ -1,14 +1,3 @@
-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;
-};
 export const mapColumnDefItemToGeneral = (columnDefItem) => ({
     editable: false,
     fixColumn: false,
@@ -17,19 +6,18 @@ export const mapColumnDefItemToGeneral = (columnDefItem) => ({
     sortable: !!parseInt(columnDefItem.enableSorting),
     type: parseInt(columnDefItem.type),
 });
-export const mapColumnToGeneral = (_a) => {
-    var { sortable, isSort } = _a, restOfColumn = __rest(_a, ["sortable", "isSort"]);
-    return (Object.assign(Object.assign({}, restOfColumn), { 
-        /** Convert isSort to boolean */
-        sortable: isSort === '1' ? true : sortable }));
-};
+export const mapColumnToGeneral = ({ sortable, isSort, ...restOfColumn }) => ({
+    ...restOfColumn,
+    /** Convert isSort to boolean */
+    sortable: isSort === '1' ? true : sortable,
+});
 // NOTES: Improve typescript
 export const mapResponseListingToGeneral = (response) => {
     const { body, header, total, entries, column_defs, rows, total_records } = response || {};
     return {
         body: body || entries || rows || [],
-        header: (header === null || header === void 0 ? void 0 : header.map(col => mapColumnToGeneral(col || {}))) ||
-            (column_defs === null || column_defs === void 0 ? void 0 : column_defs.map(columnDefItem => mapColumnDefItemToGeneral(columnDefItem || {}))) ||
+        header: header?.map(col => mapColumnToGeneral(col || {})) ||
+            column_defs?.map(columnDefItem => mapColumnDefItemToGeneral(columnDefItem || {})) ||
             [],
         total: total || total_records || 0,
     };

package/es/utils/handleError.js

@@ -1,28 +1,8 @@
-var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
-    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
-    return new (P || (P = Promise))(function (resolve, reject) {
-        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
-        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
-        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
-        step((generator = generator.apply(thisArg, _arguments || [])).next());
-    });
-};
-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;
-};
-export const handleError = (...args_1) => __awaiter(void 0, [...args_1], void 0, function* (error = {}, configInfo = {}, isShowMessageError = false) {
+export const handleError = async (error = {}, configInfo = {}, isShowMessageError = false) => {
     const { response, message } = error;
-    const { name: functionName, path, from, priority = 'low' } = configInfo, restOfConfigInfo = __rest(configInfo, ["name", "path", "from", "priority"]);
+    const { name: functionName, path, from, priority = 'low', ...restOfConfigInfo } = configInfo;
     console.log(error);
-});
+};
 export function tryCatchWrapper(func, options = {}) {
     return (...args) => {
         try {

package/es/utils/loadable.js

@@ -1,10 +1,10 @@
-import React, { lazy, Suspense } from 'react';
+import { jsx as _jsx } from "react/jsx-runtime";
+import { lazy, Suspense } from 'react';
 export const lazyLoad = (importFunc, selectorFunc, opts = { fallback: null }) => {
     let lazyFactory = importFunc;
     if (selectorFunc) {
         lazyFactory = () => importFunc().then(module => ({ default: selectorFunc(module) }));
     }
     const LazyComponent = lazy(lazyFactory);
-    return (props) => (React.createElement(Suspense, { fallback: opts.fallback },
-        React.createElement(LazyComponent, Object.assign({}, props))));
+    return (props) => (_jsx(Suspense, { fallback: opts.fallback, children: _jsx(LazyComponent, { ...props }) }));
 };

package/es/utils/templateListing.js

@@ -6,8 +6,7 @@ export const getCategoriesFromObjectTemplate = (objectTemplate) => {
         ? objectTemplate.model
         : objectTemplate) || {};
     Object.values(TEMPLATE_CATEGORY_KEYS).forEach(key => {
-        var _a;
-        if (cloneObjectTemplate[key] && ((_a = cloneObjectTemplate[key]) === null || _a === void 0 ? void 0 : _a.length)) {
+        if (cloneObjectTemplate[key] && cloneObjectTemplate[key]?.length) {
             categories[key] = cloneObjectTemplate[key];
         }
     });

package/es/utils/validateURL.d.ts

@@ -0,0 +1 @@
+export declare const validateURL: (string: string) => boolean;

package/es/utils/validateURL.js

@@ -0,0 +1,5 @@
+export const validateURL = (string) => {
+    // eslint-disable-next-line no-useless-escape
+    const regexp = /^((([A-Za-z]{3,9}:(?:\/\/)?)(?:[\-;:&=\+\$,\w]+@)?[A-Za-z0-9\.\-]+|(?:www\.|[\-;:&=\+\$,\w]+@)[A-Za-z0-9\.\-]+)((?:\/[\+~%\/\.\w\-_]*)?\??(?:[\-\+=&;%@\.\w_]*)#?(?:[\.\!\/\\\w]*))?)/;
+    return regexp.test(string);
+};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@antscorp/antsomi-ui",
-  "version": "2.0.13",
+  "version": "2.0.15",
   "description": "An enterprise-class UI design language and React UI library.",
   "sideEffects": [
     "dist/*",
@@ -32,13 +32,11 @@
     "build-storybook": "storybook build",
     "serve-storybook": "serve storybook-static",
     "version": "auto-changelog -p && git add CHANGELOG.md",
-    "test": "jest",
-    "test:changed": "jest --onlyChanged",
-    "test:watch": "jest --watch",
-    "test:coverage": "jest --coverage",
-    "test:vitest": "vitest",
+    "test": "vitest",
+    "test:ui": "vitest --ui",
+    "coverage": "vitest run --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 -e src/stories/**/*.svg src/**/*.json src/**/*.svg src/**/*.scss src/**/*.png es",
     "icons:add": "tsx scripts/add-icons.ts",
     "icons:export": "sh -e scripts/generate-export-icon.sh",
     "icons:format": "prettier --loglevel warn --write \"src/components/icons/*.tsx\"",
@@ -75,7 +73,6 @@
     "@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.2.4",
     "@swiper/core": "^0.0.21",
     "@tanstack/react-query": "4.20.4",
     "@tanstack/react-query-devtools": "4.20.4",
@@ -130,7 +127,6 @@
     "remark-gfm-alias-story": "npm:remark-gfm@4.0.0",
     "socket.io-client": "^4.7.5",
     "swiper": "^11.0.7",
-    "ts-dedent": "^2.2.0",
     "tui-image-editor": "^3.15.3",
     "uniqid": "^5.4.0",
     "use-context-selector": "^1.4.4",
@@ -155,22 +151,20 @@
     "@babel/preset-typescript": "^7.23.3",
     "@commitlint/cli": "17.5.0",
     "@commitlint/config-conventional": "17.4.4",
-    "@storybook/addon-actions": "^8.2.4",
-    "@storybook/addon-controls": "^8.2.4",
-    "@storybook/addon-docs": "^8.2.4",
-    "@storybook/addon-essentials": "^8.2.4",
-    "@storybook/addon-interactions": "^8.2.4",
-    "@storybook/addon-links": "^8.2.4",
+    "@storybook/addon-docs": "^8.2.9",
+    "@storybook/addon-essentials": "^8.2.9",
+    "@storybook/addon-links": "^8.2.9",
     "@storybook/addon-styling-webpack": "^1.0.0",
     "@storybook/addon-webpack5-compiler-babel": "^3.0.3",
-    "@storybook/blocks": "^8.2.4",
-    "@storybook/manager-api": "^8.2.4",
-    "@storybook/react": "^8.2.4",
-    "@storybook/react-webpack5": "^8.2.4",
-    "@storybook/theming": "^8.2.4",
-    "@testing-library/jest-dom": "^6.4.8",
+    "@storybook/blocks": "^8.2.9",
+    "@storybook/manager-api": "^8.2.9",
+    "@storybook/react": "^8.2.9",
+    "@storybook/react-webpack5": "^8.2.9",
+    "@storybook/theming": "^8.2.9",
+    "@testing-library/dom": "^10.4.0",
+    "@testing-library/jest-dom": "^6.5.0",
     "@testing-library/react": "^16.0.0",
-    "@types/jest": "^29.5.0",
+    "@testing-library/user-event": "^14.5.2",
     "@types/node": "^18.15.10",
     "@types/pako": "2.0.0",
     "@types/react": "^18.0.33",
@@ -179,21 +173,21 @@
     "@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",
     "@typescript-eslint/parser": "^5.55.0",
     "@vitejs/plugin-react": "^4.3.1",
-    "@vitest/ui": "^2.0.4",
+    "@vitest/coverage-v8": "^2.0.5",
+    "@vitest/ui": "^2.0.5",
     "auto-changelog": "^2.4.0",
-    "babel-loader": "^8.3.0",
+    "babel-loader": "^9.1.3",
     "babel-plugin-import": "^1.13.8",
     "babel-plugin-module-resolver": "^5.0.0",
     "babel-plugin-styled-components": "^2.1.4",
     "clsx": "^1.2.1",
     "copyfiles": "^2.4.1",
     "cross-env": "^7.0.3",
-    "css-loader": "^6.7.3",
+    "css-loader": "^7.1.2",
     "date-fns": "^2.29.3",
     "esbuild-loader": "^4.0.2",
     "eslint": "^8.36.0",
@@ -208,40 +202,38 @@
     "eslint-plugin-storybook": "^0.8.0",
     "file-loader": "^6.2.0",
     "husky": "^8.0.3",
-    "jest": "^29.5.0",
-    "jest-environment-jsdom": "^29.5.0",
     "jest-styled-components": "^7.2.0",
     "jsdom": "^24.1.1",
     "lint-staged": "^13.2.0",
     "mini-css-extract-plugin": "^2.7.5",
-    "postcss": "^8.4.21",
-    "postcss-loader": "^7.1.0",
+    "postcss": "^8.4.41",
+    "postcss-loader": "^8.1.1",
     "prettier": "^3.3.3",
     "react": "18.2.0",
     "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.2.4",
-    "style-loader": "^3.3.2",
+    "sass": "^1.77.8",
+    "sass-loader": "^16.0.1",
+    "storybook": "^8.2.9",
+    "style-loader": "^4.0.0",
     "styled-components": "^5.3.9",
-    "terser-webpack-plugin": "^5.3.7",
-    "ts-jest": "^29.1.0",
-    "ts-loader": "^9.4.2",
+    "terser-webpack-plugin": "^5.3.10",
+    "ts-loader": "^9.5.1",
     "ts-node": "^10.9.1",
     "tsconfig-paths-webpack-plugin": "^4.0.1",
     "tsx": "^4.16.2",
     "type-fest": "^4.10.2",
     "typescript": "^5.4.3",
-    "vite": "^5.3.4",
+    "vite": "^5.4.3",
     "vite-plugin-commonjs": "^0.10.1",
-    "vite-plugin-mkcert": "^1.17.5",
-    "vitest": "^2.0.4",
-    "webpack": "^5.78.0",
+    "vite-plugin-mkcert": "^1.17.6",
+    "vite-tsconfig-paths": "^5.0.1",
+    "vitest": "^2.0.5",
+    "webpack": "^5.94.0",
     "webpack-bundle-analyzer": "^4.10.1",
-    "webpack-cli": "^5.0.1"
+    "webpack-cli": "^5.1.4"
   },
   "peerDependencies": {
     "react": ">=16.9.0",

package/es/stories/assets/code-brackets.svg

@@ -1 +0,0 @@
-<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="48" height="48" version="1.1" viewBox="0 0 48 48"><title>illustration/code-brackets</title><g id="illustration/code-brackets" fill="none" fill-rule="evenodd" stroke="none" stroke-width="1"><path id="Combined-Shape" fill="#87E6E5" d="M11.4139325,12 C11.7605938,12 12,12.5059743 12,13.3779712 L12,17.4951758 L6.43502246,23.3839989 C5.85499251,23.9978337 5.85499251,25.0021663 6.43502246,25.6160011 L12,31.5048242 L12,35.6220288 C12,36.4939606 11.7605228,37 11.4139325,37 C11.2725831,37 11.1134406,36.9158987 10.9453839,36.7379973 L0.435022463,25.6160011 C-0.145007488,25.0021663 -0.145007488,23.9978337 0.435022463,23.3839989 L10.9453839,12.2620027 C11.1134051,12.0841663 11.2725831,12 11.4139325,12 Z M36.5860675,12 C36.7274169,12 36.8865594,12.0841013 37.0546161,12.2620027 L47.5649775,23.3839989 C48.1450075,23.9978337 48.1450075,25.0021663 47.5649775,25.6160011 L37.0546161,36.7379973 C36.8865949,36.9158337 36.7274169,37 36.5860675,37 C36.2394062,37 36,36.4940257 36,35.6220288 L36,31.5048242 L41.5649775,25.6160011 C42.1450075,25.0021663 42.1450075,23.9978337 41.5649775,23.3839989 L36,17.4951758 L36,13.3779712 C36,12.5060394 36.2394772,12 36.5860675,12 Z"/><rect id="Rectangle-7-Copy-5" width="35.57" height="4" x="5.009" y="22.662" fill="#A0DB77" rx="2" transform="translate(22.793959, 24.662305) rotate(-75.000000) translate(-22.793959, -24.662305)"/></g></svg>