@vkontakte/vkui 8.1.2 → 8.2.0

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/components/WriteBar/WriteBar.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { classNames, hasReactNode } from '@vkontakte/vkjs';\nimport { useExternRef } from '../../hooks/useExternRef';\nimport { useMergeProps } from '../../hooks/useMergeProps';\nimport { usePlatform } from '../../hooks/usePlatform';\nimport { callMultiple } from '../../lib/callMultiple';\nimport { warnOnce } from '../../lib/warnOnce';\nimport type { HasDataAttribute, HasRootRef } from '../../types';\nimport { RootComponent } from '../RootComponent/RootComponent';\nimport { useResizeTextarea } from '../Textarea/useResizeTextarea';\nimport { Headline } from '../Typography/Headline/Headline';\nimport { Title } from '../Typography/Title/Title';\nimport type { TypographyProps } from '../Typography/Typography';\nimport styles from './WriteBar.module.css';\n\nconst warn = warnOnce('WriteBar');\n\nexport interface WriteBarProps\n  extends Pick<\n      React.TextareaHTMLAttributes<HTMLTextAreaElement>,\n      | 'autoComplete'\n      | 'autoCapitalize'\n      | 'autoCorrect'\n      | 'cols'\n      | 'dirName'\n      | 'disabled'\n      | 'maxLength'\n      | 'minLength'\n      | 'name'\n      | 'placeholder'\n      | 'readOnly'\n      | 'required'\n      | 'rows'\n      | 'value'\n      | 'wrap'\n      | 'form'\n      | 'onChange'\n      | 'onFocus'\n      | 'onBlur'\n    >,\n    Omit<React.HTMLAttributes<HTMLDivElement>, 'onChange' | 'onFocus' | 'onBlur'>,\n    HasRootRef<HTMLDivElement> {\n  /**\n   * @deprecated Since 7.9.0. Вместо этого используйте `slotProps={ textArea: { getRootRef: ... } }`.\n   */\n  getRef?: React.Ref<HTMLTextAreaElement> | undefined;\n  /**\n   * Свойства, которые можно прокинуть внутрь компонента:\n   * - `root`: свойства для прокидывания в корень компонента;\n   * - `textArea`: свойства для прокидывания в поле ввода.\n   */\n  slotProps?:\n    | {\n        root?:\n          | (Omit<React.HTMLAttributes<HTMLDivElement>, 'children'> &\n              HasRootRef<HTMLDivElement> &\n              HasDataAttribute)\n          | undefined;\n        textArea?:\n          | (React.TextareaHTMLAttributes<HTMLTextAreaElement> &\n              HasRootRef<HTMLTextAreaElement> &\n              HasDataAttribute)\n          | undefined;\n      }\n    | undefined;\n  /**\n   * Содержимое, отображаемое слева от поля ввода.\n   */\n  before?: React.ReactNode | undefined;\n  /**\n   * Содержимое, отображаемое поверх поля ввода (актуально для iOS).\n   */\n  inlineAfter?: React.ReactNode | undefined;\n  /**\n   * Содержимое, отображаемое справа от поля ввода.\n   */\n  after?: React.ReactNode | undefined;\n  /**\n   * Вызывается при смене высоты поля ввода.\n   */\n  onHeightChange?: VoidFunction | undefined;\n  /**\n   * Добавляет тень вокруг поля ввода.\n   */\n  shadow?: boolean | undefined;\n  /**\n   * @deprecated Неиспользуемое свойство.\n   */\n  children?: never | undefined;\n}\n\nconst WriteBarTypography = (props: TypographyProps) => {\n  const platform = usePlatform();\n\n  if (platform === 'ios') {\n    return <Title {...props} level=\"3\" weight=\"3\" />;\n  }\n\n  return <Headline weight=\"3\" {...props} />;\n};\n\n/**\n * @see https://vkui.io/components/write-bar\n */\nexport const WriteBar = ({\n  // WriteBarProps\n  before,\n  inlineAfter,\n  after,\n  onHeightChange,\n  shadow = false,\n  getRef,\n\n  // textarea props\n  autoComplete,\n  autoCapitalize,\n  autoCorrect,\n  cols,\n  dirName,\n  disabled,\n  maxLength,\n  minLength,\n  name,\n  placeholder,\n  readOnly,\n  required,\n  value: valueProp,\n  wrap,\n  rows,\n  form,\n  onChange: onChangeProp,\n  onFocus,\n  onBlur,\n  id,\n  inputMode,\n  defaultValue,\n  autoFocus,\n  tabIndex,\n  spellCheck,\n\n  slotProps,\n  ...restProps\n}: WriteBarProps): React.ReactNode => {\n  /* istanbul ignore if: не проверяем в тестах */\n  if (process.env.NODE_ENV === 'development' && getRef) {\n    warn('Свойство `getRef` устаревшее, используйте `slotProps={ textArea: { getRootRef: ... } }`');\n  }\n\n  const platform = usePlatform();\n\n  const rootProps = useMergeProps(restProps, slotProps?.root);\n\n  const {\n    onChange,\n    getRootRef: getTextAreaRef,\n    ...textAreaRest\n  } = useMergeProps(\n    {\n      className: styles.textarea,\n      getRootRef: getRef,\n      autoComplete,\n      autoCapitalize,\n      autoCorrect,\n      cols,\n      dirName,\n      disabled,\n      maxLength,\n      minLength,\n      name,\n      placeholder,\n      readOnly,\n      required,\n      value: valueProp,\n      wrap,\n      rows,\n      form,\n      onChange: onChangeProp,\n      onFocus,\n      onBlur,\n      id,\n      inputMode,\n      defaultValue,\n      autoFocus,\n      tabIndex,\n      spellCheck,\n    },\n    slotProps?.textArea,\n  );\n\n  const [refResizeTextarea, resize] = useResizeTextarea(onHeightChange, true);\n  const textareaRef = useExternRef(getTextAreaRef, refResizeTextarea);\n\n  React.useEffect(resize, [resize, platform]);\n\n  return (\n    <RootComponent\n      baseClassName={classNames(\n        styles.host,\n        platform === 'ios' && styles.ios,\n        shadow && styles.shadow,\n      )}\n      {...rootProps}\n    >\n      <div className={styles.form}>\n        {hasReactNode(before) && <div className={styles.before}>{before}</div>}\n\n        <div className={styles.formIn}>\n          <WriteBarTypography\n            Component=\"textarea\"\n            onChange={callMultiple(onChange, resize)}\n            getRootRef={textareaRef}\n            {...textAreaRest}\n          />\n          {hasReactNode(inlineAfter) && <div className={styles.inlineAfter}>{inlineAfter}</div>}\n        </div>\n\n        {hasReactNode(after) && <div className={styles.after}>{after}</div>}\n      </div>\n    </RootComponent>\n  );\n};\n"],"names":["React","classNames","hasReactNode","useExternRef","useMergeProps","usePlatform","callMultiple","warnOnce","RootComponent","useResizeTextarea","Headline","Title","styles","warn","WriteBarTypography","props","platform","level","weight","WriteBar","before","inlineAfter","after","onHeightChange","shadow","getRef","autoComplete","autoCapitalize","autoCorrect","cols","dirName","disabled","maxLength","minLength","name","placeholder","readOnly","required","value","valueProp","wrap","rows","form","onChange","onChangeProp","onFocus","onBlur","id","inputMode","defaultValue","autoFocus","tabIndex","spellCheck","slotProps","restProps","process","env","NODE_ENV","rootProps","root","getRootRef","getTextAreaRef","textAreaRest","className","textarea","textArea","refResizeTextarea","resize","textareaRef","useEffect","baseClassName","host","ios","div","formIn","Component"],"mappings":"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"}
+{"version":3,"sources":["../../../../src/components/WriteBar/WriteBar.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { hasReactNode } from '@vkontakte/vkjs';\nimport { useMergeProps } from '../../hooks/useMergeProps';\nimport { warnOnce } from '../../lib/warnOnce';\nimport type { HasDataAttribute, HasRootRef } from '../../types';\nimport { WriteBarBeforeOrAfter } from './WriteBarBeforeOrAfter/WriteBarBeforeOrAfter';\nimport { WriteBarFormField } from './WriteBarFormField/WriteBarFormField';\nimport { WriteBarFormFieldInlineAfter } from './WriteBarFormField/WriteBarFormFieldInlineAfter/WriteBarFormFieldInlineAfter';\nimport { WriteBarRoot } from './WriteBarRoot/WriteBarRoot';\nimport { WriteBarTextarea } from './WriteBarTextarea/WriteBarTextarea';\n\nconst warn = warnOnce('WriteBar');\n\nexport interface WriteBarProps\n  extends Pick<\n      React.TextareaHTMLAttributes<HTMLTextAreaElement>,\n      | 'autoComplete'\n      | 'autoCapitalize'\n      | 'autoCorrect'\n      | 'cols'\n      | 'dirName'\n      | 'disabled'\n      | 'maxLength'\n      | 'minLength'\n      | 'name'\n      | 'placeholder'\n      | 'readOnly'\n      | 'required'\n      | 'rows'\n      | 'value'\n      | 'wrap'\n      | 'form'\n      | 'onChange'\n      | 'onFocus'\n      | 'onBlur'\n    >,\n    Omit<React.HTMLAttributes<HTMLDivElement>, 'onChange' | 'onFocus' | 'onBlur'>,\n    HasRootRef<HTMLDivElement> {\n  /**\n   * @deprecated Since 7.9.0. Вместо этого используйте `slotProps={ textArea: { getRootRef: ... } }`.\n   */\n  getRef?: React.Ref<HTMLTextAreaElement> | undefined;\n  /**\n   * Свойства, которые можно прокинуть внутрь компонента:\n   * - `root`: свойства для прокидывания в корень компонента;\n   * - `textArea`: свойства для прокидывания в поле ввода.\n   */\n  slotProps?:\n    | {\n        root?:\n          | (Omit<React.HTMLAttributes<HTMLDivElement>, 'children'> &\n              HasRootRef<HTMLDivElement> &\n              HasDataAttribute)\n          | undefined;\n        textArea?:\n          | (React.TextareaHTMLAttributes<HTMLTextAreaElement> &\n              HasRootRef<HTMLTextAreaElement> &\n              HasDataAttribute)\n          | undefined;\n      }\n    | undefined;\n  /**\n   * Содержимое, отображаемое слева от поля ввода.\n   */\n  before?: React.ReactNode | undefined;\n  /**\n   * Содержимое, отображаемое поверх поля ввода (актуально для iOS).\n   */\n  inlineAfter?: React.ReactNode | undefined;\n  /**\n   * Содержимое, отображаемое справа от поля ввода.\n   */\n  after?: React.ReactNode | undefined;\n  /**\n   * Вызывается при смене высоты поля ввода.\n   */\n  onHeightChange?: VoidFunction | undefined;\n  /**\n   * Добавляет тень вокруг поля ввода.\n   */\n  shadow?: boolean | undefined;\n  /**\n   * @deprecated Неиспользуемое свойство.\n   */\n  children?: never | undefined;\n}\n\n/**\n * @see https://vkui.io/components/write-bar\n */\nexport const WriteBar = ({\n  // WriteBarProps\n  before,\n  inlineAfter,\n  after,\n  onHeightChange,\n  shadow = false,\n  getRef,\n\n  // textarea props\n  autoComplete,\n  autoCapitalize,\n  autoCorrect,\n  cols,\n  dirName,\n  disabled,\n  maxLength,\n  minLength,\n  name,\n  placeholder,\n  readOnly,\n  required,\n  value: valueProp,\n  wrap,\n  rows,\n  form,\n  onChange,\n  onFocus,\n  onBlur,\n  id,\n  inputMode,\n  defaultValue,\n  autoFocus,\n  tabIndex,\n  spellCheck,\n\n  slotProps,\n  ...restProps\n}: WriteBarProps): React.ReactNode => {\n  /* istanbul ignore if: не проверяем в тестах */\n  if (process.env.NODE_ENV === 'development' && getRef) {\n    warn('Свойство `getRef` устаревшее, используйте `slotProps={ textArea: { getRootRef: ... } }`');\n  }\n\n  const rootProps = useMergeProps(restProps, slotProps?.root);\n\n  const textAreaRest = useMergeProps(\n    {\n      getRootRef: getRef,\n      autoComplete,\n      autoCapitalize,\n      autoCorrect,\n      cols,\n      dirName,\n      disabled,\n      maxLength,\n      minLength,\n      name,\n      placeholder,\n      readOnly,\n      required,\n      value: valueProp,\n      wrap,\n      rows,\n      form,\n      onChange,\n      onFocus,\n      onBlur,\n      id,\n      inputMode,\n      defaultValue,\n      autoFocus,\n      tabIndex,\n      spellCheck,\n    },\n    slotProps?.textArea,\n  );\n\n  return (\n    <WriteBarRoot shadow={shadow} {...rootProps}>\n      {hasReactNode(before) && <WriteBarBeforeOrAfter>{before}</WriteBarBeforeOrAfter>}\n      <WriteBarFormField>\n        <WriteBarTextarea onHeightChange={onHeightChange} {...textAreaRest} />\n        {hasReactNode(inlineAfter) && (\n          <WriteBarFormFieldInlineAfter>{inlineAfter}</WriteBarFormFieldInlineAfter>\n        )}\n      </WriteBarFormField>\n      {hasReactNode(after) && <WriteBarBeforeOrAfter>{after}</WriteBarBeforeOrAfter>}\n    </WriteBarRoot>\n  );\n};\n\nWriteBar.FormField = WriteBarFormField;\nWriteBar.Textarea = WriteBarTextarea;\nWriteBar.Root = WriteBarRoot;\nWriteBar.Before = WriteBarBeforeOrAfter;\nWriteBar.After = WriteBarBeforeOrAfter;\n"],"names":["React","hasReactNode","useMergeProps","warnOnce","WriteBarBeforeOrAfter","WriteBarFormField","WriteBarFormFieldInlineAfter","WriteBarRoot","WriteBarTextarea","warn","WriteBar","before","inlineAfter","after","onHeightChange","shadow","getRef","autoComplete","autoCapitalize","autoCorrect","cols","dirName","disabled","maxLength","minLength","name","placeholder","readOnly","required","value","valueProp","wrap","rows","form","onChange","onFocus","onBlur","id","inputMode","defaultValue","autoFocus","tabIndex","spellCheck","slotProps","restProps","process","env","NODE_ENV","rootProps","root","textAreaRest","getRootRef","textArea","FormField","Textarea","Root","Before","After"],"mappings":"AAAA;;AAEA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,YAAY,QAAQ,kBAAkB;AAC/C,SAASC,aAAa,QAAQ,+BAA4B;AAC1D,SAASC,QAAQ,QAAQ,wBAAqB;AAE9C,SAASC,qBAAqB,QAAQ,mDAAgD;AACtF,SAASC,iBAAiB,QAAQ,2CAAwC;AAC1E,SAASC,4BAA4B,QAAQ,mFAAgF;AAC7H,SAASC,YAAY,QAAQ,iCAA8B;AAC3D,SAASC,gBAAgB,QAAQ,yCAAsC;AAEvE,MAAMC,OAAON,SAAS;AA4EtB;;CAEC,GACD,OAAO,MAAMO,WAAW,CAAC,EACvB,gBAAgB;AAChBC,MAAM,EACNC,WAAW,EACXC,KAAK,EACLC,cAAc,EACdC,SAAS,KAAK,EACdC,MAAM,EAEN,iBAAiB;AACjBC,YAAY,EACZC,cAAc,EACdC,WAAW,EACXC,IAAI,EACJC,OAAO,EACPC,QAAQ,EACRC,SAAS,EACTC,SAAS,EACTC,IAAI,EACJC,WAAW,EACXC,QAAQ,EACRC,QAAQ,EACRC,OAAOC,SAAS,EAChBC,IAAI,EACJC,IAAI,EACJC,IAAI,EACJC,QAAQ,EACRC,OAAO,EACPC,MAAM,EACNC,EAAE,EACFC,SAAS,EACTC,YAAY,EACZC,SAAS,EACTC,QAAQ,EACRC,UAAU,EAEVC,SAAS,EACT,GAAGC,WACW;IACd,6CAA6C,GAC7C,IAAIC,QAAQC,GAAG,CAACC,QAAQ,KAAK,iBAAiB/B,QAAQ;QACpDP,KAAK;IACP;IAEA,MAAMuC,YAAY9C,cAAc0C,WAAWD,WAAWM;IAEtD,MAAMC,eAAehD,cACnB;QACEiD,YAAYnC;QACZC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC,OAAOC;QACPC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;IACF,GACAC,WAAWS;IAGb,qBACE,MAAC7C;QAAaQ,QAAQA;QAAS,GAAGiC,SAAS;;YACxC/C,aAAaU,yBAAW,KAACP;0BAAuBO;;0BACjD,MAACN;;kCACC,KAACG;wBAAiBM,gBAAgBA;wBAAiB,GAAGoC,YAAY;;oBACjEjD,aAAaW,8BACZ,KAACN;kCAA8BM;;;;YAGlCX,aAAaY,wBAAU,KAACT;0BAAuBS;;;;AAGtD,EAAE;AAEFH,SAAS2C,SAAS,GAAGhD;AACrBK,SAAS4C,QAAQ,GAAG9C;AACpBE,SAAS6C,IAAI,GAAGhD;AAChBG,SAAS8C,MAAM,GAAGpD;AAClBM,SAAS+C,KAAK,GAAGrD"}

