acinguiux-ds-react-framework 0.1.25 → 0.1.27

package/build/cjs/components/ListItem/ListItem.js.map

@@ -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","memo"],"mappings":"meAiBMA,EAAWC,EAAAA,WACf,CACE,CACE,UAAAC,EACA,KAAAC,EACA,KAAAC,EACA,MAAAC,EACA,SAAAC,EACA,SAAAC,EAAW,GACX,iBAAAC,EAAmBC,EAAAA,UAAU,MAC7B,SAAAC,EAAW,GACX,KAAAC,EAAOC,EAAAA,MAAM,OACb,QAAAC,EAAUC,EAAAA,iBAA+B,QACzC,cAAAC,EAAgBC,EAAAA,sBAAoC,SACpD,kBAAAC,EAAoB,GACpB,WAAAC,EAAa,GACb,UAAAC,EAAY,GACZ,MAAAC,EACA,GAAGC,CAAA,EAELC,IACiB,CACjB,MAAMC,EAAe,IAAM,CACzB,OAAQR,EAAA,CACN,KAAKC,EAAAA,sBAAoC,SACvC,OAAOC,EACLO,EAAAA,IAACC,EAAA,CAAS,SAAU,GAAI,KAAMC,EAAAA,OAAsBf,CAAI,EAAE,UAAW,QAASD,EAAU,EAExFc,EAAAA,IAACG,EAAAA,MAAA,CAAa,UAAWC,EAAAA,6BAA8B,EAE3D,KAAKZ,EAAAA,sBAAoC,MACvC,OAAOC,EACLO,EAAAA,IAACK,EAAA,CAAY,SAAU,GAAI,KAAMH,EAAAA,OAAsBf,CAAI,EAAE,UAAW,QAASD,EAAU,EAE3Fc,EAAAA,IAACM,EAAAA,MAAA,CAAa,UAAWF,EAAAA,6BAA8B,EAE3D,QACE,OAAO,IAAA,CAEb,EAEA,OACEG,EAAAA,KAACC,EAAAA,gBAAA,CACC,UAAWC,EAAWC,EAAAA,gBAAiBhC,CAAS,EAChD,IAAAoB,EACA,SAAUJ,EAAa,GAAK,EAC5B,MAAOP,EACP,cAAe,CAAC,CAACL,EACjB,kBAAmBE,EACnB,SAAUK,EACV,oBAAqB,EAAQV,GAAS,EAAQC,EAC9C,UAAWM,EACX,UAAWH,EACX,mBAAoBU,EACpB,WAAYE,EACZ,qBAAsBD,EACrB,GAAGG,EAEJ,SAAA,CAAAG,EAAAA,IAACW,EAAAA,MAAA,CACC,SAAA5B,EACA,KAAAI,EACA,MAAOS,IAAU,CAACD,GAAa,OAAOd,GAAU,SAAWA,EAAQ,QAElE,SAAAA,CAAA,CAAA,EAEFQ,IAAYC,EAAAA,iBAA+B,MAAQV,GAClDoB,EAAAA,IAACY,gBAAA,CAAqB,MAAOzB,EAAM,cAAa,QAAQP,CAAI,GAC1D,SAAAoB,EAAAA,IAACa,EAAA,CAAK,KAAAjC,EAAY,EACpB,EAEDS,IAAYC,EAAAA,iBAA+B,MAAQX,EACnDG,GACCkB,EAAAA,IAACc,EAAAA,SAAA,CACC,kBAAmB9B,EACnB,KAAMkB,EAAAA,OAAsBf,CAAI,EAAE,SAClC,SAAS,SACT,SAAAJ,EACA,MAAOD,EAEN,SAAAA,CAAA,CAAA,EAGLkB,EAAAA,IAACe,EAAAA,mBAAA,CAA2B,YAAa,CAAE,CAAA,CAAA,CAAA,CAGjD,CACF,EAEAvC,EAAewC,EAAAA,KAAKxC,CAAQ"}
+{"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","memo"],"mappings":"meAiBMA,EAAWC,EAAAA,WACf,CACE,CACE,UAAAC,EACA,KAAAC,EACA,KAAAC,EACA,MAAAC,EACA,SAAAC,EACA,SAAAC,EAAW,GACX,iBAAAC,EAAmBC,EAAAA,UAAU,MAC7B,SAAAC,EAAW,GACX,KAAAC,EAAOC,EAAAA,MAAM,OACb,QAAAC,EAAUC,EAAAA,iBAA+B,QACzC,cAAAC,EAAgBC,EAAAA,sBAAoC,SACpD,kBAAAC,EAAoB,GACpB,WAAAC,EAAa,GACb,UAAAC,EAAY,GACZ,MAAAC,EACA,GAAGC,CAAA,EAELC,IACiB,CACjB,MAAMC,EAAe,IAAM,CACzB,OAAQR,EAAA,CACN,KAAKC,EAAAA,sBAAoC,SACvC,OAAOC,EACLO,EAAAA,IAACC,EAAA,CAAS,SAAU,GAAI,KAAMC,EAAAA,OAAsBf,CAAI,EAAE,UAAW,QAASD,EAAU,EAExFc,EAAAA,IAACG,EAAAA,MAAA,CAAa,UAAWC,EAAAA,6BAA8B,EAE3D,KAAKZ,EAAAA,sBAAoC,MACvC,OAAOC,EACLO,EAAAA,IAACK,EAAA,CAAY,SAAU,GAAI,KAAMH,EAAAA,OAAsBf,CAAI,EAAE,UAAW,QAASD,EAAU,EAE3Fc,EAAAA,IAACM,EAAAA,MAAA,CAAa,UAAWF,EAAAA,6BAA8B,EAE3D,QACE,OAAO,IAAA,CAEb,EAEA,OACEG,EAAAA,KAACC,EAAAA,gBAAA,CACC,UAAWC,EAAWC,EAAAA,gBAAiBhC,CAAS,EAChD,IAAAoB,EACA,SAAUJ,EAAa,GAAK,EAC5B,MAAOP,EACP,cAAe,CAAC,CAACL,EACjB,kBAAmBE,EACnB,SAAUK,EACV,oBAAqB,EAAQV,GAAS,EAAQC,EAC9C,UAAWM,EACX,UAAWH,EACX,mBAAoBU,EACpB,WAAYE,EACZ,qBAAsBD,EACrB,GAAGG,EAEJ,SAAA,CAAAG,EAAAA,IAACW,EAAAA,MAAA,CACC,SAAA5B,EACA,KAAAI,EACA,MAAOS,IAAU,CAACD,GAAa,OAAOd,GAAU,SAAWA,EAAQ,QAElE,SAAAA,CAAA,CAAA,EAEFQ,IAAYC,EAAAA,iBAA+B,MAAQV,GAClDoB,EAAAA,IAACY,gBAAA,CAAqB,MAAOzB,EAAM,cAAa,QAAQP,CAAI,GAC1D,SAAAoB,EAAAA,IAACa,EAAA,CAAK,KAAAjC,EAAY,EACpB,EAEDS,IAAYC,EAAAA,iBAA+B,MAAQX,EACnDG,GACCkB,EAAAA,IAACc,EAAAA,SAAA,CACC,kBAAmB9B,EACnB,KAAMkB,EAAAA,OAAsBf,CAAI,EAAE,SAClC,SAAS,SACT,SAAAJ,EACA,MAAOD,EAEN,SAAAA,CAAA,CAAA,EAGLkB,EAAAA,IAACe,EAAAA,mBAAA,CAA2B,YAAa,CAAE,CAAA,CAAA,CAAA,CAGjD,CACF,EAEAvC,EAAewC,EAAAA,KAAKxC,CAAQ"}

package/build/cjs/components/ListItem/ListItem.styles.js.map

