@vkontakte/vkui 5.2.3 → 5.3.0

package/dist/cjs/components/Checkbox/Checkbox.js.map

@@ -1 +1 @@
-{"version":3,"file":"Checkbox.js","names":["sizeYClassNames","none","SizeType","COMPACT","REGULAR","warn","warnOnce","Checkbox","children","className","style","getRootRef","getRef","description","indeterminate","defaultIndeterminate","hoverMode","activeMode","hasHover","hasActive","focusVisibleMode","onChange","restProps","inputRef","useExternRef","platform","usePlatform","useAdaptivity","sizeY","useAdaptivityConditionalRender","adaptiveSizeY","React","useEffect","indeterminateValue","undefined","current","Boolean","handleChange","useCallback","event","checked","process","env","NODE_ENV","defaultChecked","classNames","Platform","VKCOM","hasReactNode","disabled","IOS","ACTIVE_EFFECT_DELAY","compact","regular"],"sources":["../../../../src/components/Checkbox/Checkbox.tsx"],"sourcesContent":["import * as React from 'react';\nimport {\n  Icon20CheckBoxIndetermanate,\n  Icon20CheckBoxOff,\n  Icon20CheckBoxOn,\n  Icon24CheckBoxOff,\n  Icon24CheckBoxOn,\n} from '@vkontakte/icons';\nimport { classNames, hasReactNode } from '@vkontakte/vkjs';\nimport { useAdaptivity } from '../../hooks/useAdaptivity';\nimport { useAdaptivityConditionalRender } from '../../hooks/useAdaptivityConditionalRender';\nimport { useExternRef } from '../../hooks/useExternRef';\nimport { usePlatform } from '../../hooks/usePlatform';\nimport { SizeType } from '../../lib/adaptivity';\nimport { Platform } from '../../lib/platform';\nimport { warnOnce } from '../../lib/warnOnce';\nimport { HasRef, HasRootRef } from '../../types';\nimport { ACTIVE_EFFECT_DELAY, Tappable, type TappableProps } from '../Tappable/Tappable';\nimport { Footnote } from '../Typography/Footnote/Footnote';\nimport { VisuallyHiddenInput } from '../VisuallyHiddenInput/VisuallyHiddenInput';\nimport styles from './Checkbox.module.css';\n\nconst sizeYClassNames = {\n  none: styles['Checkbox--sizeY-none'],\n  [SizeType.COMPACT]: styles['Checkbox--sizeY-compact'],\n  [SizeType.REGULAR]: styles['Checkbox--sizeY-regular'],\n};\n\nexport interface CheckboxProps\n  extends React.InputHTMLAttributes<HTMLInputElement>,\n    HasRootRef<HTMLLabelElement>,\n    HasRef<HTMLInputElement>,\n    Pick<\n      TappableProps,\n      'hoverMode' | 'activeMode' | 'hasHover' | 'hasActive' | 'focusVisibleMode'\n    > {\n  description?: React.ReactNode;\n  indeterminate?: boolean;\n  defaultIndeterminate?: boolean;\n}\n\nconst warn = warnOnce('Checkbox');\n\n/**\n * @see https://vkcom.github.io/VKUI/#/Checkbox\n */\nexport const Checkbox = ({\n  children,\n  className,\n  style,\n  getRootRef,\n  getRef,\n  description,\n  indeterminate,\n  defaultIndeterminate,\n  hoverMode,\n  activeMode,\n  hasHover,\n  hasActive,\n  focusVisibleMode,\n  onChange,\n  ...restProps\n}: CheckboxProps) => {\n  const inputRef = useExternRef(getRef);\n  const platform = usePlatform();\n  const { sizeY = 'none' } = useAdaptivity();\n  const { sizeY: adaptiveSizeY } = useAdaptivityConditionalRender();\n\n  React.useEffect(() => {\n    const indeterminateValue = indeterminate === undefined ? defaultIndeterminate : indeterminate;\n\n    if (inputRef.current) {\n      inputRef.current.indeterminate = Boolean(indeterminateValue);\n    }\n  }, [defaultIndeterminate, indeterminate, inputRef]);\n\n  const handleChange: CheckboxProps['onChange'] = React.useCallback(\n    (event: React.ChangeEvent<HTMLInputElement>) => {\n      if (\n        defaultIndeterminate !== undefined &&\n        indeterminate === undefined &&\n        restProps.checked === undefined &&\n        inputRef.current\n      ) {\n        inputRef.current.indeterminate = false;\n      }\n      if (indeterminate !== undefined && inputRef.current) {\n        inputRef.current.indeterminate = indeterminate;\n      }\n      onChange && onChange(event);\n    },\n    [defaultIndeterminate, indeterminate, restProps.checked, onChange, inputRef],\n  );\n\n  if (process.env.NODE_ENV === 'development') {\n    if (defaultIndeterminate && restProps.defaultChecked) {\n      warn('defaultIndeterminate и defaultChecked не могут быть true одновременно', 'error');\n    }\n\n    if (indeterminate && restProps.checked) {\n      warn('indeterminate и checked не могут быть true одновременно', 'error');\n    }\n\n    if (restProps.defaultChecked && restProps.checked) {\n      warn('defaultChecked и checked не могут быть true одновременно', 'error');\n    }\n  }\n\n  return (\n    <Tappable\n      Component=\"label\"\n      className={classNames(\n        styles['Checkbox'],\n        platform === Platform.VKCOM && styles['Checkbox--vkcom'],\n        sizeYClassNames[sizeY],\n        !(hasReactNode(children) || hasReactNode(description)) && styles['Checkbox--simple'],\n        className,\n      )}\n      style={style}\n      disabled={restProps.disabled}\n      activeEffectDelay={platform === Platform.IOS ? 100 : ACTIVE_EFFECT_DELAY}\n      getRootRef={getRootRef}\n      hoverMode={hoverMode}\n      activeMode={activeMode}\n      hasHover={hasHover}\n      hasActive={hasActive}\n      focusVisibleMode={focusVisibleMode}\n    >\n      <VisuallyHiddenInput\n        {...restProps}\n        onChange={handleChange}\n        type=\"checkbox\"\n        className={styles['Checkbox__input']}\n        getRef={inputRef}\n      />\n      <div className={classNames(styles['Checkbox__icon'], styles['Checkbox__icon--on'])}>\n        {platform === Platform.VKCOM ? (\n          <Icon20CheckBoxOn />\n        ) : (\n          <React.Fragment>\n            {adaptiveSizeY.compact && (\n              <Icon20CheckBoxOn className={adaptiveSizeY.compact.className} />\n            )}\n            {adaptiveSizeY.regular && (\n              <Icon24CheckBoxOn className={adaptiveSizeY.regular.className} />\n            )}\n          </React.Fragment>\n        )}\n      </div>\n      <div className={classNames(styles['Checkbox__icon'], styles['Checkbox__icon--off'])}>\n        {platform === Platform.VKCOM ? (\n          <Icon20CheckBoxOff />\n        ) : (\n          <React.Fragment>\n            {adaptiveSizeY.compact && (\n              <Icon20CheckBoxOff className={adaptiveSizeY.compact.className} />\n            )}\n            {adaptiveSizeY.regular && (\n              <Icon24CheckBoxOff className={adaptiveSizeY.regular.className} />\n            )}\n          </React.Fragment>\n        )}\n      </div>\n      <div\n        className={classNames(styles['Checkbox__icon'], styles['Checkbox__icon--indeterminate'])}\n      >\n        {platform === Platform.VKCOM ? (\n          <Icon20CheckBoxIndetermanate width={20} height={20} />\n        ) : (\n          <React.Fragment>\n            {adaptiveSizeY.compact && (\n              <Icon20CheckBoxIndetermanate\n                className={adaptiveSizeY.compact.className}\n                width={20}\n                height={20}\n              />\n            )}\n            {adaptiveSizeY.regular && (\n              <Icon20CheckBoxIndetermanate\n                className={adaptiveSizeY.regular.className}\n                width={24}\n                height={24}\n              />\n            )}\n          </React.Fragment>\n        )}\n      </div>\n      <div className={styles['Checkbox__content']}>\n        <div className={styles['Checkbox__children']}>{children}</div>\n        {hasReactNode(description) && (\n          <Footnote className={styles['Checkbox__description']}>{description}</Footnote>\n        )}\n      </div>\n    </Tappable>\n  );\n};\n"],"mappings":"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"}
+{"version":3,"sources":["../../../../src/components/Checkbox/Checkbox.tsx"],"sourcesContent":["import * as React from 'react';\nimport {\n  Icon20CheckBoxIndetermanate,\n  Icon20CheckBoxOff,\n  Icon20CheckBoxOn,\n  Icon24CheckBoxOff,\n  Icon24CheckBoxOn,\n} from '@vkontakte/icons';\nimport { classNames, hasReactNode } from '@vkontakte/vkjs';\nimport { useAdaptivity } from '../../hooks/useAdaptivity';\nimport { useAdaptivityConditionalRender } from '../../hooks/useAdaptivityConditionalRender';\nimport { useExternRef } from '../../hooks/useExternRef';\nimport { usePlatform } from '../../hooks/usePlatform';\nimport { SizeType } from '../../lib/adaptivity';\nimport { Platform } from '../../lib/platform';\nimport { warnOnce } from '../../lib/warnOnce';\nimport { HasRef, HasRootRef } from '../../types';\nimport { ACTIVE_EFFECT_DELAY, Tappable, type TappableProps } from '../Tappable/Tappable';\nimport { Footnote } from '../Typography/Footnote/Footnote';\nimport { VisuallyHiddenInput } from '../VisuallyHiddenInput/VisuallyHiddenInput';\nimport styles from './Checkbox.module.css';\n\nconst sizeYClassNames = {\n  none: styles['Checkbox--sizeY-none'],\n  [SizeType.COMPACT]: styles['Checkbox--sizeY-compact'],\n  [SizeType.REGULAR]: styles['Checkbox--sizeY-regular'],\n};\n\nexport interface CheckboxProps\n  extends React.InputHTMLAttributes<HTMLInputElement>,\n    HasRootRef<HTMLLabelElement>,\n    HasRef<HTMLInputElement>,\n    Pick<\n      TappableProps,\n      'hoverMode' | 'activeMode' | 'hasHover' | 'hasActive' | 'focusVisibleMode'\n    > {\n  description?: React.ReactNode;\n  indeterminate?: boolean;\n  defaultIndeterminate?: boolean;\n}\n\nconst warn = warnOnce('Checkbox');\n\n/**\n * @see https://vkcom.github.io/VKUI/#/Checkbox\n */\nexport const Checkbox = ({\n  children,\n  className,\n  style,\n  getRootRef,\n  getRef,\n  description,\n  indeterminate,\n  defaultIndeterminate,\n  hoverMode,\n  activeMode,\n  hasHover,\n  hasActive,\n  focusVisibleMode,\n  onChange,\n  ...restProps\n}: CheckboxProps) => {\n  const inputRef = useExternRef(getRef);\n  const platform = usePlatform();\n  const { sizeY = 'none' } = useAdaptivity();\n  const { sizeY: adaptiveSizeY } = useAdaptivityConditionalRender();\n\n  React.useEffect(() => {\n    const indeterminateValue = indeterminate === undefined ? defaultIndeterminate : indeterminate;\n\n    if (inputRef.current) {\n      inputRef.current.indeterminate = Boolean(indeterminateValue);\n    }\n  }, [defaultIndeterminate, indeterminate, inputRef]);\n\n  const handleChange: CheckboxProps['onChange'] = React.useCallback(\n    (event: React.ChangeEvent<HTMLInputElement>) => {\n      if (\n        defaultIndeterminate !== undefined &&\n        indeterminate === undefined &&\n        restProps.checked === undefined &&\n        inputRef.current\n      ) {\n        inputRef.current.indeterminate = false;\n      }\n      if (indeterminate !== undefined && inputRef.current) {\n        inputRef.current.indeterminate = indeterminate;\n      }\n      onChange && onChange(event);\n    },\n    [defaultIndeterminate, indeterminate, restProps.checked, onChange, inputRef],\n  );\n\n  if (process.env.NODE_ENV === 'development') {\n    if (defaultIndeterminate && restProps.defaultChecked) {\n      warn('defaultIndeterminate и defaultChecked не могут быть true одновременно', 'error');\n    }\n\n    if (indeterminate && restProps.checked) {\n      warn('indeterminate и checked не могут быть true одновременно', 'error');\n    }\n\n    if (restProps.defaultChecked && restProps.checked) {\n      warn('defaultChecked и checked не могут быть true одновременно', 'error');\n    }\n  }\n\n  return (\n    <Tappable\n      Component=\"label\"\n      className={classNames(\n        styles['Checkbox'],\n        platform === Platform.VKCOM && styles['Checkbox--vkcom'],\n        sizeYClassNames[sizeY],\n        !(hasReactNode(children) || hasReactNode(description)) && styles['Checkbox--simple'],\n        className,\n      )}\n      style={style}\n      disabled={restProps.disabled}\n      activeEffectDelay={platform === Platform.IOS ? 100 : ACTIVE_EFFECT_DELAY}\n      getRootRef={getRootRef}\n      hoverMode={hoverMode}\n      activeMode={activeMode}\n      hasHover={hasHover}\n      hasActive={hasActive}\n      focusVisibleMode={focusVisibleMode}\n    >\n      <VisuallyHiddenInput\n        {...restProps}\n        onChange={handleChange}\n        type=\"checkbox\"\n        className={styles['Checkbox__input']}\n        getRef={inputRef}\n      />\n      <div className={classNames(styles['Checkbox__icon'], styles['Checkbox__icon--on'])}>\n        {platform === Platform.VKCOM ? (\n          <Icon20CheckBoxOn />\n        ) : (\n          <React.Fragment>\n            {adaptiveSizeY.compact && (\n              <Icon20CheckBoxOn className={adaptiveSizeY.compact.className} />\n            )}\n            {adaptiveSizeY.regular && (\n              <Icon24CheckBoxOn className={adaptiveSizeY.regular.className} />\n            )}\n          </React.Fragment>\n        )}\n      </div>\n      <div className={classNames(styles['Checkbox__icon'], styles['Checkbox__icon--off'])}>\n        {platform === Platform.VKCOM ? (\n          <Icon20CheckBoxOff />\n        ) : (\n          <React.Fragment>\n            {adaptiveSizeY.compact && (\n              <Icon20CheckBoxOff className={adaptiveSizeY.compact.className} />\n            )}\n            {adaptiveSizeY.regular && (\n              <Icon24CheckBoxOff className={adaptiveSizeY.regular.className} />\n            )}\n          </React.Fragment>\n        )}\n      </div>\n      <div\n        className={classNames(styles['Checkbox__icon'], styles['Checkbox__icon--indeterminate'])}\n      >\n        {platform === Platform.VKCOM ? (\n          <Icon20CheckBoxIndetermanate width={20} height={20} />\n        ) : (\n          <React.Fragment>\n            {adaptiveSizeY.compact && (\n              <Icon20CheckBoxIndetermanate\n                className={adaptiveSizeY.compact.className}\n                width={20}\n                height={20}\n              />\n            )}\n            {adaptiveSizeY.regular && (\n              <Icon20CheckBoxIndetermanate\n                className={adaptiveSizeY.regular.className}\n                width={24}\n                height={24}\n              />\n            )}\n          </React.Fragment>\n        )}\n      </div>\n      <div className={styles['Checkbox__content']}>\n        <div className={styles['Checkbox__children']}>{children}</div>\n        {hasReactNode(description) && (\n          <Footnote className={styles['Checkbox__description']}>{description}</Footnote>\n        )}\n      </div>\n    </Tappable>\n  );\n};\n"],"names":["Checkbox","sizeYClassNames","none","SizeType","COMPACT","REGULAR","warn","warnOnce","children","className","style","getRootRef","getRef","description","indeterminate","defaultIndeterminate","hoverMode","activeMode","hasHover","hasActive","focusVisibleMode","onChange","restProps","inputRef","useExternRef","platform","usePlatform","useAdaptivity","sizeY","useAdaptivityConditionalRender","adaptiveSizeY","React","useEffect","indeterminateValue","undefined","current","Boolean","handleChange","useCallback","event","checked","process","env","NODE_ENV","defaultChecked","Tappable","Component","classNames","Platform","VKCOM","hasReactNode","disabled","activeEffectDelay","IOS","ACTIVE_EFFECT_DELAY","VisuallyHiddenInput","type","div","Icon20CheckBoxOn","Fragment","compact","regular","Icon24CheckBoxOn","Icon20CheckBoxOff","Icon24CheckBoxOff","Icon20CheckBoxIndetermanate","width","height","Footnote"],"mappings":"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"}

