@vkontakte/vkui 4.24.0 → 4.26.0

package/dist/components/RangeSlider/UniversalSlider.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/RangeSlider/UniversalSlider.tsx"],"names":["React","Touch","getClassName","classNames","rescale","withAdaptivity","useExternRef","usePlatform","UniversalSliderDumb","min","max","step","value","defaultValue","onChange","getRootRef","sizeY","disabled","restProps","platform","start","end","isRange","gesture","useRef","dragging","startX","containerWidth","current","container","thumbStart","thumbEnd","offsetToValue","absolute","updateRange","nextValue","snapDirection","pos","target","Math","abs","onStart","e","boundingRect","getBoundingClientRect","width","absolutePosition","left","originalEvent","stopPropagation","onMove","shiftX","preventDefault","onEnd","toPercent","v","draggerStyle","join","UniversalSlider"],"mappings":"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","sourcesContent":["import * as React from \"react\";\nimport { Touch, TouchEvent, TouchEventHandler } from \"../Touch/Touch\";\nimport { getClassName } from \"../../helpers/getClassName\";\nimport { classNames } from \"../../lib/classNames\";\nimport { HasRootRef } from \"../../types\";\nimport { rescale } from \"../../helpers/math\";\nimport { withAdaptivity, AdaptivityProps } from \"../../hoc/withAdaptivity\";\nimport { useExternRef } from \"../../hooks/useExternRef\";\nimport { usePlatform } from \"../../hooks/usePlatform\";\nimport \"../Slider/Slider.css\";\n\nexport type UniversalValue = [number | null, number];\n\nexport interface UniversalSliderProps<Value>\n  extends HasRootRef<HTMLDivElement>,\n    Omit<\n      React.HTMLAttributes<HTMLDivElement>,\n      \"value\" | \"defaultValue\" | \"onChange\"\n    >,\n    AdaptivityProps {\n  min?: number;\n  max?: number;\n  step?: number;\n  value?: Value;\n  defaultValue?: Value;\n  disabled?: boolean;\n  onChange?(value: Value, e: TouchEvent): void;\n}\n\nconst UniversalSliderDumb: React.FC<UniversalSliderProps<UniversalValue>> = ({\n  min,\n  max,\n  step,\n  value,\n  defaultValue,\n  onChange,\n  getRootRef,\n  sizeY,\n  disabled,\n  ...restProps\n}) => {\n  const platform = usePlatform();\n  const [start, end] = value;\n  const isRange = start != null;\n  const gesture = React.useRef({\n    dragging: false as false | \"start\" | \"end\",\n    startX: 0,\n    containerWidth: 0,\n  }).current;\n  const container = useExternRef(getRootRef);\n  const thumbStart = React.useRef<HTMLDivElement>();\n  const thumbEnd = React.useRef<HTMLDivElement>();\n\n  const offsetToValue = (absolute: number) => {\n    return rescale(absolute, [0, gesture.containerWidth], [min, max], { step });\n  };\n\n  const updateRange = (nextValue: number): UniversalValue => {\n    if (start == null) {\n      return [null, nextValue];\n    }\n\n    const { dragging } = gesture;\n    if (dragging === \"start\") {\n      if (nextValue > end) {\n        // \"перехватиться\", если перетянули за конец\n        gesture.dragging = \"end\";\n        return [end, nextValue];\n      }\n      return [nextValue, end];\n    }\n    if (dragging === \"end\") {\n      if (nextValue < start) {\n        // \"перехватиться\", если перетянули за начало\n        gesture.dragging = \"start\";\n        return [nextValue, start];\n      }\n      return [start, nextValue];\n    }\n\n    return value;\n  };\n\n  const snapDirection = (pos: number, target: EventTarget) => {\n    if (target === thumbStart.current) {\n      return \"start\";\n    }\n    if (target === thumbEnd.current) {\n      return \"end\";\n    }\n    return Math.abs(start - pos) <= Math.abs(end - pos) ? \"start\" : \"end\";\n  };\n\n  const onStart: TouchEventHandler = (e: TouchEvent) => {\n    const boundingRect = container.current.getBoundingClientRect();\n    gesture.containerWidth = boundingRect.width;\n\n    const absolutePosition = e.startX - boundingRect.left;\n    const pos = offsetToValue(absolutePosition);\n    gesture.dragging = snapDirection(pos, e.originalEvent.target);\n    gesture.startX = absolutePosition;\n\n    onChange(updateRange(pos), e);\n    e.originalEvent.stopPropagation();\n  };\n\n  const onMove: TouchEventHandler = (e: TouchEvent) => {\n    onChange(updateRange(offsetToValue(gesture.startX + (e.shiftX || 0))), e);\n\n    e.originalEvent.stopPropagation();\n    e.originalEvent.preventDefault();\n  };\n\n  const onEnd: TouchEventHandler = (e) => {\n    gesture.dragging = false;\n    e.originalEvent.stopPropagation();\n  };\n\n  const toPercent = (v: number) => ((v - min) / (max - min)) * 100;\n  const draggerStyle = isRange\n    ? {\n        width: `${toPercent(end) - toPercent(start)}%`,\n        left: `${toPercent(start)}%`,\n      }\n    : {\n        width: `${toPercent(end)}%`,\n      };\n\n  return (\n    <Touch\n      data-value={isRange ? value.join(\",\") : value}\n      {...restProps}\n      {...(disabled ? {} : { onStart, onMove, onEnd })}\n      vkuiClass={classNames(\n        getClassName(\"Slider\", platform),\n        `Slider--sizeY-${sizeY}`,\n        disabled && \"Slider--disabled\"\n      )}\n    >\n      <div ref={container} vkuiClass=\"Slider__in\">\n        <div vkuiClass=\"Slider__dragger\" style={draggerStyle}>\n          {isRange && (\n            <span\n              vkuiClass={classNames(\"Slider__thumb\", \"Slider__thumb--start\")}\n              ref={thumbStart}\n            />\n          )}\n          <span\n            vkuiClass={classNames(\"Slider__thumb\", \"Slider__thumb--end\")}\n            ref={thumbEnd}\n          />\n        </div>\n      </div>\n    </Touch>\n  );\n};\n\nexport const UniversalSlider = withAdaptivity(UniversalSliderDumb, {\n  sizeY: true,\n});\n"],"file":"UniversalSlider.js"}
+{"version":3,"sources":["../../../src/components/RangeSlider/UniversalSlider.tsx"],"names":["React","Touch","getClassName","classNames","rescale","withAdaptivity","useExternRef","usePlatform","UniversalSliderDumb","min","max","step","value","defaultValue","onChange","getRootRef","sizeY","disabled","restProps","platform","start","end","isRange","gesture","useRef","dragging","startX","containerWidth","current","container","thumbStart","thumbEnd","offsetToValue","absolute","updateRange","nextValue","snapDirection","pos","target","Math","abs","onStart","e","boundingRect","getBoundingClientRect","width","absolutePosition","left","originalEvent","stopPropagation","onMove","shiftX","preventDefault","onEnd","toPercent","v","draggerStyle","join","UniversalSlider"],"mappings":"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","sourcesContent":["import * as React from \"react\";\nimport { Touch, TouchEvent, TouchEventHandler } from \"../Touch/Touch\";\nimport { getClassName } from \"../../helpers/getClassName\";\nimport { classNames } from \"../../lib/classNames\";\nimport { HasRootRef } from \"../../types\";\nimport { rescale } from \"../../helpers/math\";\nimport { withAdaptivity, AdaptivityProps } from \"../../hoc/withAdaptivity\";\nimport { useExternRef } from \"../../hooks/useExternRef\";\nimport { usePlatform } from \"../../hooks/usePlatform\";\nimport \"../Slider/Slider.css\";\n\nexport type UniversalValue = [number | null, number];\n\nexport interface UniversalSliderProps<Value>\n  extends HasRootRef<HTMLDivElement>,\n    Omit<\n      React.HTMLAttributes<HTMLDivElement>,\n      \"value\" | \"defaultValue\" | \"onChange\"\n    >,\n    AdaptivityProps {\n  min?: number;\n  max?: number;\n  step?: number;\n  value?: Value;\n  defaultValue?: Value;\n  disabled?: boolean;\n  onChange?(value: Value, e: TouchEvent): void;\n}\n\nconst UniversalSliderDumb: React.FC<UniversalSliderProps<UniversalValue>> = ({\n  min = 0,\n  max = 100,\n  step,\n  value = [0, 0],\n  defaultValue,\n  onChange,\n  getRootRef,\n  sizeY,\n  disabled,\n  ...restProps\n}) => {\n  const platform = usePlatform();\n  const [start, end] = value;\n  const isRange = start != null;\n  const gesture = React.useRef({\n    dragging: false as false | \"start\" | \"end\",\n    startX: 0,\n    containerWidth: 0,\n  }).current;\n  const container = useExternRef(getRootRef);\n  const thumbStart = React.useRef<HTMLDivElement>(null);\n  const thumbEnd = React.useRef<HTMLDivElement>(null);\n\n  const offsetToValue = (absolute: number) => {\n    return rescale(absolute, [0, gesture.containerWidth], [min, max], { step });\n  };\n\n  const updateRange = (nextValue: number): UniversalValue => {\n    if (start == null) {\n      return [null, nextValue];\n    }\n\n    const { dragging } = gesture;\n    if (dragging === \"start\") {\n      if (nextValue > end) {\n        // \"перехватиться\", если перетянули за конец\n        gesture.dragging = \"end\";\n        return [end, nextValue];\n      }\n      return [nextValue, end];\n    }\n    if (dragging === \"end\") {\n      if (nextValue < start) {\n        // \"перехватиться\", если перетянули за начало\n        gesture.dragging = \"start\";\n        return [nextValue, start];\n      }\n      return [start, nextValue];\n    }\n\n    return value;\n  };\n\n  const snapDirection = (pos: number, target: EventTarget | null) => {\n    if (target === thumbStart.current) {\n      return \"start\";\n    }\n    if (target === thumbEnd.current) {\n      return \"end\";\n    }\n    return Math.abs((start ?? 0) - pos) <= Math.abs(end - pos)\n      ? \"start\"\n      : \"end\";\n  };\n\n  const onStart: TouchEventHandler = (e: TouchEvent) => {\n    const boundingRect = container.current?.getBoundingClientRect();\n    gesture.containerWidth = boundingRect?.width ?? 0;\n\n    const absolutePosition = e.startX - (boundingRect?.left ?? 0);\n    const pos = offsetToValue(absolutePosition);\n    gesture.dragging = snapDirection(pos, e.originalEvent.target);\n    gesture.startX = absolutePosition;\n\n    onChange?.(updateRange(pos), e);\n    e.originalEvent.stopPropagation();\n  };\n\n  const onMove: TouchEventHandler = (e: TouchEvent) => {\n    onChange?.(updateRange(offsetToValue(gesture.startX + (e.shiftX || 0))), e);\n\n    e.originalEvent.stopPropagation();\n    e.originalEvent.preventDefault();\n  };\n\n  const onEnd: TouchEventHandler = (e) => {\n    gesture.dragging = false;\n    e.originalEvent.stopPropagation();\n  };\n\n  const toPercent = (v: number) => ((v - min) / (max - min)) * 100;\n  const draggerStyle = isRange\n    ? {\n        width: `${toPercent(end) - toPercent(start ?? 0)}%`,\n        left: `${toPercent(start ?? 0)}%`,\n      }\n    : {\n        width: `${toPercent(end)}%`,\n      };\n\n  return (\n    <Touch\n      data-value={isRange ? value.join(\",\") : value}\n      {...restProps}\n      {...(disabled ? {} : { onStart, onMove, onEnd })}\n      vkuiClass={classNames(\n        getClassName(\"Slider\", platform),\n        `Slider--sizeY-${sizeY}`,\n        disabled && \"Slider--disabled\"\n      )}\n    >\n      <div ref={container} vkuiClass=\"Slider__in\">\n        <div vkuiClass=\"Slider__dragger\" style={draggerStyle}>\n          {isRange && (\n            <span\n              vkuiClass={classNames(\"Slider__thumb\", \"Slider__thumb--start\")}\n              ref={thumbStart}\n            />\n          )}\n          <span\n            vkuiClass={classNames(\"Slider__thumb\", \"Slider__thumb--end\")}\n            ref={thumbEnd}\n          />\n        </div>\n      </div>\n    </Touch>\n  );\n};\n\nexport const UniversalSlider = withAdaptivity(UniversalSliderDumb, {\n  sizeY: true,\n});\n"],"file":"UniversalSlider.js"}

