@foxford/ui 2.16.2 → 2.17.0-beta-cee51ed-20231220

package/components/Checkbox/style.js.map

@@ -1 +1 @@
-{"version":3,"file":"style.js","sources":["../../../../src/components/Checkbox/style.ts"],"sourcesContent":["import styled, { css } from 'styled-components'\nimport tinycolor from 'tinycolor2'\nimport { screenMaxS } from 'mixins/screen'\nimport { responsiveProperty } from 'mixins/responsive-property'\nimport { injectDefaultTheme } from 'shared/utils/inject-theme'\nimport DefaultCheck from './images/check-default.module.svg'\nimport Check from './images/check.module.svg'\nimport type { StyledCheckboxProps, CheckboxStaticSize, CheckboxGroupProps, CheckboxPalette } from './types'\n\nconst DEFAULT_SIZES: Record<CheckboxStaticSize, number> = {\n  extraSmall: 12,\n  xs: 12,\n  small: 14,\n  s: 14,\n  medium: 16,\n  m: 16,\n  large: 18,\n  l: 18,\n  extraLarge: 20,\n  xl: 20,\n}\n\nconst BRAND_SIZES: Record<CheckboxStaticSize, number> = {\n  extraSmall: 16,\n  xs: 16,\n  small: 20,\n  s: 20,\n  medium: 24,\n  m: 24,\n  large: 28,\n  l: 28,\n  extraLarge: 32,\n  xl: 32,\n}\n\nconst STATIC_SIZES: CheckboxStaticSize[] = [\n  'extraSmall',\n  'xs',\n  'small',\n  's',\n  'medium',\n  'm',\n  'large',\n  'l',\n  'extraLarge',\n  'xl',\n]\n\nconst baseStyles = css<StyledCheckboxProps>`\n  ${(props) => `\n    &,\n    & * {\n      box-sizing: border-box;\n    }\n    position: relative;\n    cursor: pointer;\n    padding: ${props.background ? 12 : 0}px;\n    display: ${props.inline ? 'inline-flex' : 'flex'};\n    align-items: baseline;\n    isolation: isolate;\n    & + & {\n      margin-left: 15px;\n    }\n  `}\n`\n\nexport const Input = styled.input`\n  position: absolute;\n  opacity: 0;\n  z-index: -1;\n  &:focus {\n    outline: none;\n  }\n`\n\nexport const Background = styled.span`\n  border-radius: 8px;\n  border: 1px solid;\n  border-color: transparent;\n  overflow: hidden;\n  &::before {\n    content: '';\n    opacity: 0;\n  }\n  &,\n  &::before {\n    position: absolute;\n    top: 0;\n    left: 0;\n    width: 100%;\n    height: 100%;\n    transition-property: border-color, background-color, opacity;\n    transition-duration: 150ms;\n    transition-timing-function: ease-in;\n  }\n`\n\nexport const DefaultMask = styled(DefaultCheck)`\n  position: relative;\n  top: 2px;\n  width: 1em;\n  height: 1em;\n  flex-shrink: 0;\n  g {\n    opacity: 0;\n    transition: opacity 200ms ease;\n  }\n`\n\nexport const BrandMask = styled.div`\n  position: relative;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  flex-shrink: 0;\n  width: 1em;\n  height: 1em;\n  border-radius: 4px;\n  border: 1px solid;\n  border-color: transparent;\n  transition-property: border-color;\n  transition-duration: 150ms;\n  transition-timing-function: ease-in;\n`\n\nexport const CheckIcon = styled(Check)`\n  width: 50%;\n  opacity: 0;\n`\n\nexport const Content = styled.span`\n  position: relative;\n  margin-left: 10px;\n`\n\nconst template = (palette: CheckboxPalette) => `\n  & > ${Content} {\n    color: ${palette.fontColor};\n  }\n  & > ${BrandMask} {\n    background-color: ${palette.bg};\n    color: ${palette.color};\n    border-color: ${palette.border};\n  }\n  & > ${Input}:checked ~ ${BrandMask} {\n    border-color: transparent;\n    background-color: ${palette.bgChecked};\n  }\n  & > ${Input}:checked ~ ${BrandMask} > ${CheckIcon} {\n    opacity: 1;\n  }\n  & > ${Input}:disabled ~ ${Content} {\n    color: ${palette.colorDisabled};\n  }\n  &:hover > ${BrandMask} {\n    border-color: ${palette.borderHover};\n  }\n  &:focus {\n    outline: none;\n  }\n  & > ${Input}:focus-visible ~ ${BrandMask} {\n    outline: 1px solid ${palette.outlineFocus};\n    outline-offset: 2px;\n  }\n`\n\nconst templateBackground = (palette: CheckboxPalette) => `\n  & > ${Background} {\n    background-color: ${palette.bg};\n    border-color: ${palette.border};\n  }\n  & > ${Input}:checked ~ ${Background} {\n    background-color: ${palette.bgChecked};\n    border-color: ${palette.borderChecked};\n  }\n  &:hover > ${Background} {\n    background-color: ${palette.bgHover};\n    border-color: ${palette.borderHover};\n  }\n  &:hover > ${Background}::before {\n    background-color: ${palette.beforeBgHover};\n    opacity: 1;\n  }\n`\n\nconst PRESET = {\n  default: {\n    regular: css<StyledCheckboxProps>`\n      ${(props) =>\n        template({\n          fontColor: props.theme.colors['content-onmain-primary'],\n          bg: props.theme.colors['bg-onmain-primary'],\n          color: props.theme.colors['content-oncolor-primary'],\n          border: props.theme.colors['border-onmain-default-small'],\n          bgChecked: props.theme.colors['bg-brand-primary-basic'],\n          borderHover: props.theme.colors['border-brand-primary'],\n          outlineFocus: props.theme.colors['border-brand-primary'],\n          colorDisabled: props.theme.colors['content-disabled'],\n        })}\n      ${(props) =>\n        props.background\n          ? templateBackground({\n              bg: props.theme.colors['bg-onmain-secondary'],\n              border: props.theme.colors['border-onmain-default-small'],\n              bgChecked: props.theme.colors['bg-brand-primary-100'],\n              borderChecked: props.theme.colors['border-brand-primary'],\n              bgHover: props.theme.colors['bg-oncolor-hover'],\n              borderHover: props.theme.colors['border-onmain-default-large'],\n              beforeBgHover: 'transparent',\n            })\n          : null}\n    `,\n    error: css<StyledCheckboxProps>`\n      ${(props) =>\n        template({\n          fontColor: props.theme.colors['content-onmain-primary'],\n          bg: props.theme.colors['alert-bg-error-100'],\n          color: props.theme.colors['content-oncolor-primary'],\n          border: props.theme.colors['alert-bg-error-500'],\n          bgChecked: props.theme.colors['alert-bg-error-500'],\n          borderHover: props.theme.colors['alert-error'],\n          outlineFocus: props.theme.colors['alert-error'],\n          colorDisabled: props.theme.colors['content-disabled'],\n        })}\n      ${(props) =>\n        props.background\n          ? templateBackground({\n              bg: props.theme.colors['alert-bg-error-100'],\n              border: props.theme.colors['alert-error'],\n              bgChecked: props.theme.colors['alert-bg-error-100'],\n              borderChecked: props.theme.colors['alert-error'],\n              bgHover: props.theme.colors['alert-bg-error-100'],\n              borderHover: props.theme.colors['alert-error'],\n              beforeBgHover: 'transparent',\n            })\n          : null}\n    `,\n    success: css<StyledCheckboxProps>`\n      ${(props) =>\n        template({\n          fontColor: props.theme.colors['content-onmain-primary'],\n          bg: props.theme.colors['alert-bg-success-100'],\n          color: props.theme.colors['content-oncolor-primary'],\n          border: props.theme.colors['alert-bg-success-500'],\n          bgChecked: props.theme.colors['alert-bg-success-500'],\n          borderHover: props.theme.colors['alert-success'],\n          outlineFocus: props.theme.colors['alert-success'],\n          colorDisabled: props.theme.colors['content-disabled'],\n        })}\n      ${(props) =>\n        props.background\n          ? templateBackground({\n              bg: props.theme.colors['alert-bg-success-100'],\n              border: props.theme.colors['alert-success'],\n              bgChecked: props.theme.colors['alert-bg-success-100'],\n              borderChecked: props.theme.colors['alert-success'],\n              bgHover: props.theme.colors['alert-bg-success-100'],\n              borderHover: props.theme.colors['alert-success'],\n              beforeBgHover: 'transparent',\n            })\n          : null}\n    `,\n    disabled: css<StyledCheckboxProps>`\n      cursor: auto;\n      ${(props) =>\n        template({\n          fontColor: props.theme.colors['content-onmain-primary'],\n          bg: props.theme.colors['bg-disabled-large'],\n          color: props.theme.colors['content-oncolor-primary'],\n          border: props.theme.colors['border-disabled'],\n          bgChecked: props.theme.colors['bg-disabled-active'],\n          borderHover: props.theme.colors['border-disabled'],\n          outlineFocus: props.theme.colors['border-disabled'],\n          colorDisabled: props.theme.colors['content-disabled'],\n        })}\n      ${(props) =>\n        props.background\n          ? templateBackground({\n              bg: props.theme.colors['bg-disabled-large'],\n              border: props.theme.colors['border-disabled'],\n              bgChecked: props.theme.colors['bg-disabled-large'],\n              borderChecked: props.theme.colors['bg-disabled-active'],\n              bgHover: props.theme.colors['bg-disabled-large'],\n              borderHover: props.theme.colors['border-disabled'],\n              beforeBgHover: 'transparent',\n            })\n          : null}\n    `,\n  },\n  onColored: {\n    regular: css<StyledCheckboxProps>`\n      ${(props) =>\n        props.background\n          ? template({\n              fontColor: props.theme.colors['content-onmain-primary'],\n              bg: props.theme.colors['bg-onmain-primary'],\n              color: props.theme.colors['content-oncolor-primary'],\n              border: props.theme.colors['border-onmain-default-small'],\n              bgChecked: props.theme.colors['bg-brand-primary-basic'],\n              borderHover: props.theme.colors['border-brand-primary'],\n              outlineFocus: props.theme.colors['border-brand-primary'],\n              colorDisabled: props.theme.colors['content-oncolor-disabled'],\n            })\n          : template({\n              fontColor: props.theme.colors['content-oncolor-primary'],\n              bg: props.theme.colors['bg-onmain-primary'],\n              color: props.theme.colors['content-brand-primary'],\n              border: props.theme.colors['border-onmain-default-small'],\n              bgChecked: props.theme.colors['bg-oncolor-primary'],\n              borderHover: props.theme.colors['border-brand-primary'],\n              outlineFocus: props.theme.colors['content-oncolor-primary'],\n              colorDisabled: props.theme.colors['content-oncolor-disabled'],\n            })}\n      ${(props) =>\n        props.background\n          ? templateBackground({\n              bg: props.theme.colors['bg-onmain-secondary'],\n              border: props.theme.colors['border-onmain-default-large'],\n              bgChecked: props.theme.colors['bg-onmain-primary'],\n              borderChecked: props.theme.colors['border-onmain-default-large'],\n              bgHover: props.theme.colors['bg-onmain-secondary'],\n              borderHover: props.theme.colors['border-onmain-default-large'],\n              beforeBgHover: props.theme.colors['bg-oncolor-hover'],\n            })\n          : null}\n    `,\n    error: css<StyledCheckboxProps>`\n      ${(props) =>\n        props.background\n          ? template({\n              fontColor: props.theme.colors['content-onmain-primary'],\n              bg: props.theme.colors['alert-bg-error-100'],\n              color: props.theme.colors['content-oncolor-primary'],\n              border: props.theme.colors['alert-bg-error-500'],\n              bgChecked: props.theme.colors['alert-bg-error-500'],\n              borderHover: props.theme.colors['alert-error'],\n              outlineFocus: props.theme.colors['alert-error'],\n              colorDisabled: props.theme.colors['content-oncolor-disabled'],\n            })\n          : template({\n              fontColor: props.theme.colors['content-oncolor-primary'],\n              bg: props.theme.colors['alert-bg-error-100'],\n              color: props.theme.colors['content-oncolor-primary'],\n              border: props.theme.colors['alert-bg-error-500'],\n              bgChecked: props.theme.colors['alert-bg-error-500'],\n              borderHover: props.theme.colors['alert-error'],\n              outlineFocus: props.theme.colors['alert-error'],\n              colorDisabled: props.theme.colors['content-oncolor-disabled'],\n            })}\n      ${(props) =>\n        props.background\n          ? templateBackground({\n              bg: props.theme.colors['alert-bg-error-100'],\n              border: props.theme.colors['alert-bg-error-500'],\n              bgChecked: props.theme.colors['alert-bg-error-100'],\n              borderChecked: props.theme.colors['alert-error'],\n              bgHover: props.theme.colors['alert-bg-error-100'],\n              borderHover: props.theme.colors['alert-error'],\n              beforeBgHover: props.theme.colors['bg-oncolor-hover'],\n            })\n          : null}\n    `,\n    success: css<StyledCheckboxProps>`\n      ${(props) =>\n        props.background\n          ? template({\n              fontColor: props.theme.colors['content-onmain-primary'],\n              bg: props.theme.colors['alert-bg-success-100'],\n              color: props.theme.colors['content-oncolor-primary'],\n              border: props.theme.colors['alert-bg-success-500'],\n              bgChecked: props.theme.colors['alert-bg-success-500'],\n              borderHover: props.theme.colors['alert-success'],\n              outlineFocus: props.theme.colors['alert-success'],\n              colorDisabled: props.theme.colors['content-oncolor-disabled'],\n            })\n          : template({\n              fontColor: props.theme.colors['content-oncolor-primary'],\n              bg: props.theme.colors['alert-bg-success-100'],\n              color: props.theme.colors['content-oncolor-primary'],\n              border: props.theme.colors['alert-bg-success-500'],\n              bgChecked: props.theme.colors['alert-bg-success-500'],\n              borderHover: props.theme.colors['alert-success'],\n              outlineFocus: props.theme.colors['alert-success'],\n              colorDisabled: props.theme.colors['content-oncolor-disabled'],\n            })}\n      ${(props) =>\n        props.background\n          ? templateBackground({\n              bg: props.theme.colors['alert-bg-success-100'],\n              border: props.theme.colors['alert-bg-success-500'],\n              bgChecked: props.theme.colors['alert-bg-success-100'],\n              borderChecked: props.theme.colors['alert-success'],\n              bgHover: props.theme.colors['alert-bg-success-100'],\n              borderHover: props.theme.colors['alert-success'],\n              beforeBgHover: props.theme.colors['bg-oncolor-hover'],\n            })\n          : null}\n    `,\n    disabled: css<StyledCheckboxProps>`\n      cursor: auto;\n      ${(props) =>\n        props.background\n          ? template({\n              fontColor: props.theme.colors['content-onmain-primary'],\n              bg: props.theme.colors['bg-disabled-large'],\n              color: props.theme.colors['content-oncolor-primary'],\n              border: props.theme.colors['border-disabled'],\n              bgChecked: props.theme.colors['bg-disabled-active'],\n              borderHover: props.theme.colors['border-disabled'],\n              outlineFocus: props.theme.colors['border-disabled'],\n              colorDisabled: props.theme.colors['content-disabled'],\n            })\n          : template({\n              fontColor: props.theme.colors['content-oncolor-primary'],\n              bg: props.theme.colors['bg-disabled-large'],\n              color: props.theme.colors['content-oncolor-primary'],\n              border: props.theme.colors['border-disabled'],\n              bgChecked: props.theme.colors['bg-disabled-active'],\n              borderHover: props.theme.colors['border-disabled'],\n              outlineFocus: props.theme.colors['border-disabled'],\n              colorDisabled: props.theme.colors['content-oncolor-disabled'],\n            })}\n      ${(props) =>\n        props.background\n          ? templateBackground({\n              bg: props.theme.colors['bg-onmain-secondary'],\n              border: props.theme.colors['border-oncolor-disabled'],\n              bgChecked: props.theme.colors['bg-onmain-secondary'],\n              borderChecked: props.theme.colors['border-oncolor-disabled'],\n              bgHover: props.theme.colors['bg-onmain-secondary'],\n              borderHover: props.theme.colors['border-oncolor-disabled'],\n              beforeBgHover: 'transparent',\n            })\n          : null}\n    `,\n  },\n}\n\nconst PRESET_DEFAULT = {\n  default: css<StyledCheckboxProps>`\n    ${(props) =>\n      props.error\n        ? `\n          & > ${DefaultMask} > rect { \n            fill: ${tinycolor(props.theme.colors.pomegranate).setAlpha(0.1).toString()};\n            stroke: ${props.theme.colors.pomegranate};\n          }  \n          & > ${DefaultMask} g > rect {\n            fill: ${props.theme.colors.pomegranate};\n          }\n        `\n        : null}\n\n    ${(props) => `\n      color: ${props.disabled ? props.theme.colors.alto : props.theme.colors.mineShaft};\n      cursor: ${props.disabled ? 'not-allowed' : 'pointer'};\n\n      & > ${Input}:checked ~ ${DefaultMask} g {\n        opacity: 1;\n      }\n      & > ${Input}:disabled ~ ${DefaultMask} > rect {\n        fill: ${props.theme.colors.white};\n        stroke: ${props.theme.colors.grey};\n      }\n      & > ${Input}:checked:disabled ~ ${DefaultMask} g > rect {\n        fill: ${props.theme.colors.alto};\n      }\n      &:focus {\n        outline: none;\n      }\n      & > ${Input}:focus-visible ~ ${DefaultMask} {\n        outline: 1px solid ${props.theme.colors.accent};\n        outline-offset: 2px;\n      }\n    `}\n  `,\n}\n\nconst extractStyles = (props: StyledCheckboxProps) => {\n  if (props.brandPresetUsed) {\n    if (props.disabled && !props.onColored) return PRESET.default.disabled\n    if (props.disabled && props.onColored) return PRESET.onColored.disabled\n\n    if (props.error && !props.success && !props.onColored) return PRESET.default.error\n    if (props.error && !props.success && props.onColored) return PRESET.onColored.error\n\n    if (props.success && !props.error && !props.onColored) return PRESET.default.success\n    if (props.success && !props.error && props.onColored) return PRESET.onColored.success\n\n    return props.onColored ? PRESET.onColored.regular : PRESET.default.regular\n  }\n\n  return PRESET_DEFAULT.default\n}\n\nconst extractSizes = (props: StyledCheckboxProps) => {\n  const SIZES = props.brandPresetUsed ? BRAND_SIZES : DEFAULT_SIZES\n\n  return STATIC_SIZES.includes(<CheckboxStaticSize>props.size)\n    ? `font-size: ${SIZES[<CheckboxStaticSize>props.size]}px;`\n    : responsiveProperty('size', 'font-size')\n}\n\nexport const Root = styled.label\n  .withConfig({\n    shouldForwardProp: (prop) => ['children', 'htmlFor', 'style'].includes(prop),\n  })\n  .attrs(injectDefaultTheme)<StyledCheckboxProps>`\n  ${baseStyles}\n  ${extractStyles}\n  ${extractSizes}\n\n  ${(props) =>\n    responsiveProperty(\n      'width',\n      props.fluid && props.width !== 'auto' && !Array.isArray(props.width) ? 'max-width' : 'width'\n    )}\n  ${(props) => (props.fluid ? 'width: 100%;' : null)}\n`\n\nexport const Group = styled.div.withConfig<CheckboxGroupProps>({\n  shouldForwardProp: (prop) => prop !== 'inline',\n})`\n  ${(props) =>\n    props.inline\n      ? css`\n          display: flex;\n          flex-direction: row;\n          > ${Root}:first-child {\n            margin-left: 0;\n          }\n          > ${Root}:not(:first-child) {\n            margin-left: 15px;\n          }\n          ${screenMaxS()`\n            flex-direction: column;\n            > ${Root}:first-child {\n              margin-top: 0;\n            }\n            > ${Root}:not(:first-child) {\n              margin-top: 15px;\n              margin-left: 0;\n            }\n          `}\n        `\n      : `\n          display: flex;\n          flex-direction: column;\n          > ${Root}:first-child {\n            margin-top: 0;\n            margin-left: 0;\n          }\n          > ${Root}:not(:first-child) {\n            margin-top: 15px;\n            margin-left: 0;\n          }\n      `}\n`\n"],"names":["DEFAULT_SIZES","extraSmall","xs","small","s","medium","m","large","l","extraLarge","xl","BRAND_SIZES","STATIC_SIZES","baseStyles","css","props","background","concat","inline","Input","styled","input","withConfig","componentId","Background","span","DefaultMask","DefaultCheck","BrandMask","div","CheckIcon","Check","Content","template","palette","fontColor","bg","color","border","bgChecked","colorDisabled","borderHover","outlineFocus","templateBackground","borderChecked","bgHover","beforeBgHover","PRESET","default","regular","theme","colors","error","success","disabled","onColored","PRESET_DEFAULT","tinycolor","pomegranate","setAlpha","toString","alto","mineShaft","white","grey","accent","Root","label","shouldForwardProp","prop","includes","attrs","injectDefaultTheme","brandPresetUsed","SIZES","size","responsiveProperty","fluid","width","Array","isArray","Group","screenMaxS"],"mappings":"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"}
+{"version":3,"file":"style.js","sources":["../../../../src/components/Checkbox/style.ts"],"sourcesContent":["import styled, { css } from 'styled-components'\nimport tinycolor from 'tinycolor2'\nimport { screenMaxS } from 'mixins/screen'\nimport { responsiveProperty } from 'mixins/responsive-property'\nimport DefaultCheck from './images/check-default.module.svg'\nimport Check from './images/check.module.svg'\nimport type { StyledCheckboxProps, CheckboxStaticSize, CheckboxGroupProps, CheckboxPalette } from './types'\n\nconst DEFAULT_SIZES: Record<CheckboxStaticSize, number> = {\n  extraSmall: 12,\n  xs: 12,\n  small: 14,\n  s: 14,\n  medium: 16,\n  m: 16,\n  large: 18,\n  l: 18,\n  extraLarge: 20,\n  xl: 20,\n}\n\nconst BRAND_SIZES: Record<CheckboxStaticSize, number> = {\n  extraSmall: 16,\n  xs: 16,\n  small: 20,\n  s: 20,\n  medium: 24,\n  m: 24,\n  large: 28,\n  l: 28,\n  extraLarge: 32,\n  xl: 32,\n}\n\nconst STATIC_SIZES: CheckboxStaticSize[] = [\n  'extraSmall',\n  'xs',\n  'small',\n  's',\n  'medium',\n  'm',\n  'large',\n  'l',\n  'extraLarge',\n  'xl',\n]\n\nconst baseStyles = css<StyledCheckboxProps>`\n  ${(props) => `\n    &,\n    & * {\n      box-sizing: border-box;\n    }\n    position: relative;\n    cursor: pointer;\n    padding: ${props.background ? 12 : 0}px;\n    display: ${props.inline ? 'inline-flex' : 'flex'};\n    align-items: baseline;\n    isolation: isolate;\n    & + & {\n      margin-left: 15px;\n    }\n  `}\n`\n\nexport const Input = styled.input`\n  position: absolute;\n  opacity: 0;\n  z-index: -1;\n  &:focus {\n    outline: none;\n  }\n`\n\nexport const Background = styled.span`\n  border-radius: 8px;\n  border: 1px solid;\n  border-color: transparent;\n  overflow: hidden;\n  &::before {\n    content: '';\n    opacity: 0;\n  }\n  &,\n  &::before {\n    position: absolute;\n    top: 0;\n    left: 0;\n    width: 100%;\n    height: 100%;\n    transition-property: border-color, background-color, opacity;\n    transition-duration: 150ms;\n    transition-timing-function: ease-in;\n  }\n`\n\nexport const DefaultMask = styled(DefaultCheck)`\n  position: relative;\n  top: 2px;\n  width: 1em;\n  height: 1em;\n  flex-shrink: 0;\n  g {\n    opacity: 0;\n    transition: opacity 200ms ease;\n  }\n`\n\nexport const BrandMask = styled.div`\n  position: relative;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  flex-shrink: 0;\n  width: 1em;\n  height: 1em;\n  border-radius: 4px;\n  border: 1px solid;\n  border-color: transparent;\n  transition-property: border-color;\n  transition-duration: 150ms;\n  transition-timing-function: ease-in;\n`\n\nexport const CheckIcon = styled(Check)`\n  width: 50%;\n  opacity: 0;\n`\n\nexport const Content = styled.span`\n  position: relative;\n  margin-left: 10px;\n`\n\nconst template = (palette: CheckboxPalette) => `\n  & > ${Content} {\n    color: ${palette.fontColor};\n  }\n  & > ${BrandMask} {\n    background-color: ${palette.bg};\n    color: ${palette.color};\n    border-color: ${palette.border};\n  }\n  & > ${Input}:checked ~ ${BrandMask} {\n    border-color: transparent;\n    background-color: ${palette.bgChecked};\n  }\n  & > ${Input}:checked ~ ${BrandMask} > ${CheckIcon} {\n    opacity: 1;\n  }\n  & > ${Input}:disabled ~ ${Content} {\n    color: ${palette.colorDisabled};\n  }\n  &:hover > ${BrandMask} {\n    border-color: ${palette.borderHover};\n  }\n  &:focus {\n    outline: none;\n  }\n  & > ${Input}:focus-visible ~ ${BrandMask} {\n    outline: 1px solid ${palette.outlineFocus};\n    outline-offset: 2px;\n  }\n`\n\nconst templateBackground = (palette: CheckboxPalette) => `\n  & > ${Background} {\n    background-color: ${palette.bg};\n    border-color: ${palette.border};\n  }\n  & > ${Input}:checked ~ ${Background} {\n    background-color: ${palette.bgChecked};\n    border-color: ${palette.borderChecked};\n  }\n  &:hover > ${Background} {\n    background-color: ${palette.bgHover};\n    border-color: ${palette.borderHover};\n  }\n  &:hover > ${Background}::before {\n    background-color: ${palette.beforeBgHover};\n    opacity: 1;\n  }\n`\n\nconst PRESET = {\n  default: {\n    regular: css<StyledCheckboxProps>`\n      ${(props) =>\n        template({\n          fontColor: props.theme.colors['content-onmain-primary'],\n          bg: props.theme.colors['bg-onmain-primary'],\n          color: props.theme.colors['content-oncolor-primary'],\n          border: props.theme.colors['border-onmain-default-small'],\n          bgChecked: props.theme.colors['bg-brand-primary-basic'],\n          borderHover: props.theme.colors['border-brand-primary'],\n          outlineFocus: props.theme.colors['border-brand-primary'],\n          colorDisabled: props.theme.colors['content-disabled'],\n        })}\n      ${(props) =>\n        props.background\n          ? templateBackground({\n              bg: props.theme.colors['bg-onmain-secondary'],\n              border: props.theme.colors['border-onmain-default-small'],\n              bgChecked: props.theme.colors['bg-brand-primary-100'],\n              borderChecked: props.theme.colors['border-brand-primary'],\n              bgHover: props.theme.colors['bg-oncolor-hover'],\n              borderHover: props.theme.colors['border-onmain-default-large'],\n              beforeBgHover: 'transparent',\n            })\n          : null}\n    `,\n    error: css<StyledCheckboxProps>`\n      ${(props) =>\n        template({\n          fontColor: props.theme.colors['content-onmain-primary'],\n          bg: props.theme.colors['alert-bg-error-100'],\n          color: props.theme.colors['content-oncolor-primary'],\n          border: props.theme.colors['alert-bg-error-500'],\n          bgChecked: props.theme.colors['alert-bg-error-500'],\n          borderHover: props.theme.colors['alert-error'],\n          outlineFocus: props.theme.colors['alert-error'],\n          colorDisabled: props.theme.colors['content-disabled'],\n        })}\n      ${(props) =>\n        props.background\n          ? templateBackground({\n              bg: props.theme.colors['alert-bg-error-100'],\n              border: props.theme.colors['alert-error'],\n              bgChecked: props.theme.colors['alert-bg-error-100'],\n              borderChecked: props.theme.colors['alert-error'],\n              bgHover: props.theme.colors['alert-bg-error-100'],\n              borderHover: props.theme.colors['alert-error'],\n              beforeBgHover: 'transparent',\n            })\n          : null}\n    `,\n    success: css<StyledCheckboxProps>`\n      ${(props) =>\n        template({\n          fontColor: props.theme.colors['content-onmain-primary'],\n          bg: props.theme.colors['alert-bg-success-100'],\n          color: props.theme.colors['content-oncolor-primary'],\n          border: props.theme.colors['alert-bg-success-500'],\n          bgChecked: props.theme.colors['alert-bg-success-500'],\n          borderHover: props.theme.colors['alert-success'],\n          outlineFocus: props.theme.colors['alert-success'],\n          colorDisabled: props.theme.colors['content-disabled'],\n        })}\n      ${(props) =>\n        props.background\n          ? templateBackground({\n              bg: props.theme.colors['alert-bg-success-100'],\n              border: props.theme.colors['alert-success'],\n              bgChecked: props.theme.colors['alert-bg-success-100'],\n              borderChecked: props.theme.colors['alert-success'],\n              bgHover: props.theme.colors['alert-bg-success-100'],\n              borderHover: props.theme.colors['alert-success'],\n              beforeBgHover: 'transparent',\n            })\n          : null}\n    `,\n    disabled: css<StyledCheckboxProps>`\n      cursor: auto;\n      ${(props) =>\n        template({\n          fontColor: props.theme.colors['content-onmain-primary'],\n          bg: props.theme.colors['bg-disabled-large'],\n          color: props.theme.colors['content-oncolor-primary'],\n          border: props.theme.colors['border-disabled'],\n          bgChecked: props.theme.colors['bg-disabled-active'],\n          borderHover: props.theme.colors['border-disabled'],\n          outlineFocus: props.theme.colors['border-disabled'],\n          colorDisabled: props.theme.colors['content-disabled'],\n        })}\n      ${(props) =>\n        props.background\n          ? templateBackground({\n              bg: props.theme.colors['bg-disabled-large'],\n              border: props.theme.colors['border-disabled'],\n              bgChecked: props.theme.colors['bg-disabled-large'],\n              borderChecked: props.theme.colors['bg-disabled-active'],\n              bgHover: props.theme.colors['bg-disabled-large'],\n              borderHover: props.theme.colors['border-disabled'],\n              beforeBgHover: 'transparent',\n            })\n          : null}\n    `,\n  },\n  onColored: {\n    regular: css<StyledCheckboxProps>`\n      ${(props) =>\n        props.background\n          ? template({\n              fontColor: props.theme.colors['content-onmain-primary'],\n              bg: props.theme.colors['bg-onmain-primary'],\n              color: props.theme.colors['content-oncolor-primary'],\n              border: props.theme.colors['border-onmain-default-small'],\n              bgChecked: props.theme.colors['bg-brand-primary-basic'],\n              borderHover: props.theme.colors['border-brand-primary'],\n              outlineFocus: props.theme.colors['border-brand-primary'],\n              colorDisabled: props.theme.colors['content-oncolor-disabled'],\n            })\n          : template({\n              fontColor: props.theme.colors['content-oncolor-primary'],\n              bg: props.theme.colors['bg-onmain-primary'],\n              color: props.theme.colors['content-brand-primary'],\n              border: props.theme.colors['border-onmain-default-small'],\n              bgChecked: props.theme.colors['bg-oncolor-primary'],\n              borderHover: props.theme.colors['border-brand-primary'],\n              outlineFocus: props.theme.colors['content-oncolor-primary'],\n              colorDisabled: props.theme.colors['content-oncolor-disabled'],\n            })}\n      ${(props) =>\n        props.background\n          ? templateBackground({\n              bg: props.theme.colors['bg-onmain-secondary'],\n              border: props.theme.colors['border-onmain-default-large'],\n              bgChecked: props.theme.colors['bg-onmain-primary'],\n              borderChecked: props.theme.colors['border-onmain-default-large'],\n              bgHover: props.theme.colors['bg-onmain-secondary'],\n              borderHover: props.theme.colors['border-onmain-default-large'],\n              beforeBgHover: props.theme.colors['bg-oncolor-hover'],\n            })\n          : null}\n    `,\n    error: css<StyledCheckboxProps>`\n      ${(props) =>\n        props.background\n          ? template({\n              fontColor: props.theme.colors['content-onmain-primary'],\n              bg: props.theme.colors['alert-bg-error-100'],\n              color: props.theme.colors['content-oncolor-primary'],\n              border: props.theme.colors['alert-bg-error-500'],\n              bgChecked: props.theme.colors['alert-bg-error-500'],\n              borderHover: props.theme.colors['alert-error'],\n              outlineFocus: props.theme.colors['alert-error'],\n              colorDisabled: props.theme.colors['content-oncolor-disabled'],\n            })\n          : template({\n              fontColor: props.theme.colors['content-oncolor-primary'],\n              bg: props.theme.colors['alert-bg-error-100'],\n              color: props.theme.colors['content-oncolor-primary'],\n              border: props.theme.colors['alert-bg-error-500'],\n              bgChecked: props.theme.colors['alert-bg-error-500'],\n              borderHover: props.theme.colors['alert-error'],\n              outlineFocus: props.theme.colors['alert-error'],\n              colorDisabled: props.theme.colors['content-oncolor-disabled'],\n            })}\n      ${(props) =>\n        props.background\n          ? templateBackground({\n              bg: props.theme.colors['alert-bg-error-100'],\n              border: props.theme.colors['alert-bg-error-500'],\n              bgChecked: props.theme.colors['alert-bg-error-100'],\n              borderChecked: props.theme.colors['alert-error'],\n              bgHover: props.theme.colors['alert-bg-error-100'],\n              borderHover: props.theme.colors['alert-error'],\n              beforeBgHover: props.theme.colors['bg-oncolor-hover'],\n            })\n          : null}\n    `,\n    success: css<StyledCheckboxProps>`\n      ${(props) =>\n        props.background\n          ? template({\n              fontColor: props.theme.colors['content-onmain-primary'],\n              bg: props.theme.colors['alert-bg-success-100'],\n              color: props.theme.colors['content-oncolor-primary'],\n              border: props.theme.colors['alert-bg-success-500'],\n              bgChecked: props.theme.colors['alert-bg-success-500'],\n              borderHover: props.theme.colors['alert-success'],\n              outlineFocus: props.theme.colors['alert-success'],\n              colorDisabled: props.theme.colors['content-oncolor-disabled'],\n            })\n          : template({\n              fontColor: props.theme.colors['content-oncolor-primary'],\n              bg: props.theme.colors['alert-bg-success-100'],\n              color: props.theme.colors['content-oncolor-primary'],\n              border: props.theme.colors['alert-bg-success-500'],\n              bgChecked: props.theme.colors['alert-bg-success-500'],\n              borderHover: props.theme.colors['alert-success'],\n              outlineFocus: props.theme.colors['alert-success'],\n              colorDisabled: props.theme.colors['content-oncolor-disabled'],\n            })}\n      ${(props) =>\n        props.background\n          ? templateBackground({\n              bg: props.theme.colors['alert-bg-success-100'],\n              border: props.theme.colors['alert-bg-success-500'],\n              bgChecked: props.theme.colors['alert-bg-success-100'],\n              borderChecked: props.theme.colors['alert-success'],\n              bgHover: props.theme.colors['alert-bg-success-100'],\n              borderHover: props.theme.colors['alert-success'],\n              beforeBgHover: props.theme.colors['bg-oncolor-hover'],\n            })\n          : null}\n    `,\n    disabled: css<StyledCheckboxProps>`\n      cursor: auto;\n      ${(props) =>\n        props.background\n          ? template({\n              fontColor: props.theme.colors['content-onmain-primary'],\n              bg: props.theme.colors['bg-disabled-large'],\n              color: props.theme.colors['content-oncolor-primary'],\n              border: props.theme.colors['border-disabled'],\n              bgChecked: props.theme.colors['bg-disabled-active'],\n              borderHover: props.theme.colors['border-disabled'],\n              outlineFocus: props.theme.colors['border-disabled'],\n              colorDisabled: props.theme.colors['content-disabled'],\n            })\n          : template({\n              fontColor: props.theme.colors['content-oncolor-primary'],\n              bg: props.theme.colors['bg-disabled-large'],\n              color: props.theme.colors['content-oncolor-primary'],\n              border: props.theme.colors['border-disabled'],\n              bgChecked: props.theme.colors['bg-disabled-active'],\n              borderHover: props.theme.colors['border-disabled'],\n              outlineFocus: props.theme.colors['border-disabled'],\n              colorDisabled: props.theme.colors['content-oncolor-disabled'],\n            })}\n      ${(props) =>\n        props.background\n          ? templateBackground({\n              bg: props.theme.colors['bg-onmain-secondary'],\n              border: props.theme.colors['border-oncolor-disabled'],\n              bgChecked: props.theme.colors['bg-onmain-secondary'],\n              borderChecked: props.theme.colors['border-oncolor-disabled'],\n              bgHover: props.theme.colors['bg-onmain-secondary'],\n              borderHover: props.theme.colors['border-oncolor-disabled'],\n              beforeBgHover: 'transparent',\n            })\n          : null}\n    `,\n  },\n}\n\nconst PRESET_DEFAULT = {\n  default: css<StyledCheckboxProps>`\n    ${(props) =>\n      props.error\n        ? `\n          & > ${DefaultMask} > rect { \n            fill: ${tinycolor(props.theme.colors.pomegranate).setAlpha(0.1).toString()};\n            stroke: ${props.theme.colors.pomegranate};\n          }  \n          & > ${DefaultMask} g > rect {\n            fill: ${props.theme.colors.pomegranate};\n          }\n        `\n        : null}\n\n    ${(props) => `\n      color: ${props.disabled ? props.theme.colors.alto : props.theme.colors.mineShaft};\n      cursor: ${props.disabled ? 'not-allowed' : 'pointer'};\n\n      & > ${Input}:checked ~ ${DefaultMask} g {\n        opacity: 1;\n      }\n      & > ${Input}:disabled ~ ${DefaultMask} > rect {\n        fill: ${props.theme.colors.white};\n        stroke: ${props.theme.colors.grey};\n      }\n      & > ${Input}:checked:disabled ~ ${DefaultMask} g > rect {\n        fill: ${props.theme.colors.alto};\n      }\n      &:focus {\n        outline: none;\n      }\n      & > ${Input}:focus-visible ~ ${DefaultMask} {\n        outline: 1px solid ${props.theme.colors.accent};\n        outline-offset: 2px;\n      }\n    `}\n  `,\n}\n\nconst extractStyles = (props: StyledCheckboxProps) => {\n  if (props.brandPresetUsed) {\n    if (props.disabled && !props.onColored) return PRESET.default.disabled\n    if (props.disabled && props.onColored) return PRESET.onColored.disabled\n\n    if (props.error && !props.success && !props.onColored) return PRESET.default.error\n    if (props.error && !props.success && props.onColored) return PRESET.onColored.error\n\n    if (props.success && !props.error && !props.onColored) return PRESET.default.success\n    if (props.success && !props.error && props.onColored) return PRESET.onColored.success\n\n    return props.onColored ? PRESET.onColored.regular : PRESET.default.regular\n  }\n\n  return PRESET_DEFAULT.default\n}\n\nconst extractSizes = (props: StyledCheckboxProps) => {\n  const SIZES = props.brandPresetUsed ? BRAND_SIZES : DEFAULT_SIZES\n\n  return STATIC_SIZES.includes(<CheckboxStaticSize>props.size)\n    ? `font-size: ${SIZES[<CheckboxStaticSize>props.size]}px;`\n    : responsiveProperty('size', 'font-size')\n}\n\nexport const Root = styled.label.withConfig<StyledCheckboxProps>({\n  shouldForwardProp: (prop) => ['children', 'htmlFor', 'style'].includes(prop),\n})`\n  ${baseStyles}\n  ${extractStyles}\n  ${extractSizes}\n\n  ${(props) =>\n    responsiveProperty(\n      'width',\n      props.fluid && props.width !== 'auto' && !Array.isArray(props.width) ? 'max-width' : 'width'\n    )}\n  ${(props) => (props.fluid ? 'width: 100%;' : null)}\n`\n\nexport const Group = styled.div.withConfig<CheckboxGroupProps>({\n  shouldForwardProp: (prop) => prop !== 'inline',\n})`\n  ${(props) =>\n    props.inline\n      ? css`\n          display: flex;\n          flex-direction: row;\n          > ${Root}:first-child {\n            margin-left: 0;\n          }\n          > ${Root}:not(:first-child) {\n            margin-left: 15px;\n          }\n          ${screenMaxS()`\n            flex-direction: column;\n            > ${Root}:first-child {\n              margin-top: 0;\n            }\n            > ${Root}:not(:first-child) {\n              margin-top: 15px;\n              margin-left: 0;\n            }\n          `}\n        `\n      : `\n          display: flex;\n          flex-direction: column;\n          > ${Root}:first-child {\n            margin-top: 0;\n            margin-left: 0;\n          }\n          > ${Root}:not(:first-child) {\n            margin-top: 15px;\n            margin-left: 0;\n          }\n      `}\n`\n"],"names":["DEFAULT_SIZES","extraSmall","xs","small","s","medium","m","large","l","extraLarge","xl","BRAND_SIZES","STATIC_SIZES","baseStyles","css","props","background","concat","inline","Input","styled","input","withConfig","componentId","Background","span","DefaultMask","DefaultCheck","BrandMask","div","CheckIcon","Check","Content","template","palette","fontColor","bg","color","border","bgChecked","colorDisabled","borderHover","outlineFocus","templateBackground","borderChecked","bgHover","beforeBgHover","PRESET","default","regular","theme","colors","error","success","disabled","onColored","PRESET_DEFAULT","tinycolor","pomegranate","setAlpha","toString","alto","mineShaft","white","grey","accent","Root","label","shouldForwardProp","prop","includes","brandPresetUsed","SIZES","size","responsiveProperty","fluid","width","Array","isArray","Group","screenMaxS"],"mappings":"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"}

