@vkontakte/vkui 5.0.0 → 5.0.1

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

@@ -1 +1 @@
-{"version":3,"file":"Popper.js","names":["React","usePopper","AppRootPortal","PopperArrow","usePlatform","getClassName","useExternRef","useIsomorphicLayoutEffect","ARROW_PADDING","ARROW_WIDTH","ARROW_HEIGHT","preventOverflowModifier","name","options","mainAxis","flipModifier","arrowModifier","padding","sameWidthModifier","enabled","phase","requires","fn","state","styles","popper","width","rects","reference","effect","elements","style","offsetWidth","Popper","targetRef","children","getRef","placement","onPlacementChange","arrow","arrowClassName","sameWidth","offsetDistance","offsetSkidding","forcePortal","compStyles","customModifiers","renderContent","restProps","useState","popperNode","setPopperNode","smallTargetOffsetSkidding","setSmallTargetOffsetSkidding","platform","setExternalRef","modifiers","useMemo","offset","push","current","attributes","resolvedPlacement","isEdgePlacement","includes","placementDirection","startsWith","arrowSize","targetSize","offsetHeight","useEffect","dropdown","minWidth","scrollWidth","undefined","className"],"sources":["../../../../src/components/Popper/Popper.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { usePopper, Modifier } from \"react-popper\";\nimport { AppRootPortal } from \"../AppRoot/AppRootPortal\";\nimport { PopperArrow } from \"../PopperArrow/PopperArrow\";\nimport { HasRef } from \"../../types\";\nimport { usePlatform } from \"../../hooks/usePlatform\";\nimport { getClassName } from \"../../helpers/getClassName\";\nimport { useExternRef } from \"../../hooks/useExternRef\";\nimport { useIsomorphicLayoutEffect } from \"../../lib/useIsomorphicLayoutEffect\";\nimport \"./Popper.css\";\n\nexport type Placement =\n  | \"auto\"\n  | \"auto-start\"\n  | \"auto-end\"\n  | \"top-start\"\n  | \"top-end\"\n  | \"bottom-start\"\n  | \"bottom-end\"\n  | \"right-start\"\n  | \"right-end\"\n  | \"left-start\"\n  | \"left-end\"\n  | \"top\"\n  | \"bottom\"\n  | \"left\"\n  | \"right\";\n\nexport interface PopperRenderContentProps {\n  className: string;\n}\n\nexport interface PopperCommonProps\n  extends React.HTMLAttributes<HTMLDivElement>,\n    HasRef<HTMLDivElement> {\n  /**\n   * По умолчанию компонент выберет наилучшее расположение сам. Но его можно задать извне с помощью этого свойства\n   */\n  placement?: Placement;\n  /**\n   * Отступ по вспомогательной оси\n   */\n  offsetSkidding?: number;\n  /**\n   * Отступ по главной оси\n   */\n  offsetDistance?: number;\n  /**\n   * Отображать ли стрелку, указывающую на якорный элемент\n   */\n  arrow?: boolean;\n  /**\n   * Стиль стрелки\n   */\n  arrowClassName?: string;\n  /**\n   * Выставлять ширину равной target элементу\n   */\n  sameWidth?: boolean;\n  forcePortal?: boolean;\n  onPlacementChange?: (data: { placement?: Placement }) => void;\n  /**\n   * Массив кастомных модификаторов для Popper (необходимо мемоизировать)\n   */\n  customModifiers?: Array<Modifier<string>>;\n  /**\n   * При передаче содержимого в `children`, он будет обёрнут во внутренний контейнер.\n   *\n   * Если хочется управлять этим контейнером, то используйте данную функцию.\n   *\n   * > ⚠️ Параметр `children` будет проигнорирован.\n   */\n  renderContent?(props: PopperRenderContentProps): React.ReactNode;\n}\n\nexport interface PopperProps extends PopperCommonProps {\n  targetRef: React.RefObject<HTMLElement>;\n}\n\nconst ARROW_PADDING = 8;\nconst ARROW_WIDTH = 20;\nconst ARROW_HEIGHT = 8;\n\nconst preventOverflowModifier: Modifier<string> = {\n  name: \"preventOverflow\",\n  options: {\n    mainAxis: false,\n  },\n};\n\nconst flipModifier: Modifier<string> = {\n  name: \"flip\",\n};\n\nconst arrowModifier: Modifier<string> = {\n  name: \"arrow\",\n  options: {\n    padding: ARROW_PADDING,\n  },\n};\n\nconst sameWidthModifier: Modifier<string> = {\n  name: \"sameWidth\",\n  enabled: true,\n  phase: \"beforeWrite\",\n  requires: [\"computeStyles\"],\n  fn: ({ state }) => {\n    state.styles.popper.width = `${state.rects.reference.width}px`;\n  },\n  effect: ({ state }) => {\n    state.elements.popper.style.width = `${\n      (state.elements.reference as HTMLElement).offsetWidth\n    }px`;\n  },\n};\n\n/**\n * @see https://vkcom.github.io/VKUI/#/Popper\n */\nexport const Popper = ({\n  targetRef,\n  children,\n  getRef,\n  placement = \"bottom-start\",\n  onPlacementChange,\n  arrow,\n  arrowClassName,\n  sameWidth,\n  offsetDistance = 8,\n  offsetSkidding = 0,\n  forcePortal = true,\n  style: compStyles,\n  customModifiers,\n  renderContent,\n  ...restProps\n}: PopperProps) => {\n  const [popperNode, setPopperNode] = React.useState<HTMLDivElement | null>(\n    null\n  );\n  const [smallTargetOffsetSkidding, setSmallTargetOffsetSkidding] =\n    React.useState(0);\n  const platform = usePlatform();\n\n  const setExternalRef = useExternRef<HTMLDivElement>(getRef, setPopperNode);\n\n  const modifiers = React.useMemo(() => {\n    const modifiers: Array<Modifier<string>> = [\n      preventOverflowModifier,\n      {\n        name: \"offset\",\n        options: {\n          offset: [\n            arrow ? offsetSkidding - smallTargetOffsetSkidding : offsetSkidding,\n            arrow ? offsetDistance + ARROW_HEIGHT : offsetDistance,\n          ],\n        },\n      },\n      flipModifier,\n    ];\n\n    if (arrow) {\n      modifiers.push(arrowModifier);\n    }\n\n    if (sameWidth) {\n      modifiers.push(sameWidthModifier);\n    }\n\n    if (customModifiers) {\n      modifiers.push(...customModifiers);\n    }\n    return modifiers;\n  }, [\n    arrow,\n    sameWidth,\n    smallTargetOffsetSkidding,\n    offsetSkidding,\n    offsetDistance,\n    customModifiers,\n  ]);\n\n  const { styles, state, attributes } = usePopper(\n    targetRef.current,\n    popperNode,\n    {\n      placement,\n      modifiers,\n    }\n  );\n\n  const resolvedPlacement = state?.placement;\n  const isEdgePlacement =\n    !!resolvedPlacement && resolvedPlacement.includes(\"-\"); // true, если поппер отрисован с краю\n\n  // Если поппер рисуется с краю, то нужно опционально сместить его в тех случаях, когда стрелка не дотягивается до\n  // таргета из-за маленьких размеров последнего\n  useIsomorphicLayoutEffect(() => {\n    if (arrow && isEdgePlacement) {\n      const placementDirection =\n        resolvedPlacement?.startsWith(\"bottom\") ||\n        resolvedPlacement?.startsWith(\"top\")\n          ? \"vertical\"\n          : \"horizontal\";\n\n      const arrowSize =\n        placementDirection === \"vertical\" ? ARROW_WIDTH : ARROW_HEIGHT;\n      const targetSize =\n        (placementDirection === \"vertical\"\n          ? targetRef.current?.offsetWidth\n          : targetRef.current?.offsetHeight) ?? 0;\n\n      if (targetSize < arrowSize + 2 * ARROW_PADDING) {\n        setSmallTargetOffsetSkidding(ARROW_PADDING + arrowSize / 2);\n      }\n    } else {\n      setSmallTargetOffsetSkidding(0);\n    }\n  }, [arrow, isEdgePlacement]);\n\n  React.useEffect(() => {\n    if (resolvedPlacement) {\n      onPlacementChange && onPlacementChange({ placement: resolvedPlacement });\n    }\n  }, [onPlacementChange, resolvedPlacement]);\n\n  const dropdown = (\n    <div\n      {...restProps}\n      {...attributes.popper}\n      vkuiClass={getClassName(\"Popper\", platform)}\n      ref={setExternalRef}\n      style={{\n        ...compStyles,\n        ...styles.popper,\n        minWidth: sameWidth ? targetRef.current?.scrollWidth : undefined,\n      }}\n    >\n      {arrow && (\n        <PopperArrow\n          attributes={attributes.arrow}\n          style={styles.arrow}\n          arrowClassName={arrowClassName}\n        />\n      )}\n      {renderContent ? (\n        renderContent({ className: \"Popper__content\" })\n      ) : (\n        <div vkuiClass=\"Popper__content\">{children}</div>\n      )}\n    </div>\n  );\n\n  return (\n    <AppRootPortal forcePortal={forcePortal} vkuiClass=\"PopperPortal\">\n      {dropdown}\n    </AppRootPortal>\n  );\n};\n"],"mappings":"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"}
+{"version":3,"file":"Popper.js","names":["React","usePopper","AppRootPortal","PopperArrow","usePlatform","getPlatformClassName","useExternRef","useIsomorphicLayoutEffect","classNamesString","ARROW_PADDING","ARROW_WIDTH","ARROW_HEIGHT","preventOverflowModifier","name","options","mainAxis","flipModifier","arrowModifier","padding","sameWidthModifier","enabled","phase","requires","fn","state","styles","popper","width","rects","reference","effect","elements","style","offsetWidth","Popper","targetRef","children","getRef","placement","onPlacementChange","arrow","arrowClassName","sameWidth","offsetDistance","offsetSkidding","forcePortal","compStyles","customModifiers","renderContent","className","restProps","useState","popperNode","setPopperNode","smallTargetOffsetSkidding","setSmallTargetOffsetSkidding","platform","setExternalRef","modifiers","useMemo","offset","push","current","popperStyles","attributes","resolvedPlacement","isEdgePlacement","includes","placementDirection","startsWith","arrowSize","targetSize","offsetHeight","useEffect","dropdown","minWidth","scrollWidth","undefined"],"sources":["../../../../src/components/Popper/Popper.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { usePopper, Modifier } from \"react-popper\";\nimport { AppRootPortal } from \"../AppRoot/AppRootPortal\";\nimport { PopperArrow } from \"../PopperArrow/PopperArrow\";\nimport { HasRef } from \"../../types\";\nimport { usePlatform } from \"../../hooks/usePlatform\";\nimport { getPlatformClassName } from \"../../helpers/getPlatformClassName\";\nimport { useExternRef } from \"../../hooks/useExternRef\";\nimport { useIsomorphicLayoutEffect } from \"../../lib/useIsomorphicLayoutEffect\";\nimport { classNamesString } from \"../../lib/classNames\";\nimport styles from \"./Popper.module.css\";\n\nexport type Placement =\n  | \"auto\"\n  | \"auto-start\"\n  | \"auto-end\"\n  | \"top-start\"\n  | \"top-end\"\n  | \"bottom-start\"\n  | \"bottom-end\"\n  | \"right-start\"\n  | \"right-end\"\n  | \"left-start\"\n  | \"left-end\"\n  | \"top\"\n  | \"bottom\"\n  | \"left\"\n  | \"right\";\n\nexport interface PopperRenderContentProps {\n  className: string;\n}\n\nexport interface PopperCommonProps\n  extends React.HTMLAttributes<HTMLDivElement>,\n    HasRef<HTMLDivElement> {\n  /**\n   * По умолчанию компонент выберет наилучшее расположение сам. Но его можно задать извне с помощью этого свойства\n   */\n  placement?: Placement;\n  /**\n   * Отступ по вспомогательной оси\n   */\n  offsetSkidding?: number;\n  /**\n   * Отступ по главной оси\n   */\n  offsetDistance?: number;\n  /**\n   * Отображать ли стрелку, указывающую на якорный элемент\n   */\n  arrow?: boolean;\n  /**\n   * Стиль стрелки\n   */\n  arrowClassName?: string;\n  /**\n   * Выставлять ширину равной target элементу\n   */\n  sameWidth?: boolean;\n  forcePortal?: boolean;\n  onPlacementChange?: (data: { placement?: Placement }) => void;\n  /**\n   * Массив кастомных модификаторов для Popper (необходимо мемоизировать)\n   */\n  customModifiers?: Array<Modifier<string>>;\n  /**\n   * При передаче содержимого в `children`, он будет обёрнут во внутренний контейнер.\n   *\n   * Если хочется управлять этим контейнером, то используйте данную функцию.\n   *\n   * > ⚠️ Параметр `children` будет проигнорирован.\n   */\n  renderContent?(props: PopperRenderContentProps): React.ReactNode;\n}\n\nexport interface PopperProps extends PopperCommonProps {\n  targetRef: React.RefObject<HTMLElement>;\n}\n\nconst ARROW_PADDING = 8;\nconst ARROW_WIDTH = 20;\nconst ARROW_HEIGHT = 8;\n\nconst preventOverflowModifier: Modifier<string> = {\n  name: \"preventOverflow\",\n  options: {\n    mainAxis: false,\n  },\n};\n\nconst flipModifier: Modifier<string> = {\n  name: \"flip\",\n};\n\nconst arrowModifier: Modifier<string> = {\n  name: \"arrow\",\n  options: {\n    padding: ARROW_PADDING,\n  },\n};\n\nconst sameWidthModifier: Modifier<string> = {\n  name: \"sameWidth\",\n  enabled: true,\n  phase: \"beforeWrite\",\n  requires: [\"computeStyles\"],\n  fn: ({ state }) => {\n    state.styles.popper.width = `${state.rects.reference.width}px`;\n  },\n  effect: ({ state }) => {\n    state.elements.popper.style.width = `${\n      (state.elements.reference as HTMLElement).offsetWidth\n    }px`;\n  },\n};\n\n/**\n * @see https://vkcom.github.io/VKUI/#/Popper\n */\nexport const Popper = ({\n  targetRef,\n  children,\n  getRef,\n  placement = \"bottom-start\",\n  onPlacementChange,\n  arrow,\n  arrowClassName,\n  sameWidth,\n  offsetDistance = 8,\n  offsetSkidding = 0,\n  forcePortal = true,\n  style: compStyles,\n  customModifiers,\n  renderContent,\n  className,\n  ...restProps\n}: PopperProps) => {\n  const [popperNode, setPopperNode] = React.useState<HTMLDivElement | null>(\n    null\n  );\n  const [smallTargetOffsetSkidding, setSmallTargetOffsetSkidding] =\n    React.useState(0);\n  const platform = usePlatform();\n\n  const setExternalRef = useExternRef<HTMLDivElement>(getRef, setPopperNode);\n\n  const modifiers = React.useMemo(() => {\n    const modifiers: Array<Modifier<string>> = [\n      preventOverflowModifier,\n      {\n        name: \"offset\",\n        options: {\n          offset: [\n            arrow ? offsetSkidding - smallTargetOffsetSkidding : offsetSkidding,\n            arrow ? offsetDistance + ARROW_HEIGHT : offsetDistance,\n          ],\n        },\n      },\n      flipModifier,\n    ];\n\n    if (arrow) {\n      modifiers.push(arrowModifier);\n    }\n\n    if (sameWidth) {\n      modifiers.push(sameWidthModifier);\n    }\n\n    if (customModifiers) {\n      modifiers.push(...customModifiers);\n    }\n    return modifiers;\n  }, [\n    arrow,\n    sameWidth,\n    smallTargetOffsetSkidding,\n    offsetSkidding,\n    offsetDistance,\n    customModifiers,\n  ]);\n\n  const {\n    styles: popperStyles,\n    state,\n    attributes,\n  } = usePopper(targetRef.current, popperNode, {\n    placement,\n    modifiers,\n  });\n\n  const resolvedPlacement = state?.placement;\n  const isEdgePlacement =\n    !!resolvedPlacement && resolvedPlacement.includes(\"-\"); // true, если поппер отрисован с краю\n\n  // Если поппер рисуется с краю, то нужно опционально сместить его в тех случаях, когда стрелка не дотягивается до\n  // таргета из-за маленьких размеров последнего\n  useIsomorphicLayoutEffect(() => {\n    if (arrow && isEdgePlacement) {\n      const placementDirection =\n        resolvedPlacement?.startsWith(\"bottom\") ||\n        resolvedPlacement?.startsWith(\"top\")\n          ? \"vertical\"\n          : \"horizontal\";\n\n      const arrowSize =\n        placementDirection === \"vertical\" ? ARROW_WIDTH : ARROW_HEIGHT;\n      const targetSize =\n        (placementDirection === \"vertical\"\n          ? targetRef.current?.offsetWidth\n          : targetRef.current?.offsetHeight) ?? 0;\n\n      if (targetSize < arrowSize + 2 * ARROW_PADDING) {\n        setSmallTargetOffsetSkidding(ARROW_PADDING + arrowSize / 2);\n      }\n    } else {\n      setSmallTargetOffsetSkidding(0);\n    }\n  }, [arrow, isEdgePlacement]);\n\n  React.useEffect(() => {\n    if (resolvedPlacement) {\n      onPlacementChange && onPlacementChange({ placement: resolvedPlacement });\n    }\n  }, [onPlacementChange, resolvedPlacement]);\n\n  const dropdown = (\n    <div\n      {...restProps}\n      {...attributes.popper}\n      className={classNamesString(\n        styles[\"Popper\"],\n        getPlatformClassName(styles[\"Popper\"], platform),\n        className\n      )}\n      ref={setExternalRef}\n      style={{\n        ...compStyles,\n        ...popperStyles.popper,\n        minWidth: sameWidth ? targetRef.current?.scrollWidth : undefined,\n      }}\n    >\n      {arrow && (\n        <PopperArrow\n          attributes={attributes.arrow}\n          style={popperStyles.arrow}\n          arrowClassName={arrowClassName}\n        />\n      )}\n      {renderContent ? (\n        renderContent({ className: styles[\"Popper__content\"] })\n      ) : (\n        <div className={styles[\"Popper__content\"]}>{children}</div>\n      )}\n    </div>\n  );\n\n  return (\n    <AppRootPortal forcePortal={forcePortal} className={styles[\"PopperPortal\"]}>\n      {dropdown}\n    </AppRootPortal>\n  );\n};\n"],"mappings":"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"}

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

