npm - acinguiux-ds-react-framework - Versions diffs - 0.1.25 → 0.1.27 - Mend

acinguiux-ds-react-framework 0.1.25 → 0.1.27

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (4355) hide show

package/build/cjs/components/Menu/styles/menuLabel.styles.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"menuLabel.styles.js","sources":["../../../../../src/components/Menu/styles/menuLabel.styles.ts"],"sourcesContent":["import { styled, css } from 'styled-components';\nimport { MENU_CLASS, Directions, BADGE_CLASS, Positions } from 'acinguiux-ds-react-base/consts';\nimport { MenuConsts } from 'acinguiux-ds-react-base/components/Menu';\n\nimport type { StyledMenuProps } from '../Menu.types';\nimport Label from '../../Text/components/Label/Label';\nimport Flexbox from '../../Flexbox/Flexbox';\n\nconst { consts } = MenuConsts;\n\nexport const TooltipLabel = styled(Label)``;\n\nexport const TooltipContainer = styled(Flexbox)`\n align-items: center;\n justify-content: center;\n padding: 8px;\n max-width: 240px;\n`;\n\nexport const menuLabelStyle = css<StyledMenuProps>`\n ${({ $size, inlineCollapsed, $iconPosition, mode }) => {\n const iconSize = `${consts[$size].iconSize}px`;\n const gap = `${consts[$size].gap}px`;\n const iconContainerWidth = `${consts[$size].iconContainer.width}px`;\n const iconContainerHeight = `${consts[$size].iconContainer.height}px`;\n\n return css`\n .${MENU_CLASS}-label {\n display: flex;\n align-items: center;\n flex-grow: 1;\n flex-direction: ${$iconPosition === Positions.Top ? 'column' : 'row'};\n gap: ${gap};\n border-radius: ${MenuConsts.consts[$size].borderRadius}px;\n padding: ${MenuConsts.consts[$size].labelPadding[\n mode === Directions.Horizontal ? Directions.Horizontal : Directions.Vertical\n ][$iconPosition]};\n transition: background-color 0.3s ease-out;\n min-width: 0;\n text-decoration: none;\n\n .${MENU_CLASS}-label-text {\n max-width: 100%;\n transition: opacity 0.3s ease-out;\n white-space: nowrap;\n text-overflow: ellipsis;\n overflow: hidden;\n }\n\n .${BADGE_CLASS} {\n ${$iconPosition === Positions.Left &&\n css`\n margin-left: auto;\n `}\n ${$iconPosition === Positions.Top &&\n css`\n position: absolute;\n top: 0;\n right: 50%;\n transform: translateX(50%);\n `}\n }\n\n .${MENU_CLASS}-label-icon {\n min-width: ${iconContainerWidth};\n max-height: ${iconContainerHeight};\n display: flex;\n align-items: center;\n justify-content: center;\n\n > svg {\n display: block;\n width: ${iconSize};\n height: ${iconSize};\n }\n }\n }\n\n /* Horizontal /\n &.${MENU_CLASS}-horizontal .${MENU_CLASS}-label {\n align-items: center;\n\n .${MENU_CLASS}-label-icon {\n margin-left: -2px;\n min-width: ${iconSize};\n }\n }\n\n / Top level */\n &.${MENU_CLASS} {\n > .${MENU_CLASS}-submenu\n > .${MENU_CLASS}-submenu-title\n > .${MENU_CLASS}-submenu-title-content,\n > .${MENU_CLASS}-item {\n > .${MENU_CLASS}-label > .${MENU_CLASS}-label-text {\n white-space: nowrap;\n }\n }\n }\n\n ${inlineCollapsed &&\n css`\n &.${MENU_CLASS}-inline-collapsed {\n &:focus-visible {\n ::before {\n margin-right: ${MenuConsts.consts[$size].collapsedItemMarginRight};\n }\n }\n .${MENU_CLASS}-item {\n margin-right: ${MenuConsts.consts[$size].collapsedItemMarginRight};\n }\n\n .${MENU_CLASS}-submenu {\n .${MENU_CLASS}-submenu-title {\n margin-right: ${MenuConsts.consts[$size].collapsedItemMarginRight};\n .${MENU_CLASS}-submenu-title-content {\n .${MENU_CLASS}-item {\n .${MENU_CLASS}-label .${MENU_CLASS}-label-text {\n opacity: 0;\n text-overflow: clip;\n white-space: nowrap;\n }\n }\n }\n }\n }\n }\n `}\n `;\n }}\n`;\n"],"names":["consts","MenuConsts","TooltipLabel","styled","Label","TooltipContainer","Flexbox","menuLabelStyle","css","$size","inlineCollapsed","$iconPosition","mode","iconSize","gap","iconContainerWidth","iconContainerHeight","MENU_CLASS","Positions","MenuConsts.consts","Directions","BADGE_CLASS"],"mappings":"yZAQM,CAAE,OAAAA,GAAWC,EAENC,EAAeC,EAAAA,OAAOC,CAAK,IAE3BC,EAAmBF,EAAAA,OAAOG,CAAO;AAAA;AAAA;AAAA;AAAA;AAAA,EAOjCC,EAAiBC,EAAAA;AAAAA,IAC1B,CAAC,CAAE,MAAAC,EAAO,gBAAAC,EAAiB,cAAAC,EAAe,KAAAC,KAAW,CACrD,MAAMC,EAAW,GAAGb,EAAOS,CAAK,EAAE,QAAQ,KACpCK,EAAM,GAAGd,EAAOS,CAAK,EAAE,GAAG,KAC1BM,EAAqB,GAAGf,EAAOS,CAAK,EAAE,cAAc,KAAK,KACzDO,EAAsB,GAAGhB,EAAOS,CAAK,EAAE,cAAc,MAAM,KAEjE,OAAOD,EAAAA;AAAAA,SACFS,YAAU;AAAA;AAAA;AAAA;AAAA,0BAION,IAAkBO,EAAAA,UAAU,IAAM,SAAW,KAAK;AAAA,eAC7DJ,CAAG;AAAA,yBACOK,EAAAA,OAAkBV,CAAK,EAAE,YAAY;AAAA,mBAC3CU,EAAAA,OAAkBV,CAAK,EAAE,aAClCG,IAASQ,EAAAA,WAAW,WAAaA,EAAAA,WAAW,WAAaA,EAAAA,WAAW,QACtE,EAAET,CAAa,CAAC;AAAA;AAAA;AAAA;AAAA;AAAA,WAKbM,YAAU;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,WAQVI,aAAW;AAAA,YACVV,IAAkBO,YAAU,MAC9BV,EAAAA;AAAAA;AAAAA,WAEC;AAAA,YACCG,IAAkBO,YAAU,KAC9BV,EAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA,WAKC;AAAA;AAAA;AAAA,WAGAS,YAAU;AAAA,uBACEF,CAAkB;AAAA,wBACjBC,CAAmB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,qBAOtBH,CAAQ;AAAA,sBACPA,CAAQ;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,UAMpBI,EAAAA,UAAU,gBAAgBA,YAAU;AAAA;AAAA;AAAA,WAGnCA,YAAU;AAAA;AAAA,uBAEEJ,CAAQ;AAAA;AAAA;AAAA;AAAA;AAAA,UAKrBI,YAAU;AAAA,aACPA,YAAU;AAAA,eACRA,YAAU;AAAA,eACVA,YAAU;AAAA,eACVA,YAAU;AAAA,eACVA,EAAAA,UAAU,aAAaA,YAAU;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,QAMxCP,GACFF,EAAAA;AAAAA,YACMS,YAAU;AAAA;AAAA;AAAA,8BAGQE,EAAAA,OAAkBV,CAAK,EAAE,wBAAwB;AAAA;AAAA;AAAA,aAGlEQ,YAAU;AAAA,4BACKE,EAAAA,OAAkBV,CAAK,EAAE,wBAAwB;AAAA;AAAA;AAAA,aAGhEQ,YAAU;AAAA,eACRA,YAAU;AAAA,8BACKE,EAAAA,OAAkBV,CAAK,EAAE,wBAAwB;AAAA,iBAC9DQ,YAAU;AAAA,mBACRA,YAAU;AAAA,qBACRA,EAAAA,UAAU,WAAWA,YAAU;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,OAU7C;AAAA,KAEL,CAAC;AAAA"}
1	+ {"version":3,"file":"menuLabel.styles.js","sources":["../../../../../src/components/Menu/styles/menuLabel.styles.ts"],"sourcesContent":["import { styled, css } from 'styled-components';\r\nimport { MENU_CLASS, Directions, BADGE_CLASS, Positions } from 'acinguiux-ds-react-base/consts';\r\nimport { MenuConsts } from 'acinguiux-ds-react-base/components/Menu';\r\n\r\nimport type { StyledMenuProps } from '../Menu.types';\r\nimport Label from '../../Text/components/Label/Label';\r\nimport Flexbox from '../../Flexbox/Flexbox';\r\n\r\nconst { consts } = MenuConsts;\r\n\r\nexport const TooltipLabel = styled(Label)``;\r\n\r\nexport const TooltipContainer = styled(Flexbox)`\r\n align-items: center;\r\n justify-content: center;\r\n padding: 8px;\r\n max-width: 240px;\r\n`;\r\n\r\nexport const menuLabelStyle = css<StyledMenuProps>`\r\n ${({ $size, inlineCollapsed, $iconPosition, mode }) => {\r\n const iconSize = `${consts[$size].iconSize}px`;\r\n const gap = `${consts[$size].gap}px`;\r\n const iconContainerWidth = `${consts[$size].iconContainer.width}px`;\r\n const iconContainerHeight = `${consts[$size].iconContainer.height}px`;\r\n\r\n return css`\r\n .${MENU_CLASS}-label {\r\n display: flex;\r\n align-items: center;\r\n flex-grow: 1;\r\n flex-direction: ${$iconPosition === Positions.Top ? 'column' : 'row'};\r\n gap: ${gap};\r\n border-radius: ${MenuConsts.consts[$size].borderRadius}px;\r\n padding: ${MenuConsts.consts[$size].labelPadding[\r\n mode === Directions.Horizontal ? Directions.Horizontal : Directions.Vertical\r\n ][$iconPosition]};\r\n transition: background-color 0.3s ease-out;\r\n min-width: 0;\r\n text-decoration: none;\r\n\r\n .${MENU_CLASS}-label-text {\r\n max-width: 100%;\r\n transition: opacity 0.3s ease-out;\r\n white-space: nowrap;\r\n text-overflow: ellipsis;\r\n overflow: hidden;\r\n }\r\n\r\n .${BADGE_CLASS} {\r\n ${$iconPosition === Positions.Left &&\r\n css`\r\n margin-left: auto;\r\n `}\r\n ${$iconPosition === Positions.Top &&\r\n css`\r\n position: absolute;\r\n top: 0;\r\n right: 50%;\r\n transform: translateX(50%);\r\n `}\r\n }\r\n\r\n .${MENU_CLASS}-label-icon {\r\n min-width: ${iconContainerWidth};\r\n max-height: ${iconContainerHeight};\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n\r\n > svg {\r\n display: block;\r\n width: ${iconSize};\r\n height: ${iconSize};\r\n }\r\n }\r\n }\r\n\r\n /* Horizontal /\r\n &.${MENU_CLASS}-horizontal .${MENU_CLASS}-label {\r\n align-items: center;\r\n\r\n .${MENU_CLASS}-label-icon {\r\n margin-left: -2px;\r\n min-width: ${iconSize};\r\n }\r\n }\r\n\r\n / Top level */\r\n &.${MENU_CLASS} {\r\n > .${MENU_CLASS}-submenu\r\n > .${MENU_CLASS}-submenu-title\r\n > .${MENU_CLASS}-submenu-title-content,\r\n > .${MENU_CLASS}-item {\r\n > .${MENU_CLASS}-label > .${MENU_CLASS}-label-text {\r\n white-space: nowrap;\r\n }\r\n }\r\n }\r\n\r\n ${inlineCollapsed &&\r\n css`\r\n &.${MENU_CLASS}-inline-collapsed {\r\n &:focus-visible {\r\n ::before {\r\n margin-right: ${MenuConsts.consts[$size].collapsedItemMarginRight};\r\n }\r\n }\r\n .${MENU_CLASS}-item {\r\n margin-right: ${MenuConsts.consts[$size].collapsedItemMarginRight};\r\n }\r\n\r\n .${MENU_CLASS}-submenu {\r\n .${MENU_CLASS}-submenu-title {\r\n margin-right: ${MenuConsts.consts[$size].collapsedItemMarginRight};\r\n .${MENU_CLASS}-submenu-title-content {\r\n .${MENU_CLASS}-item {\r\n .${MENU_CLASS}-label .${MENU_CLASS}-label-text {\r\n opacity: 0;\r\n text-overflow: clip;\r\n white-space: nowrap;\r\n }\r\n }\r\n }\r\n }\r\n }\r\n }\r\n `}\r\n `;\r\n }}\r\n`;\r\n"],"names":["consts","MenuConsts","TooltipLabel","styled","Label","TooltipContainer","Flexbox","menuLabelStyle","css","$size","inlineCollapsed","$iconPosition","mode","iconSize","gap","iconContainerWidth","iconContainerHeight","MENU_CLASS","Positions","MenuConsts.consts","Directions","BADGE_CLASS"],"mappings":"yZAQM,CAAE,OAAAA,GAAWC,EAENC,EAAeC,EAAAA,OAAOC,CAAK,IAE3BC,EAAmBF,EAAAA,OAAOG,CAAO;AAAA;AAAA;AAAA;AAAA;AAAA,EAOjCC,EAAiBC,EAAAA;AAAAA,IAC1B,CAAC,CAAE,MAAAC,EAAO,gBAAAC,EAAiB,cAAAC,EAAe,KAAAC,KAAW,CACrD,MAAMC,EAAW,GAAGb,EAAOS,CAAK,EAAE,QAAQ,KACpCK,EAAM,GAAGd,EAAOS,CAAK,EAAE,GAAG,KAC1BM,EAAqB,GAAGf,EAAOS,CAAK,EAAE,cAAc,KAAK,KACzDO,EAAsB,GAAGhB,EAAOS,CAAK,EAAE,cAAc,MAAM,KAEjE,OAAOD,EAAAA;AAAAA,SACFS,YAAU;AAAA;AAAA;AAAA;AAAA,0BAION,IAAkBO,EAAAA,UAAU,IAAM,SAAW,KAAK;AAAA,eAC7DJ,CAAG;AAAA,yBACOK,EAAAA,OAAkBV,CAAK,EAAE,YAAY;AAAA,mBAC3CU,EAAAA,OAAkBV,CAAK,EAAE,aAClCG,IAASQ,EAAAA,WAAW,WAAaA,EAAAA,WAAW,WAAaA,EAAAA,WAAW,QACtE,EAAET,CAAa,CAAC;AAAA;AAAA;AAAA;AAAA;AAAA,WAKbM,YAAU;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,WAQVI,aAAW;AAAA,YACVV,IAAkBO,YAAU,MAC9BV,EAAAA;AAAAA;AAAAA,WAEC;AAAA,YACCG,IAAkBO,YAAU,KAC9BV,EAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA,WAKC;AAAA;AAAA;AAAA,WAGAS,YAAU;AAAA,uBACEF,CAAkB;AAAA,wBACjBC,CAAmB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,qBAOtBH,CAAQ;AAAA,sBACPA,CAAQ;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,UAMpBI,EAAAA,UAAU,gBAAgBA,YAAU;AAAA;AAAA;AAAA,WAGnCA,YAAU;AAAA;AAAA,uBAEEJ,CAAQ;AAAA;AAAA;AAAA;AAAA;AAAA,UAKrBI,YAAU;AAAA,aACPA,YAAU;AAAA,eACRA,YAAU;AAAA,eACVA,YAAU;AAAA,eACVA,YAAU;AAAA,eACVA,EAAAA,UAAU,aAAaA,YAAU;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,QAMxCP,GACFF,EAAAA;AAAAA,YACMS,YAAU;AAAA;AAAA;AAAA,8BAGQE,EAAAA,OAAkBV,CAAK,EAAE,wBAAwB;AAAA;AAAA;AAAA,aAGlEQ,YAAU;AAAA,4BACKE,EAAAA,OAAkBV,CAAK,EAAE,wBAAwB;AAAA;AAAA;AAAA,aAGhEQ,YAAU;AAAA,eACRA,YAAU;AAAA,8BACKE,EAAAA,OAAkBV,CAAK,EAAE,wBAAwB;AAAA,iBAC9DQ,YAAU;AAAA,mBACRA,YAAU;AAAA,qBACRA,EAAAA,UAAU,WAAWA,YAAU;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,OAU7C;AAAA,KAEL,CAAC;AAAA"}

package/build/cjs/components/Menu/styles/motion.styles.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"motion.styles.js","sources":["../../../../../src/components/Menu/styles/motion.styles.ts"],"sourcesContent":["import { css } from 'styled-components';\nimport { MENU_CLASS } from 'acinguiux-ds-react-base/consts';\n\nconst commonMotion = css`\n animation-duration: 0.3s;\n animation-fill-mode: both;\n`;\n\nexport const motionStyle = css`\n .${MENU_CLASS} {\n &-collapse {\n overflow: hidden;\n transition:\n height 0.3s ease-in-out,\n opacity 0.3s ease-in-out;\n }\n\n &-collapse-enter,\n &-collapse-appear {\n opacity: 0;\n }\n\n &-collapse-leave {\n opacity: 1;\n }\n }\n\n &.${MENU_CLASS} {\n &-slide-up-enter,\n &-slide-up-appear {\n ${commonMotion};\n opacity: 0;\n transform: scaleY(0);\n animation-timing-function: ease-in-out;\n animation-play-state: paused;\n }\n\n &-slide-up-leave {\n ${commonMotion};\n opacity: 1;\n transform: scaleY(1);\n animation-timing-function: ease-in-out;\n animation-play-state: paused;\n }\n\n &-slide-up-enter-active,\n &-slide-up-appear-active {\n animation-name: slide-up-in;\n animation-play-state: running;\n }\n\n &-slide-up-leave-active {\n animation-name: slide-up-out;\n animation-play-state: running;\n }\n\n @keyframes slide-up-in {\n 0% {\n opacity: 0;\n transform: scaleY(0.8);\n }\n\n 100% {\n opacity: 1;\n transform: scaleY(1);\n }\n }\n\n @keyframes slide-up-out {\n 0% {\n opacity: 1;\n transform: scaleY(1);\n }\n\n 100% {\n opacity: 0;\n transform: scaleY(0.8);\n }\n }\n\n &-zoom-enter,\n &-zoom-appear {\n ${commonMotion};\n transform-origin: 0% 0%;\n transform: scale(0);\n opacity: 0;\n animation-timing-function: ease-in-out;\n animation-play-state: paused;\n }\n\n &-zoom-leave {\n ${commonMotion};\n transform-origin: 0% 0%;\n animation-timing-function: ease-in-out;\n animation-play-state: paused;\n }\n\n &-zoom-enter-active,\n &-zoom-appear-active {\n animation-name: open-zoom-in;\n animation-play-state: running;\n }\n\n &-zoom-leave-active {\n animation-name: open-zoom-out;\n animation-play-state: running;\n }\n\n @keyframes open-zoom-in {\n 0% {\n opacity: 0;\n transform: scale(0, 0);\n }\n\n 100% {\n opacity: 1;\n transform: scale(1, 1);\n }\n }\n\n @keyframes open-zoom-out {\n 0% {\n opacity: 1;\n transform: scale(1, 1);\n }\n\n 100% {\n opacity: 0;\n transform: scale(0, 0);\n }\n }\n }\n`;\n"],"names":["commonMotion","css","motionStyle","MENU_CLASS"],"mappings":"wMAGMA,EAAeC,EAAAA;AAAAA;AAAAA;AAAAA,EAKRC,EAAcD,EAAAA;AAAAA,KACtBE,YAAU;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,MAkBTA,YAAU;AAAA;AAAA;AAAA,QAGRH,CAAY;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,QAQZA,CAAY;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,QA4CZA,CAAY;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,QASZA,CAAY;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA"}
1	+ {"version":3,"file":"motion.styles.js","sources":["../../../../../src/components/Menu/styles/motion.styles.ts"],"sourcesContent":["import { css } from 'styled-components';\r\nimport { MENU_CLASS } from 'acinguiux-ds-react-base/consts';\r\n\r\nconst commonMotion = css`\r\n animation-duration: 0.3s;\r\n animation-fill-mode: both;\r\n`;\r\n\r\nexport const motionStyle = css`\r\n .${MENU_CLASS} {\r\n &-collapse {\r\n overflow: hidden;\r\n transition:\r\n height 0.3s ease-in-out,\r\n opacity 0.3s ease-in-out;\r\n }\r\n\r\n &-collapse-enter,\r\n &-collapse-appear {\r\n opacity: 0;\r\n }\r\n\r\n &-collapse-leave {\r\n opacity: 1;\r\n }\r\n }\r\n\r\n &.${MENU_CLASS} {\r\n &-slide-up-enter,\r\n &-slide-up-appear {\r\n ${commonMotion};\r\n opacity: 0;\r\n transform: scaleY(0);\r\n animation-timing-function: ease-in-out;\r\n animation-play-state: paused;\r\n }\r\n\r\n &-slide-up-leave {\r\n ${commonMotion};\r\n opacity: 1;\r\n transform: scaleY(1);\r\n animation-timing-function: ease-in-out;\r\n animation-play-state: paused;\r\n }\r\n\r\n &-slide-up-enter-active,\r\n &-slide-up-appear-active {\r\n animation-name: slide-up-in;\r\n animation-play-state: running;\r\n }\r\n\r\n &-slide-up-leave-active {\r\n animation-name: slide-up-out;\r\n animation-play-state: running;\r\n }\r\n\r\n @keyframes slide-up-in {\r\n 0% {\r\n opacity: 0;\r\n transform: scaleY(0.8);\r\n }\r\n\r\n 100% {\r\n opacity: 1;\r\n transform: scaleY(1);\r\n }\r\n }\r\n\r\n @keyframes slide-up-out {\r\n 0% {\r\n opacity: 1;\r\n transform: scaleY(1);\r\n }\r\n\r\n 100% {\r\n opacity: 0;\r\n transform: scaleY(0.8);\r\n }\r\n }\r\n\r\n &-zoom-enter,\r\n &-zoom-appear {\r\n ${commonMotion};\r\n transform-origin: 0% 0%;\r\n transform: scale(0);\r\n opacity: 0;\r\n animation-timing-function: ease-in-out;\r\n animation-play-state: paused;\r\n }\r\n\r\n &-zoom-leave {\r\n ${commonMotion};\r\n transform-origin: 0% 0%;\r\n animation-timing-function: ease-in-out;\r\n animation-play-state: paused;\r\n }\r\n\r\n &-zoom-enter-active,\r\n &-zoom-appear-active {\r\n animation-name: open-zoom-in;\r\n animation-play-state: running;\r\n }\r\n\r\n &-zoom-leave-active {\r\n animation-name: open-zoom-out;\r\n animation-play-state: running;\r\n }\r\n\r\n @keyframes open-zoom-in {\r\n 0% {\r\n opacity: 0;\r\n transform: scale(0, 0);\r\n }\r\n\r\n 100% {\r\n opacity: 1;\r\n transform: scale(1, 1);\r\n }\r\n }\r\n\r\n @keyframes open-zoom-out {\r\n 0% {\r\n opacity: 1;\r\n transform: scale(1, 1);\r\n }\r\n\r\n 100% {\r\n opacity: 0;\r\n transform: scale(0, 0);\r\n }\r\n }\r\n }\r\n`;\r\n"],"names":["commonMotion","css","motionStyle","MENU_CLASS"],"mappings":"wMAGMA,EAAeC,EAAAA;AAAAA;AAAAA;AAAAA,EAKRC,EAAcD,EAAAA;AAAAA,KACtBE,YAAU;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,MAkBTA,YAAU;AAAA;AAAA;AAAA,QAGRH,CAAY;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,QAQZA,CAAY;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,QA4CZA,CAAY;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,QASZA,CAAY;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA"}