package/components/ContextMenu.Multilevel/ContextMenu.Multilevel.js.map

@@ -1 +1 @@
-{"version":3,"file":"ContextMenu.Multilevel.js","sources":["../../../../src/components/ContextMenu.Multilevel/ContextMenu.Multilevel.tsx"],"sourcesContent":["import { PureComponent } from 'react'\nimport type { BaseProps, Color } from 'shared/interfaces'\nimport { Spacer } from 'components/Spacer'\nimport { ContextMenu, ContextMenuProps } from '../ContextMenu/ContextMenu'\nimport { Heading } from './Heading'\nimport { SubHeading } from './SubHeading'\nimport { Controls } from './Controls'\nimport * as Styled from './style'\n\nexport interface MultiLevelControls {\n  cancel?: {\n    content?: string\n    onClick?(): void\n    color?: Color\n  }\n  confirm?: {\n    content?: string\n    onClick?(): void\n    color?: Color\n  }\n}\n\nexport interface MultiLevelItem {\n  id: string | number\n  heading?: string\n  subheading?: string\n  content?: string\n  preventClosing?: boolean\n  // eslint-disable-next-line no-use-before-define\n  config?: MultiLevelConfig\n  items?: MultiLevelItem[]\n  controls?: MultiLevelControls\n  level?: number\n  active?: boolean\n  onClick?(_item: MultiLevelItem): void\n}\n\nexport interface MultiLevelConfig {\n  items?: MultiLevelItem[]\n  heading?: string\n  subheading?: string\n  controls?: MultiLevelControls\n}\n\nexport interface ContextMenuMultiLevelProps extends ContextMenuProps, BaseProps {\n  /**  Menu config */\n  config?: MultiLevelConfig\n  /** On select item callback */\n  onSelectItem?(_item: MultiLevelItem, _level: MultiLevelItem['level']): void\n}\n\ninterface ContextMenuMultiLevelState {\n  selectedItems: (number | string)[]\n}\n\n/**\n * Расширен:\n * - [`BaseProps`](#/Миксины)\n */\nexport class ContextMenuMultiLevel extends PureComponent<ContextMenuMultiLevelProps, ContextMenuMultiLevelState> {\n  resetTimeout?: ReturnType<typeof setTimeout>\n  static displayName = 'ContextMenu.MultiLevel'\n  static defaultProps = {\n    config: {},\n  }\n\n  constructor(props: ContextMenuMultiLevelProps) {\n    super(props)\n\n    this.state = {\n      selectedItems: [],\n    }\n  }\n\n  componentWillUnmount() {\n    clearTimeout(this.resetTimeout)\n  }\n\n  onSelectItem = (selectedItem: MultiLevelItem) => {\n    const { id, level } = selectedItem\n\n    const { selectedItems } = this.state\n    const newSelectedItems = [...selectedItems.slice(0, level), id]\n\n    this.setState({ selectedItems: newSelectedItems })\n\n    if (typeof this.props.onSelectItem === 'function') this.props.onSelectItem(selectedItem, level)\n  }\n\n  getCurrentConfig = (): MultiLevelConfig | null => {\n    const { config } = this.props\n    const { selectedItems } = this.state\n\n    if (!config) return null\n\n    if (!selectedItems.length) return config\n\n    try {\n      const currentConfig = selectedItems.reduce((acc, levelId) => {\n        return acc.items ? acc.items.find((item) => item.id === levelId)?.config || {} : {}\n      }, config)\n\n      return currentConfig\n    } catch (error) {\n      return null\n    }\n  }\n\n  reset = () => {\n    /* Reset timeout to prevent state switch due to slow tooltip closing animation */\n    this.resetTimeout = setTimeout(() => this.setState({ selectedItems: [] }), 200)\n  }\n\n  itemOnClickHandler: React.MouseEventHandler<HTMLDivElement> = (e) => {\n    const config = this.getCurrentConfig()\n    if (!config) throw new Error('Config not found')\n\n    const { items = [] } = config\n    const { currentTarget } = e\n\n    const { id = null } = currentTarget.dataset\n\n    if (id === null) throw new Error('Data-id for item not found')\n\n    const item = items.find((item) => `${item.id}` === id)\n\n    if (!item) throw new Error('Item not found')\n\n    if (item.config || item.preventClosing) {\n      e.preventDefault()\n      e.stopPropagation()\n    }\n\n    if (item.config) {\n      /* If menu item has config - select item to show inner level */\n      this.onSelectItem(item)\n    }\n\n    if (typeof item.onClick === 'function') {\n      item.onClick(item)\n    }\n  }\n\n  render() {\n    const { children, className, tooltipProps, isOpen, trigger, ...anotherProps } = this.props\n    const { selectedItems } = this.state\n    const config = this.getCurrentConfig()\n\n    // eslint-disable-next-line @typescript-eslint/no-unused-vars\n    const { config: _config, onSelectItem: _onSelectItem, ...restProps } = anotherProps\n\n    return (\n      <ContextMenu\n        className={className}\n        tooltipProps={tooltipProps}\n        isOpen={isOpen}\n        onClose={this.reset}\n        trigger={trigger}\n        {...restProps}\n      >\n        {children}\n        <>\n          <Spacer top={9} />\n          {config?.heading ? <Heading content={config.heading} /> : null}\n          {config?.subheading ? <SubHeading content={config.subheading} /> : null}\n          {config?.items ? (\n            <Styled.MultilevelItems>\n              {config.items.map((item) => (\n                <ContextMenu.Item\n                  key={item.id}\n                  id={item.id}\n                  content={item.content}\n                  active={(item.level && Boolean(selectedItems[item.level] === item.id)) || item.active}\n                  onClick={this.itemOnClickHandler}\n                />\n              ))}\n            </Styled.MultilevelItems>\n          ) : null}\n          {config?.controls ? <Controls {...config.controls} /> : <Spacer top={9} />}\n        </>\n      </ContextMenu>\n    )\n  }\n}\n"],"names":["ContextMenuMultiLevel","PureComponent","constructor","props","super","this","resetTimeout","onSelectItem","selectedItem","id","level","selectedItems","state","newSelectedItems","slice","setState","getCurrentConfig","config","length","reduce","acc","levelId","_acc$items$find","items","find","item","error","reset","setTimeout","itemOnClickHandler","e","Error","currentTarget","dataset","concat","preventClosing","preventDefault","stopPropagation","onClick","componentWillUnmount","clearTimeout","render","_this$props","children","className","tooltipProps","isOpen","trigger","anotherProps","_objectWithoutProperties","_excluded","restProps","_excluded2","_jsxs","ContextMenu","_objectSpread","onClose","_Fragment","_jsx","Spacer","top","heading","Heading","content","subheading","SubHeading","Styled.MultilevelItems","map","Item","active","Boolean","controls","Controls","displayName","defaultProps"],"mappings":"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"}
+{"version":3,"file":"ContextMenu.Multilevel.js","sources":["../../../../src/components/ContextMenu.Multilevel/ContextMenu.Multilevel.tsx"],"sourcesContent":["import { PureComponent } from 'react'\nimport type { BaseProps } from 'shared/interfaces'\nimport type { Color } from 'shared/types'\nimport { Spacer } from 'components/Spacer'\nimport { ContextMenu, ContextMenuProps } from '../ContextMenu/ContextMenu'\nimport { Heading } from './Heading'\nimport { SubHeading } from './SubHeading'\nimport { Controls } from './Controls'\nimport * as Styled from './style'\n\nexport interface MultiLevelControls {\n  cancel?: {\n    content?: string\n    onClick?(): void\n    color?: Color\n  }\n  confirm?: {\n    content?: string\n    onClick?(): void\n    color?: Color\n  }\n}\n\nexport interface MultiLevelItem {\n  id: string | number\n  heading?: string\n  subheading?: string\n  content?: string\n  preventClosing?: boolean\n  // eslint-disable-next-line no-use-before-define\n  config?: MultiLevelConfig\n  items?: MultiLevelItem[]\n  controls?: MultiLevelControls\n  level?: number\n  active?: boolean\n  onClick?(_item: MultiLevelItem): void\n}\n\nexport interface MultiLevelConfig {\n  items?: MultiLevelItem[]\n  heading?: string\n  subheading?: string\n  controls?: MultiLevelControls\n}\n\nexport interface ContextMenuMultiLevelProps extends ContextMenuProps, BaseProps {\n  /**  Menu config */\n  config?: MultiLevelConfig\n  /** On select item callback */\n  onSelectItem?(_item: MultiLevelItem, _level: MultiLevelItem['level']): void\n}\n\ninterface ContextMenuMultiLevelState {\n  selectedItems: (number | string)[]\n}\n\n/**\n * Расширен:\n * - [`BaseProps`](#/Миксины)\n */\nexport class ContextMenuMultiLevel extends PureComponent<ContextMenuMultiLevelProps, ContextMenuMultiLevelState> {\n  resetTimeout?: ReturnType<typeof setTimeout>\n  static displayName = 'ContextMenu.MultiLevel'\n  static defaultProps = {\n    config: {},\n  }\n\n  constructor(props: ContextMenuMultiLevelProps) {\n    super(props)\n\n    this.state = {\n      selectedItems: [],\n    }\n  }\n\n  componentWillUnmount() {\n    clearTimeout(this.resetTimeout)\n  }\n\n  onSelectItem = (selectedItem: MultiLevelItem) => {\n    const { id, level } = selectedItem\n\n    const { selectedItems } = this.state\n    const newSelectedItems = [...selectedItems.slice(0, level), id]\n\n    this.setState({ selectedItems: newSelectedItems })\n\n    if (typeof this.props.onSelectItem === 'function') this.props.onSelectItem(selectedItem, level)\n  }\n\n  getCurrentConfig = (): MultiLevelConfig | null => {\n    const { config } = this.props\n    const { selectedItems } = this.state\n\n    if (!config) return null\n\n    if (!selectedItems.length) return config\n\n    try {\n      const currentConfig = selectedItems.reduce((acc, levelId) => {\n        return acc.items ? acc.items.find((item) => item.id === levelId)?.config || {} : {}\n      }, config)\n\n      return currentConfig\n    } catch (error) {\n      return null\n    }\n  }\n\n  reset = () => {\n    /* Reset timeout to prevent state switch due to slow tooltip closing animation */\n    this.resetTimeout = setTimeout(() => this.setState({ selectedItems: [] }), 200)\n  }\n\n  itemOnClickHandler: React.MouseEventHandler<HTMLDivElement> = (e) => {\n    const config = this.getCurrentConfig()\n    if (!config) throw new Error('Config not found')\n\n    const { items = [] } = config\n    const { currentTarget } = e\n\n    const { id = null } = currentTarget.dataset\n\n    if (id === null) throw new Error('Data-id for item not found')\n\n    const item = items.find((item) => `${item.id}` === id)\n\n    if (!item) throw new Error('Item not found')\n\n    if (item.config || item.preventClosing) {\n      e.preventDefault()\n      e.stopPropagation()\n    }\n\n    if (item.config) {\n      /* If menu item has config - select item to show inner level */\n      this.onSelectItem(item)\n    }\n\n    if (typeof item.onClick === 'function') {\n      item.onClick(item)\n    }\n  }\n\n  render() {\n    const { children, className, tooltipProps, isOpen, trigger, ...anotherProps } = this.props\n    const { selectedItems } = this.state\n    const config = this.getCurrentConfig()\n\n    // eslint-disable-next-line @typescript-eslint/no-unused-vars\n    const { config: _config, onSelectItem: _onSelectItem, ...restProps } = anotherProps\n\n    return (\n      <ContextMenu\n        className={className}\n        tooltipProps={tooltipProps}\n        isOpen={isOpen}\n        onClose={this.reset}\n        trigger={trigger}\n        {...restProps}\n      >\n        {children}\n        <>\n          <Spacer top={9} />\n          {config?.heading ? <Heading content={config.heading} /> : null}\n          {config?.subheading ? <SubHeading content={config.subheading} /> : null}\n          {config?.items ? (\n            <Styled.MultilevelItems>\n              {config.items.map((item) => (\n                <ContextMenu.Item\n                  key={item.id}\n                  id={item.id}\n                  content={item.content}\n                  active={(item.level && Boolean(selectedItems[item.level] === item.id)) || item.active}\n                  onClick={this.itemOnClickHandler}\n                />\n              ))}\n            </Styled.MultilevelItems>\n          ) : null}\n          {config?.controls ? <Controls {...config.controls} /> : <Spacer top={9} />}\n        </>\n      </ContextMenu>\n    )\n  }\n}\n"],"names":["ContextMenuMultiLevel","PureComponent","constructor","props","super","this","resetTimeout","onSelectItem","selectedItem","id","level","selectedItems","state","newSelectedItems","slice","setState","getCurrentConfig","config","length","reduce","acc","levelId","_acc$items$find","items","find","item","error","reset","setTimeout","itemOnClickHandler","e","Error","currentTarget","dataset","concat","preventClosing","preventDefault","stopPropagation","onClick","componentWillUnmount","clearTimeout","render","_this$props","children","className","tooltipProps","isOpen","trigger","anotherProps","_objectWithoutProperties","_excluded","restProps","_excluded2","_jsxs","ContextMenu","_objectSpread","onClose","_Fragment","_jsx","Spacer","top","heading","Heading","content","subheading","SubHeading","Styled.MultilevelItems","map","Item","active","Boolean","controls","Controls","displayName","defaultProps"],"mappings":"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"}

