npm - @vkontakte/vkui - Versions diffs - 5.0.3 → 5.1.2 - Mend

@vkontakte/vkui 5.0.3 → 5.1.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (2443) hide show

package/dist/cssm/components/CalendarRange/CalendarRange.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"CalendarRange.js","names":["React","classNamesString","addMonths","isSameMonth","isSameDay","isBefore","isAfter","startOfDay","endOfDay","isWithinInterval","CalendarHeader","CalendarDays","navigateDate","setTimeEqual","isLastDay","isFirstDay","useCalendar","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"],"sources":["../../../../src/components/CalendarRange/CalendarRange.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { classNamesString } from \"../../lib/classNames\";\nimport {\n addMonths,\n isSameMonth,\n isSameDay,\n isBefore,\n isAfter,\n startOfDay,\n endOfDay,\n isWithinInterval,\n} from \"../../lib/date\";\nimport {\n CalendarHeader,\n CalendarHeaderProps,\n} from \"../CalendarHeader/CalendarHeader\";\nimport { CalendarDays, CalendarDaysProps } from \"../CalendarDays/CalendarDays\";\nimport {\n navigateDate,\n setTimeEqual,\n isLastDay,\n isFirstDay,\n} from \"../../lib/calendar\";\nimport { useCalendar } from \"../../hooks/useCalendar\";\nimport { HasRootRef } from \"../../types\";\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(\n isWithinInterval(day, startOfDay(value[0]), endOfDay(value[1]))\n );\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 (\n [\"ArrowUp\", \"ArrowDown\", \"ArrowLeft\", \"ArrowRight\"].includes(event.key)\n ) {\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(\n (day: Date) => getIsDaySelected(day, value),\n [value]\n );\n\n const isDayActive = React.useCallback(\n (day: Date) =>\n Boolean(\n (value?.[0] && isSameDay(day, value[0])) \|\|\n (value?.[1] && isSameDay(day, value[1]))\n ),\n [value]\n );\n\n const isDaySelectionEnd = React.useCallback(\n (day: Date, dayOfWeek: number) =>\n Boolean(\n isLastDay(day, dayOfWeek) \|\| (value?.[1] && isSameDay(day, value[1]))\n ),\n [value]\n );\n\n const isHintedDaySelectionEnd = React.useCallback(\n (day: Date, dayOfWeek: number) =>\n Boolean(\n isLastDay(day, dayOfWeek) \|\|\n (hintedDate?.[1] && isSameDay(day, hintedDate[1]))\n ),\n [hintedDate]\n );\n\n const isDaySelectionStart = React.useCallback(\n (day: Date, dayOfWeek: number) =>\n Boolean(\n isFirstDay(day, dayOfWeek) \|\| (value?.[0] && isSameDay(day, value[0]))\n ),\n [value]\n );\n\n const isHintedDaySelectionStart = React.useCallback(\n (day: Date, dayOfWeek: number) =>\n Boolean(\n isFirstDay(day, dayOfWeek) \|\|\n (hintedDate?.[0] && isSameDay(day, hintedDate[0]))\n ),\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(\n () => setHintedDate(undefined),\n [setHintedDate]\n );\n\n const isDayHinted = React.useCallback(\n (day: Date) => getIsDaySelected(day, hintedDate),\n [hintedDate]\n );\n\n return (\n <div\n {...props}\n ref={getRootRef}\n className={classNamesString(styles[\"CalendarRange\"], className)}\n >\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"],"mappings":"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"}
1	+ {"version":3,"file":"CalendarRange.js","names":["React","classNames","addMonths","isSameMonth","isSameDay","isBefore","isAfter","startOfDay","endOfDay","isWithinInterval","CalendarHeader","CalendarDays","navigateDate","setTimeEqual","isLastDay","isFirstDay","useCalendar","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"],"sources":["../../../../src/components/CalendarRange/CalendarRange.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport {\n addMonths,\n isSameMonth,\n isSameDay,\n isBefore,\n isAfter,\n startOfDay,\n endOfDay,\n isWithinInterval,\n} from '../../lib/date';\nimport { CalendarHeader, CalendarHeaderProps } from '../CalendarHeader/CalendarHeader';\nimport { CalendarDays, CalendarDaysProps } from '../CalendarDays/CalendarDays';\nimport { navigateDate, setTimeEqual, isLastDay, isFirstDay } from '../../lib/calendar';\nimport { useCalendar } from '../../hooks/useCalendar';\nimport { HasRootRef } from '../../types';\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"],"mappings":"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"}

package/dist/cssm/components/CalendarRange/CalendarRange.module.css CHANGED Viewed

	@@ -1 +1 @@
