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

acinguiux-ds-react-framework 0.1.26 → 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 (4341) hide show

package/build/esm/components/ListItem/ListItem.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ListItem.js","sources":["../../../../src/components/ListItem/ListItem.tsx"],"sourcesContent":["import { type ForwardedRef, type ReactElement, forwardRef, memo } from 'react';\n\nimport classNames from 'classnames';\nimport {\n Sizes,\n Positions,\n LIST_ITEM_CLASS,\n LIST_ITEM_CHECKED_ICON_CLASS,\n} from 'acinguiux-ds-react-base/consts';\nimport { ListItemTypes, ListItemConsts } from 'acinguiux-ds-react-base/components/ListItem';\n\nimport * as Styled from './ListItem.styles';\nimport Flag from '../Flag/Flag';\nimport type { IListItemProps } from './ListItem.types';\nimport Checkbox from '../Checkbox/Checkbox';\nimport RadioButton from '../RadioButton/RadioButton';\n\nconst ListItem = forwardRef(\n (\n {\n className,\n icon,\n flag,\n label,\n metaText,\n disabled = false,\n metaTextPosition = Positions.Right,\n selected = false,\n size = Sizes.Medium,\n variant = ListItemTypes.ListItemVariants.Default,\n selectionType = ListItemTypes.ListItemSelectionType.Checkbox,\n showInputControls = false,\n optionItem = false,\n multiline = false,\n title,\n ...rest\n }: IListItemProps,\n ref: ForwardedRef<HTMLLIElement>,\n ): ReactElement => {\n const getSelection = () => {\n switch (selectionType) {\n case ListItemTypes.ListItemSelectionType.Checkbox:\n return showInputControls ? (\n <Checkbox tabIndex={-1} size={ListItemConsts.consts[size].inputSize} checked={selected} />\n ) : (\n <Styled.Check className={LIST_ITEM_CHECKED_ICON_CLASS} />\n );\n case ListItemTypes.ListItemSelectionType.Radio:\n return showInputControls ? (\n <RadioButton tabIndex={-1} size={ListItemConsts.consts[size].inputSize} checked={selected} />\n ) : (\n <Styled.Radio className={LIST_ITEM_CHECKED_ICON_CLASS} />\n );\n default:\n return null;\n }\n };\n\n return (\n <Styled.ListItemWrapper\n className={classNames(LIST_ITEM_CLASS, className)}\n ref={ref}\n tabIndex={optionItem ? -1 : 0}\n $size={size}\n $withMetaText={!!metaText}\n $metaTextPosition={metaTextPosition}\n $variant={variant}\n $iconOrFlagProvided={Boolean(icon) \|\| Boolean(flag)}\n $selected={selected}\n $disabled={disabled}\n $showInputControls={showInputControls}\n $multiline={multiline}\n $ariaInteractiveOnly={optionItem}\n {...rest}\n >\n <Styled.Label\n disabled={disabled}\n size={size}\n title={title ?? (!multiline && typeof label === 'string' ? label : undefined)}\n >\n {label}\n </Styled.Label>\n {variant === ListItemTypes.ListItemVariants.Flag && flag && (\n <Styled.FlagContainer $size={size} data-testid={`flag-${flag}`}>\n <Flag flag={flag} />\n </Styled.FlagContainer>\n )}\n {variant === ListItemTypes.ListItemVariants.Icon && icon}\n {metaText && (\n <Styled.MetaText\n $metaTextPosition={metaTextPosition}\n size={ListItemConsts.consts[size].metaSize}\n contrast=\"subtle\"\n disabled={disabled}\n title={metaText}\n >\n {metaText}\n </Styled.MetaText>\n )}\n <Styled.SelectionContainer>{getSelection()}</Styled.SelectionContainer>\n </Styled.ListItemWrapper>\n );\n },\n);\n\nexport default memo(ListItem);\n"],"names":["ListItem","forwardRef","className","icon","flag","label","metaText","disabled","metaTextPosition","Positions","selected","size","Sizes","variant","ListItemTypes.ListItemVariants","selectionType","ListItemTypes.ListItemSelectionType","showInputControls","optionItem","multiline","title","rest","ref","getSelection","jsx","Checkbox","ListItemConsts.consts","Styled.Check","LIST_ITEM_CHECKED_ICON_CLASS","RadioButton","Styled.Radio","jsxs","Styled.ListItemWrapper","classNames","LIST_ITEM_CLASS","Styled.Label","Styled.FlagContainer","Flag","Styled.MetaText","Styled.SelectionContainer","ListItem$1","memo"],"mappings":";;;;;;;;;;;AAiBA,MAAMA,IAAWC;AAAA,EACf,CACE;AAAA,IACE,WAAAC;AAAA,IACA,MAAAC;AAAA,IACA,MAAAC;AAAA,IACA,OAAAC;AAAA,IACA,UAAAC;AAAA,IACA,UAAAC,IAAW;AAAA,IACX,kBAAAC,IAAmBC,EAAU;AAAA,IAC7B,UAAAC,IAAW;AAAA,IACX,MAAAC,IAAOC,EAAM;AAAA,IACb,SAAAC,IAAUC,EAA+B;AAAA,IACzC,eAAAC,IAAgBC,EAAoC;AAAA,IACpD,mBAAAC,IAAoB;AAAA,IACpB,YAAAC,IAAa;AAAA,IACb,WAAAC,IAAY;AAAA,IACZ,OAAAC;AAAA,IACA,GAAGC;AAAA,EAAA,GAELC,MACiB;AACjB,UAAMC,IAAe,MAAM;AACzB,cAAQR,GAAA;AAAA,QACN,KAAKC,EAAoC;AACvC,iBAAOC,IACL,gBAAAO,EAACC,GAAA,EAAS,UAAU,IAAI,MAAMC,EAAsBf,CAAI,EAAE,WAAW,SAASD,GAAU,IAExF,gBAAAc,EAACG,GAAA,EAAa,WAAWC,GAA8B;AAAA,QAE3D,KAAKZ,EAAoC;AACvC,iBAAOC,IACL,gBAAAO,EAACK,GAAA,EAAY,UAAU,IAAI,MAAMH,EAAsBf,CAAI,EAAE,WAAW,SAASD,GAAU,IAE3F,gBAAAc,EAACM,GAAA,EAAa,WAAWF,GAA8B;AAAA,QAE3D;AACE,iBAAO;AAAA,MAAA;AAAA,IAEb;AAEA,WACE,gBAAAG;AAAA,MAACC;AAAAA,MAAA;AAAA,QACC,WAAWC,EAAWC,GAAiBhC,CAAS;AAAA,QAChD,KAAAoB;AAAA,QACA,UAAUJ,IAAa,KAAK;AAAA,QAC5B,OAAOP;AAAA,QACP,eAAe,CAAC,CAACL;AAAA,QACjB,mBAAmBE;AAAA,QACnB,UAAUK;AAAA,QACV,qBAAqB,EAAQV,KAAS,EAAQC;AAAA,QAC9C,WAAWM;AAAA,QACX,WAAWH;AAAA,QACX,oBAAoBU;AAAA,QACpB,YAAYE;AAAA,QACZ,sBAAsBD;AAAA,QACrB,GAAGG;AAAA,QAEJ,UAAA;AAAA,UAAA,gBAAAG;AAAA,YAACW;AAAAA,YAAA;AAAA,cACC,UAAA5B;AAAA,cACA,MAAAI;AAAA,cACA,OAAOS,MAAU,CAACD,KAAa,OAAOd,KAAU,WAAWA,IAAQ;AAAA,cAElE,UAAAA;AAAA,YAAA;AAAA,UAAA;AAAA,UAEFQ,MAAYC,EAA+B,QAAQV,KAClD,gBAAAoB,EAACY,GAAA,EAAqB,OAAOzB,GAAM,eAAa,QAAQP,CAAI,IAC1D,UAAA,gBAAAoB,EAACa,GAAA,EAAK,MAAAjC,GAAY,GACpB;AAAA,UAEDS,MAAYC,EAA+B,QAAQX;AAAA,UACnDG,KACC,gBAAAkB;AAAA,YAACc;AAAAA,YAAA;AAAA,cACC,mBAAmB9B;AAAA,cACnB,MAAMkB,EAAsBf,CAAI,EAAE;AAAA,cAClC,UAAS;AAAA,cACT,UAAAJ;AAAA,cACA,OAAOD;AAAA,cAEN,UAAAA;AAAA,YAAA;AAAA,UAAA;AAAA,UAGL,gBAAAkB,EAACe,GAAA,EAA2B,cAAa,CAAE;AAAA,QAAA;AAAA,MAAA;AAAA,IAAA;AAAA,EAGjD;AACF,GAEAC,IAAeC,EAAKzC,CAAQ;"}
1	+ {"version":3,"file":"ListItem.js","sources":["../../../../src/components/ListItem/ListItem.tsx"],"sourcesContent":["import { type ForwardedRef, type ReactElement, forwardRef, memo } from 'react';\r\n\r\nimport classNames from 'classnames';\r\nimport {\r\n Sizes,\r\n Positions,\r\n LIST_ITEM_CLASS,\r\n LIST_ITEM_CHECKED_ICON_CLASS,\r\n} from 'acinguiux-ds-react-base/consts';\r\nimport { ListItemTypes, ListItemConsts } from 'acinguiux-ds-react-base/components/ListItem';\r\n\r\nimport * as Styled from './ListItem.styles';\r\nimport Flag from '../Flag/Flag';\r\nimport type { IListItemProps } from './ListItem.types';\r\nimport Checkbox from '../Checkbox/Checkbox';\r\nimport RadioButton from '../RadioButton/RadioButton';\r\n\r\nconst ListItem = forwardRef(\r\n (\r\n {\r\n className,\r\n icon,\r\n flag,\r\n label,\r\n metaText,\r\n disabled = false,\r\n metaTextPosition = Positions.Right,\r\n selected = false,\r\n size = Sizes.Medium,\r\n variant = ListItemTypes.ListItemVariants.Default,\r\n selectionType = ListItemTypes.ListItemSelectionType.Checkbox,\r\n showInputControls = false,\r\n optionItem = false,\r\n multiline = false,\r\n title,\r\n ...rest\r\n }: IListItemProps,\r\n ref: ForwardedRef<HTMLLIElement>,\r\n ): ReactElement => {\r\n const getSelection = () => {\r\n switch (selectionType) {\r\n case ListItemTypes.ListItemSelectionType.Checkbox:\r\n return showInputControls ? (\r\n <Checkbox tabIndex={-1} size={ListItemConsts.consts[size].inputSize} checked={selected} />\r\n ) : (\r\n <Styled.Check className={LIST_ITEM_CHECKED_ICON_CLASS} />\r\n );\r\n case ListItemTypes.ListItemSelectionType.Radio:\r\n return showInputControls ? (\r\n <RadioButton tabIndex={-1} size={ListItemConsts.consts[size].inputSize} checked={selected} />\r\n ) : (\r\n <Styled.Radio className={LIST_ITEM_CHECKED_ICON_CLASS} />\r\n );\r\n default:\r\n return null;\r\n }\r\n };\r\n\r\n return (\r\n <Styled.ListItemWrapper\r\n className={classNames(LIST_ITEM_CLASS, className)}\r\n ref={ref}\r\n tabIndex={optionItem ? -1 : 0}\r\n $size={size}\r\n $withMetaText={!!metaText}\r\n $metaTextPosition={metaTextPosition}\r\n $variant={variant}\r\n $iconOrFlagProvided={Boolean(icon) \|\| Boolean(flag)}\r\n $selected={selected}\r\n $disabled={disabled}\r\n $showInputControls={showInputControls}\r\n $multiline={multiline}\r\n $ariaInteractiveOnly={optionItem}\r\n {...rest}\r\n >\r\n <Styled.Label\r\n disabled={disabled}\r\n size={size}\r\n title={title ?? (!multiline && typeof label === 'string' ? label : undefined)}\r\n >\r\n {label}\r\n </Styled.Label>\r\n {variant === ListItemTypes.ListItemVariants.Flag && flag && (\r\n <Styled.FlagContainer $size={size} data-testid={`flag-${flag}`}>\r\n <Flag flag={flag} />\r\n </Styled.FlagContainer>\r\n )}\r\n {variant === ListItemTypes.ListItemVariants.Icon && icon}\r\n {metaText && (\r\n <Styled.MetaText\r\n $metaTextPosition={metaTextPosition}\r\n size={ListItemConsts.consts[size].metaSize}\r\n contrast=\"subtle\"\r\n disabled={disabled}\r\n title={metaText}\r\n >\r\n {metaText}\r\n </Styled.MetaText>\r\n )}\r\n <Styled.SelectionContainer>{getSelection()}</Styled.SelectionContainer>\r\n </Styled.ListItemWrapper>\r\n );\r\n },\r\n);\r\n\r\nexport default memo(ListItem);\r\n"],"names":["ListItem","forwardRef","className","icon","flag","label","metaText","disabled","metaTextPosition","Positions","selected","size","Sizes","variant","ListItemTypes.ListItemVariants","selectionType","ListItemTypes.ListItemSelectionType","showInputControls","optionItem","multiline","title","rest","ref","getSelection","jsx","Checkbox","ListItemConsts.consts","Styled.Check","LIST_ITEM_CHECKED_ICON_CLASS","RadioButton","Styled.Radio","jsxs","Styled.ListItemWrapper","classNames","LIST_ITEM_CLASS","Styled.Label","Styled.FlagContainer","Flag","Styled.MetaText","Styled.SelectionContainer","ListItem$1","memo"],"mappings":";;;;;;;;;;;AAiBA,MAAMA,IAAWC;AAAA,EACf,CACE;AAAA,IACE,WAAAC;AAAA,IACA,MAAAC;AAAA,IACA,MAAAC;AAAA,IACA,OAAAC;AAAA,IACA,UAAAC;AAAA,IACA,UAAAC,IAAW;AAAA,IACX,kBAAAC,IAAmBC,EAAU;AAAA,IAC7B,UAAAC,IAAW;AAAA,IACX,MAAAC,IAAOC,EAAM;AAAA,IACb,SAAAC,IAAUC,EAA+B;AAAA,IACzC,eAAAC,IAAgBC,EAAoC;AAAA,IACpD,mBAAAC,IAAoB;AAAA,IACpB,YAAAC,IAAa;AAAA,IACb,WAAAC,IAAY;AAAA,IACZ,OAAAC;AAAA,IACA,GAAGC;AAAA,EAAA,GAELC,MACiB;AACjB,UAAMC,IAAe,MAAM;AACzB,cAAQR,GAAA;AAAA,QACN,KAAKC,EAAoC;AACvC,iBAAOC,IACL,gBAAAO,EAACC,GAAA,EAAS,UAAU,IAAI,MAAMC,EAAsBf,CAAI,EAAE,WAAW,SAASD,GAAU,IAExF,gBAAAc,EAACG,GAAA,EAAa,WAAWC,GAA8B;AAAA,QAE3D,KAAKZ,EAAoC;AACvC,iBAAOC,IACL,gBAAAO,EAACK,GAAA,EAAY,UAAU,IAAI,MAAMH,EAAsBf,CAAI,EAAE,WAAW,SAASD,GAAU,IAE3F,gBAAAc,EAACM,GAAA,EAAa,WAAWF,GAA8B;AAAA,QAE3D;AACE,iBAAO;AAAA,MAAA;AAAA,IAEb;AAEA,WACE,gBAAAG;AAAA,MAACC;AAAAA,MAAA;AAAA,QACC,WAAWC,EAAWC,GAAiBhC,CAAS;AAAA,QAChD,KAAAoB;AAAA,QACA,UAAUJ,IAAa,KAAK;AAAA,QAC5B,OAAOP;AAAA,QACP,eAAe,CAAC,CAACL;AAAA,QACjB,mBAAmBE;AAAA,QACnB,UAAUK;AAAA,QACV,qBAAqB,EAAQV,KAAS,EAAQC;AAAA,QAC9C,WAAWM;AAAA,QACX,WAAWH;AAAA,QACX,oBAAoBU;AAAA,QACpB,YAAYE;AAAA,QACZ,sBAAsBD;AAAA,QACrB,GAAGG;AAAA,QAEJ,UAAA;AAAA,UAAA,gBAAAG;AAAA,YAACW;AAAAA,YAAA;AAAA,cACC,UAAA5B;AAAA,cACA,MAAAI;AAAA,cACA,OAAOS,MAAU,CAACD,KAAa,OAAOd,KAAU,WAAWA,IAAQ;AAAA,cAElE,UAAAA;AAAA,YAAA;AAAA,UAAA;AAAA,UAEFQ,MAAYC,EAA+B,QAAQV,KAClD,gBAAAoB,EAACY,GAAA,EAAqB,OAAOzB,GAAM,eAAa,QAAQP,CAAI,IAC1D,UAAA,gBAAAoB,EAACa,GAAA,EAAK,MAAAjC,GAAY,GACpB;AAAA,UAEDS,MAAYC,EAA+B,QAAQX;AAAA,UACnDG,KACC,gBAAAkB;AAAA,YAACc;AAAAA,YAAA;AAAA,cACC,mBAAmB9B;AAAA,cACnB,MAAMkB,EAAsBf,CAAI,EAAE;AAAA,cAClC,UAAS;AAAA,cACT,UAAAJ;AAAA,cACA,OAAOD;AAAA,cAEN,UAAAA;AAAA,YAAA;AAAA,UAAA;AAAA,UAGL,gBAAAkB,EAACe,GAAA,EAA2B,cAAa,CAAE;AAAA,QAAA;AAAA,MAAA;AAAA,IAAA;AAAA,EAGjD;AACF,GAEAC,IAAeC,EAAKzC,CAAQ;"}

package/build/esm/components/ListItem/ListItem.styles.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ListItem.styles.js","sources":["../../../../src/components/ListItem/ListItem.styles.ts"],"sourcesContent":["import { styled, css } from 'styled-components';\nimport { FabricsVariables } from 'acinguiux-ds-fabrics';\nimport { ICON_CLASS, Sizes } from 'acinguiux-ds-react-base/consts';\nimport { Variables } from 'acinguiux-ds-react-base/theme';\nimport { getFocusStyles } from 'acinguiux-ds-react-base/utils/stylesUtils';\nimport { ListItemConsts } from 'acinguiux-ds-react-base/components/ListItem';\n\nimport BaseCheck from '../Icon/components/Check';\nimport BaseLabel from '../Text/components/Label/Label';\nimport type { ListItemWrapperProps, PropsWithRequiredSize } from './ListItem.types';\nimport { getGridTemplateStyles } from './ListItem.utils';\n\nconst Check = styled(BaseCheck)`\n transition: opacity 200ms;\n`;\n\nconst Radio = styled.div`\n background-color: currentColor;\n width: 7px;\n height: 7px;\n border-radius: 100%;\n transition: opacity 200ms;\n`;\n\nconst SelectionContainer = styled.div`\n pointer-events: none;\n grid-area: selection;\n display: flex;\n justify-content: center;\n align-items: center;\n`;\n\nconst FlagContainer = styled.div<PropsWithRequiredSize>(\n ({ $size }) => css`\n grid-area: icon;\n display: flex;\n align-items: center;\n justify-content: center;\n border-radius: 100%;\n font-size: ${ListItemConsts.consts[$size].iconSize}px;\n `,\n);\n\nconst Label = styled(BaseLabel)`\n grid-area: label;\n cursor: default;\n`;\n\nconst MetaText = styled(BaseLabel)<Pick<ListItemWrapperProps, '$metaTextPosition'>>(\n ({ $metaTextPosition }) => css`\n grid-area: meta;\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n cursor: default;\n\n ${$metaTextPosition === 'right' &&\n css`\n text-align: right;\n `};\n `,\n);\n\nconst ListItemWrapper = styled.li<ListItemWrapperProps>`\n ${({\n theme,\n $metaTextPosition,\n $size,\n $ariaInteractiveOnly,\n $variant,\n $selected,\n $withMetaText,\n $disabled,\n $iconOrFlagProvided,\n $showInputControls,\n $multiline,\n }) => {\n const hoverLayer = theme.layer({ state: 'hover' });\n const activeLayer = theme.layer({ state: 'press' });\n const disabledLayer = theme.layer({ disabled: true });\n\n return css`\n display: grid;\n align-items: start;\n width: 100%;\n column-gap: ${ListItemConsts.consts[$size].gap}px;\n border-radius: 4px;\n padding: ${ListItemConsts.consts[$size].padding.vertical}px ${ListItemConsts.consts[$size].padding.horizontal}px;\n box-sizing: border-box;\n transition: background-color 0.3s ease-out;\n\n ${getGridTemplateStyles({\n $metaTextPosition,\n $variant,\n $selected,\n $withMetaText,\n $iconOrFlagProvided,\n $showInputControls,\n iconSize: ListItemConsts.consts[$size].iconSize,\n })}\n\n .${ICON_CLASS}, ${Check} {\n grid-area: icon;\n display: block;\n width: ${ListItemConsts.consts[$size].iconSize}px;\n height: ${ListItemConsts.consts[$size].iconSize}px;\n }\n\n ${SelectionContainer} {\n width: ${ListItemConsts.consts[$size].iconSize}px;\n height: ${ListItemConsts.consts[$size].iconSize}px;\n }\n\n ${MetaText} {\n margin: ${$size === Sizes.Medium ? '0' : '2px 0'};\n }\n\n ${Check},\n ${Radio} {\n opacity: 0;\n }\n\n ${!$multiline &&\n css`\n ${Label} {\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n }\n `}\n\n ${$disabled &&\n css`\n ${FlagContainer} svg {\n opacity: 0.3;\n }\n background-color: ${disabledLayer[Variables.BackgroundFoundation]};\n color: ${disabledLayer[Variables.TextOnFoundationStrong]};\n cursor: not-allowed;\n `}\n\n ${!$disabled &&\n css`\n &[aria-selected='true'] {\n background-color: ${hoverLayer[Variables.BackgroundFoundation]};\n }\n\n &[aria-selected='true']:active {\n background-color: ${activeLayer[Variables.BackgroundFoundation]};\n }\n ${!$ariaInteractiveOnly &&\n css`\n &:hover {\n background-color: ${hoverLayer[Variables.BackgroundFoundation]};\n }\n\n &:active {\n background-color: ${activeLayer[Variables.BackgroundFoundation]};\n }\n `}\n `}\n\n ${$selected &&\n css`\n background-color: ${$showInputControls\n ? 'transparent'\n : theme.layer({ disabled: $disabled, selectedProminence: 'subtle' })[Variables.BackgroundSelected]};\n\n ${Check},\n ${Radio} {\n opacity: 1;\n }\n\n &[aria-selected='true'] {\n background-color: ${theme.layer({\n disabled: $disabled,\n selectedProminence: 'subtle',\n state: FabricsVariables.States.Hover,\n })[Variables.BackgroundSelected]};\n }\n\n &[aria-selected='true']:active {\n background-color: ${theme.layer({\n disabled: $disabled,\n selectedProminence: 'subtle',\n state: FabricsVariables.States.Press,\n })[Variables.BackgroundSelected]};\n }\n\n ${!$ariaInteractiveOnly &&\n css`\n &:hover {\n background-color: ${theme.layer({\n disabled: $disabled,\n selectedProminence: 'subtle',\n state: FabricsVariables.States.Hover,\n })[Variables.BackgroundSelected]};\n }\n\n &:active {\n background-color: ${theme.layer({\n disabled: $disabled,\n selectedProminence: 'subtle',\n state: FabricsVariables.States.Press,\n })[Variables.BackgroundSelected]};\n }\n `}\n `}\n \n &:focus-visible {\n ${getFocusStyles(theme)};\n }\n `;\n }};\n`;\n\nexport { ListItemWrapper, FlagContainer, Label, MetaText, Check, Radio, SelectionContainer };\n"],"names":["Check","styled","BaseCheck","Radio","SelectionContainer","FlagContainer","$size","css","ListItemConsts.consts","Label","BaseLabel","MetaText","$metaTextPosition","ListItemWrapper","theme","$ariaInteractiveOnly","$variant","$selected","$withMetaText","$disabled","$iconOrFlagProvided","$showInputControls","$multiline","hoverLayer","activeLayer","disabledLayer","getGridTemplateStyles","ICON_CLASS","Sizes","Variables","FabricsVariables","getFocusStyles"],"mappings":"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"}
1	+ {"version":3,"file":"ListItem.styles.js","sources":["../../../../src/components/ListItem/ListItem.styles.ts"],"sourcesContent":["import { styled, css } from 'styled-components';\r\nimport { FabricsVariables } from 'acinguiux-ds-fabrics';\r\nimport { ICON_CLASS, Sizes } from 'acinguiux-ds-react-base/consts';\r\nimport { Variables } from 'acinguiux-ds-react-base/theme';\r\nimport { getFocusStyles } from 'acinguiux-ds-react-base/utils/stylesUtils';\r\nimport { ListItemConsts } from 'acinguiux-ds-react-base/components/ListItem';\r\n\r\nimport BaseCheck from '../Icon/components/Check';\r\nimport BaseLabel from '../Text/components/Label/Label';\r\nimport type { ListItemWrapperProps, PropsWithRequiredSize } from './ListItem.types';\r\nimport { getGridTemplateStyles } from './ListItem.utils';\r\n\r\nconst Check = styled(BaseCheck)`\r\n transition: opacity 200ms;\r\n`;\r\n\r\nconst Radio = styled.div`\r\n background-color: currentColor;\r\n width: 7px;\r\n height: 7px;\r\n border-radius: 100%;\r\n transition: opacity 200ms;\r\n`;\r\n\r\nconst SelectionContainer = styled.div`\r\n pointer-events: none;\r\n grid-area: selection;\r\n display: flex;\r\n justify-content: center;\r\n align-items: center;\r\n`;\r\n\r\nconst FlagContainer = styled.div<PropsWithRequiredSize>(\r\n ({ $size }) => css`\r\n grid-area: icon;\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n border-radius: 100%;\r\n font-size: ${ListItemConsts.consts[$size].iconSize}px;\r\n `,\r\n);\r\n\r\nconst Label = styled(BaseLabel)`\r\n grid-area: label;\r\n cursor: default;\r\n`;\r\n\r\nconst MetaText = styled(BaseLabel)<Pick<ListItemWrapperProps, '$metaTextPosition'>>(\r\n ({ $metaTextPosition }) => css`\r\n grid-area: meta;\r\n overflow: hidden;\r\n text-overflow: ellipsis;\r\n white-space: nowrap;\r\n cursor: default;\r\n\r\n ${$metaTextPosition === 'right' &&\r\n css`\r\n text-align: right;\r\n `};\r\n `,\r\n);\r\n\r\nconst ListItemWrapper = styled.li<ListItemWrapperProps>`\r\n ${({\r\n theme,\r\n $metaTextPosition,\r\n $size,\r\n $ariaInteractiveOnly,\r\n $variant,\r\n $selected,\r\n $withMetaText,\r\n $disabled,\r\n $iconOrFlagProvided,\r\n $showInputControls,\r\n $multiline,\r\n }) => {\r\n const hoverLayer = theme.layer({ state: 'hover' });\r\n const activeLayer = theme.layer({ state: 'press' });\r\n const disabledLayer = theme.layer({ disabled: true });\r\n\r\n return css`\r\n display: grid;\r\n align-items: start;\r\n width: 100%;\r\n column-gap: ${ListItemConsts.consts[$size].gap}px;\r\n border-radius: 4px;\r\n padding: ${ListItemConsts.consts[$size].padding.vertical}px ${ListItemConsts.consts[$size].padding.horizontal}px;\r\n box-sizing: border-box;\r\n transition: background-color 0.3s ease-out;\r\n\r\n ${getGridTemplateStyles({\r\n $metaTextPosition,\r\n $variant,\r\n $selected,\r\n $withMetaText,\r\n $iconOrFlagProvided,\r\n $showInputControls,\r\n iconSize: ListItemConsts.consts[$size].iconSize,\r\n })}\r\n\r\n .${ICON_CLASS}, ${Check} {\r\n grid-area: icon;\r\n display: block;\r\n width: ${ListItemConsts.consts[$size].iconSize}px;\r\n height: ${ListItemConsts.consts[$size].iconSize}px;\r\n }\r\n\r\n ${SelectionContainer} {\r\n width: ${ListItemConsts.consts[$size].iconSize}px;\r\n height: ${ListItemConsts.consts[$size].iconSize}px;\r\n }\r\n\r\n ${MetaText} {\r\n margin: ${$size === Sizes.Medium ? '0' : '2px 0'};\r\n }\r\n\r\n ${Check},\r\n ${Radio} {\r\n opacity: 0;\r\n }\r\n\r\n ${!$multiline &&\r\n css`\r\n ${Label} {\r\n overflow: hidden;\r\n text-overflow: ellipsis;\r\n white-space: nowrap;\r\n }\r\n `}\r\n\r\n ${$disabled &&\r\n css`\r\n ${FlagContainer} svg {\r\n opacity: 0.3;\r\n }\r\n background-color: ${disabledLayer[Variables.BackgroundFoundation]};\r\n color: ${disabledLayer[Variables.TextOnFoundationStrong]};\r\n cursor: not-allowed;\r\n `}\r\n\r\n ${!$disabled &&\r\n css`\r\n &[aria-selected='true'] {\r\n background-color: ${hoverLayer[Variables.BackgroundFoundation]};\r\n }\r\n\r\n &[aria-selected='true']:active {\r\n background-color: ${activeLayer[Variables.BackgroundFoundation]};\r\n }\r\n ${!$ariaInteractiveOnly &&\r\n css`\r\n &:hover {\r\n background-color: ${hoverLayer[Variables.BackgroundFoundation]};\r\n }\r\n\r\n &:active {\r\n background-color: ${activeLayer[Variables.BackgroundFoundation]};\r\n }\r\n `}\r\n `}\r\n\r\n ${$selected &&\r\n css`\r\n background-color: ${$showInputControls\r\n ? 'transparent'\r\n : theme.layer({ disabled: $disabled, selectedProminence: 'subtle' })[Variables.BackgroundSelected]};\r\n\r\n ${Check},\r\n ${Radio} {\r\n opacity: 1;\r\n }\r\n\r\n &[aria-selected='true'] {\r\n background-color: ${theme.layer({\r\n disabled: $disabled,\r\n selectedProminence: 'subtle',\r\n state: FabricsVariables.States.Hover,\r\n })[Variables.BackgroundSelected]};\r\n }\r\n\r\n &[aria-selected='true']:active {\r\n background-color: ${theme.layer({\r\n disabled: $disabled,\r\n selectedProminence: 'subtle',\r\n state: FabricsVariables.States.Press,\r\n })[Variables.BackgroundSelected]};\r\n }\r\n\r\n ${!$ariaInteractiveOnly &&\r\n css`\r\n &:hover {\r\n background-color: ${theme.layer({\r\n disabled: $disabled,\r\n selectedProminence: 'subtle',\r\n state: FabricsVariables.States.Hover,\r\n })[Variables.BackgroundSelected]};\r\n }\r\n\r\n &:active {\r\n background-color: ${theme.layer({\r\n disabled: $disabled,\r\n selectedProminence: 'subtle',\r\n state: FabricsVariables.States.Press,\r\n })[Variables.BackgroundSelected]};\r\n }\r\n `}\r\n `}\r\n \r\n &:focus-visible {\r\n ${getFocusStyles(theme)};\r\n }\r\n `;\r\n }};\r\n`;\r\n\r\nexport { ListItemWrapper, FlagContainer, Label, MetaText, Check, Radio, SelectionContainer };\r\n"],"names":["Check","styled","BaseCheck","Radio","SelectionContainer","FlagContainer","$size","css","ListItemConsts.consts","Label","BaseLabel","MetaText","$metaTextPosition","ListItemWrapper","theme","$ariaInteractiveOnly","$variant","$selected","$withMetaText","$disabled","$iconOrFlagProvided","$showInputControls","$multiline","hoverLayer","activeLayer","disabledLayer","getGridTemplateStyles","ICON_CLASS","Sizes","Variables","FabricsVariables","getFocusStyles"],"mappings":"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"}

package/build/esm/components/ListItem/ListItem.utils.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ListItem.utils.js","sources":["../../../../src/components/ListItem/ListItem.utils.ts"],"sourcesContent":["import { css } from 'styled-components';\nimport { Positions } from 'acinguiux-ds-react-base/consts';\n\nimport { ListItemWrapperProps } from './ListItem.types';\n\nconst getTemplate = (...arr: (string \| boolean)[]) => {\n return arr.filter((str) => !!str).join(' ');\n};\n\ntype ListItemGridTemplateKeys =\n \| '$metaTextPosition'\n \| '$selected'\n \| '$variant'\n \| '$withMetaText'\n \| '$iconOrFlagProvided'\n \| '$showInputControls';\n\nexport const getGridTemplateStyles = ({\n $withMetaText,\n $metaTextPosition,\n $variant,\n $iconOrFlagProvided,\n $showInputControls = false,\n iconSize,\n}: Partial<Pick<ListItemWrapperProps, ListItemGridTemplateKeys>> & { iconSize: number }) => {\n const showIconArea = $variant !== 'default' && Boolean($iconOrFlagProvided);\n\n const labelArea = 'label';\n const labelColumns = '1fr';\n\n const metaArea = 'meta';\n const metaColumns = 'fit-content(25%)';\n\n const selectionAreaEmpty = '.';\n const selectionArea = 'selection';\n const selectionColumns = `${iconSize}px`;\n\n const iconAreaEmpty = showIconArea && '.';\n const iconArea = showIconArea && 'icon';\n const iconColumns = showIconArea && `${iconSize}px`;\n\n const defaultStyle = $showInputControls\n ? css`\n grid-template-areas: '${getTemplate(selectionArea, iconArea, labelArea)}';\n grid-template-columns: ${getTemplate(selectionColumns, iconColumns, labelColumns)};\n `\n : css`\n grid-template-areas: '${getTemplate(iconArea, labelArea, selectionArea)}';\n grid-template-columns: ${getTemplate(iconColumns, labelColumns, selectionColumns)};\n `;\n\n if (!$withMetaText) {\n return defaultStyle;\n }\n\n if ($showInputControls) {\n switch ($metaTextPosition) {\n case Positions.Top:\n return css`\n grid-template-areas:\n '${getTemplate(selectionAreaEmpty, iconAreaEmpty, metaArea)}'\n '${getTemplate(selectionArea, iconArea, labelArea)}';\n grid-template-columns: ${getTemplate(selectionColumns, iconColumns, labelColumns)};\n `;\n case Positions.Bottom:\n return css`\n grid-template-areas:\n '${getTemplate(selectionArea, iconArea, labelArea)}'\n '${getTemplate(selectionAreaEmpty, iconAreaEmpty, metaArea)}';\n grid-template-columns: ${getTemplate(selectionColumns, iconColumns, labelColumns)};\n `;\n case Positions.Right:\n return css`\n grid-template-areas: '${getTemplate(selectionArea, iconArea, labelArea, metaArea)}';\n grid-template-columns: ${getTemplate(selectionColumns, iconColumns, labelColumns, metaColumns)};\n `;\n default:\n return defaultStyle;\n }\n }\n\n switch ($metaTextPosition) {\n case Positions.Top:\n return css`\n grid-template-areas:\n '${getTemplate(iconAreaEmpty, metaArea, selectionAreaEmpty)}'\n '${getTemplate(iconArea, labelArea, selectionArea)}';\n grid-template-columns: ${getTemplate(iconColumns, labelColumns, selectionColumns)};\n `;\n case Positions.Bottom:\n return css`\n grid-template-areas:\n '${getTemplate(iconArea, labelArea, selectionArea)}'\n '${getTemplate(iconAreaEmpty, metaArea, selectionAreaEmpty)}';\n grid-template-columns: ${getTemplate(iconColumns, labelColumns, selectionColumns)};\n `;\n case Positions.Right:\n return css`\n grid-template-areas: '${getTemplate(iconArea, labelArea, metaArea, selectionArea)}';\n grid-template-columns: ${getTemplate(iconColumns, labelColumns, metaColumns, selectionColumns)};\n `;\n default:\n return defaultStyle;\n }\n};\n"],"names":["getTemplate","arr","str","getGridTemplateStyles","$withMetaText","$metaTextPosition","$variant","$iconOrFlagProvided","$showInputControls","iconSize","showIconArea","labelArea","labelColumns","metaArea","metaColumns","selectionAreaEmpty","selectionArea","selectionColumns","iconAreaEmpty","iconArea","iconColumns","defaultStyle","css","Positions"],"mappings":";;AAKA,MAAMA,IAAc,IAAIC,MACfA,EAAI,OAAO,CAACC,MAAQ,CAAC,CAACA,CAAG,EAAE,KAAK,GAAG,GAW/BC,IAAwB,CAAC;AAAA,EACpC,eAAAC;AAAA,EACA,mBAAAC;AAAA,EACA,UAAAC;AAAA,EACA,qBAAAC;AAAA,EACA,oBAAAC,IAAqB;AAAA,EACrB,UAAAC;AACF,MAA4F;AAC1F,QAAMC,IAAeJ,MAAa,aAAa,EAAQC,GAEjDI,IAAY,SACZC,IAAe,OAEfC,IAAW,QACXC,IAAc,oBAEdC,IAAqB,KACrBC,IAAgB,aAChBC,IAAmB,GAAGR,CAAQ,MAE9BS,IAAgBR,KAAgB,KAChCS,IAAWT,KAAgB,QAC3BU,IAAcV,KAAgB,GAAGD,CAAQ,MAEzCY,IAAeb,IACjBc;AAAA,gCAC0BtB,EAAYgB,GAAeG,GAAUR,CAAS,CAAC;AAAA,iCAC9CX,EAAYiB,GAAkBG,GAAaR,CAAY,CAAC;AAAA,UAEnFU;AAAA,gCAC0BtB,EAAYmB,GAAUR,GAAWK,CAAa,CAAC;AAAA,iCAC9ChB,EAAYoB,GAAaR,GAAcK,CAAgB,CAAC;AAAA;AAGvF,MAAI,CAACb;AACH,WAAOiB;AAGT,MAAIb;AACF,YAAQH,GAAA;AAAA,MACN,KAAKkB,EAAU;AACb,eAAOD;AAAA;AAAA,eAEAtB,EAAYe,GAAoBG,GAAeL,CAAQ,CAAC;AAAA,eACxDb,EAAYgB,GAAeG,GAAUR,CAAS,CAAC;AAAA,mCAC3BX,EAAYiB,GAAkBG,GAAaR,CAAY,CAAC;AAAA;AAAA,MAErF,KAAKW,EAAU;AACb,eAAOD;AAAA;AAAA,eAEAtB,EAAYgB,GAAeG,GAAUR,CAAS,CAAC;AAAA,eAC/CX,EAAYe,GAAoBG,GAAeL,CAAQ,CAAC;AAAA,mCACpCb,EAAYiB,GAAkBG,GAAaR,CAAY,CAAC;AAAA;AAAA,MAErF,KAAKW,EAAU;AACb,eAAOD;AAAA,kCACmBtB,EAAYgB,GAAeG,GAAUR,GAAWE,CAAQ,CAAC;AAAA,mCACxDb,EAAYiB,GAAkBG,GAAaR,GAAcE,CAAW,CAAC;AAAA;AAAA,MAElG;AACE,eAAOO;AAAA,IAAA;AAIb,UAAQhB,GAAA;AAAA,IACN,KAAKkB,EAAU;AACb,aAAOD;AAAA;AAAA,aAEAtB,EAAYkB,GAAeL,GAAUE,CAAkB,CAAC;AAAA,aACxDf,EAAYmB,GAAUR,GAAWK,CAAa,CAAC;AAAA,iCAC3BhB,EAAYoB,GAAaR,GAAcK,CAAgB,CAAC;AAAA;AAAA,IAErF,KAAKM,EAAU;AACb,aAAOD;AAAA;AAAA,aAEAtB,EAAYmB,GAAUR,GAAWK,CAAa,CAAC;AAAA,aAC/ChB,EAAYkB,GAAeL,GAAUE,CAAkB,CAAC;AAAA,iCACpCf,EAAYoB,GAAaR,GAAcK,CAAgB,CAAC;AAAA;AAAA,IAErF,KAAKM,EAAU;AACb,aAAOD;AAAA,gCACmBtB,EAAYmB,GAAUR,GAAWE,GAAUG,CAAa,CAAC;AAAA,iCACxDhB,EAAYoB,GAAaR,GAAcE,GAAaG,CAAgB,CAAC;AAAA;AAAA,IAElG;AACE,aAAOI;AAAA,EAAA;AAEb;"}
1	+ {"version":3,"file":"ListItem.utils.js","sources":["../../../../src/components/ListItem/ListItem.utils.ts"],"sourcesContent":["import { css } from 'styled-components';\r\nimport { Positions } from 'acinguiux-ds-react-base/consts';\r\n\r\nimport { ListItemWrapperProps } from './ListItem.types';\r\n\r\nconst getTemplate = (...arr: (string \| boolean)[]) => {\r\n return arr.filter((str) => !!str).join(' ');\r\n};\r\n\r\ntype ListItemGridTemplateKeys =\r\n \| '$metaTextPosition'\r\n \| '$selected'\r\n \| '$variant'\r\n \| '$withMetaText'\r\n \| '$iconOrFlagProvided'\r\n \| '$showInputControls';\r\n\r\nexport const getGridTemplateStyles = ({\r\n $withMetaText,\r\n $metaTextPosition,\r\n $variant,\r\n $iconOrFlagProvided,\r\n $showInputControls = false,\r\n iconSize,\r\n}: Partial<Pick<ListItemWrapperProps, ListItemGridTemplateKeys>> & { iconSize: number }) => {\r\n const showIconArea = $variant !== 'default' && Boolean($iconOrFlagProvided);\r\n\r\n const labelArea = 'label';\r\n const labelColumns = '1fr';\r\n\r\n const metaArea = 'meta';\r\n const metaColumns = 'fit-content(25%)';\r\n\r\n const selectionAreaEmpty = '.';\r\n const selectionArea = 'selection';\r\n const selectionColumns = `${iconSize}px`;\r\n\r\n const iconAreaEmpty = showIconArea && '.';\r\n const iconArea = showIconArea && 'icon';\r\n const iconColumns = showIconArea && `${iconSize}px`;\r\n\r\n const defaultStyle = $showInputControls\r\n ? css`\r\n grid-template-areas: '${getTemplate(selectionArea, iconArea, labelArea)}';\r\n grid-template-columns: ${getTemplate(selectionColumns, iconColumns, labelColumns)};\r\n `\r\n : css`\r\n grid-template-areas: '${getTemplate(iconArea, labelArea, selectionArea)}';\r\n grid-template-columns: ${getTemplate(iconColumns, labelColumns, selectionColumns)};\r\n `;\r\n\r\n if (!$withMetaText) {\r\n return defaultStyle;\r\n }\r\n\r\n if ($showInputControls) {\r\n switch ($metaTextPosition) {\r\n case Positions.Top:\r\n return css`\r\n grid-template-areas:\r\n '${getTemplate(selectionAreaEmpty, iconAreaEmpty, metaArea)}'\r\n '${getTemplate(selectionArea, iconArea, labelArea)}';\r\n grid-template-columns: ${getTemplate(selectionColumns, iconColumns, labelColumns)};\r\n `;\r\n case Positions.Bottom:\r\n return css`\r\n grid-template-areas:\r\n '${getTemplate(selectionArea, iconArea, labelArea)}'\r\n '${getTemplate(selectionAreaEmpty, iconAreaEmpty, metaArea)}';\r\n grid-template-columns: ${getTemplate(selectionColumns, iconColumns, labelColumns)};\r\n `;\r\n case Positions.Right:\r\n return css`\r\n grid-template-areas: '${getTemplate(selectionArea, iconArea, labelArea, metaArea)}';\r\n grid-template-columns: ${getTemplate(selectionColumns, iconColumns, labelColumns, metaColumns)};\r\n `;\r\n default:\r\n return defaultStyle;\r\n }\r\n }\r\n\r\n switch ($metaTextPosition) {\r\n case Positions.Top:\r\n return css`\r\n grid-template-areas:\r\n '${getTemplate(iconAreaEmpty, metaArea, selectionAreaEmpty)}'\r\n '${getTemplate(iconArea, labelArea, selectionArea)}';\r\n grid-template-columns: ${getTemplate(iconColumns, labelColumns, selectionColumns)};\r\n `;\r\n case Positions.Bottom:\r\n return css`\r\n grid-template-areas:\r\n '${getTemplate(iconArea, labelArea, selectionArea)}'\r\n '${getTemplate(iconAreaEmpty, metaArea, selectionAreaEmpty)}';\r\n grid-template-columns: ${getTemplate(iconColumns, labelColumns, selectionColumns)};\r\n `;\r\n case Positions.Right:\r\n return css`\r\n grid-template-areas: '${getTemplate(iconArea, labelArea, metaArea, selectionArea)}';\r\n grid-template-columns: ${getTemplate(iconColumns, labelColumns, metaColumns, selectionColumns)};\r\n `;\r\n default:\r\n return defaultStyle;\r\n }\r\n};\r\n"],"names":["getTemplate","arr","str","getGridTemplateStyles","$withMetaText","$metaTextPosition","$variant","$iconOrFlagProvided","$showInputControls","iconSize","showIconArea","labelArea","labelColumns","metaArea","metaColumns","selectionAreaEmpty","selectionArea","selectionColumns","iconAreaEmpty","iconArea","iconColumns","defaultStyle","css","Positions"],"mappings":";;AAKA,MAAMA,IAAc,IAAIC,MACfA,EAAI,OAAO,CAACC,MAAQ,CAAC,CAACA,CAAG,EAAE,KAAK,GAAG,GAW/BC,IAAwB,CAAC;AAAA,EACpC,eAAAC;AAAA,EACA,mBAAAC;AAAA,EACA,UAAAC;AAAA,EACA,qBAAAC;AAAA,EACA,oBAAAC,IAAqB;AAAA,EACrB,UAAAC;AACF,MAA4F;AAC1F,QAAMC,IAAeJ,MAAa,aAAa,EAAQC,GAEjDI,IAAY,SACZC,IAAe,OAEfC,IAAW,QACXC,IAAc,oBAEdC,IAAqB,KACrBC,IAAgB,aAChBC,IAAmB,GAAGR,CAAQ,MAE9BS,IAAgBR,KAAgB,KAChCS,IAAWT,KAAgB,QAC3BU,IAAcV,KAAgB,GAAGD,CAAQ,MAEzCY,IAAeb,IACjBc;AAAA,gCAC0BtB,EAAYgB,GAAeG,GAAUR,CAAS,CAAC;AAAA,iCAC9CX,EAAYiB,GAAkBG,GAAaR,CAAY,CAAC;AAAA,UAEnFU;AAAA,gCAC0BtB,EAAYmB,GAAUR,GAAWK,CAAa,CAAC;AAAA,iCAC9ChB,EAAYoB,GAAaR,GAAcK,CAAgB,CAAC;AAAA;AAGvF,MAAI,CAACb;AACH,WAAOiB;AAGT,MAAIb;AACF,YAAQH,GAAA;AAAA,MACN,KAAKkB,EAAU;AACb,eAAOD;AAAA;AAAA,eAEAtB,EAAYe,GAAoBG,GAAeL,CAAQ,CAAC;AAAA,eACxDb,EAAYgB,GAAeG,GAAUR,CAAS,CAAC;AAAA,mCAC3BX,EAAYiB,GAAkBG,GAAaR,CAAY,CAAC;AAAA;AAAA,MAErF,KAAKW,EAAU;AACb,eAAOD;AAAA;AAAA,eAEAtB,EAAYgB,GAAeG,GAAUR,CAAS,CAAC;AAAA,eAC/CX,EAAYe,GAAoBG,GAAeL,CAAQ,CAAC;AAAA,mCACpCb,EAAYiB,GAAkBG,GAAaR,CAAY,CAAC;AAAA;AAAA,MAErF,KAAKW,EAAU;AACb,eAAOD;AAAA,kCACmBtB,EAAYgB,GAAeG,GAAUR,GAAWE,CAAQ,CAAC;AAAA,mCACxDb,EAAYiB,GAAkBG,GAAaR,GAAcE,CAAW,CAAC;AAAA;AAAA,MAElG;AACE,eAAOO;AAAA,IAAA;AAIb,UAAQhB,GAAA;AAAA,IACN,KAAKkB,EAAU;AACb,aAAOD;AAAA;AAAA,aAEAtB,EAAYkB,GAAeL,GAAUE,CAAkB,CAAC;AAAA,aACxDf,EAAYmB,GAAUR,GAAWK,CAAa,CAAC;AAAA,iCAC3BhB,EAAYoB,GAAaR,GAAcK,CAAgB,CAAC;AAAA;AAAA,IAErF,KAAKM,EAAU;AACb,aAAOD;AAAA;AAAA,aAEAtB,EAAYmB,GAAUR,GAAWK,CAAa,CAAC;AAAA,aAC/ChB,EAAYkB,GAAeL,GAAUE,CAAkB,CAAC;AAAA,iCACpCf,EAAYoB,GAAaR,GAAcK,CAAgB,CAAC;AAAA;AAAA,IAErF,KAAKM,EAAU;AACb,aAAOD;AAAA,gCACmBtB,EAAYmB,GAAUR,GAAWE,GAAUG,CAAa,CAAC;AAAA,iCACxDhB,EAAYoB,GAAaR,GAAcE,GAAaG,CAAgB,CAAC;AAAA;AAAA,IAElG;AACE,aAAOI;AAAA,EAAA;AAEb;"}

package/build/esm/components/ListItem/ListItemHeader.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ListItemHeader.js","sources":["../../../../src/components/ListItem/ListItemHeader.tsx"],"sourcesContent":["import { type ForwardedRef, type ReactElement, forwardRef } from 'react';\n\nimport classNames from 'classnames';\nimport { Sizes, Contrasts, LIST_ITEM_HEADER_CLASS } from 'acinguiux-ds-react-base/consts';\nimport { ListItemTypes, ListItemHeaderConsts } from 'acinguiux-ds-react-base/components/ListItem';\n\nimport * as Styled from './ListItemHeader.styles';\nimport * as ListItemStyled from './ListItem.styles';\nimport Flag from '../Flag/Flag';\nimport type { IListItemHeaderProps } from './ListItem.types';\n\nconst ListItemHeader = forwardRef(\n (\n {\n className,\n icon,\n flag,\n label,\n divider = true,\n size = Sizes.Medium,\n variant = ListItemTypes.ListItemVariants.Default,\n ...rest\n }: IListItemHeaderProps,\n ref: ForwardedRef<HTMLLIElement>,\n ): ReactElement => (\n <Styled.ListItemHeaderWrapper\n className={classNames(LIST_ITEM_HEADER_CLASS, className)}\n ref={ref}\n $size={size}\n $variant={variant}\n $divider={divider}\n $iconOrFlagProvided={Boolean(icon) \|\| Boolean(flag)}\n tabIndex={-1}\n {...rest}\n >\n <ListItemStyled.Label size={ListItemHeaderConsts.consts[size].labelSize} contrast={Contrasts.Subtle}>\n {label}\n </ListItemStyled.Label>\n {variant === ListItemTypes.ListItemVariants.Flag && flag && (\n <ListItemStyled.FlagContainer $size={size} data-testid={`flag-${flag}`}>\n <Flag flag={flag} />\n </ListItemStyled.FlagContainer>\n )}\n {variant === ListItemTypes.ListItemVariants.Icon && icon}\n </Styled.ListItemHeaderWrapper>\n ),\n);\n\nexport default ListItemHeader;\n"],"names":["ListItemHeader","forwardRef","className","icon","flag","label","divider","size","Sizes","variant","ListItemTypes.ListItemVariants","rest","ref","jsxs","Styled.ListItemHeaderWrapper","classNames","LIST_ITEM_HEADER_CLASS","jsx","ListItemStyled.Label","ListItemHeaderConsts.consts","Contrasts","ListItemStyled.FlagContainer","Flag"],"mappings":";;;;;;;;;;AAWA,MAAMA,IAAiBC;AAAA,EACrB,CACE;AAAA,IACE,WAAAC;AAAA,IACA,MAAAC;AAAA,IACA,MAAAC;AAAA,IACA,OAAAC;AAAA,IACA,SAAAC,IAAU;AAAA,IACV,MAAAC,IAAOC,EAAM;AAAA,IACb,SAAAC,IAAUC,EAA+B;AAAA,IACzC,GAAGC;AAAA,EAAA,GAELC,MAEA,gBAAAC;AAAA,IAACC;AAAAA,IAAA;AAAA,MACC,WAAWC,EAAWC,GAAwBd,CAAS;AAAA,MACvD,KAAAU;AAAA,MACA,OAAOL;AAAA,MACP,UAAUE;AAAA,MACV,UAAUH;AAAA,MACV,qBAAqB,EAAQH,KAAS,EAAQC;AAAA,MAC9C,UAAU;AAAA,MACT,GAAGO;AAAA,MAEJ,UAAA;AAAA,QAAA,gBAAAM,EAACC,GAAA,EAAqB,MAAMC,EAA4BZ,CAAI,EAAE,WAAW,UAAUa,EAAU,QAC1F,UAAAf,EAAA,CACH;AAAA,QACCI,MAAYC,EAA+B,QAAQN,KAClD,gBAAAa,EAACI,GAAA,EAA6B,OAAOd,GAAM,eAAa,QAAQH,CAAI,IAClE,UAAA,gBAAAa,EAACK,GAAA,EAAK,MAAAlB,GAAY,GACpB;AAAA,QAEDK,MAAYC,EAA+B,QAAQP;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAG1D;"}
1	+ {"version":3,"file":"ListItemHeader.js","sources":["../../../../src/components/ListItem/ListItemHeader.tsx"],"sourcesContent":["import { type ForwardedRef, type ReactElement, forwardRef } from 'react';\r\n\r\nimport classNames from 'classnames';\r\nimport { Sizes, Contrasts, LIST_ITEM_HEADER_CLASS } from 'acinguiux-ds-react-base/consts';\r\nimport { ListItemTypes, ListItemHeaderConsts } from 'acinguiux-ds-react-base/components/ListItem';\r\n\r\nimport * as Styled from './ListItemHeader.styles';\r\nimport * as ListItemStyled from './ListItem.styles';\r\nimport Flag from '../Flag/Flag';\r\nimport type { IListItemHeaderProps } from './ListItem.types';\r\n\r\nconst ListItemHeader = forwardRef(\r\n (\r\n {\r\n className,\r\n icon,\r\n flag,\r\n label,\r\n divider = true,\r\n size = Sizes.Medium,\r\n variant = ListItemTypes.ListItemVariants.Default,\r\n ...rest\r\n }: IListItemHeaderProps,\r\n ref: ForwardedRef<HTMLLIElement>,\r\n ): ReactElement => (\r\n <Styled.ListItemHeaderWrapper\r\n className={classNames(LIST_ITEM_HEADER_CLASS, className)}\r\n ref={ref}\r\n $size={size}\r\n $variant={variant}\r\n $divider={divider}\r\n $iconOrFlagProvided={Boolean(icon) \|\| Boolean(flag)}\r\n tabIndex={-1}\r\n {...rest}\r\n >\r\n <ListItemStyled.Label size={ListItemHeaderConsts.consts[size].labelSize} contrast={Contrasts.Subtle}>\r\n {label}\r\n </ListItemStyled.Label>\r\n {variant === ListItemTypes.ListItemVariants.Flag && flag && (\r\n <ListItemStyled.FlagContainer $size={size} data-testid={`flag-${flag}`}>\r\n <Flag flag={flag} />\r\n </ListItemStyled.FlagContainer>\r\n )}\r\n {variant === ListItemTypes.ListItemVariants.Icon && icon}\r\n </Styled.ListItemHeaderWrapper>\r\n ),\r\n);\r\n\r\nexport default ListItemHeader;\r\n"],"names":["ListItemHeader","forwardRef","className","icon","flag","label","divider","size","Sizes","variant","ListItemTypes.ListItemVariants","rest","ref","jsxs","Styled.ListItemHeaderWrapper","classNames","LIST_ITEM_HEADER_CLASS","jsx","ListItemStyled.Label","ListItemHeaderConsts.consts","Contrasts","ListItemStyled.FlagContainer","Flag"],"mappings":";;;;;;;;;;AAWA,MAAMA,IAAiBC;AAAA,EACrB,CACE;AAAA,IACE,WAAAC;AAAA,IACA,MAAAC;AAAA,IACA,MAAAC;AAAA,IACA,OAAAC;AAAA,IACA,SAAAC,IAAU;AAAA,IACV,MAAAC,IAAOC,EAAM;AAAA,IACb,SAAAC,IAAUC,EAA+B;AAAA,IACzC,GAAGC;AAAA,EAAA,GAELC,MAEA,gBAAAC;AAAA,IAACC;AAAAA,IAAA;AAAA,MACC,WAAWC,EAAWC,GAAwBd,CAAS;AAAA,MACvD,KAAAU;AAAA,MACA,OAAOL;AAAA,MACP,UAAUE;AAAA,MACV,UAAUH;AAAA,MACV,qBAAqB,EAAQH,KAAS,EAAQC;AAAA,MAC9C,UAAU;AAAA,MACT,GAAGO;AAAA,MAEJ,UAAA;AAAA,QAAA,gBAAAM,EAACC,GAAA,EAAqB,MAAMC,EAA4BZ,CAAI,EAAE,WAAW,UAAUa,EAAU,QAC1F,UAAAf,EAAA,CACH;AAAA,QACCI,MAAYC,EAA+B,QAAQN,KAClD,gBAAAa,EAACI,GAAA,EAA6B,OAAOd,GAAM,eAAa,QAAQH,CAAI,IAClE,UAAA,gBAAAa,EAACK,GAAA,EAAK,MAAAlB,GAAY,GACpB;AAAA,QAEDK,MAAYC,EAA+B,QAAQP;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAG1D;"}

package/build/esm/components/ListItem/ListItemHeader.styles.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ListItemHeader.styles.js","sources":["../../../../src/components/ListItem/ListItemHeader.styles.ts"],"sourcesContent":["import { styled, css } from 'styled-components';\nimport { ListItemHeaderConsts } from 'acinguiux-ds-react-base/components/ListItem';\nimport { Variables } from 'acinguiux-ds-react-base/theme';\n\nimport { ListItemHeaderWrapperProps } from './ListItem.types';\nimport { getGridTemplateStyles } from './ListItem.utils';\n\nconst ListItemHeaderWrapper = styled.li<\n Omit<ListItemHeaderWrapperProps, '$selected' \| '$ariaInteractiveOnly' \| '$disabled'>\n>(\n ({ theme, $size, $variant, $iconOrFlagProvided, $divider }) => css`\n position: relative;\n display: grid;\n align-items: center;\n width: 100%;\n max-width: 100%;\n column-gap: 6px;\n border-radius: 4px;\n padding: ${ListItemHeaderConsts.consts[$size].padding.vertical - 2}px\n ${ListItemHeaderConsts.consts[$size].padding.horizontal}px;\n box-sizing: border-box;\n cursor: pointer;\n\n ${$divider &&\n css`\n padding: ${ListItemHeaderConsts.consts[$size].padding.vertical + 3}px\n ${ListItemHeaderConsts.consts[$size].padding.horizontal}px\n ${ListItemHeaderConsts.consts[$size].padding.vertical - 2}px;\n\n &::before {\n content: '';\n position: absolute;\n top: 0;\n left: ${ListItemHeaderConsts.consts[$size].padding.horizontal}px;\n right: ${ListItemHeaderConsts.consts[$size].padding.horizontal}px;\n height: 1px;\n background-color: ${theme.layer()[Variables.BorderOnFoundationSubtle]};\n }\n `}\n\n ${getGridTemplateStyles({\n $variant,\n $selected: false,\n $iconOrFlagProvided,\n iconSize: 16,\n })}\n `,\n);\n\nexport { ListItemHeaderWrapper };\n"],"names":["ListItemHeaderWrapper","styled","theme","$size","$variant","$iconOrFlagProvided","$divider","css","ListItemHeaderConsts.consts","Variables","getGridTemplateStyles"],"mappings":";;;;AAOA,MAAMA,IAAwBC,EAAO;AAAA,EAGnC,CAAC,EAAE,OAAAC,GAAO,OAAAC,GAAO,UAAAC,GAAU,qBAAAC,GAAqB,UAAAC,QAAeC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,eAQlDC,EAA4BL,CAAK,EAAE,QAAQ,WAAW,CAAC;AAAA,QAC9DK,EAA4BL,CAAK,EAAE,QAAQ,UAAU;AAAA;AAAA;AAAA;AAAA,MAIvDG,KACFC;AAAA,iBACaC,EAA4BL,CAAK,EAAE,QAAQ,WAAW,CAAC;AAAA,UAC9DK,EAA4BL,CAAK,EAAE,QAAQ,UAAU;AAAA,UACrDK,EAA4BL,CAAK,EAAE,QAAQ,WAAW,CAAC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,gBAMjDK,EAA4BL,CAAK,EAAE,QAAQ,UAAU;AAAA,iBACpDK,EAA4BL,CAAK,EAAE,QAAQ,UAAU;AAAA;AAAA,4BAE1CD,EAAM,MAAA,EAAQO,EAAU,wBAAwB,CAAC;AAAA;AAAA,KAExE;AAAA;AAAA,MAECC,EAAsB;AAAA,IACtB,UAAAN;AAAA,IAEA,qBAAAC;AAAA,IACA,UAAU;AAAA,EAAA,CACX,CAAC;AAAA;AAEN;"}
1	+ {"version":3,"file":"ListItemHeader.styles.js","sources":["../../../../src/components/ListItem/ListItemHeader.styles.ts"],"sourcesContent":["import { styled, css } from 'styled-components';\r\nimport { ListItemHeaderConsts } from 'acinguiux-ds-react-base/components/ListItem';\r\nimport { Variables } from 'acinguiux-ds-react-base/theme';\r\n\r\nimport { ListItemHeaderWrapperProps } from './ListItem.types';\r\nimport { getGridTemplateStyles } from './ListItem.utils';\r\n\r\nconst ListItemHeaderWrapper = styled.li<\r\n Omit<ListItemHeaderWrapperProps, '$selected' \| '$ariaInteractiveOnly' \| '$disabled'>\r\n>(\r\n ({ theme, $size, $variant, $iconOrFlagProvided, $divider }) => css`\r\n position: relative;\r\n display: grid;\r\n align-items: center;\r\n width: 100%;\r\n max-width: 100%;\r\n column-gap: 6px;\r\n border-radius: 4px;\r\n padding: ${ListItemHeaderConsts.consts[$size].padding.vertical - 2}px\r\n ${ListItemHeaderConsts.consts[$size].padding.horizontal}px;\r\n box-sizing: border-box;\r\n cursor: pointer;\r\n\r\n ${$divider &&\r\n css`\r\n padding: ${ListItemHeaderConsts.consts[$size].padding.vertical + 3}px\r\n ${ListItemHeaderConsts.consts[$size].padding.horizontal}px\r\n ${ListItemHeaderConsts.consts[$size].padding.vertical - 2}px;\r\n\r\n &::before {\r\n content: '';\r\n position: absolute;\r\n top: 0;\r\n left: ${ListItemHeaderConsts.consts[$size].padding.horizontal}px;\r\n right: ${ListItemHeaderConsts.consts[$size].padding.horizontal}px;\r\n height: 1px;\r\n background-color: ${theme.layer()[Variables.BorderOnFoundationSubtle]};\r\n }\r\n `}\r\n\r\n ${getGridTemplateStyles({\r\n $variant,\r\n $selected: false,\r\n $iconOrFlagProvided,\r\n iconSize: 16,\r\n })}\r\n `,\r\n);\r\n\r\nexport { ListItemHeaderWrapper };\r\n"],"names":["ListItemHeaderWrapper","styled","theme","$size","$variant","$iconOrFlagProvided","$divider","css","ListItemHeaderConsts.consts","Variables","getGridTemplateStyles"],"mappings":";;;;AAOA,MAAMA,IAAwBC,EAAO;AAAA,EAGnC,CAAC,EAAE,OAAAC,GAAO,OAAAC,GAAO,UAAAC,GAAU,qBAAAC,GAAqB,UAAAC,QAAeC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,eAQlDC,EAA4BL,CAAK,EAAE,QAAQ,WAAW,CAAC;AAAA,QAC9DK,EAA4BL,CAAK,EAAE,QAAQ,UAAU;AAAA;AAAA;AAAA;AAAA,MAIvDG,KACFC;AAAA,iBACaC,EAA4BL,CAAK,EAAE,QAAQ,WAAW,CAAC;AAAA,UAC9DK,EAA4BL,CAAK,EAAE,QAAQ,UAAU;AAAA,UACrDK,EAA4BL,CAAK,EAAE,QAAQ,WAAW,CAAC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,gBAMjDK,EAA4BL,CAAK,EAAE,QAAQ,UAAU;AAAA,iBACpDK,EAA4BL,CAAK,EAAE,QAAQ,UAAU;AAAA;AAAA,4BAE1CD,EAAM,MAAA,EAAQO,EAAU,wBAAwB,CAAC;AAAA;AAAA,KAExE;AAAA;AAAA,MAECC,EAAsB;AAAA,IACtB,UAAAN;AAAA,IAEA,qBAAAC;AAAA,IACA,UAAU;AAAA,EAAA,CACX,CAAC;AAAA;AAEN;"}

package/build/esm/components/Loading/Loading.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Loading.js","sources":["../../../../src/components/Loading/Loading.tsx"],"sourcesContent":["import { forwardRef, ReactElement } from 'react';\n\nimport classNames from 'classnames';\nimport { LOADING_CLASS } from 'acinguiux-ds-react-base/consts';\nimport { LoadingUtils } from 'acinguiux-ds-react-base/components/Loading';\n\nimport * as Styled from './Loading.styles';\nimport type { ILoadingProps } from './Loading.types';\n\nconst Loading = forwardRef<SVGSVGElement, ILoadingProps>(\n ({ className, type = 'foundation', ...props }, ref): ReactElement => {\n const {\n size,\n radius,\n cx,\n cy,\n viewBox,\n variantParameters: { type: $type, ...variantParameters },\n } = LoadingUtils.useProps({\n type,\n ...props,\n });\n\n return (\n <Styled.LoadingContainer>\n <Styled.Loading\n aria-label=\"Loading spinner\"\n className={classNames(LOADING_CLASS, className)}\n $iconRadius={radius}\n viewBox={viewBox}\n ref={ref}\n $type={$type}\n $size={size}\n {...variantParameters}\n >\n <Styled.Background r={radius} cx={cx} cy={cy} />\n <Styled.Highlighted r={radius} cx={cx} cy={cy} />\n </Styled.Loading>\n </Styled.LoadingContainer>\n );\n },\n);\n\nexport default Loading;\n"],"names":["Loading","forwardRef","className","type","props","ref","size","radius","cx","cy","viewBox","$type","variantParameters","LoadingUtils.useProps","jsx","Styled.LoadingContainer","jsxs","Styled.Loading","classNames","LOADING_CLASS","Styled.Background","Styled.Highlighted"],"mappings":";;;;;;AASA,MAAMA,IAAUC;AAAA,EACd,CAAC,EAAE,WAAAC,GAAW,MAAAC,IAAO,cAAc,GAAGC,EAAA,GAASC,MAAsB;AACnE,UAAM;AAAA,MACJ,MAAAC;AAAA,MACA,QAAAC;AAAA,MACA,IAAAC;AAAA,MACA,IAAAC;AAAA,MACA,SAAAC;AAAA,MACA,mBAAmB,EAAE,MAAMC,GAAO,GAAGC,EAAA;AAAA,IAAkB,IACrDC,EAAsB;AAAA,MACxB,MAAAV;AAAA,MACA,GAAGC;AAAA,IAAA,CACJ;AAED,WACE,gBAAAU,EAACC,GAAA,EACC,UAAA,gBAAAC;AAAA,MAACC;AAAAA,MAAA;AAAA,QACC,cAAW;AAAA,QACX,WAAWC,EAAWC,GAAejB,CAAS;AAAA,QAC9C,aAAaK;AAAA,QACb,SAAAG;AAAA,QACA,KAAAL;AAAA,QACA,OAAAM;AAAA,QACA,OAAOL;AAAA,QACN,GAAGM;AAAA,QAEJ,UAAA;AAAA,UAAA,gBAAAE,EAACM,GAAA,EAAkBb,GAAW,IAAAC,GAAQ,IAAAC,GAAQ;AAAA,4BAC7CY,GAAA,EAAmBd,GAAW,IAAAC,GAAQ,IAAAC,EAAA,CAAQ;AAAA,QAAA;AAAA,MAAA;AAAA,IAAA,GAEnD;AAAA,EAEJ;AACF;"}
1	+ {"version":3,"file":"Loading.js","sources":["../../../../src/components/Loading/Loading.tsx"],"sourcesContent":["import { forwardRef, ReactElement } from 'react';\r\n\r\nimport classNames from 'classnames';\r\nimport { LOADING_CLASS } from 'acinguiux-ds-react-base/consts';\r\nimport { LoadingUtils } from 'acinguiux-ds-react-base/components/Loading';\r\n\r\nimport * as Styled from './Loading.styles';\r\nimport type { ILoadingProps } from './Loading.types';\r\n\r\nconst Loading = forwardRef<SVGSVGElement, ILoadingProps>(\r\n ({ className, type = 'foundation', ...props }, ref): ReactElement => {\r\n const {\r\n size,\r\n radius,\r\n cx,\r\n cy,\r\n viewBox,\r\n variantParameters: { type: $type, ...variantParameters },\r\n } = LoadingUtils.useProps({\r\n type,\r\n ...props,\r\n });\r\n\r\n return (\r\n <Styled.LoadingContainer>\r\n <Styled.Loading\r\n aria-label=\"Loading spinner\"\r\n className={classNames(LOADING_CLASS, className)}\r\n $iconRadius={radius}\r\n viewBox={viewBox}\r\n ref={ref}\r\n $type={$type}\r\n $size={size}\r\n {...variantParameters}\r\n >\r\n <Styled.Background r={radius} cx={cx} cy={cy} />\r\n <Styled.Highlighted r={radius} cx={cx} cy={cy} />\r\n </Styled.Loading>\r\n </Styled.LoadingContainer>\r\n );\r\n },\r\n);\r\n\r\nexport default Loading;\r\n"],"names":["Loading","forwardRef","className","type","props","ref","size","radius","cx","cy","viewBox","$type","variantParameters","LoadingUtils.useProps","jsx","Styled.LoadingContainer","jsxs","Styled.Loading","classNames","LOADING_CLASS","Styled.Background","Styled.Highlighted"],"mappings":";;;;;;AASA,MAAMA,IAAUC;AAAA,EACd,CAAC,EAAE,WAAAC,GAAW,MAAAC,IAAO,cAAc,GAAGC,EAAA,GAASC,MAAsB;AACnE,UAAM;AAAA,MACJ,MAAAC;AAAA,MACA,QAAAC;AAAA,MACA,IAAAC;AAAA,MACA,IAAAC;AAAA,MACA,SAAAC;AAAA,MACA,mBAAmB,EAAE,MAAMC,GAAO,GAAGC,EAAA;AAAA,IAAkB,IACrDC,EAAsB;AAAA,MACxB,MAAAV;AAAA,MACA,GAAGC;AAAA,IAAA,CACJ;AAED,WACE,gBAAAU,EAACC,GAAA,EACC,UAAA,gBAAAC;AAAA,MAACC;AAAAA,MAAA;AAAA,QACC,cAAW;AAAA,QACX,WAAWC,EAAWC,GAAejB,CAAS;AAAA,QAC9C,aAAaK;AAAA,QACb,SAAAG;AAAA,QACA,KAAAL;AAAA,QACA,OAAAM;AAAA,QACA,OAAOL;AAAA,QACN,GAAGM;AAAA,QAEJ,UAAA;AAAA,UAAA,gBAAAE,EAACM,GAAA,EAAkBb,GAAW,IAAAC,GAAQ,IAAAC,GAAQ;AAAA,4BAC7CY,GAAA,EAAmBd,GAAW,IAAAC,GAAQ,IAAAC,EAAA,CAAQ;AAAA,QAAA;AAAA,MAAA;AAAA,IAAA,GAEnD;AAAA,EAEJ;AACF;"}

package/build/esm/components/Loading/Loading.styles.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Loading.styles.js","sources":["../../../../src/components/Loading/Loading.styles.ts"],"sourcesContent":["import { styled, css } from 'styled-components';\nimport { LoadingStyles } from 'acinguiux-ds-react-base/components/Loading';\nimport type { PickTransient } from 'acinguiux-ds-react-base/types';\n\nimport { ILoadingProps } from './Loading.types';\nimport { rotate } from '../../utils/styleUtils';\n\nconst Circle = styled.circle`\n fill: transparent;\n`;\n\nexport const Background = styled(Circle)``;\n\nexport const Highlighted = styled(Circle)``;\n\nexport const LoadingContainer = styled.div`\n overflow: hidden;\n margin: 0;\n padding: 0;\n line-height: 0;\n`;\n\nexport const Loading = styled.svg<\n Required<PickTransient<ILoadingProps, 'size' \| 'type'>> & ILoadingProps & { $iconRadius: number }\n>`\n ${({ theme, $size, $iconRadius, $type, ...variantParameters }) => {\n const styles = LoadingStyles.getStyles({\n theme,\n size: $size,\n variantParameters: { type: $type, ...variantParameters },\n iconRadius: $iconRadius,\n });\n\n return css`\n ${styles.Loading}\n animation: ${rotate} 0.5s linear infinite;\n\n ${Background} {\n ${styles.Background}\n }\n\n ${Highlighted} {\n ${styles.Highlighted}\n }\n `;\n }}\n`;\n"],"names":["Circle","styled","Background","Highlighted","LoadingContainer","Loading","theme","$size","$iconRadius","$type","variantParameters","styles","LoadingStyles.getStyles","css","rotate"],"mappings":";;;AAOA,MAAMA,IAASC,EAAO;AAAA;AAAA,GAITC,IAAaD,EAAOD,CAAM,KAE1BG,IAAcF,EAAOD,CAAM,KAE3BI,IAAmBH,EAAO;AAAA;AAAA;AAAA;AAAA;AAAA,GAO1BI,IAAUJ,EAAO;AAAA,IAG1B,CAAC,EAAE,OAAAK,GAAO,OAAAC,GAAO,aAAAC,GAAa,OAAAC,GAAO,GAAGC,QAAwB;AAChE,QAAMC,IAASC,EAAwB;AAAA,IACrC,OAAAN;AAAA,IACA,MAAMC;AAAA,IACN,mBAAmB,EAAE,MAAME,GAAO,GAAGC,EAAA;AAAA,IACrC,YAAYF;AAAA,EAAA,CACb;AAED,SAAOK;AAAA,QACHF,EAAO,OAAO;AAAA,mBACHG,CAAM;AAAA;AAAA,QAEjBZ,CAAU;AAAA,UACRS,EAAO,UAAU;AAAA;AAAA;AAAA,QAGnBR,CAAW;AAAA,UACTQ,EAAO,WAAW;AAAA;AAAA;AAG1B,CAAC;AAAA;"}
1	+ {"version":3,"file":"Loading.styles.js","sources":["../../../../src/components/Loading/Loading.styles.ts"],"sourcesContent":["import { styled, css } from 'styled-components';\r\nimport { LoadingStyles } from 'acinguiux-ds-react-base/components/Loading';\r\nimport type { PickTransient } from 'acinguiux-ds-react-base/types';\r\n\r\nimport { ILoadingProps } from './Loading.types';\r\nimport { rotate } from '../../utils/styleUtils';\r\n\r\nconst Circle = styled.circle`\r\n fill: transparent;\r\n`;\r\n\r\nexport const Background = styled(Circle)``;\r\n\r\nexport const Highlighted = styled(Circle)``;\r\n\r\nexport const LoadingContainer = styled.div`\r\n overflow: hidden;\r\n margin: 0;\r\n padding: 0;\r\n line-height: 0;\r\n`;\r\n\r\nexport const Loading = styled.svg<\r\n Required<PickTransient<ILoadingProps, 'size' \| 'type'>> & ILoadingProps & { $iconRadius: number }\r\n>`\r\n ${({ theme, $size, $iconRadius, $type, ...variantParameters }) => {\r\n const styles = LoadingStyles.getStyles({\r\n theme,\r\n size: $size,\r\n variantParameters: { type: $type, ...variantParameters },\r\n iconRadius: $iconRadius,\r\n });\r\n\r\n return css`\r\n ${styles.Loading}\r\n animation: ${rotate} 0.5s linear infinite;\r\n\r\n ${Background} {\r\n ${styles.Background}\r\n }\r\n\r\n ${Highlighted} {\r\n ${styles.Highlighted}\r\n }\r\n `;\r\n }}\r\n`;\r\n"],"names":["Circle","styled","Background","Highlighted","LoadingContainer","Loading","theme","$size","$iconRadius","$type","variantParameters","styles","LoadingStyles.getStyles","css","rotate"],"mappings":";;;AAOA,MAAMA,IAASC,EAAO;AAAA;AAAA,GAITC,IAAaD,EAAOD,CAAM,KAE1BG,IAAcF,EAAOD,CAAM,KAE3BI,IAAmBH,EAAO;AAAA;AAAA;AAAA;AAAA;AAAA,GAO1BI,IAAUJ,EAAO;AAAA,IAG1B,CAAC,EAAE,OAAAK,GAAO,OAAAC,GAAO,aAAAC,GAAa,OAAAC,GAAO,GAAGC,QAAwB;AAChE,QAAMC,IAASC,EAAwB;AAAA,IACrC,OAAAN;AAAA,IACA,MAAMC;AAAA,IACN,mBAAmB,EAAE,MAAME,GAAO,GAAGC,EAAA;AAAA,IACrC,YAAYF;AAAA,EAAA,CACb;AAED,SAAOK;AAAA,QACHF,EAAO,OAAO;AAAA,mBACHG,CAAM;AAAA;AAAA,QAEjBZ,CAAU;AAAA,UACRS,EAAO,UAAU;AAAA;AAAA;AAAA,QAGnBR,CAAW;AAAA,UACTQ,EAAO,WAAW;AAAA;AAAA;AAG1B,CAAC;AAAA;"}

package/build/esm/components/Menu/Menu.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Menu.js","sources":["../../../../src/components/Menu/Menu.tsx"],"sourcesContent":["import { forwardRef, type ReactElement, useMemo } from 'react';\n\nimport RCMenu, { type MenuRef } from '@rc-component/menu';\nimport { Positions, Sizes, MENU_CLASS } from 'acinguiux-ds-react-base/consts';\nimport { MenuConsts } from 'acinguiux-ds-react-base/components/Menu';\n\nimport Ellipsis from '../Icon/components/Ellipsis';\nimport * as Styled from './Menu.styles';\nimport type { IMenuContext, IMenuProps, ItemType, SelectEventHandler, SelectInfo } from './Menu.types';\nimport MenuContext from './MenuContext';\nimport { getDefaultMotions } from './utils/motionUtils';\nimport { getItemsByPath, getLeafItems, useItems } from './utils/nodeUtils';\n\nconst RCMenuRef = forwardRef<MenuRef, IMenuProps>(\n ({ className, ...rest }, ref): ReactElement => <RCMenu ref={ref} rootClassName={className} {...rest} />,\n);\n\nconst selectWithPath =\n (items?: ItemType[], onSelect?: SelectEventHandler): SelectEventHandler =>\n (info: SelectInfo) => {\n if (!onSelect) {\n return;\n }\n\n const path = getLeafItems(items).find((i) => i.key === info.key)?.path;\n onSelect({ ...info, path });\n };\n\nconst Menu = ({\n className,\n mode = 'inline',\n size = Sizes.Medium,\n inlineCollapsed = false,\n muted = false,\n indicatorPosition = Positions.Right,\n iconPosition = Positions.Left,\n noAnimate,\n items,\n selectedPath,\n selectedKeys,\n defaultOpenToSelected = false,\n itemRender,\n children,\n ...rest\n}: IMenuProps): ReactElement => {\n const mergedItems = useItems(items, children, { mode });\n\n const contextValue = useMemo<IMenuContext>(\n () => ({\n size,\n mode,\n inlineCollapsed,\n itemRender,\n }),\n [size, mode, inlineCollapsed, itemRender],\n );\n\n const selectedItem = useMemo(\n () => (selectedPath ? getItemsByPath(selectedPath, items) : selectedKeys),\n [selectedPath, items, selectedKeys],\n );\n\n return (\n <MenuContext.Provider value={contextValue}>\n <Styled.Menu\n as={RCMenuRef}\n prefixCls={MENU_CLASS}\n className={className}\n selectedKeys={selectedItem}\n defaultOpenKeys={defaultOpenToSelected ? selectedItem : undefined}\n $size={size}\n mode={mode}\n defaultMotions={getDefaultMotions}\n inlineIndent={MenuConsts.consts[size].indent}\n inlineCollapsed={inlineCollapsed}\n triggerSubMenuAction=\"click\"\n overflowedIndicator={\n <div className={`${MENU_CLASS}-submenu-title-content`}>\n <Ellipsis className={`${MENU_CLASS}-submenu-rest-icon`} />\n </div>\n }\n $iconPosition={iconPosition}\n $indicatorPosition={indicatorPosition}\n $muted={muted}\n $noAnimate={noAnimate}\n {...rest}\n onSelect={selectWithPath(items, rest.onSelect)}\n >\n {mergedItems}\n </Styled.Menu>\n </MenuContext.Provider>\n );\n};\n\nexport default Menu;\n"],"names":["RCMenuRef","forwardRef","className","rest","ref","jsx","RCMenu","selectWithPath","items","onSelect","info","path","getLeafItems","i","Menu","mode","size","Sizes","inlineCollapsed","muted","indicatorPosition","Positions","iconPosition","noAnimate","selectedPath","selectedKeys","defaultOpenToSelected","itemRender","children","mergedItems","useItems","contextValue","useMemo","selectedItem","getItemsByPath","MenuContext","Styled.Menu","MENU_CLASS","getDefaultMotions","MenuConsts.consts","Ellipsis"],"mappings":";;;;;;;;;;;AAaA,MAAMA,IAAYC;AAAA,EAChB,CAAC,EAAE,WAAAC,GAAW,GAAGC,EAAA,GAAQC,MAAsB,gBAAAC,EAACC,GAAA,EAAO,KAAAF,GAAU,eAAeF,GAAY,GAAGC,EAAA,CAAM;AACvG,GAEMI,IACJ,CAACC,GAAoBC,MACrB,CAACC,MAAqB;AACpB,MAAI,CAACD;AACH;AAGF,QAAME,IAAOC,EAAaJ,CAAK,EAAE,KAAK,CAACK,MAAMA,EAAE,QAAQH,EAAK,GAAG,GAAG;AAClE,EAAAD,EAAS,EAAE,GAAGC,GAAM,MAAAC,GAAM;AAC5B,GAEIG,IAAO,CAAC;AAAA,EACZ,WAAAZ;AAAA,EACA,MAAAa,IAAO;AAAA,EACP,MAAAC,IAAOC,EAAM;AAAA,EACb,iBAAAC,IAAkB;AAAA,EAClB,OAAAC,IAAQ;AAAA,EACR,mBAAAC,IAAoBC,EAAU;AAAA,EAC9B,cAAAC,IAAeD,EAAU;AAAA,EACzB,WAAAE;AAAA,EACA,OAAAf;AAAA,EACA,cAAAgB;AAAA,EACA,cAAAC;AAAA,EACA,uBAAAC,IAAwB;AAAA,EACxB,YAAAC;AAAA,EACA,UAAAC;AAAA,EACA,GAAGzB;AACL,MAAgC;AAC9B,QAAM0B,IAAcC,EAAStB,GAAOoB,GAAU,EAAE,MAAAb,GAAM,GAEhDgB,IAAeC;AAAA,IACnB,OAAO;AAAA,MACL,MAAAhB;AAAA,MACA,MAAAD;AAAA,MACA,iBAAAG;AAAA,MACA,YAAAS;AAAA,IAAA;AAAA,IAEF,CAACX,GAAMD,GAAMG,GAAiBS,CAAU;AAAA,EAAA,GAGpCM,IAAeD;AAAA,IACnB,MAAOR,IAAeU,EAAeV,GAAchB,CAAK,IAAIiB;AAAA,IAC5D,CAACD,GAAchB,GAAOiB,CAAY;AAAA,EAAA;AAGpC,SACE,gBAAApB,EAAC8B,EAAY,UAAZ,EAAqB,OAAOJ,GAC3B,UAAA,gBAAA1B;AAAA,IAAC+B;AAAAA,IAAA;AAAA,MACC,IAAIpC;AAAA,MACJ,WAAWqC;AAAA,MACX,WAAAnC;AAAA,MACA,cAAc+B;AAAA,MACd,iBAAiBP,IAAwBO,IAAe;AAAA,MACxD,OAAOjB;AAAA,MACP,MAAAD;AAAA,MACA,gBAAgBuB;AAAA,MAChB,cAAcC,EAAkBvB,CAAI,EAAE;AAAA,MACtC,iBAAAE;AAAA,MACA,sBAAqB;AAAA,MACrB,qBACE,gBAAAb,EAAC,OAAA,EAAI,WAAW,GAAGgC,CAAU,0BAC3B,UAAA,gBAAAhC,EAACmC,GAAA,EAAS,WAAW,GAAGH,CAAU,sBAAsB,GAC1D;AAAA,MAEF,eAAef;AAAA,MACf,oBAAoBF;AAAA,MACpB,QAAQD;AAAA,MACR,YAAYI;AAAA,MACX,GAAGpB;AAAA,MACJ,UAAUI,EAAeC,GAAOL,EAAK,QAAQ;AAAA,MAE5C,UAAA0B;AAAA,IAAA;AAAA,EAAA,GAEL;AAEJ;"}
1	+ {"version":3,"file":"Menu.js","sources":["../../../../src/components/Menu/Menu.tsx"],"sourcesContent":["import { forwardRef, type ReactElement, useMemo } from 'react';\r\n\r\nimport RCMenu, { type MenuRef } from '@rc-component/menu';\r\nimport { Positions, Sizes, MENU_CLASS } from 'acinguiux-ds-react-base/consts';\r\nimport { MenuConsts } from 'acinguiux-ds-react-base/components/Menu';\r\n\r\nimport Ellipsis from '../Icon/components/Ellipsis';\r\nimport * as Styled from './Menu.styles';\r\nimport type { IMenuContext, IMenuProps, ItemType, SelectEventHandler, SelectInfo } from './Menu.types';\r\nimport MenuContext from './MenuContext';\r\nimport { getDefaultMotions } from './utils/motionUtils';\r\nimport { getItemsByPath, getLeafItems, useItems } from './utils/nodeUtils';\r\n\r\nconst RCMenuRef = forwardRef<MenuRef, IMenuProps>(\r\n ({ className, ...rest }, ref): ReactElement => <RCMenu ref={ref} rootClassName={className} {...rest} />,\r\n);\r\n\r\nconst selectWithPath =\r\n (items?: ItemType[], onSelect?: SelectEventHandler): SelectEventHandler =>\r\n (info: SelectInfo) => {\r\n if (!onSelect) {\r\n return;\r\n }\r\n\r\n const path = getLeafItems(items).find((i) => i.key === info.key)?.path;\r\n onSelect({ ...info, path });\r\n };\r\n\r\nconst Menu = ({\r\n className,\r\n mode = 'inline',\r\n size = Sizes.Medium,\r\n inlineCollapsed = false,\r\n muted = false,\r\n indicatorPosition = Positions.Right,\r\n iconPosition = Positions.Left,\r\n noAnimate,\r\n items,\r\n selectedPath,\r\n selectedKeys,\r\n defaultOpenToSelected = false,\r\n itemRender,\r\n children,\r\n ...rest\r\n}: IMenuProps): ReactElement => {\r\n const mergedItems = useItems(items, children, { mode });\r\n\r\n const contextValue = useMemo<IMenuContext>(\r\n () => ({\r\n size,\r\n mode,\r\n inlineCollapsed,\r\n itemRender,\r\n }),\r\n [size, mode, inlineCollapsed, itemRender],\r\n );\r\n\r\n const selectedItem = useMemo(\r\n () => (selectedPath ? getItemsByPath(selectedPath, items) : selectedKeys),\r\n [selectedPath, items, selectedKeys],\r\n );\r\n\r\n return (\r\n <MenuContext.Provider value={contextValue}>\r\n <Styled.Menu\r\n as={RCMenuRef}\r\n prefixCls={MENU_CLASS}\r\n className={className}\r\n selectedKeys={selectedItem}\r\n defaultOpenKeys={defaultOpenToSelected ? selectedItem : undefined}\r\n $size={size}\r\n mode={mode}\r\n defaultMotions={getDefaultMotions}\r\n inlineIndent={MenuConsts.consts[size].indent}\r\n inlineCollapsed={inlineCollapsed}\r\n triggerSubMenuAction=\"click\"\r\n overflowedIndicator={\r\n <div className={`${MENU_CLASS}-submenu-title-content`}>\r\n <Ellipsis className={`${MENU_CLASS}-submenu-rest-icon`} />\r\n </div>\r\n }\r\n $iconPosition={iconPosition}\r\n $indicatorPosition={indicatorPosition}\r\n $muted={muted}\r\n $noAnimate={noAnimate}\r\n {...rest}\r\n onSelect={selectWithPath(items, rest.onSelect)}\r\n >\r\n {mergedItems}\r\n </Styled.Menu>\r\n </MenuContext.Provider>\r\n );\r\n};\r\n\r\nexport default Menu;\r\n"],"names":["RCMenuRef","forwardRef","className","rest","ref","jsx","RCMenu","selectWithPath","items","onSelect","info","path","getLeafItems","i","Menu","mode","size","Sizes","inlineCollapsed","muted","indicatorPosition","Positions","iconPosition","noAnimate","selectedPath","selectedKeys","defaultOpenToSelected","itemRender","children","mergedItems","useItems","contextValue","useMemo","selectedItem","getItemsByPath","MenuContext","Styled.Menu","MENU_CLASS","getDefaultMotions","MenuConsts.consts","Ellipsis"],"mappings":";;;;;;;;;;;AAaA,MAAMA,IAAYC;AAAA,EAChB,CAAC,EAAE,WAAAC,GAAW,GAAGC,EAAA,GAAQC,MAAsB,gBAAAC,EAACC,GAAA,EAAO,KAAAF,GAAU,eAAeF,GAAY,GAAGC,EAAA,CAAM;AACvG,GAEMI,IACJ,CAACC,GAAoBC,MACrB,CAACC,MAAqB;AACpB,MAAI,CAACD;AACH;AAGF,QAAME,IAAOC,EAAaJ,CAAK,EAAE,KAAK,CAACK,MAAMA,EAAE,QAAQH,EAAK,GAAG,GAAG;AAClE,EAAAD,EAAS,EAAE,GAAGC,GAAM,MAAAC,GAAM;AAC5B,GAEIG,IAAO,CAAC;AAAA,EACZ,WAAAZ;AAAA,EACA,MAAAa,IAAO;AAAA,EACP,MAAAC,IAAOC,EAAM;AAAA,EACb,iBAAAC,IAAkB;AAAA,EAClB,OAAAC,IAAQ;AAAA,EACR,mBAAAC,IAAoBC,EAAU;AAAA,EAC9B,cAAAC,IAAeD,EAAU;AAAA,EACzB,WAAAE;AAAA,EACA,OAAAf;AAAA,EACA,cAAAgB;AAAA,EACA,cAAAC;AAAA,EACA,uBAAAC,IAAwB;AAAA,EACxB,YAAAC;AAAA,EACA,UAAAC;AAAA,EACA,GAAGzB;AACL,MAAgC;AAC9B,QAAM0B,IAAcC,EAAStB,GAAOoB,GAAU,EAAE,MAAAb,GAAM,GAEhDgB,IAAeC;AAAA,IACnB,OAAO;AAAA,MACL,MAAAhB;AAAA,MACA,MAAAD;AAAA,MACA,iBAAAG;AAAA,MACA,YAAAS;AAAA,IAAA;AAAA,IAEF,CAACX,GAAMD,GAAMG,GAAiBS,CAAU;AAAA,EAAA,GAGpCM,IAAeD;AAAA,IACnB,MAAOR,IAAeU,EAAeV,GAAchB,CAAK,IAAIiB;AAAA,IAC5D,CAACD,GAAchB,GAAOiB,CAAY;AAAA,EAAA;AAGpC,SACE,gBAAApB,EAAC8B,EAAY,UAAZ,EAAqB,OAAOJ,GAC3B,UAAA,gBAAA1B;AAAA,IAAC+B;AAAAA,IAAA;AAAA,MACC,IAAIpC;AAAA,MACJ,WAAWqC;AAAA,MACX,WAAAnC;AAAA,MACA,cAAc+B;AAAA,MACd,iBAAiBP,IAAwBO,IAAe;AAAA,MACxD,OAAOjB;AAAA,MACP,MAAAD;AAAA,MACA,gBAAgBuB;AAAA,MAChB,cAAcC,EAAkBvB,CAAI,EAAE;AAAA,MACtC,iBAAAE;AAAA,MACA,sBAAqB;AAAA,MACrB,qBACE,gBAAAb,EAAC,OAAA,EAAI,WAAW,GAAGgC,CAAU,0BAC3B,UAAA,gBAAAhC,EAACmC,GAAA,EAAS,WAAW,GAAGH,CAAU,sBAAsB,GAC1D;AAAA,MAEF,eAAef;AAAA,MACf,oBAAoBF;AAAA,MACpB,QAAQD;AAAA,MACR,YAAYI;AAAA,MACX,GAAGpB;AAAA,MACJ,UAAUI,EAAeC,GAAOL,EAAK,QAAQ;AAAA,MAE5C,UAAA0B;AAAA,IAAA;AAAA,EAAA,GAEL;AAEJ;"}

package/build/esm/components/Menu/Menu.styles.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Menu.styles.js","sources":["../../../../src/components/Menu/Menu.styles.ts"],"sourcesContent":["import RCMenu from '@rc-component/menu';\nimport { styled, css } from 'styled-components';\nimport { MENU_CLASS } from 'acinguiux-ds-react-base/consts';\nimport { getFocusStyles } from 'acinguiux-ds-react-base/utils/stylesUtils';\nimport { MenuConsts } from 'acinguiux-ds-react-base/components/Menu';\nimport { getLabelTypographySize } from 'acinguiux-ds-react-base/utils/sizesUtils';\n\nimport type { StyledMenuProps } from './Menu.types';\nimport { groupMenuItemStyle } from './styles/groupMenuItem.styles';\nimport { menuItemStyle } from './styles/menuItem.styles';\nimport { menuLabelStyle } from './styles/menuLabel.styles';\nimport { motionStyle } from './styles/motion.styles';\nimport { subMenuStyle } from './styles/subMenu.styles';\nimport { menuDividerStyle } from './styles/menuDivider.styles';\n\nexport const Menu = styled(RCMenu)<StyledMenuProps>`\n ${({ theme, $size, mode }) => css<StyledMenuProps>`\n ${theme.typography('label', getLabelTypographySize($size))};\n position: relative;\n\n ${mode !== 'horizontal' &&\n css`\n margin-left: -${MenuConsts.consts[$size].itemListMarginLeft}px;\n `}\n\n &:focus-visible {\n outline: none;\n\n &::before {\n content: '';\n pointer-events: none;\n display: block;\n position: absolute;\n inset: 3px;\n border-radius: 4px;\n ${getFocusStyles(theme)};\n z-index: 1;\n\n ${mode !== 'horizontal' &&\n css`\n margin-left: ${MenuConsts.consts[$size].itemListMarginLeft}px;\n `}\n }\n }\n\n &.${MENU_CLASS} {\n list-style: none;\n margin-top: 0;\n margin-bottom: 0;\n padding: 0;\n transition: width 0.3s ease-out;\n will-change: width;\n\n &-inline-collapsed {\n width: ${MenuConsts.consts[$size].inlineCollapsedWidth}px;\n overflow: visible;\n\n ${mode !== 'horizontal' &&\n css`\n margin-right: ${MenuConsts.consts[$size].itemListMarginLeft}px;\n `}\n\n .${MENU_CLASS}-submenu-expand-icon {\n display: none;\n }\n }\n }\n\n .${MENU_CLASS} {\n &-hidden,\n &-submenu-hidden {\n display: none;\n }\n\n &,\n &-item-group-list {\n list-style: none;\n padding: 0;\n margin: 0;\n }\n }\n\n /* Horizontal */\n ${mode === 'horizontal' &&\n css`\n display: flex;\n flex-direction: row;\n align-items: stretch;\n overflow: hidden;\n `}\n\n ${subMenuStyle};\n ${menuLabelStyle};\n ${menuItemStyle};\n ${groupMenuItemStyle};\n ${motionStyle};\n ${menuDividerStyle};\n `}\n`;\n"],"names":["Menu","styled","RCMenu","theme","$size","mode","css","getLabelTypographySize","MenuConsts.consts","getFocusStyles","MENU_CLASS","subMenuStyle","menuLabelStyle","menuItemStyle","groupMenuItemStyle","motionStyle","menuDividerStyle"],"mappings":";;;;;;;;;;;;AAeO,MAAMA,IAAOC,EAAOC,CAAM;AAAA,IAC7B,CAAC,EAAE,OAAAC,GAAO,OAAAC,GAAO,MAAAC,QAAWC;AAAA,MAC1BH,EAAM,WAAW,SAASI,EAAuBH,CAAK,CAAC,CAAC;AAAA;AAAA;AAAA,MAGxDC,MAAS,gBACXC;AAAA,sBACkBE,EAAkBJ,CAAK,EAAE,kBAAkB;AAAA,KAC5D;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,UAYKK,EAAeN,CAAK,CAAC;AAAA;AAAA;AAAA,UAGrBE,MAAS,gBACXC;AAAA,yBACiBE,EAAkBJ,CAAK,EAAE,kBAAkB;AAAA,SAC3D;AAAA;AAAA;AAAA;AAAA,QAIDM,CAAU;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,iBASDF,EAAkBJ,CAAK,EAAE,oBAAoB;AAAA;AAAA;AAAA,UAGpDC,MAAS,gBACXC;AAAA,0BACkBE,EAAkBJ,CAAK,EAAE,kBAAkB;AAAA,SAC5D;AAAA;AAAA,WAEEM,CAAU;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,OAMdA,CAAU;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,MAeXL,MAAS,gBACXC;AAAA;AAAA;AAAA;AAAA;AAAA,KAKC;AAAA;AAAA,MAECK,CAAY;AAAA,MACZC,CAAc;AAAA,MACdC,CAAa;AAAA,MACbC,CAAkB;AAAA,MAClBC,CAAW;AAAA,MACXC,CAAgB;AAAA,GACnB;AAAA;"}
1	+ {"version":3,"file":"Menu.styles.js","sources":["../../../../src/components/Menu/Menu.styles.ts"],"sourcesContent":["import RCMenu from '@rc-component/menu';\r\nimport { styled, css } from 'styled-components';\r\nimport { MENU_CLASS } from 'acinguiux-ds-react-base/consts';\r\nimport { getFocusStyles } from 'acinguiux-ds-react-base/utils/stylesUtils';\r\nimport { MenuConsts } from 'acinguiux-ds-react-base/components/Menu';\r\nimport { getLabelTypographySize } from 'acinguiux-ds-react-base/utils/sizesUtils';\r\n\r\nimport type { StyledMenuProps } from './Menu.types';\r\nimport { groupMenuItemStyle } from './styles/groupMenuItem.styles';\r\nimport { menuItemStyle } from './styles/menuItem.styles';\r\nimport { menuLabelStyle } from './styles/menuLabel.styles';\r\nimport { motionStyle } from './styles/motion.styles';\r\nimport { subMenuStyle } from './styles/subMenu.styles';\r\nimport { menuDividerStyle } from './styles/menuDivider.styles';\r\n\r\nexport const Menu = styled(RCMenu)<StyledMenuProps>`\r\n ${({ theme, $size, mode }) => css<StyledMenuProps>`\r\n ${theme.typography('label', getLabelTypographySize($size))};\r\n position: relative;\r\n\r\n ${mode !== 'horizontal' &&\r\n css`\r\n margin-left: -${MenuConsts.consts[$size].itemListMarginLeft}px;\r\n `}\r\n\r\n &:focus-visible {\r\n outline: none;\r\n\r\n &::before {\r\n content: '';\r\n pointer-events: none;\r\n display: block;\r\n position: absolute;\r\n inset: 3px;\r\n border-radius: 4px;\r\n ${getFocusStyles(theme)};\r\n z-index: 1;\r\n\r\n ${mode !== 'horizontal' &&\r\n css`\r\n margin-left: ${MenuConsts.consts[$size].itemListMarginLeft}px;\r\n `}\r\n }\r\n }\r\n\r\n &.${MENU_CLASS} {\r\n list-style: none;\r\n margin-top: 0;\r\n margin-bottom: 0;\r\n padding: 0;\r\n transition: width 0.3s ease-out;\r\n will-change: width;\r\n\r\n &-inline-collapsed {\r\n width: ${MenuConsts.consts[$size].inlineCollapsedWidth}px;\r\n overflow: visible;\r\n\r\n ${mode !== 'horizontal' &&\r\n css`\r\n margin-right: ${MenuConsts.consts[$size].itemListMarginLeft}px;\r\n `}\r\n\r\n .${MENU_CLASS}-submenu-expand-icon {\r\n display: none;\r\n }\r\n }\r\n }\r\n\r\n .${MENU_CLASS} {\r\n &-hidden,\r\n &-submenu-hidden {\r\n display: none;\r\n }\r\n\r\n &,\r\n &-item-group-list {\r\n list-style: none;\r\n padding: 0;\r\n margin: 0;\r\n }\r\n }\r\n\r\n /* Horizontal */\r\n ${mode === 'horizontal' &&\r\n css`\r\n display: flex;\r\n flex-direction: row;\r\n align-items: stretch;\r\n overflow: hidden;\r\n `}\r\n\r\n ${subMenuStyle};\r\n ${menuLabelStyle};\r\n ${menuItemStyle};\r\n ${groupMenuItemStyle};\r\n ${motionStyle};\r\n ${menuDividerStyle};\r\n `}\r\n`;\r\n"],"names":["Menu","styled","RCMenu","theme","$size","mode","css","getLabelTypographySize","MenuConsts.consts","getFocusStyles","MENU_CLASS","subMenuStyle","menuLabelStyle","menuItemStyle","groupMenuItemStyle","motionStyle","menuDividerStyle"],"mappings":";;;;;;;;;;;;AAeO,MAAMA,IAAOC,EAAOC,CAAM;AAAA,IAC7B,CAAC,EAAE,OAAAC,GAAO,OAAAC,GAAO,MAAAC,QAAWC;AAAA,MAC1BH,EAAM,WAAW,SAASI,EAAuBH,CAAK,CAAC,CAAC;AAAA;AAAA;AAAA,MAGxDC,MAAS,gBACXC;AAAA,sBACkBE,EAAkBJ,CAAK,EAAE,kBAAkB;AAAA,KAC5D;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,UAYKK,EAAeN,CAAK,CAAC;AAAA;AAAA;AAAA,UAGrBE,MAAS,gBACXC;AAAA,yBACiBE,EAAkBJ,CAAK,EAAE,kBAAkB;AAAA,SAC3D;AAAA;AAAA;AAAA;AAAA,QAIDM,CAAU;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,iBASDF,EAAkBJ,CAAK,EAAE,oBAAoB;AAAA;AAAA;AAAA,UAGpDC,MAAS,gBACXC;AAAA,0BACkBE,EAAkBJ,CAAK,EAAE,kBAAkB;AAAA,SAC5D;AAAA;AAAA,WAEEM,CAAU;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,OAMdA,CAAU;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,MAeXL,MAAS,gBACXC;AAAA;AAAA;AAAA;AAAA;AAAA,KAKC;AAAA;AAAA,MAECK,CAAY;AAAA,MACZC,CAAc;AAAA,MACdC,CAAa;AAAA,MACbC,CAAkB;AAAA,MAClBC,CAAW;AAAA,MACXC,CAAgB;AAAA,GACnB;AAAA;"}

package/build/esm/components/Menu/Menu.utils.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Menu.utils.js","sources":["../../../../src/components/Menu/Menu.utils.ts"],"sourcesContent":["import { css } from 'styled-components';\nimport { FabricsVariables } from 'acinguiux-ds-fabrics';\nimport { Positions, Sizes } from 'acinguiux-ds-react-base/consts';\nimport { Variables, type Theme } from 'acinguiux-ds-react-base/theme';\nimport type { MenuTypes } from 'acinguiux-ds-react-base/components/Menu';\n\nimport { getIndicatorPositionStyle } from './styles/indicator.styles';\nimport type { StyledMenuProps } from './Menu.types';\n\ntype ModeType = 'inline' \| 'vertical' \| 'horizontal';\n\nexport const getBackgroundColor = (\n theme: Theme,\n state: FabricsVariables.StateType = FabricsVariables.States.Resting,\n foundation: FabricsVariables.FoundationType = FabricsVariables.Foundations.Surface,\n muted = false,\n disabled = false,\n) => theme.layer({ foundation, disabled, state, muted })[Variables.BackgroundFoundation];\n\nexport const getTooltipLabelSize = (size: MenuTypes.Size): MenuTypes.Size =>\n size === Sizes.XSmall ? Sizes.Small : size;\n\nexport const getModeIndicatorPosition = (indicatorPosition: MenuTypes.IndicatorPosition, mode?: ModeType) => {\n if (mode === 'horizontal') {\n return indicatorPosition === Positions.Top ? Positions.Top : Positions.Bottom;\n }\n\n return indicatorPosition === Positions.Left ? Positions.Left : Positions.Right;\n};\n\nexport const getSubMenuSelectedIndicatorStyle = (\n indicatorPosition: MenuTypes.IndicatorPosition,\n mode?: ModeType,\n size: MenuTypes.Size = Sizes.Medium,\n muted = false,\n disabled = false,\n) => css<StyledMenuProps>`\n &::after {\n ${getIndicatorPositionStyle({\n indicatorPosition: getModeIndicatorPosition(indicatorPosition, mode),\n size,\n state: 'resting',\n active: true,\n disabled,\n muted,\n })};\n }\n`;\n\nexport const getMenuItemSelectedStyle = (\n theme: Theme,\n indicatorPosition: MenuTypes.IndicatorPosition,\n mode?: ModeType,\n size: MenuTypes.Size = Sizes.Medium,\n muted = false,\n) => css<StyledMenuProps>`\n background-color: ${getBackgroundColor(\n theme,\n FabricsVariables.States.Resting,\n FabricsVariables.Foundations.Section,\n muted,\n )};\n\n &::after {\n ${getIndicatorPositionStyle({\n indicatorPosition: getModeIndicatorPosition(indicatorPosition, mode),\n size,\n state: 'resting',\n active: true,\n muted,\n })};\n }\n`;\n\nexport const getMenuItemDisabledStyle = (\n theme: Theme,\n indicatorPosition: MenuTypes.IndicatorPosition,\n mode?: ModeType,\n size: MenuTypes.Size = Sizes.Medium,\n muted = false,\n) => {\n const layer = theme.layer({ foundation: 'surface', disabled: true, muted });\n\n return css<StyledMenuProps>`\n color: ${layer[Variables.TextOnFoundationSubtle]};\n background-color: ${getBackgroundColor(\n theme,\n FabricsVariables.States.Resting,\n FabricsVariables.Foundations.Section,\n muted,\n true,\n )};\n\n svg {\n fill: ${layer[Variables.TextOnFoundationSubtle]};\n }\n\n &::after {\n ${getIndicatorPositionStyle({\n indicatorPosition: getModeIndicatorPosition(indicatorPosition, mode),\n size,\n state: 'resting',\n active: true,\n disabled: true,\n muted,\n })};\n }\n `;\n};\n"],"names":["getBackgroundColor","theme","state","FabricsVariables","foundation","muted","disabled","Variables","getTooltipLabelSize","size","Sizes","getModeIndicatorPosition","indicatorPosition","mode","Positions","getSubMenuSelectedIndicatorStyle","css","getIndicatorPositionStyle","getMenuItemSelectedStyle","getMenuItemDisabledStyle","layer"],"mappings":";;;;;AAWO,MAAMA,IAAqB,CAChCC,GACAC,IAAoCC,EAAiB,OAAO,SAC5DC,IAA8CD,EAAiB,YAAY,SAC3EE,IAAQ,IACRC,IAAW,OACRL,EAAM,MAAM,EAAE,YAAAG,GAAY,UAAAE,GAAU,OAAAJ,GAAO,OAAAG,GAAO,EAAEE,EAAU,oBAAoB,GAE1EC,IAAsB,CAACC,MAClCA,MAASC,EAAM,SAASA,EAAM,QAAQD,GAE3BE,IAA2B,CAACC,GAAgDC,MACnFA,MAAS,eACJD,MAAsBE,EAAU,MAAMA,EAAU,MAAMA,EAAU,SAGlEF,MAAsBE,EAAU,OAAOA,EAAU,OAAOA,EAAU,OAG9DC,IAAmC,CAC9CH,GACAC,GACAJ,IAAuBC,EAAM,QAC7BL,IAAQ,IACRC,IAAW,OACRU;AAAA;AAAA,MAECC,EAA0B;AAAA,EAC1B,mBAAmBN,EAAyBC,GAAmBC,CAAI;AAAA,EACnE,MAAAJ;AAAA,EACA,OAAO;AAAA,EACP,QAAQ;AAAA,EACR,UAAAH;AAAA,EACA,OAAAD;AACF,CAAC,CAAC;AAAA;AAAA,GAIOa,IAA2B,CACtCjB,GACAW,GACAC,GACAJ,IAAuBC,EAAM,QAC7BL,IAAQ,OACLW;AAAA,sBACiBhB;AAAA,EAClBC;AAAA,EACAE,EAAiB,OAAO;AAAA,EACxBA,EAAiB,YAAY;AAAA,EAC7BE;AACF,CAAC;AAAA;AAAA;AAAA,MAGGY,EAA0B;AAAA,EAC1B,mBAAmBN,EAAyBC,GAAmBC,CAAI;AAAA,EACnE,MAAAJ;AAAA,EACA,OAAO;AAAA,EACP,QAAQ;AAAA,EACR,OAAAJ;AACF,CAAC,CAAC;AAAA;AAAA,GAIOc,IAA2B,CACtClB,GACAW,GACAC,GACAJ,IAAuBC,EAAM,QAC7BL,IAAQ,OACL;AACH,QAAMe,IAAQnB,EAAM,MAAM,EAAE,YAAY,WAAW,UAAU,IAAM,OAAAI,GAAO;AAE1E,SAAOW;AAAA,aACII,EAAMb,EAAU,sBAAsB,CAAC;AAAA,wBAC5BP;AAAA,IAClBC;AAAA,IACAE,EAAiB,OAAO;AAAA,IACxBA,EAAiB,YAAY;AAAA,IAC7BE;AAAA,IACA;AAAA,EAAA,CACD;AAAA;AAAA;AAAA,cAGSe,EAAMb,EAAU,sBAAsB,CAAC;AAAA;AAAA;AAAA;AAAA,QAI7CU,EAA0B;AAAA,IAC1B,mBAAmBN,EAAyBC,GAAmBC,CAAI;AAAA,IACnE,MAAAJ;AAAA,IACA,OAAO;AAAA,IACP,QAAQ;AAAA,IACR,UAAU;AAAA,IACV,OAAAJ;AAAA,EAAA,CACD,CAAC;AAAA;AAAA;AAGR;"}
1	+ {"version":3,"file":"Menu.utils.js","sources":["../../../../src/components/Menu/Menu.utils.ts"],"sourcesContent":["import { css } from 'styled-components';\r\nimport { FabricsVariables } from 'acinguiux-ds-fabrics';\r\nimport { Positions, Sizes } from 'acinguiux-ds-react-base/consts';\r\nimport { Variables, type Theme } from 'acinguiux-ds-react-base/theme';\r\nimport type { MenuTypes } from 'acinguiux-ds-react-base/components/Menu';\r\n\r\nimport { getIndicatorPositionStyle } from './styles/indicator.styles';\r\nimport type { StyledMenuProps } from './Menu.types';\r\n\r\ntype ModeType = 'inline' \| 'vertical' \| 'horizontal';\r\n\r\nexport const getBackgroundColor = (\r\n theme: Theme,\r\n state: FabricsVariables.StateType = FabricsVariables.States.Resting,\r\n foundation: FabricsVariables.FoundationType = FabricsVariables.Foundations.Surface,\r\n muted = false,\r\n disabled = false,\r\n) => theme.layer({ foundation, disabled, state, muted })[Variables.BackgroundFoundation];\r\n\r\nexport const getTooltipLabelSize = (size: MenuTypes.Size): MenuTypes.Size =>\r\n size === Sizes.XSmall ? Sizes.Small : size;\r\n\r\nexport const getModeIndicatorPosition = (indicatorPosition: MenuTypes.IndicatorPosition, mode?: ModeType) => {\r\n if (mode === 'horizontal') {\r\n return indicatorPosition === Positions.Top ? Positions.Top : Positions.Bottom;\r\n }\r\n\r\n return indicatorPosition === Positions.Left ? Positions.Left : Positions.Right;\r\n};\r\n\r\nexport const getSubMenuSelectedIndicatorStyle = (\r\n indicatorPosition: MenuTypes.IndicatorPosition,\r\n mode?: ModeType,\r\n size: MenuTypes.Size = Sizes.Medium,\r\n muted = false,\r\n disabled = false,\r\n) => css<StyledMenuProps>`\r\n &::after {\r\n ${getIndicatorPositionStyle({\r\n indicatorPosition: getModeIndicatorPosition(indicatorPosition, mode),\r\n size,\r\n state: 'resting',\r\n active: true,\r\n disabled,\r\n muted,\r\n })};\r\n }\r\n`;\r\n\r\nexport const getMenuItemSelectedStyle = (\r\n theme: Theme,\r\n indicatorPosition: MenuTypes.IndicatorPosition,\r\n mode?: ModeType,\r\n size: MenuTypes.Size = Sizes.Medium,\r\n muted = false,\r\n) => css<StyledMenuProps>`\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 &::after {\r\n ${getIndicatorPositionStyle({\r\n indicatorPosition: getModeIndicatorPosition(indicatorPosition, mode),\r\n size,\r\n state: 'resting',\r\n active: true,\r\n muted,\r\n })};\r\n }\r\n`;\r\n\r\nexport const getMenuItemDisabledStyle = (\r\n theme: Theme,\r\n indicatorPosition: MenuTypes.IndicatorPosition,\r\n mode?: ModeType,\r\n size: MenuTypes.Size = Sizes.Medium,\r\n muted = false,\r\n) => {\r\n const layer = theme.layer({ foundation: 'surface', disabled: true, muted });\r\n\r\n return css<StyledMenuProps>`\r\n color: ${layer[Variables.TextOnFoundationSubtle]};\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: ${layer[Variables.TextOnFoundationSubtle]};\r\n }\r\n\r\n &::after {\r\n ${getIndicatorPositionStyle({\r\n indicatorPosition: getModeIndicatorPosition(indicatorPosition, mode),\r\n size,\r\n state: 'resting',\r\n active: true,\r\n disabled: true,\r\n muted,\r\n })};\r\n }\r\n `;\r\n};\r\n"],"names":["getBackgroundColor","theme","state","FabricsVariables","foundation","muted","disabled","Variables","getTooltipLabelSize","size","Sizes","getModeIndicatorPosition","indicatorPosition","mode","Positions","getSubMenuSelectedIndicatorStyle","css","getIndicatorPositionStyle","getMenuItemSelectedStyle","getMenuItemDisabledStyle","layer"],"mappings":";;;;;AAWO,MAAMA,IAAqB,CAChCC,GACAC,IAAoCC,EAAiB,OAAO,SAC5DC,IAA8CD,EAAiB,YAAY,SAC3EE,IAAQ,IACRC,IAAW,OACRL,EAAM,MAAM,EAAE,YAAAG,GAAY,UAAAE,GAAU,OAAAJ,GAAO,OAAAG,GAAO,EAAEE,EAAU,oBAAoB,GAE1EC,IAAsB,CAACC,MAClCA,MAASC,EAAM,SAASA,EAAM,QAAQD,GAE3BE,IAA2B,CAACC,GAAgDC,MACnFA,MAAS,eACJD,MAAsBE,EAAU,MAAMA,EAAU,MAAMA,EAAU,SAGlEF,MAAsBE,EAAU,OAAOA,EAAU,OAAOA,EAAU,OAG9DC,IAAmC,CAC9CH,GACAC,GACAJ,IAAuBC,EAAM,QAC7BL,IAAQ,IACRC,IAAW,OACRU;AAAA;AAAA,MAECC,EAA0B;AAAA,EAC1B,mBAAmBN,EAAyBC,GAAmBC,CAAI;AAAA,EACnE,MAAAJ;AAAA,EACA,OAAO;AAAA,EACP,QAAQ;AAAA,EACR,UAAAH;AAAA,EACA,OAAAD;AACF,CAAC,CAAC;AAAA;AAAA,GAIOa,IAA2B,CACtCjB,GACAW,GACAC,GACAJ,IAAuBC,EAAM,QAC7BL,IAAQ,OACLW;AAAA,sBACiBhB;AAAA,EAClBC;AAAA,EACAE,EAAiB,OAAO;AAAA,EACxBA,EAAiB,YAAY;AAAA,EAC7BE;AACF,CAAC;AAAA;AAAA;AAAA,MAGGY,EAA0B;AAAA,EAC1B,mBAAmBN,EAAyBC,GAAmBC,CAAI;AAAA,EACnE,MAAAJ;AAAA,EACA,OAAO;AAAA,EACP,QAAQ;AAAA,EACR,OAAAJ;AACF,CAAC,CAAC;AAAA;AAAA,GAIOc,IAA2B,CACtClB,GACAW,GACAC,GACAJ,IAAuBC,EAAM,QAC7BL,IAAQ,OACL;AACH,QAAMe,IAAQnB,EAAM,MAAM,EAAE,YAAY,WAAW,UAAU,IAAM,OAAAI,GAAO;AAE1E,SAAOW;AAAA,aACII,EAAMb,EAAU,sBAAsB,CAAC;AAAA,wBAC5BP;AAAA,IAClBC;AAAA,IACAE,EAAiB,OAAO;AAAA,IACxBA,EAAiB,YAAY;AAAA,IAC7BE;AAAA,IACA;AAAA,EAAA,CACD;AAAA;AAAA;AAAA,cAGSe,EAAMb,EAAU,sBAAsB,CAAC;AAAA;AAAA;AAAA;AAAA,QAI7CU,EAA0B;AAAA,IAC1B,mBAAmBN,EAAyBC,GAAmBC,CAAI;AAAA,IACnE,MAAAJ;AAAA,IACA,OAAO;AAAA,IACP,QAAQ;AAAA,IACR,UAAU;AAAA,IACV,OAAAJ;AAAA,EAAA,CACD,CAAC;AAAA;AAAA;AAGR;"}

package/build/esm/components/Menu/MenuContext.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"MenuContext.js","sources":["../../../../src/components/Menu/MenuContext.tsx"],"sourcesContent":["import { createContext } from 'react';\n\nimport { Sizes } from 'acinguiux-ds-react-base/consts';\n\nimport type { IMenuContext } from './Menu.types';\n\nconst MenuContext = createContext<IMenuContext>({\n size: Sizes.Medium,\n mode: 'inline',\n inlineCollapsed: false,\n});\n\nexport default MenuContext;\n"],"names":["MenuContext","createContext","Sizes"],"mappings":";;AAMA,MAAMA,IAAcC,EAA4B;AAAA,EAC9C,MAAMC,EAAM;AAAA,EACZ,MAAM;AAAA,EACN,iBAAiB;AACnB,CAAC;"}
1	+ {"version":3,"file":"MenuContext.js","sources":["../../../../src/components/Menu/MenuContext.tsx"],"sourcesContent":["import { createContext } from 'react';\r\n\r\nimport { Sizes } from 'acinguiux-ds-react-base/consts';\r\n\r\nimport type { IMenuContext } from './Menu.types';\r\n\r\nconst MenuContext = createContext<IMenuContext>({\r\n size: Sizes.Medium,\r\n mode: 'inline',\r\n inlineCollapsed: false,\r\n});\r\n\r\nexport default MenuContext;\r\n"],"names":["MenuContext","createContext","Sizes"],"mappings":";;AAMA,MAAMA,IAAcC,EAA4B;AAAA,EAC9C,MAAMC,EAAM;AAAA,EACZ,MAAM;AAAA,EACN,iBAAiB;AACnB,CAAC;"}

package/build/esm/components/Menu/components/MenuDivider.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"MenuDivider.js","sources":["../../../../../src/components/Menu/components/MenuDivider.tsx"],"sourcesContent":["import { useContext, type ReactElement } from 'react';\n\nimport type { DividerProps } from '@rc-component/menu/lib/Divider';\nimport { MENU_CLASS, Sizes } from 'acinguiux-ds-react-base/consts';\nimport classNames from 'classnames';\n\nimport MenuContext from '../MenuContext';\nimport Divider from '../../Divider/Divider';\n\nexport type IMenuDividerProps = DividerProps;\n\nconst MenuDivider = ({ className, style }: IMenuDividerProps): ReactElement => {\n const { mode } = useContext(MenuContext);\n\n return (\n <li role=\"separator\" className={classNames(className, `${MENU_CLASS}-item-divider`)} style={style}>\n <Divider\n size={Sizes.Small}\n contrast=\"subtle\"\n shape=\"rounded\"\n direction={mode === 'horizontal' ? 'vertical' : 'horizontal'}\n />\n </li>\n );\n};\n\nexport default MenuDivider;\n"],"names":["MenuDivider","className","style","mode","useContext","MenuContext","jsx","classNames","MENU_CLASS","Divider","Sizes"],"mappings":";;;;;;;AAWA,MAAMA,IAAc,CAAC,EAAE,WAAAC,GAAW,OAAAC,QAA6C;AAC7E,QAAM,EAAE,MAAAC,EAAA,IAASC,EAAWC,CAAW;AAEvC,SACE,gBAAAC,EAAC,MAAA,EAAG,MAAK,aAAY,WAAWC,EAAWN,GAAW,GAAGO,CAAU,eAAe,GAAG,OAAAN,GACnF,UAAA,gBAAAI;AAAA,IAACG;AAAA,IAAA;AAAA,MACC,MAAMC,EAAM;AAAA,MACZ,UAAS;AAAA,MACT,OAAM;AAAA,MACN,WAAWP,MAAS,eAAe,aAAa;AAAA,IAAA;AAAA,EAAA,GAEpD;AAEJ;"}
1	+ {"version":3,"file":"MenuDivider.js","sources":["../../../../../src/components/Menu/components/MenuDivider.tsx"],"sourcesContent":["import { useContext, type ReactElement } from 'react';\r\n\r\nimport type { DividerProps } from '@rc-component/menu/lib/Divider';\r\nimport { MENU_CLASS, Sizes } from 'acinguiux-ds-react-base/consts';\r\nimport classNames from 'classnames';\r\n\r\nimport MenuContext from '../MenuContext';\r\nimport Divider from '../../Divider/Divider';\r\n\r\nexport type IMenuDividerProps = DividerProps;\r\n\r\nconst MenuDivider = ({ className, style }: IMenuDividerProps): ReactElement => {\r\n const { mode } = useContext(MenuContext);\r\n\r\n return (\r\n <li role=\"separator\" className={classNames(className, `${MENU_CLASS}-item-divider`)} style={style}>\r\n <Divider\r\n size={Sizes.Small}\r\n contrast=\"subtle\"\r\n shape=\"rounded\"\r\n direction={mode === 'horizontal' ? 'vertical' : 'horizontal'}\r\n />\r\n </li>\r\n );\r\n};\r\n\r\nexport default MenuDivider;\r\n"],"names":["MenuDivider","className","style","mode","useContext","MenuContext","jsx","classNames","MENU_CLASS","Divider","Sizes"],"mappings":";;;;;;;AAWA,MAAMA,IAAc,CAAC,EAAE,WAAAC,GAAW,OAAAC,QAA6C;AAC7E,QAAM,EAAE,MAAAC,EAAA,IAASC,EAAWC,CAAW;AAEvC,SACE,gBAAAC,EAAC,MAAA,EAAG,MAAK,aAAY,WAAWC,EAAWN,GAAW,GAAGO,CAAU,eAAe,GAAG,OAAAN,GACnF,UAAA,gBAAAI;AAAA,IAACG;AAAA,IAAA;AAAA,MACC,MAAMC,EAAM;AAAA,MACZ,UAAS;AAAA,MACT,OAAM;AAAA,MACN,WAAWP,MAAS,eAAe,aAAa;AAAA,IAAA;AAAA,EAAA,GAEpD;AAEJ;"}

package/build/esm/components/Menu/components/MenuItem.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"MenuItem.js","sources":["../../../../../src/components/Menu/components/MenuItem.tsx"],"sourcesContent":["import {\n type ReactElement,\n forwardRef,\n useCallback,\n useContext,\n useImperativeHandle,\n useMemo,\n useRef,\n useState,\n} from 'react';\n\nimport { MenuItem as RCMenuItem } from '@rc-component/menu';\nimport type { MenuItemProps as RCMenuItemProps } from '@rc-component/menu/lib/MenuItem';\nimport { Positions } from 'acinguiux-ds-react-base/consts';\nimport type { MenuTypes } from 'acinguiux-ds-react-base/components/Menu';\nimport type { BadgeTypes } from 'acinguiux-ds-react-base/components/Badge';\nimport { getSmallerSize } from 'acinguiux-ds-react-base/utils/sizesUtils';\n\nimport { getString } from '../../../utils/textUtils';\nimport MenuLabel from './MenuLabel';\nimport Tooltip from '../../Tooltip/Tooltip';\nimport MenuContext from '../MenuContext';\nimport { TooltipContainer, TooltipLabel } from '../styles/menuLabel.styles';\nimport { getTooltipLabelSize } from '../Menu.utils';\nimport Badge from '../../Badge/Badge';\n\nexport interface IMenuItemProps extends RCMenuItemProps {\n level?: number;\n path?: string;\n badge?: Omit<BadgeTypes.IProps, 'size'>;\n itemRender?: MenuTypes.ItemRender;\n}\n\nconst MenuItem = forwardRef<HTMLElement, IMenuItemProps>(\n ({ children, itemIcon, level, path, badge, itemRender, ...rest }, ref): ReactElement => {\n const menuItemRef = useRef<HTMLElement>(null);\n const [isTooltipOpen, setIsTooltipOpen] = useState(false);\n const { inlineCollapsed, size } = useContext(MenuContext);\n useImperativeHandle<HTMLElement \| null, HTMLElement \| null>(ref, () => menuItemRef.current);\n\n const onMouseEnter = useCallback(() => setIsTooltipOpen(true), []);\n const onMouseLeave = useCallback(() => setIsTooltipOpen(false), []);\n const isTooltipDisabled = useMemo(\n () => !inlineCollapsed \|\| level === undefined \|\| level > 0,\n [inlineCollapsed, level],\n );\n\n return (\n <RCMenuItem\n ref={menuItemRef}\n aria-label={getString(children)}\n {...rest}\n onMouseEnter={onMouseEnter}\n onMouseLeave={onMouseLeave}\n >\n <Tooltip\n targetRef={menuItemRef}\n isOpen={!isTooltipDisabled && isTooltipOpen}\n isDisabled={isTooltipDisabled}\n placement={Positions.Right}\n trigger={\n <MenuLabel parentRef={menuItemRef} path={path} itemIcon={itemIcon} itemRender={itemRender} badge={badge}>\n {children}\n </MenuLabel>\n }\n overlay={\n <TooltipContainer gap=\"1rem\">\n <TooltipLabel size={getTooltipLabelSize(size)}>{children}</TooltipLabel>\n {badge && <Badge size={getSmallerSize(size) as BadgeTypes.Size} {...badge} />}\n </TooltipContainer>\n }\n delay={50}\n closeDelay={200}\n />\n </RCMenuItem>\n );\n },\n);\n\nexport default MenuItem;\n"],"names":["MenuItem","forwardRef","children","itemIcon","level","path","badge","itemRender","rest","ref","menuItemRef","useRef","isTooltipOpen","setIsTooltipOpen","useState","inlineCollapsed","size","useContext","MenuContext","useImperativeHandle","onMouseEnter","useCallback","onMouseLeave","isTooltipDisabled","useMemo","jsx","RCMenuItem","getString","Tooltip","Positions","MenuLabel","jsxs","TooltipContainer","TooltipLabel","getTooltipLabelSize","Badge","getSmallerSize"],"mappings":";;;;;;;;;;;;AAiCA,MAAMA,IAAWC;AAAA,EACf,CAAC,EAAE,UAAAC,GAAU,UAAAC,GAAU,OAAAC,GAAO,MAAAC,GAAM,OAAAC,GAAO,YAAAC,GAAY,GAAGC,EAAA,GAAQC,MAAsB;AACtF,UAAMC,IAAcC,EAAoB,IAAI,GACtC,CAACC,GAAeC,CAAgB,IAAIC,EAAS,EAAK,GAClD,EAAE,iBAAAC,GAAiB,MAAAC,MAASC,EAAWC,CAAW;AACxD,IAAAC,EAA4DV,GAAK,MAAMC,EAAY,OAAO;AAE1F,UAAMU,IAAeC,EAAY,MAAMR,EAAiB,EAAI,GAAG,CAAA,CAAE,GAC3DS,IAAeD,EAAY,MAAMR,EAAiB,EAAK,GAAG,CAAA,CAAE,GAC5DU,IAAoBC;AAAA,MACxB,MAAM,CAACT,KAAmBX,MAAU,UAAaA,IAAQ;AAAA,MACzD,CAACW,GAAiBX,CAAK;AAAA,IAAA;AAGzB,WACE,gBAAAqB;AAAA,MAACC;AAAAA,MAAA;AAAA,QACC,KAAKhB;AAAA,QACL,cAAYiB,EAAUzB,CAAQ;AAAA,QAC7B,GAAGM;AAAA,QACJ,cAAAY;AAAA,QACA,cAAAE;AAAA,QAEA,UAAA,gBAAAG;AAAA,UAACG;AAAA,UAAA;AAAA,YACC,WAAWlB;AAAA,YACX,QAAQ,CAACa,KAAqBX;AAAA,YAC9B,YAAYW;AAAA,YACZ,WAAWM,EAAU;AAAA,YACrB,2BACGC,GAAA,EAAU,WAAWpB,GAAa,MAAAL,GAAY,UAAAF,GAAoB,YAAAI,GAAwB,OAAAD,GACxF,UAAAJ,EAAA,CACH;AAAA,YAEF,SACE,gBAAA6B,EAACC,GAAA,EAAiB,KAAI,QACpB,UAAA;AAAA,cAAA,gBAAAP,EAACQ,GAAA,EAAa,MAAMC,EAAoBlB,CAAI,GAAI,UAAAd,GAAS;AAAA,cACxDI,uBAAU6B,GAAA,EAAM,MAAMC,EAAepB,CAAI,GAAuB,GAAGV,EAAA,CAAO;AAAA,YAAA,GAC7E;AAAA,YAEF,OAAO;AAAA,YACP,YAAY;AAAA,UAAA;AAAA,QAAA;AAAA,MACd;AAAA,IAAA;AAAA,EAGN;AACF;"}
1	+ {"version":3,"file":"MenuItem.js","sources":["../../../../../src/components/Menu/components/MenuItem.tsx"],"sourcesContent":["import {\r\n type ReactElement,\r\n forwardRef,\r\n useCallback,\r\n useContext,\r\n useImperativeHandle,\r\n useMemo,\r\n useRef,\r\n useState,\r\n} from 'react';\r\n\r\nimport { MenuItem as RCMenuItem } from '@rc-component/menu';\r\nimport type { MenuItemProps as RCMenuItemProps } from '@rc-component/menu/lib/MenuItem';\r\nimport { Positions } from 'acinguiux-ds-react-base/consts';\r\nimport type { MenuTypes } from 'acinguiux-ds-react-base/components/Menu';\r\nimport type { BadgeTypes } from 'acinguiux-ds-react-base/components/Badge';\r\nimport { getSmallerSize } from 'acinguiux-ds-react-base/utils/sizesUtils';\r\n\r\nimport { getString } from '../../../utils/textUtils';\r\nimport MenuLabel from './MenuLabel';\r\nimport Tooltip from '../../Tooltip/Tooltip';\r\nimport MenuContext from '../MenuContext';\r\nimport { TooltipContainer, TooltipLabel } from '../styles/menuLabel.styles';\r\nimport { getTooltipLabelSize } from '../Menu.utils';\r\nimport Badge from '../../Badge/Badge';\r\n\r\nexport interface IMenuItemProps extends RCMenuItemProps {\r\n level?: number;\r\n path?: string;\r\n badge?: Omit<BadgeTypes.IProps, 'size'>;\r\n itemRender?: MenuTypes.ItemRender;\r\n}\r\n\r\nconst MenuItem = forwardRef<HTMLElement, IMenuItemProps>(\r\n ({ children, itemIcon, level, path, badge, itemRender, ...rest }, ref): ReactElement => {\r\n const menuItemRef = useRef<HTMLElement>(null);\r\n const [isTooltipOpen, setIsTooltipOpen] = useState(false);\r\n const { inlineCollapsed, size } = useContext(MenuContext);\r\n useImperativeHandle<HTMLElement \| null, HTMLElement \| null>(ref, () => menuItemRef.current);\r\n\r\n const onMouseEnter = useCallback(() => setIsTooltipOpen(true), []);\r\n const onMouseLeave = useCallback(() => setIsTooltipOpen(false), []);\r\n const isTooltipDisabled = useMemo(\r\n () => !inlineCollapsed \|\| level === undefined \|\| level > 0,\r\n [inlineCollapsed, level],\r\n );\r\n\r\n return (\r\n <RCMenuItem\r\n ref={menuItemRef}\r\n aria-label={getString(children)}\r\n {...rest}\r\n onMouseEnter={onMouseEnter}\r\n onMouseLeave={onMouseLeave}\r\n >\r\n <Tooltip\r\n targetRef={menuItemRef}\r\n isOpen={!isTooltipDisabled && isTooltipOpen}\r\n isDisabled={isTooltipDisabled}\r\n placement={Positions.Right}\r\n trigger={\r\n <MenuLabel parentRef={menuItemRef} path={path} itemIcon={itemIcon} itemRender={itemRender} badge={badge}>\r\n {children}\r\n </MenuLabel>\r\n }\r\n overlay={\r\n <TooltipContainer gap=\"1rem\">\r\n <TooltipLabel size={getTooltipLabelSize(size)}>{children}</TooltipLabel>\r\n {badge && <Badge size={getSmallerSize(size) as BadgeTypes.Size} {...badge} />}\r\n </TooltipContainer>\r\n }\r\n delay={50}\r\n closeDelay={200}\r\n />\r\n </RCMenuItem>\r\n );\r\n },\r\n);\r\n\r\nexport default MenuItem;\r\n"],"names":["MenuItem","forwardRef","children","itemIcon","level","path","badge","itemRender","rest","ref","menuItemRef","useRef","isTooltipOpen","setIsTooltipOpen","useState","inlineCollapsed","size","useContext","MenuContext","useImperativeHandle","onMouseEnter","useCallback","onMouseLeave","isTooltipDisabled","useMemo","jsx","RCMenuItem","getString","Tooltip","Positions","MenuLabel","jsxs","TooltipContainer","TooltipLabel","getTooltipLabelSize","Badge","getSmallerSize"],"mappings":";;;;;;;;;;;;AAiCA,MAAMA,IAAWC;AAAA,EACf,CAAC,EAAE,UAAAC,GAAU,UAAAC,GAAU,OAAAC,GAAO,MAAAC,GAAM,OAAAC,GAAO,YAAAC,GAAY,GAAGC,EAAA,GAAQC,MAAsB;AACtF,UAAMC,IAAcC,EAAoB,IAAI,GACtC,CAACC,GAAeC,CAAgB,IAAIC,EAAS,EAAK,GAClD,EAAE,iBAAAC,GAAiB,MAAAC,MAASC,EAAWC,CAAW;AACxD,IAAAC,EAA4DV,GAAK,MAAMC,EAAY,OAAO;AAE1F,UAAMU,IAAeC,EAAY,MAAMR,EAAiB,EAAI,GAAG,CAAA,CAAE,GAC3DS,IAAeD,EAAY,MAAMR,EAAiB,EAAK,GAAG,CAAA,CAAE,GAC5DU,IAAoBC;AAAA,MACxB,MAAM,CAACT,KAAmBX,MAAU,UAAaA,IAAQ;AAAA,MACzD,CAACW,GAAiBX,CAAK;AAAA,IAAA;AAGzB,WACE,gBAAAqB;AAAA,MAACC;AAAAA,MAAA;AAAA,QACC,KAAKhB;AAAA,QACL,cAAYiB,EAAUzB,CAAQ;AAAA,QAC7B,GAAGM;AAAA,QACJ,cAAAY;AAAA,QACA,cAAAE;AAAA,QAEA,UAAA,gBAAAG;AAAA,UAACG;AAAA,UAAA;AAAA,YACC,WAAWlB;AAAA,YACX,QAAQ,CAACa,KAAqBX;AAAA,YAC9B,YAAYW;AAAA,YACZ,WAAWM,EAAU;AAAA,YACrB,2BACGC,GAAA,EAAU,WAAWpB,GAAa,MAAAL,GAAY,UAAAF,GAAoB,YAAAI,GAAwB,OAAAD,GACxF,UAAAJ,EAAA,CACH;AAAA,YAEF,SACE,gBAAA6B,EAACC,GAAA,EAAiB,KAAI,QACpB,UAAA;AAAA,cAAA,gBAAAP,EAACQ,GAAA,EAAa,MAAMC,EAAoBlB,CAAI,GAAI,UAAAd,GAAS;AAAA,cACxDI,uBAAU6B,GAAA,EAAM,MAAMC,EAAepB,CAAI,GAAuB,GAAGV,EAAA,CAAO;AAAA,YAAA,GAC7E;AAAA,YAEF,OAAO;AAAA,YACP,YAAY;AAAA,UAAA;AAAA,QAAA;AAAA,MACd;AAAA,IAAA;AAAA,EAGN;AACF;"}

package/build/esm/components/Menu/components/MenuItemGroup.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"MenuItemGroup.js","sources":["../../../../../src/components/Menu/components/MenuItemGroup.tsx"],"sourcesContent":["import { forwardRef, type ReactElement } from 'react';\n\nimport { MenuItemGroup as RCMenuItemGroup } from '@rc-component/menu';\nimport type { MenuItemGroupProps as RCMenuItemGroupProps } from '@rc-component/menu/lib/MenuItemGroup';\nimport { MENU_CLASS } from 'acinguiux-ds-react-base/consts';\nimport type { BadgeTypes } from 'acinguiux-ds-react-base/components/Badge';\nimport classNames from 'classnames';\n\nimport MenuLabel from './MenuLabel';\n\nexport interface IMenuItemGroupProps extends Omit<RCMenuItemGroupProps, 'ref'> {\n badge?: Omit<BadgeTypes.IProps, 'size'>;\n kind?: 'default' \| 'subtle';\n}\n\nconst Title = ({ title, badge, kind }: IMenuItemGroupProps): ReactElement => (\n <div\n className={classNames(\n `${MENU_CLASS}-group-title-content`,\n kind === 'subtle' && `${MENU_CLASS}-group-title-content-subtle`,\n )}\n >\n <MenuLabel badge={badge}>{title}</MenuLabel>\n </div>\n);\n\nconst MenuItemGroup = forwardRef<HTMLLIElement, IMenuItemGroupProps>(\n ({ children, title, badge, kind, ...rest }, ref): ReactElement => (\n <RCMenuItemGroup ref={ref} title={<Title badge={badge} title={title} kind={kind} />} {...rest}>\n {children}\n </RCMenuItemGroup>\n ),\n);\n\nexport default MenuItemGroup;\n"],"names":["Title","title","badge","kind","jsx","classNames","MENU_CLASS","MenuLabel","MenuItemGroup","forwardRef","children","rest","ref","RCMenuItemGroup"],"mappings":";;;;;;AAeA,MAAMA,IAAQ,CAAC,EAAE,OAAAC,GAAO,OAAAC,GAAO,MAAAC,QAC7B,gBAAAC;AAAA,EAAC;AAAA,EAAA;AAAA,IACC,WAAWC;AAAA,MACT,GAAGC,CAAU;AAAA,MACbH,MAAS,YAAY,GAAGG,CAAU;AAAA,IAAA;AAAA,IAGpC,UAAA,gBAAAF,EAACG,GAAA,EAAU,OAAAL,GAAe,UAAAD,EAAA,CAAM;AAAA,EAAA;AAClC,GAGIO,IAAgBC;AAAA,EACpB,CAAC,EAAE,UAAAC,GAAU,OAAAT,GAAO,OAAAC,GAAO,MAAAC,GAAM,GAAGQ,KAAQC,MAC1C,gBAAAR,EAACS,KAAgB,KAAAD,GAAU,yBAAQZ,GAAA,EAAM,OAAAE,GAAc,OAAAD,GAAc,MAAAE,GAAY,GAAK,GAAGQ,GACtF,UAAAD,EAAA,CACH;AAEJ;"}
1	+ {"version":3,"file":"MenuItemGroup.js","sources":["../../../../../src/components/Menu/components/MenuItemGroup.tsx"],"sourcesContent":["import { forwardRef, type ReactElement } from 'react';\r\n\r\nimport { MenuItemGroup as RCMenuItemGroup } from '@rc-component/menu';\r\nimport type { MenuItemGroupProps as RCMenuItemGroupProps } from '@rc-component/menu/lib/MenuItemGroup';\r\nimport { MENU_CLASS } from 'acinguiux-ds-react-base/consts';\r\nimport type { BadgeTypes } from 'acinguiux-ds-react-base/components/Badge';\r\nimport classNames from 'classnames';\r\n\r\nimport MenuLabel from './MenuLabel';\r\n\r\nexport interface IMenuItemGroupProps extends Omit<RCMenuItemGroupProps, 'ref'> {\r\n badge?: Omit<BadgeTypes.IProps, 'size'>;\r\n kind?: 'default' \| 'subtle';\r\n}\r\n\r\nconst Title = ({ title, badge, kind }: IMenuItemGroupProps): ReactElement => (\r\n <div\r\n className={classNames(\r\n `${MENU_CLASS}-group-title-content`,\r\n kind === 'subtle' && `${MENU_CLASS}-group-title-content-subtle`,\r\n )}\r\n >\r\n <MenuLabel badge={badge}>{title}</MenuLabel>\r\n </div>\r\n);\r\n\r\nconst MenuItemGroup = forwardRef<HTMLLIElement, IMenuItemGroupProps>(\r\n ({ children, title, badge, kind, ...rest }, ref): ReactElement => (\r\n <RCMenuItemGroup ref={ref} title={<Title badge={badge} title={title} kind={kind} />} {...rest}>\r\n {children}\r\n </RCMenuItemGroup>\r\n ),\r\n);\r\n\r\nexport default MenuItemGroup;\r\n"],"names":["Title","title","badge","kind","jsx","classNames","MENU_CLASS","MenuLabel","MenuItemGroup","forwardRef","children","rest","ref","RCMenuItemGroup"],"mappings":";;;;;;AAeA,MAAMA,IAAQ,CAAC,EAAE,OAAAC,GAAO,OAAAC,GAAO,MAAAC,QAC7B,gBAAAC;AAAA,EAAC;AAAA,EAAA;AAAA,IACC,WAAWC;AAAA,MACT,GAAGC,CAAU;AAAA,MACbH,MAAS,YAAY,GAAGG,CAAU;AAAA,IAAA;AAAA,IAGpC,UAAA,gBAAAF,EAACG,GAAA,EAAU,OAAAL,GAAe,UAAAD,EAAA,CAAM;AAAA,EAAA;AAClC,GAGIO,IAAgBC;AAAA,EACpB,CAAC,EAAE,UAAAC,GAAU,OAAAT,GAAO,OAAAC,GAAO,MAAAC,GAAM,GAAGQ,KAAQC,MAC1C,gBAAAR,EAACS,KAAgB,KAAAD,GAAU,yBAAQZ,GAAA,EAAM,OAAAE,GAAc,OAAAD,GAAc,MAAAE,GAAY,GAAK,GAAGQ,GACtF,UAAAD,EAAA,CACH;AAEJ;"}