package/components/Icon/Icon.js

@@ -1,2 +1,2 @@
-import{useClassname as s}from'../../hooks/useClassname.js';import{Root as e}from'./style.js';import{defaultIcons as i}from'./icons.js';export{IconNames}from'./icons.js';import{jsxs as o,jsx as l}from'react/jsx-runtime';function n(r){var{name:a,icon:z,svg:t,pointer:c,color:m,size:p,sizeXS:u,sizeS:L,sizeM:S,sizeL:d,sizeXL:y,className:X,style:f,vAlign:j,children:v}=r;var N=s(n.displayName,X);return a&&i[a]?o(e,{vAlign:j,color:m,pointer:c,className:N,size:p,sizeXS:u,sizeS:L,sizeM:S,sizeL:d,sizeXL:y,style:f,children:[l(i[a],{}),v]}):t?l(e,{vAlign:j,color:m,pointer:c,className:N,size:p,sizeXS:u,sizeS:L,sizeM:S,sizeL:d,sizeXL:y,style:f,dangerouslySetInnerHTML:{__html:t||''},children:z||null}):o(e,{vAlign:j,color:m,pointer:c,className:N,size:p,sizeXS:u,sizeS:L,sizeM:S,sizeL:d,sizeXL:y,style:f,children:[z||null,v]})}n.displayName='Icon';export{n as Icon};
+import{useClassname as s}from'../../hooks/useClassname.js';import{Root as e}from'./style.js';import{defaultIcons as i}from'./icons.js';export{IconNames}from'./icons.js';import{jsxs as o,jsx as a}from'react/jsx-runtime';function l(n){var{as:r,name:z,icon:t,svg:c,pointer:m,color:p,size:u,sizeXS:L,sizeS:S,sizeM:d,sizeL:y,sizeXL:X,className:f,style:j,vAlign:v,children:N}=n;var g=s(l.displayName,f);return z&&i[z]?o(e,{as:r,vAlign:v,color:p,pointer:m,className:g,size:u,sizeXS:L,sizeS:S,sizeM:d,sizeL:y,sizeXL:X,style:j,children:[a(i[z],{}),N]}):c?a(e,{as:r,vAlign:v,color:p,pointer:m,className:g,size:u,sizeXS:L,sizeS:S,sizeM:d,sizeL:y,sizeXL:X,style:j,dangerouslySetInnerHTML:{__html:c||''},children:t||null}):o(e,{as:r,vAlign:v,color:p,pointer:m,className:g,size:u,sizeXS:L,sizeS:S,sizeM:d,sizeL:y,sizeXL:X,style:j,children:[t||null,N]})}l.displayName='Icon';export{l as Icon};
 //# sourceMappingURL=Icon.js.map

package/components/Icon/Icon.js.map

@@ -1 +1 @@
-{"version":3,"file":"Icon.js","sources":["../../../../src/components/Icon/Icon.tsx"],"sourcesContent":["import { ColorProperty } from 'mixins/color'\nimport { VAlign } from 'mixins/vAlign'\nimport { ResponsiveNamedProperty } from 'mixins/responsive-property'\nimport { BaseProps } from 'shared/interfaces'\nimport { useClassname } from 'hooks/useClassname'\nimport * as Styled from './style'\n\nimport { defaultIcons, IconNames } from './icons'\n\nexport interface IconProps extends BaseProps, ColorProperty, VAlign, ResponsiveNamedProperty<'size'> {\n  /**\n   * Children react node\n   */\n  children?: React.ReactNode\n  /**\n   * Name of default icon\n   */\n  name?: keyof typeof IconNames\n  /**\n   * Object with icon's svg. Use for custom icon insertion with dangerouslySetInnerHTML\n   */\n  svg?: string\n  /**\n   * Object with icon's svg. Use for custom icon insertion\n   */\n  icon?: React.ReactNode\n  /**\n   * Show pointer cursor on hover?\n   */\n  pointer?: boolean\n}\n\nIcon.displayName = 'Icon'\n\n/**\n * Расширен:\n * - [`BaseProps`](#/Миксины)\n * - [`VAlign`](#/Миксины)\n * - [`Color`](#/Миксины)\n * - [`Color<'fontColor'>`](#/Миксины)\n * - [`ResponsiveNamedProperty<'size'>`](#/Миксины)\n */\nexport function Icon(props: IconProps) {\n  const {\n    name,\n    icon,\n    svg,\n    pointer,\n    color,\n    size,\n    sizeXS,\n    sizeS,\n    sizeM,\n    sizeL,\n    sizeXL,\n    className,\n    style,\n    vAlign,\n    children,\n  } = props\n\n  const _className = useClassname(Icon.displayName, className)\n\n  if (name && defaultIcons[name]) {\n    const Icon = defaultIcons[name]\n    return (\n      <Styled.Root\n        vAlign={vAlign}\n        color={color}\n        pointer={pointer}\n        className={_className}\n        size={size}\n        sizeXS={sizeXS}\n        sizeS={sizeS}\n        sizeM={sizeM}\n        sizeL={sizeL}\n        sizeXL={sizeXL}\n        style={style}\n      >\n        <Icon />\n        {children}\n      </Styled.Root>\n    )\n  }\n\n  if (svg) {\n    return (\n      <Styled.Root\n        vAlign={vAlign}\n        color={color}\n        pointer={pointer}\n        className={_className}\n        size={size}\n        sizeXS={sizeXS}\n        sizeS={sizeS}\n        sizeM={sizeM}\n        sizeL={sizeL}\n        sizeXL={sizeXL}\n        style={style}\n        dangerouslySetInnerHTML={{ __html: svg || '' }}\n      >\n        {icon || null}\n      </Styled.Root>\n    )\n  }\n\n  return (\n    <Styled.Root\n      vAlign={vAlign}\n      color={color}\n      pointer={pointer}\n      className={_className}\n      size={size}\n      sizeXS={sizeXS}\n      sizeS={sizeS}\n      sizeM={sizeM}\n      sizeL={sizeL}\n      sizeXL={sizeXL}\n      style={style}\n    >\n      {icon || null}\n      {children}\n    </Styled.Root>\n  )\n}\n\nexport { IconNames }\n"],"names":["Icon","props","name","icon","svg","pointer","color","size","sizeXS","sizeS","sizeM","sizeL","sizeXL","className","style","vAlign","children","_className","useClassname","displayName","defaultIcons","_jsxs","Styled.Root","_jsx","dangerouslySetInnerHTML","__html"],"mappings":"2NA0CO,SAASA,EAAKC,GACnB,IAAMC,KACJA,EADIC,KAEJA,EAFIC,IAGJA,EAHIC,QAIJA,EAJIC,MAKJA,EALIC,KAMJA,EANIC,OAOJA,EAPIC,MAQJA,EARIC,MASJA,EATIC,MAUJA,EAVIC,OAWJA,EAXIC,UAYJA,EAZIC,MAaJA,EAbIC,OAcJA,EAdIC,SAeJA,GACEf,EAEJ,IAAMgB,EAAaC,EAAalB,EAAKmB,YAAaN,GAElD,OAAIX,GAAQkB,EAAalB,GAGrBmB,EAACC,EAAD,CACEP,OAAQA,EACRT,MAAOA,EACPD,QAASA,EACTQ,UAAWI,EACXV,KAAMA,EACNC,OAAQA,EACRC,MAAOA,EACPC,MAAOA,EACPC,MAAOA,EACPC,OAAQA,EACRE,MAAOA,EAXTE,SAAA,CAaEO,EAfSH,EAAalB,GAExB,IAcGc,KAKHZ,EAEAmB,EAACD,EAAD,CACEP,OAAQA,EACRT,MAAOA,EACPD,QAASA,EACTQ,UAAWI,EACXV,KAAMA,EACNC,OAAQA,EACRC,MAAOA,EACPC,MAAOA,EACPC,MAAOA,EACPC,OAAQA,EACRE,MAAOA,EACPU,wBAAyB,CAAEC,OAAQrB,GAAO,IAZ5CY,SAcGb,GAAQ,OAMbkB,EAACC,EAAD,CACEP,OAAQA,EACRT,MAAOA,EACPD,QAASA,EACTQ,UAAWI,EACXV,KAAMA,EACNC,OAAQA,EACRC,MAAOA,EACPC,MAAOA,EACPC,MAAOA,EACPC,OAAQA,EACRE,MAAOA,EAXTE,SAAA,CAaGb,GAAQ,KACRa,KAzFPhB,EAAKmB,YAAc"}
+{"version":3,"file":"Icon.js","sources":["../../../../src/components/Icon/Icon.tsx"],"sourcesContent":["import { ColorProperty } from 'mixins/color'\nimport { VAlign } from 'mixins/vAlign'\nimport { ResponsiveNamedProperty } from 'mixins/responsive-property'\nimport { BaseProps } from 'shared/interfaces'\nimport { useClassname } from 'hooks/useClassname'\nimport * as Styled from './style'\n\nimport { defaultIcons, IconNames } from './icons'\n\nexport interface IconProps extends BaseProps, ColorProperty, VAlign, ResponsiveNamedProperty<'size'> {\n  /**\n   * Children react node\n   */\n  children?: React.ReactNode\n  /**\n   * Name of default icon\n   */\n  name?: keyof typeof IconNames\n  /**\n   * Object with icon's svg. Use for custom icon insertion with dangerouslySetInnerHTML\n   */\n  svg?: string\n  /**\n   * Object with icon's svg. Use for custom icon insertion\n   */\n  icon?: React.ReactNode\n  /**\n   * Show pointer cursor on hover?\n   */\n  pointer?: boolean\n  /** Root node polymorphic type */\n  // eslint-disable-next-line @typescript-eslint/no-explicit-any\n  as?: React.ElementType<any>\n}\n\nIcon.displayName = 'Icon'\n\n/**\n * Расширен:\n * - [`BaseProps`](#/Миксины)\n * - [`VAlign`](#/Миксины)\n * - [`Color`](#/Миксины)\n * - [`Color<'fontColor'>`](#/Миксины)\n * - [`ResponsiveNamedProperty<'size'>`](#/Миксины)\n */\nexport function Icon(props: IconProps) {\n  const {\n    as,\n    name,\n    icon,\n    svg,\n    pointer,\n    color,\n    size,\n    sizeXS,\n    sizeS,\n    sizeM,\n    sizeL,\n    sizeXL,\n    className,\n    style,\n    vAlign,\n    children,\n  } = props\n\n  const _className = useClassname(Icon.displayName, className)\n\n  if (name && defaultIcons[name]) {\n    const Icon = defaultIcons[name]\n    return (\n      <Styled.Root\n        as={as}\n        vAlign={vAlign}\n        color={color}\n        pointer={pointer}\n        className={_className}\n        size={size}\n        sizeXS={sizeXS}\n        sizeS={sizeS}\n        sizeM={sizeM}\n        sizeL={sizeL}\n        sizeXL={sizeXL}\n        style={style}\n      >\n        <Icon />\n        {children}\n      </Styled.Root>\n    )\n  }\n\n  if (svg) {\n    return (\n      <Styled.Root\n        as={as}\n        vAlign={vAlign}\n        color={color}\n        pointer={pointer}\n        className={_className}\n        size={size}\n        sizeXS={sizeXS}\n        sizeS={sizeS}\n        sizeM={sizeM}\n        sizeL={sizeL}\n        sizeXL={sizeXL}\n        style={style}\n        dangerouslySetInnerHTML={{ __html: svg || '' }}\n      >\n        {icon || null}\n      </Styled.Root>\n    )\n  }\n\n  return (\n    <Styled.Root\n      as={as}\n      vAlign={vAlign}\n      color={color}\n      pointer={pointer}\n      className={_className}\n      size={size}\n      sizeXS={sizeXS}\n      sizeS={sizeS}\n      sizeM={sizeM}\n      sizeL={sizeL}\n      sizeXL={sizeXL}\n      style={style}\n    >\n      {icon || null}\n      {children}\n    </Styled.Root>\n  )\n}\n\nexport { IconNames }\n"],"names":["Icon","props","as","name","icon","svg","pointer","color","size","sizeXS","sizeS","sizeM","sizeL","sizeXL","className","style","vAlign","children","_className","useClassname","displayName","defaultIcons","_jsxs","Styled.Root","_jsx","dangerouslySetInnerHTML","__html"],"mappings":"2NA6CO,SAASA,EAAKC,GACnB,IAAMC,GACJA,EADIC,KAEJA,EAFIC,KAGJA,EAHIC,IAIJA,EAJIC,QAKJA,EALIC,MAMJA,EANIC,KAOJA,EAPIC,OAQJA,EARIC,MASJA,EATIC,MAUJA,EAVIC,MAWJA,EAXIC,OAYJA,EAZIC,UAaJA,EAbIC,MAcJA,EAdIC,OAeJA,EAfIC,SAgBJA,GACEhB,EAEJ,IAAMiB,EAAaC,EAAanB,EAAKoB,YAAaN,GAElD,OAAIX,GAAQkB,EAAalB,GAGrBmB,EAACC,EAAD,CACErB,GAAIA,EACJc,OAAQA,EACRT,MAAOA,EACPD,QAASA,EACTQ,UAAWI,EACXV,KAAMA,EACNC,OAAQA,EACRC,MAAOA,EACPC,MAAOA,EACPC,MAAOA,EACPC,OAAQA,EACRE,MAAOA,EAZTE,SAAA,CAcEO,EAhBSH,EAAalB,GAExB,IAeGc,KAKHZ,EAEAmB,EAACD,EAAD,CACErB,GAAIA,EACJc,OAAQA,EACRT,MAAOA,EACPD,QAASA,EACTQ,UAAWI,EACXV,KAAMA,EACNC,OAAQA,EACRC,MAAOA,EACPC,MAAOA,EACPC,MAAOA,EACPC,OAAQA,EACRE,MAAOA,EACPU,wBAAyB,CAAEC,OAAQrB,GAAO,IAb5CY,SAeGb,GAAQ,OAMbkB,EAACC,EAAD,CACErB,GAAIA,EACJc,OAAQA,EACRT,MAAOA,EACPD,QAASA,EACTQ,UAAWI,EACXV,KAAMA,EACNC,OAAQA,EACRC,MAAOA,EACPC,MAAOA,EACPC,MAAOA,EACPC,OAAQA,EACRE,MAAOA,EAZTE,SAAA,CAcGb,GAAQ,KACRa,KA7FPjB,EAAKoB,YAAc"}