@@ -1,5 +1,4 @@
 import * as React from "react";
-import "./PopperArrow.css";
 export interface PopperArrowProps {
     style?: React.CSSProperties;
     attributes?: React.HTMLAttributes<HTMLDivElement> | null;

package/dist/cssm/components/PopperArrow/PopperArrow.js

@@ -1,24 +1,29 @@
 import _extends from "@babel/runtime/helpers/extends";
-import { createScopedElement } from "../../lib/jsxRuntime";
-import "./PopperArrow.css";
+import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
+var _excluded = ["className"];
+import * as React from "react";
+import { classNamesString } from "../../lib/classNames";
+import "./PopperArrow.module.css";
 export var PopperArrow = function PopperArrow(_ref) {
   var style = _ref.style,
-      attributes = _ref.attributes,
-      arrowClassName = _ref.arrowClassName;
-  return createScopedElement("div", _extends({
+    attributes = _ref.attributes,
+    arrowClassName = _ref.arrowClassName;
+  var _ref2 = attributes !== null && attributes !== void 0 ? attributes : {},
+    arrowWrapperClassName = _ref2.className,
+    restAttributes = _objectWithoutProperties(_ref2, _excluded);
+  return /*#__PURE__*/React.createElement("div", _extends({
     style: style
-  }, attributes, {
-    vkuiClass: "PopperArrow",
+  }, restAttributes, {
+    className: classNamesString("vkuiPopperArrow", arrowWrapperClassName),
     "data-popper-arrow": true
-  }), createScopedElement("svg", {
-    vkuiClass: "PopperArrow__in",
-    className: arrowClassName,
+  }), /*#__PURE__*/React.createElement("svg", {
+    className: classNamesString("vkuiPopperArrow__in", arrowClassName),
     width: "20",
     height: "8",
     viewBox: "0 0 20 8",
     fill: "none",
     xmlns: "http://www.w3.org/2000/svg"
-  }, createScopedElement("path", {
+  }, /*#__PURE__*/React.createElement("path", {
     fillRule: "evenodd",
     clipRule: "evenodd",
     d: "M10 0C13 0 15.9999 8 20 8H0C3.9749 8 7 0 10 0Z",

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

@@ -1 +1 @@
-{"version":3,"file":"PopperArrow.js","names":["PopperArrow","style","attributes","arrowClassName"],"sources":["../../../../src/components/PopperArrow/PopperArrow.tsx"],"sourcesContent":["import * as React from \"react\";\nimport \"./PopperArrow.css\";\n\nexport interface PopperArrowProps {\n  style?: React.CSSProperties;\n  attributes?: React.HTMLAttributes<HTMLDivElement> | null;\n  arrowClassName?: string;\n}\n\nexport const PopperArrow = ({\n  style,\n  attributes,\n  arrowClassName,\n}: PopperArrowProps) => {\n  return (\n    <div\n      style={style}\n      {...attributes}\n      vkuiClass=\"PopperArrow\"\n      data-popper-arrow={true}\n    >\n      <svg\n        vkuiClass=\"PopperArrow__in\"\n        className={arrowClassName}\n        width=\"20\"\n        height=\"8\"\n        viewBox=\"0 0 20 8\"\n        fill=\"none\"\n        xmlns=\"http://www.w3.org/2000/svg\"\n      >\n        <path\n          fillRule=\"evenodd\"\n          clipRule=\"evenodd\"\n          d=\"M10 0C13 0 15.9999 8 20 8H0C3.9749 8 7 0 10 0Z\"\n          fill=\"currentColor\"\n        />\n      </svg>\n    </div>\n  );\n};\n"],"mappings":";;AACA;AAQA,OAAO,IAAMA,WAAW,GAAG,SAAdA,WAAc,OAIH;EAAA,IAHtBC,KAGsB,QAHtBA,KAGsB;EAAA,IAFtBC,UAEsB,QAFtBA,UAEsB;EAAA,IADtBC,cACsB,QADtBA,cACsB;EACtB,OACE;IACE,KAAK,EAAEF;EADT,GAEMC,UAFN;IAGE,SAAS,EAAC,aAHZ;IAIE,qBAAmB;EAJrB,IAME;IACE,SAAS,EAAC,iBADZ;IAEE,SAAS,EAAEC,cAFb;IAGE,KAAK,EAAC,IAHR;IAIE,MAAM,EAAC,GAJT;IAKE,OAAO,EAAC,UALV;IAME,IAAI,EAAC,MANP;IAOE,KAAK,EAAC;EAPR,GASE;IACE,QAAQ,EAAC,SADX;IAEE,QAAQ,EAAC,SAFX;IAGE,CAAC,EAAC,gDAHJ;IAIE,IAAI,EAAC;EAJP,EATF,CANF,CADF;AAyBD,CA9BM"}
+{"version":3,"file":"PopperArrow.js","names":["React","classNamesString","PopperArrow","style","attributes","arrowClassName","arrowWrapperClassName","className","restAttributes"],"sources":["../../../../src/components/PopperArrow/PopperArrow.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { classNamesString } from \"../../lib/classNames\";\nimport styles from \"./PopperArrow.module.css\";\n\nexport interface PopperArrowProps {\n  style?: React.CSSProperties;\n  attributes?: React.HTMLAttributes<HTMLDivElement> | null;\n  arrowClassName?: string;\n}\n\nexport const PopperArrow = ({\n  style,\n  attributes,\n  arrowClassName,\n}: PopperArrowProps) => {\n  const { className: arrowWrapperClassName, ...restAttributes } =\n    attributes ?? {};\n  return (\n    <div\n      style={style}\n      {...restAttributes}\n      className={classNamesString(styles[\"PopperArrow\"], arrowWrapperClassName)}\n      data-popper-arrow={true}\n    >\n      <svg\n        className={classNamesString(styles[\"PopperArrow__in\"], arrowClassName)}\n        width=\"20\"\n        height=\"8\"\n        viewBox=\"0 0 20 8\"\n        fill=\"none\"\n        xmlns=\"http://www.w3.org/2000/svg\"\n      >\n        <path\n          fillRule=\"evenodd\"\n          clipRule=\"evenodd\"\n          d=\"M10 0C13 0 15.9999 8 20 8H0C3.9749 8 7 0 10 0Z\"\n          fill=\"currentColor\"\n        />\n      </svg>\n    </div>\n  );\n};\n"],"mappings":";;;AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,SAASC,gBAAgB,QAAQ,sBAAsB;AAAC;AASxD,OAAO,IAAMC,WAAW,GAAG,SAAdA,WAAW,OAIA;EAAA,IAHtBC,KAAK,QAALA,KAAK;IACLC,UAAU,QAAVA,UAAU;IACVC,cAAc,QAAdA,cAAc;EAEd,YACED,UAAU,aAAVA,UAAU,cAAVA,UAAU,GAAI,CAAC,CAAC;IADCE,qBAAqB,SAAhCC,SAAS;IAA4BC,cAAc;EAE3D,oBACE;IACE,KAAK,EAAEL;EAAM,GACTK,cAAc;IAClB,SAAS,EAAEP,gBAAgB,oBAAwBK,qBAAqB,CAAE;IAC1E,qBAAmB;EAAK,iBAExB;IACE,SAAS,EAAEL,gBAAgB,wBAA4BI,cAAc,CAAE;IACvE,KAAK,EAAC,IAAI;IACV,MAAM,EAAC,GAAG;IACV,OAAO,EAAC,UAAU;IAClB,IAAI,EAAC,MAAM;IACX,KAAK,EAAC;EAA4B,gBAElC;IACE,QAAQ,EAAC,SAAS;IAClB,QAAQ,EAAC,SAAS;IAClB,CAAC,EAAC,gDAAgD;IAClD,IAAI,EAAC;EAAc,EACnB,CACE,CACF;AAEV,CAAC"}

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

@@ -1,10 +1,9 @@
 import * as React from "react";
 import { HasRootRef } from "../../types";
-import "./Progress.css";
 export interface ProgressProps extends React.HTMLAttributes<HTMLDivElement>, HasRootRef<HTMLDivElement> {
     value?: number;
 }
 /**
  * @see https://vkcom.github.io/VKUI/#/Progress
  */
-export declare const Progress: ({ value, getRootRef, ...restProps }: ProgressProps) => JSX.Element;
+export declare const Progress: ({ value, getRootRef, className, ...restProps }: ProgressProps) => JSX.Element;

package/dist/cssm/components/Progress/Progress.js

@@ -1,35 +1,36 @@
 import _extends from "@babel/runtime/helpers/extends";
 import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
-var _excluded = ["value", "getRootRef"];
-import { createScopedElement } from "../../lib/jsxRuntime";
-import "./Progress.css";
+var _excluded = ["value", "getRootRef", "className"];
+import * as React from "react";
+import { clamp } from "../../helpers/math";
+import { classNamesString } from "../../lib/classNames";
+import "./Progress.module.css";
 var PROGRESS_MIN_VALUE = 0;
 var PROGRESS_MAX_VALUE = 100;
+
 /**
  * @see https://vkcom.github.io/VKUI/#/Progress
  */
-
 export var Progress = function Progress(_ref) {
   var _ref$value = _ref.value,
-      value = _ref$value === void 0 ? 0 : _ref$value,
-      getRootRef = _ref.getRootRef,
-      restProps = _objectWithoutProperties(_ref, _excluded);
-
-  var progress = Math.max(PROGRESS_MIN_VALUE, Math.min(value, PROGRESS_MAX_VALUE));
-  return createScopedElement("div", _extends({
+    value = _ref$value === void 0 ? 0 : _ref$value,
+    getRootRef = _ref.getRootRef,
+    className = _ref.className,
+    restProps = _objectWithoutProperties(_ref, _excluded);
+  var progress = clamp(value, PROGRESS_MIN_VALUE, PROGRESS_MAX_VALUE);
+  return /*#__PURE__*/React.createElement("div", _extends({
     "aria-valuenow": value
   }, restProps, {
     role: "progressbar",
     "aria-valuemin": PROGRESS_MIN_VALUE,
     "aria-valuemax": PROGRESS_MAX_VALUE,
     ref: getRootRef,
-    vkuiClass: "Progress"
-  }), createScopedElement("div", {
-    vkuiClass: "Progress__in",
+    className: classNamesString("vkuiProgress", className)
+  }), /*#__PURE__*/React.createElement("div", {
+    className: "vkuiProgress__in",
     style: {
       width: "".concat(progress, "%")
-    },
-    "aria-hidden": true
+    }
   }));
 };
 //# sourceMappingURL=Progress.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"Progress.js","names":["PROGRESS_MIN_VALUE","PROGRESS_MAX_VALUE","Progress","value","getRootRef","restProps","progress","Math","max","min","width"],"sources":["../../../../src/components/Progress/Progress.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { HasRootRef } from \"../../types\";\nimport \"./Progress.css\";\n\nexport interface ProgressProps\n  extends React.HTMLAttributes<HTMLDivElement>,\n    HasRootRef<HTMLDivElement> {\n  value?: number;\n}\n\nconst PROGRESS_MIN_VALUE = 0;\nconst PROGRESS_MAX_VALUE = 100;\n\n/**\n * @see https://vkcom.github.io/VKUI/#/Progress\n */\nexport const Progress = ({\n  value = 0,\n  getRootRef,\n  ...restProps\n}: ProgressProps) => {\n  const progress = Math.max(\n    PROGRESS_MIN_VALUE,\n    Math.min(value, PROGRESS_MAX_VALUE)\n  );\n\n  return (\n    <div\n      aria-valuenow={value}\n      {...restProps}\n      role=\"progressbar\"\n      aria-valuemin={PROGRESS_MIN_VALUE}\n      aria-valuemax={PROGRESS_MAX_VALUE}\n      ref={getRootRef}\n      vkuiClass=\"Progress\"\n    >\n      <div\n        vkuiClass=\"Progress__in\"\n        style={{ width: `${progress}%` }}\n        aria-hidden\n      />\n    </div>\n  );\n};\n"],"mappings":";;;;AAEA;AAQA,IAAMA,kBAAkB,GAAG,CAA3B;AACA,IAAMC,kBAAkB,GAAG,GAA3B;AAEA;AACA;AACA;;AACA,OAAO,IAAMC,QAAQ,GAAG,SAAXA,QAAW,OAIH;EAAA,sBAHnBC,KAGmB;EAAA,IAHnBA,KAGmB,2BAHX,CAGW;EAAA,IAFnBC,UAEmB,QAFnBA,UAEmB;EAAA,IADhBC,SACgB;;EACnB,IAAMC,QAAQ,GAAGC,IAAI,CAACC,GAAL,CACfR,kBADe,EAEfO,IAAI,CAACE,GAAL,CAASN,KAAT,EAAgBF,kBAAhB,CAFe,CAAjB;EAKA,OACE;IACE,iBAAeE;EADjB,GAEME,SAFN;IAGE,IAAI,EAAC,aAHP;IAIE,iBAAeL,kBAJjB;IAKE,iBAAeC,kBALjB;IAME,GAAG,EAAEG,UANP;IAOE,SAAS,EAAC;EAPZ,IASE;IACE,SAAS,EAAC,cADZ;IAEE,KAAK,EAAE;MAAEM,KAAK,YAAKJ,QAAL;IAAP,CAFT;IAGE;EAHF,EATF,CADF;AAiBD,CA3BM"}
+{"version":3,"file":"Progress.js","names":["React","clamp","classNamesString","PROGRESS_MIN_VALUE","PROGRESS_MAX_VALUE","Progress","value","getRootRef","className","restProps","progress","width"],"sources":["../../../../src/components/Progress/Progress.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { clamp } from \"../../helpers/math\";\nimport { classNamesString } from \"../../lib/classNames\";\nimport { HasRootRef } from \"../../types\";\nimport styles from \"./Progress.module.css\";\n\nexport interface ProgressProps\n  extends React.HTMLAttributes<HTMLDivElement>,\n    HasRootRef<HTMLDivElement> {\n  value?: number;\n}\n\nconst PROGRESS_MIN_VALUE = 0;\nconst PROGRESS_MAX_VALUE = 100;\n\n/**\n * @see https://vkcom.github.io/VKUI/#/Progress\n */\nexport const Progress = ({\n  value = 0,\n  getRootRef,\n  className,\n  ...restProps\n}: ProgressProps) => {\n  const progress = clamp(value, PROGRESS_MIN_VALUE, PROGRESS_MAX_VALUE);\n\n  return (\n    <div\n      aria-valuenow={value}\n      {...restProps}\n      role=\"progressbar\"\n      aria-valuemin={PROGRESS_MIN_VALUE}\n      aria-valuemax={PROGRESS_MAX_VALUE}\n      ref={getRootRef}\n      className={classNamesString(styles[\"Progress\"], className)}\n    >\n      <div\n        className={styles[\"Progress__in\"]}\n        style={{ width: `${progress}%` }}\n      />\n    </div>\n  );\n};\n"],"mappings":";;;AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,SAASC,KAAK,QAAQ,oBAAoB;AAC1C,SAASC,gBAAgB,QAAQ,sBAAsB;AAAC;AAUxD,IAAMC,kBAAkB,GAAG,CAAC;AAC5B,IAAMC,kBAAkB,GAAG,GAAG;;AAE9B;AACA;AACA;AACA,OAAO,IAAMC,QAAQ,GAAG,SAAXA,QAAQ,OAKA;EAAA,sBAJnBC,KAAK;IAALA,KAAK,2BAAG,CAAC;IACTC,UAAU,QAAVA,UAAU;IACVC,SAAS,QAATA,SAAS;IACNC,SAAS;EAEZ,IAAMC,QAAQ,GAAGT,KAAK,CAACK,KAAK,EAAEH,kBAAkB,EAAEC,kBAAkB,CAAC;EAErE,oBACE;IACE,iBAAeE;EAAM,GACjBG,SAAS;IACb,IAAI,EAAC,aAAa;IAClB,iBAAeN,kBAAmB;IAClC,iBAAeC,kBAAmB;IAClC,GAAG,EAAEG,UAAW;IAChB,SAAS,EAAEL,gBAAgB,iBAAqBM,SAAS;EAAE,iBAE3D;IACE,SAAS,oBAAyB;IAClC,KAAK,EAAE;MAAEG,KAAK,YAAKD,QAAQ;IAAI;EAAE,EACjC,CACE;AAEV,CAAC"}

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

@@ -1,5 +1,4 @@
 import * as React from "react";
-import "./PromoBanner.css";
 declare type StatsType = "playbackStarted" | "click";
 declare type BannerData = {
     title?: string;
@@ -37,5 +36,5 @@ export interface PromoBannerProps extends React.HTMLAttributes<HTMLDivElement> {
 /**
  * @see https://vkcom.github.io/VKUI/#/PromoBanner
  */
-export declare const PromoBanner: ({ bannerData, onClose, isCloseButtonHidden, ...restProps }: PromoBannerProps) => JSX.Element;
+export declare const PromoBanner: ({ bannerData, onClose, isCloseButtonHidden, className, ...restProps }: PromoBannerProps) => JSX.Element;
 export {};

package/dist/cssm/components/PromoBanner/PromoBanner.js

@@ -3,31 +3,29 @@ import _defineProperty from "@babel/runtime/helpers/defineProperty";
 import _objectSpread from "@babel/runtime/helpers/objectSpread2";
 import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
 import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
-var _excluded = ["bannerData", "onClose", "isCloseButtonHidden"];
-import { createScopedElement } from "../../lib/jsxRuntime";
+var _excluded = ["bannerData", "onClose", "isCloseButtonHidden", "className"];
 import * as React from "react";
+import { classNamesString } from "../../lib/classNames";
 import { Icon24Dismiss } from "@vkontakte/icons";
 import { Button } from "../Button/Button";
 import { SimpleCell } from "../SimpleCell/SimpleCell";
 import { Image } from "../Image/Image";
 import { Footnote } from "../Typography/Footnote/Footnote";
-import "./PromoBanner.css";
-
+import "./PromoBanner.module.css";
 /**
  * @see https://vkcom.github.io/VKUI/#/PromoBanner
  */
 export var PromoBanner = function PromoBanner(_ref) {
   var _ref$bannerData = _ref.bannerData,
-      bannerData = _ref$bannerData === void 0 ? {} : _ref$bannerData,
-      onClose = _ref.onClose,
-      isCloseButtonHidden = _ref.isCloseButtonHidden,
-      restProps = _objectWithoutProperties(_ref, _excluded);
-
+    bannerData = _ref$bannerData === void 0 ? {} : _ref$bannerData,
+    onClose = _ref.onClose,
+    isCloseButtonHidden = _ref.isCloseButtonHidden,
+    className = _ref.className,
+    restProps = _objectWithoutProperties(_ref, _excluded);
   var _React$useState = React.useState(""),
-      _React$useState2 = _slicedToArray(_React$useState, 2),
-      currentPixel = _React$useState2[0],
-      setCurrentPixel = _React$useState2[1];
-
+    _React$useState2 = _slicedToArray(_React$useState, 2),
+    currentPixel = _React$useState2[0],
+    setCurrentPixel = _React$useState2[1];
   var statsPixels = React.useMemo(function () {
     return bannerData.statistics ? bannerData.statistics.reduce(function (acc, item) {
       return _objectSpread(_objectSpread({}, acc), {}, _defineProperty({}, item.type, item.url));
@@ -41,34 +39,36 @@ export var PromoBanner = function PromoBanner(_ref) {
       setCurrentPixel(statsPixels.playbackStarted);
     }
   }, [statsPixels.playbackStarted]);
-  return createScopedElement("div", _extends({
-    vkuiClass: "PromoBanner"
-  }, restProps), createScopedElement("div", {
-    vkuiClass: "PromoBanner__head"
-  }, createScopedElement(Footnote, {
-    vkuiClass: "PromoBanner__label"
-  }, bannerData.advertisingLabel || "Advertisement"), bannerData.ageRestrictions && createScopedElement(Footnote, {
-    vkuiClass: "PromoBanner__age"
-  }, bannerData.ageRestrictions), !isCloseButtonHidden && createScopedElement("div", {
-    vkuiClass: "PromoBanner__close",
+  return /*#__PURE__*/React.createElement("div", _extends({
+    className: classNamesString("vkuiPromoBanner", className)
+  }, restProps), /*#__PURE__*/React.createElement("div", {
+    className: "vkuiPromoBanner__head"
+  }, /*#__PURE__*/React.createElement(Footnote, {
+    className: "vkuiPromoBanner__label"
+  }, bannerData.advertisingLabel || "Advertisement"), bannerData.ageRestrictions && /*#__PURE__*/React.createElement(Footnote, {
+    className: "vkuiPromoBanner__age"
+  }, bannerData.ageRestrictions), !isCloseButtonHidden && /*#__PURE__*/React.createElement("div", {
+    className: "vkuiPromoBanner__close",
     onClick: onClose
-  }, createScopedElement(Icon24Dismiss, null))), createScopedElement(SimpleCell, {
+  }, /*#__PURE__*/React.createElement(Icon24Dismiss, null))), /*#__PURE__*/React.createElement(SimpleCell, {
     href: bannerData.trackingLink,
     onClick: onClick,
     rel: "nofollow noopener noreferrer",
     target: "_blank",
-    before: createScopedElement(Image, {
+    before: bannerData.iconLink && /*#__PURE__*/React.createElement(Image, {
       size: 48,
       src: bannerData.iconLink,
-      alt: bannerData.title
+      alt: bannerData.title,
+      "data-testid": process.env.NODE_ENV === "test" ? "avatar" : undefined
     }),
-    after: createScopedElement(Button, {
-      mode: "outline"
+    after: bannerData.ctaText && /*#__PURE__*/React.createElement(Button, {
+      mode: "outline",
+      "data-testid": process.env.NODE_ENV === "test" ? "button-ctaText" : undefined
     }, bannerData.ctaText),
     subtitle: bannerData.domain
-  }, bannerData.title), currentPixel.length > 0 && createScopedElement("div", {
-    vkuiClass: "PromoBanner__pixels"
-  }, createScopedElement("img", {
+  }, bannerData.title), currentPixel.length > 0 && /*#__PURE__*/React.createElement("div", {
+    className: "vkuiPromoBanner__pixels"
+  }, /*#__PURE__*/React.createElement("img", {
     src: currentPixel,
     alt: ""
   })));

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

@@ -1 +1 @@
-{"version":3,"file":"PromoBanner.js","names":["React","Icon24Dismiss","Button","SimpleCell","Image","Footnote","PromoBanner","bannerData","onClose","isCloseButtonHidden","restProps","useState","currentPixel","setCurrentPixel","statsPixels","useMemo","statistics","reduce","acc","item","type","url","onClick","useCallback","click","useEffect","playbackStarted","advertisingLabel","ageRestrictions","trackingLink","iconLink","title","ctaText","domain","length"],"sources":["../../../../src/components/PromoBanner/PromoBanner.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { Icon24Dismiss } from \"@vkontakte/icons\";\nimport { Button } from \"../Button/Button\";\nimport { SimpleCell } from \"../SimpleCell/SimpleCell\";\nimport { Image } from \"../Image/Image\";\nimport { Footnote } from \"../Typography/Footnote/Footnote\";\nimport \"./PromoBanner.css\";\n\ntype StatsType =\n  | \"playbackStarted\" // Начало показа\n  | \"click\"; // Клик по баннеру\n\ntype BannerData = {\n  title?: string;\n  url_types?: string;\n  bannerID?: string;\n  imageWidth?: number;\n  imageHeight?: number;\n  imageLink?: string;\n  trackingLink?: string;\n  type?: string;\n  iconWidth?: number;\n  domain?: string;\n  ctaText?: string;\n  advertisingLabel?: string;\n  iconLink?: string;\n  statistics?: Array<{ type: StatsType; url: string }>;\n  openInBrowser?: boolean;\n  iconHeight?: number;\n  directLink?: boolean;\n  navigationType?: string;\n  description?: string;\n  ageRestrictions?: string;\n};\n\nexport interface PromoBannerProps extends React.HTMLAttributes<HTMLDivElement> {\n  /** Данные рекламного баннера, полученные из VKWebAppGetAds */\n  bannerData: BannerData;\n  /** Флаг скрытия кнопки закрытия рекламы */\n  isCloseButtonHidden?: boolean;\n  /** Хандлер закрытия рекламы */\n  onClose: () => void;\n}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/PromoBanner\n */\nexport const PromoBanner = ({\n  bannerData = {},\n  onClose,\n  isCloseButtonHidden,\n  ...restProps\n}: PromoBannerProps) => {\n  const [currentPixel, setCurrentPixel] = React.useState(\"\");\n\n  const statsPixels = React.useMemo(\n    () =>\n      (bannerData.statistics\n        ? bannerData.statistics.reduce(\n            (acc, item) => ({ ...acc, [item.type]: item.url }),\n            {}\n          )\n        : {}) as Record<StatsType, string | void>,\n    [bannerData.statistics]\n  );\n\n  const onClick = React.useCallback(\n    () => setCurrentPixel(statsPixels.click || \"\"),\n    [statsPixels.click]\n  );\n\n  React.useEffect(() => {\n    if (statsPixels.playbackStarted) {\n      setCurrentPixel(statsPixels.playbackStarted);\n    }\n  }, [statsPixels.playbackStarted]);\n\n  return (\n    <div vkuiClass=\"PromoBanner\" {...restProps}>\n      <div vkuiClass=\"PromoBanner__head\">\n        <Footnote vkuiClass=\"PromoBanner__label\">\n          {bannerData.advertisingLabel || \"Advertisement\"}\n        </Footnote>\n        {bannerData.ageRestrictions && (\n          <Footnote vkuiClass=\"PromoBanner__age\">\n            {bannerData.ageRestrictions}\n          </Footnote>\n        )}\n\n        {!isCloseButtonHidden && (\n          <div vkuiClass=\"PromoBanner__close\" onClick={onClose}>\n            <Icon24Dismiss />\n          </div>\n        )}\n      </div>\n      <SimpleCell\n        href={bannerData.trackingLink}\n        onClick={onClick}\n        rel=\"nofollow noopener noreferrer\"\n        target=\"_blank\"\n        before={\n          <Image size={48} src={bannerData.iconLink} alt={bannerData.title} />\n        }\n        after={<Button mode=\"outline\">{bannerData.ctaText}</Button>}\n        subtitle={bannerData.domain}\n      >\n        {bannerData.title}\n      </SimpleCell>\n\n      {currentPixel.length > 0 && (\n        <div vkuiClass=\"PromoBanner__pixels\">\n          <img src={currentPixel} alt=\"\" />\n        </div>\n      )}\n    </div>\n  );\n};\n"],"mappings":";;;;;;;AAAA,OAAO,KAAKA,KAAZ,MAAuB,OAAvB;AACA,SAASC,aAAT,QAA8B,kBAA9B;AACA,SAASC,MAAT;AACA,SAASC,UAAT;AACA,SAASC,KAAT;AACA,SAASC,QAAT;AACA;;AAsCA;AACA;AACA;AACA,OAAO,IAAMC,WAAW,GAAG,SAAdA,WAAc,OAKH;EAAA,2BAJtBC,UAIsB;EAAA,IAJtBA,UAIsB,gCAJT,EAIS;EAAA,IAHtBC,OAGsB,QAHtBA,OAGsB;EAAA,IAFtBC,mBAEsB,QAFtBA,mBAEsB;EAAA,IADnBC,SACmB;;EACtB,sBAAwCV,KAAK,CAACW,QAAN,CAAe,EAAf,CAAxC;EAAA;EAAA,IAAOC,YAAP;EAAA,IAAqBC,eAArB;;EAEA,IAAMC,WAAW,GAAGd,KAAK,CAACe,OAAN,CAClB;IAAA,OACGR,UAAU,CAACS,UAAX,GACGT,UAAU,CAACS,UAAX,CAAsBC,MAAtB,CACE,UAACC,GAAD,EAAMC,IAAN;MAAA,uCAAqBD,GAArB,2BAA2BC,IAAI,CAACC,IAAhC,EAAuCD,IAAI,CAACE,GAA5C;IAAA,CADF,EAEE,EAFF,CADH,GAKG,EANN;EAAA,CADkB,EAQlB,CAACd,UAAU,CAACS,UAAZ,CARkB,CAApB;EAWA,IAAMM,OAAO,GAAGtB,KAAK,CAACuB,WAAN,CACd;IAAA,OAAMV,eAAe,CAACC,WAAW,CAACU,KAAZ,IAAqB,EAAtB,CAArB;EAAA,CADc,EAEd,CAACV,WAAW,CAACU,KAAb,CAFc,CAAhB;EAKAxB,KAAK,CAACyB,SAAN,CAAgB,YAAM;IACpB,IAAIX,WAAW,CAACY,eAAhB,EAAiC;MAC/Bb,eAAe,CAACC,WAAW,CAACY,eAAb,CAAf;IACD;EACF,CAJD,EAIG,CAACZ,WAAW,CAACY,eAAb,CAJH;EAMA,OACE;IAAK,SAAS,EAAC;EAAf,GAAiChB,SAAjC,GACE;IAAK,SAAS,EAAC;EAAf,GACE,oBAAC,QAAD;IAAU,SAAS,EAAC;EAApB,GACGH,UAAU,CAACoB,gBAAX,IAA+B,eADlC,CADF,EAIGpB,UAAU,CAACqB,eAAX,IACC,oBAAC,QAAD;IAAU,SAAS,EAAC;EAApB,GACGrB,UAAU,CAACqB,eADd,CALJ,EAUG,CAACnB,mBAAD,IACC;IAAK,SAAS,EAAC,oBAAf;IAAoC,OAAO,EAAED;EAA7C,GACE,oBAAC,aAAD,OADF,CAXJ,CADF,EAiBE,oBAAC,UAAD;IACE,IAAI,EAAED,UAAU,CAACsB,YADnB;IAEE,OAAO,EAAEP,OAFX;IAGE,GAAG,EAAC,8BAHN;IAIE,MAAM,EAAC,QAJT;IAKE,MAAM,EACJ,oBAAC,KAAD;MAAO,IAAI,EAAE,EAAb;MAAiB,GAAG,EAAEf,UAAU,CAACuB,QAAjC;MAA2C,GAAG,EAAEvB,UAAU,CAACwB;IAA3D,EANJ;IAQE,KAAK,EAAE,oBAAC,MAAD;MAAQ,IAAI,EAAC;IAAb,GAAwBxB,UAAU,CAACyB,OAAnC,CART;IASE,QAAQ,EAAEzB,UAAU,CAAC0B;EATvB,GAWG1B,UAAU,CAACwB,KAXd,CAjBF,EA+BGnB,YAAY,CAACsB,MAAb,GAAsB,CAAtB,IACC;IAAK,SAAS,EAAC;EAAf,GACE;IAAK,GAAG,EAAEtB,YAAV;IAAwB,GAAG,EAAC;EAA5B,EADF,CAhCJ,CADF;AAuCD,CArEM"}
+{"version":3,"file":"PromoBanner.js","names":["React","classNamesString","Icon24Dismiss","Button","SimpleCell","Image","Footnote","PromoBanner","bannerData","onClose","isCloseButtonHidden","className","restProps","useState","currentPixel","setCurrentPixel","statsPixels","useMemo","statistics","reduce","acc","item","type","url","onClick","useCallback","click","useEffect","playbackStarted","advertisingLabel","ageRestrictions","trackingLink","iconLink","title","process","env","NODE_ENV","undefined","ctaText","domain","length"],"sources":["../../../../src/components/PromoBanner/PromoBanner.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { classNamesString } from \"../../lib/classNames\";\nimport { Icon24Dismiss } from \"@vkontakte/icons\";\nimport { Button } from \"../Button/Button\";\nimport { SimpleCell } from \"../SimpleCell/SimpleCell\";\nimport { Image } from \"../Image/Image\";\nimport { Footnote } from \"../Typography/Footnote/Footnote\";\nimport styles from \"./PromoBanner.module.css\";\n\ntype StatsType =\n  | \"playbackStarted\" // Начало показа\n  | \"click\"; // Клик по баннеру\n\ntype BannerData = {\n  title?: string;\n  url_types?: string;\n  bannerID?: string;\n  imageWidth?: number;\n  imageHeight?: number;\n  imageLink?: string;\n  trackingLink?: string;\n  type?: string;\n  iconWidth?: number;\n  domain?: string;\n  ctaText?: string;\n  advertisingLabel?: string;\n  iconLink?: string;\n  statistics?: Array<{ type: StatsType; url: string }>;\n  openInBrowser?: boolean;\n  iconHeight?: number;\n  directLink?: boolean;\n  navigationType?: string;\n  description?: string;\n  ageRestrictions?: string;\n};\n\nexport interface PromoBannerProps extends React.HTMLAttributes<HTMLDivElement> {\n  /** Данные рекламного баннера, полученные из VKWebAppGetAds */\n  bannerData: BannerData;\n  /** Флаг скрытия кнопки закрытия рекламы */\n  isCloseButtonHidden?: boolean;\n  /** Хандлер закрытия рекламы */\n  onClose: () => void;\n}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/PromoBanner\n */\nexport const PromoBanner = ({\n  bannerData = {},\n  onClose,\n  isCloseButtonHidden,\n  className,\n  ...restProps\n}: PromoBannerProps) => {\n  const [currentPixel, setCurrentPixel] = React.useState(\"\");\n\n  const statsPixels = React.useMemo(\n    () =>\n      (bannerData.statistics\n        ? bannerData.statistics.reduce(\n            (acc, item) => ({ ...acc, [item.type]: item.url }),\n            {}\n          )\n        : {}) as Record<StatsType, string | void>,\n    [bannerData.statistics]\n  );\n\n  const onClick = React.useCallback(\n    () => setCurrentPixel(statsPixels.click || \"\"),\n    [statsPixels.click]\n  );\n\n  React.useEffect(() => {\n    if (statsPixels.playbackStarted) {\n      setCurrentPixel(statsPixels.playbackStarted);\n    }\n  }, [statsPixels.playbackStarted]);\n\n  return (\n    <div\n      className={classNamesString(styles[\"PromoBanner\"], className)}\n      {...restProps}\n    >\n      <div className={styles[\"PromoBanner__head\"]}>\n        <Footnote className={styles[\"PromoBanner__label\"]}>\n          {bannerData.advertisingLabel || \"Advertisement\"}\n        </Footnote>\n        {bannerData.ageRestrictions && (\n          <Footnote className={styles[\"PromoBanner__age\"]}>\n            {bannerData.ageRestrictions}\n          </Footnote>\n        )}\n\n        {!isCloseButtonHidden && (\n          <div className={styles[\"PromoBanner__close\"]} onClick={onClose}>\n            <Icon24Dismiss />\n          </div>\n        )}\n      </div>\n      <SimpleCell\n        href={bannerData.trackingLink}\n        onClick={onClick}\n        rel=\"nofollow noopener noreferrer\"\n        target=\"_blank\"\n        before={\n          bannerData.iconLink && (\n            <Image\n              size={48}\n              src={bannerData.iconLink}\n              alt={bannerData.title}\n              data-testid={\n                process.env.NODE_ENV === \"test\" ? \"avatar\" : undefined\n              }\n            />\n          )\n        }\n        after={\n          bannerData.ctaText && (\n            <Button\n              mode=\"outline\"\n              data-testid={\n                process.env.NODE_ENV === \"test\" ? \"button-ctaText\" : undefined\n              }\n            >\n              {bannerData.ctaText}\n            </Button>\n          )\n        }\n        subtitle={bannerData.domain}\n      >\n        {bannerData.title}\n      </SimpleCell>\n\n      {currentPixel.length > 0 && (\n        <div className={styles[\"PromoBanner__pixels\"]}>\n          <img src={currentPixel} alt=\"\" />\n        </div>\n      )}\n    </div>\n  );\n};\n"],"mappings":"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"}

package/dist/cssm/components/PromoBanner/PromoBanner.module.css

@@ -0,0 +1 @@
+.vkuiPromoBanner{background:var(--vkui--color_background_content);box-sizing:border-box;color:var(--vkui--color_text_primary);outline:1px solid var(--vkui--color_separator_primary_alpha);outline:var(--vkui_internal--thin_border) solid var(--vkui--color_separator_primary_alpha);padding-bottom:10px;position:relative;width:100%}.vkuiPromoBanner__head{color:var(--vkui--color_text_secondary);display:flex;padding:14px var(--vkui--size_base_padding_horizontal--regular) 10px}.vkuiPromoBanner__age{margin-left:6px}.vkuiPromoBanner__close{align-items:center;color:var(--vkui--color_icon_secondary);display:flex;height:48px;justify-content:center;position:absolute;right:0;top:0;width:48px}.vkuiPromoBanner__close:active{opacity:.7}.vkuiPromoBanner__pixels{display:none}

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

@@ -1,9 +1,9 @@
 import * as React from "react";
-import { AnyFunction, HasPlatform } from "../../types";
+import { AnyFunction } from "../../types";
 import { DOMProps } from "../../lib/dom";
 import { ScrollContextInterface } from "../AppRoot/ScrollContext";
 import { TouchProps } from "../Touch/Touch";
-export interface PullToRefreshProps extends DOMProps, TouchProps, HasPlatform {
+export interface PullToRefreshProps extends DOMProps, TouchProps {
     /**
      * Будет вызвана для обновления контента (прим.: функция должна быть мемоизированным коллбэком)
      */
@@ -19,4 +19,4 @@ export interface PullToRefreshProps extends DOMProps, TouchProps, HasPlatform {
 /**
  * @see https://vkcom.github.io/VKUI/#/PullToRefresh
  */
-export declare const PullToRefresh: ({ children, isFetching, onRefresh, ...restProps }: PullToRefreshProps) => JSX.Element;
+export declare const PullToRefresh: ({ children, isFetching, onRefresh, className, ...restProps }: PullToRefreshProps) => JSX.Element;