package/dist/components/Removable/Removable.js

@@ -37,6 +37,8 @@ var RemovableIos = function RemovableIos(_ref) {
     if (removeOffset > 0) {
       updateRemoveOffset(0);
     }
+  }, {
+    capture: true
   });
 
   var onRemoveTransitionEnd = function onRemoveTransitionEnd() {
@@ -50,10 +52,11 @@ var RemovableIos = function RemovableIos(_ref) {
   var onRemoveActivateClick = function onRemoveActivateClick(e) {
     e.stopPropagation();
 
-    var _removeButtonRef$curr2 = removeButtonRef === null || removeButtonRef === void 0 ? void 0 : removeButtonRef.current,
-        _removeButtonRef$curr3 = _removeButtonRef$curr2.offsetWidth,
-        offsetWidth = _removeButtonRef$curr3 === void 0 ? 0 : _removeButtonRef$curr3;
+    if (!removeButtonRef.current) {
+      return;
+    }
 
+    var offsetWidth = removeButtonRef.current.offsetWidth;
     updateRemoveOffset(offsetWidth);
   };
 

package/dist/components/Removable/Removable.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/Removable/Removable.tsx"],"names":["React","classNames","getTitleFromChildren","noop","useExternRef","usePlatform","getClassName","useAdaptivity","useDOM","ANDROID","IOS","VKCOM","Icon24Cancel","IconButton","useGlobalEventListener","Tappable","RemovableIos","onRemoveClick","removePlaceholder","removePlaceholderString","children","window","removeButtonRef","useRef","useState","removeOffset","updateRemoveOffset","onRemoveTransitionEnd","current","focus","onRemoveActivateClick","e","stopPropagation","offsetWidth","transform","Removable","getRootRef","onRemove","align","restProps","platform","sizeY","ref","preventDefault"],"mappings":"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","sourcesContent":["import * as React from \"react\";\nimport { HasRootRef } from \"../../types\";\nimport { classNames } from \"../../lib/classNames\";\nimport { getTitleFromChildren, noop } from \"../../lib/utils\";\nimport { useExternRef } from \"../../hooks/useExternRef\";\nimport { usePlatform } from \"../../hooks/usePlatform\";\nimport { getClassName } from \"../../helpers/getClassName\";\nimport { useAdaptivity } from \"../../hooks/useAdaptivity\";\nimport { useDOM } from \"../../lib/dom\";\nimport { ANDROID, IOS, VKCOM } from \"../../lib/platform\";\nimport { Icon24Cancel } from \"@vkontakte/icons\";\nimport IconButton from \"../IconButton/IconButton\";\nimport { useGlobalEventListener } from \"../../hooks/useGlobalEventListener\";\nimport Tappable from \"../Tappable/Tappable\";\nimport \"./Removable.css\";\n\nexport interface RemovableProps {\n  /**\n   * iOS only. Текст в выезжающей кнопке для удаления ячейки.\n   */\n  removePlaceholder?: React.ReactNode;\n  /**\n   * Коллбэк срабатывает при клике на контрол удаления.\n   */\n  onRemove?: (e: React.MouseEvent, rootEl?: HTMLElement) => void;\n}\n\ninterface RemovableIosOwnProps\n  extends Pick<RemovableProps, \"removePlaceholder\"> {\n  onRemoveClick?: (e: React.MouseEvent, rootEl?: HTMLElement) => void;\n  removePlaceholderString?: string;\n}\n\nconst RemovableIos: React.FC<RemovableIosOwnProps> = ({\n  onRemoveClick,\n  removePlaceholder,\n  removePlaceholderString,\n  children,\n}) => {\n  const { window } = useDOM();\n\n  const removeButtonRef = React.useRef(null);\n  const [removeOffset, updateRemoveOffset] = React.useState(0);\n\n  useGlobalEventListener(window, \"click\", () => {\n    if (removeOffset > 0) {\n      updateRemoveOffset(0);\n    }\n  });\n\n  const onRemoveTransitionEnd = () => {\n    if (removeOffset > 0) {\n      removeButtonRef?.current?.focus();\n    }\n  };\n\n  const onRemoveActivateClick = (e: React.MouseEvent) => {\n    e.stopPropagation();\n\n    const { offsetWidth = 0 } = removeButtonRef?.current;\n    updateRemoveOffset(offsetWidth);\n  };\n\n  return (\n    <div\n      vkuiClass=\"Removable__content\"\n      style={{ transform: `translateX(-${removeOffset ?? 0}px)` }}\n      onTransitionEnd={onRemoveTransitionEnd}\n    >\n      <IconButton\n        hasActive={false}\n        hasHover={false}\n        aria-label={removePlaceholderString}\n        vkuiClass=\"Removable__action Removable__toggle\"\n        onClick={onRemoveActivateClick}\n        disabled={removeOffset > 0}\n      >\n        <i vkuiClass=\"Removable__toggle-in\" role=\"presentation\" />\n      </IconButton>\n      {children}\n\n      <span vkuiClass=\"Removable__offset\" aria-hidden=\"true\"></span>\n\n      <Tappable\n        Component=\"button\"\n        hasActive={false}\n        hasHover={false}\n        disabled={removeOffset === 0}\n        getRootRef={removeButtonRef}\n        vkuiClass=\"Removable__remove\"\n        onClick={onRemoveClick}\n      >\n        <span vkuiClass=\"Removable__remove-in\">{removePlaceholder}</span>\n      </Tappable>\n    </div>\n  );\n};\n\ninterface RemovableOwnProps\n  extends React.AllHTMLAttributes<HTMLElement>,\n    RemovableProps,\n    HasRootRef<HTMLDivElement> {\n  /**\n   * Расположение кнопки удаления.\n   */\n  align?: \"start\" | \"center\";\n}\n\nexport const Removable: React.FC<RemovableOwnProps> = ({\n  getRootRef,\n  children,\n  onRemove = noop,\n  removePlaceholder = \"Удалить\",\n  align = \"center\",\n  ...restProps\n}: RemovableOwnProps) => {\n  const platform = usePlatform();\n  const { sizeY } = useAdaptivity();\n\n  const ref = useExternRef(getRootRef);\n\n  const onRemoveClick = (e: React.MouseEvent) => {\n    e.preventDefault();\n    onRemove(e);\n  };\n\n  const removePlaceholderString: string =\n    getTitleFromChildren(removePlaceholder);\n\n  return (\n    <div\n      {...restProps}\n      ref={ref}\n      vkuiClass={classNames(\n        getClassName(\"Removable\", platform),\n        `Removable--${align}`,\n        `Removable--sizeY-${sizeY}`\n      )}\n    >\n      {(platform === ANDROID || platform === VKCOM) && (\n        <div vkuiClass=\"Removable__content\">\n          {children}\n\n          <IconButton\n            activeMode=\"opacity\"\n            hoverMode=\"opacity\"\n            vkuiClass=\"Removable__action\"\n            onClick={onRemoveClick}\n            aria-label={removePlaceholderString}\n          >\n            <Icon24Cancel role=\"presentation\" />\n          </IconButton>\n        </div>\n      )}\n\n      {platform === IOS && (\n        <RemovableIos\n          onRemoveClick={onRemoveClick}\n          removePlaceholder={removePlaceholder}\n          removePlaceholderString={removePlaceholderString}\n        >\n          {children}\n        </RemovableIos>\n      )}\n    </div>\n  );\n};\n"],"file":"Removable.js"}
+{"version":3,"sources":["../../../src/components/Removable/Removable.tsx"],"names":["React","classNames","getTitleFromChildren","noop","useExternRef","usePlatform","getClassName","useAdaptivity","useDOM","ANDROID","IOS","VKCOM","Icon24Cancel","IconButton","useGlobalEventListener","Tappable","RemovableIos","onRemoveClick","removePlaceholder","removePlaceholderString","children","window","removeButtonRef","useRef","useState","removeOffset","updateRemoveOffset","capture","onRemoveTransitionEnd","current","focus","onRemoveActivateClick","e","stopPropagation","offsetWidth","transform","Removable","getRootRef","onRemove","align","restProps","platform","sizeY","ref","preventDefault"],"mappings":"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","sourcesContent":["import * as React from \"react\";\nimport { HasRootRef } from \"../../types\";\nimport { classNames } from \"../../lib/classNames\";\nimport { getTitleFromChildren, noop } from \"../../lib/utils\";\nimport { useExternRef } from \"../../hooks/useExternRef\";\nimport { usePlatform } from \"../../hooks/usePlatform\";\nimport { getClassName } from \"../../helpers/getClassName\";\nimport { useAdaptivity } from \"../../hooks/useAdaptivity\";\nimport { useDOM } from \"../../lib/dom\";\nimport { ANDROID, IOS, VKCOM } from \"../../lib/platform\";\nimport { Icon24Cancel } from \"@vkontakte/icons\";\nimport IconButton from \"../IconButton/IconButton\";\nimport { useGlobalEventListener } from \"../../hooks/useGlobalEventListener\";\nimport Tappable from \"../Tappable/Tappable\";\nimport \"./Removable.css\";\n\nexport interface RemovableProps {\n  /**\n   * iOS only. Текст в выезжающей кнопке для удаления ячейки.\n   */\n  removePlaceholder?: React.ReactNode;\n  /**\n   * Коллбэк срабатывает при клике на контрол удаления.\n   */\n  onRemove?: (e: React.MouseEvent, rootEl?: HTMLElement) => void;\n}\n\ninterface RemovableIosOwnProps\n  extends Pick<RemovableProps, \"removePlaceholder\"> {\n  onRemoveClick?: (e: React.MouseEvent, rootEl?: HTMLElement) => void;\n  removePlaceholderString?: string;\n}\n\nconst RemovableIos: React.FC<RemovableIosOwnProps> = ({\n  onRemoveClick,\n  removePlaceholder,\n  removePlaceholderString,\n  children,\n}) => {\n  const { window } = useDOM();\n\n  const removeButtonRef = React.useRef<HTMLElement>(null);\n  const [removeOffset, updateRemoveOffset] = React.useState(0);\n\n  useGlobalEventListener(\n    window,\n    \"click\",\n    () => {\n      if (removeOffset > 0) {\n        updateRemoveOffset(0);\n      }\n    },\n    { capture: true }\n  );\n\n  const onRemoveTransitionEnd = () => {\n    if (removeOffset > 0) {\n      removeButtonRef?.current?.focus();\n    }\n  };\n\n  const onRemoveActivateClick = (e: React.MouseEvent) => {\n    e.stopPropagation();\n    if (!removeButtonRef.current) {\n      return;\n    }\n    const { offsetWidth } = removeButtonRef.current;\n    updateRemoveOffset(offsetWidth);\n  };\n\n  return (\n    <div\n      vkuiClass=\"Removable__content\"\n      style={{ transform: `translateX(-${removeOffset ?? 0}px)` }}\n      onTransitionEnd={onRemoveTransitionEnd}\n    >\n      <IconButton\n        hasActive={false}\n        hasHover={false}\n        aria-label={removePlaceholderString}\n        vkuiClass=\"Removable__action Removable__toggle\"\n        onClick={onRemoveActivateClick}\n        disabled={removeOffset > 0}\n      >\n        <i vkuiClass=\"Removable__toggle-in\" role=\"presentation\" />\n      </IconButton>\n      {children}\n\n      <span vkuiClass=\"Removable__offset\" aria-hidden=\"true\"></span>\n\n      <Tappable\n        Component=\"button\"\n        hasActive={false}\n        hasHover={false}\n        disabled={removeOffset === 0}\n        getRootRef={removeButtonRef}\n        vkuiClass=\"Removable__remove\"\n        onClick={onRemoveClick}\n      >\n        <span vkuiClass=\"Removable__remove-in\">{removePlaceholder}</span>\n      </Tappable>\n    </div>\n  );\n};\n\ninterface RemovableOwnProps\n  extends React.AllHTMLAttributes<HTMLElement>,\n    RemovableProps,\n    HasRootRef<HTMLDivElement> {\n  /**\n   * Расположение кнопки удаления.\n   */\n  align?: \"start\" | \"center\";\n}\n\nexport const Removable: React.FC<RemovableOwnProps> = ({\n  getRootRef,\n  children,\n  onRemove = noop,\n  removePlaceholder = \"Удалить\",\n  align = \"center\",\n  ...restProps\n}: RemovableOwnProps) => {\n  const platform = usePlatform();\n  const { sizeY } = useAdaptivity();\n\n  const ref = useExternRef(getRootRef);\n\n  const onRemoveClick = (e: React.MouseEvent) => {\n    e.preventDefault();\n    onRemove(e);\n  };\n\n  const removePlaceholderString: string =\n    getTitleFromChildren(removePlaceholder);\n\n  return (\n    <div\n      {...restProps}\n      ref={ref}\n      vkuiClass={classNames(\n        getClassName(\"Removable\", platform),\n        `Removable--${align}`,\n        `Removable--sizeY-${sizeY}`\n      )}\n    >\n      {(platform === ANDROID || platform === VKCOM) && (\n        <div vkuiClass=\"Removable__content\">\n          {children}\n\n          <IconButton\n            activeMode=\"opacity\"\n            hoverMode=\"opacity\"\n            vkuiClass=\"Removable__action\"\n            onClick={onRemoveClick}\n            aria-label={removePlaceholderString}\n          >\n            <Icon24Cancel role=\"presentation\" />\n          </IconButton>\n        </div>\n      )}\n\n      {platform === IOS && (\n        <RemovableIos\n          onRemoveClick={onRemoveClick}\n          removePlaceholder={removePlaceholder}\n          removePlaceholderString={removePlaceholderString}\n        >\n          {children}\n        </RemovableIos>\n      )}\n    </div>\n  );\n};\n"],"file":"Removable.js"}

