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

package/es/utils/common.js

@@ -1,8 +1,12 @@
 /* eslint-disable no-underscore-dangle */
 // Libraries
 import axios from 'axios';
+import uniqid from 'uniqid';
 // Constants
 import { MESSAGES, PORTAL_KEYS } from '@antscorp/antsomi-ui/es/services/constants';
+// Utils
+import { handleError } from './handleError';
+const PATH = 'src/utils/common.ts';
 /**
  * Function to reorder list
  * @param {Object[]} list - list of item want to reorder
@@ -16,6 +20,16 @@ export const reorder = (list, startIndex, endIndex) => {
     result.splice(endIndex, 0, removed);
     return result;
 };
+/**
+ * Function to flat array
+ * @param {Array} tree - tree data
+ * @param {string} keyFlat = 'id' - key to flat
+ * @param {number} level = 0 - level of tree
+ * @returns {Array} - tree data with children
+ */
+export const flattenTree = (tree = [], keyFlat = 'children', level) => tree.flatMap(item => item[keyFlat] && level !== 0
+    ? [item, ...flattenTree(item[keyFlat], keyFlat, (level || 0) - 1)]
+    : item);
 export const safeParse = (val, defaultVal) => {
     if (typeof val === 'undefined' ||
         val === 'undefined' ||
@@ -42,24 +56,6 @@ export const random = number => {
     }
     return text;
 };
-export function getPortalId(config) {
-    const portalId = safeParse(getSessionStorage('api_pid', config), 0);
-    if (portalId === 0) {
-        return getAppParamURL(window.location.pathname, false, config).portalId;
-    }
-    return portalId;
-    // return safeParse(getAppSession('api_pid'), 0);
-}
-export const safeParseInt = (val, defaultVal) => {
-    let tempt = safeParse(val, 0);
-    if (tempt !== 0) {
-        tempt = parseInt(tempt);
-        if (Number.isNaN(tempt)) {
-            return defaultVal;
-        }
-    }
-    return tempt;
-};
 export function isUrlEmbedded() {
     return false;
 }
@@ -83,29 +79,19 @@ export function getSessionStorage(key, config) {
     }
     return '';
 }
