@vkontakte/vkui 4.28.0 → 4.29.1

package/dist/cssm/components/SliderSwitch/SliderSwitch.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/components/SliderSwitch/SliderSwitch.tsx"],"names":["React","SliderSwitchButton","classNames","warnOnce","warn","SliderSwitch","props","value","onSwitch","setState","activeValue","options","hoveredOptionId","event","key","preventDefault","state","find","option","undefined","firstButton","current","focus","secondButton","createRef","process","env","NODE_ENV","name","_activeValue","restProps","firstOption","secondOption","firstActive","secondActive","switchByKey","resetFocusedOption","handleFirstClick","handleFirstHover","handleSecondClick","handleSecondHover","nextProps","prevState","Component"],"mappings":"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","sourcesContent":["import * as React from \"react\";\nimport { SliderSwitchButton } from \"./SliderSwitchButton\";\nimport { classNames } from \"../../lib/classNames\";\nimport { warnOnce } from \"../../lib/warnOnce\";\nimport { HasPlatform } from \"../../types\";\nimport \"./SliderSwitch.css\";\n\nexport interface SliderSwitchOptionInterface {\n  name: string;\n  value: string | number;\n}\n\nexport interface SliderSwitchProps\n  extends React.HTMLAttributes<HTMLDivElement>,\n    HasPlatform {\n  options: Array<{\n    name: string;\n    value: string | number;\n  }>;\n  activeValue?: SliderSwitchOptionInterface[\"value\"];\n  name?: string;\n  onSwitch?: (value: SliderSwitchOptionInterface[\"value\"]) => void;\n}\n\ninterface SliderSwitchState {\n  activeValue: SliderSwitchOptionInterface[\"value\"];\n  hoveredOptionId: number;\n}\n\nconst warn = warnOnce(\"SliderSwitch\");\n/**\n * @deprecated Этот компонент устарел и будет удален в 5.0.0. Используйте [`SegmentedControl`](#/SegmentedControl).\n */\nclass SliderSwitch extends React.Component<\n  SliderSwitchProps,\n  SliderSwitchState\n> {\n  public constructor(props: SliderSwitchProps) {\n    super(props);\n\n    this.state = {\n      activeValue: props.activeValue ?? \"\",\n      hoveredOptionId: -1,\n    };\n\n    this.firstButton = React.createRef();\n    this.secondButton = React.createRef();\n  }\n\n  static defaultProps = {\n    options: [\n      { name: \"\", value: \"\" },\n      { name: \"\", value: \"\" },\n    ],\n  };\n\n  firstButton: React.RefObject<HTMLDivElement>;\n  secondButton: React.RefObject<HTMLDivElement>;\n\n  onSwitch = (value: SliderSwitchOptionInterface[\"value\"]) => {\n    const { onSwitch } = this.props;\n\n    this.setState(\n      () => ({\n        activeValue: value,\n      }),\n      () => {\n        onSwitch && onSwitch(value);\n      }\n    );\n  };\n\n  handleFirstClick = () => {\n    const { options } = this.props;\n    const { value } = options[0];\n\n    this.onSwitch(value);\n  };\n\n  handleSecondClick = () => {\n    const { options } = this.props;\n    const { value } = options[1];\n\n    this.onSwitch(value);\n  };\n\n  handleFirstHover = () => {\n    this.setState(() => ({\n      hoveredOptionId: 0,\n    }));\n  };\n\n  handleSecondHover = () => {\n    this.setState(() => ({\n      hoveredOptionId: 1,\n    }));\n  };\n\n  resetFocusedOption = () => {\n    this.setState(() => ({\n      hoveredOptionId: -1,\n    }));\n  };\n\n  switchByKey = (event: React.KeyboardEvent) => {\n    if (\n      event.key !== \"Enter\" &&\n      event.key !== \"Spacebar\" &&\n      event.key !== \" \"\n    ) {\n      return;\n    }\n    event.preventDefault();\n\n    const { options } = this.props;\n    const { activeValue } = this.state;\n    const value = options.find((option) => option.value !== activeValue)?.value;\n\n    if (value !== undefined) {\n      this.onSwitch(value);\n    }\n\n    if (options[0].value === value) {\n      this.firstButton.current?.focus();\n    } else {\n      this.secondButton.current?.focus();\n    }\n  };\n\n  static getDerivedStateFromProps(\n    nextProps: SliderSwitchProps,\n    prevState: SliderSwitchState\n  ) {\n    if (\n      nextProps.activeValue &&\n      nextProps.activeValue !== prevState.activeValue\n    ) {\n      return {\n        activeValue: nextProps.activeValue,\n      };\n    }\n\n    return null;\n  }\n\n  componentDidMount(): void {\n    if (process.env.NODE_ENV === \"development\") {\n      warn(\n        \"Этот компонент устарел и будет удален в 5.0.0. Используйте SegmentedControl.\"\n      );\n    }\n  }\n\n  public render() {\n    const {\n      name,\n      options,\n      activeValue: _activeValue,\n      onSwitch,\n      ...restProps\n    } = this.props;\n    const { activeValue, hoveredOptionId } = this.state;\n\n    const [firstOption, secondOption] = options;\n    const firstActive = firstOption.value === activeValue;\n    const secondActive = secondOption.value === activeValue;\n\n    return (\n      <div\n        {...restProps}\n        vkuiClass=\"SliderSwitch\"\n        onKeyDown={this.switchByKey}\n        onMouseLeave={this.resetFocusedOption}\n      >\n        {!firstActive && !secondActive && (\n          <div vkuiClass=\"SliderSwitch__border\" />\n        )}\n        <div\n          vkuiClass={classNames(\"SliderSwitch__slider\", {\n            [\"SliderSwitch--firstActive\"]: firstActive,\n            [\"SliderSwitch--secondActive\"]: secondActive,\n          })}\n        />\n        <input type=\"hidden\" name={name} value={activeValue} />\n        <SliderSwitchButton\n          active={firstActive}\n          hovered={hoveredOptionId === 0}\n          aria-pressed={firstActive}\n          onClick={this.handleFirstClick}\n          onMouseEnter={this.handleFirstHover}\n          getRootRef={this.firstButton}\n        >\n          {firstOption.name}\n        </SliderSwitchButton>\n        <SliderSwitchButton\n          active={secondActive}\n          hovered={hoveredOptionId === 1}\n          onClick={this.handleSecondClick}\n          onMouseEnter={this.handleSecondHover}\n          getRootRef={this.secondButton}\n        >\n          {secondOption.name}\n        </SliderSwitchButton>\n      </div>\n    );\n  }\n}\n\nexport { SliderSwitch };\n"],"file":"SliderSwitch.js"}
+{"version":3,"sources":["../../../../src/components/SliderSwitch/SliderSwitch.tsx"],"names":["React","SliderSwitchButton","classNames","warnOnce","warn","SliderSwitch","props","value","onSwitch","setState","activeValue","options","hoveredOptionId","event","key","preventDefault","state","find","option","undefined","firstButton","current","focus","secondButton","createRef","process","env","NODE_ENV","name","_activeValue","restProps","firstOption","secondOption","firstActive","secondActive","switchByKey","resetFocusedOption","handleFirstClick","handleFirstHover","handleSecondClick","handleSecondHover","nextProps","prevState","Component"],"mappings":"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","sourcesContent":["import * as React from \"react\";\nimport { SliderSwitchButton } from \"./SliderSwitchButton\";\nimport { classNames } from \"../../lib/classNames\";\nimport { warnOnce } from \"../../lib/warnOnce\";\nimport { HasPlatform } from \"../../types\";\nimport \"./SliderSwitch.css\";\n\nexport interface SliderSwitchOptionInterface {\n  name: string;\n  value: string | number;\n}\n\nexport interface SliderSwitchProps\n  extends React.HTMLAttributes<HTMLDivElement>,\n    HasPlatform {\n  options: Array<{\n    name: string;\n    value: string | number;\n  }>;\n  activeValue?: SliderSwitchOptionInterface[\"value\"];\n  name?: string;\n  onSwitch?: (value: SliderSwitchOptionInterface[\"value\"]) => void;\n}\n\ninterface SliderSwitchState {\n  activeValue: SliderSwitchOptionInterface[\"value\"];\n  hoveredOptionId: number;\n}\n\nconst warn = warnOnce(\"SliderSwitch\");\n/**\n * @deprecated Этот компонент устарел и будет удален в 5.0.0. Используйте [`SegmentedControl`](#/SegmentedControl).\n */\nclass SliderSwitch extends React.Component<\n  SliderSwitchProps,\n  SliderSwitchState\n> {\n  public constructor(props: SliderSwitchProps) {\n    super(props);\n\n    this.state = {\n      activeValue: props.activeValue ?? \"\",\n      hoveredOptionId: -1,\n    };\n\n    this.firstButton = React.createRef();\n    this.secondButton = React.createRef();\n  }\n\n  static defaultProps = {\n    options: [\n      { name: \"\", value: \"\" },\n      { name: \"\", value: \"\" },\n    ],\n  };\n\n  firstButton: React.RefObject<HTMLDivElement>;\n  secondButton: React.RefObject<HTMLDivElement>;\n\n  onSwitch = (value: SliderSwitchOptionInterface[\"value\"]) => {\n    const { onSwitch } = this.props;\n\n    this.setState(\n      () => ({\n        activeValue: value,\n      }),\n      () => {\n        onSwitch && onSwitch(value);\n      }\n    );\n  };\n\n  handleFirstClick = () => {\n    const { options } = this.props;\n    const { value } = options[0];\n\n    this.onSwitch(value);\n  };\n\n  handleSecondClick = () => {\n    const { options } = this.props;\n    const { value } = options[1];\n\n    this.onSwitch(value);\n  };\n\n  handleFirstHover = () => {\n    this.setState(() => ({\n      hoveredOptionId: 0,\n    }));\n  };\n\n  handleSecondHover = () => {\n    this.setState(() => ({\n      hoveredOptionId: 1,\n    }));\n  };\n\n  resetFocusedOption = () => {\n    this.setState(() => ({\n      hoveredOptionId: -1,\n    }));\n  };\n\n  switchByKey = (event: React.KeyboardEvent) => {\n    if (\n      event.key !== \"Enter\" &&\n      event.key !== \"Spacebar\" &&\n      event.key !== \" \"\n    ) {\n      return;\n    }\n    event.preventDefault();\n\n    const { options } = this.props;\n    const { activeValue } = this.state;\n    const value = options.find((option) => option.value !== activeValue)?.value;\n\n    if (value !== undefined) {\n      this.onSwitch(value);\n    }\n\n    if (options[0].value === value) {\n      this.firstButton.current?.focus();\n    } else {\n      this.secondButton.current?.focus();\n    }\n  };\n\n  static getDerivedStateFromProps(\n    nextProps: SliderSwitchProps,\n    prevState: SliderSwitchState\n  ) {\n    if (\n      nextProps.activeValue &&\n      nextProps.activeValue !== prevState.activeValue\n    ) {\n      return {\n        activeValue: nextProps.activeValue,\n      };\n    }\n\n    return null;\n  }\n\n  componentDidMount(): void {\n    if (process.env.NODE_ENV === \"development\") {\n      warn(\n        \"Этот компонент устарел и будет удален в 5.0.0. Используйте SegmentedControl.\"\n      );\n    }\n  }\n\n  public render() {\n    const {\n      name,\n      options,\n      activeValue: _activeValue,\n      onSwitch,\n      ...restProps\n    } = this.props;\n    const { activeValue, hoveredOptionId } = this.state;\n\n    const [firstOption, secondOption] = options;\n    const firstActive = firstOption.value === activeValue;\n    const secondActive = secondOption.value === activeValue;\n\n    return (\n      <div\n        {...restProps}\n        vkuiClass=\"SliderSwitch\"\n        onKeyDown={this.switchByKey}\n        onMouseLeave={this.resetFocusedOption}\n      >\n        {!firstActive && !secondActive && (\n          <div vkuiClass=\"SliderSwitch__border\" />\n        )}\n        <div\n          // eslint-disable-next-line vkui/no-object-expression-in-arguments\n          vkuiClass={classNames(\"SliderSwitch__slider\", {\n            [\"SliderSwitch--firstActive\"]: firstActive,\n            [\"SliderSwitch--secondActive\"]: secondActive,\n          })}\n        />\n        <input type=\"hidden\" name={name} value={activeValue} />\n        <SliderSwitchButton\n          active={firstActive}\n          hovered={hoveredOptionId === 0}\n          aria-pressed={firstActive}\n          onClick={this.handleFirstClick}\n          onMouseEnter={this.handleFirstHover}\n          getRootRef={this.firstButton}\n        >\n          {firstOption.name}\n        </SliderSwitchButton>\n        <SliderSwitchButton\n          active={secondActive}\n          hovered={hoveredOptionId === 1}\n          onClick={this.handleSecondClick}\n          onMouseEnter={this.handleSecondHover}\n          getRootRef={this.secondButton}\n        >\n          {secondOption.name}\n        </SliderSwitchButton>\n      </div>\n    );\n  }\n}\n\nexport { SliderSwitch };\n"],"file":"SliderSwitch.js"}

package/dist/cssm/components/SliderSwitch/SliderSwitchButton.js