package/build/cjs/components/Menu/styles/subMenu.styles.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"subMenu.styles.js","sources":["../../../../../src/components/Menu/styles/subMenu.styles.ts"],"sourcesContent":["import { css } from 'styled-components';\nimport { MENU_CLASS, ZIndexes, Directions, Sizes, BADGE_CLASS } from 'acinguiux-ds-react-base/consts';\nimport { Variables } from 'acinguiux-ds-react-base/theme';\nimport { MenuConsts } from 'acinguiux-ds-react-base/components/Menu';\nimport { FabricsVariables } from 'acinguiux-ds-fabrics';\nimport { getFocusStyles } from 'acinguiux-ds-react-base/utils/stylesUtils';\n\nimport type { StyledMenuProps } from '../Menu.types';\nimport { getBackgroundColor, getSubMenuSelectedIndicatorStyle, getModeIndicatorPosition } from '../Menu.utils';\nimport { getIndicatorPositionStyle } from './indicator.styles';\n\nconst { consts } = MenuConsts;\n\nexport const subMenuStyle = css<StyledMenuProps>`\n ${({ theme, $size, $muted, inlineCollapsed, $indicatorPosition, $iconPosition, mode }) => {\n const paddingOffset = `${consts[$size].subMenuOffestPadding}px`;\n const subMenuIndentVertical = `${consts[$size].indent}px`;\n const subMenuIndentHorizontal = `${consts[$size].indent - ($size === Sizes.XSmall ? 6 : 10)}px`;\n const iconSize = `${consts[$size].iconSize}px`;\n const gap = `${consts[$size].gap}px`;\n const layer = theme.layer({ foundation: FabricsVariables.Foundations.Section, muted: $muted });\n const disabledLayer = theme.layer({\n foundation: FabricsVariables.Foundations.Section,\n muted: $muted,\n disabled: true,\n });\n\n return css<StyledMenuProps>`\n .${MENU_CLASS}-submenu {\n cursor: pointer;\n display: flex;\n flex-direction: column;\n\n /* Default /\n &.${MENU_CLASS}-submenu, &.${MENU_CLASS}-submenu-active {\n .${MENU_CLASS}-submenu-title .${MENU_CLASS}-submenu-title-content .${MENU_CLASS}-label {\n color: ${layer[Variables.TextOnFoundationSubtle]};\n\n :not(.${BADGE_CLASS}) svg {\n fill: ${layer[Variables.TextOnFoundationSubtle]};\n }\n }\n }\n\n /* Active /\n &.${MENU_CLASS}-submenu-selected {\n > .${MENU_CLASS}-submenu-title .${MENU_CLASS}-submenu-title-content .${MENU_CLASS}-label {\n color: ${layer[Variables.TextOnFoundationStrong]};\n\n :not(.${BADGE_CLASS}) svg {\n fill: ${layer[Variables.TextOnFoundationStrong]};\n }\n }\n }\n\n /* Disabled /\n &.${MENU_CLASS}-submenu-disabled {\n > .${MENU_CLASS}-submenu-title .${MENU_CLASS}-submenu-title-content .${MENU_CLASS}-label {\n color: ${disabledLayer[Variables.TextOnFoundationSubtle]};\n cursor: not-allowed;\n\n :not(.${BADGE_CLASS}) svg {\n fill: ${disabledLayer[Variables.TextOnFoundationSubtle]};\n }\n }\n }\n\n &.${MENU_CLASS}-submenu-selected:not(.${MENU_CLASS}-submenu-open).${MENU_CLASS}-submenu-disabled\n > .${MENU_CLASS}-submenu-title {\n &::after {\n ${getIndicatorPositionStyle({\n indicatorPosition: getModeIndicatorPosition($indicatorPosition, mode),\n size: $size,\n state: 'resting',\n active: true,\n disabled: true,\n muted: $muted,\n })};\n }\n }\n\n .${MENU_CLASS}-submenu-title {\n position: relative;\n display: flex;\n align-items: center;\n flex: 1 1 0;\n min-width: 0;\n\n &:focus-visible {\n outline: none;\n position: relative;\n\n .${MENU_CLASS}-submenu-title-content {\n ${getFocusStyles(theme)};\n }\n }\n }\n\n .${MENU_CLASS}-submenu-title-content {\n display: flex;\n flex: 1 1 0;\n min-width: 0;\n justify-content: space-between;\n align-items: center;\n gap: ${gap};\n border-radius: ${MenuConsts.consts[$size].borderRadius}px;\n transition: background-color 0.3s ease-out;\n\n ${mode !== 'horizontal' &&\n css`\n margin-right: ${MenuConsts.consts[$size].collapsedItemMarginRight};\n `}\n }\n\n .${MENU_CLASS}-submenu-expand-icon {\n width: ${iconSize};\n height: ${iconSize};\n flex-shrink: 0;\n transition: transform 0.2s ease-in-out;\n margin: -10px 0;\n\n ${inlineCollapsed &&\n css`\n display: none;\n `}\n }\n\n &:not(.${MENU_CLASS}-submenu-active):not(.${MENU_CLASS}-submenu-selected) > .${MENU_CLASS}-submenu-title {\n > .${MENU_CLASS}-submenu-title-content {\n color: ${layer[Variables.TextOnFoundationSubtle]};\n }\n }\n\n &.${MENU_CLASS}-submenu-active:not(.${MENU_CLASS}-submenu-selected) > .${MENU_CLASS}-submenu-title {\n &:focus-visible {\n > .${MENU_CLASS}-submenu-title-content {\n background-color: transparent;\n }\n }\n\n > .${MENU_CLASS}-submenu-title-content {\n background-color: ${getBackgroundColor(\n theme,\n FabricsVariables.States.Hover,\n FabricsVariables.Foundations.Surface,\n $muted,\n )};\n }\n\n > .${MENU_CLASS}-submenu-title-content:active {\n background-color: ${getBackgroundColor(\n theme,\n FabricsVariables.States.Press,\n FabricsVariables.Foundations.Surface,\n $muted,\n )};\n }\n }\n\n &.${MENU_CLASS}-submenu-selected.${MENU_CLASS}-submenu-disabled > .${MENU_CLASS}-submenu-title {\n &,\n .${MENU_CLASS}-label {\n color: ${disabledLayer[Variables.TextOnFoundationSubtle]};\n }\n\n > .${MENU_CLASS}-submenu-title-content {\n background-color: ${getBackgroundColor(\n theme,\n FabricsVariables.States.Resting,\n FabricsVariables.Foundations.Section,\n $muted,\n true,\n )};\n\n svg {\n fill: ${disabledLayer[Variables.TextOnFoundationSubtle]};\n }\n }\n }\n\n &.${MENU_CLASS}-submenu-selected:not(.${MENU_CLASS}-submenu-disabled) > .${MENU_CLASS}-submenu-title {\n > .${MENU_CLASS}-submenu-title-content {\n background-color: ${getBackgroundColor(\n theme,\n FabricsVariables.States.Resting,\n FabricsVariables.Foundations.Section,\n $muted,\n )};\n }\n\n > .${MENU_CLASS}-submenu-title-content:hover {\n background-color: ${getBackgroundColor(\n theme,\n FabricsVariables.States.Hover,\n FabricsVariables.Foundations.Section,\n $muted,\n )};\n }\n\n > .${MENU_CLASS}-submenu-title-content:active {\n background-color: ${getBackgroundColor(\n theme,\n FabricsVariables.States.Press,\n FabricsVariables.Foundations.Section,\n $muted,\n )};\n }\n }\n }\n\n /* Inline and vertical /\n &.${MENU_CLASS}-inline, &.${MENU_CLASS}-vertical .${MENU_CLASS}-submenu {\n .${MENU_CLASS}-submenu-title {\n padding-left: ${subMenuIndentVertical};\n padding-right: ${subMenuIndentVertical};\n }\n }\n\n / Inline /\n &.${MENU_CLASS}-inline {\n .${MENU_CLASS}-submenu {\n &.${MENU_CLASS}-submenu-selected:not(.${MENU_CLASS}-submenu-open).${MENU_CLASS}-submenu-disabled\n > .${MENU_CLASS}-submenu-title {\n &::after {\n ${getIndicatorPositionStyle({\n indicatorPosition: getModeIndicatorPosition($indicatorPosition),\n size: $size,\n state: 'resting',\n active: true,\n disabled: true,\n muted: $muted,\n })};\n }\n }\n }\n\n .${MENU_CLASS}-submenu-title {\n margin: ${$size === Sizes.Small ? '2px' : '4px'} 0;\n\n .${MENU_CLASS}-submenu-title-content {\n padding: ${MenuConsts.consts[$size].labelPadding[Directions.Vertical][$iconPosition]};\n\n .${MENU_CLASS}-label {\n padding: unset;\n }\n }\n }\n\n .${MENU_CLASS}-submenu.${MENU_CLASS}-submenu-open\n > .${MENU_CLASS}-submenu-title\n > .${MENU_CLASS}-submenu-title-content\n > .${MENU_CLASS}-submenu-expand-icon {\n transform: rotate(180deg);\n }\n\n / Lowest level /\n .${MENU_CLASS}-submenu-selected:not(.${MENU_CLASS}-submenu-open):not(.${MENU_CLASS}-submenu-disabled)\n > .${MENU_CLASS}-submenu-title {\n background-color: transparent;\n\n ${getSubMenuSelectedIndicatorStyle($indicatorPosition, mode, $size, $muted)};\n }\n }\n\n / Vertical /\n &.${MENU_CLASS}-vertical .${MENU_CLASS}-submenu {\n .${MENU_CLASS}-submenu-title {\n margin: ${$size === Sizes.Small ? '2px' : '4px'} 0;\n\n &:focus-visible {\n outline: none;\n position: relative;\n\n .${MENU_CLASS}-submenu-title-content {\n ${getFocusStyles(theme)};\n }\n }\n\n .${MENU_CLASS}-submenu-title-content {\n padding: ${MenuConsts.consts[$size].labelPadding[Directions.Vertical][$iconPosition]};\n\n .${MENU_CLASS}-label {\n padding: unset;\n }\n }\n }\n\n .${MENU_CLASS}-submenu-expand-icon {\n transform: rotate(-90deg);\n }\n\n &.${MENU_CLASS}-submenu-selected:not(.${MENU_CLASS}-submenu-disabled) > .${MENU_CLASS}-submenu-title {\n background-color: transparent;\n\n ${getSubMenuSelectedIndicatorStyle($indicatorPosition, mode, $size, $muted)};\n }\n\n .${MENU_CLASS}-item-group .${MENU_CLASS}-item-group-list {\n display: flex;\n flex-direction: row;\n }\n }\n\n / Horizontal /\n &.${MENU_CLASS}-horizontal .${MENU_CLASS}-submenu {\n display: flex;\n flex-direction: row;\n align-items: stretch;\n\n .${MENU_CLASS}-submenu-title {\n padding: ${paddingOffset} ${subMenuIndentHorizontal};\n\n .${MENU_CLASS}-submenu-title-content {\n padding: ${MenuConsts.consts[$size].labelPadding[Directions.Horizontal][$iconPosition]};\n\n .${MENU_CLASS}-label {\n padding: unset;\n }\n }\n }\n\n &.${MENU_CLASS}-submenu-selected:not(.${MENU_CLASS}-submenu-disabled) > .${MENU_CLASS}-submenu-title {\n ${getSubMenuSelectedIndicatorStyle($indicatorPosition, mode, $size, $muted)};\n }\n\n &.${MENU_CLASS}-overflow-item-rest {\n .${MENU_CLASS}-submenu-rest-icon {\n width: ${iconSize};\n height: ${iconSize};\n }\n }\n }\n\n / Popup /\n &.${MENU_CLASS}-submenu {\n &.${MENU_CLASS}-submenu-popup {\n z-index: ${ZIndexes.MENU};\n position: absolute;\n transform-origin: 0 0;\n background-color: transparent;\n overflow: visible;\n > .${MENU_CLASS}-sub {\n background-color: ${getBackgroundColor(\n theme,\n FabricsVariables.States.Resting,\n FabricsVariables.Foundations.Surface,\n $muted,\n )};\n filter: ${theme.dropShadows.low2};\n border-radius: 8px;\n\n .${MENU_CLASS}-item-group-title, .${MENU_CLASS}-submenu-title, .${MENU_CLASS}-item {\n align-items: stretch;\n }\n\n ${mode !== 'horizontal' &&\n css`\n .${MENU_CLASS}-item-group-title {\n margin-left: -${MenuConsts.consts[$size].itemListMarginLeft}px;\n }\n\n .${MENU_CLASS}-submenu-title {\n margin-left: -${MenuConsts.consts[$size].itemListMarginLeft}px;\n }\n\n .${MENU_CLASS}-item {\n margin-left: -${MenuConsts.consts[$size].itemListMarginLeft}px;\n }\n `}\n }\n }\n\n &.${MENU_CLASS}-submenu-hidden {\n display: none;\n }\n\n / Vertical and horizontal */\n .${MENU_CLASS}-vertical {\n max-width: 300px;\n padding: ${MenuConsts.consts[$size].subMenuLabelPadding} 0;\n\n .${MENU_CLASS}-submenu-title {\n padding: ${MenuConsts.consts[$size].itemPadding[Directions.Horizontal][$iconPosition]};\n .${MENU_CLASS}-submenu-title-content {\n margin: -4px 2px;\n\n ${mode === 'horizontal'\n ? css`\n padding: 4px 8px 4px 0;\n `\n : css`\n margin-left: ${MenuConsts.consts[$size].verticalPopupMarginLeft}px;\n padding-right: 8px;\n `}\n }\n }\n\n .${MENU_CLASS}-submenu-selected > .${MENU_CLASS}-submenu-title:after {\n ${getIndicatorPositionStyle({\n indicatorPosition: getModeIndicatorPosition($indicatorPosition),\n size: $size,\n state: 'resting',\n active: true,\n muted: $muted,\n })};\n }\n\n .${MENU_CLASS}-submenu-expand-icon {\n transform: rotate(-90deg);\n }\n }\n }\n `;\n }}\n`;\n"],"names":["consts","MenuConsts","subMenuStyle","css","theme","$size","$muted","inlineCollapsed","$indicatorPosition","$iconPosition","mode","paddingOffset","subMenuIndentVertical","subMenuIndentHorizontal","Sizes","iconSize","gap","layer","FabricsVariables","disabledLayer","MENU_CLASS","Variables","BADGE_CLASS","getIndicatorPositionStyle","getModeIndicatorPosition","getFocusStyles","MenuConsts.consts","getBackgroundColor","Directions","getSubMenuSelectedIndicatorStyle","ZIndexes"],"mappings":"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"}
1	+ {"version":3,"file":"subMenu.styles.js","sources":["../../../../../src/components/Menu/styles/subMenu.styles.ts"],"sourcesContent":["import { css } from 'styled-components';\r\nimport { MENU_CLASS, ZIndexes, Directions, Sizes, BADGE_CLASS } from 'acinguiux-ds-react-base/consts';\r\nimport { Variables } from 'acinguiux-ds-react-base/theme';\r\nimport { MenuConsts } from 'acinguiux-ds-react-base/components/Menu';\r\nimport { FabricsVariables } from 'acinguiux-ds-fabrics';\r\nimport { getFocusStyles } from 'acinguiux-ds-react-base/utils/stylesUtils';\r\n\r\nimport type { StyledMenuProps } from '../Menu.types';\r\nimport { getBackgroundColor, getSubMenuSelectedIndicatorStyle, getModeIndicatorPosition } from '../Menu.utils';\r\nimport { getIndicatorPositionStyle } from './indicator.styles';\r\n\r\nconst { consts } = MenuConsts;\r\n\r\nexport const subMenuStyle = css<StyledMenuProps>`\r\n ${({ theme, $size, $muted, inlineCollapsed, $indicatorPosition, $iconPosition, mode }) => {\r\n const paddingOffset = `${consts[$size].subMenuOffestPadding}px`;\r\n const subMenuIndentVertical = `${consts[$size].indent}px`;\r\n const subMenuIndentHorizontal = `${consts[$size].indent - ($size === Sizes.XSmall ? 6 : 10)}px`;\r\n const iconSize = `${consts[$size].iconSize}px`;\r\n const gap = `${consts[$size].gap}px`;\r\n const layer = theme.layer({ foundation: FabricsVariables.Foundations.Section, muted: $muted });\r\n const disabledLayer = theme.layer({\r\n foundation: FabricsVariables.Foundations.Section,\r\n muted: $muted,\r\n disabled: true,\r\n });\r\n\r\n return css<StyledMenuProps>`\r\n .${MENU_CLASS}-submenu {\r\n cursor: pointer;\r\n display: flex;\r\n flex-direction: column;\r\n\r\n /* Default /\r\n &.${MENU_CLASS}-submenu, &.${MENU_CLASS}-submenu-active {\r\n .${MENU_CLASS}-submenu-title .${MENU_CLASS}-submenu-title-content .${MENU_CLASS}-label {\r\n color: ${layer[Variables.TextOnFoundationSubtle]};\r\n\r\n :not(.${BADGE_CLASS}) svg {\r\n fill: ${layer[Variables.TextOnFoundationSubtle]};\r\n }\r\n }\r\n }\r\n\r\n /* Active /\r\n &.${MENU_CLASS}-submenu-selected {\r\n > .${MENU_CLASS}-submenu-title .${MENU_CLASS}-submenu-title-content .${MENU_CLASS}-label {\r\n color: ${layer[Variables.TextOnFoundationStrong]};\r\n\r\n :not(.${BADGE_CLASS}) svg {\r\n fill: ${layer[Variables.TextOnFoundationStrong]};\r\n }\r\n }\r\n }\r\n\r\n /* Disabled /\r\n &.${MENU_CLASS}-submenu-disabled {\r\n > .${MENU_CLASS}-submenu-title .${MENU_CLASS}-submenu-title-content .${MENU_CLASS}-label {\r\n color: ${disabledLayer[Variables.TextOnFoundationSubtle]};\r\n cursor: not-allowed;\r\n\r\n :not(.${BADGE_CLASS}) svg {\r\n fill: ${disabledLayer[Variables.TextOnFoundationSubtle]};\r\n }\r\n }\r\n }\r\n\r\n &.${MENU_CLASS}-submenu-selected:not(.${MENU_CLASS}-submenu-open).${MENU_CLASS}-submenu-disabled\r\n > .${MENU_CLASS}-submenu-title {\r\n &::after {\r\n ${getIndicatorPositionStyle({\r\n indicatorPosition: getModeIndicatorPosition($indicatorPosition, mode),\r\n size: $size,\r\n state: 'resting',\r\n active: true,\r\n disabled: true,\r\n muted: $muted,\r\n })};\r\n }\r\n }\r\n\r\n .${MENU_CLASS}-submenu-title {\r\n position: relative;\r\n display: flex;\r\n align-items: center;\r\n flex: 1 1 0;\r\n min-width: 0;\r\n\r\n &:focus-visible {\r\n outline: none;\r\n position: relative;\r\n\r\n .${MENU_CLASS}-submenu-title-content {\r\n ${getFocusStyles(theme)};\r\n }\r\n }\r\n }\r\n\r\n .${MENU_CLASS}-submenu-title-content {\r\n display: flex;\r\n flex: 1 1 0;\r\n min-width: 0;\r\n justify-content: space-between;\r\n align-items: center;\r\n gap: ${gap};\r\n border-radius: ${MenuConsts.consts[$size].borderRadius}px;\r\n transition: background-color 0.3s ease-out;\r\n\r\n ${mode !== 'horizontal' &&\r\n css`\r\n margin-right: ${MenuConsts.consts[$size].collapsedItemMarginRight};\r\n `}\r\n }\r\n\r\n .${MENU_CLASS}-submenu-expand-icon {\r\n width: ${iconSize};\r\n height: ${iconSize};\r\n flex-shrink: 0;\r\n transition: transform 0.2s ease-in-out;\r\n margin: -10px 0;\r\n\r\n ${inlineCollapsed &&\r\n css`\r\n display: none;\r\n `}\r\n }\r\n\r\n &:not(.${MENU_CLASS}-submenu-active):not(.${MENU_CLASS}-submenu-selected) > .${MENU_CLASS}-submenu-title {\r\n > .${MENU_CLASS}-submenu-title-content {\r\n color: ${layer[Variables.TextOnFoundationSubtle]};\r\n }\r\n }\r\n\r\n &.${MENU_CLASS}-submenu-active:not(.${MENU_CLASS}-submenu-selected) > .${MENU_CLASS}-submenu-title {\r\n &:focus-visible {\r\n > .${MENU_CLASS}-submenu-title-content {\r\n background-color: transparent;\r\n }\r\n }\r\n\r\n > .${MENU_CLASS}-submenu-title-content {\r\n background-color: ${getBackgroundColor(\r\n theme,\r\n FabricsVariables.States.Hover,\r\n FabricsVariables.Foundations.Surface,\r\n $muted,\r\n )};\r\n }\r\n\r\n > .${MENU_CLASS}-submenu-title-content:active {\r\n background-color: ${getBackgroundColor(\r\n theme,\r\n FabricsVariables.States.Press,\r\n FabricsVariables.Foundations.Surface,\r\n $muted,\r\n )};\r\n }\r\n }\r\n\r\n &.${MENU_CLASS}-submenu-selected.${MENU_CLASS}-submenu-disabled > .${MENU_CLASS}-submenu-title {\r\n &,\r\n .${MENU_CLASS}-label {\r\n color: ${disabledLayer[Variables.TextOnFoundationSubtle]};\r\n }\r\n\r\n > .${MENU_CLASS}-submenu-title-content {\r\n background-color: ${getBackgroundColor(\r\n theme,\r\n FabricsVariables.States.Resting,\r\n FabricsVariables.Foundations.Section,\r\n $muted,\r\n true,\r\n )};\r\n\r\n svg {\r\n fill: ${disabledLayer[Variables.TextOnFoundationSubtle]};\r\n }\r\n }\r\n }\r\n\r\n &.${MENU_CLASS}-submenu-selected:not(.${MENU_CLASS}-submenu-disabled) > .${MENU_CLASS}-submenu-title {\r\n > .${MENU_CLASS}-submenu-title-content {\r\n background-color: ${getBackgroundColor(\r\n theme,\r\n FabricsVariables.States.Resting,\r\n FabricsVariables.Foundations.Section,\r\n $muted,\r\n )};\r\n }\r\n\r\n > .${MENU_CLASS}-submenu-title-content:hover {\r\n background-color: ${getBackgroundColor(\r\n theme,\r\n FabricsVariables.States.Hover,\r\n FabricsVariables.Foundations.Section,\r\n $muted,\r\n )};\r\n }\r\n\r\n > .${MENU_CLASS}-submenu-title-content:active {\r\n background-color: ${getBackgroundColor(\r\n theme,\r\n FabricsVariables.States.Press,\r\n FabricsVariables.Foundations.Section,\r\n $muted,\r\n )};\r\n }\r\n }\r\n }\r\n\r\n /* Inline and vertical /\r\n &.${MENU_CLASS}-inline, &.${MENU_CLASS}-vertical .${MENU_CLASS}-submenu {\r\n .${MENU_CLASS}-submenu-title {\r\n padding-left: ${subMenuIndentVertical};\r\n padding-right: ${subMenuIndentVertical};\r\n }\r\n }\r\n\r\n / Inline /\r\n &.${MENU_CLASS}-inline {\r\n .${MENU_CLASS}-submenu {\r\n &.${MENU_CLASS}-submenu-selected:not(.${MENU_CLASS}-submenu-open).${MENU_CLASS}-submenu-disabled\r\n > .${MENU_CLASS}-submenu-title {\r\n &::after {\r\n ${getIndicatorPositionStyle({\r\n indicatorPosition: getModeIndicatorPosition($indicatorPosition),\r\n size: $size,\r\n state: 'resting',\r\n active: true,\r\n disabled: true,\r\n muted: $muted,\r\n })};\r\n }\r\n }\r\n }\r\n\r\n .${MENU_CLASS}-submenu-title {\r\n margin: ${$size === Sizes.Small ? '2px' : '4px'} 0;\r\n\r\n .${MENU_CLASS}-submenu-title-content {\r\n padding: ${MenuConsts.consts[$size].labelPadding[Directions.Vertical][$iconPosition]};\r\n\r\n .${MENU_CLASS}-label {\r\n padding: unset;\r\n }\r\n }\r\n }\r\n\r\n .${MENU_CLASS}-submenu.${MENU_CLASS}-submenu-open\r\n > .${MENU_CLASS}-submenu-title\r\n > .${MENU_CLASS}-submenu-title-content\r\n > .${MENU_CLASS}-submenu-expand-icon {\r\n transform: rotate(180deg);\r\n }\r\n\r\n / Lowest level /\r\n .${MENU_CLASS}-submenu-selected:not(.${MENU_CLASS}-submenu-open):not(.${MENU_CLASS}-submenu-disabled)\r\n > .${MENU_CLASS}-submenu-title {\r\n background-color: transparent;\r\n\r\n ${getSubMenuSelectedIndicatorStyle($indicatorPosition, mode, $size, $muted)};\r\n }\r\n }\r\n\r\n / Vertical /\r\n &.${MENU_CLASS}-vertical .${MENU_CLASS}-submenu {\r\n .${MENU_CLASS}-submenu-title {\r\n margin: ${$size === Sizes.Small ? '2px' : '4px'} 0;\r\n\r\n &:focus-visible {\r\n outline: none;\r\n position: relative;\r\n\r\n .${MENU_CLASS}-submenu-title-content {\r\n ${getFocusStyles(theme)};\r\n }\r\n }\r\n\r\n .${MENU_CLASS}-submenu-title-content {\r\n padding: ${MenuConsts.consts[$size].labelPadding[Directions.Vertical][$iconPosition]};\r\n\r\n .${MENU_CLASS}-label {\r\n padding: unset;\r\n }\r\n }\r\n }\r\n\r\n .${MENU_CLASS}-submenu-expand-icon {\r\n transform: rotate(-90deg);\r\n }\r\n\r\n &.${MENU_CLASS}-submenu-selected:not(.${MENU_CLASS}-submenu-disabled) > .${MENU_CLASS}-submenu-title {\r\n background-color: transparent;\r\n\r\n ${getSubMenuSelectedIndicatorStyle($indicatorPosition, mode, $size, $muted)};\r\n }\r\n\r\n .${MENU_CLASS}-item-group .${MENU_CLASS}-item-group-list {\r\n display: flex;\r\n flex-direction: row;\r\n }\r\n }\r\n\r\n / Horizontal /\r\n &.${MENU_CLASS}-horizontal .${MENU_CLASS}-submenu {\r\n display: flex;\r\n flex-direction: row;\r\n align-items: stretch;\r\n\r\n .${MENU_CLASS}-submenu-title {\r\n padding: ${paddingOffset} ${subMenuIndentHorizontal};\r\n\r\n .${MENU_CLASS}-submenu-title-content {\r\n padding: ${MenuConsts.consts[$size].labelPadding[Directions.Horizontal][$iconPosition]};\r\n\r\n .${MENU_CLASS}-label {\r\n padding: unset;\r\n }\r\n }\r\n }\r\n\r\n &.${MENU_CLASS}-submenu-selected:not(.${MENU_CLASS}-submenu-disabled) > .${MENU_CLASS}-submenu-title {\r\n ${getSubMenuSelectedIndicatorStyle($indicatorPosition, mode, $size, $muted)};\r\n }\r\n\r\n &.${MENU_CLASS}-overflow-item-rest {\r\n .${MENU_CLASS}-submenu-rest-icon {\r\n width: ${iconSize};\r\n height: ${iconSize};\r\n }\r\n }\r\n }\r\n\r\n / Popup /\r\n &.${MENU_CLASS}-submenu {\r\n &.${MENU_CLASS}-submenu-popup {\r\n z-index: ${ZIndexes.MENU};\r\n position: absolute;\r\n transform-origin: 0 0;\r\n background-color: transparent;\r\n overflow: visible;\r\n > .${MENU_CLASS}-sub {\r\n background-color: ${getBackgroundColor(\r\n theme,\r\n FabricsVariables.States.Resting,\r\n FabricsVariables.Foundations.Surface,\r\n $muted,\r\n )};\r\n filter: ${theme.dropShadows.low2};\r\n border-radius: 8px;\r\n\r\n .${MENU_CLASS}-item-group-title, .${MENU_CLASS}-submenu-title, .${MENU_CLASS}-item {\r\n align-items: stretch;\r\n }\r\n\r\n ${mode !== 'horizontal' &&\r\n css`\r\n .${MENU_CLASS}-item-group-title {\r\n margin-left: -${MenuConsts.consts[$size].itemListMarginLeft}px;\r\n }\r\n\r\n .${MENU_CLASS}-submenu-title {\r\n margin-left: -${MenuConsts.consts[$size].itemListMarginLeft}px;\r\n }\r\n\r\n .${MENU_CLASS}-item {\r\n margin-left: -${MenuConsts.consts[$size].itemListMarginLeft}px;\r\n }\r\n `}\r\n }\r\n }\r\n\r\n &.${MENU_CLASS}-submenu-hidden {\r\n display: none;\r\n }\r\n\r\n / Vertical and horizontal */\r\n .${MENU_CLASS}-vertical {\r\n max-width: 300px;\r\n padding: ${MenuConsts.consts[$size].subMenuLabelPadding} 0;\r\n\r\n .${MENU_CLASS}-submenu-title {\r\n padding: ${MenuConsts.consts[$size].itemPadding[Directions.Horizontal][$iconPosition]};\r\n .${MENU_CLASS}-submenu-title-content {\r\n margin: -4px 2px;\r\n\r\n ${mode === 'horizontal'\r\n ? css`\r\n padding: 4px 8px 4px 0;\r\n `\r\n : css`\r\n margin-left: ${MenuConsts.consts[$size].verticalPopupMarginLeft}px;\r\n padding-right: 8px;\r\n `}\r\n }\r\n }\r\n\r\n .${MENU_CLASS}-submenu-selected > .${MENU_CLASS}-submenu-title:after {\r\n ${getIndicatorPositionStyle({\r\n indicatorPosition: getModeIndicatorPosition($indicatorPosition),\r\n size: $size,\r\n state: 'resting',\r\n active: true,\r\n muted: $muted,\r\n })};\r\n }\r\n\r\n .${MENU_CLASS}-submenu-expand-icon {\r\n transform: rotate(-90deg);\r\n }\r\n }\r\n }\r\n `;\r\n }}\r\n`;\r\n"],"names":["consts","MenuConsts","subMenuStyle","css","theme","$size","$muted","inlineCollapsed","$indicatorPosition","$iconPosition","mode","paddingOffset","subMenuIndentVertical","subMenuIndentHorizontal","Sizes","iconSize","gap","layer","FabricsVariables","disabledLayer","MENU_CLASS","Variables","BADGE_CLASS","getIndicatorPositionStyle","getModeIndicatorPosition","getFocusStyles","MenuConsts.consts","getBackgroundColor","Directions","getSubMenuSelectedIndicatorStyle","ZIndexes"],"mappings":"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"}