-export function getMessageByCode(messageCode, def = undefined) {
-    if (def === undefined) {
-        def = 'Error happened. Please try again.';
-    }
-    const tempt = MESSAGES[messageCode];
-    if (tempt === undefined) {
-        return def;
+export const safeParseInt = (val, defaultVal) => {
+    let tempt = safeParse(val, 0);
+    if (tempt !== 0) {
+        tempt = parseInt(tempt);
+        if (Number.isNaN(tempt)) {
+            return defaultVal;
+        }
     }
     return tempt;
-}
-export function urlHasQueryString(url) {
-    const arr = url.split('?');
-    if (arr.length > 1 && arr[1] !== '') {
-        return true;
-    }
-    return false;
-}
-export function isNumeric(num) {
-    return !isNaN(num) && num !== '';
-}
-export function getUserLocaleLanguage(config) {
-    return safeParse(getWindowParam(PORTAL_KEYS.USER_LANGUAGE, config), 'en');
-}
+};
+const getCookie = (key, config) => {
+    throw new Error('Function not implemented.');
+};
 export function getAppSession(key, config) {
     if (isUrlEmbedded()) {
         return getDataWithEmbeddedPublic(key, config);
@@ -177,8 +163,38 @@ export function getAppParamURL(pathname, forceVersionV2 = false, config) {
     output.accessUserId = accessUserId;
     return output;
 }
+export function getPortalId(config) {
+    const portalId = safeParse(getSessionStorage('api_pid', config), 0);
+    if (portalId === 0) {
+        return getAppParamURL(window.location.pathname, false, config).portalId;
+    }
+    return portalId;
+    // return safeParse(getAppSession('api_pid'), 0);
+}
+export function getMessageByCode(messageCode, def = undefined) {
+    if (def === undefined) {
+        def = 'Error happened. Please try again.';
+    }
+    const tempt = MESSAGES[messageCode];
+    if (tempt === undefined) {
+        return def;
+    }
+    return tempt;
+}
+export function urlHasQueryString(url) {
+    const arr = url.split('?');
+    if (arr.length > 1 && arr[1] !== '') {
+        return true;
+    }
+    return false;
+}
+export function isNumeric(num) {
+    return !isNaN(num) && num !== '';
+}
+export function getUserLocaleLanguage(config) {
+    return safeParse(getWindowParam(PORTAL_KEYS.USER_LANGUAGE, config), 'en');
+}
 export function callApiWithAuth(endpoint, method = 'GET', body, domain = '', config = {}, token = '', userId = '', isTicket = false, type = '', isAccount = false, isPermission = false, others = {}) {
-    console.log(token);
     const apiPid = getPortalId(config);
     const apiToken = token;
     const _user_id = userId;
@@ -325,9 +341,6 @@ export function getEntriesV2(res, def) {
         data: def,
     };
 }
-function getCookie(key, config) {
-    throw new Error('Function not implemented.');
-}
 export const getNumberFromString = (str) => {
     try {
         return +(str.match(/^-?\d+/) || []).flat()[0];
@@ -374,9 +387,6 @@ export function mapNumberToOrdinalText(num) {
     }
 }
 export const searchParamsToObject = (searchParams = '') => Object.fromEntries(new URLSearchParams(searchParams));
-export function asssertCannotReach(x) {
-    throw new Error('cannot reach this place in the code!');
-}
 export const getShuffleArray = (array) => {
     for (let i = array.length - 1; i > 0; i--) {
         /* Choose a random position from 0 to i */
@@ -406,9 +416,196 @@ export const camelCaseToSnakeCase = (object, recursive = false) => {
         newObject[newKey] =
             recursive && !!object[key] && typeof object[key] === 'object'
                 ? Array.isArray(object[key])
-                    ? object[key].map(value => snakeCaseToCamelCase(value, recursive))
+                    ? object[key].map(value => camelCaseToSnakeCase(value, recursive))
                     : camelCaseToSnakeCase(object[key], recursive)
                 : object[key];
     });
     return newObject;
 };
+export function generateKey() {
+    return uniqid.process();
+}
+export const formatUserId = (userId) => String(userId || '').replace(/(\d{3})(\d{3})(\d{0,})/, `$1-$2-$3`);
+/**
+ * Function to remove accent
+ * @param str - String want to remove accent
+ * @returns {string} - Result after remove accent
+ */
+export const removeAccent = (str) => {
+    str = str.replace(/[àáạảãâầấậẩẫăằắặẳẵ]/g, 'a');
+    str = str.replace(/[èéẹẻẽêềếệểễ]/g, 'e');
+    str = str.replace(/[ìíịỉĩ]/g, 'i');
+    str = str.replace(/[òóọỏõôồốộổỗơờớợởỡ]/g, 'o');
+    str = str.replace(/[ùúụủũưừứựửữ]/g, 'u');
+    str = str.replace(/[ỳýỵỷỹ]/g, 'y');
+    str = str.replace(/đ/g, 'd');
+    str = str.replace(/[ÀÁẠẢÃÂẦẤẬẨẪĂẰẮẶẲẴ]/g, 'A');
+    str = str.replace(/[ÈÉẸẺẼÊỀẾỆỂỄ]/g, 'E');
+    str = str.replace(/[ÌÍỊỈĨ]/g, 'I');
+    str = str.replace(/[ÒÓỌỎÕÔỒỐỘỔỖƠỜỚỢỞỠ]/g, 'O');
+    str = str.replace(/Ù|Ú|Ụ|Ủ|Ũ|Ư|Ừ|Ứ|Ự|Ử|Ữ/g, 'U');
+    str = str.replace(/Ỳ|Ý|Ỵ|Ỷ|Ỹ/g, 'Y');
+    str = str.replace(/Đ/g, 'D');
+    return str;
+};
+/** Remove all accents and convert string to lower case, remove leading and trailing white space */
+export const simplifyString = (str) => removeAccent(`${str || ''}`.toLowerCase().trim()) || '';
+/**
+ * @param str target string
+ * @param queryStr search query
+ * @returns true if target string includes search query
+ */
+export const searchStringQuery = (str, queryStr) => simplifyString(str).includes(simplifyString(queryStr || ''));
+/**
+ * Checks if any of the provided values match the search value.
+ *
+ * @param {string[]} values - The values to search through.
+ * @param {string} searchValue - The value to search for.
+ * @returns {boolean} True if any value matches the search value, otherwise false.
+ */
+function searchMatchAny(values, searchValue) {
+    return values.some(value => searchStringQuery(value, searchValue));
+}
+export const isExistedImage = (imageUrl) => {
+    try {
+        const http = new XMLHttpRequest();
+        http.open('HEAD', imageUrl, false);
+        http.send();
+        return http.status !== 404;
+    }
+    catch (error) {
+        handleError(error, {
+            path: PATH,
+            name: isExistedImage.name,
+            args: { imageUrl },
+        });
+        return false;
+    }
+};
+export const getUrlNoCache = (url = '', cacheValue = 0) => {
+    let urlNoCache = url;
+    if (urlNoCache.includes('nocache') || url.startsWith('data:image') || !cacheValue) {
+        urlNoCache = url;
+    }
+    else {
+        try {
+            const newUrl = new URL(url);
+            newUrl.searchParams.append('nocache', `${cacheValue}`);
+            urlNoCache = newUrl.toString();
+        }
+        catch (error) {
+            urlNoCache = url;
+        }
+    }
+    return urlNoCache;
+};
+export const safeParseJson = (json, defaultValue) => {
+    if (!json)
+        return defaultValue;
+    try {
+        return JSON.parse(json);
+    }
+    catch (error) {
+        return defaultValue;
+    }
+};
+/**
+ * Recursively searches through a list of items and their children to find matches based on specified search keys and a search value.
+ *
+ * @template T - The type of items in the list.
+ * @param {Object} params - The parameters for the search.
+ * @param {T[]} [params.list=[]] - The list of items to search through.
+ * @param {keyof T} [params.childrenKey='children'] - The key used to access children of each item.
+ * @param {Array<keyof T>} params.searchKeys - The keys of the item properties to search against.
+ * @param {string} params.searchValue - The value to search for in the specified keys.
+ * @returns {Object} The search results.
+ * @returns {T[]} returns.results - The list of items that match the search criteria.
+ * @returns {T[]} returns.matchedParents - The list of parent items that have matching children.
+ */
+export const recursiveSearchItems = ({ list = [], childrenKey = 'children', searchKeys, searchValue, }) => {
+    const results = [];
+    const matchedParents = [];
+    function matchesSearchValue(item) {
+        return searchMatchAny(searchKeys.map(key => item[key] || ''), searchValue);
+    }
+    function searchChildren(children, parent) {
+        const matchingChildren = [];
+        children.forEach(child => {
+            const childMatches = matchesSearchValue(child);
+            let matchingSubChildren = [];
+            if (child[childrenKey] && Array.isArray(child[childrenKey])) {
+                matchingSubChildren = searchChildren(child[childrenKey], child);
+            }
+            if (childMatches || matchingSubChildren.length > 0) {
+                matchingChildren.push(Object.assign(Object.assign({}, child), { [childrenKey]: matchingSubChildren }));
+            }
+        });
+        if (matchingChildren.length > 0) {
+            matchedParents.push(parent);
+        }
+        return matchingChildren;
+    }
+    list.forEach(item => {
+        if (matchesSearchValue(item)) {
+            /**
+             * If the item has children and the search value is not empty, add it to the matched parents for expands.
+             */
+            if (item[childrenKey] &&
+                Array.isArray(item[childrenKey]) &&
+                item[childrenKey].length > 0 &&
+                !!searchValue) {
+                matchedParents.push(item);
+            }
+            results.push(item);
+        }
+        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 }));
+            }
+        }
+    });
+    return {
+        results,
+        matchedParents,
+    };
+};
+/**
+ * Function to flat array
+ * @param {Array} tree - tree data
+ * @param {string} keyFlat = 'id' - key to flat
+ * @param {number} level = 0 - level of tree
+ * @returns {Array} - tree data with children
+ */
+export const flatTree = (tree = [], keyFlat = 'children', level) => tree.flatMap(item => item[keyFlat] && level !== 0
+    ? [item, ...flatTree(item[keyFlat], keyFlat, (level || 0) - 1)]
+    : item);
+export function asssertCannotReach(x) {
+    throw new Error('cannot reach this place in the code!');
+}
+/**
+ * Splits a string into an array of substrings separated by newline characters.
+ * @param text - The input text to split.
+ * @returns An array of strings, each representing a line of text from the input.
+ */
+export function splitTextByNewline(text = '') {
+    return text.split('\n').map(line => line.trim());
+}
+/**
+ * Safely parses a JSON string from localStorage.
+ *
+ * @param {string} key - The key of the item to retrieve from localStorage.
+ * @returns {any | null} The parsed JSON object if successful, or `null` if the parsing fails or the key does not exist.
+ */
+export function parseJSONFromLocalStorage(key) {
+    try {
+        const jsonString = localStorage.getItem(key);
+        if (jsonString) {
+            return JSON.parse(jsonString);
+        }
+        return null;
+    }
+    catch (error) {
+        return null;
+    }
+}