package/dist/cjs/components/Chip/Chip.d.ts

@@ -1,5 +1,5 @@
 import * as React from 'react';
-export declare type ChipValue = string | number;
+export type ChipValue = string | number;
 export interface ChipOption {
     value?: ChipValue;
     label?: string;

package/dist/cjs/components/Chip/Chip.js

@@ -1,75 +1,71 @@
 "use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
-var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
 Object.defineProperty(exports, "__esModule", {
-  value: true
+    value: true
+});
+Object.defineProperty(exports, "Chip", {
+    enumerable: true,
+    get: function() {
+        return Chip;
+    }
 });
-exports.Chip = void 0;
-var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
-var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
-var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
-var React = _interopRequireWildcard(require("react"));
+var _defineProperty = require("@swc/helpers/lib/_define_property.js").default;
+var _interopRequireWildcard = require("@swc/helpers/lib/_interop_require_wildcard.js").default;
+var _objectSpread = require("@swc/helpers/lib/_object_spread.js").default;
+var _objectWithoutProperties = require("@swc/helpers/lib/_object_without_properties.js").default;
+var _react = /*#__PURE__*/ _interopRequireWildcard(require("react"));
 var _icons = require("@vkontakte/icons");
 var _vkjs = require("@vkontakte/vkjs");
-var _useAdaptivity2 = require("../../hooks/useAdaptivity");
+var _useAdaptivity = require("../../hooks/useAdaptivity");
 var _adaptivity = require("../../lib/adaptivity");
 var _utils = require("../../lib/utils");
-var _Tappable = require("../Tappable/Tappable");
-var _Footnote = require("../Typography/Footnote/Footnote");
-var _excluded = ["value", "option", "removable", "onRemove", "removeAriaLabel", "before", "after", "children", "className"];
-var sizeYClassNames = (0, _defineProperty2.default)({
-  none: "vkuiChip--sizeY-none"
+var _tappable = require("../Tappable/Tappable");
+var _footnote = require("../Typography/Footnote/Footnote");
+var sizeYClassNames = _defineProperty({
+    none: "vkuiChip--sizeY-none"
 }, _adaptivity.SizeType.COMPACT, "vkuiChip--sizeY-compact");
-/**
- * @see https://vkcom.github.io/VKUI/#/Chip
- */
-var Chip = function Chip(_ref) {
-  var _ref$value = _ref.value,
-    value = _ref$value === void 0 ? '' : _ref$value,
-    option = _ref.option,
-    _ref$removable = _ref.removable,
-    removable = _ref$removable === void 0 ? true : _ref$removable,
-    _ref$onRemove = _ref.onRemove,
-    onRemove = _ref$onRemove === void 0 ? _vkjs.noop : _ref$onRemove,
-    _ref$removeAriaLabel = _ref.removeAriaLabel,
-    removeAriaLabel = _ref$removeAriaLabel === void 0 ? 'Удалить' : _ref$removeAriaLabel,
-    _ref$before = _ref.before,
-    before = _ref$before === void 0 ? null : _ref$before,
-    after = _ref.after,
-    children = _ref.children,
-    className = _ref.className,
-    restProps = (0, _objectWithoutProperties2.default)(_ref, _excluded);
-  var _useAdaptivity = (0, _useAdaptivity2.useAdaptivity)(),
-    _useAdaptivity$sizeY = _useAdaptivity.sizeY,
-    sizeY = _useAdaptivity$sizeY === void 0 ? 'none' : _useAdaptivity$sizeY;
-  var onRemoveWrapper = React.useCallback(function (event) {
-    onRemove(event, value);
-  }, [onRemove, value]);
-  var title = (0, _utils.getTitleFromChildren)(children);
-  return /*#__PURE__*/React.createElement("div", (0, _extends2.default)({
-    className: (0, _vkjs.classNames)("vkuiChip", sizeY !== _adaptivity.SizeType.REGULAR && sizeYClassNames[sizeY], removable && "vkuiChip--removable", className),
-    role: "option",
-    "aria-label": title
-  }, restProps), /*#__PURE__*/React.createElement("div", {
-    className: "vkuiChip__in",
-    role: "presentation"
-  }, (0, _vkjs.hasReactNode)(before) && /*#__PURE__*/React.createElement("div", {
-    className: "vkuiChip__before"
-  }, before), /*#__PURE__*/React.createElement(_Footnote.Footnote, {
-    className: "vkuiChip__content",
-    title: title,
-    "aria-hidden": true
-  }, children), (0, _vkjs.hasReactNode)(after) && /*#__PURE__*/React.createElement("div", {
-    className: "vkuiChip__after"
-  }, after), removable && /*#__PURE__*/React.createElement(_Tappable.Tappable, {
-    Component: "button",
-    className: "vkuiChip__remove",
-    onClick: onRemoveWrapper,
-    hasHover: false,
-    hasActive: false,
-    "aria-label": "".concat(removeAriaLabel, " ").concat(title)
-  }, /*#__PURE__*/React.createElement(_icons.Icon16Cancel, null))));
+var Chip = function(_param) {
+    var _param_value = _param.value, value = _param_value === void 0 ? "" : _param_value, option = _param.option, _param_removable = _param.removable, removable = _param_removable === void 0 ? true : _param_removable, _param_onRemove = _param.onRemove, onRemove = _param_onRemove === void 0 ? _vkjs.noop : _param_onRemove, _param_removeAriaLabel = _param.removeAriaLabel, removeAriaLabel = _param_removeAriaLabel === void 0 ? "Удалить" : _param_removeAriaLabel, _param_before = _param.before, before = _param_before === void 0 ? null : _param_before, after = _param.after, children = _param.children, className = _param.className, restProps = _objectWithoutProperties(_param, [
+        "value",
+        "option",
+        "removable",
+        "onRemove",
+        "removeAriaLabel",
+        "before",
+        "after",
+        "children",
+        "className"
+    ]);
+    var _useAdaptivity1 = (0, _useAdaptivity.useAdaptivity)(), _useAdaptivity_sizeY = _useAdaptivity1.sizeY, sizeY = _useAdaptivity_sizeY === void 0 ? "none" : _useAdaptivity_sizeY;
+    var onRemoveWrapper = _react.useCallback(function(event) {
+        onRemove(event, value);
+    }, [
+        onRemove,
+        value
+    ]);
+    var title = (0, _utils.getTitleFromChildren)(children);
+    return /*#__PURE__*/ _react.createElement("div", _objectSpread({
+        className: (0, _vkjs.classNames)("vkuiChip", sizeY !== _adaptivity.SizeType.REGULAR && sizeYClassNames[sizeY], removable && "vkuiChip--removable", className),
+        role: "option",
+        "aria-label": title
+    }, restProps), /*#__PURE__*/ _react.createElement("div", {
+        className: "vkuiChip__in",
+        role: "presentation"
+    }, (0, _vkjs.hasReactNode)(before) && /*#__PURE__*/ _react.createElement("div", {
+        className: "vkuiChip__before"
+    }, before), /*#__PURE__*/ _react.createElement(_footnote.Footnote, {
+        className: "vkuiChip__content",
+        title: title,
+        "aria-hidden": true
+    }, children), (0, _vkjs.hasReactNode)(after) && /*#__PURE__*/ _react.createElement("div", {
+        className: "vkuiChip__after"
+    }, after), removable && /*#__PURE__*/ _react.createElement(_tappable.Tappable, {
+        Component: "button",
+        className: "vkuiChip__remove",
+        onClick: onRemoveWrapper,
+        hasHover: false,
+        hasActive: false,
+        "aria-label": "".concat(removeAriaLabel, " ").concat(title)
+    }, /*#__PURE__*/ _react.createElement(_icons.Icon16Cancel, null))));
 };
-exports.Chip = Chip;
+
 //# sourceMappingURL=Chip.js.map

package/dist/cjs/components/Chip/Chip.js.map

@@ -1 +1 @@
-{"version":3,"file":"Chip.js","names":["sizeYClassNames","none","SizeType","COMPACT","Chip","value","option","removable","onRemove","noop","removeAriaLabel","before","after","children","className","restProps","useAdaptivity","sizeY","onRemoveWrapper","React","useCallback","event","title","getTitleFromChildren","classNames","REGULAR","hasReactNode"],"sources":["../../../../src/components/Chip/Chip.tsx"],"sourcesContent":["import * as React from 'react';\nimport { Icon16Cancel } from '@vkontakte/icons';\nimport { classNames, hasReactNode, noop } from '@vkontakte/vkjs';\nimport { useAdaptivity } from '../../hooks/useAdaptivity';\nimport { SizeType } from '../../lib/adaptivity';\nimport { getTitleFromChildren } from '../../lib/utils';\nimport { Tappable } from '../Tappable/Tappable';\nimport { Footnote } from '../Typography/Footnote/Footnote';\nimport styles from './Chip.module.css';\n\nconst sizeYClassNames = {\n  none: styles['Chip--sizeY-none'],\n  [SizeType.COMPACT]: styles['Chip--sizeY-compact'],\n};\n\nexport type ChipValue = string | number;\n\nexport interface ChipOption {\n  value?: ChipValue;\n  label?: string;\n  [otherProp: string]: any;\n}\n\nexport interface ChipProps extends React.HTMLAttributes<HTMLDivElement> {\n  value: ChipValue;\n  option?: ChipOption;\n  onRemove?: (event?: React.MouseEvent, value?: ChipValue) => void;\n  removable?: boolean;\n  removeAriaLabel?: string;\n  before?: React.ReactNode;\n  after?: React.ReactNode;\n}\n\nexport interface RenderChip<T extends ChipOption> extends ChipProps {\n  label: string;\n  option: T;\n  disabled: boolean;\n}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/Chip\n */\nexport const Chip = ({\n  value = '',\n  option,\n  removable = true,\n  onRemove = noop,\n  removeAriaLabel = 'Удалить',\n  before = null,\n  after,\n  children,\n  className,\n  ...restProps\n}: ChipProps) => {\n  const { sizeY = 'none' } = useAdaptivity();\n  const onRemoveWrapper = React.useCallback(\n    (event: React.MouseEvent) => {\n      onRemove(event, value);\n    },\n    [onRemove, value],\n  );\n  const title = getTitleFromChildren(children);\n\n  return (\n    <div\n      className={classNames(\n        styles['Chip'],\n        sizeY !== SizeType.REGULAR && sizeYClassNames[sizeY],\n        removable && styles['Chip--removable'],\n        className,\n      )}\n      role=\"option\"\n      aria-label={title}\n      {...restProps}\n    >\n      <div className={styles['Chip__in']} role=\"presentation\">\n        {hasReactNode(before) && <div className={styles['Chip__before']}>{before}</div>}\n        <Footnote className={styles['Chip__content']} title={title} aria-hidden>\n          {children}\n        </Footnote>\n        {hasReactNode(after) && <div className={styles['Chip__after']}>{after}</div>}\n\n        {removable && (\n          <Tappable\n            Component=\"button\"\n            className={styles['Chip__remove']}\n            onClick={onRemoveWrapper}\n            hasHover={false}\n            hasActive={false}\n            aria-label={`${removeAriaLabel} ${title}`}\n          >\n            <Icon16Cancel />\n          </Tappable>\n        )}\n      </div>\n    </div>\n  );\n};\n"],"mappings":";;;;;;;;;;;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAA2D;AAG3D,IAAMA,eAAe;EACnBC,IAAI;AAA4B,GAC/BC,oBAAQ,CAACC,OAAO,4BAClB;AA0BD;AACA;AACA;AACO,IAAMC,IAAI,GAAG,SAAPA,IAAI,OAWA;EAAA,sBAVfC,KAAK;IAALA,KAAK,2BAAG,EAAE;IACVC,MAAM,QAANA,MAAM;IAAA,sBACNC,SAAS;IAATA,SAAS,+BAAG,IAAI;IAAA,qBAChBC,QAAQ;IAARA,QAAQ,8BAAGC,UAAI;IAAA,4BACfC,eAAe;IAAfA,eAAe,qCAAG,SAAS;IAAA,mBAC3BC,MAAM;IAANA,MAAM,4BAAG,IAAI;IACbC,KAAK,QAALA,KAAK;IACLC,QAAQ,QAARA,QAAQ;IACRC,SAAS,QAATA,SAAS;IACNC,SAAS;EAEZ,qBAA2B,IAAAC,6BAAa,GAAE;IAAA,sCAAlCC,KAAK;IAALA,KAAK,qCAAG,MAAM;EACtB,IAAMC,eAAe,GAAGC,KAAK,CAACC,WAAW,CACvC,UAACC,KAAuB,EAAK;IAC3Bb,QAAQ,CAACa,KAAK,EAAEhB,KAAK,CAAC;EACxB,CAAC,EACD,CAACG,QAAQ,EAAEH,KAAK,CAAC,CAClB;EACD,IAAMiB,KAAK,GAAG,IAAAC,2BAAoB,EAACV,QAAQ,CAAC;EAE5C,oBACE;IACE,SAAS,EAAE,IAAAW,gBAAU,cAEnBP,KAAK,KAAKf,oBAAQ,CAACuB,OAAO,IAAIzB,eAAe,CAACiB,KAAK,CAAC,EACpDV,SAAS,yBAA6B,EACtCO,SAAS,CACT;IACF,IAAI,EAAC,QAAQ;IACb,cAAYQ;EAAM,GACdP,SAAS,gBAEb;IAAK,SAAS,gBAAqB;IAAC,IAAI,EAAC;EAAc,GACpD,IAAAW,kBAAY,EAACf,MAAM,CAAC,iBAAI;IAAK,SAAS;EAAyB,GAAEA,MAAM,CAAO,eAC/E,oBAAC,kBAAQ;IAAC,SAAS,qBAA0B;IAAC,KAAK,EAAEW,KAAM;IAAC;EAAW,GACpET,QAAQ,CACA,EACV,IAAAa,kBAAY,EAACd,KAAK,CAAC,iBAAI;IAAK,SAAS;EAAwB,GAAEA,KAAK,CAAO,EAE3EL,SAAS,iBACR,oBAAC,kBAAQ;IACP,SAAS,EAAC,QAAQ;IAClB,SAAS,oBAAyB;IAClC,OAAO,EAAEW,eAAgB;IACzB,QAAQ,EAAE,KAAM;IAChB,SAAS,EAAE,KAAM;IACjB,wBAAeR,eAAe,cAAIY,KAAK;EAAG,gBAE1C,oBAAC,mBAAY,OAAG,CAEnB,CACG,CACF;AAEV,CAAC;AAAC"}
+{"version":3,"sources":["../../../../src/components/Chip/Chip.tsx"],"sourcesContent":["import * as React from 'react';\nimport { Icon16Cancel } from '@vkontakte/icons';\nimport { classNames, hasReactNode, noop } from '@vkontakte/vkjs';\nimport { useAdaptivity } from '../../hooks/useAdaptivity';\nimport { SizeType } from '../../lib/adaptivity';\nimport { getTitleFromChildren } from '../../lib/utils';\nimport { Tappable } from '../Tappable/Tappable';\nimport { Footnote } from '../Typography/Footnote/Footnote';\nimport styles from './Chip.module.css';\n\nconst sizeYClassNames = {\n  none: styles['Chip--sizeY-none'],\n  [SizeType.COMPACT]: styles['Chip--sizeY-compact'],\n};\n\nexport type ChipValue = string | number;\n\nexport interface ChipOption {\n  value?: ChipValue;\n  label?: string;\n  [otherProp: string]: any;\n}\n\nexport interface ChipProps extends React.HTMLAttributes<HTMLDivElement> {\n  value: ChipValue;\n  option?: ChipOption;\n  onRemove?: (event?: React.MouseEvent, value?: ChipValue) => void;\n  removable?: boolean;\n  removeAriaLabel?: string;\n  before?: React.ReactNode;\n  after?: React.ReactNode;\n}\n\nexport interface RenderChip<T extends ChipOption> extends ChipProps {\n  label: string;\n  option: T;\n  disabled: boolean;\n}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/Chip\n */\nexport const Chip = ({\n  value = '',\n  option,\n  removable = true,\n  onRemove = noop,\n  removeAriaLabel = 'Удалить',\n  before = null,\n  after,\n  children,\n  className,\n  ...restProps\n}: ChipProps) => {\n  const { sizeY = 'none' } = useAdaptivity();\n  const onRemoveWrapper = React.useCallback(\n    (event: React.MouseEvent) => {\n      onRemove(event, value);\n    },\n    [onRemove, value],\n  );\n  const title = getTitleFromChildren(children);\n\n  return (\n    <div\n      className={classNames(\n        styles['Chip'],\n        sizeY !== SizeType.REGULAR && sizeYClassNames[sizeY],\n        removable && styles['Chip--removable'],\n        className,\n      )}\n      role=\"option\"\n      aria-label={title}\n      {...restProps}\n    >\n      <div className={styles['Chip__in']} role=\"presentation\">\n        {hasReactNode(before) && <div className={styles['Chip__before']}>{before}</div>}\n        <Footnote className={styles['Chip__content']} title={title} aria-hidden>\n          {children}\n        </Footnote>\n        {hasReactNode(after) && <div className={styles['Chip__after']}>{after}</div>}\n\n        {removable && (\n          <Tappable\n            Component=\"button\"\n            className={styles['Chip__remove']}\n            onClick={onRemoveWrapper}\n            hasHover={false}\n            hasActive={false}\n            aria-label={`${removeAriaLabel} ${title}`}\n          >\n            <Icon16Cancel />\n          </Tappable>\n        )}\n      </div>\n    </div>\n  );\n};\n"],"names":["Chip","sizeYClassNames","none","SizeType","COMPACT","value","option","removable","onRemove","noop","removeAriaLabel","before","after","children","className","restProps","useAdaptivity","sizeY","onRemoveWrapper","React","useCallback","event","title","getTitleFromChildren","div","classNames","REGULAR","role","aria-label","hasReactNode","Footnote","aria-hidden","Tappable","Component","onClick","hasHover","hasActive","Icon16Cancel"],"mappings":";;;;+BA0CaA;;;eAAAA;;;;;;;2DA1CU;qBACM;oBACkB;6BACjB;0BACL;qBACY;wBACZ;wBACA;AAGzB,IAAMC;IACJC,IAAI;GACHC,oBAAQ,CAACC,OAAO;AA8BZ,IAAMJ,OAAO,iBAWH;8BAVfK,OAAAA,kCAAQ,mBACRC,gBAAAA,kCACAC,WAAAA,0CAAY,IAAI,8CAChBC,UAAAA,wCAAWC,UAAI,oDACfC,iBAAAA,sDAAkB,2DAClBC,QAAAA,oCAAS,IAAI,kBACbC,eAAAA,OACAC,kBAAAA,UACAC,mBAAAA,WACGC;QATHV;QACAC;QACAC;QACAC;QACAE;QACAC;QACAC;QACAC;QACAC;;IAGA,IAA2BE,kBAAAA,IAAAA,4BAAa,4BAAbA,gBAAnBC,OAAAA,0CAAQ;IAChB,IAAMC,kBAAkBC,OAAMC,WAAW,CACvC,SAACC,OAA4B;QAC3Bb,SAASa,OAAOhB;IAClB,GACA;QAACG;QAAUH;KAAM;IAEnB,IAAMiB,QAAQC,IAAAA,2BAAoB,EAACV;IAEnC,qBACE,qBAACW;QACCV,WAAWW,IAAAA,gBAAU,cAEnBR,UAAUd,oBAAQ,CAACuB,OAAO,IAAIzB,eAAe,CAACgB,MAAM,EACpDV,oCACAO;QAEFa,MAAK;QACLC,cAAYN;OACRP,0BAEJ,qBAACS;QAAIV,SAAS;QAAsBa,MAAK;OACtCE,IAAAA,kBAAY,EAAClB,yBAAW,qBAACa;QAAIV,SAAS;OAA2BH,uBAClE,qBAACmB,kBAAQ;QAAChB,SAAS;QAA2BQ,OAAOA;QAAOS,eAAAA,IAAW;OACpElB,WAEFgB,IAAAA,kBAAY,EAACjB,wBAAU,qBAACY;QAAIV,SAAS;OAA0BF,QAE/DL,2BACC,qBAACyB,kBAAQ;QACPC,WAAU;QACVnB,SAAS;QACToB,SAAShB;QACTiB,UAAU,KAAK;QACfC,WAAW,KAAK;QAChBR,cAAY,AAAC,GAAqBN,OAAnBZ,iBAAgB,KAAS,OAANY;qBAElC,qBAACe,mBAAY;AAMzB"}

package/dist/cjs/components/ChipsInput/ChipsInput.js

@@ -1,40 +1,40 @@
 "use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
-var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
 Object.defineProperty(exports, "__esModule", {
-  value: true
+    value: true
+});
+Object.defineProperty(exports, "ChipsInput", {
+    enumerable: true,
+    get: function() {
+        return ChipsInput;
+    }
 });
-exports.ChipsInput = void 0;
-var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
-var React = _interopRequireWildcard(require("react"));
+var _interopRequireWildcard = require("@swc/helpers/lib/_interop_require_wildcard.js").default;
+var _objectWithoutProperties = require("@swc/helpers/lib/_object_without_properties.js").default;
+var _react = /*#__PURE__*/ _interopRequireWildcard(require("react"));
 var _vkjs = require("@vkontakte/vkjs");
-var _ChipsInputBase = require("../ChipsInputBase/ChipsInputBase");
-var _FormField = require("../FormField/FormField");
-var _excluded = ["style", "className", "getRootRef", "before", "after", "status"];
-/**
- * @see https://vkcom.github.io/VKUI/#/ChipsInput
- */
-var ChipsInput = function ChipsInput(_ref) {
-  var style = _ref.style,
-    className = _ref.className,
-    getRootRef = _ref.getRootRef,
-    before = _ref.before,
-    after = _ref.after,
-    status = _ref.status,
-    restProps = (0, _objectWithoutProperties2.default)(_ref, _excluded);
-  return /*#__PURE__*/React.createElement(_FormField.FormField, {
-    getRootRef: getRootRef,
-    className: (0, _vkjs.classNames)("vkuiChipsInput", className),
-    style: style,
-    disabled: restProps.disabled,
-    before: before,
-    after: after,
-    role: "application",
-    "aria-disabled": restProps.disabled,
-    "aria-readonly": restProps.readOnly,
-    status: status
-  }, /*#__PURE__*/React.createElement(_ChipsInputBase.ChipsInputBase, restProps));
+var _chipsInputBase = require("../ChipsInputBase/ChipsInputBase");
+var _formField = require("../FormField/FormField");
+var ChipsInput = function(_param) {
+    var style = _param.style, className = _param.className, getRootRef = _param.getRootRef, before = _param.before, after = _param.after, status = _param.status, restProps = _objectWithoutProperties(_param, [
+        "style",
+        "className",
+        "getRootRef",
+        "before",
+        "after",
+        "status"
+    ]);
+    return /*#__PURE__*/ _react.createElement(_formField.FormField, {
+        getRootRef: getRootRef,
+        className: (0, _vkjs.classNames)("vkuiChipsInput", "vkuiInternalChipsInput", className),
+        style: style,
+        disabled: restProps.disabled,
+        before: before,
+        after: after,
+        role: "application",
+        "aria-disabled": restProps.disabled,
+        "aria-readonly": restProps.readOnly,
+        status: status
+    }, /*#__PURE__*/ _react.createElement(_chipsInputBase.ChipsInputBase, restProps));
 };
-exports.ChipsInput = ChipsInput;
+
 //# sourceMappingURL=ChipsInput.js.map

package/dist/cjs/components/ChipsInput/ChipsInput.js.map

@@ -1 +1 @@
-{"version":3,"file":"ChipsInput.js","names":["ChipsInput","style","className","getRootRef","before","after","status","restProps","classNames","disabled","readOnly"],"sources":["../../../../src/components/ChipsInput/ChipsInput.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { ChipOption } from '../Chip/Chip';\nimport { ChipsInputBase, ChipsInputBaseProps } from '../ChipsInputBase/ChipsInputBase';\nimport { FormField, FormFieldProps } from '../FormField/FormField';\nimport styles from './ChipsInput.module.css';\n\nexport interface ChipsInputProps<Option extends ChipOption>\n  extends ChipsInputBaseProps<Option>,\n    FormFieldProps {}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/ChipsInput\n */\nexport const ChipsInput = <Option extends ChipOption>({\n  style,\n  className,\n  getRootRef,\n  before,\n  after,\n  status,\n  ...restProps\n}: ChipsInputProps<Option>) => {\n  return (\n    <FormField\n      getRootRef={getRootRef}\n      className={classNames(styles['ChipsInput'], className)}\n      style={style}\n      disabled={restProps.disabled}\n      before={before}\n      after={after}\n      role=\"application\"\n      aria-disabled={restProps.disabled}\n      aria-readonly={restProps.readOnly}\n      status={status}\n    >\n      <ChipsInputBase {...restProps} />\n    </FormField>\n  );\n};\n"],"mappings":";;;;;;;;;AAAA;AACA;AAEA;AACA;AAAmE;AAOnE;AACA;AACA;AACO,IAAMA,UAAU,GAAG,SAAbA,UAAU,OAQQ;EAAA,IAP7BC,KAAK,QAALA,KAAK;IACLC,SAAS,QAATA,SAAS;IACTC,UAAU,QAAVA,UAAU;IACVC,MAAM,QAANA,MAAM;IACNC,KAAK,QAALA,KAAK;IACLC,MAAM,QAANA,MAAM;IACHC,SAAS;EAEZ,oBACE,oBAAC,oBAAS;IACR,UAAU,EAAEJ,UAAW;IACvB,SAAS,EAAE,IAAAK,gBAAU,oBAAuBN,SAAS,CAAE;IACvD,KAAK,EAAED,KAAM;IACb,QAAQ,EAAEM,SAAS,CAACE,QAAS;IAC7B,MAAM,EAAEL,MAAO;IACf,KAAK,EAAEC,KAAM;IACb,IAAI,EAAC,aAAa;IAClB,iBAAeE,SAAS,CAACE,QAAS;IAClC,iBAAeF,SAAS,CAACG,QAAS;IAClC,MAAM,EAAEJ;EAAO,gBAEf,oBAAC,8BAAc,EAAKC,SAAS,CAAI,CACvB;AAEhB,CAAC;AAAC"}
+{"version":3,"sources":["../../../../src/components/ChipsInput/ChipsInput.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { ChipOption } from '../Chip/Chip';\nimport { ChipsInputBase, ChipsInputBaseProps } from '../ChipsInputBase/ChipsInputBase';\nimport { FormField, FormFieldProps } from '../FormField/FormField';\nimport styles from './ChipsInput.module.css';\n\nexport interface ChipsInputProps<Option extends ChipOption>\n  extends ChipsInputBaseProps<Option>,\n    FormFieldProps {}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/ChipsInput\n */\nexport const ChipsInput = <Option extends ChipOption>({\n  style,\n  className,\n  getRootRef,\n  before,\n  after,\n  status,\n  ...restProps\n}: ChipsInputProps<Option>) => {\n  return (\n    <FormField\n      getRootRef={getRootRef}\n      className={classNames(styles['ChipsInput'], 'vkuiInternalChipsInput', className)}\n      style={style}\n      disabled={restProps.disabled}\n      before={before}\n      after={after}\n      role=\"application\"\n      aria-disabled={restProps.disabled}\n      aria-readonly={restProps.readOnly}\n      status={status}\n    >\n      <ChipsInputBase {...restProps} />\n    </FormField>\n  );\n};\n"],"names":["ChipsInput","style","className","getRootRef","before","after","status","restProps","FormField","classNames","disabled","role","aria-disabled","aria-readonly","readOnly","ChipsInputBase"],"mappings":";;;;+BAcaA;;;eAAAA;;;;;2DAdU;oBACI;8BAEyB;yBACV;AAUnC,IAAMA,aAAa,iBAQK;QAP7BC,eAAAA,OACAC,mBAAAA,WACAC,oBAAAA,YACAC,gBAAAA,QACAC,eAAAA,OACAC,gBAAAA,QACGC;QANHN;QACAC;QACAC;QACAC;QACAC;QACAC;;IAGA,qBACE,qBAACE,oBAAS;QACRL,YAAYA;QACZD,WAAWO,IAAAA,gBAAU,oBAAuB,0BAA0BP;QACtED,OAAOA;QACPS,UAAUH,UAAUG,QAAQ;QAC5BN,QAAQA;QACRC,OAAOA;QACPM,MAAK;QACLC,iBAAeL,UAAUG,QAAQ;QACjCG,iBAAeN,UAAUO,QAAQ;QACjCR,QAAQA;qBAER,qBAACS,8BAAc,EAAKR;AAG1B"}