package/build/cjs/components/Menu/utils/classObserverUtils.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"classObserverUtils.js","sources":["../../../../../src/components/Menu/utils/classObserverUtils.ts"],"sourcesContent":["import { type RefObject, useEffect } from 'react';\n\ntype OnClassChange = (classNames: DOMTokenList) => void;\n\nconst createMutationCallback: (onChange: OnClassChange) => MutationCallback = (onChange) => (mutations) => {\n mutations.forEach((mutation) => {\n if (mutation.attributeName === 'class') {\n onChange((mutation.target as HTMLElement).classList);\n }\n });\n};\n\n/*\n @private\n \n Currently only used in SubMenu to listen on submenu being open or not,\n * due to @rc-component/menu implementation (no other visibility than classes being present),\n * due to Tooltip implementation (using Portal so CSS selection to hide Tooltip is not possible)\n \n Could be removed/improved depending on need:\n * - potentially removed following refactor of Menu\n * - potentially improved or exposed if consumers have a use of this Hook\n \n Implemented on 19th Sept. 2024 by \"Jean Barriere <jean.barriere@acinguiux.com>\"\n * No external references.\n * @param ref reference to observe on\n * @param onChange function called when a class mutation is observed\n */\nexport const useClassObserver = <T extends HTMLElement>(\n ref: RefObject<T> \| undefined,\n onChange: OnClassChange,\n): void => {\n useEffect(() => {\n if (!ref?.current) {\n return undefined;\n }\n const mutationObserver = new MutationObserver(createMutationCallback(onChange));\n\n onChange(ref.current.classList);\n mutationObserver.observe(ref.current, { attributes: true });\n\n return () => {\n mutationObserver.disconnect();\n };\n }, [ref, onChange]);\n};\n"],"names":["createMutationCallback","onChange","mutations","mutation","useClassObserver","ref","useEffect","mutationObserver"],"mappings":"qIAIMA,EAAyEC,GAAcC,GAAc,CACzGA,EAAU,QAASC,GAAa,CAC1BA,EAAS,gBAAkB,SAC7BF,EAAUE,EAAS,OAAuB,SAAS,CAEvD,CAAC,CACH,EAkBaC,EAAmB,CAC9BC,EACAJ,IACS,CACTK,EAAAA,UAAU,IAAM,CACd,GAAI,CAACD,GAAK,QACR,OAEF,MAAME,EAAmB,IAAI,iBAAiBP,EAAuBC,CAAQ,CAAC,EAE9E,OAAAA,EAASI,EAAI,QAAQ,SAAS,EAC9BE,EAAiB,QAAQF,EAAI,QAAS,CAAE,WAAY,GAAM,EAEnD,IAAM,CACXE,EAAiB,WAAA,CACnB,CACF,EAAG,CAACF,EAAKJ,CAAQ,CAAC,CACpB"}
1	+ {"version":3,"file":"classObserverUtils.js","sources":["../../../../../src/components/Menu/utils/classObserverUtils.ts"],"sourcesContent":["import { type RefObject, useEffect } from 'react';\r\n\r\ntype OnClassChange = (classNames: DOMTokenList) => void;\r\n\r\nconst createMutationCallback: (onChange: OnClassChange) => MutationCallback = (onChange) => (mutations) => {\r\n mutations.forEach((mutation) => {\r\n if (mutation.attributeName === 'class') {\r\n onChange((mutation.target as HTMLElement).classList);\r\n }\r\n });\r\n};\r\n\r\n/*\r\n @private\r\n \r\n Currently only used in SubMenu to listen on submenu being open or not,\r\n * due to @rc-component/menu implementation (no other visibility than classes being present),\r\n * due to Tooltip implementation (using Portal so CSS selection to hide Tooltip is not possible)\r\n \r\n Could be removed/improved depending on need:\r\n * - potentially removed following refactor of Menu\r\n * - potentially improved or exposed if consumers have a use of this Hook\r\n \r\n Implemented on 19th Sept. 2024 by \"Jean Barriere <jean.barriere@acinguiux.com>\"\r\n * No external references.\r\n * @param ref reference to observe on\r\n * @param onChange function called when a class mutation is observed\r\n */\r\nexport const useClassObserver = <T extends HTMLElement>(\r\n ref: RefObject<T> \| undefined,\r\n onChange: OnClassChange,\r\n): void => {\r\n useEffect(() => {\r\n if (!ref?.current) {\r\n return undefined;\r\n }\r\n const mutationObserver = new MutationObserver(createMutationCallback(onChange));\r\n\r\n onChange(ref.current.classList);\r\n mutationObserver.observe(ref.current, { attributes: true });\r\n\r\n return () => {\r\n mutationObserver.disconnect();\r\n };\r\n }, [ref, onChange]);\r\n};\r\n"],"names":["createMutationCallback","onChange","mutations","mutation","useClassObserver","ref","useEffect","mutationObserver"],"mappings":"qIAIMA,EAAyEC,GAAcC,GAAc,CACzGA,EAAU,QAASC,GAAa,CAC1BA,EAAS,gBAAkB,SAC7BF,EAAUE,EAAS,OAAuB,SAAS,CAEvD,CAAC,CACH,EAkBaC,EAAmB,CAC9BC,EACAJ,IACS,CACTK,EAAAA,UAAU,IAAM,CACd,GAAI,CAACD,GAAK,QACR,OAEF,MAAME,EAAmB,IAAI,iBAAiBP,EAAuBC,CAAQ,CAAC,EAE9E,OAAAA,EAASI,EAAI,QAAQ,SAAS,EAC9BE,EAAiB,QAAQF,EAAI,QAAS,CAAE,WAAY,GAAM,EAEnD,IAAM,CACXE,EAAiB,WAAA,CACnB,CACF,EAAG,CAACF,EAAKJ,CAAQ,CAAC,CACpB"}

package/build/cjs/components/Menu/utils/motionUtils.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"motionUtils.js","sources":["../../../../../src/components/Menu/utils/motionUtils.ts"],"sourcesContent":["import type { MotionEndEventHandler, MotionEventHandler } from 'rc-motion';\nimport type { MotionEvent } from 'rc-motion/lib/interface';\nimport { MENU_CLASS } from 'acinguiux-ds-react-base/consts';\n\nconst getCollapsedHeight: MotionEventHandler = () => ({ height: 0, opacity: 0 });\nconst getRealHeight: MotionEventHandler = (node) => ({ height: node ? node.scrollHeight : 0, opacity: 1 });\nconst getCurrentHeight: MotionEventHandler = (node) => ({ height: node ? node.offsetHeight : 0 });\nconst skipOpacityTransition: MotionEndEventHandler = (_, event: MotionEvent) =>\n event?.deadline === true \|\| (event as TransitionEvent).propertyName === 'height';\n\nexport const getDefaultMotions = {\n horizontal: { motionName: `${MENU_CLASS}-slide-up`, motionDeadline: 150 },\n inline: {\n motionName: `${MENU_CLASS}-collapse`,\n onAppearStart: getCollapsedHeight,\n onEnterStart: getCollapsedHeight,\n onAppearActive: getRealHeight,\n onEnterActive: getRealHeight,\n onLeaveStart: getCurrentHeight,\n onLeaveActive: getCollapsedHeight,\n onAppearEnd: skipOpacityTransition,\n onEnterEnd: skipOpacityTransition,\n onLeaveEnd: skipOpacityTransition,\n motionDeadline: 500,\n },\n other: { motionName: `${MENU_CLASS}-zoom`, motionDeadline: 150 },\n};\n"],"names":["getCollapsedHeight","getRealHeight","node","getCurrentHeight","skipOpacityTransition","_","event","getDefaultMotions","MENU_CLASS"],"mappings":"yKAIMA,EAAyC,KAAO,CAAE,OAAQ,EAAG,QAAS,CAAA,GACtEC,EAAqCC,IAAU,CAAE,OAAQA,EAAOA,EAAK,aAAe,EAAG,QAAS,IAChGC,EAAwCD,IAAU,CAAE,OAAQA,EAAOA,EAAK,aAAe,IACvFE,EAA+C,CAACC,EAAGC,IACvDA,GAAO,WAAa,IAASA,EAA0B,eAAiB,SAE7DC,EAAoB,CAC/B,WAAY,CAAE,WAAY,GAAGC,EAAAA,UAAU,YAAa,eAAgB,GAAA,EACpE,OAAQ,CACN,WAAY,GAAGA,EAAAA,UAAU,YACzB,cAAeR,EACf,aAAcA,EACd,eAAgBC,EAChB,cAAeA,EACf,aAAcE,EACd,cAAeH,EACf,YAAaI,EACb,WAAYA,EACZ,WAAYA,EACZ,eAAgB,GAAA,EAElB,MAAO,CAAE,WAAY,GAAGI,EAAAA,UAAU,QAAS,eAAgB,GAAA,CAC7D"}
1	+ {"version":3,"file":"motionUtils.js","sources":["../../../../../src/components/Menu/utils/motionUtils.ts"],"sourcesContent":["import type { MotionEndEventHandler, MotionEventHandler } from 'rc-motion';\r\nimport type { MotionEvent } from 'rc-motion/lib/interface';\r\nimport { MENU_CLASS } from 'acinguiux-ds-react-base/consts';\r\n\r\nconst getCollapsedHeight: MotionEventHandler = () => ({ height: 0, opacity: 0 });\r\nconst getRealHeight: MotionEventHandler = (node) => ({ height: node ? node.scrollHeight : 0, opacity: 1 });\r\nconst getCurrentHeight: MotionEventHandler = (node) => ({ height: node ? node.offsetHeight : 0 });\r\nconst skipOpacityTransition: MotionEndEventHandler = (_, event: MotionEvent) =>\r\n event?.deadline === true \|\| (event as TransitionEvent).propertyName === 'height';\r\n\r\nexport const getDefaultMotions = {\r\n horizontal: { motionName: `${MENU_CLASS}-slide-up`, motionDeadline: 150 },\r\n inline: {\r\n motionName: `${MENU_CLASS}-collapse`,\r\n onAppearStart: getCollapsedHeight,\r\n onEnterStart: getCollapsedHeight,\r\n onAppearActive: getRealHeight,\r\n onEnterActive: getRealHeight,\r\n onLeaveStart: getCurrentHeight,\r\n onLeaveActive: getCollapsedHeight,\r\n onAppearEnd: skipOpacityTransition,\r\n onEnterEnd: skipOpacityTransition,\r\n onLeaveEnd: skipOpacityTransition,\r\n motionDeadline: 500,\r\n },\r\n other: { motionName: `${MENU_CLASS}-zoom`, motionDeadline: 150 },\r\n};\r\n"],"names":["getCollapsedHeight","getRealHeight","node","getCurrentHeight","skipOpacityTransition","_","event","getDefaultMotions","MENU_CLASS"],"mappings":"yKAIMA,EAAyC,KAAO,CAAE,OAAQ,EAAG,QAAS,CAAA,GACtEC,EAAqCC,IAAU,CAAE,OAAQA,EAAOA,EAAK,aAAe,EAAG,QAAS,IAChGC,EAAwCD,IAAU,CAAE,OAAQA,EAAOA,EAAK,aAAe,IACvFE,EAA+C,CAACC,EAAGC,IACvDA,GAAO,WAAa,IAASA,EAA0B,eAAiB,SAE7DC,EAAoB,CAC/B,WAAY,CAAE,WAAY,GAAGC,EAAAA,UAAU,YAAa,eAAgB,GAAA,EACpE,OAAQ,CACN,WAAY,GAAGA,EAAAA,UAAU,YACzB,cAAeR,EACf,aAAcA,EACd,eAAgBC,EAChB,cAAeA,EACf,aAAcE,EACd,cAAeH,EACf,YAAaI,EACb,WAAYA,EACZ,WAAYA,EACZ,eAAgB,GAAA,EAElB,MAAO,CAAE,WAAY,GAAGI,EAAAA,UAAU,QAAS,eAAgB,GAAA,CAC7D"}