@@ -36,6 +36,7 @@ export var SliderSwitchButton = function SliderSwitchButton(props) {
   };
 
   return createScopedElement(Tappable, _extends({}, restProps, {
+    // eslint-disable-next-line vkui/no-object-expression-in-arguments
     vkuiClass: classNames(getClassName("SliderSwitch__button", platform), (_classNames = {}, _defineProperty(_classNames, "SliderSwitch__button--active", active), _defineProperty(_classNames, "SliderSwitch__button--hover", !active && hovered), _defineProperty(_classNames, "SliderSwitch__button--activeHover", active && hovered), _defineProperty(_classNames, "SliderSwitch__button--focus", focus && !hovered), _classNames)),
     Component: "button",
     type: "button",

package/dist/cssm/components/SliderSwitch/SliderSwitchButton.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/components/SliderSwitch/SliderSwitchButton.tsx"],"names":["React","Tappable","getClassName","classNames","usePlatform","Text","SliderSwitchButton","props","active","hovered","children","getRootRef","restProps","platform","useState","focus","setFocus","toggleFocus"],"mappings":";;;;;;AAAA,OAAO,KAAKA,KAAZ,MAAuB,OAAvB;AACA,OAAOC,QAAP;AACA,SAASC,YAAT;AACA,SAASC,UAAT;AAEA,SAASC,WAAT;AACA,OAAOC,IAAP;AACA;;AASA;AACA;AACA;AACA,OAAO,IAAMC,kBAAwD,GAAG,SAA3DA,kBAA2D,CACtEC,KADsE,EAEnE;AAAA;;AACH,MAAQC,MAAR,GAAgED,KAAhE,CAAQC,MAAR;AAAA,MAAgBC,OAAhB,GAAgEF,KAAhE,CAAgBE,OAAhB;AAAA,MAAyBC,QAAzB,GAAgEH,KAAhE,CAAyBG,QAAzB;AAAA,MAAmCC,UAAnC,GAAgEJ,KAAhE,CAAmCI,UAAnC;AAAA,MAAkDC,SAAlD,4BAAgEL,KAAhE;;AACA,MAAMM,QAAQ,GAAGT,WAAW,EAA5B;;AACA,wBAA0BJ,KAAK,CAACc,QAAN,CAAe,KAAf,CAA1B;AAAA;AAAA,MAAOC,KAAP;AAAA,MAAcC,QAAd;;AAEA,MAAMC,WAAW,GAAG,SAAdA,WAAc,GAAM;AACxBD,IAAAA,QAAQ,CAAC,CAACD,KAAF,CAAR;AACD,GAFD;;AAIA,SACE,oBAAC,QAAD,eACMH,SADN;AAEE,IAAA,SAAS,EAAET,UAAU,CAACD,YAAY,CAAC,sBAAD,EAAyBW,QAAzB,CAAb,kDAClB,8BADkB,EACeL,MADf,gCAElB,6BAFkB,EAEc,CAACA,MAAD,IAAWC,OAFzB,gCAGlB,mCAHkB,EAGoBD,MAAM,IAAIC,OAH9B,gCAIlB,6BAJkB,EAIcM,KAAK,IAAI,CAACN,OAJxB,gBAFvB;AAQE,IAAA,SAAS,EAAC,QARZ;AASE,IAAA,IAAI,EAAC,QATP;AAUE,IAAA,UAAU,EAAEE,UAVd;AAWE,oBAAcH,MAXhB;AAYE,IAAA,OAAO,EAAES,WAZX;AAaE,IAAA,MAAM,EAAEA,WAbV;AAcE,IAAA,QAAQ,EAAE,CAdZ;AAeE,IAAA,SAAS,EAAE,KAfb;AAgBE,IAAA,SAAS,EAAC;AAhBZ,MAkBE,oBAAC,IAAD;AAAM,IAAA,MAAM,EAAC;AAAb,KAAuBP,QAAvB,CAlBF,CADF;AAsBD,CAjCM","sourcesContent":["import * as React from \"react\";\nimport Tappable from \"../Tappable/Tappable\";\nimport { getClassName } from \"../../helpers/getClassName\";\nimport { classNames } from \"../../lib/classNames\";\nimport { HasRootRef } from \"../../types\";\nimport { usePlatform } from \"../../hooks/usePlatform\";\nimport Text from \"../Typography/Text/Text\";\nimport \"./SliderSwitch.css\";\n\nexport interface ButtonProps\n  extends React.ButtonHTMLAttributes<HTMLElement>,\n    HasRootRef<HTMLElement> {\n  active?: boolean;\n  hovered?: boolean;\n}\n\n/**\n * @deprecated Этот компонент устарел и будет удален в 5.0.0.\n */\nexport const SliderSwitchButton: React.FunctionComponent<ButtonProps> = (\n  props: ButtonProps\n) => {\n  const { active, hovered, children, getRootRef, ...restProps } = props;\n  const platform = usePlatform();\n  const [focus, setFocus] = React.useState(false);\n\n  const toggleFocus = () => {\n    setFocus(!focus);\n  };\n\n  return (\n    <Tappable\n      {...restProps}\n      vkuiClass={classNames(getClassName(\"SliderSwitch__button\", platform), {\n        [\"SliderSwitch__button--active\"]: active,\n        [\"SliderSwitch__button--hover\"]: !active && hovered,\n        [\"SliderSwitch__button--activeHover\"]: active && hovered,\n        [\"SliderSwitch__button--focus\"]: focus && !hovered,\n      })}\n      Component=\"button\"\n      type=\"button\"\n      getRootRef={getRootRef}\n      aria-pressed={active}\n      onFocus={toggleFocus}\n      onBlur={toggleFocus}\n      tabIndex={0}\n      hasActive={false}\n      hoverMode=\"opacity\"\n    >\n      <Text weight=\"medium\">{children}</Text>\n    </Tappable>\n  );\n};\n"],"file":"SliderSwitchButton.js"}
+{"version":3,"sources":["../../../../src/components/SliderSwitch/SliderSwitchButton.tsx"],"names":["React","Tappable","getClassName","classNames","usePlatform","Text","SliderSwitchButton","props","active","hovered","children","getRootRef","restProps","platform","useState","focus","setFocus","toggleFocus"],"mappings":";;;;;;AAAA,OAAO,KAAKA,KAAZ,MAAuB,OAAvB;AACA,OAAOC,QAAP;AACA,SAASC,YAAT;AACA,SAASC,UAAT;AAEA,SAASC,WAAT;AACA,OAAOC,IAAP;AACA;;AASA;AACA;AACA;AACA,OAAO,IAAMC,kBAAwD,GAAG,SAA3DA,kBAA2D,CACtEC,KADsE,EAEnE;AAAA;;AACH,MAAQC,MAAR,GAAgED,KAAhE,CAAQC,MAAR;AAAA,MAAgBC,OAAhB,GAAgEF,KAAhE,CAAgBE,OAAhB;AAAA,MAAyBC,QAAzB,GAAgEH,KAAhE,CAAyBG,QAAzB;AAAA,MAAmCC,UAAnC,GAAgEJ,KAAhE,CAAmCI,UAAnC;AAAA,MAAkDC,SAAlD,4BAAgEL,KAAhE;;AACA,MAAMM,QAAQ,GAAGT,WAAW,EAA5B;;AACA,wBAA0BJ,KAAK,CAACc,QAAN,CAAe,KAAf,CAA1B;AAAA;AAAA,MAAOC,KAAP;AAAA,MAAcC,QAAd;;AAEA,MAAMC,WAAW,GAAG,SAAdA,WAAc,GAAM;AACxBD,IAAAA,QAAQ,CAAC,CAACD,KAAF,CAAR;AACD,GAFD;;AAIA,SACE,oBAAC,QAAD,eACMH,SADN;AAEE;AACA,IAAA,SAAS,EAAET,UAAU,CAACD,YAAY,CAAC,sBAAD,EAAyBW,QAAzB,CAAb,kDAClB,8BADkB,EACeL,MADf,gCAElB,6BAFkB,EAEc,CAACA,MAAD,IAAWC,OAFzB,gCAGlB,mCAHkB,EAGoBD,MAAM,IAAIC,OAH9B,gCAIlB,6BAJkB,EAIcM,KAAK,IAAI,CAACN,OAJxB,gBAHvB;AASE,IAAA,SAAS,EAAC,QATZ;AAUE,IAAA,IAAI,EAAC,QAVP;AAWE,IAAA,UAAU,EAAEE,UAXd;AAYE,oBAAcH,MAZhB;AAaE,IAAA,OAAO,EAAES,WAbX;AAcE,IAAA,MAAM,EAAEA,WAdV;AAeE,IAAA,QAAQ,EAAE,CAfZ;AAgBE,IAAA,SAAS,EAAE,KAhBb;AAiBE,IAAA,SAAS,EAAC;AAjBZ,MAmBE,oBAAC,IAAD;AAAM,IAAA,MAAM,EAAC;AAAb,KAAuBP,QAAvB,CAnBF,CADF;AAuBD,CAlCM","sourcesContent":["import * as React from \"react\";\nimport Tappable from \"../Tappable/Tappable\";\nimport { getClassName } from \"../../helpers/getClassName\";\nimport { classNames } from \"../../lib/classNames\";\nimport { HasRootRef } from \"../../types\";\nimport { usePlatform } from \"../../hooks/usePlatform\";\nimport Text from \"../Typography/Text/Text\";\nimport \"./SliderSwitch.css\";\n\nexport interface ButtonProps\n  extends React.ButtonHTMLAttributes<HTMLElement>,\n    HasRootRef<HTMLElement> {\n  active?: boolean;\n  hovered?: boolean;\n}\n\n/**\n * @deprecated Этот компонент устарел и будет удален в 5.0.0.\n */\nexport const SliderSwitchButton: React.FunctionComponent<ButtonProps> = (\n  props: ButtonProps\n) => {\n  const { active, hovered, children, getRootRef, ...restProps } = props;\n  const platform = usePlatform();\n  const [focus, setFocus] = React.useState(false);\n\n  const toggleFocus = () => {\n    setFocus(!focus);\n  };\n\n  return (\n    <Tappable\n      {...restProps}\n      // eslint-disable-next-line vkui/no-object-expression-in-arguments\n      vkuiClass={classNames(getClassName(\"SliderSwitch__button\", platform), {\n        [\"SliderSwitch__button--active\"]: active,\n        [\"SliderSwitch__button--hover\"]: !active && hovered,\n        [\"SliderSwitch__button--activeHover\"]: active && hovered,\n        [\"SliderSwitch__button--focus\"]: focus && !hovered,\n      })}\n      Component=\"button\"\n      type=\"button\"\n      getRootRef={getRootRef}\n      aria-pressed={active}\n      onFocus={toggleFocus}\n      onBlur={toggleFocus}\n      tabIndex={0}\n      hasActive={false}\n      hoverMode=\"opacity\"\n    >\n      <Text weight=\"medium\">{children}</Text>\n    </Tappable>\n  );\n};\n"],"file":"SliderSwitchButton.js"}

package/dist/cssm/components/Snackbar/Snackbar.css

@@ -1 +1 @@
-.vkuiSnackbar{-webkit-user-select:none;user-select:none;z-index:101;position:fixed;bottom:0;left:auto;width:100%;padding-left:0;padding-left:var(--safe-area-inset-left);padding-right:0;padding-right:var(--safe-area-inset-right);padding-bottom:0;padding-bottom:var(--safe-area-inset-bottom)}.vkuiEpic .vkuiSnackbar{padding-bottom:calc(48px + 0px);padding-bottom:calc(var(--tabbar_height) + var(--safe-area-inset-bottom))}.vkuiSnackbar__in{padding:8px}.vkuiSnackbar--closing .vkuiSnackbar__in{-webkit-transform:translate3d(0,140%,0);transform:translate3d(0,140%,0)}.vkuiSnackbar__body{box-sizing:border-box;padding:12px 16px;min-height:56px;display:flex;align-items:center;background:#fff;background:var(--modal_card_background);box-shadow:0 0 24px 0 rgba(0,0,0,.24),0 0 2px 0 rgba(0,0,0,.08)}.vkuiSnackbar__before{margin-left:-4px;margin-right:12px}.vkuiSnackbar__after{margin-right:-4px;margin-left:12px}.vkuiSnackbar__content{flex:1;display:flex;align-items:center}.vkuiSnackbar--l-vertical .vkuiSnackbar__content{flex-direction:column;align-items:flex-start}.vkuiSnackbar__content-text{flex:1}.vkuiSnackbar__content-text{color:#000;color:var(--text_primary)}.vkuiSnackbar--l-horizontal .vkuiSnackbar__action{margin-right:-16px;position:relative;top:2px}.vkuiSnackbar--l-vertical .vkuiSnackbar__action{margin-top:2px;margin-bottom:-6px;margin-left:-16px}.vkuiModalRoot .vkuiSnackbar{padding-bottom:0;padding-bottom:var(--safe-area-inset-bottom)}.vkuiSnackbar--ios .vkuiSnackbar__in,.vkuiSnackbar--ios .vkuiSnackbar__body{transition:-webkit-transform 400ms cubic-bezier(.36,.66,.04,1);transition:transform 400ms cubic-bezier(.36,.66,.04,1);transition:transform 400ms cubic-bezier(.36,.66,.04,1),-webkit-transform 400ms cubic-bezier(.36,.66,.04,1);transition:-webkit-transform 400ms var(--ios-easing);transition:transform 400ms var(--ios-easing);transition:transform 400ms var(--ios-easing),-webkit-transform 400ms var(--ios-easing)}.vkuiSnackbar--ios .vkuiSnackbar__in{-webkit-animation:vkui-animation-snackbar-intro-vertical 340ms cubic-bezier(.36,.66,.04,1);animation:vkui-animation-snackbar-intro-vertical 340ms cubic-bezier(.36,.66,.04,1);-webkit-animation:vkui-animation-snackbar-intro-vertical 340ms var(--ios-easing);animation:vkui-animation-snackbar-intro-vertical 340ms var(--ios-easing)}.vkuiSnackbar--ios .vkuiSnackbar__body{border-radius:10px}.vkuiSnackbar--android .vkuiSnackbar__in,.vkuiSnackbar--android .vkuiSnackbar__body,.vkuiSnackbar--vkcom .vkuiSnackbar__in,.vkuiSnackbar--vkcom .vkuiSnackbar__body{transition:-webkit-transform 320ms cubic-bezier(.4,0,.2,1);transition:transform 320ms cubic-bezier(.4,0,.2,1);transition:transform 320ms cubic-bezier(.4,0,.2,1),-webkit-transform 320ms cubic-bezier(.4,0,.2,1);transition:-webkit-transform 320ms var(--android-easing);transition:transform 320ms var(--android-easing);transition:transform 320ms var(--android-easing),-webkit-transform 320ms var(--android-easing)}.vkuiSnackbar--android .vkuiSnackbar__in,.vkuiSnackbar--vkcom .vkuiSnackbar__in{-webkit-animation:vkui-animation-snackbar-intro-vertical 340ms cubic-bezier(.4,0,.2,1);animation:vkui-animation-snackbar-intro-vertical 340ms cubic-bezier(.4,0,.2,1);-webkit-animation:vkui-animation-snackbar-intro-vertical 340ms var(--android-easing);animation:vkui-animation-snackbar-intro-vertical 340ms var(--android-easing)}.vkuiSnackbar--android .vkuiSnackbar__body,.vkuiSnackbar--vkcom .vkuiSnackbar__body{border-radius:8px}.vkuiSnackbar--desktop{max-width:328px;left:0;bottom:0}.vkuiSnackbar--desktop .vkuiSnackbar__in{padding:12px;-webkit-animation-name:vkui-animation-snackbar-intro-horizontal;animation-name:vkui-animation-snackbar-intro-horizontal}.vkuiSnackbar--desktop.vkuiSnackbar--closing .vkuiSnackbar__in{-webkit-transform:translate3d(-140%,0,0);transform:translate3d(-140%,0,0)}.vkuiSnackbar--touched .vkuiSnackbar__body{transition:none}@-webkit-keyframes vkui-animation-snackbar-intro-vertical{0%{-webkit-transform:translate3d(0,140%,0);transform:translate3d(0,140%,0)}to{-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}}@keyframes vkui-animation-snackbar-intro-vertical{0%{-webkit-transform:translate3d(0,140%,0);transform:translate3d(0,140%,0)}to{-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}}@-webkit-keyframes vkui-animation-snackbar-intro-horizontal{0%{-webkit-transform:translate3d(-140%,0,0);transform:translate3d(-140%,0,0)}to{-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}}@keyframes vkui-animation-snackbar-intro-horizontal{0%{-webkit-transform:translate3d(-140%,0,0);transform:translate3d(-140%,0,0)}to{-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}}
+.vkuiSnackbar{-webkit-user-select:none;user-select:none;z-index:101;position:fixed;bottom:0;left:auto;width:100%;padding-left:0;padding-left:var(--safe-area-inset-left);padding-right:0;padding-right:var(--safe-area-inset-right);padding-bottom:0;padding-bottom:var(--safe-area-inset-bottom)}.vkuiEpic .vkuiSnackbar{padding-bottom:calc(48px + 0px);padding-bottom:calc(var(--tabbar_height) + var(--safe-area-inset-bottom))}.vkuiSnackbar__in{padding:8px}.vkuiSnackbar--closing .vkuiSnackbar__in{-webkit-transform:translate3d(0,140%,0);transform:translate3d(0,140%,0)}.vkuiSnackbar__body{box-sizing:border-box;padding:12px 16px;min-height:56px;display:flex;align-items:center;background:#fff;background:var(--modal_card_background);box-shadow:0 0 24px 0 rgba(0,0,0,.24),0 0 2px 0 rgba(0,0,0,.08)}.vkuiSnackbar__before{margin-left:-4px;margin-right:12px}.vkuiSnackbar__after{margin-right:-4px;margin-left:12px}.vkuiSnackbar__content{flex:1;display:flex;align-items:center;overflow:hidden}.vkuiSnackbar--l-vertical .vkuiSnackbar__content{flex-direction:column;align-items:flex-start}.vkuiSnackbar__content-text{flex:1;color:#000;color:var(--text_primary);width:100%;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}.vkuiSnackbar--l-horizontal .vkuiSnackbar__action{margin-right:-16px;position:relative;top:2px}.vkuiSnackbar--l-vertical .vkuiSnackbar__action{margin-top:2px;margin-bottom:-6px;margin-left:-16px}.vkuiModalRoot .vkuiSnackbar{padding-bottom:0;padding-bottom:var(--safe-area-inset-bottom)}.vkuiSnackbar--ios .vkuiSnackbar__in,.vkuiSnackbar--ios .vkuiSnackbar__body{transition:-webkit-transform 400ms cubic-bezier(.36,.66,.04,1);transition:transform 400ms cubic-bezier(.36,.66,.04,1);transition:transform 400ms cubic-bezier(.36,.66,.04,1),-webkit-transform 400ms cubic-bezier(.36,.66,.04,1);transition:-webkit-transform 400ms var(--ios-easing);transition:transform 400ms var(--ios-easing);transition:transform 400ms var(--ios-easing),-webkit-transform 400ms var(--ios-easing)}.vkuiSnackbar--ios .vkuiSnackbar__in{-webkit-animation:vkui-animation-snackbar-intro-vertical 340ms cubic-bezier(.36,.66,.04,1);animation:vkui-animation-snackbar-intro-vertical 340ms cubic-bezier(.36,.66,.04,1);-webkit-animation:vkui-animation-snackbar-intro-vertical 340ms var(--ios-easing);animation:vkui-animation-snackbar-intro-vertical 340ms var(--ios-easing)}.vkuiSnackbar--ios .vkuiSnackbar__body{border-radius:10px}.vkuiSnackbar--android .vkuiSnackbar__in,.vkuiSnackbar--android .vkuiSnackbar__body,.vkuiSnackbar--vkcom .vkuiSnackbar__in,.vkuiSnackbar--vkcom .vkuiSnackbar__body{transition:-webkit-transform 320ms cubic-bezier(.4,0,.2,1);transition:transform 320ms cubic-bezier(.4,0,.2,1);transition:transform 320ms cubic-bezier(.4,0,.2,1),-webkit-transform 320ms cubic-bezier(.4,0,.2,1);transition:-webkit-transform 320ms var(--android-easing);transition:transform 320ms var(--android-easing);transition:transform 320ms var(--android-easing),-webkit-transform 320ms var(--android-easing)}.vkuiSnackbar--android .vkuiSnackbar__in,.vkuiSnackbar--vkcom .vkuiSnackbar__in{-webkit-animation:vkui-animation-snackbar-intro-vertical 340ms cubic-bezier(.4,0,.2,1);animation:vkui-animation-snackbar-intro-vertical 340ms cubic-bezier(.4,0,.2,1);-webkit-animation:vkui-animation-snackbar-intro-vertical 340ms var(--android-easing);animation:vkui-animation-snackbar-intro-vertical 340ms var(--android-easing)}.vkuiSnackbar--android .vkuiSnackbar__body,.vkuiSnackbar--vkcom .vkuiSnackbar__body{border-radius:8px}.vkuiSnackbar--desktop{max-width:328px;left:0;bottom:0}.vkuiSnackbar--desktop .vkuiSnackbar__in{padding:12px;-webkit-animation-name:vkui-animation-snackbar-intro-horizontal;animation-name:vkui-animation-snackbar-intro-horizontal}.vkuiSnackbar--desktop.vkuiSnackbar--closing .vkuiSnackbar__in{-webkit-transform:translate3d(-140%,0,0);transform:translate3d(-140%,0,0)}.vkuiSnackbar--touched .vkuiSnackbar__body{transition:none}@-webkit-keyframes vkui-animation-snackbar-intro-vertical{0%{-webkit-transform:translate3d(0,140%,0);transform:translate3d(0,140%,0)}to{-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}}@keyframes vkui-animation-snackbar-intro-vertical{0%{-webkit-transform:translate3d(0,140%,0);transform:translate3d(0,140%,0)}to{-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}}@-webkit-keyframes vkui-animation-snackbar-intro-horizontal{0%{-webkit-transform:translate3d(-140%,0,0);transform:translate3d(-140%,0,0)}to{-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}}@keyframes vkui-animation-snackbar-intro-horizontal{0%{-webkit-transform:translate3d(-140%,0,0);transform:translate3d(-140%,0,0)}to{-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}}

package/dist/cssm/components/Snackbar/Snackbar.js

@@ -11,7 +11,7 @@ import { ANDROID, VKCOM } from "../../lib/platform";
 import { rubber } from "../../lib/touch";
 import { withAdaptivity, ViewWidth } from "../../hoc/withAdaptivity";
 import Text from "../Typography/Text/Text";
-import Button from "../Button/Button";
+import { Button } from "../Button/Button";
 import { AppRootPortal } from "../AppRoot/AppRootPortal";
 import { useWaitTransitionFinish } from "../../hooks/useWaitTransitionFinish";
 import { usePlatform } from "../../hooks/usePlatform";
@@ -140,6 +140,7 @@ var SnackbarComponent = function SnackbarComponent(props) {
   }, [closeTimeout]);
   var resolvedLayout = after || isDesktop ? "vertical" : layout;
   return createScopedElement(AppRootPortal, null, createScopedElement("div", _extends({}, restProps, {
+    // eslint-disable-next-line vkui/no-object-expression-in-arguments
     vkuiClass: classNames(getClassName("Snackbar", platform), "Snackbar--l-".concat(resolvedLayout), {
       "Snackbar--closing": closing,
       "Snackbar--touched": touched,

package/dist/cssm/components/Snackbar/Snackbar.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/components/Snackbar/Snackbar.tsx"],"names":["React","Touch","classNames","getClassName","ANDROID","VKCOM","rubber","withAdaptivity","ViewWidth","Text","Button","AppRootPortal","useWaitTransitionFinish","usePlatform","useTimeout","SnackbarComponent","props","children","layout","action","before","after","viewWidth","duration","onActionClick","onClose","restProps","platform","waitTransitionFinish","useState","closing","setClosing","touched","setTouched","shiftXPercentRef","useRef","shiftXCurrentRef","bodyElRef","innerElRef","animationFrameRef","isDesktop","SMALL_TABLET","transitionFinishDurationFallback","close","current","handleActionClick","e","closeTimeout","setBodyTransform","percent","cancelAnimationFrame","requestAnimationFrame","style","transform","onTouchStart","clear","onTouchMoveX","event","shiftX","originalEvent","preventDefault","offsetWidth","onTouchEnd","callback","shiftXCurrent","expectTranslateY","set","useEffect","resolvedLayout","displayName","defaultProps","Snackbar"],"mappings":"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","sourcesContent":["import * as React from \"react\";\nimport { Touch, TouchEvent } from \"../Touch/Touch\";\nimport { classNames } from \"../../lib/classNames\";\nimport { HasPlatform } from \"../../types\";\nimport { getClassName } from \"../../helpers/getClassName\";\nimport { ANDROID, VKCOM } from \"../../lib/platform\";\nimport { rubber } from \"../../lib/touch\";\nimport { withAdaptivity, ViewWidth } from \"../../hoc/withAdaptivity\";\nimport Text from \"../Typography/Text/Text\";\nimport Button from \"../Button/Button\";\nimport { AppRootPortal } from \"../AppRoot/AppRootPortal\";\nimport { useWaitTransitionFinish } from \"../../hooks/useWaitTransitionFinish\";\nimport { usePlatform } from \"../../hooks/usePlatform\";\nimport { useTimeout } from \"../../hooks/useTimeout\";\nimport {\n  AdaptivityContextInterface,\n  AdaptivityProps,\n} from \"../AdaptivityProvider/AdaptivityContext\";\nimport \"./Snackbar.css\";\n\nexport interface SnackbarProps\n  extends React.HTMLAttributes<HTMLElement>,\n    HasPlatform,\n    AdaptivityProps {\n  /**\n   * Название кнопки действия в уведомлении\n   */\n  action?: string | React.ComponentType;\n\n  /**\n   * Будет вызвано при клике на кнопку действия\n   */\n  onActionClick?: (e: React.MouseEvent) => void;\n\n  /**\n   * Цветная иконка 24x24 пикселя\n   */\n  before?: React.ReactNode;\n  /**\n   * Контент в правой части, может быть `<Avatar size={32} />`\n   */\n  after?: React.ReactNode;\n  /**\n   * Варианты расположения кнопки\n   */\n  layout?: \"vertical\" | \"horizontal\";\n  /**\n   * Время в миллисекундах, через которое плашка скроется\n   */\n  duration?: number;\n  /**\n   * Обработчик закрытия уведомления\n   */\n  onClose: () => void;\n}\n\nconst SnackbarComponent: React.FC<\n  SnackbarProps & AdaptivityContextInterface\n> = (props) => {\n  const {\n    children,\n    layout,\n    action,\n    before,\n    after,\n    viewWidth,\n    duration = 0,\n    onActionClick,\n    onClose,\n    ...restProps\n  } = props;\n\n  const platform = usePlatform();\n\n  const { waitTransitionFinish } = useWaitTransitionFinish();\n\n  const [closing, setClosing] = React.useState(false);\n  const [touched, setTouched] = React.useState(false);\n\n  const shiftXPercentRef = React.useRef<number>(0);\n  const shiftXCurrentRef = React.useRef<number>(0);\n\n  const bodyElRef = React.useRef<HTMLDivElement | null>(null);\n  const innerElRef = React.useRef<HTMLDivElement | null>(null);\n\n  const animationFrameRef = React.useRef<ReturnType<\n    typeof requestAnimationFrame\n  > | null>(null);\n\n  const isDesktop = viewWidth >= ViewWidth.SMALL_TABLET;\n  const transitionFinishDurationFallback =\n    platform === ANDROID || platform === VKCOM ? 400 : 320;\n\n  const close = () => {\n    setClosing(true);\n    waitTransitionFinish(\n      innerElRef.current,\n      () => {\n        onClose();\n      },\n      transitionFinishDurationFallback\n    );\n  };\n\n  const handleActionClick: React.MouseEventHandler<HTMLElement> = (e) => {\n    close();\n\n    if (action && typeof onActionClick === \"function\") {\n      onActionClick(e);\n    }\n  };\n\n  const closeTimeout = useTimeout(close, duration);\n\n  const setBodyTransform = (percent: number) => {\n    if (animationFrameRef.current !== null) {\n      cancelAnimationFrame(animationFrameRef.current);\n    }\n    animationFrameRef.current = requestAnimationFrame(() => {\n      if (bodyElRef.current) {\n        bodyElRef.current.style.transform = `translate3d(${percent}%, 0, 0)`;\n      }\n    });\n  };\n\n  const onTouchStart = closeTimeout.clear;\n\n  const onTouchMoveX = (event: TouchEvent) => {\n    const { shiftX, originalEvent } = event;\n    originalEvent.preventDefault();\n\n    if (!touched) {\n      setTouched(true);\n    }\n\n    shiftXPercentRef.current =\n      (shiftX / (bodyElRef.current?.offsetWidth ?? 0)) * 100;\n    shiftXCurrentRef.current = rubber(\n      shiftXPercentRef.current,\n      72,\n      1.2,\n      platform === ANDROID || platform === VKCOM\n    );\n\n    setBodyTransform(shiftXCurrentRef.current);\n  };\n\n  const onTouchEnd = (e: TouchEvent) => {\n    let callback: VoidFunction | undefined;\n\n    if (touched) {\n      let shiftXCurrent = shiftXCurrentRef.current;\n      const expectTranslateY = (shiftXCurrent / e.duration) * 240 * 0.6;\n      shiftXCurrent = shiftXCurrent + expectTranslateY;\n\n      if (isDesktop && shiftXCurrent <= -50) {\n        closeTimeout.clear();\n        waitTransitionFinish(\n          bodyElRef.current,\n          () => {\n            onClose();\n          },\n          transitionFinishDurationFallback\n        );\n        setBodyTransform(-120);\n      } else if (!isDesktop && shiftXCurrent >= 50) {\n        closeTimeout.clear();\n        waitTransitionFinish(\n          bodyElRef.current,\n          () => {\n            onClose();\n          },\n          transitionFinishDurationFallback\n        );\n        setBodyTransform(120);\n      } else {\n        callback = () => {\n          closeTimeout.set();\n          setBodyTransform(0);\n        };\n      }\n    } else {\n      closeTimeout.set();\n    }\n\n    setTouched(false);\n    callback && requestAnimationFrame(callback);\n  };\n\n  React.useEffect(() => closeTimeout.set(), [closeTimeout]);\n\n  const resolvedLayout = after || isDesktop ? \"vertical\" : layout;\n\n  return (\n    <AppRootPortal>\n      <div\n        {...restProps}\n        vkuiClass={classNames(\n          getClassName(\"Snackbar\", platform),\n          `Snackbar--l-${resolvedLayout}`,\n          {\n            \"Snackbar--closing\": closing,\n            \"Snackbar--touched\": touched,\n            \"Snackbar--desktop\": isDesktop,\n          }\n        )}\n      >\n        <Touch\n          vkuiClass=\"Snackbar__in\"\n          getRootRef={innerElRef}\n          onStart={onTouchStart}\n          onMoveX={onTouchMoveX}\n          onEnd={onTouchEnd}\n        >\n          <div vkuiClass=\"Snackbar__body\" ref={bodyElRef}>\n            {before && <div vkuiClass=\"Snackbar__before\">{before}</div>}\n\n            <div vkuiClass=\"Snackbar__content\">\n              <Text weight=\"regular\" vkuiClass=\"Snackbar__content-text\">\n                {children}\n              </Text>\n\n              {action && (\n                <Button\n                  align=\"left\"\n                  hasHover={false}\n                  mode=\"tertiary\"\n                  size=\"s\"\n                  vkuiClass=\"Snackbar__action\"\n                  onClick={handleActionClick}\n                >\n                  {action}\n                </Button>\n              )}\n            </div>\n\n            {after && <div vkuiClass=\"Snackbar__after\">{after}</div>}\n          </div>\n        </Touch>\n      </div>\n    </AppRootPortal>\n  );\n};\n\nSnackbarComponent.displayName = \"Snackbar\";\n\nSnackbarComponent.defaultProps = {\n  duration: 4000,\n  layout: \"horizontal\",\n};\n\nexport const Snackbar = withAdaptivity(SnackbarComponent, {\n  viewWidth: true,\n});\n"],"file":"Snackbar.js"}
+{"version":3,"sources":["../../../../src/components/Snackbar/Snackbar.tsx"],"names":["React","Touch","classNames","getClassName","ANDROID","VKCOM","rubber","withAdaptivity","ViewWidth","Text","Button","AppRootPortal","useWaitTransitionFinish","usePlatform","useTimeout","SnackbarComponent","props","children","layout","action","before","after","viewWidth","duration","onActionClick","onClose","restProps","platform","waitTransitionFinish","useState","closing","setClosing","touched","setTouched","shiftXPercentRef","useRef","shiftXCurrentRef","bodyElRef","innerElRef","animationFrameRef","isDesktop","SMALL_TABLET","transitionFinishDurationFallback","close","current","handleActionClick","e","closeTimeout","setBodyTransform","percent","cancelAnimationFrame","requestAnimationFrame","style","transform","onTouchStart","clear","onTouchMoveX","event","shiftX","originalEvent","preventDefault","offsetWidth","onTouchEnd","callback","shiftXCurrent","expectTranslateY","set","useEffect","resolvedLayout","displayName","defaultProps","Snackbar"],"mappings":"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","sourcesContent":["import * as React from \"react\";\nimport { Touch, TouchEvent } from \"../Touch/Touch\";\nimport { classNames } from \"../../lib/classNames\";\nimport { HasPlatform } from \"../../types\";\nimport { getClassName } from \"../../helpers/getClassName\";\nimport { ANDROID, VKCOM } from \"../../lib/platform\";\nimport { rubber } from \"../../lib/touch\";\nimport { withAdaptivity, ViewWidth } from \"../../hoc/withAdaptivity\";\nimport Text from \"../Typography/Text/Text\";\nimport { Button } from \"../Button/Button\";\nimport { AppRootPortal } from \"../AppRoot/AppRootPortal\";\nimport { useWaitTransitionFinish } from \"../../hooks/useWaitTransitionFinish\";\nimport { usePlatform } from \"../../hooks/usePlatform\";\nimport { useTimeout } from \"../../hooks/useTimeout\";\nimport {\n  AdaptivityContextInterface,\n  AdaptivityProps,\n} from \"../AdaptivityProvider/AdaptivityContext\";\nimport \"./Snackbar.css\";\n\nexport interface SnackbarProps\n  extends React.HTMLAttributes<HTMLElement>,\n    HasPlatform,\n    AdaptivityProps {\n  /**\n   * Название кнопки действия в уведомлении\n   */\n  action?: string | React.ComponentType;\n\n  /**\n   * Будет вызвано при клике на кнопку действия\n   */\n  onActionClick?: (e: React.MouseEvent) => void;\n\n  /**\n   * Цветная иконка 24x24 пикселя\n   */\n  before?: React.ReactNode;\n  /**\n   * Контент в правой части, может быть `<Avatar size={32} />`\n   */\n  after?: React.ReactNode;\n  /**\n   * Варианты расположения кнопки\n   */\n  layout?: \"vertical\" | \"horizontal\";\n  /**\n   * Время в миллисекундах, через которое плашка скроется\n   */\n  duration?: number;\n  /**\n   * Обработчик закрытия уведомления\n   */\n  onClose: () => void;\n}\n\nconst SnackbarComponent: React.FC<\n  SnackbarProps & AdaptivityContextInterface\n> = (props) => {\n  const {\n    children,\n    layout,\n    action,\n    before,\n    after,\n    viewWidth,\n    duration = 0,\n    onActionClick,\n    onClose,\n    ...restProps\n  } = props;\n\n  const platform = usePlatform();\n\n  const { waitTransitionFinish } = useWaitTransitionFinish();\n\n  const [closing, setClosing] = React.useState(false);\n  const [touched, setTouched] = React.useState(false);\n\n  const shiftXPercentRef = React.useRef<number>(0);\n  const shiftXCurrentRef = React.useRef<number>(0);\n\n  const bodyElRef = React.useRef<HTMLDivElement | null>(null);\n  const innerElRef = React.useRef<HTMLDivElement | null>(null);\n\n  const animationFrameRef = React.useRef<ReturnType<\n    typeof requestAnimationFrame\n  > | null>(null);\n\n  const isDesktop = viewWidth >= ViewWidth.SMALL_TABLET;\n  const transitionFinishDurationFallback =\n    platform === ANDROID || platform === VKCOM ? 400 : 320;\n\n  const close = () => {\n    setClosing(true);\n    waitTransitionFinish(\n      innerElRef.current,\n      () => {\n        onClose();\n      },\n      transitionFinishDurationFallback\n    );\n  };\n\n  const handleActionClick: React.MouseEventHandler<HTMLElement> = (e) => {\n    close();\n\n    if (action && typeof onActionClick === \"function\") {\n      onActionClick(e);\n    }\n  };\n\n  const closeTimeout = useTimeout(close, duration);\n\n  const setBodyTransform = (percent: number) => {\n    if (animationFrameRef.current !== null) {\n      cancelAnimationFrame(animationFrameRef.current);\n    }\n    animationFrameRef.current = requestAnimationFrame(() => {\n      if (bodyElRef.current) {\n        bodyElRef.current.style.transform = `translate3d(${percent}%, 0, 0)`;\n      }\n    });\n  };\n\n  const onTouchStart = closeTimeout.clear;\n\n  const onTouchMoveX = (event: TouchEvent) => {\n    const { shiftX, originalEvent } = event;\n    originalEvent.preventDefault();\n\n    if (!touched) {\n      setTouched(true);\n    }\n\n    shiftXPercentRef.current =\n      (shiftX / (bodyElRef.current?.offsetWidth ?? 0)) * 100;\n    shiftXCurrentRef.current = rubber(\n      shiftXPercentRef.current,\n      72,\n      1.2,\n      platform === ANDROID || platform === VKCOM\n    );\n\n    setBodyTransform(shiftXCurrentRef.current);\n  };\n\n  const onTouchEnd = (e: TouchEvent) => {\n    let callback: VoidFunction | undefined;\n\n    if (touched) {\n      let shiftXCurrent = shiftXCurrentRef.current;\n      const expectTranslateY = (shiftXCurrent / e.duration) * 240 * 0.6;\n      shiftXCurrent = shiftXCurrent + expectTranslateY;\n\n      if (isDesktop && shiftXCurrent <= -50) {\n        closeTimeout.clear();\n        waitTransitionFinish(\n          bodyElRef.current,\n          () => {\n            onClose();\n          },\n          transitionFinishDurationFallback\n        );\n        setBodyTransform(-120);\n      } else if (!isDesktop && shiftXCurrent >= 50) {\n        closeTimeout.clear();\n        waitTransitionFinish(\n          bodyElRef.current,\n          () => {\n            onClose();\n          },\n          transitionFinishDurationFallback\n        );\n        setBodyTransform(120);\n      } else {\n        callback = () => {\n          closeTimeout.set();\n          setBodyTransform(0);\n        };\n      }\n    } else {\n      closeTimeout.set();\n    }\n\n    setTouched(false);\n    callback && requestAnimationFrame(callback);\n  };\n\n  React.useEffect(() => closeTimeout.set(), [closeTimeout]);\n\n  const resolvedLayout = after || isDesktop ? \"vertical\" : layout;\n\n  return (\n    <AppRootPortal>\n      <div\n        {...restProps}\n        // eslint-disable-next-line vkui/no-object-expression-in-arguments\n        vkuiClass={classNames(\n          getClassName(\"Snackbar\", platform),\n          `Snackbar--l-${resolvedLayout}`,\n          {\n            \"Snackbar--closing\": closing,\n            \"Snackbar--touched\": touched,\n            \"Snackbar--desktop\": isDesktop,\n          }\n        )}\n      >\n        <Touch\n          vkuiClass=\"Snackbar__in\"\n          getRootRef={innerElRef}\n          onStart={onTouchStart}\n          onMoveX={onTouchMoveX}\n          onEnd={onTouchEnd}\n        >\n          <div vkuiClass=\"Snackbar__body\" ref={bodyElRef}>\n            {before && <div vkuiClass=\"Snackbar__before\">{before}</div>}\n\n            <div vkuiClass=\"Snackbar__content\">\n              <Text weight=\"regular\" vkuiClass=\"Snackbar__content-text\">\n                {children}\n              </Text>\n\n              {action && (\n                <Button\n                  align=\"left\"\n                  hasHover={false}\n                  mode=\"tertiary\"\n                  size=\"s\"\n                  vkuiClass=\"Snackbar__action\"\n                  onClick={handleActionClick}\n                >\n                  {action}\n                </Button>\n              )}\n            </div>\n\n            {after && <div vkuiClass=\"Snackbar__after\">{after}</div>}\n          </div>\n        </Touch>\n      </div>\n    </AppRootPortal>\n  );\n};\n\nSnackbarComponent.displayName = \"Snackbar\";\n\nSnackbarComponent.defaultProps = {\n  duration: 4000,\n  layout: \"horizontal\",\n};\n\nexport const Snackbar = withAdaptivity(SnackbarComponent, {\n  viewWidth: true,\n});\n"],"file":"Snackbar.js"}

package/dist/cssm/components/Spacing/Spacing.js

@@ -20,7 +20,8 @@ export var Spacing = function Spacing(_ref) {
   }, style);
 
   return createScopedElement("div", _extends({}, restProps, {
-    "aria-hidden": "true",
+    "aria-hidden": "true" // eslint-disable-next-line vkui/no-object-expression-in-arguments
+    ,
     vkuiClass: classNames(getClassName("Spacing", platform), {
       "Spacing--separator": !!separator,
       "Spacing--separator-center": separator === true || separator === "center",

package/dist/cssm/components/Spacing/Spacing.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/components/Spacing/Spacing.tsx"],"names":["classNames","usePlatform","getClassName","Spacing","size","separator","style","restProps","platform","styles","height","defaultProps"],"mappings":";;;;;AACA,SAASA,UAAT;AACA,SAASC,WAAT;AACA,SAASC,YAAT;AACA;AAkBA,OAAO,IAAMC,OAA+B,GAAG,SAAlCA,OAAkC,OAK3B;AAAA,MAJlBC,IAIkB,QAJlBA,IAIkB;AAAA,MAHlBC,SAGkB,QAHlBA,SAGkB;AAAA,MAFlBC,KAEkB,QAFlBA,KAEkB;AAAA,MADfC,SACe;;AAClB,MAAMC,QAAQ,GAAGP,WAAW,EAA5B;;AACA,MAAMQ,MAAM;AACVC,IAAAA,MAAM,EAAEN;AADE,KAEPE,KAFO,CAAZ;;AAKA,SACE,wCACMC,SADN;AAEE,mBAAY,MAFd;AAGE,IAAA,SAAS,EAAEP,UAAU,CAACE,YAAY,CAAC,SAAD,EAAYM,QAAZ,CAAb,EAAoC;AACvD,4BAAsB,CAAC,CAACH,SAD+B;AAEvD,mCACEA,SAAS,KAAK,IAAd,IAAsBA,SAAS,KAAK,QAHiB;AAIvD,gCAA0BA,SAAS,KAAK,KAJe;AAKvD,mCAA6BA,SAAS,KAAK;AALY,KAApC,CAHvB;AAUE,IAAA,KAAK,EAAEI;AAVT,KADF;AAcD,CA1BM;AA4BPN,OAAO,CAACQ,YAAR,GAAuB;AACrBP,EAAAA,IAAI,EAAE;AADe,CAAvB","sourcesContent":["import * as React from \"react\";\nimport { classNames } from \"../../lib/classNames\";\nimport { usePlatform } from \"../../hooks/usePlatform\";\nimport { getClassName } from \"../../helpers/getClassName\";\nimport \"./Spacing.css\";\n\nexport interface SpacingProps extends React.HTMLAttributes<HTMLDivElement> {\n  /**\n   * Высота спэйсинга\n   */\n  size?: number;\n  /**\n   * Настройка положения сепаратора:\n   *\n   * - separator=false (default) - без сепаратора\n   * - separator=true | separator='center' - сепаратор располагается по середине\n   * - separator='top'\n   * - separator='bottom'\n   */\n  separator?: boolean | \"top\" | \"bottom\" | \"center\";\n}\n\nexport const Spacing: React.FC<SpacingProps> = ({\n  size,\n  separator,\n  style,\n  ...restProps\n}: SpacingProps) => {\n  const platform = usePlatform();\n  const styles = {\n    height: size,\n    ...style,\n  };\n\n  return (\n    <div\n      {...restProps}\n      aria-hidden=\"true\"\n      vkuiClass={classNames(getClassName(\"Spacing\", platform), {\n        \"Spacing--separator\": !!separator,\n        \"Spacing--separator-center\":\n          separator === true || separator === \"center\",\n        \"Spacing--separator-top\": separator === \"top\",\n        \"Spacing--separator-bottom\": separator === \"bottom\",\n      })}\n      style={styles}\n    />\n  );\n};\n\nSpacing.defaultProps = {\n  size: 8,\n};\n"],"file":"Spacing.js"}
+{"version":3,"sources":["../../../../src/components/Spacing/Spacing.tsx"],"names":["classNames","usePlatform","getClassName","Spacing","size","separator","style","restProps","platform","styles","height","defaultProps"],"mappings":";;;;;AACA,SAASA,UAAT;AACA,SAASC,WAAT;AACA,SAASC,YAAT;AACA;AAkBA,OAAO,IAAMC,OAA+B,GAAG,SAAlCA,OAAkC,OAK3B;AAAA,MAJlBC,IAIkB,QAJlBA,IAIkB;AAAA,MAHlBC,SAGkB,QAHlBA,SAGkB;AAAA,MAFlBC,KAEkB,QAFlBA,KAEkB;AAAA,MADfC,SACe;;AAClB,MAAMC,QAAQ,GAAGP,WAAW,EAA5B;;AACA,MAAMQ,MAAM;AACVC,IAAAA,MAAM,EAAEN;AADE,KAEPE,KAFO,CAAZ;;AAKA,SACE,wCACMC,SADN;AAEE,mBAAY,MAFd,CAGE;AAHF;AAIE,IAAA,SAAS,EAAEP,UAAU,CAACE,YAAY,CAAC,SAAD,EAAYM,QAAZ,CAAb,EAAoC;AACvD,4BAAsB,CAAC,CAACH,SAD+B;AAEvD,mCACEA,SAAS,KAAK,IAAd,IAAsBA,SAAS,KAAK,QAHiB;AAIvD,gCAA0BA,SAAS,KAAK,KAJe;AAKvD,mCAA6BA,SAAS,KAAK;AALY,KAApC,CAJvB;AAWE,IAAA,KAAK,EAAEI;AAXT,KADF;AAeD,CA3BM;AA6BPN,OAAO,CAACQ,YAAR,GAAuB;AACrBP,EAAAA,IAAI,EAAE;AADe,CAAvB","sourcesContent":["import * as React from \"react\";\nimport { classNames } from \"../../lib/classNames\";\nimport { usePlatform } from \"../../hooks/usePlatform\";\nimport { getClassName } from \"../../helpers/getClassName\";\nimport \"./Spacing.css\";\n\nexport interface SpacingProps extends React.HTMLAttributes<HTMLDivElement> {\n  /**\n   * Высота спэйсинга\n   */\n  size?: number;\n  /**\n   * Настройка положения сепаратора:\n   *\n   * - separator=false (default) - без сепаратора\n   * - separator=true | separator='center' - сепаратор располагается по середине\n   * - separator='top'\n   * - separator='bottom'\n   */\n  separator?: boolean | \"top\" | \"bottom\" | \"center\";\n}\n\nexport const Spacing: React.FC<SpacingProps> = ({\n  size,\n  separator,\n  style,\n  ...restProps\n}: SpacingProps) => {\n  const platform = usePlatform();\n  const styles = {\n    height: size,\n    ...style,\n  };\n\n  return (\n    <div\n      {...restProps}\n      aria-hidden=\"true\"\n      // eslint-disable-next-line vkui/no-object-expression-in-arguments\n      vkuiClass={classNames(getClassName(\"Spacing\", platform), {\n        \"Spacing--separator\": !!separator,\n        \"Spacing--separator-center\":\n          separator === true || separator === \"center\",\n        \"Spacing--separator-top\": separator === \"top\",\n        \"Spacing--separator-bottom\": separator === \"bottom\",\n      })}\n      style={styles}\n    />\n  );\n};\n\nSpacing.defaultProps = {\n  size: 8,\n};\n"],"file":"Spacing.js"}

package/dist/cssm/components/SplitCol/SplitCol.js

@@ -35,7 +35,8 @@ export var SplitCol = function SplitCol(props) {
       maxWidth: maxWidth,
       minWidth: minWidth
     }),
-    ref: baseRef,
+    ref: baseRef // eslint-disable-next-line vkui/no-object-expression-in-arguments
+    ,
     vkuiClass: classNames("SplitCol", {
       "SplitCol--spaced": spaced,
       "SplitCol--fixed": fixed

package/dist/cssm/components/SplitCol/SplitCol.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/components/SplitCol/SplitCol.tsx"],"names":["React","classNames","SplitColContext","createContext","colRef","animate","SplitCol","props","children","width","maxWidth","minWidth","spaced","fixed","style","restProps","baseRef","useRef","contextValue","useMemo"],"mappings":";;;;;AAAA,OAAO,KAAKA,KAAZ,MAAuB,OAAvB;AACA,SAASC,UAAT;AACA;AAOA,OAAO,IAAMC,eAAe,gBAAGF,KAAK,CAACG,aAAN,CAA0C;AACvEC,EAAAA,MAAM,EAAE,IAD+D;AAEvEC,EAAAA,OAAO,EAAE;AAF8D,CAA1C,CAAxB;AAoBP,OAAO,IAAMC,QAAiC,GAAG,SAApCA,QAAoC,CAACC,KAAD,EAA0B;AACzE,MACEC,QADF,GAUID,KAVJ,CACEC,QADF;AAAA,MAEEC,KAFF,GAUIF,KAVJ,CAEEE,KAFF;AAAA,MAGEC,QAHF,GAUIH,KAVJ,CAGEG,QAHF;AAAA,MAIEC,QAJF,GAUIJ,KAVJ,CAIEI,QAJF;AAAA,MAKEC,MALF,GAUIL,KAVJ,CAKEK,MALF;AAAA,uBAUIL,KAVJ,CAMEF,OANF;AAAA,MAMEA,OANF,+BAMY,KANZ;AAAA,MAOEQ,KAPF,GAUIN,KAVJ,CAOEM,KAPF;AAAA,MAQEC,KARF,GAUIP,KAVJ,CAQEO,KARF;AAAA,MASKC,SATL,4BAUIR,KAVJ;;AAWA,MAAMS,OAAO,GAAGhB,KAAK,CAACiB,MAAN,CAA6B,IAA7B,CAAhB;AAEA,MAAMC,YAAY,GAAGlB,KAAK,CAACmB,OAAN,CAAc,YAAM;AACvC,WAAO;AACLf,MAAAA,MAAM,EAAEY,OADH;AAELX,MAAAA,OAAO,EAAPA;AAFK,KAAP;AAID,GALoB,EAKlB,CAACW,OAAD,EAAUX,OAAV,CALkB,CAArB;AAOA,SACE,wCACMU,SADN;AAEE,IAAA,KAAK,kCACAD,KADA;AAEHL,MAAAA,KAAK,EAAEA,KAFJ;AAGHC,MAAAA,QAAQ,EAAEA,QAHP;AAIHC,MAAAA,QAAQ,EAAEA;AAJP,MAFP;AAQE,IAAA,GAAG,EAAEK,OARP;AASE,IAAA,SAAS,EAAEf,UAAU,CAAC,UAAD,EAAa;AAChC,0BAAoBW,MADY;AAEhC,yBAAmBC;AAFa,KAAb;AATvB,MAcE,oBAAC,eAAD,CAAiB,QAAjB;AAA0B,IAAA,KAAK,EAAEK;AAAjC,KACGL,KAAK,GACJ;AAAK,IAAA,SAAS,EAAC;AAAf,KAAuCL,QAAvC,CADI,GAGJA,QAJJ,CAdF,CADF;AAwBD,CA7CM","sourcesContent":["import * as React from \"react\";\nimport { classNames } from \"../../lib/classNames\";\nimport \"./SplitCol.css\";\n\nexport interface SplitColContextProps {\n  colRef: React.RefObject<HTMLDivElement> | null;\n  animate: boolean;\n}\n\nexport const SplitColContext = React.createContext<SplitColContextProps>({\n  colRef: null,\n  animate: true,\n});\n\nexport interface SplitColProps extends React.HTMLAttributes<HTMLDivElement> {\n  width?: number | string;\n  maxWidth?: number | string;\n  minWidth?: number | string;\n  /**\n   * Если false, то переходы между Panel происходят без анимации\n   */\n  animate?: boolean;\n  /**\n   * Если true, то добавляются боковые отступы фиксированной величины\n   */\n  spaced?: boolean;\n  fixed?: boolean;\n}\n\nexport const SplitCol: React.FC<SplitColProps> = (props: SplitColProps) => {\n  const {\n    children,\n    width,\n    maxWidth,\n    minWidth,\n    spaced,\n    animate = false,\n    fixed,\n    style,\n    ...restProps\n  } = props;\n  const baseRef = React.useRef<HTMLDivElement>(null);\n\n  const contextValue = React.useMemo(() => {\n    return {\n      colRef: baseRef,\n      animate,\n    };\n  }, [baseRef, animate]);\n\n  return (\n    <div\n      {...restProps}\n      style={{\n        ...style,\n        width: width,\n        maxWidth: maxWidth,\n        minWidth: minWidth,\n      }}\n      ref={baseRef}\n      vkuiClass={classNames(\"SplitCol\", {\n        \"SplitCol--spaced\": spaced,\n        \"SplitCol--fixed\": fixed,\n      })}\n    >\n      <SplitColContext.Provider value={contextValue}>\n        {fixed ? (\n          <div vkuiClass=\"SplitCol__fixedInner\">{children}</div>\n        ) : (\n          children\n        )}\n      </SplitColContext.Provider>\n    </div>\n  );\n};\n"],"file":"SplitCol.js"}
+{"version":3,"sources":["../../../../src/components/SplitCol/SplitCol.tsx"],"names":["React","classNames","SplitColContext","createContext","colRef","animate","SplitCol","props","children","width","maxWidth","minWidth","spaced","fixed","style","restProps","baseRef","useRef","contextValue","useMemo"],"mappings":";;;;;AAAA,OAAO,KAAKA,KAAZ,MAAuB,OAAvB;AACA,SAASC,UAAT;AACA;AAOA,OAAO,IAAMC,eAAe,gBAAGF,KAAK,CAACG,aAAN,CAA0C;AACvEC,EAAAA,MAAM,EAAE,IAD+D;AAEvEC,EAAAA,OAAO,EAAE;AAF8D,CAA1C,CAAxB;AAoBP,OAAO,IAAMC,QAAiC,GAAG,SAApCA,QAAoC,CAACC,KAAD,EAA0B;AACzE,MACEC,QADF,GAUID,KAVJ,CACEC,QADF;AAAA,MAEEC,KAFF,GAUIF,KAVJ,CAEEE,KAFF;AAAA,MAGEC,QAHF,GAUIH,KAVJ,CAGEG,QAHF;AAAA,MAIEC,QAJF,GAUIJ,KAVJ,CAIEI,QAJF;AAAA,MAKEC,MALF,GAUIL,KAVJ,CAKEK,MALF;AAAA,uBAUIL,KAVJ,CAMEF,OANF;AAAA,MAMEA,OANF,+BAMY,KANZ;AAAA,MAOEQ,KAPF,GAUIN,KAVJ,CAOEM,KAPF;AAAA,MAQEC,KARF,GAUIP,KAVJ,CAQEO,KARF;AAAA,MASKC,SATL,4BAUIR,KAVJ;;AAWA,MAAMS,OAAO,GAAGhB,KAAK,CAACiB,MAAN,CAA6B,IAA7B,CAAhB;AAEA,MAAMC,YAAY,GAAGlB,KAAK,CAACmB,OAAN,CAAc,YAAM;AACvC,WAAO;AACLf,MAAAA,MAAM,EAAEY,OADH;AAELX,MAAAA,OAAO,EAAPA;AAFK,KAAP;AAID,GALoB,EAKlB,CAACW,OAAD,EAAUX,OAAV,CALkB,CAArB;AAOA,SACE,wCACMU,SADN;AAEE,IAAA,KAAK,kCACAD,KADA;AAEHL,MAAAA,KAAK,EAAEA,KAFJ;AAGHC,MAAAA,QAAQ,EAAEA,QAHP;AAIHC,MAAAA,QAAQ,EAAEA;AAJP,MAFP;AAQE,IAAA,GAAG,EAAEK,OARP,CASE;AATF;AAUE,IAAA,SAAS,EAAEf,UAAU,CAAC,UAAD,EAAa;AAChC,0BAAoBW,MADY;AAEhC,yBAAmBC;AAFa,KAAb;AAVvB,MAeE,oBAAC,eAAD,CAAiB,QAAjB;AAA0B,IAAA,KAAK,EAAEK;AAAjC,KACGL,KAAK,GACJ;AAAK,IAAA,SAAS,EAAC;AAAf,KAAuCL,QAAvC,CADI,GAGJA,QAJJ,CAfF,CADF;AAyBD,CA9CM","sourcesContent":["import * as React from \"react\";\nimport { classNames } from \"../../lib/classNames\";\nimport \"./SplitCol.css\";\n\nexport interface SplitColContextProps {\n  colRef: React.RefObject<HTMLDivElement> | null;\n  animate: boolean;\n}\n\nexport const SplitColContext = React.createContext<SplitColContextProps>({\n  colRef: null,\n  animate: true,\n});\n\nexport interface SplitColProps extends React.HTMLAttributes<HTMLDivElement> {\n  width?: number | string;\n  maxWidth?: number | string;\n  minWidth?: number | string;\n  /**\n   * Если false, то переходы между Panel происходят без анимации\n   */\n  animate?: boolean;\n  /**\n   * Если true, то добавляются боковые отступы фиксированной величины\n   */\n  spaced?: boolean;\n  fixed?: boolean;\n}\n\nexport const SplitCol: React.FC<SplitColProps> = (props: SplitColProps) => {\n  const {\n    children,\n    width,\n    maxWidth,\n    minWidth,\n    spaced,\n    animate = false,\n    fixed,\n    style,\n    ...restProps\n  } = props;\n  const baseRef = React.useRef<HTMLDivElement>(null);\n\n  const contextValue = React.useMemo(() => {\n    return {\n      colRef: baseRef,\n      animate,\n    };\n  }, [baseRef, animate]);\n\n  return (\n    <div\n      {...restProps}\n      style={{\n        ...style,\n        width: width,\n        maxWidth: maxWidth,\n        minWidth: minWidth,\n      }}\n      ref={baseRef}\n      // eslint-disable-next-line vkui/no-object-expression-in-arguments\n      vkuiClass={classNames(\"SplitCol\", {\n        \"SplitCol--spaced\": spaced,\n        \"SplitCol--fixed\": fixed,\n      })}\n    >\n      <SplitColContext.Provider value={contextValue}>\n        {fixed ? (\n          <div vkuiClass=\"SplitCol__fixedInner\">{children}</div>\n        ) : (\n          children\n        )}\n      </SplitColContext.Provider>\n    </div>\n  );\n};\n"],"file":"SplitCol.js"}

package/dist/cssm/components/SplitLayout/SplitLayout.css

@@ -1 +1 @@
-.vkuiSplitLayout{width:100%;height:100%;position:relative;font-family:-apple-system,system-ui,Helvetica Neue,Roboto,sans-serif;font-family:var(--font-common)}.vkuiSplitLayout__inner{width:100%;height:100%;display:flex}.vkuiSplitLayout__inner--header{position:relative;z-index:11}.vkuiSplitLayout--ios .vkuiSplitLayout__inner--header{margin-top:calc(-1*calc(52px + 20px));margin-top:calc(-1*calc(var(--panelheader_height_ios) + var(--safe-area-inset-top)))}.vkuiSplitLayout--android .vkuiSplitLayout__inner--header,.vkuiSplitLayout--vkcom .vkuiSplitLayout__inner--header{margin-top:calc(-1*56px);margin-top:calc(-1*var(--panelheader_height_android))}.vkuiSplitLayout__popout{position:fixed;left:0;top:0;z-index:100;width:100%;height:100%}.vkuiSplitLayout__modal{position:fixed;left:0;top:0;z-index:99;width:100%;height:100%}.vkuiSplitLayout__modal:empty{display:none}
+.vkuiSplitLayout{width:100%;height:100%;position:relative;font-family:-apple-systemsystem-uiHelvetica NeueRobotosans-serif;font-family:var(--font-common)}.vkuiSplitLayout__inner{width:100%;height:100%;display:flex}.vkuiSplitLayout__inner--header{position:relative;z-index:11}.vkuiSplitLayout--ios .vkuiSplitLayout__inner--header{margin-top:calc(-1*calc(52px + 0px));margin-top:calc(-1*calc(var(--panelheader_height_ios) + var(--safe-area-inset-top)))}.vkuiSplitLayout--android .vkuiSplitLayout__inner--header,.vkuiSplitLayout--vkcom .vkuiSplitLayout__inner--header{margin-top:calc(-1*calc(56px + 0px));margin-top:calc(-1*calc(var(--panelheader_height_android) + var(--safe-area-inset-top)))}.vkuiSplitLayout__popout{position:fixed;left:0;top:0;z-index:100;width:100%;height:100%}.vkuiSplitLayout__modal{position:fixed;left:0;top:0;z-index:99;width:100%;height:100%}.vkuiSplitLayout__modal:empty{display:none}

package/dist/cssm/components/SplitLayout/SplitLayout.js

@@ -23,7 +23,8 @@ export var SplitLayout = function SplitLayout(_ref) {
     modal: modal,
     getRootRef: getRootRef
   }, header, createScopedElement("div", _extends({}, restProps, {
-    ref: getRef,
+    ref: getRef // eslint-disable-next-line vkui/no-object-expression-in-arguments
+    ,
     vkuiClass: classNames("SplitLayout__inner", {
       "SplitLayout__inner--header": !!header
     })

package/dist/cssm/components/SplitLayout/SplitLayout.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/components/SplitLayout/SplitLayout.tsx"],"names":["getClassName","classNames","PopoutRoot","usePlatform","SplitLayout","popout","modal","header","children","getRootRef","getRef","restProps","platform"],"mappings":";;;;AACA,SAASA,YAAT;AACA,SAASC,UAAT;AAEA,SAASC,UAAT;AACA,SAASC,WAAT;AACA;AAiBA,OAAO,IAAMC,WAAuC,GAAG,SAA1CA,WAA0C,OAQ/B;AAAA,MAPtBC,MAOsB,QAPtBA,MAOsB;AAAA,MANtBC,KAMsB,QANtBA,KAMsB;AAAA,MALtBC,MAKsB,QALtBA,MAKsB;AAAA,MAJtBC,QAIsB,QAJtBA,QAIsB;AAAA,MAHtBC,UAGsB,QAHtBA,UAGsB;AAAA,MAFtBC,MAEsB,QAFtBA,MAEsB;AAAA,MADnBC,SACmB;;AACtB,MAAMC,QAAQ,GAAGT,WAAW,EAA5B;AAEA,SACE,oBAAC,UAAD;AACE,IAAA,SAAS,EAAEH,YAAY,CAAC,aAAD,EAAgBY,QAAhB,CADzB;AAEE,IAAA,MAAM,EAAEP,MAFV;AAGE,IAAA,KAAK,EAAEC,KAHT;AAIE,IAAA,UAAU,EAAEG;AAJd,KAMGF,MANH,EAOE,wCACMI,SADN;AAEE,IAAA,GAAG,EAAED,MAFP;AAGE,IAAA,SAAS,EAAET,UAAU,CAAC,oBAAD,EAAuB;AAC1C,oCAA8B,CAAC,CAACM;AADU,KAAvB;AAHvB,MAOGC,QAPH,CAPF,CADF;AAmBD,CA9BM","sourcesContent":["import * as React from \"react\";\nimport { getClassName } from \"../../helpers/getClassName\";\nimport { classNames } from \"../../lib/classNames\";\nimport { HasRef, HasRootRef } from \"../../types\";\nimport { PopoutRoot } from \"../PopoutRoot/PopoutRoot\";\nimport { usePlatform } from \"../../hooks/usePlatform\";\nimport \"./SplitLayout.css\";\n\nexport interface SplitLayoutProps\n  extends React.HTMLAttributes<HTMLDivElement>,\n    HasRootRef<HTMLDivElement>,\n    HasRef<HTMLDivElement> {\n  /**\n   * Свойство для отрисовки `Alert`, `ActionSheet` и `ScreenSpinner`.\n   */\n  popout?: React.ReactNode;\n  /**\n   * Свойство для отрисовки `ModalRoot`.\n   */\n  modal?: React.ReactNode;\n  header?: React.ReactNode;\n}\n\nexport const SplitLayout: React.FC<SplitLayoutProps> = ({\n  popout,\n  modal,\n  header,\n  children,\n  getRootRef,\n  getRef,\n  ...restProps\n}: SplitLayoutProps) => {\n  const platform = usePlatform();\n\n  return (\n    <PopoutRoot\n      vkuiClass={getClassName(\"SplitLayout\", platform)}\n      popout={popout}\n      modal={modal}\n      getRootRef={getRootRef}\n    >\n      {header}\n      <div\n        {...restProps}\n        ref={getRef}\n        vkuiClass={classNames(\"SplitLayout__inner\", {\n          \"SplitLayout__inner--header\": !!header,\n        })}\n      >\n        {children}\n      </div>\n    </PopoutRoot>\n  );\n};\n"],"file":"SplitLayout.js"}
+{"version":3,"sources":["../../../../src/components/SplitLayout/SplitLayout.tsx"],"names":["getClassName","classNames","PopoutRoot","usePlatform","SplitLayout","popout","modal","header","children","getRootRef","getRef","restProps","platform"],"mappings":";;;;AACA,SAASA,YAAT;AACA,SAASC,UAAT;AAEA,SAASC,UAAT;AACA,SAASC,WAAT;AACA;AAiBA,OAAO,IAAMC,WAAuC,GAAG,SAA1CA,WAA0C,OAQ/B;AAAA,MAPtBC,MAOsB,QAPtBA,MAOsB;AAAA,MANtBC,KAMsB,QANtBA,KAMsB;AAAA,MALtBC,MAKsB,QALtBA,MAKsB;AAAA,MAJtBC,QAIsB,QAJtBA,QAIsB;AAAA,MAHtBC,UAGsB,QAHtBA,UAGsB;AAAA,MAFtBC,MAEsB,QAFtBA,MAEsB;AAAA,MADnBC,SACmB;;AACtB,MAAMC,QAAQ,GAAGT,WAAW,EAA5B;AAEA,SACE,oBAAC,UAAD;AACE,IAAA,SAAS,EAAEH,YAAY,CAAC,aAAD,EAAgBY,QAAhB,CADzB;AAEE,IAAA,MAAM,EAAEP,MAFV;AAGE,IAAA,KAAK,EAAEC,KAHT;AAIE,IAAA,UAAU,EAAEG;AAJd,KAMGF,MANH,EAOE,wCACMI,SADN;AAEE,IAAA,GAAG,EAAED,MAFP,CAGE;AAHF;AAIE,IAAA,SAAS,EAAET,UAAU,CAAC,oBAAD,EAAuB;AAC1C,oCAA8B,CAAC,CAACM;AADU,KAAvB;AAJvB,MAQGC,QARH,CAPF,CADF;AAoBD,CA/BM","sourcesContent":["import * as React from \"react\";\nimport { getClassName } from \"../../helpers/getClassName\";\nimport { classNames } from \"../../lib/classNames\";\nimport { HasRef, HasRootRef } from \"../../types\";\nimport { PopoutRoot } from \"../PopoutRoot/PopoutRoot\";\nimport { usePlatform } from \"../../hooks/usePlatform\";\nimport \"./SplitLayout.css\";\n\nexport interface SplitLayoutProps\n  extends React.HTMLAttributes<HTMLDivElement>,\n    HasRootRef<HTMLDivElement>,\n    HasRef<HTMLDivElement> {\n  /**\n   * Свойство для отрисовки `Alert`, `ActionSheet` и `ScreenSpinner`.\n   */\n  popout?: React.ReactNode;\n  /**\n   * Свойство для отрисовки `ModalRoot`.\n   */\n  modal?: React.ReactNode;\n  header?: React.ReactNode;\n}\n\nexport const SplitLayout: React.FC<SplitLayoutProps> = ({\n  popout,\n  modal,\n  header,\n  children,\n  getRootRef,\n  getRef,\n  ...restProps\n}: SplitLayoutProps) => {\n  const platform = usePlatform();\n\n  return (\n    <PopoutRoot\n      vkuiClass={getClassName(\"SplitLayout\", platform)}\n      popout={popout}\n      modal={modal}\n      getRootRef={getRootRef}\n    >\n      {header}\n      <div\n        {...restProps}\n        ref={getRef}\n        // eslint-disable-next-line vkui/no-object-expression-in-arguments\n        vkuiClass={classNames(\"SplitLayout__inner\", {\n          \"SplitLayout__inner--header\": !!header,\n        })}\n      >\n        {children}\n      </div>\n    </PopoutRoot>\n  );\n};\n"],"file":"SplitLayout.js"}

package/dist/cssm/components/SubnavigationBar/SubnavigationBar.js

@@ -5,7 +5,7 @@ import { createScopedElement } from "../../lib/jsxRuntime";
 import { usePlatform } from "../../hooks/usePlatform";
 import { classNames } from "../../lib/classNames";
 import { getClassName } from "../../helpers/getClassName";
-import HorizontalScroll from "../HorizontalScroll/HorizontalScroll";
+import { HorizontalScroll } from "../HorizontalScroll/HorizontalScroll";
 import "./SubnavigationBar.css";
 
 var defaultScrollToLeft = function defaultScrollToLeft(x) {

package/dist/cssm/components/SubnavigationBar/SubnavigationBar.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/components/SubnavigationBar/SubnavigationBar.tsx"],"names":["usePlatform","classNames","getClassName","HorizontalScroll","defaultScrollToLeft","x","defaultScrollToRight","SubnavigationBar","mode","children","showArrows","getScrollToLeft","getScrollToRight","scrollAnimationDuration","restProps","platform","ScrollWrapper","scrollWrapperProps"],"mappings":";;;;AACA,SAASA,WAAT;AACA,SAASC,UAAT;AACA,SAASC,YAAT;AACA,OAAOC,gBAAP;AAIA;;AAcA,IAAMC,mBAA0C,GAAG,SAA7CA,mBAA6C,CAACC,CAAD;AAAA,SAAOA,CAAC,GAAG,GAAX;AAAA,CAAnD;;AAEA,IAAMC,oBAA2C,GAAG,SAA9CA,oBAA8C,CAACD,CAAD;AAAA,SAAOA,CAAC,GAAG,GAAX;AAAA,CAApD;;AAEA,OAAO,IAAME,gBAAiD,GAAG,SAApDA,gBAAoD,OAQpC;AAAA,uBAP3BC,IAO2B;AAAA,MAP3BA,IAO2B,0BAPpB,UAOoB;AAAA,MAN3BC,QAM2B,QAN3BA,QAM2B;AAAA,6BAL3BC,UAK2B;AAAA,MAL3BA,UAK2B,gCALd,IAKc;AAAA,kCAJ3BC,eAI2B;AAAA,MAJ3BA,eAI2B,qCAJTP,mBAIS;AAAA,mCAH3BQ,gBAG2B;AAAA,MAH3BA,gBAG2B,sCAHRN,oBAGQ;AAAA,MAF3BO,uBAE2B,QAF3BA,uBAE2B;AAAA,MADxBC,SACwB;;AAC3B,MAAMC,QAAQ,GAAGf,WAAW,EAA5B;AAEA,MAAIgB,aAAJ;AACA,MAAIC,kBAAkB,GAAG,EAAzB;;AAEA,MAAIT,IAAI,KAAK,OAAb,EAAsB;AACpBQ,IAAAA,aAAa,GAAG,KAAhB;AACD,GAFD,MAEO;AACLA,IAAAA,aAAa,GAAGb,gBAAhB;AACAc,IAAAA,kBAAkB,GAAG;AACnBP,MAAAA,UAAU,EAAVA,UADmB;AAEnBC,MAAAA,eAAe,EAAfA,eAFmB;AAGnBC,MAAAA,gBAAgB,EAAhBA,gBAHmB;AAInBC,MAAAA,uBAAuB,EAAvBA;AAJmB,KAArB;AAMD;;AAED,SACE,wCACMC,SADN;AAEE,IAAA,SAAS,EAAEb,UAAU,CACnBC,YAAY,CAAC,kBAAD,EAAqBa,QAArB,CADO,8BAEEP,IAFF;AAFvB,MAOE,oBAAC,aAAD;AAAe,IAAA,SAAS,EAAC;AAAzB,KAAoDS,kBAApD,GACE;AAAK,IAAA,SAAS,EAAC;AAAf,KAA6CR,QAA7C,CADF,CAPF,CADF;AAaD,CAvCM","sourcesContent":["import * as React from \"react\";\nimport { usePlatform } from \"../../hooks/usePlatform\";\nimport { classNames } from \"../../lib/classNames\";\nimport { getClassName } from \"../../helpers/getClassName\";\nimport HorizontalScroll, {\n  HorizontalScrollProps,\n  ScrollPositionHandler,\n} from \"../HorizontalScroll/HorizontalScroll\";\nimport \"./SubnavigationBar.css\";\n\nexport interface SubnavigationBarProps\n  extends React.HTMLAttributes<HTMLDivElement>,\n    Pick<\n      HorizontalScrollProps,\n      | \"showArrows\"\n      | \"getScrollToLeft\"\n      | \"getScrollToRight\"\n      | \"scrollAnimationDuration\"\n    > {\n  mode?: \"fixed\" | \"overflow\";\n}\n\nconst defaultScrollToLeft: ScrollPositionHandler = (x) => x - 240;\n\nconst defaultScrollToRight: ScrollPositionHandler = (x) => x + 240;\n\nexport const SubnavigationBar: React.FC<SubnavigationBarProps> = ({\n  mode = \"overflow\",\n  children,\n  showArrows = true,\n  getScrollToLeft = defaultScrollToLeft,\n  getScrollToRight = defaultScrollToRight,\n  scrollAnimationDuration,\n  ...restProps\n}: SubnavigationBarProps) => {\n  const platform = usePlatform();\n\n  let ScrollWrapper: React.ElementType;\n  let scrollWrapperProps = {};\n\n  if (mode === \"fixed\") {\n    ScrollWrapper = \"div\";\n  } else {\n    ScrollWrapper = HorizontalScroll;\n    scrollWrapperProps = {\n      showArrows,\n      getScrollToLeft,\n      getScrollToRight,\n      scrollAnimationDuration,\n    };\n  }\n\n  return (\n    <div\n      {...restProps}\n      vkuiClass={classNames(\n        getClassName(\"SubnavigationBar\", platform),\n        `SubnavigationBar--${mode}`\n      )}\n    >\n      <ScrollWrapper vkuiClass=\"SubnavigationBar__in\" {...scrollWrapperProps}>\n        <div vkuiClass=\"SubnavigationBar__scrollIn\">{children}</div>\n      </ScrollWrapper>\n    </div>\n  );\n};\n"],"file":"SubnavigationBar.js"}
+{"version":3,"sources":["../../../../src/components/SubnavigationBar/SubnavigationBar.tsx"],"names":["usePlatform","classNames","getClassName","HorizontalScroll","defaultScrollToLeft","x","defaultScrollToRight","SubnavigationBar","mode","children","showArrows","getScrollToLeft","getScrollToRight","scrollAnimationDuration","restProps","platform","ScrollWrapper","scrollWrapperProps"],"mappings":";;;;AACA,SAASA,WAAT;AACA,SAASC,UAAT;AACA,SAASC,YAAT;AACA,SACEC,gBADF;AAKA;;AAcA,IAAMC,mBAA0C,GAAG,SAA7CA,mBAA6C,CAACC,CAAD;AAAA,SAAOA,CAAC,GAAG,GAAX;AAAA,CAAnD;;AAEA,IAAMC,oBAA2C,GAAG,SAA9CA,oBAA8C,CAACD,CAAD;AAAA,SAAOA,CAAC,GAAG,GAAX;AAAA,CAApD;;AAEA,OAAO,IAAME,gBAAiD,GAAG,SAApDA,gBAAoD,OAQpC;AAAA,uBAP3BC,IAO2B;AAAA,MAP3BA,IAO2B,0BAPpB,UAOoB;AAAA,MAN3BC,QAM2B,QAN3BA,QAM2B;AAAA,6BAL3BC,UAK2B;AAAA,MAL3BA,UAK2B,gCALd,IAKc;AAAA,kCAJ3BC,eAI2B;AAAA,MAJ3BA,eAI2B,qCAJTP,mBAIS;AAAA,mCAH3BQ,gBAG2B;AAAA,MAH3BA,gBAG2B,sCAHRN,oBAGQ;AAAA,MAF3BO,uBAE2B,QAF3BA,uBAE2B;AAAA,MADxBC,SACwB;;AAC3B,MAAMC,QAAQ,GAAGf,WAAW,EAA5B;AAEA,MAAIgB,aAAJ;AACA,MAAIC,kBAAkB,GAAG,EAAzB;;AAEA,MAAIT,IAAI,KAAK,OAAb,EAAsB;AACpBQ,IAAAA,aAAa,GAAG,KAAhB;AACD,GAFD,MAEO;AACLA,IAAAA,aAAa,GAAGb,gBAAhB;AACAc,IAAAA,kBAAkB,GAAG;AACnBP,MAAAA,UAAU,EAAVA,UADmB;AAEnBC,MAAAA,eAAe,EAAfA,eAFmB;AAGnBC,MAAAA,gBAAgB,EAAhBA,gBAHmB;AAInBC,MAAAA,uBAAuB,EAAvBA;AAJmB,KAArB;AAMD;;AAED,SACE,wCACMC,SADN;AAEE,IAAA,SAAS,EAAEb,UAAU,CACnBC,YAAY,CAAC,kBAAD,EAAqBa,QAArB,CADO,8BAEEP,IAFF;AAFvB,MAOE,oBAAC,aAAD;AAAe,IAAA,SAAS,EAAC;AAAzB,KAAoDS,kBAApD,GACE;AAAK,IAAA,SAAS,EAAC;AAAf,KAA6CR,QAA7C,CADF,CAPF,CADF;AAaD,CAvCM","sourcesContent":["import * as React from \"react\";\nimport { usePlatform } from \"../../hooks/usePlatform\";\nimport { classNames } from \"../../lib/classNames\";\nimport { getClassName } from \"../../helpers/getClassName\";\nimport {\n  HorizontalScroll,\n  HorizontalScrollProps,\n  ScrollPositionHandler,\n} from \"../HorizontalScroll/HorizontalScroll\";\nimport \"./SubnavigationBar.css\";\n\nexport interface SubnavigationBarProps\n  extends React.HTMLAttributes<HTMLDivElement>,\n    Pick<\n      HorizontalScrollProps,\n      | \"showArrows\"\n      | \"getScrollToLeft\"\n      | \"getScrollToRight\"\n      | \"scrollAnimationDuration\"\n    > {\n  mode?: \"fixed\" | \"overflow\";\n}\n\nconst defaultScrollToLeft: ScrollPositionHandler = (x) => x - 240;\n\nconst defaultScrollToRight: ScrollPositionHandler = (x) => x + 240;\n\nexport const SubnavigationBar: React.FC<SubnavigationBarProps> = ({\n  mode = \"overflow\",\n  children,\n  showArrows = true,\n  getScrollToLeft = defaultScrollToLeft,\n  getScrollToRight = defaultScrollToRight,\n  scrollAnimationDuration,\n  ...restProps\n}: SubnavigationBarProps) => {\n  const platform = usePlatform();\n\n  let ScrollWrapper: React.ElementType;\n  let scrollWrapperProps = {};\n\n  if (mode === \"fixed\") {\n    ScrollWrapper = \"div\";\n  } else {\n    ScrollWrapper = HorizontalScroll;\n    scrollWrapperProps = {\n      showArrows,\n      getScrollToLeft,\n      getScrollToRight,\n      scrollAnimationDuration,\n    };\n  }\n\n  return (\n    <div\n      {...restProps}\n      vkuiClass={classNames(\n        getClassName(\"SubnavigationBar\", platform),\n        `SubnavigationBar--${mode}`\n      )}\n    >\n      <ScrollWrapper vkuiClass=\"SubnavigationBar__in\" {...scrollWrapperProps}>\n        <div vkuiClass=\"SubnavigationBar__scrollIn\">{children}</div>\n      </ScrollWrapper>\n    </div>\n  );\n};\n"],"file":"SubnavigationBar.js"}

package/dist/cssm/components/SubnavigationButton/SubnavigationButton.js

@@ -9,8 +9,8 @@ import { getTitleFromChildren, hasReactNode } from "../../lib/utils";
 import Tappable from "../Tappable/Tappable";
 import { Icon16Dropdown } from "@vkontakte/icons";
 import { usePlatform } from "../../hooks/usePlatform";
-import Caption from "../Typography/Caption/Caption";
-import Subhead from "../Typography/Subhead/Subhead";
+import { Caption } from "../Typography/Caption/Caption";
+import { Subhead } from "../Typography/Subhead/Subhead";
 import "./SubnavigationButton.css";
 
 var SubnavigationButtonTypography = function SubnavigationButtonTypography(_ref) {
@@ -22,8 +22,7 @@ var SubnavigationButtonTypography = function SubnavigationButtonTypography(_ref)
   }
 
   return createScopedElement(Caption, _extends({
-    level: textLevel === 2 ? "1" : "2",
-    weight: "regular"
+    level: textLevel === 2 ? "1" : "2"
   }, restProps));
 };
 
@@ -41,7 +40,8 @@ export var SubnavigationButton = function SubnavigationButton(props) {
 
   return createScopedElement(Tappable, _extends({}, restProps, {
     hasActive: false,
-    focusVisibleMode: "outside",
+    focusVisibleMode: "outside" // eslint-disable-next-line vkui/no-object-expression-in-arguments
+    ,
     vkuiClass: classNames(getClassName("SubnavigationButton", platform), "SubnavigationButton--".concat(size), {
       "SubnavigationButton--selected": selected
     }),

package/dist/cssm/components/SubnavigationButton/SubnavigationButton.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/components/SubnavigationButton/SubnavigationButton.tsx"],"names":["classNames","getClassName","getTitleFromChildren","hasReactNode","Tappable","Icon16Dropdown","usePlatform","Caption","Subhead","SubnavigationButtonTypography","textLevel","restProps","SubnavigationButton","props","platform","size","selected","before","after","expandable","children","defaultProps"],"mappings":";;;;;AAEA,SAASA,UAAT;AACA,SAASC,YAAT;AACA,SAASC,oBAAT,EAA+BC,YAA/B;AACA,OAAOC,QAAP;AACA,SAASC,cAAT,QAA+B,kBAA/B;AACA,SAASC,WAAT;AACA,OAAOC,OAAP;AACA,OAAOC,OAAP;AACA;;AAuBA,IAAMC,6BAAoE,GAAG,SAAvEA,6BAAuE,OAG1C;AAAA,MAFjCC,SAEiC,QAFjCA,SAEiC;AAAA,MAD9BC,SAC8B;;AACjC,MAAID,SAAS,KAAK,CAAlB,EAAqB;AACnB,WAAO,oBAAC,OAAD,EAAaC,SAAb,CAAP;AACD;;AAED,SACE,oBAAC,OAAD;AACE,IAAA,KAAK,EAAED,SAAS,KAAK,CAAd,GAAkB,GAAlB,GAAwB,GADjC;AAEE,IAAA,MAAM,EAAC;AAFT,KAGMC,SAHN,EADF;AAOD,CAfD;;AAiBA,OAAO,IAAMC,mBAAuD,GAAG,SAA1DA,mBAA0D,CACrEC,KADqE,EAElE;AACH,MAAMC,QAAQ,GAAGR,WAAW,EAA5B;;AACA,MACES,IADF,GASIF,KATJ,CACEE,IADF;AAAA,MAEEC,QAFF,GASIH,KATJ,CAEEG,QAFF;AAAA,MAGEN,SAHF,GASIG,KATJ,CAGEH,SAHF;AAAA,MAIEO,MAJF,GASIJ,KATJ,CAIEI,MAJF;AAAA,MAKEC,KALF,GASIL,KATJ,CAKEK,KALF;AAAA,MAMEC,UANF,GASIN,KATJ,CAMEM,UANF;AAAA,MAOEC,QAPF,GASIP,KATJ,CAOEO,QAPF;AAAA,MAQKT,SARL,4BASIE,KATJ;;AAWA,SACE,oBAAC,QAAD,eACMF,SADN;AAEE,IAAA,SAAS,EAAE,KAFb;AAGE,IAAA,gBAAgB,EAAC,SAHnB;AAIE,IAAA,SAAS,EAAEX,UAAU,CACnBC,YAAY,CAAC,qBAAD,EAAwBa,QAAxB,CADO,iCAEKC,IAFL,GAGnB;AACE,uCAAiCC;AADnC,KAHmB,CAJvB;AAWE,kBAAYd,oBAAoB,CAACkB,QAAD;AAXlC,MAaE;AAAM,IAAA,SAAS,EAAC;AAAhB,KACGjB,YAAY,CAACc,MAAD,CAAZ,IACC;AAAM,IAAA,SAAS,EAAC;AAAhB,KAA+CA,MAA/C,CAFJ,EAIE,oBAAC,6BAAD;AACE,IAAA,SAAS,EAAEP,SADb;AAEE,IAAA,SAAS,EAAC,4BAFZ;AAGE,IAAA,SAAS,EAAC;AAHZ,KAKGU,QALH,CAJF,EAWGjB,YAAY,CAACe,KAAD,CAAZ,IACC;AAAM,IAAA,SAAS,EAAC;AAAhB,KAA8CA,KAA9C,CAZJ,EAcGC,UAAU,IACT,oBAAC,cAAD;AAAgB,IAAA,SAAS,EAAC;AAA1B,IAfJ,CAbF,CADF;AAkCD,CAjDM;AAmDPP,mBAAmB,CAACS,YAApB,GAAmC;AACjCN,EAAAA,IAAI,EAAE,GAD2B;AAEjCL,EAAAA,SAAS,EAAE;AAFsB,CAAnC","sourcesContent":["import * as React from \"react\";\nimport { HasComponent } from \"../../types\";\nimport { classNames } from \"../../lib/classNames\";\nimport { getClassName } from \"../../helpers/getClassName\";\nimport { getTitleFromChildren, hasReactNode } from \"../../lib/utils\";\nimport Tappable, { TappableProps } from \"../Tappable/Tappable\";\nimport { Icon16Dropdown } from \"@vkontakte/icons\";\nimport { usePlatform } from \"../../hooks/usePlatform\";\nimport Caption from \"../Typography/Caption/Caption\";\nimport Subhead from \"../Typography/Subhead/Subhead\";\nimport \"./SubnavigationButton.css\";\n\nexport interface SubnavigationButtonProps extends Omit<TappableProps, \"size\"> {\n  size?: \"m\" | \"l\";\n  selected?: boolean;\n  /**\n   * Размер шрифта. Этим свойством рекомендуется пользоваться, чтобы отрегулировать размер шрифта у кнопок в `<SubnavigationBar mode=\"fixed\" />`\n   */\n  textLevel?: 1 | 2 | 3;\n  /**\n   * Рекомендуется использовать только иконки с размером 24\n   */\n  before?: React.ReactNode;\n  /**\n   * Рекомендуется использовать только `<Counter size=\"s\" />` или `<Badge />`\n   */\n  after?: React.ReactNode;\n  expandable?: boolean;\n}\n\ntype SubnavButtonTypographyProps = Pick<SubnavigationButtonProps, \"textLevel\"> &\n  HasComponent;\n\nconst SubnavigationButtonTypography: React.FC<SubnavButtonTypographyProps> = ({\n  textLevel,\n  ...restProps\n}: SubnavButtonTypographyProps) => {\n  if (textLevel === 1) {\n    return <Subhead {...restProps} />;\n  }\n\n  return (\n    <Caption\n      level={textLevel === 2 ? \"1\" : \"2\"}\n      weight=\"regular\"\n      {...restProps}\n    />\n  );\n};\n\nexport const SubnavigationButton: React.FC<SubnavigationButtonProps> = (\n  props: SubnavigationButtonProps\n) => {\n  const platform = usePlatform();\n  const {\n    size,\n    selected,\n    textLevel,\n    before,\n    after,\n    expandable,\n    children,\n    ...restProps\n  } = props;\n\n  return (\n    <Tappable\n      {...restProps}\n      hasActive={false}\n      focusVisibleMode=\"outside\"\n      vkuiClass={classNames(\n        getClassName(\"SubnavigationButton\", platform),\n        `SubnavigationButton--${size}`,\n        {\n          \"SubnavigationButton--selected\": selected,\n        }\n      )}\n      aria-label={getTitleFromChildren(children)}\n    >\n      <span vkuiClass=\"SubnavigationButton__in\">\n        {hasReactNode(before) && (\n          <span vkuiClass=\"SubnavigationButton__before\">{before}</span>\n        )}\n        <SubnavigationButtonTypography\n          textLevel={textLevel}\n          vkuiClass=\"SubnavigationButton__label\"\n          Component=\"span\"\n        >\n          {children}\n        </SubnavigationButtonTypography>\n        {hasReactNode(after) && (\n          <span vkuiClass=\"SubnavigationButton__after\">{after}</span>\n        )}\n        {expandable && (\n          <Icon16Dropdown vkuiClass=\"SubnavigationButton__expandableIcon\" />\n        )}\n      </span>\n    </Tappable>\n  );\n};\n\nSubnavigationButton.defaultProps = {\n  size: \"m\",\n  textLevel: 1,\n};\n"],"file":"SubnavigationButton.js"}
+{"version":3,"sources":["../../../../src/components/SubnavigationButton/SubnavigationButton.tsx"],"names":["classNames","getClassName","getTitleFromChildren","hasReactNode","Tappable","Icon16Dropdown","usePlatform","Caption","Subhead","SubnavigationButtonTypography","textLevel","restProps","SubnavigationButton","props","platform","size","selected","before","after","expandable","children","defaultProps"],"mappings":";;;;;AAEA,SAASA,UAAT;AACA,SAASC,YAAT;AACA,SAASC,oBAAT,EAA+BC,YAA/B;AACA,OAAOC,QAAP;AACA,SAASC,cAAT,QAA+B,kBAA/B;AACA,SAASC,WAAT;AACA,SAASC,OAAT;AACA,SAASC,OAAT;AACA;;AAuBA,IAAMC,6BAAoE,GAAG,SAAvEA,6BAAuE,OAG1C;AAAA,MAFjCC,SAEiC,QAFjCA,SAEiC;AAAA,MAD9BC,SAC8B;;AACjC,MAAID,SAAS,KAAK,CAAlB,EAAqB;AACnB,WAAO,oBAAC,OAAD,EAAaC,SAAb,CAAP;AACD;;AAED,SAAO,oBAAC,OAAD;AAAS,IAAA,KAAK,EAAED,SAAS,KAAK,CAAd,GAAkB,GAAlB,GAAwB;AAAxC,KAAiDC,SAAjD,EAAP;AACD,CATD;;AAWA,OAAO,IAAMC,mBAAuD,GAAG,SAA1DA,mBAA0D,CACrEC,KADqE,EAElE;AACH,MAAMC,QAAQ,GAAGR,WAAW,EAA5B;;AACA,MACES,IADF,GASIF,KATJ,CACEE,IADF;AAAA,MAEEC,QAFF,GASIH,KATJ,CAEEG,QAFF;AAAA,MAGEN,SAHF,GASIG,KATJ,CAGEH,SAHF;AAAA,MAIEO,MAJF,GASIJ,KATJ,CAIEI,MAJF;AAAA,MAKEC,KALF,GASIL,KATJ,CAKEK,KALF;AAAA,MAMEC,UANF,GASIN,KATJ,CAMEM,UANF;AAAA,MAOEC,QAPF,GASIP,KATJ,CAOEO,QAPF;AAAA,MAQKT,SARL,4BASIE,KATJ;;AAWA,SACE,oBAAC,QAAD,eACMF,SADN;AAEE,IAAA,SAAS,EAAE,KAFb;AAGE,IAAA,gBAAgB,EAAC,SAHnB,CAIE;AAJF;AAKE,IAAA,SAAS,EAAEX,UAAU,CACnBC,YAAY,CAAC,qBAAD,EAAwBa,QAAxB,CADO,iCAEKC,IAFL,GAGnB;AACE,uCAAiCC;AADnC,KAHmB,CALvB;AAYE,kBAAYd,oBAAoB,CAACkB,QAAD;AAZlC,MAcE;AAAM,IAAA,SAAS,EAAC;AAAhB,KACGjB,YAAY,CAACc,MAAD,CAAZ,IACC;AAAM,IAAA,SAAS,EAAC;AAAhB,KAA+CA,MAA/C,CAFJ,EAIE,oBAAC,6BAAD;AACE,IAAA,SAAS,EAAEP,SADb;AAEE,IAAA,SAAS,EAAC,4BAFZ;AAGE,IAAA,SAAS,EAAC;AAHZ,KAKGU,QALH,CAJF,EAWGjB,YAAY,CAACe,KAAD,CAAZ,IACC;AAAM,IAAA,SAAS,EAAC;AAAhB,KAA8CA,KAA9C,CAZJ,EAcGC,UAAU,IACT,oBAAC,cAAD;AAAgB,IAAA,SAAS,EAAC;AAA1B,IAfJ,CAdF,CADF;AAmCD,CAlDM;AAoDPP,mBAAmB,CAACS,YAApB,GAAmC;AACjCN,EAAAA,IAAI,EAAE,GAD2B;AAEjCL,EAAAA,SAAS,EAAE;AAFsB,CAAnC","sourcesContent":["import * as React from \"react\";\nimport { HasComponent } from \"../../types\";\nimport { classNames } from \"../../lib/classNames\";\nimport { getClassName } from \"../../helpers/getClassName\";\nimport { getTitleFromChildren, hasReactNode } from \"../../lib/utils\";\nimport Tappable, { TappableProps } from \"../Tappable/Tappable\";\nimport { Icon16Dropdown } from \"@vkontakte/icons\";\nimport { usePlatform } from \"../../hooks/usePlatform\";\nimport { Caption } from \"../Typography/Caption/Caption\";\nimport { Subhead } from \"../Typography/Subhead/Subhead\";\nimport \"./SubnavigationButton.css\";\n\nexport interface SubnavigationButtonProps extends Omit<TappableProps, \"size\"> {\n  size?: \"m\" | \"l\";\n  selected?: boolean;\n  /**\n   * Размер шрифта. Этим свойством рекомендуется пользоваться, чтобы отрегулировать размер шрифта у кнопок в `<SubnavigationBar mode=\"fixed\" />`\n   */\n  textLevel?: 1 | 2 | 3;\n  /**\n   * Рекомендуется использовать только иконки с размером 24\n   */\n  before?: React.ReactNode;\n  /**\n   * Рекомендуется использовать только `<Counter size=\"s\" />` или `<Badge />`\n   */\n  after?: React.ReactNode;\n  expandable?: boolean;\n}\n\ntype SubnavButtonTypographyProps = Pick<SubnavigationButtonProps, \"textLevel\"> &\n  HasComponent;\n\nconst SubnavigationButtonTypography: React.FC<SubnavButtonTypographyProps> = ({\n  textLevel,\n  ...restProps\n}: SubnavButtonTypographyProps) => {\n  if (textLevel === 1) {\n    return <Subhead {...restProps} />;\n  }\n\n  return <Caption level={textLevel === 2 ? \"1\" : \"2\"} {...restProps} />;\n};\n\nexport const SubnavigationButton: React.FC<SubnavigationButtonProps> = (\n  props: SubnavigationButtonProps\n) => {\n  const platform = usePlatform();\n  const {\n    size,\n    selected,\n    textLevel,\n    before,\n    after,\n    expandable,\n    children,\n    ...restProps\n  } = props;\n\n  return (\n    <Tappable\n      {...restProps}\n      hasActive={false}\n      focusVisibleMode=\"outside\"\n      // eslint-disable-next-line vkui/no-object-expression-in-arguments\n      vkuiClass={classNames(\n        getClassName(\"SubnavigationButton\", platform),\n        `SubnavigationButton--${size}`,\n        {\n          \"SubnavigationButton--selected\": selected,\n        }\n      )}\n      aria-label={getTitleFromChildren(children)}\n    >\n      <span vkuiClass=\"SubnavigationButton__in\">\n        {hasReactNode(before) && (\n          <span vkuiClass=\"SubnavigationButton__before\">{before}</span>\n        )}\n        <SubnavigationButtonTypography\n          textLevel={textLevel}\n          vkuiClass=\"SubnavigationButton__label\"\n          Component=\"span\"\n        >\n          {children}\n        </SubnavigationButtonTypography>\n        {hasReactNode(after) && (\n          <span vkuiClass=\"SubnavigationButton__after\">{after}</span>\n        )}\n        {expandable && (\n          <Icon16Dropdown vkuiClass=\"SubnavigationButton__expandableIcon\" />\n        )}\n      </span>\n    </Tappable>\n  );\n};\n\nSubnavigationButton.defaultProps = {\n  size: \"m\",\n  textLevel: 1,\n};\n"],"file":"SubnavigationButton.js"}

package/dist/cssm/components/Switch/Switch.js

@@ -28,6 +28,7 @@ export var Switch = function Switch(_ref) {
       onFocus = _useFocusVisible.onFocus;
 
   return createScopedElement("label", {
+    // eslint-disable-next-line vkui/no-object-expression-in-arguments
     vkuiClass: classNames(getClassName("Switch", platform), "Switch--sizeY-".concat(sizeY), {
       "Switch--disabled": restProps.disabled,
       "Switch--focus-visible": focusVisible

package/dist/cssm/components/Switch/Switch.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/components/Switch/Switch.tsx"],"names":["getClassName","classNames","callMultiple","usePlatform","useAdaptivity","VisuallyHiddenInput","useFocusVisible","FocusVisible","Switch","style","className","getRootRef","restProps","platform","sizeY","focusVisible","onBlur","onFocus","disabled"],"mappings":";;;;AACA,SAASA,YAAT;AACA,SAASC,UAAT;AACA,SAASC,YAAT;AACA,SAASC,WAAT;AAEA,SAASC,aAAT;AACA,SACEC,mBADF;AAIA,SAASC,eAAT;AACA,SAASC,YAAT;AACA;AAMA,OAAO,IAAMC,MAA6B,GAAG,SAAhCA,MAAgC,OAK1B;AAAA,MAJjBC,KAIiB,QAJjBA,KAIiB;AAAA,MAHjBC,SAGiB,QAHjBA,SAGiB;AAAA,MAFjBC,UAEiB,QAFjBA,UAEiB;AAAA,MADdC,SACc;;AACjB,MAAMC,QAAQ,GAAGV,WAAW,EAA5B;;AACA,uBAAkBC,aAAa,EAA/B;AAAA,MAAQU,KAAR,kBAAQA,KAAR;;AACA,yBAA0CR,eAAe,EAAzD;AAAA,MAAQS,YAAR,oBAAQA,YAAR;AAAA,MAAsBC,MAAtB,oBAAsBA,MAAtB;AAAA,MAA8BC,OAA9B,oBAA8BA,OAA9B;;AAEA,SACE;AACE,IAAA,SAAS,EAAEhB,UAAU,CACnBD,YAAY,CAAC,QAAD,EAAWa,QAAX,CADO,0BAEFC,KAFE,GAGnB;AACE,0BAAoBF,SAAS,CAACM,QADhC;AAEE,+BAAyBH;AAF3B,KAHmB,CADvB;AASE,IAAA,SAAS,EAAEL,SATb;AAUE,IAAA,KAAK,EAAED,KAVT;AAWE,IAAA,GAAG,EAAEE,UAXP;AAYE,IAAA,IAAI,EAAC;AAZP,KAcE,oBAAC,mBAAD,eACMC,SADN;AAEE,IAAA,IAAI,EAAC,UAFP;AAGE,IAAA,SAAS,EAAC,cAHZ;AAIE,IAAA,MAAM,EAAEV,YAAY,CAACc,MAAD,EAASJ,SAAS,CAACI,MAAnB,CAJtB;AAKE,IAAA,OAAO,EAAEd,YAAY,CAACe,OAAD,EAAUL,SAAS,CAACK,OAApB;AALvB,KAdF,EAqBE;AAAM,IAAA,IAAI,EAAC,cAAX;AAA0B,IAAA,SAAS,EAAC;AAApC,IArBF,EAsBE,oBAAC,YAAD;AAAc,IAAA,IAAI,EAAC;AAAnB,IAtBF,CADF;AA0BD,CApCM","sourcesContent":["import * as React from \"react\";\nimport { getClassName } from \"../../helpers/getClassName\";\nimport { classNames } from \"../../lib/classNames\";\nimport { callMultiple } from \"../../lib/callMultiple\";\nimport { usePlatform } from \"../../hooks/usePlatform\";\nimport { HasRootRef } from \"../../types\";\nimport { useAdaptivity } from \"../../hooks/useAdaptivity\";\nimport {\n  VisuallyHiddenInput,\n  VisuallyHiddenInputProps,\n} from \"../VisuallyHiddenInput/VisuallyHiddenInput\";\nimport { useFocusVisible } from \"../../hooks/useFocusVisible\";\nimport { FocusVisible } from \"../FocusVisible/FocusVisible\";\nimport \"./Switch.css\";\n\nexport interface SwitchProps\n  extends VisuallyHiddenInputProps,\n    HasRootRef<HTMLLabelElement> {}\n\nexport const Switch: React.FC<SwitchProps> = ({\n  style,\n  className,\n  getRootRef,\n  ...restProps\n}: SwitchProps) => {\n  const platform = usePlatform();\n  const { sizeY } = useAdaptivity();\n  const { focusVisible, onBlur, onFocus } = useFocusVisible();\n\n  return (\n    <label\n      vkuiClass={classNames(\n        getClassName(\"Switch\", platform),\n        `Switch--sizeY-${sizeY}`,\n        {\n          \"Switch--disabled\": restProps.disabled,\n          \"Switch--focus-visible\": focusVisible,\n        }\n      )}\n      className={className}\n      style={style}\n      ref={getRootRef}\n      role=\"presentation\"\n    >\n      <VisuallyHiddenInput\n        {...restProps}\n        type=\"checkbox\"\n        vkuiClass=\"Switch__self\"\n        onBlur={callMultiple(onBlur, restProps.onBlur)}\n        onFocus={callMultiple(onFocus, restProps.onFocus)}\n      />\n      <span role=\"presentation\" vkuiClass=\"Switch__pseudo\" />\n      <FocusVisible mode=\"outside\" />\n    </label>\n  );\n};\n"],"file":"Switch.js"}
+{"version":3,"sources":["../../../../src/components/Switch/Switch.tsx"],"names":["getClassName","classNames","callMultiple","usePlatform","useAdaptivity","VisuallyHiddenInput","useFocusVisible","FocusVisible","Switch","style","className","getRootRef","restProps","platform","sizeY","focusVisible","onBlur","onFocus","disabled"],"mappings":";;;;AACA,SAASA,YAAT;AACA,SAASC,UAAT;AACA,SAASC,YAAT;AACA,SAASC,WAAT;AAEA,SAASC,aAAT;AACA,SACEC,mBADF;AAIA,SAASC,eAAT;AACA,SAASC,YAAT;AACA;AAMA,OAAO,IAAMC,MAA6B,GAAG,SAAhCA,MAAgC,OAK1B;AAAA,MAJjBC,KAIiB,QAJjBA,KAIiB;AAAA,MAHjBC,SAGiB,QAHjBA,SAGiB;AAAA,MAFjBC,UAEiB,QAFjBA,UAEiB;AAAA,MADdC,SACc;;AACjB,MAAMC,QAAQ,GAAGV,WAAW,EAA5B;;AACA,uBAAkBC,aAAa,EAA/B;AAAA,MAAQU,KAAR,kBAAQA,KAAR;;AACA,yBAA0CR,eAAe,EAAzD;AAAA,MAAQS,YAAR,oBAAQA,YAAR;AAAA,MAAsBC,MAAtB,oBAAsBA,MAAtB;AAAA,MAA8BC,OAA9B,oBAA8BA,OAA9B;;AAEA,SACE;AACE;AACA,IAAA,SAAS,EAAEhB,UAAU,CACnBD,YAAY,CAAC,QAAD,EAAWa,QAAX,CADO,0BAEFC,KAFE,GAGnB;AACE,0BAAoBF,SAAS,CAACM,QADhC;AAEE,+BAAyBH;AAF3B,KAHmB,CAFvB;AAUE,IAAA,SAAS,EAAEL,SAVb;AAWE,IAAA,KAAK,EAAED,KAXT;AAYE,IAAA,GAAG,EAAEE,UAZP;AAaE,IAAA,IAAI,EAAC;AAbP,KAeE,oBAAC,mBAAD,eACMC,SADN;AAEE,IAAA,IAAI,EAAC,UAFP;AAGE,IAAA,SAAS,EAAC,cAHZ;AAIE,IAAA,MAAM,EAAEV,YAAY,CAACc,MAAD,EAASJ,SAAS,CAACI,MAAnB,CAJtB;AAKE,IAAA,OAAO,EAAEd,YAAY,CAACe,OAAD,EAAUL,SAAS,CAACK,OAApB;AALvB,KAfF,EAsBE;AAAM,IAAA,IAAI,EAAC,cAAX;AAA0B,IAAA,SAAS,EAAC;AAApC,IAtBF,EAuBE,oBAAC,YAAD;AAAc,IAAA,IAAI,EAAC;AAAnB,IAvBF,CADF;AA2BD,CArCM","sourcesContent":["import * as React from \"react\";\nimport { getClassName } from \"../../helpers/getClassName\";\nimport { classNames } from \"../../lib/classNames\";\nimport { callMultiple } from \"../../lib/callMultiple\";\nimport { usePlatform } from \"../../hooks/usePlatform\";\nimport { HasRootRef } from \"../../types\";\nimport { useAdaptivity } from \"../../hooks/useAdaptivity\";\nimport {\n  VisuallyHiddenInput,\n  VisuallyHiddenInputProps,\n} from \"../VisuallyHiddenInput/VisuallyHiddenInput\";\nimport { useFocusVisible } from \"../../hooks/useFocusVisible\";\nimport { FocusVisible } from \"../FocusVisible/FocusVisible\";\nimport \"./Switch.css\";\n\nexport interface SwitchProps\n  extends VisuallyHiddenInputProps,\n    HasRootRef<HTMLLabelElement> {}\n\nexport const Switch: React.FC<SwitchProps> = ({\n  style,\n  className,\n  getRootRef,\n  ...restProps\n}: SwitchProps) => {\n  const platform = usePlatform();\n  const { sizeY } = useAdaptivity();\n  const { focusVisible, onBlur, onFocus } = useFocusVisible();\n\n  return (\n    <label\n      // eslint-disable-next-line vkui/no-object-expression-in-arguments\n      vkuiClass={classNames(\n        getClassName(\"Switch\", platform),\n        `Switch--sizeY-${sizeY}`,\n        {\n          \"Switch--disabled\": restProps.disabled,\n          \"Switch--focus-visible\": focusVisible,\n        }\n      )}\n      className={className}\n      style={style}\n      ref={getRootRef}\n      role=\"presentation\"\n    >\n      <VisuallyHiddenInput\n        {...restProps}\n        type=\"checkbox\"\n        vkuiClass=\"Switch__self\"\n        onBlur={callMultiple(onBlur, restProps.onBlur)}\n        onFocus={callMultiple(onFocus, restProps.onFocus)}\n      />\n      <span role=\"presentation\" vkuiClass=\"Switch__pseudo\" />\n      <FocusVisible mode=\"outside\" />\n    </label>\n  );\n};\n"],"file":"Switch.js"}

package/dist/cssm/components/Tabbar/Tabbar.js

@@ -28,6 +28,7 @@ var Tabbar = function Tabbar(props) {
   };
 
   return createScopedElement("div", _extends({
+    // eslint-disable-next-line vkui/no-object-expression-in-arguments
     vkuiClass: classNames(getClassName("Tabbar", platform), "Tabbar--l-".concat(getItemsLayout()), {
       "Tabbar--shadow": shadow
     })

package/dist/cssm/components/Tabbar/Tabbar.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/components/Tabbar/Tabbar.tsx"],"names":["React","getClassName","classNames","usePlatform","Tabbar","props","children","shadow","itemsLayout","restProps","platform","getItemsLayout","Children","count","defaultProps"],"mappings":";;;;AAAA,OAAO,KAAKA,KAAZ,MAAuB,OAAvB;AACA,SAASC,YAAT;AACA,SAASC,UAAT;AACA,SAASC,WAAT;AACA;;AAUA,IAAMC,MAA4C,GAAG,SAA/CA,MAA+C,CAACC,KAAD,EAAwB;AAC3E,MAAQC,QAAR,GAAwDD,KAAxD,CAAQC,QAAR;AAAA,MAAkBC,MAAlB,GAAwDF,KAAxD,CAAkBE,MAAlB;AAAA,MAA0BC,WAA1B,GAAwDH,KAAxD,CAA0BG,WAA1B;AAAA,MAA0CC,SAA1C,4BAAwDJ,KAAxD;;AACA,MAAMK,QAAQ,GAAGP,WAAW,EAA5B;;AAEA,MAAMQ,cAAc,GAAG,SAAjBA,cAAiB,GAAM;AAC3B,YAAQH,WAAR;AACE,WAAK,YAAL;AACA,WAAK,UAAL;AACE,eAAOA,WAAP;;AACF;AACE,eAAOR,KAAK,CAACY,QAAN,CAAeC,KAAf,CAAqBP,QAArB,IAAiC,CAAjC,GAAqC,UAArC,GAAkD,YAAzD;AALJ;AAOD,GARD;;AAUA,SACE;AACE,IAAA,SAAS,EAAEJ,UAAU,CACnBD,YAAY,CAAC,QAAD,EAAWS,QAAX,CADO,sBAENC,cAAc,EAFR,GAGnB;AACE,wBAAkBJ;AADpB,KAHmB;AADvB,KAQME,SARN,GAUE;AAAK,IAAA,SAAS,EAAC;AAAf,KAA6BH,QAA7B,CAVF,CADF;AAcD,CA5BD;;AA8BAF,MAAM,CAACU,YAAP,GAAsB;AACpBP,EAAAA,MAAM,EAAE;AADY,CAAtB,C,CAIA;;AACA,eAAeH,MAAf","sourcesContent":["import * as React from \"react\";\nimport { getClassName } from \"../../helpers/getClassName\";\nimport { classNames } from \"../../lib/classNames\";\nimport { usePlatform } from \"../../hooks/usePlatform\";\nimport \"./Tabbar.css\";\n\nexport interface TabbarProps extends React.HTMLAttributes<HTMLDivElement> {\n  /**\n   * Флаг для показа/скрытия верхней тени (Android) или границы (iOS)\n   */\n  shadow?: boolean;\n  itemsLayout?: \"vertical\" | \"horizontal\" | \"auto\";\n}\n\nconst Tabbar: React.FunctionComponent<TabbarProps> = (props: TabbarProps) => {\n  const { children, shadow, itemsLayout, ...restProps } = props;\n  const platform = usePlatform();\n\n  const getItemsLayout = () => {\n    switch (itemsLayout) {\n      case \"horizontal\":\n      case \"vertical\":\n        return itemsLayout;\n      default:\n        return React.Children.count(children) > 2 ? \"vertical\" : \"horizontal\";\n    }\n  };\n\n  return (\n    <div\n      vkuiClass={classNames(\n        getClassName(\"Tabbar\", platform),\n        `Tabbar--l-${getItemsLayout()}`,\n        {\n          \"Tabbar--shadow\": shadow,\n        }\n      )}\n      {...restProps}\n    >\n      <div vkuiClass=\"Tabbar__in\">{children}</div>\n    </div>\n  );\n};\n\nTabbar.defaultProps = {\n  shadow: true,\n};\n\n// eslint-disable-next-line import/no-default-export\nexport default Tabbar;\n"],"file":"Tabbar.js"}
+{"version":3,"sources":["../../../../src/components/Tabbar/Tabbar.tsx"],"names":["React","getClassName","classNames","usePlatform","Tabbar","props","children","shadow","itemsLayout","restProps","platform","getItemsLayout","Children","count","defaultProps"],"mappings":";;;;AAAA,OAAO,KAAKA,KAAZ,MAAuB,OAAvB;AACA,SAASC,YAAT;AACA,SAASC,UAAT;AACA,SAASC,WAAT;AACA;;AAUA,IAAMC,MAA4C,GAAG,SAA/CA,MAA+C,CAACC,KAAD,EAAwB;AAC3E,MAAQC,QAAR,GAAwDD,KAAxD,CAAQC,QAAR;AAAA,MAAkBC,MAAlB,GAAwDF,KAAxD,CAAkBE,MAAlB;AAAA,MAA0BC,WAA1B,GAAwDH,KAAxD,CAA0BG,WAA1B;AAAA,MAA0CC,SAA1C,4BAAwDJ,KAAxD;;AACA,MAAMK,QAAQ,GAAGP,WAAW,EAA5B;;AAEA,MAAMQ,cAAc,GAAG,SAAjBA,cAAiB,GAAM;AAC3B,YAAQH,WAAR;AACE,WAAK,YAAL;AACA,WAAK,UAAL;AACE,eAAOA,WAAP;;AACF;AACE,eAAOR,KAAK,CAACY,QAAN,CAAeC,KAAf,CAAqBP,QAArB,IAAiC,CAAjC,GAAqC,UAArC,GAAkD,YAAzD;AALJ;AAOD,GARD;;AAUA,SACE;AACE;AACA,IAAA,SAAS,EAAEJ,UAAU,CACnBD,YAAY,CAAC,QAAD,EAAWS,QAAX,CADO,sBAENC,cAAc,EAFR,GAGnB;AACE,wBAAkBJ;AADpB,KAHmB;AAFvB,KASME,SATN,GAWE;AAAK,IAAA,SAAS,EAAC;AAAf,KAA6BH,QAA7B,CAXF,CADF;AAeD,CA7BD;;AA+BAF,MAAM,CAACU,YAAP,GAAsB;AACpBP,EAAAA,MAAM,EAAE;AADY,CAAtB,C,CAIA;;AACA,eAAeH,MAAf","sourcesContent":["import * as React from \"react\";\nimport { getClassName } from \"../../helpers/getClassName\";\nimport { classNames } from \"../../lib/classNames\";\nimport { usePlatform } from \"../../hooks/usePlatform\";\nimport \"./Tabbar.css\";\n\nexport interface TabbarProps extends React.HTMLAttributes<HTMLDivElement> {\n  /**\n   * Флаг для показа/скрытия верхней тени (Android) или границы (iOS)\n   */\n  shadow?: boolean;\n  itemsLayout?: \"vertical\" | \"horizontal\" | \"auto\";\n}\n\nconst Tabbar: React.FunctionComponent<TabbarProps> = (props: TabbarProps) => {\n  const { children, shadow, itemsLayout, ...restProps } = props;\n  const platform = usePlatform();\n\n  const getItemsLayout = () => {\n    switch (itemsLayout) {\n      case \"horizontal\":\n      case \"vertical\":\n        return itemsLayout;\n      default:\n        return React.Children.count(children) > 2 ? \"vertical\" : \"horizontal\";\n    }\n  };\n\n  return (\n    <div\n      // eslint-disable-next-line vkui/no-object-expression-in-arguments\n      vkuiClass={classNames(\n        getClassName(\"Tabbar\", platform),\n        `Tabbar--l-${getItemsLayout()}`,\n        {\n          \"Tabbar--shadow\": shadow,\n        }\n      )}\n      {...restProps}\n    >\n      <div vkuiClass=\"Tabbar__in\">{children}</div>\n    </div>\n  );\n};\n\nTabbar.defaultProps = {\n  shadow: true,\n};\n\n// eslint-disable-next-line import/no-default-export\nexport default Tabbar;\n"],"file":"Tabbar.js"}

package/dist/cssm/components/TabbarItem/TabbarItem.css

@@ -1 +1 @@
-.vkuiTabbarItem{display:flex;align-items:center;justify-content:center;color:#99a2ad;color:var(--tabbar_inactive_icon);text-decoration:none;border:0;outline:0;padding:0;background:0 0;height:48px;height:var(--tabbar_height);position:relative}.vkuiTabbar .vkuiTabbarItem{flex-shrink:0;max-width:100%;min-width:0;flex-grow:1;flex-basis:0}.vkuiTabbarItem--selected{color:#2975cc;color:var(--tabbar_active_icon)}.vkuiTabbarItem__tappable{position:absolute}.vkuiTabbarItem__in{display:flex;padding:0 2px;align-items:center;justify-content:center;pointer-events:none;height:100%;overflow:hidden}.vkuiTabbar--l-vertical .vkuiTabbarItem--text .vkuiTabbarItem__in{position:relative;top:2px}.vkuiTabbar--l-vertical .vkuiTabbarItem__in{flex-direction:column}.vkuiTabbar--l-horizontal .vkuiTabbarItem__in{flex-direction:row}.vkuiTabbarItem__icon{position:relative}.vkuiTabbarItem__label .vkuiCounter{position:absolute;top:-2px;right:-9px}.vkuiTabbarItem__label .vkuiBadge{position:absolute;top:-2px;right:-4px}.vkuiTabbarItem__text{white-space:nowrap;max-width:100%;overflow:hidden;text-overflow:ellipsis}.vkuiTabbar--l-vertical .vkuiTabbarItem__text{font-size:10px;line-height:12px;font-weight:500;margin-top:2px}.vkuiTabbar--l-horizontal .vkuiTabbarItem__text{font-size:13px;font-weight:500;margin-left:8px}.vkuiTabbarItem--android .vkuiTabbarItem__tappable{width:calc(100% + 16px);padding-bottom:calc(100% + 16px);border-radius:50%}.vkuiTabbarItem--android:first-child{border-top-left-radius:0;border-bottom-left-radius:0}.vkuiTabbarItem--android:last-child{border-top-right-radius:0;border-bottom-right-radius:0}.vkuiTabbarItem--ios .vkuiTabbarItem__tappable{width:100%;height:100%;top:0;left:0}.vkuiTabbarItem--ios .vkuiTabbarItem__in{transition:-webkit-transform .07s cubic-bezier(.36,.66,.04,1);transition:transform .07s cubic-bezier(.36,.66,.04,1);transition:transform .07s cubic-bezier(.36,.66,.04,1),-webkit-transform .07s cubic-bezier(.36,.66,.04,1);transition:-webkit-transform .07s var(--ios-easing);transition:transform .07s var(--ios-easing);transition:transform .07s var(--ios-easing),-webkit-transform .07s var(--ios-easing)}.vkuiTabbarItem--ios .vkuiTabbarItem__tappable--active+.vkuiTabbarItem__in{-webkit-transform:scale(.96);transform:scale(.96)}
+.vkuiTabbarItem{display:flex;align-items:center;justify-content:center;color:#99a2ad;color:var(--tabbar_inactive_icon);text-decoration:none;border:0;outline:0;padding:0;background:0 0;height:48px;height:var(--tabbar_height);position:relative}.vkuiTabbar .vkuiTabbarItem{flex-shrink:0;max-width:100%;min-width:0;flex-grow:1;flex-basis:0}.vkuiTabbarItem--selected{color:#2975cc;color:var(--tabbar_active_icon)}.vkuiTabbarItem__tappable{position:absolute}.vkuiTabbarItem__in{display:flex;padding:0 2px;align-items:center;justify-content:center;pointer-events:none;height:100%;width:100%;overflow:hidden}.vkuiTabbar--l-vertical .vkuiTabbarItem--text .vkuiTabbarItem__in{position:relative;top:2px}.vkuiTabbar--l-vertical .vkuiTabbarItem__in{flex-direction:column}.vkuiTabbar--l-horizontal .vkuiTabbarItem__in{flex-direction:row}.vkuiTabbarItem__icon{position:relative}.vkuiTabbarItem__label .vkuiCounter{position:absolute;top:-2px;right:-9px}.vkuiTabbarItem__label .vkuiBadge{position:absolute;top:-2px;right:-4px}.vkuiTabbarItem__text{white-space:nowrap;max-width:100%;overflow:hidden;text-overflow:ellipsis}.vkuiTabbar--l-vertical .vkuiTabbarItem__text{font-size:10px;line-height:12px;font-weight:500;margin-top:2px;letter-spacing:var(--vk-sans-ls15)}.vkuiTabbar--l-horizontal .vkuiTabbarItem__text{font-size:13px;font-weight:500;margin-left:8px}.vkuiTabbarItem--android .vkuiTabbarItem__tappable{width:calc(100% + 16px);padding-bottom:calc(100% + 16px);border-radius:50%}.vkuiTabbarItem--android:first-child{border-top-left-radius:0;border-bottom-left-radius:0}.vkuiTabbarItem--android:last-child{border-top-right-radius:0;border-bottom-right-radius:0}.vkuiTabbarItem--ios .vkuiTabbarItem__tappable{width:100%;height:100%;top:0;left:0}.vkuiTabbarItem--ios .vkuiTabbarItem__in{transition:-webkit-transform .07s cubic-bezier(.36,.66,.04,1);transition:transform .07s cubic-bezier(.36,.66,.04,1);transition:transform .07s cubic-bezier(.36,.66,.04,1),-webkit-transform .07s cubic-bezier(.36,.66,.04,1);transition:-webkit-transform .07s var(--ios-easing);transition:transform .07s var(--ios-easing);transition:transform .07s var(--ios-easing),-webkit-transform .07s var(--ios-easing)}.vkuiTabbarItem--ios .vkuiTabbarItem__tappable--active+.vkuiTabbarItem__in{-webkit-transform:scale(.96);transform:scale(.96)}

package/dist/cssm/components/TabbarItem/TabbarItem.d.ts

@@ -5,7 +5,7 @@ export interface TabbarItemProps extends Omit<React.AllHTMLAttributes<HTMLElemen
 HasRootRef<HTMLElement>, HasComponent {
     selected?: boolean;
     /**
-     * Тест рядом с иконкой
+     * Текст рядом с иконкой
      */
     text?: React.ReactNode;
     /**

package/dist/cssm/components/TabbarItem/TabbarItem.js

@@ -33,7 +33,8 @@ var TabbarItem = function TabbarItem(_ref) {
 
   return createScopedElement(Component, _extends({}, restProps, {
     disabled: disabled,
-    href: href,
+    href: href // eslint-disable-next-line vkui/no-object-expression-in-arguments
+    ,
     vkuiClass: classNames(getClassName("TabbarItem", platform), {
       "TabbarItem--selected": selected,
       "TabbarItem--text": !!text

package/dist/cssm/components/TabbarItem/TabbarItem.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/components/TabbarItem/TabbarItem.tsx"],"names":["getClassName","Counter","classNames","usePlatform","hasReactNode","Tappable","Platform","warnOnce","warn","TabbarItem","children","selected","label","indicator","text","href","Component","disabled","restProps","platform","process","env","NODE_ENV","IOS"],"mappings":";;;;AACA,SAASA,YAAT;AACA,OAAOC,OAAP;AACA,SAASC,UAAT;AACA,SAASC,WAAT;AACA,SAASC,YAAT;AACA,OAAOC,QAAP;AACA,SAASC,QAAT;AAEA,SAASC,QAAT;AACA;AAqBA,IAAMC,IAAI,GAAGD,QAAQ,CAAC,YAAD,CAArB;;AACA,IAAME,UAAoD,GAAG,SAAvDA,UAAuD,OAUtC;AAAA,MATrBC,QASqB,QATrBA,QASqB;AAAA,MARrBC,QAQqB,QARrBA,QAQqB;AAAA,MAPrBC,KAOqB,QAPrBA,KAOqB;AAAA,MANrBC,SAMqB,QANrBA,SAMqB;AAAA,MALrBC,IAKqB,QALrBA,IAKqB;AAAA,MAJrBC,IAIqB,QAJrBA,IAIqB;AAAA,4BAHrBC,SAGqB;AAAA,MAHrBA,SAGqB,+BAHTD,IAAI,GAAG,GAAH,GAAS,QAGJ;AAAA,MAFrBE,QAEqB,QAFrBA,QAEqB;AAAA,MADlBC,SACkB;;AACrB,MAAMC,QAAQ,GAAGhB,WAAW,EAA5B;;AAEA,MAAIS,KAAK,IAAIQ,OAAO,CAACC,GAAR,CAAYC,QAAZ,KAAyB,aAAtC,EAAqD;AACnDd,IAAAA,IAAI,CACF,yEADE,CAAJ;AAGD;;AAED,SACE,oBAAC,SAAD,eACMU,SADN;AAEE,IAAA,QAAQ,EAAED,QAFZ;AAGE,IAAA,IAAI,EAAEF,IAHR;AAIE,IAAA,SAAS,EAAEb,UAAU,CAACF,YAAY,CAAC,YAAD,EAAemB,QAAf,CAAb,EAAuC;AAC1D,8BAAwBR,QADkC;AAE1D,0BAAoB,CAAC,CAACG;AAFoC,KAAvC;AAJvB,MASE,oBAAC,QAAD;AACE,IAAA,IAAI,EAAC,cADP;AAEE,IAAA,SAAS,EAAC,KAFZ;AAGE,IAAA,QAAQ,EAAEG,QAHZ;AAIE,IAAA,UAAU,EACRE,QAAQ,KAAKb,QAAQ,CAACiB,GAAtB,GACI,8BADJ,GAEI,YAPR;AASE,IAAA,iBAAiB,EAAEJ,QAAQ,KAAKb,QAAQ,CAACiB,GAAtB,GAA4B,CAA5B,GAAgC,GATrD;AAUE,IAAA,QAAQ,EAAE,KAVZ;AAWE,IAAA,SAAS,EAAC;AAXZ,IATF,EAsBE;AAAK,IAAA,SAAS,EAAC;AAAf,KACE;AAAK,IAAA,SAAS,EAAC;AAAf,KACGb,QADH,EAEE;AAAK,IAAA,SAAS,EAAC;AAAf,KACGN,YAAY,CAACS,SAAD,CAAZ,IAA2BA,SAD9B,EAEG,CAACA,SAAD,IAAcD,KAAd,IACC,oBAAC,OAAD;AAAS,IAAA,IAAI,EAAC,GAAd;AAAkB,IAAA,IAAI,EAAC;AAAvB,KACGA,KADH,CAHJ,CAFF,CADF,EAYGE,IAAI,IAAI;AAAK,IAAA,SAAS,EAAC;AAAf,KAAmCA,IAAnC,CAZX,CAtBF,CADF;AAuCD,CA1DD,C,CA4DA;;;AACA,eAAeL,UAAf","sourcesContent":["import * as React from \"react\";\nimport { getClassName } from \"../../helpers/getClassName\";\nimport Counter from \"../Counter/Counter\";\nimport { classNames } from \"../../lib/classNames\";\nimport { usePlatform } from \"../../hooks/usePlatform\";\nimport { hasReactNode } from \"../../lib/utils\";\nimport Tappable from \"../Tappable/Tappable\";\nimport { Platform } from \"../../lib/platform\";\nimport { HasComponent, HasRootRef } from \"../../types\";\nimport { warnOnce } from \"../../lib/warnOnce\";\nimport \"./TabbarItem.css\";\n\nexport interface TabbarItemProps\n  extends Omit<React.AllHTMLAttributes<HTMLElement>, \"label\">, // TODO убрать Omit после удаления свойства label\n    HasRootRef<HTMLElement>,\n    HasComponent {\n  selected?: boolean;\n  /**\n   * Тест рядом с иконкой\n   */\n  text?: React.ReactNode;\n  /**\n   * Индикатор над иконкой. Принимает `<Badge mode=\"prominent\" />` или `<Counter size=\"s\" mode=\"prominent\" />`\n   */\n  indicator?: React.ReactNode;\n  /**\n   * @deprecated будет удалено в 5.0.0. Используйте `indicator`\n   */\n  label?: React.ReactNode;\n}\n\nconst warn = warnOnce(\"TabbarItem\");\nconst TabbarItem: React.FunctionComponent<TabbarItemProps> = ({\n  children,\n  selected,\n  label,\n  indicator,\n  text,\n  href,\n  Component = href ? \"a\" : \"button\",\n  disabled,\n  ...restProps\n}: TabbarItemProps) => {\n  const platform = usePlatform();\n\n  if (label && process.env.NODE_ENV === \"development\") {\n    warn(\n      \"Свойство label устарело и будет удалено в 5.0.0. Используйте indicator.\"\n    );\n  }\n\n  return (\n    <Component\n      {...restProps}\n      disabled={disabled}\n      href={href}\n      vkuiClass={classNames(getClassName(\"TabbarItem\", platform), {\n        \"TabbarItem--selected\": selected,\n        \"TabbarItem--text\": !!text,\n      })}\n    >\n      <Tappable\n        role=\"presentation\"\n        Component=\"div\"\n        disabled={disabled}\n        activeMode={\n          platform === Platform.IOS\n            ? \"TabbarItem__tappable--active\"\n            : \"background\"\n        }\n        activeEffectDelay={platform === Platform.IOS ? 0 : 300}\n        hasHover={false}\n        vkuiClass=\"TabbarItem__tappable\"\n      />\n      <div vkuiClass=\"TabbarItem__in\">\n        <div vkuiClass=\"TabbarItem__icon\">\n          {children}\n          <div vkuiClass=\"TabbarItem__label\">\n            {hasReactNode(indicator) && indicator}\n            {!indicator && label && (\n              <Counter size=\"s\" mode=\"prominent\">\n                {label}\n              </Counter>\n            )}\n          </div>\n        </div>\n        {text && <div vkuiClass=\"TabbarItem__text\">{text}</div>}\n      </div>\n    </Component>\n  );\n};\n\n// eslint-disable-next-line import/no-default-export\nexport default TabbarItem;\n"],"file":"TabbarItem.js"}
+{"version":3,"sources":["../../../../src/components/TabbarItem/TabbarItem.tsx"],"names":["getClassName","Counter","classNames","usePlatform","hasReactNode","Tappable","Platform","warnOnce","warn","TabbarItem","children","selected","label","indicator","text","href","Component","disabled","restProps","platform","process","env","NODE_ENV","IOS"],"mappings":";;;;AACA,SAASA,YAAT;AACA,OAAOC,OAAP;AACA,SAASC,UAAT;AACA,SAASC,WAAT;AACA,SAASC,YAAT;AACA,OAAOC,QAAP;AACA,SAASC,QAAT;AAEA,SAASC,QAAT;AACA;AAqBA,IAAMC,IAAI,GAAGD,QAAQ,CAAC,YAAD,CAArB;;AACA,IAAME,UAAoD,GAAG,SAAvDA,UAAuD,OAUtC;AAAA,MATrBC,QASqB,QATrBA,QASqB;AAAA,MARrBC,QAQqB,QARrBA,QAQqB;AAAA,MAPrBC,KAOqB,QAPrBA,KAOqB;AAAA,MANrBC,SAMqB,QANrBA,SAMqB;AAAA,MALrBC,IAKqB,QALrBA,IAKqB;AAAA,MAJrBC,IAIqB,QAJrBA,IAIqB;AAAA,4BAHrBC,SAGqB;AAAA,MAHrBA,SAGqB,+BAHTD,IAAI,GAAG,GAAH,GAAS,QAGJ;AAAA,MAFrBE,QAEqB,QAFrBA,QAEqB;AAAA,MADlBC,SACkB;;AACrB,MAAMC,QAAQ,GAAGhB,WAAW,EAA5B;;AAEA,MAAIS,KAAK,IAAIQ,OAAO,CAACC,GAAR,CAAYC,QAAZ,KAAyB,aAAtC,EAAqD;AACnDd,IAAAA,IAAI,CACF,yEADE,CAAJ;AAGD;;AAED,SACE,oBAAC,SAAD,eACMU,SADN;AAEE,IAAA,QAAQ,EAAED,QAFZ;AAGE,IAAA,IAAI,EAAEF,IAHR,CAIE;AAJF;AAKE,IAAA,SAAS,EAAEb,UAAU,CAACF,YAAY,CAAC,YAAD,EAAemB,QAAf,CAAb,EAAuC;AAC1D,8BAAwBR,QADkC;AAE1D,0BAAoB,CAAC,CAACG;AAFoC,KAAvC;AALvB,MAUE,oBAAC,QAAD;AACE,IAAA,IAAI,EAAC,cADP;AAEE,IAAA,SAAS,EAAC,KAFZ;AAGE,IAAA,QAAQ,EAAEG,QAHZ;AAIE,IAAA,UAAU,EACRE,QAAQ,KAAKb,QAAQ,CAACiB,GAAtB,GACI,8BADJ,GAEI,YAPR;AASE,IAAA,iBAAiB,EAAEJ,QAAQ,KAAKb,QAAQ,CAACiB,GAAtB,GAA4B,CAA5B,GAAgC,GATrD;AAUE,IAAA,QAAQ,EAAE,KAVZ;AAWE,IAAA,SAAS,EAAC;AAXZ,IAVF,EAuBE;AAAK,IAAA,SAAS,EAAC;AAAf,KACE;AAAK,IAAA,SAAS,EAAC;AAAf,KACGb,QADH,EAEE;AAAK,IAAA,SAAS,EAAC;AAAf,KACGN,YAAY,CAACS,SAAD,CAAZ,IAA2BA,SAD9B,EAEG,CAACA,SAAD,IAAcD,KAAd,IACC,oBAAC,OAAD;AAAS,IAAA,IAAI,EAAC,GAAd;AAAkB,IAAA,IAAI,EAAC;AAAvB,KACGA,KADH,CAHJ,CAFF,CADF,EAYGE,IAAI,IAAI;AAAK,IAAA,SAAS,EAAC;AAAf,KAAmCA,IAAnC,CAZX,CAvBF,CADF;AAwCD,CA3DD,C,CA6DA;;;AACA,eAAeL,UAAf","sourcesContent":["import * as React from \"react\";\nimport { getClassName } from \"../../helpers/getClassName\";\nimport Counter from \"../Counter/Counter\";\nimport { classNames } from \"../../lib/classNames\";\nimport { usePlatform } from \"../../hooks/usePlatform\";\nimport { hasReactNode } from \"../../lib/utils\";\nimport Tappable from \"../Tappable/Tappable\";\nimport { Platform } from \"../../lib/platform\";\nimport { HasComponent, HasRootRef } from \"../../types\";\nimport { warnOnce } from \"../../lib/warnOnce\";\nimport \"./TabbarItem.css\";\n\nexport interface TabbarItemProps\n  extends Omit<React.AllHTMLAttributes<HTMLElement>, \"label\">, // TODO убрать Omit после удаления свойства label\n    HasRootRef<HTMLElement>,\n    HasComponent {\n  selected?: boolean;\n  /**\n   * Текст рядом с иконкой\n   */\n  text?: React.ReactNode;\n  /**\n   * Индикатор над иконкой. Принимает `<Badge mode=\"prominent\" />` или `<Counter size=\"s\" mode=\"prominent\" />`\n   */\n  indicator?: React.ReactNode;\n  /**\n   * @deprecated будет удалено в 5.0.0. Используйте `indicator`\n   */\n  label?: React.ReactNode;\n}\n\nconst warn = warnOnce(\"TabbarItem\");\nconst TabbarItem: React.FunctionComponent<TabbarItemProps> = ({\n  children,\n  selected,\n  label,\n  indicator,\n  text,\n  href,\n  Component = href ? \"a\" : \"button\",\n  disabled,\n  ...restProps\n}: TabbarItemProps) => {\n  const platform = usePlatform();\n\n  if (label && process.env.NODE_ENV === \"development\") {\n    warn(\n      \"Свойство label устарело и будет удалено в 5.0.0. Используйте indicator.\"\n    );\n  }\n\n  return (\n    <Component\n      {...restProps}\n      disabled={disabled}\n      href={href}\n      // eslint-disable-next-line vkui/no-object-expression-in-arguments\n      vkuiClass={classNames(getClassName(\"TabbarItem\", platform), {\n        \"TabbarItem--selected\": selected,\n        \"TabbarItem--text\": !!text,\n      })}\n    >\n      <Tappable\n        role=\"presentation\"\n        Component=\"div\"\n        disabled={disabled}\n        activeMode={\n          platform === Platform.IOS\n            ? \"TabbarItem__tappable--active\"\n            : \"background\"\n        }\n        activeEffectDelay={platform === Platform.IOS ? 0 : 300}\n        hasHover={false}\n        vkuiClass=\"TabbarItem__tappable\"\n      />\n      <div vkuiClass=\"TabbarItem__in\">\n        <div vkuiClass=\"TabbarItem__icon\">\n          {children}\n          <div vkuiClass=\"TabbarItem__label\">\n            {hasReactNode(indicator) && indicator}\n            {!indicator && label && (\n              <Counter size=\"s\" mode=\"prominent\">\n                {label}\n              </Counter>\n            )}\n          </div>\n        </div>\n        {text && <div vkuiClass=\"TabbarItem__text\">{text}</div>}\n      </div>\n    </Component>\n  );\n};\n\n// eslint-disable-next-line import/no-default-export\nexport default TabbarItem;\n"],"file":"TabbarItem.js"}

package/dist/cssm/components/Tabs/Tabs.css

@@ -1 +1 @@
-.vkuiTabs__in,.vkuiTabs .vkuiHorizontalScroll__in-wrapper{display:flex;align-items:center}.vkuiPanelHeader .vkuiTabs{overflow:hidden;font-family:-apple-system,system-ui,Helvetica Neue,Roboto,sans-serif;font-family:var(--font-common)}.vkuiPanelHeader .vkuiTabs::after{display:block;width:1000px;content:""}.vkuiTabs .vkuiHorizontalScroll{min-width:100%}.vkuiTabs--buttons{padding-top:8px;padding-bottom:8px}.vkuiTabs--default,.vkuiTabs--default .vkuiHorizontalScroll__in-wrapper{justify-content:center}.vkuiTabs--buttons,.vkuiTabs--default .vkuiHorizontalScroll__in-wrapper{justify-content:flex-start}.vkuiTabs--sizeX-compact.vkuiTabs--buttons .vkuiHorizontalScroll__in-wrapper::after,.vkuiTabs--sizeX-compact.vkuiTabs--buttons .vkuiHorizontalScroll__in-wrapper::before{display:block;width:8px;flex-shrink:0;height:1px;content:""}.vkuiTabs--ios.vkuiTabs--segmented{padding:4px 12px 8px}.vkuiFixedLayout--ios.vkuiFixedLayout--bottom .vkuiTabs::after{position:absolute;left:0;top:0;width:100%;height:100%;content:"";background:#fff;background:var(--background_content)}.vkuiFixedLayout--ios.vkuiFixedLayout--bottom .vkuiTabs__in,.vkuiFixedLayout--ios.vkuiFixedLayout--bottom .vkuiSeparator{position:relative;z-index:2}.vkuiTabsItem .vkuiCounter{margin-left:8px}.vkuiTabs .vkuiTabsItem .vkuiCounter--secondary{background:#76787a;background:var(--panel_tab_inactive_text);color:#fff;color:var(--white)}.vkuiTabs .vkuiTabsItem--selected .vkuiCounter--secondary{background:#5d5f61;background:var(--panel_tab_active_text);color:#ebedf0;color:var(--panel_tab_active_background)}.vkuiTabs--ios.vkuiTabs--segmented .vkuiTabsItem .vkuiCounter--secondary{background:#99a2ad;background:var(--segmented_control_tint);color:#fff;color:var(--background_content)}.vkuiTabs--ios.vkuiTabs--segmented .vkuiTabsItem--selected .vkuiCounter--secondary{background:#fff;background:var(--background_content);color:#99a2ad;color:var(--segmented_control_tint)}.vkuiTabs--ios.vkuiTabs--segmented .vkuiTabsItem .vkuiCounter--s-m{position:relative;top:1px}
+.vkuiTabs__in,.vkuiTabs .vkuiHorizontalScroll__in-wrapper{display:flex;align-items:center}.vkuiPanelHeader .vkuiTabs{overflow:hidden;font-family:-apple-systemsystem-uiHelvetica NeueRobotosans-serif;font-family:var(--font-common)}.vkuiPanelHeader .vkuiTabs::after{display:block;width:1000px;content:""}.vkuiTabs .vkuiHorizontalScroll{min-width:100%}.vkuiTabs--buttons{padding-top:8px;padding-bottom:8px}.vkuiTabs--default,.vkuiTabs--default .vkuiHorizontalScroll__in-wrapper{justify-content:center}.vkuiTabs--buttons,.vkuiTabs--default .vkuiHorizontalScroll__in-wrapper{justify-content:flex-start}.vkuiTabs--sizeX-compact.vkuiTabs--buttons .vkuiHorizontalScroll__in-wrapper::after,.vkuiTabs--sizeX-compact.vkuiTabs--buttons .vkuiHorizontalScroll__in-wrapper::before{display:block;width:8px;flex-shrink:0;height:1px;content:""}.vkuiTabs--ios.vkuiTabs--segmented{padding:4px 12px 8px}.vkuiFixedLayout--ios.vkuiFixedLayout--bottom .vkuiTabs::after{position:absolute;left:0;top:0;width:100%;height:100%;content:"";background:#fff;background:var(--background_content)}.vkuiFixedLayout--ios.vkuiFixedLayout--bottom .vkuiTabs__in,.vkuiFixedLayout--ios.vkuiFixedLayout--bottom .vkuiSeparator{position:relative;z-index:2}.vkuiTabsItem .vkuiCounter{margin-left:8px}.vkuiTabs .vkuiTabsItem .vkuiCounter--secondary{background:#76787a;background:var(--panel_tab_inactive_text);color:#fff;color:var(--white)}.vkuiTabs .vkuiTabsItem--selected .vkuiCounter--secondary{background:#5d5f61;background:var(--panel_tab_active_text);color:#ebedf0;color:var(--panel_tab_active_background)}.vkuiTabs--ios.vkuiTabs--segmented .vkuiTabsItem .vkuiCounter--secondary{background:#99a2ad;background:var(--segmented_control_tint);color:#fff;color:var(--background_content)}.vkuiTabs--ios.vkuiTabs--segmented .vkuiTabsItem--selected .vkuiCounter--secondary{background:#fff;background:var(--background_content);color:#99a2ad;color:var(--segmented_control_tint)}.vkuiTabs--ios.vkuiTabs--segmented .vkuiTabsItem .vkuiCounter--s-m{position:relative;top:1px}

package/dist/cssm/components/TabsItem/TabsItem.js

@@ -11,7 +11,7 @@ import { usePlatform } from "../../hooks/usePlatform";
 import { hasReactNode } from "../../lib/utils";
 import { TabsModeContext } from "../Tabs/Tabs";
 import Headline from "../Typography/Headline/Headline";
-import Subhead from "../Typography/Subhead/Subhead";
+import { Subhead } from "../Typography/Subhead/Subhead";
 import Text from "../Typography/Text/Text";
 import "./TabsItem.css";
 
@@ -30,6 +30,7 @@ var TabsItem = function TabsItem(_ref) {
   }
 
   return createScopedElement(Tappable, _extends({}, restProps, {
+    // eslint-disable-next-line vkui/no-object-expression-in-arguments
     vkuiClass: classNames(getClassName("TabsItem", platform), {
       "TabsItem--selected": selected
     }),

package/dist/cssm/components/TabsItem/TabsItem.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/components/TabsItem/TabsItem.tsx"],"names":["React","getClassName","Tappable","classNames","VKCOM","usePlatform","hasReactNode","TabsModeContext","Headline","Subhead","Text","TabsItem","children","selected","after","restProps","platform","mode","useContext","TypographyComponent","defaultProps"],"mappings":";;;;AAAA,OAAO,KAAKA,KAAZ,MAAuB,OAAvB;AACA,SAASC,YAAT;AACA,OAAOC,QAAP;AACA,SAASC,UAAT;AACA,SAASC,KAAT;AACA,SAASC,WAAT;AACA,SAASC,YAAT;AACA,SAAoBC,eAApB;AACA,OAAOC,QAAP;AACA,OAAOC,OAAP;AACA,OAAOC,IAAP;AACA;;AAOA,IAAMC,QAAiC,GAAG,SAApCA,QAAoC,OAKrB;AAAA,MAJnBC,QAImB,QAJnBA,QAImB;AAAA,MAHnBC,QAGmB,QAHnBA,QAGmB;AAAA,MAFnBC,KAEmB,QAFnBA,KAEmB;AAAA,MADhBC,SACgB;;AACnB,MAAMC,QAAQ,GAAGX,WAAW,EAA5B;AACA,MAAMY,IAAuB,GAAGjB,KAAK,CAACkB,UAAN,CAAiBX,eAAjB,CAAhC;AAEA,MAAIY,mBAAmB,GACrBF,IAAI,KAAK,SAAT,IAAsBA,IAAI,KAAK,WAA/B,GAA6CR,OAA7C,GAAuDD,QADzD;;AAGA,MAAIQ,QAAQ,KAAKZ,KAAjB,EAAwB;AACtBe,IAAAA,mBAAmB,GAAGT,IAAtB;AACD;;AAED,SACE,oBAAC,QAAD,eACMK,SADN;AAEE,IAAA,SAAS,EAAEZ,UAAU,CAACF,YAAY,CAAC,UAAD,EAAae,QAAb,CAAb,EAAqC;AACxD,4BAAsBH;AADkC,KAArC,CAFvB;AAKE,IAAA,SAAS,EAAEI,IAAI,KAAK,WALtB;AAME,IAAA,UAAU,EAAC,kBANb;AAOE,IAAA,gBAAgB,EAAEA,IAAI,KAAK,WAAT,GAAuB,SAAvB,GAAmC;AAPvD,MASE,oBAAC,mBAAD;AACE,IAAA,SAAS,EAAC,MADZ;AAEE,IAAA,SAAS,EAAC,cAFZ;AAGE,IAAA,MAAM,EAAC;AAHT,KAKGL,QALH,CATF,EAgBGN,YAAY,CAACQ,KAAD,CAAZ,IAAuB;AAAK,IAAA,SAAS,EAAC;AAAf,KAAkCA,KAAlC,CAhB1B,CADF;AAoBD,CApCD;;AAsCAH,QAAQ,CAACS,YAAT,GAAwB;AACtBP,EAAAA,QAAQ,EAAE;AADY,CAAxB,C,CAIA;;AACA,eAAeF,QAAf","sourcesContent":["import * as React from \"react\";\nimport { getClassName } from \"../../helpers/getClassName\";\nimport Tappable from \"../Tappable/Tappable\";\nimport { classNames } from \"../../lib/classNames\";\nimport { VKCOM } from \"../../lib/platform\";\nimport { usePlatform } from \"../../hooks/usePlatform\";\nimport { hasReactNode } from \"../../lib/utils\";\nimport { TabsProps, TabsModeContext } from \"../Tabs/Tabs\";\nimport Headline from \"../Typography/Headline/Headline\";\nimport Subhead from \"../Typography/Subhead/Subhead\";\nimport Text from \"../Typography/Text/Text\";\nimport \"./TabsItem.css\";\n\nexport interface TabsItemProps extends React.HTMLAttributes<HTMLElement> {\n  after?: React.ReactNode;\n  selected?: boolean;\n}\n\nconst TabsItem: React.FC<TabsItemProps> = ({\n  children,\n  selected,\n  after,\n  ...restProps\n}: TabsItemProps) => {\n  const platform = usePlatform();\n  const mode: TabsProps[\"mode\"] = React.useContext(TabsModeContext);\n\n  let TypographyComponent =\n    mode === \"buttons\" || mode === \"segmented\" ? Subhead : Headline;\n\n  if (platform === VKCOM) {\n    TypographyComponent = Text;\n  }\n\n  return (\n    <Tappable\n      {...restProps}\n      vkuiClass={classNames(getClassName(\"TabsItem\", platform), {\n        \"TabsItem--selected\": selected,\n      })}\n      hasActive={mode === \"segmented\"}\n      activeMode=\"TabsItem--active\"\n      focusVisibleMode={mode === \"segmented\" ? \"outside\" : \"inside\"}\n    >\n      <TypographyComponent\n        Component=\"span\"\n        vkuiClass=\"TabsItem__in\"\n        weight=\"medium\"\n      >\n        {children}\n      </TypographyComponent>\n      {hasReactNode(after) && <div vkuiClass=\"TabsItem__after\">{after}</div>}\n    </Tappable>\n  );\n};\n\nTabsItem.defaultProps = {\n  selected: false,\n};\n\n// eslint-disable-next-line import/no-default-export\nexport default TabsItem;\n"],"file":"TabsItem.js"}
+{"version":3,"sources":["../../../../src/components/TabsItem/TabsItem.tsx"],"names":["React","getClassName","Tappable","classNames","VKCOM","usePlatform","hasReactNode","TabsModeContext","Headline","Subhead","Text","TabsItem","children","selected","after","restProps","platform","mode","useContext","TypographyComponent","defaultProps"],"mappings":";;;;AAAA,OAAO,KAAKA,KAAZ,MAAuB,OAAvB;AACA,SAASC,YAAT;AACA,OAAOC,QAAP;AACA,SAASC,UAAT;AACA,SAASC,KAAT;AACA,SAASC,WAAT;AACA,SAASC,YAAT;AACA,SAAoBC,eAApB;AACA,OAAOC,QAAP;AACA,SAASC,OAAT;AACA,OAAOC,IAAP;AACA;;AAOA,IAAMC,QAAiC,GAAG,SAApCA,QAAoC,OAKrB;AAAA,MAJnBC,QAImB,QAJnBA,QAImB;AAAA,MAHnBC,QAGmB,QAHnBA,QAGmB;AAAA,MAFnBC,KAEmB,QAFnBA,KAEmB;AAAA,MADhBC,SACgB;;AACnB,MAAMC,QAAQ,GAAGX,WAAW,EAA5B;AACA,MAAMY,IAAuB,GAAGjB,KAAK,CAACkB,UAAN,CAAiBX,eAAjB,CAAhC;AAEA,MAAIY,mBAAmB,GACrBF,IAAI,KAAK,SAAT,IAAsBA,IAAI,KAAK,WAA/B,GAA6CR,OAA7C,GAAuDD,QADzD;;AAGA,MAAIQ,QAAQ,KAAKZ,KAAjB,EAAwB;AACtBe,IAAAA,mBAAmB,GAAGT,IAAtB;AACD;;AAED,SACE,oBAAC,QAAD,eACMK,SADN;AAEE;AACA,IAAA,SAAS,EAAEZ,UAAU,CAACF,YAAY,CAAC,UAAD,EAAae,QAAb,CAAb,EAAqC;AACxD,4BAAsBH;AADkC,KAArC,CAHvB;AAME,IAAA,SAAS,EAAEI,IAAI,KAAK,WANtB;AAOE,IAAA,UAAU,EAAC,kBAPb;AAQE,IAAA,gBAAgB,EAAEA,IAAI,KAAK,WAAT,GAAuB,SAAvB,GAAmC;AARvD,MAUE,oBAAC,mBAAD;AACE,IAAA,SAAS,EAAC,MADZ;AAEE,IAAA,SAAS,EAAC,cAFZ;AAGE,IAAA,MAAM,EAAC;AAHT,KAKGL,QALH,CAVF,EAiBGN,YAAY,CAACQ,KAAD,CAAZ,IAAuB;AAAK,IAAA,SAAS,EAAC;AAAf,KAAkCA,KAAlC,CAjB1B,CADF;AAqBD,CArCD;;AAuCAH,QAAQ,CAACS,YAAT,GAAwB;AACtBP,EAAAA,QAAQ,EAAE;AADY,CAAxB,C,CAIA;;AACA,eAAeF,QAAf","sourcesContent":["import * as React from \"react\";\nimport { getClassName } from \"../../helpers/getClassName\";\nimport Tappable from \"../Tappable/Tappable\";\nimport { classNames } from \"../../lib/classNames\";\nimport { VKCOM } from \"../../lib/platform\";\nimport { usePlatform } from \"../../hooks/usePlatform\";\nimport { hasReactNode } from \"../../lib/utils\";\nimport { TabsProps, TabsModeContext } from \"../Tabs/Tabs\";\nimport Headline from \"../Typography/Headline/Headline\";\nimport { Subhead } from \"../Typography/Subhead/Subhead\";\nimport Text from \"../Typography/Text/Text\";\nimport \"./TabsItem.css\";\n\nexport interface TabsItemProps extends React.HTMLAttributes<HTMLElement> {\n  after?: React.ReactNode;\n  selected?: boolean;\n}\n\nconst TabsItem: React.FC<TabsItemProps> = ({\n  children,\n  selected,\n  after,\n  ...restProps\n}: TabsItemProps) => {\n  const platform = usePlatform();\n  const mode: TabsProps[\"mode\"] = React.useContext(TabsModeContext);\n\n  let TypographyComponent =\n    mode === \"buttons\" || mode === \"segmented\" ? Subhead : Headline;\n\n  if (platform === VKCOM) {\n    TypographyComponent = Text;\n  }\n\n  return (\n    <Tappable\n      {...restProps}\n      // eslint-disable-next-line vkui/no-object-expression-in-arguments\n      vkuiClass={classNames(getClassName(\"TabsItem\", platform), {\n        \"TabsItem--selected\": selected,\n      })}\n      hasActive={mode === \"segmented\"}\n      activeMode=\"TabsItem--active\"\n      focusVisibleMode={mode === \"segmented\" ? \"outside\" : \"inside\"}\n    >\n      <TypographyComponent\n        Component=\"span\"\n        vkuiClass=\"TabsItem__in\"\n        weight=\"medium\"\n      >\n        {children}\n      </TypographyComponent>\n      {hasReactNode(after) && <div vkuiClass=\"TabsItem__after\">{after}</div>}\n    </Tappable>\n  );\n};\n\nTabsItem.defaultProps = {\n  selected: false,\n};\n\n// eslint-disable-next-line import/no-default-export\nexport default TabsItem;\n"],"file":"TabsItem.js"}