package/dist/cssm/components/WriteBar/WriteBarBeforeOrAfter/WriteBarBeforeOrAfter.js

@@ -0,0 +1,16 @@
+'use client';
+import { jsx as _jsx } from "react/jsx-runtime";
+import { classNames } from "@vkontakte/vkjs";
+import { Flex } from "../../Flex/Flex.js";
+import { usePlatform } from "../../../hooks/usePlatform.js";
+import styles from "./WriteBarBeforeOrAfter.module.css";
+export const WriteBarBeforeOrAfter = ({ className, ...restProps })=>{
+    const platform = usePlatform();
+    return /*#__PURE__*/ _jsx(Flex, {
+        align: "end",
+        className: classNames(styles.host, platform === 'ios' && styles.ios, className),
+        ...restProps
+    });
+};
+
+//# sourceMappingURL=WriteBarBeforeOrAfter.js.map

package/dist/cssm/components/WriteBar/WriteBarBeforeOrAfter/WriteBarBeforeOrAfter.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../../src/components/WriteBar/WriteBarBeforeOrAfter/WriteBarBeforeOrAfter.tsx"],"sourcesContent":["'use client';\n\nimport { classNames } from '@vkontakte/vkjs';\nimport { Flex, type FlexProps } from '../../../components/Flex/Flex';\nimport { usePlatform } from '../../../hooks/usePlatform';\nimport styles from './WriteBarBeforeOrAfter.module.css';\n\ntype WriteBarBeforeOrAfterProps = FlexProps;\n\nexport const WriteBarBeforeOrAfter = ({ className, ...restProps }: WriteBarBeforeOrAfterProps) => {\n  const platform = usePlatform();\n\n  return (\n    <Flex\n      align=\"end\"\n      className={classNames(styles.host, platform === 'ios' && styles.ios, className)}\n      {...restProps}\n    />\n  );\n};\n"],"names":["classNames","Flex","usePlatform","styles","WriteBarBeforeOrAfter","className","restProps","platform","align","host","ios"],"mappings":"AAAA;;AAEA,SAASA,UAAU,QAAQ,kBAAkB;AAC7C,SAASC,IAAI,QAAwB,qBAAgC;AACrE,SAASC,WAAW,QAAQ,gCAA6B;AACzD,OAAOC,YAAY,qCAAqC;AAIxD,OAAO,MAAMC,wBAAwB,CAAC,EAAEC,SAAS,EAAE,GAAGC,WAAuC;IAC3F,MAAMC,WAAWL;IAEjB,qBACE,KAACD;QACCO,OAAM;QACNH,WAAWL,WAAWG,OAAOM,IAAI,EAAEF,aAAa,SAASJ,OAAOO,GAAG,EAAEL;QACpE,GAAGC,SAAS;;AAGnB,EAAE"}

package/dist/cssm/components/WriteBar/WriteBarBeforeOrAfter/WriteBarBeforeOrAfter.module.css

@@ -0,0 +1,12 @@
+.host:first-of-type {
+  padding-inline-start: 4px;
+}
+
+.host:last-of-type {
+  padding-inline-end: 4px;
+}
+
+.ios {
+  padding-block: 0;
+  padding-inline: 4px;
+}

package/dist/cssm/components/WriteBar/WriteBarFormField/WriteBarFormField.js

@@ -0,0 +1,17 @@
+'use client';
+import { jsx as _jsx } from "react/jsx-runtime";
+import { classNames } from "@vkontakte/vkjs";
+import { usePlatform } from "../../../hooks/usePlatform.js";
+import { Flex } from "../../Flex/Flex.js";
+import { WriteBarFormFieldInlineAfter } from "./WriteBarFormFieldInlineAfter/WriteBarFormFieldInlineAfter.js";
+import styles from "./WriteBarFormField.module.css";
+export const WriteBarFormField = ({ className, ...restProps })=>{
+    const platform = usePlatform();
+    return /*#__PURE__*/ _jsx(Flex, {
+        className: classNames(styles.host, platform === 'ios' && styles.ios, className),
+        ...restProps
+    });
+};
+WriteBarFormField.InlineAfter = WriteBarFormFieldInlineAfter;
+
+//# sourceMappingURL=WriteBarFormField.js.map

package/dist/cssm/components/WriteBar/WriteBarFormField/WriteBarFormField.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../../src/components/WriteBar/WriteBarFormField/WriteBarFormField.tsx"],"sourcesContent":["'use client';\n\nimport { classNames } from '@vkontakte/vkjs';\nimport { usePlatform } from '../../../hooks/usePlatform';\nimport { Flex, type FlexProps } from '../../Flex/Flex';\nimport { WriteBarFormFieldInlineAfter } from './WriteBarFormFieldInlineAfter/WriteBarFormFieldInlineAfter';\nimport styles from './WriteBarFormField.module.css';\n\ntype WriteBarFormFieldProps = FlexProps;\n\nexport const WriteBarFormField = ({ className, ...restProps }: WriteBarFormFieldProps) => {\n  const platform = usePlatform();\n\n  return (\n    <Flex\n      className={classNames(styles.host, platform === 'ios' && styles.ios, className)}\n      {...restProps}\n    />\n  );\n};\n\nWriteBarFormField.InlineAfter = WriteBarFormFieldInlineAfter;\n"],"names":["classNames","usePlatform","Flex","WriteBarFormFieldInlineAfter","styles","WriteBarFormField","className","restProps","platform","host","ios","InlineAfter"],"mappings":"AAAA;;AAEA,SAASA,UAAU,QAAQ,kBAAkB;AAC7C,SAASC,WAAW,QAAQ,gCAA6B;AACzD,SAASC,IAAI,QAAwB,qBAAkB;AACvD,SAASC,4BAA4B,QAAQ,iEAA8D;AAC3G,OAAOC,YAAY,iCAAiC;AAIpD,OAAO,MAAMC,oBAAoB,CAAC,EAAEC,SAAS,EAAE,GAAGC,WAAmC;IACnF,MAAMC,WAAWP;IAEjB,qBACE,KAACC;QACCI,WAAWN,WAAWI,OAAOK,IAAI,EAAED,aAAa,SAASJ,OAAOM,GAAG,EAAEJ;QACpE,GAAGC,SAAS;;AAGnB,EAAE;AAEFF,kBAAkBM,WAAW,GAAGR"}

package/dist/cssm/components/WriteBar/WriteBarFormField/WriteBarFormField.module.css

@@ -0,0 +1,18 @@
+.host {
+  position: relative;
+  flex: 1;
+  min-inline-size: 0;
+}
+
+.ios {
+  box-sizing: border-box;
+  margin-block: 8px;
+  margin-inline: 0;
+  background-color: var(--vkui--color_write_bar_input_background);
+  border: var(--vkui--size_border--regular) solid var(--vkui--color_write_bar_input_border);
+  border-radius: 18px;
+}
+
+.ios:first-child {
+  margin-inline-start: 12px;
+}

