react-asc 25.0.1 → 25.0.4

package/components/Button/ButtonContext.d.ts

@@ -3,5 +3,5 @@ import { COLOR } from '../component.enums';
 export interface IButtonContext {
     color: COLOR | null;
 }
-export declare const ButtonContext: import("react").Context<IButtonContext>;
+export declare const ButtonContext: React.Context<IButtonContext>;
 export declare const useButtonContext: () => IButtonContext;

package/components/Form/validators/MaxValidator.d.ts

@@ -1 +1 @@
-export declare const MaxValidator: (valueA: number, valueB: number) => boolean;
+export declare const MaxValidator: (val: string, valueB: number) => boolean;

package/components/Form/validators/MinValidator.d.ts

@@ -1 +1 @@
-export declare const MinValidator: (valueA: number, valueB: number) => boolean;
+export declare const MinValidator: (val: string, minLength: number) => boolean;

package/components/Menu/MenuContext.d.ts

@@ -1,6 +1,6 @@
-import { Dispatch } from 'react';
+import { Context, Dispatch } from 'react';
 export interface IMenuContext {
     isShow: boolean;
     setIsShow: Dispatch<boolean>;
 }
-export declare const MenuContext: import("react").Context<IMenuContext>;
+export declare const MenuContext: Context<IMenuContext>;

package/components/Menu/MenuToggle.d.ts

@@ -2,5 +2,5 @@ import { ReactNode } from 'react';
 interface IMenuToggleProps {
     children?: ReactNode;
 }
-export declare const MenuToggle: ({ children }: IMenuToggleProps) => JSX.Element;
+export declare const MenuToggle: ({ children }: IMenuToggleProps) => ReactNode;
 export {};

package/components/Table/TableContext.d.ts

@@ -1,6 +1,6 @@
-/// <reference types="react" />
+import { Context } from 'react';
 export interface ITableContext {
     variant: 'head' | 'body';
 }
-export declare const TableContext: import("react").Context<ITableContext>;
+export declare const TableContext: Context<ITableContext>;
 export declare const useTableContext: () => ITableContext;

package/components/Tabs/TabContext.d.ts

@@ -1,8 +1,8 @@
-import { Dispatch } from 'react';
+import { Context, Dispatch } from 'react';
 export interface ITabsContext {
-    fixed: boolean;
-    selectedValue: string;
-    setSelectedValue: Dispatch<string>;
+    fixed?: boolean;
+    selectedValue?: string;
+    setSelectedValue?: Dispatch<string>;
 }
-export declare const TabContext: import("react").Context<ITabsContext>;
+export declare const TabContext: Context<ITabsContext>;
 export declare const useTabContext: () => ITabsContext;

package/components/component.enums.d.ts

@@ -19,7 +19,7 @@ export declare enum POSITION {
     right = "right",
     left = "left"
 }
-export declare const STATUS: {
-    HOVERED: string;
-    NORMAL: string;
-};
+export declare enum STATUS {
+    HOVERED = "hovered",
+    NORMAL = "normal"
+}

package/index.d.ts

@@ -1,3 +1,4 @@
 export * from './components';
 export * from './hooks';
 export * from './icons';
+export * from './interfaces';

package/index.es.js