package/build/cjs/components/Menu/utils/nodeUtils.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"nodeUtils.js","sources":["../../../../../src/components/Menu/utils/nodeUtils.tsx"],"sourcesContent":["// This hook is tweaked from Ant Design's menu component\n// https://github.com/ant-design/ant-design/blob/master/components/menu/hooks/useItems.tsx\n// It converts the items array to React nodes using our components\n\nimport { type ReactNode, useMemo } from 'react';\n\nimport type { ItemType } from '@rc-component/menu/lib/interface';\n\nimport MenuDivider from '../components/MenuDivider';\nimport MenuItem from '../components/MenuItem';\nimport MenuItemGroup from '../components/MenuItemGroup';\nimport SubMenu from '../components/SubMenu';\nimport type { MenuItemGroupType, MenuItemType, SubMenuType } from '../Menu.types';\n\ntype ConvertItemsToNodesOpts = {\n mode?: string;\n};\n\nconst convertItemsToNodes = (items: ItemType[], level: number, opts: ConvertItemsToNodesOpts) =>\n (items \|\| [])\n .map((opt, index) => {\n if (opt && typeof opt === 'object') {\n // handling types properly here makes the code unreadable\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n const { label, children, key, type, ...restProps } = opt as any;\n const mergedKey = key ?? `tmp-${index}`;\n\n if (children \|\| type === 'group') {\n if (type === 'group') {\n return (\n <MenuItemGroup key={mergedKey} {...restProps} title={label}>\n {convertItemsToNodes(children, level + 1, opts)}\n </MenuItemGroup>\n );\n }\n\n return (\n <SubMenu key={mergedKey} level={level} {...restProps} title={label}>\n {convertItemsToNodes(children, level + 1, opts)}\n </SubMenu>\n );\n }\n\n if (type === 'divider') {\n return (\n <MenuDivider\n key={mergedKey}\n {...restProps}\n {...(opts.mode === 'horizontal' ? { style: { order: index } } : {})}\n />\n );\n }\n\n return (\n <MenuItem key={mergedKey} level={level} {...restProps}>\n {label}\n </MenuItem>\n );\n }\n\n return null;\n })\n .filter((opt) => opt);\n\nexport const useItems = (items: ItemType[] \| undefined, children: ReactNode, opts: { mode: string }) =>\n useMemo(() => {\n if (!items) {\n return children;\n }\n\n return convertItemsToNodes(items, 0, opts);\n }, [items, children, opts]);\n\nconst isParent = (item: ItemType): item is SubMenuType \| MenuItemGroupType => !!item && 'children' in item;\nconst isMenuItem = (item: ItemType): item is MenuItemType => !!item && 'key' in item && !('children' in item);\n\nexport const getItemsByPath: (path: string, items: ItemType[] \| undefined) => string[] = (path, items) => {\n if (items === undefined) return [];\n const findItem: (menuItems: ItemType[]) => string[] = (menuItems) =>\n menuItems.reduce<string[]>((acc, item) => {\n if (!item) return acc;\n if (isParent(item) && item.children) {\n const childPath = findItem(item.children);\n if (childPath.length > 0 && 'key' in item) {\n return [...acc, item.key, ...childPath];\n }\n return [...acc, ...childPath];\n }\n if (isMenuItem(item) && item.path === path) return [...acc, item.key as string];\n\n return acc;\n }, []);\n\n return findItem(items);\n};\n\nexport const getLeafItems = (items?: ItemType[]): MenuItemType[] =>\n items?.flatMap((item) => (isParent(item) ? getLeafItems(item.children) : item)).filter(isMenuItem) ?? [];\n"],"names":["convertItemsToNodes","items","level","opts","opt","index","label","children","key","type","restProps","mergedKey","jsx","MenuItemGroup","SubMenu","MenuDivider","MenuItem","useItems","useMemo","isParent","item","isMenuItem","getItemsByPath","path","findItem","menuItems","acc","childPath","getLeafItems"],"mappings":"uUAkBMA,EAAsB,CAACC,EAAmBC,EAAeC,KAC5DF,GAAS,CAAA,GACP,IAAI,CAACG,EAAKC,IAAU,CACnB,GAAID,GAAO,OAAOA,GAAQ,SAAU,CAGlC,KAAM,CAAE,MAAAE,EAAO,SAAAC,EAAU,IAAAC,EAAK,KAAAC,EAAM,GAAGC,GAAcN,EAC/CO,EAAYH,GAAO,OAAOH,CAAK,GAErC,OAAIE,GAAYE,IAAS,QACnBA,IAAS,QAETG,EAAAA,IAACC,EAAA,CAA+B,GAAGH,EAAW,MAAOJ,EAClD,SAAAN,EAAoBO,EAAUL,EAAQ,EAAGC,CAAI,CAAA,EAD5BQ,CAEpB,EAKFC,EAAAA,IAACE,EAAA,CAAwB,MAAAZ,EAAe,GAAGQ,EAAW,MAAOJ,EAC1D,SAAAN,EAAoBO,EAAUL,EAAQ,EAAGC,CAAI,GADlCQ,CAEd,EAIAF,IAAS,UAETG,EAAAA,IAACG,EAAA,CAEE,GAAGL,EACH,GAAIP,EAAK,OAAS,aAAe,CAAE,MAAO,CAAE,MAAOE,CAAA,GAAY,CAAA,CAAC,EAF5DM,CAAA,QAQRK,EAAA,CAAyB,MAAAd,EAAe,GAAGQ,EACzC,YADYC,CAEf,CAEJ,CAEA,OAAO,IACT,CAAC,EACA,OAAQP,GAAQA,CAAG,EAEXa,EAAW,CAAChB,EAA+BM,EAAqBJ,IAC3Ee,EAAAA,QAAQ,IACDjB,EAIED,EAAoBC,EAAO,EAAGE,CAAI,EAHhCI,EAIR,CAACN,EAAOM,EAAUJ,CAAI,CAAC,EAEtBgB,EAAYC,GAA4D,CAAC,CAACA,GAAQ,aAAcA,EAChGC,EAAcD,GAAyC,CAAC,CAACA,GAAQ,QAASA,GAAQ,EAAE,aAAcA,GAE3FE,EAA4E,CAACC,EAAMtB,IAAU,CACxG,GAAIA,IAAU,OAAW,MAAO,CAAA,EAChC,MAAMuB,EAAiDC,GACrDA,EAAU,OAAiB,CAACC,EAAKN,IAAS,CACxC,GAAI,CAACA,EAAM,OAAOM,EAClB,GAAIP,EAASC,CAAI,GAAKA,EAAK,SAAU,CACnC,MAAMO,EAAYH,EAASJ,EAAK,QAAQ,EACxC,OAAIO,EAAU,OAAS,GAAK,QAASP,EAC5B,CAAC,GAAGM,EAAKN,EAAK,IAAK,GAAGO,CAAS,EAEjC,CAAC,GAAGD,EAAK,GAAGC,CAAS,CAC9B,CACA,OAAIN,EAAWD,CAAI,GAAKA,EAAK,OAASG,EAAa,CAAC,GAAGG,EAAKN,EAAK,GAAa,EAEvEM,CACT,EAAG,CAAA,CAAE,EAEP,OAAOF,EAASvB,CAAK,CACvB,EAEa2B,EAAgB3B,GAC3BA,GAAO,QAASmB,GAAUD,EAASC,CAAI,EAAIQ,EAAaR,EAAK,QAAQ,EAAIA,CAAK,EAAE,OAAOC,CAAU,GAAK,CAAA"}
1	+ {"version":3,"file":"nodeUtils.js","sources":["../../../../../src/components/Menu/utils/nodeUtils.tsx"],"sourcesContent":["// This hook is tweaked from Ant Design's menu component\r\n// https://github.com/ant-design/ant-design/blob/master/components/menu/hooks/useItems.tsx\r\n// It converts the items array to React nodes using our components\r\n\r\nimport { type ReactNode, useMemo } from 'react';\r\n\r\nimport type { ItemType } from '@rc-component/menu/lib/interface';\r\n\r\nimport MenuDivider from '../components/MenuDivider';\r\nimport MenuItem from '../components/MenuItem';\r\nimport MenuItemGroup from '../components/MenuItemGroup';\r\nimport SubMenu from '../components/SubMenu';\r\nimport type { MenuItemGroupType, MenuItemType, SubMenuType } from '../Menu.types';\r\n\r\ntype ConvertItemsToNodesOpts = {\r\n mode?: string;\r\n};\r\n\r\nconst convertItemsToNodes = (items: ItemType[], level: number, opts: ConvertItemsToNodesOpts) =>\r\n (items \|\| [])\r\n .map((opt, index) => {\r\n if (opt && typeof opt === 'object') {\r\n // handling types properly here makes the code unreadable\r\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\r\n const { label, children, key, type, ...restProps } = opt as any;\r\n const mergedKey = key ?? `tmp-${index}`;\r\n\r\n if (children \|\| type === 'group') {\r\n if (type === 'group') {\r\n return (\r\n <MenuItemGroup key={mergedKey} {...restProps} title={label}>\r\n {convertItemsToNodes(children, level + 1, opts)}\r\n </MenuItemGroup>\r\n );\r\n }\r\n\r\n return (\r\n <SubMenu key={mergedKey} level={level} {...restProps} title={label}>\r\n {convertItemsToNodes(children, level + 1, opts)}\r\n </SubMenu>\r\n );\r\n }\r\n\r\n if (type === 'divider') {\r\n return (\r\n <MenuDivider\r\n key={mergedKey}\r\n {...restProps}\r\n {...(opts.mode === 'horizontal' ? { style: { order: index } } : {})}\r\n />\r\n );\r\n }\r\n\r\n return (\r\n <MenuItem key={mergedKey} level={level} {...restProps}>\r\n {label}\r\n </MenuItem>\r\n );\r\n }\r\n\r\n return null;\r\n })\r\n .filter((opt) => opt);\r\n\r\nexport const useItems = (items: ItemType[] \| undefined, children: ReactNode, opts: { mode: string }) =>\r\n useMemo(() => {\r\n if (!items) {\r\n return children;\r\n }\r\n\r\n return convertItemsToNodes(items, 0, opts);\r\n }, [items, children, opts]);\r\n\r\nconst isParent = (item: ItemType): item is SubMenuType \| MenuItemGroupType => !!item && 'children' in item;\r\nconst isMenuItem = (item: ItemType): item is MenuItemType => !!item && 'key' in item && !('children' in item);\r\n\r\nexport const getItemsByPath: (path: string, items: ItemType[] \| undefined) => string[] = (path, items) => {\r\n if (items === undefined) return [];\r\n const findItem: (menuItems: ItemType[]) => string[] = (menuItems) =>\r\n menuItems.reduce<string[]>((acc, item) => {\r\n if (!item) return acc;\r\n if (isParent(item) && item.children) {\r\n const childPath = findItem(item.children);\r\n if (childPath.length > 0 && 'key' in item) {\r\n return [...acc, item.key, ...childPath];\r\n }\r\n return [...acc, ...childPath];\r\n }\r\n if (isMenuItem(item) && item.path === path) return [...acc, item.key as string];\r\n\r\n return acc;\r\n }, []);\r\n\r\n return findItem(items);\r\n};\r\n\r\nexport const getLeafItems = (items?: ItemType[]): MenuItemType[] =>\r\n items?.flatMap((item) => (isParent(item) ? getLeafItems(item.children) : item)).filter(isMenuItem) ?? [];\r\n"],"names":["convertItemsToNodes","items","level","opts","opt","index","label","children","key","type","restProps","mergedKey","jsx","MenuItemGroup","SubMenu","MenuDivider","MenuItem","useItems","useMemo","isParent","item","isMenuItem","getItemsByPath","path","findItem","menuItems","acc","childPath","getLeafItems"],"mappings":"uUAkBMA,EAAsB,CAACC,EAAmBC,EAAeC,KAC5DF,GAAS,CAAA,GACP,IAAI,CAACG,EAAKC,IAAU,CACnB,GAAID,GAAO,OAAOA,GAAQ,SAAU,CAGlC,KAAM,CAAE,MAAAE,EAAO,SAAAC,EAAU,IAAAC,EAAK,KAAAC,EAAM,GAAGC,GAAcN,EAC/CO,EAAYH,GAAO,OAAOH,CAAK,GAErC,OAAIE,GAAYE,IAAS,QACnBA,IAAS,QAETG,EAAAA,IAACC,EAAA,CAA+B,GAAGH,EAAW,MAAOJ,EAClD,SAAAN,EAAoBO,EAAUL,EAAQ,EAAGC,CAAI,CAAA,EAD5BQ,CAEpB,EAKFC,EAAAA,IAACE,EAAA,CAAwB,MAAAZ,EAAe,GAAGQ,EAAW,MAAOJ,EAC1D,SAAAN,EAAoBO,EAAUL,EAAQ,EAAGC,CAAI,GADlCQ,CAEd,EAIAF,IAAS,UAETG,EAAAA,IAACG,EAAA,CAEE,GAAGL,EACH,GAAIP,EAAK,OAAS,aAAe,CAAE,MAAO,CAAE,MAAOE,CAAA,GAAY,CAAA,CAAC,EAF5DM,CAAA,QAQRK,EAAA,CAAyB,MAAAd,EAAe,GAAGQ,EACzC,YADYC,CAEf,CAEJ,CAEA,OAAO,IACT,CAAC,EACA,OAAQP,GAAQA,CAAG,EAEXa,EAAW,CAAChB,EAA+BM,EAAqBJ,IAC3Ee,EAAAA,QAAQ,IACDjB,EAIED,EAAoBC,EAAO,EAAGE,CAAI,EAHhCI,EAIR,CAACN,EAAOM,EAAUJ,CAAI,CAAC,EAEtBgB,EAAYC,GAA4D,CAAC,CAACA,GAAQ,aAAcA,EAChGC,EAAcD,GAAyC,CAAC,CAACA,GAAQ,QAASA,GAAQ,EAAE,aAAcA,GAE3FE,EAA4E,CAACC,EAAMtB,IAAU,CACxG,GAAIA,IAAU,OAAW,MAAO,CAAA,EAChC,MAAMuB,EAAiDC,GACrDA,EAAU,OAAiB,CAACC,EAAKN,IAAS,CACxC,GAAI,CAACA,EAAM,OAAOM,EAClB,GAAIP,EAASC,CAAI,GAAKA,EAAK,SAAU,CACnC,MAAMO,EAAYH,EAASJ,EAAK,QAAQ,EACxC,OAAIO,EAAU,OAAS,GAAK,QAASP,EAC5B,CAAC,GAAGM,EAAKN,EAAK,IAAK,GAAGO,CAAS,EAEjC,CAAC,GAAGD,EAAK,GAAGC,CAAS,CAC9B,CACA,OAAIN,EAAWD,CAAI,GAAKA,EAAK,OAASG,EAAa,CAAC,GAAGG,EAAKN,EAAK,GAAa,EAEvEM,CACT,EAAG,CAAA,CAAE,EAEP,OAAOF,EAASvB,CAAK,CACvB,EAEa2B,EAAgB3B,GAC3BA,GAAO,QAASmB,GAAUD,EAASC,CAAI,EAAIQ,EAAaR,EAAK,QAAQ,EAAIA,CAAK,EAAE,OAAOC,CAAU,GAAK,CAAA"}