package/build/esm/components/Menu/components/MenuLabel.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"MenuLabel.js","sources":["../../../../../src/components/Menu/components/MenuLabel.tsx"],"sourcesContent":["/* Focus and key events are disabled since menu handles them internally.\n onClick added to circumvent event propagation being blocked by tooltip. */\n\nimport {\n cloneElement,\n forwardRef,\n isValidElement,\n type ReactElement,\n type RefObject,\n useContext,\n type HTMLAttributes,\n useMemo,\n} from 'react';\n\nimport classNames from 'classnames';\nimport { MENU_CLASS } from 'acinguiux-ds-react-base/consts';\nimport type { MenuTypes } from 'acinguiux-ds-react-base/components/Menu';\nimport type { BadgeTypes } from 'acinguiux-ds-react-base/components/Badge';\nimport { getSmallerSize } from 'acinguiux-ds-react-base/utils/sizesUtils';\n\nimport type { IMenuProps } from '../Menu.types';\nimport MenuContext from '../MenuContext';\nimport Badge from '../../Badge/Badge';\n\nexport type MenuLabelRequiredTypes = 'itemIcon' \| 'className' \| 'children' \| 'size';\n\nexport interface IMenuLabelProps\n extends\n Pick<IMenuProps, MenuLabelRequiredTypes>,\n Omit<HTMLAttributes<HTMLElement>, 'onClick' \| 'onMouseEnter' \| 'onMouseLeave' \| 'onSelect'> {\n parentRef?: RefObject<HTMLElement>;\n path?: string;\n badge?: Omit<BadgeTypes.IProps, 'size'>;\n itemRender?: MenuTypes.ItemRender;\n}\n\nconst MenuLabel = forwardRef<HTMLElement, IMenuLabelProps>(\n ({ children, itemIcon, path, className, parentRef: _parentRef, badge, itemRender, ...rest }, ref): ReactElement => {\n const { itemRender: menuItemRender, size, inlineCollapsed } = useContext(MenuContext);\n const currentItemRender = useMemo(() => itemRender ?? menuItemRender, [itemRender, menuItemRender]);\n\n const elementProps = {\n ref,\n className: classNames(`${MENU_CLASS}-label`, className),\n ...rest,\n };\n\n const content = (\n <>\n {isValidElement(itemIcon) && <span className={`${MENU_CLASS}-label-icon`}>{itemIcon}</span>}\n {!!children && <span className={`${MENU_CLASS}-label-text`}>{children}</span>}\n {badge && !inlineCollapsed && <Badge size={getSmallerSize(size) as BadgeTypes.Size} {...badge} />}\n </>\n );\n\n return path && children && currentItemRender ? (\n cloneElement(currentItemRender({ path, children: content }), { ...elementProps, tabIndex: -1 })\n ) : (\n <span {...elementProps}>{content}</span>\n );\n },\n);\n\nexport default MenuLabel;\n"],"names":["MenuLabel","forwardRef","children","itemIcon","path","className","_parentRef","badge","itemRender","rest","ref","menuItemRender","size","inlineCollapsed","useContext","MenuContext","currentItemRender","useMemo","elementProps","classNames","MENU_CLASS","content","jsxs","Fragment","isValidElement","jsx","Badge","getSmallerSize","cloneElement"],"mappings":";;;;;;;AAoCA,MAAMA,IAAYC;AAAA,EAChB,CAAC,EAAE,UAAAC,GAAU,UAAAC,GAAU,MAAAC,GAAM,WAAAC,GAAW,WAAWC,GAAY,OAAAC,GAAO,YAAAC,GAAY,GAAGC,EAAA,GAAQC,MAAsB;AACjH,UAAM,EAAE,YAAYC,GAAgB,MAAAC,GAAM,iBAAAC,EAAA,IAAoBC,EAAWC,CAAW,GAC9EC,IAAoBC,EAAQ,MAAMT,KAAcG,GAAgB,CAACH,GAAYG,CAAc,CAAC,GAE5FO,IAAe;AAAA,MACnB,KAAAR;AAAA,MACA,WAAWS,EAAW,GAAGC,CAAU,UAAUf,CAAS;AAAA,MACtD,GAAGI;AAAA,IAAA,GAGCY,IACJ,gBAAAC,EAAAC,GAAA,EACG,UAAA;AAAA,MAAAC,EAAerB,CAAQ,KAAK,gBAAAsB,EAAC,QAAA,EAAK,WAAW,GAAGL,CAAU,eAAgB,UAAAjB,EAAA,CAAS;AAAA,MACnF,CAAC,CAACD,KAAY,gBAAAuB,EAAC,UAAK,WAAW,GAAGL,CAAU,eAAgB,UAAAlB,GAAS;AAAA,MACrEK,KAAS,CAACM,KAAmB,gBAAAY,EAACC,GAAA,EAAM,MAAMC,EAAef,CAAI,GAAuB,GAAGL,EAAA,CAAO;AAAA,IAAA,GACjG;AAGF,WAAOH,KAAQF,KAAYc,IACzBY,EAAaZ,EAAkB,EAAE,MAAAZ,GAAM,UAAUiB,EAAA,CAAS,GAAG,EAAE,GAAGH,GAAc,UAAU,GAAA,CAAI,IAE9F,gBAAAO,EAAC,QAAA,EAAM,GAAGP,GAAe,UAAAG,GAAQ;AAAA,EAErC;AACF;"}
1	+ {"version":3,"file":"MenuLabel.js","sources":["../../../../../src/components/Menu/components/MenuLabel.tsx"],"sourcesContent":["/* Focus and key events are disabled since menu handles them internally.\r\n onClick added to circumvent event propagation being blocked by tooltip. */\r\n\r\nimport {\r\n cloneElement,\r\n forwardRef,\r\n isValidElement,\r\n type ReactElement,\r\n type RefObject,\r\n useContext,\r\n type HTMLAttributes,\r\n useMemo,\r\n} from 'react';\r\n\r\nimport classNames from 'classnames';\r\nimport { MENU_CLASS } from 'acinguiux-ds-react-base/consts';\r\nimport type { MenuTypes } from 'acinguiux-ds-react-base/components/Menu';\r\nimport type { BadgeTypes } from 'acinguiux-ds-react-base/components/Badge';\r\nimport { getSmallerSize } from 'acinguiux-ds-react-base/utils/sizesUtils';\r\n\r\nimport type { IMenuProps } from '../Menu.types';\r\nimport MenuContext from '../MenuContext';\r\nimport Badge from '../../Badge/Badge';\r\n\r\nexport type MenuLabelRequiredTypes = 'itemIcon' \| 'className' \| 'children' \| 'size';\r\n\r\nexport interface IMenuLabelProps\r\n extends\r\n Pick<IMenuProps, MenuLabelRequiredTypes>,\r\n Omit<HTMLAttributes<HTMLElement>, 'onClick' \| 'onMouseEnter' \| 'onMouseLeave' \| 'onSelect'> {\r\n parentRef?: RefObject<HTMLElement>;\r\n path?: string;\r\n badge?: Omit<BadgeTypes.IProps, 'size'>;\r\n itemRender?: MenuTypes.ItemRender;\r\n}\r\n\r\nconst MenuLabel = forwardRef<HTMLElement, IMenuLabelProps>(\r\n ({ children, itemIcon, path, className, parentRef: _parentRef, badge, itemRender, ...rest }, ref): ReactElement => {\r\n const { itemRender: menuItemRender, size, inlineCollapsed } = useContext(MenuContext);\r\n const currentItemRender = useMemo(() => itemRender ?? menuItemRender, [itemRender, menuItemRender]);\r\n\r\n const elementProps = {\r\n ref,\r\n className: classNames(`${MENU_CLASS}-label`, className),\r\n ...rest,\r\n };\r\n\r\n const content = (\r\n <>\r\n {isValidElement(itemIcon) && <span className={`${MENU_CLASS}-label-icon`}>{itemIcon}</span>}\r\n {!!children && <span className={`${MENU_CLASS}-label-text`}>{children}</span>}\r\n {badge && !inlineCollapsed && <Badge size={getSmallerSize(size) as BadgeTypes.Size} {...badge} />}\r\n </>\r\n );\r\n\r\n return path && children && currentItemRender ? (\r\n cloneElement(currentItemRender({ path, children: content }), { ...elementProps, tabIndex: -1 })\r\n ) : (\r\n <span {...elementProps}>{content}</span>\r\n );\r\n },\r\n);\r\n\r\nexport default MenuLabel;\r\n"],"names":["MenuLabel","forwardRef","children","itemIcon","path","className","_parentRef","badge","itemRender","rest","ref","menuItemRender","size","inlineCollapsed","useContext","MenuContext","currentItemRender","useMemo","elementProps","classNames","MENU_CLASS","content","jsxs","Fragment","isValidElement","jsx","Badge","getSmallerSize","cloneElement"],"mappings":";;;;;;;AAoCA,MAAMA,IAAYC;AAAA,EAChB,CAAC,EAAE,UAAAC,GAAU,UAAAC,GAAU,MAAAC,GAAM,WAAAC,GAAW,WAAWC,GAAY,OAAAC,GAAO,YAAAC,GAAY,GAAGC,EAAA,GAAQC,MAAsB;AACjH,UAAM,EAAE,YAAYC,GAAgB,MAAAC,GAAM,iBAAAC,EAAA,IAAoBC,EAAWC,CAAW,GAC9EC,IAAoBC,EAAQ,MAAMT,KAAcG,GAAgB,CAACH,GAAYG,CAAc,CAAC,GAE5FO,IAAe;AAAA,MACnB,KAAAR;AAAA,MACA,WAAWS,EAAW,GAAGC,CAAU,UAAUf,CAAS;AAAA,MACtD,GAAGI;AAAA,IAAA,GAGCY,IACJ,gBAAAC,EAAAC,GAAA,EACG,UAAA;AAAA,MAAAC,EAAerB,CAAQ,KAAK,gBAAAsB,EAAC,QAAA,EAAK,WAAW,GAAGL,CAAU,eAAgB,UAAAjB,EAAA,CAAS;AAAA,MACnF,CAAC,CAACD,KAAY,gBAAAuB,EAAC,UAAK,WAAW,GAAGL,CAAU,eAAgB,UAAAlB,GAAS;AAAA,MACrEK,KAAS,CAACM,KAAmB,gBAAAY,EAACC,GAAA,EAAM,MAAMC,EAAef,CAAI,GAAuB,GAAGL,EAAA,CAAO;AAAA,IAAA,GACjG;AAGF,WAAOH,KAAQF,KAAYc,IACzBY,EAAaZ,EAAkB,EAAE,MAAAZ,GAAM,UAAUiB,EAAA,CAAS,GAAG,EAAE,GAAGH,GAAc,UAAU,GAAA,CAAI,IAE9F,gBAAAO,EAAC,QAAA,EAAM,GAAGP,GAAe,UAAAG,GAAQ;AAAA,EAErC;AACF;"}