package/es/utils/commonComponent.d.ts

@@ -0,0 +1,7 @@
+import React from 'react';
+import { TagProps } from 'antd';
+interface CustomTagProps extends TagProps {
+    type: 'link' | 'normal' | 'default';
+}
+export declare const CustomTag: React.FC<CustomTagProps>;
+export {};

package/es/utils/commonComponent.js

@@ -0,0 +1,28 @@
+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, { 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 settings = useMemo(() => {
+        switch (type) {
+            case 'link':
+                return { color: 'processing', bordered: true };
+            case 'normal':
+                return { bordered: false };
+            default:
+                return { bordered: false };
+        }
+    }, [type]);
+    return (React.createElement(Tag, Object.assign({}, settings, restOfProps), children));
+};

package/es/utils/dataTable.d.ts

@@ -0,0 +1,11 @@
+import { DataTableColumnDefItem, DataTableHeaderItem } from '../models/DataTable/DataTableListing';
+export declare const mapColumnDefItemToGeneral: (columnDefItem: DataTableColumnDefItem) => DataTableHeaderItem;
+export declare const mapResponseListingToGeneral: (response: Record<string, any>) => {
+    body: any;
+    header: any;
+    total: any;
+};
+export declare const mapResponseSearchToGeneral: <T = any>(response: Record<string, any>) => {
+    body: T[];
+    total: number;
+};