package/dist/components/RichCell/RichCell.d.ts

@@ -32,5 +32,5 @@ export interface RichCellProps extends TappableProps {
     disabled?: boolean;
     multiline?: boolean;
 }
-declare const _default: React.FC<RichCellProps>;
+declare const _default: React.FC<Pick<RichCellProps, "max" | "required" | "high" | "low" | "disabled" | "default" | "start" | "open" | "bottom" | "media" | "hidden" | "caption" | "cite" | "data" | "dir" | "form" | "label" | "slot" | "span" | "style" | "summary" | "title" | "pattern" | "text" | "async" | "defer" | "manifest" | "color" | "content" | "size" | "wrap" | "after" | "multiple" | "height" | "translate" | "width" | "prefix" | "src" | "children" | "className" | "id" | "lang" | "method" | "min" | "name" | "target" | "type" | "role" | "tabIndex" | "crossOrigin" | "href" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDownCapture" | "onMouseEnter" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancelCapture" | "onTouchEndCapture" | "onTouchMoveCapture" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "list" | "classID" | "useMap" | "wmode" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "contentEditable" | "contextMenu" | "draggable" | "placeholder" | "spellCheck" | "radioGroup" | "about" | "datatype" | "inlist" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "as" | "hrefLang" | "integrity" | "rel" | "sizes" | "charSet" | "kind" | "srcLang" | "value" | "download" | "alt" | "coords" | "shape" | "autoPlay" | "controls" | "loop" | "mediaGroup" | "muted" | "playsInline" | "preload" | "autoFocus" | "formAction" | "formEncType" | "formMethod" | "formNoValidate" | "formTarget" | "dateTime" | "acceptCharset" | "action" | "autoComplete" | "encType" | "noValidate" | "allowFullScreen" | "allowTransparency" | "frameBorder" | "marginHeight" | "marginWidth" | "sandbox" | "scrolling" | "seamless" | "srcDoc" | "srcSet" | "accept" | "capture" | "checked" | "maxLength" | "minLength" | "readOnly" | "step" | "htmlFor" | "httpEquiv" | "optimum" | "reversed" | "selected" | "nonce" | "scoped" | "cellPadding" | "cellSpacing" | "colSpan" | "headers" | "rowSpan" | "scope" | "cols" | "rows" | "poster" | "challenge" | "keyType" | "keyParams" | "onStart" | "onMove" | "onEnd" | "Component" | "getRootRef" | "stopPropagation" | "activeEffectDelay" | "hasHover" | "hoverMode" | "hasActive" | "activeMode" | "focusVisibleMode" | "before" | "actions" | "multiline"> & import("../AdaptivityProvider/AdaptivityContext").SizeProps>;
 export default _default;

package/dist/components/RichCell/RichCell.js

@@ -49,7 +49,8 @@ var RichCell = function RichCell(_ref) {
   }, bottom, hasReactNode(actions) && createScopedElement("div", {
     vkuiClass: "RichCell__actions"
   }, actions))));