package/build/esm/components/Menu/components/SubMenu.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"SubMenu.js","sources":["../../../../../src/components/Menu/components/SubMenu.tsx"],"sourcesContent":["import {\n forwardRef,\n type ReactElement,\n type ReactNode,\n type RefObject,\n useCallback,\n useContext,\n useImperativeHandle,\n useMemo,\n useRef,\n useState,\n} from 'react';\n\nimport { SubMenu as RCSubMenu, type SubMenuProps } from '@rc-component/menu';\nimport { MENU_CLASS, Positions } from 'acinguiux-ds-react-base/consts';\nimport type { BadgeTypes } from 'acinguiux-ds-react-base/components/Badge';\nimport { getSmallerSize } from 'acinguiux-ds-react-base/utils/sizesUtils';\n\nimport ChevronSmallDown from '../../Icon/components/ChevronSmallDown';\nimport MenuContext from '../MenuContext';\nimport MenuLabel from './MenuLabel';\nimport Tooltip from '../../Tooltip/Tooltip';\nimport { useClassObserver } from '../utils/classObserverUtils';\nimport { TooltipContainer, TooltipLabel } from '../styles/menuLabel.styles';\nimport { getTooltipLabelSize } from '../Menu.utils';\nimport Badge from '../../Badge/Badge';\n\nexport interface ISubMenuProps extends Omit<SubMenuProps, 'ref'> {\n level?: number;\n badge?: Omit<BadgeTypes.IProps, 'size'>;\n}\n\ninterface ITitleProps extends Omit<SubMenuProps, 'ref'> {\n level?: number;\n parentRef?: RefObject<HTMLElement>;\n badge?: Omit<BadgeTypes.IProps, 'size'>;\n isTooltipOpen?: boolean;\n}\n\nconst Title = forwardRef<HTMLDivElement, ITitleProps>(\n ({ title, parentRef, itemIcon, level, isTooltipOpen, badge }, ref): ReactNode => {\n const { inlineCollapsed, size } = useContext(MenuContext);\n const [tooltipDisabled, setTooltipDisabled] = useState(false);\n const isDisabled = useMemo(\n () => tooltipDisabled \|\| !inlineCollapsed \|\| level === undefined \|\| level > 0,\n [tooltipDisabled, inlineCollapsed, level],\n );\n\n useClassObserver(parentRef, (currentClassNames) => {\n setTooltipDisabled(currentClassNames.contains('acinguiux-menu-submenu-open'));\n });\n\n return (\n <Tooltip\n targetRef={parentRef}\n isOpen={!isDisabled && isTooltipOpen}\n isDisabled={isDisabled}\n placement={Positions.Right}\n trigger={\n <div ref={ref} className={`${MENU_CLASS}-submenu-title-content`}>\n <MenuLabel parentRef={parentRef} itemIcon={itemIcon} badge={badge}>\n {title}\n </MenuLabel>\n <ChevronSmallDown className={`${MENU_CLASS}-submenu-expand-icon`} />\n </div>\n }\n overlay={\n <TooltipContainer gap=\"1rem\">\n <TooltipLabel size={getTooltipLabelSize(size)}>{title}</TooltipLabel>\n {badge && <Badge size={getSmallerSize(size) as BadgeTypes.Size} {...badge} />}\n </TooltipContainer>\n }\n delay={50}\n closeDelay={200}\n />\n );\n },\n);\n\nconst SubMenu = forwardRef<HTMLLIElement, ISubMenuProps>(\n ({ title, itemIcon, level, badge, ...rest }, ref): ReactElement => {\n const { mode } = useContext(MenuContext);\n const subMenuRef = useRef<HTMLLIElement>(null);\n const popupOffset = mode === 'horizontal' ? [0, 4] : [8, 0];\n const [isTooltipOpen, setIsTooltipOpen] = useState(false);\n\n const onMouseEnter = useCallback(() => setIsTooltipOpen(true), []);\n const onMouseLeave = useCallback(() => setIsTooltipOpen(false), []);\n\n useImperativeHandle<HTMLLIElement \| null, HTMLLIElement \| null>(ref, () => subMenuRef.current);\n\n return (\n <RCSubMenu\n ref={subMenuRef}\n onMouseEnter={onMouseEnter}\n onMouseLeave={onMouseLeave}\n title={\n <Title\n parentRef={subMenuRef}\n title={title}\n level={level}\n itemIcon={itemIcon}\n isTooltipOpen={isTooltipOpen}\n badge={badge}\n />\n }\n popupStyle={{ padding: `${popupOffset[1]}px ${popupOffset[0]}px` }}\n {...rest}\n />\n );\n },\n);\n\nexport default SubMenu;\n"],"names":["Title","forwardRef","title","parentRef","itemIcon","level","isTooltipOpen","badge","ref","inlineCollapsed","size","useContext","MenuContext","tooltipDisabled","setTooltipDisabled","useState","isDisabled","useMemo","useClassObserver","currentClassNames","jsx","Tooltip","Positions","jsxs","MENU_CLASS","MenuLabel","ChevronSmallDown","TooltipContainer","TooltipLabel","getTooltipLabelSize","Badge","getSmallerSize","SubMenu","rest","mode","subMenuRef","useRef","popupOffset","setIsTooltipOpen","onMouseEnter","useCallback","onMouseLeave","useImperativeHandle","RCSubMenu"],"mappings":";;;;;;;;;;;;;;AAuCA,MAAMA,IAAQC;AAAA,EACZ,CAAC,EAAE,OAAAC,GAAO,WAAAC,GAAW,UAAAC,GAAU,OAAAC,GAAO,eAAAC,GAAe,OAAAC,EAAA,GAASC,MAAmB;AAC/E,UAAM,EAAE,iBAAAC,GAAiB,MAAAC,MAASC,EAAWC,CAAW,GAClD,CAACC,GAAiBC,CAAkB,IAAIC,EAAS,EAAK,GACtDC,IAAaC;AAAA,MACjB,MAAMJ,KAAmB,CAACJ,KAAmBJ,MAAU,UAAaA,IAAQ;AAAA,MAC5E,CAACQ,GAAiBJ,GAAiBJ,CAAK;AAAA,IAAA;AAG1C,WAAAa,EAAiBf,GAAW,CAACgB,MAAsB;AACjD,MAAAL,EAAmBK,EAAkB,SAAS,6BAA6B,CAAC;AAAA,IAC9E,CAAC,GAGC,gBAAAC;AAAA,MAACC;AAAA,MAAA;AAAA,QACC,WAAWlB;AAAA,QACX,QAAQ,CAACa,KAAcV;AAAA,QACvB,YAAAU;AAAA,QACA,WAAWM,EAAU;AAAA,QACrB,SACE,gBAAAC,EAAC,OAAA,EAAI,KAAAf,GAAU,WAAW,GAAGgB,CAAU,0BACrC,UAAA;AAAA,UAAA,gBAAAJ,EAACK,GAAA,EAAU,WAAAtB,GAAsB,UAAAC,GAAoB,OAAAG,GAClD,UAAAL,GACH;AAAA,UACA,gBAAAkB,EAACM,GAAA,EAAiB,WAAW,GAAGF,CAAU,uBAAA,CAAwB;AAAA,QAAA,GACpE;AAAA,QAEF,SACE,gBAAAD,EAACI,GAAA,EAAiB,KAAI,QACpB,UAAA;AAAA,UAAA,gBAAAP,EAACQ,GAAA,EAAa,MAAMC,EAAoBnB,CAAI,GAAI,UAAAR,GAAM;AAAA,UACrDK,uBAAUuB,GAAA,EAAM,MAAMC,EAAerB,CAAI,GAAuB,GAAGH,EAAA,CAAO;AAAA,QAAA,GAC7E;AAAA,QAEF,OAAO;AAAA,QACP,YAAY;AAAA,MAAA;AAAA,IAAA;AAAA,EAGlB;AACF,GAEMyB,IAAU/B;AAAA,EACd,CAAC,EAAE,OAAAC,GAAO,UAAAE,GAAU,OAAAC,GAAO,OAAAE,GAAO,GAAG0B,EAAA,GAAQzB,MAAsB;AACjE,UAAM,EAAE,MAAA0B,EAAA,IAASvB,EAAWC,CAAW,GACjCuB,IAAaC,EAAsB,IAAI,GACvCC,IAAcH,MAAS,eAAe,CAAC,GAAG,CAAC,IAAI,CAAC,GAAG,CAAC,GACpD,CAAC5B,GAAegC,CAAgB,IAAIvB,EAAS,EAAK,GAElDwB,IAAeC,EAAY,MAAMF,EAAiB,EAAI,GAAG,CAAA,CAAE,GAC3DG,IAAeD,EAAY,MAAMF,EAAiB,EAAK,GAAG,CAAA,CAAE;AAElE,WAAAI,EAAgElC,GAAK,MAAM2B,EAAW,OAAO,GAG3F,gBAAAf;AAAA,MAACuB;AAAAA,MAAA;AAAA,QACC,KAAKR;AAAA,QACL,cAAAI;AAAA,QACA,cAAAE;AAAA,QACA,OACE,gBAAArB;AAAA,UAACpB;AAAA,UAAA;AAAA,YACC,WAAWmC;AAAA,YACX,OAAAjC;AAAA,YACA,OAAAG;AAAA,YACA,UAAAD;AAAA,YACA,eAAAE;AAAA,YACA,OAAAC;AAAA,UAAA;AAAA,QAAA;AAAA,QAGJ,YAAY,EAAE,SAAS,GAAG8B,EAAY,CAAC,CAAC,MAAMA,EAAY,CAAC,CAAC,KAAA;AAAA,QAC3D,GAAGJ;AAAA,MAAA;AAAA,IAAA;AAAA,EAGV;AACF;"}
1	+ {"version":3,"file":"SubMenu.js","sources":["../../../../../src/components/Menu/components/SubMenu.tsx"],"sourcesContent":["import {\r\n forwardRef,\r\n type ReactElement,\r\n type ReactNode,\r\n type RefObject,\r\n useCallback,\r\n useContext,\r\n useImperativeHandle,\r\n useMemo,\r\n useRef,\r\n useState,\r\n} from 'react';\r\n\r\nimport { SubMenu as RCSubMenu, type SubMenuProps } from '@rc-component/menu';\r\nimport { MENU_CLASS, Positions } from 'acinguiux-ds-react-base/consts';\r\nimport type { BadgeTypes } from 'acinguiux-ds-react-base/components/Badge';\r\nimport { getSmallerSize } from 'acinguiux-ds-react-base/utils/sizesUtils';\r\n\r\nimport ChevronSmallDown from '../../Icon/components/ChevronSmallDown';\r\nimport MenuContext from '../MenuContext';\r\nimport MenuLabel from './MenuLabel';\r\nimport Tooltip from '../../Tooltip/Tooltip';\r\nimport { useClassObserver } from '../utils/classObserverUtils';\r\nimport { TooltipContainer, TooltipLabel } from '../styles/menuLabel.styles';\r\nimport { getTooltipLabelSize } from '../Menu.utils';\r\nimport Badge from '../../Badge/Badge';\r\n\r\nexport interface ISubMenuProps extends Omit<SubMenuProps, 'ref'> {\r\n level?: number;\r\n badge?: Omit<BadgeTypes.IProps, 'size'>;\r\n}\r\n\r\ninterface ITitleProps extends Omit<SubMenuProps, 'ref'> {\r\n level?: number;\r\n parentRef?: RefObject<HTMLElement>;\r\n badge?: Omit<BadgeTypes.IProps, 'size'>;\r\n isTooltipOpen?: boolean;\r\n}\r\n\r\nconst Title = forwardRef<HTMLDivElement, ITitleProps>(\r\n ({ title, parentRef, itemIcon, level, isTooltipOpen, badge }, ref): ReactNode => {\r\n const { inlineCollapsed, size } = useContext(MenuContext);\r\n const [tooltipDisabled, setTooltipDisabled] = useState(false);\r\n const isDisabled = useMemo(\r\n () => tooltipDisabled \|\| !inlineCollapsed \|\| level === undefined \|\| level > 0,\r\n [tooltipDisabled, inlineCollapsed, level],\r\n );\r\n\r\n useClassObserver(parentRef, (currentClassNames) => {\r\n setTooltipDisabled(currentClassNames.contains('acinguiux-menu-submenu-open'));\r\n });\r\n\r\n return (\r\n <Tooltip\r\n targetRef={parentRef}\r\n isOpen={!isDisabled && isTooltipOpen}\r\n isDisabled={isDisabled}\r\n placement={Positions.Right}\r\n trigger={\r\n <div ref={ref} className={`${MENU_CLASS}-submenu-title-content`}>\r\n <MenuLabel parentRef={parentRef} itemIcon={itemIcon} badge={badge}>\r\n {title}\r\n </MenuLabel>\r\n <ChevronSmallDown className={`${MENU_CLASS}-submenu-expand-icon`} />\r\n </div>\r\n }\r\n overlay={\r\n <TooltipContainer gap=\"1rem\">\r\n <TooltipLabel size={getTooltipLabelSize(size)}>{title}</TooltipLabel>\r\n {badge && <Badge size={getSmallerSize(size) as BadgeTypes.Size} {...badge} />}\r\n </TooltipContainer>\r\n }\r\n delay={50}\r\n closeDelay={200}\r\n />\r\n );\r\n },\r\n);\r\n\r\nconst SubMenu = forwardRef<HTMLLIElement, ISubMenuProps>(\r\n ({ title, itemIcon, level, badge, ...rest }, ref): ReactElement => {\r\n const { mode } = useContext(MenuContext);\r\n const subMenuRef = useRef<HTMLLIElement>(null);\r\n const popupOffset = mode === 'horizontal' ? [0, 4] : [8, 0];\r\n const [isTooltipOpen, setIsTooltipOpen] = useState(false);\r\n\r\n const onMouseEnter = useCallback(() => setIsTooltipOpen(true), []);\r\n const onMouseLeave = useCallback(() => setIsTooltipOpen(false), []);\r\n\r\n useImperativeHandle<HTMLLIElement \| null, HTMLLIElement \| null>(ref, () => subMenuRef.current);\r\n\r\n return (\r\n <RCSubMenu\r\n ref={subMenuRef}\r\n onMouseEnter={onMouseEnter}\r\n onMouseLeave={onMouseLeave}\r\n title={\r\n <Title\r\n parentRef={subMenuRef}\r\n title={title}\r\n level={level}\r\n itemIcon={itemIcon}\r\n isTooltipOpen={isTooltipOpen}\r\n badge={badge}\r\n />\r\n }\r\n popupStyle={{ padding: `${popupOffset[1]}px ${popupOffset[0]}px` }}\r\n {...rest}\r\n />\r\n );\r\n },\r\n);\r\n\r\nexport default SubMenu;\r\n"],"names":["Title","forwardRef","title","parentRef","itemIcon","level","isTooltipOpen","badge","ref","inlineCollapsed","size","useContext","MenuContext","tooltipDisabled","setTooltipDisabled","useState","isDisabled","useMemo","useClassObserver","currentClassNames","jsx","Tooltip","Positions","jsxs","MENU_CLASS","MenuLabel","ChevronSmallDown","TooltipContainer","TooltipLabel","getTooltipLabelSize","Badge","getSmallerSize","SubMenu","rest","mode","subMenuRef","useRef","popupOffset","setIsTooltipOpen","onMouseEnter","useCallback","onMouseLeave","useImperativeHandle","RCSubMenu"],"mappings":";;;;;;;;;;;;;;AAuCA,MAAMA,IAAQC;AAAA,EACZ,CAAC,EAAE,OAAAC,GAAO,WAAAC,GAAW,UAAAC,GAAU,OAAAC,GAAO,eAAAC,GAAe,OAAAC,EAAA,GAASC,MAAmB;AAC/E,UAAM,EAAE,iBAAAC,GAAiB,MAAAC,MAASC,EAAWC,CAAW,GAClD,CAACC,GAAiBC,CAAkB,IAAIC,EAAS,EAAK,GACtDC,IAAaC;AAAA,MACjB,MAAMJ,KAAmB,CAACJ,KAAmBJ,MAAU,UAAaA,IAAQ;AAAA,MAC5E,CAACQ,GAAiBJ,GAAiBJ,CAAK;AAAA,IAAA;AAG1C,WAAAa,EAAiBf,GAAW,CAACgB,MAAsB;AACjD,MAAAL,EAAmBK,EAAkB,SAAS,6BAA6B,CAAC;AAAA,IAC9E,CAAC,GAGC,gBAAAC;AAAA,MAACC;AAAA,MAAA;AAAA,QACC,WAAWlB;AAAA,QACX,QAAQ,CAACa,KAAcV;AAAA,QACvB,YAAAU;AAAA,QACA,WAAWM,EAAU;AAAA,QACrB,SACE,gBAAAC,EAAC,OAAA,EAAI,KAAAf,GAAU,WAAW,GAAGgB,CAAU,0BACrC,UAAA;AAAA,UAAA,gBAAAJ,EAACK,GAAA,EAAU,WAAAtB,GAAsB,UAAAC,GAAoB,OAAAG,GAClD,UAAAL,GACH;AAAA,UACA,gBAAAkB,EAACM,GAAA,EAAiB,WAAW,GAAGF,CAAU,uBAAA,CAAwB;AAAA,QAAA,GACpE;AAAA,QAEF,SACE,gBAAAD,EAACI,GAAA,EAAiB,KAAI,QACpB,UAAA;AAAA,UAAA,gBAAAP,EAACQ,GAAA,EAAa,MAAMC,EAAoBnB,CAAI,GAAI,UAAAR,GAAM;AAAA,UACrDK,uBAAUuB,GAAA,EAAM,MAAMC,EAAerB,CAAI,GAAuB,GAAGH,EAAA,CAAO;AAAA,QAAA,GAC7E;AAAA,QAEF,OAAO;AAAA,QACP,YAAY;AAAA,MAAA;AAAA,IAAA;AAAA,EAGlB;AACF,GAEMyB,IAAU/B;AAAA,EACd,CAAC,EAAE,OAAAC,GAAO,UAAAE,GAAU,OAAAC,GAAO,OAAAE,GAAO,GAAG0B,EAAA,GAAQzB,MAAsB;AACjE,UAAM,EAAE,MAAA0B,EAAA,IAASvB,EAAWC,CAAW,GACjCuB,IAAaC,EAAsB,IAAI,GACvCC,IAAcH,MAAS,eAAe,CAAC,GAAG,CAAC,IAAI,CAAC,GAAG,CAAC,GACpD,CAAC5B,GAAegC,CAAgB,IAAIvB,EAAS,EAAK,GAElDwB,IAAeC,EAAY,MAAMF,EAAiB,EAAI,GAAG,CAAA,CAAE,GAC3DG,IAAeD,EAAY,MAAMF,EAAiB,EAAK,GAAG,CAAA,CAAE;AAElE,WAAAI,EAAgElC,GAAK,MAAM2B,EAAW,OAAO,GAG3F,gBAAAf;AAAA,MAACuB;AAAAA,MAAA;AAAA,QACC,KAAKR;AAAA,QACL,cAAAI;AAAA,QACA,cAAAE;AAAA,QACA,OACE,gBAAArB;AAAA,UAACpB;AAAA,UAAA;AAAA,YACC,WAAWmC;AAAA,YACX,OAAAjC;AAAA,YACA,OAAAG;AAAA,YACA,UAAAD;AAAA,YACA,eAAAE;AAAA,YACA,OAAAC;AAAA,UAAA;AAAA,QAAA;AAAA,QAGJ,YAAY,EAAE,SAAS,GAAG8B,EAAY,CAAC,CAAC,MAAMA,EAAY,CAAC,CAAC,KAAA;AAAA,QAC3D,GAAGJ;AAAA,MAAA;AAAA,IAAA;AAAA,EAGV;AACF;"}