package/components/Switcher/Switcher.js

@@ -1,2 +1,2 @@
-import e from'@babel/runtime/helpers/objectSpread2';import r from'@babel/runtime/helpers/objectWithoutProperties';import{forwardRef as a}from'react';import{useFallbackTheme as t}from'../../hooks/use-theme.js';import{useConfigPriority as o}from'../../hooks/use-config-priority.js';import{BRAND_PROPS as s,DEFAULT_PROPS as i}from'./constants.js';import{Root as n,Input as d,Switcher as m,Label as c}from'./style.js';import{jsxs as h,jsx as l}from'react/jsx-runtime';var p=["value","disabled","tabIndex","id","name","children","onChange"];var b='Switcher';var f=a(((a,b)=>{var f;var u=t();var v=o(null===(f=u.components)||void 0===f?void 0:f.Switcher,a),{value:j=!1,disabled:x=!1,tabIndex:P,id:S,name:g,children:k,onChange:y}=v,w=r(v,p);var C='brand'===u.preset;'string'==typeof w.preset&&(C='brand'===w.preset);var N=C?s:i;return h(n,e(e(e({},w),N),{},{ref:b,checked:j,disabled:x,brandPresetUsed:C,children:[l(d,{id:S,name:g,checked:j,type:"checkbox",tabIndex:P,onChange:e=>{x||'function'!=typeof y||y(e.target.checked,e)},disabled:x}),l(m,e({htmlFor:S},N)),k?l(c,{htmlFor:S,children:k}):null]}))}));f.displayName="Switcher";export{b as COMPONENT_NAME,f as Switcher};
+import e from'@babel/runtime/helpers/objectSpread2';import r from'@babel/runtime/helpers/objectWithoutProperties';import{forwardRef as t}from'react';import{useTheme as a}from'styled-components';import{useConfigPriority as o}from'../../hooks/use-config-priority.js';import{BRAND_PROPS as s,DEFAULT_PROPS as i}from'./constants.js';import{Root as n,Input as d,Switcher as m,Label as c}from'./style.js';import{jsxs as l,jsx as p}from'react/jsx-runtime';var h=["value","disabled","tabIndex","id","name","children","onChange"];var b='Switcher';var f=t(((t,b)=>{var f;var u=a();var v=o(null===(f=u.components)||void 0===f?void 0:f.Switcher,t),{value:j=!1,disabled:x=!1,tabIndex:y,id:P,name:S,children:g,onChange:w}=v,k=r(v,h);var C='brand'===u.preset;'string'==typeof k.preset&&(C='brand'===k.preset);var N=C?s:i;return l(n,e(e(e({},k),N),{},{ref:b,checked:j,disabled:x,brandPresetUsed:C,children:[p(d,{id:P,name:S,checked:j,type:"checkbox",tabIndex:y,onChange:e=>{x||'function'!=typeof w||w(e.target.checked,e)},disabled:x}),p(m,e({htmlFor:P},N)),g?p(c,{htmlFor:P,children:g}):null]}))}));f.displayName="Switcher";export{b as COMPONENT_NAME,f as Switcher};
 //# sourceMappingURL=Switcher.js.map

package/components/Switcher/Switcher.js.map

@@ -1 +1 @@
-{"version":3,"file":"Switcher.js","sources":["../../../../src/components/Switcher/Switcher.tsx"],"sourcesContent":["import { forwardRef } from 'react'\nimport { useFallbackTheme } from 'hooks/use-theme'\nimport { useConfigPriority } from 'hooks/use-config-priority'\nimport type { SwitcherProps } from './types'\nimport { DEFAULT_PROPS, BRAND_PROPS } from './constants'\nimport * as Styled from './style'\n\nconst COMPONENT_NAME = 'Switcher'\n\nconst Switcher = forwardRef<HTMLDivElement, SwitcherProps>((props, ref) => {\n  const theme = useFallbackTheme()\n\n  const {\n    value = false,\n    disabled = false,\n    tabIndex,\n    id,\n    name,\n    children,\n    onChange,\n    ...config\n  } = useConfigPriority<SwitcherProps>(theme.components?.Switcher, props)\n\n  let brandPresetUsed = theme.preset === 'brand'\n  if (typeof config.preset === 'string') brandPresetUsed = config.preset === 'brand'\n\n  const propsByPreset = brandPresetUsed ? BRAND_PROPS : DEFAULT_PROPS\n\n  const handleChange: React.ChangeEventHandler<HTMLInputElement> = (event) => {\n    if (!disabled && typeof onChange === 'function') onChange(event.target.checked, event)\n  }\n\n  return (\n    <Styled.Root\n      {...config}\n      {...propsByPreset}\n      ref={ref}\n      checked={value}\n      disabled={disabled}\n      brandPresetUsed={brandPresetUsed}\n    >\n      <Styled.Input\n        id={id}\n        name={name}\n        checked={value}\n        type='checkbox'\n        tabIndex={tabIndex}\n        onChange={handleChange}\n        disabled={disabled}\n      />\n      <Styled.Switcher htmlFor={id} {...propsByPreset} />\n      {children ? <Styled.Label htmlFor={id}>{children}</Styled.Label> : null}\n    </Styled.Root>\n  )\n})\n\nSwitcher.displayName = COMPONENT_NAME\n\nexport { Switcher, COMPONENT_NAME }\n\nexport type { SwitcherProps }\n"],"names":["COMPONENT_NAME","Switcher","forwardRef","props","ref","_theme$components","theme","useFallbackTheme","useConfigPriority","components","value","disabled","tabIndex","id","name","children","onChange","_useConfigPriority","config","_objectWithoutProperties","_excluded","brandPresetUsed","preset","propsByPreset","BRAND_PROPS","DEFAULT_PROPS","_jsxs","Styled.Root","checked","_jsx","Styled.Input","type","event","target","Styled.Switcher","_objectSpread","htmlFor","Styled.Label","displayName"],"mappings":"whBAOMA,IAAAA,EAAiB,WAEjBC,IAAAA,EAAWC,GAAAA,CAA2CC,EAAOC,KAAQ,IAAAC,EACzE,IAAMC,EAAQC,IAEd,IASIC,EAAAA,UAAiCF,EAAAA,EAAMG,kBAAAA,aAANJ,EAAkBJ,SAAUE,IAT3DO,MACJA,GAAAA,EADIC,SAEJA,KAFIC,SAGJA,EAHIC,GAIJA,EAJIC,KAKJA,EALIC,SAMJA,EANIC,SAOJA,GAPFC,EAQKC,EARLC,EAAAF,EAAAG,GAWA,IAAIC,EAAmC,UAAjBf,EAAMgB,OACC,iBAAlBJ,EAAOI,SAAqBD,EAAoC,UAAlBH,EAAOI,QAEhE,IAAMC,EAAgBF,EAAkBG,EAAcC,EAMtD,OACEC,EAACC,EACKT,EAAAA,EAAAA,EAAAA,GAAAA,GACAK,GAFN,GAAA,CAGEnB,IAAKA,EACLwB,QAASlB,EACTC,SAAUA,EACVU,gBAAiBA,EANnBN,SAQE,CAAAc,EAACC,EAAD,CACEjB,GAAIA,EACJC,KAAMA,EACNc,QAASlB,EACTqB,KAAK,WACLnB,SAAUA,EACVI,SAnB4DgB,IAC3DrB,GAAgC,mBAAbK,GAAyBA,EAASgB,EAAMC,OAAOL,QAASI,IAmB5ErB,SAAUA,IAEZkB,EAACK,EAADC,EAAA,CAAiBC,QAASvB,GAAQU,IACjCR,EAAWc,EAACQ,EAAD,CAAcD,QAASvB,EAAvBE,SAA4BA,IAA2B,YAKzEd,EAASqC,YAjDc"}
+{"version":3,"file":"Switcher.js","sources":["../../../../src/components/Switcher/Switcher.tsx"],"sourcesContent":["import { forwardRef } from 'react'\nimport { useTheme } from 'styled-components'\nimport { useConfigPriority } from 'hooks/use-config-priority'\nimport type { SwitcherProps } from './types'\nimport { DEFAULT_PROPS, BRAND_PROPS } from './constants'\nimport * as Styled from './style'\n\nconst COMPONENT_NAME = 'Switcher'\n\nconst Switcher = forwardRef<HTMLDivElement, SwitcherProps>((props, ref) => {\n  const theme = useTheme()\n\n  const {\n    value = false,\n    disabled = false,\n    tabIndex,\n    id,\n    name,\n    children,\n    onChange,\n    ...config\n  } = useConfigPriority<SwitcherProps>(theme.components?.Switcher, props)\n\n  let brandPresetUsed = theme.preset === 'brand'\n  if (typeof config.preset === 'string') brandPresetUsed = config.preset === 'brand'\n\n  const propsByPreset = brandPresetUsed ? BRAND_PROPS : DEFAULT_PROPS\n\n  const handleChange: React.ChangeEventHandler<HTMLInputElement> = (event) => {\n    if (!disabled && typeof onChange === 'function') onChange(event.target.checked, event)\n  }\n\n  return (\n    <Styled.Root\n      {...config}\n      {...propsByPreset}\n      ref={ref}\n      checked={value}\n      disabled={disabled}\n      brandPresetUsed={brandPresetUsed}\n    >\n      <Styled.Input\n        id={id}\n        name={name}\n        checked={value}\n        type='checkbox'\n        tabIndex={tabIndex}\n        onChange={handleChange}\n        disabled={disabled}\n      />\n      <Styled.Switcher htmlFor={id} {...propsByPreset} />\n      {children ? <Styled.Label htmlFor={id}>{children}</Styled.Label> : null}\n    </Styled.Root>\n  )\n})\n\nSwitcher.displayName = COMPONENT_NAME\n\nexport { Switcher, COMPONENT_NAME }\n\nexport type { SwitcherProps }\n"],"names":["COMPONENT_NAME","Switcher","forwardRef","props","ref","_theme$components","theme","useTheme","useConfigPriority","components","value","disabled","tabIndex","id","name","children","onChange","_useConfigPriority","config","_objectWithoutProperties","_excluded","brandPresetUsed","preset","propsByPreset","BRAND_PROPS","DEFAULT_PROPS","_jsxs","Styled.Root","checked","_jsx","Styled.Input","type","event","target","Styled.Switcher","_objectSpread","htmlFor","Styled.Label","displayName"],"mappings":"ygBAOMA,IAAAA,EAAiB,WAEjBC,IAAAA,EAAWC,GAAAA,CAA2CC,EAAOC,KAAQ,IAAAC,EACzE,IAAMC,EAAQC,IAEd,IASIC,EAAAA,UAAiCF,EAAAA,EAAMG,kBAAAA,aAANJ,EAAkBJ,SAAUE,IAT3DO,MACJA,GAAAA,EADIC,SAEJA,KAFIC,SAGJA,EAHIC,GAIJA,EAJIC,KAKJA,EALIC,SAMJA,EANIC,SAOJA,GAPFC,EAQKC,EARLC,EAAAF,EAAAG,GAWA,IAAIC,EAAmC,UAAjBf,EAAMgB,OACC,iBAAlBJ,EAAOI,SAAqBD,EAAoC,UAAlBH,EAAOI,QAEhE,IAAMC,EAAgBF,EAAkBG,EAAcC,EAMtD,OACEC,EAACC,EACKT,EAAAA,EAAAA,EAAAA,GAAAA,GACAK,GAFN,GAAA,CAGEnB,IAAKA,EACLwB,QAASlB,EACTC,SAAUA,EACVU,gBAAiBA,EANnBN,SAQE,CAAAc,EAACC,EAAD,CACEjB,GAAIA,EACJC,KAAMA,EACNc,QAASlB,EACTqB,KAAK,WACLnB,SAAUA,EACVI,SAnB4DgB,IAC3DrB,GAAgC,mBAAbK,GAAyBA,EAASgB,EAAMC,OAAOL,QAASI,IAmB5ErB,SAAUA,IAEZkB,EAACK,EAADC,EAAA,CAAiBC,QAASvB,GAAQU,IACjCR,EAAWc,EAACQ,EAAD,CAAcD,QAASvB,EAAvBE,SAA4BA,IAA2B,YAKzEd,EAASqC,YAjDc"}

package/components/Switcher/style.js

@@ -1,2 +1,2 @@
-import n,{css as o}from'styled-components';import e from'tinycolor2';import{injectDefaultTheme as t}from'../../shared/utils/inject-theme.js';import{getColor as i}from'../../mixins/color.js';var r=n.input.withConfig({componentId:"fox-ui__sc-w14piw-0"})(["position:absolute;overflow:visible;z-index:-1;opacity:0;width:0;height:0;margin:0;"]);var c=n.label.withConfig({componentId:"fox-ui__sc-w14piw-1"})(["display:inline;padding-left:14px;cursor:pointer;user-select:none;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;"]);var a=n.label.withConfig({componentId:"fox-ui__sc-w14piw-2"})(["position:relative;display:block;box-sizing:border-box;width:","px;height:","px;cursor:pointer;user-select:none;transition:background 0.3s ease,background-image 0.3s ease;border-radius:","px;flex:0 0 auto;&::before{position:absolute;top:","px;left:","px;display:block;width:","px;height:","px;content:'';transition:background 0.3s ease,left 0.3s ease;transform:translateZ(0);border-radius:50%;}"],(n=>n.switcherWidth),(n=>n.switcherHeight),(n=>n.borderRadius),(n=>{var{switcherHeight:o,dotSize:e}=n;return(o-e)/2}),(n=>{var{switcherHeight:o,dotSize:e}=n;return(o-e)/2}),(n=>n.dotSize),(n=>n.dotSize));var s="\n  cursor: not-allowed;\n  opacity: 0.7;\n\n  & ".concat(a," {\n    cursor: not-allowed;\n    box-shadow: none;\n\n    &::before {\n      box-shadow: none;\n    }\n  }\n\n  & ").concat(c," {\n    cursor: not-allowed;\n  }\n");var l=o(["& ","{&::before{left:","px;}}"],a,(n=>{var{switcherWidth:o,switcherHeight:e,dotSize:t}=n;return o-t-(e-t)/2}));var d=o(["",""],(n=>"\n    position: relative;\n    display: inline-flex;\n    flex-direction: row;\n    box-sizing: border-box;\n    height: ".concat(n.switcherHeight,"px;\n    line-height: ").concat(n.switcherHeight,"px;\n    vertical-align: middle;\n    justify-content: flex-start;\n    align-content: center;\n    align-items: center;\n    max-width: 100%;\n    color: inherit;\n  ")));var h=o(["",""],(n=>{var o=n.color||'atlantis';return"\n      & ".concat(a," {\n        box-shadow: inset 0 2px 2px 0 rgba(0, 0, 0, 0.08);\n        background-color: #eaecf3;\n\n        &::before {\n          background-color: ").concat(n.theme.colors.white,";\n          box-shadow: ").concat(n.disabled?'none':'0 0 6px 0 rgba(0, 0, 0, 0.16)',";\n        }\n\n        ").concat(n.inactiveColor?"\n                background-image: linear-gradient(\n                  to right,\n                  ".concat(e(i(n.inactiveColor,n)).lighten(10).toString(),",\n                  ").concat(i(n.inactiveColor,n),"\n                );\n              "):'',"\n\n        ").concat(n.checked?"\n                background-image: linear-gradient(\n                  to right,\n                  ".concat(e(i(o,n)).lighten(10).toString(),",\n                  ").concat(i(o,n),"\n                );\n              "):'',"\n      }\n\n      & ").concat(r,":focus-visible + ").concat(a," {\n        outline: 1px solid ").concat(i(o,n),";\n        outline-offset: 2px;\n      }\n    ")}));var b=o(["",""],(n=>"\n    & ".concat(a," {\n      background-color: ").concat(n.disabled?n.theme.colors[n.checked?'bg-disabled-active':'bg-disabled-small']:n.theme.colors[n.checked?'bg-brand-primary-basic':'bg-onmain-tertiary'],";\n\n      &::before {\n        background-color: ").concat(n.theme.colors['bg-oncolor-primary'],";\n        box-shadow: ").concat(n.disabled?'none':'0px 2px 4px rgba(0, 0, 0, 0.08)',";\n      }\n\n      ").concat(!n.checked&&n.inactiveColor?"background-color: ".concat(i(n.inactiveColor,n),";"):'',"\n      ").concat(n.checked&&n.color?"background-color: ".concat(i(n.color,n),";"):'',"\n    }\n\n    & ").concat(r,":focus-visible + ").concat(a," {\n      outline: 1px solid ").concat(n.color?i(n.color,n):n.theme.colors['bg-brand-primary-basic'],";\n      outline-offset: 2px;\n    }\n  ")));var p=n.div.withConfig({shouldForwardProp:n=>['children','className','style'].includes(n)}).attrs(t).withConfig({componentId:"fox-ui__sc-w14piw-3"})([""," "," "," ",""],d,(n=>n.checked?l:''),(n=>n.disabled?s:''),(n=>{var{brandPresetUsed:o}=n;return o?b:h}));export{r as Input,c as Label,p as Root,a as Switcher};
+import n,{css as o}from'styled-components';import e from'tinycolor2';import{getColor as t}from'../../mixins/color.js';var i=n.input.withConfig({componentId:"fox-ui__sc-w14piw-0"})(["position:absolute;overflow:visible;z-index:-1;opacity:0;width:0;height:0;margin:0;"]);var r=n.label.withConfig({componentId:"fox-ui__sc-w14piw-1"})(["display:inline;padding-left:14px;cursor:pointer;user-select:none;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;"]);var c=n.label.withConfig({componentId:"fox-ui__sc-w14piw-2"})(["position:relative;display:block;box-sizing:border-box;width:","px;height:","px;cursor:pointer;user-select:none;transition:background 0.3s ease,background-image 0.3s ease;border-radius:","px;flex:0 0 auto;&::before{position:absolute;top:","px;left:","px;display:block;width:","px;height:","px;content:'';transition:background 0.3s ease,left 0.3s ease;transform:translateZ(0);border-radius:50%;}"],(n=>n.switcherWidth),(n=>n.switcherHeight),(n=>n.borderRadius),(n=>{var{switcherHeight:o,dotSize:e}=n;return(o-e)/2}),(n=>{var{switcherHeight:o,dotSize:e}=n;return(o-e)/2}),(n=>n.dotSize),(n=>n.dotSize));var a="\n  cursor: not-allowed;\n  opacity: 0.7;\n\n  & ".concat(c," {\n    cursor: not-allowed;\n    box-shadow: none;\n\n    &::before {\n      box-shadow: none;\n    }\n  }\n\n  & ").concat(r," {\n    cursor: not-allowed;\n  }\n");var s=o(["& ","{&::before{left:","px;}}"],c,(n=>{var{switcherWidth:o,switcherHeight:e,dotSize:t}=n;return o-t-(e-t)/2}));var l=o(["",""],(n=>"\n    position: relative;\n    display: inline-flex;\n    flex-direction: row;\n    box-sizing: border-box;\n    height: ".concat(n.switcherHeight,"px;\n    line-height: ").concat(n.switcherHeight,"px;\n    vertical-align: middle;\n    justify-content: flex-start;\n    align-content: center;\n    align-items: center;\n    max-width: 100%;\n    color: inherit;\n  ")));var d=o(["",""],(n=>{var o=n.color||'atlantis';return"\n      & ".concat(c," {\n        box-shadow: inset 0 2px 2px 0 rgba(0, 0, 0, 0.08);\n        background-color: #eaecf3;\n\n        &::before {\n          background-color: ").concat(n.theme.colors.white,";\n          box-shadow: ").concat(n.disabled?'none':'0 0 6px 0 rgba(0, 0, 0, 0.16)',";\n        }\n\n        ").concat(n.inactiveColor?"\n                background-image: linear-gradient(\n                  to right,\n                  ".concat(e(t(n.inactiveColor,n)).lighten(10).toString(),",\n                  ").concat(t(n.inactiveColor,n),"\n                );\n              "):'',"\n\n        ").concat(n.checked?"\n                background-image: linear-gradient(\n                  to right,\n                  ".concat(e(t(o,n)).lighten(10).toString(),",\n                  ").concat(t(o,n),"\n                );\n              "):'',"\n      }\n\n      & ").concat(i,":focus-visible + ").concat(c," {\n        outline: 1px solid ").concat(t(o,n),";\n        outline-offset: 2px;\n      }\n    ")}));var h=o(["",""],(n=>"\n    & ".concat(c," {\n      background-color: ").concat(n.disabled?n.theme.colors[n.checked?'bg-disabled-active':'bg-disabled-small']:n.theme.colors[n.checked?'bg-brand-primary-basic':'bg-onmain-tertiary'],";\n\n      &::before {\n        background-color: ").concat(n.theme.colors['bg-oncolor-primary'],";\n        box-shadow: ").concat(n.disabled?'none':'0px 2px 4px rgba(0, 0, 0, 0.08)',";\n      }\n\n      ").concat(!n.checked&&n.inactiveColor?"background-color: ".concat(t(n.inactiveColor,n),";"):'',"\n      ").concat(n.checked&&n.color?"background-color: ".concat(t(n.color,n),";"):'',"\n    }\n\n    & ").concat(i,":focus-visible + ").concat(c," {\n      outline: 1px solid ").concat(n.color?t(n.color,n):n.theme.colors['bg-brand-primary-basic'],";\n      outline-offset: 2px;\n    }\n  ")));var b=n.div.withConfig({shouldForwardProp:n=>['children','className','style'].includes(n)}).withConfig({componentId:"fox-ui__sc-w14piw-3"})([""," "," "," ",""],l,(n=>n.checked?s:''),(n=>n.disabled?a:''),(n=>{var{brandPresetUsed:o}=n;return o?h:d}));export{i as Input,r as Label,b as Root,c as Switcher};
 //# sourceMappingURL=style.js.map

package/components/Switcher/style.js.map