-};
+}; // eslint-disable-next-line import/no-default-export
+
 
 export default withAdaptivity(RichCell, {
   sizeY: true

package/dist/components/RichCell/RichCell.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/RichCell/RichCell.tsx"],"names":["classNames","usePlatform","getClassName","Tappable","hasReactNode","Text","Subhead","withAdaptivity","RichCell","children","text","caption","before","after","bottom","actions","multiline","sizeY","restProps","platform"],"mappings":";;;;AACA,SAASA,UAAT;AACA,SAASC,WAAT;AACA,SAASC,YAAT;AACA,OAAOC,QAAP;AACA,SAASC,YAAT;AACA,OAAOC,IAAP;AACA,OAAOC,OAAP;AACA,SAASC,cAAT;;AAmCA,IAAMC,QAAiC,GAAG,SAApCA,QAAoC,OAWpC;AAAA,MAVJC,QAUI,QAVJA,QAUI;AAAA,MATJC,IASI,QATJA,IASI;AAAA,MARJC,OAQI,QARJA,OAQI;AAAA,MAPJC,MAOI,QAPJA,MAOI;AAAA,MANJC,KAMI,QANJA,KAMI;AAAA,MALJC,MAKI,QALJA,MAKI;AAAA,MAJJC,OAII,QAJJA,OAII;AAAA,MAHJC,SAGI,QAHJA,SAGI;AAAA,MAFJC,KAEI,QAFJA,KAEI;AAAA,MADDC,SACC;;AACJ,MAAMC,QAAQ,GAAGlB,WAAW,EAA5B;AAEA,SACE,oBAAC,QAAD,eACMiB,SADN;AAEE,IAAA,SAAS,EAAElB,UAAU,CACnBE,YAAY,CAAC,UAAD,EAAaiB,QAAb,CADO,EAEnB;AACE,wBAAkBH;AADpB,KAFmB,4BAKAC,KALA;AAFvB,MAUGL,MAVH,EAWE;AAAK,IAAA,SAAS,EAAC;AAAf,KAEGC,KAFH,EAGE,oBAAC,IAAD;AAAM,IAAA,MAAM,EAAC,QAAb;AAAsB,IAAA,SAAS,EAAC;AAAhC,KACE;AAAK,IAAA,SAAS,EAAC;AAAf,KAAqCJ,QAArC,CADF,EAEGL,YAAY,CAACS,KAAD,CAAZ,IACC;AAAK,IAAA,SAAS,EAAC;AAAf,KAAkCA,KAAlC,CAHJ,CAHF,EASGT,YAAY,CAACM,IAAD,CAAZ,IACC,oBAAC,IAAD;AAAM,IAAA,MAAM,EAAC,SAAb;AAAuB,IAAA,SAAS,EAAC;AAAjC,KACGA,IADH,CAVJ,EAcGN,YAAY,CAACO,OAAD,CAAZ,IACC,oBAAC,OAAD;AACE,IAAA,SAAS,EAAC,MADZ;AAEE,IAAA,MAAM,EAAC,SAFT;AAGE,IAAA,SAAS,EAAC;AAHZ,KAKGA,OALH,CAfJ,EAuBG,CAACP,YAAY,CAACU,MAAD,CAAZ,IAAwBV,YAAY,CAACW,OAAD,CAArC,KACC;AAAK,IAAA,SAAS,EAAC;AAAf,KACGD,MADH,EAEGV,YAAY,CAACW,OAAD,CAAZ,IACC;AAAK,IAAA,SAAS,EAAC;AAAf,KAAoCA,OAApC,CAHJ,CAxBJ,CAXF,CADF;AA8CD,CA5DD;;AA8DA,eAAeR,cAAc,CAACC,QAAD,EAAW;AAAES,EAAAA,KAAK,EAAE;AAAT,CAAX,CAA7B","sourcesContent":["import * as React from \"react\";\nimport { classNames } from \"../../lib/classNames\";\nimport { usePlatform } from \"../../hooks/usePlatform\";\nimport { getClassName } from \"../../helpers/getClassName\";\nimport Tappable, { TappableProps } from \"../Tappable/Tappable\";\nimport { hasReactNode } from \"../../lib/utils\";\nimport Text from \"../Typography/Text/Text\";\nimport Subhead from \"../Typography/Subhead/Subhead\";\nimport { withAdaptivity } from \"../../hoc/withAdaptivity\";\nimport \"./RichCell.css\";\n\nexport interface RichCellProps extends TappableProps {\n  /**\n   * Контейнер для текста под `children`.\n   */\n  text?: React.ReactNode;\n  /**\n   * Контейнер для текста под `text`.\n   */\n  caption?: React.ReactNode;\n  /**\n   * Контейнер для контента под `caption`. Например `<UsersStack size=\"s\" />`\n   */\n  bottom?: React.ReactNode;\n  /**\n   * Кнопка или набор кнопок `<Button size=\"s\" />`. Располагается под `bottom`.\n   */\n  actions?: React.ReactNode;\n  /**\n   * `<Avatar size={48|72} />`\n   */\n  before?: React.ReactNode;\n  /**\n   * Иконка 28 или текст\n   */\n  after?: React.ReactNode;\n  /**\n   * Убирает анимацию нажатия\n   */\n  disabled?: boolean;\n  multiline?: boolean;\n}\n\nconst RichCell: React.FC<RichCellProps> = ({\n  children,\n  text,\n  caption,\n  before,\n  after,\n  bottom,\n  actions,\n  multiline,\n  sizeY,\n  ...restProps\n}) => {\n  const platform = usePlatform();\n\n  return (\n    <Tappable\n      {...restProps}\n      vkuiClass={classNames(\n        getClassName(\"RichCell\", platform),\n        {\n          \"RichCell--mult\": multiline,\n        },\n        `RichCell--sizeY-${sizeY}`\n      )}\n    >\n      {before}\n      <div vkuiClass=\"RichCell__in\">\n        {/* Этот after будет скрыт из верстки. Он нужен для CSS */}\n        {after}\n        <Text weight=\"medium\" vkuiClass=\"RichCell__content\">\n          <div vkuiClass=\"RichCell__children\">{children}</div>\n          {hasReactNode(after) && (\n            <div vkuiClass=\"RichCell__after\">{after}</div>\n          )}\n        </Text>\n        {hasReactNode(text) && (\n          <Text weight=\"regular\" vkuiClass=\"RichCell__text\">\n            {text}\n          </Text>\n        )}\n        {hasReactNode(caption) && (\n          <Subhead\n            Component=\"span\"\n            weight=\"regular\"\n            vkuiClass=\"RichCell__caption\"\n          >\n            {caption}\n          </Subhead>\n        )}\n        {(hasReactNode(bottom) || hasReactNode(actions)) && (\n          <div vkuiClass=\"RichCell__bottom\">\n            {bottom}\n            {hasReactNode(actions) && (\n              <div vkuiClass=\"RichCell__actions\">{actions}</div>\n            )}\n          </div>\n        )}\n      </div>\n    </Tappable>\n  );\n};\n\nexport default withAdaptivity(RichCell, { sizeY: true });\n"],"file":"RichCell.js"}
+{"version":3,"sources":["../../../src/components/RichCell/RichCell.tsx"],"names":["classNames","usePlatform","getClassName","Tappable","hasReactNode","Text","Subhead","withAdaptivity","RichCell","children","text","caption","before","after","bottom","actions","multiline","sizeY","restProps","platform"],"mappings":";;;;AACA,SAASA,UAAT;AACA,SAASC,WAAT;AACA,SAASC,YAAT;AACA,OAAOC,QAAP;AACA,SAASC,YAAT;AACA,OAAOC,IAAP;AACA,OAAOC,OAAP;AACA,SAASC,cAAT;;AAmCA,IAAMC,QAAiC,GAAG,SAApCA,QAAoC,OAWpC;AAAA,MAVJC,QAUI,QAVJA,QAUI;AAAA,MATJC,IASI,QATJA,IASI;AAAA,MARJC,OAQI,QARJA,OAQI;AAAA,MAPJC,MAOI,QAPJA,MAOI;AAAA,MANJC,KAMI,QANJA,KAMI;AAAA,MALJC,MAKI,QALJA,MAKI;AAAA,MAJJC,OAII,QAJJA,OAII;AAAA,MAHJC,SAGI,QAHJA,SAGI;AAAA,MAFJC,KAEI,QAFJA,KAEI;AAAA,MADDC,SACC;;AACJ,MAAMC,QAAQ,GAAGlB,WAAW,EAA5B;AAEA,SACE,oBAAC,QAAD,eACMiB,SADN;AAEE,IAAA,SAAS,EAAElB,UAAU,CACnBE,YAAY,CAAC,UAAD,EAAaiB,QAAb,CADO,EAEnB;AACE,wBAAkBH;AADpB,KAFmB,4BAKAC,KALA;AAFvB,MAUGL,MAVH,EAWE;AAAK,IAAA,SAAS,EAAC;AAAf,KAEGC,KAFH,EAGE,oBAAC,IAAD;AAAM,IAAA,MAAM,EAAC,QAAb;AAAsB,IAAA,SAAS,EAAC;AAAhC,KACE;AAAK,IAAA,SAAS,EAAC;AAAf,KAAqCJ,QAArC,CADF,EAEGL,YAAY,CAACS,KAAD,CAAZ,IACC;AAAK,IAAA,SAAS,EAAC;AAAf,KAAkCA,KAAlC,CAHJ,CAHF,EASGT,YAAY,CAACM,IAAD,CAAZ,IACC,oBAAC,IAAD;AAAM,IAAA,MAAM,EAAC,SAAb;AAAuB,IAAA,SAAS,EAAC;AAAjC,KACGA,IADH,CAVJ,EAcGN,YAAY,CAACO,OAAD,CAAZ,IACC,oBAAC,OAAD;AACE,IAAA,SAAS,EAAC,MADZ;AAEE,IAAA,MAAM,EAAC,SAFT;AAGE,IAAA,SAAS,EAAC;AAHZ,KAKGA,OALH,CAfJ,EAuBG,CAACP,YAAY,CAACU,MAAD,CAAZ,IAAwBV,YAAY,CAACW,OAAD,CAArC,KACC;AAAK,IAAA,SAAS,EAAC;AAAf,KACGD,MADH,EAEGV,YAAY,CAACW,OAAD,CAAZ,IACC;AAAK,IAAA,SAAS,EAAC;AAAf,KAAoCA,OAApC,CAHJ,CAxBJ,CAXF,CADF;AA8CD,CA5DD,C,CA8DA;;;AACA,eAAeR,cAAc,CAACC,QAAD,EAAW;AAAES,EAAAA,KAAK,EAAE;AAAT,CAAX,CAA7B","sourcesContent":["import * as React from \"react\";\nimport { classNames } from \"../../lib/classNames\";\nimport { usePlatform } from \"../../hooks/usePlatform\";\nimport { getClassName } from \"../../helpers/getClassName\";\nimport Tappable, { TappableProps } from \"../Tappable/Tappable\";\nimport { hasReactNode } from \"../../lib/utils\";\nimport Text from \"../Typography/Text/Text\";\nimport Subhead from \"../Typography/Subhead/Subhead\";\nimport { withAdaptivity } from \"../../hoc/withAdaptivity\";\nimport \"./RichCell.css\";\n\nexport interface RichCellProps extends TappableProps {\n  /**\n   * Контейнер для текста под `children`.\n   */\n  text?: React.ReactNode;\n  /**\n   * Контейнер для текста под `text`.\n   */\n  caption?: React.ReactNode;\n  /**\n   * Контейнер для контента под `caption`. Например `<UsersStack size=\"s\" />`\n   */\n  bottom?: React.ReactNode;\n  /**\n   * Кнопка или набор кнопок `<Button size=\"s\" />`. Располагается под `bottom`.\n   */\n  actions?: React.ReactNode;\n  /**\n   * `<Avatar size={48|72} />`\n   */\n  before?: React.ReactNode;\n  /**\n   * Иконка 28 или текст\n   */\n  after?: React.ReactNode;\n  /**\n   * Убирает анимацию нажатия\n   */\n  disabled?: boolean;\n  multiline?: boolean;\n}\n\nconst RichCell: React.FC<RichCellProps> = ({\n  children,\n  text,\n  caption,\n  before,\n  after,\n  bottom,\n  actions,\n  multiline,\n  sizeY,\n  ...restProps\n}) => {\n  const platform = usePlatform();\n\n  return (\n    <Tappable\n      {...restProps}\n      vkuiClass={classNames(\n        getClassName(\"RichCell\", platform),\n        {\n          \"RichCell--mult\": multiline,\n        },\n        `RichCell--sizeY-${sizeY}`\n      )}\n    >\n      {before}\n      <div vkuiClass=\"RichCell__in\">\n        {/* Этот after будет скрыт из верстки. Он нужен для CSS */}\n        {after}\n        <Text weight=\"medium\" vkuiClass=\"RichCell__content\">\n          <div vkuiClass=\"RichCell__children\">{children}</div>\n          {hasReactNode(after) && (\n            <div vkuiClass=\"RichCell__after\">{after}</div>\n          )}\n        </Text>\n        {hasReactNode(text) && (\n          <Text weight=\"regular\" vkuiClass=\"RichCell__text\">\n            {text}\n          </Text>\n        )}\n        {hasReactNode(caption) && (\n          <Subhead\n            Component=\"span\"\n            weight=\"regular\"\n            vkuiClass=\"RichCell__caption\"\n          >\n            {caption}\n          </Subhead>\n        )}\n        {(hasReactNode(bottom) || hasReactNode(actions)) && (\n          <div vkuiClass=\"RichCell__bottom\">\n            {bottom}\n            {hasReactNode(actions) && (\n              <div vkuiClass=\"RichCell__actions\">{actions}</div>\n            )}\n          </div>\n        )}\n      </div>\n    </Tappable>\n  );\n};\n\n// eslint-disable-next-line import/no-default-export\nexport default withAdaptivity(RichCell, { sizeY: true });\n"],"file":"RichCell.js"}

package/dist/components/RichTooltip/RichTooltip.d.ts

@@ -1,46 +1,5 @@
 import * as React from "react";
-import { Placement } from "../Popper/Popper";
+import { HoverPopperProps } from "../HoverPopper/HoverPopper";
 import "./RichTooltip.css";
-export interface RichTooltipProps {
-    /**
-     * Содержимое тултипа
-     */
-    content?: React.ReactNode;
-    /**
-     * Если передан, то тултип будет показыван/скрыт в зависимости от значения свойства
-     */
-    shown?: boolean;
-    /**
-     * Вызывается при каждом изменении видимости тултипа
-     */
-    onShownChange?: (shown: boolean) => void;
-    /**
-     * Количество миллисекунд, после которых произойдет показ дропдауна
-     */
-    showDelay?: number;
-    /**
-     * Количество миллисекунд, после которых произойдет скрытие дропдауна
-     */
-    hideDelay?: number;
-    /**
-     * Либо jsx-элемент (div, button, etc.), либо компонент со свойством `getRootRef`, которое применяется к корневому элементу компонента
-     */
-    children?: React.ReactElement;
-    /**
-     * По умолчанию компонент выберет наилучшее расположение сам. Но его можно задать извне с помощью этого свойства
-     */
-    placement?: Placement;
-    /**
-     * Отступ по вспомогательной оси
-     */
-    offsetSkidding?: number;
-    /**
-     * Отступ по главной оси
-     */
-    offsetDistance?: number;
-    onPlacementChange?: (data: {
-        placement?: Placement;
-    }) => void;
-    arrow?: boolean;
-}
+export declare type RichTooltipProps = Omit<HoverPopperProps, "arrowClassName">;
 export declare const RichTooltip: React.FC<RichTooltipProps>;