package/build/esm/components/Menu/styles/groupMenuItem.styles.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"groupMenuItem.styles.js","sources":["../../../../../src/components/Menu/styles/groupMenuItem.styles.ts"],"sourcesContent":["import { css } from 'styled-components';\nimport { MENU_CLASS } from 'acinguiux-ds-react-base/consts';\nimport { Variables } from 'acinguiux-ds-react-base/theme';\nimport { getLabelTypographySize } from 'acinguiux-ds-react-base/utils/sizesUtils';\nimport { MenuConsts } from 'acinguiux-ds-react-base/components/Menu';\n\nimport type { StyledMenuProps } from '../Menu.types';\n\nexport const groupMenuItemStyle = css<StyledMenuProps>`\n ${({ theme, $size, $muted, disabled, mode }) => {\n const padding = `${MenuConsts.consts[$size].padding}px`;\n const indent = `${MenuConsts.consts[$size].indent}px`;\n const subMenuGroupIndent = `${MenuConsts.consts[$size].indent * 2}px`;\n const layer = theme.layer({ foundation: 'surface', disabled, muted: $muted });\n\n return css`\n .${MENU_CLASS}-item-group {\n .${MENU_CLASS}-item-group-title {\n ${theme.typography('label', getLabelTypographySize($size))};\n padding: 0 ${indent} ${padding};\n color: ${layer[Variables.TextOnFoundationSubtle]};\n &:has(.${MENU_CLASS}-group-title-content:not(.${MENU_CLASS}-group-title-content-subtle)) {\n text-transform: uppercase;\n }\n\n ${mode !== 'horizontal' &&\n css`\n margin-right: ${MenuConsts.consts[$size].collapsedItemMarginRight};\n `}\n }\n\n .${MENU_CLASS}-group-title-content:not(.${MENU_CLASS}-group-title-content-subtle) {\n margin-top: 4px;\n padding-bottom: 4px;\n margin-bottom: -5px;\n border-bottom: 1px solid ${layer[Variables.BorderOnFoundationSubtle]};\n }\n\n .${MENU_CLASS}-group-title-content-subtle {\n margin-bottom: -6px;\n }\n\n /* Horizontal /\n ${mode === 'horizontal' &&\n css`\n .${MENU_CLASS}-item-group-list {\n display: flex;\n flex-direction: row;\n align-items: stretch;\n }\n `}\n }\n\n / Inline /\n ${mode === 'inline' &&\n css`\n .${MENU_CLASS}-submenu .${MENU_CLASS}-item-group {\n .${MENU_CLASS}-item-group-title {\n padding-left: ${subMenuGroupIndent};\n }\n\n &.${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 `}\n\n / Popup /\n &.${MENU_CLASS}-submenu {\n / Horizontal */\n ${mode === 'horizontal' &&\n css`\n .${MENU_CLASS}-item-group .${MENU_CLASS}-item-group-list {\n display: flex;\n flex-direction: column;\n align-items: stretch;\n }\n .${MENU_CLASS}-submenu-expand-icon {\n transform: rotate(-90deg);\n }\n `}\n }\n `;\n }}\n`;\n"],"names":["groupMenuItemStyle","css","theme","$size","$muted","disabled","mode","padding","MenuConsts.consts","indent","subMenuGroupIndent","layer","MENU_CLASS","getLabelTypographySize","Variables"],"mappings":";;;;;AAQO,MAAMA,IAAqBC;AAAA,IAC9B,CAAC,EAAE,OAAAC,GAAO,OAAAC,GAAO,QAAAC,GAAQ,UAAAC,GAAU,MAAAC,QAAW;AAC9C,QAAMC,IAAU,GAAGC,EAAkBL,CAAK,EAAE,OAAO,MAC7CM,IAAS,GAAGD,EAAkBL,CAAK,EAAE,MAAM,MAC3CO,IAAqB,GAAGF,EAAkBL,CAAK,EAAE,SAAS,CAAC,MAC3DQ,IAAQT,EAAM,MAAM,EAAE,YAAY,WAAW,UAAAG,GAAU,OAAOD,GAAQ;AAE5E,SAAOH;AAAA,SACFW,CAAU;AAAA,WACRA,CAAU;AAAA,YACTV,EAAM,WAAW,SAASW,EAAuBV,CAAK,CAAC,CAAC;AAAA,uBAC7CM,CAAM,IAAIF,CAAO;AAAA,mBACrBI,EAAMG,EAAU,sBAAsB,CAAC;AAAA,mBACvCF,CAAU,6BAA6BA,CAAU;AAAA;AAAA;AAAA;AAAA,YAIxDN,MAAS,gBACXL;AAAA,4BACkBO,EAAkBL,CAAK,EAAE,wBAAwB;AAAA,WAClE;AAAA;AAAA;AAAA,WAGAS,CAAU,6BAA6BA,CAAU;AAAA;AAAA;AAAA;AAAA,qCAIvBD,EAAMG,EAAU,wBAAwB,CAAC;AAAA;AAAA;AAAA,WAGnEF,CAAU;AAAA;AAAA;AAAA;AAAA;AAAA,UAKXN,MAAS,gBACXL;AAAA,aACKW,CAAU;AAAA;AAAA;AAAA;AAAA;AAAA,SAKd;AAAA;AAAA;AAAA;AAAA,QAIDN,MAAS,YACXL;AAAA,WACKW,CAAU,aAAaA,CAAU;AAAA,aAC/BA,CAAU;AAAA,4BACKF,CAAkB;AAAA;AAAA;AAAA,cAGhCE,CAAU;AAAA,iBACPA,CAAU;AAAA,iBACVA,CAAU;AAAA,iBACVA,CAAU;AAAA;AAAA;AAAA;AAAA,OAIpB;AAAA;AAAA;AAAA,UAGGA,CAAU;AAAA;AAAA,UAEVN,MAAS,gBACXL;AAAA,aACKW,CAAU,gBAAgBA,CAAU;AAAA;AAAA;AAAA;AAAA;AAAA,aAKpCA,CAAU;AAAA;AAAA;AAAA,SAGd;AAAA;AAAA;AAGP,CAAC;AAAA;"}
1	+ {"version":3,"file":"groupMenuItem.styles.js","sources":["../../../../../src/components/Menu/styles/groupMenuItem.styles.ts"],"sourcesContent":["import { css } from 'styled-components';\r\nimport { MENU_CLASS } from 'acinguiux-ds-react-base/consts';\r\nimport { Variables } from 'acinguiux-ds-react-base/theme';\r\nimport { getLabelTypographySize } from 'acinguiux-ds-react-base/utils/sizesUtils';\r\nimport { MenuConsts } from 'acinguiux-ds-react-base/components/Menu';\r\n\r\nimport type { StyledMenuProps } from '../Menu.types';\r\n\r\nexport const groupMenuItemStyle = css<StyledMenuProps>`\r\n ${({ theme, $size, $muted, disabled, mode }) => {\r\n const padding = `${MenuConsts.consts[$size].padding}px`;\r\n const indent = `${MenuConsts.consts[$size].indent}px`;\r\n const subMenuGroupIndent = `${MenuConsts.consts[$size].indent * 2}px`;\r\n const layer = theme.layer({ foundation: 'surface', disabled, muted: $muted });\r\n\r\n return css`\r\n .${MENU_CLASS}-item-group {\r\n .${MENU_CLASS}-item-group-title {\r\n ${theme.typography('label', getLabelTypographySize($size))};\r\n padding: 0 ${indent} ${padding};\r\n color: ${layer[Variables.TextOnFoundationSubtle]};\r\n &:has(.${MENU_CLASS}-group-title-content:not(.${MENU_CLASS}-group-title-content-subtle)) {\r\n text-transform: uppercase;\r\n }\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}-group-title-content:not(.${MENU_CLASS}-group-title-content-subtle) {\r\n margin-top: 4px;\r\n padding-bottom: 4px;\r\n margin-bottom: -5px;\r\n border-bottom: 1px solid ${layer[Variables.BorderOnFoundationSubtle]};\r\n }\r\n\r\n .${MENU_CLASS}-group-title-content-subtle {\r\n margin-bottom: -6px;\r\n }\r\n\r\n /* Horizontal /\r\n ${mode === 'horizontal' &&\r\n css`\r\n .${MENU_CLASS}-item-group-list {\r\n display: flex;\r\n flex-direction: row;\r\n align-items: stretch;\r\n }\r\n `}\r\n }\r\n\r\n / Inline /\r\n ${mode === 'inline' &&\r\n css`\r\n .${MENU_CLASS}-submenu .${MENU_CLASS}-item-group {\r\n .${MENU_CLASS}-item-group-title {\r\n padding-left: ${subMenuGroupIndent};\r\n }\r\n\r\n &.${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 `}\r\n\r\n / Popup /\r\n &.${MENU_CLASS}-submenu {\r\n / Horizontal */\r\n ${mode === 'horizontal' &&\r\n css`\r\n .${MENU_CLASS}-item-group .${MENU_CLASS}-item-group-list {\r\n display: flex;\r\n flex-direction: column;\r\n align-items: stretch;\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":["groupMenuItemStyle","css","theme","$size","$muted","disabled","mode","padding","MenuConsts.consts","indent","subMenuGroupIndent","layer","MENU_CLASS","getLabelTypographySize","Variables"],"mappings":";;;;;AAQO,MAAMA,IAAqBC;AAAA,IAC9B,CAAC,EAAE,OAAAC,GAAO,OAAAC,GAAO,QAAAC,GAAQ,UAAAC,GAAU,MAAAC,QAAW;AAC9C,QAAMC,IAAU,GAAGC,EAAkBL,CAAK,EAAE,OAAO,MAC7CM,IAAS,GAAGD,EAAkBL,CAAK,EAAE,MAAM,MAC3CO,IAAqB,GAAGF,EAAkBL,CAAK,EAAE,SAAS,CAAC,MAC3DQ,IAAQT,EAAM,MAAM,EAAE,YAAY,WAAW,UAAAG,GAAU,OAAOD,GAAQ;AAE5E,SAAOH;AAAA,SACFW,CAAU;AAAA,WACRA,CAAU;AAAA,YACTV,EAAM,WAAW,SAASW,EAAuBV,CAAK,CAAC,CAAC;AAAA,uBAC7CM,CAAM,IAAIF,CAAO;AAAA,mBACrBI,EAAMG,EAAU,sBAAsB,CAAC;AAAA,mBACvCF,CAAU,6BAA6BA,CAAU;AAAA;AAAA;AAAA;AAAA,YAIxDN,MAAS,gBACXL;AAAA,4BACkBO,EAAkBL,CAAK,EAAE,wBAAwB;AAAA,WAClE;AAAA;AAAA;AAAA,WAGAS,CAAU,6BAA6BA,CAAU;AAAA;AAAA;AAAA;AAAA,qCAIvBD,EAAMG,EAAU,wBAAwB,CAAC;AAAA;AAAA;AAAA,WAGnEF,CAAU;AAAA;AAAA;AAAA;AAAA;AAAA,UAKXN,MAAS,gBACXL;AAAA,aACKW,CAAU;AAAA;AAAA;AAAA;AAAA;AAAA,SAKd;AAAA;AAAA;AAAA;AAAA,QAIDN,MAAS,YACXL;AAAA,WACKW,CAAU,aAAaA,CAAU;AAAA,aAC/BA,CAAU;AAAA,4BACKF,CAAkB;AAAA;AAAA;AAAA,cAGhCE,CAAU;AAAA,iBACPA,CAAU;AAAA,iBACVA,CAAU;AAAA,iBACVA,CAAU;AAAA;AAAA;AAAA;AAAA,OAIpB;AAAA;AAAA;AAAA,UAGGA,CAAU;AAAA;AAAA,UAEVN,MAAS,gBACXL;AAAA,aACKW,CAAU,gBAAgBA,CAAU;AAAA;AAAA;AAAA;AAAA;AAAA,aAKpCA,CAAU;AAAA;AAAA;AAAA,SAGd;AAAA;AAAA;AAGP,CAAC;AAAA;"}

package/build/esm/components/Menu/styles/indicator.styles.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"indicator.styles.js","sources":["../../../../../src/components/Menu/styles/indicator.styles.ts"],"sourcesContent":["import { css, keyframes, CSSObject } from 'styled-components';\nimport { FabricsVariables } from 'acinguiux-ds-fabrics';\nimport { Positions, Sizes } from 'acinguiux-ds-react-base/consts';\nimport { type MenuTypes, MenuConsts } from 'acinguiux-ds-react-base/components/Menu';\nimport { Variables } from 'acinguiux-ds-react-base/theme';\n\nimport type { StyledMenuProps } from '../Menu.types';\n\nconst growHorizontal = (width: string) => keyframes`\n from {\n width: 0;\n }\n to {\n width: ${width};\n }\n`;\n\nconst growVertical = (height: string) => keyframes`\n from {\n height: 0;\n top: 50%;\n transform: translateY(0%);\n }\n to {\n height: ${height};\n top: 50%;\n transform: translateY(-50%);\n }\n`;\n\nconst getIndicatorStyle = ({\n width,\n height,\n position,\n size,\n}: {\n width: string;\n height: string;\n position: MenuTypes.IndicatorPosition;\n size: MenuTypes.Size;\n}) => css`\n content: '';\n position: absolute;\n display: block;\n transition: all 0.2s;\n\n ${position}: 0;\n ${position === Positions.Left \|\| position === Positions.Right\n ? `\n width: ${width};\n height: ${height};\n top: 50%;\n transform: translateY(-50%);\n margin-left: ${MenuConsts.consts[size].indicatorLeftMargin}px;\n\n ${\n position === Positions.Right &&\n css`\n left: unset;\n `\n }\n `\n : `\n height: ${width};\n width: max(${MenuConsts.consts[size].iconSize}px, ${height});\n left: 50%;\n transform: translateX(-50%);\n `}\n`;\n\nconst getBorderRadiusFromPosition = (position: MenuTypes.IndicatorPosition): CSSObject => ({\n borderTopLeftRadius: position === Positions.Bottom \|\| position === Positions.Right ? '4px' : '0',\n borderTopRightRadius: position === Positions.Bottom \|\| position === Positions.Left ? '4px' : '0',\n borderBottomLeftRadius: position === Positions.Top \|\| position === Positions.Right ? '4px' : '0',\n borderBottomRightRadius: position === Positions.Top \|\| position === Positions.Left ? '4px' : '0',\n});\n\nconst createIndicatorStyle = ({\n position,\n width,\n height,\n state,\n defaultStatus = false,\n size = Sizes.Medium,\n muted = false,\n}: {\n position: MenuTypes.IndicatorPosition;\n width: string;\n height: string;\n state: FabricsVariables.StateType \| 'disabled';\n defaultStatus?: boolean;\n size?: MenuTypes.Size;\n muted?: boolean;\n}) => css<StyledMenuProps>`\n ${({ theme }) => css`\n ${getIndicatorStyle({ width, height, position, size })};\n background-color: ${theme.layer({\n disabled: state === 'disabled',\n muted,\n })[Variables.BackgroundBrand]};\n ${getBorderRadiusFromPosition(position)};\n\n ${state === 'press' &&\n defaultStatus &&\n css`\n animation: ${position === Positions.Left \|\| position === Positions.Right\n ? growVertical(height)\n : growHorizontal(height)}\n 0.2s alternate;\n `}\n `}\n`;\n\nconst IndicatorSizes = {\n [Sizes.XSmall]: {\n x: '20px',\n y: 'calc(100% - 8px - 16px)',\n },\n [Sizes.Small]: {\n x: '20px',\n y: 'calc(100% - 8px - 24px)',\n },\n [Sizes.Medium]: {\n x: '20px',\n y: 'calc(100% - 12px - 32px)',\n },\n [Sizes.Large]: {\n x: '24px',\n y: 'calc(100% - 12px - 48px)',\n },\n};\n\nconst HoverIndicatorSizes = {\n [Sizes.XSmall]: {\n x: '24px',\n y: 'calc(100% - 16px)',\n },\n [Sizes.Small]: {\n x: '24px',\n y: 'calc(100% - 24px)',\n },\n [Sizes.Medium]: {\n x: '24px',\n y: 'calc(100% - 32px)',\n },\n [Sizes.Large]: {\n x: '28px',\n y: 'calc(100% - 48px)',\n },\n};\n\ntype IndicatorPositionStyleProps = {\n size: MenuTypes.Size;\n indicatorPosition: MenuTypes.IndicatorPosition;\n state: FabricsVariables.StateType;\n muted?: boolean;\n disabled?: boolean;\n active?: boolean;\n};\n\n// TRIGGER WARNING: incredibly complex function\n// this is wayyyy more complex than it needs to be, but I tried replicating the logic from the original object array, adding the muted prop\n// and it is a bit of a mess, but it works\n// I would suggest refactoring this when reworking the Menu component, starting from scratch! Do NOT keep this in :)\nexport const getIndicatorPositionStyle = ({\n size,\n indicatorPosition,\n state,\n disabled,\n active,\n muted,\n}: IndicatorPositionStyleProps) => {\n const xOrYPosition = indicatorPosition === 'bottom' \|\| indicatorPosition === 'top' ? 'y' : 'x';\n const indicatorHeight = IndicatorSizes[size][xOrYPosition];\n const hoverIndicatorHeight =\n state === 'hover' && !disabled ? HoverIndicatorSizes[size][xOrYPosition] : indicatorHeight;\n const indicatorInactiveheight = !active ? '30%' : hoverIndicatorHeight;\n const disabledOrState = disabled ? 'disabled' : state;\n const realState = !active ? 'press' : disabledOrState;\n\n return createIndicatorStyle({\n position: indicatorPosition,\n width: '3px',\n height: indicatorInactiveheight,\n state: realState,\n defaultStatus: !active,\n size,\n muted,\n });\n};\n"],"names":["growHorizontal","width","keyframes","growVertical","height","getIndicatorStyle","position","size","css","Positions","MenuConsts.consts","getBorderRadiusFromPosition","createIndicatorStyle","state","defaultStatus","Sizes","muted","theme","Variables","IndicatorSizes","getIndicatorPositionStyle","indicatorPosition","disabled","active","xOrYPosition","hoverIndicatorHeight"],"mappings":"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"}
1	+ {"version":3,"file":"indicator.styles.js","sources":["../../../../../src/components/Menu/styles/indicator.styles.ts"],"sourcesContent":["import { css, keyframes, CSSObject } from 'styled-components';\r\nimport { FabricsVariables } from 'acinguiux-ds-fabrics';\r\nimport { Positions, Sizes } from 'acinguiux-ds-react-base/consts';\r\nimport { type MenuTypes, MenuConsts } from 'acinguiux-ds-react-base/components/Menu';\r\nimport { Variables } from 'acinguiux-ds-react-base/theme';\r\n\r\nimport type { StyledMenuProps } from '../Menu.types';\r\n\r\nconst growHorizontal = (width: string) => keyframes`\r\n from {\r\n width: 0;\r\n }\r\n to {\r\n width: ${width};\r\n }\r\n`;\r\n\r\nconst growVertical = (height: string) => keyframes`\r\n from {\r\n height: 0;\r\n top: 50%;\r\n transform: translateY(0%);\r\n }\r\n to {\r\n height: ${height};\r\n top: 50%;\r\n transform: translateY(-50%);\r\n }\r\n`;\r\n\r\nconst getIndicatorStyle = ({\r\n width,\r\n height,\r\n position,\r\n size,\r\n}: {\r\n width: string;\r\n height: string;\r\n position: MenuTypes.IndicatorPosition;\r\n size: MenuTypes.Size;\r\n}) => css`\r\n content: '';\r\n position: absolute;\r\n display: block;\r\n transition: all 0.2s;\r\n\r\n ${position}: 0;\r\n ${position === Positions.Left \|\| position === Positions.Right\r\n ? `\r\n width: ${width};\r\n height: ${height};\r\n top: 50%;\r\n transform: translateY(-50%);\r\n margin-left: ${MenuConsts.consts[size].indicatorLeftMargin}px;\r\n\r\n ${\r\n position === Positions.Right &&\r\n css`\r\n left: unset;\r\n `\r\n }\r\n `\r\n : `\r\n height: ${width};\r\n width: max(${MenuConsts.consts[size].iconSize}px, ${height});\r\n left: 50%;\r\n transform: translateX(-50%);\r\n `}\r\n`;\r\n\r\nconst getBorderRadiusFromPosition = (position: MenuTypes.IndicatorPosition): CSSObject => ({\r\n borderTopLeftRadius: position === Positions.Bottom \|\| position === Positions.Right ? '4px' : '0',\r\n borderTopRightRadius: position === Positions.Bottom \|\| position === Positions.Left ? '4px' : '0',\r\n borderBottomLeftRadius: position === Positions.Top \|\| position === Positions.Right ? '4px' : '0',\r\n borderBottomRightRadius: position === Positions.Top \|\| position === Positions.Left ? '4px' : '0',\r\n});\r\n\r\nconst createIndicatorStyle = ({\r\n position,\r\n width,\r\n height,\r\n state,\r\n defaultStatus = false,\r\n size = Sizes.Medium,\r\n muted = false,\r\n}: {\r\n position: MenuTypes.IndicatorPosition;\r\n width: string;\r\n height: string;\r\n state: FabricsVariables.StateType \| 'disabled';\r\n defaultStatus?: boolean;\r\n size?: MenuTypes.Size;\r\n muted?: boolean;\r\n}) => css<StyledMenuProps>`\r\n ${({ theme }) => css`\r\n ${getIndicatorStyle({ width, height, position, size })};\r\n background-color: ${theme.layer({\r\n disabled: state === 'disabled',\r\n muted,\r\n })[Variables.BackgroundBrand]};\r\n ${getBorderRadiusFromPosition(position)};\r\n\r\n ${state === 'press' &&\r\n defaultStatus &&\r\n css`\r\n animation: ${position === Positions.Left \|\| position === Positions.Right\r\n ? growVertical(height)\r\n : growHorizontal(height)}\r\n 0.2s alternate;\r\n `}\r\n `}\r\n`;\r\n\r\nconst IndicatorSizes = {\r\n [Sizes.XSmall]: {\r\n x: '20px',\r\n y: 'calc(100% - 8px - 16px)',\r\n },\r\n [Sizes.Small]: {\r\n x: '20px',\r\n y: 'calc(100% - 8px - 24px)',\r\n },\r\n [Sizes.Medium]: {\r\n x: '20px',\r\n y: 'calc(100% - 12px - 32px)',\r\n },\r\n [Sizes.Large]: {\r\n x: '24px',\r\n y: 'calc(100% - 12px - 48px)',\r\n },\r\n};\r\n\r\nconst HoverIndicatorSizes = {\r\n [Sizes.XSmall]: {\r\n x: '24px',\r\n y: 'calc(100% - 16px)',\r\n },\r\n [Sizes.Small]: {\r\n x: '24px',\r\n y: 'calc(100% - 24px)',\r\n },\r\n [Sizes.Medium]: {\r\n x: '24px',\r\n y: 'calc(100% - 32px)',\r\n },\r\n [Sizes.Large]: {\r\n x: '28px',\r\n y: 'calc(100% - 48px)',\r\n },\r\n};\r\n\r\ntype IndicatorPositionStyleProps = {\r\n size: MenuTypes.Size;\r\n indicatorPosition: MenuTypes.IndicatorPosition;\r\n state: FabricsVariables.StateType;\r\n muted?: boolean;\r\n disabled?: boolean;\r\n active?: boolean;\r\n};\r\n\r\n// TRIGGER WARNING: incredibly complex function\r\n// this is wayyyy more complex than it needs to be, but I tried replicating the logic from the original object array, adding the muted prop\r\n// and it is a bit of a mess, but it works\r\n// I would suggest refactoring this when reworking the Menu component, starting from scratch! Do NOT keep this in :)\r\nexport const getIndicatorPositionStyle = ({\r\n size,\r\n indicatorPosition,\r\n state,\r\n disabled,\r\n active,\r\n muted,\r\n}: IndicatorPositionStyleProps) => {\r\n const xOrYPosition = indicatorPosition === 'bottom' \|\| indicatorPosition === 'top' ? 'y' : 'x';\r\n const indicatorHeight = IndicatorSizes[size][xOrYPosition];\r\n const hoverIndicatorHeight =\r\n state === 'hover' && !disabled ? HoverIndicatorSizes[size][xOrYPosition] : indicatorHeight;\r\n const indicatorInactiveheight = !active ? '30%' : hoverIndicatorHeight;\r\n const disabledOrState = disabled ? 'disabled' : state;\r\n const realState = !active ? 'press' : disabledOrState;\r\n\r\n return createIndicatorStyle({\r\n position: indicatorPosition,\r\n width: '3px',\r\n height: indicatorInactiveheight,\r\n state: realState,\r\n defaultStatus: !active,\r\n size,\r\n muted,\r\n });\r\n};\r\n"],"names":["growHorizontal","width","keyframes","growVertical","height","getIndicatorStyle","position","size","css","Positions","MenuConsts.consts","getBorderRadiusFromPosition","createIndicatorStyle","state","defaultStatus","Sizes","muted","theme","Variables","IndicatorSizes","getIndicatorPositionStyle","indicatorPosition","disabled","active","xOrYPosition","hoverIndicatorHeight"],"mappings":"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"}

