@vkontakte/vkui 5.5.4 → 5.6.0

package/dist/components/CalendarDays/CalendarDays.js

@@ -66,10 +66,11 @@ export var CalendarDays = function(_param) {
             className: "vkuiCalendarDays__weekday"
         }, dayName);
     })), weeks.map(function(week, i) {
-        /*#__PURE__*/ return React.createElement("div", {
+        return /*#__PURE__*/ React.createElement("div", {
             className: classNames("vkuiCalendarDays__row", size === "s" && "vkuiCalendarDays__row--size-s"),
             key: i
         }, week.map(function(day, i) {
+            var _isHintedDaySelectionStart, _isHintedDaySelectionEnd, _isDaySelected, _isDayHinted;
             var sameMonth = isSameMonth(day, viewDate);
             return /*#__PURE__*/ React.createElement(CalendarDay, _object_spread({
                 key: day.toISOString(),
@@ -81,13 +82,13 @@ export var CalendarDays = function(_param) {
                 disabled: isDayDisabled(day),
                 selectionStart: isDaySelectionStart(day, i),
                 selectionEnd: isDaySelectionEnd(day, i),
-                hintedSelectionStart: isHintedDaySelectionStart === null || isHintedDaySelectionStart === void 0 ? void 0 : isHintedDaySelectionStart(day, i),
-                hintedSelectionEnd: isHintedDaySelectionEnd === null || isHintedDaySelectionEnd === void 0 ? void 0 : isHintedDaySelectionEnd(day, i),
-                selected: isDaySelected === null || isDaySelected === void 0 ? void 0 : isDaySelected(day),
+                hintedSelectionStart: (_isHintedDaySelectionStart = isHintedDaySelectionStart) === null || _isHintedDaySelectionStart === void 0 ? void 0 : _isHintedDaySelectionStart(day, i),
+                hintedSelectionEnd: (_isHintedDaySelectionEnd = isHintedDaySelectionEnd) === null || _isHintedDaySelectionEnd === void 0 ? void 0 : _isHintedDaySelectionEnd(day, i),
+                selected: (_isDaySelected = isDaySelected) === null || _isDaySelected === void 0 ? void 0 : _isDaySelected(day),
                 focused: isDayFocused(day),
                 onEnter: onDayEnter,
                 onLeave: onDayLeave,
-                hinted: isDayHinted === null || isDayHinted === void 0 ? void 0 : isDayHinted(day),
+                hinted: (_isDayHinted = isDayHinted) === null || _isDayHinted === void 0 ? void 0 : _isDayHinted(day),
                 sameMonth: sameMonth,
                 size: size
             }, dayProps));

package/dist/components/CalendarDays/CalendarDays.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/CalendarDays/CalendarDays.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { useTodayDate } from '../../hooks/useTodayDate';\nimport { getDaysNames, getWeeks } from '../../lib/calendar';\nimport { isSameDay, isSameMonth } from '../../lib/date';\nimport { CalendarDay, CalendarDayElementProps } from '../CalendarDay/CalendarDay';\nimport { useConfigProvider } from '../ConfigProvider/ConfigProviderContext';\nimport { Footnote } from '../Typography/Footnote/Footnote';\nimport styles from './CalendarDays.module.css';\n\nexport interface CalendarDaysProps extends Omit<React.HTMLAttributes<HTMLDivElement>, 'onChange'> {\n  value?: Date | Array<Date | null>;\n  viewDate: Date;\n  weekStartsOn: 0 | 1 | 2 | 3 | 4 | 5 | 6;\n  showNeighboringMonth?: boolean;\n  size?: 's' | 'm';\n  dayProps?: CalendarDayElementProps;\n  listenDayChangesForUpdate?: boolean;\n  onDayChange(value: Date): void;\n  isDayDisabled(value: Date): boolean;\n  isDaySelectionStart(value: Date, dayOfWeek: number): boolean;\n  isDaySelectionEnd(value: Date, dayOfWeek: number): boolean;\n  isHintedDaySelectionStart?(value: Date, dayOfWeek: number): boolean;\n  isHintedDaySelectionEnd?(value: Date, dayOfWeek: number): boolean;\n  isDayActive(value: Date): boolean;\n  isDayHinted?(value: Date): boolean;\n  isDaySelected?(value: Date): boolean;\n  isDayFocused(value: Date): boolean;\n  onDayEnter?(value: Date): void;\n  onDayLeave?(value: Date): void;\n}\n\nexport const CalendarDays = ({\n  viewDate,\n  value,\n  weekStartsOn,\n  onDayChange,\n  isDaySelected,\n  isDayActive,\n  isDaySelectionEnd,\n  isDaySelectionStart,\n  onDayEnter,\n  onDayLeave,\n  isDayHinted,\n  isHintedDaySelectionStart,\n  isHintedDaySelectionEnd,\n  isDayFocused,\n  isDayDisabled,\n  size,\n  showNeighboringMonth = false,\n  dayProps,\n  className,\n  listenDayChangesForUpdate = false,\n  ...props\n}: CalendarDaysProps) => {\n  const { locale } = useConfigProvider();\n  const ref = React.useRef<HTMLDivElement>(null);\n  const now = useTodayDate(listenDayChangesForUpdate);\n\n  const weeks = React.useMemo(() => getWeeks(viewDate, weekStartsOn), [weekStartsOn, viewDate]);\n\n  const daysNames = React.useMemo(\n    () => getDaysNames(now, weekStartsOn, locale),\n    [locale, now, weekStartsOn],\n  );\n\n  const handleDayChange = React.useCallback(\n    (date: Date) => {\n      onDayChange(date);\n\n      ref.current?.focus();\n    },\n    [onDayChange],\n  );\n\n  return (\n    <div {...props} className={classNames(styles['CalendarDays'], className)} ref={ref}>\n      <div\n        className={classNames(\n          styles['CalendarDays__row'],\n          size === 's' && styles['CalendarDays__row--size-s'],\n        )}\n      >\n        {daysNames.map((dayName) => (\n          <Footnote key={dayName} className={styles['CalendarDays__weekday']}>\n            {dayName}\n          </Footnote>\n        ))}\n      </div>\n\n      {weeks.map((week, i) => (\n        <div\n          className={classNames(\n            styles['CalendarDays__row'],\n            size === 's' && styles['CalendarDays__row--size-s'],\n          )}\n          key={i}\n        >\n          {week.map((day, i) => {\n            const sameMonth = isSameMonth(day, viewDate);\n            return (\n              <CalendarDay\n                key={day.toISOString()}\n                day={day}\n                today={isSameDay(day, now)}\n                active={isDayActive(day)}\n                onChange={handleDayChange}\n                hidden={!showNeighboringMonth && !sameMonth}\n                disabled={isDayDisabled(day)}\n                selectionStart={isDaySelectionStart(day, i)}\n                selectionEnd={isDaySelectionEnd(day, i)}\n                hintedSelectionStart={isHintedDaySelectionStart?.(day, i)}\n                hintedSelectionEnd={isHintedDaySelectionEnd?.(day, i)}\n                selected={isDaySelected?.(day)}\n                focused={isDayFocused(day)}\n                onEnter={onDayEnter}\n                onLeave={onDayLeave}\n                hinted={isDayHinted?.(day)}\n                sameMonth={sameMonth}\n                size={size}\n                {...dayProps}\n              />\n            );\n          })}\n        </div>\n      ))}\n    </div>\n  );\n};\n"],"names":["React","classNames","useTodayDate","getDaysNames","getWeeks","isSameDay","isSameMonth","CalendarDay","useConfigProvider","Footnote","CalendarDays","viewDate","value","weekStartsOn","onDayChange","isDaySelected","isDayActive","isDaySelectionEnd","isDaySelectionStart","onDayEnter","onDayLeave","isDayHinted","isHintedDaySelectionStart","isHintedDaySelectionEnd","isDayFocused","isDayDisabled","size","showNeighboringMonth","dayProps","className","listenDayChangesForUpdate","props","locale","ref","useRef","now","weeks","useMemo","daysNames","handleDayChange","useCallback","date","current","focus","div","map","dayName","key","week","i","day","sameMonth","toISOString","today","active","onChange","hidden","disabled","selectionStart","selectionEnd","hintedSelectionStart","hintedSelectionEnd","selected","focused","onEnter","onLeave","hinted"],"mappings":";;;AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,UAAU,QAAQ,kBAAkB;AAC7C,SAASC,YAAY,QAAQ,2BAA2B;AACxD,SAASC,YAAY,EAAEC,QAAQ,QAAQ,qBAAqB;AAC5D,SAASC,SAAS,EAAEC,WAAW,QAAQ,iBAAiB;AACxD,SAASC,WAAW,QAAiC,6BAA6B;AAClF,SAASC,iBAAiB,QAAQ,0CAA0C;AAC5E,SAASC,QAAQ,QAAQ,kCAAkC;AAyB3D,OAAO,IAAMC,eAAe;QAC1BC,kBAAAA,UACAC,eAAAA,OACAC,sBAAAA,cACAC,qBAAAA,aACAC,uBAAAA,eACAC,qBAAAA,aACAC,2BAAAA,mBACAC,6BAAAA,qBACAC,oBAAAA,YACAC,oBAAAA,YACAC,qBAAAA,aACAC,mCAAAA,2BACAC,iCAAAA,yBACAC,sBAAAA,cACAC,uBAAAA,eACAC,cAAAA,2CACAC,sBAAAA,gEAAuB,qCACvBC,kBAAAA,UACAC,mBAAAA,qDACAC,2BAAAA,0EAA4B,0CACzBC;QApBHpB;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;;IAGA,IAAM,AAAEE,SAAWxB,oBAAXwB;IACR,IAAMC,MAAMjC,MAAMkC,OAAuB;IACzC,IAAMC,MAAMjC,aAAa4B;IAEzB,IAAMM,QAAQpC,MAAMqC,QAAQ;eAAMjC,SAASO,UAAUE;OAAe;QAACA;QAAcF;KAAS;IAE5F,IAAM2B,YAAYtC,MAAMqC,QACtB;eAAMlC,aAAagC,KAAKtB,cAAcmB;OACtC;QAACA;QAAQG;QAAKtB;KAAa;IAG7B,IAAM0B,kBAAkBvC,MAAMwC,YAC5B,SAACC;YAGCR;QAFAnB,YAAY2B;QAEZR,CAAAA,eAAAA,IAAIS,qBAAJT,0BAAAA,KAAAA,IAAAA,aAAaU;IACf,GACA;QAAC7B;KAAY;IAGf,qBACE,oBAAC8B,+CAAQb;QAAOF,WAAW5B,+BAAmC4B;QAAYI,KAAKA;sBAC7E,oBAACW;QACCf,WAAW5B,oCAETyB,SAAS;OAGVY,UAAUO,IAAI,SAACC;6BACd,oBAACrC;YAASsC,KAAKD;YAASjB,SAAS;WAC9BiB;SAKNV,MAAMS,IAAI,SAACG,MAAMC;sBAChB,OAAA,oBAACL;YACCf,WAAW5B,oCAETyB,SAAS;YAEXqB,KAAKE;WAEJD,KAAKH,IAAI,SAACK,KAAKD;YACd,IAAME,YAAY7C,YAAY4C,KAAKvC;YACnC,qBACE,oBAACJ;gBACCwC,KAAKG,IAAIE;gBACTF,KAAKA;gBACLG,OAAOhD,UAAU6C,KAAKf;gBACtBmB,QAAQtC,YAAYkC;gBACpBK,UAAUhB;gBACViB,QAAQ,CAAC7B,wBAAwB,CAACwB;gBAClCM,UAAUhC,cAAcyB;gBACxBQ,gBAAgBxC,oBAAoBgC,KAAKD;gBACzCU,cAAc1C,kBAAkBiC,KAAKD;gBACrCW,oBAAoB,EAAEtC,sCAAAA,uCAAAA,KAAAA,IAAAA,0BAA4B4B,KAAKD;gBACvDY,kBAAkB,EAAEtC,oCAAAA,qCAAAA,KAAAA,IAAAA,wBAA0B2B,KAAKD;gBACnDa,QAAQ,EAAE/C,0BAAAA,2BAAAA,KAAAA,IAAAA,cAAgBmC;gBAC1Ba,SAASvC,aAAa0B;gBACtBc,SAAS7C;gBACT8C,SAAS7C;gBACT8C,MAAM,EAAE7C,wBAAAA,yBAAAA,KAAAA,IAAAA,YAAc6B;gBACtBC,WAAWA;gBACXzB,MAAMA;eACFE;QAGV;;AAKV,EAAE"}
+{"version":3,"sources":["../../../src/components/CalendarDays/CalendarDays.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { useTodayDate } from '../../hooks/useTodayDate';\nimport { getDaysNames, getWeeks } from '../../lib/calendar';\nimport { isSameDay, isSameMonth } from '../../lib/date';\nimport { CalendarDay, CalendarDayElementProps } from '../CalendarDay/CalendarDay';\nimport { useConfigProvider } from '../ConfigProvider/ConfigProviderContext';\nimport { Footnote } from '../Typography/Footnote/Footnote';\nimport styles from './CalendarDays.module.css';\n\nexport interface CalendarDaysProps extends Omit<React.HTMLAttributes<HTMLDivElement>, 'onChange'> {\n  value?: Date | Array<Date | null>;\n  viewDate: Date;\n  weekStartsOn: 0 | 1 | 2 | 3 | 4 | 5 | 6;\n  showNeighboringMonth?: boolean;\n  size?: 's' | 'm';\n  dayProps?: CalendarDayElementProps;\n  listenDayChangesForUpdate?: boolean;\n  onDayChange(value: Date): void;\n  isDayDisabled(value: Date): boolean;\n  isDaySelectionStart(value: Date, dayOfWeek: number): boolean;\n  isDaySelectionEnd(value: Date, dayOfWeek: number): boolean;\n  isHintedDaySelectionStart?(value: Date, dayOfWeek: number): boolean;\n  isHintedDaySelectionEnd?(value: Date, dayOfWeek: number): boolean;\n  isDayActive(value: Date): boolean;\n  isDayHinted?(value: Date): boolean;\n  isDaySelected?(value: Date): boolean;\n  isDayFocused(value: Date): boolean;\n  onDayEnter?(value: Date): void;\n  onDayLeave?(value: Date): void;\n}\n\nexport const CalendarDays = ({\n  viewDate,\n  value,\n  weekStartsOn,\n  onDayChange,\n  isDaySelected,\n  isDayActive,\n  isDaySelectionEnd,\n  isDaySelectionStart,\n  onDayEnter,\n  onDayLeave,\n  isDayHinted,\n  isHintedDaySelectionStart,\n  isHintedDaySelectionEnd,\n  isDayFocused,\n  isDayDisabled,\n  size,\n  showNeighboringMonth = false,\n  dayProps,\n  className,\n  listenDayChangesForUpdate = false,\n  ...props\n}: CalendarDaysProps) => {\n  const { locale } = useConfigProvider();\n  const ref = React.useRef<HTMLDivElement>(null);\n  const now = useTodayDate(listenDayChangesForUpdate);\n\n  const weeks = React.useMemo(() => getWeeks(viewDate, weekStartsOn), [weekStartsOn, viewDate]);\n\n  const daysNames = React.useMemo(\n    () => getDaysNames(now, weekStartsOn, locale),\n    [locale, now, weekStartsOn],\n  );\n\n  const handleDayChange = React.useCallback(\n    (date: Date) => {\n      onDayChange(date);\n\n      ref.current?.focus();\n    },\n    [onDayChange],\n  );\n\n  return (\n    <div {...props} className={classNames(styles['CalendarDays'], className)} ref={ref}>\n      <div\n        className={classNames(\n          styles['CalendarDays__row'],\n          size === 's' && styles['CalendarDays__row--size-s'],\n        )}\n      >\n        {daysNames.map((dayName) => (\n          <Footnote key={dayName} className={styles['CalendarDays__weekday']}>\n            {dayName}\n          </Footnote>\n        ))}\n      </div>\n\n      {weeks.map((week, i) => (\n        <div\n          className={classNames(\n            styles['CalendarDays__row'],\n            size === 's' && styles['CalendarDays__row--size-s'],\n          )}\n          key={i}\n        >\n          {week.map((day, i) => {\n            const sameMonth = isSameMonth(day, viewDate);\n            return (\n              <CalendarDay\n                key={day.toISOString()}\n                day={day}\n                today={isSameDay(day, now)}\n                active={isDayActive(day)}\n                onChange={handleDayChange}\n                hidden={!showNeighboringMonth && !sameMonth}\n                disabled={isDayDisabled(day)}\n                selectionStart={isDaySelectionStart(day, i)}\n                selectionEnd={isDaySelectionEnd(day, i)}\n                hintedSelectionStart={isHintedDaySelectionStart?.(day, i)}\n                hintedSelectionEnd={isHintedDaySelectionEnd?.(day, i)}\n                selected={isDaySelected?.(day)}\n                focused={isDayFocused(day)}\n                onEnter={onDayEnter}\n                onLeave={onDayLeave}\n                hinted={isDayHinted?.(day)}\n                sameMonth={sameMonth}\n                size={size}\n                {...dayProps}\n              />\n            );\n          })}\n        </div>\n      ))}\n    </div>\n  );\n};\n"],"names":["React","classNames","useTodayDate","getDaysNames","getWeeks","isSameDay","isSameMonth","CalendarDay","useConfigProvider","Footnote","CalendarDays","viewDate","value","weekStartsOn","onDayChange","isDaySelected","isDayActive","isDaySelectionEnd","isDaySelectionStart","onDayEnter","onDayLeave","isDayHinted","isHintedDaySelectionStart","isHintedDaySelectionEnd","isDayFocused","isDayDisabled","size","showNeighboringMonth","dayProps","className","listenDayChangesForUpdate","props","locale","ref","useRef","now","weeks","useMemo","daysNames","handleDayChange","useCallback","date","current","focus","div","map","dayName","key","week","i","day","sameMonth","toISOString","today","active","onChange","hidden","disabled","selectionStart","selectionEnd","hintedSelectionStart","hintedSelectionEnd","selected","focused","onEnter","onLeave","hinted"],"mappings":"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"}

package/dist/components/CalendarHeader/CalendarHeader.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/CalendarHeader/CalendarHeader.tsx"],"sourcesContent":["import * as React from 'react';\nimport {\n  Icon12Dropdown,\n  Icon20ChevronLeftOutline,\n  Icon20ChevronRightOutline,\n} from '@vkontakte/icons';\nimport { classNames } from '@vkontakte/vkjs';\nimport { SizeType } from '../../lib/adaptivity';\nimport { getMonths, getYears } from '../../lib/calendar';\nimport { addMonths, setMonth, setYear, subMonths } from '../../lib/date';\nimport { AdaptivityProvider } from '../AdaptivityProvider/AdaptivityProvider';\nimport { useConfigProvider } from '../ConfigProvider/ConfigProviderContext';\nimport { CustomSelect } from '../CustomSelect/CustomSelect';\nimport { Tappable, TappableElementProps } from '../Tappable/Tappable';\nimport { Paragraph } from '../Typography/Paragraph/Paragraph';\nimport styles from './CalendarHeader.module.css';\n\ntype ArrowMonthProps = Omit<TappableElementProps, 'onClick' | 'aria-label'>;\n\nexport interface CalendarHeaderProps\n  extends Pick<React.HTMLAttributes<HTMLDivElement>, 'className'> {\n  viewDate: Date;\n  prevMonth?: boolean;\n  nextMonth?: boolean;\n  disablePickers?: boolean;\n  prevMonthAriaLabel?: string;\n  nextMonthAriaLabel?: string;\n  changeMonthAriaLabel?: string;\n  changeYearAriaLabel?: string;\n  prevMonthIcon?: React.ReactNode;\n  nextMonthIcon?: React.ReactNode;\n  prevMonthProps?: ArrowMonthProps;\n  nextMonthProps?: ArrowMonthProps;\n  onChange(viewDate: Date): void;\n  /**\n   * Нажатие на кнопку переключения на следующий месяц.\n   */\n  onNextMonth?(): void;\n  /**\n   * Нажатие на кнопку переключения на предыдущий месяц.\n   */\n  onPrevMonth?(): void;\n}\n\nexport const CalendarHeader = ({\n  viewDate,\n  onChange,\n  prevMonth = true,\n  nextMonth = true,\n  disablePickers = false,\n  onNextMonth,\n  onPrevMonth,\n  className,\n  prevMonthProps = {},\n  nextMonthProps = {},\n  prevMonthAriaLabel = 'Предыдущий месяц',\n  nextMonthAriaLabel = 'Следующий месяц',\n  changeMonthAriaLabel = 'Изменить месяц',\n  changeYearAriaLabel = 'Изменить год',\n  prevMonthIcon = (\n    <Icon20ChevronLeftOutline\n      className={styles['CalendarHeader__nav-icon--accent']}\n      width={30}\n      height={30}\n    />\n  ),\n  nextMonthIcon = (\n    <Icon20ChevronRightOutline\n      className={styles['CalendarHeader__nav-icon--accent']}\n      width={30}\n      height={30}\n    />\n  ),\n}: CalendarHeaderProps) => {\n  const { locale } = useConfigProvider();\n  const onMonthsChange = React.useCallback(\n    (event: React.ChangeEvent<HTMLSelectElement>) =>\n      onChange(setMonth(viewDate, Number(event.target.value))),\n    [onChange, viewDate],\n  );\n  const onYearChange = React.useCallback(\n    (event: React.ChangeEvent<HTMLSelectElement>) =>\n      onChange(setYear(viewDate, Number(event.target.value))),\n    [onChange, viewDate],\n  );\n\n  const months = React.useMemo(\n    () =>\n      getMonths(locale).map(({ value, label }) => ({\n        value,\n        label: <span className={styles['CalendarHeader__month']}>{label}</span>,\n      })),\n    [locale],\n  );\n\n  const currentYear = viewDate.getFullYear();\n\n  const years = React.useMemo(() => getYears(currentYear, 100), [currentYear]);\n\n  const formatter = new Intl.DateTimeFormat(locale, {\n    year: 'numeric',\n    month: 'long',\n  });\n\n  const { className: prevMonthClassName, ...restPrevMonthProps } = prevMonthProps;\n  const { className: nextMonthClassName, ...restNextMonthProps } = nextMonthProps;\n\n  return (\n    <div className={classNames(styles['CalendarHeader'], className)}>\n      {prevMonth && (\n        <AdaptivityProvider sizeX={SizeType.REGULAR}>\n          <Tappable\n            className={classNames(\n              styles['CalendarHeader__nav-icon'],\n              styles['CalendarHeader__nav-icon-prev'],\n              prevMonthClassName,\n            )}\n            onClick={onPrevMonth}\n            aria-label={`${prevMonthAriaLabel}, ${formatter.format(subMonths(viewDate, 1))}`}\n            {...restPrevMonthProps}\n          >\n            {prevMonthIcon}\n          </Tappable>\n        </AdaptivityProvider>\n      )}\n      {disablePickers ? (\n        <Paragraph\n          className={classNames(\n            styles['CalendarHeader__pickers'],\n            'vkuiInternalCalendarHeader__pickers',\n          )}\n          weight=\"2\"\n        >\n          <span className={styles['CalendarHeader__month']}>\n            {new Intl.DateTimeFormat(locale, {\n              month: 'long',\n            }).format(viewDate)}\n          </span>\n          &nbsp;\n          {new Intl.DateTimeFormat(locale, {\n            year: 'numeric',\n          }).format(viewDate)}\n        </Paragraph>\n      ) : (\n        <AdaptivityProvider sizeY={SizeType.COMPACT}>\n          <div\n            className={classNames(\n              styles['CalendarHeader__pickers'],\n              'vkuiInternalCalendarHeader__pickers',\n            )}\n          >\n            <CustomSelect\n              className={classNames(\n                styles['CalendarHeader__picker'],\n                'vkuiInternalCalendarHeader__picker',\n              )}\n              value={viewDate.getMonth()}\n              options={months}\n              dropdownOffsetDistance={4}\n              fixDropdownWidth={false}\n              icon={<Icon12Dropdown />}\n              onChange={onMonthsChange}\n              forceDropdownPortal={false}\n              selectType=\"accent\"\n              aria-label={changeMonthAriaLabel}\n            />\n            <CustomSelect\n              className={classNames(\n                styles['CalendarHeader__picker'],\n                'vkuiInternalCalendarHeader__picker',\n              )}\n              value={viewDate.getFullYear()}\n              options={years}\n              dropdownOffsetDistance={4}\n              fixDropdownWidth={false}\n              icon={<Icon12Dropdown />}\n              onChange={onYearChange}\n              forceDropdownPortal={false}\n              selectType=\"accent\"\n              aria-label={changeYearAriaLabel}\n            />\n          </div>\n        </AdaptivityProvider>\n      )}\n      {nextMonth && (\n        <AdaptivityProvider sizeX={SizeType.REGULAR}>\n          <Tappable\n            className={classNames(\n              styles['CalendarHeader__nav-icon'],\n              styles['CalendarHeader__nav-icon-next'],\n              nextMonthClassName,\n            )}\n            onClick={onNextMonth}\n            aria-label={`${nextMonthAriaLabel}, ${formatter.format(addMonths(viewDate, 1))}`}\n            {...restNextMonthProps}\n          >\n            {nextMonthIcon}\n          </Tappable>\n        </AdaptivityProvider>\n      )}\n    </div>\n  );\n};\n"],"names":["React","Icon12Dropdown","Icon20ChevronLeftOutline","Icon20ChevronRightOutline","classNames","SizeType","getMonths","getYears","addMonths","setMonth","setYear","subMonths","AdaptivityProvider","useConfigProvider","CustomSelect","Tappable","Paragraph","CalendarHeader","viewDate","onChange","prevMonth","nextMonth","disablePickers","onNextMonth","onPrevMonth","className","prevMonthProps","nextMonthProps","prevMonthAriaLabel","nextMonthAriaLabel","changeMonthAriaLabel","changeYearAriaLabel","prevMonthIcon","width","height","nextMonthIcon","locale","onMonthsChange","useCallback","event","Number","target","value","onYearChange","months","useMemo","map","label","span","currentYear","getFullYear","years","formatter","Intl","DateTimeFormat","year","month","prevMonthClassName","restPrevMonthProps","nextMonthClassName","restNextMonthProps","div","sizeX","REGULAR","onClick","aria-label","format","weight","sizeY","COMPACT","getMonth","options","dropdownOffsetDistance","fixDropdownWidth","icon","forceDropdownPortal","selectType"],"mappings":"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"}
+{"version":3,"sources":["../../../src/components/CalendarHeader/CalendarHeader.tsx"],"sourcesContent":["import * as React from 'react';\nimport {\n  Icon12Dropdown,\n  Icon20ChevronLeftOutline,\n  Icon20ChevronRightOutline,\n} from '@vkontakte/icons';\nimport { classNames } from '@vkontakte/vkjs';\nimport { SizeType } from '../../lib/adaptivity';\nimport { getMonths, getYears } from '../../lib/calendar';\nimport { addMonths, setMonth, setYear, subMonths } from '../../lib/date';\nimport { AdaptivityProvider } from '../AdaptivityProvider/AdaptivityProvider';\nimport { useConfigProvider } from '../ConfigProvider/ConfigProviderContext';\nimport { CustomSelect } from '../CustomSelect/CustomSelect';\nimport { Tappable, TappableElementProps } from '../Tappable/Tappable';\nimport { Paragraph } from '../Typography/Paragraph/Paragraph';\nimport styles from './CalendarHeader.module.css';\n\ntype ArrowMonthProps = Omit<TappableElementProps, 'onClick' | 'aria-label'>;\n\nexport interface CalendarHeaderProps\n  extends Pick<React.HTMLAttributes<HTMLDivElement>, 'className'> {\n  viewDate: Date;\n  prevMonth?: boolean;\n  nextMonth?: boolean;\n  disablePickers?: boolean;\n  prevMonthAriaLabel?: string;\n  nextMonthAriaLabel?: string;\n  changeMonthAriaLabel?: string;\n  changeYearAriaLabel?: string;\n  prevMonthIcon?: React.ReactNode;\n  nextMonthIcon?: React.ReactNode;\n  prevMonthProps?: ArrowMonthProps;\n  nextMonthProps?: ArrowMonthProps;\n  onChange(viewDate: Date): void;\n  /**\n   * Нажатие на кнопку переключения на следующий месяц.\n   */\n  onNextMonth?(): void;\n  /**\n   * Нажатие на кнопку переключения на предыдущий месяц.\n   */\n  onPrevMonth?(): void;\n}\n\nexport const CalendarHeader = ({\n  viewDate,\n  onChange,\n  prevMonth = true,\n  nextMonth = true,\n  disablePickers = false,\n  onNextMonth,\n  onPrevMonth,\n  className,\n  prevMonthProps = {},\n  nextMonthProps = {},\n  prevMonthAriaLabel = 'Предыдущий месяц',\n  nextMonthAriaLabel = 'Следующий месяц',\n  changeMonthAriaLabel = 'Изменить месяц',\n  changeYearAriaLabel = 'Изменить год',\n  prevMonthIcon = (\n    <Icon20ChevronLeftOutline\n      className={styles['CalendarHeader__nav-icon--accent']}\n      width={30}\n      height={30}\n    />\n  ),\n  nextMonthIcon = (\n    <Icon20ChevronRightOutline\n      className={styles['CalendarHeader__nav-icon--accent']}\n      width={30}\n      height={30}\n    />\n  ),\n}: CalendarHeaderProps) => {\n  const { locale } = useConfigProvider();\n  const onMonthsChange = React.useCallback(\n    (event: React.ChangeEvent<HTMLSelectElement>) =>\n      onChange(setMonth(viewDate, Number(event.target.value))),\n    [onChange, viewDate],\n  );\n  const onYearChange = React.useCallback(\n    (event: React.ChangeEvent<HTMLSelectElement>) =>\n      onChange(setYear(viewDate, Number(event.target.value))),\n    [onChange, viewDate],\n  );\n\n  const months = React.useMemo(\n    () =>\n      getMonths(locale).map(({ value, label }) => ({\n        value,\n        label: <span className={styles['CalendarHeader__month']}>{label}</span>,\n      })),\n    [locale],\n  );\n\n  const currentYear = viewDate.getFullYear();\n\n  const years = React.useMemo(() => getYears(currentYear, 100), [currentYear]);\n\n  const formatter = new Intl.DateTimeFormat(locale, {\n    year: 'numeric',\n    month: 'long',\n  });\n\n  const { className: prevMonthClassName, ...restPrevMonthProps } = prevMonthProps;\n  const { className: nextMonthClassName, ...restNextMonthProps } = nextMonthProps;\n\n  return (\n    <div className={classNames(styles['CalendarHeader'], className)}>\n      {prevMonth && (\n        <AdaptivityProvider sizeX={SizeType.REGULAR}>\n          <Tappable\n            className={classNames(\n              styles['CalendarHeader__nav-icon'],\n              styles['CalendarHeader__nav-icon-prev'],\n              prevMonthClassName,\n            )}\n            onClick={onPrevMonth}\n            aria-label={`${prevMonthAriaLabel}, ${formatter.format(subMonths(viewDate, 1))}`}\n            {...restPrevMonthProps}\n          >\n            {prevMonthIcon}\n          </Tappable>\n        </AdaptivityProvider>\n      )}\n      {disablePickers ? (\n        <Paragraph\n          className={classNames(\n            styles['CalendarHeader__pickers'],\n            'vkuiInternalCalendarHeader__pickers',\n          )}\n          weight=\"2\"\n        >\n          <span className={styles['CalendarHeader__month']}>\n            {new Intl.DateTimeFormat(locale, {\n              month: 'long',\n            }).format(viewDate)}\n          </span>\n          &nbsp;\n          {new Intl.DateTimeFormat(locale, {\n            year: 'numeric',\n          }).format(viewDate)}\n        </Paragraph>\n      ) : (\n        <AdaptivityProvider sizeY={SizeType.COMPACT}>\n          <div\n            className={classNames(\n              styles['CalendarHeader__pickers'],\n              'vkuiInternalCalendarHeader__pickers',\n            )}\n          >\n            <CustomSelect\n              className={classNames(\n                styles['CalendarHeader__picker'],\n                'vkuiInternalCalendarHeader__picker',\n              )}\n              value={viewDate.getMonth()}\n              options={months}\n              dropdownOffsetDistance={4}\n              fixDropdownWidth={false}\n              icon={<Icon12Dropdown />}\n              onChange={onMonthsChange}\n              forceDropdownPortal={false}\n              selectType=\"accent\"\n              aria-label={changeMonthAriaLabel}\n            />\n            <CustomSelect\n              className={classNames(\n                styles['CalendarHeader__picker'],\n                'vkuiInternalCalendarHeader__picker',\n              )}\n              value={viewDate.getFullYear()}\n              options={years}\n              dropdownOffsetDistance={4}\n              fixDropdownWidth={false}\n              icon={<Icon12Dropdown />}\n              onChange={onYearChange}\n              forceDropdownPortal={false}\n              selectType=\"accent\"\n              aria-label={changeYearAriaLabel}\n            />\n          </div>\n        </AdaptivityProvider>\n      )}\n      {nextMonth && (\n        <AdaptivityProvider sizeX={SizeType.REGULAR}>\n          <Tappable\n            className={classNames(\n              styles['CalendarHeader__nav-icon'],\n              styles['CalendarHeader__nav-icon-next'],\n              nextMonthClassName,\n            )}\n            onClick={onNextMonth}\n            aria-label={`${nextMonthAriaLabel}, ${formatter.format(addMonths(viewDate, 1))}`}\n            {...restNextMonthProps}\n          >\n            {nextMonthIcon}\n          </Tappable>\n        </AdaptivityProvider>\n      )}\n    </div>\n  );\n};\n"],"names":["React","Icon12Dropdown","Icon20ChevronLeftOutline","Icon20ChevronRightOutline","classNames","SizeType","getMonths","getYears","addMonths","setMonth","setYear","subMonths","AdaptivityProvider","useConfigProvider","CustomSelect","Tappable","Paragraph","CalendarHeader","viewDate","onChange","prevMonth","nextMonth","disablePickers","onNextMonth","onPrevMonth","className","prevMonthProps","nextMonthProps","prevMonthAriaLabel","nextMonthAriaLabel","changeMonthAriaLabel","changeYearAriaLabel","prevMonthIcon","width","height","nextMonthIcon","locale","onMonthsChange","useCallback","event","Number","target","value","onYearChange","months","useMemo","map","label","span","currentYear","getFullYear","years","formatter","Intl","DateTimeFormat","year","month","prevMonthClassName","restPrevMonthProps","nextMonthClassName","restNextMonthProps","div","sizeX","REGULAR","onClick","aria-label","format","weight","sizeY","COMPACT","getMonth","options","dropdownOffsetDistance","fixDropdownWidth","icon","forceDropdownPortal","selectType"],"mappings":"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"}

package/dist/components/CalendarRange/CalendarRange.js

@@ -10,7 +10,8 @@ import { addMonths, endOfDay, isAfter, isBefore, isSameDay, isSameMonth, isWithi
 import { CalendarDays } from "../CalendarDays/CalendarDays";
 import { CalendarHeader } from "../CalendarHeader/CalendarHeader";
 var getIsDaySelected = function(day, value) {
-    if (!(value === null || value === void 0 ? void 0 : value[0]) || !value[1]) {
+    var _value;
+    if (!((_value = value) === null || _value === void 0 ? void 0 : _value[0]) || !value[1]) {
         return false;
     }
     return Boolean(isWithinInterval(day, startOfDay(value[0]), endOfDay(value[1])));
@@ -47,6 +48,7 @@ var getIsDaySelected = function(day, value) {
     var _React_useState = _sliced_to_array(React.useState(), 2), hintedDate = _React_useState[0], setHintedDate = _React_useState[1];
     var secondViewDate = addMonths(viewDate, 1);
     var handleKeyDown = React.useCallback(function(event) {
+        var _value;
         if ([
             "ArrowUp",
             "ArrowDown",
@@ -55,7 +57,7 @@ var getIsDaySelected = function(day, value) {
         ].includes(event.key)) {
             event.preventDefault();
         }
-        var newFocusedDay = navigateDate(focusedDay !== null && focusedDay !== void 0 ? focusedDay : value === null || value === void 0 ? void 0 : value[1], event.key);
+        var newFocusedDay = navigateDate(focusedDay !== null && focusedDay !== void 0 ? focusedDay : (_value = value) === null || _value === void 0 ? void 0 : _value[1], event.key);
         if (newFocusedDay && !isSameMonth(newFocusedDay, viewDate) && !isSameMonth(newFocusedDay, addMonths(viewDate, 1))) {
             setViewDate(newFocusedDay);
         }
@@ -97,7 +99,8 @@ var getIsDaySelected = function(day, value) {
         value
     ]);
     var onDayChange = React.useCallback(function(date) {
-        onChange === null || onChange === void 0 ? void 0 : onChange(getNewValue(date));
+        var _onChange;
+        (_onChange = onChange) === null || _onChange === void 0 ? void 0 : _onChange(getNewValue(date));
         setHintedDate(undefined);
     }, [
         onChange,
@@ -109,27 +112,32 @@ var getIsDaySelected = function(day, value) {
         value
     ]);
     var isDayActive = React.useCallback(function(day) {
-        return Boolean((value === null || value === void 0 ? void 0 : value[0]) && isSameDay(day, value[0]) || (value === null || value === void 0 ? void 0 : value[1]) && isSameDay(day, value[1]));
+        var _value, _value1;
+        return Boolean(((_value = value) === null || _value === void 0 ? void 0 : _value[0]) && isSameDay(day, value[0]) || ((_value1 = value) === null || _value1 === void 0 ? void 0 : _value1[1]) && isSameDay(day, value[1]));
     }, [
         value
     ]);
     var isDaySelectionEnd = React.useCallback(function(day, dayOfWeek) {
-        return Boolean(isLastDay(day, dayOfWeek) || (value === null || value === void 0 ? void 0 : value[1]) && isSameDay(day, value[1]));
+        var _value;
+        return Boolean(isLastDay(day, dayOfWeek) || ((_value = value) === null || _value === void 0 ? void 0 : _value[1]) && isSameDay(day, value[1]));
     }, [
         value
     ]);
     var isHintedDaySelectionEnd = React.useCallback(function(day, dayOfWeek) {
-        return Boolean(isLastDay(day, dayOfWeek) || (hintedDate === null || hintedDate === void 0 ? void 0 : hintedDate[1]) && isSameDay(day, hintedDate[1]));
+        var _hintedDate;
+        return Boolean(isLastDay(day, dayOfWeek) || ((_hintedDate = hintedDate) === null || _hintedDate === void 0 ? void 0 : _hintedDate[1]) && isSameDay(day, hintedDate[1]));
     }, [
         hintedDate
     ]);
     var isDaySelectionStart = React.useCallback(function(day, dayOfWeek) {
-        return Boolean(isFirstDay(day, dayOfWeek) || (value === null || value === void 0 ? void 0 : value[0]) && isSameDay(day, value[0]));
+        var _value;
+        return Boolean(isFirstDay(day, dayOfWeek) || ((_value = value) === null || _value === void 0 ? void 0 : _value[0]) && isSameDay(day, value[0]));
     }, [
         value
     ]);
     var isHintedDaySelectionStart = React.useCallback(function(day, dayOfWeek) {
-        return Boolean(isFirstDay(day, dayOfWeek) || (hintedDate === null || hintedDate === void 0 ? void 0 : hintedDate[0]) && isSameDay(day, hintedDate[0]));
+        var _hintedDate;
+        return Boolean(isFirstDay(day, dayOfWeek) || ((_hintedDate = hintedDate) === null || _hintedDate === void 0 ? void 0 : _hintedDate[0]) && isSameDay(day, hintedDate[0]));
     }, [
         hintedDate
     ]);

package/dist/components/CalendarRange/CalendarRange.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/CalendarRange/CalendarRange.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { useCalendar } from '../../hooks/useCalendar';\nimport { isFirstDay, isLastDay, navigateDate, setTimeEqual } from '../../lib/calendar';\nimport {\n  addMonths,\n  endOfDay,\n  isAfter,\n  isBefore,\n  isSameDay,\n  isSameMonth,\n  isWithinInterval,\n  startOfDay,\n} from '../../lib/date';\nimport { HasRootRef } from '../../types';\nimport { CalendarDays, CalendarDaysProps } from '../CalendarDays/CalendarDays';\nimport { CalendarHeader, CalendarHeaderProps } from '../CalendarHeader/CalendarHeader';\nimport styles from './CalendarRange.module.css';\n\nexport interface CalendarRangeProps\n  extends Omit<React.HTMLAttributes<HTMLDivElement>, 'onChange'>,\n    Pick<\n      CalendarHeaderProps,\n      | 'prevMonthAriaLabel'\n      | 'nextMonthAriaLabel'\n      | 'changeMonthAriaLabel'\n      | 'changeYearAriaLabel'\n      | 'prevMonthIcon'\n      | 'nextMonthIcon'\n    >,\n    Pick<CalendarDaysProps, 'listenDayChangesForUpdate'>,\n    HasRootRef<HTMLDivElement> {\n  value?: Array<Date | null>;\n  disablePast?: boolean;\n  disableFuture?: boolean;\n  disablePickers?: boolean;\n  changeDayAriaLabel?: string;\n  weekStartsOn?: 0 | 1 | 2 | 3 | 4 | 5 | 6;\n  onChange?(value?: Array<Date | null>): void;\n  shouldDisableDate?(value: Date): boolean;\n  onClose?(): void;\n}\n\nconst getIsDaySelected = (day: Date, value?: Array<Date | null>) => {\n  if (!value?.[0] || !value[1]) {\n    return false;\n  }\n\n  return Boolean(isWithinInterval(day, startOfDay(value[0]), endOfDay(value[1])));\n};\n\n/**\n * @see https://vkcom.github.io/VKUI/#/CalendarRange\n */\nexport const CalendarRange = ({\n  value,\n  onChange,\n  disablePast,\n  disableFuture,\n  shouldDisableDate,\n  onClose,\n  weekStartsOn = 1,\n  getRootRef,\n  disablePickers,\n  prevMonthAriaLabel,\n  nextMonthAriaLabel,\n  changeMonthAriaLabel,\n  changeYearAriaLabel,\n  changeDayAriaLabel = 'Изменить день',\n  prevMonthIcon,\n  nextMonthIcon,\n  className,\n  listenDayChangesForUpdate,\n  ...props\n}: CalendarRangeProps) => {\n  const {\n    viewDate,\n    setViewDate,\n    setPrevMonth,\n    setNextMonth,\n    focusedDay,\n    setFocusedDay,\n    isDayFocused,\n    isDayDisabled,\n    resetSelectedDay,\n  } = useCalendar({ value, disableFuture, disablePast, shouldDisableDate });\n  const [hintedDate, setHintedDate] = React.useState<Array<Date | null>>();\n  const secondViewDate = addMonths(viewDate, 1);\n\n  const handleKeyDown = React.useCallback(\n    (event: React.KeyboardEvent) => {\n      if (['ArrowUp', 'ArrowDown', 'ArrowLeft', 'ArrowRight'].includes(event.key)) {\n        event.preventDefault();\n      }\n\n      const newFocusedDay = navigateDate(focusedDay ?? value?.[1], event.key);\n\n      if (\n        newFocusedDay &&\n        !isSameMonth(newFocusedDay, viewDate) &&\n        !isSameMonth(newFocusedDay, addMonths(viewDate, 1))\n      ) {\n        setViewDate(newFocusedDay);\n      }\n      setFocusedDay(newFocusedDay);\n    },\n    [focusedDay, setFocusedDay, setViewDate, value, viewDate],\n  );\n\n  const getNewValue = React.useCallback(\n    (date: Date) => {\n      if (!value) {\n        return [date, null];\n      }\n\n      const start = value[0];\n      const end = value[1];\n      if ((start && isSameDay(date, start)) || (end && isSameDay(date, end))) {\n        return [setTimeEqual(date, start), setTimeEqual(date, end)];\n      } else if (start && isBefore(date, start)) {\n        return [setTimeEqual(date, start), end];\n      } else if (start && isAfter(date, start)) {\n        return [start, setTimeEqual(date, end)];\n      }\n\n      return value;\n    },\n    [value],\n  );\n\n  const onDayChange = React.useCallback(\n    (date: Date) => {\n      onChange?.(getNewValue(date));\n      setHintedDate(undefined);\n    },\n    [onChange, getNewValue],\n  );\n\n  const isDaySelected = React.useCallback((day: Date) => getIsDaySelected(day, value), [value]);\n\n  const isDayActive = React.useCallback(\n    (day: Date) =>\n      Boolean((value?.[0] && isSameDay(day, value[0])) || (value?.[1] && isSameDay(day, value[1]))),\n    [value],\n  );\n\n  const isDaySelectionEnd = React.useCallback(\n    (day: Date, dayOfWeek: number) =>\n      Boolean(isLastDay(day, dayOfWeek) || (value?.[1] && isSameDay(day, value[1]))),\n    [value],\n  );\n\n  const isHintedDaySelectionEnd = React.useCallback(\n    (day: Date, dayOfWeek: number) =>\n      Boolean(isLastDay(day, dayOfWeek) || (hintedDate?.[1] && isSameDay(day, hintedDate[1]))),\n    [hintedDate],\n  );\n\n  const isDaySelectionStart = React.useCallback(\n    (day: Date, dayOfWeek: number) =>\n      Boolean(isFirstDay(day, dayOfWeek) || (value?.[0] && isSameDay(day, value[0]))),\n    [value],\n  );\n\n  const isHintedDaySelectionStart = React.useCallback(\n    (day: Date, dayOfWeek: number) =>\n      Boolean(isFirstDay(day, dayOfWeek) || (hintedDate?.[0] && isSameDay(day, hintedDate[0]))),\n    [hintedDate],\n  );\n\n  const onDayEnter = React.useCallback(\n    (date: Date) => setHintedDate(getNewValue(date)),\n    [setHintedDate, getNewValue],\n  );\n\n  const onDayLeave = React.useCallback(() => setHintedDate(undefined), [setHintedDate]);\n\n  const isDayHinted = React.useCallback(\n    (day: Date) => getIsDaySelected(day, hintedDate),\n    [hintedDate],\n  );\n\n  return (\n    <div {...props} ref={getRootRef} className={classNames(styles['CalendarRange'], className)}>\n      <div className={styles['CalendarRange__inner']}>\n        <CalendarHeader\n          viewDate={viewDate}\n          onChange={setViewDate}\n          nextMonth={false}\n          onPrevMonth={setPrevMonth}\n          disablePickers={disablePickers}\n          className={styles['CalendarRange__header']}\n          prevMonthAriaLabel={prevMonthAriaLabel}\n          nextMonthAriaLabel={nextMonthAriaLabel}\n          changeMonthAriaLabel={changeMonthAriaLabel}\n          changeYearAriaLabel={changeYearAriaLabel}\n          prevMonthIcon={prevMonthIcon}\n        />\n        <CalendarDays\n          viewDate={viewDate}\n          value={value}\n          weekStartsOn={weekStartsOn}\n          onKeyDown={handleKeyDown}\n          isDayFocused={isDayFocused}\n          onDayChange={onDayChange}\n          isDaySelected={isDaySelected}\n          isDayActive={isDayActive}\n          isDaySelectionEnd={isDaySelectionEnd}\n          isDaySelectionStart={isDaySelectionStart}\n          isDayHinted={isDayHinted}\n          onDayEnter={onDayEnter}\n          onDayLeave={onDayLeave}\n          isHintedDaySelectionEnd={isHintedDaySelectionEnd}\n          isHintedDaySelectionStart={isHintedDaySelectionStart}\n          isDayDisabled={isDayDisabled}\n          listenDayChangesForUpdate={listenDayChangesForUpdate}\n          aria-label={changeDayAriaLabel}\n        />\n      </div>\n      <div className={styles['CalendarRange__inner']}>\n        <CalendarHeader\n          viewDate={secondViewDate}\n          onChange={setViewDate}\n          prevMonth={false}\n          onNextMonth={setNextMonth}\n          disablePickers={disablePickers}\n          className={styles['CalendarRange__header']}\n          prevMonthAriaLabel={prevMonthAriaLabel}\n          nextMonthAriaLabel={nextMonthAriaLabel}\n          changeMonthAriaLabel={changeMonthAriaLabel}\n          changeYearAriaLabel={changeYearAriaLabel}\n          nextMonthIcon={nextMonthIcon}\n        />\n        <CalendarDays\n          viewDate={secondViewDate}\n          value={value}\n          weekStartsOn={weekStartsOn}\n          aria-label={changeDayAriaLabel}\n          onKeyDown={handleKeyDown}\n          isDayFocused={isDayFocused}\n          onDayChange={onDayChange}\n          isDaySelected={isDaySelected}\n          isDayActive={isDayActive}\n          isDaySelectionEnd={isDaySelectionEnd}\n          isDaySelectionStart={isDaySelectionStart}\n          isDayHinted={isDayHinted}\n          onDayEnter={onDayEnter}\n          onDayLeave={onDayLeave}\n          isHintedDaySelectionEnd={isHintedDaySelectionEnd}\n          isHintedDaySelectionStart={isHintedDaySelectionStart}\n          isDayDisabled={isDayDisabled}\n          listenDayChangesForUpdate={listenDayChangesForUpdate}\n          tabIndex={0}\n          onBlur={resetSelectedDay}\n        />\n      </div>\n    </div>\n  );\n};\n"],"names":["React","classNames","useCalendar","isFirstDay","isLastDay","navigateDate","setTimeEqual","addMonths","endOfDay","isAfter","isBefore","isSameDay","isSameMonth","isWithinInterval","startOfDay","CalendarDays","CalendarHeader","getIsDaySelected","day","value","Boolean","CalendarRange","onChange","disablePast","disableFuture","shouldDisableDate","onClose","weekStartsOn","getRootRef","disablePickers","prevMonthAriaLabel","nextMonthAriaLabel","changeMonthAriaLabel","changeYearAriaLabel","changeDayAriaLabel","prevMonthIcon","nextMonthIcon","className","listenDayChangesForUpdate","props","viewDate","setViewDate","setPrevMonth","setNextMonth","focusedDay","setFocusedDay","isDayFocused","isDayDisabled","resetSelectedDay","useState","hintedDate","setHintedDate","secondViewDate","handleKeyDown","useCallback","event","includes","key","preventDefault","newFocusedDay","getNewValue","date","start","end","onDayChange","undefined","isDaySelected","isDayActive","isDaySelectionEnd","dayOfWeek","isHintedDaySelectionEnd","isDaySelectionStart","isHintedDaySelectionStart","onDayEnter","onDayLeave","isDayHinted","div","ref","nextMonth","onPrevMonth","onKeyDown","aria-label","prevMonth","onNextMonth","tabIndex","onBlur"],"mappings":"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"}
+{"version":3,"sources":["../../../src/components/CalendarRange/CalendarRange.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { useCalendar } from '../../hooks/useCalendar';\nimport { isFirstDay, isLastDay, navigateDate, setTimeEqual } from '../../lib/calendar';\nimport {\n  addMonths,\n  endOfDay,\n  isAfter,\n  isBefore,\n  isSameDay,\n  isSameMonth,\n  isWithinInterval,\n  startOfDay,\n} from '../../lib/date';\nimport { HasRootRef } from '../../types';\nimport { CalendarDays, CalendarDaysProps } from '../CalendarDays/CalendarDays';\nimport { CalendarHeader, CalendarHeaderProps } from '../CalendarHeader/CalendarHeader';\nimport styles from './CalendarRange.module.css';\n\nexport interface CalendarRangeProps\n  extends Omit<React.HTMLAttributes<HTMLDivElement>, 'onChange'>,\n    Pick<\n      CalendarHeaderProps,\n      | 'prevMonthAriaLabel'\n      | 'nextMonthAriaLabel'\n      | 'changeMonthAriaLabel'\n      | 'changeYearAriaLabel'\n      | 'prevMonthIcon'\n      | 'nextMonthIcon'\n    >,\n    Pick<CalendarDaysProps, 'listenDayChangesForUpdate'>,\n    HasRootRef<HTMLDivElement> {\n  value?: Array<Date | null>;\n  disablePast?: boolean;\n  disableFuture?: boolean;\n  disablePickers?: boolean;\n  changeDayAriaLabel?: string;\n  weekStartsOn?: 0 | 1 | 2 | 3 | 4 | 5 | 6;\n  onChange?(value?: Array<Date | null>): void;\n  shouldDisableDate?(value: Date): boolean;\n  onClose?(): void;\n}\n\nconst getIsDaySelected = (day: Date, value?: Array<Date | null>) => {\n  if (!value?.[0] || !value[1]) {\n    return false;\n  }\n\n  return Boolean(isWithinInterval(day, startOfDay(value[0]), endOfDay(value[1])));\n};\n\n/**\n * @see https://vkcom.github.io/VKUI/#/CalendarRange\n */\nexport const CalendarRange = ({\n  value,\n  onChange,\n  disablePast,\n  disableFuture,\n  shouldDisableDate,\n  onClose,\n  weekStartsOn = 1,\n  getRootRef,\n  disablePickers,\n  prevMonthAriaLabel,\n  nextMonthAriaLabel,\n  changeMonthAriaLabel,\n  changeYearAriaLabel,\n  changeDayAriaLabel = 'Изменить день',\n  prevMonthIcon,\n  nextMonthIcon,\n  className,\n  listenDayChangesForUpdate,\n  ...props\n}: CalendarRangeProps) => {\n  const {\n    viewDate,\n    setViewDate,\n    setPrevMonth,\n    setNextMonth,\n    focusedDay,\n    setFocusedDay,\n    isDayFocused,\n    isDayDisabled,\n    resetSelectedDay,\n  } = useCalendar({ value, disableFuture, disablePast, shouldDisableDate });\n  const [hintedDate, setHintedDate] = React.useState<Array<Date | null>>();\n  const secondViewDate = addMonths(viewDate, 1);\n\n  const handleKeyDown = React.useCallback(\n    (event: React.KeyboardEvent) => {\n      if (['ArrowUp', 'ArrowDown', 'ArrowLeft', 'ArrowRight'].includes(event.key)) {\n        event.preventDefault();\n      }\n\n      const newFocusedDay = navigateDate(focusedDay ?? value?.[1], event.key);\n\n      if (\n        newFocusedDay &&\n        !isSameMonth(newFocusedDay, viewDate) &&\n        !isSameMonth(newFocusedDay, addMonths(viewDate, 1))\n      ) {\n        setViewDate(newFocusedDay);\n      }\n      setFocusedDay(newFocusedDay);\n    },\n    [focusedDay, setFocusedDay, setViewDate, value, viewDate],\n  );\n\n  const getNewValue = React.useCallback(\n    (date: Date) => {\n      if (!value) {\n        return [date, null];\n      }\n\n      const start = value[0];\n      const end = value[1];\n      if ((start && isSameDay(date, start)) || (end && isSameDay(date, end))) {\n        return [setTimeEqual(date, start), setTimeEqual(date, end)];\n      } else if (start && isBefore(date, start)) {\n        return [setTimeEqual(date, start), end];\n      } else if (start && isAfter(date, start)) {\n        return [start, setTimeEqual(date, end)];\n      }\n\n      return value;\n    },\n    [value],\n  );\n\n  const onDayChange = React.useCallback(\n    (date: Date) => {\n      onChange?.(getNewValue(date));\n      setHintedDate(undefined);\n    },\n    [onChange, getNewValue],\n  );\n\n  const isDaySelected = React.useCallback((day: Date) => getIsDaySelected(day, value), [value]);\n\n  const isDayActive = React.useCallback(\n    (day: Date) =>\n      Boolean((value?.[0] && isSameDay(day, value[0])) || (value?.[1] && isSameDay(day, value[1]))),\n    [value],\n  );\n\n  const isDaySelectionEnd = React.useCallback(\n    (day: Date, dayOfWeek: number) =>\n      Boolean(isLastDay(day, dayOfWeek) || (value?.[1] && isSameDay(day, value[1]))),\n    [value],\n  );\n\n  const isHintedDaySelectionEnd = React.useCallback(\n    (day: Date, dayOfWeek: number) =>\n      Boolean(isLastDay(day, dayOfWeek) || (hintedDate?.[1] && isSameDay(day, hintedDate[1]))),\n    [hintedDate],\n  );\n\n  const isDaySelectionStart = React.useCallback(\n    (day: Date, dayOfWeek: number) =>\n      Boolean(isFirstDay(day, dayOfWeek) || (value?.[0] && isSameDay(day, value[0]))),\n    [value],\n  );\n\n  const isHintedDaySelectionStart = React.useCallback(\n    (day: Date, dayOfWeek: number) =>\n      Boolean(isFirstDay(day, dayOfWeek) || (hintedDate?.[0] && isSameDay(day, hintedDate[0]))),\n    [hintedDate],\n  );\n\n  const onDayEnter = React.useCallback(\n    (date: Date) => setHintedDate(getNewValue(date)),\n    [setHintedDate, getNewValue],\n  );\n\n  const onDayLeave = React.useCallback(() => setHintedDate(undefined), [setHintedDate]);\n\n  const isDayHinted = React.useCallback(\n    (day: Date) => getIsDaySelected(day, hintedDate),\n    [hintedDate],\n  );\n\n  return (\n    <div {...props} ref={getRootRef} className={classNames(styles['CalendarRange'], className)}>\n      <div className={styles['CalendarRange__inner']}>\n        <CalendarHeader\n          viewDate={viewDate}\n          onChange={setViewDate}\n          nextMonth={false}\n          onPrevMonth={setPrevMonth}\n          disablePickers={disablePickers}\n          className={styles['CalendarRange__header']}\n          prevMonthAriaLabel={prevMonthAriaLabel}\n          nextMonthAriaLabel={nextMonthAriaLabel}\n          changeMonthAriaLabel={changeMonthAriaLabel}\n          changeYearAriaLabel={changeYearAriaLabel}\n          prevMonthIcon={prevMonthIcon}\n        />\n        <CalendarDays\n          viewDate={viewDate}\n          value={value}\n          weekStartsOn={weekStartsOn}\n          onKeyDown={handleKeyDown}\n          isDayFocused={isDayFocused}\n          onDayChange={onDayChange}\n          isDaySelected={isDaySelected}\n          isDayActive={isDayActive}\n          isDaySelectionEnd={isDaySelectionEnd}\n          isDaySelectionStart={isDaySelectionStart}\n          isDayHinted={isDayHinted}\n          onDayEnter={onDayEnter}\n          onDayLeave={onDayLeave}\n          isHintedDaySelectionEnd={isHintedDaySelectionEnd}\n          isHintedDaySelectionStart={isHintedDaySelectionStart}\n          isDayDisabled={isDayDisabled}\n          listenDayChangesForUpdate={listenDayChangesForUpdate}\n          aria-label={changeDayAriaLabel}\n        />\n      </div>\n      <div className={styles['CalendarRange__inner']}>\n        <CalendarHeader\n          viewDate={secondViewDate}\n          onChange={setViewDate}\n          prevMonth={false}\n          onNextMonth={setNextMonth}\n          disablePickers={disablePickers}\n          className={styles['CalendarRange__header']}\n          prevMonthAriaLabel={prevMonthAriaLabel}\n          nextMonthAriaLabel={nextMonthAriaLabel}\n          changeMonthAriaLabel={changeMonthAriaLabel}\n          changeYearAriaLabel={changeYearAriaLabel}\n          nextMonthIcon={nextMonthIcon}\n        />\n        <CalendarDays\n          viewDate={secondViewDate}\n          value={value}\n          weekStartsOn={weekStartsOn}\n          aria-label={changeDayAriaLabel}\n          onKeyDown={handleKeyDown}\n          isDayFocused={isDayFocused}\n          onDayChange={onDayChange}\n          isDaySelected={isDaySelected}\n          isDayActive={isDayActive}\n          isDaySelectionEnd={isDaySelectionEnd}\n          isDaySelectionStart={isDaySelectionStart}\n          isDayHinted={isDayHinted}\n          onDayEnter={onDayEnter}\n          onDayLeave={onDayLeave}\n          isHintedDaySelectionEnd={isHintedDaySelectionEnd}\n          isHintedDaySelectionStart={isHintedDaySelectionStart}\n          isDayDisabled={isDayDisabled}\n          listenDayChangesForUpdate={listenDayChangesForUpdate}\n          tabIndex={0}\n          onBlur={resetSelectedDay}\n        />\n      </div>\n    </div>\n  );\n};\n"],"names":["React","classNames","useCalendar","isFirstDay","isLastDay","navigateDate","setTimeEqual","addMonths","endOfDay","isAfter","isBefore","isSameDay","isSameMonth","isWithinInterval","startOfDay","CalendarDays","CalendarHeader","getIsDaySelected","day","value","Boolean","CalendarRange","onChange","disablePast","disableFuture","shouldDisableDate","onClose","weekStartsOn","getRootRef","disablePickers","prevMonthAriaLabel","nextMonthAriaLabel","changeMonthAriaLabel","changeYearAriaLabel","changeDayAriaLabel","prevMonthIcon","nextMonthIcon","className","listenDayChangesForUpdate","props","viewDate","setViewDate","setPrevMonth","setNextMonth","focusedDay","setFocusedDay","isDayFocused","isDayDisabled","resetSelectedDay","useState","hintedDate","setHintedDate","secondViewDate","handleKeyDown","useCallback","event","includes","key","preventDefault","newFocusedDay","getNewValue","date","start","end","onDayChange","undefined","isDaySelected","isDayActive","isDaySelectionEnd","dayOfWeek","isHintedDaySelectionEnd","isDaySelectionStart","isHintedDaySelectionStart","onDayEnter","onDayLeave","isDayHinted","div","ref","nextMonth","onPrevMonth","onKeyDown","aria-label","prevMonth","onNextMonth","tabIndex","onBlur"],"mappings":"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"}

package/dist/components/CalendarTime/CalendarTime.js

@@ -21,13 +21,15 @@ for(var i1 = 0; i1 < 60; i1 += 1){
 export var CalendarTime = function(param) {
     var value = param.value, _param_doneButtonText = param.doneButtonText, doneButtonText = _param_doneButtonText === void 0 ? "Готово" : _param_doneButtonText, onChange = param.onChange, onClose = param.onClose, _param_changeHoursAriaLabel = param.changeHoursAriaLabel, changeHoursAriaLabel = _param_changeHoursAriaLabel === void 0 ? "Изменить час" : _param_changeHoursAriaLabel, _param_changeMinutesAriaLabel = param.changeMinutesAriaLabel, changeMinutesAriaLabel = _param_changeMinutesAriaLabel === void 0 ? "Изменить минуту" : _param_changeMinutesAriaLabel;
     var onHoursChange = React.useCallback(function(event) {
-        return onChange === null || onChange === void 0 ? void 0 : onChange(setHours(value, Number(event.target.value)));
+        var _onChange;
+        return (_onChange = onChange) === null || _onChange === void 0 ? void 0 : _onChange(setHours(value, Number(event.target.value)));
     }, [
         onChange,
         value
     ]);
     var onMinutesChange = React.useCallback(function(event) {
-        return onChange === null || onChange === void 0 ? void 0 : onChange(setMinutes(value, Number(event.target.value)));
+        var _onChange;
+        return (_onChange = onChange) === null || _onChange === void 0 ? void 0 : _onChange(setMinutes(value, Number(event.target.value)));
     }, [
         onChange,
         value

package/dist/components/CalendarTime/CalendarTime.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/CalendarTime/CalendarTime.tsx"],"sourcesContent":["import * as React from 'react';\nimport { SizeType } from '../../lib/adaptivity';\nimport { setHours, setMinutes } from '../../lib/date';\nimport { AdaptivityProvider } from '../AdaptivityProvider/AdaptivityProvider';\nimport { Button } from '../Button/Button';\nimport { CustomSelect } from '../CustomSelect/CustomSelect';\nimport styles from './CalendarTime.module.css';\n\nexport interface CalendarTimeProps {\n  value: Date;\n  doneButtonText?: string;\n  changeHoursAriaLabel?: string;\n  changeMinutesAriaLabel?: string;\n  onChange?(value: Date): void;\n  onClose?(): void;\n}\n\nconst hours: Array<{\n  value: number;\n  label: string;\n}> = [];\nfor (let i = 0; i < 24; i += 1) {\n  hours.push({ value: i, label: String(i).padStart(2, '0') });\n}\n\nconst minutes: Array<{\n  value: number;\n  label: string;\n}> = [];\nfor (let i = 0; i < 60; i += 1) {\n  minutes.push({ value: i, label: String(i).padStart(2, '0') });\n}\n\nexport const CalendarTime = ({\n  value,\n  doneButtonText = 'Готово',\n  onChange,\n  onClose,\n  changeHoursAriaLabel = 'Изменить час',\n  changeMinutesAriaLabel = 'Изменить минуту',\n}: CalendarTimeProps) => {\n  const onHoursChange = React.useCallback(\n    (event: React.ChangeEvent<HTMLSelectElement>) =>\n      onChange?.(setHours(value, Number(event.target.value))),\n    [onChange, value],\n  );\n  const onMinutesChange = React.useCallback(\n    (event: React.ChangeEvent<HTMLSelectElement>) =>\n      onChange?.(setMinutes(value, Number(event.target.value))),\n    [onChange, value],\n  );\n\n  return (\n    <div className={styles['CalendarTime']}>\n      <div className={styles['CalendarTime__picker']}>\n        <AdaptivityProvider sizeY={SizeType.COMPACT}>\n          <CustomSelect\n            value={value.getHours()}\n            options={hours}\n            onChange={onHoursChange}\n            forceDropdownPortal={false}\n            aria-label={changeHoursAriaLabel}\n          />\n        </AdaptivityProvider>\n      </div>\n      <div className={styles['CalendarTime__divider']}>:</div>\n      <div className={styles['CalendarTime__picker']}>\n        <AdaptivityProvider sizeY={SizeType.COMPACT}>\n          <CustomSelect\n            value={value.getMinutes()}\n            options={minutes}\n            onChange={onMinutesChange}\n            forceDropdownPortal={false}\n            aria-label={changeMinutesAriaLabel}\n          />\n        </AdaptivityProvider>\n      </div>\n      <div className={styles['CalendarTime__button']}>\n        <AdaptivityProvider sizeY={SizeType.COMPACT}>\n          <Button mode=\"secondary\" onClick={onClose} size=\"l\" aria-label={doneButtonText}>\n            {doneButtonText}\n          </Button>\n        </AdaptivityProvider>\n      </div>\n    </div>\n  );\n};\n"],"names":["React","SizeType","setHours","setMinutes","AdaptivityProvider","Button","CustomSelect","hours","i","push","value","label","String","padStart","minutes","CalendarTime","doneButtonText","onChange","onClose","changeHoursAriaLabel","changeMinutesAriaLabel","onHoursChange","useCallback","event","Number","target","onMinutesChange","div","className","sizeY","COMPACT","getHours","options","forceDropdownPortal","aria-label","getMinutes","mode","onClick","size"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,QAAQ,QAAQ,uBAAuB;AAChD,SAASC,QAAQ,EAAEC,UAAU,QAAQ,iBAAiB;AACtD,SAASC,kBAAkB,QAAQ,2CAA2C;AAC9E,SAASC,MAAM,QAAQ,mBAAmB;AAC1C,SAASC,YAAY,QAAQ,+BAA+B;AAY5D,IAAMC,QAGD,EAAE;AACP,IAAK,IAAIC,IAAI,GAAGA,IAAI,IAAIA,KAAK,EAAG;IAC9BD,MAAME,KAAK;QAAEC,OAAOF;QAAGG,OAAOC,OAAOJ,GAAGK,SAAS,GAAG;IAAK;AAC3D;AAEA,IAAMC,UAGD,EAAE;AACP,IAAK,IAAIN,KAAI,GAAGA,KAAI,IAAIA,MAAK,EAAG;IAC9BM,QAAQL,KAAK;QAAEC,OAAOF;QAAGG,OAAOC,OAAOJ,IAAGK,SAAS,GAAG;IAAK;AAC7D;AAEA,OAAO,IAAME,eAAe;QAC1BL,cAAAA,qCACAM,gBAAAA,oDAAiB,kCACjBC,iBAAAA,UACAC,gBAAAA,6CACAC,sBAAAA,gEAAuB,oFACvBC,wBAAAA,oEAAyB;IAEzB,IAAMC,gBAAgBrB,MAAMsB,YAC1B,SAACC;QACCN,OAAAA,qBAAAA,sBAAAA,KAAAA,IAAAA,SAAWf,SAASQ,OAAOc,OAAOD,MAAME,OAAOf;OACjD;QAACO;QAAUP;KAAM;IAEnB,IAAMgB,kBAAkB1B,MAAMsB,YAC5B,SAACC;QACCN,OAAAA,qBAAAA,sBAAAA,KAAAA,IAAAA,SAAWd,WAAWO,OAAOc,OAAOD,MAAME,OAAOf;OACnD;QAACO;QAAUP;KAAM;IAGnB,qBACE,oBAACiB;QAAIC,SAAS;qBACZ,oBAACD;QAAIC,SAAS;qBACZ,oBAACxB;QAAmByB,OAAO5B,SAAS6B;qBAClC,oBAACxB;QACCI,OAAOA,MAAMqB;QACbC,SAASzB;QACTU,UAAUI;QACVY,qBAAqB;QACrBC,cAAYf;wBAIlB,oBAACQ;QAAIC,SAAS;OAAmC,oBACjD,oBAACD;QAAIC,SAAS;qBACZ,oBAACxB;QAAmByB,OAAO5B,SAAS6B;qBAClC,oBAACxB;QACCI,OAAOA,MAAMyB;QACbH,SAASlB;QACTG,UAAUS;QACVO,qBAAqB;QACrBC,cAAYd;wBAIlB,oBAACO;QAAIC,SAAS;qBACZ,oBAACxB;QAAmByB,OAAO5B,SAAS6B;qBAClC,oBAACzB;QAAO+B,MAAK;QAAYC,SAASnB;QAASoB,MAAK;QAAIJ,cAAYlB;OAC7DA;AAMb,EAAE"}
+{"version":3,"sources":["../../../src/components/CalendarTime/CalendarTime.tsx"],"sourcesContent":["import * as React from 'react';\nimport { SizeType } from '../../lib/adaptivity';\nimport { setHours, setMinutes } from '../../lib/date';\nimport { AdaptivityProvider } from '../AdaptivityProvider/AdaptivityProvider';\nimport { Button } from '../Button/Button';\nimport { CustomSelect } from '../CustomSelect/CustomSelect';\nimport styles from './CalendarTime.module.css';\n\nexport interface CalendarTimeProps {\n  value: Date;\n  doneButtonText?: string;\n  changeHoursAriaLabel?: string;\n  changeMinutesAriaLabel?: string;\n  onChange?(value: Date): void;\n  onClose?(): void;\n}\n\nconst hours: Array<{\n  value: number;\n  label: string;\n}> = [];\nfor (let i = 0; i < 24; i += 1) {\n  hours.push({ value: i, label: String(i).padStart(2, '0') });\n}\n\nconst minutes: Array<{\n  value: number;\n  label: string;\n}> = [];\nfor (let i = 0; i < 60; i += 1) {\n  minutes.push({ value: i, label: String(i).padStart(2, '0') });\n}\n\nexport const CalendarTime = ({\n  value,\n  doneButtonText = 'Готово',\n  onChange,\n  onClose,\n  changeHoursAriaLabel = 'Изменить час',\n  changeMinutesAriaLabel = 'Изменить минуту',\n}: CalendarTimeProps) => {\n  const onHoursChange = React.useCallback(\n    (event: React.ChangeEvent<HTMLSelectElement>) =>\n      onChange?.(setHours(value, Number(event.target.value))),\n    [onChange, value],\n  );\n  const onMinutesChange = React.useCallback(\n    (event: React.ChangeEvent<HTMLSelectElement>) =>\n      onChange?.(setMinutes(value, Number(event.target.value))),\n    [onChange, value],\n  );\n\n  return (\n    <div className={styles['CalendarTime']}>\n      <div className={styles['CalendarTime__picker']}>\n        <AdaptivityProvider sizeY={SizeType.COMPACT}>\n          <CustomSelect\n            value={value.getHours()}\n            options={hours}\n            onChange={onHoursChange}\n            forceDropdownPortal={false}\n            aria-label={changeHoursAriaLabel}\n          />\n        </AdaptivityProvider>\n      </div>\n      <div className={styles['CalendarTime__divider']}>:</div>\n      <div className={styles['CalendarTime__picker']}>\n        <AdaptivityProvider sizeY={SizeType.COMPACT}>\n          <CustomSelect\n            value={value.getMinutes()}\n            options={minutes}\n            onChange={onMinutesChange}\n            forceDropdownPortal={false}\n            aria-label={changeMinutesAriaLabel}\n          />\n        </AdaptivityProvider>\n      </div>\n      <div className={styles['CalendarTime__button']}>\n        <AdaptivityProvider sizeY={SizeType.COMPACT}>\n          <Button mode=\"secondary\" onClick={onClose} size=\"l\" aria-label={doneButtonText}>\n            {doneButtonText}\n          </Button>\n        </AdaptivityProvider>\n      </div>\n    </div>\n  );\n};\n"],"names":["React","SizeType","setHours","setMinutes","AdaptivityProvider","Button","CustomSelect","hours","i","push","value","label","String","padStart","minutes","CalendarTime","doneButtonText","onChange","onClose","changeHoursAriaLabel","changeMinutesAriaLabel","onHoursChange","useCallback","event","Number","target","onMinutesChange","div","className","sizeY","COMPACT","getHours","options","forceDropdownPortal","aria-label","getMinutes","mode","onClick","size"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,QAAQ,QAAQ,uBAAuB;AAChD,SAASC,QAAQ,EAAEC,UAAU,QAAQ,iBAAiB;AACtD,SAASC,kBAAkB,QAAQ,2CAA2C;AAC9E,SAASC,MAAM,QAAQ,mBAAmB;AAC1C,SAASC,YAAY,QAAQ,+BAA+B;AAY5D,IAAMC,QAGD,EAAE;AACP,IAAK,IAAIC,IAAI,GAAGA,IAAI,IAAIA,KAAK,EAAG;IAC9BD,MAAME,IAAI,CAAC;QAAEC,OAAOF;QAAGG,OAAOC,OAAOJ,GAAGK,QAAQ,CAAC,GAAG;IAAK;AAC3D;AAEA,IAAMC,UAGD,EAAE;AACP,IAAK,IAAIN,KAAI,GAAGA,KAAI,IAAIA,MAAK,EAAG;IAC9BM,QAAQL,IAAI,CAAC;QAAEC,OAAOF;QAAGG,OAAOC,OAAOJ,IAAGK,QAAQ,CAAC,GAAG;IAAK;AAC7D;AAEA,OAAO,IAAME,eAAe;QAC1BL,cAAAA,qCACAM,gBAAAA,oDAAiB,kCACjBC,iBAAAA,UACAC,gBAAAA,6CACAC,sBAAAA,gEAAuB,oFACvBC,wBAAAA,oEAAyB;IAEzB,IAAMC,gBAAgBrB,MAAMsB,WAAW,CACrC,SAACC;YACCN;gBAAAA,YAAAA,sBAAAA,gCAAAA,UAAWf,SAASQ,OAAOc,OAAOD,MAAME,MAAM,CAACf,KAAK;OACtD;QAACO;QAAUP;KAAM;IAEnB,IAAMgB,kBAAkB1B,MAAMsB,WAAW,CACvC,SAACC;YACCN;gBAAAA,YAAAA,sBAAAA,gCAAAA,UAAWd,WAAWO,OAAOc,OAAOD,MAAME,MAAM,CAACf,KAAK;OACxD;QAACO;QAAUP;KAAM;IAGnB,qBACE,oBAACiB;QAAIC,SAAS;qBACZ,oBAACD;QAAIC,SAAS;qBACZ,oBAACxB;QAAmByB,OAAO5B,SAAS6B,OAAO;qBACzC,oBAACxB;QACCI,OAAOA,MAAMqB,QAAQ;QACrBC,SAASzB;QACTU,UAAUI;QACVY,qBAAqB;QACrBC,cAAYf;wBAIlB,oBAACQ;QAAIC,SAAS;OAAmC,oBACjD,oBAACD;QAAIC,SAAS;qBACZ,oBAACxB;QAAmByB,OAAO5B,SAAS6B,OAAO;qBACzC,oBAACxB;QACCI,OAAOA,MAAMyB,UAAU;QACvBH,SAASlB;QACTG,UAAUS;QACVO,qBAAqB;QACrBC,cAAYd;wBAIlB,oBAACO;QAAIC,SAAS;qBACZ,oBAACxB;QAAmByB,OAAO5B,SAAS6B,OAAO;qBACzC,oBAACzB;QAAO+B,MAAK;QAAYC,SAASnB;QAASoB,MAAK;QAAIJ,cAAYlB;OAC7DA;AAMb,EAAE"}

package/dist/components/CardGrid/CardGrid.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/CardGrid/CardGrid.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { useAdaptivity } from '../../hooks/useAdaptivity';\nimport { SizeType } from '../../lib/adaptivity';\nimport styles from './CardGrid.module.css';\n\nconst sizeXClassNames = {\n  none: styles['CardGrid--sizeX-none'],\n  [SizeType.COMPACT]: styles['CardGrid--sizeX-compact'],\n};\n\nexport interface CardGridProps extends React.HTMLAttributes<HTMLDivElement> {\n  size?: 's' | 'm' | 'l';\n  /**\n   * Если true, то вокруг компонента присутствуют стандартные отсупы сверху/снизу и слева/справа\n   */\n  spaced?: boolean;\n}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/CardGrid\n */\nexport const CardGrid = ({\n  children,\n  size = 's',\n  spaced = false,\n  className,\n  ...restProps\n}: CardGridProps) => {\n  const { sizeX = 'none' } = useAdaptivity();\n\n  return (\n    <div\n      {...restProps}\n      className={classNames(\n        styles['CardGrid'],\n        'vkuiInternalCardGrid',\n        spaced && styles['CardGrid--spaced'],\n        {\n          s: 'vkuiInternalCardGrid--size-s',\n          m: 'vkuiInternalCardGrid--size-m',\n          l: 'vkuiInternalCardGrid--size-l',\n        }[size],\n        sizeX !== SizeType.REGULAR && sizeXClassNames[sizeX],\n        className,\n      )}\n    >\n      {children}\n    </div>\n  );\n};\n"],"names":["React","classNames","useAdaptivity","SizeType","sizeXClassNames","none","COMPACT","CardGrid","children","size","spaced","className","restProps","sizeX","div","s","m","l","REGULAR"],"mappings":";;;;AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,UAAU,QAAQ,kBAAkB;AAC7C,SAASC,aAAa,QAAQ,4BAA4B;AAC1D,SAASC,QAAQ,QAAQ,uBAAuB;AAGhD,IAAMC;IACJC,IAAI;GACHF,SAASG;AAWZ;;CAEC,GACD,OAAO,IAAMC,WAAW;QACtBC,kBAAAA,+BACAC,MAAAA,gCAAO,0CACPC,QAAAA,oCAAS,uBACTC,mBAAAA,WACGC;QAJHJ;QACAC;QACAC;QACAC;;IAGA,IAA2BT,iBAAAA,wCAAAA,eAAnBW,OAAAA,0CAAQ;IAEhB,qBACE,oBAACC,+CACKF;QACJD,WAAWV,2BAET,wBACAS,kCACA;YACEK,GAAG;YACHC,GAAG;YACHC,GAAG;QACL,CAAC,CAACR,KAAK,EACPI,UAAUV,SAASe,WAAWd,eAAe,CAACS,MAAM,EACpDF;QAGDH;AAGP,EAAE"}
+{"version":3,"sources":["../../../src/components/CardGrid/CardGrid.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { useAdaptivity } from '../../hooks/useAdaptivity';\nimport { SizeType } from '../../lib/adaptivity';\nimport styles from './CardGrid.module.css';\n\nconst sizeXClassNames = {\n  none: styles['CardGrid--sizeX-none'],\n  [SizeType.COMPACT]: styles['CardGrid--sizeX-compact'],\n};\n\nexport interface CardGridProps extends React.HTMLAttributes<HTMLDivElement> {\n  size?: 's' | 'm' | 'l';\n  /**\n   * Если true, то вокруг компонента присутствуют стандартные отсупы сверху/снизу и слева/справа\n   */\n  spaced?: boolean;\n}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/CardGrid\n */\nexport const CardGrid = ({\n  children,\n  size = 's',\n  spaced = false,\n  className,\n  ...restProps\n}: CardGridProps) => {\n  const { sizeX = 'none' } = useAdaptivity();\n\n  return (\n    <div\n      {...restProps}\n      className={classNames(\n        styles['CardGrid'],\n        'vkuiInternalCardGrid',\n        spaced && styles['CardGrid--spaced'],\n        {\n          s: 'vkuiInternalCardGrid--size-s',\n          m: 'vkuiInternalCardGrid--size-m',\n          l: 'vkuiInternalCardGrid--size-l',\n        }[size],\n        sizeX !== SizeType.REGULAR && sizeXClassNames[sizeX],\n        className,\n      )}\n    >\n      {children}\n    </div>\n  );\n};\n"],"names":["React","classNames","useAdaptivity","SizeType","sizeXClassNames","none","COMPACT","CardGrid","children","size","spaced","className","restProps","sizeX","div","s","m","l","REGULAR"],"mappings":";;;;AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,UAAU,QAAQ,kBAAkB;AAC7C,SAASC,aAAa,QAAQ,4BAA4B;AAC1D,SAASC,QAAQ,QAAQ,uBAAuB;AAGhD,IAAMC;IACJC,IAAI;GACHF,SAASG,OAAO;AAWnB;;CAEC,GACD,OAAO,IAAMC,WAAW;QACtBC,kBAAAA,+BACAC,MAAAA,gCAAO,0CACPC,QAAAA,oCAAS,uBACTC,mBAAAA,WACGC;QAJHJ;QACAC;QACAC;QACAC;;IAGA,IAA2BT,iBAAAA,wCAAAA,eAAnBW,OAAAA,0CAAQ;IAEhB,qBACE,oBAACC,+CACKF;QACJD,WAAWV,2BAET,wBACAS,kCACA;YACEK,GAAG;YACHC,GAAG;YACHC,GAAG;QACL,CAAC,CAACR,KAAK,EACPI,UAAUV,SAASe,OAAO,IAAId,eAAe,CAACS,MAAM,EACpDF;QAGDH;AAGP,EAAE"}

package/dist/components/CardScroll/CardScroll.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/CardScroll/CardScroll.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { useDOM } from '../../lib/dom';\nimport { HorizontalScroll, HorizontalScrollProps } from '../HorizontalScroll/HorizontalScroll';\nimport styles from './CardScroll.module.css';\n\nexport interface CardScrollProps extends React.HTMLAttributes<HTMLDivElement> {\n  /**\n   * При `size=false` ширина `Card` будет регулироваться контентом внутри. В остальных случаях — будет явно задана в процентах.\n   */\n  size?: 's' | 'm' | 'l' | false;\n  showArrows?: HorizontalScrollProps['showArrows'];\n  withSpaces?: boolean;\n}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/CardScroll\n */\nexport const CardScroll = ({\n  children,\n  size = 's',\n  showArrows = true,\n  withSpaces = true,\n  className,\n  ...restProps\n}: CardScrollProps) => {\n  const refContainer = React.useRef<HTMLDivElement>(null);\n  const gapRef = React.useRef<HTMLDivElement>(null);\n\n  const { window } = useDOM();\n\n  function getScrollToLeft(offset: number): number {\n    if (!refContainer.current || !gapRef.current) {\n      return offset;\n    }\n    const containerWidth = refContainer.current.offsetWidth;\n    const slideIndex = ([...refContainer.current.children] as HTMLElement[]).findIndex(\n      (el: HTMLElement) =>\n        el.offsetLeft +\n          el.offsetWidth +\n          parseInt(window!.getComputedStyle(el).marginRight) -\n          offset >=\n        0,\n    );\n\n    if (slideIndex === -1) {\n      return offset;\n    }\n\n    if (slideIndex === 0) {\n      return 0;\n    }\n\n    const slide = refContainer.current.children[slideIndex] as HTMLElement;\n\n    const scrollTo =\n      slide.offsetLeft - (containerWidth - slide.offsetWidth) + gapRef.current.offsetWidth;\n\n    if (scrollTo <= 2 * gapRef.current.offsetWidth) {\n      return 0;\n    }\n\n    return scrollTo;\n  }\n\n  function getScrollToRight(offset: number): number {\n    if (!refContainer.current || !gapRef.current) {\n      return offset;\n    }\n\n    const containerWidth = refContainer.current.offsetWidth;\n    const slide = Array.prototype.find.call(\n      refContainer.current.children,\n      (el: HTMLElement) => el.offsetLeft + el.offsetWidth - offset > containerWidth,\n    ) as HTMLElement;\n\n    if (!slide) {\n      return offset;\n    }\n\n    return slide.offsetLeft - gapRef.current.offsetWidth;\n  }\n\n  return (\n    <div\n      {...restProps}\n      className={classNames(\n        styles['CardScroll'],\n        'vkuiInternalCardScroll',\n        size !== false &&\n          {\n            s: 'vkuiInternalCardScroll--size-s',\n            m: 'vkuiInternalCardScroll--size-m',\n            l: 'vkuiInternalCardScroll--size-l',\n          }[size],\n        withSpaces && styles['CardScroll--withSpaces'],\n        className,\n      )}\n    >\n      <HorizontalScroll\n        getScrollToLeft={getScrollToLeft}\n        getScrollToRight={getScrollToRight}\n        showArrows={showArrows}\n      >\n        <div className={styles['CardScroll__in']} ref={refContainer}>\n          <span className={styles['CardScroll__gap']} ref={gapRef} />\n          {children}\n          <span className={styles['CardScroll__gap']} />\n        </div>\n      </HorizontalScroll>\n    </div>\n  );\n};\n"],"names":["React","classNames","useDOM","HorizontalScroll","CardScroll","getScrollToLeft","offset","refContainer","current","gapRef","containerWidth","offsetWidth","slideIndex","children","findIndex","el","offsetLeft","parseInt","window","getComputedStyle","marginRight","slide","scrollTo","getScrollToRight","Array","prototype","find","call","size","showArrows","withSpaces","className","restProps","useRef","div","s","m","l","ref","span"],"mappings":";;;;AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,UAAU,QAAQ,kBAAkB;AAC7C,SAASC,MAAM,QAAQ,gBAAgB;AACvC,SAASC,gBAAgB,QAA+B,uCAAuC;AAY/F;;CAEC,GACD,OAAO,IAAMC,aAAa;QAafC,kBAAT,SAASA,gBAAgBC,MAAc;QACrC,IAAI,CAACC,aAAaC,WAAW,CAACC,OAAOD,SAAS;YAC5C,OAAOF;QACT;QACA,IAAMI,iBAAiBH,aAAaC,QAAQG;QAC5C,IAAMC,aAAa,AAAE,qBAAGL,aAAaC,QAAQK,UAA4BC,UACvE,SAACC;mBACCA,GAAGC,aACDD,GAAGJ,cACHM,SAASC,OAAQC,iBAAiBJ,IAAIK,eACtCd,UACF;;QAGJ,IAAIM,eAAe,CAAC,GAAG;YACrB,OAAON;QACT;QAEA,IAAIM,eAAe,GAAG;YACpB,OAAO;QACT;QAEA,IAAMS,QAAQd,aAAaC,QAAQK,QAAQ,CAACD,WAAW;QAEvD,IAAMU,WACJD,MAAML,aAAcN,CAAAA,iBAAiBW,MAAMV,WAAU,IAAKF,OAAOD,QAAQG;QAE3E,IAAIW,YAAY,IAAIb,OAAOD,QAAQG,aAAa;YAC9C,OAAO;QACT;QAEA,OAAOW;IACT;QAESC,mBAAT,SAASA,iBAAiBjB,MAAc;QACtC,IAAI,CAACC,aAAaC,WAAW,CAACC,OAAOD,SAAS;YAC5C,OAAOF;QACT;QAEA,IAAMI,iBAAiBH,aAAaC,QAAQG;QAC5C,IAAMU,QAAQG,MAAMC,UAAUC,KAAKC,KACjCpB,aAAaC,QAAQK,UACrB,SAACE;mBAAoBA,GAAGC,aAAaD,GAAGJ,cAAcL,SAASI;;QAGjE,IAAI,CAACW,OAAO;YACV,OAAOf;QACT;QAEA,OAAOe,MAAML,aAAaP,OAAOD,QAAQG;IAC3C;QA9DAE,kBAAAA,+BACAe,MAAAA,gCAAO,8CACPC,YAAAA,4CAAa,qDACbC,YAAAA,4CAAa,0BACbC,mBAAAA,WACGC;QALHnB;QACAe;QACAC;QACAC;QACAC;;IAGA,IAAMxB,eAAeP,MAAMiC,OAAuB;IAClD,IAAMxB,SAAST,MAAMiC,OAAuB;IAE5C,IAAM,AAAEf,SAAWhB,SAAXgB;IAsDR,qBACE,oBAACgB,+CACKF;QACJD,WAAW9B,6BAET,0BACA2B,SAAS,SACP,CAAA;YACEO,GAAG;YACHC,GAAG;YACHC,GAAG;QACL,CAAA,CAAC,CAACT,KAAK,EACTE,4CACAC;sBAGF,oBAAC5B;QACCE,iBAAiBA;QACjBkB,kBAAkBA;QAClBM,YAAYA;qBAEZ,oBAACK;QAAIH,SAAS;QAA4BO,KAAK/B;qBAC7C,oBAACgC;QAAKR,SAAS;QAA6BO,KAAK7B;QAChDI,wBACD,oBAAC0B;QAAKR,SAAS;;AAKzB,EAAE"}
+{"version":3,"sources":["../../../src/components/CardScroll/CardScroll.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { useDOM } from '../../lib/dom';\nimport { HorizontalScroll, HorizontalScrollProps } from '../HorizontalScroll/HorizontalScroll';\nimport styles from './CardScroll.module.css';\n\nexport interface CardScrollProps extends React.HTMLAttributes<HTMLDivElement> {\n  /**\n   * При `size=false` ширина `Card` будет регулироваться контентом внутри. В остальных случаях — будет явно задана в процентах.\n   */\n  size?: 's' | 'm' | 'l' | false;\n  showArrows?: HorizontalScrollProps['showArrows'];\n  withSpaces?: boolean;\n}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/CardScroll\n */\nexport const CardScroll = ({\n  children,\n  size = 's',\n  showArrows = true,\n  withSpaces = true,\n  className,\n  ...restProps\n}: CardScrollProps) => {\n  const refContainer = React.useRef<HTMLDivElement>(null);\n  const gapRef = React.useRef<HTMLDivElement>(null);\n\n  const { window } = useDOM();\n\n  function getScrollToLeft(offset: number): number {\n    if (!refContainer.current || !gapRef.current) {\n      return offset;\n    }\n    const containerWidth = refContainer.current.offsetWidth;\n    const slideIndex = ([...refContainer.current.children] as HTMLElement[]).findIndex(\n      (el: HTMLElement) =>\n        el.offsetLeft +\n          el.offsetWidth +\n          parseInt(window!.getComputedStyle(el).marginRight) -\n          offset >=\n        0,\n    );\n\n    if (slideIndex === -1) {\n      return offset;\n    }\n\n    if (slideIndex === 0) {\n      return 0;\n    }\n\n    const slide = refContainer.current.children[slideIndex] as HTMLElement;\n\n    const scrollTo =\n      slide.offsetLeft - (containerWidth - slide.offsetWidth) + gapRef.current.offsetWidth;\n\n    if (scrollTo <= 2 * gapRef.current.offsetWidth) {\n      return 0;\n    }\n\n    return scrollTo;\n  }\n\n  function getScrollToRight(offset: number): number {\n    if (!refContainer.current || !gapRef.current) {\n      return offset;\n    }\n\n    const containerWidth = refContainer.current.offsetWidth;\n    const slide = Array.prototype.find.call(\n      refContainer.current.children,\n      (el: HTMLElement) => el.offsetLeft + el.offsetWidth - offset > containerWidth,\n    ) as HTMLElement;\n\n    if (!slide) {\n      return offset;\n    }\n\n    return slide.offsetLeft - gapRef.current.offsetWidth;\n  }\n\n  return (\n    <div\n      {...restProps}\n      className={classNames(\n        styles['CardScroll'],\n        'vkuiInternalCardScroll',\n        size !== false &&\n          {\n            s: 'vkuiInternalCardScroll--size-s',\n            m: 'vkuiInternalCardScroll--size-m',\n            l: 'vkuiInternalCardScroll--size-l',\n          }[size],\n        withSpaces && styles['CardScroll--withSpaces'],\n        className,\n      )}\n    >\n      <HorizontalScroll\n        getScrollToLeft={getScrollToLeft}\n        getScrollToRight={getScrollToRight}\n        showArrows={showArrows}\n      >\n        <div className={styles['CardScroll__in']} ref={refContainer}>\n          <span className={styles['CardScroll__gap']} ref={gapRef} />\n          {children}\n          <span className={styles['CardScroll__gap']} />\n        </div>\n      </HorizontalScroll>\n    </div>\n  );\n};\n"],"names":["React","classNames","useDOM","HorizontalScroll","CardScroll","getScrollToLeft","offset","refContainer","current","gapRef","containerWidth","offsetWidth","slideIndex","children","findIndex","el","offsetLeft","parseInt","window","getComputedStyle","marginRight","slide","scrollTo","getScrollToRight","Array","prototype","find","call","size","showArrows","withSpaces","className","restProps","useRef","div","s","m","l","ref","span"],"mappings":";;;;AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,UAAU,QAAQ,kBAAkB;AAC7C,SAASC,MAAM,QAAQ,gBAAgB;AACvC,SAASC,gBAAgB,QAA+B,uCAAuC;AAY/F;;CAEC,GACD,OAAO,IAAMC,aAAa;QAafC,kBAAT,SAASA,gBAAgBC,MAAc;QACrC,IAAI,CAACC,aAAaC,OAAO,IAAI,CAACC,OAAOD,OAAO,EAAE;YAC5C,OAAOF;QACT;QACA,IAAMI,iBAAiBH,aAAaC,OAAO,CAACG,WAAW;QACvD,IAAMC,aAAa,AAAE,qBAAGL,aAAaC,OAAO,CAACK,QAAQ,EAAoBC,SAAS,CAChF,SAACC;mBACCA,GAAGC,UAAU,GACXD,GAAGJ,WAAW,GACdM,SAASC,OAAQC,gBAAgB,CAACJ,IAAIK,WAAW,IACjDd,UACF;;QAGJ,IAAIM,eAAe,CAAC,GAAG;YACrB,OAAON;QACT;QAEA,IAAIM,eAAe,GAAG;YACpB,OAAO;QACT;QAEA,IAAMS,QAAQd,aAAaC,OAAO,CAACK,QAAQ,CAACD,WAAW;QAEvD,IAAMU,WACJD,MAAML,UAAU,GAAIN,CAAAA,iBAAiBW,MAAMV,WAAW,AAAD,IAAKF,OAAOD,OAAO,CAACG,WAAW;QAEtF,IAAIW,YAAY,IAAIb,OAAOD,OAAO,CAACG,WAAW,EAAE;YAC9C,OAAO;QACT;QAEA,OAAOW;IACT;QAESC,mBAAT,SAASA,iBAAiBjB,MAAc;QACtC,IAAI,CAACC,aAAaC,OAAO,IAAI,CAACC,OAAOD,OAAO,EAAE;YAC5C,OAAOF;QACT;QAEA,IAAMI,iBAAiBH,aAAaC,OAAO,CAACG,WAAW;QACvD,IAAMU,QAAQG,MAAMC,SAAS,CAACC,IAAI,CAACC,IAAI,CACrCpB,aAAaC,OAAO,CAACK,QAAQ,EAC7B,SAACE;mBAAoBA,GAAGC,UAAU,GAAGD,GAAGJ,WAAW,GAAGL,SAASI;;QAGjE,IAAI,CAACW,OAAO;YACV,OAAOf;QACT;QAEA,OAAOe,MAAML,UAAU,GAAGP,OAAOD,OAAO,CAACG,WAAW;IACtD;QA9DAE,kBAAAA,+BACAe,MAAAA,gCAAO,8CACPC,YAAAA,4CAAa,qDACbC,YAAAA,4CAAa,0BACbC,mBAAAA,WACGC;QALHnB;QACAe;QACAC;QACAC;QACAC;;IAGA,IAAMxB,eAAeP,MAAMiC,MAAM,CAAiB;IAClD,IAAMxB,SAAST,MAAMiC,MAAM,CAAiB;IAE5C,IAAM,AAAEf,SAAWhB,SAAXgB;IAsDR,qBACE,oBAACgB,+CACKF;QACJD,WAAW9B,6BAET,0BACA2B,SAAS,SACP,CAAA;YACEO,GAAG;YACHC,GAAG;YACHC,GAAG;QACL,CAAA,CAAC,CAACT,KAAK,EACTE,4CACAC;sBAGF,oBAAC5B;QACCE,iBAAiBA;QACjBkB,kBAAkBA;QAClBM,YAAYA;qBAEZ,oBAACK;QAAIH,SAAS;QAA4BO,KAAK/B;qBAC7C,oBAACgC;QAAKR,SAAS;QAA6BO,KAAK7B;QAChDI,wBACD,oBAAC0B;QAAKR,SAAS;;AAKzB,EAAE"}

package/dist/components/Cell/Cell.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/Cell/Cell.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames, noop } from '@vkontakte/vkjs';\nimport { useExternRef } from '../../hooks/useExternRef';\nimport { usePlatform } from '../../hooks/usePlatform';\nimport { Platform } from '../../lib/platform';\nimport { HasRootRef } from '../../types';\nimport { ListContext } from '../List/ListContext';\nimport { Removable, RemovableProps } from '../Removable/Removable';\nimport { SimpleCell, SimpleCellProps } from '../SimpleCell/SimpleCell';\nimport { CellCheckbox, CellCheckboxProps } from './CellCheckbox/CellCheckbox';\nimport { CellDragger } from './CellDragger/CellDragger';\nimport { useDraggable } from './useDraggable';\nimport styles from './Cell.module.css';\n\nexport interface CellProps\n  extends Omit<SimpleCellProps, 'getRootRef'>,\n    RemovableProps,\n    HasRootRef<HTMLDivElement> {\n  mode?: 'removable' | 'selectable';\n  /**\n   * В режиме перетаскивания ячейка перестает быть кликабельной, то есть при клике переданный onClick вызываться не будет\n   */\n  draggable?: boolean;\n  /**\n   * Имя для input в режиме selectable\n   */\n  name?: string;\n  /**\n   * В режиме selectable реагирует на входящие значения пропса cheсked, как зависящий напрямую от входящего значения\n   */\n  checked?: boolean;\n  /**\n   * В режиме selectable реагирует на входящие значения пропса defaultChecked как неконтролируемый компонент\n   */\n  defaultChecked?: boolean;\n  /**\n   * Коллбэк срабатывает при завершении перетаскивания.\n   * **Важно:** режим перетаскивания не меняет порядок ячеек в DOM. В коллбэке есть объект с полями `from` и `to`.\n   * Эти числа нужны для того, чтобы разработчик понимал, с какого индекса на какой произошел переход. В песочнице\n   * есть рабочий пример с обработкой этих чисел и перерисовкой списка.\n   */\n  onDragFinish?: ({ from, to }: { from: number; to: number }) => void;\n  /**\n   * aria-label для кнопки перетаскивания ячейки\n   */\n  draggerLabel?: string;\n}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/Cell\n */\nexport const Cell = ({\n  mode,\n  onRemove = noop,\n  removePlaceholder = 'Удалить',\n  onDragFinish,\n  before,\n  after,\n  disabled,\n  draggable,\n  Component: ComponentProps,\n  onChange,\n  name,\n  value,\n  checked,\n  defaultChecked,\n  getRootRef,\n  draggerLabel = 'Перенести ячейку',\n  className,\n  style,\n  ...restProps\n}: CellProps) => {\n  const selectable = mode === 'selectable';\n  const removable = mode === 'removable';\n  const Component = selectable ? 'label' : ComponentProps;\n\n  const platform = usePlatform();\n\n  const rootElRef = useExternRef(getRootRef);\n\n  const { dragging, ...draggableProps } = useDraggable({\n    rootElRef,\n    onDragFinish,\n  });\n\n  const { toggleDrag } = React.useContext(ListContext);\n  React.useEffect(() => {\n    if (dragging) {\n      toggleDrag(true);\n      return () => toggleDrag(false);\n    }\n    return undefined;\n  }, [dragging, toggleDrag]);\n\n  let dragger;\n  if (draggable) {\n    dragger = (\n      <CellDragger\n        className={styles['Cell__dragger']}\n        aria-label={draggerLabel}\n        {...draggableProps}\n      />\n    );\n  }\n\n  let checkbox;\n  if (selectable) {\n    const checkboxProps: CellCheckboxProps = {\n      name,\n      value,\n      onChange,\n      defaultChecked,\n      checked,\n      disabled,\n    };\n    checkbox = <CellCheckbox className={styles['Cell__checkbox']} {...checkboxProps} />;\n  }\n\n  const simpleCellDisabled = (draggable && !selectable) || removable || disabled;\n  const hasActive = !simpleCellDisabled && !dragging;\n\n  const cellClasses = classNames(\n    styles['Cell'],\n    platform === Platform.IOS && styles['Cell--ios'],\n    dragging && styles['Cell--dragging'],\n    removable && styles['Cell--removable'],\n    Component === 'label' && styles['Cell--selectable'],\n    disabled && styles['Cell--disabled'],\n  );\n\n  const simpleCell = (\n    <SimpleCell\n      hasActive={hasActive}\n      hasHover={hasActive}\n      {...restProps}\n      className={styles['Cell__content']}\n      disabled={simpleCellDisabled}\n      Component={Component}\n      before={\n        <React.Fragment>\n          {draggable && platform !== Platform.IOS && dragger}\n          {selectable && checkbox}\n          {before}\n        </React.Fragment>\n      }\n      after={\n        <React.Fragment>\n          {draggable && platform === Platform.IOS && dragger}\n          {after}\n        </React.Fragment>\n      }\n    />\n  );\n\n  if (removable) {\n    return (\n      <Removable\n        className={classNames(cellClasses, className)}\n        style={style}\n        getRootRef={rootElRef}\n        removePlaceholder={removePlaceholder}\n        onRemove={(e) => onRemove(e, rootElRef.current)}\n      >\n        {simpleCell}\n      </Removable>\n    );\n  }\n\n  return (\n    <div className={classNames(cellClasses, className)} style={style} ref={rootElRef}>\n      {simpleCell}\n    </div>\n  );\n};\n\nCell.Checkbox = CellCheckbox;\n"],"names":["React","classNames","noop","useExternRef","usePlatform","Platform","ListContext","Removable","SimpleCell","CellCheckbox","CellDragger","useDraggable","Cell","mode","onRemove","removePlaceholder","onDragFinish","before","after","disabled","draggable","Component","ComponentProps","onChange","name","value","checked","defaultChecked","getRootRef","draggerLabel","className","style","restProps","selectable","removable","platform","rootElRef","dragging","draggableProps","toggleDrag","useContext","useEffect","undefined","dragger","aria-label","checkbox","checkboxProps","simpleCellDisabled","hasActive","cellClasses","IOS","simpleCell","hasHover","Fragment","e","current","div","ref","Checkbox"],"mappings":"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"}
+{"version":3,"sources":["../../../src/components/Cell/Cell.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames, noop } from '@vkontakte/vkjs';\nimport { useExternRef } from '../../hooks/useExternRef';\nimport { usePlatform } from '../../hooks/usePlatform';\nimport { Platform } from '../../lib/platform';\nimport { HasRootRef } from '../../types';\nimport { ListContext } from '../List/ListContext';\nimport { Removable, RemovableProps } from '../Removable/Removable';\nimport { SimpleCell, SimpleCellProps } from '../SimpleCell/SimpleCell';\nimport { CellCheckbox, CellCheckboxProps } from './CellCheckbox/CellCheckbox';\nimport { CellDragger } from './CellDragger/CellDragger';\nimport { useDraggable } from './useDraggable';\nimport styles from './Cell.module.css';\n\nexport interface CellProps\n  extends Omit<SimpleCellProps, 'getRootRef'>,\n    RemovableProps,\n    HasRootRef<HTMLDivElement> {\n  mode?: 'removable' | 'selectable';\n  /**\n   * В режиме перетаскивания ячейка перестает быть кликабельной, то есть при клике переданный onClick вызываться не будет\n   */\n  draggable?: boolean;\n  /**\n   * Имя для input в режиме selectable\n   */\n  name?: string;\n  /**\n   * В режиме selectable реагирует на входящие значения пропса cheсked, как зависящий напрямую от входящего значения\n   */\n  checked?: boolean;\n  /**\n   * В режиме selectable реагирует на входящие значения пропса defaultChecked как неконтролируемый компонент\n   */\n  defaultChecked?: boolean;\n  /**\n   * Коллбэк срабатывает при завершении перетаскивания.\n   * **Важно:** режим перетаскивания не меняет порядок ячеек в DOM. В коллбэке есть объект с полями `from` и `to`.\n   * Эти числа нужны для того, чтобы разработчик понимал, с какого индекса на какой произошел переход. В песочнице\n   * есть рабочий пример с обработкой этих чисел и перерисовкой списка.\n   */\n  onDragFinish?: ({ from, to }: { from: number; to: number }) => void;\n  /**\n   * aria-label для кнопки перетаскивания ячейки\n   */\n  draggerLabel?: string;\n}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/Cell\n */\nexport const Cell = ({\n  mode,\n  onRemove = noop,\n  removePlaceholder = 'Удалить',\n  onDragFinish,\n  before,\n  after,\n  disabled,\n  draggable,\n  Component: ComponentProps,\n  onChange,\n  name,\n  value,\n  checked,\n  defaultChecked,\n  getRootRef,\n  draggerLabel = 'Перенести ячейку',\n  className,\n  style,\n  ...restProps\n}: CellProps) => {\n  const selectable = mode === 'selectable';\n  const removable = mode === 'removable';\n  const Component = selectable ? 'label' : ComponentProps;\n\n  const platform = usePlatform();\n\n  const rootElRef = useExternRef(getRootRef);\n\n  const { dragging, ...draggableProps } = useDraggable({\n    rootElRef,\n    onDragFinish,\n  });\n\n  const { toggleDrag } = React.useContext(ListContext);\n  React.useEffect(() => {\n    if (dragging) {\n      toggleDrag(true);\n      return () => toggleDrag(false);\n    }\n    return undefined;\n  }, [dragging, toggleDrag]);\n\n  let dragger;\n  if (draggable) {\n    dragger = (\n      <CellDragger\n        className={styles['Cell__dragger']}\n        aria-label={draggerLabel}\n        {...draggableProps}\n      />\n    );\n  }\n\n  let checkbox;\n  if (selectable) {\n    const checkboxProps: CellCheckboxProps = {\n      name,\n      value,\n      onChange,\n      defaultChecked,\n      checked,\n      disabled,\n    };\n    checkbox = <CellCheckbox className={styles['Cell__checkbox']} {...checkboxProps} />;\n  }\n\n  const simpleCellDisabled = (draggable && !selectable) || removable || disabled;\n  const hasActive = !simpleCellDisabled && !dragging;\n\n  const cellClasses = classNames(\n    styles['Cell'],\n    platform === Platform.IOS && styles['Cell--ios'],\n    dragging && styles['Cell--dragging'],\n    removable && styles['Cell--removable'],\n    Component === 'label' && styles['Cell--selectable'],\n    disabled && styles['Cell--disabled'],\n  );\n\n  const simpleCell = (\n    <SimpleCell\n      hasActive={hasActive}\n      hasHover={hasActive}\n      {...restProps}\n      className={styles['Cell__content']}\n      disabled={simpleCellDisabled}\n      Component={Component}\n      before={\n        <React.Fragment>\n          {draggable && platform !== Platform.IOS && dragger}\n          {selectable && checkbox}\n          {before}\n        </React.Fragment>\n      }\n      after={\n        <React.Fragment>\n          {draggable && platform === Platform.IOS && dragger}\n          {after}\n        </React.Fragment>\n      }\n    />\n  );\n\n  if (removable) {\n    return (\n      <Removable\n        className={classNames(cellClasses, className)}\n        style={style}\n        getRootRef={rootElRef}\n        removePlaceholder={removePlaceholder}\n        onRemove={(e) => onRemove(e, rootElRef.current)}\n      >\n        {simpleCell}\n      </Removable>\n    );\n  }\n\n  return (\n    <div className={classNames(cellClasses, className)} style={style} ref={rootElRef}>\n      {simpleCell}\n    </div>\n  );\n};\n\nCell.Checkbox = CellCheckbox;\n"],"names":["React","classNames","noop","useExternRef","usePlatform","Platform","ListContext","Removable","SimpleCell","CellCheckbox","CellDragger","useDraggable","Cell","mode","onRemove","removePlaceholder","onDragFinish","before","after","disabled","draggable","Component","ComponentProps","onChange","name","value","checked","defaultChecked","getRootRef","draggerLabel","className","style","restProps","selectable","removable","platform","rootElRef","dragging","draggableProps","toggleDrag","useContext","useEffect","undefined","dragger","aria-label","checkbox","checkboxProps","simpleCellDisabled","hasActive","cellClasses","IOS","simpleCell","hasHover","Fragment","e","current","div","ref","Checkbox"],"mappings":"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"}

package/dist/components/Cell/CellCheckbox/CellCheckbox.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/components/Cell/CellCheckbox/CellCheckbox.tsx"],"sourcesContent":["import * as React from 'react';\nimport {\n  Icon20CheckBoxOff,\n  Icon20CheckBoxOn,\n  Icon24CheckBoxOff,\n  Icon24CheckBoxOn,\n  Icon24CheckCircleOff,\n  Icon24CheckCircleOn,\n} from '@vkontakte/icons';\nimport { classNames } from '@vkontakte/vkjs';\nimport { usePlatform } from '../../../hooks/usePlatform';\nimport { Platform } from '../../../lib/platform';\nimport { HasRef, HasRootRef } from '../../../types';\nimport { AdaptiveIconRenderer } from '../../AdaptiveIconRenderer/AdaptiveIconRenderer';\nimport { VisuallyHidden } from '../../VisuallyHidden/VisuallyHidden';\nimport { CellProps } from '../Cell';\nimport styles from './CellCheckbox.module.css';\n\nconst CheckBoxOn = () => (\n  <AdaptiveIconRenderer IconCompact={Icon20CheckBoxOn} IconRegular={Icon24CheckBoxOn} />\n);\n\nconst CheckBoxOff = () => (\n  <AdaptiveIconRenderer IconCompact={Icon20CheckBoxOff} IconRegular={Icon24CheckBoxOff} />\n);\n\nfunction useTypeIcon(type: NonNullable<CellCheckboxProps['type']>) {\n  const platform = usePlatform();\n\n  if (type !== 'auto') {\n    return type;\n  }\n\n  if (platform === Platform.IOS || platform === Platform.VKCOM) {\n    return 'circle';\n  }\n\n  return 'square';\n}\n\nexport interface CellCheckboxProps\n  extends Pick<CellProps, 'defaultChecked' | 'checked'>,\n    React.InputHTMLAttributes<HTMLInputElement>,\n    HasRootRef<HTMLSpanElement>,\n    HasRef<HTMLInputElement> {\n  /**\n   * Вид чекбокса. Если auto, то зависит от платформы.\n   */\n  type?: 'auto' | 'circle' | 'square';\n}\n\nexport const CellCheckbox = ({\n  getRootRef,\n  getRef,\n  className,\n  style,\n  type = 'auto',\n  ...restProps\n}: CellCheckboxProps) => {\n  const typeIcon = useTypeIcon(type);\n\n  const IconOff = typeIcon === 'circle' ? Icon24CheckCircleOff : CheckBoxOff;\n  const IconOn = typeIcon === 'circle' ? Icon24CheckCircleOn : CheckBoxOn;\n\n  return (\n    <span className={classNames(styles['CellCheckbox'], className)} style={style} ref={getRootRef}>\n      <VisuallyHidden\n        {...restProps}\n        Component=\"input\"\n        type=\"checkbox\"\n        className={styles['CellCheckbox__input']}\n        getRootRef={getRef}\n      />\n      <span\n        className={classNames(styles['CellCheckbox__icon'], styles['CellCheckbox__icon--off'])}\n        aria-hidden\n      >\n        <IconOff />\n      </span>\n      <span\n        className={classNames(styles['CellCheckbox__icon'], styles['CellCheckbox__icon--on'])}\n        aria-hidden\n      >\n        <IconOn />\n      </span>\n    </span>\n  );\n};\n"],"names":["React","Icon20CheckBoxOff","Icon20CheckBoxOn","Icon24CheckBoxOff","Icon24CheckBoxOn","Icon24CheckCircleOff","Icon24CheckCircleOn","classNames","usePlatform","Platform","AdaptiveIconRenderer","VisuallyHidden","CheckBoxOn","IconCompact","IconRegular","CheckBoxOff","useTypeIcon","type","platform","IOS","VKCOM","CellCheckbox","getRootRef","getRef","className","style","restProps","typeIcon","IconOff","IconOn","span","ref","Component","aria-hidden"],"mappings":";;;AAAA,YAAYA,WAAW,QAAQ;AAC/B,SACEC,iBAAiB,EACjBC,gBAAgB,EAChBC,iBAAiB,EACjBC,gBAAgB,EAChBC,oBAAoB,EACpBC,mBAAmB,QACd,mBAAmB;AAC1B,SAASC,UAAU,QAAQ,kBAAkB;AAC7C,SAASC,WAAW,QAAQ,6BAA6B;AACzD,SAASC,QAAQ,QAAQ,wBAAwB;AAEjD,SAASC,oBAAoB,QAAQ,kDAAkD;AACvF,SAASC,cAAc,QAAQ,sCAAsC;AAIrE,IAAMC,aAAa;yBACjB,oBAACF;QAAqBG,aAAaX;QAAkBY,aAAaV;;;AAGpE,IAAMW,cAAc;yBAClB,oBAACL;QAAqBG,aAAaZ;QAAmBa,aAAaX;;;AAGrE,SAASa,YAAYC,IAA4C;IAC/D,IAAMC,WAAWV;IAEjB,IAAIS,SAAS,QAAQ;QACnB,OAAOA;IACT;IAEA,IAAIC,aAAaT,SAASU,OAAOD,aAAaT,SAASW,OAAO;QAC5D,OAAO;IACT;IAEA,OAAO;AACT;AAaA,OAAO,IAAMC,eAAe;QAC1BC,oBAAAA,YACAC,gBAAAA,QACAC,mBAAAA,WACAC,eAAAA,4BACAR,MAAAA,gCAAO,sBACJS;QALHJ;QACAC;QACAC;QACAC;QACAR;;IAGA,IAAMU,WAAWX,YAAYC;IAE7B,IAAMW,UAAUD,aAAa,WAAWtB,uBAAuBU;IAC/D,IAAMc,SAASF,aAAa,WAAWrB,sBAAsBM;IAE7D,qBACE,oBAACkB;QAAKN,WAAWjB,+BAAmCiB;QAAYC,OAAOA;QAAOM,KAAKT;qBACjF,oBAACX,wDACKe;QACJM,WAAU;QACVf,MAAK;QACLO,SAAS;QACTF,YAAYC;uBAEd,oBAACO;QACCN,WAAWjB;QACX0B,eAAAA;qBAEA,oBAACL,+BAEH,oBAACE;QACCN,WAAWjB;QACX0B,eAAAA;qBAEA,oBAACJ;AAIT,EAAE"}
+{"version":3,"sources":["../../../../src/components/Cell/CellCheckbox/CellCheckbox.tsx"],"sourcesContent":["import * as React from 'react';\nimport {\n  Icon20CheckBoxOff,\n  Icon20CheckBoxOn,\n  Icon24CheckBoxOff,\n  Icon24CheckBoxOn,\n  Icon24CheckCircleOff,\n  Icon24CheckCircleOn,\n} from '@vkontakte/icons';\nimport { classNames } from '@vkontakte/vkjs';\nimport { usePlatform } from '../../../hooks/usePlatform';\nimport { Platform } from '../../../lib/platform';\nimport { HasRef, HasRootRef } from '../../../types';\nimport { AdaptiveIconRenderer } from '../../AdaptiveIconRenderer/AdaptiveIconRenderer';\nimport { VisuallyHidden } from '../../VisuallyHidden/VisuallyHidden';\nimport { CellProps } from '../Cell';\nimport styles from './CellCheckbox.module.css';\n\nconst CheckBoxOn = () => (\n  <AdaptiveIconRenderer IconCompact={Icon20CheckBoxOn} IconRegular={Icon24CheckBoxOn} />\n);\n\nconst CheckBoxOff = () => (\n  <AdaptiveIconRenderer IconCompact={Icon20CheckBoxOff} IconRegular={Icon24CheckBoxOff} />\n);\n\nfunction useTypeIcon(type: NonNullable<CellCheckboxProps['type']>) {\n  const platform = usePlatform();\n\n  if (type !== 'auto') {\n    return type;\n  }\n\n  if (platform === Platform.IOS || platform === Platform.VKCOM) {\n    return 'circle';\n  }\n\n  return 'square';\n}\n\nexport interface CellCheckboxProps\n  extends Pick<CellProps, 'defaultChecked' | 'checked'>,\n    React.InputHTMLAttributes<HTMLInputElement>,\n    HasRootRef<HTMLSpanElement>,\n    HasRef<HTMLInputElement> {\n  /**\n   * Вид чекбокса. Если auto, то зависит от платформы.\n   */\n  type?: 'auto' | 'circle' | 'square';\n}\n\nexport const CellCheckbox = ({\n  getRootRef,\n  getRef,\n  className,\n  style,\n  type = 'auto',\n  ...restProps\n}: CellCheckboxProps) => {\n  const typeIcon = useTypeIcon(type);\n\n  const IconOff = typeIcon === 'circle' ? Icon24CheckCircleOff : CheckBoxOff;\n  const IconOn = typeIcon === 'circle' ? Icon24CheckCircleOn : CheckBoxOn;\n\n  return (\n    <span className={classNames(styles['CellCheckbox'], className)} style={style} ref={getRootRef}>\n      <VisuallyHidden\n        {...restProps}\n        Component=\"input\"\n        type=\"checkbox\"\n        className={styles['CellCheckbox__input']}\n        getRootRef={getRef}\n      />\n      <span\n        className={classNames(styles['CellCheckbox__icon'], styles['CellCheckbox__icon--off'])}\n        aria-hidden\n      >\n        <IconOff />\n      </span>\n      <span\n        className={classNames(styles['CellCheckbox__icon'], styles['CellCheckbox__icon--on'])}\n        aria-hidden\n      >\n        <IconOn />\n      </span>\n    </span>\n  );\n};\n"],"names":["React","Icon20CheckBoxOff","Icon20CheckBoxOn","Icon24CheckBoxOff","Icon24CheckBoxOn","Icon24CheckCircleOff","Icon24CheckCircleOn","classNames","usePlatform","Platform","AdaptiveIconRenderer","VisuallyHidden","CheckBoxOn","IconCompact","IconRegular","CheckBoxOff","useTypeIcon","type","platform","IOS","VKCOM","CellCheckbox","getRootRef","getRef","className","style","restProps","typeIcon","IconOff","IconOn","span","ref","Component","aria-hidden"],"mappings":";;;AAAA,YAAYA,WAAW,QAAQ;AAC/B,SACEC,iBAAiB,EACjBC,gBAAgB,EAChBC,iBAAiB,EACjBC,gBAAgB,EAChBC,oBAAoB,EACpBC,mBAAmB,QACd,mBAAmB;AAC1B,SAASC,UAAU,QAAQ,kBAAkB;AAC7C,SAASC,WAAW,QAAQ,6BAA6B;AACzD,SAASC,QAAQ,QAAQ,wBAAwB;AAEjD,SAASC,oBAAoB,QAAQ,kDAAkD;AACvF,SAASC,cAAc,QAAQ,sCAAsC;AAIrE,IAAMC,aAAa;yBACjB,oBAACF;QAAqBG,aAAaX;QAAkBY,aAAaV;;;AAGpE,IAAMW,cAAc;yBAClB,oBAACL;QAAqBG,aAAaZ;QAAmBa,aAAaX;;;AAGrE,SAASa,YAAYC,IAA4C;IAC/D,IAAMC,WAAWV;IAEjB,IAAIS,SAAS,QAAQ;QACnB,OAAOA;IACT;IAEA,IAAIC,aAAaT,SAASU,GAAG,IAAID,aAAaT,SAASW,KAAK,EAAE;QAC5D,OAAO;IACT;IAEA,OAAO;AACT;AAaA,OAAO,IAAMC,eAAe;QAC1BC,oBAAAA,YACAC,gBAAAA,QACAC,mBAAAA,WACAC,eAAAA,4BACAR,MAAAA,gCAAO,sBACJS;QALHJ;QACAC;QACAC;QACAC;QACAR;;IAGA,IAAMU,WAAWX,YAAYC;IAE7B,IAAMW,UAAUD,aAAa,WAAWtB,uBAAuBU;IAC/D,IAAMc,SAASF,aAAa,WAAWrB,sBAAsBM;IAE7D,qBACE,oBAACkB;QAAKN,WAAWjB,+BAAmCiB;QAAYC,OAAOA;QAAOM,KAAKT;qBACjF,oBAACX,wDACKe;QACJM,WAAU;QACVf,MAAK;QACLO,SAAS;QACTF,YAAYC;uBAEd,oBAACO;QACCN,WAAWjB;QACX0B,eAAAA;qBAEA,oBAACL,+BAEH,oBAACE;QACCN,WAAWjB;QACX0B,eAAAA;qBAEA,oBAACJ;AAIT,EAAE"}

package/dist/components/Cell/CellDragger/CellDragger.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/components/Cell/CellDragger/CellDragger.tsx"],"sourcesContent":["import * as React from 'react';\nimport { Icon24Reorder, Icon24ReorderIos } from '@vkontakte/icons';\nimport { classNames } from '@vkontakte/vkjs';\nimport { usePlatform } from '../../../hooks/usePlatform';\nimport { Platform } from '../../../lib/platform';\nimport { Touch } from '../../Touch/Touch';\nimport { DraggableProps } from '../useDraggable';\nimport styles from './CellDragger.module.css';\n\ntype CellDraggerProps = DraggableProps &\n  Omit<React.HTMLAttributes<HTMLElement>, keyof DraggableProps>;\n\nexport const CellDragger = ({\n  onDragStart,\n  onDragMove,\n  onDragEnd,\n  onClick,\n  className,\n  ...restProps\n}: CellDraggerProps) => {\n  const platform = usePlatform();\n\n  const handleClick = (event: React.MouseEvent<HTMLElement>) => {\n    event.preventDefault();\n    if (onClick) {\n      onClick(event);\n    }\n  };\n\n  return (\n    <Touch\n      className={classNames(styles['CellDragger'], className)}\n      onStart={onDragStart}\n      onMoveY={onDragMove}\n      onEnd={onDragEnd}\n      onClick={handleClick}\n      {...restProps}\n    >\n      {platform === Platform.IOS ? <Icon24ReorderIos /> : <Icon24Reorder />}\n    </Touch>\n  );\n};\n"],"names":["React","Icon24Reorder","Icon24ReorderIos","classNames","usePlatform","Platform","Touch","CellDragger","onDragStart","onDragMove","onDragEnd","onClick","className","restProps","platform","handleClick","event","preventDefault","onStart","onMoveY","onEnd","IOS"],"mappings":";;AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,aAAa,EAAEC,gBAAgB,QAAQ,mBAAmB;AACnE,SAASC,UAAU,QAAQ,kBAAkB;AAC7C,SAASC,WAAW,QAAQ,6BAA6B;AACzD,SAASC,QAAQ,QAAQ,wBAAwB;AACjD,SAASC,KAAK,QAAQ,oBAAoB;AAO1C,OAAO,IAAMC,cAAc;QACzBC,qBAAAA,aACAC,oBAAAA,YACAC,mBAAAA,WACAC,iBAAAA,SACAC,mBAAAA,WACGC;QALHL;QACAC;QACAC;QACAC;QACAC;;IAGA,IAAME,WAAWV;IAEjB,IAAMW,cAAc,SAACC;QACnBA,MAAMC;QACN,IAAIN,SAAS;YACXA,QAAQK;QACV;IACF;IAEA,qBACE,oBAACV;QACCM,WAAWT,8BAAkCS;QAC7CM,SAASV;QACTW,SAASV;QACTW,OAAOV;QACPC,SAASI;OACLF,YAEHC,aAAaT,SAASgB,oBAAM,oBAACnB,wCAAsB,oBAACD;AAG3D,EAAE"}
+{"version":3,"sources":["../../../../src/components/Cell/CellDragger/CellDragger.tsx"],"sourcesContent":["import * as React from 'react';\nimport { Icon24Reorder, Icon24ReorderIos } from '@vkontakte/icons';\nimport { classNames } from '@vkontakte/vkjs';\nimport { usePlatform } from '../../../hooks/usePlatform';\nimport { Platform } from '../../../lib/platform';\nimport { Touch } from '../../Touch/Touch';\nimport { DraggableProps } from '../useDraggable';\nimport styles from './CellDragger.module.css';\n\ntype CellDraggerProps = DraggableProps &\n  Omit<React.HTMLAttributes<HTMLElement>, keyof DraggableProps>;\n\nexport const CellDragger = ({\n  onDragStart,\n  onDragMove,\n  onDragEnd,\n  onClick,\n  className,\n  ...restProps\n}: CellDraggerProps) => {\n  const platform = usePlatform();\n\n  const handleClick = (event: React.MouseEvent<HTMLElement>) => {\n    event.preventDefault();\n    if (onClick) {\n      onClick(event);\n    }\n  };\n\n  return (\n    <Touch\n      className={classNames(styles['CellDragger'], className)}\n      onStart={onDragStart}\n      onMoveY={onDragMove}\n      onEnd={onDragEnd}\n      onClick={handleClick}\n      {...restProps}\n    >\n      {platform === Platform.IOS ? <Icon24ReorderIos /> : <Icon24Reorder />}\n    </Touch>\n  );\n};\n"],"names":["React","Icon24Reorder","Icon24ReorderIos","classNames","usePlatform","Platform","Touch","CellDragger","onDragStart","onDragMove","onDragEnd","onClick","className","restProps","platform","handleClick","event","preventDefault","onStart","onMoveY","onEnd","IOS"],"mappings":";;AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,aAAa,EAAEC,gBAAgB,QAAQ,mBAAmB;AACnE,SAASC,UAAU,QAAQ,kBAAkB;AAC7C,SAASC,WAAW,QAAQ,6BAA6B;AACzD,SAASC,QAAQ,QAAQ,wBAAwB;AACjD,SAASC,KAAK,QAAQ,oBAAoB;AAO1C,OAAO,IAAMC,cAAc;QACzBC,qBAAAA,aACAC,oBAAAA,YACAC,mBAAAA,WACAC,iBAAAA,SACAC,mBAAAA,WACGC;QALHL;QACAC;QACAC;QACAC;QACAC;;IAGA,IAAME,WAAWV;IAEjB,IAAMW,cAAc,SAACC;QACnBA,MAAMC,cAAc;QACpB,IAAIN,SAAS;YACXA,QAAQK;QACV;IACF;IAEA,qBACE,oBAACV;QACCM,WAAWT,8BAAkCS;QAC7CM,SAASV;QACTW,SAASV;QACTW,OAAOV;QACPC,SAASI;OACLF,YAEHC,aAAaT,SAASgB,GAAG,iBAAG,oBAACnB,wCAAsB,oBAACD;AAG3D,EAAE"}

package/dist/components/Cell/useDraggable.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/Cell/useDraggable.tsx"],"sourcesContent":["import * as React from 'react';\nimport { TouchEvent } from '../Touch/Touch';\nimport { CellProps } from './Cell';\n\nexport interface DraggableProps {\n  onDragStart(event: TouchEvent): void;\n  onDragEnd(event: TouchEvent): void;\n  onDragMove(event: TouchEvent): void;\n}\n\ninterface UseDraggableProps extends DraggableProps {\n  dragging: boolean;\n}\n\nexport const useDraggable = <T extends HTMLElement>({\n  rootElRef,\n  onDragFinish,\n}: Pick<CellProps, 'onDragFinish'> & {\n  rootElRef: React.MutableRefObject<T | null>;\n}) => {\n  const [dragging, setDragging] = React.useState<boolean>(false);\n\n  const [siblings, setSiblings] = React.useState<HTMLElement[]>([]);\n  const [dragStartIndex, setDragStartIndex] = React.useState<number>(0);\n  const [dragEndIndex, setDragEndIndex] = React.useState<number>(0);\n  const [dragShift, setDragShift] = React.useState<number>(0);\n  const [dragDirection, setDragDirection] = React.useState<'down' | 'up' | undefined>(undefined);\n\n  const onDragStart = (event: TouchEvent) => {\n    const rootEl = rootElRef.current;\n    if (!rootEl) {\n      return;\n    }\n    event.originalEvent.stopPropagation();\n    event.originalEvent.preventDefault();\n\n    setDragging(true);\n\n    let _siblings: HTMLElement[] = [];\n    if (rootEl.parentElement?.childNodes) {\n      _siblings = Array.from(rootEl.parentElement.children) as HTMLElement[];\n    }\n    const idx = _siblings.indexOf(rootEl);\n\n    setDragStartIndex(idx);\n    setDragEndIndex(idx);\n    setSiblings(_siblings);\n    setDragShift(0);\n  };\n\n  const onDragMove = (event: TouchEvent) => {\n    event.originalEvent.stopPropagation();\n    event.originalEvent.preventDefault();\n\n    const rootEl = rootElRef.current;\n\n    if (rootEl) {\n      rootEl.style.transform = `translateY(${event.shiftY}px)`;\n      const rootGesture = rootEl.getBoundingClientRect();\n\n      setDragDirection(dragShift - event.shiftY < 0 ? 'down' : 'up');\n      setDragShift(event.shiftY);\n      setDragEndIndex(dragStartIndex);\n\n      siblings.forEach((sibling: HTMLElement, siblingIndex: number) => {\n        const siblingGesture = sibling.getBoundingClientRect();\n        const siblingHalfHeight = siblingGesture.height / 2;\n\n        const rootOverSibling = rootGesture.bottom > siblingGesture.top + siblingHalfHeight;\n        const rootUnderSibling = rootGesture.top < siblingGesture.bottom - siblingHalfHeight;\n\n        if (dragStartIndex < siblingIndex) {\n          if (rootOverSibling) {\n            if (dragDirection === 'down') {\n              sibling.style.transform = 'translateY(-100%)';\n            }\n\n            setDragEndIndex((dragEndIndex) => dragEndIndex + 1);\n          }\n          if (rootUnderSibling && dragDirection === 'up') {\n            sibling.style.transform = 'translateY(0)';\n          }\n        } else if (dragStartIndex > siblingIndex) {\n          if (rootUnderSibling) {\n            if (dragDirection === 'up') {\n              sibling.style.transform = 'translateY(100%)';\n            }\n\n            setDragEndIndex((dragEndIndex) => dragEndIndex - 1);\n          }\n          if (rootOverSibling && dragDirection === 'down') {\n            sibling.style.transform = 'translateY(0)';\n          }\n        }\n      });\n    }\n  };\n\n  const onDragEnd = (event: TouchEvent) => {\n    event.originalEvent.stopPropagation();\n    event.originalEvent.preventDefault();\n\n    const [from, to] = [dragStartIndex, dragEndIndex];\n\n    siblings.forEach((sibling: HTMLElement) => {\n      sibling.style.transform = '';\n    });\n\n    setSiblings([]);\n    setDragEndIndex(0);\n    setDragStartIndex(0);\n    setDragDirection(undefined);\n    setDragShift(0);\n\n    setDragging(false);\n\n    onDragFinish && onDragFinish({ from, to });\n  };\n\n  const useDraggableProps: UseDraggableProps = {\n    onDragStart,\n    onDragMove,\n    onDragEnd,\n    dragging,\n  };\n\n  return useDraggableProps;\n};\n"],"names":["React","useDraggable","rootElRef","onDragFinish","useState","dragging","setDragging","siblings","setSiblings","dragStartIndex","setDragStartIndex","dragEndIndex","setDragEndIndex","dragShift","setDragShift","undefined","dragDirection","setDragDirection","onDragStart","event","rootEl","current","originalEvent","stopPropagation","preventDefault","_siblings","parentElement","childNodes","Array","from","children","idx","indexOf","onDragMove","style","transform","shiftY","rootGesture","getBoundingClientRect","forEach","sibling","siblingIndex","siblingGesture","siblingHalfHeight","height","rootOverSibling","bottom","top","rootUnderSibling","onDragEnd","to","useDraggableProps"],"mappings":"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"}
+{"version":3,"sources":["../../../src/components/Cell/useDraggable.tsx"],"sourcesContent":["import * as React from 'react';\nimport { TouchEvent } from '../Touch/Touch';\nimport { CellProps } from './Cell';\n\nexport interface DraggableProps {\n  onDragStart(event: TouchEvent): void;\n  onDragEnd(event: TouchEvent): void;\n  onDragMove(event: TouchEvent): void;\n}\n\ninterface UseDraggableProps extends DraggableProps {\n  dragging: boolean;\n}\n\nexport const useDraggable = <T extends HTMLElement>({\n  rootElRef,\n  onDragFinish,\n}: Pick<CellProps, 'onDragFinish'> & {\n  rootElRef: React.MutableRefObject<T | null>;\n}) => {\n  const [dragging, setDragging] = React.useState<boolean>(false);\n\n  const [siblings, setSiblings] = React.useState<HTMLElement[]>([]);\n  const [dragStartIndex, setDragStartIndex] = React.useState<number>(0);\n  const [dragEndIndex, setDragEndIndex] = React.useState<number>(0);\n  const [dragShift, setDragShift] = React.useState<number>(0);\n  const [dragDirection, setDragDirection] = React.useState<'down' | 'up' | undefined>(undefined);\n\n  const onDragStart = (event: TouchEvent) => {\n    const rootEl = rootElRef.current;\n    if (!rootEl) {\n      return;\n    }\n    event.originalEvent.stopPropagation();\n    event.originalEvent.preventDefault();\n\n    setDragging(true);\n\n    let _siblings: HTMLElement[] = [];\n    if (rootEl.parentElement?.childNodes) {\n      _siblings = Array.from(rootEl.parentElement.children) as HTMLElement[];\n    }\n    const idx = _siblings.indexOf(rootEl);\n\n    setDragStartIndex(idx);\n    setDragEndIndex(idx);\n    setSiblings(_siblings);\n    setDragShift(0);\n  };\n\n  const onDragMove = (event: TouchEvent) => {\n    event.originalEvent.stopPropagation();\n    event.originalEvent.preventDefault();\n\n    const rootEl = rootElRef.current;\n\n    if (rootEl) {\n      rootEl.style.transform = `translateY(${event.shiftY}px)`;\n      const rootGesture = rootEl.getBoundingClientRect();\n\n      setDragDirection(dragShift - event.shiftY < 0 ? 'down' : 'up');\n      setDragShift(event.shiftY);\n      setDragEndIndex(dragStartIndex);\n\n      siblings.forEach((sibling: HTMLElement, siblingIndex: number) => {\n        const siblingGesture = sibling.getBoundingClientRect();\n        const siblingHalfHeight = siblingGesture.height / 2;\n\n        const rootOverSibling = rootGesture.bottom > siblingGesture.top + siblingHalfHeight;\n        const rootUnderSibling = rootGesture.top < siblingGesture.bottom - siblingHalfHeight;\n\n        if (dragStartIndex < siblingIndex) {\n          if (rootOverSibling) {\n            if (dragDirection === 'down') {\n              sibling.style.transform = 'translateY(-100%)';\n            }\n\n            setDragEndIndex((dragEndIndex) => dragEndIndex + 1);\n          }\n          if (rootUnderSibling && dragDirection === 'up') {\n            sibling.style.transform = 'translateY(0)';\n          }\n        } else if (dragStartIndex > siblingIndex) {\n          if (rootUnderSibling) {\n            if (dragDirection === 'up') {\n              sibling.style.transform = 'translateY(100%)';\n            }\n\n            setDragEndIndex((dragEndIndex) => dragEndIndex - 1);\n          }\n          if (rootOverSibling && dragDirection === 'down') {\n            sibling.style.transform = 'translateY(0)';\n          }\n        }\n      });\n    }\n  };\n\n  const onDragEnd = (event: TouchEvent) => {\n    event.originalEvent.stopPropagation();\n    event.originalEvent.preventDefault();\n\n    const [from, to] = [dragStartIndex, dragEndIndex];\n\n    siblings.forEach((sibling: HTMLElement) => {\n      sibling.style.transform = '';\n    });\n\n    setSiblings([]);\n    setDragEndIndex(0);\n    setDragStartIndex(0);\n    setDragDirection(undefined);\n    setDragShift(0);\n\n    setDragging(false);\n\n    onDragFinish && onDragFinish({ from, to });\n  };\n\n  const useDraggableProps: UseDraggableProps = {\n    onDragStart,\n    onDragMove,\n    onDragEnd,\n    dragging,\n  };\n\n  return useDraggableProps;\n};\n"],"names":["React","useDraggable","rootElRef","onDragFinish","useState","dragging","setDragging","siblings","setSiblings","dragStartIndex","setDragStartIndex","dragEndIndex","setDragEndIndex","dragShift","setDragShift","undefined","dragDirection","setDragDirection","onDragStart","event","rootEl","current","originalEvent","stopPropagation","preventDefault","_siblings","parentElement","childNodes","Array","from","children","idx","indexOf","onDragMove","style","transform","shiftY","rootGesture","getBoundingClientRect","forEach","sibling","siblingIndex","siblingGesture","siblingHalfHeight","height","rootOverSibling","bottom","top","rootUnderSibling","onDragEnd","to","useDraggableProps"],"mappings":"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"}

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

@@ -1 +1 @@
-{"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 { VisuallyHidden } from '../VisuallyHidden/VisuallyHidden';\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  titleAfter?: React.ReactNode;\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  titleAfter,\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      <VisuallyHidden\n        {...restProps}\n        Component=\"input\"\n        type=\"checkbox\"\n        onChange={handleChange}\n        className={styles['Checkbox__input']}\n        getRootRef={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__title']}>\n          <span>{children}</span>\n          <div className={styles['Checkbox__titleAfter']}>{titleAfter}</div>\n        </div>\n        {hasReactNode(description) && (\n          <Footnote className={styles['Checkbox__description']}>{description}</Footnote>\n        )}\n      </div>\n    </Tappable>\n  );\n};\n"],"names":["React","Icon20CheckBoxIndetermanate","Icon20CheckBoxOff","Icon20CheckBoxOn","Icon24CheckBoxOff","Icon24CheckBoxOn","classNames","hasReactNode","useAdaptivity","useAdaptivityConditionalRender","useExternRef","usePlatform","SizeType","Platform","warnOnce","ACTIVE_EFFECT_DELAY","Tappable","Footnote","VisuallyHidden","sizeYClassNames","none","COMPACT","REGULAR","warn","Checkbox","children","className","style","getRootRef","getRef","description","indeterminate","defaultIndeterminate","hoverMode","activeMode","hasHover","hasActive","focusVisibleMode","onChange","titleAfter","restProps","inputRef","platform","sizeY","adaptiveSizeY","useEffect","indeterminateValue","undefined","current","Boolean","handleChange","useCallback","event","checked","process","env","NODE_ENV","defaultChecked","Component","VKCOM","disabled","activeEffectDelay","IOS","type","div","Fragment","compact","regular","width","height","span"],"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 { VisuallyHidden } from '../VisuallyHidden/VisuallyHidden';\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  titleAfter?: React.ReactNode;\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  titleAfter,\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      <VisuallyHidden\n        {...restProps}\n        Component=\"input\"\n        type=\"checkbox\"\n        onChange={handleChange}\n        className={styles['Checkbox__input']}\n        getRootRef={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__title']}>\n          <span>{children}</span>\n          <div className={styles['Checkbox__titleAfter']}>{titleAfter}</div>\n        </div>\n        {hasReactNode(description) && (\n          <Footnote className={styles['Checkbox__description']}>{description}</Footnote>\n        )}\n      </div>\n    </Tappable>\n  );\n};\n"],"names":["React","Icon20CheckBoxIndetermanate","Icon20CheckBoxOff","Icon20CheckBoxOn","Icon24CheckBoxOff","Icon24CheckBoxOn","classNames","hasReactNode","useAdaptivity","useAdaptivityConditionalRender","useExternRef","usePlatform","SizeType","Platform","warnOnce","ACTIVE_EFFECT_DELAY","Tappable","Footnote","VisuallyHidden","sizeYClassNames","none","COMPACT","REGULAR","warn","Checkbox","children","className","style","getRootRef","getRef","description","indeterminate","defaultIndeterminate","hoverMode","activeMode","hasHover","hasActive","focusVisibleMode","onChange","titleAfter","restProps","inputRef","platform","sizeY","adaptiveSizeY","useEffect","indeterminateValue","undefined","current","Boolean","handleChange","useCallback","event","checked","process","env","NODE_ENV","defaultChecked","Component","VKCOM","disabled","activeEffectDelay","IOS","type","div","Fragment","compact","regular","width","height","span"],"mappings":"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"}