@@ -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":"ykBAYMA,EAAQC,EAAAA,OAAOC,CAAS;AAAA;AAAA,EAIxBC,EAAQF,EAAAA,OAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAQfG,EAAqBH,EAAAA,OAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAQ5BI,EAAgBJ,EAAAA,OAAO,IAC3B,CAAC,CAAE,MAAAK,CAAA,IAAYC,EAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA,iBAMAC,EAAAA,OAAsBF,CAAK,EAAE,QAAQ;AAAA,GAEtD,EAEMG,EAAQR,EAAAA,OAAOS,CAAS;AAAA;AAAA;AAAA,EAKxBC,EAAWV,EAAAA,OAAOS,CAAS,EAC/B,CAAC,CAAE,kBAAAE,CAAA,IAAwBL,EAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA,MAOvBK,IAAsB,SACxBL,EAAAA;AAAAA;AAAAA,KAEC;AAAA,GAEL,EAEMM,EAAkBZ,EAAAA,OAAO;AAAA,IAC3B,CAAC,CACD,MAAAa,EACA,kBAAAF,EACA,MAAAN,EACA,qBAAAS,EACA,SAAAC,EACA,UAAAC,EACA,cAAAC,EACA,UAAAC,EACA,oBAAAC,EACA,mBAAAC,EACA,WAAAC,CACF,IAAM,CACJ,MAAMC,EAAaT,EAAM,MAAM,CAAE,MAAO,QAAS,EAC3CU,EAAcV,EAAM,MAAM,CAAE,MAAO,QAAS,EAC5CW,EAAgBX,EAAM,MAAM,CAAE,SAAU,GAAM,EAEpD,OAAOP,EAAAA;AAAAA;AAAAA;AAAAA;AAAAA,oBAISC,EAAAA,OAAsBF,CAAK,EAAE,GAAG;AAAA;AAAA,iBAEnCE,SAAsBF,CAAK,EAAE,QAAQ,QAAQ,MAAME,EAAAA,OAAsBF,CAAK,EAAE,QAAQ,UAAU;AAAA;AAAA;AAAA;AAAA,QAI3GoB,wBAAsB,CACtB,kBAAAd,EACA,SAAAI,EAEA,cAAAE,EACA,oBAAAE,EACA,mBAAAC,EACA,SAAUb,EAAAA,OAAsBF,CAAK,EAAE,QAAA,CACxC,CAAC;AAAA;AAAA,SAECqB,EAAAA,UAAU,KAAK3B,CAAK;AAAA;AAAA;AAAA,iBAGZQ,EAAAA,OAAsBF,CAAK,EAAE,QAAQ;AAAA,kBACpCE,EAAAA,OAAsBF,CAAK,EAAE,QAAQ;AAAA;AAAA;AAAA,QAG/CF,CAAkB;AAAA,iBACTI,EAAAA,OAAsBF,CAAK,EAAE,QAAQ;AAAA,kBACpCE,EAAAA,OAAsBF,CAAK,EAAE,QAAQ;AAAA;AAAA;AAAA,QAG/CK,CAAQ;AAAA,kBACEL,IAAUsB,EAAAA,MAAM,OAAS,IAAM,OAAO;AAAA;AAAA;AAAA,QAGhD5B,CAAK;AAAA,QACLG,CAAK;AAAA;AAAA;AAAA;AAAA,QAIL,CAACmB,GACHf,EAAAA;AAAAA,UACIE,CAAK;AAAA;AAAA;AAAA;AAAA;AAAA,OAKR;AAAA;AAAA,QAECU,GACFZ,EAAAA;AAAAA,UACIF,CAAa;AAAA;AAAA;AAAA,4BAGKoB,EAAcI,YAAU,oBAAoB,CAAC;AAAA,iBACxDJ,EAAcI,YAAU,sBAAsB,CAAC;AAAA;AAAA,OAEzD;AAAA;AAAA,QAEC,CAACV,GACHZ,EAAAA;AAAAA;AAAAA,8BAEwBgB,EAAWM,YAAU,oBAAoB,CAAC;AAAA;AAAA;AAAA;AAAA,8BAI1CL,EAAYK,YAAU,oBAAoB,CAAC;AAAA;AAAA,UAE/D,CAACd,GACHR,EAAAA;AAAAA;AAAAA,gCAEwBgB,EAAWM,YAAU,oBAAoB,CAAC;AAAA;AAAA;AAAA;AAAA,gCAI1CL,EAAYK,YAAU,oBAAoB,CAAC;AAAA;AAAA,SAElE;AAAA,OACF;AAAA;AAAA,QAECZ,GACFV,EAAAA;AAAAA,4BACsBc,EAChB,cACAP,EAAM,MAAM,CAAE,SAAUK,EAAW,mBAAoB,QAAA,CAAU,EAAEU,EAAAA,UAAU,kBAAkB,CAAC;AAAA;AAAA,UAElG7B,CAAK;AAAA,UACLG,CAAK;AAAA;AAAA;AAAA;AAAA;AAAA,8BAKeW,EAAM,MAAM,CAC9B,SAAUK,EACV,mBAAoB,SACpB,MAAOW,EAAAA,iBAAiB,OAAO,KAAA,CAChC,EAAED,EAAAA,UAAU,kBAAkB,CAAC;AAAA;AAAA;AAAA;AAAA,8BAIZf,EAAM,MAAM,CAC9B,SAAUK,EACV,mBAAoB,SACpB,MAAOW,EAAAA,iBAAiB,OAAO,KAAA,CAChC,EAAED,EAAAA,UAAU,kBAAkB,CAAC;AAAA;AAAA;AAAA,UAGhC,CAACd,GACHR,EAAAA;AAAAA;AAAAA,gCAEwBO,EAAM,MAAM,CAC9B,SAAUK,EACV,mBAAoB,SACpB,MAAOW,EAAAA,iBAAiB,OAAO,KAAA,CAChC,EAAED,EAAAA,UAAU,kBAAkB,CAAC;AAAA;AAAA;AAAA;AAAA,gCAIZf,EAAM,MAAM,CAC9B,SAAUK,EACV,mBAAoB,SACpB,MAAOW,EAAAA,iBAAiB,OAAO,KAAA,CAChC,EAAED,EAAAA,UAAU,kBAAkB,CAAC;AAAA;AAAA,SAEnC;AAAA,OACF;AAAA;AAAA;AAAA,UAGGE,EAAAA,eAAejB,CAAK,CAAC;AAAA;AAAA,KAG7B,CAAC;AAAA"}
+{"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/cjs/components/ListItem/ListItem.utils.js.map

@@ -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":"mMAKMA,EAAc,IAAIC,IACfA,EAAI,OAAQC,GAAQ,CAAC,CAACA,CAAG,EAAE,KAAK,GAAG,EAW/BC,EAAwB,CAAC,CACpC,cAAAC,EACA,kBAAAC,EACA,SAAAC,EACA,oBAAAC,EACA,mBAAAC,EAAqB,GACrB,SAAAC,CACF,IAA4F,CAC1F,MAAMC,EAAeJ,IAAa,WAAa,EAAQC,EAEjDI,EAAY,QACZC,EAAe,MAEfC,EAAW,OACXC,EAAc,mBAEdC,EAAqB,IACrBC,EAAgB,YAChBC,EAAmB,GAAGR,CAAQ,KAE9BS,EAAgBR,GAAgB,IAChCS,EAAWT,GAAgB,OAC3BU,EAAcV,GAAgB,GAAGD,CAAQ,KAEzCY,EAAeb,EACjBc,EAAAA;AAAAA,gCAC0BtB,EAAYgB,EAAeG,EAAUR,CAAS,CAAC;AAAA,iCAC9CX,EAAYiB,EAAkBG,EAAaR,CAAY,CAAC;AAAA,QAEnFU,EAAAA;AAAAA,gCAC0BtB,EAAYmB,EAAUR,EAAWK,CAAa,CAAC;AAAA,iCAC9ChB,EAAYoB,EAAaR,EAAcK,CAAgB,CAAC;AAAA,QAGvF,GAAI,CAACb,EACH,OAAOiB,EAGT,GAAIb,EACF,OAAQH,EAAA,CACN,KAAKkB,EAAAA,UAAU,IACb,OAAOD,EAAAA;AAAAA;AAAAA,eAEAtB,EAAYe,EAAoBG,EAAeL,CAAQ,CAAC;AAAA,eACxDb,EAAYgB,EAAeG,EAAUR,CAAS,CAAC;AAAA,mCAC3BX,EAAYiB,EAAkBG,EAAaR,CAAY,CAAC;AAAA,UAErF,KAAKW,EAAAA,UAAU,OACb,OAAOD,EAAAA;AAAAA;AAAAA,eAEAtB,EAAYgB,EAAeG,EAAUR,CAAS,CAAC;AAAA,eAC/CX,EAAYe,EAAoBG,EAAeL,CAAQ,CAAC;AAAA,mCACpCb,EAAYiB,EAAkBG,EAAaR,CAAY,CAAC;AAAA,UAErF,KAAKW,EAAAA,UAAU,MACb,OAAOD,EAAAA;AAAAA,kCACmBtB,EAAYgB,EAAeG,EAAUR,EAAWE,CAAQ,CAAC;AAAA,mCACxDb,EAAYiB,EAAkBG,EAAaR,EAAcE,CAAW,CAAC;AAAA,UAElG,QACE,OAAOO,CAAA,CAIb,OAAQhB,EAAA,CACN,KAAKkB,EAAAA,UAAU,IACb,OAAOD,EAAAA;AAAAA;AAAAA,aAEAtB,EAAYkB,EAAeL,EAAUE,CAAkB,CAAC;AAAA,aACxDf,EAAYmB,EAAUR,EAAWK,CAAa,CAAC;AAAA,iCAC3BhB,EAAYoB,EAAaR,EAAcK,CAAgB,CAAC;AAAA,QAErF,KAAKM,EAAAA,UAAU,OACb,OAAOD,EAAAA;AAAAA;AAAAA,aAEAtB,EAAYmB,EAAUR,EAAWK,CAAa,CAAC;AAAA,aAC/ChB,EAAYkB,EAAeL,EAAUE,CAAkB,CAAC;AAAA,iCACpCf,EAAYoB,EAAaR,EAAcK,CAAgB,CAAC;AAAA,QAErF,KAAKM,EAAAA,UAAU,MACb,OAAOD,EAAAA;AAAAA,gCACmBtB,EAAYmB,EAAUR,EAAWE,EAAUG,CAAa,CAAC;AAAA,iCACxDhB,EAAYoB,EAAaR,EAAcE,EAAaG,CAAgB,CAAC;AAAA,QAElG,QACE,OAAOI,CAAA,CAEb"}
+{"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":"mMAKMA,EAAc,IAAIC,IACfA,EAAI,OAAQC,GAAQ,CAAC,CAACA,CAAG,EAAE,KAAK,GAAG,EAW/BC,EAAwB,CAAC,CACpC,cAAAC,EACA,kBAAAC,EACA,SAAAC,EACA,oBAAAC,EACA,mBAAAC,EAAqB,GACrB,SAAAC,CACF,IAA4F,CAC1F,MAAMC,EAAeJ,IAAa,WAAa,EAAQC,EAEjDI,EAAY,QACZC,EAAe,MAEfC,EAAW,OACXC,EAAc,mBAEdC,EAAqB,IACrBC,EAAgB,YAChBC,EAAmB,GAAGR,CAAQ,KAE9BS,EAAgBR,GAAgB,IAChCS,EAAWT,GAAgB,OAC3BU,EAAcV,GAAgB,GAAGD,CAAQ,KAEzCY,EAAeb,EACjBc,EAAAA;AAAAA,gCAC0BtB,EAAYgB,EAAeG,EAAUR,CAAS,CAAC;AAAA,iCAC9CX,EAAYiB,EAAkBG,EAAaR,CAAY,CAAC;AAAA,QAEnFU,EAAAA;AAAAA,gCAC0BtB,EAAYmB,EAAUR,EAAWK,CAAa,CAAC;AAAA,iCAC9ChB,EAAYoB,EAAaR,EAAcK,CAAgB,CAAC;AAAA,QAGvF,GAAI,CAACb,EACH,OAAOiB,EAGT,GAAIb,EACF,OAAQH,EAAA,CACN,KAAKkB,EAAAA,UAAU,IACb,OAAOD,EAAAA;AAAAA;AAAAA,eAEAtB,EAAYe,EAAoBG,EAAeL,CAAQ,CAAC;AAAA,eACxDb,EAAYgB,EAAeG,EAAUR,CAAS,CAAC;AAAA,mCAC3BX,EAAYiB,EAAkBG,EAAaR,CAAY,CAAC;AAAA,UAErF,KAAKW,EAAAA,UAAU,OACb,OAAOD,EAAAA;AAAAA;AAAAA,eAEAtB,EAAYgB,EAAeG,EAAUR,CAAS,CAAC;AAAA,eAC/CX,EAAYe,EAAoBG,EAAeL,CAAQ,CAAC;AAAA,mCACpCb,EAAYiB,EAAkBG,EAAaR,CAAY,CAAC;AAAA,UAErF,KAAKW,EAAAA,UAAU,MACb,OAAOD,EAAAA;AAAAA,kCACmBtB,EAAYgB,EAAeG,EAAUR,EAAWE,CAAQ,CAAC;AAAA,mCACxDb,EAAYiB,EAAkBG,EAAaR,EAAcE,CAAW,CAAC;AAAA,UAElG,QACE,OAAOO,CAAA,CAIb,OAAQhB,EAAA,CACN,KAAKkB,EAAAA,UAAU,IACb,OAAOD,EAAAA;AAAAA;AAAAA,aAEAtB,EAAYkB,EAAeL,EAAUE,CAAkB,CAAC;AAAA,aACxDf,EAAYmB,EAAUR,EAAWK,CAAa,CAAC;AAAA,iCAC3BhB,EAAYoB,EAAaR,EAAcK,CAAgB,CAAC;AAAA,QAErF,KAAKM,EAAAA,UAAU,OACb,OAAOD,EAAAA;AAAAA;AAAAA,aAEAtB,EAAYmB,EAAUR,EAAWK,CAAa,CAAC;AAAA,aAC/ChB,EAAYkB,EAAeL,EAAUE,CAAkB,CAAC;AAAA,iCACpCf,EAAYoB,EAAaR,EAAcK,CAAgB,CAAC;AAAA,QAErF,KAAKM,EAAAA,UAAU,MACb,OAAOD,EAAAA;AAAAA,gCACmBtB,EAAYmB,EAAUR,EAAWE,EAAUG,CAAa,CAAC;AAAA,iCACxDhB,EAAYoB,EAAaR,EAAcE,EAAaG,CAAgB,CAAC;AAAA,QAElG,QACE,OAAOI,CAAA,CAEb"}

package/build/cjs/components/ListItem/ListItemHeader.js.map

@@ -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":"icAWMA,EAAiBC,EAAAA,WACrB,CACE,CACE,UAAAC,EACA,KAAAC,EACA,KAAAC,EACA,MAAAC,EACA,QAAAC,EAAU,GACV,KAAAC,EAAOC,EAAAA,MAAM,OACb,QAAAC,EAAUC,EAAAA,iBAA+B,QACzC,GAAGC,CAAA,EAELC,IAEAC,EAAAA,KAACC,EAAAA,sBAAA,CACC,UAAWC,EAAWC,EAAAA,uBAAwBd,CAAS,EACvD,IAAAU,EACA,MAAOL,EACP,SAAUE,EACV,SAAUH,EACV,oBAAqB,EAAQH,GAAS,EAAQC,EAC9C,SAAU,GACT,GAAGO,EAEJ,SAAA,CAAAM,EAAAA,IAACC,EAAAA,MAAA,CAAqB,KAAMC,EAAAA,OAA4BZ,CAAI,EAAE,UAAW,SAAUa,EAAAA,UAAU,OAC1F,SAAAf,CAAA,CACH,EACCI,IAAYC,EAAAA,iBAA+B,MAAQN,GAClDa,EAAAA,IAACI,gBAAA,CAA6B,MAAOd,EAAM,cAAa,QAAQH,CAAI,GAClE,SAAAa,EAAAA,IAACK,EAAA,CAAK,KAAAlB,EAAY,EACpB,EAEDK,IAAYC,EAAAA,iBAA+B,MAAQP,CAAA,CAAA,CAAA,CAG1D"}
+{"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":"icAWMA,EAAiBC,EAAAA,WACrB,CACE,CACE,UAAAC,EACA,KAAAC,EACA,KAAAC,EACA,MAAAC,EACA,QAAAC,EAAU,GACV,KAAAC,EAAOC,EAAAA,MAAM,OACb,QAAAC,EAAUC,EAAAA,iBAA+B,QACzC,GAAGC,CAAA,EAELC,IAEAC,EAAAA,KAACC,EAAAA,sBAAA,CACC,UAAWC,EAAWC,EAAAA,uBAAwBd,CAAS,EACvD,IAAAU,EACA,MAAOL,EACP,SAAUE,EACV,SAAUH,EACV,oBAAqB,EAAQH,GAAS,EAAQC,EAC9C,SAAU,GACT,GAAGO,EAEJ,SAAA,CAAAM,EAAAA,IAACC,EAAAA,MAAA,CAAqB,KAAMC,EAAAA,OAA4BZ,CAAI,EAAE,UAAW,SAAUa,EAAAA,UAAU,OAC1F,SAAAf,CAAA,CACH,EACCI,IAAYC,EAAAA,iBAA+B,MAAQN,GAClDa,EAAAA,IAACI,gBAAA,CAA6B,MAAOd,EAAM,cAAa,QAAQH,CAAI,GAClE,SAAAa,EAAAA,IAACK,EAAA,CAAK,KAAAlB,EAAY,EACpB,EAEDK,IAAYC,EAAAA,iBAA+B,MAAQP,CAAA,CAAA,CAAA,CAG1D"}

package/build/cjs/components/ListItem/ListItemHeader.styles.js.map

@@ -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":"wTAOMA,EAAwBC,EAAAA,OAAO,GAGnC,CAAC,CAAE,MAAAC,EAAO,MAAAC,EAAO,SAAAC,EAAU,oBAAAC,EAAqB,SAAAC,KAAeC,EAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA,eAQlDC,EAAAA,OAA4BL,CAAK,EAAE,QAAQ,SAAW,CAAC;AAAA,QAC9DK,SAA4BL,CAAK,EAAE,QAAQ,UAAU;AAAA;AAAA;AAAA;AAAA,MAIvDG,GACFC,EAAAA;AAAAA,iBACaC,EAAAA,OAA4BL,CAAK,EAAE,QAAQ,SAAW,CAAC;AAAA,UAC9DK,SAA4BL,CAAK,EAAE,QAAQ,UAAU;AAAA,UACrDK,EAAAA,OAA4BL,CAAK,EAAE,QAAQ,SAAW,CAAC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,gBAMjDK,SAA4BL,CAAK,EAAE,QAAQ,UAAU;AAAA,iBACpDK,SAA4BL,CAAK,EAAE,QAAQ,UAAU;AAAA;AAAA,4BAE1CD,EAAM,MAAA,EAAQO,EAAAA,UAAU,wBAAwB,CAAC;AAAA;AAAA,KAExE;AAAA;AAAA,MAECC,wBAAsB,CACtB,SAAAN,EAEA,oBAAAC,EACA,SAAU,EAAA,CACX,CAAC;AAAA,GAEN"}
+{"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":"wTAOMA,EAAwBC,EAAAA,OAAO,GAGnC,CAAC,CAAE,MAAAC,EAAO,MAAAC,EAAO,SAAAC,EAAU,oBAAAC,EAAqB,SAAAC,KAAeC,EAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA,eAQlDC,EAAAA,OAA4BL,CAAK,EAAE,QAAQ,SAAW,CAAC;AAAA,QAC9DK,SAA4BL,CAAK,EAAE,QAAQ,UAAU;AAAA;AAAA;AAAA;AAAA,MAIvDG,GACFC,EAAAA;AAAAA,iBACaC,EAAAA,OAA4BL,CAAK,EAAE,QAAQ,SAAW,CAAC;AAAA,UAC9DK,SAA4BL,CAAK,EAAE,QAAQ,UAAU;AAAA,UACrDK,EAAAA,OAA4BL,CAAK,EAAE,QAAQ,SAAW,CAAC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,gBAMjDK,SAA4BL,CAAK,EAAE,QAAQ,UAAU;AAAA,iBACpDK,SAA4BL,CAAK,EAAE,QAAQ,UAAU;AAAA;AAAA,4BAE1CD,EAAM,MAAA,EAAQO,EAAAA,UAAU,wBAAwB,CAAC;AAAA;AAAA,KAExE;AAAA;AAAA,MAECC,wBAAsB,CACtB,SAAAN,EAEA,oBAAAC,EACA,SAAU,EAAA,CACX,CAAC;AAAA,GAEN"}

package/build/cjs/components/Loading/Loading.js.map

@@ -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":"wPASMA,EAAUC,EAAAA,WACd,CAAC,CAAE,UAAAC,EAAW,KAAAC,EAAO,aAAc,GAAGC,CAAA,EAASC,IAAsB,CACnE,KAAM,CACJ,KAAAC,EACA,OAAAC,EACA,GAAAC,EACA,GAAAC,EACA,QAAAC,EACA,kBAAmB,CAAE,KAAMC,EAAO,GAAGC,CAAA,CAAkB,EACrDC,WAAsB,CACxB,KAAAV,EACA,GAAGC,CAAA,CACJ,EAED,OACEU,MAACC,EAAAA,iBAAA,CACC,SAAAC,EAAAA,KAACC,EAAAA,QAAA,CACC,aAAW,kBACX,UAAWC,EAAWC,EAAAA,cAAejB,CAAS,EAC9C,YAAaK,EACb,QAAAG,EACA,IAAAL,EACA,MAAAM,EACA,MAAOL,EACN,GAAGM,EAEJ,SAAA,CAAAE,EAAAA,IAACM,EAAAA,WAAA,CAAkBb,EAAW,GAAAC,EAAQ,GAAAC,EAAQ,QAC7CY,EAAAA,YAAA,CAAmBd,EAAW,GAAAC,EAAQ,GAAAC,CAAA,CAAQ,CAAA,CAAA,CAAA,EAEnD,CAEJ,CACF"}
+{"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":"wPASMA,EAAUC,EAAAA,WACd,CAAC,CAAE,UAAAC,EAAW,KAAAC,EAAO,aAAc,GAAGC,CAAA,EAASC,IAAsB,CACnE,KAAM,CACJ,KAAAC,EACA,OAAAC,EACA,GAAAC,EACA,GAAAC,EACA,QAAAC,EACA,kBAAmB,CAAE,KAAMC,EAAO,GAAGC,CAAA,CAAkB,EACrDC,WAAsB,CACxB,KAAAV,EACA,GAAGC,CAAA,CACJ,EAED,OACEU,MAACC,EAAAA,iBAAA,CACC,SAAAC,EAAAA,KAACC,EAAAA,QAAA,CACC,aAAW,kBACX,UAAWC,EAAWC,EAAAA,cAAejB,CAAS,EAC9C,YAAaK,EACb,QAAAG,EACA,IAAAL,EACA,MAAAM,EACA,MAAOL,EACN,GAAGM,EAEJ,SAAA,CAAAE,EAAAA,IAACM,EAAAA,WAAA,CAAkBb,EAAW,GAAAC,EAAQ,GAAAC,EAAQ,QAC7CY,EAAAA,YAAA,CAAmBd,EAAW,GAAAC,EAAQ,GAAAC,CAAA,CAAQ,CAAA,CAAA,CAAA,EAEnD,CAEJ,CACF"}

package/build/cjs/components/Loading/Loading.styles.js.map

@@ -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":"+PAOMA,EAASC,EAAAA,OAAO;AAAA;AAAA,EAITC,EAAaD,EAAAA,OAAOD,CAAM,IAE1BG,EAAcF,EAAAA,OAAOD,CAAM,IAE3BI,EAAmBH,EAAAA,OAAO;AAAA;AAAA;AAAA;AAAA;AAAA,EAO1BI,EAAUJ,EAAAA,OAAO;AAAA,IAG1B,CAAC,CAAE,MAAAK,EAAO,MAAAC,EAAO,YAAAC,EAAa,MAAAC,EAAO,GAAGC,KAAwB,CAChE,MAAMC,EAASC,EAAAA,UAAwB,CACrC,MAAAN,EACA,KAAMC,EACN,kBAAmB,CAAE,KAAME,EAAO,GAAGC,CAAA,EACrC,WAAYF,CAAA,CACb,EAED,OAAOK,EAAAA;AAAAA,QACHF,EAAO,OAAO;AAAA,mBACHG,QAAM;AAAA;AAAA,QAEjBZ,CAAU;AAAA,UACRS,EAAO,UAAU;AAAA;AAAA;AAAA,QAGnBR,CAAW;AAAA,UACTQ,EAAO,WAAW;AAAA;AAAA,KAG1B,CAAC;AAAA"}
+{"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":"+PAOMA,EAASC,EAAAA,OAAO;AAAA;AAAA,EAITC,EAAaD,EAAAA,OAAOD,CAAM,IAE1BG,EAAcF,EAAAA,OAAOD,CAAM,IAE3BI,EAAmBH,EAAAA,OAAO;AAAA;AAAA;AAAA;AAAA;AAAA,EAO1BI,EAAUJ,EAAAA,OAAO;AAAA,IAG1B,CAAC,CAAE,MAAAK,EAAO,MAAAC,EAAO,YAAAC,EAAa,MAAAC,EAAO,GAAGC,KAAwB,CAChE,MAAMC,EAASC,EAAAA,UAAwB,CACrC,MAAAN,EACA,KAAMC,EACN,kBAAmB,CAAE,KAAME,EAAO,GAAGC,CAAA,EACrC,WAAYF,CAAA,CACb,EAED,OAAOK,EAAAA;AAAAA,QACHF,EAAO,OAAO;AAAA,mBACHG,QAAM;AAAA;AAAA,QAEjBZ,CAAU;AAAA,UACRS,EAAO,UAAU;AAAA;AAAA;AAAA,QAGnBR,CAAW;AAAA,UACTQ,EAAO,WAAW;AAAA;AAAA,KAG1B,CAAC;AAAA"}

package/build/cjs/components/Menu/Menu.js.map

@@ -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":"0bAaMA,EAAYC,EAAAA,WAChB,CAAC,CAAE,UAAAC,EAAW,GAAGC,CAAA,EAAQC,IAAsBC,EAAAA,IAACC,EAAA,CAAO,IAAAF,EAAU,cAAeF,EAAY,GAAGC,CAAA,CAAM,CACvG,EAEMI,EACJ,CAACC,EAAoBC,IACpBC,GAAqB,CACpB,GAAI,CAACD,EACH,OAGF,MAAME,EAAOC,EAAAA,aAAaJ,CAAK,EAAE,KAAMK,GAAMA,EAAE,MAAQH,EAAK,GAAG,GAAG,KAClED,EAAS,CAAE,GAAGC,EAAM,KAAAC,EAAM,CAC5B,EAEIG,EAAO,CAAC,CACZ,UAAAZ,EACA,KAAAa,EAAO,SACP,KAAAC,EAAOC,EAAAA,MAAM,OACb,gBAAAC,EAAkB,GAClB,MAAAC,EAAQ,GACR,kBAAAC,EAAoBC,EAAAA,UAAU,MAC9B,aAAAC,EAAeD,EAAAA,UAAU,KACzB,UAAAE,EACA,MAAAf,EACA,aAAAgB,EACA,aAAAC,EACA,sBAAAC,EAAwB,GACxB,WAAAC,EACA,SAAAC,EACA,GAAGzB,CACL,IAAgC,CAC9B,MAAM0B,EAAcC,EAAAA,SAAStB,EAAOoB,EAAU,CAAE,KAAAb,EAAM,EAEhDgB,EAAeC,EAAAA,QACnB,KAAO,CACL,KAAAhB,EACA,KAAAD,EACA,gBAAAG,EACA,WAAAS,CAAA,GAEF,CAACX,EAAMD,EAAMG,EAAiBS,CAAU,CAAA,EAGpCM,EAAeD,EAAAA,QACnB,IAAOR,EAAeU,EAAAA,eAAeV,EAAchB,CAAK,EAAIiB,EAC5D,CAACD,EAAchB,EAAOiB,CAAY,CAAA,EAGpC,OACEpB,EAAAA,IAAC8B,EAAY,SAAZ,CAAqB,MAAOJ,EAC3B,SAAA1B,EAAAA,IAAC+B,EAAAA,KAAA,CACC,GAAIpC,EACJ,UAAWqC,EAAAA,WACX,UAAAnC,EACA,aAAc+B,EACd,gBAAiBP,EAAwBO,EAAe,OACxD,MAAOjB,EACP,KAAAD,EACA,eAAgBuB,EAAAA,kBAChB,aAAcC,EAAAA,OAAkBvB,CAAI,EAAE,OACtC,gBAAAE,EACA,qBAAqB,QACrB,oBACEb,EAAAA,IAAC,MAAA,CAAI,UAAW,GAAGgC,EAAAA,UAAU,yBAC3B,SAAAhC,EAAAA,IAACmC,EAAA,CAAS,UAAW,GAAGH,EAAAA,UAAU,qBAAsB,EAC1D,EAEF,cAAef,EACf,mBAAoBF,EACpB,OAAQD,EACR,WAAYI,EACX,GAAGpB,EACJ,SAAUI,EAAeC,EAAOL,EAAK,QAAQ,EAE5C,SAAA0B,CAAA,CAAA,EAEL,CAEJ"}
+{"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":"0bAaMA,EAAYC,EAAAA,WAChB,CAAC,CAAE,UAAAC,EAAW,GAAGC,CAAA,EAAQC,IAAsBC,EAAAA,IAACC,EAAA,CAAO,IAAAF,EAAU,cAAeF,EAAY,GAAGC,CAAA,CAAM,CACvG,EAEMI,EACJ,CAACC,EAAoBC,IACpBC,GAAqB,CACpB,GAAI,CAACD,EACH,OAGF,MAAME,EAAOC,EAAAA,aAAaJ,CAAK,EAAE,KAAMK,GAAMA,EAAE,MAAQH,EAAK,GAAG,GAAG,KAClED,EAAS,CAAE,GAAGC,EAAM,KAAAC,EAAM,CAC5B,EAEIG,EAAO,CAAC,CACZ,UAAAZ,EACA,KAAAa,EAAO,SACP,KAAAC,EAAOC,EAAAA,MAAM,OACb,gBAAAC,EAAkB,GAClB,MAAAC,EAAQ,GACR,kBAAAC,EAAoBC,EAAAA,UAAU,MAC9B,aAAAC,EAAeD,EAAAA,UAAU,KACzB,UAAAE,EACA,MAAAf,EACA,aAAAgB,EACA,aAAAC,EACA,sBAAAC,EAAwB,GACxB,WAAAC,EACA,SAAAC,EACA,GAAGzB,CACL,IAAgC,CAC9B,MAAM0B,EAAcC,EAAAA,SAAStB,EAAOoB,EAAU,CAAE,KAAAb,EAAM,EAEhDgB,EAAeC,EAAAA,QACnB,KAAO,CACL,KAAAhB,EACA,KAAAD,EACA,gBAAAG,EACA,WAAAS,CAAA,GAEF,CAACX,EAAMD,EAAMG,EAAiBS,CAAU,CAAA,EAGpCM,EAAeD,EAAAA,QACnB,IAAOR,EAAeU,EAAAA,eAAeV,EAAchB,CAAK,EAAIiB,EAC5D,CAACD,EAAchB,EAAOiB,CAAY,CAAA,EAGpC,OACEpB,EAAAA,IAAC8B,EAAY,SAAZ,CAAqB,MAAOJ,EAC3B,SAAA1B,EAAAA,IAAC+B,EAAAA,KAAA,CACC,GAAIpC,EACJ,UAAWqC,EAAAA,WACX,UAAAnC,EACA,aAAc+B,EACd,gBAAiBP,EAAwBO,EAAe,OACxD,MAAOjB,EACP,KAAAD,EACA,eAAgBuB,EAAAA,kBAChB,aAAcC,EAAAA,OAAkBvB,CAAI,EAAE,OACtC,gBAAAE,EACA,qBAAqB,QACrB,oBACEb,EAAAA,IAAC,MAAA,CAAI,UAAW,GAAGgC,EAAAA,UAAU,yBAC3B,SAAAhC,EAAAA,IAACmC,EAAA,CAAS,UAAW,GAAGH,EAAAA,UAAU,qBAAsB,EAC1D,EAEF,cAAef,EACf,mBAAoBF,EACpB,OAAQD,EACR,WAAYI,EACX,GAAGpB,EACJ,SAAUI,EAAeC,EAAOL,EAAK,QAAQ,EAE5C,SAAA0B,CAAA,CAAA,EAEL,CAEJ"}

package/build/cjs/components/Menu/Menu.styles.js.map

@@ -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":"+oBAeaA,EAAOC,EAAAA,OAAOC,CAAM;AAAA,IAC7B,CAAC,CAAE,MAAAC,EAAO,MAAAC,EAAO,KAAAC,KAAWC,EAAAA;AAAAA,MAC1BH,EAAM,WAAW,QAASI,EAAAA,uBAAuBH,CAAK,CAAC,CAAC;AAAA;AAAA;AAAA,MAGxDC,IAAS,cACXC,EAAAA;AAAAA,sBACkBE,EAAAA,OAAkBJ,CAAK,EAAE,kBAAkB;AAAA,KAC5D;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,UAYKK,EAAAA,eAAeN,CAAK,CAAC;AAAA;AAAA;AAAA,UAGrBE,IAAS,cACXC,EAAAA;AAAAA,yBACiBE,EAAAA,OAAkBJ,CAAK,EAAE,kBAAkB;AAAA,SAC3D;AAAA;AAAA;AAAA;AAAA,QAIDM,YAAU;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,iBASDF,EAAAA,OAAkBJ,CAAK,EAAE,oBAAoB;AAAA;AAAA;AAAA,UAGpDC,IAAS,cACXC,EAAAA;AAAAA,0BACkBE,EAAAA,OAAkBJ,CAAK,EAAE,kBAAkB;AAAA,SAC5D;AAAA;AAAA,WAEEM,YAAU;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,OAMdA,YAAU;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,MAeXL,IAAS,cACXC,EAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA,KAKC;AAAA;AAAA,MAECK,cAAY;AAAA,MACZC,gBAAc;AAAA,MACdC,eAAa;AAAA,MACbC,oBAAkB;AAAA,MAClBC,aAAW;AAAA,MACXC,kBAAgB;AAAA,GACnB;AAAA"}
+{"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":"+oBAeaA,EAAOC,EAAAA,OAAOC,CAAM;AAAA,IAC7B,CAAC,CAAE,MAAAC,EAAO,MAAAC,EAAO,KAAAC,KAAWC,EAAAA;AAAAA,MAC1BH,EAAM,WAAW,QAASI,EAAAA,uBAAuBH,CAAK,CAAC,CAAC;AAAA;AAAA;AAAA,MAGxDC,IAAS,cACXC,EAAAA;AAAAA,sBACkBE,EAAAA,OAAkBJ,CAAK,EAAE,kBAAkB;AAAA,KAC5D;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,UAYKK,EAAAA,eAAeN,CAAK,CAAC;AAAA;AAAA;AAAA,UAGrBE,IAAS,cACXC,EAAAA;AAAAA,yBACiBE,EAAAA,OAAkBJ,CAAK,EAAE,kBAAkB;AAAA,SAC3D;AAAA;AAAA;AAAA;AAAA,QAIDM,YAAU;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,iBASDF,EAAAA,OAAkBJ,CAAK,EAAE,oBAAoB;AAAA;AAAA;AAAA,UAGpDC,IAAS,cACXC,EAAAA;AAAAA,0BACkBE,EAAAA,OAAkBJ,CAAK,EAAE,kBAAkB;AAAA,SAC5D;AAAA;AAAA,WAEEM,YAAU;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,OAMdA,YAAU;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,MAeXL,IAAS,cACXC,EAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA,KAKC;AAAA;AAAA,MAECK,cAAY;AAAA,MACZC,gBAAc;AAAA,MACdC,eAAa;AAAA,MACbC,oBAAkB;AAAA,MAClBC,aAAW;AAAA,MACXC,kBAAgB;AAAA,GACnB;AAAA"}

package/build/cjs/components/Menu/Menu.utils.js.map

@@ -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":"sUAWaA,EAAqB,CAChCC,EACAC,EAAoCC,mBAAiB,OAAO,QAC5DC,EAA8CD,EAAAA,iBAAiB,YAAY,QAC3EE,EAAQ,GACRC,EAAW,KACRL,EAAM,MAAM,CAAE,WAAAG,EAAY,SAAAE,EAAU,MAAAJ,EAAO,MAAAG,EAAO,EAAEE,EAAAA,UAAU,oBAAoB,EAE1EC,EAAuBC,GAClCA,IAASC,EAAAA,MAAM,OAASA,EAAAA,MAAM,MAAQD,EAE3BE,EAA2B,CAACC,EAAgDC,IACnFA,IAAS,aACJD,IAAsBE,EAAAA,UAAU,IAAMA,EAAAA,UAAU,IAAMA,EAAAA,UAAU,OAGlEF,IAAsBE,EAAAA,UAAU,KAAOA,EAAAA,UAAU,KAAOA,EAAAA,UAAU,MAG9DC,EAAmC,CAC9CH,EACAC,EACAJ,EAAuBC,EAAAA,MAAM,OAC7BL,EAAQ,GACRC,EAAW,KACRU,EAAAA;AAAAA;AAAAA,MAECC,4BAA0B,CAC1B,kBAAmBN,EAAyBC,EAAmBC,CAAI,EACnE,KAAAJ,EACA,MAAO,UACP,OAAQ,GACR,SAAAH,EACA,MAAAD,CACF,CAAC,CAAC;AAAA;AAAA,EAIOa,EAA2B,CACtCjB,EACAW,EACAC,EACAJ,EAAuBC,EAAAA,MAAM,OAC7BL,EAAQ,KACLW,EAAAA;AAAAA,sBACiBhB,EAClBC,EACAE,EAAAA,iBAAiB,OAAO,QACxBA,EAAAA,iBAAiB,YAAY,QAC7BE,CACF,CAAC;AAAA;AAAA;AAAA,MAGGY,4BAA0B,CAC1B,kBAAmBN,EAAyBC,EAAmBC,CAAI,EACnE,KAAAJ,EACA,MAAO,UACP,OAAQ,GACR,MAAAJ,CACF,CAAC,CAAC;AAAA;AAAA,EAIOc,EAA2B,CACtClB,EACAW,EACAC,EACAJ,EAAuBC,QAAM,OAC7BL,EAAQ,KACL,CACH,MAAMe,EAAQnB,EAAM,MAAM,CAAE,WAAY,UAAW,SAAU,GAAM,MAAAI,EAAO,EAE1E,OAAOW,EAAAA;AAAAA,aACII,EAAMb,YAAU,sBAAsB,CAAC;AAAA,wBAC5BP,EAClBC,EACAE,EAAAA,iBAAiB,OAAO,QACxBA,EAAAA,iBAAiB,YAAY,QAC7BE,EACA,EAAA,CACD;AAAA;AAAA;AAAA,cAGSe,EAAMb,YAAU,sBAAsB,CAAC;AAAA;AAAA;AAAA;AAAA,QAI7CU,4BAA0B,CAC1B,kBAAmBN,EAAyBC,EAAmBC,CAAI,EACnE,KAAAJ,EACA,MAAO,UACP,OAAQ,GACR,SAAU,GACV,MAAAJ,CAAA,CACD,CAAC;AAAA;AAAA,GAGR"}
+{"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":"sUAWaA,EAAqB,CAChCC,EACAC,EAAoCC,mBAAiB,OAAO,QAC5DC,EAA8CD,EAAAA,iBAAiB,YAAY,QAC3EE,EAAQ,GACRC,EAAW,KACRL,EAAM,MAAM,CAAE,WAAAG,EAAY,SAAAE,EAAU,MAAAJ,EAAO,MAAAG,EAAO,EAAEE,EAAAA,UAAU,oBAAoB,EAE1EC,EAAuBC,GAClCA,IAASC,EAAAA,MAAM,OAASA,EAAAA,MAAM,MAAQD,EAE3BE,EAA2B,CAACC,EAAgDC,IACnFA,IAAS,aACJD,IAAsBE,EAAAA,UAAU,IAAMA,EAAAA,UAAU,IAAMA,EAAAA,UAAU,OAGlEF,IAAsBE,EAAAA,UAAU,KAAOA,EAAAA,UAAU,KAAOA,EAAAA,UAAU,MAG9DC,EAAmC,CAC9CH,EACAC,EACAJ,EAAuBC,EAAAA,MAAM,OAC7BL,EAAQ,GACRC,EAAW,KACRU,EAAAA;AAAAA;AAAAA,MAECC,4BAA0B,CAC1B,kBAAmBN,EAAyBC,EAAmBC,CAAI,EACnE,KAAAJ,EACA,MAAO,UACP,OAAQ,GACR,SAAAH,EACA,MAAAD,CACF,CAAC,CAAC;AAAA;AAAA,EAIOa,EAA2B,CACtCjB,EACAW,EACAC,EACAJ,EAAuBC,EAAAA,MAAM,OAC7BL,EAAQ,KACLW,EAAAA;AAAAA,sBACiBhB,EAClBC,EACAE,EAAAA,iBAAiB,OAAO,QACxBA,EAAAA,iBAAiB,YAAY,QAC7BE,CACF,CAAC;AAAA;AAAA;AAAA,MAGGY,4BAA0B,CAC1B,kBAAmBN,EAAyBC,EAAmBC,CAAI,EACnE,KAAAJ,EACA,MAAO,UACP,OAAQ,GACR,MAAAJ,CACF,CAAC,CAAC;AAAA;AAAA,EAIOc,EAA2B,CACtClB,EACAW,EACAC,EACAJ,EAAuBC,QAAM,OAC7BL,EAAQ,KACL,CACH,MAAMe,EAAQnB,EAAM,MAAM,CAAE,WAAY,UAAW,SAAU,GAAM,MAAAI,EAAO,EAE1E,OAAOW,EAAAA;AAAAA,aACII,EAAMb,YAAU,sBAAsB,CAAC;AAAA,wBAC5BP,EAClBC,EACAE,EAAAA,iBAAiB,OAAO,QACxBA,EAAAA,iBAAiB,YAAY,QAC7BE,EACA,EAAA,CACD;AAAA;AAAA;AAAA,cAGSe,EAAMb,YAAU,sBAAsB,CAAC;AAAA;AAAA;AAAA;AAAA,QAI7CU,4BAA0B,CAC1B,kBAAmBN,EAAyBC,EAAmBC,CAAI,EACnE,KAAAJ,EACA,MAAO,UACP,OAAQ,GACR,SAAU,GACV,MAAAJ,CAAA,CACD,CAAC;AAAA;AAAA,GAGR"}

package/build/cjs/components/Menu/MenuContext.js.map

@@ -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":"wFAMMA,EAAcC,EAAAA,cAA4B,CAC9C,KAAMC,EAAAA,MAAM,OACZ,KAAM,SACN,gBAAiB,EACnB,CAAC"}
+{"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":"wFAMMA,EAAcC,EAAAA,cAA4B,CAC9C,KAAMC,EAAAA,MAAM,OACZ,KAAM,SACN,gBAAiB,EACnB,CAAC"}

package/build/cjs/components/Menu/components/MenuDivider.js.map

@@ -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":"8QAWMA,EAAc,CAAC,CAAE,UAAAC,EAAW,MAAAC,KAA6C,CAC7E,KAAM,CAAE,KAAAC,CAAA,EAASC,EAAAA,WAAWC,CAAW,EAEvC,OACEC,EAAAA,IAAC,KAAA,CAAG,KAAK,YAAY,UAAWC,EAAWN,EAAW,GAAGO,EAAAA,UAAU,eAAe,EAAG,MAAAN,EACnF,SAAAI,EAAAA,IAACG,EAAA,CACC,KAAMC,EAAAA,MAAM,MACZ,SAAS,SACT,MAAM,UACN,UAAWP,IAAS,aAAe,WAAa,YAAA,CAAA,EAEpD,CAEJ"}
+{"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":"8QAWMA,EAAc,CAAC,CAAE,UAAAC,EAAW,MAAAC,KAA6C,CAC7E,KAAM,CAAE,KAAAC,CAAA,EAASC,EAAAA,WAAWC,CAAW,EAEvC,OACEC,EAAAA,IAAC,KAAA,CAAG,KAAK,YAAY,UAAWC,EAAWN,EAAW,GAAGO,EAAAA,UAAU,eAAe,EAAG,MAAAN,EACnF,SAAAI,EAAAA,IAACG,EAAA,CACC,KAAMC,EAAAA,MAAM,MACZ,SAAS,SACT,MAAM,UACN,UAAWP,IAAS,aAAe,WAAa,YAAA,CAAA,EAEpD,CAEJ"}

package/build/cjs/components/Menu/components/MenuItem.js.map

@@ -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":"wcAiCMA,EAAWC,EAAAA,WACf,CAAC,CAAE,SAAAC,EAAU,SAAAC,EAAU,MAAAC,EAAO,KAAAC,EAAM,MAAAC,EAAO,WAAAC,EAAY,GAAGC,CAAA,EAAQC,IAAsB,CACtF,MAAMC,EAAcC,EAAAA,OAAoB,IAAI,EACtC,CAACC,EAAeC,CAAgB,EAAIC,EAAAA,SAAS,EAAK,EAClD,CAAE,gBAAAC,EAAiB,KAAAC,GAASC,EAAAA,WAAWC,CAAW,EACxDC,EAAAA,oBAA4DV,EAAK,IAAMC,EAAY,OAAO,EAE1F,MAAMU,EAAeC,EAAAA,YAAY,IAAMR,EAAiB,EAAI,EAAG,CAAA,CAAE,EAC3DS,EAAeD,EAAAA,YAAY,IAAMR,EAAiB,EAAK,EAAG,CAAA,CAAE,EAC5DU,EAAoBC,EAAAA,QACxB,IAAM,CAACT,GAAmBX,IAAU,QAAaA,EAAQ,EACzD,CAACW,EAAiBX,CAAK,CAAA,EAGzB,OACEqB,EAAAA,IAACC,EAAAA,SAAA,CACC,IAAKhB,EACL,aAAYiB,EAAAA,UAAUzB,CAAQ,EAC7B,GAAGM,EACJ,aAAAY,EACA,aAAAE,EAEA,SAAAG,EAAAA,IAACG,EAAA,CACC,UAAWlB,EACX,OAAQ,CAACa,GAAqBX,EAC9B,WAAYW,EACZ,UAAWM,EAAAA,UAAU,MACrB,cACGC,EAAA,CAAU,UAAWpB,EAAa,KAAAL,EAAY,SAAAF,EAAoB,WAAAI,EAAwB,MAAAD,EACxF,SAAAJ,CAAA,CACH,EAEF,QACE6B,EAAAA,KAACC,EAAAA,iBAAA,CAAiB,IAAI,OACpB,SAAA,CAAAP,EAAAA,IAACQ,EAAAA,aAAA,CAAa,KAAMC,EAAAA,oBAAoBlB,CAAI,EAAI,SAAAd,EAAS,EACxDI,SAAU6B,EAAA,CAAM,KAAMC,EAAAA,eAAepB,CAAI,EAAuB,GAAGV,CAAA,CAAO,CAAA,EAC7E,EAEF,MAAO,GACP,WAAY,GAAA,CAAA,CACd,CAAA,CAGN,CACF"}
+{"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":"wcAiCMA,EAAWC,EAAAA,WACf,CAAC,CAAE,SAAAC,EAAU,SAAAC,EAAU,MAAAC,EAAO,KAAAC,EAAM,MAAAC,EAAO,WAAAC,EAAY,GAAGC,CAAA,EAAQC,IAAsB,CACtF,MAAMC,EAAcC,EAAAA,OAAoB,IAAI,EACtC,CAACC,EAAeC,CAAgB,EAAIC,EAAAA,SAAS,EAAK,EAClD,CAAE,gBAAAC,EAAiB,KAAAC,GAASC,EAAAA,WAAWC,CAAW,EACxDC,EAAAA,oBAA4DV,EAAK,IAAMC,EAAY,OAAO,EAE1F,MAAMU,EAAeC,EAAAA,YAAY,IAAMR,EAAiB,EAAI,EAAG,CAAA,CAAE,EAC3DS,EAAeD,EAAAA,YAAY,IAAMR,EAAiB,EAAK,EAAG,CAAA,CAAE,EAC5DU,EAAoBC,EAAAA,QACxB,IAAM,CAACT,GAAmBX,IAAU,QAAaA,EAAQ,EACzD,CAACW,EAAiBX,CAAK,CAAA,EAGzB,OACEqB,EAAAA,IAACC,EAAAA,SAAA,CACC,IAAKhB,EACL,aAAYiB,EAAAA,UAAUzB,CAAQ,EAC7B,GAAGM,EACJ,aAAAY,EACA,aAAAE,EAEA,SAAAG,EAAAA,IAACG,EAAA,CACC,UAAWlB,EACX,OAAQ,CAACa,GAAqBX,EAC9B,WAAYW,EACZ,UAAWM,EAAAA,UAAU,MACrB,cACGC,EAAA,CAAU,UAAWpB,EAAa,KAAAL,EAAY,SAAAF,EAAoB,WAAAI,EAAwB,MAAAD,EACxF,SAAAJ,CAAA,CACH,EAEF,QACE6B,EAAAA,KAACC,EAAAA,iBAAA,CAAiB,IAAI,OACpB,SAAA,CAAAP,EAAAA,IAACQ,EAAAA,aAAA,CAAa,KAAMC,EAAAA,oBAAoBlB,CAAI,EAAI,SAAAd,EAAS,EACxDI,SAAU6B,EAAA,CAAM,KAAMC,EAAAA,eAAepB,CAAI,EAAuB,GAAGV,CAAA,CAAO,CAAA,EAC7E,EAEF,MAAO,GACP,WAAY,GAAA,CAAA,CACd,CAAA,CAGN,CACF"}

package/build/cjs/components/Menu/components/MenuItemGroup.js.map

@@ -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":"gNAeMA,EAAQ,CAAC,CAAE,MAAAC,EAAO,MAAAC,EAAO,KAAAC,KAC7BC,EAAAA,IAAC,MAAA,CACC,UAAWC,EACT,GAAGC,EAAAA,UAAU,uBACbH,IAAS,UAAY,GAAGG,EAAAA,UAAU,6BAAA,EAGpC,SAAAF,EAAAA,IAACG,EAAA,CAAU,MAAAL,EAAe,SAAAD,CAAA,CAAM,CAAA,CAClC,EAGIO,EAAgBC,EAAAA,WACpB,CAAC,CAAE,SAAAC,EAAU,MAAAT,EAAO,MAAAC,EAAO,KAAAC,EAAM,GAAGQ,GAAQC,IAC1CR,EAAAA,IAACS,iBAAgB,IAAAD,EAAU,YAAQZ,EAAA,CAAM,MAAAE,EAAc,MAAAD,EAAc,KAAAE,EAAY,EAAK,GAAGQ,EACtF,SAAAD,CAAA,CACH,CAEJ"}
+{"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":"gNAeMA,EAAQ,CAAC,CAAE,MAAAC,EAAO,MAAAC,EAAO,KAAAC,KAC7BC,EAAAA,IAAC,MAAA,CACC,UAAWC,EACT,GAAGC,EAAAA,UAAU,uBACbH,IAAS,UAAY,GAAGG,EAAAA,UAAU,6BAAA,EAGpC,SAAAF,EAAAA,IAACG,EAAA,CAAU,MAAAL,EAAe,SAAAD,CAAA,CAAM,CAAA,CAClC,EAGIO,EAAgBC,EAAAA,WACpB,CAAC,CAAE,SAAAC,EAAU,MAAAT,EAAO,MAAAC,EAAO,KAAAC,EAAM,GAAGQ,GAAQC,IAC1CR,EAAAA,IAACS,iBAAgB,IAAAD,EAAU,YAAQZ,EAAA,CAAM,MAAAE,EAAc,MAAAD,EAAc,KAAAE,EAAY,EAAK,GAAGQ,EACtF,SAAAD,CAAA,CACH,CAEJ"}

package/build/cjs/components/Menu/components/MenuLabel.js.map

@@ -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":"8QAoCMA,EAAYC,EAAAA,WAChB,CAAC,CAAE,SAAAC,EAAU,SAAAC,EAAU,KAAAC,EAAM,UAAAC,EAAW,UAAWC,EAAY,MAAAC,EAAO,WAAAC,EAAY,GAAGC,CAAA,EAAQC,IAAsB,CACjH,KAAM,CAAE,WAAYC,EAAgB,KAAAC,EAAM,gBAAAC,CAAA,EAAoBC,EAAAA,WAAWC,CAAW,EAC9EC,EAAoBC,EAAAA,QAAQ,IAAMT,GAAcG,EAAgB,CAACH,EAAYG,CAAc,CAAC,EAE5FO,EAAe,CACnB,IAAAR,EACA,UAAWS,EAAW,GAAGC,EAAAA,UAAU,SAAUf,CAAS,EACtD,GAAGI,CAAA,EAGCY,EACJC,EAAAA,KAAAC,EAAAA,SAAA,CACG,SAAA,CAAAC,EAAAA,eAAerB,CAAQ,GAAKsB,EAAAA,IAAC,OAAA,CAAK,UAAW,GAAGL,EAAAA,UAAU,cAAgB,SAAAjB,CAAA,CAAS,EACnF,CAAC,CAACD,GAAYuB,MAAC,QAAK,UAAW,GAAGL,YAAU,cAAgB,SAAAlB,EAAS,EACrEK,GAAS,CAACM,GAAmBY,EAAAA,IAACC,EAAA,CAAM,KAAMC,iBAAef,CAAI,EAAuB,GAAGL,CAAA,CAAO,CAAA,EACjG,EAGF,OAAOH,GAAQF,GAAYc,EACzBY,EAAAA,aAAaZ,EAAkB,CAAE,KAAAZ,EAAM,SAAUiB,CAAA,CAAS,EAAG,CAAE,GAAGH,EAAc,SAAU,EAAA,CAAI,EAE9FO,EAAAA,IAAC,OAAA,CAAM,GAAGP,EAAe,SAAAG,EAAQ,CAErC,CACF"}
+{"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":"8QAoCMA,EAAYC,EAAAA,WAChB,CAAC,CAAE,SAAAC,EAAU,SAAAC,EAAU,KAAAC,EAAM,UAAAC,EAAW,UAAWC,EAAY,MAAAC,EAAO,WAAAC,EAAY,GAAGC,CAAA,EAAQC,IAAsB,CACjH,KAAM,CAAE,WAAYC,EAAgB,KAAAC,EAAM,gBAAAC,CAAA,EAAoBC,EAAAA,WAAWC,CAAW,EAC9EC,EAAoBC,EAAAA,QAAQ,IAAMT,GAAcG,EAAgB,CAACH,EAAYG,CAAc,CAAC,EAE5FO,EAAe,CACnB,IAAAR,EACA,UAAWS,EAAW,GAAGC,EAAAA,UAAU,SAAUf,CAAS,EACtD,GAAGI,CAAA,EAGCY,EACJC,EAAAA,KAAAC,EAAAA,SAAA,CACG,SAAA,CAAAC,EAAAA,eAAerB,CAAQ,GAAKsB,EAAAA,IAAC,OAAA,CAAK,UAAW,GAAGL,EAAAA,UAAU,cAAgB,SAAAjB,CAAA,CAAS,EACnF,CAAC,CAACD,GAAYuB,MAAC,QAAK,UAAW,GAAGL,YAAU,cAAgB,SAAAlB,EAAS,EACrEK,GAAS,CAACM,GAAmBY,EAAAA,IAACC,EAAA,CAAM,KAAMC,iBAAef,CAAI,EAAuB,GAAGL,CAAA,CAAO,CAAA,EACjG,EAGF,OAAOH,GAAQF,GAAYc,EACzBY,EAAAA,aAAaZ,EAAkB,CAAE,KAAAZ,EAAM,SAAUiB,CAAA,CAAS,EAAG,CAAE,GAAGH,EAAc,SAAU,EAAA,CAAI,EAE9FO,EAAAA,IAAC,OAAA,CAAM,GAAGP,EAAe,SAAAG,EAAQ,CAErC,CACF"}

package/build/cjs/components/Menu/components/SubMenu.js.map

@@ -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":"yjBAuCMA,EAAQC,EAAAA,WACZ,CAAC,CAAE,MAAAC,EAAO,UAAAC,EAAW,SAAAC,EAAU,MAAAC,EAAO,cAAAC,EAAe,MAAAC,CAAA,EAASC,IAAmB,CAC/E,KAAM,CAAE,gBAAAC,EAAiB,KAAAC,GAASC,EAAAA,WAAWC,CAAW,EAClD,CAACC,EAAiBC,CAAkB,EAAIC,EAAAA,SAAS,EAAK,EACtDC,EAAaC,EAAAA,QACjB,IAAMJ,GAAmB,CAACJ,GAAmBJ,IAAU,QAAaA,EAAQ,EAC5E,CAACQ,EAAiBJ,EAAiBJ,CAAK,CAAA,EAG1Ca,OAAAA,mBAAiBf,EAAYgB,GAAsB,CACjDL,EAAmBK,EAAkB,SAAS,6BAA6B,CAAC,CAC9E,CAAC,EAGCC,EAAAA,IAACC,EAAA,CACC,UAAWlB,EACX,OAAQ,CAACa,GAAcV,EACvB,WAAAU,EACA,UAAWM,EAAAA,UAAU,MACrB,QACEC,EAAAA,KAAC,MAAA,CAAI,IAAAf,EAAU,UAAW,GAAGgB,EAAAA,UAAU,yBACrC,SAAA,CAAAJ,EAAAA,IAACK,EAAA,CAAU,UAAAtB,EAAsB,SAAAC,EAAoB,MAAAG,EAClD,SAAAL,EACH,EACAkB,EAAAA,IAACM,EAAA,CAAiB,UAAW,GAAGF,EAAAA,UAAU,sBAAA,CAAwB,CAAA,EACpE,EAEF,QACED,EAAAA,KAACI,EAAAA,iBAAA,CAAiB,IAAI,OACpB,SAAA,CAAAP,MAACQ,EAAAA,aAAA,CAAa,KAAMC,EAAAA,oBAAoBnB,CAAI,EAAI,SAAAR,EAAM,EACrDK,SAAUuB,EAAA,CAAM,KAAMC,EAAAA,eAAerB,CAAI,EAAuB,GAAGH,CAAA,CAAO,CAAA,EAC7E,EAEF,MAAO,GACP,WAAY,GAAA,CAAA,CAGlB,CACF,EAEMyB,EAAU/B,EAAAA,WACd,CAAC,CAAE,MAAAC,EAAO,SAAAE,EAAU,MAAAC,EAAO,MAAAE,EAAO,GAAG0B,CAAA,EAAQzB,IAAsB,CACjE,KAAM,CAAE,KAAA0B,CAAA,EAASvB,EAAAA,WAAWC,CAAW,EACjCuB,EAAaC,EAAAA,OAAsB,IAAI,EACvCC,EAAcH,IAAS,aAAe,CAAC,EAAG,CAAC,EAAI,CAAC,EAAG,CAAC,EACpD,CAAC5B,EAAegC,CAAgB,EAAIvB,EAAAA,SAAS,EAAK,EAElDwB,EAAeC,EAAAA,YAAY,IAAMF,EAAiB,EAAI,EAAG,CAAA,CAAE,EAC3DG,EAAeD,EAAAA,YAAY,IAAMF,EAAiB,EAAK,EAAG,CAAA,CAAE,EAElEI,OAAAA,EAAAA,oBAAgElC,EAAK,IAAM2B,EAAW,OAAO,EAG3Ff,EAAAA,IAACuB,EAAAA,QAAA,CACC,IAAKR,EACL,aAAAI,EACA,aAAAE,EACA,MACErB,EAAAA,IAACpB,EAAA,CACC,UAAWmC,EACX,MAAAjC,EACA,MAAAG,EACA,SAAAD,EACA,cAAAE,EACA,MAAAC,CAAA,CAAA,EAGJ,WAAY,CAAE,QAAS,GAAG8B,EAAY,CAAC,CAAC,MAAMA,EAAY,CAAC,CAAC,IAAA,EAC3D,GAAGJ,CAAA,CAAA,CAGV,CACF"}
+{"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":"yjBAuCMA,EAAQC,EAAAA,WACZ,CAAC,CAAE,MAAAC,EAAO,UAAAC,EAAW,SAAAC,EAAU,MAAAC,EAAO,cAAAC,EAAe,MAAAC,CAAA,EAASC,IAAmB,CAC/E,KAAM,CAAE,gBAAAC,EAAiB,KAAAC,GAASC,EAAAA,WAAWC,CAAW,EAClD,CAACC,EAAiBC,CAAkB,EAAIC,EAAAA,SAAS,EAAK,EACtDC,EAAaC,EAAAA,QACjB,IAAMJ,GAAmB,CAACJ,GAAmBJ,IAAU,QAAaA,EAAQ,EAC5E,CAACQ,EAAiBJ,EAAiBJ,CAAK,CAAA,EAG1Ca,OAAAA,mBAAiBf,EAAYgB,GAAsB,CACjDL,EAAmBK,EAAkB,SAAS,6BAA6B,CAAC,CAC9E,CAAC,EAGCC,EAAAA,IAACC,EAAA,CACC,UAAWlB,EACX,OAAQ,CAACa,GAAcV,EACvB,WAAAU,EACA,UAAWM,EAAAA,UAAU,MACrB,QACEC,EAAAA,KAAC,MAAA,CAAI,IAAAf,EAAU,UAAW,GAAGgB,EAAAA,UAAU,yBACrC,SAAA,CAAAJ,EAAAA,IAACK,EAAA,CAAU,UAAAtB,EAAsB,SAAAC,EAAoB,MAAAG,EAClD,SAAAL,EACH,EACAkB,EAAAA,IAACM,EAAA,CAAiB,UAAW,GAAGF,EAAAA,UAAU,sBAAA,CAAwB,CAAA,EACpE,EAEF,QACED,EAAAA,KAACI,EAAAA,iBAAA,CAAiB,IAAI,OACpB,SAAA,CAAAP,MAACQ,EAAAA,aAAA,CAAa,KAAMC,EAAAA,oBAAoBnB,CAAI,EAAI,SAAAR,EAAM,EACrDK,SAAUuB,EAAA,CAAM,KAAMC,EAAAA,eAAerB,CAAI,EAAuB,GAAGH,CAAA,CAAO,CAAA,EAC7E,EAEF,MAAO,GACP,WAAY,GAAA,CAAA,CAGlB,CACF,EAEMyB,EAAU/B,EAAAA,WACd,CAAC,CAAE,MAAAC,EAAO,SAAAE,EAAU,MAAAC,EAAO,MAAAE,EAAO,GAAG0B,CAAA,EAAQzB,IAAsB,CACjE,KAAM,CAAE,KAAA0B,CAAA,EAASvB,EAAAA,WAAWC,CAAW,EACjCuB,EAAaC,EAAAA,OAAsB,IAAI,EACvCC,EAAcH,IAAS,aAAe,CAAC,EAAG,CAAC,EAAI,CAAC,EAAG,CAAC,EACpD,CAAC5B,EAAegC,CAAgB,EAAIvB,EAAAA,SAAS,EAAK,EAElDwB,EAAeC,EAAAA,YAAY,IAAMF,EAAiB,EAAI,EAAG,CAAA,CAAE,EAC3DG,EAAeD,EAAAA,YAAY,IAAMF,EAAiB,EAAK,EAAG,CAAA,CAAE,EAElEI,OAAAA,EAAAA,oBAAgElC,EAAK,IAAM2B,EAAW,OAAO,EAG3Ff,EAAAA,IAACuB,EAAAA,QAAA,CACC,IAAKR,EACL,aAAAI,EACA,aAAAE,EACA,MACErB,EAAAA,IAACpB,EAAA,CACC,UAAWmC,EACX,MAAAjC,EACA,MAAAG,EACA,SAAAD,EACA,cAAAE,EACA,MAAAC,CAAA,CAAA,EAGJ,WAAY,CAAE,QAAS,GAAG8B,EAAY,CAAC,CAAC,MAAMA,EAAY,CAAC,CAAC,IAAA,EAC3D,GAAGJ,CAAA,CAAA,CAGV,CACF"}

package/build/cjs/components/Menu/styles/groupMenuItem.styles.js.map

@@ -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":"+XAQaA,EAAqBC,EAAAA;AAAAA,IAC9B,CAAC,CAAE,MAAAC,EAAO,MAAAC,EAAO,OAAAC,EAAQ,SAAAC,EAAU,KAAAC,KAAW,CAC9C,MAAMC,EAAU,GAAGC,EAAAA,OAAkBL,CAAK,EAAE,OAAO,KAC7CM,EAAS,GAAGD,EAAAA,OAAkBL,CAAK,EAAE,MAAM,KAC3CO,EAAqB,GAAGF,EAAAA,OAAkBL,CAAK,EAAE,OAAS,CAAC,KAC3DQ,EAAQT,EAAM,MAAM,CAAE,WAAY,UAAW,SAAAG,EAAU,MAAOD,EAAQ,EAE5E,OAAOH,EAAAA;AAAAA,SACFW,YAAU;AAAA,WACRA,YAAU;AAAA,YACTV,EAAM,WAAW,QAASW,EAAAA,uBAAuBV,CAAK,CAAC,CAAC;AAAA,uBAC7CM,CAAM,IAAIF,CAAO;AAAA,mBACrBI,EAAMG,YAAU,sBAAsB,CAAC;AAAA,mBACvCF,EAAAA,UAAU,6BAA6BA,YAAU;AAAA;AAAA;AAAA;AAAA,YAIxDN,IAAS,cACXL,EAAAA;AAAAA,4BACkBO,EAAAA,OAAkBL,CAAK,EAAE,wBAAwB;AAAA,WAClE;AAAA;AAAA;AAAA,WAGAS,EAAAA,UAAU,6BAA6BA,YAAU;AAAA;AAAA;AAAA;AAAA,qCAIvBD,EAAMG,YAAU,wBAAwB,CAAC;AAAA;AAAA;AAAA,WAGnEF,YAAU;AAAA;AAAA;AAAA;AAAA;AAAA,UAKXN,IAAS,cACXL,EAAAA;AAAAA,aACKW,YAAU;AAAA;AAAA;AAAA;AAAA;AAAA,SAKd;AAAA;AAAA;AAAA;AAAA,QAIDN,IAAS,UACXL,EAAAA;AAAAA,WACKW,EAAAA,UAAU,aAAaA,YAAU;AAAA,aAC/BA,YAAU;AAAA,4BACKF,CAAkB;AAAA;AAAA;AAAA,cAGhCE,YAAU;AAAA,iBACPA,YAAU;AAAA,iBACVA,YAAU;AAAA,iBACVA,YAAU;AAAA;AAAA;AAAA;AAAA,OAIpB;AAAA;AAAA;AAAA,UAGGA,YAAU;AAAA;AAAA,UAEVN,IAAS,cACXL,EAAAA;AAAAA,aACKW,EAAAA,UAAU,gBAAgBA,YAAU;AAAA;AAAA;AAAA;AAAA;AAAA,aAKpCA,YAAU;AAAA;AAAA;AAAA,SAGd;AAAA;AAAA,KAGP,CAAC;AAAA"}
+{"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":"+XAQaA,EAAqBC,EAAAA;AAAAA,IAC9B,CAAC,CAAE,MAAAC,EAAO,MAAAC,EAAO,OAAAC,EAAQ,SAAAC,EAAU,KAAAC,KAAW,CAC9C,MAAMC,EAAU,GAAGC,EAAAA,OAAkBL,CAAK,EAAE,OAAO,KAC7CM,EAAS,GAAGD,EAAAA,OAAkBL,CAAK,EAAE,MAAM,KAC3CO,EAAqB,GAAGF,EAAAA,OAAkBL,CAAK,EAAE,OAAS,CAAC,KAC3DQ,EAAQT,EAAM,MAAM,CAAE,WAAY,UAAW,SAAAG,EAAU,MAAOD,EAAQ,EAE5E,OAAOH,EAAAA;AAAAA,SACFW,YAAU;AAAA,WACRA,YAAU;AAAA,YACTV,EAAM,WAAW,QAASW,EAAAA,uBAAuBV,CAAK,CAAC,CAAC;AAAA,uBAC7CM,CAAM,IAAIF,CAAO;AAAA,mBACrBI,EAAMG,YAAU,sBAAsB,CAAC;AAAA,mBACvCF,EAAAA,UAAU,6BAA6BA,YAAU;AAAA;AAAA;AAAA;AAAA,YAIxDN,IAAS,cACXL,EAAAA;AAAAA,4BACkBO,EAAAA,OAAkBL,CAAK,EAAE,wBAAwB;AAAA,WAClE;AAAA;AAAA;AAAA,WAGAS,EAAAA,UAAU,6BAA6BA,YAAU;AAAA;AAAA;AAAA;AAAA,qCAIvBD,EAAMG,YAAU,wBAAwB,CAAC;AAAA;AAAA;AAAA,WAGnEF,YAAU;AAAA;AAAA;AAAA;AAAA;AAAA,UAKXN,IAAS,cACXL,EAAAA;AAAAA,aACKW,YAAU;AAAA;AAAA;AAAA;AAAA;AAAA,SAKd;AAAA;AAAA;AAAA;AAAA,QAIDN,IAAS,UACXL,EAAAA;AAAAA,WACKW,EAAAA,UAAU,aAAaA,YAAU;AAAA,aAC/BA,YAAU;AAAA,4BACKF,CAAkB;AAAA;AAAA;AAAA,cAGhCE,YAAU;AAAA,iBACPA,YAAU;AAAA,iBACVA,YAAU;AAAA,iBACVA,YAAU;AAAA;AAAA;AAAA;AAAA,OAIpB;AAAA;AAAA;AAAA,UAGGA,YAAU;AAAA;AAAA,UAEVN,IAAS,cACXL,EAAAA;AAAAA,aACKW,EAAAA,UAAU,gBAAgBA,YAAU;AAAA;AAAA;AAAA;AAAA;AAAA,aAKpCA,YAAU;AAAA;AAAA;AAAA,SAGd;AAAA;AAAA,KAGP,CAAC;AAAA"}

package/build/cjs/components/Menu/styles/indicator.styles.js.map

@@ -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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"}
+{"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/cjs/components/Menu/styles/menuDivider.styles.js.map

@@ -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":"iUAMaA,EAAmBC,EAAAA;AAAAA,IAC5B,CAAC,CAAE,KAAAC,EAAM,MAAAC,EAAO,cAAAC,KAAoBH,EAAAA;AAAAA,OACjCI,YAAU;AAAA;AAAA;AAAA;AAAA;AAAA,iBAKAC,EAAAA,OAAkBH,CAAK,EAAE,YAClCD,IAASK,EAAAA,WAAW,WAAaA,EAAAA,WAAW,WAAaA,EAAAA,WAAW,QACtE,EAAEH,CAAa,CAAC;AAAA;AAAA,QAEdF,IAAS,aACPD,EAAAA;AAAAA;AAAAA,YAGAA,EAAAA;AAAAA;AAAAA,WAEC;AAAA;AAAA,GAER;AAAA"}
+{"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":"iUAMaA,EAAmBC,EAAAA;AAAAA,IAC5B,CAAC,CAAE,KAAAC,EAAM,MAAAC,EAAO,cAAAC,KAAoBH,EAAAA;AAAAA,OACjCI,YAAU;AAAA;AAAA;AAAA;AAAA;AAAA,iBAKAC,EAAAA,OAAkBH,CAAK,EAAE,YAClCD,IAASK,EAAAA,WAAW,WAAaA,EAAAA,WAAW,WAAaA,EAAAA,WAAW,QACtE,EAAEH,CAAa,CAAC;AAAA;AAAA,QAEdF,IAAS,aACPD,EAAAA;AAAAA;AAAAA,YAGAA,EAAAA;AAAAA;AAAAA,WAEC;AAAA;AAAA,GAER;AAAA"}

package/build/cjs/components/Menu/styles/menuItem.styles.js.map

@@ -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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"}
+{"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":"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"}