package/dist/components/RichTooltip/RichTooltip.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/RichTooltip/RichTooltip.tsx"],"names":["HoverPopper","getClassName","usePlatform","useAppearance","classNames","prefixClass","RichTooltip","children","arrow","popperProps","platform","appearance"],"mappings":";;;;;AACA,SAASA,WAAT;AACA,SAASC,YAAT;AACA,SAASC,WAAT;AACA,SAASC,aAAT;AACA,SAASC,UAAT;AACA,SAASC,WAAT;AA+CA,OAAO,IAAMC,WAAuC,GAAG,SAA1CA,WAA0C,OAI/B;AAAA,MAHtBC,QAGsB,QAHtBA,QAGsB;AAAA,wBAFtBC,KAEsB;AAAA,MAFtBA,KAEsB,2BAFd,IAEc;AAAA,MADnBC,WACmB;;AACtB,MAAMC,QAAQ,GAAGR,WAAW,EAA5B;AACA,MAAMS,UAAU,GAAGR,aAAa,EAAhC;AAEA,SACE,oBAAC,WAAD;AACE,IAAA,SAAS,EAAEC,UAAU,CAACH,YAAY,CAAC,aAAD,EAAgBS,QAAhB,CAAb,6CACFC,UADE,GACa,CAAC,CAACA,UADf,EADvB;AAIE,IAAA,KAAK,EAAEH,KAJT;AAKE,IAAA,cAAc,EAAEH,WAAW,CAAC,oBAAD;AAL7B,KAMMI,WANN,GAQGF,QARH,CADF;AAYD,CApBM","sourcesContent":["import * as React from \"react\";\nimport { HoverPopper } from \"../HoverPopper/HoverPopper\";\nimport { getClassName } from \"../../helpers/getClassName\";\nimport { usePlatform } from \"../../hooks/usePlatform\";\nimport { useAppearance } from \"../../hooks/useAppearance\";\nimport { classNames } from \"../../lib/classNames\";\nimport { prefixClass } from \"../../lib/prefixClass\";\nimport { Placement } from \"../Popper/Popper\";\nimport \"./RichTooltip.css\";\n\n// Приходится избегать экстендов от HoverPopperProps и PopperProps, потому что react-docgen не умеет в Omit.\n// Ждём либо фикса react-docgen (что вряд ли), либо переезда на react-docgen-typescript, где такой проблемы нет.\nexport interface RichTooltipProps {\n  /**\n   * Содержимое тултипа\n   */\n  content?: React.ReactNode;\n  /**\n   * Если передан, то тултип будет показыван/скрыт в зависимости от значения свойства\n   */\n  shown?: boolean;\n  /**\n   * Вызывается при каждом изменении видимости тултипа\n   */\n  onShownChange?: (shown: boolean) => void;\n  /**\n   * Количество миллисекунд, после которых произойдет показ дропдауна\n   */\n  showDelay?: number;\n  /**\n   * Количество миллисекунд, после которых произойдет скрытие дропдауна\n   */\n  hideDelay?: number;\n  /**\n   * Либо jsx-элемент (div, button, etc.), либо компонент со свойством `getRootRef`, которое применяется к корневому элементу компонента\n   */\n  children?: React.ReactElement;\n  /**\n   * По умолчанию компонент выберет наилучшее расположение сам. Но его можно задать извне с помощью этого свойства\n   */\n  placement?: Placement;\n  /**\n   * Отступ по вспомогательной оси\n   */\n  offsetSkidding?: number;\n  /**\n   * Отступ по главной оси\n   */\n  offsetDistance?: number;\n  onPlacementChange?: (data: { placement?: Placement }) => void;\n  arrow?: boolean;\n}\n\nexport const RichTooltip: React.FC<RichTooltipProps> = ({\n  children,\n  arrow = true,\n  ...popperProps\n}: RichTooltipProps) => {\n  const platform = usePlatform();\n  const appearance = useAppearance();\n\n  return (\n    <HoverPopper\n      vkuiClass={classNames(getClassName(\"RichTooltip\", platform), {\n        [`RichTooltip--${appearance}`]: !!appearance,\n      })}\n      arrow={arrow}\n      arrowClassName={prefixClass(\"RichTooltip__arrow\")}\n      {...popperProps}\n    >\n      {children}\n    </HoverPopper>\n  );\n};\n"],"file":"RichTooltip.js"}
+{"version":3,"sources":["../../../src/components/RichTooltip/RichTooltip.tsx"],"names":["HoverPopper","getClassName","usePlatform","useAppearance","classNames","prefixClass","RichTooltip","children","arrow","popperProps","platform","appearance"],"mappings":";;;;;AACA,SAASA,WAAT;AACA,SAASC,YAAT;AACA,SAASC,WAAT;AACA,SAASC,aAAT;AACA,SAASC,UAAT;AACA,SAASC,WAAT;AAKA,OAAO,IAAMC,WAAuC,GAAG,SAA1CA,WAA0C,OAI/B;AAAA,MAHtBC,QAGsB,QAHtBA,QAGsB;AAAA,wBAFtBC,KAEsB;AAAA,MAFtBA,KAEsB,2BAFd,IAEc;AAAA,MADnBC,WACmB;;AACtB,MAAMC,QAAQ,GAAGR,WAAW,EAA5B;AACA,MAAMS,UAAU,GAAGR,aAAa,EAAhC;AAEA,SACE,oBAAC,WAAD;AACE,IAAA,SAAS,EAAEC,UAAU,CAACH,YAAY,CAAC,aAAD,EAAgBS,QAAhB,CAAb,6CACFC,UADE,GACa,CAAC,CAACA,UADf,EADvB;AAIE,IAAA,KAAK,EAAEH,KAJT;AAKE,IAAA,cAAc,EAAEH,WAAW,CAAC,oBAAD;AAL7B,KAMMI,WANN,GAQGF,QARH,CADF;AAYD,CApBM","sourcesContent":["import * as React from \"react\";\nimport { HoverPopper, HoverPopperProps } from \"../HoverPopper/HoverPopper\";\nimport { getClassName } from \"../../helpers/getClassName\";\nimport { usePlatform } from \"../../hooks/usePlatform\";\nimport { useAppearance } from \"../../hooks/useAppearance\";\nimport { classNames } from \"../../lib/classNames\";\nimport { prefixClass } from \"../../lib/prefixClass\";\nimport \"./RichTooltip.css\";\n\nexport type RichTooltipProps = Omit<HoverPopperProps, \"arrowClassName\">;\n\nexport const RichTooltip: React.FC<RichTooltipProps> = ({\n  children,\n  arrow = true,\n  ...popperProps\n}: RichTooltipProps) => {\n  const platform = usePlatform();\n  const appearance = useAppearance();\n\n  return (\n    <HoverPopper\n      vkuiClass={classNames(getClassName(\"RichTooltip\", platform), {\n        [`RichTooltip--${appearance}`]: !!appearance,\n      })}\n      arrow={arrow}\n      arrowClassName={prefixClass(\"RichTooltip__arrow\")}\n      {...popperProps}\n    >\n      {children}\n    </HoverPopper>\n  );\n};\n"],"file":"RichTooltip.js"}

package/dist/components/Root/Root.js

@@ -80,19 +80,16 @@ var Root = function Root(_ref) {
     }
   };
 