@@ -1 +1 @@
-{"version":3,"file":"style.js","sources":["../../../../src/components/Switcher/style.ts"],"sourcesContent":["import styled, { css } from 'styled-components'\nimport tinycolor from 'tinycolor2'\nimport { injectDefaultTheme } from 'shared/utils/inject-theme'\nimport { getColor } from 'mixins/color'\nimport type { StyledSwitcherProps, SwitcherPropsByPreset } from './types'\n\nexport const Input = styled.input`\n  position: absolute;\n  overflow: visible;\n  z-index: -1;\n  opacity: 0;\n  width: 0;\n  height: 0;\n  margin: 0;\n`\n\nexport const Label = styled.label`\n  display: inline;\n  padding-left: 14px;\n  cursor: pointer;\n  user-select: none;\n  overflow: hidden;\n  white-space: nowrap;\n  text-overflow: ellipsis;\n`\n\nexport const Switcher = styled.label<SwitcherPropsByPreset>`\n  position: relative;\n  display: block;\n  box-sizing: border-box;\n  width: ${(props) => props.switcherWidth}px;\n  height: ${(props) => props.switcherHeight}px;\n  cursor: pointer;\n  user-select: none;\n  transition: background 0.3s ease, background-image 0.3s ease;\n  border-radius: ${(props) => props.borderRadius}px;\n  flex: 0 0 auto;\n\n  &::before {\n    position: absolute;\n    top: ${({ switcherHeight, dotSize }) => (switcherHeight - dotSize) / 2}px;\n    left: ${({ switcherHeight, dotSize }) => (switcherHeight - dotSize) / 2}px;\n    display: block;\n    width: ${(props) => props.dotSize}px;\n    height: ${(props) => props.dotSize}px;\n    content: '';\n    transition: background 0.3s ease, left 0.3s ease;\n    transform: translateZ(0);\n    border-radius: 50%;\n  }\n`\n\nconst disabledStyles = `\n  cursor: not-allowed;\n  opacity: 0.7;\n\n  & ${Switcher} {\n    cursor: not-allowed;\n    box-shadow: none;\n\n    &::before {\n      box-shadow: none;\n    }\n  }\n\n  & ${Label} {\n    cursor: not-allowed;\n  }\n`\n\nconst checkedStyles = css<StyledSwitcherProps>`\n  & ${Switcher} {\n    &::before {\n      left: ${({ switcherWidth, switcherHeight, dotSize }) =>\n        switcherWidth - dotSize - (switcherHeight - dotSize) / 2}px;\n    }\n  }\n`\n\nconst baseStyles = css<StyledSwitcherProps>`\n  ${(props) => `\n    position: relative;\n    display: inline-flex;\n    flex-direction: row;\n    box-sizing: border-box;\n    height: ${props.switcherHeight}px;\n    line-height: ${props.switcherHeight}px;\n    vertical-align: middle;\n    justify-content: flex-start;\n    align-content: center;\n    align-items: center;\n    max-width: 100%;\n    color: inherit;\n  `}\n`\n\nconst defaultPresetStyle = css<StyledSwitcherProps>`\n  ${(props) => {\n    const color = props.color || 'atlantis'\n\n    return `\n      & ${Switcher} {\n        box-shadow: inset 0 2px 2px 0 rgba(0, 0, 0, 0.08);\n        background-color: #eaecf3;\n\n        &::before {\n          background-color: ${props.theme.colors.white};\n          box-shadow: ${props.disabled ? 'none' : '0 0 6px 0 rgba(0, 0, 0, 0.16)'};\n        }\n\n        ${\n          props.inactiveColor\n            ? `\n                background-image: linear-gradient(\n                  to right,\n                  ${tinycolor(getColor(props.inactiveColor, props)).lighten(10).toString()},\n                  ${getColor(props.inactiveColor, props)}\n                );\n              `\n            : ''\n        }\n\n        ${\n          props.checked\n            ? `\n                background-image: linear-gradient(\n                  to right,\n                  ${tinycolor(getColor(color, props)).lighten(10).toString()},\n                  ${getColor(color, props)}\n                );\n              `\n            : ''\n        }\n      }\n\n      & ${Input}:focus-visible + ${Switcher} {\n        outline: 1px solid ${getColor(color, props)};\n        outline-offset: 2px;\n      }\n    `\n  }}\n`\n\nconst brandPresetStyles = css<StyledSwitcherProps>`\n  ${(props) => `\n    & ${Switcher} {\n      background-color: ${\n        props.disabled\n          ? props.theme.colors[props.checked ? 'bg-disabled-active' : 'bg-disabled-small']\n          : props.theme.colors[props.checked ? 'bg-brand-primary-basic' : 'bg-onmain-tertiary']\n      };\n\n      &::before {\n        background-color: ${props.theme.colors['bg-oncolor-primary']};\n        box-shadow: ${props.disabled ? 'none' : '0px 2px 4px rgba(0, 0, 0, 0.08)'};\n      }\n\n      ${!props.checked && props.inactiveColor ? `background-color: ${getColor(props.inactiveColor, props)};` : ''}\n      ${props.checked && props.color ? `background-color: ${getColor(props.color, props)};` : ''}\n    }\n\n    & ${Input}:focus-visible + ${Switcher} {\n      outline: 1px solid ${props.color ? getColor(props.color, props) : props.theme.colors['bg-brand-primary-basic']};\n      outline-offset: 2px;\n    }\n  `}\n`\n\nexport const Root = styled.div\n  .withConfig({\n    shouldForwardProp: (prop) => ['children', 'className', 'style'].includes(prop),\n  })\n  .attrs(injectDefaultTheme)<StyledSwitcherProps>`\n  ${baseStyles}\n\n  ${(props) => (props.checked ? checkedStyles : '')}\n  ${(props) => (props.disabled ? disabledStyles : '')}\n  ${({ brandPresetUsed }) => (brandPresetUsed ? brandPresetStyles : defaultPresetStyle)}\n`\n"],"names":["Input","styled","input","withConfig","componentId","Label","label","Switcher","props","switcherWidth","switcherHeight","borderRadius","_ref","dotSize","_ref2","disabledStyles","concat","checkedStyles","css","_ref3","baseStyles","defaultPresetStyle","color","theme","colors","white","disabled","inactiveColor","tinycolor","getColor","lighten","toString","checked","brandPresetStyles","Root","div","shouldForwardProp","prop","includes","attrs","injectDefaultTheme","_ref4","brandPresetUsed"],"mappings":"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"}
+{"version":3,"file":"style.js","sources":["../../../../src/components/Switcher/style.ts"],"sourcesContent":["import styled, { css } from 'styled-components'\nimport tinycolor from 'tinycolor2'\nimport { getColor } from 'mixins/color'\nimport type { StyledSwitcherProps, SwitcherPropsByPreset } from './types'\n\nexport const Input = styled.input`\n  position: absolute;\n  overflow: visible;\n  z-index: -1;\n  opacity: 0;\n  width: 0;\n  height: 0;\n  margin: 0;\n`\n\nexport const Label = styled.label`\n  display: inline;\n  padding-left: 14px;\n  cursor: pointer;\n  user-select: none;\n  overflow: hidden;\n  white-space: nowrap;\n  text-overflow: ellipsis;\n`\n\nexport const Switcher = styled.label<SwitcherPropsByPreset>`\n  position: relative;\n  display: block;\n  box-sizing: border-box;\n  width: ${(props) => props.switcherWidth}px;\n  height: ${(props) => props.switcherHeight}px;\n  cursor: pointer;\n  user-select: none;\n  transition: background 0.3s ease, background-image 0.3s ease;\n  border-radius: ${(props) => props.borderRadius}px;\n  flex: 0 0 auto;\n\n  &::before {\n    position: absolute;\n    top: ${({ switcherHeight, dotSize }) => (switcherHeight - dotSize) / 2}px;\n    left: ${({ switcherHeight, dotSize }) => (switcherHeight - dotSize) / 2}px;\n    display: block;\n    width: ${(props) => props.dotSize}px;\n    height: ${(props) => props.dotSize}px;\n    content: '';\n    transition: background 0.3s ease, left 0.3s ease;\n    transform: translateZ(0);\n    border-radius: 50%;\n  }\n`\n\nconst disabledStyles = `\n  cursor: not-allowed;\n  opacity: 0.7;\n\n  & ${Switcher} {\n    cursor: not-allowed;\n    box-shadow: none;\n\n    &::before {\n      box-shadow: none;\n    }\n  }\n\n  & ${Label} {\n    cursor: not-allowed;\n  }\n`\n\nconst checkedStyles = css<StyledSwitcherProps>`\n  & ${Switcher} {\n    &::before {\n      left: ${({ switcherWidth, switcherHeight, dotSize }) =>\n        switcherWidth - dotSize - (switcherHeight - dotSize) / 2}px;\n    }\n  }\n`\n\nconst baseStyles = css<StyledSwitcherProps>`\n  ${(props) => `\n    position: relative;\n    display: inline-flex;\n    flex-direction: row;\n    box-sizing: border-box;\n    height: ${props.switcherHeight}px;\n    line-height: ${props.switcherHeight}px;\n    vertical-align: middle;\n    justify-content: flex-start;\n    align-content: center;\n    align-items: center;\n    max-width: 100%;\n    color: inherit;\n  `}\n`\n\nconst defaultPresetStyle = css<StyledSwitcherProps>`\n  ${(props) => {\n    const color = props.color || 'atlantis'\n\n    return `\n      & ${Switcher} {\n        box-shadow: inset 0 2px 2px 0 rgba(0, 0, 0, 0.08);\n        background-color: #eaecf3;\n\n        &::before {\n          background-color: ${props.theme.colors.white};\n          box-shadow: ${props.disabled ? 'none' : '0 0 6px 0 rgba(0, 0, 0, 0.16)'};\n        }\n\n        ${\n          props.inactiveColor\n            ? `\n                background-image: linear-gradient(\n                  to right,\n                  ${tinycolor(getColor(props.inactiveColor, props)).lighten(10).toString()},\n                  ${getColor(props.inactiveColor, props)}\n                );\n              `\n            : ''\n        }\n\n        ${\n          props.checked\n            ? `\n                background-image: linear-gradient(\n                  to right,\n                  ${tinycolor(getColor(color, props)).lighten(10).toString()},\n                  ${getColor(color, props)}\n                );\n              `\n            : ''\n        }\n      }\n\n      & ${Input}:focus-visible + ${Switcher} {\n        outline: 1px solid ${getColor(color, props)};\n        outline-offset: 2px;\n      }\n    `\n  }}\n`\n\nconst brandPresetStyles = css<StyledSwitcherProps>`\n  ${(props) => `\n    & ${Switcher} {\n      background-color: ${\n        props.disabled\n          ? props.theme.colors[props.checked ? 'bg-disabled-active' : 'bg-disabled-small']\n          : props.theme.colors[props.checked ? 'bg-brand-primary-basic' : 'bg-onmain-tertiary']\n      };\n\n      &::before {\n        background-color: ${props.theme.colors['bg-oncolor-primary']};\n        box-shadow: ${props.disabled ? 'none' : '0px 2px 4px rgba(0, 0, 0, 0.08)'};\n      }\n\n      ${!props.checked && props.inactiveColor ? `background-color: ${getColor(props.inactiveColor, props)};` : ''}\n      ${props.checked && props.color ? `background-color: ${getColor(props.color, props)};` : ''}\n    }\n\n    & ${Input}:focus-visible + ${Switcher} {\n      outline: 1px solid ${props.color ? getColor(props.color, props) : props.theme.colors['bg-brand-primary-basic']};\n      outline-offset: 2px;\n    }\n  `}\n`\n\nexport const Root = styled.div.withConfig<StyledSwitcherProps>({\n  shouldForwardProp: (prop) => ['children', 'className', 'style'].includes(prop),\n})`\n  ${baseStyles}\n\n  ${(props) => (props.checked ? checkedStyles : '')}\n  ${(props) => (props.disabled ? disabledStyles : '')}\n  ${({ brandPresetUsed }) => (brandPresetUsed ? brandPresetStyles : defaultPresetStyle)}\n`\n"],"names":["Input","styled","input","withConfig","componentId","Label","label","Switcher","props","switcherWidth","switcherHeight","borderRadius","_ref","dotSize","_ref2","disabledStyles","concat","checkedStyles","css","_ref3","baseStyles","defaultPresetStyle","color","theme","colors","white","disabled","inactiveColor","tinycolor","getColor","lighten","toString","checked","brandPresetStyles","Root","div","shouldForwardProp","prop","includes","_ref4","brandPresetUsed"],"mappings":"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"}

package/components/Tab/constants.js.map

@@ -1 +1 @@
-{"version":3,"file":"constants.js","sources":["../../../../src/components/Tab/constants.ts"],"sourcesContent":["import type { Sizes } from 'shared/interfaces'\n\nexport const SIZES: Sizes = {\n  xxxl: {\n    height: 60,\n    fontSize: 20,\n  },\n  xxl: {\n    height: 56,\n    fontSize: 20,\n  },\n  xl: {\n    height: 52,\n    fontSize: 18,\n  },\n  l: {\n    height: 48,\n    fontSize: 18,\n  },\n  m: {\n    height: 44,\n    fontSize: 16,\n  },\n  s: {\n    height: 40,\n    fontSize: 16,\n  },\n  xs: {\n    height: 36,\n    fontSize: 14,\n  },\n  xxs: {\n    height: 32,\n    fontSize: 14,\n  },\n  xxxs: {\n    height: 28,\n    fontSize: 12,\n  },\n}\n\nexport const SIZES_DEFAULT: Sizes = {\n  xxxl: {},\n  xxl: {},\n  xl: {},\n  l: {},\n  m: {},\n  s: {},\n  xs: {},\n  xxs: {},\n  xxxs: {},\n}\n"],"names":["SIZES","xxxl","height","fontSize","xxl","xl","l","m","s","xs","xxs","xxxs","SIZES_DEFAULT"],"mappings":"AAEO,IAAMA,EAAe,CAC1BC,KAAM,CACJC,OAAQ,GACRC,SAAU,IAEZC,IAAK,CACHF,OAAQ,GACRC,SAAU,IAEZE,GAAI,CACFH,OAAQ,GACRC,SAAU,IAEZG,EAAG,CACDJ,OAAQ,GACRC,SAAU,IAEZI,EAAG,CACDL,OAAQ,GACRC,SAAU,IAEZK,EAAG,CACDN,OAAQ,GACRC,SAAU,IAEZM,GAAI,CACFP,OAAQ,GACRC,SAAU,IAEZO,IAAK,CACHR,OAAQ,GACRC,SAAU,IAEZQ,KAAM,CACJT,OAAQ,GACRC,SAAU,KAIP,IAAMS,EAAuB,CAClCX,KAAM,GACNG,IAAK,GACLC,GAAI,GACJC,EAAG,GACHC,EAAG,GACHC,EAAG,GACHC,GAAI,GACJC,IAAK,GACLC,KAAM"}
+{"version":3,"file":"constants.js","sources":["../../../../src/components/Tab/constants.ts"],"sourcesContent":["import type { Sizes } from 'shared/types'\n\nexport const SIZES: Sizes = {\n  xxxl: {\n    height: 60,\n    fontSize: 20,\n  },\n  xxl: {\n    height: 56,\n    fontSize: 20,\n  },\n  xl: {\n    height: 52,\n    fontSize: 18,\n  },\n  l: {\n    height: 48,\n    fontSize: 18,\n  },\n  m: {\n    height: 44,\n    fontSize: 16,\n  },\n  s: {\n    height: 40,\n    fontSize: 16,\n  },\n  xs: {\n    height: 36,\n    fontSize: 14,\n  },\n  xxs: {\n    height: 32,\n    fontSize: 14,\n  },\n  xxxs: {\n    height: 28,\n    fontSize: 12,\n  },\n}\n\nexport const SIZES_DEFAULT: Sizes = {\n  xxxl: {},\n  xxl: {},\n  xl: {},\n  l: {},\n  m: {},\n  s: {},\n  xs: {},\n  xxs: {},\n  xxxs: {},\n}\n"],"names":["SIZES","xxxl","height","fontSize","xxl","xl","l","m","s","xs","xxs","xxxs","SIZES_DEFAULT"],"mappings":"AAEO,IAAMA,EAAe,CAC1BC,KAAM,CACJC,OAAQ,GACRC,SAAU,IAEZC,IAAK,CACHF,OAAQ,GACRC,SAAU,IAEZE,GAAI,CACFH,OAAQ,GACRC,SAAU,IAEZG,EAAG,CACDJ,OAAQ,GACRC,SAAU,IAEZI,EAAG,CACDL,OAAQ,GACRC,SAAU,IAEZK,EAAG,CACDN,OAAQ,GACRC,SAAU,IAEZM,GAAI,CACFP,OAAQ,GACRC,SAAU,IAEZO,IAAK,CACHR,OAAQ,GACRC,SAAU,IAEZQ,KAAM,CACJT,OAAQ,GACRC,SAAU,KAIP,IAAMS,EAAuB,CAClCX,KAAM,GACNG,IAAK,GACLC,GAAI,GACJC,EAAG,GACHC,EAAG,GACHC,EAAG,GACHC,GAAI,GACJC,IAAK,GACLC,KAAM"}

package/components/Tab/style.js.map