package/es/utils/dataTable.js

@@ -0,0 +1,26 @@
+export const mapColumnDefItemToGeneral = (columnDefItem) => ({
+    editable: false,
+    fixColumn: false,
+    label: columnDefItem.header,
+    name: columnDefItem.name,
+    sortable: !!parseInt(columnDefItem.enableSorting),
+    type: parseInt(columnDefItem.type),
+});
+// 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 ||
+            column_defs.map(columnDefItem => mapColumnDefItemToGeneral(columnDefItem || {})) ||
+            [],
+        total: total || total_records || 0,
+    };
+};
+export const mapResponseSearchToGeneral = (response) => {
+    const { total, rows, body } = response || {};
+    return {
+        body: body || rows || [],
+        total: total || 0,
+    };
+};

package/es/utils/domTarget.d.ts

@@ -0,0 +1,8 @@
+import type { MutableRefObject, DependencyList } from 'react';
+export declare const depsAreSame: (oldDeps: DependencyList, deps: DependencyList) => boolean;
+export declare const isBrowser: boolean;
+type TargetValue<T> = T | undefined | null;
+type TargetType = HTMLElement | Element | Window | Document;
+export type BasicTarget<T extends TargetType = Element> = (() => TargetValue<T>) | TargetValue<T> | MutableRefObject<TargetValue<T>>;
+export declare const getTargetElement: <T extends TargetType>(target: BasicTarget<T>, defaultElement?: T) => TargetValue<T>;
+export {};

package/es/utils/domTarget.js

@@ -0,0 +1,32 @@
+import { isFunction } from 'lodash';
+export const depsAreSame = (oldDeps, deps) => {
+    if (oldDeps === deps)
+        return true;
+    for (let i = 0; i < oldDeps.length; i++) {
+        if (!Object.is(oldDeps[i], deps[i]))
+            return false;
+    }
+    return true;
+};
+export const isBrowser = !!(typeof window !== 'undefined' &&
+    window.document &&
+    window.document.createElement);
+export const getTargetElement = (target, defaultElement) => {
+    if (!isBrowser) {
+        return undefined;
+    }
+    if (!target) {
+        return defaultElement;
+    }
+    let targetElement;
+    if (isFunction(target)) {
+        targetElement = target();
+    }
+    else if ('current' in target) {
+        targetElement = target.current;
+    }
+    else {
+        targetElement = target;
+    }
+    return targetElement;
+};