-  var finishTransition = function finishTransition() {
+  var finishTransition = React.useCallback(function () {
     return _setState({
       activeView: activeView,
       prevView: prevView,
       isBack: isBack,
       transition: false
     });
-  };
-
+  }, [activeView, isBack, prevView]);
   useIsomorphicLayoutEffect(function () {
-    var _document$activeEleme;
-
-    (_document$activeEleme = document.activeElement) === null || _document$activeEleme === void 0 ? void 0 : _document$activeEleme.blur();
+    document.activeElement.blur();
   }, [!!popout, activeView]); // Нужен переход
 
   useIsomorphicLayoutEffect(function () {
@@ -103,7 +100,7 @@ var Root = function Root(_ref) {
       // Закончился переход
       scroll.scrollTo(0, isBack ? scrolls[activeView] : 0);
       onTransition && onTransition({
-        isBack: isBack,
+        isBack: Boolean(isBack),
         from: prevView,
         to: activeView
       });
@@ -117,7 +114,7 @@ var Root = function Root(_ref) {
     }
 
     disableAnimation ? finishTransition() : fallbackTransition.set();
-  }, [transition]);
+  }, [disableAnimation, fallbackTransition, finishTransition, transition]);
 
   var onAnimationEnd = function onAnimationEnd(e) {
     if (["vkui-root-android-animation-hide-back", "vkui-root-android-animation-show-forward", "vkui-root-ios-animation-hide-back", "vkui-root-ios-animation-show-forward"].includes(e.animationName)) {
@@ -125,12 +122,19 @@ var Root = function Root(_ref) {
     }
   };
 
+  if (process.env.NODE_ENV === "development") {
+    popout && warn("Свойство popout устарело и будет удалено в 5.0.0. Используйте одноименное свойство у SplitLayout.");
+    modal && warn("Свойство modal устарело и будет удалено в 5.0.0. Используйте одноименное свойство у SplitLayout.");
+  }
+
   return createScopedElement("div", _extends({}, restProps, {
     vkuiClass: classNames(getClassName("Root", platform), {
       "Root--transition": !disableAnimation && transition,
       "Root--no-motion": disableAnimation
     })
   }), views.map(function (view) {
+    var _scrolls$viewId;
+
     var viewId = getNavId(view.props, warn);
 
     if (viewId !== activeView && !(transition && viewId === prevView)) {
@@ -142,9 +146,9 @@ var Root = function Root(_ref) {
     return createScopedElement("div", {
       key: viewId,
       ref: function ref(e) {
-        return viewNodes[viewId] = e;
+        return viewId && (viewNodes[viewId] = e);
       },
-      onAnimationEnd: isTransitionTarget ? onAnimationEnd : null,
+      onAnimationEnd: isTransitionTarget ? onAnimationEnd : undefined,
       vkuiClass: classNames("Root__view", {
         "Root__view--hide-back": transition && viewId === prevView && isBack,
         "Root__view--hide-forward": transition && viewId === prevView && !isBack,
@@ -157,7 +161,7 @@ var Root = function Root(_ref) {
     }, createScopedElement("div", {
       vkuiClass: "Root__scrollCompensation",
       style: {
-        marginTop: compensateScroll ? -scrolls[viewId] : null
+        marginTop: compensateScroll ? viewId && -((_scrolls$viewId = scrolls[viewId]) !== null && _scrolls$viewId !== void 0 ? _scrolls$viewId : 0) : undefined
       }
     }, view)));
   }), createScopedElement(AppRootPortal, null, !!popout && createScopedElement("div", {
@@ -165,7 +169,8 @@ var Root = function Root(_ref) {
   }, popout), !!modal && createScopedElement("div", {
     vkuiClass: "Root__modal"
   }, modal)));
-};
+}; // eslint-disable-next-line import/no-default-export
+
 
 export default Root;
 //# sourceMappingURL=Root.js.map

package/dist/components/Root/Root.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/Root/Root.tsx"],"names":["React","classNames","getClassName","IOS","ConfigProviderContext","SplitColContext","AppRootPortal","ScrollContext","NavTransitionProvider","getNavId","warnOnce","useDOM","useIsomorphicLayoutEffect","useTimeout","usePlatform","warn","Root","popout","modal","children","_activeView","activeView","onTransition","nav","restProps","scroll","useContext","platform","document","scrolls","useRef","current","viewNodes","transitionMotionEnabled","animate","disableAnimation","views","Children","toArray","useState","transition","prevView","isBack","_setState","transitionTo","panel","viewIds","map","view","props","indexOf","getScroll","y","finishTransition","activeElement","blur","scrollTo","from","to","fallbackTransition","useEffect","clear","set","onAnimationEnd","e","includes","animationName","viewId","isTransitionTarget","compensateScroll","marginTop"],"mappings":"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","sourcesContent":["import * as React from \"react\";\nimport { classNames } from \"../../lib/classNames\";\nimport { getClassName } from \"../../helpers/getClassName\";\nimport { IOS } from \"../../lib/platform\";\nimport { ConfigProviderContext } from \"../ConfigProvider/ConfigProviderContext\";\nimport { SplitColContext } from \"../SplitCol/SplitCol\";\nimport { AppRootPortal } from \"../AppRoot/AppRootPortal\";\nimport { ScrollContext } from \"../AppRoot/ScrollContext\";\nimport { NavTransitionProvider } from \"../NavTransitionContext/NavTransitionContext\";\nimport { getNavId, NavIdProps } from \"../../lib/getNavId\";\nimport { warnOnce } from \"../../lib/warnOnce\";\nimport { useDOM } from \"../../lib/dom\";\nimport { useIsomorphicLayoutEffect } from \"../../lib/useIsomorphicLayoutEffect\";\nimport { useTimeout } from \"../../hooks/useTimeout\";\nimport { usePlatform } from \"../../hooks/usePlatform\";\nimport \"./Root.css\";\n\nconst warn = warnOnce(\"Root\");\n\nexport interface RootProps\n  extends React.HTMLAttributes<HTMLDivElement>,\n    NavIdProps {\n  activeView: string;\n  onTransition?(params: { isBack: boolean; from: string; to: string }): void;\n  /**\n   * @deprecated будет удалено в 5.0.0. Используйте одноименное свойство у `SplitLayout`.\n   *\n   * Свойство для отрисовки `Alert`, `ActionSheet` и `ScreenSpinner`.\n   */\n  popout?: React.ReactNode;\n  /**\n   * @deprecated будет удалено в 5.0.0. Используйте одноименное свойство у `SplitLayout`.\n   *\n   * Свойство для отрисовки `ModalRoot`.\n   */\n  modal?: React.ReactNode;\n}\n\nexport interface RootState {\n  activeView: string;\n  transition: boolean;\n  isBack?: boolean;\n  prevView?: string;\n}\n\nconst Root: React.FC<RootProps> = ({\n  popout = null,\n  modal,\n  children,\n  activeView: _activeView,\n  onTransition,\n  nav,\n  ...restProps\n}: RootProps) => {\n  const scroll = React.useContext(ScrollContext);\n  const platform = usePlatform();\n  const { document } = useDOM();\n  const scrolls = React.useRef<Record<string, number>>({}).current;\n  const viewNodes = React.useRef<Record<string, HTMLElement>>({}).current;\n\n  const { transitionMotionEnabled = true } = React.useContext(\n    ConfigProviderContext\n  );\n  const { animate } = React.useContext(SplitColContext);\n  const disableAnimation = !transitionMotionEnabled || !animate;\n\n  const views = React.Children.toArray(children) as React.ReactElement[];\n\n  const [{ prevView, activeView, transition, isBack }, _setState] =\n    React.useState<RootState>({\n      activeView: _activeView,\n      transition: false,\n    });\n  const transitionTo = (panel: string) => {\n    if (panel !== activeView) {\n      const viewIds = views.map((view) => getNavId(view.props, warn));\n      const isBack = viewIds.indexOf(panel) < viewIds.indexOf(activeView);\n      scrolls[activeView] = scroll.getScroll().y;\n      _setState({\n        activeView: panel,\n        prevView: activeView,\n        transition: true,\n        isBack,\n      });\n    }\n  };\n  const finishTransition = () =>\n    _setState({ activeView, prevView, isBack, transition: false });\n\n  useIsomorphicLayoutEffect(() => {\n    (document.activeElement as HTMLElement)?.blur();\n  }, [!!popout, activeView]);\n\n  // Нужен переход\n  useIsomorphicLayoutEffect(() => transitionTo(_activeView), [_activeView]);\n  useIsomorphicLayoutEffect(() => {\n    if (!transition && prevView) {\n      // Закончился переход\n      scroll.scrollTo(0, isBack ? scrolls[activeView] : 0);\n      onTransition && onTransition({ isBack, from: prevView, to: activeView });\n    }\n  }, [transition]);\n\n  const fallbackTransition = useTimeout(\n    finishTransition,\n    platform === IOS ? 600 : 300\n  );\n  React.useEffect(() => {\n    if (!transition) {\n      fallbackTransition.clear();\n      return;\n    }\n    disableAnimation ? finishTransition() : fallbackTransition.set();\n  }, [transition]);\n\n  const onAnimationEnd = (e: React.AnimationEvent) => {\n    if (\n      [\n        \"vkui-root-android-animation-hide-back\",\n        \"vkui-root-android-animation-show-forward\",\n        \"vkui-root-ios-animation-hide-back\",\n        \"vkui-root-ios-animation-show-forward\",\n      ].includes(e.animationName)\n    ) {\n      finishTransition();\n    }\n  };\n\n  return (\n    <div\n      {...restProps}\n      vkuiClass={classNames(getClassName(\"Root\", platform), {\n        \"Root--transition\": !disableAnimation && transition,\n        \"Root--no-motion\": disableAnimation,\n      })}\n    >\n      {views.map((view) => {\n        const viewId = getNavId(view.props, warn);\n        if (viewId !== activeView && !(transition && viewId === prevView)) {\n          return null;\n        }\n        const isTransitionTarget =\n          transition && viewId === (isBack ? prevView : activeView);\n        const compensateScroll =\n          transition &&\n          (viewId === prevView || (isBack && viewId === activeView));\n        return (\n          <div\n            key={viewId}\n            ref={(e) => (viewNodes[viewId] = e)}\n            onAnimationEnd={isTransitionTarget ? onAnimationEnd : null}\n            vkuiClass={classNames(\"Root__view\", {\n              \"Root__view--hide-back\":\n                transition && viewId === prevView && isBack,\n              \"Root__view--hide-forward\":\n                transition && viewId === prevView && !isBack,\n              \"Root__view--show-back\":\n                transition && viewId === activeView && isBack,\n              \"Root__view--show-forward\":\n                transition && viewId === activeView && !isBack,\n              \"Root__view--active\": !transition && viewId === activeView,\n            })}\n          >\n            <NavTransitionProvider\n              entering={transition && viewId === activeView}\n            >\n              <div\n                vkuiClass=\"Root__scrollCompensation\"\n                style={{\n                  marginTop: compensateScroll ? -scrolls[viewId] : null,\n                }}\n              >\n                {view}\n              </div>\n            </NavTransitionProvider>\n          </div>\n        );\n      })}\n      <AppRootPortal>\n        {!!popout && <div vkuiClass=\"Root__popout\">{popout}</div>}\n        {!!modal && <div vkuiClass=\"Root__modal\">{modal}</div>}\n      </AppRootPortal>\n    </div>\n  );\n};\n\nexport default Root;\n"],"file":"Root.js"}
+{"version":3,"sources":["../../../src/components/Root/Root.tsx"],"names":["React","classNames","getClassName","IOS","ConfigProviderContext","SplitColContext","AppRootPortal","ScrollContext","NavTransitionProvider","getNavId","warnOnce","useDOM","useIsomorphicLayoutEffect","useTimeout","usePlatform","warn","Root","popout","modal","children","_activeView","activeView","onTransition","nav","restProps","scroll","useContext","platform","document","scrolls","useRef","current","viewNodes","transitionMotionEnabled","animate","disableAnimation","views","Children","toArray","useState","transition","prevView","isBack","_setState","transitionTo","panel","viewIds","map","view","props","indexOf","getScroll","y","finishTransition","useCallback","activeElement","blur","scrollTo","Boolean","from","to","fallbackTransition","useEffect","clear","set","onAnimationEnd","e","includes","animationName","process","env","NODE_ENV","viewId","isTransitionTarget","compensateScroll","undefined","marginTop"],"mappings":"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","sourcesContent":["import * as React from \"react\";\nimport { classNames } from \"../../lib/classNames\";\nimport { getClassName } from \"../../helpers/getClassName\";\nimport { IOS } from \"../../lib/platform\";\nimport { ConfigProviderContext } from \"../ConfigProvider/ConfigProviderContext\";\nimport { SplitColContext } from \"../SplitCol/SplitCol\";\nimport { AppRootPortal } from \"../AppRoot/AppRootPortal\";\nimport { ScrollContext } from \"../AppRoot/ScrollContext\";\nimport { NavTransitionProvider } from \"../NavTransitionContext/NavTransitionContext\";\nimport { getNavId, NavIdProps } from \"../../lib/getNavId\";\nimport { warnOnce } from \"../../lib/warnOnce\";\nimport { useDOM } from \"../../lib/dom\";\nimport { useIsomorphicLayoutEffect } from \"../../lib/useIsomorphicLayoutEffect\";\nimport { useTimeout } from \"../../hooks/useTimeout\";\nimport { usePlatform } from \"../../hooks/usePlatform\";\nimport \"./Root.css\";\n\nexport interface RootProps\n  extends React.HTMLAttributes<HTMLDivElement>,\n    NavIdProps {\n  activeView: string;\n  onTransition?(params: { isBack: boolean; from: string; to: string }): void;\n  /**\n   * @deprecated будет удалено в 5.0.0. Используйте одноименное свойство у `SplitLayout`.\n   *\n   * Свойство для отрисовки `Alert`, `ActionSheet` и `ScreenSpinner`.\n   */\n  popout?: React.ReactNode;\n  /**\n   * @deprecated будет удалено в 5.0.0. Используйте одноименное свойство у `SplitLayout`.\n   *\n   * Свойство для отрисовки `ModalRoot`.\n   */\n  modal?: React.ReactNode;\n}\n\nexport interface RootState {\n  activeView: string;\n  transition: boolean;\n  isBack?: boolean;\n  prevView?: string;\n}\n\nconst warn = warnOnce(\"Root\");\nconst Root: React.FC<RootProps> = ({\n  popout = null,\n  modal,\n  children,\n  activeView: _activeView,\n  onTransition,\n  nav,\n  ...restProps\n}: RootProps) => {\n  const scroll = React.useContext(ScrollContext);\n  const platform = usePlatform();\n  const { document } = useDOM();\n  const scrolls = React.useRef<Record<string, number>>({}).current;\n  const viewNodes = React.useRef<Record<string, HTMLElement | null>>(\n    {}\n  ).current;\n\n  const { transitionMotionEnabled = true } = React.useContext(\n    ConfigProviderContext\n  );\n  const { animate } = React.useContext(SplitColContext);\n  const disableAnimation = !transitionMotionEnabled || !animate;\n\n  const views = React.Children.toArray(children) as React.ReactElement[];\n\n  const [{ prevView, activeView, transition, isBack }, _setState] =\n    React.useState<RootState>({\n      activeView: _activeView,\n      transition: false,\n    });\n  const transitionTo = (panel: string) => {\n    if (panel !== activeView) {\n      const viewIds = views.map((view) => getNavId(view.props, warn));\n      const isBack = viewIds.indexOf(panel) < viewIds.indexOf(activeView);\n      scrolls[activeView] = scroll.getScroll().y;\n      _setState({\n        activeView: panel,\n        prevView: activeView,\n        transition: true,\n        isBack,\n      });\n    }\n  };\n  const finishTransition = React.useCallback(\n    () => _setState({ activeView, prevView, isBack, transition: false }),\n    [activeView, isBack, prevView]\n  );\n\n  useIsomorphicLayoutEffect(() => {\n    (document!.activeElement as HTMLElement).blur();\n  }, [!!popout, activeView]);\n\n  // Нужен переход\n  useIsomorphicLayoutEffect(() => transitionTo(_activeView), [_activeView]);\n  useIsomorphicLayoutEffect(() => {\n    if (!transition && prevView) {\n      // Закончился переход\n      scroll.scrollTo(0, isBack ? scrolls[activeView] : 0);\n      onTransition &&\n        onTransition({\n          isBack: Boolean(isBack),\n          from: prevView,\n          to: activeView,\n        });\n    }\n  }, [transition]);\n\n  const fallbackTransition = useTimeout(\n    finishTransition,\n    platform === IOS ? 600 : 300\n  );\n  React.useEffect(() => {\n    if (!transition) {\n      fallbackTransition.clear();\n      return;\n    }\n    disableAnimation ? finishTransition() : fallbackTransition.set();\n  }, [disableAnimation, fallbackTransition, finishTransition, transition]);\n\n  const onAnimationEnd = (e: React.AnimationEvent) => {\n    if (\n      [\n        \"vkui-root-android-animation-hide-back\",\n        \"vkui-root-android-animation-show-forward\",\n        \"vkui-root-ios-animation-hide-back\",\n        \"vkui-root-ios-animation-show-forward\",\n      ].includes(e.animationName)\n    ) {\n      finishTransition();\n    }\n  };\n\n  if (process.env.NODE_ENV === \"development\") {\n    popout &&\n      warn(\n        \"Свойство popout устарело и будет удалено в 5.0.0. Используйте одноименное свойство у SplitLayout.\"\n      );\n    modal &&\n      warn(\n        \"Свойство modal устарело и будет удалено в 5.0.0. Используйте одноименное свойство у SplitLayout.\"\n      );\n  }\n\n  return (\n    <div\n      {...restProps}\n      vkuiClass={classNames(getClassName(\"Root\", platform), {\n        \"Root--transition\": !disableAnimation && transition,\n        \"Root--no-motion\": disableAnimation,\n      })}\n    >\n      {views.map((view) => {\n        const viewId = getNavId(view.props, warn);\n        if (viewId !== activeView && !(transition && viewId === prevView)) {\n          return null;\n        }\n        const isTransitionTarget =\n          transition && viewId === (isBack ? prevView : activeView);\n        const compensateScroll =\n          transition &&\n          (viewId === prevView || (isBack && viewId === activeView));\n        return (\n          <div\n            key={viewId}\n            ref={(e) => viewId && (viewNodes[viewId] = e)}\n            onAnimationEnd={isTransitionTarget ? onAnimationEnd : undefined}\n            vkuiClass={classNames(\"Root__view\", {\n              \"Root__view--hide-back\":\n                transition && viewId === prevView && isBack,\n              \"Root__view--hide-forward\":\n                transition && viewId === prevView && !isBack,\n              \"Root__view--show-back\":\n                transition && viewId === activeView && isBack,\n              \"Root__view--show-forward\":\n                transition && viewId === activeView && !isBack,\n              \"Root__view--active\": !transition && viewId === activeView,\n            })}\n          >\n            <NavTransitionProvider\n              entering={transition && viewId === activeView}\n            >\n              <div\n                vkuiClass=\"Root__scrollCompensation\"\n                style={{\n                  marginTop: compensateScroll\n                    ? viewId && -(scrolls[viewId] ?? 0)\n                    : undefined,\n                }}\n              >\n                {view}\n              </div>\n            </NavTransitionProvider>\n          </div>\n        );\n      })}\n      <AppRootPortal>\n        {!!popout && <div vkuiClass=\"Root__popout\">{popout}</div>}\n        {!!modal && <div vkuiClass=\"Root__modal\">{modal}</div>}\n      </AppRootPortal>\n    </div>\n  );\n};\n\n// eslint-disable-next-line import/no-default-export\nexport default Root;\n"],"file":"Root.js"}

package/dist/components/ScreenSpinner/ScreenSpinner.js

@@ -28,6 +28,7 @@ var ScreenSpinner = function ScreenSpinner(props) {
 ScreenSpinner.defaultProps = {
   size: "large",
   "aria-label": "Пожалуйста, подождите..."
-};
+}; // eslint-disable-next-line import/no-default-export
+
 export default ScreenSpinner;
 //# sourceMappingURL=ScreenSpinner.js.map

package/dist/components/ScreenSpinner/ScreenSpinner.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/ScreenSpinner/ScreenSpinner.tsx"],"names":["Spinner","PopoutWrapper","getClassName","usePlatform","ScreenSpinner","props","style","className","restProps","platform","defaultProps","size"],"mappings":";;;;AACA,OAAOA,OAAP;AACA,SAASC,aAAT;AACA,SAASC,YAAT;AACA,SAASC,WAAT;;AAMA,IAAMC,aAA2C,GAAG,SAA9CA,aAA8C,CAClDC,KADkD,EAE/C;AACH,MAAQC,KAAR,GAA2CD,KAA3C,CAAQC,KAAR;AAAA,MAAeC,SAAf,GAA2CF,KAA3C,CAAeE,SAAf;AAAA,MAA6BC,SAA7B,4BAA2CH,KAA3C;;AACA,MAAMI,QAAQ,GAAGN,WAAW,EAA5B;AAEA,SACE,oBAAC,aAAD;AACE,IAAA,OAAO,EAAE,KADX;AAEE,IAAA,SAAS,EAAED,YAAY,CAAC,eAAD,EAAkBO,QAAlB,CAFzB;AAGE,IAAA,SAAS,EAAEF,SAHb;AAIE,IAAA,KAAK,EAAED;AAJT,KAME;AAAK,IAAA,SAAS,EAAC;AAAf,KACE,oBAAC,OAAD;AAAS,IAAA,SAAS,EAAC;AAAnB,KAAgDE,SAAhD,EADF,CANF,CADF;AAYD,CAlBD;;AAoBAJ,aAAa,CAACM,YAAd,GAA6B;AAC3BC,EAAAA,IAAI,EAAE,OADqB;AAE3B,gBAAc;AAFa,CAA7B;AAKA,eAAeP,aAAf","sourcesContent":["import * as React from \"react\";\nimport Spinner, { SpinnerProps } from \"../Spinner/Spinner\";\nimport { PopoutWrapper } from \"../PopoutWrapper/PopoutWrapper\";\nimport { getClassName } from \"../../helpers/getClassName\";\nimport { usePlatform } from \"../../hooks/usePlatform\";\nimport \"./ScreenSpinner.css\";\n\nexport type ScreenSpinnerProps = React.HTMLAttributes<HTMLDivElement> &\n  SpinnerProps;\n\nconst ScreenSpinner: React.FC<ScreenSpinnerProps> = (\n  props: ScreenSpinnerProps\n) => {\n  const { style, className, ...restProps } = props;\n  const platform = usePlatform();\n\n  return (\n    <PopoutWrapper\n      hasMask={false}\n      vkuiClass={getClassName(\"ScreenSpinner\", platform)}\n      className={className}\n      style={style}\n    >\n      <div vkuiClass=\"ScreenSpinner__container\">\n        <Spinner vkuiClass=\"ScreenSpinner__spinner\" {...restProps} />\n      </div>\n    </PopoutWrapper>\n  );\n};\n\nScreenSpinner.defaultProps = {\n  size: \"large\",\n  \"aria-label\": \"Пожалуйста, подождите...\",\n};\n\nexport default ScreenSpinner;\n"],"file":"ScreenSpinner.js"}
+{"version":3,"sources":["../../../src/components/ScreenSpinner/ScreenSpinner.tsx"],"names":["Spinner","PopoutWrapper","getClassName","usePlatform","ScreenSpinner","props","style","className","restProps","platform","defaultProps","size"],"mappings":";;;;AACA,OAAOA,OAAP;AACA,SAASC,aAAT;AACA,SAASC,YAAT;AACA,SAASC,WAAT;;AAMA,IAAMC,aAA2C,GAAG,SAA9CA,aAA8C,CAClDC,KADkD,EAE/C;AACH,MAAQC,KAAR,GAA2CD,KAA3C,CAAQC,KAAR;AAAA,MAAeC,SAAf,GAA2CF,KAA3C,CAAeE,SAAf;AAAA,MAA6BC,SAA7B,4BAA2CH,KAA3C;;AACA,MAAMI,QAAQ,GAAGN,WAAW,EAA5B;AAEA,SACE,oBAAC,aAAD;AACE,IAAA,OAAO,EAAE,KADX;AAEE,IAAA,SAAS,EAAED,YAAY,CAAC,eAAD,EAAkBO,QAAlB,CAFzB;AAGE,IAAA,SAAS,EAAEF,SAHb;AAIE,IAAA,KAAK,EAAED;AAJT,KAME;AAAK,IAAA,SAAS,EAAC;AAAf,KACE,oBAAC,OAAD;AAAS,IAAA,SAAS,EAAC;AAAnB,KAAgDE,SAAhD,EADF,CANF,CADF;AAYD,CAlBD;;AAoBAJ,aAAa,CAACM,YAAd,GAA6B;AAC3BC,EAAAA,IAAI,EAAE,OADqB;AAE3B,gBAAc;AAFa,CAA7B,C,CAKA;;AACA,eAAeP,aAAf","sourcesContent":["import * as React from \"react\";\nimport Spinner, { SpinnerProps } from \"../Spinner/Spinner\";\nimport { PopoutWrapper } from \"../PopoutWrapper/PopoutWrapper\";\nimport { getClassName } from \"../../helpers/getClassName\";\nimport { usePlatform } from \"../../hooks/usePlatform\";\nimport \"./ScreenSpinner.css\";\n\nexport type ScreenSpinnerProps = React.HTMLAttributes<HTMLDivElement> &\n  SpinnerProps;\n\nconst ScreenSpinner: React.FC<ScreenSpinnerProps> = (\n  props: ScreenSpinnerProps\n) => {\n  const { style, className, ...restProps } = props;\n  const platform = usePlatform();\n\n  return (\n    <PopoutWrapper\n      hasMask={false}\n      vkuiClass={getClassName(\"ScreenSpinner\", platform)}\n      className={className}\n      style={style}\n    >\n      <div vkuiClass=\"ScreenSpinner__container\">\n        <Spinner vkuiClass=\"ScreenSpinner__spinner\" {...restProps} />\n      </div>\n    </PopoutWrapper>\n  );\n};\n\nScreenSpinner.defaultProps = {\n  size: \"large\",\n  \"aria-label\": \"Пожалуйста, подождите...\",\n};\n\n// eslint-disable-next-line import/no-default-export\nexport default ScreenSpinner;\n"],"file":"ScreenSpinner.js"}