1	- .vkuiCalendarRange{background:var(--vkui--color_background_modal);border:.5px solid var(--vkui--color_separator_primary);border-radius:8px;box-shadow:var(--vkui--elevation1);box-sizing:border-box;display:flex;flex-wrap:wrap;justify-content:space-around;padding:12px;width:610px}.vkuiCalendarRange__inner{display:flex;flex-direction:column;flex-grow:1}.vkuiCalendarRange__inner:not(:last-child){margin-right:24px}.vkuiCalendarRange__header{margin-bottom:4px~~;z-index:1~~}
1	+ .vkuiCalendarRange{background:#fff;background:var(--vkui--color_background_modal);border:.5px solid #d7d8d9;border:.5px solid var(--vkui--color_separator_primary);border-radius:8px;box-shadow:0 0 2px rgba(0,0,0,.03),0 2px 2px rgba(0,0,0,.06);box-shadow:var(--vkui--elevation1);box-sizing:border-box;display:flex;flex-wrap:wrap;justify-content:space-around;padding:12px;width:610px}.vkuiCalendarRange__inner{display:flex;flex-direction:column;flex-grow:1}.vkuiCalendarRange__inner:not(:last-child){margin-right:24px}.vkuiCalendarRange__header{margin-bottom:4px}

package/dist/cssm/components/CalendarTime/CalendarTime.js CHANGED Viewed

@@ -1,34 +1,34 @@
-import * as React from "react";
-import { setHours, setMinutes } from "../../lib/date";
-import { CustomSelect } from "../CustomSelect/CustomSelect";
-import { Button } from "../Button/Button";
-import { SizeType } from "../../lib/adaptivity";
-import { AdaptivityProvider } from "../AdaptivityProvider/AdaptivityProvider";
+import * as React from 'react';
+import { setHours, setMinutes } from '../../lib/date';
+import { CustomSelect } from '../CustomSelect/CustomSelect';
+import { Button } from '../Button/Button';
+import { SizeType } from '../../lib/adaptivity';
+import { AdaptivityProvider } from '../AdaptivityProvider/AdaptivityProvider';
 import "./CalendarTime.module.css";
 var hours = [];
 for (var i = 0; i < 24; i += 1) {
   hours.push({
     value: i,
-    label: String(i).padStart(2, "0")
+    label: String(i).padStart(2, '0')
   });
 }
 var minutes = [];
 for (var _i = 0; _i < 60; _i += 1) {
   minutes.push({
     value: _i,
-    label: String(_i).padStart(2, "0")
+    label: String(_i).padStart(2, '0')
   });
 }
 export var CalendarTime = function CalendarTime(_ref) {
   var value = _ref.value,
     _ref$doneButtonText = _ref.doneButtonText,
-    doneButtonText = _ref$doneButtonText === void 0 ? "Готово" : _ref$doneButtonText,
+    doneButtonText = _ref$doneButtonText === void 0 ? 'Готово' : _ref$doneButtonText,
     onChange = _ref.onChange,
     onClose = _ref.onClose,
     _ref$changeHoursAriaL = _ref.changeHoursAriaLabel,
-    changeHoursAriaLabel = _ref$changeHoursAriaL === void 0 ? "Изменить час" : _ref$changeHoursAriaL,
+    changeHoursAriaLabel = _ref$changeHoursAriaL === void 0 ? 'Изменить час' : _ref$changeHoursAriaL,
     _ref$changeMinutesAri = _ref.changeMinutesAriaLabel,
-    changeMinutesAriaLabel = _ref$changeMinutesAri === void 0 ? "Изменить минуту" : _ref$changeMinutesAri;
+    changeMinutesAriaLabel = _ref$changeMinutesAri === void 0 ? 'Изменить минуту' : _ref$changeMinutesAri;
   var onHoursChange = React.useCallback(function (event) {
     return onChange === null || onChange === void 0 ? void 0 : onChange(setHours(value, Number(event.target.value)));
   }, [onChange, value]);

package/dist/cssm/components/CalendarTime/CalendarTime.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"CalendarTime.js","names":["React","setHours","setMinutes","CustomSelect","Button","SizeType","AdaptivityProvider","hours","i","push","value","label","String","padStart","minutes","CalendarTime","doneButtonText","onChange","onClose","changeHoursAriaLabel","changeMinutesAriaLabel","onHoursChange","useCallback","event","Number","target","onMinutesChange","COMPACT","getHours","getMinutes"],"sources":["../../../../src/components/CalendarTime/CalendarTime.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { setHours, setMinutes } from \"../../lib/date\";\nimport { CustomSelect } from \"../CustomSelect/CustomSelect\";\nimport { Button } from \"../Button/Button\";\nimport { SizeType } from \"../../lib/adaptivity\";\nimport { AdaptivityProvider } from \"../AdaptivityProvider/AdaptivityProvider\";\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\n mode=\"secondary\"\n onClick={onClose}\n size=\"l\"\n aria-label={doneButtonText}\n >\n {doneButtonText}\n </Button>\n </AdaptivityProvider>\n </div>\n </div>\n );\n};\n"],"mappings":"AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,SAASC,QAAQ,EAAEC,UAAU,QAAQ,gBAAgB;AACrD,SAASC,YAAY,QAAQ,8BAA8B;AAC3D,SAASC,MAAM,QAAQ,kBAAkB;AACzC,SAASC,QAAQ,QAAQ,sBAAsB;AAC/C,SAASC,kBAAkB,QAAQ,0CAA0C;AAAC;AAY9E,IAAMC,KAGJ,GAAG,EAAE;AACP,KAAK,IAAIC,CAAC,GAAG,CAAC,EAAEA,CAAC,GAAG,EAAE,EAAEA,CAAC,IAAI,CAAC,EAAE;EAC9BD,KAAK,CAACE,IAAI,CAAC;IAAEC,KAAK,EAAEF,CAAC;IAAEG,KAAK,EAAEC,MAAM,CAACJ,CAAC,CAAC,CAACK,QAAQ,CAAC,CAAC,EAAE,GAAG;EAAE,CAAC,CAAC;AAC7D;AAEA,IAAMC,OAGJ,GAAG,EAAE;AACP,KAAK,IAAIN,EAAC,GAAG,CAAC,EAAEA,EAAC,GAAG,EAAE,EAAEA,EAAC,IAAI,CAAC,EAAE;EAC9BM,OAAO,CAACL,IAAI,CAAC;IAAEC,KAAK,EAAEF,EAAC;IAAEG,KAAK,EAAEC,MAAM,CAACJ,EAAC,CAAC,CAACK,QAAQ,CAAC,CAAC,EAAE,GAAG;EAAE,CAAC,CAAC;AAC/D;AAEA,OAAO,IAAME,YAAY,GAAG,SAAfA,YAAY,OAOA;EAAA,IANvBL,KAAK,QAALA,KAAK;IAAA,2BACLM,cAAc;IAAdA,cAAc,oCAAG,QAAQ;IACzBC,QAAQ,QAARA,QAAQ;IACRC,OAAO,QAAPA,OAAO;IAAA,6BACPC,oBAAoB;IAApBA,oBAAoB,sCAAG,cAAc;IAAA,6BACrCC,sBAAsB;IAAtBA,sBAAsB,sCAAG,iBAAiB;EAE1C,IAAMC,aAAa,GAAGrB,KAAK,CAACsB,WAAW,CACrC,UAACC,KAA2C;IAAA,OAC1CN,QAAQ,aAARA,QAAQ,uBAARA,QAAQ,CAAGhB,QAAQ,CAACS,KAAK,EAAEc,MAAM,CAACD,KAAK,CAACE,MAAM,CAACf,KAAK,CAAC,CAAC,CAAC;EAAA,GACzD,CAACO,QAAQ,EAAEP,KAAK,CAAC,CAClB;EACD,IAAMgB,eAAe,GAAG1B,KAAK,CAACsB,WAAW,CACvC,UAACC,KAA2C;IAAA,OAC1CN,QAAQ,aAARA,QAAQ,uBAARA,QAAQ,CAAGf,UAAU,CAACQ,KAAK,EAAEc,MAAM,CAACD,KAAK,CAACE,MAAM,CAACf,KAAK,CAAC,CAAC,CAAC;EAAA,GAC3D,CAACO,QAAQ,EAAEP,KAAK,CAAC,CAClB;EAED,oBACE;IAAK,SAAS;EAAyB,gBACrC;IAAK,SAAS;EAAiC,gBAC7C,oBAAC,kBAAkB;IAAC,KAAK,EAAEL,QAAQ,CAACsB;EAAQ,gBAC1C,oBAAC,YAAY;IACX,KAAK,EAAEjB,KAAK,CAACkB,QAAQ,EAAG;IACxB,OAAO,EAAErB,KAAM;IACf,QAAQ,EAAEc,aAAc;IACxB,mBAAmB,EAAE,KAAM;IAC3B,cAAYF;EAAqB,EACjC,CACiB,CACjB,eACN;IAAK,SAAS;EAAkC,~~OAAQ~~,eACxD;IAAK,SAAS;EAAiC,gBAC7C,oBAAC,kBAAkB;IAAC,KAAK,EAAEd,QAAQ,CAACsB;EAAQ,gBAC1C,oBAAC,YAAY;IACX,KAAK,EAAEjB,KAAK,CAACmB,UAAU,EAAG;IAC1B,OAAO,EAAEf,OAAQ;IACjB,QAAQ,EAAEY,eAAgB;IAC1B,mBAAmB,EAAE,KAAM;IAC3B,cAAYN;EAAuB,EACnC,CACiB,CACjB,eACN;IAAK,SAAS;EAAiC,gBAC7C,oBAAC,kBAAkB;IAAC,KAAK,EAAEf,QAAQ,CAACsB;EAAQ,gBAC1C,oBAAC,MAAM;~~IACL~~,IAAI,EAAC,WAAW;~~IAChB~~,OAAO,EAAET,OAAQ;~~IACjB~~,IAAI,EAAC,GAAG;~~IACR~~,cAAYF;EAAe,~~GAE1BA~~,cAAc,CACR,CACU,CACjB,CACF;AAEV,CAAC"}
1	+ {"version":3,"file":"CalendarTime.js","names":["React","setHours","setMinutes","CustomSelect","Button","SizeType","AdaptivityProvider","hours","i","push","value","label","String","padStart","minutes","CalendarTime","doneButtonText","onChange","onClose","changeHoursAriaLabel","changeMinutesAriaLabel","onHoursChange","useCallback","event","Number","target","onMinutesChange","COMPACT","getHours","getMinutes"],"sources":["../../../../src/components/CalendarTime/CalendarTime.tsx"],"sourcesContent":["import * as React from 'react';\nimport { setHours, setMinutes } from '../../lib/date';\nimport { CustomSelect } from '../CustomSelect/CustomSelect';\nimport { Button } from '../Button/Button';\nimport { SizeType } from '../../lib/adaptivity';\nimport { AdaptivityProvider } from '../AdaptivityProvider/AdaptivityProvider';\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"],"mappings":"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"}

package/dist/cssm/components/CalendarTime/CalendarTime.module.css CHANGED Viewed

	@@ -1 +1 @@
1	- .vkuiCalendarTime{align-items:center;display:flex}.vkuiCalendarTime__picker{width:77px}.vkuiCalendarTime__divider{color:var(--vkui--color_text_primary);font-family:var(--vkui--font_family_base);margin-left:6px;margin-right:6px}.vkuiCalendarTime__button{margin-left:auto}
1	+ .vkuiCalendarTime{align-items:center;display:flex}.vkuiCalendarTime__picker{width:77px}.vkuiCalendarTime__divider{color:#000;color:var(--vkui--color_text_primary);font-family:VK Sans Text,-apple-system,system-ui,Helvetica Neue,Roboto,sans-serif;font-family:var(--vkui--font_family_base);margin-left:6px;margin-right:6px}.vkuiCalendarTime__button{margin-left:auto}

package/dist/cssm/components/Card/Card.d.ts CHANGED Viewed

@@ -1,7 +1,7 @@
-import * as React from "react";
-import { HasRootRef } from "../../types";
+import * as React from 'react';
+import { HasRootRef } from '../../types';
 export interface CardProps extends React.HTMLAttributes<HTMLDivElement>, HasRootRef<HTMLDivElement> {
-    mode?: "tint" | "shadow" | "outline";
+    mode?: 'tint' | 'shadow' | 'outline';
 }
 /**
  * @see https://vkcom.github.io/VKUI/#/Card

package/dist/cssm/components/Card/Card.js CHANGED Viewed

@@ -1,22 +1,22 @@
 import _extends from "@babel/runtime/helpers/extends";
 import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
 var _excluded = ["mode", "children", "getRootRef", "className"];
-import * as React from "react";
-import { classNamesString } from "../../lib/classNames";
+import * as React from 'react';
+import { classNames } from '@vkontakte/vkjs';
 import "./Card.module.css";
 /**
  * @see https://vkcom.github.io/VKUI/#/Card
  */
 export var Card = function Card(_ref) {
   var _ref$mode = _ref.mode,
-    mode = _ref$mode === void 0 ? "tint" : _ref$mode,
+    mode = _ref$mode === void 0 ? 'tint' : _ref$mode,
     children = _ref.children,
     getRootRef = _ref.getRootRef,
     className = _ref.className,
     restProps = _objectWithoutProperties(_ref, _excluded);
   return /*#__PURE__*/React.createElement("div", _extends({}, restProps, {
     ref: getRootRef,
-    className: classNamesString("vkuiCard", styles["Card--mode-".concat(mode)], className)
+    className: classNames("vkuiCard", styles["Card--mode-".concat(mode)], className)
   }), /*#__PURE__*/React.createElement("div", {
     className: "vkuiCard__in"
   }, children));

package/dist/cssm/components/Card/Card.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Card.js","names":["React","~~classNamesString~~","Card","mode","children","getRootRef","className","restProps","styles"],"sources":["../../../../src/components/Card/Card.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { ~~classNamesString~~ } from ~~\"../../lib~~/~~classNames\"~~;\nimport { HasRootRef } from \"../../types\";\nimport styles from \"./Card.module.css\";\n\nexport interface CardProps\n extends React.HTMLAttributes<HTMLDivElement>,\n HasRootRef<HTMLDivElement> {\n mode?: \"tint\" \| \"shadow\" \| \"outline\";\n}\n\n/*\n @see https://vkcom.github.io/VKUI/#/Card\n */\nexport const Card = ({\n mode = \"tint\",\n children,\n getRootRef,\n className,\n ...restProps\n}: CardProps) => {\n return (\n <div\n {...restProps}\n ref={getRootRef}\n className={~~classNamesString~~(\n styles[\"Card\"]~~,\n~~ styles[`Card--mode-${mode}`]~~,\n~~ className\n )}\n >\n <div className={styles[\"Card__in\"]}>{children}</div>\n </div>\n );\n};\n"],"mappings":";;;AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,SAASC,~~gBAAgB~~,QAAQ,~~sBAAsB~~;AAAC;~~AAUxD~~;AACA;AACA;AACA,OAAO,IAAMC,IAAI,GAAG,SAAPA,IAAI,OAMA;EAAA,qBALfC,IAAI;IAAJA,IAAI,0BAAG,MAAM;IACbC,QAAQ,QAARA,QAAQ;IACRC,UAAU,QAAVA,UAAU;IACVC,SAAS,QAATA,SAAS;IACNC,SAAS;EAEZ,oBACE,wCACMA,SAAS;IACb,GAAG,EAAEF,UAAW;IAChB,SAAS,EAAEJ,~~gBAAgB~~,~~aAEzBO~~,MAAM,sBAAeL,IAAI,EAAG,~~EAC5BG~~,SAAS;~~EACT~~,~~iBAEF~~;IAAK,SAAS;EAAqB,GAAEF,QAAQ,CAAO,CAChD;AAEV,CAAC;AAAC;EAAA;EAAA;EAAA;AAAA"}
1	+ {"version":3,"file":"Card.js","names":["React","classNames","Card","mode","children","getRootRef","className","restProps","styles"],"sources":["../../../../src/components/Card/Card.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { HasRootRef } from '../../types';\nimport styles from './Card.module.css';\n\nexport interface CardProps\n extends React.HTMLAttributes<HTMLDivElement>,\n HasRootRef<HTMLDivElement> {\n mode?: 'tint' \| 'shadow' \| 'outline';\n}\n\n/*\n @see https://vkcom.github.io/VKUI/#/Card\n */\nexport const Card = ({\n mode = 'tint',\n children,\n getRootRef,\n className,\n ...restProps\n}: CardProps) => {\n return (\n <div\n {...restProps}\n ref={getRootRef}\n className={classNames(styles['Card'], styles[`Card--mode-${mode}`], className)}\n >\n <div className={styles['Card__in']}>{children}</div>\n </div>\n );\n};\n"],"mappings":";;;AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,SAASC,UAAU,QAAQ,iBAAiB;AAAC;AAU7C;AACA;AACA;AACA,OAAO,IAAMC,IAAI,GAAG,SAAPA,IAAI,OAMA;EAAA,qBALfC,IAAI;IAAJA,IAAI,0BAAG,MAAM;IACbC,QAAQ,QAARA,QAAQ;IACRC,UAAU,QAAVA,UAAU;IACVC,SAAS,QAATA,SAAS;IACNC,SAAS;EAEZ,oBACE,wCACMA,SAAS;IACb,GAAG,EAAEF,UAAW;IAChB,SAAS,EAAEJ,UAAU,aAAiBO,MAAM,sBAAeL,IAAI,EAAG,EAAEG,SAAS;EAAE,iBAE/E;IAAK,SAAS;EAAqB,GAAEF,QAAQ,CAAO,CAChD;AAEV,CAAC;AAAC;EAAA;EAAA;EAAA;AAAA"}

package/dist/cssm/components/Card/Card.module.css CHANGED Viewed

@@ -1,3 +1,3 @@
-.vkuiCard{background:var(--vkui--color_background_secondary);border-radius:var(--vkui--size_card_border_radius--regular);position:relative}.vkuiCard__in{border-radius:inherit;position:relative;z-index:2}.vkuiCard--mode-shadow{box-shadow:0 2px 24px 0 rgba(0,0,0,.08),0 0 2px 0 rgba(0,0,0,.08);box-shadow:var(
+.vkuiCard{background:#f5f5f5;background:var(--vkui--color_background_secondary);border-radius:8px;border-radius:var(--vkui--size_card_border_radius--regular);position:relative}.vkuiCard__in{border-radius:inherit;position:relative}.vkuiCard--mode-shadow{box-shadow:0 0 2px rgba(0,0,0,.08),0 4px 16px rgba(0,0,0,.08);box-shadow:var(
     --vkui--elevation3,0 2px 24px 0 rgba(0,0,0,.08),0 0 2px 0 rgba(0,0,0,.08)
-  )}.vkuiCard--mode-outline,.vkuiCard--mode-shadow{background:var(--vkui--color_background_modal)}.vkuiCard--mode-outline:before{border:var(--vkui_internal--thin_border) solid var(--vkui--color_image_border_alpha);border-radius:inherit;box-sizing:border-box;content:"";display:block;height:100%;left:0;position:absolute;top:0;width:100%;z-index:1}.vkuiCardScroll .vkuiCard{flex-shrink:0;margin-right:var(--vkui--size_cardgrid_padding--regular)}.vkuiCardScroll .vkuiCard:last-of-type{margin-right:0}.vkuiCardScroll--size-s .vkuiCard{width:40%}.vkuiCardScroll--size-m .vkuiCard{width:62%}.vkuiCardScroll--size-l .vkuiCard{margin-right:var(--vkui--size_base_padding_horizontal--regular);width:calc(100% - var(--vkui--size_base_padding_horizontal--regular) * 2)}.vkuiGroup--mode-card .vkuiCardScroll--size-l .vkuiCard,.vkuiSplitCol--spaced .vkuiCardScroll--size-l .vkuiCard{margin-right:16px;width:calc(100% - 32px)}.vkuiGroup--mode-card .vkuiCardScroll--size-l .vkuiCard:last-of-type,.vkuiSplitCol--spaced .vkuiCardScroll--size-l .vkuiCard:last-of-type{margin-right:0}@media (min-width:768px){.vkuiGroup--mode-none .vkuiCardScroll--size-l .vkuiCard:last-of-type{margin-right:0}.vkuiGroup--mode-none .vkuiCardScroll--size-l .vkuiCard{margin-right:16px;width:calc(100% - 32px)}}
+  )}.vkuiCard--mode-outline,.vkuiCard--mode-shadow{background:#fff;background:var(--vkui--color_background_modal)}.vkuiCard--mode-outline:after{border:1px solid rgba(0,0,0,.08);border:var(--vkui_internal--thin_border) solid var(--vkui--color_image_border_alpha);border-radius:inherit;box-sizing:border-box;content:"";display:block;height:100%;left:0;pointer-events:none;position:absolute;top:0;width:100%}.vkuiCardScroll .vkuiCard{flex-shrink:0;margin-right:8px;margin-right:var(--vkui--size_cardgrid_padding--regular)}.vkuiCardScroll .vkuiCard:last-of-type{margin-right:0}.vkuiCardScroll--size-s .vkuiCard{width:40%}.vkuiCardScroll--size-m .vkuiCard{width:62%}.vkuiCardScroll--size-l .vkuiCard{margin-right:16px;margin-right:var(--vkui--size_base_padding_horizontal--regular);width:calc(100% - 16px * 2);width:calc(100% - var(--vkui--size_base_padding_horizontal--regular) * 2)}.vkuiGroup--mode-card .vkuiCardScroll--size-l .vkuiCard,.vkuiSplitCol--spaced .vkuiCardScroll--size-l .vkuiCard{margin-right:16px;width:calc(100% - 32px)}.vkuiGroup--mode-card .vkuiCardScroll--size-l .vkuiCard:last-of-type,.vkuiSplitCol--spaced .vkuiCardScroll--size-l .vkuiCard:last-of-type{margin-right:0}@media (min-width:768px){.vkuiGroup--mode-none .vkuiCardScroll--size-l .vkuiCard:last-of-type{margin-right:0}.vkuiGroup--mode-none .vkuiCardScroll--size-l .vkuiCard{margin-right:16px;width:calc(100% - 32px)}}

package/dist/cssm/components/CardGrid/CardGrid.d.ts CHANGED Viewed

@@ -1,6 +1,6 @@
-import * as React from "react";
+import * as React from 'react';
 export interface CardGridProps extends React.HTMLAttributes<HTMLDivElement> {
-    size?: "s" | "m" | "l";
+    size?: 's' | 'm' | 'l';
     /**
      * Если true, то вокруг компонента присутствуют стандартные отсупы сверху/снизу и слева/справа
      */

package/dist/cssm/components/CardGrid/CardGrid.js CHANGED Viewed

@@ -1,10 +1,10 @@
 import _extends from "@babel/runtime/helpers/extends";
 import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
 var _excluded = ["children", "size", "spaced", "className"];
-import * as React from "react";
-import { classNamesString } from "../../lib/classNames";
-import { getSizeXClassName } from "../../helpers/getSizeXClassName";
-import { useAdaptivity } from "../../hooks/useAdaptivity";
+import * as React from 'react';
+import { classNames } from '@vkontakte/vkjs';
+import { getSizeXClassName } from '../../helpers/getSizeXClassName';
+import { useAdaptivity } from '../../hooks/useAdaptivity';
 import "./CardGrid.module.css";
 /**
  * @see https://vkcom.github.io/VKUI/#/CardGrid
@@ -12,7 +12,7 @@ import "./CardGrid.module.css";
 export var CardGrid = function CardGrid(_ref) {
   var children = _ref.children,
     _ref$size = _ref.size,
-    size = _ref$size === void 0 ? "s" : _ref$size,
+    size = _ref$size === void 0 ? 's' : _ref$size,
     _ref$spaced = _ref.spaced,
     spaced = _ref$spaced === void 0 ? false : _ref$spaced,
     className = _ref.className,
@@ -20,7 +20,7 @@ export var CardGrid = function CardGrid(_ref) {
   var _useAdaptivity = useAdaptivity(),
     sizeX = _useAdaptivity.sizeX;
   return /*#__PURE__*/React.createElement("div", _extends({}, restProps, {
-    className: classNamesString("vkuiCardGrid", spaced && "vkuiCardGrid--spaced", styles["CardGrid--size-".concat(size)], getSizeXClassName("vkuiCardGrid", sizeX), className)
+    className: classNames("vkuiCardGrid", spaced && "vkuiCardGrid--spaced", styles["CardGrid--size-".concat(size)], getSizeXClassName("vkuiCardGrid", sizeX), className)
   }), children);
 };
 var styles = {

package/dist/cssm/components/CardGrid/CardGrid.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"CardGrid.js","names":["React","~~classNamesString~~","getSizeXClassName","useAdaptivity","CardGrid","children","size","spaced","className","restProps","sizeX","styles"],"sources":["../../../../src/components/CardGrid/CardGrid.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { ~~classNamesString~~ } from ~~\"../../lib~~/~~classNames\"~~;\nimport { getSizeXClassName } from \"../../helpers/getSizeXClassName\";\nimport { useAdaptivity } from \"../../hooks/useAdaptivity\";\nimport styles from \"./CardGrid.module.css\";\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 } = useAdaptivity();\n\n return (\n <div\n {...restProps}\n className={~~classNamesString~~(\n styles[\"CardGrid\"],\n spaced && styles[\"CardGrid--spaced\"],\n styles[`CardGrid--size-${size}`],\n getSizeXClassName(styles[\"CardGrid\"], sizeX),\n className\n )}\n >\n {children}\n </div>\n );\n};\n"],"mappings":";;;AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,SAASC,~~gBAAgB~~,QAAQ,~~sBAAsB~~;~~AACvD~~,SAASC,iBAAiB,QAAQ,iCAAiC;AACnE,SAASC,aAAa,QAAQ,2BAA2B;AAAC;AAW1D;AACA;AACA;AACA,OAAO,IAAMC,QAAQ,GAAG,SAAXA,QAAQ,OAMA;EAAA,IALnBC,QAAQ,QAARA,QAAQ;IAAA,iBACRC,IAAI;IAAJA,IAAI,0BAAG,GAAG;IAAA,mBACVC,MAAM;IAANA,MAAM,4BAAG,KAAK;IACdC,SAAS,QAATA,SAAS;IACNC,SAAS;EAEZ,qBAAkBN,aAAa,EAAE;IAAzBO,KAAK,kBAALA,KAAK;EAEb,oBACE,wCACMD,SAAS;IACb,SAAS,EAAER,~~gBAAgB~~,~~iBAEzBM~~,MAAM,0BAA8B,EACpCI,MAAM,0BAAmBL,IAAI,EAAG,EAChCJ,iBAAiB,iBAAqBQ,KAAK,CAAC,EAC5CF,SAAS;EACT,IAEDH,QAAQ,CACL;AAEV,CAAC;AAAC;EAAA;EAAA;EAAA;AAAA"}
1	+ {"version":3,"file":"CardGrid.js","names":["React","classNames","getSizeXClassName","useAdaptivity","CardGrid","children","size","spaced","className","restProps","sizeX","styles"],"sources":["../../../../src/components/CardGrid/CardGrid.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { getSizeXClassName } from '../../helpers/getSizeXClassName';\nimport { useAdaptivity } from '../../hooks/useAdaptivity';\nimport styles from './CardGrid.module.css';\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 } = useAdaptivity();\n\n return (\n <div\n {...restProps}\n className={classNames(\n styles['CardGrid'],\n spaced && styles['CardGrid--spaced'],\n styles[`CardGrid--size-${size}`],\n getSizeXClassName(styles['CardGrid'], sizeX),\n className,\n )}\n >\n {children}\n </div>\n );\n};\n"],"mappings":";;;AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,SAASC,UAAU,QAAQ,iBAAiB;AAC5C,SAASC,iBAAiB,QAAQ,iCAAiC;AACnE,SAASC,aAAa,QAAQ,2BAA2B;AAAC;AAW1D;AACA;AACA;AACA,OAAO,IAAMC,QAAQ,GAAG,SAAXA,QAAQ,OAMA;EAAA,IALnBC,QAAQ,QAARA,QAAQ;IAAA,iBACRC,IAAI;IAAJA,IAAI,0BAAG,GAAG;IAAA,mBACVC,MAAM;IAANA,MAAM,4BAAG,KAAK;IACdC,SAAS,QAATA,SAAS;IACNC,SAAS;EAEZ,qBAAkBN,aAAa,EAAE;IAAzBO,KAAK,kBAALA,KAAK;EAEb,oBACE,wCACMD,SAAS;IACb,SAAS,EAAER,UAAU,iBAEnBM,MAAM,0BAA8B,EACpCI,MAAM,0BAAmBL,IAAI,EAAG,EAChCJ,iBAAiB,iBAAqBQ,KAAK,CAAC,EAC5CF,SAAS;EACT,IAEDH,QAAQ,CACL;AAEV,CAAC;AAAC;EAAA;EAAA;EAAA;AAAA"}

package/dist/cssm/components/CardGrid/CardGrid.module.css CHANGED Viewed

	@@ -1 +1 @@
1	- .vkuiCardGrid{align-items:flex-start;display:flex;flex-wrap:wrap;justify-content:flex-start}.vkuiCardGrid--spaced{padding:var(--vkui--size_base_padding_vertical--regular) var(--vkui--size_base_padding_horizontal--regular)}.vkuiCardGrid .vkuiCard{margin-right:var(--vkui--size_cardgrid_padding--regular)}.vkuiCardGrid--size-l .vkuiCard{margin-right:0;width:100%}.vkuiCardGrid--size-l .vkuiCard:not(:first-child){margin-top:var(--vkui--size_cardgrid_padding--regular)}.vkuiCardGrid--size-m .vkuiCard{width:calc(50% - (var(--vkui--size_cardgrid_padding--regular) / 2))}.vkuiCardGrid--size-m .vkuiCard:nth-child(n+3){margin-top:var(--vkui--size_cardgrid_padding--regular)}.vkuiCardGrid--size-m .vkuiCard:nth-child(2n){margin-right:0}.vkuiCardGrid--size-s .vkuiCard{width:calc((100% - 2 * var(--vkui--size_cardgrid_padding--regular)) / 3)}.vkuiCardGrid--size-s .vkuiCard:nth-child(n+4){margin-top:var(--vkui--size_cardgrid_padding--regular)}.vkuiCardGrid--size-s .vkuiCard:nth-child(3n){margin-right:0}.vkuiCardGrid--sizeX-compact{padding-left:var(--vkui--size_base_padding_horizontal--regular);padding-right:var(--vkui--size_base_padding_horizontal--regular)}@media (~~max~~-width:~~767px~~){.vkuiCardGrid--sizeX-none{padding-left:var(--vkui--size_base_padding_horizontal--regular);padding-right:var(--vkui--size_base_padding_horizontal--regular)}}.vkuiCardGrid+.vkuiCardGrid{margin-top:calc(var(--vkui--size_cardgrid_padding_vertical--regular) * 2)}@media (~~max~~-width:~~767px~~){.vkuiCardGrid--sizeX-none.vkuiCardGrid--android{padding-left:16px;padding-right:16px}}.vkuiGroup--mode-card .vkuiCardGrid{padding-left:var(--vkui--size_base_padding_horizontal--regular);padding-right:var(--vkui--size_base_padding_horizontal--regular)}@media (min-width:768px){.vkuiGroup--mode-none .vkuiCardGrid{padding-left:8px;padding-right:8px}}.vkuiGroup .vkuiCardGrid:first-child{margin-top:var(--vkui--size_cardgrid_padding_vertical--regular)}.vkuiGroup .vkuiCardGrid:last-child{margin-bottom:var(--vkui--size_cardgrid_padding_vertical--regular)}
1	+ .vkuiCardGrid{align-items:flex-start;display:flex;flex-wrap:wrap;justify-content:flex-start}.vkuiCardGrid--spaced{padding:12px 16px;padding:var(--vkui--size_base_padding_vertical--regular) var(--vkui--size_base_padding_horizontal--regular)}.vkuiCardGrid .vkuiCard{margin-right:8px;margin-right:var(--vkui--size_cardgrid_padding--regular)}.vkuiCardGrid--size-l .vkuiCard{margin-right:0;width:100%}.vkuiCardGrid--size-l .vkuiCard:not(:first-child){margin-top:8px;margin-top:var(--vkui--size_cardgrid_padding--regular)}.vkuiCardGrid--size-m .vkuiCard{width:calc(50% - (8px / 2));width:calc(50% - (var(--vkui--size_cardgrid_padding--regular) / 2))}.vkuiCardGrid--size-m .vkuiCard:nth-child(n+3){margin-top:8px;margin-top:var(--vkui--size_cardgrid_padding--regular)}.vkuiCardGrid--size-m .vkuiCard:nth-child(2n){margin-right:0}.vkuiCardGrid--size-s .vkuiCard{width:calc((100% - 2 * 8px) / 3);width:calc((100% - 2 * var(--vkui--size_cardgrid_padding--regular)) / 3)}.vkuiCardGrid--size-s .vkuiCard:nth-child(n+4){margin-top:8px;margin-top:var(--vkui--size_cardgrid_padding--regular)}.vkuiCardGrid--size-s .vkuiCard:nth-child(3n){margin-right:0}.vkuiCardGrid--sizeX-compact{padding-left:16px;padding-left:var(--vkui--size_base_padding_horizontal--regular);padding-right:16px;padding-right:var(--vkui--size_base_padding_horizontal--regular)}@media not (min-width:768px){.vkuiCardGrid--sizeX-none{padding-left:16px;padding-left:var(--vkui--size_base_padding_horizontal--regular);padding-right:16px;padding-right:var(--vkui--size_base_padding_horizontal--regular)}}.vkuiCardGrid+.vkuiCardGrid{margin-top:calc(8px * 2);margin-top:calc(var(--vkui--size_cardgrid_padding_vertical--regular) * 2)}@media not (min-width:768px){.vkuiCardGrid--sizeX-none.vkuiCardGrid--android{padding-left:16px;padding-right:16px}}.vkuiGroup--mode-card .vkuiCardGrid{padding-left:16px;padding-left:var(--vkui--size_base_padding_horizontal--regular);padding-right:16px;padding-right:var(--vkui--size_base_padding_horizontal--regular)}@media (min-width:768px){.vkuiGroup--mode-none .vkuiCardGrid{padding-left:8px;padding-right:8px}}.vkuiGroup .vkuiCardGrid:first-child{margin-top:8px;margin-top:var(--vkui--size_cardgrid_padding_vertical--regular)}.vkuiGroup .vkuiCardGrid:last-child{margin-bottom:8px;margin-bottom:var(--vkui--size_cardgrid_padding_vertical--regular)}

package/dist/cssm/components/CardScroll/CardScroll.d.ts CHANGED Viewed

@@ -1,11 +1,11 @@
-import * as React from "react";
-import { HorizontalScrollProps } from "../HorizontalScroll/HorizontalScroll";
+import * as React from 'react';
+import { HorizontalScrollProps } from '../HorizontalScroll/HorizontalScroll';
 export interface CardScrollProps extends React.HTMLAttributes<HTMLDivElement> {
     /**
      * При `size=false` ширина `Card` будет регулироваться контентом внутри. В остальных случаях — будет явно задана в процентах.
      */
-    size?: "s" | "m" | "l" | false;
-    showArrows?: HorizontalScrollProps["showArrows"];
+    size?: 's' | 'm' | 'l' | false;
+    showArrows?: HorizontalScrollProps['showArrows'];
     withSpaces?: boolean;
 }
 /**

package/dist/cssm/components/CardScroll/CardScroll.js CHANGED Viewed

@@ -2,12 +2,12 @@ import _extends from "@babel/runtime/helpers/extends";
 import _toConsumableArray from "@babel/runtime/helpers/toConsumableArray";
 import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
 var _excluded = ["children", "size", "showArrows", "withSpaces", "className"];
-import * as React from "react";
-import { classNamesString } from "../../lib/classNames";
-import { getSizeXClassName } from "../../helpers/getSizeXClassName";
-import { useAdaptivity } from "../../hooks/useAdaptivity";
-import { HorizontalScroll } from "../HorizontalScroll/HorizontalScroll";
-import { useDOM } from "../../lib/dom";
+import * as React from 'react';
+import { classNames } from '@vkontakte/vkjs';
+import { getSizeXClassName } from '../../helpers/getSizeXClassName';
+import { useAdaptivity } from '../../hooks/useAdaptivity';
+import { HorizontalScroll } from '../HorizontalScroll/HorizontalScroll';
+import { useDOM } from '../../lib/dom';
 import "./CardScroll.module.css";
 /**
  * @see https://vkcom.github.io/VKUI/#/CardScroll
@@ -15,7 +15,7 @@ import "./CardScroll.module.css";
 export var CardScroll = function CardScroll(_ref) {
   var children = _ref.children,
     _ref$size = _ref.size,
-    size = _ref$size === void 0 ? "s" : _ref$size,
+    size = _ref$size === void 0 ? 's' : _ref$size,
     _ref$showArrows = _ref.showArrows,
     showArrows = _ref$showArrows === void 0 ? true : _ref$showArrows,
     _ref$withSpaces = _ref.withSpaces,
@@ -63,7 +63,7 @@ export var CardScroll = function CardScroll(_ref) {
     return slide.offsetLeft - gapRef.current.offsetWidth;
   }
   return /*#__PURE__*/React.createElement("div", _extends({}, restProps, {
-    className: classNamesString("vkuiCardScroll", getSizeXClassName("vkuiCardScroll", sizeX), styles["CardScroll--size-".concat(size)], withSpaces && "vkuiCardScroll--withSpaces", className)
+    className: classNames("vkuiCardScroll", getSizeXClassName("vkuiCardScroll", sizeX), styles["CardScroll--size-".concat(size)], withSpaces && "vkuiCardScroll--withSpaces", className)
   }), /*#__PURE__*/React.createElement(HorizontalScroll, {
     getScrollToLeft: getScrollToLeft,
     getScrollToRight: getScrollToRight,

package/dist/cssm/components/CardScroll/CardScroll.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"CardScroll.js","names":["React","~~classNamesString~~","getSizeXClassName","useAdaptivity","HorizontalScroll","useDOM","CardScroll","children","size","showArrows","withSpaces","className","restProps","sizeX","refContainer","useRef","gapRef","window","getScrollToLeft","offset","current","containerWidth","offsetWidth","slideIndex","findIndex","el","offsetLeft","parseInt","getComputedStyle","marginRight","slide","scrollTo","getScrollToRight","Array","prototype","find","call","styles"],"sources":["../../../../src/components/CardScroll/CardScroll.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { ~~classNamesString~~ } from ~~\"../../lib~~/~~classNames\"~~;\nimport { getSizeXClassName } from \"../../helpers/getSizeXClassName\";\nimport { useAdaptivity } from \"../../hooks/useAdaptivity\";\nimport {\n HorizontalScroll~~,\n~~ HorizontalScrollProps~~,\n~~} from \"../HorizontalScroll/HorizontalScroll\";\nimport { useDOM } from \"../../lib/dom\";\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 { sizeX } = useAdaptivity();\n\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 = (\n [...refContainer.current.children] as HTMLElement[]\n ).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 ~~-\n~~ (containerWidth - slide.offsetWidth) ~~+\n~~ 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) ~~=>\n~~ 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={~~classNamesString~~(\n styles[\"CardScroll\"],\n getSizeXClassName(styles[\"CardScroll\"], sizeX),\n styles[`CardScroll--size-${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"],"mappings":";;;;AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,SAASC,~~gBAAgB~~,QAAQ,~~sBAAsB~~;~~AACvD~~,SAASC,iBAAiB,QAAQ,iCAAiC;AACnE,SAASC,aAAa,QAAQ,2BAA2B;AACzD,~~SACEC~~,gBAAgB,~~QAEX~~,sCAAsC;~~AAC7C~~,SAASC,MAAM,QAAQ,eAAe;AAAC;AAYvC;AACA;AACA;AACA,OAAO,IAAMC,UAAU,GAAG,SAAbA,UAAU,OAOA;EAAA,IANrBC,QAAQ,QAARA,QAAQ;IAAA,iBACRC,IAAI;IAAJA,IAAI,0BAAG,GAAG;IAAA,uBACVC,UAAU;IAAVA,UAAU,gCAAG,IAAI;IAAA,uBACjBC,UAAU;IAAVA,UAAU,gCAAG,IAAI;IACjBC,SAAS,QAATA,SAAS;IACNC,SAAS;EAEZ,qBAAkBT,aAAa,EAAE;IAAzBU,KAAK,kBAALA,KAAK;EAEb,IAAMC,YAAY,GAAGd,KAAK,CAACe,MAAM,CAAiB,IAAI,CAAC;EACvD,IAAMC,MAAM,GAAGhB,KAAK,CAACe,MAAM,CAAiB,IAAI,CAAC;EAEjD,cAAmBV,MAAM,EAAE;IAAnBY,MAAM,WAANA,MAAM;EAEd,SAASC,eAAe,CAACC,MAAc,EAAU;IAC/C,IAAI,CAACL,YAAY,CAACM,OAAO,IAAI,CAACJ,MAAM,CAACI,OAAO,EAAE;MAC5C,OAAOD,MAAM;IACf;IACA,IAAME,cAAc,GAAGP,YAAY,CAACM,OAAO,CAACE,WAAW;IACvD,IAAMC,UAAU,GAAG,~~mBACbT~~,YAAY,CAACM,OAAO,CAACb,QAAQ,~~EACjCiB~~,SAAS,~~CACT~~,UAACC,EAAe;MAAA,OACdA,EAAE,CAACC,UAAU,GACXD,EAAE,CAACH,WAAW,GACdK,QAAQ,CAACV,MAAM,CAAEW,gBAAgB,CAACH,EAAE,CAAC,CAACI,WAAW,CAAC,GAClDV,MAAM,IACR,CAAC;IAAA,EACJ;IAED,IAAII,UAAU,KAAK,CAAC,CAAC,EAAE;MACrB,OAAOJ,MAAM;IACf;IAEA,IAAII,UAAU,KAAK,CAAC,EAAE;MACpB,OAAO,CAAC;IACV;IAEA,IAAMO,KAAK,GAAGhB,YAAY,CAACM,OAAO,CAACb,QAAQ,CAACgB,UAAU,CAAgB;IAEtE,IAAMQ,QAAQ,GACZD,KAAK,CAACJ,UAAU,~~IACfL~~,cAAc,GAAGS,KAAK,CAACR,WAAW,CAAC,~~GACpCN~~,MAAM,CAACI,OAAO,CAACE,WAAW;~~IAE5B~~,IAAIS,QAAQ,IAAI,CAAC,GAAGf,MAAM,CAACI,OAAO,CAACE,WAAW,EAAE;MAC9C,OAAO,CAAC;IACV;IAEA,OAAOS,QAAQ;EACjB;EAEA,SAASC,gBAAgB,CAACb,MAAc,EAAU;IAChD,IAAI,CAACL,YAAY,CAACM,OAAO,IAAI,CAACJ,MAAM,CAACI,OAAO,EAAE;MAC5C,OAAOD,MAAM;IACf;IAEA,IAAME,cAAc,GAAGP,YAAY,CAACM,OAAO,CAACE,WAAW;IACvD,IAAMQ,KAAK,GAAGG,KAAK,CAACC,SAAS,CAACC,IAAI,CAACC,IAAI,CACrCtB,YAAY,CAACM,OAAO,CAACb,QAAQ,EAC7B,UAACkB,EAAe;MAAA,~~OACdA~~,EAAE,CAACC,UAAU,GAAGD,EAAE,CAACH,WAAW,GAAGH,MAAM,GAAGE,cAAc;IAAA,~~EAC5C~~;IAEhB,IAAI,CAACS,KAAK,EAAE;MACV,OAAOX,MAAM;IACf;IAEA,OAAOW,KAAK,CAACJ,UAAU,GAAGV,MAAM,CAACI,OAAO,CAACE,WAAW;EACtD;EAEA,oBACE,wCACMV,SAAS;IACb,SAAS,EAAEX,~~gBAAgB~~,~~mBAEzBC~~,iBAAiB,mBAAuBW,KAAK,CAAC,EAC9CwB,MAAM,4BAAqB7B,IAAI,EAAG,EAClCE,UAAU,gCAAoC,EAC9CC,SAAS;EACT,iBAEF,oBAAC,gBAAgB;IACf,eAAe,EAAEO,eAAgB;IACjC,gBAAgB,EAAEc,gBAAiB;IACnC,UAAU,EAAEvB;EAAW,gBAEvB;IAAK,SAAS,sBAA2B;IAAC,GAAG,EAAEK;EAAa,gBAC1D;IAAM,SAAS,uBAA4B;IAAC,GAAG,EAAEE;EAAO,EAAG,EAC1DT,QAAQ,eACT;IAAM,SAAS;EAA4B,EAAG,CAC1C,CACW,CACf;AAEV,CAAC;AAAC;EAAA;EAAA;EAAA;EAAA;AAAA"}
1	+ {"version":3,"file":"CardScroll.js","names":["React","classNames","getSizeXClassName","useAdaptivity","HorizontalScroll","useDOM","CardScroll","children","size","showArrows","withSpaces","className","restProps","sizeX","refContainer","useRef","gapRef","window","getScrollToLeft","offset","current","containerWidth","offsetWidth","slideIndex","findIndex","el","offsetLeft","parseInt","getComputedStyle","marginRight","slide","scrollTo","getScrollToRight","Array","prototype","find","call","styles"],"sources":["../../../../src/components/CardScroll/CardScroll.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { getSizeXClassName } from '../../helpers/getSizeXClassName';\nimport { useAdaptivity } from '../../hooks/useAdaptivity';\nimport { HorizontalScroll, HorizontalScrollProps } from '../HorizontalScroll/HorizontalScroll';\nimport { useDOM } from '../../lib/dom';\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 { sizeX } = useAdaptivity();\n\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 getSizeXClassName(styles['CardScroll'], sizeX),\n styles[`CardScroll--size-${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"],"mappings":"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"}

package/dist/cssm/components/CardScroll/CardScroll.module.css CHANGED Viewed

	@@ -1 +1 @@
1	- .vkuiCardScroll__in{align-items:stretch;display:flex}.vkuiCardScroll__gap{display:block;flex-shrink:0}.vkuiCardScroll+.vkuiCardScroll{margin-top:16px}.vkuiCardScroll--withSpaces .vkuiCardScroll__gap{width:var(--vkui--size_base_padding_horizontal--regular)}.vkuiSplitCol--spaced .vkuiCardScroll--withSpaces .vkuiCardScroll{margin-left:-16px;margin-right:-16px}.vkuiSplitCol--spaced .vkuiCardScroll--withSpaces .vkuiCardScroll__gap{width:16px}.vkuiGroup--mode-card .vkuiCardScroll--withSpaces{margin-left:-8px;margin-right:-8px}.vkuiGroup--mode-card .vkuiCardScroll--withSpaces:first-child{padding-top:var(--vkui--size_cardgrid_padding_vertical--regular)}.vkuiGroup--mode-card .vkuiCardScroll--withSpaces:last-child{padding-bottom:var(--vkui--size_cardgrid_padding_vertical--regular)}@media (min-width:768px){.vkuiGroup--mode-none .vkuiCardScroll--withSpaces{margin-left:-8px;margin-right:-8px}.vkuiGroup--mode-none .vkuiCardScroll--withSpaces:first-child{padding-top:var(--vkui--size_cardgrid_padding_vertical--regular)}.vkuiGroup--mode-none .vkuiCardScroll--withSpaces:last-child{padding-bottom:var(--vkui--size_cardgrid_padding_vertical--regular)}}
1	+ .vkuiCardScroll__in{align-items:stretch;display:flex}.vkuiCardScroll__gap{display:block;flex-shrink:0}.vkuiCardScroll+.vkuiCardScroll{margin-top:16px}.vkuiCardScroll--withSpaces .vkuiCardScroll__gap{width:16px;width:var(--vkui--size_base_padding_horizontal--regular)}.vkuiSplitCol--spaced .vkuiCardScroll--withSpaces .vkuiCardScroll{margin-left:-16px;margin-right:-16px}.vkuiSplitCol--spaced .vkuiCardScroll--withSpaces .vkuiCardScroll__gap{width:16px}.vkuiGroup--mode-card .vkuiCardScroll--withSpaces{margin-left:-8px;margin-right:-8px}.vkuiGroup--mode-card .vkuiCardScroll--withSpaces:first-child{padding-top:8px;padding-top:var(--vkui--size_cardgrid_padding_vertical--regular)}.vkuiGroup--mode-card .vkuiCardScroll--withSpaces:last-child{padding-bottom:8px;padding-bottom:var(--vkui--size_cardgrid_padding_vertical--regular)}@media (min-width:768px){.vkuiGroup--mode-none .vkuiCardScroll--withSpaces{margin-left:-8px;margin-right:-8px}.vkuiGroup--mode-none .vkuiCardScroll--withSpaces:first-child{padding-top:8px;padding-top:var(--vkui--size_cardgrid_padding_vertical--regular)}.vkuiGroup--mode-none .vkuiCardScroll--withSpaces:last-child{padding-bottom:8px;padding-bottom:var(--vkui--size_cardgrid_padding_vertical--regular)}}

package/dist/cssm/components/Cell/Cell.d.ts CHANGED Viewed

@@ -1,9 +1,9 @@
 /// <reference types="react" />
-import { SimpleCellProps } from "../SimpleCell/SimpleCell";
-import { HasRootRef } from "../../types";
-import { RemovableProps } from "../Removable/Removable";
-export interface CellProps extends Omit<SimpleCellProps, "getRootRef">, RemovableProps, HasRootRef<HTMLDivElement> {
-    mode?: "removable" | "selectable";
+import { SimpleCellProps } from '../SimpleCell/SimpleCell';
+import { HasRootRef } from '../../types';
+import { RemovableProps } from '../Removable/Removable';
+export interface CellProps extends Omit<SimpleCellProps, 'getRootRef'>, RemovableProps, HasRootRef<HTMLDivElement> {
+    mode?: 'removable' | 'selectable';
     /**
      * В режиме перетаскивания ячейка перестает быть кликабельной, то есть при клике переданный onClick вызываться не будет
      */

package/dist/cssm/components/Cell/Cell.js CHANGED Viewed

@@ -2,18 +2,17 @@ import _extends from "@babel/runtime/helpers/extends";
 import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
 var _excluded = ["mode", "onRemove", "removePlaceholder", "onDragFinish", "before", "after", "disabled", "draggable", "Component", "onChange", "name", "value", "checked", "defaultChecked", "getRootRef", "draggerLabel", "className", "style"],
   _excluded2 = ["dragging"];
-import * as React from "react";
-import { classNamesString } from "../../lib/classNames";
-import { noop } from "../../lib/utils";
-import { Platform } from "../../lib/platform";
-import { SimpleCell } from "../SimpleCell/SimpleCell";
-import { Removable } from "../Removable/Removable";
-import { usePlatform } from "../../hooks/usePlatform";
-import { useExternRef } from "../../hooks/useExternRef";
-import { useDraggable } from "./useDraggable";
-import { ListContext } from "../List/ListContext";
-import { CellDragger } from "./CellDragger/CellDragger";
-import { CellCheckbox } from "./CellCheckbox/CellCheckbox";
+import * as React from 'react';
+import { classNames, noop } from '@vkontakte/vkjs';
+import { Platform } from '../../lib/platform';
+import { SimpleCell } from '../SimpleCell/SimpleCell';
+import { Removable } from '../Removable/Removable';
+import { usePlatform } from '../../hooks/usePlatform';
+import { useExternRef } from '../../hooks/useExternRef';
+import { useDraggable } from './useDraggable';
+import { ListContext } from '../List/ListContext';
+import { CellDragger } from './CellDragger/CellDragger';
+import { CellCheckbox } from './CellCheckbox/CellCheckbox';
 import "./Cell.module.css";
 /**
  * @see https://vkcom.github.io/VKUI/#/Cell
@@ -23,7 +22,7 @@ export var Cell = function Cell(_ref) {
     _ref$onRemove = _ref.onRemove,
     _onRemove = _ref$onRemove === void 0 ? noop : _ref$onRemove,
     _ref$removePlaceholde = _ref.removePlaceholder,
-    removePlaceholder = _ref$removePlaceholde === void 0 ? "Удалить" : _ref$removePlaceholde,
+    removePlaceholder = _ref$removePlaceholde === void 0 ? 'Удалить' : _ref$removePlaceholde,
     onDragFinish = _ref.onDragFinish,
     before = _ref.before,
     after = _ref.after,
@@ -37,12 +36,12 @@ export var Cell = function Cell(_ref) {
     defaultChecked = _ref.defaultChecked,
     getRootRef = _ref.getRootRef,
     _ref$draggerLabel = _ref.draggerLabel,
-    draggerLabel = _ref$draggerLabel === void 0 ? "Перенести ячейку" : _ref$draggerLabel,
+    draggerLabel = _ref$draggerLabel === void 0 ? 'Перенести ячейку' : _ref$draggerLabel,
     className = _ref.className,
     style = _ref.style,
     restProps = _objectWithoutProperties(_ref, _excluded);
-  var selectable = mode === "selectable";
-  var removable = mode === "removable";
+  var selectable = mode === 'selectable';
+  var removable = mode === 'removable';
   var platform = usePlatform();
   var rootElRef = useExternRef(getRootRef);
   var _useDraggable = useDraggable({
@@ -85,20 +84,20 @@ export var Cell = function Cell(_ref) {
   }
   var simpleCellDisabled = draggable && !selectable || removable || disabled;
   var hasActive = !simpleCellDisabled && !dragging;
-  var cellClasses = classNamesString("vkuiCell", platform === Platform.IOS && "vkuiCell--ios", dragging && "vkuiCell--dragging", removable && "vkuiCell--removable", selectable && "vkuiCell--selectable", disabled && "vkuiCell--disabled");
+  var cellClasses = classNames("vkuiCell", platform === Platform.IOS && "vkuiCell--ios", dragging && "vkuiCell--dragging", removable && "vkuiCell--removable", selectable && "vkuiCell--selectable", disabled && "vkuiCell--disabled");
   var simpleCell = /*#__PURE__*/React.createElement(SimpleCell, _extends({
     hasActive: hasActive,
     hasHover: hasActive
   }, restProps, {
     className: "vkuiCell__content",
     disabled: simpleCellDisabled,
-    Component: selectable ? "label" : Component,
+    Component: selectable ? 'label' : Component,
     before: /*#__PURE__*/React.createElement(React.Fragment, null, draggable && platform !== Platform.IOS && dragger, selectable && checkbox, before),
     after: /*#__PURE__*/React.createElement(React.Fragment, null, draggable && platform === Platform.IOS && dragger, after)
   }));
   if (removable) {
     return /*#__PURE__*/React.createElement(Removable, {
-      className: classNamesString(cellClasses, className),
+      className: classNames(cellClasses, className),
       style: style,
       getRootRef: rootElRef,
       removePlaceholder: removePlaceholder,
@@ -108,7 +107,7 @@ export var Cell = function Cell(_ref) {
     }, simpleCell);
   }
   return /*#__PURE__*/React.createElement("div", {
-    className: classNamesString(cellClasses, className),
+    className: classNames(cellClasses, className),
     style: style,
     ref: rootElRef
   }, simpleCell);

package/dist/cssm/components/Cell/Cell.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Cell.js","names":["React","~~classNamesString~~","noop","Platform","SimpleCell","Removable","usePlatform","useExternRef","useDraggable","ListContext","CellDragger","CellCheckbox","Cell","mode","onRemove","removePlaceholder","onDragFinish","before","after","disabled","draggable","Component","onChange","name","value","checked","defaultChecked","getRootRef","draggerLabel","className","style","restProps","selectable","removable","platform","rootElRef","dragging","draggableProps","useContext","toggleDrag","useEffect","undefined","dragger","checkbox","checkboxProps","simpleCellDisabled","hasActive","cellClasses","IOS","simpleCell","e","current"],"sources":["../../../../src/components/Cell/Cell.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { ~~classNamesString } from \"../../lib/~~classNames~~\";\nimport~~ { noop } from ~~\"../../lib~~/~~utils\"~~;\nimport { Platform } from \"../../lib/platform\";\nimport { SimpleCell, SimpleCellProps } from \"../SimpleCell/SimpleCell\";\nimport { HasRootRef } from \"../../types\";\nimport { Removable, RemovableProps } from \"../Removable/Removable\";\nimport { usePlatform } from \"../../hooks/usePlatform\";\nimport { useExternRef } from \"../../hooks/useExternRef\";\nimport { useDraggable } from \"./useDraggable\";\nimport { ListContext } from \"../List/ListContext\";\nimport { CellDragger } from \"./CellDragger/CellDragger\";\nimport { CellCheckbox, CellCheckboxProps } from \"./CellCheckbox/CellCheckbox\";\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,\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\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 = ~~(\n~~ <CellCheckbox className={styles[\"Cell__checkbox\"]} {...checkboxProps} ~~/>\~~n ~~);\n~~ }\n\n const simpleCellDisabled ~~=\n~~ (draggable && !selectable) \|\| removable \|\| disabled;\n const hasActive = !simpleCellDisabled && !dragging;\n\n const cellClasses = ~~classNamesString~~(\n styles[\"Cell\"],\n platform === Platform.IOS && styles[\"Cell--ios\"],\n dragging && styles[\"Cell--dragging\"],\n removable && styles[\"Cell--removable\"],\n selectable && 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={selectable ? \"label\" : 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={~~classNamesString~~(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\n className={~~classNamesString~~(cellClasses, className)}\n style={style}\n ref={rootElRef}\n >\n {simpleCell}\n </div>\n );\n};\n"],"mappings":";;;;AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,SAASC,~~gBAAgB~~,~~QAAQ~~,~~sBAAsB;AACvD,SAASC,~~IAAI,QAAQ,iBAAiB;~~AACtC~~,SAASC,QAAQ,QAAQ,oBAAoB;AAC7C,SAASC,UAAU,QAAyB,0BAA0B;AAEtE,SAASC,SAAS,QAAwB,wBAAwB;AAClE,SAASC,WAAW,QAAQ,yBAAyB;AACrD,SAASC,YAAY,QAAQ,0BAA0B;AACvD,SAASC,YAAY,QAAQ,gBAAgB;AAC7C,SAASC,WAAW,QAAQ,qBAAqB;AACjD,SAASC,WAAW,QAAQ,2BAA2B;AACvD,SAASC,YAAY,QAA2B,6BAA6B;AAAC;AAqC9E;AACA;AACA;AACA,OAAO,IAAMC,IAAI,GAAG,SAAPA,IAAI,OAoBA;EAAA,IAnBfC,IAAI,QAAJA,IAAI;IAAA,qBACJC,QAAQ;IAARA,SAAQ,8BAAGZ,IAAI;IAAA,6BACfa,iBAAiB;IAAjBA,iBAAiB,sCAAG,SAAS;IAC7BC,YAAY,QAAZA,YAAY;IACZC,MAAM,QAANA,MAAM;IACNC,KAAK,QAALA,KAAK;IACLC,QAAQ,QAARA,QAAQ;IACRC,SAAS,QAATA,SAAS;IACTC,SAAS,QAATA,SAAS;IACTC,QAAQ,QAARA,QAAQ;IACRC,IAAI,QAAJA,IAAI;IACJC,KAAK,QAALA,KAAK;IACLC,OAAO,QAAPA,OAAO;IACPC,cAAc,QAAdA,cAAc;IACdC,UAAU,QAAVA,UAAU;IAAA,yBACVC,YAAY;IAAZA,YAAY,kCAAG,kBAAkB;IACjCC,SAAS,QAATA,SAAS;IACTC,KAAK,QAALA,KAAK;IACFC,SAAS;EAEZ,IAAMC,UAAU,GAAGnB,IAAI,KAAK,YAAY;EACxC,IAAMoB,SAAS,GAAGpB,IAAI,KAAK,WAAW;EAEtC,IAAMqB,QAAQ,GAAG5B,WAAW,EAAE;EAE9B,IAAM6B,SAAS,GAAG5B,YAAY,CAACoB,UAAU,CAAC;EAE1C,oBAAwCnB,YAAY,CAAC;MACnD2B,SAAS,EAATA,SAAS;MACTnB,YAAY,EAAZA;IACF,CAAC,CAAC;IAHMoB,QAAQ,iBAARA,QAAQ;IAAKC,cAAc;EAKnC,wBAAuBrC,KAAK,CAACsC,UAAU,CAAC7B,WAAW,CAAC;IAA5C8B,UAAU,qBAAVA,UAAU;EAClBvC,KAAK,CAACwC,SAAS,CAAC,YAAM;IACpB,IAAIJ,QAAQ,EAAE;MACZG,UAAU,CAAC,IAAI,CAAC;MAChB,OAAO;QAAA,OAAMA,UAAU,CAAC,KAAK,CAAC;MAAA;IAChC;IACA,OAAOE,SAAS;EAClB,CAAC,EAAE,CAACL,QAAQ,EAAEG,UAAU,CAAC,CAAC;EAE1B,IAAIG,OAAO;EACX,IAAItB,SAAS,EAAE;IACbsB,OAAO,gBACL,oBAAC,WAAW;MACV,SAAS,qBAA0B;MACnC,cAAYd;IAAa,GACrBS,cAAc,EAErB;EACH;EAEA,IAAIM,QAAQ;EACZ,IAAIX,UAAU,EAAE;IACd,IAAMY,aAAgC,GAAG;MACvCrB,IAAI,EAAJA,IAAI;MACJC,KAAK,EAALA,KAAK;MACLF,QAAQ,EAARA,QAAQ;MACRI,cAAc,EAAdA,cAAc;MACdD,OAAO,EAAPA,OAAO;MACPN,QAAQ,EAARA;IACF,CAAC;IACDwB,QAAQ,~~gBACN~~,oBAAC,YAAY;MAAC,SAAS;IAA2B,GAAKC,aAAa,~~EACrE~~;~~EACH~~;EAEA,IAAMC,kBAAkB,~~GACrBzB~~,SAAS,IAAI,CAACY,UAAU,IAAKC,SAAS,IAAId,QAAQ;~~EACrD~~,IAAM2B,SAAS,GAAG,CAACD,kBAAkB,IAAI,CAACT,QAAQ;EAElD,IAAMW,WAAW,GAAG9C,~~gBAAgB~~,~~aAElCiC~~,QAAQ,KAAK/B,QAAQ,CAAC6C,GAAG,mBAAuB,EAChDZ,QAAQ,wBAA4B,EACpCH,SAAS,yBAA6B,EACtCD,UAAU,0BAA8B,EACxCb,QAAQ,wBAA4B,CACrC;EAED,IAAM8B,UAAU,gBACd,oBAAC,UAAU;IACT,SAAS,EAAEH,SAAU;IACrB,QAAQ,EAAEA;EAAU,GAChBf,SAAS;IACb,SAAS,qBAA0B;IACnC,QAAQ,EAAEc,kBAAmB;IAC7B,SAAS,EAAEb,UAAU,GAAG,OAAO,GAAGX,SAAU;IAC5C,MAAM,eACJ,oBAAC,KAAK,CAAC,QAAQ,QACZD,SAAS,IAAIc,QAAQ,KAAK/B,QAAQ,CAAC6C,GAAG,IAAIN,OAAO,EACjDV,UAAU,IAAIW,QAAQ,EACtB1B,MAAM,CAEV;IACD,KAAK,eACH,oBAAC,KAAK,CAAC,QAAQ,QACZG,SAAS,IAAIc,QAAQ,KAAK/B,QAAQ,CAAC6C,GAAG,IAAIN,OAAO,EACjDxB,KAAK;EAET,GAEJ;EAED,IAAIe,SAAS,EAAE;IACb,oBACE,oBAAC,SAAS;MACR,SAAS,EAAEhC,~~gBAAgB~~,CAAC8C,WAAW,EAAElB,SAAS,CAAE;~~MACpD~~,KAAK,EAAEC,KAAM;MACb,UAAU,EAAEK,SAAU;MACtB,iBAAiB,EAAEpB,iBAAkB;MACrC,QAAQ,EAAE,kBAACmC,CAAC;QAAA,OAAKpC,SAAQ,CAACoC,CAAC,EAAEf,SAAS,CAACgB,OAAO,CAAC;MAAA;IAAC,GAE/CF,UAAU,CACD;EAEhB;EAEA,oBACE;~~IACE~~,SAAS,EAAEhD,~~gBAAgB~~,CAAC8C,WAAW,EAAElB,SAAS,CAAE;~~IACpD~~,KAAK,EAAEC,KAAM;~~IACb~~,GAAG,EAAEK;EAAU,~~GAEdc~~,UAAU,CACP;AAEV,CAAC"}
1	+ {"version":3,"file":"Cell.js","names":["React","classNames","noop","Platform","SimpleCell","Removable","usePlatform","useExternRef","useDraggable","ListContext","CellDragger","CellCheckbox","Cell","mode","onRemove","removePlaceholder","onDragFinish","before","after","disabled","draggable","Component","onChange","name","value","checked","defaultChecked","getRootRef","draggerLabel","className","style","restProps","selectable","removable","platform","rootElRef","dragging","draggableProps","useContext","toggleDrag","useEffect","undefined","dragger","checkbox","checkboxProps","simpleCellDisabled","hasActive","cellClasses","IOS","simpleCell","e","current"],"sources":["../../../../src/components/Cell/Cell.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames, noop } from '@vkontakte/vkjs';\nimport { Platform } from '../../lib/platform';\nimport { SimpleCell, SimpleCellProps } from '../SimpleCell/SimpleCell';\nimport { HasRootRef } from '../../types';\nimport { Removable, RemovableProps } from '../Removable/Removable';\nimport { usePlatform } from '../../hooks/usePlatform';\nimport { useExternRef } from '../../hooks/useExternRef';\nimport { useDraggable } from './useDraggable';\nimport { ListContext } from '../List/ListContext';\nimport { CellDragger } from './CellDragger/CellDragger';\nimport { CellCheckbox, CellCheckboxProps } from './CellCheckbox/CellCheckbox';\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,\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\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 selectable && 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={selectable ? 'label' : 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"],"mappings":"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"}

package/dist/cssm/components/Cell/Cell.module.css CHANGED Viewed

	@@ -1 +1 @@
1	- .vkuiCell{position:relative}.vkuiList--dragging .vkuiCell:not(.vkuiCell--dragging){pointer-events:none;transition:transform .3s ease}.vkuiCell--dragging{background-color:var(--vkui--~~color_background_modal~~);box-shadow:var(--vkui--elevation3);~~opacity:.8~~;z-index:3}.vkuiCell--selectable.vkuiCell--disabled{opacity:var(--vkui--opacity_disable_accessibility)}.vkuiCell__checkbox,.vkuiCell__dragger{flex-shrink:0;margin-right:16px;position:relative}.~~vkuiCell__dragger{z-index:2}.~~vkuiCell__content{max-width:100%;min-width:0}.vkuiCell--removable .vkuiCell__content{flex-grow:1;padding-left:0;padding-right:0}.vkuiCell--ios .vkuiCell__dragger{margin-left:12px;margin-right:0}.vkuiCell--ios .vkuiCell__checkbox{margin-right:12px}.vkuiFormItem>.vkuiCell{margin:0 calc(-1 * var(--vkui--size_base_padding_horizontal--regular))}
1	+ .vkuiCell{position:relative}.vkuiList--dragging .vkuiCell:not(.vkuiCell--dragging){pointer-events:none;transition:transform .3s ease}.vkuiCell--dragging{background-color:#f5f5f5;background-color:var(--vkui--color_background_secondary);box-shadow:0 0 2px rgba(0,0,0,.08),0 4px 16px rgba(0,0,0,.08);box-shadow:var(--vkui--elevation3);z-index:1;z-index:var(--vkui_internal--z_index_cell_dragging)}.vkuiCell--selectable.vkuiCell--disabled{opacity:.64;opacity:var(--vkui--opacity_disable_accessibility)}.vkuiCell__checkbox,.vkuiCell__dragger{flex-shrink:0;margin-right:16px;position:relative}.vkuiCell__content{max-width:100%;min-width:0}.vkuiCell--removable .vkuiCell__content{flex-grow:1;padding-left:0;padding-right:0}.vkuiCell--ios .vkuiCell__dragger{margin-left:12px;margin-right:0}.vkuiCell--ios .vkuiCell__checkbox{margin-right:12px}.vkuiFormItem>.vkuiCell{margin:0 calc(-1 * 16px);margin:0 calc(-1 * var(--vkui--size_base_padding_horizontal--regular))}