package/build/esm/components/Menu/styles/menuDivider.styles.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"menuDivider.styles.js","sources":["../../../../../src/components/Menu/styles/menuDivider.styles.ts"],"sourcesContent":["import { css } from 'styled-components';\nimport { Directions, MENU_CLASS } from 'acinguiux-ds-react-base/consts';\nimport { MenuConsts } from 'acinguiux-ds-react-base/components/Menu';\n\nimport type { StyledMenuProps } from '../Menu.types';\n\nexport const menuDividerStyle = css<StyledMenuProps>`\n ${({ mode, $size, $iconPosition }) => css`\n .${MENU_CLASS}-item-divider {\n position: relative;\n display: flex;\n justify-content: center;\n align-items: center;\n padding: ${MenuConsts.consts[$size].itemPadding[\n mode === Directions.Horizontal ? Directions.Horizontal : Directions.Vertical\n ][$iconPosition]};\n\n ${mode === 'horizontal'\n ? css`\n width: fit-content;\n `\n : css`\n height: fit-content;\n `};\n }\n `}\n`;\n"],"names":["menuDividerStyle","css","mode","$size","$iconPosition","MENU_CLASS","MenuConsts.consts","Directions"],"mappings":";;;;AAMO,MAAMA,IAAmBC;AAAA,IAC5B,CAAC,EAAE,MAAAC,GAAM,OAAAC,GAAO,eAAAC,QAAoBH;AAAA,OACjCI,CAAU;AAAA;AAAA;AAAA;AAAA;AAAA,iBAKAC,EAAkBH,CAAK,EAAE,YAClCD,MAASK,EAAW,aAAaA,EAAW,aAAaA,EAAW,QACtE,EAAEH,CAAa,CAAC;AAAA;AAAA,QAEdF,MAAS,eACPD;AAAA;AAAA,cAGAA;AAAA;AAAA,WAEC;AAAA;AAAA,GAER;AAAA;"}
1	+ {"version":3,"file":"menuDivider.styles.js","sources":["../../../../../src/components/Menu/styles/menuDivider.styles.ts"],"sourcesContent":["import { css } from 'styled-components';\r\nimport { Directions, MENU_CLASS } 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\n\r\nexport const menuDividerStyle = css<StyledMenuProps>`\r\n ${({ mode, $size, $iconPosition }) => css`\r\n .${MENU_CLASS}-item-divider {\r\n position: relative;\r\n display: flex;\r\n justify-content: center;\r\n align-items: center;\r\n padding: ${MenuConsts.consts[$size].itemPadding[\r\n mode === Directions.Horizontal ? Directions.Horizontal : Directions.Vertical\r\n ][$iconPosition]};\r\n\r\n ${mode === 'horizontal'\r\n ? css`\r\n width: fit-content;\r\n `\r\n : css`\r\n height: fit-content;\r\n `};\r\n }\r\n `}\r\n`;\r\n"],"names":["menuDividerStyle","css","mode","$size","$iconPosition","MENU_CLASS","MenuConsts.consts","Directions"],"mappings":";;;;AAMO,MAAMA,IAAmBC;AAAA,IAC5B,CAAC,EAAE,MAAAC,GAAM,OAAAC,GAAO,eAAAC,QAAoBH;AAAA,OACjCI,CAAU;AAAA;AAAA;AAAA;AAAA;AAAA,iBAKAC,EAAkBH,CAAK,EAAE,YAClCD,MAASK,EAAW,aAAaA,EAAW,aAAaA,EAAW,QACtE,EAAEH,CAAa,CAAC;AAAA;AAAA,QAEdF,MAAS,eACPD;AAAA;AAAA,cAGAA;AAAA;AAAA,WAEC;AAAA;AAAA,GAER;AAAA;"}