package/dist/components/Search/Search.d.ts

@@ -13,5 +13,5 @@ export interface SearchProps extends React.InputHTMLAttributes<HTMLInputElement>
     onIconClick?: (e: VKUITouchEvent) => void;
     defaultValue?: string;
 }
-declare const _default: React.FC<SearchProps>;
+declare const _default: React.FC<Pick<SearchProps, "max" | "required" | "disabled" | "hidden" | "dir" | "form" | "slot" | "style" | "title" | "pattern" | "color" | "size" | "icon" | "after" | "multiple" | "height" | "translate" | "width" | "prefix" | "src" | "children" | "className" | "id" | "lang" | "min" | "name" | "type" | "role" | "tabIndex" | "crossOrigin" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "list" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "contentEditable" | "contextMenu" | "draggable" | "placeholder" | "spellCheck" | "radioGroup" | "about" | "datatype" | "inlist" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "value" | "alt" | "autoFocus" | "formAction" | "formEncType" | "formMethod" | "formNoValidate" | "formTarget" | "autoComplete" | "accept" | "capture" | "checked" | "maxLength" | "minLength" | "readOnly" | "step" | "getRef" | "before" | "onIconClick">>;
 export default _default;

package/dist/components/Search/Search.js

@@ -55,24 +55,27 @@ var Search = function Search(_ref) {
     inputProps.onBlur && inputProps.onBlur(e);
   };
 