@@ -1 +1 @@
-{"version":3,"file":"style.js","sources":["../../../../src/components/Tab/style.ts"],"sourcesContent":["import styled, { css } from 'styled-components'\nimport tinycolor from 'tinycolor2'\nimport type { ThemedStyledProps, DefaultTheme } from 'styled-components'\nimport { getColor } from 'mixins/color'\nimport { responsiveSize } from 'mixins/size'\nimport { responsiveMargin } from 'mixins/margin'\nimport { focus } from 'mixins/focus'\nimport type { CSSColor } from 'shared/interfaces'\nimport { createShouldForwardProp } from 'shared/utils/style'\nimport type { StyledTabProps, StyledTabEdgeProps, TabPalette } from './types'\nimport Arrow from './images/arrow.module.svg'\n\nconst shouldForwardTabProp = createShouldForwardProp(\n  (propKey) =>\n    ![\n      'active',\n      'compact',\n      'crispy',\n      'crispyCompact',\n      'tabTheme',\n      'left',\n      'right',\n      'rounded',\n      'outline',\n      'onColored',\n    ].includes(propKey)\n)\n\nconst DEFAULT_STYLES = {\n  default: css<StyledTabProps>`\n    ${(props) => `\n      font-size: 16px;\n      font-weight: bold;\n      padding-bottom: 12px;\n      color: ${props.active ? props.theme.colors.primary : props.theme.colors.mineShaft};\n      border-bottom: 2px solid ${props.active ? 'currentcolor' : 'transparent'};\n      &:hover {\n        color: ${props.theme.colors.primary};\n      }\n      &.active {\n        color: ${props.theme.colors.primary};\n        border-bottom-color: currentcolor;\n      }\n      & + & {\n        margin-left: 60px;\n      }\n    `}\n  `,\n  compact: css<StyledTabProps>`\n    ${(props) => `\n      font-size: 16px;\n      font-weight: normal;\n      padding-bottom: 10px;\n      color: ${props.active ? props.theme.colors.primary : props.theme.colors.mineShaft};\n      border-bottom: 2px solid ${props.active ? 'currentcolor' : 'transparent'};\n      &:hover {\n        color: ${props.theme.colors.primary};\n      }\n      &.active {\n        color: ${props.theme.colors.primary};\n        border-bottom-color: currentcolor;\n      }\n      & + & {\n        margin-left: 20px;\n      }\n    `}\n  `,\n  crispyCompact: css<StyledTabProps>`\n    ${(props) => `\n      font-size: 12px;\n      font-weight: bold;\n      padding-bottom: 6px;\n      text-transform: uppercase;\n      color: ${props.active ? props.theme.colors.primary : props.theme.colors.mineShaft};\n      border-bottom: 2px solid ${props.active ? 'currentcolor' : 'transparent'};\n      &:hover {\n        color: ${props.theme.colors.primary};\n      }\n      &.active {\n        color: ${props.theme.colors.primary};\n        border-bottom-color: currentcolor;\n      }\n      & + & {\n        margin-left: 18px;\n      }\n    `}\n  `,\n  crispy: css<StyledTabProps>`\n    ${(props) => `\n      font-size: 12px;\n      font-weight: bold;\n      padding-bottom: 14px;\n      text-transform: uppercase;\n      color: ${props.active ? props.theme.colors.primary : props.theme.colors.mineShaft};\n      border-bottom: 2px solid ${props.active ? 'currentcolor' : 'transparent'};\n      &:hover {\n        color: ${props.theme.colors.primary};\n      }\n      &.active {\n        color: ${props.theme.colors.primary};\n        border-bottom-color: currentcolor;\n      }\n      & + & {\n        margin-left: 32px;\n      }\n    `}\n  `,\n}\n\nexport const Content = styled.span`\n  position: relative;\n  z-index: 1;\n  display: flex;\n  align-items: center;\n  flex-grow: 1;\n  flex-shrink: 0;\n  height: 100%;\n  padding: 0 1em;\n  border: 1px solid transparent;\n`\n\nexport const Edge = styled(Arrow).withConfig({\n  shouldForwardProp: () => false,\n})<StyledTabEdgeProps>`\n  flex-shrink: 0;\n  height: 100%;\n  ${(props) => props.after && 'transform: rotate(180deg);'}\n`\n\nconst template = (palette: TabPalette) => `\n  &:hover > ${Content} {\n    color: ${palette.colorHover};\n    background-color: ${palette.backgroundColorHover};\n    border-color: ${palette.borderColorHover};\n  }\n  &:hover > ${Edge} {\n    color: ${palette.backgroundColorHover};\n    stroke: ${palette.borderColorHover};\n  }\n  & > ${Content},\n  &:active > ${Content} {\n    color: ${palette.color};\n    background-color: ${palette.backgroundColor};\n    border-color: ${palette.borderColor};\n  }\n  & > ${Edge},\n  &:active > ${Edge} {\n    color: ${palette.backgroundColor};\n    stroke: ${palette.borderColor};\n  }\n  &:disabled > ${Content} {\n    color: ${palette.colorDisabled};\n    background-color: ${palette.backgroundColorDisabled};\n    border-color: ${palette.borderColorDisabled};\n  }\n  &:disabled > ${Edge} {\n    color: ${palette.backgroundColorDisabled};\n    stroke: ${palette.borderColorDisabled};\n  }\n`\n\nconst COLOR_SCHEMA = {\n  default: {\n    filled: css<StyledTabProps>`\n      ${(props) =>\n        template({\n          color: props.active\n            ? props.theme.colors['content-oncolor-primary']\n            : props.theme.colors['content-onmain-primary'],\n          backgroundColor: props.active\n            ? props.theme.colors['bg-brand-primary-500']\n            : props.theme.colors['bg-onmain-tertiary'],\n          borderColor: props.active\n            ? props.theme.colors['bg-brand-primary-500']\n            : props.theme.colors['bg-onmain-tertiary'],\n          colorHover: props.active\n            ? props.theme.colors['content-oncolor-primary']\n            : props.theme.colors['content-onmain-primary'],\n          backgroundColorHover: props.active\n            ? props.theme.colors['bg-brand-primary-500']\n            : (tinycolor(props.theme.colors['bg-onmain-tertiary']).darken(6).toString() as CSSColor),\n          borderColorHover: props.active\n            ? props.theme.colors['bg-brand-primary-500']\n            : (tinycolor(props.theme.colors['bg-onmain-tertiary']).darken(6).toString() as CSSColor),\n          colorDisabled: props.theme.colors['content-disabled'],\n          backgroundColorDisabled: props.theme.colors['bg-disabled-large'],\n          borderColorDisabled: props.theme.colors['bg-disabled-large'],\n          ...props.palette,\n        })}\n    `,\n    outline: css<StyledTabProps>`\n      ${(props) => {\n        return template({\n          color: props.active\n            ? props.theme.colors['content-oncolor-primary']\n            : props.theme.colors['content-onmain-primary'],\n          backgroundColor: props.active\n            ? props.theme.colors['bg-brand-primary-500']\n            : props.theme.colors['bg-onmain-primary'],\n          borderColor: props.active\n            ? props.theme.colors['bg-brand-primary-500']\n            : props.theme.colors['border-onmain-default-large'],\n          colorHover: props.active\n            ? props.theme.colors['content-oncolor-primary']\n            : props.theme.colors['content-onmain-primary'],\n          backgroundColorHover: props.active\n            ? props.theme.colors['bg-brand-primary-500']\n            : props.theme.colors['bg-onmain-tertiary'],\n          borderColorHover: props.active\n            ? props.theme.colors['bg-brand-primary-500']\n            : props.theme.colors['border-onmain-default-large'],\n          colorDisabled: props.theme.colors['content-disabled'],\n          backgroundColorDisabled: props.theme.colors['bg-disabled-large'],\n          borderColorDisabled: props.theme.colors['bg-disabled-large'],\n          ...props.palette,\n        })\n      }}\n    `,\n  },\n  onColored: {\n    filled: css<StyledTabProps>`\n      ${(props) =>\n        template({\n          color: props.active\n            ? props.theme.colors['content-brand-primary']\n            : props.theme.colors['content-oncolor-primary'],\n          backgroundColor: props.active\n            ? props.theme.colors['bg-onmain-primary']\n            : (tinycolor(props.theme.colors['bg-brand-primary-500']).lighten(10).toString() as CSSColor),\n          borderColor: props.active\n            ? props.theme.colors['bg-onmain-primary']\n            : (tinycolor(props.theme.colors['bg-brand-primary-500']).lighten(10).toString() as CSSColor),\n          colorHover: props.active\n            ? props.theme.colors['content-brand-primary']\n            : props.theme.colors['content-oncolor-primary'],\n          backgroundColorHover: props.active\n            ? props.theme.colors['bg-onmain-primary']\n            : (tinycolor(props.theme.colors['bg-brand-primary-500']).lighten(5).toString() as CSSColor),\n          borderColorHover: props.active\n            ? props.theme.colors['bg-onmain-primary']\n            : (tinycolor(props.theme.colors['bg-brand-primary-500']).lighten(5).toString() as CSSColor),\n          colorDisabled: props.theme.colors['content-disabled'],\n          backgroundColorDisabled: props.theme.colors['bg-disabled-small'],\n          borderColorDisabled: props.theme.colors['bg-disabled-small'],\n          ...props.palette,\n        })}\n    `,\n    outline: css<StyledTabProps>`\n      ${(props) =>\n        template({\n          color: props.active\n            ? props.theme.colors['content-brand-primary']\n            : props.theme.colors['content-oncolor-primary'],\n          backgroundColor: props.active\n            ? props.theme.colors['bg-onmain-primary']\n            : props.theme.colors['bg-brand-primary-500'],\n          borderColor: props.theme.colors['bg-onmain-primary'],\n          colorHover: props.active\n            ? props.theme.colors['content-brand-primary']\n            : props.theme.colors['content-oncolor-primary'],\n          backgroundColorHover: props.active\n            ? props.theme.colors['bg-onmain-primary']\n            : (tinycolor(props.theme.colors['bg-brand-primary-500']).darken(3).toString() as CSSColor),\n          borderColorHover: props.theme.colors['bg-onmain-primary'],\n          colorDisabled: props.theme.colors['content-disabled'],\n          backgroundColorDisabled: props.theme.colors['bg-disabled-small'],\n          borderColorDisabled: props.theme.colors['bg-disabled-small'],\n          ...props.palette,\n        })}\n    `,\n  },\n}\n\nconst tabStyles = (props: ThemedStyledProps<StyledTabProps, DefaultTheme>) => {\n  if (props.preset === 'brand') {\n    const schema = props.onColored ? COLOR_SCHEMA.onColored : COLOR_SCHEMA.default\n    return props.outline ? schema.outline : schema.filled\n  }\n\n  if (props.compact || props.tabTheme === 'compact') return DEFAULT_STYLES.compact\n  if (props.crispyCompact || props.tabTheme === 'crispyCompact') return DEFAULT_STYLES.crispyCompact\n  if (props.crispy || props.tabTheme === 'crispy') return DEFAULT_STYLES.crispy\n\n  return DEFAULT_STYLES.default\n}\n\nexport const Root = styled.button\n  .withConfig<StyledTabProps>({\n    shouldForwardProp: shouldForwardTabProp,\n  })\n  .attrs(<Required<Pick<StyledTabProps, 'dynamicSizeDeclaration'>>>{\n    dynamicSizeDeclaration: (size, cssProperty, cssUnit) => {\n      return {\n        height: '2.8em',\n        [cssProperty]: typeof size === 'string' ? size : `${size}${cssUnit}`,\n      }\n    },\n  })`\n  ${(props) => {\n    const radius = props.rounded ? 8 : 0\n    const leftRadius = props.left ? 0 : radius\n    const rightRadius = props.right ? 0 : radius\n\n    return `\n      display: ${props.preset === 'brand' ? 'inline-flex' : 'inline-block'};\n      cursor: ${props.cursor ?? 'pointer'};\n      isolation: isolate;\n      flex-shrink: 0;\n      appearance: none;\n      padding: 0;\n      border: none;\n      background-color: transparent;\n      text-decoration: none;\n      width: max-content;\n      &,\n      & > ${Content}, \n      & > ${Edge} {\n        box-sizing: border-box;\n        transition-property: color, background-color;\n        transition-duration: 150ms;\n        transition-timing-function: ease-in;\n      }\n      & > ${Content} {\n        border-radius: ${leftRadius}px ${rightRadius}px ${rightRadius}px ${leftRadius}px;\n        border-left-style: ${props.left ? 'none' : 'solid'};\n        border-right-style: ${props.right ? 'none' : 'solid'};\n        margin-left: ${props.left ? -2 : 0}px;\n        margin-right: ${props.right ? -2 : 0}px;\n      }\n    `\n  }}\n\n  ${tabStyles}\n  ${focus}\n  ${responsiveSize}\n  ${responsiveMargin}\n\n  ${(props) => props.color && `color: ${getColor(props.color, props)};`}\n  ${(props) => props.borderColor && `border-color: ${getColor(props.borderColor, props)};`}\n`\n"],"names":["shouldForwardTabProp","createShouldForwardProp","propKey","includes","DEFAULT_STYLES","default","css","props","active","theme","colors","primary","mineShaft","concat","compact","crispyCompact","crispy","Content","styled","span","withConfig","componentId","Edge","Arrow","shouldForwardProp","after","template","palette","colorHover","backgroundColorHover","borderColorHover","color","backgroundColor","borderColor","colorDisabled","backgroundColorDisabled","borderColorDisabled","COLOR_SCHEMA","filled","_objectSpread","tinycolor","darken","toString","outline","onColored","lighten","Root","button","attrs","dynamicSizeDeclaration","size","cssProperty","cssUnit","height","_props$cursor","radius","rounded","leftRadius","left","rightRadius","right","preset","cursor","schema","tabTheme","focus","responsiveSize","responsiveMargin","getColor"],"mappings":"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"}
+{"version":3,"file":"style.js","sources":["../../../../src/components/Tab/style.ts"],"sourcesContent":["import styled, { css } from 'styled-components'\nimport tinycolor from 'tinycolor2'\nimport type { ThemedStyledProps, DefaultTheme } from 'styled-components'\nimport { getColor } from 'mixins/color'\nimport { responsiveSize } from 'mixins/size'\nimport { responsiveMargin } from 'mixins/margin'\nimport { focus } from 'mixins/focus'\nimport type { CSSColor } from 'shared/types'\nimport { createShouldForwardProp } from 'shared/utils/style'\nimport type { StyledTabProps, StyledTabEdgeProps, TabPalette } from './types'\nimport Arrow from './images/arrow.module.svg'\n\nconst shouldForwardTabProp = createShouldForwardProp(\n  (propKey) =>\n    ![\n      'active',\n      'compact',\n      'crispy',\n      'crispyCompact',\n      'tabTheme',\n      'left',\n      'right',\n      'rounded',\n      'outline',\n      'onColored',\n    ].includes(propKey)\n)\n\nconst DEFAULT_STYLES = {\n  default: css<StyledTabProps>`\n    ${(props) => `\n      font-size: 16px;\n      font-weight: bold;\n      padding-bottom: 12px;\n      color: ${props.active ? props.theme.colors.primary : props.theme.colors.mineShaft};\n      border-bottom: 2px solid ${props.active ? 'currentcolor' : 'transparent'};\n      &:hover {\n        color: ${props.theme.colors.primary};\n      }\n      &.active {\n        color: ${props.theme.colors.primary};\n        border-bottom-color: currentcolor;\n      }\n      & + & {\n        margin-left: 60px;\n      }\n    `}\n  `,\n  compact: css<StyledTabProps>`\n    ${(props) => `\n      font-size: 16px;\n      font-weight: normal;\n      padding-bottom: 10px;\n      color: ${props.active ? props.theme.colors.primary : props.theme.colors.mineShaft};\n      border-bottom: 2px solid ${props.active ? 'currentcolor' : 'transparent'};\n      &:hover {\n        color: ${props.theme.colors.primary};\n      }\n      &.active {\n        color: ${props.theme.colors.primary};\n        border-bottom-color: currentcolor;\n      }\n      & + & {\n        margin-left: 20px;\n      }\n    `}\n  `,\n  crispyCompact: css<StyledTabProps>`\n    ${(props) => `\n      font-size: 12px;\n      font-weight: bold;\n      padding-bottom: 6px;\n      text-transform: uppercase;\n      color: ${props.active ? props.theme.colors.primary : props.theme.colors.mineShaft};\n      border-bottom: 2px solid ${props.active ? 'currentcolor' : 'transparent'};\n      &:hover {\n        color: ${props.theme.colors.primary};\n      }\n      &.active {\n        color: ${props.theme.colors.primary};\n        border-bottom-color: currentcolor;\n      }\n      & + & {\n        margin-left: 18px;\n      }\n    `}\n  `,\n  crispy: css<StyledTabProps>`\n    ${(props) => `\n      font-size: 12px;\n      font-weight: bold;\n      padding-bottom: 14px;\n      text-transform: uppercase;\n      color: ${props.active ? props.theme.colors.primary : props.theme.colors.mineShaft};\n      border-bottom: 2px solid ${props.active ? 'currentcolor' : 'transparent'};\n      &:hover {\n        color: ${props.theme.colors.primary};\n      }\n      &.active {\n        color: ${props.theme.colors.primary};\n        border-bottom-color: currentcolor;\n      }\n      & + & {\n        margin-left: 32px;\n      }\n    `}\n  `,\n}\n\nexport const Content = styled.span`\n  position: relative;\n  z-index: 1;\n  display: flex;\n  align-items: center;\n  flex-grow: 1;\n  flex-shrink: 0;\n  height: 100%;\n  padding: 0 1em;\n  border: 1px solid transparent;\n`\n\nexport const Edge = styled(Arrow).withConfig({\n  shouldForwardProp: () => false,\n})<StyledTabEdgeProps>`\n  flex-shrink: 0;\n  height: 100%;\n  ${(props) => props.after && 'transform: rotate(180deg);'}\n`\n\nconst template = (palette: TabPalette) => `\n  &:hover > ${Content} {\n    color: ${palette.colorHover};\n    background-color: ${palette.backgroundColorHover};\n    border-color: ${palette.borderColorHover};\n  }\n  &:hover > ${Edge} {\n    color: ${palette.backgroundColorHover};\n    stroke: ${palette.borderColorHover};\n  }\n  & > ${Content},\n  &:active > ${Content} {\n    color: ${palette.color};\n    background-color: ${palette.backgroundColor};\n    border-color: ${palette.borderColor};\n  }\n  & > ${Edge},\n  &:active > ${Edge} {\n    color: ${palette.backgroundColor};\n    stroke: ${palette.borderColor};\n  }\n  &:disabled > ${Content} {\n    color: ${palette.colorDisabled};\n    background-color: ${palette.backgroundColorDisabled};\n    border-color: ${palette.borderColorDisabled};\n  }\n  &:disabled > ${Edge} {\n    color: ${palette.backgroundColorDisabled};\n    stroke: ${palette.borderColorDisabled};\n  }\n`\n\nconst COLOR_SCHEMA = {\n  default: {\n    filled: css<StyledTabProps>`\n      ${(props) =>\n        template({\n          color: props.active\n            ? props.theme.colors['content-oncolor-primary']\n            : props.theme.colors['content-onmain-primary'],\n          backgroundColor: props.active\n            ? props.theme.colors['bg-brand-primary-500']\n            : props.theme.colors['bg-onmain-tertiary'],\n          borderColor: props.active\n            ? props.theme.colors['bg-brand-primary-500']\n            : props.theme.colors['bg-onmain-tertiary'],\n          colorHover: props.active\n            ? props.theme.colors['content-oncolor-primary']\n            : props.theme.colors['content-onmain-primary'],\n          backgroundColorHover: props.active\n            ? props.theme.colors['bg-brand-primary-500']\n            : (tinycolor(props.theme.colors['bg-onmain-tertiary']).darken(6).toString() as CSSColor),\n          borderColorHover: props.active\n            ? props.theme.colors['bg-brand-primary-500']\n            : (tinycolor(props.theme.colors['bg-onmain-tertiary']).darken(6).toString() as CSSColor),\n          colorDisabled: props.theme.colors['content-disabled'],\n          backgroundColorDisabled: props.theme.colors['bg-disabled-large'],\n          borderColorDisabled: props.theme.colors['bg-disabled-large'],\n          ...props.palette,\n        })}\n    `,\n    outline: css<StyledTabProps>`\n      ${(props) => {\n        return template({\n          color: props.active\n            ? props.theme.colors['content-oncolor-primary']\n            : props.theme.colors['content-onmain-primary'],\n          backgroundColor: props.active\n            ? props.theme.colors['bg-brand-primary-500']\n            : props.theme.colors['bg-onmain-primary'],\n          borderColor: props.active\n            ? props.theme.colors['bg-brand-primary-500']\n            : props.theme.colors['border-onmain-default-large'],\n          colorHover: props.active\n            ? props.theme.colors['content-oncolor-primary']\n            : props.theme.colors['content-onmain-primary'],\n          backgroundColorHover: props.active\n            ? props.theme.colors['bg-brand-primary-500']\n            : props.theme.colors['bg-onmain-tertiary'],\n          borderColorHover: props.active\n            ? props.theme.colors['bg-brand-primary-500']\n            : props.theme.colors['border-onmain-default-large'],\n          colorDisabled: props.theme.colors['content-disabled'],\n          backgroundColorDisabled: props.theme.colors['bg-disabled-large'],\n          borderColorDisabled: props.theme.colors['bg-disabled-large'],\n          ...props.palette,\n        })\n      }}\n    `,\n  },\n  onColored: {\n    filled: css<StyledTabProps>`\n      ${(props) =>\n        template({\n          color: props.active\n            ? props.theme.colors['content-brand-primary']\n            : props.theme.colors['content-oncolor-primary'],\n          backgroundColor: props.active\n            ? props.theme.colors['bg-onmain-primary']\n            : (tinycolor(props.theme.colors['bg-brand-primary-500']).lighten(10).toString() as CSSColor),\n          borderColor: props.active\n            ? props.theme.colors['bg-onmain-primary']\n            : (tinycolor(props.theme.colors['bg-brand-primary-500']).lighten(10).toString() as CSSColor),\n          colorHover: props.active\n            ? props.theme.colors['content-brand-primary']\n            : props.theme.colors['content-oncolor-primary'],\n          backgroundColorHover: props.active\n            ? props.theme.colors['bg-onmain-primary']\n            : (tinycolor(props.theme.colors['bg-brand-primary-500']).lighten(5).toString() as CSSColor),\n          borderColorHover: props.active\n            ? props.theme.colors['bg-onmain-primary']\n            : (tinycolor(props.theme.colors['bg-brand-primary-500']).lighten(5).toString() as CSSColor),\n          colorDisabled: props.theme.colors['content-disabled'],\n          backgroundColorDisabled: props.theme.colors['bg-disabled-small'],\n          borderColorDisabled: props.theme.colors['bg-disabled-small'],\n          ...props.palette,\n        })}\n    `,\n    outline: css<StyledTabProps>`\n      ${(props) =>\n        template({\n          color: props.active\n            ? props.theme.colors['content-brand-primary']\n            : props.theme.colors['content-oncolor-primary'],\n          backgroundColor: props.active\n            ? props.theme.colors['bg-onmain-primary']\n            : props.theme.colors['bg-brand-primary-500'],\n          borderColor: props.theme.colors['bg-onmain-primary'],\n          colorHover: props.active\n            ? props.theme.colors['content-brand-primary']\n            : props.theme.colors['content-oncolor-primary'],\n          backgroundColorHover: props.active\n            ? props.theme.colors['bg-onmain-primary']\n            : (tinycolor(props.theme.colors['bg-brand-primary-500']).darken(3).toString() as CSSColor),\n          borderColorHover: props.theme.colors['bg-onmain-primary'],\n          colorDisabled: props.theme.colors['content-disabled'],\n          backgroundColorDisabled: props.theme.colors['bg-disabled-small'],\n          borderColorDisabled: props.theme.colors['bg-disabled-small'],\n          ...props.palette,\n        })}\n    `,\n  },\n}\n\nconst tabStyles = (props: ThemedStyledProps<StyledTabProps, DefaultTheme>) => {\n  if (props.preset === 'brand') {\n    const schema = props.onColored ? COLOR_SCHEMA.onColored : COLOR_SCHEMA.default\n    return props.outline ? schema.outline : schema.filled\n  }\n\n  if (props.compact || props.tabTheme === 'compact') return DEFAULT_STYLES.compact\n  if (props.crispyCompact || props.tabTheme === 'crispyCompact') return DEFAULT_STYLES.crispyCompact\n  if (props.crispy || props.tabTheme === 'crispy') return DEFAULT_STYLES.crispy\n\n  return DEFAULT_STYLES.default\n}\n\nexport const Root = styled.button\n  .withConfig<StyledTabProps>({\n    shouldForwardProp: shouldForwardTabProp,\n  })\n  .attrs(<Required<Pick<StyledTabProps, 'dynamicSizeDeclaration'>>>{\n    dynamicSizeDeclaration: (size, cssProperty, cssUnit) => {\n      return {\n        height: '2.8em',\n        [cssProperty]: typeof size === 'string' ? size : `${size}${cssUnit}`,\n      }\n    },\n  })`\n  ${(props) => {\n    const radius = props.rounded ? 8 : 0\n    const leftRadius = props.left ? 0 : radius\n    const rightRadius = props.right ? 0 : radius\n\n    return `\n      display: ${props.preset === 'brand' ? 'inline-flex' : 'inline-block'};\n      cursor: ${props.cursor ?? 'pointer'};\n      isolation: isolate;\n      flex-shrink: 0;\n      appearance: none;\n      padding: 0;\n      border: none;\n      background-color: transparent;\n      text-decoration: none;\n      width: max-content;\n      &,\n      & > ${Content}, \n      & > ${Edge} {\n        box-sizing: border-box;\n        transition-property: color, background-color;\n        transition-duration: 150ms;\n        transition-timing-function: ease-in;\n      }\n      & > ${Content} {\n        border-radius: ${leftRadius}px ${rightRadius}px ${rightRadius}px ${leftRadius}px;\n        border-left-style: ${props.left ? 'none' : 'solid'};\n        border-right-style: ${props.right ? 'none' : 'solid'};\n        margin-left: ${props.left ? -2 : 0}px;\n        margin-right: ${props.right ? -2 : 0}px;\n      }\n    `\n  }}\n\n  ${tabStyles}\n  ${focus}\n  ${responsiveSize}\n  ${responsiveMargin}\n\n  ${(props) => props.color && `color: ${getColor(props.color, props)};`}\n  ${(props) => props.borderColor && `border-color: ${getColor(props.borderColor, props)};`}\n`\n"],"names":["shouldForwardTabProp","createShouldForwardProp","propKey","includes","DEFAULT_STYLES","default","css","props","active","theme","colors","primary","mineShaft","concat","compact","crispyCompact","crispy","Content","styled","span","withConfig","componentId","Edge","Arrow","shouldForwardProp","after","template","palette","colorHover","backgroundColorHover","borderColorHover","color","backgroundColor","borderColor","colorDisabled","backgroundColorDisabled","borderColorDisabled","COLOR_SCHEMA","filled","_objectSpread","tinycolor","darken","toString","outline","onColored","lighten","Root","button","attrs","dynamicSizeDeclaration","size","cssProperty","cssUnit","height","_props$cursor","radius","rounded","leftRadius","left","rightRadius","right","preset","cursor","schema","tabTheme","focus","responsiveSize","responsiveMargin","getColor"],"mappings":"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"}

package/components/Text/constants.js.map