package/dist/cssm/components/WriteBar/WriteBarFormField/WriteBarFormFieldInlineAfter/WriteBarFormFieldInlineAfter.js

@@ -0,0 +1,16 @@
+'use client';
+import { jsx as _jsx } from "react/jsx-runtime";
+import { classNames } from "@vkontakte/vkjs";
+import { Flex } from "../../../Flex/Flex.js";
+import { usePlatform } from "../../../../hooks/usePlatform.js";
+import styles from "./WriteBarFormFieldInlineAfter.module.css";
+export const WriteBarFormFieldInlineAfter = ({ className, ...restProps })=>{
+    const platform = usePlatform();
+    return /*#__PURE__*/ _jsx(Flex, {
+        align: "end",
+        className: classNames(platform === 'ios' && styles.ios, className),
+        ...restProps
+    });
+};
+
+//# sourceMappingURL=WriteBarFormFieldInlineAfter.js.map

package/dist/cssm/components/WriteBar/WriteBarFormField/WriteBarFormFieldInlineAfter/WriteBarFormFieldInlineAfter.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../../../src/components/WriteBar/WriteBarFormField/WriteBarFormFieldInlineAfter/WriteBarFormFieldInlineAfter.tsx"],"sourcesContent":["'use client';\n\nimport { classNames } from '@vkontakte/vkjs';\nimport { Flex, type FlexProps } from '../../../../components/Flex/Flex';\nimport { usePlatform } from '../../../../hooks/usePlatform';\nimport styles from './WriteBarFormFieldInlineAfter.module.css';\n\ntype WriteBarFormFieldInlineAfterProps = FlexProps;\n\nexport const WriteBarFormFieldInlineAfter = ({\n  className,\n  ...restProps\n}: WriteBarFormFieldInlineAfterProps) => {\n  const platform = usePlatform();\n\n  return (\n    <Flex\n      align=\"end\"\n      className={classNames(platform === 'ios' && styles.ios, className)}\n      {...restProps}\n    />\n  );\n};\n"],"names":["classNames","Flex","usePlatform","styles","WriteBarFormFieldInlineAfter","className","restProps","platform","align","ios"],"mappings":"AAAA;;AAEA,SAASA,UAAU,QAAQ,kBAAkB;AAC7C,SAASC,IAAI,QAAwB,wBAAmC;AACxE,SAASC,WAAW,QAAQ,mCAAgC;AAC5D,OAAOC,YAAY,4CAA4C;AAI/D,OAAO,MAAMC,+BAA+B,CAAC,EAC3CC,SAAS,EACT,GAAGC,WAC+B;IAClC,MAAMC,WAAWL;IAEjB,qBACE,KAACD;QACCO,OAAM;QACNH,WAAWL,WAAWO,aAAa,SAASJ,OAAOM,GAAG,EAAEJ;QACvD,GAAGC,SAAS;;AAGnB,EAAE"}

package/dist/cssm/components/WriteBar/WriteBarFormField/WriteBarFormFieldInlineAfter/WriteBarFormFieldInlineAfter.module.css

@@ -0,0 +1,3 @@
+.ios {
+  margin-block: -8px;
+}

package/dist/cssm/components/WriteBar/WriteBarRoot/WriteBarRoot.js

@@ -0,0 +1,17 @@
+'use client';
+import { jsx as _jsx } from "react/jsx-runtime";
+import { classNames } from "@vkontakte/vkjs";
+import { usePlatform } from "../../../hooks/usePlatform.js";
+import { Flex } from "../../Flex/Flex.js";
+import styles from "./WriteBarRoot.module.css";
+export const WriteBarRoot = ({ shadow, className, ...restProps })=>{
+    const platform = usePlatform();
+    return /*#__PURE__*/ _jsx(Flex, {
+        align: "end",
+        minBlockSize: 52,
+        className: classNames(styles.host, platform === 'ios' && styles.ios, shadow && styles.shadow, className),
+        ...restProps
+    });
+};
+
+//# sourceMappingURL=WriteBarRoot.js.map

package/dist/cssm/components/WriteBar/WriteBarRoot/WriteBarRoot.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../../src/components/WriteBar/WriteBarRoot/WriteBarRoot.tsx"],"sourcesContent":["'use client';\n\nimport { classNames } from '@vkontakte/vkjs';\nimport { usePlatform } from '../../../hooks/usePlatform';\nimport { Flex, type FlexProps } from '../../Flex/Flex';\nimport styles from './WriteBarRoot.module.css';\n\ntype WriteBarRootProps = FlexProps & {\n  /**\n   * Добавляет тень вокруг поля ввода.\n   */\n  shadow?: boolean;\n};\n\nexport const WriteBarRoot = ({ shadow, className, ...restProps }: WriteBarRootProps) => {\n  const platform = usePlatform();\n\n  return (\n    <Flex\n      align=\"end\"\n      minBlockSize={52}\n      className={classNames(\n        styles.host,\n        platform === 'ios' && styles.ios,\n        shadow && styles.shadow,\n        className,\n      )}\n      {...restProps}\n    />\n  );\n};\n"],"names":["classNames","usePlatform","Flex","styles","WriteBarRoot","shadow","className","restProps","platform","align","minBlockSize","host","ios"],"mappings":"AAAA;;AAEA,SAASA,UAAU,QAAQ,kBAAkB;AAC7C,SAASC,WAAW,QAAQ,gCAA6B;AACzD,SAASC,IAAI,QAAwB,qBAAkB;AACvD,OAAOC,YAAY,4BAA4B;AAS/C,OAAO,MAAMC,eAAe,CAAC,EAAEC,MAAM,EAAEC,SAAS,EAAE,GAAGC,WAA8B;IACjF,MAAMC,WAAWP;IAEjB,qBACE,KAACC;QACCO,OAAM;QACNC,cAAc;QACdJ,WAAWN,WACTG,OAAOQ,IAAI,EACXH,aAAa,SAASL,OAAOS,GAAG,EAChCP,UAAUF,OAAOE,MAAM,EACvBC;QAED,GAAGC,SAAS;;AAGnB,EAAE"}

package/dist/cssm/components/WriteBar/WriteBarRoot/WriteBarRoot.module.css

@@ -0,0 +1,15 @@
+.host {
+  background: var(--vkui--color_background_contrast_themed);
+}
+
+.shadow {
+  box-shadow: var(--vkui--elevation3);
+}
+
+/**
+ * iOS
+ */
+
+.ios {
+  background: var(--vkui--color_background_content);
+}

package/dist/cssm/components/WriteBar/WriteBarTextarea/WriteBarTextarea.js

@@ -0,0 +1,40 @@
+'use client';
+import { jsx as _jsx } from "react/jsx-runtime";
+import * as React from "react";
+import { classNames } from "@vkontakte/vkjs";
+import { useExternRef } from "../../../hooks/useExternRef.js";
+import { usePlatform } from "../../../hooks/usePlatform.js";
+import { callMultiple } from "../../../lib/callMultiple.js";
+import { useResizeTextarea } from "../../Textarea/useResizeTextarea.js";
+import { Headline } from "../../Typography/Headline/Headline.js";
+import { Title } from "../../Typography/Title/Title.js";
+import styles from "./WriteBarTextarea.module.css";
+export const WriteBarTextarea = ({ className, getRootRef, onHeightChange, onChange, ...restProps })=>{
+    const platform = usePlatform();
+    const [refResizeTextarea, resize] = useResizeTextarea(onHeightChange, true);
+    const textareaRef = useExternRef(getRootRef, refResizeTextarea);
+    React.useEffect(resize, [
+        resize,
+        platform
+    ]);
+    const props = {
+        Component: 'textarea',
+        weight: '3',
+        className: classNames(className, styles.host, platform === 'ios' && styles.ios),
+        getRootRef: textareaRef,
+        onChange: callMultiple(onChange, resize)
+    };
+    if (platform === 'ios') {
+        return /*#__PURE__*/ _jsx(Title, {
+            level: "3",
+            ...props,
+            ...restProps
+        });
+    }
+    return /*#__PURE__*/ _jsx(Headline, {
+        ...props,
+        ...restProps
+    });
+};
+
+//# sourceMappingURL=WriteBarTextarea.js.map

package/dist/cssm/components/WriteBar/WriteBarTextarea/WriteBarTextarea.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../../src/components/WriteBar/WriteBarTextarea/WriteBarTextarea.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { useExternRef } from '../../../hooks/useExternRef';\nimport { usePlatform } from '../../../hooks/usePlatform';\nimport { callMultiple } from '../../../lib/callMultiple';\nimport type { RootComponentProps } from '../../RootComponent/RootComponent';\nimport { useResizeTextarea } from '../../Textarea/useResizeTextarea';\nimport { Headline } from '../../Typography/Headline/Headline';\nimport { Title } from '../../Typography/Title/Title';\nimport styles from './WriteBarTextarea.module.css';\n\ntype WriteBarTextareaProps = RootComponentProps<HTMLTextAreaElement> & {\n  /**\n   * Вызывается при смене высоты поля ввода.\n   */\n  onHeightChange?: VoidFunction | undefined;\n};\n\nexport const WriteBarTextarea = ({\n  className,\n  getRootRef,\n  onHeightChange,\n  onChange,\n  ...restProps\n}: WriteBarTextareaProps) => {\n  const platform = usePlatform();\n\n  const [refResizeTextarea, resize] = useResizeTextarea(onHeightChange, true);\n  const textareaRef = useExternRef(getRootRef, refResizeTextarea);\n\n  React.useEffect(resize, [resize, platform]);\n\n  const props = {\n    Component: 'textarea',\n    weight: '3',\n    className: classNames(className, styles.host, platform === 'ios' && styles.ios),\n    getRootRef: textareaRef,\n    onChange: callMultiple(onChange, resize),\n  } as const;\n\n  if (platform === 'ios') {\n    return <Title level=\"3\" {...props} {...restProps} />;\n  }\n\n  return <Headline {...props} {...restProps} />;\n};\n"],"names":["React","classNames","useExternRef","usePlatform","callMultiple","useResizeTextarea","Headline","Title","styles","WriteBarTextarea","className","getRootRef","onHeightChange","onChange","restProps","platform","refResizeTextarea","resize","textareaRef","useEffect","props","Component","weight","host","ios","level"],"mappings":"AAAA;;AAEA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,UAAU,QAAQ,kBAAkB;AAC7C,SAASC,YAAY,QAAQ,iCAA8B;AAC3D,SAASC,WAAW,QAAQ,gCAA6B;AACzD,SAASC,YAAY,QAAQ,+BAA4B;AAEzD,SAASC,iBAAiB,QAAQ,sCAAmC;AACrE,SAASC,QAAQ,QAAQ,wCAAqC;AAC9D,SAASC,KAAK,QAAQ,kCAA+B;AACrD,OAAOC,YAAY,gCAAgC;AASnD,OAAO,MAAMC,mBAAmB,CAAC,EAC/BC,SAAS,EACTC,UAAU,EACVC,cAAc,EACdC,QAAQ,EACR,GAAGC,WACmB;IACtB,MAAMC,WAAWZ;IAEjB,MAAM,CAACa,mBAAmBC,OAAO,GAAGZ,kBAAkBO,gBAAgB;IACtE,MAAMM,cAAchB,aAAaS,YAAYK;IAE7ChB,MAAMmB,SAAS,CAACF,QAAQ;QAACA;QAAQF;KAAS;IAE1C,MAAMK,QAAQ;QACZC,WAAW;QACXC,QAAQ;QACRZ,WAAWT,WAAWS,WAAWF,OAAOe,IAAI,EAAER,aAAa,SAASP,OAAOgB,GAAG;QAC9Eb,YAAYO;QACZL,UAAUT,aAAaS,UAAUI;IACnC;IAEA,IAAIF,aAAa,OAAO;QACtB,qBAAO,KAACR;YAAMkB,OAAM;YAAK,GAAGL,KAAK;YAAG,GAAGN,SAAS;;IAClD;IAEA,qBAAO,KAACR;QAAU,GAAGc,KAAK;QAAG,GAAGN,SAAS;;AAC3C,EAAE"}

package/dist/cssm/components/WriteBar/WriteBarTextarea/WriteBarTextarea.module.css