package/build/cjs/components/Modal/Modal.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Modal.js","sources":["../../../../src/components/Modal/Modal.tsx"],"sourcesContent":["import type { ReactElement } from 'react';\n\nimport classNames from 'classnames';\nimport {\n NOOP,\n Alignments,\n Sizes,\n MODAL_CONTAINER_CLASS,\n MODAL_CLASS,\n MODAL_HEADER_CLASS,\n MODAL_FOOTER_CLASS,\n Variants,\n Directions,\n} from 'acinguiux-ds-react-base/consts';\n\nimport Dialog from './components/Dialog/Dialog';\nimport * as Styled from './Modal.styles';\nimport type { IModalProps } from './Modal.types';\nimport ModalLoading from './components/ModalLoading/ModalLoading';\nimport InfoBar from '../_internalComponents/InfoBar/InfoBar';\nimport Button from '../Button/Button';\nimport CrossIcon from '../Icon/components/Cross';\nimport ActionBar from '../_internalComponents/ActionBar/ActionBar';\nimport { CloseButton } from './components/ModalLoading/ModalLoading.styles';\n\nconst Modal = ({\n children,\n className,\n open,\n headerBorder = true,\n footerBorder = true,\n bgColor = false,\n padding = true,\n onClose = NOOP,\n header,\n actions,\n actionsDirection = Directions.Horizontal,\n actionsAlignment = Alignments.Right,\n loading = false,\n loadingBody = 'Loading...',\n size = Sizes.Medium,\n closeButton = true,\n maskClosable = true,\n contentScrollable = false,\n showHeader = true,\n showFooter = true,\n centered = false,\n width = 520,\n ...props\n}: IModalProps): ReactElement => {\n const isWithoutHeaderAndFooter = !header && actions && actions?.length > 0;\n\n return (\n <Styled.Modal\n $size={size}\n as={Dialog}\n prefixCls={MODAL_CLASS}\n className={classNames(MODAL_CONTAINER_CLASS, className)}\n visible={open}\n onClose={onClose}\n closable={closeButton}\n maskClosable={maskClosable}\n $centered={centered}\n $contentScrollable={contentScrollable}\n width={width}\n {...props}\n >\n {!!showHeader && !!header && !loading && (\n <Styled.ModalHeader $size={size} $headerBorder={headerBorder} className={MODAL_HEADER_CLASS}>\n <Styled.ModalHeaderContent>\n <InfoBar direction={Directions.Vertical} size={size} {...header} />\n </Styled.ModalHeaderContent>\n {!!closeButton && (\n <Button\n icon={<CrossIcon />}\n iconOnly={true}\n variant={Variants.Transparent}\n size={size}\n onClick={onClose}\n aria-label=\"Close\"\n />\n )}\n </Styled.ModalHeader>\n )}\n <Styled.ModalContent\n $size={size}\n $padding={padding}\n $headerBorder={headerBorder}\n $footerBorder={footerBorder}\n $hasHeader={Boolean(showHeader && header)}\n $hasFooter={Boolean(showFooter && actions)}\n $bgColor={bgColor}\n $contentScrollable={contentScrollable}\n $bodyCentered={isWithoutHeaderAndFooter \|\| loading}\n $onlyBody={loading}\n >\n {!header && !!closeButton && !loading && (\n <CloseButton\n icon={<CrossIcon />}\n iconOnly={true}\n variant={Variants.Transparent}\n size={size}\n $paddingSize={size}\n onClick={onClose}\n />\n )}\n {loading ? (\n <ModalLoading size={size} loadingBody={loadingBody} closeButton={closeButton} onClose={onClose} />\n ) : (\n children\n )}\n </Styled.ModalContent>\n {!!showFooter && !!actions && !loading && (\n <Styled.ModalFooter $size={size} $footerBorder={footerBorder} className={MODAL_FOOTER_CLASS}>\n <ActionBar size={size} actions={actions} alignment={actionsAlignment} direction={actionsDirection} />\n </Styled.ModalFooter>\n )}\n </Styled.Modal>\n );\n};\n\nexport default Modal;\n"],"names":["Modal","children","className","open","headerBorder","footerBorder","bgColor","padding","onClose","NOOP","header","actions","actionsDirection","Directions","actionsAlignment","Alignments","loading","loadingBody","size","Sizes","closeButton","maskClosable","contentScrollable","showHeader","showFooter","centered","width","props","isWithoutHeaderAndFooter","jsxs","Styled.Modal","Dialog","MODAL_CLASS","classNames","MODAL_CONTAINER_CLASS","Styled.ModalHeader","MODAL_HEADER_CLASS","jsx","Styled.ModalHeaderContent","InfoBar","Button","CrossIcon","Variants","Styled.ModalContent","CloseButton","ModalLoading","Styled.ModalFooter","MODAL_FOOTER_CLASS","ActionBar"],"mappings":"2iBAyBMA,EAAQ,CAAC,CACb,SAAAC,EACA,UAAAC,EACA,KAAAC,EACA,aAAAC,EAAe,GACf,aAAAC,EAAe,GACf,QAAAC,EAAU,GACV,QAAAC,EAAU,GACV,QAAAC,EAAUC,EAAAA,KACV,OAAAC,EACA,QAAAC,EACA,iBAAAC,EAAmBC,EAAAA,WAAW,WAC9B,iBAAAC,EAAmBC,EAAAA,WAAW,MAC9B,QAAAC,EAAU,GACV,YAAAC,EAAc,aACd,KAAAC,EAAOC,EAAAA,MAAM,OACb,YAAAC,EAAc,GACd,aAAAC,EAAe,GACf,kBAAAC,EAAoB,GACpB,WAAAC,EAAa,GACb,WAAAC,EAAa,GACb,SAAAC,EAAW,GACX,MAAAC,EAAQ,IACR,GAAGC,CACL,IAAiC,CAC/B,MAAMC,EAA2B,CAAClB,GAAUC,GAAWA,GAAS,OAAS,EAEzE,OACEkB,EAAAA,KAACC,EAAAA,MAAA,CACC,MAAOZ,EACP,GAAIa,EACJ,UAAWC,EAAAA,YACX,UAAWC,EAAWC,EAAAA,sBAAuBhC,CAAS,EACtD,QAASC,EACT,QAAAK,EACA,SAAUY,EACV,aAAAC,EACA,UAAWI,EACX,mBAAoBH,EACpB,MAAAI,EACC,GAAGC,EAEH,SAAA,CAAA,CAAC,CAACJ,GAAc,CAAC,CAACb,GAAU,CAACM,GAC5Ba,EAAAA,KAACM,EAAAA,YAAA,CAAmB,MAAOjB,EAAM,cAAed,EAAc,UAAWgC,EAAAA,mBACvE,SAAA,CAAAC,EAAAA,IAACC,EAAAA,mBAAA,CACC,SAAAD,EAAAA,IAACE,EAAA,CAAQ,UAAW1B,EAAAA,WAAW,SAAU,KAAAK,EAAa,GAAGR,CAAA,CAAQ,CAAA,CACnE,EACC,CAAC,CAACU,GACDiB,EAAAA,IAACG,EAAA,CACC,WAAOC,EAAA,EAAU,EACjB,SAAU,GACV,QAASC,EAAAA,SAAS,YAClB,KAAAxB,EACA,QAASV,EACT,aAAW,OAAA,CAAA,CACb,EAEJ,EAEFqB,EAAAA,KAACc,EAAAA,aAAA,CACC,MAAOzB,EACP,SAAUX,EACV,cAAeH,EACf,cAAeC,EACf,WAAY,GAAQkB,GAAcb,GAClC,WAAY,GAAQc,GAAcb,GAClC,SAAUL,EACV,mBAAoBgB,EACpB,cAAeM,GAA4BZ,EAC3C,UAAWA,EAEV,SAAA,CAAA,CAACN,GAAU,CAAC,CAACU,GAAe,CAACJ,GAC5BqB,EAAAA,IAACO,EAAAA,YAAA,CACC,WAAOH,EAAA,EAAU,EACjB,SAAU,GACV,QAASC,EAAAA,SAAS,YAClB,KAAAxB,EACA,aAAcA,EACd,QAASV,CAAA,CAAA,EAGZQ,EACCqB,EAAAA,IAACQ,EAAA,CAAa,KAAA3B,EAAY,YAAAD,EAA0B,YAAAG,EAA0B,QAAAZ,EAAkB,EAEhGP,CAAA,CAAA,CAAA,EAGH,CAAC,CAACuB,GAAc,CAAC,CAACb,GAAW,CAACK,GAC7BqB,MAACS,EAAAA,YAAA,CAAmB,MAAO5B,EAAM,cAAeb,EAAc,UAAW0C,EAAAA,mBACvE,SAAAV,MAACW,EAAA,CAAU,KAAA9B,EAAY,QAAAP,EAAkB,UAAWG,EAAkB,UAAWF,CAAA,CAAkB,CAAA,CACrG,CAAA,CAAA,CAAA,CAIR"}
1	+ {"version":3,"file":"Modal.js","sources":["../../../../src/components/Modal/Modal.tsx"],"sourcesContent":["import type { ReactElement } from 'react';\r\n\r\nimport classNames from 'classnames';\r\nimport {\r\n NOOP,\r\n Alignments,\r\n Sizes,\r\n MODAL_CONTAINER_CLASS,\r\n MODAL_CLASS,\r\n MODAL_HEADER_CLASS,\r\n MODAL_FOOTER_CLASS,\r\n Variants,\r\n Directions,\r\n} from 'acinguiux-ds-react-base/consts';\r\n\r\nimport Dialog from './components/Dialog/Dialog';\r\nimport * as Styled from './Modal.styles';\r\nimport type { IModalProps } from './Modal.types';\r\nimport ModalLoading from './components/ModalLoading/ModalLoading';\r\nimport InfoBar from '../_internalComponents/InfoBar/InfoBar';\r\nimport Button from '../Button/Button';\r\nimport CrossIcon from '../Icon/components/Cross';\r\nimport ActionBar from '../_internalComponents/ActionBar/ActionBar';\r\nimport { CloseButton } from './components/ModalLoading/ModalLoading.styles';\r\n\r\nconst Modal = ({\r\n children,\r\n className,\r\n open,\r\n headerBorder = true,\r\n footerBorder = true,\r\n bgColor = false,\r\n padding = true,\r\n onClose = NOOP,\r\n header,\r\n actions,\r\n actionsDirection = Directions.Horizontal,\r\n actionsAlignment = Alignments.Right,\r\n loading = false,\r\n loadingBody = 'Loading...',\r\n size = Sizes.Medium,\r\n closeButton = true,\r\n maskClosable = true,\r\n contentScrollable = false,\r\n showHeader = true,\r\n showFooter = true,\r\n centered = false,\r\n width = 520,\r\n ...props\r\n}: IModalProps): ReactElement => {\r\n const isWithoutHeaderAndFooter = !header && actions && actions?.length > 0;\r\n\r\n return (\r\n <Styled.Modal\r\n $size={size}\r\n as={Dialog}\r\n prefixCls={MODAL_CLASS}\r\n className={classNames(MODAL_CONTAINER_CLASS, className)}\r\n visible={open}\r\n onClose={onClose}\r\n closable={closeButton}\r\n maskClosable={maskClosable}\r\n $centered={centered}\r\n $contentScrollable={contentScrollable}\r\n width={width}\r\n {...props}\r\n >\r\n {!!showHeader && !!header && !loading && (\r\n <Styled.ModalHeader $size={size} $headerBorder={headerBorder} className={MODAL_HEADER_CLASS}>\r\n <Styled.ModalHeaderContent>\r\n <InfoBar direction={Directions.Vertical} size={size} {...header} />\r\n </Styled.ModalHeaderContent>\r\n {!!closeButton && (\r\n <Button\r\n icon={<CrossIcon />}\r\n iconOnly={true}\r\n variant={Variants.Transparent}\r\n size={size}\r\n onClick={onClose}\r\n aria-label=\"Close\"\r\n />\r\n )}\r\n </Styled.ModalHeader>\r\n )}\r\n <Styled.ModalContent\r\n $size={size}\r\n $padding={padding}\r\n $headerBorder={headerBorder}\r\n $footerBorder={footerBorder}\r\n $hasHeader={Boolean(showHeader && header)}\r\n $hasFooter={Boolean(showFooter && actions)}\r\n $bgColor={bgColor}\r\n $contentScrollable={contentScrollable}\r\n $bodyCentered={isWithoutHeaderAndFooter \|\| loading}\r\n $onlyBody={loading}\r\n >\r\n {!header && !!closeButton && !loading && (\r\n <CloseButton\r\n icon={<CrossIcon />}\r\n iconOnly={true}\r\n variant={Variants.Transparent}\r\n size={size}\r\n $paddingSize={size}\r\n onClick={onClose}\r\n />\r\n )}\r\n {loading ? (\r\n <ModalLoading size={size} loadingBody={loadingBody} closeButton={closeButton} onClose={onClose} />\r\n ) : (\r\n children\r\n )}\r\n </Styled.ModalContent>\r\n {!!showFooter && !!actions && !loading && (\r\n <Styled.ModalFooter $size={size} $footerBorder={footerBorder} className={MODAL_FOOTER_CLASS}>\r\n <ActionBar size={size} actions={actions} alignment={actionsAlignment} direction={actionsDirection} />\r\n </Styled.ModalFooter>\r\n )}\r\n </Styled.Modal>\r\n );\r\n};\r\n\r\nexport default Modal;\r\n"],"names":["Modal","children","className","open","headerBorder","footerBorder","bgColor","padding","onClose","NOOP","header","actions","actionsDirection","Directions","actionsAlignment","Alignments","loading","loadingBody","size","Sizes","closeButton","maskClosable","contentScrollable","showHeader","showFooter","centered","width","props","isWithoutHeaderAndFooter","jsxs","Styled.Modal","Dialog","MODAL_CLASS","classNames","MODAL_CONTAINER_CLASS","Styled.ModalHeader","MODAL_HEADER_CLASS","jsx","Styled.ModalHeaderContent","InfoBar","Button","CrossIcon","Variants","Styled.ModalContent","CloseButton","ModalLoading","Styled.ModalFooter","MODAL_FOOTER_CLASS","ActionBar"],"mappings":"2iBAyBMA,EAAQ,CAAC,CACb,SAAAC,EACA,UAAAC,EACA,KAAAC,EACA,aAAAC,EAAe,GACf,aAAAC,EAAe,GACf,QAAAC,EAAU,GACV,QAAAC,EAAU,GACV,QAAAC,EAAUC,EAAAA,KACV,OAAAC,EACA,QAAAC,EACA,iBAAAC,EAAmBC,EAAAA,WAAW,WAC9B,iBAAAC,EAAmBC,EAAAA,WAAW,MAC9B,QAAAC,EAAU,GACV,YAAAC,EAAc,aACd,KAAAC,EAAOC,EAAAA,MAAM,OACb,YAAAC,EAAc,GACd,aAAAC,EAAe,GACf,kBAAAC,EAAoB,GACpB,WAAAC,EAAa,GACb,WAAAC,EAAa,GACb,SAAAC,EAAW,GACX,MAAAC,EAAQ,IACR,GAAGC,CACL,IAAiC,CAC/B,MAAMC,EAA2B,CAAClB,GAAUC,GAAWA,GAAS,OAAS,EAEzE,OACEkB,EAAAA,KAACC,EAAAA,MAAA,CACC,MAAOZ,EACP,GAAIa,EACJ,UAAWC,EAAAA,YACX,UAAWC,EAAWC,EAAAA,sBAAuBhC,CAAS,EACtD,QAASC,EACT,QAAAK,EACA,SAAUY,EACV,aAAAC,EACA,UAAWI,EACX,mBAAoBH,EACpB,MAAAI,EACC,GAAGC,EAEH,SAAA,CAAA,CAAC,CAACJ,GAAc,CAAC,CAACb,GAAU,CAACM,GAC5Ba,EAAAA,KAACM,EAAAA,YAAA,CAAmB,MAAOjB,EAAM,cAAed,EAAc,UAAWgC,EAAAA,mBACvE,SAAA,CAAAC,EAAAA,IAACC,EAAAA,mBAAA,CACC,SAAAD,EAAAA,IAACE,EAAA,CAAQ,UAAW1B,EAAAA,WAAW,SAAU,KAAAK,EAAa,GAAGR,CAAA,CAAQ,CAAA,CACnE,EACC,CAAC,CAACU,GACDiB,EAAAA,IAACG,EAAA,CACC,WAAOC,EAAA,EAAU,EACjB,SAAU,GACV,QAASC,EAAAA,SAAS,YAClB,KAAAxB,EACA,QAASV,EACT,aAAW,OAAA,CAAA,CACb,EAEJ,EAEFqB,EAAAA,KAACc,EAAAA,aAAA,CACC,MAAOzB,EACP,SAAUX,EACV,cAAeH,EACf,cAAeC,EACf,WAAY,GAAQkB,GAAcb,GAClC,WAAY,GAAQc,GAAcb,GAClC,SAAUL,EACV,mBAAoBgB,EACpB,cAAeM,GAA4BZ,EAC3C,UAAWA,EAEV,SAAA,CAAA,CAACN,GAAU,CAAC,CAACU,GAAe,CAACJ,GAC5BqB,EAAAA,IAACO,EAAAA,YAAA,CACC,WAAOH,EAAA,EAAU,EACjB,SAAU,GACV,QAASC,EAAAA,SAAS,YAClB,KAAAxB,EACA,aAAcA,EACd,QAASV,CAAA,CAAA,EAGZQ,EACCqB,EAAAA,IAACQ,EAAA,CAAa,KAAA3B,EAAY,YAAAD,EAA0B,YAAAG,EAA0B,QAAAZ,EAAkB,EAEhGP,CAAA,CAAA,CAAA,EAGH,CAAC,CAACuB,GAAc,CAAC,CAACb,GAAW,CAACK,GAC7BqB,MAACS,EAAAA,YAAA,CAAmB,MAAO5B,EAAM,cAAeb,EAAc,UAAW0C,EAAAA,mBACvE,SAAAV,MAACW,EAAA,CAAU,KAAA9B,EAAY,QAAAP,EAAkB,UAAWG,EAAkB,UAAWF,CAAA,CAAkB,CAAA,CACrG,CAAA,CAAA,CAAA,CAIR"}

package/build/cjs/components/Modal/Modal.styles.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Modal.styles.js","sources":["../../../../src/components/Modal/Modal.styles.ts"],"sourcesContent":["import { styled, css } from 'styled-components';\nimport { ZIndexes } from 'acinguiux-ds-react-base/consts';\nimport type { PickTransient } from 'acinguiux-ds-react-base/types';\nimport { ModalConsts } from 'acinguiux-ds-react-base/components/Modal';\nimport { Variables } from 'acinguiux-ds-react-base/theme';\n\nimport type { IModalProps } from './Modal.types';\nimport { commonAnimation, fadeIn, fadeOut, zoomIn, zoomOut } from './utils/styleUtils';\nimport { IDialogProps } from './components/Dialog/Dialog';\n\ntype ModalProps = Required<PickTransient<IModalProps, 'size' \| 'centered' \| 'contentScrollable'>>;\n\nconst Modal = styled.div<ModalProps & IDialogProps>(({ prefixCls, $size, theme, $centered, $contentScrollable }) => {\n const layer = theme.layer({ foundation: 'raised' });\n\n return css`\n .${prefixCls} {\n position: relative;\n margin: ${$centered ? 0 : '10vh auto'};\n color: ${layer[Variables.TextOnFoundationStrong]};\n\n &-wrap {\n position: fixed;\n overflow: auto;\n inset: 0;\n z-index: ${ZIndexes.MODAL};\n -webkit-overflow-scrolling: touch;\n outline: 0;\n\n ${$centered &&\n css`\n display: flex;\n align-items: center;\n justify-content: center;\n `}\n }\n\n &-mask {\n position: fixed;\n inset: 0;\n background-color: ${theme.globals('others').mask};\n height: 100%;\n z-index: ${ZIndexes.MODAL};\n }\n\n &-mask-hidden {\n display: none;\n }\n\n &-content {\n position: relative;\n display: flex;\n flex-direction: column;\n align-items: stretch;\n justify-content: stretch;\n border-radius: ${ModalConsts.consts[$size].borderRadius};\n background-color: ${layer[Variables.BackgroundFoundation]};\n background-clip: padding-box;\n filter: ${theme.dropShadows.high1};\n }\n\n &-title {\n display: flex;\n }\n\n &-body {\n display: flex;\n flex-direction: column;\n flex: 1 1 auto;\n max-height: 80vh;\n ${!$contentScrollable &&\n css`\n max-height: 100vh;\n min-height: fit-content;\n `};\n\n > div:first-child {\n border-top-left-radius: ${ModalConsts.consts[$size].borderRadius};\n border-top-right-radius: ${ModalConsts.consts[$size].borderRadius};\n }\n\n > div:last-child {\n border-bottom-left-radius: ${ModalConsts.consts[$size].borderRadius};\n border-bottom-right-radius: ${ModalConsts.consts[$size].borderRadius};\n }\n }\n\n &-close {\n display: none;\n }\n\n /* Animations */\n &-zoom-enter,\n &-zoom-appear {\n opacity: 0;\n ${css(commonAnimation)};\n animation-timing-function: cubic-bezier(0.08, 0.82, 0.17, 1);\n }\n\n &-zoom-leave {\n ${css(commonAnimation)};\n animation-timing-function: cubic-bezier(0.6, 0.04, 0.98, 0.34);\n }\n\n &-zoom-enter.${prefixCls}-zoom-enter-active, &-zoom-appear.${prefixCls}-zoom-appear-active {\n animation-name: ${zoomIn};\n animation-play-state: running;\n }\n\n &-zoom-leave.${prefixCls}-zoom-leave-active {\n animation-name: ${zoomOut};\n animation-play-state: running;\n }\n\n &-fade-enter,\n &-fade-appear {\n opacity: 0;\n ${css(commonAnimation)};\n animation-timing-function: cubic-bezier(0.55, 0, 0.55, 0.2);\n }\n\n &-fade-leave {\n ${css(commonAnimation)};\n animation-timing-function: cubic-bezier(0.55, 0, 0.55, 0.2);\n }\n\n &-fade-enter.${prefixCls}-fade-enter-active, &-fade-appear.${prefixCls}-fade-appear-active {\n animation-name: ${fadeIn};\n animation-play-state: running;\n }\n\n &-fade-leave.${prefixCls}-fade-leave-active {\n animation-name: ${fadeOut};\n animation-play-state: running;\n }\n }\n `;\n});\n\ntype ModalContentPropKeys = 'size' \| 'padding' \| 'bgColor' \| 'contentScrollable' \| 'headerBorder' \| 'footerBorder';\nconst ModalContent = styled.div<\n Required<PickTransient<IModalProps, ModalContentPropKeys>> & {\n $bodyCentered: boolean;\n $onlyBody: boolean;\n $hasFooter: boolean;\n $hasHeader: boolean;\n }\n>`\n ${({\n $size,\n $padding,\n $bgColor,\n $contentScrollable,\n $bodyCentered,\n $onlyBody,\n $hasHeader,\n $hasFooter,\n $headerBorder,\n $footerBorder,\n theme,\n }) => {\n const layer = theme.layer({ foundation: $bgColor ? 'base' : 'raised' });\n\n return css`\n display: flex;\n flex-direction: column;\n background-color: ${layer[Variables.BackgroundFoundation]};\n flex-grow: 1;\n\n ${$contentScrollable &&\n css`\n overflow-y: auto;\n `}\n\n ${$padding &&\n css`\n padding-inline: ${ModalConsts.consts[$size].padding};\n `}\n\n ${(($hasHeader && ($headerBorder \|\| $bgColor)) \|\| !$hasHeader) &&\n css`\n padding-block-start: ${ModalConsts.consts[$size].padding};\n `}\n\n ${(($hasFooter && ($footerBorder \|\| $bgColor)) \|\| !$hasFooter) &&\n css`\n padding-block-end: ${ModalConsts.consts[$size].padding};\n `}\n\n ${$bodyCentered &&\n css`\n align-items: center;\n justify-content: center;\n `}\n\n ${$onlyBody &&\n css`\n display: flex;\n align-items: center;\n justify-content: center;\n flex: 1 1 auto;\n `}\n `;\n }}\n`;\n\nconst ModalBar = styled.div<Required<PickTransient<IModalProps, 'size'>>>`\n ${({ $size, theme }) => css`\n z-index: ${ZIndexes.MODAL};\n display: flex;\n align-items: center;\n min-height: auto;\n padding: ${ModalConsts.consts[$size].padding};\n background: ${theme.layer({ foundation: 'raised' })[Variables.BackgroundFoundation]};\n `}\n`;\n\nconst ModalHeaderContent = styled.div`\n flex: 1 0 0;\n`;\n\nconst ModalHeader = styled(ModalBar)<Required<PickTransient<IModalProps, 'headerBorder'>>>`\n ${({ $headerBorder, theme }) => css`\n gap: 12px;\n align-items: flex-start;\n\n ${$headerBorder &&\n css`\n border-bottom: 1px solid ${theme.layer({ foundation: 'raised' })[Variables.BorderOnFoundationSubtle]};\n `}\n `}\n`;\n\nconst ModalFooter = styled(ModalBar)<Required<PickTransient<IModalProps, 'footerBorder'>>>`\n ${({ $footerBorder, theme }) => css`\n width: 100%;\n\n ${$footerBorder &&\n css`\n border-top: 1px solid ${theme.layer({ foundation: 'raised' })[Variables.BorderOnFoundationSubtle]};\n `}\n `}\n`;\n\nexport { Modal, ModalContent, ModalHeaderContent, ModalHeader, ModalFooter };\n"],"names":["Modal","styled","prefixCls","$size","theme","$centered","$contentScrollable","layer","css","Variables","ZIndexes","ModalConsts.consts","commonAnimation","zoomIn","zoomOut","fadeIn","fadeOut","ModalContent","$padding","$bgColor","$bodyCentered","$onlyBody","$hasHeader","$hasFooter","$headerBorder","$footerBorder","ModalBar","ModalHeaderContent","ModalHeader","ModalFooter"],"mappings":"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"}
1	+ {"version":3,"file":"Modal.styles.js","sources":["../../../../src/components/Modal/Modal.styles.ts"],"sourcesContent":["import { styled, css } from 'styled-components';\r\nimport { ZIndexes } from 'acinguiux-ds-react-base/consts';\r\nimport type { PickTransient } from 'acinguiux-ds-react-base/types';\r\nimport { ModalConsts } from 'acinguiux-ds-react-base/components/Modal';\r\nimport { Variables } from 'acinguiux-ds-react-base/theme';\r\n\r\nimport type { IModalProps } from './Modal.types';\r\nimport { commonAnimation, fadeIn, fadeOut, zoomIn, zoomOut } from './utils/styleUtils';\r\nimport { IDialogProps } from './components/Dialog/Dialog';\r\n\r\ntype ModalProps = Required<PickTransient<IModalProps, 'size' \| 'centered' \| 'contentScrollable'>>;\r\n\r\nconst Modal = styled.div<ModalProps & IDialogProps>(({ prefixCls, $size, theme, $centered, $contentScrollable }) => {\r\n const layer = theme.layer({ foundation: 'raised' });\r\n\r\n return css`\r\n .${prefixCls} {\r\n position: relative;\r\n margin: ${$centered ? 0 : '10vh auto'};\r\n color: ${layer[Variables.TextOnFoundationStrong]};\r\n\r\n &-wrap {\r\n position: fixed;\r\n overflow: auto;\r\n inset: 0;\r\n z-index: ${ZIndexes.MODAL};\r\n -webkit-overflow-scrolling: touch;\r\n outline: 0;\r\n\r\n ${$centered &&\r\n css`\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n `}\r\n }\r\n\r\n &-mask {\r\n position: fixed;\r\n inset: 0;\r\n background-color: ${theme.globals('others').mask};\r\n height: 100%;\r\n z-index: ${ZIndexes.MODAL};\r\n }\r\n\r\n &-mask-hidden {\r\n display: none;\r\n }\r\n\r\n &-content {\r\n position: relative;\r\n display: flex;\r\n flex-direction: column;\r\n align-items: stretch;\r\n justify-content: stretch;\r\n border-radius: ${ModalConsts.consts[$size].borderRadius};\r\n background-color: ${layer[Variables.BackgroundFoundation]};\r\n background-clip: padding-box;\r\n filter: ${theme.dropShadows.high1};\r\n }\r\n\r\n &-title {\r\n display: flex;\r\n }\r\n\r\n &-body {\r\n display: flex;\r\n flex-direction: column;\r\n flex: 1 1 auto;\r\n max-height: 80vh;\r\n ${!$contentScrollable &&\r\n css`\r\n max-height: 100vh;\r\n min-height: fit-content;\r\n `};\r\n\r\n > div:first-child {\r\n border-top-left-radius: ${ModalConsts.consts[$size].borderRadius};\r\n border-top-right-radius: ${ModalConsts.consts[$size].borderRadius};\r\n }\r\n\r\n > div:last-child {\r\n border-bottom-left-radius: ${ModalConsts.consts[$size].borderRadius};\r\n border-bottom-right-radius: ${ModalConsts.consts[$size].borderRadius};\r\n }\r\n }\r\n\r\n &-close {\r\n display: none;\r\n }\r\n\r\n /* Animations */\r\n &-zoom-enter,\r\n &-zoom-appear {\r\n opacity: 0;\r\n ${css(commonAnimation)};\r\n animation-timing-function: cubic-bezier(0.08, 0.82, 0.17, 1);\r\n }\r\n\r\n &-zoom-leave {\r\n ${css(commonAnimation)};\r\n animation-timing-function: cubic-bezier(0.6, 0.04, 0.98, 0.34);\r\n }\r\n\r\n &-zoom-enter.${prefixCls}-zoom-enter-active, &-zoom-appear.${prefixCls}-zoom-appear-active {\r\n animation-name: ${zoomIn};\r\n animation-play-state: running;\r\n }\r\n\r\n &-zoom-leave.${prefixCls}-zoom-leave-active {\r\n animation-name: ${zoomOut};\r\n animation-play-state: running;\r\n }\r\n\r\n &-fade-enter,\r\n &-fade-appear {\r\n opacity: 0;\r\n ${css(commonAnimation)};\r\n animation-timing-function: cubic-bezier(0.55, 0, 0.55, 0.2);\r\n }\r\n\r\n &-fade-leave {\r\n ${css(commonAnimation)};\r\n animation-timing-function: cubic-bezier(0.55, 0, 0.55, 0.2);\r\n }\r\n\r\n &-fade-enter.${prefixCls}-fade-enter-active, &-fade-appear.${prefixCls}-fade-appear-active {\r\n animation-name: ${fadeIn};\r\n animation-play-state: running;\r\n }\r\n\r\n &-fade-leave.${prefixCls}-fade-leave-active {\r\n animation-name: ${fadeOut};\r\n animation-play-state: running;\r\n }\r\n }\r\n `;\r\n});\r\n\r\ntype ModalContentPropKeys = 'size' \| 'padding' \| 'bgColor' \| 'contentScrollable' \| 'headerBorder' \| 'footerBorder';\r\nconst ModalContent = styled.div<\r\n Required<PickTransient<IModalProps, ModalContentPropKeys>> & {\r\n $bodyCentered: boolean;\r\n $onlyBody: boolean;\r\n $hasFooter: boolean;\r\n $hasHeader: boolean;\r\n }\r\n>`\r\n ${({\r\n $size,\r\n $padding,\r\n $bgColor,\r\n $contentScrollable,\r\n $bodyCentered,\r\n $onlyBody,\r\n $hasHeader,\r\n $hasFooter,\r\n $headerBorder,\r\n $footerBorder,\r\n theme,\r\n }) => {\r\n const layer = theme.layer({ foundation: $bgColor ? 'base' : 'raised' });\r\n\r\n return css`\r\n display: flex;\r\n flex-direction: column;\r\n background-color: ${layer[Variables.BackgroundFoundation]};\r\n flex-grow: 1;\r\n\r\n ${$contentScrollable &&\r\n css`\r\n overflow-y: auto;\r\n `}\r\n\r\n ${$padding &&\r\n css`\r\n padding-inline: ${ModalConsts.consts[$size].padding};\r\n `}\r\n\r\n ${(($hasHeader && ($headerBorder \|\| $bgColor)) \|\| !$hasHeader) &&\r\n css`\r\n padding-block-start: ${ModalConsts.consts[$size].padding};\r\n `}\r\n\r\n ${(($hasFooter && ($footerBorder \|\| $bgColor)) \|\| !$hasFooter) &&\r\n css`\r\n padding-block-end: ${ModalConsts.consts[$size].padding};\r\n `}\r\n\r\n ${$bodyCentered &&\r\n css`\r\n align-items: center;\r\n justify-content: center;\r\n `}\r\n\r\n ${$onlyBody &&\r\n css`\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n flex: 1 1 auto;\r\n `}\r\n `;\r\n }}\r\n`;\r\n\r\nconst ModalBar = styled.div<Required<PickTransient<IModalProps, 'size'>>>`\r\n ${({ $size, theme }) => css`\r\n z-index: ${ZIndexes.MODAL};\r\n display: flex;\r\n align-items: center;\r\n min-height: auto;\r\n padding: ${ModalConsts.consts[$size].padding};\r\n background: ${theme.layer({ foundation: 'raised' })[Variables.BackgroundFoundation]};\r\n `}\r\n`;\r\n\r\nconst ModalHeaderContent = styled.div`\r\n flex: 1 0 0;\r\n`;\r\n\r\nconst ModalHeader = styled(ModalBar)<Required<PickTransient<IModalProps, 'headerBorder'>>>`\r\n ${({ $headerBorder, theme }) => css`\r\n gap: 12px;\r\n align-items: flex-start;\r\n\r\n ${$headerBorder &&\r\n css`\r\n border-bottom: 1px solid ${theme.layer({ foundation: 'raised' })[Variables.BorderOnFoundationSubtle]};\r\n `}\r\n `}\r\n`;\r\n\r\nconst ModalFooter = styled(ModalBar)<Required<PickTransient<IModalProps, 'footerBorder'>>>`\r\n ${({ $footerBorder, theme }) => css`\r\n width: 100%;\r\n\r\n ${$footerBorder &&\r\n css`\r\n border-top: 1px solid ${theme.layer({ foundation: 'raised' })[Variables.BorderOnFoundationSubtle]};\r\n `}\r\n `}\r\n`;\r\n\r\nexport { Modal, ModalContent, ModalHeaderContent, ModalHeader, ModalFooter };\r\n"],"names":["Modal","styled","prefixCls","$size","theme","$centered","$contentScrollable","layer","css","Variables","ZIndexes","ModalConsts.consts","commonAnimation","zoomIn","zoomOut","fadeIn","fadeOut","ModalContent","$padding","$bgColor","$bodyCentered","$onlyBody","$hasHeader","$hasFooter","$headerBorder","$footerBorder","ModalBar","ModalHeaderContent","ModalHeader","ModalFooter"],"mappings":"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"}

package/build/cjs/components/Modal/components/Dialog/Dialog.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Dialog.js","sources":["../../../../../../src/components/Modal/components/Dialog/Dialog.tsx"],"sourcesContent":["import RCDialog, { type DialogProps } from 'rc-dialog';\n\nexport interface IDialogProps extends DialogProps {\n className?: string;\n}\n\nconst getContainer = (prefixCls: string \| undefined, className: string): HTMLElement => {\n const portal = document.getElementById(`${prefixCls}-portal`);\n\n if (portal) {\n portal.className = `${prefixCls} ${className}`;\n\n return portal;\n }\n\n const newPortal = document.createElement('div');\n newPortal.className = `${prefixCls} ${className}`;\n newPortal.id = `${prefixCls}-portal`;\n document.body.append(newPortal);\n\n return newPortal;\n};\n\nconst Dialog = ({ className = '', prefixCls, children, visible, ...props }: IDialogProps) => (\n <RCDialog\n prefixCls={prefixCls}\n className={className}\n visible={visible}\n getContainer={() => getContainer(prefixCls, className)}\n animation=\"zoom\"\n maskAnimation=\"fade\"\n {...props}\n >\n {children}\n </RCDialog>\n);\n\nexport default Dialog;\n"],"names":["getContainer","prefixCls","className","portal","newPortal","Dialog","children","visible","props","jsx","RCDialog"],"mappings":"yEAMMA,EAAe,CAACC,EAA+BC,IAAmC,CACtF,MAAMC,EAAS,SAAS,eAAe,GAAGF,CAAS,SAAS,EAE5D,GAAIE,EACF,OAAAA,EAAO,UAAY,GAAGF,CAAS,IAAIC,CAAS,GAErCC,EAGT,MAAMC,EAAY,SAAS,cAAc,KAAK,EAC9C,OAAAA,EAAU,UAAY,GAAGH,CAAS,IAAIC,CAAS,GAC/CE,EAAU,GAAK,GAAGH,CAAS,UAC3B,SAAS,KAAK,OAAOG,CAAS,EAEvBA,CACT,EAEMC,EAAS,CAAC,CAAE,UAAAH,EAAY,GAAI,UAAAD,EAAW,SAAAK,EAAU,QAAAC,EAAS,GAAGC,CAAA,IACjEC,EAAAA,IAACC,EAAA,CACC,UAAAT,EACA,UAAAC,EACA,QAAAK,EACA,aAAc,IAAMP,EAAaC,EAAWC,CAAS,EACrD,UAAU,OACV,cAAc,OACb,GAAGM,EAEH,SAAAF,CAAA,CACH"}
1	+ {"version":3,"file":"Dialog.js","sources":["../../../../../../src/components/Modal/components/Dialog/Dialog.tsx"],"sourcesContent":["import RCDialog, { type DialogProps } from 'rc-dialog';\r\n\r\nexport interface IDialogProps extends DialogProps {\r\n className?: string;\r\n}\r\n\r\nconst getContainer = (prefixCls: string \| undefined, className: string): HTMLElement => {\r\n const portal = document.getElementById(`${prefixCls}-portal`);\r\n\r\n if (portal) {\r\n portal.className = `${prefixCls} ${className}`;\r\n\r\n return portal;\r\n }\r\n\r\n const newPortal = document.createElement('div');\r\n newPortal.className = `${prefixCls} ${className}`;\r\n newPortal.id = `${prefixCls}-portal`;\r\n document.body.append(newPortal);\r\n\r\n return newPortal;\r\n};\r\n\r\nconst Dialog = ({ className = '', prefixCls, children, visible, ...props }: IDialogProps) => (\r\n <RCDialog\r\n prefixCls={prefixCls}\r\n className={className}\r\n visible={visible}\r\n getContainer={() => getContainer(prefixCls, className)}\r\n animation=\"zoom\"\r\n maskAnimation=\"fade\"\r\n {...props}\r\n >\r\n {children}\r\n </RCDialog>\r\n);\r\n\r\nexport default Dialog;\r\n"],"names":["getContainer","prefixCls","className","portal","newPortal","Dialog","children","visible","props","jsx","RCDialog"],"mappings":"yEAMMA,EAAe,CAACC,EAA+BC,IAAmC,CACtF,MAAMC,EAAS,SAAS,eAAe,GAAGF,CAAS,SAAS,EAE5D,GAAIE,EACF,OAAAA,EAAO,UAAY,GAAGF,CAAS,IAAIC,CAAS,GAErCC,EAGT,MAAMC,EAAY,SAAS,cAAc,KAAK,EAC9C,OAAAA,EAAU,UAAY,GAAGH,CAAS,IAAIC,CAAS,GAC/CE,EAAU,GAAK,GAAGH,CAAS,UAC3B,SAAS,KAAK,OAAOG,CAAS,EAEvBA,CACT,EAEMC,EAAS,CAAC,CAAE,UAAAH,EAAY,GAAI,UAAAD,EAAW,SAAAK,EAAU,QAAAC,EAAS,GAAGC,CAAA,IACjEC,EAAAA,IAACC,EAAA,CACC,UAAAT,EACA,UAAAC,EACA,QAAAK,EACA,aAAc,IAAMP,EAAaC,EAAWC,CAAS,EACrD,UAAU,OACV,cAAc,OACb,GAAGM,EAEH,SAAAF,CAAA,CACH"}

package/build/cjs/components/Modal/components/ModalLoading/ModalLoading.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ModalLoading.js","sources":["../../../../../../src/components/Modal/components/ModalLoading/ModalLoading.tsx"],"sourcesContent":["import { Sizes, Variants } from 'acinguiux-ds-react-base/consts';\n\nimport Flexbox from '../../../Flexbox/Flexbox';\nimport Label from '../../../Text/components/Label/Label';\nimport Loading from '../../../Loading/Loading';\nimport { CloseButton } from './ModalLoading.styles';\nimport type { IModalLoadingProps } from './ModalLoading.types';\nimport CrossIcon from '../../../Icon/components/Cross';\n\nconst ModalLoading = ({ loadingBody, size = Sizes.Medium, closeButton, onClose }: IModalLoadingProps) => (\n <Flexbox flexDirection=\"column\" gap=\"12px\" alignItems=\"center\">\n {!!closeButton && (\n <CloseButton\n icon={<CrossIcon />}\n iconOnly={true}\n variant={Variants.Transparent}\n size={size}\n $paddingSize={size}\n onClick={onClose}\n aria-label=\"Close\"\n />\n )}\n <Loading size={size} />\n {typeof loadingBody === 'string' ? <Label size={size}>{loadingBody}</Label> : loadingBody}\n </Flexbox>\n);\n\nexport default ModalLoading;\n"],"names":["ModalLoading","loadingBody","size","Sizes","closeButton","onClose","Flexbox","jsx","CloseButton","CrossIcon","Variants","Loading","Label"],"mappings":"sUASMA,EAAe,CAAC,CAAE,YAAAC,EAAa,KAAAC,EAAOC,EAAAA,MAAM,OAAQ,YAAAC,EAAa,QAAAC,CAAA,WACpEC,EAAA,CAAQ,cAAc,SAAS,IAAI,OAAO,WAAW,SACnD,SAAA,CAAA,CAAC,CAACF,GACDG,EAAAA,IAACC,EAAAA,YAAA,CACC,WAAOC,EAAA,EAAU,EACjB,SAAU,GACV,QAASC,EAAAA,SAAS,YAClB,KAAAR,EACA,aAAcA,EACd,QAASG,EACT,aAAW,OAAA,CAAA,EAGfE,MAACI,GAAQ,KAAAT,EAAY,EACpB,OAAOD,GAAgB,eAAYW,EAAA,CAAM,KAAAV,EAAa,WAAY,EAAWD,CAAA,CAAA,CAChF"}
1	+ {"version":3,"file":"ModalLoading.js","sources":["../../../../../../src/components/Modal/components/ModalLoading/ModalLoading.tsx"],"sourcesContent":["import { Sizes, Variants } from 'acinguiux-ds-react-base/consts';\r\n\r\nimport Flexbox from '../../../Flexbox/Flexbox';\r\nimport Label from '../../../Text/components/Label/Label';\r\nimport Loading from '../../../Loading/Loading';\r\nimport { CloseButton } from './ModalLoading.styles';\r\nimport type { IModalLoadingProps } from './ModalLoading.types';\r\nimport CrossIcon from '../../../Icon/components/Cross';\r\n\r\nconst ModalLoading = ({ loadingBody, size = Sizes.Medium, closeButton, onClose }: IModalLoadingProps) => (\r\n <Flexbox flexDirection=\"column\" gap=\"12px\" alignItems=\"center\">\r\n {!!closeButton && (\r\n <CloseButton\r\n icon={<CrossIcon />}\r\n iconOnly={true}\r\n variant={Variants.Transparent}\r\n size={size}\r\n $paddingSize={size}\r\n onClick={onClose}\r\n aria-label=\"Close\"\r\n />\r\n )}\r\n <Loading size={size} />\r\n {typeof loadingBody === 'string' ? <Label size={size}>{loadingBody}</Label> : loadingBody}\r\n </Flexbox>\r\n);\r\n\r\nexport default ModalLoading;\r\n"],"names":["ModalLoading","loadingBody","size","Sizes","closeButton","onClose","Flexbox","jsx","CloseButton","CrossIcon","Variants","Loading","Label"],"mappings":"sUASMA,EAAe,CAAC,CAAE,YAAAC,EAAa,KAAAC,EAAOC,EAAAA,MAAM,OAAQ,YAAAC,EAAa,QAAAC,CAAA,WACpEC,EAAA,CAAQ,cAAc,SAAS,IAAI,OAAO,WAAW,SACnD,SAAA,CAAA,CAAC,CAACF,GACDG,EAAAA,IAACC,EAAAA,YAAA,CACC,WAAOC,EAAA,EAAU,EACjB,SAAU,GACV,QAASC,EAAAA,SAAS,YAClB,KAAAR,EACA,aAAcA,EACd,QAASG,EACT,aAAW,OAAA,CAAA,EAGfE,MAACI,GAAQ,KAAAT,EAAY,EACpB,OAAOD,GAAgB,eAAYW,EAAA,CAAM,KAAAV,EAAa,WAAY,EAAWD,CAAA,CAAA,CAChF"}

package/build/cjs/components/Modal/components/ModalLoading/ModalLoading.styles.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ModalLoading.styles.js","sources":["../../../../../../src/components/Modal/components/ModalLoading/ModalLoading.styles.ts"],"sourcesContent":["import { ModalConsts, type ModalTypes } from 'acinguiux-ds-react-base/components/Modal';\nimport { styled, css } from 'styled-components';\n\nimport Button from '../../../Button/Button';\n\nconst CloseButton = styled(Button)<{ $paddingSize: ModalTypes.Size }>`\n ${({ $paddingSize }) => css`\n position: absolute;\n top: ${ModalConsts.consts[$paddingSize].padding};\n right: ${ModalConsts.consts[$paddingSize].padding};\n `}\n`;\n\nexport { CloseButton };\n"],"names":["CloseButton","styled","Button","$paddingSize","css","ModalConsts.consts"],"mappings":"iQAKMA,EAAcC,EAAAA,OAAOC,CAAM;AAAA,IAC7B,CAAC,CAAE,aAAAC,CAAA,IAAmBC,EAAAA;AAAAA;AAAAA,WAEfC,EAAAA,OAAmBF,CAAY,EAAE,OAAO;AAAA,aACtCE,EAAAA,OAAmBF,CAAY,EAAE,OAAO;AAAA,GAClD;AAAA"}
1	+ {"version":3,"file":"ModalLoading.styles.js","sources":["../../../../../../src/components/Modal/components/ModalLoading/ModalLoading.styles.ts"],"sourcesContent":["import { ModalConsts, type ModalTypes } from 'acinguiux-ds-react-base/components/Modal';\r\nimport { styled, css } from 'styled-components';\r\n\r\nimport Button from '../../../Button/Button';\r\n\r\nconst CloseButton = styled(Button)<{ $paddingSize: ModalTypes.Size }>`\r\n ${({ $paddingSize }) => css`\r\n position: absolute;\r\n top: ${ModalConsts.consts[$paddingSize].padding};\r\n right: ${ModalConsts.consts[$paddingSize].padding};\r\n `}\r\n`;\r\n\r\nexport { CloseButton };\r\n"],"names":["CloseButton","styled","Button","$paddingSize","css","ModalConsts.consts"],"mappings":"iQAKMA,EAAcC,EAAAA,OAAOC,CAAM;AAAA,IAC7B,CAAC,CAAE,aAAAC,CAAA,IAAmBC,EAAAA;AAAAA;AAAAA,WAEfC,EAAAA,OAAmBF,CAAY,EAAE,OAAO;AAAA,aACtCE,EAAAA,OAAmBF,CAAY,EAAE,OAAO;AAAA,GAClD;AAAA"}

package/build/cjs/components/Modal/utils/styleUtils.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"styleUtils.js","sources":["../../../../../src/components/Modal/utils/styleUtils.ts"],"sourcesContent":["import { keyframes } from 'styled-components';\n\nexport const zoomIn = keyframes`\n 0% {\n opacity: 0;\n transform: scale(0, 0);\n }\n\n 100% {\n opacity: 1;\n transform: scale(1, 1);\n }\n`;\n\nexport const zoomOut = keyframes`\n 0% {\n transform: scale(1, 1);\n }\n\n 100% {\n opacity: 0;\n transform: scale(0, 0);\n }\n`;\n\nexport const fadeIn = keyframes`\n 0% {\n opacity: 0;\n }\n\n 100% {\n opacity: 1;\n }\n`;\n\nexport const fadeOut = keyframes`\n 0% {\n opacity: 1;\n }\n\n 100% {\n opacity: 0;\n }\n`;\n\nexport const commonAnimation = {\n animationDuration: '0.3s',\n animationFillMode: 'both',\n animationPlayState: 'paused',\n};\n"],"names":["zoomIn","keyframes","zoomOut","fadeIn","fadeOut","commonAnimation"],"mappings":"iJAEaA,EAASC,EAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA,EAYTC,EAAUD,EAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA,EAWVE,EAASF,EAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA,EAUTG,EAAUH,EAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA,EAUVI,EAAkB,CAC7B,kBAAmB,OACnB,kBAAmB,OACnB,mBAAoB,QACtB"}
1	+ {"version":3,"file":"styleUtils.js","sources":["../../../../../src/components/Modal/utils/styleUtils.ts"],"sourcesContent":["import { keyframes } from 'styled-components';\r\n\r\nexport const zoomIn = keyframes`\r\n 0% {\r\n opacity: 0;\r\n transform: scale(0, 0);\r\n }\r\n\r\n 100% {\r\n opacity: 1;\r\n transform: scale(1, 1);\r\n }\r\n`;\r\n\r\nexport const zoomOut = keyframes`\r\n 0% {\r\n transform: scale(1, 1);\r\n }\r\n\r\n 100% {\r\n opacity: 0;\r\n transform: scale(0, 0);\r\n }\r\n`;\r\n\r\nexport const fadeIn = keyframes`\r\n 0% {\r\n opacity: 0;\r\n }\r\n\r\n 100% {\r\n opacity: 1;\r\n }\r\n`;\r\n\r\nexport const fadeOut = keyframes`\r\n 0% {\r\n opacity: 1;\r\n }\r\n\r\n 100% {\r\n opacity: 0;\r\n }\r\n`;\r\n\r\nexport const commonAnimation = {\r\n animationDuration: '0.3s',\r\n animationFillMode: 'both',\r\n animationPlayState: 'paused',\r\n};\r\n"],"names":["zoomIn","keyframes","zoomOut","fadeIn","fadeOut","commonAnimation"],"mappings":"iJAEaA,EAASC,EAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA,EAYTC,EAAUD,EAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA,EAWVE,EAASF,EAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA,EAUTG,EAAUH,EAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA,EAUVI,EAAkB,CAC7B,kBAAmB,OACnB,kBAAmB,OACnB,mBAAoB,QACtB"}

package/build/cjs/components/NavBar/NavBar.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"NavBar.js","sources":["../../../../src/components/NavBar/NavBar.tsx"],"sourcesContent":["import {\n forwardRef,\n type MouseEventHandler,\n type ReactElement,\n useCallback,\n useEffect,\n useMemo,\n useState,\n} from 'react';\n\nimport classNames from 'classnames';\nimport { NAV_BAR_CLASS, Sizes, Directions, Contrasts, Alignments, NOOP } from 'acinguiux-ds-react-base/consts';\nimport type { NavBarTypes } from 'acinguiux-ds-react-base/components/NavBar';\n\nimport LeftNavigation from '../Icon/components/LeftNavigation';\nimport LeftNavigationSolid from '../Icon/components/LeftNavigationSolid';\nimport LastArea from './components/LastArea/LastArea';\nimport FirstArea from './components/FirstArea/FirstArea';\nimport { Wrapper, MiddleArea, Nav, StyledMenu, DividerContainer } from './NavBar.styles';\nimport { INavBarProps, INavBarPropsImpl } from './NavBar.types';\nimport Divider from '../Divider/Divider';\nimport type { IMenuProps } from '../Menu/Menu.types';\n\nconst NavBar = forwardRef<HTMLElement, INavBarProps>(\n (\n {\n size = `${Sizes.Medium}`,\n className,\n direction = `${Directions.Horizontal}`,\n elevation,\n collapsed = false,\n preventExpand = false,\n expandedWidth = 300,\n pectenArea = 'default',\n lockup,\n urlProps,\n header,\n avatarArea,\n avatarProps,\n items,\n topArea,\n onClick,\n startArea,\n endArea,\n defaultOpenToSelected = false,\n itemsAlignment = `${Alignments.Left}`,\n expandMode = 'auto_push',\n itemRender,\n selectedPath,\n onSelect,\n onCollapsedChange,\n onExpandChange,\n ...props\n },\n ref,\n ): ReactElement => {\n const { indicatorPosition, iconPosition, type = 'default', ...rest } = props as INavBarPropsImpl;\n const [isCollapsed, setIsCollapsed] = useState<boolean>(() => collapsed);\n const lockupArea = lockup ?? pectenArea;\n const [isHovered, setIsHovered] = useState<boolean>(() => false);\n const isOpen = useMemo(\n () => direction === Directions.Horizontal \|\| !isCollapsed \|\| isHovered,\n [direction, isCollapsed, isHovered],\n );\n\n useEffect(() => {\n onExpandChange?.(isOpen);\n }, [isOpen, onExpandChange]);\n\n useEffect(() => setIsCollapsed(collapsed), [collapsed]);\n\n const menuModeMap: { [Property in NavBarTypes.Direction]: IMenuProps['mode'] } = {\n vertical: 'inline',\n horizontal: 'horizontal',\n };\n\n const handleOnExpandClick = useCallback(() => {\n setIsCollapsed((prev) => !prev);\n onCollapsedChange?.(!isCollapsed);\n }, [onCollapsedChange, isCollapsed]);\n\n const handleOnEnter: MouseEventHandler = useCallback(() => setIsHovered(true), []);\n const handleOnLeave: MouseEventHandler = useCallback(() => setIsHovered(false), []);\n\n return (\n <Wrapper\n onMouseLeave={expandMode !== 'manual' ? handleOnLeave : NOOP}\n onMouseEnter={expandMode !== 'manual' ? handleOnEnter : NOOP}\n $direction={direction}\n $expandMode={expandMode}\n $size={size}\n $isCollapsed={direction === Directions.Vertical && isCollapsed}\n $type={type}\n >\n {!!topArea && direction !== Directions.Vertical && topArea}\n <Nav\n as={direction === Directions.Vertical ? 'nav' : 'header'}\n $size={size}\n $expandMode={expandMode}\n className={classNames(NAV_BAR_CLASS, className)}\n $direction={direction}\n $elevation={elevation}\n $collapsed={!isOpen}\n $expandedWidth={expandedWidth}\n ref={ref}\n {...rest}\n >\n {lockupArea !== 'none' && (\n <FirstArea\n header={header}\n pectenArea={pectenArea}\n lockup={lockup}\n urlProps={urlProps}\n onClick={onClick}\n collapsed={!isOpen}\n size={size}\n />\n )}\n {startArea}\n <MiddleArea $direction={direction} $collapsed={!isOpen}>\n {items && (\n <StyledMenu\n inlineCollapsed={direction === Directions.Vertical && !isOpen}\n items={items}\n $itemsAlignment={itemsAlignment}\n itemRender={itemRender}\n mode={menuModeMap[direction] as INavBarProps['direction']}\n selectedPath={selectedPath}\n defaultOpenToSelected={defaultOpenToSelected}\n onSelect={onSelect}\n size={size}\n indicatorPosition={indicatorPosition}\n iconPosition={iconPosition}\n />\n )}\n </MiddleArea>\n {!!endArea && direction === Directions.Vertical && (\n <DividerContainer>\n <Divider contrast={Contrasts.Subtle} size={Sizes.Small} />\n </DividerContainer>\n )}\n {endArea}\n {direction === Directions.Vertical && !preventExpand && (\n <>\n <DividerContainer>\n <Divider contrast={Contrasts.Subtle} size={Sizes.Small} />\n </DividerContainer>\n <StyledMenu\n inlineCollapsed={direction === Directions.Vertical && !isOpen}\n items={[\n {\n key: 'expand',\n label: isCollapsed ? 'Expand navigation' : 'Collapse navigation',\n itemIcon: isCollapsed ? <LeftNavigationSolid /> : <LeftNavigation />,\n },\n ]}\n $itemsAlignment={itemsAlignment}\n mode={menuModeMap[direction] as INavBarProps['direction']}\n selectedKeys={[]}\n noAnimate={true}\n onClick={handleOnExpandClick}\n size={size}\n />\n </>\n )}\n {direction === Directions.Vertical && (!!avatarArea \|\| !!avatarProps) && (\n <DividerContainer>\n <Divider contrast={Contrasts.Subtle} size={Sizes.Small} />\n </DividerContainer>\n )}\n {(!!avatarArea \|\| !!avatarProps) && (\n <LastArea\n size={size}\n collapsed={direction === Directions.Vertical && !isOpen}\n avatarArea={avatarArea}\n avatarProps={avatarProps}\n />\n )}\n </Nav>\n </Wrapper>\n );\n },\n);\n\nexport default NavBar;\n"],"names":["NavBar","forwardRef","size","Sizes","className","direction","Directions","elevation","collapsed","preventExpand","expandedWidth","pectenArea","lockup","urlProps","header","avatarArea","avatarProps","items","topArea","onClick","startArea","endArea","defaultOpenToSelected","itemsAlignment","Alignments","expandMode","itemRender","selectedPath","onSelect","onCollapsedChange","onExpandChange","props","ref","indicatorPosition","iconPosition","type","rest","isCollapsed","setIsCollapsed","useState","lockupArea","isHovered","setIsHovered","isOpen","useMemo","useEffect","menuModeMap","handleOnExpandClick","useCallback","prev","handleOnEnter","handleOnLeave","jsxs","Wrapper","NOOP","Nav","classNames","NAV_BAR_CLASS","jsx","FirstArea","MiddleArea","StyledMenu","DividerContainer","Divider","Contrasts","Fragment","LeftNavigationSolid","LeftNavigation","LastArea"],"mappings":"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"}
1	+ {"version":3,"file":"NavBar.js","sources":["../../../../src/components/NavBar/NavBar.tsx"],"sourcesContent":["import {\r\n forwardRef,\r\n type MouseEventHandler,\r\n type ReactElement,\r\n useCallback,\r\n useEffect,\r\n useMemo,\r\n useState,\r\n} from 'react';\r\n\r\nimport classNames from 'classnames';\r\nimport { NAV_BAR_CLASS, Sizes, Directions, Contrasts, Alignments, NOOP } from 'acinguiux-ds-react-base/consts';\r\nimport type { NavBarTypes } from 'acinguiux-ds-react-base/components/NavBar';\r\n\r\nimport LeftNavigation from '../Icon/components/LeftNavigation';\r\nimport LeftNavigationSolid from '../Icon/components/LeftNavigationSolid';\r\nimport LastArea from './components/LastArea/LastArea';\r\nimport FirstArea from './components/FirstArea/FirstArea';\r\nimport { Wrapper, MiddleArea, Nav, StyledMenu, DividerContainer } from './NavBar.styles';\r\nimport { INavBarProps, INavBarPropsImpl } from './NavBar.types';\r\nimport Divider from '../Divider/Divider';\r\nimport type { IMenuProps } from '../Menu/Menu.types';\r\n\r\nconst NavBar = forwardRef<HTMLElement, INavBarProps>(\r\n (\r\n {\r\n size = `${Sizes.Medium}`,\r\n className,\r\n direction = `${Directions.Horizontal}`,\r\n elevation,\r\n collapsed = false,\r\n preventExpand = false,\r\n expandedWidth = 300,\r\n pectenArea = 'default',\r\n lockup,\r\n urlProps,\r\n header,\r\n avatarArea,\r\n avatarProps,\r\n items,\r\n topArea,\r\n onClick,\r\n startArea,\r\n endArea,\r\n defaultOpenToSelected = false,\r\n itemsAlignment = `${Alignments.Left}`,\r\n expandMode = 'auto_push',\r\n itemRender,\r\n selectedPath,\r\n onSelect,\r\n onCollapsedChange,\r\n onExpandChange,\r\n ...props\r\n },\r\n ref,\r\n ): ReactElement => {\r\n const { indicatorPosition, iconPosition, type = 'default', ...rest } = props as INavBarPropsImpl;\r\n const [isCollapsed, setIsCollapsed] = useState<boolean>(() => collapsed);\r\n const lockupArea = lockup ?? pectenArea;\r\n const [isHovered, setIsHovered] = useState<boolean>(() => false);\r\n const isOpen = useMemo(\r\n () => direction === Directions.Horizontal \|\| !isCollapsed \|\| isHovered,\r\n [direction, isCollapsed, isHovered],\r\n );\r\n\r\n useEffect(() => {\r\n onExpandChange?.(isOpen);\r\n }, [isOpen, onExpandChange]);\r\n\r\n useEffect(() => setIsCollapsed(collapsed), [collapsed]);\r\n\r\n const menuModeMap: { [Property in NavBarTypes.Direction]: IMenuProps['mode'] } = {\r\n vertical: 'inline',\r\n horizontal: 'horizontal',\r\n };\r\n\r\n const handleOnExpandClick = useCallback(() => {\r\n setIsCollapsed((prev) => !prev);\r\n onCollapsedChange?.(!isCollapsed);\r\n }, [onCollapsedChange, isCollapsed]);\r\n\r\n const handleOnEnter: MouseEventHandler = useCallback(() => setIsHovered(true), []);\r\n const handleOnLeave: MouseEventHandler = useCallback(() => setIsHovered(false), []);\r\n\r\n return (\r\n <Wrapper\r\n onMouseLeave={expandMode !== 'manual' ? handleOnLeave : NOOP}\r\n onMouseEnter={expandMode !== 'manual' ? handleOnEnter : NOOP}\r\n $direction={direction}\r\n $expandMode={expandMode}\r\n $size={size}\r\n $isCollapsed={direction === Directions.Vertical && isCollapsed}\r\n $type={type}\r\n >\r\n {!!topArea && direction !== Directions.Vertical && topArea}\r\n <Nav\r\n as={direction === Directions.Vertical ? 'nav' : 'header'}\r\n $size={size}\r\n $expandMode={expandMode}\r\n className={classNames(NAV_BAR_CLASS, className)}\r\n $direction={direction}\r\n $elevation={elevation}\r\n $collapsed={!isOpen}\r\n $expandedWidth={expandedWidth}\r\n ref={ref}\r\n {...rest}\r\n >\r\n {lockupArea !== 'none' && (\r\n <FirstArea\r\n header={header}\r\n pectenArea={pectenArea}\r\n lockup={lockup}\r\n urlProps={urlProps}\r\n onClick={onClick}\r\n collapsed={!isOpen}\r\n size={size}\r\n />\r\n )}\r\n {startArea}\r\n <MiddleArea $direction={direction} $collapsed={!isOpen}>\r\n {items && (\r\n <StyledMenu\r\n inlineCollapsed={direction === Directions.Vertical && !isOpen}\r\n items={items}\r\n $itemsAlignment={itemsAlignment}\r\n itemRender={itemRender}\r\n mode={menuModeMap[direction] as INavBarProps['direction']}\r\n selectedPath={selectedPath}\r\n defaultOpenToSelected={defaultOpenToSelected}\r\n onSelect={onSelect}\r\n size={size}\r\n indicatorPosition={indicatorPosition}\r\n iconPosition={iconPosition}\r\n />\r\n )}\r\n </MiddleArea>\r\n {!!endArea && direction === Directions.Vertical && (\r\n <DividerContainer>\r\n <Divider contrast={Contrasts.Subtle} size={Sizes.Small} />\r\n </DividerContainer>\r\n )}\r\n {endArea}\r\n {direction === Directions.Vertical && !preventExpand && (\r\n <>\r\n <DividerContainer>\r\n <Divider contrast={Contrasts.Subtle} size={Sizes.Small} />\r\n </DividerContainer>\r\n <StyledMenu\r\n inlineCollapsed={direction === Directions.Vertical && !isOpen}\r\n items={[\r\n {\r\n key: 'expand',\r\n label: isCollapsed ? 'Expand navigation' : 'Collapse navigation',\r\n itemIcon: isCollapsed ? <LeftNavigationSolid /> : <LeftNavigation />,\r\n },\r\n ]}\r\n $itemsAlignment={itemsAlignment}\r\n mode={menuModeMap[direction] as INavBarProps['direction']}\r\n selectedKeys={[]}\r\n noAnimate={true}\r\n onClick={handleOnExpandClick}\r\n size={size}\r\n />\r\n </>\r\n )}\r\n {direction === Directions.Vertical && (!!avatarArea \|\| !!avatarProps) && (\r\n <DividerContainer>\r\n <Divider contrast={Contrasts.Subtle} size={Sizes.Small} />\r\n </DividerContainer>\r\n )}\r\n {(!!avatarArea \|\| !!avatarProps) && (\r\n <LastArea\r\n size={size}\r\n collapsed={direction === Directions.Vertical && !isOpen}\r\n avatarArea={avatarArea}\r\n avatarProps={avatarProps}\r\n />\r\n )}\r\n </Nav>\r\n </Wrapper>\r\n );\r\n },\r\n);\r\n\r\nexport default NavBar;\r\n"],"names":["NavBar","forwardRef","size","Sizes","className","direction","Directions","elevation","collapsed","preventExpand","expandedWidth","pectenArea","lockup","urlProps","header","avatarArea","avatarProps","items","topArea","onClick","startArea","endArea","defaultOpenToSelected","itemsAlignment","Alignments","expandMode","itemRender","selectedPath","onSelect","onCollapsedChange","onExpandChange","props","ref","indicatorPosition","iconPosition","type","rest","isCollapsed","setIsCollapsed","useState","lockupArea","isHovered","setIsHovered","isOpen","useMemo","useEffect","menuModeMap","handleOnExpandClick","useCallback","prev","handleOnEnter","handleOnLeave","jsxs","Wrapper","NOOP","Nav","classNames","NAV_BAR_CLASS","jsx","FirstArea","MiddleArea","StyledMenu","DividerContainer","Divider","Contrasts","Fragment","LeftNavigationSolid","LeftNavigation","LastArea"],"mappings":"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"}

