{
  "version": 3,
  "sources": ["../javascripts/styled-components/components/Foldout/index.tsx", "../javascripts/styled-components/components/NotificationCount/index.tsx", "../javascripts/styled-components/components/NotificationCount/wrapper.tsx", "../javascripts/styled-components/components/Foldout/wrapper.tsx"],
  "sourcesContent": ["import React from 'react';\nimport { useTranslation } from 'react-i18next';\n\nimport Loader from '../Loader';\nimport NotificationCount from '../NotificationCount';\nimport {\n  FoldoutBtn,\n  FoldoutBtnContent,\n  FoldoutBtnIcon,\n  FoldoutDialog,\n  FoldoutItem,\n  FoldoutList,\n  FoldoutUiBlock,\n  Foldout as StyledFoldout,\n  Wrapper,\n} from './wrapper';\n\nexport interface IFoldoutItem {\n  displayName: React.ReactNode;\n  title: string;\n  onClick: (event: React.MouseEvent<HTMLElement>) => void;\n  tone?: 'link' | 'error';\n  disabled?: boolean;\n  isLoading?: boolean;\n  icon?: React.ReactNode;\n  notificationCount?: number;\n}\n\nexport interface IFoldout {\n  children: React.ReactNode;\n  items: IFoldoutItem[][];\n  isOpen?: boolean;\n  onClose: (e: React.MouseEvent<HTMLDivElement>) => void;\n  posX?: 'start' | 'end';\n  posXSm?: 'start' | 'end';\n  posXMd?: 'start' | 'end';\n  posY?: 'top' | 'bottom';\n  posYSm?: 'top' | 'bottom';\n  posYMd?: 'top' | 'bottom';\n}\n\nconst Foldout = ({\n  children,\n  items,\n  isOpen,\n  onClose,\n  posX,\n  posXSm,\n  posXMd,\n  posY,\n  posYSm,\n  posYMd,\n}: IFoldout) => {\n  const { t } = useTranslation(['common']);\n\n  return (\n    <Wrapper>\n      {children}\n      {isOpen && (\n        <StyledFoldout\n          $posX={posX}\n          $posXSm={posXSm}\n          $posXMd={posXMd}\n          $posY={posY}\n          $posYSm={posYSm}\n          $posYMd={posYMd}\n        >\n          <FoldoutUiBlock\n            onClick={onClose}\n            aria-label={t('close', { ns: 'common' })}\n            aria-hidden=\"true\"\n          />\n          <FoldoutDialog>\n            {items.map((group, i) => (\n              <FoldoutList key={`foldout-group-${i}`}>\n                {group.map((item, j) => (\n                  <FoldoutItem key={`${item.displayName}-${i}-${j}`}>\n                    <FoldoutBtn\n                      title={item.title}\n                      onClick={item.onClick}\n                      disabled={item.disabled}\n                      $tone={item.tone}\n                    >\n                      {item.icon && <FoldoutBtnIcon>{item.icon}</FoldoutBtnIcon>}\n                      <FoldoutBtnContent>{item.displayName}</FoldoutBtnContent>\n                      {item.notificationCount && (\n                        <FoldoutBtnContent>\n                          <NotificationCount>{item.notificationCount}</NotificationCount>\n                        </FoldoutBtnContent>\n                      )}\n                      {item.isLoading && (\n                        <FoldoutBtnContent>\n                          <Loader inlineBlock />\n                        </FoldoutBtnContent>\n                      )}\n                    </FoldoutBtn>\n                  </FoldoutItem>\n                ))}\n              </FoldoutList>\n            ))}\n          </FoldoutDialog>\n        </StyledFoldout>\n      )}\n    </Wrapper>\n  );\n};\n\nexport default Foldout;\n", "import React from 'react';\n\nimport { Wrapper } from './wrapper';\n\nexport interface ILoader {\n  children?: number | string;\n}\n\nconst NotificationCount = ({ children }: ILoader) => <Wrapper>{children}</Wrapper>;\n\nexport default NotificationCount;\n", "import styled from 'styled-components';\n\nimport { size } from '../../layout/helpers';\n\nexport const Wrapper = styled.div.withConfig({ componentId: 'sc-3a6by4-0' })`\n    padding: ${size(0.5)} ${size(0.75)};\n    background-color: var(--c-notification-bg);\n    color: var(--c-notification-fg);\n    font-size: ${(props) => props.theme.font.size.xsmall};\n    font-weight: var(--font-weight-medium);\n    border-radius: 100vmax;\n    line-height: 1;\n    white-space: nowrap;\n`;\n", "import styled, { css } from 'styled-components';\n\nimport { size } from '../../layout/helpers';\nimport { fadeIn, noTransform } from '../../layout/keyframes';\nimport { ButtonReset } from '../../layout/reset';\n\nconst btnFontSize = (props: any) => props.theme.font.size.small;\nconst btnLineHeight = (props: any) => props.theme.font.lineHeight.main;\nconst btnIconSize = (props: any) => props.theme.font.size.regular;\n\nexport const Wrapper = styled.div.withConfig({ componentId: 'sc-kyzkrw-0' })`\n    position: relative;\n    display: inline-block;\n`;\n\nexport const FoldoutDialog = styled.div.withConfig({ componentId: 'sc-kyzkrw-1' })`\n    background-color: var(--c-bg-main);\n    box-shadow: ${(props) => props.theme.boxShadow.strong};\n    transform: translateY(${size(-2)});\n    animation: ${noTransform} 200ms ease forwards, ${fadeIn} 200ms ease;\n    width: 250px;\n    max-width: calc(100vw - ${size(6)});\n    border-radius: 3px;\n`;\n\nconst posXStartStyle = css`\n    left: 0;\n    right: auto;\n`;\n\nconst posXEndStyle = css`\n    left: auto;\n    right: 0;\n`;\n\nconst posYTopStyle = css`\n    top: auto;\n    bottom: 100%;\n    margin-top: 0;\n    margin-bottom: ${size(0.5)};\n\n    ${FoldoutDialog} {\n        transform: translateY(${size(2)});\n    }\n`;\n\nconst posYBottomStyle = css`\n    top: 100%;\n    bottom: auto;\n    margin-top: ${size(0.5)};\n    margin-bottom: 0;\n\n    ${FoldoutDialog} {\n        transform: translateY(${size(-2)});\n    }\n`;\n\ninterface FoldoutProps {\n  $posX?: 'start' | 'end';\n  $posXSm?: 'start' | 'end';\n  $posXMd?: 'start' | 'end';\n  $posY?: 'top' | 'bottom';\n  $posYSm?: 'top' | 'bottom';\n  $posYMd?: 'top' | 'bottom';\n}\n\nexport const Foldout = styled.div.withConfig({ componentId: 'sc-kyzkrw-2' })<FoldoutProps>`\n    position: absolute;\n    top: 100%;\n    left: 0;\n    margin-top: ${size(0.5)};\n    z-index: 20;\n\n    ${({ $posX }) =>\n      $posX === 'start'\n        ? css`\n                  ${posXStartStyle}\n              `\n        : $posX === 'end'\n          ? css`\n                  ${posXEndStyle}\n              `\n          : undefined}\n\n    ${({ $posXSm }) =>\n      $posXSm === 'start'\n        ? css`\n                  ${(props) => props.theme.breakpoint.Sm} {\n                      ${posXStartStyle}\n                  }\n              `\n        : $posXSm === 'end'\n          ? css`\n                  ${(props) => props.theme.breakpoint.Sm} {\n                      ${posXEndStyle}\n                  }\n              `\n          : undefined}\n\n  ${({ $posXMd }) =>\n    $posXMd === 'start'\n      ? css`\n                  ${(props) => props.theme.breakpoint.Md} {\n                      ${posXStartStyle}\n                  }\n              `\n      : $posXMd === 'end'\n        ? css`\n                  ${(props) => props.theme.breakpoint.Md} {\n                      ${posXEndStyle}\n                  }\n              `\n        : undefined}\n\n  ${({ $posY }) =>\n    $posY === 'top'\n      ? css`\n                  ${posYTopStyle}\n              `\n      : $posY === 'bottom'\n        ? css`\n                  ${posYBottomStyle}\n              `\n        : undefined}\n\n  ${({ $posYSm }) =>\n    $posYSm === 'top'\n      ? css`\n                  ${(props) => props.theme.breakpoint.Sm} {\n                      ${posYTopStyle}\n                  }\n              `\n      : $posYSm === 'bottom'\n        ? css`\n                  ${(props) => props.theme.breakpoint.Sm} {\n                      ${posYBottomStyle}\n                  }\n              `\n        : undefined}\n\n  ${({ $posYMd }) =>\n    $posYMd === 'top'\n      ? css`\n                  ${(props) => props.theme.breakpoint.Md} {\n                      ${posYTopStyle}\n                  }\n              `\n      : $posYMd === 'bottom'\n        ? css`\n                  ${(props) => props.theme.breakpoint.Md} {\n                      ${posYBottomStyle}\n                  }\n              `\n        : undefined}\n`;\n\nexport const FoldoutUiBlock = styled.div.attrs(() => ({\n  role: 'button',\n})).withConfig({ componentId: 'sc-kyzkrw-3' })`\n    position: fixed;\n    top: 0;\n    bottom: 0;\n    left: 0;\n    right: 0;\n    z-index: -1;\n`;\n\nexport const FoldoutList = styled.ul.withConfig({ componentId: 'sc-kyzkrw-4' })`\n    list-style: none;\n    padding: ${size(1)} 0;\n    margin: 0;\n\n    & + & {\n        position: relative;\n        margin-top: 1px;\n\n        &:before {\n            content: \"\";\n            position: absolute;\n            top: -1px;\n            left: ${size(3)};\n            right: ${size(3)};\n            height: 1px;\n            background-color: var(--c-border-main);\n        }\n    }\n`;\n\nexport const FoldoutItem = styled.li.withConfig({ componentId: 'sc-kyzkrw-5' })``;\n\ninterface FoldoutBtnProps {\n  $tone?: 'link' | 'error';\n}\n\nexport const FoldoutBtn = styled(ButtonReset).withConfig({ componentId: 'sc-kyzkrw-6' })<FoldoutBtnProps>`\n    display: flex;\n    align-items: center;\n    width: 100%;\n    padding: ${size(1)} ${size(3)};\n    text-align: left;\n    color: var(--c-text-main);\n    font-weight: var(--font-weight-regular);\n    font-size: ${btnFontSize};\n    line-height: ${btnLineHeight};\n\n    &:hover:not([disabled]) {\n        background-color: var(--c-bg-alt);\n    }\n\n    &[disabled] {\n        opacity: 0.37;\n        cursor: not-allowed;\n    }\n\n    ${({ $tone }) =>\n      $tone === 'link'\n        ? css`\n                  &:not([disabled]) {\n                      color: var(--palette-primary-500);\n                  }\n              `\n        : $tone === 'error'\n          ? css`\n                  color: var(--c-semantic-error-500);\n              `\n          : undefined}\n`;\n\nexport const FoldoutBtnContent = styled.span.withConfig({ componentId: 'sc-kyzkrw-7' })`\n    display: block;\n\n    & + & {\n        margin-left: ${size(0.5)};\n    }\n`;\n\nexport const FoldoutBtnIcon = styled.span.withConfig({ componentId: 'sc-kyzkrw-8' })`\n    align-self: flex-start;\n    margin-right: ${size(1)};\n    font-size: ${btnIconSize};\n    margin-top: calc((${btnIconSize} - ${btnFontSize} * ${btnLineHeight}) / -2);\n`;\n"],
  "mappings": "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",
  "names": ["import_react", "import_react", "Wrapper", "dt", "size", "props", "NotificationCount", "children", "React", "Wrapper", "NotificationCount_default", "btnFontSize", "props", "btnLineHeight", "btnIconSize", "Wrapper", "dt", "FoldoutDialog", "size", "noTransform", "fadeIn", "posXStartStyle", "lt", "posXEndStyle", "posYTopStyle", "posYBottomStyle", "Foldout", "$posX", "$posXSm", "$posXMd", "$posY", "$posYSm", "$posYMd", "FoldoutUiBlock", "FoldoutList", "FoldoutItem", "FoldoutBtn", "ButtonReset", "$tone", "FoldoutBtnContent", "FoldoutBtnIcon", "Foldout", "children", "items", "isOpen", "onClose", "posX", "posXSm", "posXMd", "posY", "posYSm", "posYMd", "t", "useTranslation", "React", "Wrapper", "FoldoutUiBlock", "FoldoutDialog", "group", "i", "FoldoutList", "item", "j", "FoldoutItem", "FoldoutBtn", "FoldoutBtnIcon", "FoldoutBtnContent", "NotificationCount_default", "Loader_default", "Foldout_default"]
}