@itcase/ui 1.8.160 → 1.8.162

package/dist/cjs/components/Modal.js

@@ -117,16 +117,16 @@ const modalConfig = {
         modalConfig.appearance = appearanceConfig;
     },
 };
-const getOrCreateModalElement = (modalQuerySelector, className = '') => {
+const getOrCreateModalElement = (modalIdQuerySelector, className = '') => {
     // prettier-ignore
     const classList = className && typeof className === 'string'
         ? className.split(' ').filter(Boolean)
         : [];
-    let modalElement = document.querySelector(modalQuerySelector);
+    let modalElement = document.getElementById(modalIdQuerySelector);
     if (!modalElement) {
         // Add modal element into the DOM on mount.
         modalElement = document.createElement('div');
-        modalElement.setAttribute('id', 'modal-global');
+        modalElement.setAttribute('id', modalIdQuerySelector);
         modalElement.classList.add('modal');
         if (classList.length) {
             modalElement.classList.add(...classList);
@@ -137,7 +137,7 @@ const getOrCreateModalElement = (modalQuerySelector, className = '') => {
 };
 // Modal component that is an abstraction around the portal API.
 const Modal = React.forwardRef(function Modal(props, ref) {
-    const { id, appearance, className, dataTestId, dataTour, title, absoluteHeader = false, modalQuerySelector = '#modal-global', print, scroll = false, stickyHeader = false, closeIcon, isDisabled, isSkeleton, isCloseOnBlur = true, isOpen: initialIsOpen = false, isOverlay = true, isScrollOnOpen = true, isSetFocusOnOpen = true, onClickOverlay, onCloseModal, onOpenModal, children, } = props;
+    const { id, appearance, className, dataTestId, dataTour, title, absoluteHeader = false, modalIdQuerySelector = 'modal-global', print, scroll = false, stickyHeader = false, closeIcon, isDisabled, isSkeleton, isCloseOnBlur = true, isOpen: initialIsOpen = false, isOverlay = true, isScrollOnOpen = true, isSetFocusOnOpen = true, onClickOverlay, onCloseModal, onOpenModal, children, } = props;
     // Query DOM element
     const [modalElement, setModalElement] = React.useState(null);
     const [isOpen, setIsOpen] = React.useState(initialIsOpen);
@@ -215,12 +215,12 @@ const Modal = React.forwardRef(function Modal(props, ref) {
         if (print === false) {
             classNameModal = clsx(className, 'no-print');
         }
-        const element = getOrCreateModalElement(modalQuerySelector, classNameModal);
+        const element = getOrCreateModalElement(modalIdQuerySelector, classNameModal);
         setModalElement(element);
         if (element) {
             addModalProps(element);
         }
-    }, [addModalProps, className, modalQuerySelector]);
+    }, [addModalProps, className, modalIdQuerySelector]);
     // Save ref things
     React.useImperativeHandle(ref, () => ({ modalElement, openModal, closeModal, isOpen }), [isOpen, openModal, closeModal, modalElement]);
     const appearanceConfig = useAppearanceConfig.useAppearanceConfig(appearance, modalConfig, isDisabled);

package/dist/components/Modal.js

@@ -115,16 +115,16 @@ const modalConfig = {
         modalConfig.appearance = appearanceConfig;
     },
 };
-const getOrCreateModalElement = (modalQuerySelector, className = '') => {
+const getOrCreateModalElement = (modalIdQuerySelector, className = '') => {
     // prettier-ignore
     const classList = className && typeof className === 'string'
         ? className.split(' ').filter(Boolean)
         : [];
-    let modalElement = document.querySelector(modalQuerySelector);
+    let modalElement = document.getElementById(modalIdQuerySelector);
     if (!modalElement) {
         // Add modal element into the DOM on mount.
         modalElement = document.createElement('div');
-        modalElement.setAttribute('id', 'modal-global');
+        modalElement.setAttribute('id', modalIdQuerySelector);
         modalElement.classList.add('modal');
         if (classList.length) {
             modalElement.classList.add(...classList);
@@ -135,7 +135,7 @@ const getOrCreateModalElement = (modalQuerySelector, className = '') => {
 };
 // Modal component that is an abstraction around the portal API.
 const Modal = React.forwardRef(function Modal(props, ref) {
-    const { id, appearance, className, dataTestId, dataTour, title, absoluteHeader = false, modalQuerySelector = '#modal-global', print, scroll = false, stickyHeader = false, closeIcon, isDisabled, isSkeleton, isCloseOnBlur = true, isOpen: initialIsOpen = false, isOverlay = true, isScrollOnOpen = true, isSetFocusOnOpen = true, onClickOverlay, onCloseModal, onOpenModal, children, } = props;
+    const { id, appearance, className, dataTestId, dataTour, title, absoluteHeader = false, modalIdQuerySelector = 'modal-global', print, scroll = false, stickyHeader = false, closeIcon, isDisabled, isSkeleton, isCloseOnBlur = true, isOpen: initialIsOpen = false, isOverlay = true, isScrollOnOpen = true, isSetFocusOnOpen = true, onClickOverlay, onCloseModal, onOpenModal, children, } = props;
     // Query DOM element
     const [modalElement, setModalElement] = useState(null);
     const [isOpen, setIsOpen] = useState(initialIsOpen);
@@ -213,12 +213,12 @@ const Modal = React.forwardRef(function Modal(props, ref) {
         if (print === false) {
             classNameModal = clsx(className, 'no-print');
         }
-        const element = getOrCreateModalElement(modalQuerySelector, classNameModal);
+        const element = getOrCreateModalElement(modalIdQuerySelector, classNameModal);
         setModalElement(element);
         if (element) {
             addModalProps(element);
         }
-    }, [addModalProps, className, modalQuerySelector]);
+    }, [addModalProps, className, modalIdQuerySelector]);
     // Save ref things
     useImperativeHandle(ref, () => ({ modalElement, openModal, closeModal, isOpen }), [isOpen, openModal, closeModal, modalElement]);
     const appearanceConfig = useAppearanceConfig(appearance, modalConfig, isDisabled);

package/dist/css/components/Logo/Logo.css

@@ -94,34 +94,3 @@
       }
   }
 }
-:root {
-  /* Size */
-    --logo-size-xxl-width: 0
-;
-    --logo-size-xxl-height: 0
-;
-    --logo-size-xl-width: 1
-;
-    --logo-size-xl-height: 1
-;
-    --logo-size-l-width: 2
-;
-    --logo-size-l-height: 2
-;
-    --logo-size-m-width: 3
-;
-    --logo-size-m-height: 3
-;
-    --logo-size-s-width: 4
-;
-    --logo-size-s-height: 4
-;
-    --logo-size-xs-width: 5
-;
-    --logo-size-xs-height: 5
-;
-    --logo-size-xxs-width: 6
-;
-    --logo-size-xxs-height: 6
-
-}

package/dist/css/styles/bundle.css

@@ -79311,37 +79311,6 @@ div.label {
       }
   }
 }
-:root {
-  /* Size */
-    --logo-size-xxl-width: 0
-;
-    --logo-size-xxl-height: 0
-;
-    --logo-size-xl-width: 1
-;
-    --logo-size-xl-height: 1
-;
-    --logo-size-l-width: 2
-;
-    --logo-size-l-height: 2
-;
-    --logo-size-m-width: 3
-;
-    --logo-size-m-height: 3
-;
-    --logo-size-s-width: 4
-;
-    --logo-size-s-height: 4
-;
-    --logo-size-xs-width: 5
-;
-    --logo-size-xs-height: 5
-;
-    --logo-size-xxs-width: 6
-;
-    --logo-size-xxs-height: 6
-
-}
 .menu-item {
   position: relative;
   display: flex;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@itcase/ui",
-  "version": "1.8.160",
+  "version": "1.8.162",
   "description": "UI components (Modal, Loader, Popup, etc)",
   "keywords": [
     "Modal",