package/build/cjs/components/NavBar/NavBar.styles.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"NavBar.styles.js","sources":["../../../../src/components/NavBar/NavBar.styles.ts"],"sourcesContent":["import { styled, css } from 'styled-components';\nimport { NAV_BAR_CLASS, Directions, ZIndexes } from 'acinguiux-ds-react-base/consts';\nimport type { PickTransient } from 'acinguiux-ds-react-base/types';\nimport { NavBarConsts, NavBarUtils } from 'acinguiux-ds-react-base/components/NavBar';\nimport { Variables } from 'acinguiux-ds-react-base/theme';\nimport { MenuConsts } from 'acinguiux-ds-react-base/components/Menu';\n\nimport type { INavBarProps, INavBarPropsWithReqSize } from './NavBar.types';\nimport Menu from '../Menu/Menu';\nimport type { IMenuProps } from '../Menu/Menu.types';\n\nconst StyledMenu = styled(Menu)<IMenuProps & PickTransient<INavBarProps, 'itemsAlignment'>>`\n ${({ $itemsAlignment }) => css`\n flex: 1 1 0;\n max-height: fit-content;\n justify-content: ${NavBarUtils.getItemsAlignment($itemsAlignment)};\n overflow: hidden auto;\n `}\n`;\n\nconst getWrapperWidth = (\n direction: INavBarPropsWithReqSize['direction'],\n expandMode: INavBarPropsWithReqSize['expandMode'],\n size: INavBarPropsWithReqSize['size'],\n isCollapsed: boolean,\n): string => {\n if (direction === Directions.Vertical) {\n return expandMode === 'auto_cover' && isCollapsed ? `${NavBarConsts.consts[size].height}px` : 'auto';\n }\n\n return '100%';\n};\n\nconst Wrapper = styled.div<\n PickTransient<INavBarPropsWithReqSize, 'direction' \| 'expandMode' \| 'size'> & {\n $isCollapsed: boolean;\n $type: 'default' \| 'mobile';\n }\n>(\n ({ $direction, $expandMode, $size, $isCollapsed, $type }) => css`\n position: relative;\n height: ${$direction === Directions.Vertical ? '100%' : `${NavBarConsts.consts[$size].height[$type]}px`};\n width: ${getWrapperWidth($direction, $expandMode, $size, $isCollapsed)};\n `,\n);\n\ntype NavPropsKeys = 'size' \| 'direction' \| 'elevation' \| 'collapsed' \| 'expandMode' \| 'expandedWidth';\ntype NavProps = PickTransient<INavBarPropsWithReqSize, NavPropsKeys>;\n\nconst Nav = styled.header<NavProps>(\n ({ $direction, $elevation, $collapsed, theme, $expandedWidth, $size, $expandMode }) => {\n const layer = theme.layer({ foundation: 'surface' });\n\n return css`\n z-index: ${ZIndexes.NAVBAR};\n position: ${$expandMode === 'auto_cover' && $collapsed ? 'absolute' : 'relative'};\n display: flex;\n flex-flow: ${$direction === Directions.Horizontal ? 'row' : 'column'} nowrap;\n align-items: stretch;\n height: 100%;\n width: 100%;\n filter: ${$elevation ? theme.dropShadows.low1 : null};\n color: ${layer[Variables.TextOnFoundationStrong]};\n background-color: ${layer[Variables.BackgroundFoundation]};\n transition: width 0.3s ease-out;\n\n ${$direction === Directions.Vertical &&\n css`\n width: ${$collapsed ? `${NavBarConsts.consts[$size].height.default}px` : `${$expandedWidth}px`};\n\n ${StyledMenu} {\n width: calc(100% + ${$collapsed ? 0 : MenuConsts.consts[$size].itemListMarginLeft}px);\n }\n\n .${NAV_BAR_CLASS}-icon {\n transform: rotate(${$collapsed ? 0 : 180}deg);\n }\n `}\n `;\n },\n);\n\nconst MiddleArea = styled.div<PickTransient<INavBarProps, 'direction' \| 'collapsed'>>(\n ({ $direction, $collapsed }) => css`\n position: relative;\n display: flex;\n flex-shrink: ${$collapsed ? 0 : 1};\n flex-grow: 1;\n flex-direction: ${$direction === Directions.Horizontal ? 'row' : 'column'};\n align-items: stretch;\n min-width: 0;\n z-index: 1;\n overflow: hidden auto;\n `,\n);\n\nconst DividerContainer = styled.div`\n align-items: center;\n padding: 0 12px;\n`;\n\nexport { Wrapper, Nav, MiddleArea, StyledMenu, DividerContainer };\n"],"names":["StyledMenu","styled","Menu","$itemsAlignment","css","NavBarUtils.getItemsAlignment","getWrapperWidth","direction","expandMode","size","isCollapsed","Directions","NavBarConsts.consts","Wrapper","$direction","$expandMode","$size","$isCollapsed","$type","Nav","$elevation","$collapsed","theme","$expandedWidth","layer","ZIndexes","Variables","MenuConsts.consts","NAV_BAR_CLASS","MiddleArea","DividerContainer"],"mappings":"yhBAWMA,EAAaC,EAAAA,OAAOC,CAAI;AAAA,IAC1B,CAAC,CAAE,gBAAAC,CAAA,IAAsBC,EAAAA;AAAAA;AAAAA;AAAAA,uBAGNC,EAAAA,kBAA8BF,CAAe,CAAC;AAAA;AAAA,GAElE;AAAA,EAGGG,EAAkB,CACtBC,EACAC,EACAC,EACAC,IAEIH,IAAcI,EAAAA,WAAW,SACpBH,IAAe,cAAgBE,EAAc,GAAGE,SAAoBH,CAAI,EAAE,MAAM,KAAO,OAGzF,OAGHI,EAAUZ,EAAAA,OAAO,IAMrB,CAAC,CAAE,WAAAa,EAAY,YAAAC,EAAa,MAAAC,EAAO,aAAAC,EAAc,MAAAC,KAAYd,EAAAA;AAAAA;AAAAA,cAEjDU,IAAeH,EAAAA,WAAW,SAAW,OAAS,GAAGC,SAAoBI,CAAK,EAAE,OAAOE,CAAK,CAAC,IAAI;AAAA,aAC9FZ,EAAgBQ,EAAYC,EAAaC,EAAOC,CAAY,CAAC;AAAA,GAE1E,EAKME,EAAMlB,EAAAA,OAAO,OACjB,CAAC,CAAE,WAAAa,EAAY,WAAAM,EAAY,WAAAC,EAAY,MAAAC,EAAO,eAAAC,EAAgB,MAAAP,EAAO,YAAAD,KAAkB,CACrF,MAAMS,EAAQF,EAAM,MAAM,CAAE,WAAY,UAAW,EAEnD,OAAOlB,EAAAA;AAAAA,iBACMqB,EAAAA,SAAS,MAAM;AAAA,kBACdV,IAAgB,cAAgBM,EAAa,WAAa,UAAU;AAAA;AAAA,mBAEnEP,IAAeH,EAAAA,WAAW,WAAa,MAAQ,QAAQ;AAAA;AAAA;AAAA;AAAA,gBAI1DS,EAAaE,EAAM,YAAY,KAAO,IAAI;AAAA,eAC3CE,EAAME,YAAU,sBAAsB,CAAC;AAAA,0BAC5BF,EAAME,YAAU,oBAAoB,CAAC;AAAA;AAAA;AAAA,QAGvDZ,IAAeH,aAAW,UAC5BP,EAAAA;AAAAA,iBACWiB,EAAa,GAAGT,EAAAA,OAAoBI,CAAK,EAAE,OAAO,OAAO,KAAO,GAAGO,CAAc,IAAI;AAAA;AAAA,UAE5FvB,CAAU;AAAA,+BACWqB,EAAa,EAAIM,EAAAA,OAAkBX,CAAK,EAAE,kBAAkB;AAAA;AAAA;AAAA,WAGhFY,eAAa;AAAA,8BACMP,EAAa,EAAI,GAAG;AAAA;AAAA,OAE3C;AAAA,KAEL,CACF,EAEMQ,EAAa5B,EAAAA,OAAO,IACxB,CAAC,CAAE,WAAAa,EAAY,WAAAO,CAAA,IAAiBjB,EAAAA;AAAAA;AAAAA;AAAAA,mBAGfiB,EAAa,EAAI,CAAC;AAAA;AAAA,sBAEfP,IAAeH,EAAAA,WAAW,WAAa,MAAQ,QAAQ;AAAA;AAAA;AAAA;AAAA;AAAA,GAM7E,EAEMmB,EAAmB7B,EAAAA,OAAO;AAAA;AAAA;AAAA"}
1	+ {"version":3,"file":"NavBar.styles.js","sources":["../../../../src/components/NavBar/NavBar.styles.ts"],"sourcesContent":["import { styled, css } from 'styled-components';\r\nimport { NAV_BAR_CLASS, Directions, ZIndexes } from 'acinguiux-ds-react-base/consts';\r\nimport type { PickTransient } from 'acinguiux-ds-react-base/types';\r\nimport { NavBarConsts, NavBarUtils } from 'acinguiux-ds-react-base/components/NavBar';\r\nimport { Variables } from 'acinguiux-ds-react-base/theme';\r\nimport { MenuConsts } from 'acinguiux-ds-react-base/components/Menu';\r\n\r\nimport type { INavBarProps, INavBarPropsWithReqSize } from './NavBar.types';\r\nimport Menu from '../Menu/Menu';\r\nimport type { IMenuProps } from '../Menu/Menu.types';\r\n\r\nconst StyledMenu = styled(Menu)<IMenuProps & PickTransient<INavBarProps, 'itemsAlignment'>>`\r\n ${({ $itemsAlignment }) => css`\r\n flex: 1 1 0;\r\n max-height: fit-content;\r\n justify-content: ${NavBarUtils.getItemsAlignment($itemsAlignment)};\r\n overflow: hidden auto;\r\n `}\r\n`;\r\n\r\nconst getWrapperWidth = (\r\n direction: INavBarPropsWithReqSize['direction'],\r\n expandMode: INavBarPropsWithReqSize['expandMode'],\r\n size: INavBarPropsWithReqSize['size'],\r\n isCollapsed: boolean,\r\n): string => {\r\n if (direction === Directions.Vertical) {\r\n return expandMode === 'auto_cover' && isCollapsed ? `${NavBarConsts.consts[size].height}px` : 'auto';\r\n }\r\n\r\n return '100%';\r\n};\r\n\r\nconst Wrapper = styled.div<\r\n PickTransient<INavBarPropsWithReqSize, 'direction' \| 'expandMode' \| 'size'> & {\r\n $isCollapsed: boolean;\r\n $type: 'default' \| 'mobile';\r\n }\r\n>(\r\n ({ $direction, $expandMode, $size, $isCollapsed, $type }) => css`\r\n position: relative;\r\n height: ${$direction === Directions.Vertical ? '100%' : `${NavBarConsts.consts[$size].height[$type]}px`};\r\n width: ${getWrapperWidth($direction, $expandMode, $size, $isCollapsed)};\r\n `,\r\n);\r\n\r\ntype NavPropsKeys = 'size' \| 'direction' \| 'elevation' \| 'collapsed' \| 'expandMode' \| 'expandedWidth';\r\ntype NavProps = PickTransient<INavBarPropsWithReqSize, NavPropsKeys>;\r\n\r\nconst Nav = styled.header<NavProps>(\r\n ({ $direction, $elevation, $collapsed, theme, $expandedWidth, $size, $expandMode }) => {\r\n const layer = theme.layer({ foundation: 'surface' });\r\n\r\n return css`\r\n z-index: ${ZIndexes.NAVBAR};\r\n position: ${$expandMode === 'auto_cover' && $collapsed ? 'absolute' : 'relative'};\r\n display: flex;\r\n flex-flow: ${$direction === Directions.Horizontal ? 'row' : 'column'} nowrap;\r\n align-items: stretch;\r\n height: 100%;\r\n width: 100%;\r\n filter: ${$elevation ? theme.dropShadows.low1 : null};\r\n color: ${layer[Variables.TextOnFoundationStrong]};\r\n background-color: ${layer[Variables.BackgroundFoundation]};\r\n transition: width 0.3s ease-out;\r\n\r\n ${$direction === Directions.Vertical &&\r\n css`\r\n width: ${$collapsed ? `${NavBarConsts.consts[$size].height.default}px` : `${$expandedWidth}px`};\r\n\r\n ${StyledMenu} {\r\n width: calc(100% + ${$collapsed ? 0 : MenuConsts.consts[$size].itemListMarginLeft}px);\r\n }\r\n\r\n .${NAV_BAR_CLASS}-icon {\r\n transform: rotate(${$collapsed ? 0 : 180}deg);\r\n }\r\n `}\r\n `;\r\n },\r\n);\r\n\r\nconst MiddleArea = styled.div<PickTransient<INavBarProps, 'direction' \| 'collapsed'>>(\r\n ({ $direction, $collapsed }) => css`\r\n position: relative;\r\n display: flex;\r\n flex-shrink: ${$collapsed ? 0 : 1};\r\n flex-grow: 1;\r\n flex-direction: ${$direction === Directions.Horizontal ? 'row' : 'column'};\r\n align-items: stretch;\r\n min-width: 0;\r\n z-index: 1;\r\n overflow: hidden auto;\r\n `,\r\n);\r\n\r\nconst DividerContainer = styled.div`\r\n align-items: center;\r\n padding: 0 12px;\r\n`;\r\n\r\nexport { Wrapper, Nav, MiddleArea, StyledMenu, DividerContainer };\r\n"],"names":["StyledMenu","styled","Menu","$itemsAlignment","css","NavBarUtils.getItemsAlignment","getWrapperWidth","direction","expandMode","size","isCollapsed","Directions","NavBarConsts.consts","Wrapper","$direction","$expandMode","$size","$isCollapsed","$type","Nav","$elevation","$collapsed","theme","$expandedWidth","layer","ZIndexes","Variables","MenuConsts.consts","NAV_BAR_CLASS","MiddleArea","DividerContainer"],"mappings":"yhBAWMA,EAAaC,EAAAA,OAAOC,CAAI;AAAA,IAC1B,CAAC,CAAE,gBAAAC,CAAA,IAAsBC,EAAAA;AAAAA;AAAAA;AAAAA,uBAGNC,EAAAA,kBAA8BF,CAAe,CAAC;AAAA;AAAA,GAElE;AAAA,EAGGG,EAAkB,CACtBC,EACAC,EACAC,EACAC,IAEIH,IAAcI,EAAAA,WAAW,SACpBH,IAAe,cAAgBE,EAAc,GAAGE,SAAoBH,CAAI,EAAE,MAAM,KAAO,OAGzF,OAGHI,EAAUZ,EAAAA,OAAO,IAMrB,CAAC,CAAE,WAAAa,EAAY,YAAAC,EAAa,MAAAC,EAAO,aAAAC,EAAc,MAAAC,KAAYd,EAAAA;AAAAA;AAAAA,cAEjDU,IAAeH,EAAAA,WAAW,SAAW,OAAS,GAAGC,SAAoBI,CAAK,EAAE,OAAOE,CAAK,CAAC,IAAI;AAAA,aAC9FZ,EAAgBQ,EAAYC,EAAaC,EAAOC,CAAY,CAAC;AAAA,GAE1E,EAKME,EAAMlB,EAAAA,OAAO,OACjB,CAAC,CAAE,WAAAa,EAAY,WAAAM,EAAY,WAAAC,EAAY,MAAAC,EAAO,eAAAC,EAAgB,MAAAP,EAAO,YAAAD,KAAkB,CACrF,MAAMS,EAAQF,EAAM,MAAM,CAAE,WAAY,UAAW,EAEnD,OAAOlB,EAAAA;AAAAA,iBACMqB,EAAAA,SAAS,MAAM;AAAA,kBACdV,IAAgB,cAAgBM,EAAa,WAAa,UAAU;AAAA;AAAA,mBAEnEP,IAAeH,EAAAA,WAAW,WAAa,MAAQ,QAAQ;AAAA;AAAA;AAAA;AAAA,gBAI1DS,EAAaE,EAAM,YAAY,KAAO,IAAI;AAAA,eAC3CE,EAAME,YAAU,sBAAsB,CAAC;AAAA,0BAC5BF,EAAME,YAAU,oBAAoB,CAAC;AAAA;AAAA;AAAA,QAGvDZ,IAAeH,aAAW,UAC5BP,EAAAA;AAAAA,iBACWiB,EAAa,GAAGT,EAAAA,OAAoBI,CAAK,EAAE,OAAO,OAAO,KAAO,GAAGO,CAAc,IAAI;AAAA;AAAA,UAE5FvB,CAAU;AAAA,+BACWqB,EAAa,EAAIM,EAAAA,OAAkBX,CAAK,EAAE,kBAAkB;AAAA;AAAA;AAAA,WAGhFY,eAAa;AAAA,8BACMP,EAAa,EAAI,GAAG;AAAA;AAAA,OAE3C;AAAA,KAEL,CACF,EAEMQ,EAAa5B,EAAAA,OAAO,IACxB,CAAC,CAAE,WAAAa,EAAY,WAAAO,CAAA,IAAiBjB,EAAAA;AAAAA;AAAAA;AAAAA,mBAGfiB,EAAa,EAAI,CAAC;AAAA;AAAA,sBAEfP,IAAeH,EAAAA,WAAW,WAAa,MAAQ,QAAQ;AAAA;AAAA;AAAA;AAAA;AAAA,GAM7E,EAEMmB,EAAmB7B,EAAAA,OAAO;AAAA;AAAA;AAAA"}