-  var onCancel = function onCancel() {
+  var onCancel = React.useCallback(function () {
+    var _Object$getOwnPropert, _inputRef$current;
+
     // eslint-disable-next-line @typescript-eslint/unbound-method
-    var nativeInputValueSetter = Object.getOwnPropertyDescriptor(HTMLInputElement.prototype, "value").set;
-    nativeInputValueSetter.call(inputRef.current, "");
+    var nativeInputValueSetter = (_Object$getOwnPropert = Object.getOwnPropertyDescriptor(HTMLInputElement.prototype, "value")) === null || _Object$getOwnPropert === void 0 ? void 0 : _Object$getOwnPropert.set;
+    nativeInputValueSetter === null || nativeInputValueSetter === void 0 ? void 0 : nativeInputValueSetter.call(inputRef.current, "");
     var ev2 = new Event("input", {
       bubbles: true
     });
-    inputRef.current.dispatchEvent(ev2);
-  };
-
+    (_inputRef$current = inputRef.current) === null || _inputRef$current === void 0 ? void 0 : _inputRef$current.dispatchEvent(ev2);
+  }, [inputRef]);
   var onIconClickStart = React.useCallback(function (e) {
     return onIconClick(e.originalEvent);
   }, [onIconClick]);
   var onIconCancelClickStart = React.useCallback(function (e) {
+    var _inputRef$current2;
+
     e.originalEvent.preventDefault();
-    inputRef.current.focus();
+    (_inputRef$current2 = inputRef.current) === null || _inputRef$current2 === void 0 ? void 0 : _inputRef$current2.focus();
     onCancel();
-  }, [onCancel]);
+  }, [inputRef, onCancel]);
   return createScopedElement("div", {
     vkuiClass: classNames(getClassName("Search", platform), {
       "Search--focused": isFocused,
@@ -137,6 +140,7 @@ Search.defaultProps = {
   placeholder: "Поиск",
   after: "Отмена",
   before: createScopedElement(Icon16SearchOutline, null)
-};
+}; // eslint-disable-next-line import/no-default-export
+
 export default withPlatform(Search);
 //# sourceMappingURL=Search.js.map

package/dist/components/Search/Search.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/Search/Search.tsx"],"names":["React","classNames","withPlatform","getClassName","Icon16SearchOutline","Icon16Clear","Icon24Cancel","IOS","VKCOM","Touch","noop","Text","Title","Separator","useExternRef","useEnsuredControl","Search","before","className","defaultValue","placeholder","after","getRef","platform","icon","onIconClick","style","inputProps","inputRef","useState","isFocused","setFocused","value","onChange","onFocus","e","onBlur","onCancel","nativeInputValueSetter","Object","getOwnPropertyDescriptor","HTMLInputElement","prototype","set","call","current","ev2","Event","bubbles","dispatchEvent","onIconClickStart","useCallback","originalEvent","onIconCancelClickStart","preventDefault","focus","defaultProps","autoComplete"],"mappings":"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","sourcesContent":["import * as React from \"react\";\nimport { classNames } from \"../../lib/classNames\";\nimport { withPlatform } from \"../../hoc/withPlatform\";\nimport { getClassName } from \"../../helpers/getClassName\";\nimport {\n  Icon16SearchOutline,\n  Icon16Clear,\n  Icon24Cancel,\n} from \"@vkontakte/icons\";\nimport { IOS, VKCOM } from \"../../lib/platform\";\nimport { HasPlatform, HasRef } from \"../../types\";\nimport { Touch, TouchEvent } from \"../Touch/Touch\";\nimport { VKUITouchEvent } from \"../../lib/touch\";\nimport { noop } from \"../../lib/utils\";\nimport Text from \"../Typography/Text/Text\";\nimport Title from \"../Typography/Title/Title\";\nimport Separator from \"../Separator/Separator\";\nimport { useExternRef } from \"../../hooks/useExternRef\";\nimport { useEnsuredControl } from \"../../hooks/useEnsuredControl\";\nimport \"./Search.css\";\n\nexport type InputRef = (element: HTMLInputElement) => void;\n\nexport interface SearchProps\n  extends React.InputHTMLAttributes<HTMLInputElement>,\n    HasRef<HTMLInputElement>,\n    HasPlatform {\n  /**\n   * iOS only. Текст кнопки \"отмена\", которая чистит текстовое поле и убирает фокус.\n   */\n  after?: React.ReactNode;\n  before?: React.ReactNode;\n  icon?: React.ReactNode;\n  onIconClick?: (e: VKUITouchEvent) => void;\n  defaultValue?: string;\n}\n\nconst Search: React.FC<SearchProps> = ({\n  before,\n  className,\n  defaultValue,\n  placeholder,\n  after,\n  getRef,\n  platform,\n  icon,\n  onIconClick = noop,\n  style,\n  ...inputProps\n}) => {\n  const inputRef = useExternRef(getRef);\n  const [isFocused, setFocused] = React.useState(false);\n  const [value, onChange] = useEnsuredControl(inputProps, { defaultValue });\n\n  const onFocus = (e: React.FocusEvent<HTMLInputElement>) => {\n    setFocused(true);\n    inputProps.onFocus && inputProps.onFocus(e);\n  };\n\n  const onBlur = (e: React.FocusEvent<HTMLInputElement>) => {\n    setFocused(false);\n    inputProps.onBlur && inputProps.onBlur(e);\n  };\n\n  const onCancel = () => {\n    // eslint-disable-next-line @typescript-eslint/unbound-method\n    const nativeInputValueSetter = Object.getOwnPropertyDescriptor(\n      HTMLInputElement.prototype,\n      \"value\"\n    ).set;\n    nativeInputValueSetter.call(inputRef.current, \"\");\n\n    const ev2 = new Event(\"input\", { bubbles: true });\n    inputRef.current.dispatchEvent(ev2);\n  };\n\n  const onIconClickStart = React.useCallback(\n    (e: TouchEvent) => onIconClick(e.originalEvent),\n    [onIconClick]\n  );\n\n  const onIconCancelClickStart = React.useCallback(\n    (e: TouchEvent) => {\n      e.originalEvent.preventDefault();\n      inputRef.current.focus();\n      onCancel();\n    },\n    [onCancel]\n  );\n\n  return (\n    <div\n      vkuiClass={classNames(getClassName(\"Search\", platform), {\n        \"Search--focused\": isFocused,\n        \"Search--has-value\": !!value,\n        \"Search--has-after\": !!after,\n        \"Search--has-icon\": !!icon,\n      })}\n      className={className}\n      style={style}\n    >\n      <div vkuiClass=\"Search__in\">\n        <div vkuiClass=\"Search__width\" />\n        <label vkuiClass=\"Search__control\">\n          <input\n            type=\"search\"\n            {...inputProps}\n            ref={inputRef}\n            vkuiClass=\"Search__input\"\n            onFocus={onFocus}\n            onBlur={onBlur}\n            onChange={onChange}\n            value={value}\n          />\n          {platform === IOS && after && (\n            <div vkuiClass=\"Search__after-width\">{after}</div>\n          )}\n          <div vkuiClass=\"Search__placeholder\">\n            <div vkuiClass=\"Search__placeholder-in\">\n              {before}\n              {platform === VKCOM ? (\n                <Text vkuiClass=\"Search__placeholder-text\" weight=\"regular\">\n                  {placeholder}\n                </Text>\n              ) : (\n                <Title\n                  vkuiClass=\"Search__placeholder-text\"\n                  level=\"3\"\n                  weight=\"regular\"\n                >\n                  {placeholder}\n                </Title>\n              )}\n            </div>\n            {isFocused && platform === IOS && after && (\n              <div vkuiClass=\"Search__after-width\">{after}</div>\n            )}\n          </div>\n        </label>\n        <div vkuiClass=\"Search__after\" onClick={onCancel}>\n          <div vkuiClass=\"Search__icons\">\n            {icon && (\n              <Touch onStart={onIconClickStart} vkuiClass=\"Search__icon\">\n                {icon}\n              </Touch>\n            )}\n            {!!value && (\n              <Touch onStart={onIconCancelClickStart} vkuiClass=\"Search__icon\">\n                {platform === IOS ? <Icon16Clear /> : <Icon24Cancel />}\n              </Touch>\n            )}\n          </div>\n          {platform === IOS && after && (\n            <div vkuiClass=\"Search__after-in\">{after}</div>\n          )}\n        </div>\n      </div>\n      {platform === VKCOM && <Separator vkuiClass=\"Search__separator\" wide />}\n    </div>\n  );\n};\n\nSearch.defaultProps = {\n  autoComplete: \"off\",\n  defaultValue: \"\",\n  placeholder: \"Поиск\",\n  after: \"Отмена\",\n  before: <Icon16SearchOutline />,\n};\n\nexport default withPlatform(Search);\n"],"file":"Search.js"}
+{"version":3,"sources":["../../../src/components/Search/Search.tsx"],"names":["React","classNames","withPlatform","getClassName","Icon16SearchOutline","Icon16Clear","Icon24Cancel","IOS","VKCOM","Touch","noop","Text","Title","Separator","useExternRef","useEnsuredControl","Search","before","className","defaultValue","placeholder","after","getRef","platform","icon","onIconClick","style","inputProps","inputRef","useState","isFocused","setFocused","value","onChange","onFocus","e","onBlur","onCancel","useCallback","nativeInputValueSetter","Object","getOwnPropertyDescriptor","HTMLInputElement","prototype","set","call","current","ev2","Event","bubbles","dispatchEvent","onIconClickStart","originalEvent","onIconCancelClickStart","preventDefault","focus","defaultProps","autoComplete"],"mappings":"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","sourcesContent":["import * as React from \"react\";\nimport { classNames } from \"../../lib/classNames\";\nimport { withPlatform } from \"../../hoc/withPlatform\";\nimport { getClassName } from \"../../helpers/getClassName\";\nimport {\n  Icon16SearchOutline,\n  Icon16Clear,\n  Icon24Cancel,\n} from \"@vkontakte/icons\";\nimport { IOS, VKCOM } from \"../../lib/platform\";\nimport { HasPlatform, HasRef } from \"../../types\";\nimport { Touch, TouchEvent } from \"../Touch/Touch\";\nimport { VKUITouchEvent } from \"../../lib/touch\";\nimport { noop } from \"../../lib/utils\";\nimport Text from \"../Typography/Text/Text\";\nimport Title from \"../Typography/Title/Title\";\nimport Separator from \"../Separator/Separator\";\nimport { useExternRef } from \"../../hooks/useExternRef\";\nimport { useEnsuredControl } from \"../../hooks/useEnsuredControl\";\nimport \"./Search.css\";\n\nexport type InputRef = (element: HTMLInputElement) => void;\n\nexport interface SearchProps\n  extends React.InputHTMLAttributes<HTMLInputElement>,\n    HasRef<HTMLInputElement>,\n    HasPlatform {\n  /**\n   * iOS only. Текст кнопки \"отмена\", которая чистит текстовое поле и убирает фокус.\n   */\n  after?: React.ReactNode;\n  before?: React.ReactNode;\n  icon?: React.ReactNode;\n  onIconClick?: (e: VKUITouchEvent) => void;\n  defaultValue?: string;\n}\n\nconst Search: React.FC<SearchProps> = ({\n  before,\n  className,\n  defaultValue,\n  placeholder,\n  after,\n  getRef,\n  platform,\n  icon,\n  onIconClick = noop,\n  style,\n  ...inputProps\n}) => {\n  const inputRef = useExternRef(getRef);\n  const [isFocused, setFocused] = React.useState(false);\n  const [value, onChange] = useEnsuredControl(inputProps, { defaultValue });\n\n  const onFocus = (e: React.FocusEvent<HTMLInputElement>) => {\n    setFocused(true);\n    inputProps.onFocus && inputProps.onFocus(e);\n  };\n\n  const onBlur = (e: React.FocusEvent<HTMLInputElement>) => {\n    setFocused(false);\n    inputProps.onBlur && inputProps.onBlur(e);\n  };\n\n  const onCancel = React.useCallback(() => {\n    // eslint-disable-next-line @typescript-eslint/unbound-method\n    const nativeInputValueSetter = Object.getOwnPropertyDescriptor(\n      HTMLInputElement.prototype,\n      \"value\"\n    )?.set;\n    nativeInputValueSetter?.call(inputRef.current, \"\");\n\n    const ev2 = new Event(\"input\", { bubbles: true });\n    inputRef.current?.dispatchEvent(ev2);\n  }, [inputRef]);\n\n  const onIconClickStart = React.useCallback(\n    (e: TouchEvent) => onIconClick(e.originalEvent),\n    [onIconClick]\n  );\n\n  const onIconCancelClickStart = React.useCallback(\n    (e: TouchEvent) => {\n      e.originalEvent.preventDefault();\n      inputRef.current?.focus();\n      onCancel();\n    },\n    [inputRef, onCancel]\n  );\n\n  return (\n    <div\n      vkuiClass={classNames(getClassName(\"Search\", platform), {\n        \"Search--focused\": isFocused,\n        \"Search--has-value\": !!value,\n        \"Search--has-after\": !!after,\n        \"Search--has-icon\": !!icon,\n      })}\n      className={className}\n      style={style}\n    >\n      <div vkuiClass=\"Search__in\">\n        <div vkuiClass=\"Search__width\" />\n        <label vkuiClass=\"Search__control\">\n          <input\n            type=\"search\"\n            {...inputProps}\n            ref={inputRef}\n            vkuiClass=\"Search__input\"\n            onFocus={onFocus}\n            onBlur={onBlur}\n            onChange={onChange}\n            value={value}\n          />\n          {platform === IOS && after && (\n            <div vkuiClass=\"Search__after-width\">{after}</div>\n          )}\n          <div vkuiClass=\"Search__placeholder\">\n            <div vkuiClass=\"Search__placeholder-in\">\n              {before}\n              {platform === VKCOM ? (\n                <Text vkuiClass=\"Search__placeholder-text\" weight=\"regular\">\n                  {placeholder}\n                </Text>\n              ) : (\n                <Title\n                  vkuiClass=\"Search__placeholder-text\"\n                  level=\"3\"\n                  weight=\"regular\"\n                >\n                  {placeholder}\n                </Title>\n              )}\n            </div>\n            {isFocused && platform === IOS && after && (\n              <div vkuiClass=\"Search__after-width\">{after}</div>\n            )}\n          </div>\n        </label>\n        <div vkuiClass=\"Search__after\" onClick={onCancel}>\n          <div vkuiClass=\"Search__icons\">\n            {icon && (\n              <Touch onStart={onIconClickStart} vkuiClass=\"Search__icon\">\n                {icon}\n              </Touch>\n            )}\n            {!!value && (\n              <Touch onStart={onIconCancelClickStart} vkuiClass=\"Search__icon\">\n                {platform === IOS ? <Icon16Clear /> : <Icon24Cancel />}\n              </Touch>\n            )}\n          </div>\n          {platform === IOS && after && (\n            <div vkuiClass=\"Search__after-in\">{after}</div>\n          )}\n        </div>\n      </div>\n      {platform === VKCOM && <Separator vkuiClass=\"Search__separator\" wide />}\n    </div>\n  );\n};\n\nSearch.defaultProps = {\n  autoComplete: \"off\",\n  defaultValue: \"\",\n  placeholder: \"Поиск\",\n  after: \"Отмена\",\n  before: <Icon16SearchOutline />,\n};\n\n// eslint-disable-next-line import/no-default-export\nexport default withPlatform(Search);\n"],"file":"Search.js"}