intelicoreact 1.6.25 → 1.6.27

package/dist/Atomic/UI/Modal/partials/useMobileModal.js

@@ -1,192 +1 @@
-/* eslint-disable react-web-api/no-leaked-event-listener */ "use strict";
-Object.defineProperty(exports, "__esModule", {
-    value: true
-});
-Object.defineProperty(exports, "default", {
-    enumerable: true,
-    get: function() {
-        return useMobileModal;
-    }
-});
-const _jsxruntime = require("react/jsx-runtime");
-const _react = require("react");
-const _useIsMobile = /*#__PURE__*/ _interop_require_default(require("../../../../Functions/useIsMobile/useIsMobile"));
-function _interop_require_default(obj) {
-    return obj && obj.__esModule ? obj : {
-        default: obj
-    };
-}
-const SCROLL_DIRECTION = {
-    UP: 'up',
-    DOWN: 'down'
-};
-function useMobileModal({ modalRef, withMobileLogic = false, withFixedFooter = false, isOpen = false }) {
-    var _modalMobileHeaderRef_current_getBoundingClientRect, _modalMobileHeaderRef_current, _modalMobileFooterRef_current_getBoundingClientRect, _modalMobileFooterRef_current;
-    const modalMobileContainerRef = (0, _react.useRef)(null);
-    const modalMobileHeaderRef = (0, _react.useRef)(null);
-    const modalMobileFooterRef = (0, _react.useRef)(null);
-    const modalMobileBodyRef = (0, _react.useRef)(null);
-    const { isMobile } = (0, _useIsMobile.default)();
-    const [modalHeight, setModalHeight] = (0, _react.useState)(0);
-    const [modalsLogic, setModalsLogic] = (0, _react.useState)({
-        IS_HEADER_HIDDEN: false,
-        IS_HEADER_STICKY: false,
-        IS_FOOTER_HIDDEN: false,
-        IS_FOOTER_STICKY: withFixedFooter
-    });
-    const [modalsLogicProps, setModalsLogicProps] = (0, _react.useState)({
-        headerHeight: 0,
-        footerHeight: 0
-    });
-    const [scrollDirection, setScrollDirection] = (0, _react.useState)(SCROLL_DIRECTION.UP);
-    const [scrollTopPrev, setScrollTopPrev] = (0, _react.useState)(0);
-    const [scrollTop, setScrollTop] = (0, _react.useState)(0);
-    const [scrollHeight, setScrollHeight] = (0, _react.useState)(1);
-    const [, setContainerScrollHeight] = (0, _react.useState)(1);
-    /* MODALS LOGIC | BEGIN */ // Count ScrollTop
-    (0, _react.useLayoutEffect)(()=>{
-        const el = modalMobileContainerRef === null || modalMobileContainerRef === void 0 ? void 0 : modalMobileContainerRef.current;
-        if (el) {
-            el.addEventListener('scroll', ()=>{
-                setScrollTop((scrollTop)=>{
-                    if (scrollTop !== el.scrollTop) setScrollTopPrev(scrollTop);
-                    return el.scrollTop;
-                });
-            });
-        }
-    }, [
-        modalMobileContainerRef === null || modalMobileContainerRef === void 0 ? void 0 : modalMobileContainerRef.current
-    ]);
-    // Count ScrollDirection
-    (0, _react.useEffect)(()=>{
-        setScrollDirection((prevScrollDirection)=>scrollTop < scrollTopPrev ? SCROLL_DIRECTION.UP : scrollTop > scrollTopPrev ? SCROLL_DIRECTION.DOWN : prevScrollDirection);
-    }, [
-        scrollTop,
-        scrollTopPrev
-    ]);
-    // Dynamic Modal Positioning
-    (0, _react.useLayoutEffect)(()=>{
-        if (isOpen) {
-            const modalStyle = (modalRef === null || modalRef === void 0 ? void 0 : modalRef.current) ? (modalRef === null || modalRef === void 0 ? void 0 : modalRef.current.style) || window.getComputedStyle(modalRef === null || modalRef === void 0 ? void 0 : modalRef.current) : {};
-            const computedModalHeight = (modalRef === null || modalRef === void 0 ? void 0 : modalRef.current) ? modalHeight + Number.parseFloat((modalStyle === null || modalStyle === void 0 ? void 0 : modalStyle.marginTop) || '0') : 0;
-            const windowHeight = document.documentElement.clientHeight || window.screen.availHeight || window.screen.height;
-            if (modalMobileContainerRef === null || modalMobileContainerRef === void 0 ? void 0 : modalMobileContainerRef.current) {
-                if (computedModalHeight <= windowHeight) {
-                    modalMobileContainerRef.current.style.display = 'flex';
-                    modalMobileContainerRef.current.style.alignItems = 'flex-end';
-                } else {
-                    var _modalMobileContainerRef_current_style, _modalMobileContainerRef_current, _modalMobileContainerRef_current_style1, _modalMobileContainerRef_current1;
-                    (_modalMobileContainerRef_current = modalMobileContainerRef.current) === null || _modalMobileContainerRef_current === void 0 ? void 0 : (_modalMobileContainerRef_current_style = _modalMobileContainerRef_current.style) === null || _modalMobileContainerRef_current_style === void 0 ? void 0 : _modalMobileContainerRef_current_style.removeProperty('display');
-                    (_modalMobileContainerRef_current1 = modalMobileContainerRef.current) === null || _modalMobileContainerRef_current1 === void 0 ? void 0 : (_modalMobileContainerRef_current_style1 = _modalMobileContainerRef_current1.style) === null || _modalMobileContainerRef_current_style1 === void 0 ? void 0 : _modalMobileContainerRef_current_style1.removeProperty('align-items');
-                }
-            }
-        }
-    }, [
-        modalsLogicProps,
-        isOpen,
-        isMobile,
-        modalHeight
-    ]);
-    // Calculating
-    (0, _react.useLayoutEffect)(()=>{
-        if (isMobile && isOpen) {
-            var _modalRef_current_getBoundingClientRect, _modalRef_current;
-            const newModalHeight = modalRef === null || modalRef === void 0 ? void 0 : (_modalRef_current = modalRef.current) === null || _modalRef_current === void 0 ? void 0 : (_modalRef_current_getBoundingClientRect = _modalRef_current.getBoundingClientRect()) === null || _modalRef_current_getBoundingClientRect === void 0 ? void 0 : _modalRef_current_getBoundingClientRect.height;
-            if (newModalHeight && modalHeight !== newModalHeight) {
-                setModalHeight(newModalHeight);
-            }
-        }
-    });
-    (0, _react.useEffect)(()=>{
-        if (isMobile && withMobileLogic) {
-            const { footerHeight, headerHeight } = modalsLogicProps;
-            setModalsLogic((prevStickyLogic)=>({
-                    IS_HEADER_HIDDEN: scrollDirection === SCROLL_DIRECTION.DOWN || scrollTop === 0,
-                    IS_HEADER_STICKY: scrollDirection === SCROLL_DIRECTION.UP && scrollTop !== 0 && (scrollTop >= headerHeight || prevStickyLogic.IS_HEADER_STICKY),
-                    IS_FOOTER_HIDDEN: !withFixedFooter && (scrollDirection === SCROLL_DIRECTION.UP || scrollHeight === Math.round(scrollTop)),
-                    IS_FOOTER_STICKY: withFixedFooter && scrollHeight > 1 || scrollDirection === SCROLL_DIRECTION.DOWN && (scrollHeight - Math.round(scrollTop) >= footerHeight || prevStickyLogic.IS_FOOTER_STICKY)
-                }));
-        }
-    }, [
-        scrollTop,
-        scrollHeight,
-        isMobile,
-        withMobileLogic,
-        scrollDirection,
-        modalsLogicProps,
-        modalHeight,
-        window.innerHeight
-    ]);
-    (0, _react.useLayoutEffect)(()=>{
-        var _modalMobileHeaderRef_current_getBoundingClientRect, _modalMobileHeaderRef_current;
-        if ((modalMobileHeaderRef === null || modalMobileHeaderRef === void 0 ? void 0 : (_modalMobileHeaderRef_current = modalMobileHeaderRef.current) === null || _modalMobileHeaderRef_current === void 0 ? void 0 : (_modalMobileHeaderRef_current_getBoundingClientRect = _modalMobileHeaderRef_current.getBoundingClientRect()) === null || _modalMobileHeaderRef_current_getBoundingClientRect === void 0 ? void 0 : _modalMobileHeaderRef_current_getBoundingClientRect.height) !== undefined) {
-            setModalsLogicProps((state)=>{
-                var _modalMobileHeaderRef_current_getBoundingClientRect, _modalMobileHeaderRef_current;
-                var _modalMobileHeaderRef_current_getBoundingClientRect_height;
-                return {
-                    ...state,
-                    headerHeight: (_modalMobileHeaderRef_current_getBoundingClientRect_height = modalMobileHeaderRef === null || modalMobileHeaderRef === void 0 ? void 0 : (_modalMobileHeaderRef_current = modalMobileHeaderRef.current) === null || _modalMobileHeaderRef_current === void 0 ? void 0 : (_modalMobileHeaderRef_current_getBoundingClientRect = _modalMobileHeaderRef_current.getBoundingClientRect()) === null || _modalMobileHeaderRef_current_getBoundingClientRect === void 0 ? void 0 : _modalMobileHeaderRef_current_getBoundingClientRect.height) !== null && _modalMobileHeaderRef_current_getBoundingClientRect_height !== void 0 ? _modalMobileHeaderRef_current_getBoundingClientRect_height : 0
-                };
-            });
-        }
-    }, [
-        modalMobileHeaderRef === null || modalMobileHeaderRef === void 0 ? void 0 : (_modalMobileHeaderRef_current = modalMobileHeaderRef.current) === null || _modalMobileHeaderRef_current === void 0 ? void 0 : (_modalMobileHeaderRef_current_getBoundingClientRect = _modalMobileHeaderRef_current.getBoundingClientRect()) === null || _modalMobileHeaderRef_current_getBoundingClientRect === void 0 ? void 0 : _modalMobileHeaderRef_current_getBoundingClientRect.height
-    ]);
-    (0, _react.useLayoutEffect)(()=>{
-        var _modalMobileFooterRef_current_getBoundingClientRect, _modalMobileFooterRef_current;
-        if ((modalMobileFooterRef === null || modalMobileFooterRef === void 0 ? void 0 : (_modalMobileFooterRef_current = modalMobileFooterRef.current) === null || _modalMobileFooterRef_current === void 0 ? void 0 : (_modalMobileFooterRef_current_getBoundingClientRect = _modalMobileFooterRef_current.getBoundingClientRect()) === null || _modalMobileFooterRef_current_getBoundingClientRect === void 0 ? void 0 : _modalMobileFooterRef_current_getBoundingClientRect.height) !== undefined) {
-            setModalsLogicProps((state)=>{
-                var _modalMobileFooterRef_current_getBoundingClientRect, _modalMobileFooterRef_current;
-                var _modalMobileFooterRef_current_getBoundingClientRect_height;
-                return {
-                    ...state,
-                    footerHeight: (_modalMobileFooterRef_current_getBoundingClientRect_height = modalMobileFooterRef === null || modalMobileFooterRef === void 0 ? void 0 : (_modalMobileFooterRef_current = modalMobileFooterRef.current) === null || _modalMobileFooterRef_current === void 0 ? void 0 : (_modalMobileFooterRef_current_getBoundingClientRect = _modalMobileFooterRef_current.getBoundingClientRect()) === null || _modalMobileFooterRef_current_getBoundingClientRect === void 0 ? void 0 : _modalMobileFooterRef_current_getBoundingClientRect.height) !== null && _modalMobileFooterRef_current_getBoundingClientRect_height !== void 0 ? _modalMobileFooterRef_current_getBoundingClientRect_height : 0
-                };
-            });
-        }
-    }, [
-        modalMobileFooterRef === null || modalMobileFooterRef === void 0 ? void 0 : (_modalMobileFooterRef_current = modalMobileFooterRef.current) === null || _modalMobileFooterRef_current === void 0 ? void 0 : (_modalMobileFooterRef_current_getBoundingClientRect = _modalMobileFooterRef_current.getBoundingClientRect()) === null || _modalMobileFooterRef_current_getBoundingClientRect === void 0 ? void 0 : _modalMobileFooterRef_current_getBoundingClientRect.height
-    ]);
-    (0, _react.useEffect)(()=>{
-        if (modalMobileContainerRef === null || modalMobileContainerRef === void 0 ? void 0 : modalMobileContainerRef.current) {
-            var _modalMobileContainerRef_current, _modalMobileContainerRef_current1;
-            setContainerScrollHeight(modalMobileContainerRef === null || modalMobileContainerRef === void 0 ? void 0 : (_modalMobileContainerRef_current = modalMobileContainerRef.current) === null || _modalMobileContainerRef_current === void 0 ? void 0 : _modalMobileContainerRef_current.scrollHeight);
-            setScrollHeight((modalMobileContainerRef === null || modalMobileContainerRef === void 0 ? void 0 : (_modalMobileContainerRef_current1 = modalMobileContainerRef.current) === null || _modalMobileContainerRef_current1 === void 0 ? void 0 : _modalMobileContainerRef_current1.scrollHeight) - window.innerHeight);
-        }
-    }, [
-        scrollTop,
-        modalMobileContainerRef === null || modalMobileContainerRef === void 0 ? void 0 : modalMobileContainerRef.current,
-        window.innerHeight
-    ]);
-    (0, _react.useEffect)(()=>{
-        window.addEventListener('resize', ()=>{
-            setContainerScrollHeight((containerScrollHeight)=>{
-                setScrollHeight(containerScrollHeight - window.innerHeight);
-                return containerScrollHeight;
-            });
-        });
-    }, []);
-    /* MODALS LOGIC | END */ const renderModal = (0, _react.useCallback)((modal)=>{
-        if (!isMobile || !withMobileLogic) return modal;
-        return /*#__PURE__*/ (0, _jsxruntime.jsx)("div", {
-            className: "modal-mobile-container",
-            ref: modalMobileContainerRef,
-            children: modal
-        });
-    }, [
-        isMobile,
-        withMobileLogic
-    ]);
-    return {
-        modalMobileContainerRef,
-        modalMobileHeaderRef,
-        modalMobileBodyRef,
-        modalMobileFooterRef,
-        MODALS_LOGIC: modalsLogic,
-        SCROLL_DIRECTION,
-        scrollTop,
-        scrollHeight,
-        renderModal,
-        isMobile
-    };
-}
+function e(e,t){(null==t||t>e.length)&&(t=e.length);for(var n=0,r=Array(t);n<t;n++)r[n]=e[n];return r}function t(e){for(var t=1;t<arguments.length;t++){var n=null!=arguments[t]?arguments[t]:{},r=Object.keys(n);"function"==typeof Object.getOwnPropertySymbols&&(r=r.concat(Object.getOwnPropertySymbols(n).filter(function(e){return Object.getOwnPropertyDescriptor(n,e).enumerable}))),r.forEach(function(t){var r;r=n[t],t in e?Object.defineProperty(e,t,{value:r,enumerable:!0,configurable:!0,writable:!0}):e[t]=r})}return e}function n(e,t){return t=null!=t?t:{},Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(t)):(function(e,t){var n=Object.keys(e);if(Object.getOwnPropertySymbols){var r=Object.getOwnPropertySymbols(e);n.push.apply(n,r)}return n})(Object(t)).forEach(function(n){Object.defineProperty(e,n,Object.getOwnPropertyDescriptor(t,n))}),e}function r(t,n){return function(e){if(Array.isArray(e))return e}(t)||function(e,t){var n,r,l=null==e?null:"undefined"!=typeof Symbol&&e[Symbol.iterator]||e["@@iterator"];if(null!=l){var u=[],o=!0,i=!1;try{for(l=l.call(e);!(o=(n=l.next()).done)&&(u.push(n.value),!t||u.length!==t);o=!0);}catch(e){i=!0,r=e}finally{try{o||null==l.return||l.return()}finally{if(i)throw r}}return u}}(t,n)||function(t,n){if(t){if("string"==typeof t)return e(t,n);var r=Object.prototype.toString.call(t).slice(8,-1);if("Object"===r&&t.constructor&&(r=t.constructor.name),"Map"===r||"Set"===r)return Array.from(r);if("Arguments"===r||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(r))return e(t,n)}}(t,n)||function(){throw TypeError("Invalid attempt to destructure non-iterable instance.\\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}()}Object.defineProperty(exports,"__esModule",{value:!0}),Object.defineProperty(exports,"default",{enumerable:!0,get:function(){return a}});var l,u=require("react/jsx-runtime"),o=require("react"),i=(l=require("../../../../Functions/useIsMobile/useIsMobile"))&&l.__esModule?l:{default:l},c={UP:"up",DOWN:"down"};function a(e){var l,a,f,d,s=e.modalRef,g=e.withMobileLogic,v=void 0!==g&&g,y=e.withFixedFooter,h=void 0!==y&&y,b=e.isOpen,O=void 0!==b&&b,p=(0,o.useRef)(null),m=(0,o.useRef)(null),S=(0,o.useRef)(null),E=(0,o.useRef)(null),w=(0,i.default)().isMobile,I=r((0,o.useState)(0),2),R=I[0],_=I[1],H=r((0,o.useState)({IS_HEADER_HIDDEN:!1,IS_HEADER_STICKY:!1,IS_FOOTER_HIDDEN:!1,IS_FOOTER_STICKY:h}),2),D=H[0],j=H[1],C=r((0,o.useState)({headerHeight:0,footerHeight:0}),2),P=C[0],T=C[1],M=r((0,o.useState)(c.UP),2),A=M[0],L=M[1],N=r((0,o.useState)(0),2),F=N[0],x=N[1],B=r((0,o.useState)(0),2),K=B[0],U=B[1],Y=r((0,o.useState)(1),2),W=Y[0],k=Y[1],q=r((0,o.useState)(1),2)[1];(0,o.useLayoutEffect)(function(){var e=null==p?void 0:p.current;e&&e.addEventListener("scroll",function(){U(function(t){return t!==e.scrollTop&&x(t),e.scrollTop})})},[null==p?void 0:p.current]),(0,o.useEffect)(function(){L(function(e){return K<F?c.UP:K>F?c.DOWN:e})},[K,F]),(0,o.useLayoutEffect)(function(){if(O){var e,t,n,r,l=(null==s?void 0:s.current)?(null==s?void 0:s.current.style)||window.getComputedStyle(null==s?void 0:s.current):{},u=(null==s?void 0:s.current)?R+Number.parseFloat((null==l?void 0:l.marginTop)||"0"):0,o=document.documentElement.clientHeight||window.screen.availHeight||window.screen.height;(null==p?void 0:p.current)&&(u<=o?(p.current.style.display="flex",p.current.style.alignItems="flex-end"):(null==(t=p.current)||null==(e=t.style)||e.removeProperty("display"),null==(r=p.current)||null==(n=r.style)||n.removeProperty("align-items")))}},[P,O,w,R]),(0,o.useLayoutEffect)(function(){if(w&&O){var e,t,n=null==s||null==(t=s.current)||null==(e=t.getBoundingClientRect())?void 0:e.height;n&&R!==n&&_(n)}}),(0,o.useEffect)(function(){if(w&&v){var e=P.footerHeight,t=P.headerHeight;j(function(n){return{IS_HEADER_HIDDEN:A===c.DOWN||0===K,IS_HEADER_STICKY:A===c.UP&&0!==K&&(K>=t||n.IS_HEADER_STICKY),IS_FOOTER_HIDDEN:!h&&(A===c.UP||W===Math.round(K)),IS_FOOTER_STICKY:h&&W>1||A===c.DOWN&&(W-Math.round(K)>=e||n.IS_FOOTER_STICKY)}})}},[K,W,w,v,A,P,R,window.innerHeight]),(0,o.useLayoutEffect)(function(){var e,r;(null==m||null==(r=m.current)||null==(e=r.getBoundingClientRect())?void 0:e.height)!==void 0&&T(function(e){var r,l,u;return n(t({},e),{headerHeight:null!=(u=null==m||null==(l=m.current)||null==(r=l.getBoundingClientRect())?void 0:r.height)?u:0})})},[null==m||null==(a=m.current)||null==(l=a.getBoundingClientRect())?void 0:l.height]),(0,o.useLayoutEffect)(function(){var e,r;(null==S||null==(r=S.current)||null==(e=r.getBoundingClientRect())?void 0:e.height)!==void 0&&T(function(e){var r,l,u;return n(t({},e),{footerHeight:null!=(u=null==S||null==(l=S.current)||null==(r=l.getBoundingClientRect())?void 0:r.height)?u:0})})},[null==S||null==(d=S.current)||null==(f=d.getBoundingClientRect())?void 0:f.height]),(0,o.useEffect)(function(){if(null==p?void 0:p.current){var e,t;q(null==p||null==(e=p.current)?void 0:e.scrollHeight),k((null==p||null==(t=p.current)?void 0:t.scrollHeight)-window.innerHeight)}},[K,null==p?void 0:p.current,window.innerHeight]),(0,o.useEffect)(function(){window.addEventListener("resize",function(){q(function(e){return k(e-window.innerHeight),e})})},[]);var z=(0,o.useCallback)(function(e){return w&&v?(0,u.jsx)("div",{className:"modal-mobile-container",ref:p,children:e}):e},[w,v]);return{modalMobileContainerRef:p,modalMobileHeaderRef:m,modalMobileBodyRef:E,modalMobileFooterRef:S,MODALS_LOGIC:D,SCROLL_DIRECTION:c,scrollTop:K,scrollHeight:W,renderModal:z,isMobile:w}}

package/dist/Atomic/UI/MonoAccordion/MonoAccordion._test.js

@@ -1,75 +1 @@
-import { fireEvent, render, screen } from '@testing-library/react';
-
-import MonoAccordion from './MonoAccordion';
-
-describe('monoAccordion', () => {
-  const defaultProps = {
-    titleJSX: <div>Accordion Title</div>,
-    icon: <span>▼</span>,
-    isOpen: false,
-    onClick: jest.fn(),
-    testId: 'test-accordion',
-  };
-
-  it('renders correctly with default props', () => {
-    render(
-      <MonoAccordion {...defaultProps}>
-        <div>Accordion Content</div>
-      </MonoAccordion>,
-    );
-
-    expect(screen.getByTestId('test-accordion')).toBeInTheDocument();
-    expect(screen.getByText('Accordion Title')).toBeInTheDocument();
-  });
-
-  it('handles click events correctly', () => {
-    render(
-      <MonoAccordion {...defaultProps}>
-        <div>Accordion Content</div>
-      </MonoAccordion>,
-    );
-
-    fireEvent.click(screen.getByRole('button'));
-    expect(defaultProps.onClick).toHaveBeenCalled();
-  });
-
-  it('applies correct classes when open', () => {
-    render(
-      <MonoAccordion {...defaultProps} isOpen={true}>
-        <div>Accordion Content</div>
-      </MonoAccordion>,
-    );
-
-    expect(screen.getByTestId('test-accordion')).toHaveClass('mono-accordion--is-open');
-  });
-
-  it('applies disabled state correctly', () => {
-    render(
-      <MonoAccordion {...defaultProps} disabled={true}>
-        <div>Accordion Content</div>
-      </MonoAccordion>,
-    );
-
-    const button = screen.getByRole('button');
-    expect(button).toBeDisabled();
-    expect(screen.getByTestId('test-accordion')).toHaveClass('mono-accordion--disabled');
-  });
-
-  it('handles aria attributes correctly', () => {
-    const { rerender } = render(
-      <MonoAccordion {...defaultProps}>
-        <div>Accordion Content</div>
-      </MonoAccordion>,
-    );
-
-    expect(screen.getByRole('button')).toHaveAttribute('aria-expanded', 'false');
-
-    rerender(
-      <MonoAccordion {...defaultProps} isOpen={true}>
-        <div>Accordion Content</div>
-      </MonoAccordion>,
-    );
-
-    expect(screen.getByRole('button')).toHaveAttribute('aria-expanded', 'true');
-  });
-});
+function e(e){for(var t=1;t<arguments.length;t++){var n=null!=arguments[t]?arguments[t]:{},o=Object.keys(n);"function"==typeof Object.getOwnPropertySymbols&&(o=o.concat(Object.getOwnPropertySymbols(n).filter(function(e){return Object.getOwnPropertyDescriptor(n,e).enumerable}))),o.forEach(function(t){var o;o=n[t],t in e?Object.defineProperty(e,t,{value:o,enumerable:!0,configurable:!0,writable:!0}):e[t]=o})}return e}function t(e,t){return t=null!=t?t:{},Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(t)):(function(e,t){var n=Object.keys(e);if(Object.getOwnPropertySymbols){var o=Object.getOwnPropertySymbols(e);n.push.apply(n,o)}return n})(Object(t)).forEach(function(n){Object.defineProperty(e,n,Object.getOwnPropertyDescriptor(t,n))}),e}import{jsx as n}from"react/jsx-runtime";import{fireEvent as o,render as r,screen as c}from"@testing-library/react";import i from"./MonoAccordion";describe("monoAccordion",function(){var d={titleJSX:n("div",{children:"Accordion Title"}),icon:n("span",{children:"▼"}),isOpen:!1,onClick:jest.fn(),testId:"test-accordion"};it("renders correctly with default props",function(){r(n(i,t(e({},d),{children:n("div",{children:"Accordion Content"})}))),expect(c.getByTestId("test-accordion")).toBeInTheDocument(),expect(c.getByText("Accordion Title")).toBeInTheDocument()}),it("handles click events correctly",function(){r(n(i,t(e({},d),{children:n("div",{children:"Accordion Content"})}))),o.click(c.getByRole("button")),expect(d.onClick).toHaveBeenCalled()}),it("applies correct classes when open",function(){r(n(i,t(e({},d),{isOpen:!0,children:n("div",{children:"Accordion Content"})}))),expect(c.getByTestId("test-accordion")).toHaveClass("mono-accordion--is-open")}),it("applies disabled state correctly",function(){r(n(i,t(e({},d),{disabled:!0,children:n("div",{children:"Accordion Content"})}))),expect(c.getByRole("button")).toBeDisabled(),expect(c.getByTestId("test-accordion")).toHaveClass("mono-accordion--disabled")}),it("handles aria attributes correctly",function(){var o=r(n(i,t(e({},d),{children:n("div",{children:"Accordion Content"})}))).rerender;expect(c.getByRole("button")).toHaveAttribute("aria-expanded","false"),o(n(i,t(e({},d),{isOpen:!0,children:n("div",{children:"Accordion Content"})}))),expect(c.getByRole("button")).toHaveAttribute("aria-expanded","true")})});

package/dist/Atomic/UI/MonoAccordion/MonoAccordion.js

@@ -1,80 +1 @@
-import React, { useEffect, useRef, useState } from "react";
-
-import cn from "classnames";
-
-import "./MonoAccordion.scss";
-
-const RC = "mono-accordion";
-
-const MonoAccordion = ({
-  titleJSX,
-  icon,
-  children,
-  isOpen,
-  onClick,
-  className,
-  disabled,
-  testId = "mono-accordion",
-  datasetProp = {},
-}) => {
-  const [maxHeight, setMaxHeight] = useState();
-  const titleRef = useRef();
-  const containerRef = useRef();
-
-  const setHeight = (value) => {
-    if (value !== undefined) setMaxHeight((state) => `${value}px`);
-    else
-      setMaxHeight(
-        (state) =>
-          `${Array.from(containerRef.current?.childNodes)?.reduce?.((acc, el) => acc + el.offsetHeight, 0)}px`,
-      );
-  };
-
-  const handleClick = (e) => {
-    if (
-      !Array.from(titleRef.current.childNodes).some((el) =>
-        el.contains(e.target),
-      )
-    ) {
-      onClick(e);
-      e?.preventDefault();
-      e?.stopPropagation();
-    } else return e;
-  };
-
-  useEffect(() => {
-    if (!isOpen) setHeight(0);
-    else setHeight();
-  }, [isOpen, children]);
-
-  return (
-    <div
-      {...datasetProp}
-      data-testid={testId}
-      className={cn(RC, className, {
-        [`${RC}_is-open`]: isOpen,
-        [`${RC}_disabled`]: disabled,
-      })}
-    >
-      <div
-        className={`${RC}__head`}
-        onClick={handleClick}
-      >
-        <div ref={titleRef} className={`${RC}__tile-container`}>
-          {titleJSX}
-        </div>
-        <span className={`${RC}__icon-container`}>{icon}</span>
-      </div>
-
-      <div
-        ref={containerRef}
-        style={{ maxHeight }}
-        className={cn(`${RC}__container`)}
-      >
-        <div className={`${RC}__content-wrapper`}>{children}</div>
-      </div>
-    </div>
-  );
-};
-
-export default MonoAccordion;
+function t(t,r){(null==r||r>t.length)&&(r=t.length);for(var e=0,n=Array(r);e<r;e++)n[e]=t[e];return n}function r(t,r,e){return r in t?Object.defineProperty(t,r,{value:e,enumerable:!0,configurable:!0,writable:!0}):t[r]=e,t}import{jsx as e,jsxs as n}from"react/jsx-runtime";import{useEffect as o,useRef as c,useState as i}from"react";import a from"classnames";import"./MonoAccordion.scss";var l="mono-accordion";export default function(u){var s,f,d,p,m=u.titleJSX,y=u.icon,b=u.children,v=u.isOpen,h=u.onClick,O=u.className,g=u.disabled,j=u.testId,P=u.datasetProp,w=(s=i(),function(t){if(Array.isArray(t))return t}(s)||function(t,r){var e,n,o=null==t?null:"undefined"!=typeof Symbol&&t[Symbol.iterator]||t["@@iterator"];if(null!=o){var c=[],i=!0,a=!1;try{for(o=o.call(t);!(i=(e=o.next()).done)&&(c.push(e.value),c.length!==r);i=!0);}catch(t){a=!0,n=t}finally{try{i||null==o.return||o.return()}finally{if(a)throw n}}return c}}(s,2)||function(r,e){if(r){if("string"==typeof r)return t(r,2);var n=Object.prototype.toString.call(r).slice(8,-1);if("Object"===n&&r.constructor&&(n=r.constructor.name),"Map"===n||"Set"===n)return Array.from(n);if("Arguments"===n||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n))return t(r,e)}}(s,2)||function(){throw TypeError("Invalid attempt to destructure non-iterable instance.\\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}()),_=w[0],S=w[1],A=c(),N=c(),x=function(t){void 0!==t?S(function(r){return"".concat(t,"px")}):S(function(t){var r,e,n;return"".concat(null==(e=Array.from(null==(n=N.current)?void 0:n.childNodes))||null==(r=e.reduce)?void 0:r.call(e,function(t,r){return t+r.offsetHeight},0),"px")})};return o(function(){v?x():x(0)},[v,b]),n("div",(f=function(t){for(var e=1;e<arguments.length;e++){var n=null!=arguments[e]?arguments[e]:{},o=Object.keys(n);"function"==typeof Object.getOwnPropertySymbols&&(o=o.concat(Object.getOwnPropertySymbols(n).filter(function(t){return Object.getOwnPropertyDescriptor(n,t).enumerable}))),o.forEach(function(e){r(t,e,n[e])})}return t}({},void 0===P?{}:P),d=d={"data-testid":void 0===j?"mono-accordion":j,className:a(l,O,(r(p={},"".concat(l,"_is-open"),v),r(p,"".concat(l,"_disabled"),g),p)),children:[n("div",{className:"".concat(l,"__head"),onClick:function(t){if(Array.from(A.current.childNodes).some(function(r){return r.contains(t.target)}))return t;h(t),null==t||t.preventDefault(),null==t||t.stopPropagation()},children:[e("div",{ref:A,className:"".concat(l,"__tile-container"),children:m}),e("span",{className:"".concat(l,"__icon-container"),children:y})]}),e("div",{ref:N,style:{maxHeight:_},className:a("".concat(l,"__container")),children:e("div",{className:"".concat(l,"__content-wrapper"),children:b})})]},Object.getOwnPropertyDescriptors?Object.defineProperties(f,Object.getOwnPropertyDescriptors(d)):(function(t,r){var e=Object.keys(t);if(Object.getOwnPropertySymbols){var n=Object.getOwnPropertySymbols(t);e.push.apply(e,n)}return e})(Object(d)).forEach(function(t){Object.defineProperty(f,t,Object.getOwnPropertyDescriptor(d,t))}),f))}