@@ -1 +1 @@
-{"version":3,"file":"constants.js","sources":["../../../../src/components/Text/constants.ts"],"sourcesContent":["import type { Sizes } from 'shared/interfaces'\nimport type { TypographyAppearance, TextProps } from './types'\n\nexport const APPEARANCE: Record<TypographyAppearance, Partial<Omit<TextProps, 'size' | 'appearance'>>> = {\n  display: {\n    lineHeight: 1,\n    weight: 800,\n    fontStyle: 'normal',\n  },\n  heading: {\n    lineHeight: 1.1,\n    weight: 800,\n    fontStyle: 'normal',\n  },\n  subheading: {\n    lineHeight: 1.1,\n    weight: 700,\n    fontStyle: 'normal',\n  },\n  'subheading-compact': {\n    lineHeight: 1.3,\n    weight: 800,\n    fontStyle: 'normal',\n  },\n  body: {\n    lineHeight: 1.3,\n    weight: 400,\n    fontStyle: 'normal',\n  },\n  caption: {\n    lineHeight: 1.2,\n    weight: 400,\n    fontStyle: 'normal',\n  },\n}\n\nexport const SIZES: Record<TypographyAppearance, Sizes> = {\n  display: {\n    xxxl: {\n      fontSize: 84,\n    },\n    xxl: {\n      fontSize: 76,\n    },\n    xl: {\n      fontSize: 68,\n    },\n    l: {\n      fontSize: 60,\n    },\n    m: {\n      fontSize: 52,\n    },\n    s: {\n      fontSize: 44,\n    },\n    xs: {\n      fontSize: 36,\n    },\n    xxs: {\n      fontSize: 28,\n    },\n    xxxs: {\n      fontSize: 20,\n    },\n  },\n  heading: {\n    xxxl: {\n      fontSize: 64,\n    },\n    xxl: {\n      fontSize: 56,\n    },\n    xl: {\n      fontSize: 48,\n    },\n    l: {\n      fontSize: 40,\n    },\n    m: {\n      fontSize: 36,\n    },\n    s: {\n      fontSize: 32,\n    },\n    xs: {\n      fontSize: 28,\n    },\n    xxs: {\n      fontSize: 24,\n    },\n    xxxs: {\n      fontSize: 20,\n    },\n  },\n  subheading: {\n    xxxl: {\n      fontSize: 52,\n    },\n    xxl: {\n      fontSize: 46,\n    },\n    xl: {\n      fontSize: 40,\n    },\n    l: {\n      fontSize: 34,\n    },\n    m: {\n      fontSize: 28,\n    },\n    s: {\n      fontSize: 24,\n    },\n    xs: {\n      fontSize: 20,\n    },\n    xxs: {\n      fontSize: 16,\n    },\n    xxxs: {\n      fontSize: 12,\n    },\n  },\n  'subheading-compact': {\n    xxxl: {\n      fontSize: 36,\n    },\n    xxl: {\n      fontSize: 32,\n    },\n    xl: {\n      fontSize: 28,\n    },\n    l: {\n      fontSize: 24,\n    },\n    m: {\n      fontSize: 20,\n    },\n    s: {\n      fontSize: 18,\n    },\n    xs: {\n      fontSize: 16,\n    },\n    xxs: {\n      fontSize: 14,\n    },\n    xxxs: {\n      fontSize: 12,\n    },\n  },\n  body: {\n    xxxl: {\n      fontSize: 32,\n    },\n    xxl: {\n      fontSize: 28,\n    },\n    xl: {\n      fontSize: 24,\n    },\n    l: {\n      fontSize: 20,\n    },\n    m: {\n      fontSize: 18,\n    },\n    s: {\n      fontSize: 16,\n    },\n    xs: {\n      fontSize: 14,\n    },\n    xxs: {\n      fontSize: 12,\n    },\n    xxxs: {\n      fontSize: 10,\n    },\n  },\n  caption: {\n    xxxl: {\n      fontSize: 32,\n    },\n    xxl: {\n      fontSize: 28,\n    },\n    xl: {\n      fontSize: 24,\n    },\n    l: {\n      fontSize: 20,\n    },\n    m: {\n      fontSize: 18,\n    },\n    s: {\n      fontSize: 16,\n    },\n    xs: {\n      fontSize: 14,\n    },\n    xxs: {\n      fontSize: 12,\n    },\n    xxxs: {\n      fontSize: 10,\n    },\n  },\n}\n\nexport const SIZES_DEFAULT: Sizes = {\n  xxxl: {\n    fontSize: 24,\n  },\n  xxl: {\n    fontSize: 22,\n  },\n  xl: {\n    fontSize: 20,\n  },\n  l: {\n    fontSize: 18,\n  },\n  m: {\n    fontSize: 16,\n  },\n  s: {\n    fontSize: 14,\n  },\n  xs: {\n    fontSize: 12,\n  },\n  xxs: {\n    fontSize: 10,\n  },\n  xxxs: {\n    fontSize: 8,\n  },\n}\n"],"names":["APPEARANCE","display","lineHeight","weight","fontStyle","heading","subheading","body","caption","SIZES","xxxl","fontSize","xxl","xl","l","m","s","xs","xxs","xxxs","SIZES_DEFAULT"],"mappings":"AAGO,IAAMA,EAA4F,CACvGC,QAAS,CACPC,WAAY,EACZC,OAAQ,IACRC,UAAW,UAEbC,QAAS,CACPH,WAAY,IACZC,OAAQ,IACRC,UAAW,UAEbE,WAAY,CACVJ,WAAY,IACZC,OAAQ,IACRC,UAAW,UAEb,qBAAsB,CACpBF,WAAY,IACZC,OAAQ,IACRC,UAAW,UAEbG,KAAM,CACJL,WAAY,IACZC,OAAQ,IACRC,UAAW,UAEbI,QAAS,CACPN,WAAY,IACZC,OAAQ,IACRC,UAAW,WAIR,IAAMK,EAA6C,CACxDR,QAAS,CACPS,KAAM,CACJC,SAAU,IAEZC,IAAK,CACHD,SAAU,IAEZE,GAAI,CACFF,SAAU,IAEZG,EAAG,CACDH,SAAU,IAEZI,EAAG,CACDJ,SAAU,IAEZK,EAAG,CACDL,SAAU,IAEZM,GAAI,CACFN,SAAU,IAEZO,IAAK,CACHP,SAAU,IAEZQ,KAAM,CACJR,SAAU,KAGdN,QAAS,CACPK,KAAM,CACJC,SAAU,IAEZC,IAAK,CACHD,SAAU,IAEZE,GAAI,CACFF,SAAU,IAEZG,EAAG,CACDH,SAAU,IAEZI,EAAG,CACDJ,SAAU,IAEZK,EAAG,CACDL,SAAU,IAEZM,GAAI,CACFN,SAAU,IAEZO,IAAK,CACHP,SAAU,IAEZQ,KAAM,CACJR,SAAU,KAGdL,WAAY,CACVI,KAAM,CACJC,SAAU,IAEZC,IAAK,CACHD,SAAU,IAEZE,GAAI,CACFF,SAAU,IAEZG,EAAG,CACDH,SAAU,IAEZI,EAAG,CACDJ,SAAU,IAEZK,EAAG,CACDL,SAAU,IAEZM,GAAI,CACFN,SAAU,IAEZO,IAAK,CACHP,SAAU,IAEZQ,KAAM,CACJR,SAAU,KAGd,qBAAsB,CACpBD,KAAM,CACJC,SAAU,IAEZC,IAAK,CACHD,SAAU,IAEZE,GAAI,CACFF,SAAU,IAEZG,EAAG,CACDH,SAAU,IAEZI,EAAG,CACDJ,SAAU,IAEZK,EAAG,CACDL,SAAU,IAEZM,GAAI,CACFN,SAAU,IAEZO,IAAK,CACHP,SAAU,IAEZQ,KAAM,CACJR,SAAU,KAGdJ,KAAM,CACJG,KAAM,CACJC,SAAU,IAEZC,IAAK,CACHD,SAAU,IAEZE,GAAI,CACFF,SAAU,IAEZG,EAAG,CACDH,SAAU,IAEZI,EAAG,CACDJ,SAAU,IAEZK,EAAG,CACDL,SAAU,IAEZM,GAAI,CACFN,SAAU,IAEZO,IAAK,CACHP,SAAU,IAEZQ,KAAM,CACJR,SAAU,KAGdH,QAAS,CACPE,KAAM,CACJC,SAAU,IAEZC,IAAK,CACHD,SAAU,IAEZE,GAAI,CACFF,SAAU,IAEZG,EAAG,CACDH,SAAU,IAEZI,EAAG,CACDJ,SAAU,IAEZK,EAAG,CACDL,SAAU,IAEZM,GAAI,CACFN,SAAU,IAEZO,IAAK,CACHP,SAAU,IAEZQ,KAAM,CACJR,SAAU,MAKT,IAAMS,EAAuB,CAClCV,KAAM,CACJC,SAAU,IAEZC,IAAK,CACHD,SAAU,IAEZE,GAAI,CACFF,SAAU,IAEZG,EAAG,CACDH,SAAU,IAEZI,EAAG,CACDJ,SAAU,IAEZK,EAAG,CACDL,SAAU,IAEZM,GAAI,CACFN,SAAU,IAEZO,IAAK,CACHP,SAAU,IAEZQ,KAAM,CACJR,SAAU"}
+{"version":3,"file":"constants.js","sources":["../../../../src/components/Text/constants.ts"],"sourcesContent":["import type { Sizes } from 'shared/types'\nimport type { TypographyAppearance, TextProps } from './types'\n\nexport const APPEARANCE: Record<TypographyAppearance, Partial<Omit<TextProps, 'size' | 'appearance'>>> = {\n  display: {\n    lineHeight: 1,\n    weight: 800,\n    fontStyle: 'normal',\n  },\n  heading: {\n    lineHeight: 1.1,\n    weight: 800,\n    fontStyle: 'normal',\n  },\n  subheading: {\n    lineHeight: 1.1,\n    weight: 700,\n    fontStyle: 'normal',\n  },\n  'subheading-compact': {\n    lineHeight: 1.3,\n    weight: 800,\n    fontStyle: 'normal',\n  },\n  body: {\n    lineHeight: 1.3,\n    weight: 400,\n    fontStyle: 'normal',\n  },\n  caption: {\n    lineHeight: 1.2,\n    weight: 400,\n    fontStyle: 'normal',\n  },\n}\n\nexport const SIZES: Record<TypographyAppearance, Sizes> = {\n  display: {\n    xxxl: {\n      fontSize: 84,\n    },\n    xxl: {\n      fontSize: 76,\n    },\n    xl: {\n      fontSize: 68,\n    },\n    l: {\n      fontSize: 60,\n    },\n    m: {\n      fontSize: 52,\n    },\n    s: {\n      fontSize: 44,\n    },\n    xs: {\n      fontSize: 36,\n    },\n    xxs: {\n      fontSize: 28,\n    },\n    xxxs: {\n      fontSize: 20,\n    },\n  },\n  heading: {\n    xxxl: {\n      fontSize: 64,\n    },\n    xxl: {\n      fontSize: 56,\n    },\n    xl: {\n      fontSize: 48,\n    },\n    l: {\n      fontSize: 40,\n    },\n    m: {\n      fontSize: 36,\n    },\n    s: {\n      fontSize: 32,\n    },\n    xs: {\n      fontSize: 28,\n    },\n    xxs: {\n      fontSize: 24,\n    },\n    xxxs: {\n      fontSize: 20,\n    },\n  },\n  subheading: {\n    xxxl: {\n      fontSize: 52,\n    },\n    xxl: {\n      fontSize: 46,\n    },\n    xl: {\n      fontSize: 40,\n    },\n    l: {\n      fontSize: 34,\n    },\n    m: {\n      fontSize: 28,\n    },\n    s: {\n      fontSize: 24,\n    },\n    xs: {\n      fontSize: 20,\n    },\n    xxs: {\n      fontSize: 16,\n    },\n    xxxs: {\n      fontSize: 12,\n    },\n  },\n  'subheading-compact': {\n    xxxl: {\n      fontSize: 36,\n    },\n    xxl: {\n      fontSize: 32,\n    },\n    xl: {\n      fontSize: 28,\n    },\n    l: {\n      fontSize: 24,\n    },\n    m: {\n      fontSize: 20,\n    },\n    s: {\n      fontSize: 18,\n    },\n    xs: {\n      fontSize: 16,\n    },\n    xxs: {\n      fontSize: 14,\n    },\n    xxxs: {\n      fontSize: 12,\n    },\n  },\n  body: {\n    xxxl: {\n      fontSize: 32,\n    },\n    xxl: {\n      fontSize: 28,\n    },\n    xl: {\n      fontSize: 24,\n    },\n    l: {\n      fontSize: 20,\n    },\n    m: {\n      fontSize: 18,\n    },\n    s: {\n      fontSize: 16,\n    },\n    xs: {\n      fontSize: 14,\n    },\n    xxs: {\n      fontSize: 12,\n    },\n    xxxs: {\n      fontSize: 10,\n    },\n  },\n  caption: {\n    xxxl: {\n      fontSize: 32,\n    },\n    xxl: {\n      fontSize: 28,\n    },\n    xl: {\n      fontSize: 24,\n    },\n    l: {\n      fontSize: 20,\n    },\n    m: {\n      fontSize: 18,\n    },\n    s: {\n      fontSize: 16,\n    },\n    xs: {\n      fontSize: 14,\n    },\n    xxs: {\n      fontSize: 12,\n    },\n    xxxs: {\n      fontSize: 10,\n    },\n  },\n}\n\nexport const SIZES_DEFAULT: Sizes = {\n  xxxl: {\n    fontSize: 24,\n  },\n  xxl: {\n    fontSize: 22,\n  },\n  xl: {\n    fontSize: 20,\n  },\n  l: {\n    fontSize: 18,\n  },\n  m: {\n    fontSize: 16,\n  },\n  s: {\n    fontSize: 14,\n  },\n  xs: {\n    fontSize: 12,\n  },\n  xxs: {\n    fontSize: 10,\n  },\n  xxxs: {\n    fontSize: 8,\n  },\n}\n"],"names":["APPEARANCE","display","lineHeight","weight","fontStyle","heading","subheading","body","caption","SIZES","xxxl","fontSize","xxl","xl","l","m","s","xs","xxs","xxxs","SIZES_DEFAULT"],"mappings":"AAGO,IAAMA,EAA4F,CACvGC,QAAS,CACPC,WAAY,EACZC,OAAQ,IACRC,UAAW,UAEbC,QAAS,CACPH,WAAY,IACZC,OAAQ,IACRC,UAAW,UAEbE,WAAY,CACVJ,WAAY,IACZC,OAAQ,IACRC,UAAW,UAEb,qBAAsB,CACpBF,WAAY,IACZC,OAAQ,IACRC,UAAW,UAEbG,KAAM,CACJL,WAAY,IACZC,OAAQ,IACRC,UAAW,UAEbI,QAAS,CACPN,WAAY,IACZC,OAAQ,IACRC,UAAW,WAIR,IAAMK,EAA6C,CACxDR,QAAS,CACPS,KAAM,CACJC,SAAU,IAEZC,IAAK,CACHD,SAAU,IAEZE,GAAI,CACFF,SAAU,IAEZG,EAAG,CACDH,SAAU,IAEZI,EAAG,CACDJ,SAAU,IAEZK,EAAG,CACDL,SAAU,IAEZM,GAAI,CACFN,SAAU,IAEZO,IAAK,CACHP,SAAU,IAEZQ,KAAM,CACJR,SAAU,KAGdN,QAAS,CACPK,KAAM,CACJC,SAAU,IAEZC,IAAK,CACHD,SAAU,IAEZE,GAAI,CACFF,SAAU,IAEZG,EAAG,CACDH,SAAU,IAEZI,EAAG,CACDJ,SAAU,IAEZK,EAAG,CACDL,SAAU,IAEZM,GAAI,CACFN,SAAU,IAEZO,IAAK,CACHP,SAAU,IAEZQ,KAAM,CACJR,SAAU,KAGdL,WAAY,CACVI,KAAM,CACJC,SAAU,IAEZC,IAAK,CACHD,SAAU,IAEZE,GAAI,CACFF,SAAU,IAEZG,EAAG,CACDH,SAAU,IAEZI,EAAG,CACDJ,SAAU,IAEZK,EAAG,CACDL,SAAU,IAEZM,GAAI,CACFN,SAAU,IAEZO,IAAK,CACHP,SAAU,IAEZQ,KAAM,CACJR,SAAU,KAGd,qBAAsB,CACpBD,KAAM,CACJC,SAAU,IAEZC,IAAK,CACHD,SAAU,IAEZE,GAAI,CACFF,SAAU,IAEZG,EAAG,CACDH,SAAU,IAEZI,EAAG,CACDJ,SAAU,IAEZK,EAAG,CACDL,SAAU,IAEZM,GAAI,CACFN,SAAU,IAEZO,IAAK,CACHP,SAAU,IAEZQ,KAAM,CACJR,SAAU,KAGdJ,KAAM,CACJG,KAAM,CACJC,SAAU,IAEZC,IAAK,CACHD,SAAU,IAEZE,GAAI,CACFF,SAAU,IAEZG,EAAG,CACDH,SAAU,IAEZI,EAAG,CACDJ,SAAU,IAEZK,EAAG,CACDL,SAAU,IAEZM,GAAI,CACFN,SAAU,IAEZO,IAAK,CACHP,SAAU,IAEZQ,KAAM,CACJR,SAAU,KAGdH,QAAS,CACPE,KAAM,CACJC,SAAU,IAEZC,IAAK,CACHD,SAAU,IAEZE,GAAI,CACFF,SAAU,IAEZG,EAAG,CACDH,SAAU,IAEZI,EAAG,CACDJ,SAAU,IAEZK,EAAG,CACDL,SAAU,IAEZM,GAAI,CACFN,SAAU,IAEZO,IAAK,CACHP,SAAU,IAEZQ,KAAM,CACJR,SAAU,MAKT,IAAMS,EAAuB,CAClCV,KAAM,CACJC,SAAU,IAEZC,IAAK,CACHD,SAAU,IAEZE,GAAI,CACFF,SAAU,IAEZG,EAAG,CACDH,SAAU,IAEZI,EAAG,CACDJ,SAAU,IAEZK,EAAG,CACDL,SAAU,IAEZM,GAAI,CACFN,SAAU,IAEZO,IAAK,CACHP,SAAU,IAEZQ,KAAM,CACJR,SAAU"}

package/components/Text/style.js

@@ -1,2 +1,2 @@
-import n from'styled-components';import{display as o}from'../../mixins/display.js';import{color as t}from'../../mixins/color.js';import{responsiveSize as i}from'../../mixins/size.js';import{responsiveMargin as e}from'../../mixins/margin.js';import{createShouldForwardProp as r}from'../../shared/utils/style.js';var a={lighter:100,normal:400,bold:600,bolder:800};var l={l:1.5,m:1.3,s:1.15,xs:1};var s=r((n=>!['appearance','fontFamily','weight','fontStyle','transform','underlineLinks','textAlign','lineHeight','content','display','chars','quoted','showZeroMinorPart','separator'].includes(n)));var c=n.div.withConfig({shouldForwardProp:s}).attrs({dynamicSizeDeclaration:(n,o,t)=>({[o]:'string'==typeof n?n:"".concat(n).concat(t)})}).withConfig({componentId:"fox-ui__sc-s2fogy-0"})([""," "," "," "," ",""],(n=>{var o,t;return"\n    margin: 0;\n    ".concat(n.fontFamily?"font-family: ".concat(n.fontFamily,";"):'',"\n    ").concat(n.transform?"text-transform: ".concat(n.transform,";"):'',"\n    ").concat(n.weight?"font-weight: ".concat(null!==(o=a[n.weight])&&void 0!==o?o:n.weight,";"):'',"\n    ").concat(n.fontStyle?"font-style: ".concat(n.fontStyle,";"):'',"\n    ").concat(n.textAlign?"text-align: ".concat(n.textAlign,";"):'',"\n    ").concat(n.lineHeight?"line-height: ".concat(null!==(t=l[n.lineHeight])&&void 0!==t?t:n.lineHeight,";"):'',"\n    a {\n      text-decoration: ").concat(n.underlineLinks?'underline':'none',";\n      &:hover {\n        text-decoration: none;\n      }\n    }\n  ")}),i,e,(n=>n.display?o(n.display):null),(n=>t(n.color?n.color:n.theme.textColor)));export{c as Root};
+import n from'styled-components';import{display as o}from'../../mixins/display.js';import{color as t}from'../../mixins/color.js';import{responsiveSize as i}from'../../mixins/size.js';import{responsiveMargin as e}from'../../mixins/margin.js';import{createShouldForwardProp as r}from'../../shared/utils/style.js';var a={lighter:100,normal:400,bold:600,bolder:800};var l={l:1.5,m:1.3,s:1.15,xs:1};var c=r((n=>!['appearance','fontFamily','weight','fontStyle','transform','underlineLinks','textAlign','lineHeight','content','display','chars','quoted','showZeroMinorPart','separator','underline'].includes(n)));var s=n.div.withConfig({shouldForwardProp:c}).attrs({dynamicSizeDeclaration:(n,o,t)=>({[o]:'string'==typeof n?n:"".concat(n).concat(t)})}).withConfig({componentId:"fox-ui__sc-s2fogy-0"})([""," "," "," "," ",""],(n=>{var o,t;return"\n    margin: 0;\n    ".concat(n.fontFamily?"font-family: ".concat(n.fontFamily,";"):'',"\n    ").concat(n.transform?"text-transform: ".concat(n.transform,";"):'',"\n    ").concat(n.weight?"font-weight: ".concat(null!==(o=a[n.weight])&&void 0!==o?o:n.weight,";"):'',"\n    ").concat(n.fontStyle?"font-style: ".concat(n.fontStyle,";"):'',"\n    ").concat(n.textAlign?"text-align: ".concat(n.textAlign,";"):'',"\n    ").concat(n.lineHeight?"line-height: ".concat(null!==(t=l[n.lineHeight])&&void 0!==t?t:n.lineHeight,";"):'',"\n    ").concat(n.underline?"border-bottom: 1px ".concat('string'==typeof n.underline?n.underline:'solid',";"):'',"\n    a {\n      text-decoration: ").concat(n.underlineLinks?'underline':'none',";\n      &:hover {\n        text-decoration: none;\n      }\n    }\n  ")}),i,e,(n=>n.display?o(n.display):null),(n=>t(n.color?n.color:n.theme.textColor)));export{s as Root};
 //# sourceMappingURL=style.js.map

package/components/Text/style.js.map