@@ -0,0 +1,43 @@
+.host {
+  box-sizing: border-box;
+  flex: 1;
+  inline-size: 100%;
+  min-inline-size: 0;
+  max-block-size: 120px;
+  margin: 0;
+  color: var(--vkui--color_text_primary);
+  -webkit-appearance: none;
+          appearance: none;
+  resize: none;
+  background: transparent;
+  border: 0;
+}
+
+.host:placeholder-shown {
+  text-overflow: ellipsis;
+}
+
+.host::placeholder {
+  overflow: hidden;
+  text-overflow: ellipsis;
+  color: var(--vkui--color_text_subhead);
+  white-space: nowrap;
+  /* Для Firefox */
+  opacity: 1;
+}
+
+.host:focus {
+  outline: var(--vkui_internal--outline-reset);
+}
+
+.host {
+  block-size: 52px;
+  padding-block: 16px;
+  padding-inline: 12px;
+}
+
+.ios {
+  block-size: 36px;
+  padding-block: 6px;
+  padding-inline: 12px 0;
+}

package/dist/cssm/helpers/math.js

@@ -1,4 +1,10 @@
 export const clamp = (value, min, max)=>Math.max(min, Math.min(value, max));
+/**
+ * Переполнение для диапазона [min, max]
+ */ export function overflow(value, min, max) {
+    const range = max - min + 1;
+    return ((value - min) % range + range) % range + min;
+}
 export function precisionRound(number, precision = 1) {
     let factor = Math.pow(10, precision);
     return Math.round(number * factor) / factor;

package/dist/cssm/helpers/math.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/helpers/math.ts"],"sourcesContent":["export const clamp = (value: number, min: number, max: number): number =>\n  Math.max(min, Math.min(value, max));\n\nexport function precisionRound(number: number, precision = 1): number {\n  let factor = Math.pow(10, precision);\n  return Math.round(number * factor) / factor;\n}\n\n/**\n * Решение скопировано без изменений у MUI:\n * https://github.com/mui/material-ui/blob/v5.13.7/packages/mui-base/src/useSlider/useSlider.ts#L89-L105\n */\nfunction getDecimalPrecision(num: number) {\n  // This handles the case when num is very small (0.00000001), js will turn this into 1e-8.\n  // When num is bigger than 1 or less than -1 it won't get converted to this notation so it's fine.\n  if (Math.abs(num) < 1) {\n    const parts = num.toExponential().split('e-');\n    const matissaDecimalPart = parts[0].split('.')[1];\n    return (matissaDecimalPart ? matissaDecimalPart.length : 0) + parseInt(parts[1], 10);\n  }\n\n  const decimalPart = num.toString().split('.')[1];\n  return decimalPart ? decimalPart.length : 0;\n}\n\nfunction roundValueToStep(value: number, step: number, min: number) {\n  const nearest = Math.round((value - min) / step) * step + min;\n  return Number(nearest.toFixed(getDecimalPrecision(step)));\n}\n\nfunction decimatedClamp(val: number, min: number, max: number, step?: number) {\n  if (step == null || step <= 0) {\n    return clamp(val, min, max);\n  }\n  const roundedValue = roundValueToStep(val, step, min);\n  return clamp(roundedValue, min, max);\n}\n\nexport function rescale(\n  value: number,\n  from: [number, number],\n  to: [number, number],\n  options: { step?: number | undefined } = {},\n): number {\n  const scaled = ((value - from[0]) / (from[1] - from[0])) * (to[1] - to[0]) + to[0];\n  return decimatedClamp(scaled, to[0], to[1], options.step);\n}\n"],"names":["clamp","value","min","max","Math","precisionRound","number","precision","factor","pow","round","getDecimalPrecision","num","abs","parts","toExponential","split","matissaDecimalPart","length","parseInt","decimalPart","toString","roundValueToStep","step","nearest","Number","toFixed","decimatedClamp","val","roundedValue","rescale","from","to","options","scaled"],"mappings":"AAAA,OAAO,MAAMA,QAAQ,CAACC,OAAeC,KAAaC,MAChDC,KAAKD,GAAG,CAACD,KAAKE,KAAKF,GAAG,CAACD,OAAOE,MAAM;AAEtC,OAAO,SAASE,eAAeC,MAAc,EAAEC,YAAY,CAAC;IAC1D,IAAIC,SAASJ,KAAKK,GAAG,CAAC,IAAIF;IAC1B,OAAOH,KAAKM,KAAK,CAACJ,SAASE,UAAUA;AACvC;AAEA;;;CAGC,GACD,SAASG,oBAAoBC,GAAW;IACtC,0FAA0F;IAC1F,kGAAkG;IAClG,IAAIR,KAAKS,GAAG,CAACD,OAAO,GAAG;QACrB,MAAME,QAAQF,IAAIG,aAAa,GAAGC,KAAK,CAAC;QACxC,MAAMC,qBAAqBH,KAAK,CAAC,EAAE,CAACE,KAAK,CAAC,IAAI,CAAC,EAAE;QACjD,OAAO,AAACC,CAAAA,qBAAqBA,mBAAmBC,MAAM,GAAG,CAAA,IAAKC,SAASL,KAAK,CAAC,EAAE,EAAE;IACnF;IAEA,MAAMM,cAAcR,IAAIS,QAAQ,GAAGL,KAAK,CAAC,IAAI,CAAC,EAAE;IAChD,OAAOI,cAAcA,YAAYF,MAAM,GAAG;AAC5C;AAEA,SAASI,iBAAiBrB,KAAa,EAAEsB,IAAY,EAAErB,GAAW;IAChE,MAAMsB,UAAUpB,KAAKM,KAAK,CAAC,AAACT,CAAAA,QAAQC,GAAE,IAAKqB,QAAQA,OAAOrB;IAC1D,OAAOuB,OAAOD,QAAQE,OAAO,CAACf,oBAAoBY;AACpD;AAEA,SAASI,eAAeC,GAAW,EAAE1B,GAAW,EAAEC,GAAW,EAAEoB,IAAa;IAC1E,IAAIA,QAAQ,QAAQA,QAAQ,GAAG;QAC7B,OAAOvB,MAAM4B,KAAK1B,KAAKC;IACzB;IACA,MAAM0B,eAAeP,iBAAiBM,KAAKL,MAAMrB;IACjD,OAAOF,MAAM6B,cAAc3B,KAAKC;AAClC;AAEA,OAAO,SAAS2B,QACd7B,KAAa,EACb8B,IAAsB,EACtBC,EAAoB,EACpBC,UAAyC,CAAC,CAAC;IAE3C,MAAMC,SAAS,AAAEjC,CAAAA,QAAQ8B,IAAI,CAAC,EAAE,AAAD,IAAMA,CAAAA,IAAI,CAAC,EAAE,GAAGA,IAAI,CAAC,EAAE,AAAD,IAAOC,CAAAA,EAAE,CAAC,EAAE,GAAGA,EAAE,CAAC,EAAE,AAAD,IAAKA,EAAE,CAAC,EAAE;IAClF,OAAOL,eAAeO,QAAQF,EAAE,CAAC,EAAE,EAAEA,EAAE,CAAC,EAAE,EAAEC,QAAQV,IAAI;AAC1D"}
+{"version":3,"sources":["../../../src/helpers/math.ts"],"sourcesContent":["export const clamp = (value: number, min: number, max: number): number =>\n  Math.max(min, Math.min(value, max));\n\n/**\n * Переполнение для диапазона [min, max]\n */\nexport function overflow(value: number, min: number, max: number) {\n  const range = max - min + 1;\n  return ((((value - min) % range) + range) % range) + min;\n}\n\nexport function precisionRound(number: number, precision = 1): number {\n  let factor = Math.pow(10, precision);\n  return Math.round(number * factor) / factor;\n}\n\n/**\n * Решение скопировано без изменений у MUI:\n * https://github.com/mui/material-ui/blob/v5.13.7/packages/mui-base/src/useSlider/useSlider.ts#L89-L105\n */\nfunction getDecimalPrecision(num: number) {\n  // This handles the case when num is very small (0.00000001), js will turn this into 1e-8.\n  // When num is bigger than 1 or less than -1 it won't get converted to this notation so it's fine.\n  if (Math.abs(num) < 1) {\n    const parts = num.toExponential().split('e-');\n    const matissaDecimalPart = parts[0].split('.')[1];\n    return (matissaDecimalPart ? matissaDecimalPart.length : 0) + parseInt(parts[1], 10);\n  }\n\n  const decimalPart = num.toString().split('.')[1];\n  return decimalPart ? decimalPart.length : 0;\n}\n\nfunction roundValueToStep(value: number, step: number, min: number) {\n  const nearest = Math.round((value - min) / step) * step + min;\n  return Number(nearest.toFixed(getDecimalPrecision(step)));\n}\n\nfunction decimatedClamp(val: number, min: number, max: number, step?: number) {\n  if (step == null || step <= 0) {\n    return clamp(val, min, max);\n  }\n  const roundedValue = roundValueToStep(val, step, min);\n  return clamp(roundedValue, min, max);\n}\n\nexport function rescale(\n  value: number,\n  from: [number, number],\n  to: [number, number],\n  options: { step?: number | undefined } = {},\n): number {\n  const scaled = ((value - from[0]) / (from[1] - from[0])) * (to[1] - to[0]) + to[0];\n  return decimatedClamp(scaled, to[0], to[1], options.step);\n}\n"],"names":["clamp","value","min","max","Math","overflow","range","precisionRound","number","precision","factor","pow","round","getDecimalPrecision","num","abs","parts","toExponential","split","matissaDecimalPart","length","parseInt","decimalPart","toString","roundValueToStep","step","nearest","Number","toFixed","decimatedClamp","val","roundedValue","rescale","from","to","options","scaled"],"mappings":"AAAA,OAAO,MAAMA,QAAQ,CAACC,OAAeC,KAAaC,MAChDC,KAAKD,GAAG,CAACD,KAAKE,KAAKF,GAAG,CAACD,OAAOE,MAAM;AAEtC;;CAEC,GACD,OAAO,SAASE,SAASJ,KAAa,EAAEC,GAAW,EAAEC,GAAW;IAC9D,MAAMG,QAAQH,MAAMD,MAAM;IAC1B,OAAO,AAAE,CAAA,AAAED,CAAAA,QAAQC,GAAE,IAAKI,QAASA,KAAI,IAAKA,QAASJ;AACvD;AAEA,OAAO,SAASK,eAAeC,MAAc,EAAEC,YAAY,CAAC;IAC1D,IAAIC,SAASN,KAAKO,GAAG,CAAC,IAAIF;IAC1B,OAAOL,KAAKQ,KAAK,CAACJ,SAASE,UAAUA;AACvC;AAEA;;;CAGC,GACD,SAASG,oBAAoBC,GAAW;IACtC,0FAA0F;IAC1F,kGAAkG;IAClG,IAAIV,KAAKW,GAAG,CAACD,OAAO,GAAG;QACrB,MAAME,QAAQF,IAAIG,aAAa,GAAGC,KAAK,CAAC;QACxC,MAAMC,qBAAqBH,KAAK,CAAC,EAAE,CAACE,KAAK,CAAC,IAAI,CAAC,EAAE;QACjD,OAAO,AAACC,CAAAA,qBAAqBA,mBAAmBC,MAAM,GAAG,CAAA,IAAKC,SAASL,KAAK,CAAC,EAAE,EAAE;IACnF;IAEA,MAAMM,cAAcR,IAAIS,QAAQ,GAAGL,KAAK,CAAC,IAAI,CAAC,EAAE;IAChD,OAAOI,cAAcA,YAAYF,MAAM,GAAG;AAC5C;AAEA,SAASI,iBAAiBvB,KAAa,EAAEwB,IAAY,EAAEvB,GAAW;IAChE,MAAMwB,UAAUtB,KAAKQ,KAAK,CAAC,AAACX,CAAAA,QAAQC,GAAE,IAAKuB,QAAQA,OAAOvB;IAC1D,OAAOyB,OAAOD,QAAQE,OAAO,CAACf,oBAAoBY;AACpD;AAEA,SAASI,eAAeC,GAAW,EAAE5B,GAAW,EAAEC,GAAW,EAAEsB,IAAa;IAC1E,IAAIA,QAAQ,QAAQA,QAAQ,GAAG;QAC7B,OAAOzB,MAAM8B,KAAK5B,KAAKC;IACzB;IACA,MAAM4B,eAAeP,iBAAiBM,KAAKL,MAAMvB;IACjD,OAAOF,MAAM+B,cAAc7B,KAAKC;AAClC;AAEA,OAAO,SAAS6B,QACd/B,KAAa,EACbgC,IAAsB,EACtBC,EAAoB,EACpBC,UAAyC,CAAC,CAAC;IAE3C,MAAMC,SAAS,AAAEnC,CAAAA,QAAQgC,IAAI,CAAC,EAAE,AAAD,IAAMA,CAAAA,IAAI,CAAC,EAAE,GAAGA,IAAI,CAAC,EAAE,AAAD,IAAOC,CAAAA,EAAE,CAAC,EAAE,GAAGA,EAAE,CAAC,EAAE,AAAD,IAAKA,EAAE,CAAC,EAAE;IAClF,OAAOL,eAAeO,QAAQF,EAAE,CAAC,EAAE,EAAEA,EAAE,CAAC,EAAE,EAAEC,QAAQV,IAAI;AAC1D"}

package/dist/cssm/hoc/withPlatform.js

@@ -1,9 +1,10 @@
 'use client';
 import { jsx as _jsx } from "react/jsx-runtime";
-import { useConfigProvider } from "../components/ConfigProvider/ConfigProviderContext.js";
+import * as React from "react";
+import { PlatformContext } from "../components/ConfigProvider/ConfigProviderSubContexts.js";
 export function withPlatform(Component) {
     function WithPlatform(props) {
-        const { platform } = useConfigProvider();
+        const platform = React.useContext(PlatformContext);
         return /*#__PURE__*/ _jsx(Component, {
             ...props,
             platform: platform

package/dist/cssm/hoc/withPlatform.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/hoc/withPlatform.tsx"],"sourcesContent":["'use client';\n\nimport type * as React from 'react';\nimport { useConfigProvider } from '../components/ConfigProvider/ConfigProviderContext';\nimport type { HasPlatform } from '../types';\n\nexport function withPlatform<T extends HasPlatform>(\n  Component: React.ComponentType<T>,\n): React.FC<Omit<T, keyof HasPlatform>> {\n  function WithPlatform(props: Omit<T, keyof HasPlatform>) {\n    const { platform } = useConfigProvider();\n\n    return <Component {...(props as T)} platform={platform} />;\n  }\n  return WithPlatform;\n}\n"],"names":["useConfigProvider","withPlatform","Component","WithPlatform","props","platform"],"mappings":"AAAA;;AAGA,SAASA,iBAAiB,QAAQ,wDAAqD;AAGvF,OAAO,SAASC,aACdC,SAAiC;IAEjC,SAASC,aAAaC,KAAiC;QACrD,MAAM,EAAEC,QAAQ,EAAE,GAAGL;QAErB,qBAAO,KAACE;YAAW,GAAIE,KAAK;YAAQC,UAAUA;;IAChD;IACA,OAAOF;AACT"}
+{"version":3,"sources":["../../../src/hoc/withPlatform.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { PlatformContext } from '../components/ConfigProvider/ConfigProviderSubContexts';\nimport type { HasPlatform } from '../types';\n\nexport function withPlatform<T extends HasPlatform>(\n  Component: React.ComponentType<T>,\n): React.FC<Omit<T, keyof HasPlatform>> {\n  function WithPlatform(props: Omit<T, keyof HasPlatform>) {\n    const platform = React.useContext(PlatformContext);\n\n    return <Component {...(props as T)} platform={platform} />;\n  }\n  return WithPlatform;\n}\n"],"names":["React","PlatformContext","withPlatform","Component","WithPlatform","props","platform","useContext"],"mappings":"AAAA;;AAEA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,eAAe,QAAQ,4DAAyD;AAGzF,OAAO,SAASC,aACdC,SAAiC;IAEjC,SAASC,aAAaC,KAAiC;QACrD,MAAMC,WAAWN,MAAMO,UAAU,CAACN;QAElC,qBAAO,KAACE;YAAW,GAAIE,KAAK;YAAQC,UAAUA;;IAChD;IACA,OAAOF;AACT"}

package/dist/cssm/hooks/useAdaptivityConditionalRender/types.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/hooks/useAdaptivityConditionalRender/types.ts"],"sourcesContent":["import type { CSSBreakpoints, DensityTypeValues } from '../../lib/adaptivity';\n\nexport type ForcedHiddenByAdaptivityProviderType = false; // имеется ввиду, что зашили значение, например, <AdaptivityProvider density=\"regular\" />\n\nexport type ElementProps = { className: string };\n\n/* ================================================================================================================== */\n\nexport type AdaptiveDensityType = Record<\n  DensityTypeValues,\n  ForcedHiddenByAdaptivityProviderType | ElementProps\n>;\n\n/* ================================================================================================================== */\n\nexport type ViewWidthCSSBreakpoints = Extract<\n  CSSBreakpoints,\n  'smallTabletMinus' | 'smallTabletPlus' | 'tabletMinus' | 'tabletPlus'\n>;\n\nexport type AdaptiveViewWidth = Record<\n  ViewWidthCSSBreakpoints,\n  ForcedHiddenByAdaptivityProviderType | ElementProps\n>;\n\n/* ================================================================================================================== */\n\nexport type DeviceTypeCSSBreakpoints = 'mobile' | 'desktop';\n\nexport type AdaptiveDeviceType = Record<\n  DeviceTypeCSSBreakpoints,\n  ForcedHiddenByAdaptivityProviderType | ElementProps\n>;\n\n/* ================================================================================================================== */\n\nexport interface UseAdaptivityConditionalRender {\n  /**\n   * @deprecated Since 8.0.0. Будет удалено в **VKUI v10** – используйте `density` (см. Https://github.com/VKCOM/VKUI/issues/9015).\n   */\n  sizeX: AdaptiveDensityType; // TODO [>=10]: #9015 Удалить свойство.\n  /**\n   * @deprecated Since 8.0.0. Будет удалено в **VKUI v10** – используйте `density` (см. Https://github.com/VKCOM/VKUI/issues/9015).\n   */\n  sizeY: AdaptiveDensityType; // TODO [>=10]: #9015 Удалить свойство.\n  density: AdaptiveDensityType;\n  viewWidth: AdaptiveViewWidth;\n  deviceType: AdaptiveDeviceType;\n}\n"],"names":[],"mappings":"AAkCA,sHAAsH,GAEtH,WAYC"}
+{"version":3,"sources":["../../../../src/hooks/useAdaptivityConditionalRender/types.ts"],"sourcesContent":["import type { CSSBreakpoints, DensityTypeValues } from '../../lib/adaptivity';\n\nexport type ForcedHiddenByAdaptivityProviderType = false; // имеется ввиду, что зашили значение, например, <AdaptivityProvider density=\"regular\" />\n\nexport type ElementProps = { className: string };\n\n/* ================================================================================================================== */\n\nexport type AdaptiveDensityType = Record<\n  DensityTypeValues,\n  ForcedHiddenByAdaptivityProviderType | ElementProps\n>;\n\n/* ================================================================================================================== */\n\nexport type ViewWidthCSSBreakpoints = Extract<\n  CSSBreakpoints,\n  'smallTabletMinus' | 'smallTabletPlus' | 'tabletMinus' | 'tabletPlus'\n>;\n\nexport type AdaptiveViewWidth = Record<\n  ViewWidthCSSBreakpoints,\n  ForcedHiddenByAdaptivityProviderType | ElementProps\n>;\n\n/* ================================================================================================================== */\n\nexport type DeviceTypeCSSBreakpoints = 'mobile' | 'desktop';\n\nexport type AdaptiveDeviceType = Record<\n  DeviceTypeCSSBreakpoints,\n  ForcedHiddenByAdaptivityProviderType | ElementProps\n>;\n\n/* ================================================================================================================== */\n\nexport interface UseAdaptivityConditionalRender {\n  /**\n   * @deprecated Since 8.0.0. Будет удалено в **VKUI v10** – используйте `density` (https://github.com/VKCOM/VKUI/issues/9015).\n   */\n  sizeX: AdaptiveDensityType; // TODO [>=10]: #9015 Удалить свойство.\n  /**\n   * @deprecated Since 8.0.0. Будет удалено в **VKUI v10** – используйте `density` (https://github.com/VKCOM/VKUI/issues/9015).\n   */\n  sizeY: AdaptiveDensityType; // TODO [>=10]: #9015 Удалить свойство.\n  density: AdaptiveDensityType;\n  viewWidth: AdaptiveViewWidth;\n  deviceType: AdaptiveDeviceType;\n}\n"],"names":[],"mappings":"AAkCA,sHAAsH,GAEtH,WAYC"}

package/dist/cssm/hooks/useAnimationFrame.js

@@ -0,0 +1,40 @@
+import * as React from "react";
+import { useStableCallback } from "./useStableCallback.js";
+/**
+ * Обертка над `requestAnimationFrame`
+ *
+ * ```ts
+ * const animate = React.useCallback((delta: number) => {
+ *   console.log('Delta:', delta);
+ * }, []);
+ *
+ * useAnimationFrame(animate);
+ * ```
+ *
+ * @param callback Функция, которая будет вызываться каждый раз при обновлении анимации.
+ * Принимает параметр `delta` - время в миллисекундах, прошедшее с первого кадра анимации.
+ */ export function useAnimationFrame(callback, disableAnimation = false) {
+    const handleRef = React.useRef(undefined);
+    const startTimestampRef = React.useRef(undefined);
+    const stableCallback = useStableCallback(callback);
+    React.useEffect(()=>{
+        if (disableAnimation) {
+            return;
+        }
+        const animate = (timestamp)=>{
+            if (startTimestampRef.current === undefined) {
+                startTimestampRef.current = timestamp;
+            }
+            const delta = timestamp - startTimestampRef.current;
+            stableCallback(delta);
+            handleRef.current = requestAnimationFrame(animate);
+        };
+        handleRef.current = requestAnimationFrame(animate);
+        return ()=>cancelAnimationFrame(handleRef.current);
+    }, [
+        disableAnimation,
+        stableCallback
+    ]);
+}
+
+//# sourceMappingURL=useAnimationFrame.js.map

package/dist/cssm/hooks/useAnimationFrame.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/hooks/useAnimationFrame.tsx"],"sourcesContent":["import * as React from 'react';\nimport { useStableCallback } from './useStableCallback';\n\n/**\n * Обертка над `requestAnimationFrame`\n *\n * ```ts\n * const animate = React.useCallback((delta: number) => {\n *   console.log('Delta:', delta);\n * }, []);\n *\n * useAnimationFrame(animate);\n * ```\n *\n * @param callback Функция, которая будет вызываться каждый раз при обновлении анимации.\n * Принимает параметр `delta` - время в миллисекундах, прошедшее с первого кадра анимации.\n */\nexport function useAnimationFrame(callback: (delta: number) => void, disableAnimation = false) {\n  const handleRef = React.useRef<number>(undefined);\n  const startTimestampRef = React.useRef<number>(undefined);\n  const stableCallback = useStableCallback(callback);\n\n  React.useEffect(() => {\n    if (disableAnimation) {\n      return;\n    }\n\n    const animate = (timestamp: number) => {\n      if (startTimestampRef.current === undefined) {\n        startTimestampRef.current = timestamp;\n      }\n\n      const delta = timestamp - startTimestampRef.current;\n      stableCallback(delta);\n\n      handleRef.current = requestAnimationFrame(animate);\n    };\n\n    handleRef.current = requestAnimationFrame(animate);\n    return () => cancelAnimationFrame(handleRef.current!);\n  }, [disableAnimation, stableCallback]);\n}\n"],"names":["React","useStableCallback","useAnimationFrame","callback","disableAnimation","handleRef","useRef","undefined","startTimestampRef","stableCallback","useEffect","animate","timestamp","current","delta","requestAnimationFrame","cancelAnimationFrame"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,iBAAiB,QAAQ,yBAAsB;AAExD;;;;;;;;;;;;;CAaC,GACD,OAAO,SAASC,kBAAkBC,QAAiC,EAAEC,mBAAmB,KAAK;IAC3F,MAAMC,YAAYL,MAAMM,MAAM,CAASC;IACvC,MAAMC,oBAAoBR,MAAMM,MAAM,CAASC;IAC/C,MAAME,iBAAiBR,kBAAkBE;IAEzCH,MAAMU,SAAS,CAAC;QACd,IAAIN,kBAAkB;YACpB;QACF;QAEA,MAAMO,UAAU,CAACC;YACf,IAAIJ,kBAAkBK,OAAO,KAAKN,WAAW;gBAC3CC,kBAAkBK,OAAO,GAAGD;YAC9B;YAEA,MAAME,QAAQF,YAAYJ,kBAAkBK,OAAO;YACnDJ,eAAeK;YAEfT,UAAUQ,OAAO,GAAGE,sBAAsBJ;QAC5C;QAEAN,UAAUQ,OAAO,GAAGE,sBAAsBJ;QAC1C,OAAO,IAAMK,qBAAqBX,UAAUQ,OAAO;IACrD,GAAG;QAACT;QAAkBK;KAAe;AACvC"}

package/dist/cssm/hooks/useAutoFocus.js

@@ -5,7 +5,10 @@ export function useAutoFocus(ref, autoFocus) {
             return;
         }
         ref.current.focus();
-    }, []);
+    }, [
+        autoFocus,
+        ref
+    ]);
 }
 
 //# sourceMappingURL=useAutoFocus.js.map