package/build/cjs/components/NavBar/NavBarMobile.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"NavBarMobile.js","sources":["../../../../src/components/NavBar/NavBarMobile.tsx"],"sourcesContent":["import { type FC } from 'react';\n\nimport NavBar from './NavBar';\nimport type { INavBarProps, INavbarMobileProps, INavBarPropsImpl } from './NavBar.types';\n\nconst NavbarInternal = NavBar as FC<INavBarPropsImpl & INavBarProps>;\n\nconst NavBarMobile: FC<INavbarMobileProps> = ({ indicatorPosition = 'bottom', ...navbarProps }) => {\n return (\n <NavbarInternal\n {...navbarProps}\n indicatorPosition={indicatorPosition}\n iconPosition=\"top\"\n direction=\"horizontal\"\n lockup=\"none\"\n type=\"mobile\"\n />\n );\n};\n\nexport default NavBarMobile;\n"],"names":["NavbarInternal","NavBar","NavBarMobile","indicatorPosition","navbarProps","jsx"],"mappings":"2EAKMA,EAAiBC,EAEjBC,EAAuC,CAAC,CAAE,kBAAAC,EAAoB,SAAU,GAAGC,KAE7EC,EAAAA,IAACL,EAAA,CACE,GAAGI,EACJ,kBAAAD,EACA,aAAa,MACb,UAAU,aACV,OAAO,OACP,KAAK,QAAA,CAAA"}
1	+ {"version":3,"file":"NavBarMobile.js","sources":["../../../../src/components/NavBar/NavBarMobile.tsx"],"sourcesContent":["import { type FC } from 'react';\r\n\r\nimport NavBar from './NavBar';\r\nimport type { INavBarProps, INavbarMobileProps, INavBarPropsImpl } from './NavBar.types';\r\n\r\nconst NavbarInternal = NavBar as FC<INavBarPropsImpl & INavBarProps>;\r\n\r\nconst NavBarMobile: FC<INavbarMobileProps> = ({ indicatorPosition = 'bottom', ...navbarProps }) => {\r\n return (\r\n <NavbarInternal\r\n {...navbarProps}\r\n indicatorPosition={indicatorPosition}\r\n iconPosition=\"top\"\r\n direction=\"horizontal\"\r\n lockup=\"none\"\r\n type=\"mobile\"\r\n />\r\n );\r\n};\r\n\r\nexport default NavBarMobile;\r\n"],"names":["NavbarInternal","NavBar","NavBarMobile","indicatorPosition","navbarProps","jsx"],"mappings":"2EAKMA,EAAiBC,EAEjBC,EAAuC,CAAC,CAAE,kBAAAC,EAAoB,SAAU,GAAGC,KAE7EC,EAAAA,IAACL,EAAA,CACE,GAAGI,EACJ,kBAAAD,EACA,aAAa,MACb,UAAU,aACV,OAAO,OACP,KAAK,QAAA,CAAA"}