@@ -1 +1 @@
-{"version":3,"file":"style.js","sources":["../../../../src/components/Text/style.ts"],"sourcesContent":["import styled from 'styled-components'\nimport { display } from 'mixins/display'\nimport { color } from 'mixins/color'\nimport { responsiveSize } from 'mixins/size'\nimport { responsiveMargin } from 'mixins/margin'\nimport { createShouldForwardProp } from 'shared/utils/style'\nimport type { Color } from 'shared/interfaces'\nimport type { StyledTextProps } from './types'\n\nconst WEIGHT_MAP = {\n  lighter: 100,\n  normal: 400,\n  bold: 600,\n  bolder: 800,\n}\n\nconst LINE_HEIGHT_MAP = {\n  l: 1.5,\n  m: 1.3,\n  s: 1.15,\n  xs: 1,\n}\n\nconst shouldForwardTextProp = createShouldForwardProp(\n  (propKey) =>\n    ![\n      'appearance',\n      'fontFamily',\n      'weight',\n      'fontStyle',\n      'transform',\n      'underlineLinks',\n      'textAlign',\n      'lineHeight',\n      'content',\n      'display',\n      'chars',\n      'quoted',\n      'showZeroMinorPart',\n      'separator',\n    ].includes(propKey)\n)\n\nexport const Root = styled.div\n  .withConfig<StyledTextProps>({\n    shouldForwardProp: shouldForwardTextProp,\n  })\n  .attrs(<Required<Pick<StyledTextProps, 'dynamicSizeDeclaration'>>>{\n    dynamicSizeDeclaration: (size, cssProperty, cssUnit) => {\n      return {\n        [cssProperty]: typeof size === 'string' ? size : `${size}${cssUnit}`,\n      }\n    },\n  })`\n  ${(props) => `\n    margin: 0;\n    ${props.fontFamily ? `font-family: ${props.fontFamily};` : ''}\n    ${props.transform ? `text-transform: ${props.transform};` : ''}\n    ${props.weight ? `font-weight: ${WEIGHT_MAP[props.weight] ?? props.weight};` : ''}\n    ${props.fontStyle ? `font-style: ${props.fontStyle};` : ''}\n    ${props.textAlign ? `text-align: ${props.textAlign};` : ''}\n    ${props.lineHeight ? `line-height: ${LINE_HEIGHT_MAP[props.lineHeight] ?? props.lineHeight};` : ''}\n    a {\n      text-decoration: ${props.underlineLinks ? 'underline' : 'none'};\n      &:hover {\n        text-decoration: none;\n      }\n    }\n  `}\n\n  ${responsiveSize}\n  ${responsiveMargin}\n\n  ${(props) => (props.display ? display(props.display) : null)}\n  ${(props) => (props.color ? color(props.color) : color(props.theme.textColor as Color))}\n`\n"],"names":["WEIGHT_MAP","lighter","normal","bold","bolder","LINE_HEIGHT_MAP","l","m","s","xs","shouldForwardTextProp","createShouldForwardProp","propKey","includes","Root","styled","div","withConfig","shouldForwardProp","attrs","dynamicSizeDeclaration","size","cssProperty","cssUnit","concat","componentId","props","_WEIGHT_MAP$props$wei","_LINE_HEIGHT_MAP$prop","fontFamily","transform","weight","fontStyle","textAlign","lineHeight","underlineLinks","responsiveSize","responsiveMargin","display","color","theme","textColor"],"mappings":"uTASA,IAAMA,EAAa,CACjBC,QAAS,IACTC,OAAQ,IACRC,KAAM,IACNC,OAAQ,KAGV,IAAMC,EAAkB,CACtBC,EAAG,IACHC,EAAG,IACHC,EAAG,KACHC,GAAI,GAGN,IAAMC,EAAwBC,GAC3BC,IACE,CACC,aACA,aACA,SACA,YACA,YACA,iBACA,YACA,aACA,UACA,UACA,QACA,SACA,oBACA,aACAC,SAASD,KAGR,IAAME,EAAOC,EAAOC,IACxBC,WAA4B,CAC3BC,kBAAmBR,IAEpBS,MAAiE,CAChEC,uBAAwB,CAACC,EAAMC,EAAaC,KAAAA,CAExCD,CAACA,GAA8B,iBAATD,EAAoBA,EAA3B,GAAAG,OAAqCH,GAArCG,OAA4CD,OAPlDN,WAAA,CAAAQ,YAAA,uBAAGV,CAAH,CAAA,GAAA,IAAA,IAAA,IAAA,IAAA,KAWZW,IAAD,IAAAC,EAAAC,EAAA,MAAA,yBAAAJ,OAEEE,EAAMG,WAA6BH,gBAAAA,OAAAA,EAAMG,WAAzC,KAAyD,GAF3D,UAAAL,OAGEE,EAAMI,oCAA+BJ,EAAMI,UAAe,KAAA,GAC1DJ,UAAAA,OAAAA,EAAMK,OAAN,gBAAAP,OAAA,QAAAG,EAA+B3B,EAAW0B,EAAMK,eAAhD,IAAAJ,EAAAA,EAA2DD,EAAMK,YAAY,GAJ/E,UAAAP,OAKEE,EAAMM,UAA2BN,eAAAA,OAAAA,EAAMM,UAAvC,KAAsD,GALxD,UAAAR,OAMEE,EAAMO,UAA2BP,eAAAA,OAAAA,EAAMO,UAAvC,KAAsD,GACtDP,UAAAA,OAAAA,EAAMQ,WAAN,gBAAAV,OAAA,QAAAI,EAAmCvB,EAAgBqB,EAAMQ,mBAAAA,IAAzDN,EAAAA,EAAwEF,EAAMQ,WAAgB,KAAA,gDAE3ER,EAAMS,eAAiB,YAAc,OAT1D,4EAgBAC,EACAC,GAECX,GAAWA,EAAMY,QAAUA,EAAQZ,EAAMY,SAAW,OACpDZ,GAAyBa,EAAdb,EAAMa,MAAcb,EAAMa,MAAeb,EAAMc,MAAMC"}
+{"version":3,"file":"style.js","sources":["../../../../src/components/Text/style.ts"],"sourcesContent":["import styled from 'styled-components'\nimport { display } from 'mixins/display'\nimport { color } from 'mixins/color'\nimport { responsiveSize } from 'mixins/size'\nimport { responsiveMargin } from 'mixins/margin'\nimport { createShouldForwardProp } from 'shared/utils/style'\nimport type { Color } from 'shared/types'\nimport type { StyledTextProps } from './types'\n\nconst WEIGHT_MAP = {\n  lighter: 100,\n  normal: 400,\n  bold: 600,\n  bolder: 800,\n}\n\nconst LINE_HEIGHT_MAP = {\n  l: 1.5,\n  m: 1.3,\n  s: 1.15,\n  xs: 1,\n}\n\nconst shouldForwardTextProp = createShouldForwardProp(\n  (propKey) =>\n    ![\n      'appearance',\n      'fontFamily',\n      'weight',\n      'fontStyle',\n      'transform',\n      'underlineLinks',\n      'textAlign',\n      'lineHeight',\n      'content',\n      'display',\n      'chars',\n      'quoted',\n      'showZeroMinorPart',\n      'separator',\n      'underline',\n    ].includes(propKey)\n)\n\nexport const Root = styled.div\n  .withConfig<StyledTextProps>({\n    shouldForwardProp: shouldForwardTextProp,\n  })\n  .attrs(<Required<Pick<StyledTextProps, 'dynamicSizeDeclaration'>>>{\n    dynamicSizeDeclaration: (size, cssProperty, cssUnit) => {\n      return {\n        [cssProperty]: typeof size === 'string' ? size : `${size}${cssUnit}`,\n      }\n    },\n  })`\n  ${(props) => `\n    margin: 0;\n    ${props.fontFamily ? `font-family: ${props.fontFamily};` : ''}\n    ${props.transform ? `text-transform: ${props.transform};` : ''}\n    ${props.weight ? `font-weight: ${WEIGHT_MAP[props.weight] ?? props.weight};` : ''}\n    ${props.fontStyle ? `font-style: ${props.fontStyle};` : ''}\n    ${props.textAlign ? `text-align: ${props.textAlign};` : ''}\n    ${props.lineHeight ? `line-height: ${LINE_HEIGHT_MAP[props.lineHeight] ?? props.lineHeight};` : ''}\n    ${props.underline ? `border-bottom: 1px ${typeof props.underline === 'string' ? props.underline : 'solid'};` : ''}\n    a {\n      text-decoration: ${props.underlineLinks ? 'underline' : 'none'};\n      &:hover {\n        text-decoration: none;\n      }\n    }\n  `}\n\n  ${responsiveSize}\n  ${responsiveMargin}\n\n  ${(props) => (props.display ? display(props.display) : null)}\n  ${(props) => (props.color ? color(props.color) : color(props.theme.textColor as Color))}\n`\n"],"names":["WEIGHT_MAP","lighter","normal","bold","bolder","LINE_HEIGHT_MAP","l","m","s","xs","shouldForwardTextProp","createShouldForwardProp","propKey","includes","Root","styled","div","withConfig","shouldForwardProp","attrs","dynamicSizeDeclaration","size","cssProperty","cssUnit","concat","componentId","props","_WEIGHT_MAP$props$wei","_LINE_HEIGHT_MAP$prop","fontFamily","transform","weight","fontStyle","textAlign","lineHeight","underline","underlineLinks","responsiveSize","responsiveMargin","display","color","theme","textColor"],"mappings":"uTASA,IAAMA,EAAa,CACjBC,QAAS,IACTC,OAAQ,IACRC,KAAM,IACNC,OAAQ,KAGV,IAAMC,EAAkB,CACtBC,EAAG,IACHC,EAAG,IACHC,EAAG,KACHC,GAAI,GAGN,IAAMC,EAAwBC,GAC3BC,IACE,CACC,aACA,aACA,SACA,YACA,YACA,iBACA,YACA,aACA,UACA,UACA,QACA,SACA,oBACA,YACA,aACAC,SAASD,KAGR,IAAME,EAAOC,EAAOC,IACxBC,WAA4B,CAC3BC,kBAAmBR,IAEpBS,MAAiE,CAChEC,uBAAwB,CAACC,EAAMC,EAAaC,KAAAA,CAExCD,CAACA,GAA8B,iBAATD,EAAoBA,EAA3B,GAAAG,OAAqCH,GAArCG,OAA4CD,OAPlDN,WAAA,CAAAQ,YAAA,uBAAGV,CAAH,CAAA,GAAA,IAAA,IAAA,IAAA,IAAA,KAWZW,IAAD,IAAAC,EAAAC,EAAA,MAEEF,yBAAAA,OAAAA,EAAMG,WAAN,gBAAAL,OAAmCE,EAAMG,gBAAgB,GAF3D,UAAAL,OAGEE,EAAMI,oCAA+BJ,EAAMI,UAAe,KAAA,GAC1DJ,UAAAA,OAAAA,EAAMK,8BAAqDL,UAA5B1B,EAAW0B,EAAMK,eAAAA,IAAWL,EAAAA,EAAAA,EAAMK,OAAY,KAAA,oBAC7EL,EAAMM,UAA2BN,eAAAA,OAAAA,EAAMM,UAAvC,KAAsD,GALxD,UAAAR,OAMEE,EAAMO,UAA2BP,eAAAA,OAAAA,EAAMO,UAAvC,KAAsD,GACtDP,UAAAA,OAAAA,EAAMQ,WAA6B7B,gBAAAA,OAAnC,QAAmCA,EAAAA,EAAgBqB,EAAMQ,uBAAzDN,EAAAA,EAAwEF,EAAMQ,WAAgB,KAAA,GAC9FR,UAAAA,OAAAA,EAAMS,UAAN,sBAAAX,OAAmE,iBAApBE,EAAMS,UAAyBT,EAAMS,UAAY,QAAhG,KAA6G,GAE1FT,sCAAAA,OAAAA,EAAMU,eAAiB,YAAc,OAV1D,4EAiBAC,EACAC,GAECZ,GAAWA,EAAMa,QAAUA,EAAQb,EAAMa,SAAW,OACpDb,GAAyBc,EAAdd,EAAMc,MAAcd,EAAMc,MAAed,EAAMe,MAAMC"}

package/components/Text.Heading/Text.Heading.js

@@ -1,2 +1,2 @@
-import e from'@babel/runtime/helpers/objectSpread2';import i from'@babel/runtime/helpers/objectWithoutProperties';import{useFallbackTheme as t}from'../../hooks/use-theme.js';import{useConfigPriority as o}from'../../hooks/use-config-priority.js';import{Text as r}from'../Text/Text.js';import{jsx as s}from'react/jsx-runtime';var a=["h","fontFamily"];var h={h1:{size:44,sizeM:32,lineHeight:'s',weight:'bold'},h2:{size:32,sizeM:28,lineHeight:'s',weight:'bold'},h3:{size:28,lineHeight:'s',weight:'bold'},h4:{size:24,lineHeight:'s',weight:'bold'}};var m='Text.Heading';var l=m=>{var l;var n=t();var g=o(null===(l=n.components)||void 0===l?void 0:l["Text.Heading"],m),{h:p="h1",fontFamily:d}=g,b=i(g,a);return s(r,e(e({as:p,fontFamily:d},h[p]),b))};l.displayName="Text.Heading";export{m as COMPONENT_NAME,l as TextHeading};
+import e from'@babel/runtime/helpers/objectSpread2';import i from'@babel/runtime/helpers/objectWithoutProperties';import{useTheme as t}from'styled-components';import{useConfigPriority as o}from'../../hooks/use-config-priority.js';import{Text as r}from'../Text/Text.js';import{jsx as s}from'react/jsx-runtime';var a=["h","fontFamily"];var m={h1:{size:44,sizeM:32,lineHeight:'s',weight:'bold'},h2:{size:32,sizeM:28,lineHeight:'s',weight:'bold'},h3:{size:28,lineHeight:'s',weight:'bold'},h4:{size:24,lineHeight:'s',weight:'bold'}};var n='Text.Heading';var h=n=>{var h;var l=t();var p=o(null===(h=l.components)||void 0===h?void 0:h["Text.Heading"],n),{h:g="h1",fontFamily:d}=p,f=i(p,a);return s(r,e(e({as:g,fontFamily:d},m[g]),f))};h.displayName="Text.Heading";export{n as COMPONENT_NAME,h as TextHeading};
 //# sourceMappingURL=Text.Heading.js.map

package/components/Text.Heading/Text.Heading.js.map

@@ -1 +1 @@
-{"version":3,"file":"Text.Heading.js","sources":["../../../../src/components/Text.Heading/Text.Heading.tsx"],"sourcesContent":["import { useFallbackTheme } from 'hooks/use-theme'\nimport { useConfigPriority } from 'hooks/use-config-priority'\nimport { Text } from '../Text'\nimport type { TextHeadingProps, H } from './types'\n\nconst PARAMS: Record<H, Partial<TextHeadingProps>> = {\n  h1: {\n    size: 44,\n    sizeM: 32,\n    lineHeight: 's',\n    weight: 'bold',\n  },\n  h2: {\n    size: 32,\n    sizeM: 28,\n    lineHeight: 's',\n    weight: 'bold',\n  },\n  h3: {\n    size: 28,\n    lineHeight: 's',\n    weight: 'bold',\n  },\n  h4: {\n    size: 24,\n    lineHeight: 's',\n    weight: 'bold',\n  },\n}\n\nconst COMPONENT_NAME = 'Text.Heading'\n\n/**\n * @visibleName Text.Heading\n */\nconst TextHeading = (props: TextHeadingProps) => {\n  const theme = useFallbackTheme()\n\n  const {\n    h = 'h1',\n    fontFamily,\n    ...configProps\n  } = useConfigPriority<TextHeadingProps>(theme.components?.[COMPONENT_NAME], props)\n\n  const predefinedParams = PARAMS[h]\n\n  return <Text as={h} fontFamily={fontFamily} {...predefinedParams} {...configProps} />\n}\n\nTextHeading.displayName = COMPONENT_NAME\n\nexport { TextHeading, COMPONENT_NAME }\n"],"names":["PARAMS","h1","size","sizeM","lineHeight","weight","h2","h3","h4","COMPONENT_NAME","TextHeading","props","_theme$components","theme","useFallbackTheme","useConfigPriority","components","h","fontFamily","_useConfigPriority","configProps","_objectWithoutProperties","_excluded","_jsx","Text","_objectSpread","as","displayName"],"mappings":"6VAKA,IAAMA,EAA+C,CACnDC,GAAI,CACFC,KAAM,GACNC,MAAO,GACPC,WAAY,IACZC,OAAQ,QAEVC,GAAI,CACFJ,KAAM,GACNC,MAAO,GACPC,WAAY,IACZC,OAAQ,QAEVE,GAAI,CACFL,KAAM,GACNE,WAAY,IACZC,OAAQ,QAEVG,GAAI,CACFN,KAAM,GACNE,WAAY,IACZC,OAAQ,SAINI,IAAAA,EAAiB,eAKjBC,IAAAA,EAAeC,IAA4B,IAAAC,EAC/C,IAAMC,EAAQC,IAEd,IAIIC,EAAAA,EAAoC,QAAAF,EAAAA,EAAMG,sBAANJ,OAAAA,EAAAA,EAZnB,gBAYuDD,IAJtEM,EACJA,EAAI,KADAC,WAEJA,GAFFC,EAGKC,EAHLC,EAAAF,EAAAG,GAQA,OAAOC,EAACC,EAADC,EAAAA,EAAA,CAAMC,GAAIT,EAAGC,WAAYA,GAFPlB,EAAOiB,IAEsCG,KAGxEV,EAAYiB,YAnBW"}
+{"version":3,"file":"Text.Heading.js","sources":["../../../../src/components/Text.Heading/Text.Heading.tsx"],"sourcesContent":["import { useTheme } from 'styled-components'\nimport { useConfigPriority } from 'hooks/use-config-priority'\nimport { Text } from '../Text'\nimport type { TextHeadingProps, H } from './types'\n\nconst PARAMS: Record<H, Partial<TextHeadingProps>> = {\n  h1: {\n    size: 44,\n    sizeM: 32,\n    lineHeight: 's',\n    weight: 'bold',\n  },\n  h2: {\n    size: 32,\n    sizeM: 28,\n    lineHeight: 's',\n    weight: 'bold',\n  },\n  h3: {\n    size: 28,\n    lineHeight: 's',\n    weight: 'bold',\n  },\n  h4: {\n    size: 24,\n    lineHeight: 's',\n    weight: 'bold',\n  },\n}\n\nconst COMPONENT_NAME = 'Text.Heading'\n\n/**\n * @visibleName Text.Heading\n */\nconst TextHeading = (props: TextHeadingProps) => {\n  const theme = useTheme()\n\n  const {\n    h = 'h1',\n    fontFamily,\n    ...configProps\n  } = useConfigPriority<TextHeadingProps>(theme.components?.[COMPONENT_NAME], props)\n\n  const predefinedParams = PARAMS[h]\n\n  return <Text as={h} fontFamily={fontFamily} {...predefinedParams} {...configProps} />\n}\n\nTextHeading.displayName = COMPONENT_NAME\n\nexport { TextHeading, COMPONENT_NAME }\n"],"names":["PARAMS","h1","size","sizeM","lineHeight","weight","h2","h3","h4","COMPONENT_NAME","TextHeading","props","_theme$components","theme","useTheme","useConfigPriority","components","h","fontFamily","_useConfigPriority","configProps","_objectWithoutProperties","_excluded","_jsx","Text","_objectSpread","as","displayName"],"mappings":"8UAKA,IAAMA,EAA+C,CACnDC,GAAI,CACFC,KAAM,GACNC,MAAO,GACPC,WAAY,IACZC,OAAQ,QAEVC,GAAI,CACFJ,KAAM,GACNC,MAAO,GACPC,WAAY,IACZC,OAAQ,QAEVE,GAAI,CACFL,KAAM,GACNE,WAAY,IACZC,OAAQ,QAEVG,GAAI,CACFN,KAAM,GACNE,WAAY,IACZC,OAAQ,SAINI,IAAAA,EAAiB,eAKjBC,IAAAA,EAAeC,IAA4B,IAAAC,EAC/C,IAAMC,EAAQC,IAEd,IAIIC,EAAAA,EAAoC,QAAAF,EAAAA,EAAMG,sBAANJ,OAAAA,EAAAA,EAZnB,gBAYuDD,IAJtEM,EACJA,EAAI,KADAC,WAEJA,GAFFC,EAGKC,EAHLC,EAAAF,EAAAG,GAQA,OAAOC,EAACC,EAADC,EAAAA,EAAA,CAAMC,GAAIT,EAAGC,WAAYA,GAFPlB,EAAOiB,IAEsCG,KAGxEV,EAAYiB,YAnBW"}

package/components/Textarea/Textarea.js

@@ -1,2 +1,2 @@
-import e from'@babel/runtime/helpers/objectSpread2';import r from'@babel/runtime/helpers/objectWithoutProperties';import{useRef as a,useState as o,useCallback as t,useEffect as s}from'react';import{omit as l}from'ramda';import{useFallbackTheme as i}from'../../hooks/use-theme.js';import{useConfigPriority as n}from'../../hooks/use-config-priority.js';import{Root as d}from'./style.js';import{jsx as m}from'react/jsx-runtime';var u=["preset","disabled","error","fluid","name","onChange","maxLength","placeholder","required","tabIndex","value","className","style","autosize","rounded","cols","rows","maxRows","color","placeholderColor","width"];var c='Textarea';var h=c=>{var h;var p=i();var f=n(null===(h=p.components)||void 0===h?void 0:h.Textarea,l(['children'],c)),{preset:v,disabled:g,error:b,fluid:x,name:C,onChange:y,maxLength:w,placeholder:T,required:j,tabIndex:N,value:R,className:H,style:I,autosize:k=!0,rounded:E=!0,cols:L=20,rows:M=2,maxRows:P=30,color:S="mineShaft",placeholderColor:q="silver",width:z=p.defaultInputControlsWidth}=f,A=r(f,u);var B=a();var[O,W]=o(M);var F=t((e=>{var{target:r}=e;if(r instanceof HTMLTextAreaElement&&k){var a=r.getBoundingClientRect();r.scrollHeight>a.height&&O<P?W(O+1):r.value&&''!==r.value||W(M)}'function'==typeof y&&y(e)}),[y,O,P,k]);s((()=>{if(B&&B.current){var e=B.current;var r=e.getBoundingClientRect();if(e.scrollHeight>r.height){var a=parseInt(getComputedStyle(e).lineHeight,10);var o=Math.floor(e.scrollHeight/a);o<=P&&o>M&&W(o)}}}),[]);var U='brand'===p.preset;return'string'==typeof v&&(U='brand'===v),m(d,e(e({},A),{},{ref:B,className:H,style:I,onChange:F,cols:L,disabled:g,maxLength:w,name:C,placeholder:T,required:j,rows:O,tabIndex:N,value:R,color:S,rounded:E,placeholderColor:q,fluid:x,error:b,width:z,brandPresetUsed:U}))};h.displayName="Textarea";export{c as COMPONENT_NAME,h as Textarea};
+import e from'@babel/runtime/helpers/objectSpread2';import r from'@babel/runtime/helpers/objectWithoutProperties';import{useRef as a,useState as o,useCallback as t,useEffect as s}from'react';import{useTheme as l}from'styled-components';import{omit as i}from'ramda';import{useConfigPriority as n}from'../../hooks/use-config-priority.js';import{Root as d}from'./style.js';import{jsx as m}from'react/jsx-runtime';var u=["preset","disabled","error","fluid","name","onChange","maxLength","placeholder","required","tabIndex","value","className","style","autosize","rounded","cols","rows","maxRows","color","placeholderColor","width"];var c='Textarea';var h=c=>{var h;var p=l();var f=n(null===(h=p.components)||void 0===h?void 0:h.Textarea,i(['children'],c)),{preset:v,disabled:g,error:b,fluid:x,name:C,onChange:y,maxLength:w,placeholder:T,required:N,tabIndex:j,value:R,className:H,style:I,autosize:E=!0,rounded:L=!0,cols:M=20,rows:P=2,maxRows:S=30,color:q="mineShaft",placeholderColor:k="silver",width:z=p.defaultInputControlsWidth}=f,A=r(f,u);var B=a();var[O,W]=o(P);var U=t((e=>{var{target:r}=e;if(r instanceof HTMLTextAreaElement&&E){var a=r.getBoundingClientRect();r.scrollHeight>a.height&&O<S?W(O+1):r.value&&''!==r.value||W(P)}'function'==typeof y&&y(e)}),[y,O,S,E]);s((()=>{if(B&&B.current){var e=B.current;var r=e.getBoundingClientRect();if(e.scrollHeight>r.height){var a=parseInt(getComputedStyle(e).lineHeight,10);var o=Math.floor(e.scrollHeight/a);o<=S&&o>P&&W(o)}}}),[]);var _='brand'===p.preset;return'string'==typeof v&&(_='brand'===v),m(d,e(e({},A),{},{ref:B,className:H,style:I,onChange:U,cols:M,disabled:g,maxLength:w,name:C,placeholder:T,required:N,rows:O,tabIndex:j,value:R,color:q,rounded:L,placeholderColor:k,fluid:x,error:b,width:z,brandPresetUsed:_}))};h.displayName="Textarea";export{c as COMPONENT_NAME,h as Textarea};
 //# sourceMappingURL=Textarea.js.map