package/es/utils/handleError.js

@@ -18,7 +18,7 @@ var __rest = (this && this.__rest) || function (s, e) {
         }
     return t;
 };
-export const handleError = (error = {}, configInfo = {}, isShowMessageError = false) => __awaiter(void 0, void 0, void 0, function* () {
+export const handleError = (...args_1) => __awaiter(void 0, [...args_1], void 0, function* (error = {}, configInfo = {}, isShowMessageError = false) {
     const { response, message } = error;
     const { name: functionName, path, from, priority = 'low' } = configInfo, restOfConfigInfo = __rest(configInfo, ["name", "path", "from", "priority"]);
     console.log(error);

package/es/utils/index.d.ts

@@ -2,3 +2,7 @@ export * from './color';
 export * from './common';
 export * from './handleError';
 export * from './templateListing';
+export * from './styles';
+export * from './variables';
+export * from './actionButtons';
+export * from './dataTable';

package/es/utils/index.js

@@ -2,3 +2,7 @@ export * from './color';
 export * from './common';
 export * from './handleError';
 export * from './templateListing';
+export * from './styles';
+export * from './variables';
+export * from './actionButtons';
+export * from './dataTable';

package/es/utils/loadable.d.ts

@@ -3,5 +3,5 @@ interface Opts {
     fallback: React.ReactNode;
 }
 type Unpromisify<T> = T extends Promise<infer P> ? P : never;
-export declare const lazyLoad: <T extends Promise<any>, U extends React.ComponentType<any>>(importFunc: () => T, selectorFunc?: ((s: Unpromisify<T>) => U) | undefined, opts?: Opts) => (props: React.ComponentProps<U>) => JSX.Element;
+export declare const lazyLoad: <T extends Promise<any>, U extends React.ComponentType<any>>(importFunc: () => T, selectorFunc?: (s: Unpromisify<T>) => U, opts?: Opts) => (props: React.ComponentProps<U>) => JSX.Element;
 export {};

package/es/utils/styles.d.ts

@@ -0,0 +1,2 @@
+export declare function styleToCssString(rules: any, important?: boolean): string;
+export default styleToCssString;

package/es/utils/styles.js

@@ -0,0 +1,175 @@
+/**
+ * CSS properties which accept numbers but are not in units of "px".
+ */
+const isUnitlessNumber = {
+    boxFlex: true,
+    boxFlexGroup: true,
+    columnCount: true,
+    flex: true,
+    flexGrow: true,
+    flexPositive: true,
+    flexShrink: true,
+    flexNegative: true,
+    fontWeight: true,
+    lineClamp: true,
+    lineHeight: true,
+    opacity: true,
+    order: true,
+    orphans: true,
+    widows: true,
+    zIndex: true,
+    zoom: true,
+    // SVG-related properties
+    fillOpacity: true,
+    strokeDashoffset: true,
+    strokeOpacity: true,
+    strokeWidth: true,
+};
+/**
+ * @param {string} prefix vendor-specific prefix, eg: Webkit
+ * @param {string} key style name, eg: transitionDuration
+ * @return {string} style name prefixed with `prefix`, properly camelCased, eg:
+ * WebkitTransitionDuration
+ */
+function prefixKey(prefix, key) {
+    return prefix + key.charAt(0).toUpperCase() + key.substring(1);
+}
+/**
+ * Support style names that may come passed in prefixed by adding permutations
+ * of vendor prefixes.
+ */
+const prefixes = ['Webkit', 'ms', 'Moz', 'O'];
+// Using Object.keys here, or else the vanilla for-in loop makes IE8 go into an
+// infinite loop, because it iterates over the newly added props too.
+Object.keys(isUnitlessNumber).forEach(prop => {
+    prefixes.forEach(prefix => {
+        isUnitlessNumber[prefixKey(prefix, prop)] = isUnitlessNumber[prop];
+    });
+});
+/**
+ * Most style properties can be unset by doing .style[prop] = '' but IE8
+ * doesn't like doing that with shorthand properties so for the properties that
+ * IE8 breaks on, which are listed here, we instead unset each of the
+ * individual properties. See http://bugs.jquery.com/ticket/12385.
+ * The 4-value 'clock' properties like margin, padding, border-width seem to
+ * behave without any problems. Curiously, list-style works too without any
+ * special prodding.
+ */
+const shorthandPropertyExpansions = {
+    background: {
+        backgroundImage: true,
+        backgroundPosition: true,
+        backgroundRepeat: true,
+        backgroundColor: true,
+    },
+    border: {
+        borderWidth: true,
+        borderStyle: true,
+        borderColor: true,
+    },
+    borderBottom: {
+        borderBottomWidth: true,
+        borderBottomStyle: true,
+        borderBottomColor: true,
+    },
+    borderLeft: {
+        borderLeftWidth: true,
+        borderLeftStyle: true,
+        borderLeftColor: true,
+    },
+    borderRight: {
+        borderRightWidth: true,
+        borderRightStyle: true,
+        borderRightColor: true,
+    },
+    borderTop: {
+        borderTopWidth: true,
+        borderTopStyle: true,
+        borderTopColor: true,
+    },
+    font: {
+        fontStyle: true,
+        fontconstiant: true,
+        fontWeight: true,
+        fontSize: true,
+        lineHeight: true,
+        fontFamily: true,
+    },
+};
+const CSSProperty = {
+    isUnitlessNumber,
+    shorthandPropertyExpansions,
+};
+/* eslint-disable no-underscore-dangle */
+const msPattern = /^ms-/;
+const _uppercasePattern = /([A-Z])/g;
+/**
+ * Hyphenates a camelcased string, for example:
+ *
+ *   > hyphenate('backgroundColor')
+ *   < "background-color"
+ *
+ * For CSS style names, use `hyphenateStyleName` instead which works properly
+ * with all vendor prefixes, including `ms`.
+ *
+ * @param {string} string
+ * @return {string}
+ */
+function hyphenate(string) {
+    return string.replace(_uppercasePattern, '-$1').toLowerCase();
+}
+/**
+ * Hyphenates a camelcased CSS property name, for example:
+ *
+ *   > hyphenateStyleName('backgroundColor')
+ *   < "background-color"
+ *   > hyphenateStyleName('MozTransition')
+ *   < "-moz-transition"
+ *   > hyphenateStyleName('msTransition')
+ *   < "-ms-transition"
+ *
+ * As Modernizr suggests (http://modernizr.com/docs/#prefixed), an `ms` prefix
+ * is converted to `-ms-`.
+ *
+ * @param {string} string
+ * @return {string}
+ */
+function hyphenateStyleName(string) {
+    return hyphenate(string).replace(msPattern, '-ms-');
+}
+const { isArray } = Array;
+const { keys } = Object;
+const counter = 1;
+// Follows syntax at https://developer.mozilla.org/en-US/docs/Web/CSS/content,
+// including multiple space separated values.
+const unquotedContentValueRegex = /^(normal|none|(\b(url\([^)]*\)|chapter_counter|attr\([^)]*\)|(no-)?(open|close)-quote|inherit)((\b\s*)|$|\s+))+)$/;
+function buildRule(key, value, important = false) {
+    if (!isUnitlessNumber[key] && typeof value === 'number') {
+        value = `${value}px`;
+    }
+    else if (key === 'content' && !unquotedContentValueRegex.test(value)) {
+        value = `'${value.replace(/'/g, "\\'")}'`;
+    }
+    return `${hyphenateStyleName(key)}: ${value} ${important ? '!important' : ''};  `;
+}
+export function styleToCssString(rules, important = false) {
+    let result = '';
+    if (!rules || keys(rules).length === 0) {
+        return result;
+    }
+    const styleKeys = keys(rules);
+    for (let j = 0, l = styleKeys.length; j < l; j++) {
+        const styleKey = styleKeys[j];
+        const value = rules[styleKey];
+        if (isArray(value)) {
+            for (let i = 0, len = value.length; i < len; i++) {
+                result += buildRule(styleKey, value[i], important);
+            }
+        }
+        else {
+            result += buildRule(styleKey, value, important);
+        }
+    }
+    return result;
+}
+export default styleToCssString;