package/build/esm/components/Menu/styles/menuItem.styles.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"menuItem.styles.js","sources":["../../../../../src/components/Menu/styles/menuItem.styles.ts"],"sourcesContent":["import { css } from 'styled-components';\nimport { MENU_CLASS, Directions, 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 {\n getMenuItemSelectedStyle,\n getModeIndicatorPosition,\n getMenuItemDisabledStyle,\n getBackgroundColor,\n} from '../Menu.utils';\nimport type { StyledMenuProps } from '../Menu.types';\nimport { getIndicatorPositionStyle } from './indicator.styles';\n\nexport const menuItemStyle = css<StyledMenuProps>`\n ${({ theme, $size, $muted, disabled, $indicatorPosition, $noAnimate, $iconPosition, mode }) => {\n const layer = theme.layer({ foundation: FabricsVariables.Foundations.Surface });\n const disabledLayer = theme.layer({\n foundation: FabricsVariables.Foundations.Surface,\n muted: $muted,\n disabled: true,\n });\n\n return css<StyledMenuProps>`\n .${MENU_CLASS}-item {\n position: relative;\n display: flex;\n justify-content: ${mode === Directions.Horizontal ? 'center' : 'space-between'};\n align-items: ${mode === Directions.Horizontal ? 'center' : 'stretch'};\n flex-direction: column;\n padding: ${MenuConsts.consts[$size].itemPadding[\n mode === Directions.Horizontal ? Directions.Horizontal : Directions.Vertical\n ][$iconPosition]};\n cursor: pointer;\n\n & .${MENU_CLASS}-label {\n color: ${layer[Variables.TextOnFoundationSubtle]};\n\n :not(.${BADGE_CLASS}) svg {\n fill: ${layer[Variables.TextOnFoundationSubtle]};\n }\n }\n\n &.${MENU_CLASS}-item-selected:not(.${MENU_CLASS}-item-active):not(.${MENU_CLASS}-item-disabled) {\n .${MENU_CLASS}-label {\n color: ${layer[Variables.TextOnFoundationStrong]};\n\n :not(.${BADGE_CLASS}) svg {\n fill: ${layer[Variables.TextOnFoundationStrong]};\n }\n }\n }\n\n &.${MENU_CLASS}-item-active:not(.${MENU_CLASS}-item-disabled) {\n .${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}-item-disabled {\n &,\n .${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}-item-active:not(.${MENU_CLASS}-item-selected):not(.${MENU_CLASS}-item-disabled) {\n .${MENU_CLASS}-label {\n background-color: ${getBackgroundColor(\n theme,\n FabricsVariables.States.Hover,\n FabricsVariables.Foundations.Section,\n $muted,\n )};\n }\n\n &:active .${MENU_CLASS}-label {\n background-color: ${getBackgroundColor(\n theme,\n FabricsVariables.States.Press,\n FabricsVariables.Foundations.Section,\n $muted,\n )};\n\n ${$noAnimate !== true &&\n css<StyledMenuProps>`\n &::after {\n ${getIndicatorPositionStyle({\n indicatorPosition: getModeIndicatorPosition($indicatorPosition, mode),\n size: $size,\n state: 'resting',\n active: false,\n disabled,\n muted: $muted,\n })};\n }\n `};\n }\n\n /* Span focus /\n &:focus-visible {\n .${MENU_CLASS}-label {\n background-color: transparent;\n }\n }\n\n / Anchor focus /\n .${MENU_CLASS}-label:focus-visible {\n background-color: transparent;\n }\n }\n\n / remove default focus /\n &:focus-visible {\n outline: none;\n }\n\n / set focus visible for label & custom render items /\n &:focus-visible .${MENU_CLASS}-label, .${MENU_CLASS}-label:focus-visible {\n ${getFocusStyles(theme)};\n }\n }\n\n / Vertical and horizontal popup /\n\n .${MENU_CLASS}-vertical {\n .${MENU_CLASS}-label {\n ${mode === 'horizontal' &&\n css`\n margin: -4px 2px;\n `}\n }\n }\n\n ${$noAnimate !== true &&\n css<StyledMenuProps>`\n .${MENU_CLASS}-vertical .${MENU_CLASS}-item-active.${MENU_CLASS}-item:not(.${MENU_CLASS}-item-selected) {\n &:active .${MENU_CLASS}-label {\n &::after {\n ${getIndicatorPositionStyle({\n indicatorPosition: getModeIndicatorPosition($indicatorPosition),\n size: $size,\n state: 'resting',\n disabled,\n muted: $muted,\n })};\n }\n }\n }\n `};\n\n .${MENU_CLASS}-vertical .${MENU_CLASS}-item.${MENU_CLASS}-item-selected .${MENU_CLASS}-label {\n ${getMenuItemSelectedStyle(theme, $indicatorPosition, 'vertical', $size, $muted)};\n }\n\n / Inline and vertical top level /\n\n / Disabled /\n &.${MENU_CLASS}-inline, &.${MENU_CLASS}-vertical {\n .${MENU_CLASS}-item.${MENU_CLASS}-item-selected.${MENU_CLASS}-item-disabled .${MENU_CLASS}-label {\n ${getMenuItemDisabledStyle(theme, $indicatorPosition, 'vertical', $size, $muted)};\n }\n }\n\n &.${MENU_CLASS}-inline, &.${MENU_CLASS}-vertical {\n .${MENU_CLASS}-item.${MENU_CLASS}-item-selected:not(.${MENU_CLASS}-item-disabled) .${MENU_CLASS}-label {\n ${getMenuItemSelectedStyle(theme, $indicatorPosition, 'vertical', $size, $muted)};\n }\n }\n\n / Horizontal /\n\n / Disabled */\n &.${MENU_CLASS}-horizontal\n .${MENU_CLASS}-item.${MENU_CLASS}-item-selected.${MENU_CLASS}-item-disabled\n .${MENU_CLASS}-label {\n ${getMenuItemDisabledStyle(theme, $indicatorPosition, 'horizontal', $size, $muted)};\n }\n\n &.${MENU_CLASS}-horizontal\n .${MENU_CLASS}-item.${MENU_CLASS}-item-selected:not(.${MENU_CLASS}-item-disabled)\n .${MENU_CLASS}-label {\n ${getMenuItemSelectedStyle(theme, $indicatorPosition, 'horizontal', $size, $muted)};\n }\n `;\n }}\n`;\n"],"names":["menuItemStyle","css","theme","$size","$muted","disabled","$indicatorPosition","$noAnimate","$iconPosition","mode","layer","FabricsVariables","disabledLayer","MENU_CLASS","Directions","MenuConsts.consts","Variables","BADGE_CLASS","getBackgroundColor","getIndicatorPositionStyle","getModeIndicatorPosition","getFocusStyles","getMenuItemSelectedStyle","getMenuItemDisabledStyle"],"mappings":"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"}
1	+ {"version":3,"file":"menuItem.styles.js","sources":["../../../../../src/components/Menu/styles/menuItem.styles.ts"],"sourcesContent":["import { css } from 'styled-components';\r\nimport { MENU_CLASS, Directions, 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 {\r\n getMenuItemSelectedStyle,\r\n getModeIndicatorPosition,\r\n getMenuItemDisabledStyle,\r\n getBackgroundColor,\r\n} from '../Menu.utils';\r\nimport type { StyledMenuProps } from '../Menu.types';\r\nimport { getIndicatorPositionStyle } from './indicator.styles';\r\n\r\nexport const menuItemStyle = css<StyledMenuProps>`\r\n ${({ theme, $size, $muted, disabled, $indicatorPosition, $noAnimate, $iconPosition, mode }) => {\r\n const layer = theme.layer({ foundation: FabricsVariables.Foundations.Surface });\r\n const disabledLayer = theme.layer({\r\n foundation: FabricsVariables.Foundations.Surface,\r\n muted: $muted,\r\n disabled: true,\r\n });\r\n\r\n return css<StyledMenuProps>`\r\n .${MENU_CLASS}-item {\r\n position: relative;\r\n display: flex;\r\n justify-content: ${mode === Directions.Horizontal ? 'center' : 'space-between'};\r\n align-items: ${mode === Directions.Horizontal ? 'center' : 'stretch'};\r\n flex-direction: column;\r\n padding: ${MenuConsts.consts[$size].itemPadding[\r\n mode === Directions.Horizontal ? Directions.Horizontal : Directions.Vertical\r\n ][$iconPosition]};\r\n cursor: pointer;\r\n\r\n & .${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 &.${MENU_CLASS}-item-selected:not(.${MENU_CLASS}-item-active):not(.${MENU_CLASS}-item-disabled) {\r\n .${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 &.${MENU_CLASS}-item-active:not(.${MENU_CLASS}-item-disabled) {\r\n .${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}-item-disabled {\r\n &,\r\n .${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}-item-active:not(.${MENU_CLASS}-item-selected):not(.${MENU_CLASS}-item-disabled) {\r\n .${MENU_CLASS}-label {\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 &:active .${MENU_CLASS}-label {\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 ${$noAnimate !== true &&\r\n css<StyledMenuProps>`\r\n &::after {\r\n ${getIndicatorPositionStyle({\r\n indicatorPosition: getModeIndicatorPosition($indicatorPosition, mode),\r\n size: $size,\r\n state: 'resting',\r\n active: false,\r\n disabled,\r\n muted: $muted,\r\n })};\r\n }\r\n `};\r\n }\r\n\r\n /* Span focus /\r\n &:focus-visible {\r\n .${MENU_CLASS}-label {\r\n background-color: transparent;\r\n }\r\n }\r\n\r\n / Anchor focus /\r\n .${MENU_CLASS}-label:focus-visible {\r\n background-color: transparent;\r\n }\r\n }\r\n\r\n / remove default focus /\r\n &:focus-visible {\r\n outline: none;\r\n }\r\n\r\n / set focus visible for label & custom render items /\r\n &:focus-visible .${MENU_CLASS}-label, .${MENU_CLASS}-label:focus-visible {\r\n ${getFocusStyles(theme)};\r\n }\r\n }\r\n\r\n / Vertical and horizontal popup /\r\n\r\n .${MENU_CLASS}-vertical {\r\n .${MENU_CLASS}-label {\r\n ${mode === 'horizontal' &&\r\n css`\r\n margin: -4px 2px;\r\n `}\r\n }\r\n }\r\n\r\n ${$noAnimate !== true &&\r\n css<StyledMenuProps>`\r\n .${MENU_CLASS}-vertical .${MENU_CLASS}-item-active.${MENU_CLASS}-item:not(.${MENU_CLASS}-item-selected) {\r\n &:active .${MENU_CLASS}-label {\r\n &::after {\r\n ${getIndicatorPositionStyle({\r\n indicatorPosition: getModeIndicatorPosition($indicatorPosition),\r\n size: $size,\r\n state: 'resting',\r\n disabled,\r\n muted: $muted,\r\n })};\r\n }\r\n }\r\n }\r\n `};\r\n\r\n .${MENU_CLASS}-vertical .${MENU_CLASS}-item.${MENU_CLASS}-item-selected .${MENU_CLASS}-label {\r\n ${getMenuItemSelectedStyle(theme, $indicatorPosition, 'vertical', $size, $muted)};\r\n }\r\n\r\n / Inline and vertical top level /\r\n\r\n / Disabled /\r\n &.${MENU_CLASS}-inline, &.${MENU_CLASS}-vertical {\r\n .${MENU_CLASS}-item.${MENU_CLASS}-item-selected.${MENU_CLASS}-item-disabled .${MENU_CLASS}-label {\r\n ${getMenuItemDisabledStyle(theme, $indicatorPosition, 'vertical', $size, $muted)};\r\n }\r\n }\r\n\r\n &.${MENU_CLASS}-inline, &.${MENU_CLASS}-vertical {\r\n .${MENU_CLASS}-item.${MENU_CLASS}-item-selected:not(.${MENU_CLASS}-item-disabled) .${MENU_CLASS}-label {\r\n ${getMenuItemSelectedStyle(theme, $indicatorPosition, 'vertical', $size, $muted)};\r\n }\r\n }\r\n\r\n / Horizontal /\r\n\r\n / Disabled */\r\n &.${MENU_CLASS}-horizontal\r\n .${MENU_CLASS}-item.${MENU_CLASS}-item-selected.${MENU_CLASS}-item-disabled\r\n .${MENU_CLASS}-label {\r\n ${getMenuItemDisabledStyle(theme, $indicatorPosition, 'horizontal', $size, $muted)};\r\n }\r\n\r\n &.${MENU_CLASS}-horizontal\r\n .${MENU_CLASS}-item.${MENU_CLASS}-item-selected:not(.${MENU_CLASS}-item-disabled)\r\n .${MENU_CLASS}-label {\r\n ${getMenuItemSelectedStyle(theme, $indicatorPosition, 'horizontal', $size, $muted)};\r\n }\r\n `;\r\n }}\r\n`;\r\n"],"names":["menuItemStyle","css","theme","$size","$muted","disabled","$indicatorPosition","$noAnimate","$iconPosition","mode","layer","FabricsVariables","disabledLayer","MENU_CLASS","Directions","MenuConsts.consts","Variables","BADGE_CLASS","getBackgroundColor","getIndicatorPositionStyle","getModeIndicatorPosition","getFocusStyles","getMenuItemSelectedStyle","getMenuItemDisabledStyle"],"mappings":";;;;;;;;;AAgBO,MAAMA,IAAgBC;AAAA,IACzB,CAAC,EAAE,OAAAC,GAAO,OAAAC,GAAO,QAAAC,GAAQ,UAAAC,GAAU,oBAAAC,GAAoB,YAAAC,GAAY,eAAAC,GAAe,MAAAC,QAAW;AAC7F,QAAMC,IAAQR,EAAM,MAAM,EAAE,YAAYS,EAAiB,YAAY,SAAS,GACxEC,IAAgBV,EAAM,MAAM;AAAA,IAChC,YAAYS,EAAiB,YAAY;AAAA,IACzC,OAAOP;AAAA,IACP,UAAU;AAAA,EAAA,CACX;AAED,SAAOH;AAAA,SACFY,CAAU;AAAA;AAAA;AAAA,2BAGQJ,MAASK,EAAW,aAAa,WAAW,eAAe;AAAA,uBAC/DL,MAASK,EAAW,aAAa,WAAW,SAAS;AAAA;AAAA,mBAEzDC,EAAkBZ,CAAK,EAAE,YAClCM,MAASK,EAAW,aAAaA,EAAW,aAAaA,EAAW,QACtE,EAAEN,CAAa,CAAC;AAAA;AAAA;AAAA,aAGXK,CAAU;AAAA,mBACJH,EAAMM,EAAU,sBAAsB,CAAC;AAAA;AAAA,mBAEvCC,CAAW;AAAA,oBACVP,EAAMM,EAAU,sBAAsB,CAAC;AAAA;AAAA;AAAA;AAAA,YAI/CH,CAAU,uBAAuBA,CAAU,sBAAsBA,CAAU;AAAA,aAC1EA,CAAU;AAAA,qBACFH,EAAMM,EAAU,sBAAsB,CAAC;AAAA;AAAA,qBAEvCC,CAAW;AAAA,sBACVP,EAAMM,EAAU,sBAAsB,CAAC;AAAA;AAAA;AAAA;AAAA;AAAA,YAKjDH,CAAU,qBAAqBA,CAAU;AAAA,aACxCA,CAAU;AAAA,qBACFH,EAAMM,EAAU,sBAAsB,CAAC;AAAA;AAAA,qBAEvCC,CAAW;AAAA,sBACVP,EAAMM,EAAU,sBAAsB,CAAC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,YAMjDH,CAAU;AAAA;AAAA,aAETA,CAAU;AAAA,qBACFD,EAAcI,EAAU,sBAAsB,CAAC;AAAA;AAAA;AAAA,qBAG/CC,CAAW;AAAA,sBACVL,EAAcI,EAAU,sBAAsB,CAAC;AAAA;AAAA;AAAA;AAAA;AAAA,YAKzDH,CAAU,qBAAqBA,CAAU,wBAAwBA,CAAU;AAAA,aAC1EA,CAAU;AAAA,gCACSK;AAAA,IAClBhB;AAAA,IACAS,EAAiB,OAAO;AAAA,IACxBA,EAAiB,YAAY;AAAA,IAC7BP;AAAA,EAAA,CACD;AAAA;AAAA;AAAA,sBAGSS,CAAU;AAAA,gCACAK;AAAA,IAClBhB;AAAA,IACAS,EAAiB,OAAO;AAAA,IACxBA,EAAiB,YAAY;AAAA,IAC7BP;AAAA,EAAA,CACD;AAAA;AAAA,cAECG,MAAe,MACjBN;AAAA;AAAA,kBAEMkB,EAA0B;AAAA,IAC1B,mBAAmBC,EAAyBd,GAAoBG,CAAI;AAAA,IACpE,MAAMN;AAAA,IACN,OAAO;AAAA,IACP,QAAQ;AAAA,IACR,UAAAE;AAAA,IACA,OAAOD;AAAA,EAAA,CACR,CAAC;AAAA;AAAA,aAEL;AAAA;AAAA;AAAA;AAAA;AAAA,eAKES,CAAU;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,aAMZA,CAAU;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,2BAWIA,CAAU,YAAYA,CAAU;AAAA,YAC/CQ,EAAenB,CAAK,CAAC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,SAMxBW,CAAU;AAAA,WACRA,CAAU;AAAA,YACTJ,MAAS,gBACXR;AAAA;AAAA,WAEC;AAAA;AAAA;AAAA;AAAA,QAIHM,MAAe,MACjBN;AAAA,WACKY,CAAU,cAAcA,CAAU,gBAAgBA,CAAU,cAAcA,CAAU;AAAA,sBACzEA,CAAU;AAAA;AAAA,gBAEhBM,EAA0B;AAAA,IAC1B,mBAAmBC,EAAyBd,CAAkB;AAAA,IAC9D,MAAMH;AAAA,IACN,OAAO;AAAA,IACP,UAAAE;AAAA,IACA,OAAOD;AAAA,EAAA,CACR,CAAC;AAAA;AAAA;AAAA;AAAA,OAIT;AAAA;AAAA,SAEES,CAAU,cAAcA,CAAU,SAASA,CAAU,mBAAmBA,CAAU;AAAA,UACjFS,EAAyBpB,GAAOI,GAAoB,YAAYH,GAAOC,CAAM,CAAC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,UAM9ES,CAAU,cAAcA,CAAU;AAAA,WACjCA,CAAU,SAASA,CAAU,kBAAkBA,CAAU,mBAAmBA,CAAU;AAAA,YACrFU,EAAyBrB,GAAOI,GAAoB,YAAYH,GAAOC,CAAM,CAAC;AAAA;AAAA;AAAA;AAAA,UAIhFS,CAAU,cAAcA,CAAU;AAAA,WACjCA,CAAU,SAASA,CAAU,uBAAuBA,CAAU,oBAAoBA,CAAU;AAAA,YAC3FS,EAAyBpB,GAAOI,GAAoB,YAAYH,GAAOC,CAAM,CAAC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,UAOhFS,CAAU;AAAA,WACTA,CAAU,SAASA,CAAU,kBAAkBA,CAAU;AAAA,WACzDA,CAAU;AAAA,UACXU,EAAyBrB,GAAOI,GAAoB,cAAcH,GAAOC,CAAM,CAAC;AAAA;AAAA;AAAA,UAGhFS,CAAU;AAAA,WACTA,CAAU,SAASA,CAAU,uBAAuBA,CAAU;AAAA,WAC9DA,CAAU;AAAA,UACXS,EAAyBpB,GAAOI,GAAoB,cAAcH,GAAOC,CAAM,CAAC;AAAA;AAAA;AAGxF,CAAC;AAAA;"}