@@ -2,7 +2,7 @@ import React, { useRef, useEffect, useState, useMemo, createContext, useContext,
 import reactDom, { createPortal } from 'react-dom';
 import { createPopper } from '@popperjs/core';
 
-/******************************************************************************
+/*! *****************************************************************************
 Copyright (c) Microsoft Corporation.
 
 Permission to use, copy, modify, and/or distribute this software for any
@@ -55,10 +55,11 @@ var POSITION;
     POSITION["right"] = "right";
     POSITION["left"] = "left";
 })(POSITION || (POSITION = {}));
-const STATUS = {
-    HOVERED: 'hovered',
-    NORMAL: 'normal',
-};
+var STATUS;
+(function (STATUS) {
+    STATUS["HOVERED"] = "hovered";
+    STATUS["NORMAL"] = "normal";
+})(STATUS || (STATUS = {}));
 
 function styleInject(css, ref) {
   if ( ref === void 0 ) ref = {};
@@ -235,8 +236,9 @@ function useDebounce(callback, timeout, deps) {
 
 const useConstructor = (callBack) => {
     const [hasBeenCalled, setHasBeenCalled] = useState(false);
-    if (hasBeenCalled)
+    if (hasBeenCalled) {
         return;
+    }
     callBack();
     setHasBeenCalled(true);
 };
@@ -1115,8 +1117,9 @@ const Select = (props) => {
                 case 'Enter':
                     if (hoverIndex) {
                         const option = options[hoverIndex];
-                        if (option)
+                        if (option) {
                             handleOnClick(option);
+                        }
                     }
                     break;
             }
@@ -1124,11 +1127,12 @@ const Select = (props) => {
     };
     return (React.createElement("div", { ref: selectConainter, className: styles$B.selectContainer },
         React.createElement("div", { id: id, className: getCssClass(), onClick: () => show(), tabIndex: 0, onKeyDown: e => handleOnKeyDown(e) },
-            !multiple && renderSingleViewModel(),
-            multiple &&
-                React.createElement("div", { className: styles$B.chipContainer }, renderMultipleViewModel()),
-            React.createElement(Icon, { className: "ml-auto" },
-                React.createElement(ChevronDownSolidIcon, null))),
+            React.createElement(React.Fragment, null,
+                !multiple && renderSingleViewModel(),
+                multiple &&
+                    React.createElement("div", { className: styles$B.chipContainer }, renderMultipleViewModel()),
+                React.createElement(Icon, { className: "ml-auto" },
+                    React.createElement(ChevronDownSolidIcon, null)))),
         isShow &&
             React.createElement(Portal, { className: 'backdrop-root' },
                 React.createElement("div", { className: styles$B.selectMenu, style: { left: (_a = selectConainter.current) === null || _a === void 0 ? void 0 : _a.getBoundingClientRect().x, top: (_b = selectConainter.current) === null || _b === void 0 ? void 0 : _b.getBoundingClientRect().y, width: (_c = selectConainter.current) === null || _c === void 0 ? void 0 : _c.getBoundingClientRect().width } },
@@ -1233,9 +1237,9 @@ const EmailValidator = (value) => {
 
 const IsEqualValidator = (valueA, valueB) => valueA === valueB;
 
-const MaxValidator = (valueA, valueB) => valueA <= valueB;
+const MaxValidator = (val, valueB) => val.length <= valueB;
 
-const MinValidator = (valueA, valueB) => valueA >= valueB;
+const MinValidator = (val, minLength) => val.length >= minLength;
 
 // values, isSubmitting, handleChange, handleBlur, handleSubmit
 class Form extends Component {
@@ -1256,8 +1260,10 @@ class Form extends Component {
             const keys = Object.keys(this.state.controls);
             const values = keys.reduce((obj, f) => {
                 const control = this.getControl(f);
-                // TODO - refactor
-                const newValue = ((control.type === 'date' || control.type === 'datetime-local') && control.value && isValidDate((control.value))) ? new Date((control.value)).toISOString() : control.value;
+                // eslint-disable-next-line @typescript-eslint/no-explicit-any
+                const newValue = ((control.type === 'date' || control.type === 'datetime-local') &&
+                    control.value &&
+                    isValidDate((control.value))) ? new Date((control.value)).toISOString() : control.value;
                 return (Object.assign(Object.assign({}, obj), { [f]: newValue }));
             }, {});
             if (this.state.isValid && this.state.isSubmitted) {
@@ -1288,12 +1294,12 @@ class Form extends Component {
                         break;
                     case 'min':
                         if (!MinValidator(fieldValue, parseInt(validatorParam))) {
-                            errors.push({ validator: validatorName, message: `Number is less than ${validatorParam}` });
+                            errors.push({ validator: validatorName, message: `Minimum number of ${validatorParam} characters not met` });
                         }
                         break;
                     case 'max':
                         if (!MaxValidator(fieldValue, parseInt(validatorParam))) {
-                            errors.push({ validator: validatorName, message: `Number is greater than ${validatorParam}` });
+                            errors.push({ validator: validatorName, message: `Maximum number of ${validatorParam} characters exceeded` });
                         }
                         break;
                     case 'match':
@@ -1398,8 +1404,7 @@ class Form extends Component {
         this.setState({ controls: {}, isValid: false, isChanged: false, isSubmitted: false });
     }
     getFormGroupCssClass(fieldKey) {
-        const result = this.getControl(fieldKey).config.formGroupClassName;
-        return result;
+        return this.getControl(fieldKey).config.formGroupClassName;
     }
     render() {
         return (React.createElement("form", { ref: this.myForm }, this.state && this.state.controls && Object.keys(this.state.controls).map((fieldKey) => {
@@ -1581,7 +1586,7 @@ const DrawerContent = (props) => {
     };
     const positionStyles = {
         left: { left: '0px' },
-        right: { right: '0px' },
+        right: { right: '0px' }
     };
     const getStyles = () => {
         return !permanent ? positionStyles[position] : undefined;
@@ -1668,7 +1673,7 @@ const MenuItem = (props) => {
 };
 
 const MenuToggle = ({ children }) => {
-    return (React.createElement(Fragment, null, children));
+    return children;
 };
 
 var css_248z$v = ".MenuDivider-module_menuItemDivider__oRP-j {\n  height: 0;\n  margin: 0.5rem 0;\n  overflow: hidden;\n  border-top: 1px solid #e9ecef;\n}";
@@ -1911,7 +1916,7 @@ const Modal = (props) => {
                         React.createElement(ModalBody, null, children),
                         footer &&
                             React.createElement(ModalFooter, null, footer))))),
-        React.createElement(Backdrop, { onClick: handleClickBackdrop })));
+        React.createElement(Backdrop, { onClick: handleClickBackdrop, style: { zIndex: 1040 } })));
 };
 
 var MODALTYPE;
@@ -1968,10 +1973,10 @@ const GlobalModal = ({ title, description, formControls, onOk, onChange, onCance
         }
         button.handler && button.handler();
     };
-    return (React.createElement(Modal, { size: size, fullScreen: fullScreen, header: title, onHeaderCloseClick: onCancel, onBackdropClick: onBackdropClick, isDismissable: isDismissable, footer: React.createElement(Fragment, null, buttons.map((button, index) => (React.createElement(Button, { key: index, variant: button.variant, color: button.color, autoFocus: button.autoFocus, shadow: button.shadow, onClick: () => handleClickButton(button) }, button.label)))) },
+    return (React.createElement(Modal, { size: size, fullScreen: fullScreen, header: title, onHeaderCloseClick: onCancel, onBackdropClick: onBackdropClick, isDismissable: isDismissable, footer: React.createElement(React.Fragment, null, buttons.map((button, index) => (React.createElement(Button, { key: index, variant: button.variant, color: button.color, autoFocus: button.autoFocus, shadow: button.shadow, onClick: () => handleClickButton(button) }, button.label)))) },
         description && React.createElement("div", null, description),
         modalType === MODALTYPE.FORM &&
-            React.createElement(Fragment, null,
+            React.createElement(React.Fragment, null,
                 React.createElement(Form, { ref: myForm, controls: myControls, validateOnBlur: true, onSubmit: onSubmit, onChange: onChange }))));
 };
 
@@ -1998,7 +2003,7 @@ class ModalService {
         return new Promise((resolve, reject) => {
             if (!this.container) {
                 this.container = document.createElement('div');
-                document.body.appendChild(this.container);
+                this.container.classList.add('modal-container');
                 const handleOk = (values) => {
                     resolve(values);
                     this.hide();
@@ -2020,7 +2025,7 @@ class ModalService {
         var _a;
         if (this.container) {
             (_a = this.root) === null || _a === void 0 ? void 0 : _a.unmount();
-            document.body.removeChild(this.container);
+            // document.body.removeChild(this.container);
             this.container = undefined;
         }
     }
@@ -2299,10 +2304,12 @@ const SpeedDial = (props) => {
         return cssClasses.filter(css => css).join(' ');
     };
     const handleClick = (e) => {
-        if (open)
+        if (open) {
             onClose && onClose(e);
-        else
+        }
+        else {
             onOpen && onOpen(e);
+        }
     };
     return (React.createElement("div", Object.assign({ className: getCssClasses() }, rest),
         React.createElement("div", { style: { 'transform': open ? 'rotate(45deg)' : undefined } },
@@ -2664,11 +2671,7 @@ const TableCell = (props) => {
             React.createElement("td", Object.assign({}, rest), children)) }, children));
 };
 
-const TabContext = createContext({
-    fixed: false,
-    selectedValue: '',
-    setSelectedValue: () => { }
-});
+const TabContext = createContext({});
 const useTabContext = () => useContext(TabContext);
 
 var css_248z$4 = ".TabIndicator-module_tabIndicator__jSJhH {\n  bottom: 0;\n  height: 2px;\n  position: absolute;\n  transition: all 300ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;\n}\n.TabIndicator-module_tabIndicator__jSJhH.TabIndicator-module_primary__Q5jEo {\n  background-color: var(--primary);\n}\n.TabIndicator-module_tabIndicator__jSJhH.TabIndicator-module_accent__qbgIG {\n  background-color: var(--accent);\n}";
@@ -2705,17 +2708,20 @@ const Tabs = (props) => {
     const prevSelectedValueRef = useRef();
     useEffect(() => {
         if (value !== undefined && value !== prevSelectedValueRef.current) {
+            prevSelectedValueRef.current = value;
             setSelectedValue(value);
         }
     }, [value]);
     useEffect(() => {
-        React.Children.toArray(children).forEach((child, index) => {
-            if (child.props.value === selectedValue) {
-                setSelectedIndex(index);
-                onChange && onChange(selectedValue);
-            }
-        });
-    }, [children, selectedValue]);
+        if (selectedValue && children) {
+            React.Children.toArray(children).forEach((child, index) => {
+                if (child.props.value === selectedValue) {
+                    setSelectedIndex(index);
+                    onChange && onChange(selectedValue);
+                }
+            });
+        }
+    }, [selectedValue]);
     const getCssClasses = () => {
         const cssClasses = [];
         cssClasses.push(styles$3.tabs);
@@ -2745,7 +2751,7 @@ const Tab = (props) => {
     };
     const handleClick = (event) => {
         onClick && onClick({ event, value });
-        setSelectedValue(value);
+        setSelectedValue && setSelectedValue(value);
     };
     return (React.createElement(Button, { className: getCssClasses(), onClick: handleClick, isActive: selectedValue === value, disabled: disabled }, label));
 };
@@ -2924,12 +2930,14 @@ const TreeItem = (props) => {
         return cssClasses.filter(css => css).join(' ');
     };
     useEffect(() => {
-        if (isExpanded !== undefined)
+        if (isExpanded !== undefined) {
             setIsExpanded(isExpanded);
+        }
     }, [isExpanded]);
     useEffect(() => {
-        if (isSelected !== undefined)
+        if (isSelected !== undefined) {
             setIsSelected(isSelected);
+        }
     }, [isSelected]);
     const handleOnToggleExpand = (nodeId) => {
         setIsExpanded(!_isExpanded);

package/index.js

@@ -11,7 +11,7 @@ function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'defau
 var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
 var reactDom__default = /*#__PURE__*/_interopDefaultLegacy(reactDom);
 
-/******************************************************************************
+/*! *****************************************************************************
 Copyright (c) Microsoft Corporation.
 
 Permission to use, copy, modify, and/or distribute this software for any
@@ -64,10 +64,11 @@ exports.POSITION = void 0;
     POSITION["right"] = "right";
     POSITION["left"] = "left";
 })(exports.POSITION || (exports.POSITION = {}));
-const STATUS = {
-    HOVERED: 'hovered',
-    NORMAL: 'normal',
-};
+exports.STATUS = void 0;
+(function (STATUS) {
+    STATUS["HOVERED"] = "hovered";
+    STATUS["NORMAL"] = "normal";
+})(exports.STATUS || (exports.STATUS = {}));
 
 function styleInject(css, ref) {
   if ( ref === void 0 ) ref = {};
@@ -244,8 +245,9 @@ function useDebounce(callback, timeout, deps) {
 
 const useConstructor = (callBack) => {
     const [hasBeenCalled, setHasBeenCalled] = React.useState(false);
-    if (hasBeenCalled)
+    if (hasBeenCalled) {
         return;
+    }
     callBack();
     setHasBeenCalled(true);
 };
@@ -1124,8 +1126,9 @@ const Select = (props) => {
                 case 'Enter':
                     if (hoverIndex) {
                         const option = options[hoverIndex];
-                        if (option)
+                        if (option) {
                             handleOnClick(option);
+                        }
                     }
                     break;
             }
@@ -1133,11 +1136,12 @@ const Select = (props) => {
     };
     return (React__default["default"].createElement("div", { ref: selectConainter, className: styles$B.selectContainer },
         React__default["default"].createElement("div", { id: id, className: getCssClass(), onClick: () => show(), tabIndex: 0, onKeyDown: e => handleOnKeyDown(e) },
-            !multiple && renderSingleViewModel(),
-            multiple &&
-                React__default["default"].createElement("div", { className: styles$B.chipContainer }, renderMultipleViewModel()),
-            React__default["default"].createElement(Icon, { className: "ml-auto" },
-                React__default["default"].createElement(ChevronDownSolidIcon, null))),
+            React__default["default"].createElement(React__default["default"].Fragment, null,
+                !multiple && renderSingleViewModel(),
+                multiple &&
+                    React__default["default"].createElement("div", { className: styles$B.chipContainer }, renderMultipleViewModel()),
+                React__default["default"].createElement(Icon, { className: "ml-auto" },
+                    React__default["default"].createElement(ChevronDownSolidIcon, null)))),
         isShow &&
             React__default["default"].createElement(Portal, { className: 'backdrop-root' },
                 React__default["default"].createElement("div", { className: styles$B.selectMenu, style: { left: (_a = selectConainter.current) === null || _a === void 0 ? void 0 : _a.getBoundingClientRect().x, top: (_b = selectConainter.current) === null || _b === void 0 ? void 0 : _b.getBoundingClientRect().y, width: (_c = selectConainter.current) === null || _c === void 0 ? void 0 : _c.getBoundingClientRect().width } },
@@ -1242,9 +1246,9 @@ const EmailValidator = (value) => {
 
 const IsEqualValidator = (valueA, valueB) => valueA === valueB;
 
-const MaxValidator = (valueA, valueB) => valueA <= valueB;
+const MaxValidator = (val, valueB) => val.length <= valueB;
 
-const MinValidator = (valueA, valueB) => valueA >= valueB;
+const MinValidator = (val, minLength) => val.length >= minLength;
 
 // values, isSubmitting, handleChange, handleBlur, handleSubmit
 class Form extends React.Component {
@@ -1265,8 +1269,10 @@ class Form extends React.Component {
             const keys = Object.keys(this.state.controls);
             const values = keys.reduce((obj, f) => {
                 const control = this.getControl(f);
-                // TODO - refactor
-                const newValue = ((control.type === 'date' || control.type === 'datetime-local') && control.value && isValidDate((control.value))) ? new Date((control.value)).toISOString() : control.value;
+                // eslint-disable-next-line @typescript-eslint/no-explicit-any
+                const newValue = ((control.type === 'date' || control.type === 'datetime-local') &&
+                    control.value &&
+                    isValidDate((control.value))) ? new Date((control.value)).toISOString() : control.value;
                 return (Object.assign(Object.assign({}, obj), { [f]: newValue }));
             }, {});
             if (this.state.isValid && this.state.isSubmitted) {
@@ -1297,12 +1303,12 @@ class Form extends React.Component {
                         break;
                     case 'min':
                         if (!MinValidator(fieldValue, parseInt(validatorParam))) {
-                            errors.push({ validator: validatorName, message: `Number is less than ${validatorParam}` });
+                            errors.push({ validator: validatorName, message: `Minimum number of ${validatorParam} characters not met` });
                         }
                         break;
                     case 'max':
                         if (!MaxValidator(fieldValue, parseInt(validatorParam))) {
-                            errors.push({ validator: validatorName, message: `Number is greater than ${validatorParam}` });
+                            errors.push({ validator: validatorName, message: `Maximum number of ${validatorParam} characters exceeded` });
                         }
                         break;
                     case 'match':
@@ -1407,8 +1413,7 @@ class Form extends React.Component {
         this.setState({ controls: {}, isValid: false, isChanged: false, isSubmitted: false });
     }
     getFormGroupCssClass(fieldKey) {
-        const result = this.getControl(fieldKey).config.formGroupClassName;
-        return result;
+        return this.getControl(fieldKey).config.formGroupClassName;
     }
     render() {
         return (React__default["default"].createElement("form", { ref: this.myForm }, this.state && this.state.controls && Object.keys(this.state.controls).map((fieldKey) => {
@@ -1590,7 +1595,7 @@ const DrawerContent = (props) => {
     };
     const positionStyles = {
         left: { left: '0px' },
-        right: { right: '0px' },
+        right: { right: '0px' }
     };
     const getStyles = () => {
         return !permanent ? positionStyles[position] : undefined;
@@ -1677,7 +1682,7 @@ const MenuItem = (props) => {
 };
 
 const MenuToggle = ({ children }) => {
-    return (React__default["default"].createElement(React.Fragment, null, children));
+    return children;
 };
 
 var css_248z$v = ".MenuDivider-module_menuItemDivider__oRP-j {\n  height: 0;\n  margin: 0.5rem 0;\n  overflow: hidden;\n  border-top: 1px solid #e9ecef;\n}";
@@ -1766,13 +1771,13 @@ styleInject(css_248z$q);
 
 const Link = (props) => {
     const { href = '#', className, target, children } = props, rest = __rest(props, ["href", "className", "target", "children"]);
-    const [status, setStatus] = React.useState(STATUS.NORMAL);
+    const [status, setStatus] = React.useState(exports.STATUS.NORMAL);
     const [cssClassName] = useCssClasses([styles$q.link, className, status]);
     const onMouseEnter = () => {
-        setStatus(STATUS.HOVERED);
+        setStatus(exports.STATUS.HOVERED);
     };
     const onMouseLeave = () => {
-        setStatus(STATUS.NORMAL);
+        setStatus(exports.STATUS.NORMAL);
     };
     return (React__default["default"].createElement("a", Object.assign({ className: cssClassName, href: href, target: target, onMouseEnter: onMouseEnter, onMouseLeave: onMouseLeave }, rest), children));
 };
@@ -1920,7 +1925,7 @@ const Modal = (props) => {
                         React__default["default"].createElement(ModalBody, null, children),
                         footer &&
                             React__default["default"].createElement(ModalFooter, null, footer))))),
-        React__default["default"].createElement(Backdrop, { onClick: handleClickBackdrop })));
+        React__default["default"].createElement(Backdrop, { onClick: handleClickBackdrop, style: { zIndex: 1040 } })));
 };
 
 exports.MODALTYPE = void 0;
@@ -1977,10 +1982,10 @@ const GlobalModal = ({ title, description, formControls, onOk, onChange, onCance
         }
         button.handler && button.handler();
     };
-    return (React__default["default"].createElement(Modal, { size: size, fullScreen: fullScreen, header: title, onHeaderCloseClick: onCancel, onBackdropClick: onBackdropClick, isDismissable: isDismissable, footer: React__default["default"].createElement(React.Fragment, null, buttons.map((button, index) => (React__default["default"].createElement(Button, { key: index, variant: button.variant, color: button.color, autoFocus: button.autoFocus, shadow: button.shadow, onClick: () => handleClickButton(button) }, button.label)))) },
+    return (React__default["default"].createElement(Modal, { size: size, fullScreen: fullScreen, header: title, onHeaderCloseClick: onCancel, onBackdropClick: onBackdropClick, isDismissable: isDismissable, footer: React__default["default"].createElement(React__default["default"].Fragment, null, buttons.map((button, index) => (React__default["default"].createElement(Button, { key: index, variant: button.variant, color: button.color, autoFocus: button.autoFocus, shadow: button.shadow, onClick: () => handleClickButton(button) }, button.label)))) },
         description && React__default["default"].createElement("div", null, description),
         modalType === exports.MODALTYPE.FORM &&
-            React__default["default"].createElement(React.Fragment, null,
+            React__default["default"].createElement(React__default["default"].Fragment, null,
                 React__default["default"].createElement(Form, { ref: myForm, controls: myControls, validateOnBlur: true, onSubmit: onSubmit, onChange: onChange }))));
 };
 
@@ -2007,7 +2012,7 @@ class ModalService {
         return new Promise((resolve, reject) => {
             if (!this.container) {
                 this.container = document.createElement('div');
-                document.body.appendChild(this.container);
+                this.container.classList.add('modal-container');
                 const handleOk = (values) => {
                     resolve(values);
                     this.hide();
@@ -2029,7 +2034,7 @@ class ModalService {
         var _a;
         if (this.container) {
             (_a = this.root) === null || _a === void 0 ? void 0 : _a.unmount();
-            document.body.removeChild(this.container);
+            // document.body.removeChild(this.container);
             this.container = undefined;
         }
     }
@@ -2308,10 +2313,12 @@ const SpeedDial = (props) => {
         return cssClasses.filter(css => css).join(' ');
     };
     const handleClick = (e) => {
-        if (open)
+        if (open) {
             onClose && onClose(e);
-        else
+        }
+        else {
             onOpen && onOpen(e);
+        }
     };
     return (React__default["default"].createElement("div", Object.assign({ className: getCssClasses() }, rest),
         React__default["default"].createElement("div", { style: { 'transform': open ? 'rotate(45deg)' : undefined } },
@@ -2673,11 +2680,7 @@ const TableCell = (props) => {
             React__default["default"].createElement("td", Object.assign({}, rest), children)) }, children));
 };
 
-const TabContext = React.createContext({
-    fixed: false,
-    selectedValue: '',
-    setSelectedValue: () => { }
-});
+const TabContext = React.createContext({});
 const useTabContext = () => React.useContext(TabContext);
 
 var css_248z$4 = ".TabIndicator-module_tabIndicator__jSJhH {\n  bottom: 0;\n  height: 2px;\n  position: absolute;\n  transition: all 300ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;\n}\n.TabIndicator-module_tabIndicator__jSJhH.TabIndicator-module_primary__Q5jEo {\n  background-color: var(--primary);\n}\n.TabIndicator-module_tabIndicator__jSJhH.TabIndicator-module_accent__qbgIG {\n  background-color: var(--accent);\n}";
@@ -2714,17 +2717,20 @@ const Tabs = (props) => {
     const prevSelectedValueRef = React.useRef();
     React.useEffect(() => {
         if (value !== undefined && value !== prevSelectedValueRef.current) {
+            prevSelectedValueRef.current = value;
             setSelectedValue(value);
         }
     }, [value]);
     React.useEffect(() => {
-        React__default["default"].Children.toArray(children).forEach((child, index) => {
-            if (child.props.value === selectedValue) {
-                setSelectedIndex(index);
-                onChange && onChange(selectedValue);
-            }
-        });
-    }, [children, selectedValue]);
+        if (selectedValue && children) {
+            React__default["default"].Children.toArray(children).forEach((child, index) => {
+                if (child.props.value === selectedValue) {
+                    setSelectedIndex(index);
+                    onChange && onChange(selectedValue);
+                }
+            });
+        }
+    }, [selectedValue]);
     const getCssClasses = () => {
         const cssClasses = [];
         cssClasses.push(styles$3.tabs);
@@ -2754,7 +2760,7 @@ const Tab = (props) => {
     };
     const handleClick = (event) => {
         onClick && onClick({ event, value });
-        setSelectedValue(value);
+        setSelectedValue && setSelectedValue(value);
     };
     return (React__default["default"].createElement(Button, { className: getCssClasses(), onClick: handleClick, isActive: selectedValue === value, disabled: disabled }, label));
 };
@@ -2933,12 +2939,14 @@ const TreeItem = (props) => {
         return cssClasses.filter(css => css).join(' ');
     };
     React.useEffect(() => {
-        if (isExpanded !== undefined)
+        if (isExpanded !== undefined) {
             setIsExpanded(isExpanded);
+        }
     }, [isExpanded]);
     React.useEffect(() => {
-        if (isSelected !== undefined)
+        if (isSelected !== undefined) {
             setIsSelected(isSelected);
+        }
     }, [isSelected]);
     const handleOnToggleExpand = (nodeId) => {
         setIsExpanded(!_isExpanded);
@@ -3040,7 +3048,6 @@ exports.PlusSolidIcon = PlusSolidIcon;
 exports.Portal = Portal;
 exports.ProgressBar = ProgressBar;
 exports.Row = Row;
-exports.STATUS = STATUS;
 exports.SecondSelect = SecondSelect;
 exports.Select = Select;
 exports.Sidebar = Sidebar;

package/interfaces/index.d.ts

@@ -0,0 +1 @@
+export * from './interfaces';

package/interfaces/interfaces.d.ts

@@ -0,0 +1,3 @@
+export interface IDictionary<T> {
+    [key: string]: T;
+}

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "react-asc",
-	"version": "25.0.1",
+	"version": "25.0.4",
 	"description": "handcrafted react components",
 	"main": "index.js",
 	"module": "index.es.js",