package/dist/cssm/hooks/useAutoFocus.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/hooks/useAutoFocus.ts"],"sourcesContent":["import type * as React from 'react';\nimport { useIsomorphicLayoutEffect } from '../lib/useIsomorphicLayoutEffect';\n\nexport function useAutoFocus(\n  ref: React.RefObject<HTMLElement | null>,\n  autoFocus: boolean | undefined,\n): void {\n  useIsomorphicLayoutEffect(() => {\n    if (!autoFocus || !ref.current) {\n      return;\n    }\n\n    ref.current.focus();\n  }, []);\n}\n"],"names":["useIsomorphicLayoutEffect","useAutoFocus","ref","autoFocus","current","focus"],"mappings":"AACA,SAASA,yBAAyB,QAAQ,sCAAmC;AAE7E,OAAO,SAASC,aACdC,GAAwC,EACxCC,SAA8B;IAE9BH,0BAA0B;QACxB,IAAI,CAACG,aAAa,CAACD,IAAIE,OAAO,EAAE;YAC9B;QACF;QAEAF,IAAIE,OAAO,CAACC,KAAK;IACnB,GAAG,EAAE;AACP"}
+{"version":3,"sources":["../../../src/hooks/useAutoFocus.ts"],"sourcesContent":["import type * as React from 'react';\nimport { useIsomorphicLayoutEffect } from '../lib/useIsomorphicLayoutEffect';\n\nexport function useAutoFocus(\n  ref: React.RefObject<HTMLElement | null>,\n  autoFocus: boolean | undefined,\n): void {\n  useIsomorphicLayoutEffect(() => {\n    if (!autoFocus || !ref.current) {\n      return;\n    }\n\n    ref.current.focus();\n  }, [autoFocus, ref]);\n}\n"],"names":["useIsomorphicLayoutEffect","useAutoFocus","ref","autoFocus","current","focus"],"mappings":"AACA,SAASA,yBAAyB,QAAQ,sCAAmC;AAE7E,OAAO,SAASC,aACdC,GAAwC,EACxCC,SAA8B;IAE9BH,0BAA0B;QACxB,IAAI,CAACG,aAAa,CAACD,IAAIE,OAAO,EAAE;YAC9B;QACF;QAEAF,IAAIE,OAAO,CAACC,KAAK;IACnB,GAAG;QAACF;QAAWD;KAAI;AACrB"}