package/build/cjs/components/NavBar/NavBarVerticalStatic.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"NavBarVerticalStatic.js","sources":["../../../../src/components/NavBar/NavBarVerticalStatic.tsx"],"sourcesContent":["import { forwardRef, type ReactElement } from 'react';\n\nimport classNames from 'classnames';\nimport { NAV_BAR_CLASS, Sizes, Alignments } from 'acinguiux-ds-react-base/consts';\nimport { NavBarVerticalStaticConsts } from 'acinguiux-ds-react-base/components/NavBar';\n\nimport LastArea from './components/LastArea/LastArea';\nimport Pecten from '../Pecten/Pecten';\nimport { Wrapper, MiddleArea, Nav, StyledMenu, PectenUrlWrapper } from './NavBarVerticalStatic.styles';\nimport { INavbarVerticalStaticProps } from './NavBar.types';\n\nconst NavBarVerticalStatic = forwardRef<HTMLElement, INavbarVerticalStaticProps>(\n (\n {\n size = `${Sizes.Medium}`,\n className,\n urlProps,\n avatarArea,\n avatarProps,\n items,\n startArea,\n endArea,\n selectedPath,\n onSelect,\n ...rest\n },\n ref,\n ): ReactElement => (\n <Wrapper>\n <Nav as=\"nav\" $size={size} className={classNames(NAV_BAR_CLASS, className)} ref={ref} {...rest}>\n <PectenUrlWrapper rel=\"noopener noreferrer\" tabIndex={-1} {...urlProps} $size={size}>\n <Pecten size={NavBarVerticalStaticConsts.consts[size].pectenSize} />\n </PectenUrlWrapper>\n {startArea}\n <MiddleArea>\n {items && (\n <StyledMenu\n items={items}\n $itemsAlignment={Alignments.Center}\n mode=\"vertical\"\n selectedPath={selectedPath}\n onSelect={onSelect}\n size={size}\n iconPosition=\"top\"\n />\n )}\n </MiddleArea>\n {endArea}\n {(!!avatarArea \|\| !!avatarProps) && (\n <LastArea\n size={NavBarVerticalStaticConsts.consts[size].avatarSize}\n collapsed={true}\n avatarArea={avatarArea}\n avatarProps={avatarProps}\n />\n )}\n </Nav>\n </Wrapper>\n ),\n);\n\nexport default NavBarVerticalStatic;\n"],"names":["NavBarVerticalStatic","forwardRef","size","Sizes","className","urlProps","avatarArea","avatarProps","items","startArea","endArea","selectedPath","onSelect","rest","ref","jsx","Wrapper","jsxs","Nav","classNames","NAV_BAR_CLASS","PectenUrlWrapper","Pecten","NavBarVerticalStaticConsts.consts","MiddleArea","StyledMenu","Alignments","LastArea"],"mappings":"oZAWMA,EAAuBC,EAAAA,WAC3B,CACE,CACE,KAAAC,EAAO,GAAGC,QAAM,MAAM,GACtB,UAAAC,EACA,SAAAC,EACA,WAAAC,EACA,YAAAC,EACA,MAAAC,EACA,UAAAC,EACA,QAAAC,EACA,aAAAC,EACA,SAAAC,EACA,GAAGC,CAAA,EAELC,IAEAC,EAAAA,IAACC,UAAA,CACC,SAAAC,OAACC,EAAAA,KAAI,GAAG,MAAM,MAAOhB,EAAM,UAAWiB,EAAWC,EAAAA,cAAehB,CAAS,EAAG,IAAAU,EAAW,GAAGD,EACxF,SAAA,CAAAE,MAACM,EAAAA,kBAAiB,IAAI,sBAAsB,SAAU,GAAK,GAAGhB,EAAU,MAAOH,EAC7E,SAAAa,EAAAA,IAACO,GAAO,KAAMC,EAAAA,OAAkCrB,CAAI,EAAE,WAAY,EACpE,EACCO,EACDM,EAAAA,IAACS,EAAAA,YACE,SAAAhB,GACCO,EAAAA,IAACU,EAAAA,WAAA,CACC,MAAAjB,EACA,gBAAiBkB,EAAAA,WAAW,OAC5B,KAAK,WACL,aAAAf,EACA,SAAAC,EACA,KAAAV,EACA,aAAa,KAAA,CAAA,EAGnB,EACCQ,GACC,CAAC,CAACJ,GAAc,CAAC,CAACC,IAClBQ,EAAAA,IAACY,EAAA,CACC,KAAMJ,EAAAA,OAAkCrB,CAAI,EAAE,WAC9C,UAAW,GACX,WAAAI,EACA,YAAAC,CAAA,CAAA,CACF,CAAA,CAEJ,CAAA,CACF,CAEJ"}
1	+ {"version":3,"file":"NavBarVerticalStatic.js","sources":["../../../../src/components/NavBar/NavBarVerticalStatic.tsx"],"sourcesContent":["import { forwardRef, type ReactElement } from 'react';\r\n\r\nimport classNames from 'classnames';\r\nimport { NAV_BAR_CLASS, Sizes, Alignments } from 'acinguiux-ds-react-base/consts';\r\nimport { NavBarVerticalStaticConsts } from 'acinguiux-ds-react-base/components/NavBar';\r\n\r\nimport LastArea from './components/LastArea/LastArea';\r\nimport Pecten from '../Pecten/Pecten';\r\nimport { Wrapper, MiddleArea, Nav, StyledMenu, PectenUrlWrapper } from './NavBarVerticalStatic.styles';\r\nimport { INavbarVerticalStaticProps } from './NavBar.types';\r\n\r\nconst NavBarVerticalStatic = forwardRef<HTMLElement, INavbarVerticalStaticProps>(\r\n (\r\n {\r\n size = `${Sizes.Medium}`,\r\n className,\r\n urlProps,\r\n avatarArea,\r\n avatarProps,\r\n items,\r\n startArea,\r\n endArea,\r\n selectedPath,\r\n onSelect,\r\n ...rest\r\n },\r\n ref,\r\n ): ReactElement => (\r\n <Wrapper>\r\n <Nav as=\"nav\" $size={size} className={classNames(NAV_BAR_CLASS, className)} ref={ref} {...rest}>\r\n <PectenUrlWrapper rel=\"noopener noreferrer\" tabIndex={-1} {...urlProps} $size={size}>\r\n <Pecten size={NavBarVerticalStaticConsts.consts[size].pectenSize} />\r\n </PectenUrlWrapper>\r\n {startArea}\r\n <MiddleArea>\r\n {items && (\r\n <StyledMenu\r\n items={items}\r\n $itemsAlignment={Alignments.Center}\r\n mode=\"vertical\"\r\n selectedPath={selectedPath}\r\n onSelect={onSelect}\r\n size={size}\r\n iconPosition=\"top\"\r\n />\r\n )}\r\n </MiddleArea>\r\n {endArea}\r\n {(!!avatarArea \|\| !!avatarProps) && (\r\n <LastArea\r\n size={NavBarVerticalStaticConsts.consts[size].avatarSize}\r\n collapsed={true}\r\n avatarArea={avatarArea}\r\n avatarProps={avatarProps}\r\n />\r\n )}\r\n </Nav>\r\n </Wrapper>\r\n ),\r\n);\r\n\r\nexport default NavBarVerticalStatic;\r\n"],"names":["NavBarVerticalStatic","forwardRef","size","Sizes","className","urlProps","avatarArea","avatarProps","items","startArea","endArea","selectedPath","onSelect","rest","ref","jsx","Wrapper","jsxs","Nav","classNames","NAV_BAR_CLASS","PectenUrlWrapper","Pecten","NavBarVerticalStaticConsts.consts","MiddleArea","StyledMenu","Alignments","LastArea"],"mappings":"oZAWMA,EAAuBC,EAAAA,WAC3B,CACE,CACE,KAAAC,EAAO,GAAGC,QAAM,MAAM,GACtB,UAAAC,EACA,SAAAC,EACA,WAAAC,EACA,YAAAC,EACA,MAAAC,EACA,UAAAC,EACA,QAAAC,EACA,aAAAC,EACA,SAAAC,EACA,GAAGC,CAAA,EAELC,IAEAC,EAAAA,IAACC,UAAA,CACC,SAAAC,OAACC,EAAAA,KAAI,GAAG,MAAM,MAAOhB,EAAM,UAAWiB,EAAWC,EAAAA,cAAehB,CAAS,EAAG,IAAAU,EAAW,GAAGD,EACxF,SAAA,CAAAE,MAACM,EAAAA,kBAAiB,IAAI,sBAAsB,SAAU,GAAK,GAAGhB,EAAU,MAAOH,EAC7E,SAAAa,EAAAA,IAACO,GAAO,KAAMC,EAAAA,OAAkCrB,CAAI,EAAE,WAAY,EACpE,EACCO,EACDM,EAAAA,IAACS,EAAAA,YACE,SAAAhB,GACCO,EAAAA,IAACU,EAAAA,WAAA,CACC,MAAAjB,EACA,gBAAiBkB,EAAAA,WAAW,OAC5B,KAAK,WACL,aAAAf,EACA,SAAAC,EACA,KAAAV,EACA,aAAa,KAAA,CAAA,EAGnB,EACCQ,GACC,CAAC,CAACJ,GAAc,CAAC,CAACC,IAClBQ,EAAAA,IAACY,EAAA,CACC,KAAMJ,EAAAA,OAAkCrB,CAAI,EAAE,WAC9C,UAAW,GACX,WAAAI,EACA,YAAAC,CAAA,CAAA,CACF,CAAA,CAEJ,CAAA,CACF,CAEJ"}

package/build/cjs/components/NavBar/NavBarVerticalStatic.styles.js CHANGED Viewed

@@ -1,5 +1,5 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("styled-components"),u=require("../../react-base/src/consts/index.js"),n=require("../../react-base/src/components/NavBar/NavBarVerticalStatic.consts.js"),l=require("../../react-base/src/theme/types/layer.js"),o=require("../../react-base/src/utils/sizesUtils.js");require("acinguiux-ds-fabrics");const p=require("../Menu/Menu.js"),a=require("./components/LastArea/LastArea.styles.js"),d=require("../../react-base/src/consts/classes.js"),g=require("../../react-base/src/components/NavBar/utils/styleUtils.js"),c=e.styled(p)`
-  ${({$itemsAlignment:t,size:r,theme:i})=>e.css`
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("styled-components"),u=require("../../react-base/src/consts/index.js"),n=require("../../react-base/src/components/NavBar/NavBarVerticalStatic.consts.js"),l=require("../../react-base/src/theme/types/layer.js"),o=require("../../react-base/src/utils/sizesUtils.js"),p=require("../Menu/Menu.js"),a=require("./components/LastArea/LastArea.styles.js"),d=require("../../react-base/src/consts/classes.js"),g=require("../../react-base/src/components/NavBar/utils/styleUtils.js"),c=e.styled(p)`
+  ${({$itemsAlignment:t,size:i,theme:r})=>e.css`
     flex: 1 1 0;
     max-height: fit-content;
     justify-content: ${g.getItemsAlignment(t)};
@@ -11,22 +11,22 @@
     }
     .${d.MENU_CLASS}-label-text {
-      ${i.typography("label",o.getLabelTypographySize(o.getSmallerSize(o.getSmallerSize(r))))}
+      ${r.typography("label",o.getLabelTypographySize(o.getSmallerSize(o.getSmallerSize(i))))}
     }
   `}
 `,h=e.styled.div`
   position: relative;
   height: 100%;
   width: auto;
-`,y=e.styled.header(({$elevation:t,theme:r,$size:i})=>{const s=r.layer({foundation:"surface"});return e.css`
+`,y=e.styled.header(({$elevation:t,theme:i,$size:r})=>{const s=i.layer({foundation:"surface"});return e.css`
     z-index: ${u.ZIndexes.NAVBAR};
     position: relative;
     display: flex;
     flex-flow: column nowrap;
     align-items: stretch;
     height: 100%;
-    width: ${n.consts[i].width}px;
-    filter: ${t?r.dropShadows.low1:null};
+    width: ${n.consts[r].width}px;
+    filter: ${t?i.dropShadows.low1:null};
     color: ${s[l.Variables.TextOnFoundationStrong]};
     background-color: ${s[l.Variables.BackgroundFoundation]};
     transition: width 0.3s ease-out;
@@ -37,7 +37,7 @@
     }
     ${a.Area} {
-      height: ${n.consts[i].width}px;
+      height: ${n.consts[r].width}px;
     }
     ${a.StyledAvatar} {