package/dist/cssm/hooks/useColorScheme.js

@@ -1,8 +1,8 @@
-import { useConfigProvider } from "../components/ConfigProvider/ConfigProviderContext.js";
+import * as React from "react";
+import { ColorSchemeContext } from "../components/ConfigProvider/ConfigProviderSubContexts.js";
 import { DEFAULT_COLOR_SCHEME } from "../lib/colorScheme/index.js";
 export function useColorScheme() {
-    const { colorScheme } = useConfigProvider();
-    return colorScheme ?? DEFAULT_COLOR_SCHEME;
+    return React.useContext(ColorSchemeContext) ?? DEFAULT_COLOR_SCHEME;
 }
 
 //# sourceMappingURL=useColorScheme.js.map

package/dist/cssm/hooks/useColorScheme.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/hooks/useColorScheme.ts"],"sourcesContent":["import { useConfigProvider } from '../components/ConfigProvider/ConfigProviderContext';\nimport { type ColorSchemeType, DEFAULT_COLOR_SCHEME } from '../lib/colorScheme';\n\nexport function useColorScheme(): ColorSchemeType {\n  const { colorScheme } = useConfigProvider();\n\n  return colorScheme ?? DEFAULT_COLOR_SCHEME;\n}\n"],"names":["useConfigProvider","DEFAULT_COLOR_SCHEME","useColorScheme","colorScheme"],"mappings":"AAAA,SAASA,iBAAiB,QAAQ,wDAAqD;AACvF,SAA+BC,oBAAoB,QAAQ,8BAAqB;AAEhF,OAAO,SAASC;IACd,MAAM,EAAEC,WAAW,EAAE,GAAGH;IAExB,OAAOG,eAAeF;AACxB"}
+{"version":3,"sources":["../../../src/hooks/useColorScheme.ts"],"sourcesContent":["import * as React from 'react';\nimport { ColorSchemeContext } from '../components/ConfigProvider/ConfigProviderSubContexts';\nimport { type ColorSchemeType, DEFAULT_COLOR_SCHEME } from '../lib/colorScheme';\n\nexport function useColorScheme(): ColorSchemeType {\n  return React.useContext(ColorSchemeContext) ?? DEFAULT_COLOR_SCHEME;\n}\n"],"names":["React","ColorSchemeContext","DEFAULT_COLOR_SCHEME","useColorScheme","useContext"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,kBAAkB,QAAQ,4DAAyD;AAC5F,SAA+BC,oBAAoB,QAAQ,8BAAqB;AAEhF,OAAO,SAASC;IACd,OAAOH,MAAMI,UAAU,CAACH,uBAAuBC;AACjD"}

package/dist/cssm/hooks/useConfigDirection.js

@@ -1,7 +1,7 @@
-import { useConfigProvider } from "../components/ConfigProvider/ConfigProviderContext.js";
+import * as React from "react";
+import { DirectionContext } from "../components/ConfigProvider/ConfigProviderSubContexts.js";
 export function useConfigDirection() {
-    const { direction } = useConfigProvider();
-    return direction || 'ltr';
+    return React.useContext(DirectionContext) || 'ltr';
 }
 
 //# sourceMappingURL=useConfigDirection.js.map

package/dist/cssm/hooks/useConfigDirection.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/hooks/useConfigDirection.ts"],"sourcesContent":["import { useConfigProvider } from '../components/ConfigProvider/ConfigProviderContext';\nimport type { Direction } from '../lib/direction';\n\nexport function useConfigDirection(): Direction {\n  const { direction } = useConfigProvider();\n\n  return direction || 'ltr';\n}\n"],"names":["useConfigProvider","useConfigDirection","direction"],"mappings":"AAAA,SAASA,iBAAiB,QAAQ,wDAAqD;AAGvF,OAAO,SAASC;IACd,MAAM,EAAEC,SAAS,EAAE,GAAGF;IAEtB,OAAOE,aAAa;AACtB"}
+{"version":3,"sources":["../../../src/hooks/useConfigDirection.ts"],"sourcesContent":["import * as React from 'react';\nimport { DirectionContext } from '../components/ConfigProvider/ConfigProviderSubContexts';\nimport type { Direction } from '../lib/direction';\n\nexport function useConfigDirection(): Direction {\n  return React.useContext(DirectionContext) || 'ltr';\n}\n"],"names":["React","DirectionContext","useConfigDirection","useContext"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,gBAAgB,QAAQ,4DAAyD;AAG1F,OAAO,SAASC;IACd,OAAOF,MAAMG,UAAU,CAACF,qBAAqB;AAC/C"}

package/dist/cssm/hooks/useDateInput.js

@@ -3,14 +3,13 @@ import * as React from "react";
 import { useDOM } from "../lib/dom.js";
 import { useBooleanState } from "./useBooleanState.js";
 export function useDateInput({ maxElement, refs, autoFocus, disabled, elementsConfig, onClear, onInternalValueChange, getInternalValue, value, onCalendarOpenChanged, accessible }) {
-    const { document } = useDOM();
+    const { document, window } = useDOM();
     const [open, openCalendar, closeCalendar] = useBooleanState(false);
     const rootRef = React.useRef(null);
     const calendarRef = React.useRef(null);
     const [internalValue, setInternalValue] = React.useState([]);
     const [focusedElement, setFocusedElement] = React.useState(null);
     const isClickedOutsideRef = React.useRef(false);
-    const { window } = useDOM();
     const handleRestoreFocus = React.useCallback(()=>{
         // если календарь был закрыт кликом вне календаря
         // то FocusTrap возвращать фокус не должен

package/dist/cssm/hooks/useDateInput.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/hooks/useDateInput.ts"],"sourcesContent":["import { useCallback } from 'react';\nimport * as React from 'react';\nimport { useDOM } from '../lib/dom';\nimport { useBooleanState } from './useBooleanState';\n\nexport interface UseDateInputDependencies<T, D> {\n  maxElement: number;\n  refs: Array<React.RefObject<T | null>>;\n  autoFocus?: boolean | undefined;\n  disabled?: boolean | undefined;\n  value?: D | null | undefined;\n  elementsConfig: (index: number) => {\n    length: number;\n    min: number;\n    max: number;\n  };\n  onInternalValueChange: (value: string[]) => void;\n  getInternalValue: (value?: D | null | undefined) => string[];\n  onClear: () => void;\n  onCalendarOpenChanged?: ((opened: boolean) => void) | undefined;\n  accessible?: boolean | undefined;\n}\n\nexport function useDateInput<T extends HTMLElement, D>({\n  maxElement,\n  refs,\n  autoFocus,\n  disabled,\n  elementsConfig,\n  onClear,\n  onInternalValueChange,\n  getInternalValue,\n  value,\n  onCalendarOpenChanged,\n  accessible,\n}: UseDateInputDependencies<T, D>): {\n  rootRef: React.RefObject<HTMLDivElement | null>;\n  calendarRef: React.RefObject<HTMLDivElement | null>;\n  open: boolean;\n  openCalendar: () => void;\n  closeCalendar: () => void;\n  toggleCalendar: () => void;\n  internalValue: string[];\n  focusedElement: number | null;\n  setFocusedElement: React.Dispatch<React.SetStateAction<number | null>>;\n  handleKeyDown: (e: React.KeyboardEvent<HTMLSpanElement>) => void;\n  clear: () => void;\n  handleFieldEnter: () => void;\n  removeFocusFromField: () => void;\n  handleRestoreFocus: () => boolean;\n} {\n  const { document } = useDOM();\n  const [open, openCalendar, closeCalendar] = useBooleanState(false);\n  const rootRef = React.useRef<HTMLDivElement | null>(null);\n  const calendarRef = React.useRef<HTMLDivElement | null>(null);\n  const [internalValue, setInternalValue] = React.useState<string[]>([]);\n  const [focusedElement, setFocusedElement] = React.useState<number | null>(null);\n  const isClickedOutsideRef = React.useRef(false);\n  const { window } = useDOM();\n\n  const handleRestoreFocus = React.useCallback(() => {\n    // если календарь был закрыт кликом вне календаря\n    // то FocusTrap возвращать фокус не должен\n    return !isClickedOutsideRef.current;\n  }, []);\n\n  const _onCalendarClose = useCallback(() => {\n    if (open) {\n      closeCalendar();\n      onCalendarOpenChanged?.(false);\n    }\n  }, [closeCalendar, onCalendarOpenChanged, open]);\n\n  const _onCalendarOpen = useCallback(() => {\n    if (!open) {\n      openCalendar();\n      onCalendarOpenChanged?.(true);\n      if (accessible) {\n        setFocusedElement(null);\n      }\n      isClickedOutsideRef.current = false;\n    }\n  }, [onCalendarOpenChanged, open, openCalendar, accessible]);\n\n  const resetFocusedElement = React.useCallback(() => {\n    if (focusedElement !== null) {\n      setFocusedElement(null);\n      window!.getSelection()?.removeAllRanges();\n      setInternalValue(getInternalValue(value));\n    }\n  }, [focusedElement, getInternalValue, value, window]);\n\n  const removeFocusFromField = React.useCallback(() => {\n    resetFocusedElement();\n    _onCalendarClose();\n  }, [resetFocusedElement, _onCalendarClose]);\n\n  const toggleCalendar = useCallback(() => {\n    resetFocusedElement();\n    if (open) {\n      _onCalendarClose();\n    } else {\n      _onCalendarOpen();\n    }\n  }, [resetFocusedElement, open, _onCalendarClose, _onCalendarOpen]);\n\n  const handleClickOutside = React.useCallback(\n    (e: MouseEvent) => {\n      if (\n        !rootRef.current?.contains(e.target as Node | null) &&\n        !calendarRef.current?.contains(e.target as Node | null)\n      ) {\n        isClickedOutsideRef.current = true;\n        removeFocusFromField();\n      }\n    },\n    [removeFocusFromField],\n  );\n\n  const selectFirst = React.useCallback(() => {\n    if (focusedElement !== null) {\n      return;\n    }\n\n    setFocusedElement(0);\n  }, [focusedElement]);\n\n  React.useEffect(() => {\n    document!.addEventListener('click', handleClickOutside, {\n      capture: true,\n    });\n\n    return () =>\n      document!.removeEventListener('click', handleClickOutside, {\n        capture: true,\n      });\n  }, [document, handleClickOutside]);\n\n  React.useEffect(() => {\n    setInternalValue(getInternalValue(value));\n  }, [getInternalValue, value]);\n\n  React.useEffect(() => {\n    if (autoFocus) {\n      selectFirst();\n    }\n  }, [autoFocus, selectFirst]);\n\n  React.useEffect(() => {\n    if (disabled || focusedElement === null) {\n      return;\n    }\n\n    const range = window!.document.createRange();\n\n    let element = refs[focusedElement].current;\n\n    let timerId: ReturnType<typeof setTimeout>;\n    if (element) {\n      element.focus();\n      if (!accessible) {\n        _onCalendarOpen();\n      }\n      range.selectNodeContents(element as Node);\n\n      // Fix для Firefox: setTimeout нужен чтобы отложить range selection на\n      // какое-то время, иначе, при фокусе на InputLike\n      // извне, контент визуально не будет выбран\n      timerId = setTimeout(() => {\n        const selection = window!.getSelection();\n        selection?.removeAllRanges();\n        selection?.addRange(range);\n      }, 0);\n    }\n\n    return () => {\n      clearTimeout(timerId);\n    };\n  }, [disabled, focusedElement, refs, window, _onCalendarOpen, accessible]);\n\n  const clear = React.useCallback(() => {\n    onClear?.();\n    selectFirst();\n  }, [onClear, selectFirst]);\n\n  const handleFieldEnter = React.useCallback(() => {\n    selectFirst();\n  }, [selectFirst]);\n\n  const handleKeyDown = React.useCallback(\n    (e: React.KeyboardEvent<HTMLSpanElement>) => {\n      if (focusedElement === null) {\n        return;\n      }\n\n      const _value = [...internalValue];\n      const config = elementsConfig(focusedElement);\n\n      if (/^\\d+$/.test(e.key)) {\n        if (_value[focusedElement].length >= config.length) {\n          _value[focusedElement] = e.key;\n        } else {\n          _value[focusedElement] += e.key;\n          if (_value[focusedElement].length >= config.length && focusedElement < maxElement) {\n            setFocusedElement(focusedElement + 1);\n          }\n        }\n      } else if (e.key === 'Backspace') {\n        if (!_value[focusedElement]) {\n          setFocusedElement(focusedElement <= 0 ? maxElement : focusedElement - 1);\n        } else {\n          _value[focusedElement] = _value[focusedElement].slice(0, -1);\n        }\n      } else if (e.key === 'ArrowDown' || e.key === 'Down') {\n        let currentValue = Number(_value[focusedElement]);\n        _value[focusedElement] = String(\n          currentValue <= config.min ? config.max : currentValue - 1,\n        ).padStart(config.length, '0');\n      } else if (e.key === 'ArrowUp' || e.key === 'Up') {\n        let currentValue = Number(_value[focusedElement]);\n        _value[focusedElement] = String(\n          currentValue >= config.max ? config.min : currentValue + 1,\n        ).padStart(config.length, '0');\n      } else if (e.key === 'ArrowLeft' || e.key === 'Left' || (e.key === 'Tab' && e.shiftKey)) {\n        if (focusedElement <= 0) {\n          if (e.key === 'Tab') {\n            removeFocusFromField();\n          }\n          return;\n        }\n        setFocusedElement(focusedElement - 1);\n      } else if (e.key === 'ArrowRight' || e.key === 'Right' || e.key === 'Tab') {\n        if (focusedElement >= maxElement) {\n          if (e.key === 'Tab') {\n            removeFocusFromField();\n          }\n          return;\n        }\n\n        setFocusedElement(focusedElement + 1);\n      } else if (e.key === 'Delete' || e.key === 'Del') {\n        _value[focusedElement] = '';\n      } else if (e.key === ' ') {\n        e.preventDefault();\n        _onCalendarOpen();\n        return;\n      } else {\n        return;\n      }\n\n      e.preventDefault();\n      setInternalValue(_value);\n      onInternalValueChange(_value);\n    },\n    [\n      _onCalendarOpen,\n      removeFocusFromField,\n      elementsConfig,\n      focusedElement,\n      internalValue,\n      maxElement,\n      onInternalValueChange,\n    ],\n  );\n\n  return {\n    rootRef,\n    calendarRef,\n    open,\n    openCalendar: _onCalendarOpen,\n    closeCalendar: _onCalendarClose,\n    toggleCalendar,\n    internalValue,\n    focusedElement,\n    setFocusedElement,\n    handleKeyDown,\n    clear,\n    handleFieldEnter,\n    removeFocusFromField,\n    handleRestoreFocus,\n  };\n}\n"],"names":["useCallback","React","useDOM","useBooleanState","useDateInput","maxElement","refs","autoFocus","disabled","elementsConfig","onClear","onInternalValueChange","getInternalValue","value","onCalendarOpenChanged","accessible","document","open","openCalendar","closeCalendar","rootRef","useRef","calendarRef","internalValue","setInternalValue","useState","focusedElement","setFocusedElement","isClickedOutsideRef","window","handleRestoreFocus","current","_onCalendarClose","_onCalendarOpen","resetFocusedElement","getSelection","removeAllRanges","removeFocusFromField","toggleCalendar","handleClickOutside","e","contains","target","selectFirst","useEffect","addEventListener","capture","removeEventListener","range","createRange","element","timerId","focus","selectNodeContents","setTimeout","selection","addRange","clearTimeout","clear","handleFieldEnter","handleKeyDown","_value","config","test","key","length","slice","currentValue","Number","String","min","max","padStart","shiftKey","preventDefault"],"mappings":"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"}
+{"version":3,"sources":["../../../src/hooks/useDateInput.ts"],"sourcesContent":["import { useCallback } from 'react';\nimport * as React from 'react';\nimport { useDOM } from '../lib/dom';\nimport { useBooleanState } from './useBooleanState';\n\nexport interface UseDateInputDependencies<T, D> {\n  maxElement: number;\n  refs: Array<React.RefObject<T | null>>;\n  autoFocus?: boolean | undefined;\n  disabled?: boolean | undefined;\n  value?: D | null | undefined;\n  elementsConfig: (index: number) => {\n    length: number;\n    min: number;\n    max: number;\n  };\n  onInternalValueChange: (value: string[]) => void;\n  getInternalValue: (value?: D | null | undefined) => string[];\n  onClear: () => void;\n  onCalendarOpenChanged?: ((opened: boolean) => void) | undefined;\n  accessible?: boolean | undefined;\n}\n\nexport function useDateInput<T extends HTMLElement, D>({\n  maxElement,\n  refs,\n  autoFocus,\n  disabled,\n  elementsConfig,\n  onClear,\n  onInternalValueChange,\n  getInternalValue,\n  value,\n  onCalendarOpenChanged,\n  accessible,\n}: UseDateInputDependencies<T, D>): {\n  rootRef: React.RefObject<HTMLDivElement | null>;\n  calendarRef: React.RefObject<HTMLDivElement | null>;\n  open: boolean;\n  openCalendar: () => void;\n  closeCalendar: () => void;\n  toggleCalendar: () => void;\n  internalValue: string[];\n  focusedElement: number | null;\n  setFocusedElement: React.Dispatch<React.SetStateAction<number | null>>;\n  handleKeyDown: (e: React.KeyboardEvent<HTMLSpanElement>) => void;\n  clear: () => void;\n  handleFieldEnter: () => void;\n  removeFocusFromField: () => void;\n  handleRestoreFocus: () => boolean;\n} {\n  const { document, window } = useDOM();\n  const [open, openCalendar, closeCalendar] = useBooleanState(false);\n  const rootRef = React.useRef<HTMLDivElement | null>(null);\n  const calendarRef = React.useRef<HTMLDivElement | null>(null);\n  const [internalValue, setInternalValue] = React.useState<string[]>([]);\n  const [focusedElement, setFocusedElement] = React.useState<number | null>(null);\n  const isClickedOutsideRef = React.useRef(false);\n\n  const handleRestoreFocus = React.useCallback(() => {\n    // если календарь был закрыт кликом вне календаря\n    // то FocusTrap возвращать фокус не должен\n    return !isClickedOutsideRef.current;\n  }, []);\n\n  const _onCalendarClose = useCallback(() => {\n    if (open) {\n      closeCalendar();\n      onCalendarOpenChanged?.(false);\n    }\n  }, [closeCalendar, onCalendarOpenChanged, open]);\n\n  const _onCalendarOpen = useCallback(() => {\n    if (!open) {\n      openCalendar();\n      onCalendarOpenChanged?.(true);\n      if (accessible) {\n        setFocusedElement(null);\n      }\n      isClickedOutsideRef.current = false;\n    }\n  }, [onCalendarOpenChanged, open, openCalendar, accessible]);\n\n  const resetFocusedElement = React.useCallback(() => {\n    if (focusedElement !== null) {\n      setFocusedElement(null);\n      window!.getSelection()?.removeAllRanges();\n      setInternalValue(getInternalValue(value));\n    }\n  }, [focusedElement, getInternalValue, value, window]);\n\n  const removeFocusFromField = React.useCallback(() => {\n    resetFocusedElement();\n    _onCalendarClose();\n  }, [resetFocusedElement, _onCalendarClose]);\n\n  const toggleCalendar = useCallback(() => {\n    resetFocusedElement();\n    if (open) {\n      _onCalendarClose();\n    } else {\n      _onCalendarOpen();\n    }\n  }, [resetFocusedElement, open, _onCalendarClose, _onCalendarOpen]);\n\n  const handleClickOutside = React.useCallback(\n    (e: MouseEvent) => {\n      if (\n        !rootRef.current?.contains(e.target as Node | null) &&\n        !calendarRef.current?.contains(e.target as Node | null)\n      ) {\n        isClickedOutsideRef.current = true;\n        removeFocusFromField();\n      }\n    },\n    [removeFocusFromField],\n  );\n\n  const selectFirst = React.useCallback(() => {\n    if (focusedElement !== null) {\n      return;\n    }\n\n    setFocusedElement(0);\n  }, [focusedElement]);\n\n  React.useEffect(() => {\n    document!.addEventListener('click', handleClickOutside, {\n      capture: true,\n    });\n\n    return () =>\n      document!.removeEventListener('click', handleClickOutside, {\n        capture: true,\n      });\n  }, [document, handleClickOutside]);\n\n  React.useEffect(() => {\n    setInternalValue(getInternalValue(value));\n  }, [getInternalValue, value]);\n\n  React.useEffect(() => {\n    if (autoFocus) {\n      selectFirst();\n    }\n  }, [autoFocus, selectFirst]);\n\n  React.useEffect(() => {\n    if (disabled || focusedElement === null) {\n      return;\n    }\n\n    const range = window!.document.createRange();\n\n    let element = refs[focusedElement].current;\n\n    let timerId: ReturnType<typeof setTimeout>;\n    if (element) {\n      element.focus();\n      if (!accessible) {\n        _onCalendarOpen();\n      }\n      range.selectNodeContents(element as Node);\n\n      // Fix для Firefox: setTimeout нужен чтобы отложить range selection на\n      // какое-то время, иначе, при фокусе на InputLike\n      // извне, контент визуально не будет выбран\n      timerId = setTimeout(() => {\n        const selection = window!.getSelection();\n        selection?.removeAllRanges();\n        selection?.addRange(range);\n      }, 0);\n    }\n\n    return () => {\n      clearTimeout(timerId);\n    };\n  }, [disabled, focusedElement, refs, window, _onCalendarOpen, accessible]);\n\n  const clear = React.useCallback(() => {\n    onClear?.();\n    selectFirst();\n  }, [onClear, selectFirst]);\n\n  const handleFieldEnter = React.useCallback(() => {\n    selectFirst();\n  }, [selectFirst]);\n\n  const handleKeyDown = React.useCallback(\n    (e: React.KeyboardEvent<HTMLSpanElement>) => {\n      if (focusedElement === null) {\n        return;\n      }\n\n      const _value = [...internalValue];\n      const config = elementsConfig(focusedElement);\n\n      if (/^\\d+$/.test(e.key)) {\n        if (_value[focusedElement].length >= config.length) {\n          _value[focusedElement] = e.key;\n        } else {\n          _value[focusedElement] += e.key;\n          if (_value[focusedElement].length >= config.length && focusedElement < maxElement) {\n            setFocusedElement(focusedElement + 1);\n          }\n        }\n      } else if (e.key === 'Backspace') {\n        if (!_value[focusedElement]) {\n          setFocusedElement(focusedElement <= 0 ? maxElement : focusedElement - 1);\n        } else {\n          _value[focusedElement] = _value[focusedElement].slice(0, -1);\n        }\n      } else if (e.key === 'ArrowDown' || e.key === 'Down') {\n        let currentValue = Number(_value[focusedElement]);\n        _value[focusedElement] = String(\n          currentValue <= config.min ? config.max : currentValue - 1,\n        ).padStart(config.length, '0');\n      } else if (e.key === 'ArrowUp' || e.key === 'Up') {\n        let currentValue = Number(_value[focusedElement]);\n        _value[focusedElement] = String(\n          currentValue >= config.max ? config.min : currentValue + 1,\n        ).padStart(config.length, '0');\n      } else if (e.key === 'ArrowLeft' || e.key === 'Left' || (e.key === 'Tab' && e.shiftKey)) {\n        if (focusedElement <= 0) {\n          if (e.key === 'Tab') {\n            removeFocusFromField();\n          }\n          return;\n        }\n        setFocusedElement(focusedElement - 1);\n      } else if (e.key === 'ArrowRight' || e.key === 'Right' || e.key === 'Tab') {\n        if (focusedElement >= maxElement) {\n          if (e.key === 'Tab') {\n            removeFocusFromField();\n          }\n          return;\n        }\n\n        setFocusedElement(focusedElement + 1);\n      } else if (e.key === 'Delete' || e.key === 'Del') {\n        _value[focusedElement] = '';\n      } else if (e.key === ' ') {\n        e.preventDefault();\n        _onCalendarOpen();\n        return;\n      } else {\n        return;\n      }\n\n      e.preventDefault();\n      setInternalValue(_value);\n      onInternalValueChange(_value);\n    },\n    [\n      _onCalendarOpen,\n      removeFocusFromField,\n      elementsConfig,\n      focusedElement,\n      internalValue,\n      maxElement,\n      onInternalValueChange,\n    ],\n  );\n\n  return {\n    rootRef,\n    calendarRef,\n    open,\n    openCalendar: _onCalendarOpen,\n    closeCalendar: _onCalendarClose,\n    toggleCalendar,\n    internalValue,\n    focusedElement,\n    setFocusedElement,\n    handleKeyDown,\n    clear,\n    handleFieldEnter,\n    removeFocusFromField,\n    handleRestoreFocus,\n  };\n}\n"],"names":["useCallback","React","useDOM","useBooleanState","useDateInput","maxElement","refs","autoFocus","disabled","elementsConfig","onClear","onInternalValueChange","getInternalValue","value","onCalendarOpenChanged","accessible","document","window","open","openCalendar","closeCalendar","rootRef","useRef","calendarRef","internalValue","setInternalValue","useState","focusedElement","setFocusedElement","isClickedOutsideRef","handleRestoreFocus","current","_onCalendarClose","_onCalendarOpen","resetFocusedElement","getSelection","removeAllRanges","removeFocusFromField","toggleCalendar","handleClickOutside","e","contains","target","selectFirst","useEffect","addEventListener","capture","removeEventListener","range","createRange","element","timerId","focus","selectNodeContents","setTimeout","selection","addRange","clearTimeout","clear","handleFieldEnter","handleKeyDown","_value","config","test","key","length","slice","currentValue","Number","String","min","max","padStart","shiftKey","preventDefault"],"mappings":"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"}

package/dist/cssm/hooks/useFocusTrap/useAutoFocus.js

@@ -20,6 +20,7 @@ export const useAutoFocus = (ref, { autoFocus, disabled, mount, autoFocusDelay,
         }, autoFocusDelay);
         return ()=>clearTimeout(timeoutId);
     }, [
+        ref,
         autoFocus,
         autoFocusDelay,
         disabled,

package/dist/cssm/hooks/useFocusTrap/useAutoFocus.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/hooks/useFocusTrap/useAutoFocus.ts"],"sourcesContent":["import type { RefObject } from 'react';\nimport { contains, getActiveElementByAnotherElement } from '../../lib/dom';\nimport { useIsomorphicLayoutEffect } from '../../lib/useIsomorphicLayoutEffect';\nimport type { RequiredFields } from '../../types';\nimport type { UseFocusTrapProps } from './useFocusTrap.tsx';\n\nexport const useAutoFocus = (\n  ref: RefObject<HTMLElement | null>,\n  {\n    autoFocus,\n    disabled,\n    mount,\n    autoFocusDelay,\n    focusFirst,\n  }: RequiredFields<UseFocusTrapProps, 'autoFocus' | 'disabled' | 'mount' | 'autoFocusDelay'> & {\n    focusFirst: () => void;\n  },\n) => {\n  useIsomorphicLayoutEffect(\n    function handleAutoFocus() {\n      if (!ref.current || !autoFocus || disabled || !mount) {\n        return;\n      }\n\n      const timeoutId = setTimeout(() => {\n        if (!ref.current) {\n          return;\n        }\n\n        const activeElement = getActiveElementByAnotherElement(ref.current);\n        if (!contains(ref.current, activeElement)) {\n          if (autoFocus === 'root') {\n            ref.current.focus();\n          } else {\n            focusFirst();\n          }\n        }\n      }, autoFocusDelay);\n\n      return () => clearTimeout(timeoutId);\n    },\n    [autoFocus, autoFocusDelay, disabled, mount, focusFirst],\n  );\n};\n"],"names":["contains","getActiveElementByAnotherElement","useIsomorphicLayoutEffect","useAutoFocus","ref","autoFocus","disabled","mount","autoFocusDelay","focusFirst","handleAutoFocus","current","timeoutId","setTimeout","activeElement","focus","clearTimeout"],"mappings":"AACA,SAASA,QAAQ,EAAEC,gCAAgC,QAAQ,mBAAgB;AAC3E,SAASC,yBAAyB,QAAQ,yCAAsC;AAIhF,OAAO,MAAMC,eAAe,CAC1BC,KACA,EACEC,SAAS,EACTC,QAAQ,EACRC,KAAK,EACLC,cAAc,EACdC,UAAU,EAGX;IAEDP,0BACE,SAASQ;QACP,IAAI,CAACN,IAAIO,OAAO,IAAI,CAACN,aAAaC,YAAY,CAACC,OAAO;YACpD;QACF;QAEA,MAAMK,YAAYC,WAAW;YAC3B,IAAI,CAACT,IAAIO,OAAO,EAAE;gBAChB;YACF;YAEA,MAAMG,gBAAgBb,iCAAiCG,IAAIO,OAAO;YAClE,IAAI,CAACX,SAASI,IAAIO,OAAO,EAAEG,gBAAgB;gBACzC,IAAIT,cAAc,QAAQ;oBACxBD,IAAIO,OAAO,CAACI,KAAK;gBACnB,OAAO;oBACLN;gBACF;YACF;QACF,GAAGD;QAEH,OAAO,IAAMQ,aAAaJ;IAC5B,GACA;QAACP;QAAWG;QAAgBF;QAAUC;QAAOE;KAAW;AAE5D,EAAE"}
+{"version":3,"sources":["../../../../src/hooks/useFocusTrap/useAutoFocus.ts"],"sourcesContent":["import type { RefObject } from 'react';\nimport { contains, getActiveElementByAnotherElement } from '../../lib/dom';\nimport { useIsomorphicLayoutEffect } from '../../lib/useIsomorphicLayoutEffect';\nimport type { RequiredFields } from '../../types';\nimport type { UseFocusTrapProps } from './useFocusTrap.tsx';\n\nexport const useAutoFocus = (\n  ref: RefObject<HTMLElement | null>,\n  {\n    autoFocus,\n    disabled,\n    mount,\n    autoFocusDelay,\n    focusFirst,\n  }: RequiredFields<UseFocusTrapProps, 'autoFocus' | 'disabled' | 'mount' | 'autoFocusDelay'> & {\n    focusFirst: () => void;\n  },\n) => {\n  useIsomorphicLayoutEffect(\n    function handleAutoFocus() {\n      if (!ref.current || !autoFocus || disabled || !mount) {\n        return;\n      }\n\n      const timeoutId = setTimeout(() => {\n        if (!ref.current) {\n          return;\n        }\n\n        const activeElement = getActiveElementByAnotherElement(ref.current);\n        if (!contains(ref.current, activeElement)) {\n          if (autoFocus === 'root') {\n            ref.current.focus();\n          } else {\n            focusFirst();\n          }\n        }\n      }, autoFocusDelay);\n\n      return () => clearTimeout(timeoutId);\n    },\n    [ref, autoFocus, autoFocusDelay, disabled, mount, focusFirst],\n  );\n};\n"],"names":["contains","getActiveElementByAnotherElement","useIsomorphicLayoutEffect","useAutoFocus","ref","autoFocus","disabled","mount","autoFocusDelay","focusFirst","handleAutoFocus","current","timeoutId","setTimeout","activeElement","focus","clearTimeout"],"mappings":"AACA,SAASA,QAAQ,EAAEC,gCAAgC,QAAQ,mBAAgB;AAC3E,SAASC,yBAAyB,QAAQ,yCAAsC;AAIhF,OAAO,MAAMC,eAAe,CAC1BC,KACA,EACEC,SAAS,EACTC,QAAQ,EACRC,KAAK,EACLC,cAAc,EACdC,UAAU,EAGX;IAEDP,0BACE,SAASQ;QACP,IAAI,CAACN,IAAIO,OAAO,IAAI,CAACN,aAAaC,YAAY,CAACC,OAAO;YACpD;QACF;QAEA,MAAMK,YAAYC,WAAW;YAC3B,IAAI,CAACT,IAAIO,OAAO,EAAE;gBAChB;YACF;YAEA,MAAMG,gBAAgBb,iCAAiCG,IAAIO,OAAO;YAClE,IAAI,CAACX,SAASI,IAAIO,OAAO,EAAEG,gBAAgB;gBACzC,IAAIT,cAAc,QAAQ;oBACxBD,IAAIO,OAAO,CAACI,KAAK;gBACnB,OAAO;oBACLN;gBACF;YACF;QACF,GAAGD;QAEH,OAAO,IAAMQ,aAAaJ;IAC5B,GACA;QAACR;QAAKC;QAAWG;QAAgBF;QAAUC;QAAOE;KAAW;AAEjE,EAAE"}