npm - @vkontakte/vkui - Versions diffs - 6.1.2 → 6.2.0 - Mend

@vkontakte/vkui 6.1.2 → 6.2.0

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 (1986) hide show

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

	@@ -1 +1 @@
1	- {"version":3,"sources":["../../../../src/components/CalendarDay/CalendarDay.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { ENABLE_KEYBOARD_INPUT_EVENT_NAME } from '../../hooks/useKeyboardInputTracker';\nimport { useConfigProvider } from '../ConfigProvider/ConfigProviderContext';\nimport { Tappable } from '../Tappable/Tappable';\nimport { VisuallyHidden } from '../VisuallyHidden/VisuallyHidden';\nimport styles from './CalendarDay.module.css';\n\nexport type CalendarDayElementProps = Omit<\n React.AllHTMLAttributes<HTMLElement>,\n 'onChange' \| 'size' \| 'disabled' \| 'selected'\n>;\n\nexport interface CalendarDayProps extends CalendarDayElementProps {\n day: Date;\n today?: boolean;\n selected?: boolean;\n selectionStart?: boolean;\n selectionEnd?: boolean;\n hintedSelectionStart?: boolean;\n hintedSelectionEnd?: boolean;\n active?: boolean;\n hidden?: boolean;\n disabled?: boolean;\n focused?: boolean;\n hinted?: boolean;\n sameMonth?: boolean;\n size?: 's' \| 'm';\n onChange: (value: Date) => void;\n onEnter?: (value: Date) => void;\n onLeave?: (value: Date) => void;\n}\n\nexport const CalendarDay = React.memo(\n ({\n day,\n today,\n selected,\n onChange,\n hidden,\n disabled,\n active,\n selectionStart,\n selectionEnd,\n focused,\n onEnter,\n onLeave,\n hinted,\n hintedSelectionStart,\n hintedSelectionEnd,\n sameMonth,\n size,\n className,\n children,\n ...restProps\n }: CalendarDayProps) => {\n const { locale } = useConfigProvider();\n const ref = React.useRef<HTMLElement>(null);\n const onClick = React.useCallback(() => onChange(day), [day, onChange]);\n const handleEnter = React.useCallback(() => onEnter?.(day), [day, onEnter]);\n const handleLeave = React.useCallback(() => onLeave?.(day), [day, onLeave]);\n\n const label = new Intl.DateTimeFormat(locale, {\n weekday: 'long',\n year: 'numeric',\n month: 'long',\n day: 'numeric',\n }).format(day);\n\n React.useEffect(() => {\n if (focused && ref.current) {\n ref.current.dispatchEvent(new Event(ENABLE_KEYBOARD_INPUT_EVENT_NAME, { bubbles: true }));\n ref.current.focus();\n }\n }, [focused]);\n\n if (hidden) {\n return <div className={styles['CalendarDay__hidden']} />;\n }\n\n return (\n <Tappable\n className={classNames(\n styles['CalendarDay'],\n size === 's' && styles['CalendarDay--size-s'],\n today && styles['CalendarDay--today'],\n selected && !disabled && styles['CalendarDay--selected'],\n selectionStart && styles['CalendarDay--selection-start'],\n selectionEnd && styles['CalendarDay--selection-end'],\n disabled && styles['CalendarDay--disabled'],\n !sameMonth && styles['CalendarDay--not-same-month'],\n className,\n )}\n hoverMode={active ? '' : styles['CalendarDay--hover']}\n hasActive={false}\n onClick={onClick}\n disabled={disabled}\n tabIndex={-1}\n getRootRef={ref}\n focusVisibleMode={active ? 'outside' : 'inside'}\n onPointerEnter={handleEnter}\n onPointerLeave={handleLeave}\n {...restProps}\n >\n <div\n className={classNames(\n styles['CalendarDay__hinted'],\n hinted && styles['CalendarDay__hinted--active'],\n hintedSelectionStart && styles['CalendarDay__hinted--selection-start'],\n hintedSelectionEnd && styles['CalendarDay__hinted--selection-end'],\n )}\n >\n <div\n className={classNames(\n styles['CalendarDay__inner'],\n active && !disabled && styles['CalendarDay__inner--active'],\n )}\n >\n <div className={styles['CalendarDay__day-number']}>\n <VisuallyHidden>{children ?? label}</VisuallyHidden>\n <span aria-hidden>{day.getDate()}</span>\n </div>\n </div>\n </div>\n </Tappable>\n );\n },\n);\n\nCalendarDay.displayName = 'CalendarDay';\n"],"names":["React","classNames","ENABLE_KEYBOARD_INPUT_EVENT_NAME","useConfigProvider","Tappable","VisuallyHidden","styles","CalendarDay","memo","day","today","selected","onChange","hidden","disabled","active","selectionStart","selectionEnd","focused","onEnter","onLeave","hinted","hintedSelectionStart","hintedSelectionEnd","sameMonth","size","className","children","restProps","locale","ref","useRef","onClick","useCallback","handleEnter","handleLeave","label","Intl","DateTimeFormat","weekday","year","month","format","useEffect","current","dispatchEvent","Event","bubbles","focus","div","hoverMode","hasActive","tabIndex","getRootRef","focusVisibleMode","onPointerEnter","onPointerLeave","span","aria-hidden","getDate","displayName"],"~~rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","~~mappings":"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"}
1	+ {"version":3,"sources":["../../../../src/components/CalendarDay/CalendarDay.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { ENABLE_KEYBOARD_INPUT_EVENT_NAME } from '../../hooks/useKeyboardInputTracker';\nimport { useConfigProvider } from '../ConfigProvider/ConfigProviderContext';\nimport { Tappable } from '../Tappable/Tappable';\nimport { VisuallyHidden } from '../VisuallyHidden/VisuallyHidden';\nimport styles from './CalendarDay.module.css';\n\nexport type CalendarDayElementProps = Omit<\n React.AllHTMLAttributes<HTMLElement>,\n 'onChange' \| 'size' \| 'disabled' \| 'selected'\n>;\n\nexport interface CalendarDayProps extends CalendarDayElementProps {\n day: Date;\n today?: boolean;\n selected?: boolean;\n selectionStart?: boolean;\n selectionEnd?: boolean;\n hintedSelectionStart?: boolean;\n hintedSelectionEnd?: boolean;\n active?: boolean;\n hidden?: boolean;\n disabled?: boolean;\n focused?: boolean;\n hinted?: boolean;\n sameMonth?: boolean;\n size?: 's' \| 'm';\n onChange: (value: Date) => void;\n onEnter?: (value: Date) => void;\n onLeave?: (value: Date) => void;\n}\n\nexport const CalendarDay = React.memo(\n ({\n day,\n today,\n selected,\n onChange,\n hidden,\n disabled,\n active,\n selectionStart,\n selectionEnd,\n focused,\n onEnter,\n onLeave,\n hinted,\n hintedSelectionStart,\n hintedSelectionEnd,\n sameMonth,\n size,\n className,\n children,\n ...restProps\n }: CalendarDayProps) => {\n const { locale } = useConfigProvider();\n const ref = React.useRef<HTMLElement>(null);\n const onClick = React.useCallback(() => onChange(day), [day, onChange]);\n const handleEnter = React.useCallback(() => onEnter?.(day), [day, onEnter]);\n const handleLeave = React.useCallback(() => onLeave?.(day), [day, onLeave]);\n\n const label = new Intl.DateTimeFormat(locale, {\n weekday: 'long',\n year: 'numeric',\n month: 'long',\n day: 'numeric',\n }).format(day);\n\n React.useEffect(() => {\n if (focused && ref.current) {\n ref.current.dispatchEvent(new Event(ENABLE_KEYBOARD_INPUT_EVENT_NAME, { bubbles: true }));\n ref.current.focus();\n }\n }, [focused]);\n\n if (hidden) {\n return <div className={styles['CalendarDay__hidden']} />;\n }\n\n return (\n <Tappable\n className={classNames(\n styles['CalendarDay'],\n size === 's' && styles['CalendarDay--size-s'],\n today && styles['CalendarDay--today'],\n selected && !disabled && styles['CalendarDay--selected'],\n selectionStart && styles['CalendarDay--selection-start'],\n selectionEnd && styles['CalendarDay--selection-end'],\n disabled && styles['CalendarDay--disabled'],\n !sameMonth && styles['CalendarDay--not-same-month'],\n className,\n )}\n hoverMode={active ? '' : styles['CalendarDay--hover']}\n hasActive={false}\n onClick={onClick}\n disabled={disabled}\n tabIndex={-1}\n getRootRef={ref}\n focusVisibleMode={active ? 'outside' : 'inside'}\n onPointerEnter={handleEnter}\n onPointerLeave={handleLeave}\n {...restProps}\n >\n <div\n className={classNames(\n styles['CalendarDay__hinted'],\n hinted && styles['CalendarDay__hinted--active'],\n hintedSelectionStart && styles['CalendarDay__hinted--selection-start'],\n hintedSelectionEnd && styles['CalendarDay__hinted--selection-end'],\n )}\n >\n <div\n className={classNames(\n styles['CalendarDay__inner'],\n active && !disabled && styles['CalendarDay__inner--active'],\n )}\n >\n <div className={styles['CalendarDay__day-number']}>\n <VisuallyHidden>{children ?? label}</VisuallyHidden>\n <span aria-hidden>{day.getDate()}</span>\n </div>\n </div>\n </div>\n </Tappable>\n );\n },\n);\n\nCalendarDay.displayName = 'CalendarDay';\n"],"names":["React","classNames","ENABLE_KEYBOARD_INPUT_EVENT_NAME","useConfigProvider","Tappable","VisuallyHidden","styles","CalendarDay","memo","day","today","selected","onChange","hidden","disabled","active","selectionStart","selectionEnd","focused","onEnter","onLeave","hinted","hintedSelectionStart","hintedSelectionEnd","sameMonth","size","className","children","restProps","locale","ref","useRef","onClick","useCallback","handleEnter","handleLeave","label","Intl","DateTimeFormat","weekday","year","month","format","useEffect","current","dispatchEvent","Event","bubbles","focus","div","hoverMode","hasActive","tabIndex","getRootRef","focusVisibleMode","onPointerEnter","onPointerLeave","span","aria-hidden","getDate","displayName"],"mappings":"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"}

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

	@@ -1 +1 @@
1	- {"version":3,"sources":["../../../../src/components/CalendarDays/CalendarDays.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { useExternRef } from '../../hooks/useExternRef';\nimport { useTodayDate } from '../../hooks/useTodayDate';\nimport { getDaysNames, getWeeks } from '../../lib/calendar';\nimport { isSameDay, isSameMonth } from '../../lib/date';\nimport { HTMLAttributesWithRootRef } from '../../types';\nimport { CalendarDay, CalendarDayElementProps } from '../CalendarDay/CalendarDay';\nimport { useConfigProvider } from '../ConfigProvider/ConfigProviderContext';\nimport { RootComponent } from '../RootComponent/RootComponent';\nimport { Footnote } from '../Typography/Footnote/Footnote';\nimport styles from './CalendarDays.module.css';\n\nexport interface CalendarDaysProps\n extends Omit<HTMLAttributesWithRootRef<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 listenDayChangesForUpdate = false,\n getRootRef,\n ...props\n}: CalendarDaysProps) => {\n const { locale } = useConfigProvider();\n const ref = useExternRef(getRootRef);\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, ref],\n );\n\n return (\n <RootComponent {...props} baseClassName={styles['CalendarDays']} getRootRef={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 </RootComponent>\n );\n};\n"],"names":["React","classNames","useExternRef","useTodayDate","getDaysNames","getWeeks","isSameDay","isSameMonth","CalendarDay","useConfigProvider","RootComponent","Footnote","styles","CalendarDays","viewDate","value","weekStartsOn","onDayChange","isDaySelected","isDayActive","isDaySelectionEnd","isDaySelectionStart","onDayEnter","onDayLeave","isDayHinted","isHintedDaySelectionStart","isHintedDaySelectionEnd","isDayFocused","isDayDisabled","size","showNeighboringMonth","dayProps","listenDayChangesForUpdate","getRootRef","props","locale","ref","now","weeks","useMemo","daysNames","handleDayChange","useCallback","date","current","focus","baseClassName","div","className","map","dayName","week","i","day","sameMonth","today","active","onChange","hidden","disabled","selectionStart","selectionEnd","hintedSelectionStart","hintedSelectionEnd","selected","focused","onEnter","onLeave","hinted","toISOString"],"~~rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","~~mappings":";AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,UAAU,QAAQ,kBAAkB;AAC7C,SAASC,YAAY,QAAQ,2BAA2B;AACxD,SAASC,YAAY,QAAQ,2BAA2B;AACxD,SAASC,YAAY,EAAEC,QAAQ,QAAQ,qBAAqB;AAC5D,SAASC,SAAS,EAAEC,WAAW,QAAQ,iBAAiB;AAExD,SAASC,WAAW,QAAiC,6BAA6B;AAClF,SAASC,iBAAiB,QAAQ,0CAA0C;AAC5E,SAASC,aAAa,QAAQ,iCAAiC;AAC/D,SAASC,QAAQ,QAAQ,kCAAkC;AAC3D,OAAOC,YAAY,4BAA4B;AAyB/C,OAAO,MAAMC,eAAe,CAAC,EAC3BC,QAAQ,EACRC,KAAK,EACLC,YAAY,EACZC,WAAW,EACXC,aAAa,EACbC,WAAW,EACXC,iBAAiB,EACjBC,mBAAmB,EACnBC,UAAU,EACVC,UAAU,EACVC,WAAW,EACXC,yBAAyB,EACzBC,uBAAuB,EACvBC,YAAY,EACZC,aAAa,EACbC,IAAI,EACJC,uBAAuB,KAAK,EAC5BC,QAAQ,EACRC,4BAA4B,KAAK,EACjCC,UAAU,EACV,GAAGC,OACe;IAClB,MAAM,EAAEC,MAAM,EAAE,GAAG1B;IACnB,MAAM2B,MAAMlC,aAAa+B;IACzB,MAAMI,MAAMlC,aAAa6B;IAEzB,MAAMM,QAAQtC,MAAMuC,OAAO,CAAC,IAAMlC,SAASS,UAAUE,eAAe;QAACA;QAAcF;KAAS;IAE5F,MAAM0B,YAAYxC,MAAMuC,OAAO,CAC7B,IAAMnC,aAAaiC,KAAKrB,cAAcmB,SACtC;QAACA;QAAQE;QAAKrB;KAAa;IAG7B,MAAMyB,kBAAkBzC,MAAM0C,WAAW,CACvC,CAACC;QACC1B,YAAY0B;QAEZP,IAAIQ,OAAO,EAAEC;IACf,GACA;QAAC5B;QAAamB;KAAI;IAGpB,qBACE,MAAC1B;QAAe,GAAGwB,KAAK;QAAEY,eAAelC,MAAM,CAAC,eAAe;QAAEqB,YAAYG;;0BAC3E,KAACW;gBACCC,WAAW/C,WACTW,MAAM,CAAC,oBAAoB,EAC3BiB,SAAS,OAAOjB,MAAM,CAAC,4BAA4B;0BAGpD4B,UAAUS,GAAG,CAAC,CAACC,wBACd,KAACvC;wBAAuBqC,WAAWpC,MAAM,CAAC,wBAAwB;kCAC/DsC;uBADYA;;YAMlBZ,MAAMW,GAAG,CAAC,CAACE,MAAMC,kBAChB,KAACL;oBACCC,WAAW/C,WACTW,MAAM,CAAC,oBAAoB,EAC3BiB,SAAS,OAAOjB,MAAM,CAAC,4BAA4B;8BAIpDuC,KAAKF,GAAG,CAAC,CAACI,KAAKD;wBACd,MAAME,YAAY/C,YAAY8C,KAAKvC;wBACnC,qBACE,KAACN;4BAEC6C,KAAKA;4BACLE,OAAOjD,UAAU+C,KAAKhB;4BACtBmB,QAAQrC,YAAYkC;4BACpBI,UAAUhB;4BACViB,QAAQ,CAAC5B,wBAAwB,CAACwB;4BAClCK,UAAU/B,cAAcyB;4BACxBO,gBAAgBvC,oBAAoBgC,KAAKD;4BACzCS,cAAczC,kBAAkBiC,KAAKD;4BACrCU,sBAAsBrC,4BAA4B4B,KAAKD;4BACvDW,oBAAoBrC,0BAA0B2B,KAAKD;4BACnDY,UAAU9C,gBAAgBmC;4BAC1BY,SAAStC,aAAa0B;4BACtBa,SAAS5C;4BACT6C,SAAS5C;4BACT6C,QAAQ5C,cAAc6B;4BACtBC,WAAWA;4BACXzB,MAAMA;4BACL,GAAGE,QAAQ;2BAlBPsB,IAAIgB,WAAW;oBAqB1B;mBA3BKjB;;;AAgCf,EAAE"}
1	+ {"version":3,"sources":["../../../../src/components/CalendarDays/CalendarDays.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { useExternRef } from '../../hooks/useExternRef';\nimport { useTodayDate } from '../../hooks/useTodayDate';\nimport { getDaysNames, getWeeks } from '../../lib/calendar';\nimport { isSameDay, isSameMonth } from '../../lib/date';\nimport { HTMLAttributesWithRootRef } from '../../types';\nimport { CalendarDay, CalendarDayElementProps } from '../CalendarDay/CalendarDay';\nimport { useConfigProvider } from '../ConfigProvider/ConfigProviderContext';\nimport { RootComponent } from '../RootComponent/RootComponent';\nimport { Footnote } from '../Typography/Footnote/Footnote';\nimport styles from './CalendarDays.module.css';\n\nexport interface CalendarDaysProps\n extends Omit<HTMLAttributesWithRootRef<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 listenDayChangesForUpdate = false,\n getRootRef,\n ...props\n}: CalendarDaysProps) => {\n const { locale } = useConfigProvider();\n const ref = useExternRef(getRootRef);\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, ref],\n );\n\n return (\n <RootComponent {...props} baseClassName={styles['CalendarDays']} getRootRef={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 </RootComponent>\n );\n};\n"],"names":["React","classNames","useExternRef","useTodayDate","getDaysNames","getWeeks","isSameDay","isSameMonth","CalendarDay","useConfigProvider","RootComponent","Footnote","styles","CalendarDays","viewDate","value","weekStartsOn","onDayChange","isDaySelected","isDayActive","isDaySelectionEnd","isDaySelectionStart","onDayEnter","onDayLeave","isDayHinted","isHintedDaySelectionStart","isHintedDaySelectionEnd","isDayFocused","isDayDisabled","size","showNeighboringMonth","dayProps","listenDayChangesForUpdate","getRootRef","props","locale","ref","now","weeks","useMemo","daysNames","handleDayChange","useCallback","date","current","focus","baseClassName","div","className","map","dayName","week","i","day","sameMonth","today","active","onChange","hidden","disabled","selectionStart","selectionEnd","hintedSelectionStart","hintedSelectionEnd","selected","focused","onEnter","onLeave","hinted","toISOString"],"mappings":";AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,UAAU,QAAQ,kBAAkB;AAC7C,SAASC,YAAY,QAAQ,2BAA2B;AACxD,SAASC,YAAY,QAAQ,2BAA2B;AACxD,SAASC,YAAY,EAAEC,QAAQ,QAAQ,qBAAqB;AAC5D,SAASC,SAAS,EAAEC,WAAW,QAAQ,iBAAiB;AAExD,SAASC,WAAW,QAAiC,6BAA6B;AAClF,SAASC,iBAAiB,QAAQ,0CAA0C;AAC5E,SAASC,aAAa,QAAQ,iCAAiC;AAC/D,SAASC,QAAQ,QAAQ,kCAAkC;AAC3D,OAAOC,YAAY,4BAA4B;AAyB/C,OAAO,MAAMC,eAAe,CAAC,EAC3BC,QAAQ,EACRC,KAAK,EACLC,YAAY,EACZC,WAAW,EACXC,aAAa,EACbC,WAAW,EACXC,iBAAiB,EACjBC,mBAAmB,EACnBC,UAAU,EACVC,UAAU,EACVC,WAAW,EACXC,yBAAyB,EACzBC,uBAAuB,EACvBC,YAAY,EACZC,aAAa,EACbC,IAAI,EACJC,uBAAuB,KAAK,EAC5BC,QAAQ,EACRC,4BAA4B,KAAK,EACjCC,UAAU,EACV,GAAGC,OACe;IAClB,MAAM,EAAEC,MAAM,EAAE,GAAG1B;IACnB,MAAM2B,MAAMlC,aAAa+B;IACzB,MAAMI,MAAMlC,aAAa6B;IAEzB,MAAMM,QAAQtC,MAAMuC,OAAO,CAAC,IAAMlC,SAASS,UAAUE,eAAe;QAACA;QAAcF;KAAS;IAE5F,MAAM0B,YAAYxC,MAAMuC,OAAO,CAC7B,IAAMnC,aAAaiC,KAAKrB,cAAcmB,SACtC;QAACA;QAAQE;QAAKrB;KAAa;IAG7B,MAAMyB,kBAAkBzC,MAAM0C,WAAW,CACvC,CAACC;QACC1B,YAAY0B;QAEZP,IAAIQ,OAAO,EAAEC;IACf,GACA;QAAC5B;QAAamB;KAAI;IAGpB,qBACE,MAAC1B;QAAe,GAAGwB,KAAK;QAAEY,eAAelC,MAAM,CAAC,eAAe;QAAEqB,YAAYG;;0BAC3E,KAACW;gBACCC,WAAW/C,WACTW,MAAM,CAAC,oBAAoB,EAC3BiB,SAAS,OAAOjB,MAAM,CAAC,4BAA4B;0BAGpD4B,UAAUS,GAAG,CAAC,CAACC,wBACd,KAACvC;wBAAuBqC,WAAWpC,MAAM,CAAC,wBAAwB;kCAC/DsC;uBADYA;;YAMlBZ,MAAMW,GAAG,CAAC,CAACE,MAAMC,kBAChB,KAACL;oBACCC,WAAW/C,WACTW,MAAM,CAAC,oBAAoB,EAC3BiB,SAAS,OAAOjB,MAAM,CAAC,4BAA4B;8BAIpDuC,KAAKF,GAAG,CAAC,CAACI,KAAKD;wBACd,MAAME,YAAY/C,YAAY8C,KAAKvC;wBACnC,qBACE,KAACN;4BAEC6C,KAAKA;4BACLE,OAAOjD,UAAU+C,KAAKhB;4BACtBmB,QAAQrC,YAAYkC;4BACpBI,UAAUhB;4BACViB,QAAQ,CAAC5B,wBAAwB,CAACwB;4BAClCK,UAAU/B,cAAcyB;4BACxBO,gBAAgBvC,oBAAoBgC,KAAKD;4BACzCS,cAAczC,kBAAkBiC,KAAKD;4BACrCU,sBAAsBrC,4BAA4B4B,KAAKD;4BACvDW,oBAAoBrC,0BAA0B2B,KAAKD;4BACnDY,UAAU9C,gBAAgBmC;4BAC1BY,SAAStC,aAAa0B;4BACtBa,SAAS5C;4BACT6C,SAAS5C;4BACT6C,QAAQ5C,cAAc6B;4BACtBC,WAAWA;4BACXzB,MAAMA;4BACL,GAAGE,QAAQ;2BAlBPsB,IAAIgB,WAAW;oBAqB1B;mBA3BKjB;;;AAgCf,EAAE"}

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

@@ -20,6 +20,8 @@ export interface CalendarHeaderProps extends Omit<HTMLAttributesWithRootRef<HTML
     nextMonthIcon?: React.ReactNode;
     prevMonthProps?: ArrowMonthProps;
     nextMonthProps?: ArrowMonthProps;
+    isMonthDisabled?: (monthNumber: number, year?: number) => boolean;
+    isYearDisabled?: (yearNumber: number) => boolean;
     onChange: (viewDate: Date) => void;
     /**
      * Нажатие на кнопку переключения на следующий месяц.
@@ -30,6 +32,6 @@ export interface CalendarHeaderProps extends Omit<HTMLAttributesWithRootRef<HTML
      */
     onPrevMonth?: () => void;
 }
-export declare const CalendarHeader: ({ viewDate, onChange, prevMonthHidden: prevMonthHiddenProp, nextMonthHidden: nextMonthHiddenProp, disablePickers, onNextMonth, onPrevMonth, prevMonthProps, nextMonthProps, prevMonthLabel, nextMonthLabel, changeMonthLabel, changeYearLabel, prevMonthIcon, nextMonthIcon, ...restProps }: CalendarHeaderProps) => import("react/jsx-runtime").JSX.Element;
+export declare const CalendarHeader: ({ viewDate, onChange, prevMonthHidden: prevMonthHiddenProp, nextMonthHidden: nextMonthHiddenProp, disablePickers, onNextMonth, onPrevMonth, prevMonthProps, nextMonthProps, prevMonthLabel, nextMonthLabel, changeMonthLabel, changeYearLabel, prevMonthIcon, nextMonthIcon, isMonthDisabled, isYearDisabled, ...restProps }: CalendarHeaderProps) => import("react/jsx-runtime").JSX.Element;
 export {};
 //# sourceMappingURL=CalendarHeader.d.ts.map

package/dist/cssm/components/CalendarHeader/CalendarHeader.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"CalendarHeader.d.ts","sourceRoot":"","sources":["../../../../src/components/CalendarHeader/CalendarHeader.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAS/B,OAAO,EAAE,yBAAyB,EAAE,MAAM,aAAa,CAAC;AAUxD,KAAK,eAAe,GAAG,IAAI,CAAC,KAAK,CAAC,iBAAiB,CAAC,WAAW,CAAC,EAAE,SAAS,GAAG,YAAY,CAAC,CAAC;AAE5F,MAAM,WAAW,mBACf,SAAQ,IAAI,CAAC,yBAAyB,CAAC,cAAc,CAAC,EAAE,UAAU,CAAC;IACnE,QAAQ,EAAE,IAAI,CAAC;IACf;;OAEG;IACH,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B;;OAEG;IACH,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,aAAa,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAChC,aAAa,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAChC,cAAc,CAAC,EAAE,eAAe,CAAC;IACjC,cAAc,CAAC,EAAE,eAAe,CAAC;IACjC,QAAQ,EAAE,CAAC,QAAQ,EAAE,IAAI,KAAK,IAAI,CAAC;IACnC;;OAEG;IACH,WAAW,CAAC,EAAE,MAAM,IAAI,CAAC;IACzB;;OAEG;IACH,WAAW,CAAC,EAAE,MAAM,IAAI,CAAC;CAC1B;AAED,eAAO,MAAM,cAAc,~~gSA6BxB~~,mBAAmB,~~4CA2IrB~~,CAAC"}
1	+ {"version":3,"file":"CalendarHeader.d.ts","sourceRoot":"","sources":["../../../../src/components/CalendarHeader/CalendarHeader.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAS/B,OAAO,EAAE,yBAAyB,EAAE,MAAM,aAAa,CAAC;AAUxD,KAAK,eAAe,GAAG,IAAI,CAAC,KAAK,CAAC,iBAAiB,CAAC,WAAW,CAAC,EAAE,SAAS,GAAG,YAAY,CAAC,CAAC;AAE5F,MAAM,WAAW,mBACf,SAAQ,IAAI,CAAC,yBAAyB,CAAC,cAAc,CAAC,EAAE,UAAU,CAAC;IACnE,QAAQ,EAAE,IAAI,CAAC;IACf;;OAEG;IACH,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B;;OAEG;IACH,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,aAAa,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAChC,aAAa,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAChC,cAAc,CAAC,EAAE,eAAe,CAAC;IACjC,cAAc,CAAC,EAAE,eAAe,CAAC;IACjC,eAAe,CAAC,EAAE,CAAC,WAAW,EAAE,MAAM,EAAE,IAAI,CAAC,EAAE,MAAM,KAAK,OAAO,CAAC;IAClE,cAAc,CAAC,EAAE,CAAC,UAAU,EAAE,MAAM,KAAK,OAAO,CAAC;IACjD,QAAQ,EAAE,CAAC,QAAQ,EAAE,IAAI,KAAK,IAAI,CAAC;IACnC;;OAEG;IACH,WAAW,CAAC,EAAE,MAAM,IAAI,CAAC;IACzB;;OAEG;IACH,WAAW,CAAC,EAAE,MAAM,IAAI,CAAC;CAC1B;AAED,eAAO,MAAM,cAAc,iUA+BxB,mBAAmB,4CAgKrB,CAAC"}

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

@@ -20,7 +20,7 @@ export const CalendarHeader = ({ viewDate, onChange, prevMonthHidden: prevMonthH
     className: styles['CalendarHeader__nav-icon--accent'],
     width: 30,
     height: 30
-}), ...restProps })=>{
+}), isMonthDisabled, isYearDisabled, ...restProps })=>{
     const { locale } = useConfigProvider();
     const onMonthsChange = React.useCallback((event)=>onChange(setMonth(viewDate, Number(event.target.value))), [
         onChange,
@@ -30,19 +30,25 @@ export const CalendarHeader = ({ viewDate, onChange, prevMonthHidden: prevMonthH
         onChange,
         viewDate
     ]);
+    const currentYear = viewDate.getFullYear();
+    const currentMonth = viewDate.getMonth();
     const months = React.useMemo(()=>getMonths(locale).map(({ value, label })=>({
                 value,
                 label: /*#__PURE__*/ _jsx("span", {
                     className: styles['CalendarHeader__month'],
                     children: label
-                })
+                }),
+                disabled: isMonthDisabled && isMonthDisabled(value)
             })), [
-        locale
+        locale,
+        isMonthDisabled
     ]);
-    const currentYear = viewDate.getFullYear();
-    const currentMonth = viewDate.getMonth();
-    const years = React.useMemo(()=>getYears(currentYear, 100), [
-        currentYear
+    const years = React.useMemo(()=>getYears(currentYear, 100).map((year)=>({
+                ...year,
+                disabled: isYearDisabled && isYearDisabled(year.value)
+            })), [
+        currentYear,
+        isYearDisabled
     ]);
     const formatter = new Intl.DateTimeFormat(locale, {
         year: 'numeric',
@@ -50,8 +56,14 @@ export const CalendarHeader = ({ viewDate, onChange, prevMonthHidden: prevMonthH
     });
     const { className: prevMonthClassName, ...restPrevMonthProps } = prevMonthProps;
     const { className: nextMonthClassName, ...restNextMonthProps } = nextMonthProps;
-    const nextMonthHidden = nextMonthHiddenProp || currentMonth === 11 && currentYear === DEFAULT_MAX_YEAR;
-    const prevMonthHidden = prevMonthHiddenProp || currentMonth === 0 && currentYear === DEFAULT_MIN_YEAR;
+    let nextMonthHidden = nextMonthHiddenProp || currentMonth === 11 && currentYear === DEFAULT_MAX_YEAR;
+    if (isMonthDisabled && !nextMonthHidden) {
+        nextMonthHidden = isMonthDisabled(currentMonth === 11 ? 0 : currentMonth + 1, currentMonth === 11 ? Math.min(currentYear + 1, DEFAULT_MAX_YEAR) : currentYear);
+    }
+    let prevMonthHidden = prevMonthHiddenProp || currentMonth === 0 && currentYear === DEFAULT_MIN_YEAR;
+    if (isMonthDisabled && !prevMonthHidden) {
+        prevMonthHidden = isMonthDisabled(currentMonth === 0 ? 11 : currentMonth - 1, currentMonth === 0 ? Math.max(currentYear - 1, DEFAULT_MIN_YEAR) : currentYear);
+    }
     return /*#__PURE__*/ _jsxs(RootComponent, {
         baseClassName: styles['CalendarHeader'],
         ...restProps,

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

	@@ -1 +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 { DEFAULT_MAX_YEAR, DEFAULT_MIN_YEAR, getMonths, getYears } from '../../lib/calendar';\nimport { addMonths, setMonth, setYear, subMonths } from '../../lib/date';\nimport { HTMLAttributesWithRootRef } from '../../types';\nimport { AdaptivityProvider } from '../AdaptivityProvider/AdaptivityProvider';\nimport { useConfigProvider } from '../ConfigProvider/ConfigProviderContext';\nimport { CustomSelect } from '../CustomSelect/CustomSelect';\nimport { RootComponent } from '../RootComponent/RootComponent';\nimport { Tappable } from '../Tappable/Tappable';\nimport { Paragraph } from '../Typography/Paragraph/Paragraph';\nimport { VisuallyHidden } from '../VisuallyHidden/VisuallyHidden';\nimport styles from './CalendarHeader.module.css';\n\ntype ArrowMonthProps = Omit<React.AllHTMLAttributes<HTMLElement>, 'onClick' \| 'aria-label'>;\n\nexport interface CalendarHeaderProps\n extends Omit<HTMLAttributesWithRootRef<HTMLDivElement>, 'onChange'> {\n viewDate: Date;\n /*\n Скрывает иконку для переключения на предыдущий месяц\n /\n prevMonthHidden?: boolean;\n /\n Скрывает иконку для переключения на следующий месяц\n /\n nextMonthHidden?: boolean;\n disablePickers?: boolean;\n prevMonthLabel?: string;\n nextMonthLabel?: string;\n changeMonthLabel?: string;\n changeYearLabel?: 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 prevMonthHidden: prevMonthHiddenProp = false,\n nextMonthHidden: nextMonthHiddenProp = false,\n disablePickers = false,\n onNextMonth,\n onPrevMonth,\n prevMonthProps = {},\n nextMonthProps = {},\n prevMonthLabel = 'Предыдущий месяц',\n nextMonthLabel = 'Следующий месяц',\n changeMonthLabel = 'Изменить месяц',\n changeYearLabel = 'Изменить год',\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 ...restProps\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 const currentMonth = viewDate.getMonth();\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 const nextMonthHidden =\n nextMonthHiddenProp \|\| (currentMonth === 11 && currentYear === DEFAULT_MAX_YEAR);\n const prevMonthHidden =\n prevMonthHiddenProp \|\| (currentMonth === 0 && currentYear === DEFAULT_MIN_YEAR);\n\n return (\n <RootComponent baseClassName={styles['CalendarHeader']} {...restProps}>\n {!prevMonthHidden && (\n <AdaptivityProvider sizeX=\"regular\">\n <Tappable\n className={classNames(\n styles['CalendarHeader__nav-icon'],\n styles['CalendarHeader__nav-icon-prev'],\n prevMonthClassName,\n )}\n onClick={onPrevMonth}\n {...restPrevMonthProps}\n >\n <VisuallyHidden>\n {prevMonthLabel}, {formatter.format(subMonths(viewDate, 1))}\n </VisuallyHidden>\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  \n {new Intl.DateTimeFormat(locale, {\n year: 'numeric',\n }).format(viewDate)}\n </Paragraph>\n ) : (\n <AdaptivityProvider sizeY=\"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={currentMonth}\n options={months}\n dropdownOffsetDistance={4}\n dropdownAutoWidth\n icon={<Icon12Dropdown />}\n onChange={onMonthsChange}\n forceDropdownPortal={false}\n selectType=\"accent\"\n aria-label={changeMonthLabel}\n />\n <CustomSelect\n className={classNames(\n styles['CalendarHeader__picker'],\n 'vkuiInternalCalendarHeader__picker',\n )}\n value={currentYear}\n options={years}\n dropdownOffsetDistance={4}\n dropdownAutoWidth\n icon={<Icon12Dropdown />}\n onChange={onYearChange}\n forceDropdownPortal={false}\n selectType=\"accent\"\n aria-label={changeYearLabel}\n />\n </div>\n </AdaptivityProvider>\n )}\n {!nextMonthHidden && (\n <AdaptivityProvider sizeX=\"regular\">\n <Tappable\n className={classNames(\n styles['CalendarHeader__nav-icon'],\n styles['CalendarHeader__nav-icon-next'],\n nextMonthClassName,\n )}\n onClick={onNextMonth}\n {...restNextMonthProps}\n >\n <VisuallyHidden>\n {nextMonthLabel}, {formatter.format(addMonths(viewDate, 1))}\n </VisuallyHidden>\n {nextMonthIcon}\n </Tappable>\n </AdaptivityProvider>\n )}\n </RootComponent>\n );\n};\n"],"names":["React","Icon12Dropdown","Icon20ChevronLeftOutline","Icon20ChevronRightOutline","classNames","DEFAULT_MAX_YEAR","DEFAULT_MIN_YEAR","getMonths","getYears","addMonths","setMonth","setYear","subMonths","AdaptivityProvider","useConfigProvider","CustomSelect","RootComponent","Tappable","Paragraph","VisuallyHidden","styles","CalendarHeader","viewDate","onChange","prevMonthHidden","prevMonthHiddenProp","nextMonthHidden","nextMonthHiddenProp","disablePickers","onNextMonth","onPrevMonth","prevMonthProps","nextMonthProps","prevMonthLabel","nextMonthLabel","changeMonthLabel","changeYearLabel","prevMonthIcon","className","width","height","nextMonthIcon","restProps","locale","onMonthsChange","useCallback","event","Number","target","value","onYearChange","months","useMemo","map","label","span","currentYear","getFullYear","currentMonth","getMonth","years","formatter","Intl","DateTimeFormat","year","month","prevMonthClassName","restPrevMonthProps","nextMonthClassName","restNextMonthProps","baseClassName","sizeX","onClick","format","weight","sizeY","div","options","dropdownOffsetDistance","dropdownAutoWidth","icon","forceDropdownPortal","selectType","aria-label"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"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"}
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 { DEFAULT_MAX_YEAR, DEFAULT_MIN_YEAR, getMonths, getYears } from '../../lib/calendar';\nimport { addMonths, setMonth, setYear, subMonths } from '../../lib/date';\nimport { HTMLAttributesWithRootRef } from '../../types';\nimport { AdaptivityProvider } from '../AdaptivityProvider/AdaptivityProvider';\nimport { useConfigProvider } from '../ConfigProvider/ConfigProviderContext';\nimport { CustomSelect } from '../CustomSelect/CustomSelect';\nimport { RootComponent } from '../RootComponent/RootComponent';\nimport { Tappable } from '../Tappable/Tappable';\nimport { Paragraph } from '../Typography/Paragraph/Paragraph';\nimport { VisuallyHidden } from '../VisuallyHidden/VisuallyHidden';\nimport styles from './CalendarHeader.module.css';\n\ntype ArrowMonthProps = Omit<React.AllHTMLAttributes<HTMLElement>, 'onClick' \| 'aria-label'>;\n\nexport interface CalendarHeaderProps\n extends Omit<HTMLAttributesWithRootRef<HTMLDivElement>, 'onChange'> {\n viewDate: Date;\n /*\n Скрывает иконку для переключения на предыдущий месяц\n /\n prevMonthHidden?: boolean;\n /\n Скрывает иконку для переключения на следующий месяц\n /\n nextMonthHidden?: boolean;\n disablePickers?: boolean;\n prevMonthLabel?: string;\n nextMonthLabel?: string;\n changeMonthLabel?: string;\n changeYearLabel?: string;\n prevMonthIcon?: React.ReactNode;\n nextMonthIcon?: React.ReactNode;\n prevMonthProps?: ArrowMonthProps;\n nextMonthProps?: ArrowMonthProps;\n isMonthDisabled?: (monthNumber: number, year?: number) => boolean;\n isYearDisabled?: (yearNumber: number) => boolean;\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 prevMonthHidden: prevMonthHiddenProp = false,\n nextMonthHidden: nextMonthHiddenProp = false,\n disablePickers = false,\n onNextMonth,\n onPrevMonth,\n prevMonthProps = {},\n nextMonthProps = {},\n prevMonthLabel = 'Предыдущий месяц',\n nextMonthLabel = 'Следующий месяц',\n changeMonthLabel = 'Изменить месяц',\n changeYearLabel = 'Изменить год',\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 isMonthDisabled,\n isYearDisabled,\n ...restProps\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 currentYear = viewDate.getFullYear();\n const currentMonth = viewDate.getMonth();\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 disabled: isMonthDisabled && isMonthDisabled(value),\n })),\n [locale, isMonthDisabled],\n );\n\n const years = React.useMemo(\n () =>\n getYears(currentYear, 100).map((year) => ({\n ...year,\n disabled: isYearDisabled && isYearDisabled(year.value),\n })),\n [currentYear, isYearDisabled],\n );\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 let nextMonthHidden =\n nextMonthHiddenProp \|\| (currentMonth === 11 && currentYear === DEFAULT_MAX_YEAR);\n if (isMonthDisabled && !nextMonthHidden) {\n nextMonthHidden = isMonthDisabled(\n currentMonth === 11 ? 0 : currentMonth + 1,\n currentMonth === 11 ? Math.min(currentYear + 1, DEFAULT_MAX_YEAR) : currentYear,\n );\n }\n\n let prevMonthHidden =\n prevMonthHiddenProp \|\| (currentMonth === 0 && currentYear === DEFAULT_MIN_YEAR);\n if (isMonthDisabled && !prevMonthHidden) {\n prevMonthHidden = isMonthDisabled(\n currentMonth === 0 ? 11 : currentMonth - 1,\n currentMonth === 0 ? Math.max(currentYear - 1, DEFAULT_MIN_YEAR) : currentYear,\n );\n }\n\n return (\n <RootComponent baseClassName={styles['CalendarHeader']} {...restProps}>\n {!prevMonthHidden && (\n <AdaptivityProvider sizeX=\"regular\">\n <Tappable\n className={classNames(\n styles['CalendarHeader__nav-icon'],\n styles['CalendarHeader__nav-icon-prev'],\n prevMonthClassName,\n )}\n onClick={onPrevMonth}\n {...restPrevMonthProps}\n >\n <VisuallyHidden>\n {prevMonthLabel}, {formatter.format(subMonths(viewDate, 1))}\n </VisuallyHidden>\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  \n {new Intl.DateTimeFormat(locale, {\n year: 'numeric',\n }).format(viewDate)}\n </Paragraph>\n ) : (\n <AdaptivityProvider sizeY=\"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={currentMonth}\n options={months}\n dropdownOffsetDistance={4}\n dropdownAutoWidth\n icon={<Icon12Dropdown />}\n onChange={onMonthsChange}\n forceDropdownPortal={false}\n selectType=\"accent\"\n aria-label={changeMonthLabel}\n />\n <CustomSelect\n className={classNames(\n styles['CalendarHeader__picker'],\n 'vkuiInternalCalendarHeader__picker',\n )}\n value={currentYear}\n options={years}\n dropdownOffsetDistance={4}\n dropdownAutoWidth\n icon={<Icon12Dropdown />}\n onChange={onYearChange}\n forceDropdownPortal={false}\n selectType=\"accent\"\n aria-label={changeYearLabel}\n />\n </div>\n </AdaptivityProvider>\n )}\n {!nextMonthHidden && (\n <AdaptivityProvider sizeX=\"regular\">\n <Tappable\n className={classNames(\n styles['CalendarHeader__nav-icon'],\n styles['CalendarHeader__nav-icon-next'],\n nextMonthClassName,\n )}\n onClick={onNextMonth}\n {...restNextMonthProps}\n >\n <VisuallyHidden>\n {nextMonthLabel}, {formatter.format(addMonths(viewDate, 1))}\n </VisuallyHidden>\n {nextMonthIcon}\n </Tappable>\n </AdaptivityProvider>\n )}\n </RootComponent>\n );\n};\n"],"names":["React","Icon12Dropdown","Icon20ChevronLeftOutline","Icon20ChevronRightOutline","classNames","DEFAULT_MAX_YEAR","DEFAULT_MIN_YEAR","getMonths","getYears","addMonths","setMonth","setYear","subMonths","AdaptivityProvider","useConfigProvider","CustomSelect","RootComponent","Tappable","Paragraph","VisuallyHidden","styles","CalendarHeader","viewDate","onChange","prevMonthHidden","prevMonthHiddenProp","nextMonthHidden","nextMonthHiddenProp","disablePickers","onNextMonth","onPrevMonth","prevMonthProps","nextMonthProps","prevMonthLabel","nextMonthLabel","changeMonthLabel","changeYearLabel","prevMonthIcon","className","width","height","nextMonthIcon","isMonthDisabled","isYearDisabled","restProps","locale","onMonthsChange","useCallback","event","Number","target","value","onYearChange","currentYear","getFullYear","currentMonth","getMonth","months","useMemo","map","label","span","disabled","years","year","formatter","Intl","DateTimeFormat","month","prevMonthClassName","restPrevMonthProps","nextMonthClassName","restNextMonthProps","Math","min","max","baseClassName","sizeX","onClick","format","weight","sizeY","div","options","dropdownOffsetDistance","dropdownAutoWidth","icon","forceDropdownPortal","selectType","aria-label"],"mappings":"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"}

package/dist/cssm/components/CalendarRange/CalendarRange.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"CalendarRange.d.ts","sourceRoot":"","sources":["../../../../src/components/CalendarRange/CalendarRange.tsx"],"names":[],"mappings":"~~AAaA~~,OAAO,EAAE,yBAAyB,EAAE,MAAM,aAAa,CAAC;AACxD,OAAO,EAAgB,iBAAiB,EAAE,MAAM,8BAA8B,CAAC;AAC/E,OAAO,EAAkB,mBAAmB,EAAE,MAAM,kCAAkC,CAAC;AAIvF,MAAM,MAAM,aAAa,GAAG,CAAC,IAAI,GAAG,IAAI,EAAE,IAAI,GAAG,IAAI,CAAC,CAAC;AAEvD,MAAM,WAAW,kBACf,SAAQ,IAAI,CAAC,yBAAyB,CAAC,cAAc,CAAC,EAAE,UAAU,CAAC,EACjE,IAAI,CACF,mBAAmB,EACjB,gBAAgB,GAChB,gBAAgB,GAChB,kBAAkB,GAClB,iBAAiB,GACjB,eAAe,GACf,eAAe,CAClB,EACD,IAAI,CAAC,iBAAiB,EAAE,2BAA2B,CAAC;IACtD,KAAK,CAAC,EAAE,aAAa,CAAC;IACtB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,YAAY,CAAC,EAAE,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,CAAC;IACzC,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,aAAa,GAAG,SAAS,KAAK,IAAI,CAAC;IACtD,iBAAiB,CAAC,EAAE,CAAC,KAAK,EAAE,IAAI,KAAK,OAAO,CAAC;IAC7C,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;CACtB;AAUD;;GAEG;AACH,eAAO,MAAM,aAAa,oQAkBvB,kBAAkB,~~4CAyLpB~~,CAAC"}
1	+ {"version":3,"file":"CalendarRange.d.ts","sourceRoot":"","sources":["../../../../src/components/CalendarRange/CalendarRange.tsx"],"names":[],"mappings":"AAcA,OAAO,EAAE,yBAAyB,EAAE,MAAM,aAAa,CAAC;AACxD,OAAO,EAAgB,iBAAiB,EAAE,MAAM,8BAA8B,CAAC;AAC/E,OAAO,EAAkB,mBAAmB,EAAE,MAAM,kCAAkC,CAAC;AAIvF,MAAM,MAAM,aAAa,GAAG,CAAC,IAAI,GAAG,IAAI,EAAE,IAAI,GAAG,IAAI,CAAC,CAAC;AAEvD,MAAM,WAAW,kBACf,SAAQ,IAAI,CAAC,yBAAyB,CAAC,cAAc,CAAC,EAAE,UAAU,CAAC,EACjE,IAAI,CACF,mBAAmB,EACjB,gBAAgB,GAChB,gBAAgB,GAChB,kBAAkB,GAClB,iBAAiB,GACjB,eAAe,GACf,eAAe,CAClB,EACD,IAAI,CAAC,iBAAiB,EAAE,2BAA2B,CAAC;IACtD,KAAK,CAAC,EAAE,aAAa,CAAC;IACtB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,YAAY,CAAC,EAAE,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,CAAC;IACzC,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,aAAa,GAAG,SAAS,KAAK,IAAI,CAAC;IACtD,iBAAiB,CAAC,EAAE,CAAC,KAAK,EAAE,IAAI,KAAK,OAAO,CAAC;IAC7C,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;CACtB;AAUD;;GAEG;AACH,eAAO,MAAM,aAAa,oQAkBvB,kBAAkB,4CAoMpB,CAAC"}

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

@@ -2,7 +2,7 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import * as React from 'react';
 import { useCalendar } from '../../hooks/useCalendar';
 import { isFirstDay, isLastDay, navigateDate, setTimeEqual } from '../../lib/calendar';
-import { addMonths, endOfDay, isAfter, isBefore, isSameDay, isSameMonth, isWithinInterval, startOfDay } from '../../lib/date';
+import { addMonths, endOfDay, isAfter, isBefore, isSameDay, isSameMonth, isWithinInterval, startOfDay, subMonths } from '../../lib/date';
 import { CalendarDays } from '../CalendarDays/CalendarDays';
 import { CalendarHeader } from '../CalendarHeader/CalendarHeader';
 import { RootComponent } from '../RootComponent/RootComponent';
@@ -16,7 +16,7 @@ const getIsDaySelected = (day, value)=>{
 /**
  * @see https://vkcom.github.io/VKUI/#/CalendarRange
  */ export const CalendarRange = ({ value, onChange, disablePast, disableFuture, shouldDisableDate, onClose, weekStartsOn = 1, disablePickers, prevMonthLabel = 'Предыдущий месяц', nextMonthLabel = 'Следующий месяц', changeMonthLabel = 'Изменить месяц', changeYearLabel = 'Изменить год', changeDayLabel = 'Изменить день', prevMonthIcon, nextMonthIcon, listenDayChangesForUpdate, ...props })=>{
-    const { viewDate, setViewDate, setPrevMonth, setNextMonth, focusedDay, setFocusedDay, isDayFocused, isDayDisabled, resetSelectedDay } = useCalendar({
+    const { viewDate, setViewDate, setPrevMonth, setNextMonth, focusedDay, setFocusedDay, isDayFocused, isDayDisabled, resetSelectedDay, isMonthDisabled, isYearDisabled } = useCalendar({
         value,
         disableFuture,
         disablePast,
@@ -110,6 +110,9 @@ const getIsDaySelected = (day, value)=>{
     const isDayHinted = React.useCallback((day)=>getIsDaySelected(day, hintedDate), [
         hintedDate
     ]);
+    const onRightPartViewDateChange = React.useCallback((newDate)=>setViewDate(subMonths(newDate, 1)), [
+        setViewDate
+    ]);
     return /*#__PURE__*/ _jsxs(RootComponent, {
         ...props,
         baseClassName: styles['CalendarRange'],
@@ -128,7 +131,9 @@ const getIsDaySelected = (day, value)=>{
                         nextMonthLabel: nextMonthLabel,
                         changeMonthLabel: changeMonthLabel,
                         changeYearLabel: changeYearLabel,
-                        prevMonthIcon: prevMonthIcon
+                        prevMonthIcon: prevMonthIcon,
+                        isMonthDisabled: isMonthDisabled,
+                        isYearDisabled: isYearDisabled
                     }),
                     /*#__PURE__*/ _jsx(CalendarDays, {
                         viewDate: viewDate,
@@ -157,7 +162,7 @@ const getIsDaySelected = (day, value)=>{
                 children: [
                     /*#__PURE__*/ _jsx(CalendarHeader, {
                         viewDate: secondViewDate,
-                        onChange: setViewDate,
+                        onChange: onRightPartViewDateChange,
                         prevMonthHidden: true,
                         onNextMonth: setNextMonth,
                         disablePickers: disablePickers,
@@ -166,7 +171,9 @@ const getIsDaySelected = (day, value)=>{
                         nextMonthLabel: nextMonthLabel,
                         changeMonthLabel: changeMonthLabel,
                         changeYearLabel: changeYearLabel,
-                        nextMonthIcon: nextMonthIcon
+                        nextMonthIcon: nextMonthIcon,
+                        isMonthDisabled: isMonthDisabled,
+                        isYearDisabled: isYearDisabled
                     }),
                     /*#__PURE__*/ _jsx(CalendarDays, {
                         viewDate: secondViewDate,

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

	@@ -1 +1 @@
1	- {"version":3,"sources":["../../../../src/components/CalendarRange/CalendarRange.tsx"],"sourcesContent":["import * as React from 'react';\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 { HTMLAttributesWithRootRef } from '../../types';\nimport { CalendarDays, CalendarDaysProps } from '../CalendarDays/CalendarDays';\nimport { CalendarHeader, CalendarHeaderProps } from '../CalendarHeader/CalendarHeader';\nimport { RootComponent } from '../RootComponent/RootComponent';\nimport styles from './CalendarRange.module.css';\n\nexport type DateRangeType = [Date \| null, Date \| null];\n\nexport interface CalendarRangeProps\n extends Omit<HTMLAttributesWithRootRef<HTMLDivElement>, 'onChange'>,\n Pick<\n CalendarHeaderProps,\n \| 'prevMonthLabel'\n \| 'nextMonthLabel'\n \| 'changeMonthLabel'\n \| 'changeYearLabel'\n \| 'prevMonthIcon'\n \| 'nextMonthIcon'\n >,\n Pick<CalendarDaysProps, 'listenDayChangesForUpdate'> {\n value?: DateRangeType;\n disablePast?: boolean;\n disableFuture?: boolean;\n disablePickers?: boolean;\n changeDayLabel?: string;\n weekStartsOn?: 0 \| 1 \| 2 \| 3 \| 4 \| 5 \| 6;\n onChange?: (value: DateRangeType \| undefined) => void;\n shouldDisableDate?: (value: Date) => boolean;\n onClose?: () => void;\n}\n\nconst getIsDaySelected = (day: Date, value?: DateRangeType) => {\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 disablePickers,\n prevMonthLabel = 'Предыдущий месяц',\n nextMonthLabel = 'Следующий месяц',\n changeMonthLabel = 'Изменить месяц',\n changeYearLabel = 'Изменить год',\n changeDayLabel = 'Изменить день',\n prevMonthIcon,\n nextMonthIcon,\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<DateRangeType>();\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): DateRangeType => {\n const isValueEmpty = !value \|\| (value[0] === null && value[1] === null);\n if (isValueEmpty) {\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 <RootComponent {...props} baseClassName={styles['CalendarRange']}>\n <div className={styles['CalendarRange__inner']}>\n <CalendarHeader\n viewDate={viewDate}\n onChange={setViewDate}\n nextMonthHidden\n onPrevMonth={setPrevMonth}\n disablePickers={disablePickers}\n className={styles['CalendarRange__header']}\n prevMonthLabel={prevMonthLabel}\n nextMonthLabel={nextMonthLabel}\n changeMonthLabel={changeMonthLabel}\n changeYearLabel={changeYearLabel}\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={changeDayLabel}\n />\n </div>\n <div className={styles['CalendarRange__inner']}>\n <CalendarHeader\n viewDate={secondViewDate}\n onChange={setViewDate}\n prevMonthHidden\n onNextMonth={setNextMonth}\n disablePickers={disablePickers}\n className={styles['CalendarRange__header']}\n prevMonthLabel={prevMonthLabel}\n nextMonthLabel={nextMonthLabel}\n changeMonthLabel={changeMonthLabel}\n changeYearLabel={changeYearLabel}\n nextMonthIcon={nextMonthIcon}\n />\n <CalendarDays\n viewDate={secondViewDate}\n value={value}\n weekStartsOn={weekStartsOn}\n aria-label={changeDayLabel}\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 </RootComponent>\n );\n};\n"],"names":["React","useCalendar","isFirstDay","isLastDay","navigateDate","setTimeEqual","addMonths","endOfDay","isAfter","isBefore","isSameDay","isSameMonth","isWithinInterval","startOfDay","CalendarDays","CalendarHeader","RootComponent","styles","getIsDaySelected","day","value","Boolean","CalendarRange","onChange","disablePast","disableFuture","shouldDisableDate","onClose","weekStartsOn","disablePickers","prevMonthLabel","nextMonthLabel","changeMonthLabel","changeYearLabel","changeDayLabel","prevMonthIcon","nextMonthIcon","listenDayChangesForUpdate","props","viewDate","setViewDate","setPrevMonth","setNextMonth","focusedDay","setFocusedDay","isDayFocused","isDayDisabled","resetSelectedDay","hintedDate","setHintedDate","useState","secondViewDate","handleKeyDown","useCallback","event","includes","key","preventDefault","newFocusedDay","getNewValue","date","isValueEmpty","start","end","onDayChange","undefined","isDaySelected","isDayActive","isDaySelectionEnd","dayOfWeek","isHintedDaySelectionEnd","isDaySelectionStart","isHintedDaySelectionStart","onDayEnter","onDayLeave","isDayHinted","baseClassName","div","className","nextMonthHidden","onPrevMonth","onKeyDown","aria-label","prevMonthHidden","onNextMonth","tabIndex","onBlur"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"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"}
1	+ {"version":3,"sources":["../../../../src/components/CalendarRange/CalendarRange.tsx"],"sourcesContent":["import * as React from 'react';\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 subMonths,\n} from '../../lib/date';\nimport { HTMLAttributesWithRootRef } from '../../types';\nimport { CalendarDays, CalendarDaysProps } from '../CalendarDays/CalendarDays';\nimport { CalendarHeader, CalendarHeaderProps } from '../CalendarHeader/CalendarHeader';\nimport { RootComponent } from '../RootComponent/RootComponent';\nimport styles from './CalendarRange.module.css';\n\nexport type DateRangeType = [Date \| null, Date \| null];\n\nexport interface CalendarRangeProps\n extends Omit<HTMLAttributesWithRootRef<HTMLDivElement>, 'onChange'>,\n Pick<\n CalendarHeaderProps,\n \| 'prevMonthLabel'\n \| 'nextMonthLabel'\n \| 'changeMonthLabel'\n \| 'changeYearLabel'\n \| 'prevMonthIcon'\n \| 'nextMonthIcon'\n >,\n Pick<CalendarDaysProps, 'listenDayChangesForUpdate'> {\n value?: DateRangeType;\n disablePast?: boolean;\n disableFuture?: boolean;\n disablePickers?: boolean;\n changeDayLabel?: string;\n weekStartsOn?: 0 \| 1 \| 2 \| 3 \| 4 \| 5 \| 6;\n onChange?: (value: DateRangeType \| undefined) => void;\n shouldDisableDate?: (value: Date) => boolean;\n onClose?: () => void;\n}\n\nconst getIsDaySelected = (day: Date, value?: DateRangeType) => {\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 disablePickers,\n prevMonthLabel = 'Предыдущий месяц',\n nextMonthLabel = 'Следующий месяц',\n changeMonthLabel = 'Изменить месяц',\n changeYearLabel = 'Изменить год',\n changeDayLabel = 'Изменить день',\n prevMonthIcon,\n nextMonthIcon,\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 isMonthDisabled,\n isYearDisabled,\n } = useCalendar({ value, disableFuture, disablePast, shouldDisableDate });\n const [hintedDate, setHintedDate] = React.useState<DateRangeType>();\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): DateRangeType => {\n const isValueEmpty = !value \|\| (value[0] === null && value[1] === null);\n if (isValueEmpty) {\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 const onRightPartViewDateChange = React.useCallback(\n (newDate: Date) => setViewDate(subMonths(newDate, 1)),\n [setViewDate],\n );\n\n return (\n <RootComponent {...props} baseClassName={styles['CalendarRange']}>\n <div className={styles['CalendarRange__inner']}>\n <CalendarHeader\n viewDate={viewDate}\n onChange={setViewDate}\n nextMonthHidden\n onPrevMonth={setPrevMonth}\n disablePickers={disablePickers}\n className={styles['CalendarRange__header']}\n prevMonthLabel={prevMonthLabel}\n nextMonthLabel={nextMonthLabel}\n changeMonthLabel={changeMonthLabel}\n changeYearLabel={changeYearLabel}\n prevMonthIcon={prevMonthIcon}\n isMonthDisabled={isMonthDisabled}\n isYearDisabled={isYearDisabled}\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={changeDayLabel}\n />\n </div>\n <div className={styles['CalendarRange__inner']}>\n <CalendarHeader\n viewDate={secondViewDate}\n onChange={onRightPartViewDateChange}\n prevMonthHidden\n onNextMonth={setNextMonth}\n disablePickers={disablePickers}\n className={styles['CalendarRange__header']}\n prevMonthLabel={prevMonthLabel}\n nextMonthLabel={nextMonthLabel}\n changeMonthLabel={changeMonthLabel}\n changeYearLabel={changeYearLabel}\n nextMonthIcon={nextMonthIcon}\n isMonthDisabled={isMonthDisabled}\n isYearDisabled={isYearDisabled}\n />\n <CalendarDays\n viewDate={secondViewDate}\n value={value}\n weekStartsOn={weekStartsOn}\n aria-label={changeDayLabel}\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 </RootComponent>\n );\n};\n"],"names":["React","useCalendar","isFirstDay","isLastDay","navigateDate","setTimeEqual","addMonths","endOfDay","isAfter","isBefore","isSameDay","isSameMonth","isWithinInterval","startOfDay","subMonths","CalendarDays","CalendarHeader","RootComponent","styles","getIsDaySelected","day","value","Boolean","CalendarRange","onChange","disablePast","disableFuture","shouldDisableDate","onClose","weekStartsOn","disablePickers","prevMonthLabel","nextMonthLabel","changeMonthLabel","changeYearLabel","changeDayLabel","prevMonthIcon","nextMonthIcon","listenDayChangesForUpdate","props","viewDate","setViewDate","setPrevMonth","setNextMonth","focusedDay","setFocusedDay","isDayFocused","isDayDisabled","resetSelectedDay","isMonthDisabled","isYearDisabled","hintedDate","setHintedDate","useState","secondViewDate","handleKeyDown","useCallback","event","includes","key","preventDefault","newFocusedDay","getNewValue","date","isValueEmpty","start","end","onDayChange","undefined","isDaySelected","isDayActive","isDaySelectionEnd","dayOfWeek","isHintedDaySelectionEnd","isDaySelectionStart","isHintedDaySelectionStart","onDayEnter","onDayLeave","isDayHinted","onRightPartViewDateChange","newDate","baseClassName","div","className","nextMonthHidden","onPrevMonth","onKeyDown","aria-label","prevMonthHidden","onNextMonth","tabIndex","onBlur"],"mappings":"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"}

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

@@ -3,7 +3,7 @@
   justify-content: space-around;
   flex-wrap: wrap;
   inline-size: 610px;
-  background: var(--vkui--color_background_modal);
+  background: var(--vkui--color_background_contrast_themed);
   border: 0.5px solid var(--vkui--color_separator_primary);
   box-sizing: border-box;
   box-shadow: var(--vkui--elevation1);

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

	@@ -1 +1 @@
1	- {"version":3,"sources":["../../../../src/components/CalendarTime/CalendarTime.tsx"],"sourcesContent":["import * as React from 'react';\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 changeHoursLabel?: string;\n changeMinutesLabel?: string;\n onChange?: (value: Date) => void;\n onClose?: () => void;\n isDayDisabled?: (day: Date, withTime?: boolean) => boolean;\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 changeHoursLabel,\n changeMinutesLabel,\n isDayDisabled,\n}: CalendarTimeProps) => {\n const localHours = isDayDisabled\n ? hours.map((hour) => {\n return { ...hour, disabled: isDayDisabled(setHours(value, hour.value), true) };\n })\n : hours;\n\n const localMinutes = isDayDisabled\n ? minutes.map((minute) => {\n return { ...minute, disabled: isDayDisabled(setMinutes(value, minute.value), true) };\n })\n : minutes;\n\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=\"compact\">\n <CustomSelect\n value={value.getHours()}\n options={localHours}\n onChange={onHoursChange}\n forceDropdownPortal={false}\n aria-label={changeHoursLabel}\n />\n </AdaptivityProvider>\n </div>\n <div className={styles['CalendarTime__divider']}>:</div>\n <div className={styles['CalendarTime__picker']}>\n <AdaptivityProvider sizeY=\"compact\">\n <CustomSelect\n value={value.getMinutes()}\n options={localMinutes}\n onChange={onMinutesChange}\n forceDropdownPortal={false}\n aria-label={changeMinutesLabel}\n />\n </AdaptivityProvider>\n </div>\n <div className={styles['CalendarTime__button']}>\n <AdaptivityProvider sizeY=\"compact\">\n <Button mode=\"secondary\" onClick={onClose} size=\"l\">\n {doneButtonText}\n </Button>\n </AdaptivityProvider>\n </div>\n </div>\n );\n};\n"],"names":["React","setHours","setMinutes","AdaptivityProvider","Button","CustomSelect","styles","hours","i","push","value","label","String","padStart","minutes","CalendarTime","doneButtonText","onChange","onClose","changeHoursLabel","changeMinutesLabel","isDayDisabled","localHours","map","hour","disabled","localMinutes","minute","onHoursChange","useCallback","event","Number","target","onMinutesChange","div","className","sizeY","getHours","options","forceDropdownPortal","aria-label","getMinutes","mode","onClick","size"],"~~rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","~~mappings":";AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,QAAQ,EAAEC,UAAU,QAAQ,iBAAiB;AACtD,SAASC,kBAAkB,QAAQ,2CAA2C;AAC9E,SAASC,MAAM,QAAQ,mBAAmB;AAC1C,SAASC,YAAY,QAAQ,+BAA+B;AAC5D,OAAOC,YAAY,4BAA4B;AAY/C,MAAMC,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,MAAMC,UAGD,EAAE;AACP,IAAK,IAAIN,IAAI,GAAGA,IAAI,IAAIA,KAAK,EAAG;IAC9BM,QAAQL,IAAI,CAAC;QAAEC,OAAOF;QAAGG,OAAOC,OAAOJ,GAAGK,QAAQ,CAAC,GAAG;IAAK;AAC7D;AAEA,OAAO,MAAME,eAAe,CAAC,EAC3BL,KAAK,EACLM,iBAAiB,QAAQ,EACzBC,QAAQ,EACRC,OAAO,EACPC,gBAAgB,EAChBC,kBAAkB,EAClBC,aAAa,EACK;IAClB,MAAMC,aAAaD,gBACfd,MAAMgB,GAAG,CAAC,CAACC;QACT,OAAO;YAAE,GAAGA,IAAI;YAAEC,UAAUJ,cAAcpB,SAASS,OAAOc,KAAKd,KAAK,GAAG;QAAM;IAC/E,KACAH;IAEJ,MAAMmB,eAAeL,gBACjBP,QAAQS,GAAG,CAAC,CAACI;QACX,OAAO;YAAE,GAAGA,MAAM;YAAEF,UAAUJ,cAAcnB,WAAWQ,OAAOiB,OAAOjB,KAAK,GAAG;QAAM;IACrF,KACAI;IAEJ,MAAMc,gBAAgB5B,MAAM6B,WAAW,CACrC,CAACC,QACCb,WAAWhB,SAASS,OAAOqB,OAAOD,MAAME,MAAM,CAACtB,KAAK,KACtD;QAACO;QAAUP;KAAM;IAEnB,MAAMuB,kBAAkBjC,MAAM6B,WAAW,CACvC,CAACC,QACCb,WAAWf,WAAWQ,OAAOqB,OAAOD,MAAME,MAAM,CAACtB,KAAK,KACxD;QAACO;QAAUP;KAAM;IAGnB,qBACE,MAACwB;QAAIC,WAAW7B,MAAM,CAAC,eAAe;;0BACpC,KAAC4B;gBAAIC,WAAW7B,MAAM,CAAC,uBAAuB;0BAC5C,cAAA,KAACH;oBAAmBiC,OAAM;8BACxB,cAAA,KAAC/B;wBACCK,OAAOA,MAAM2B,QAAQ;wBACrBC,SAAShB;wBACTL,UAAUW;wBACVW,qBAAqB;wBACrBC,cAAYrB;;;;0BAIlB,KAACe;gBAAIC,WAAW7B,MAAM,CAAC,wBAAwB;0BAAE;;0BACjD,KAAC4B;gBAAIC,WAAW7B,MAAM,CAAC,uBAAuB;0BAC5C,cAAA,KAACH;oBAAmBiC,OAAM;8BACxB,cAAA,KAAC/B;wBACCK,OAAOA,MAAM+B,UAAU;wBACvBH,SAASZ;wBACTT,UAAUgB;wBACVM,qBAAqB;wBACrBC,cAAYpB;;;;0BAIlB,KAACc;gBAAIC,WAAW7B,MAAM,CAAC,uBAAuB;0BAC5C,cAAA,KAACH;oBAAmBiC,OAAM;8BACxB,cAAA,KAAChC;wBAAOsC,MAAK;wBAAYC,SAASzB;wBAAS0B,MAAK;kCAC7C5B;;;;;;AAMb,EAAE"}
1	+ {"version":3,"sources":["../../../../src/components/CalendarTime/CalendarTime.tsx"],"sourcesContent":["import * as React from 'react';\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 changeHoursLabel?: string;\n changeMinutesLabel?: string;\n onChange?: (value: Date) => void;\n onClose?: () => void;\n isDayDisabled?: (day: Date, withTime?: boolean) => boolean;\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 changeHoursLabel,\n changeMinutesLabel,\n isDayDisabled,\n}: CalendarTimeProps) => {\n const localHours = isDayDisabled\n ? hours.map((hour) => {\n return { ...hour, disabled: isDayDisabled(setHours(value, hour.value), true) };\n })\n : hours;\n\n const localMinutes = isDayDisabled\n ? minutes.map((minute) => {\n return { ...minute, disabled: isDayDisabled(setMinutes(value, minute.value), true) };\n })\n : minutes;\n\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=\"compact\">\n <CustomSelect\n value={value.getHours()}\n options={localHours}\n onChange={onHoursChange}\n forceDropdownPortal={false}\n aria-label={changeHoursLabel}\n />\n </AdaptivityProvider>\n </div>\n <div className={styles['CalendarTime__divider']}>:</div>\n <div className={styles['CalendarTime__picker']}>\n <AdaptivityProvider sizeY=\"compact\">\n <CustomSelect\n value={value.getMinutes()}\n options={localMinutes}\n onChange={onMinutesChange}\n forceDropdownPortal={false}\n aria-label={changeMinutesLabel}\n />\n </AdaptivityProvider>\n </div>\n <div className={styles['CalendarTime__button']}>\n <AdaptivityProvider sizeY=\"compact\">\n <Button mode=\"secondary\" onClick={onClose} size=\"l\">\n {doneButtonText}\n </Button>\n </AdaptivityProvider>\n </div>\n </div>\n );\n};\n"],"names":["React","setHours","setMinutes","AdaptivityProvider","Button","CustomSelect","styles","hours","i","push","value","label","String","padStart","minutes","CalendarTime","doneButtonText","onChange","onClose","changeHoursLabel","changeMinutesLabel","isDayDisabled","localHours","map","hour","disabled","localMinutes","minute","onHoursChange","useCallback","event","Number","target","onMinutesChange","div","className","sizeY","getHours","options","forceDropdownPortal","aria-label","getMinutes","mode","onClick","size"],"mappings":";AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,QAAQ,EAAEC,UAAU,QAAQ,iBAAiB;AACtD,SAASC,kBAAkB,QAAQ,2CAA2C;AAC9E,SAASC,MAAM,QAAQ,mBAAmB;AAC1C,SAASC,YAAY,QAAQ,+BAA+B;AAC5D,OAAOC,YAAY,4BAA4B;AAY/C,MAAMC,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,MAAMC,UAGD,EAAE;AACP,IAAK,IAAIN,IAAI,GAAGA,IAAI,IAAIA,KAAK,EAAG;IAC9BM,QAAQL,IAAI,CAAC;QAAEC,OAAOF;QAAGG,OAAOC,OAAOJ,GAAGK,QAAQ,CAAC,GAAG;IAAK;AAC7D;AAEA,OAAO,MAAME,eAAe,CAAC,EAC3BL,KAAK,EACLM,iBAAiB,QAAQ,EACzBC,QAAQ,EACRC,OAAO,EACPC,gBAAgB,EAChBC,kBAAkB,EAClBC,aAAa,EACK;IAClB,MAAMC,aAAaD,gBACfd,MAAMgB,GAAG,CAAC,CAACC;QACT,OAAO;YAAE,GAAGA,IAAI;YAAEC,UAAUJ,cAAcpB,SAASS,OAAOc,KAAKd,KAAK,GAAG;QAAM;IAC/E,KACAH;IAEJ,MAAMmB,eAAeL,gBACjBP,QAAQS,GAAG,CAAC,CAACI;QACX,OAAO;YAAE,GAAGA,MAAM;YAAEF,UAAUJ,cAAcnB,WAAWQ,OAAOiB,OAAOjB,KAAK,GAAG;QAAM;IACrF,KACAI;IAEJ,MAAMc,gBAAgB5B,MAAM6B,WAAW,CACrC,CAACC,QACCb,WAAWhB,SAASS,OAAOqB,OAAOD,MAAME,MAAM,CAACtB,KAAK,KACtD;QAACO;QAAUP;KAAM;IAEnB,MAAMuB,kBAAkBjC,MAAM6B,WAAW,CACvC,CAACC,QACCb,WAAWf,WAAWQ,OAAOqB,OAAOD,MAAME,MAAM,CAACtB,KAAK,KACxD;QAACO;QAAUP;KAAM;IAGnB,qBACE,MAACwB;QAAIC,WAAW7B,MAAM,CAAC,eAAe;;0BACpC,KAAC4B;gBAAIC,WAAW7B,MAAM,CAAC,uBAAuB;0BAC5C,cAAA,KAACH;oBAAmBiC,OAAM;8BACxB,cAAA,KAAC/B;wBACCK,OAAOA,MAAM2B,QAAQ;wBACrBC,SAAShB;wBACTL,UAAUW;wBACVW,qBAAqB;wBACrBC,cAAYrB;;;;0BAIlB,KAACe;gBAAIC,WAAW7B,MAAM,CAAC,wBAAwB;0BAAE;;0BACjD,KAAC4B;gBAAIC,WAAW7B,MAAM,CAAC,uBAAuB;0BAC5C,cAAA,KAACH;oBAAmBiC,OAAM;8BACxB,cAAA,KAAC/B;wBACCK,OAAOA,MAAM+B,UAAU;wBACvBH,SAASZ;wBACTT,UAAUgB;wBACVM,qBAAqB;wBACrBC,cAAYpB;;;;0BAIlB,KAACc;gBAAIC,WAAW7B,MAAM,CAAC,uBAAuB;0BAC5C,cAAA,KAACH;oBAAmBiC,OAAM;8BACxB,cAAA,KAAChC;wBAAOsC,MAAK;wBAAYC,SAASzB;wBAAS0B,MAAK;kCAC7C5B;;;;;;AAMb,EAAE"}

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

	@@ -1 +1 @@
1	- {"version":3,"sources":["../../../../src/components/Card/Card.tsx"],"sourcesContent":["import { classNames } from '@vkontakte/vkjs';\nimport { HTMLAttributesWithRootRef } from '../../types';\nimport { RootComponent } from '../RootComponent/RootComponent';\nimport styles from './Card.module.css';\n\nexport interface CardProps extends HTMLAttributesWithRootRef<HTMLDivElement> {\n mode?: 'tint' \| 'shadow' \| 'outline' \| 'outline-tint';\n}\n\n/*\n @see https://vkcom.github.io/VKUI/#/Card\n */\nexport const Card = ({ mode = 'tint', ...restProps }: CardProps) => {\n const withBorder = mode === 'outline' \|\| mode === 'outline-tint';\n return (\n <RootComponent\n {...restProps}\n baseClassName={classNames(\n styles['Card'],\n mode === 'outline' && styles['Card--mode-outline'],\n mode === 'shadow' && styles['Card--mode-shadow'],\n withBorder && styles['Card--withBorder'],\n )}\n />\n );\n};\n"],"names":["classNames","RootComponent","styles","Card","mode","restProps","withBorder","baseClassName"],"~~rangeMappings":";;;;;;;;;;;;","~~mappings":";AAAA,SAASA,UAAU,QAAQ,kBAAkB;AAE7C,SAASC,aAAa,QAAQ,iCAAiC;AAC/D,OAAOC,YAAY,oBAAoB;AAMvC;;CAEC,GACD,OAAO,MAAMC,OAAO,CAAC,EAAEC,OAAO,MAAM,EAAE,GAAGC,WAAsB;IAC7D,MAAMC,aAAaF,SAAS,aAAaA,SAAS;IAClD,qBACE,KAACH;QACE,GAAGI,SAAS;QACbE,eAAeP,WACbE,MAAM,CAAC,OAAO,EACdE,SAAS,aAAaF,MAAM,CAAC,qBAAqB,EAClDE,SAAS,YAAYF,MAAM,CAAC,oBAAoB,EAChDI,cAAcJ,MAAM,CAAC,mBAAmB;;AAIhD,EAAE"}
1	+ {"version":3,"sources":["../../../../src/components/Card/Card.tsx"],"sourcesContent":["import { classNames } from '@vkontakte/vkjs';\nimport { HTMLAttributesWithRootRef } from '../../types';\nimport { RootComponent } from '../RootComponent/RootComponent';\nimport styles from './Card.module.css';\n\nexport interface CardProps extends HTMLAttributesWithRootRef<HTMLDivElement> {\n mode?: 'tint' \| 'shadow' \| 'outline' \| 'outline-tint';\n}\n\n/*\n @see https://vkcom.github.io/VKUI/#/Card\n */\nexport const Card = ({ mode = 'tint', ...restProps }: CardProps) => {\n const withBorder = mode === 'outline' \|\| mode === 'outline-tint';\n return (\n <RootComponent\n {...restProps}\n baseClassName={classNames(\n styles['Card'],\n mode === 'outline' && styles['Card--mode-outline'],\n mode === 'shadow' && styles['Card--mode-shadow'],\n withBorder && styles['Card--withBorder'],\n )}\n />\n );\n};\n"],"names":["classNames","RootComponent","styles","Card","mode","restProps","withBorder","baseClassName"],"mappings":";AAAA,SAASA,UAAU,QAAQ,kBAAkB;AAE7C,SAASC,aAAa,QAAQ,iCAAiC;AAC/D,OAAOC,YAAY,oBAAoB;AAMvC;;CAEC,GACD,OAAO,MAAMC,OAAO,CAAC,EAAEC,OAAO,MAAM,EAAE,GAAGC,WAAsB;IAC7D,MAAMC,aAAaF,SAAS,aAAaA,SAAS;IAClD,qBACE,KAACH;QACE,GAAGI,SAAS;QACbE,eAAeP,WACbE,MAAM,CAAC,OAAO,EACdE,SAAS,aAAaF,MAAM,CAAC,qBAAqB,EAClDE,SAAS,YAAYF,MAAM,CAAC,oBAAoB,EAChDI,cAAcJ,MAAM,CAAC,mBAAmB;;AAIhD,EAAE"}

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

@@ -10,11 +10,11 @@
     0 2px 24px 0 rgba(0, 0, 0, 0.08),
     0 0 2px 0 rgba(0, 0, 0, 0.08)
   );
-  background: var(--vkui--color_background_modal);
+  background: var(--vkui--color_background_contrast_themed);
 }
 .Card--mode-outline {
-  background: var(--vkui--color_background_modal);
+  background: var(--vkui--color_background_contrast_themed);
 }
 .Card--withBorder::after {

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

	@@ -1 +1 @@
1	- {"version":3,"sources":["../../../../src/components/CardGrid/CardGrid.tsx"],"sourcesContent":["import { classNames } from '@vkontakte/vkjs';\nimport { useAdaptivity } from '../../hooks/useAdaptivity';\nimport { HTMLAttributesWithRootRef } from '../../types';\nimport { RootComponent } from '../RootComponent/RootComponent';\nimport styles from './CardGrid.module.css';\n\nconst sizeXClassNames = {\n none: styles['CardGrid--sizeX-none'],\n ['compact']: styles['CardGrid--sizeX-compact'],\n};\n\nconst stylesSize = {\n s: 'vkuiInternalCardGrid--size-s',\n m: 'vkuiInternalCardGrid--size-m',\n l: 'vkuiInternalCardGrid--size-l',\n};\n\nexport interface CardGridProps extends HTMLAttributesWithRootRef<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 = ({ size = 's', spaced = false, ...restProps }: CardGridProps) => {\n const { sizeX = 'none' } = useAdaptivity();\n\n return (\n <RootComponent\n {...restProps}\n baseClassName={classNames(\n styles['CardGrid'],\n 'vkuiInternalCardGrid',\n spaced && styles['CardGrid--spaced'],\n stylesSize[size],\n sizeX !== 'regular' && sizeXClassNames[sizeX],\n )}\n />\n );\n};\n"],"names":["classNames","useAdaptivity","RootComponent","styles","sizeXClassNames","none","stylesSize","s","m","l","CardGrid","size","spaced","restProps","sizeX","baseClassName"],"~~rangeMappings":";;;;;;;;;;;;;;;;;;;;;;","~~mappings":";AAAA,SAASA,UAAU,QAAQ,kBAAkB;AAC7C,SAASC,aAAa,QAAQ,4BAA4B;AAE1D,SAASC,aAAa,QAAQ,iCAAiC;AAC/D,OAAOC,YAAY,wBAAwB;AAE3C,MAAMC,kBAAkB;IACtBC,MAAMF,MAAM,CAAC,uBAAuB;IACpC,CAAC,UAAU,EAAEA,MAAM,CAAC,0BAA0B;AAChD;AAEA,MAAMG,aAAa;IACjBC,GAAG;IACHC,GAAG;IACHC,GAAG;AACL;AAUA;;CAEC,GACD,OAAO,MAAMC,WAAW,CAAC,EAAEC,OAAO,GAAG,EAAEC,SAAS,KAAK,EAAE,GAAGC,WAA0B;IAClF,MAAM,EAAEC,QAAQ,MAAM,EAAE,GAAGb;IAE3B,qBACE,KAACC;QACE,GAAGW,SAAS;QACbE,eAAef,WACbG,MAAM,CAAC,WAAW,EAClB,wBACAS,UAAUT,MAAM,CAAC,mBAAmB,EACpCG,UAAU,CAACK,KAAK,EAChBG,UAAU,aAAaV,eAAe,CAACU,MAAM;;AAIrD,EAAE"}
1	+ {"version":3,"sources":["../../../../src/components/CardGrid/CardGrid.tsx"],"sourcesContent":["import { classNames } from '@vkontakte/vkjs';\nimport { useAdaptivity } from '../../hooks/useAdaptivity';\nimport { HTMLAttributesWithRootRef } from '../../types';\nimport { RootComponent } from '../RootComponent/RootComponent';\nimport styles from './CardGrid.module.css';\n\nconst sizeXClassNames = {\n none: styles['CardGrid--sizeX-none'],\n ['compact']: styles['CardGrid--sizeX-compact'],\n};\n\nconst stylesSize = {\n s: 'vkuiInternalCardGrid--size-s',\n m: 'vkuiInternalCardGrid--size-m',\n l: 'vkuiInternalCardGrid--size-l',\n};\n\nexport interface CardGridProps extends HTMLAttributesWithRootRef<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 = ({ size = 's', spaced = false, ...restProps }: CardGridProps) => {\n const { sizeX = 'none' } = useAdaptivity();\n\n return (\n <RootComponent\n {...restProps}\n baseClassName={classNames(\n styles['CardGrid'],\n 'vkuiInternalCardGrid',\n spaced && styles['CardGrid--spaced'],\n stylesSize[size],\n sizeX !== 'regular' && sizeXClassNames[sizeX],\n )}\n />\n );\n};\n"],"names":["classNames","useAdaptivity","RootComponent","styles","sizeXClassNames","none","stylesSize","s","m","l","CardGrid","size","spaced","restProps","sizeX","baseClassName"],"mappings":";AAAA,SAASA,UAAU,QAAQ,kBAAkB;AAC7C,SAASC,aAAa,QAAQ,4BAA4B;AAE1D,SAASC,aAAa,QAAQ,iCAAiC;AAC/D,OAAOC,YAAY,wBAAwB;AAE3C,MAAMC,kBAAkB;IACtBC,MAAMF,MAAM,CAAC,uBAAuB;IACpC,CAAC,UAAU,EAAEA,MAAM,CAAC,0BAA0B;AAChD;AAEA,MAAMG,aAAa;IACjBC,GAAG;IACHC,GAAG;IACHC,GAAG;AACL;AAUA;;CAEC,GACD,OAAO,MAAMC,WAAW,CAAC,EAAEC,OAAO,GAAG,EAAEC,SAAS,KAAK,EAAE,GAAGC,WAA0B;IAClF,MAAM,EAAEC,QAAQ,MAAM,EAAE,GAAGb;IAE3B,qBACE,KAACC;QACE,GAAGW,SAAS;QACbE,eAAef,WACbG,MAAM,CAAC,WAAW,EAClB,wBACAS,UAAUT,MAAM,CAAC,mBAAmB,EACpCG,UAAU,CAACK,KAAK,EAChBG,UAAU,aAAaV,eAAe,CAACU,MAAM;;AAIrD,EAAE"}

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

	@@ -1 +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 { HTMLAttributesWithRootRef } from '../../types';\nimport { HorizontalScroll, HorizontalScrollProps } from '../HorizontalScroll/HorizontalScroll';\nimport { RootComponent } from '../RootComponent/RootComponent';\nimport styles from './CardScroll.module.css';\n\nconst stylesSize = {\n s: 'vkuiInternalCardScroll--size-s',\n m: 'vkuiInternalCardScroll--size-m',\n l: 'vkuiInternalCardScroll--size-l',\n};\n\nexport interface CardScrollProps extends HTMLAttributesWithRootRef<HTMLDivElement> {\n /*\n При `size=false` ширина `Card` будет регулироваться контентом внутри. В остальных случаях — будет явно задана в процентах.\n /\n size?: 's' \| 'm' \| 'l' \| false;\n showArrows?: HorizontalScrollProps['showArrows'];\n noSpaces?: 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 noSpaces = false,\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 <RootComponent\n {...restProps}\n baseClassName={classNames(\n styles['CardScroll'],\n 'vkuiInternalCardScroll',\n size !== false && stylesSize[size],\n !noSpaces && styles['CardScroll--withSpaces'],\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 </RootComponent>\n );\n};\n"],"names":["React","classNames","useDOM","HorizontalScroll","RootComponent","styles","stylesSize","s","m","l","CardScroll","children","size","showArrows","noSpaces","restProps","refContainer","useRef","gapRef","window","getScrollToLeft","offset","current","containerWidth","offsetWidth","slideIndex","findIndex","el","offsetLeft","parseInt","getComputedStyle","marginRight","slide","scrollTo","getScrollToRight","Array","prototype","find","call","baseClassName","div","className","ref","span"],"~~rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","~~mappings":";AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,UAAU,QAAQ,kBAAkB;AAC7C,SAASC,MAAM,QAAQ,gBAAgB;AAEvC,SAASC,gBAAgB,QAA+B,uCAAuC;AAC/F,SAASC,aAAa,QAAQ,iCAAiC;AAC/D,OAAOC,YAAY,0BAA0B;AAE7C,MAAMC,aAAa;IACjBC,GAAG;IACHC,GAAG;IACHC,GAAG;AACL;AAWA;;CAEC,GACD,OAAO,MAAMC,aAAa,CAAC,EACzBC,QAAQ,EACRC,OAAO,GAAG,EACVC,aAAa,IAAI,EACjBC,WAAW,KAAK,EAChB,GAAGC,WACa;IAChB,MAAMC,eAAehB,MAAMiB,MAAM,CAAiB;IAClD,MAAMC,SAASlB,MAAMiB,MAAM,CAAiB;IAE5C,MAAM,EAAEE,MAAM,EAAE,GAAGjB;IAEnB,SAASkB,gBAAgBC,MAAc;QACrC,IAAI,CAACL,aAAaM,OAAO,IAAI,CAACJ,OAAOI,OAAO,EAAE;YAC5C,OAAOD;QACT;QACA,MAAME,iBAAiBP,aAAaM,OAAO,CAACE,WAAW;QACvD,MAAMC,aAAa,AAAC;eAAIT,aAAaM,OAAO,CAACX,QAAQ;SAAC,CAAmBe,SAAS,CAChF,CAACC,KACCA,GAAGC,UAAU,GACXD,GAAGH,WAAW,GACdK,SAASV,OAAQW,gBAAgB,CAACH,IAAII,WAAW,IACjDV,UACF;QAGJ,IAAII,eAAe,CAAC,GAAG;YACrB,OAAOJ;QACT;QAEA,IAAII,eAAe,GAAG;YACpB,OAAO;QACT;QAEA,MAAMO,QAAQhB,aAAaM,OAAO,CAACX,QAAQ,CAACc,WAAW;QAEvD,MAAMQ,WACJD,MAAMJ,UAAU,GAAIL,CAAAA,iBAAiBS,MAAMR,WAAW,AAAD,IAAKN,OAAOI,OAAO,CAACE,WAAW;QAEtF,IAAIS,YAAY,IAAIf,OAAOI,OAAO,CAACE,WAAW,EAAE;YAC9C,OAAO;QACT;QAEA,OAAOS;IACT;IAEA,SAASC,iBAAiBb,MAAc;QACtC,IAAI,CAACL,aAAaM,OAAO,IAAI,CAACJ,OAAOI,OAAO,EAAE;YAC5C,OAAOD;QACT;QAEA,MAAME,iBAAiBP,aAAaM,OAAO,CAACE,WAAW;QACvD,MAAMQ,QAAQG,MAAMC,SAAS,CAACC,IAAI,CAACC,IAAI,CACrCtB,aAAaM,OAAO,CAACX,QAAQ,EAC7B,CAACgB,KAAoBA,GAAGC,UAAU,GAAGD,GAAGH,WAAW,GAAGH,SAASE;QAGjE,IAAI,CAACS,OAAO;YACV,OAAOX;QACT;QAEA,OAAOW,MAAMJ,UAAU,GAAGV,OAAOI,OAAO,CAACE,WAAW;IACtD;IAEA,qBACE,KAACpB;QACE,GAAGW,SAAS;QACbwB,eAAetC,WACbI,MAAM,CAAC,aAAa,EACpB,0BACAO,SAAS,SAASN,UAAU,CAACM,KAAK,EAClC,CAACE,YAAYT,MAAM,CAAC,yBAAyB;kBAG/C,cAAA,KAACF;YACCiB,iBAAiBA;YACjBc,kBAAkBA;YAClBrB,YAAYA;sBAEZ,cAAA,MAAC2B;gBAAIC,WAAWpC,MAAM,CAAC,iBAAiB;gBAAEqC,KAAK1B;;kCAC7C,KAAC2B;wBAAKF,WAAWpC,MAAM,CAAC,kBAAkB;wBAAEqC,KAAKxB;;oBAChDP;kCACD,KAACgC;wBAAKF,WAAWpC,MAAM,CAAC,kBAAkB;;;;;;AAKpD,EAAE"}
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 { HTMLAttributesWithRootRef } from '../../types';\nimport { HorizontalScroll, HorizontalScrollProps } from '../HorizontalScroll/HorizontalScroll';\nimport { RootComponent } from '../RootComponent/RootComponent';\nimport styles from './CardScroll.module.css';\n\nconst stylesSize = {\n s: 'vkuiInternalCardScroll--size-s',\n m: 'vkuiInternalCardScroll--size-m',\n l: 'vkuiInternalCardScroll--size-l',\n};\n\nexport interface CardScrollProps extends HTMLAttributesWithRootRef<HTMLDivElement> {\n /*\n При `size=false` ширина `Card` будет регулироваться контентом внутри. В остальных случаях — будет явно задана в процентах.\n /\n size?: 's' \| 'm' \| 'l' \| false;\n showArrows?: HorizontalScrollProps['showArrows'];\n noSpaces?: 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 noSpaces = false,\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 <RootComponent\n {...restProps}\n baseClassName={classNames(\n styles['CardScroll'],\n 'vkuiInternalCardScroll',\n size !== false && stylesSize[size],\n !noSpaces && styles['CardScroll--withSpaces'],\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 </RootComponent>\n );\n};\n"],"names":["React","classNames","useDOM","HorizontalScroll","RootComponent","styles","stylesSize","s","m","l","CardScroll","children","size","showArrows","noSpaces","restProps","refContainer","useRef","gapRef","window","getScrollToLeft","offset","current","containerWidth","offsetWidth","slideIndex","findIndex","el","offsetLeft","parseInt","getComputedStyle","marginRight","slide","scrollTo","getScrollToRight","Array","prototype","find","call","baseClassName","div","className","ref","span"],"mappings":";AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,UAAU,QAAQ,kBAAkB;AAC7C,SAASC,MAAM,QAAQ,gBAAgB;AAEvC,SAASC,gBAAgB,QAA+B,uCAAuC;AAC/F,SAASC,aAAa,QAAQ,iCAAiC;AAC/D,OAAOC,YAAY,0BAA0B;AAE7C,MAAMC,aAAa;IACjBC,GAAG;IACHC,GAAG;IACHC,GAAG;AACL;AAWA;;CAEC,GACD,OAAO,MAAMC,aAAa,CAAC,EACzBC,QAAQ,EACRC,OAAO,GAAG,EACVC,aAAa,IAAI,EACjBC,WAAW,KAAK,EAChB,GAAGC,WACa;IAChB,MAAMC,eAAehB,MAAMiB,MAAM,CAAiB;IAClD,MAAMC,SAASlB,MAAMiB,MAAM,CAAiB;IAE5C,MAAM,EAAEE,MAAM,EAAE,GAAGjB;IAEnB,SAASkB,gBAAgBC,MAAc;QACrC,IAAI,CAACL,aAAaM,OAAO,IAAI,CAACJ,OAAOI,OAAO,EAAE;YAC5C,OAAOD;QACT;QACA,MAAME,iBAAiBP,aAAaM,OAAO,CAACE,WAAW;QACvD,MAAMC,aAAa,AAAC;eAAIT,aAAaM,OAAO,CAACX,QAAQ;SAAC,CAAmBe,SAAS,CAChF,CAACC,KACCA,GAAGC,UAAU,GACXD,GAAGH,WAAW,GACdK,SAASV,OAAQW,gBAAgB,CAACH,IAAII,WAAW,IACjDV,UACF;QAGJ,IAAII,eAAe,CAAC,GAAG;YACrB,OAAOJ;QACT;QAEA,IAAII,eAAe,GAAG;YACpB,OAAO;QACT;QAEA,MAAMO,QAAQhB,aAAaM,OAAO,CAACX,QAAQ,CAACc,WAAW;QAEvD,MAAMQ,WACJD,MAAMJ,UAAU,GAAIL,CAAAA,iBAAiBS,MAAMR,WAAW,AAAD,IAAKN,OAAOI,OAAO,CAACE,WAAW;QAEtF,IAAIS,YAAY,IAAIf,OAAOI,OAAO,CAACE,WAAW,EAAE;YAC9C,OAAO;QACT;QAEA,OAAOS;IACT;IAEA,SAASC,iBAAiBb,MAAc;QACtC,IAAI,CAACL,aAAaM,OAAO,IAAI,CAACJ,OAAOI,OAAO,EAAE;YAC5C,OAAOD;QACT;QAEA,MAAME,iBAAiBP,aAAaM,OAAO,CAACE,WAAW;QACvD,MAAMQ,QAAQG,MAAMC,SAAS,CAACC,IAAI,CAACC,IAAI,CACrCtB,aAAaM,OAAO,CAACX,QAAQ,EAC7B,CAACgB,KAAoBA,GAAGC,UAAU,GAAGD,GAAGH,WAAW,GAAGH,SAASE;QAGjE,IAAI,CAACS,OAAO;YACV,OAAOX;QACT;QAEA,OAAOW,MAAMJ,UAAU,GAAGV,OAAOI,OAAO,CAACE,WAAW;IACtD;IAEA,qBACE,KAACpB;QACE,GAAGW,SAAS;QACbwB,eAAetC,WACbI,MAAM,CAAC,aAAa,EACpB,0BACAO,SAAS,SAASN,UAAU,CAACM,KAAK,EAClC,CAACE,YAAYT,MAAM,CAAC,yBAAyB;kBAG/C,cAAA,KAACF;YACCiB,iBAAiBA;YACjBc,kBAAkBA;YAClBrB,YAAYA;sBAEZ,cAAA,MAAC2B;gBAAIC,WAAWpC,MAAM,CAAC,iBAAiB;gBAAEqC,KAAK1B;;kCAC7C,KAAC2B;wBAAKF,WAAWpC,MAAM,CAAC,kBAAkB;wBAAEqC,KAAKxB;;oBAChDP;kCACD,KAACgC;wBAAKF,WAAWpC,MAAM,CAAC,kBAAkB;;;;;;AAKpD,EAAE"}

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

	@@ -1 +1 @@
1	- {"version":3,"sources":["../../../../src/components/Cell/Cell.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames, noop } from '@vkontakte/vkjs';\nimport type { SwappedItemRange } from '../../hooks/useDraggableWithDomApi';\nimport { useExternRef } from '../../hooks/useExternRef';\nimport { usePlatform } from '../../hooks/usePlatform';\nimport { HasRootRef } from '../../types';\nimport { Removable, RemovableProps } from '../Removable/Removable';\nimport { SimpleCell, SimpleCellProps } from '../SimpleCell/SimpleCell';\nimport { CellCheckbox, CellCheckboxProps } from './CellCheckbox/CellCheckbox';\nimport { CellDragger } from './CellDragger/CellDragger';\nimport { DEFAULT_DRAGGABLE_LABEL } from './constants';\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?: (swappedItemRange: SwappedItemRange) => void;\n /\n Текст для кнопки перетаскивания ячейки\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 = DEFAULT_DRAGGABLE_LABEL,\n className,\n style,\n toggleButtonTestId,\n removeButtonTestId,\n ...restProps\n}: CellProps) => {\n const [dragging, setDragging] = React.useState(false);\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 dragger = draggable ? (\n <CellDragger\n elRef={rootElRef}\n className={styles['Cell__dragger']}\n disabled={disabled}\n onDragStateChange={setDragging}\n onDragFinish={onDragFinish}\n >\n {draggerLabel}\n </CellDragger>\n ) : null;\n\n let checkbox;\n if (selectable) {\n const checkboxProps: CellCheckboxProps = {\n name,\n value,\n defaultChecked,\n checked,\n disabled,\n onChange,\n };\n checkbox = <CellCheckbox className={styles['Cell__checkbox']} {...checkboxProps} />;\n }\n\n const simpleCellDisabled =\n (draggable && !selectable) \|\| (removable && !restProps.onClick) \|\| disabled;\n const hasActive = !simpleCellDisabled && !dragging;\n\n const cellClasses = classNames(\n styles['Cell'],\n dragging && styles['Cell--dragging'],\n platform === 'ios' && styles['Cell--ios'],\n removable && styles['Cell--removable'],\n Component === 'label' && styles['Cell--selectable'],\n disabled && styles['Cell--disabled'],\n );\n\n const simpleCellProps: SimpleCellProps = {\n hasActive: hasActive,\n hasHover: hasActive && !removable,\n ...restProps,\n className: styles['Cell__content'],\n Component: Component,\n before: (\n <React.Fragment>\n {draggable && platform !== 'ios' && dragger}\n {selectable && checkbox}\n {before}\n </React.Fragment>\n ),\n after: (\n <React.Fragment>\n {draggable && platform === 'ios' && dragger}\n {after}\n </React.Fragment>\n ),\n };\n\n if (restProps.onClick) {\n simpleCellProps.disabled = simpleCellDisabled;\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 toggleButtonTestId={toggleButtonTestId}\n removeButtonTestId={removeButtonTestId}\n >\n {platform === 'ios' ? (\n ({ isRemoving }) => {\n if (simpleCellProps.onClick) {\n simpleCellProps.disabled = isRemoving \|\| !simpleCellProps.disabled;\n }\n return <SimpleCell {...simpleCellProps} />;\n }\n ) : (\n <SimpleCell {...simpleCellProps} />\n )}\n </Removable>\n );\n }\n\n return (\n <div className={classNames(cellClasses, className)} style={style} ref={rootElRef}>\n <SimpleCell {...simpleCellProps} />\n </div>\n );\n};\n\nCell.Checkbox = CellCheckbox;\n"],"names":["React","classNames","noop","useExternRef","usePlatform","Removable","SimpleCell","CellCheckbox","CellDragger","DEFAULT_DRAGGABLE_LABEL","styles","Cell","mode","onRemove","removePlaceholder","onDragFinish","before","after","disabled","draggable","Component","ComponentProps","onChange","name","value","checked","defaultChecked","getRootRef","draggerLabel","className","style","toggleButtonTestId","removeButtonTestId","restProps","dragging","setDragging","useState","selectable","removable","platform","rootElRef","dragger","elRef","onDragStateChange","checkbox","checkboxProps","simpleCellDisabled","onClick","hasActive","cellClasses","simpleCellProps","hasHover","Fragment","e","current","isRemoving","div","ref","Checkbox"],"~~rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","~~mappings":"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"}
1	+ {"version":3,"sources":["../../../../src/components/Cell/Cell.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames, noop } from '@vkontakte/vkjs';\nimport type { SwappedItemRange } from '../../hooks/useDraggableWithDomApi';\nimport { useExternRef } from '../../hooks/useExternRef';\nimport { usePlatform } from '../../hooks/usePlatform';\nimport { HasRootRef } from '../../types';\nimport { Removable, RemovableProps } from '../Removable/Removable';\nimport { SimpleCell, SimpleCellProps } from '../SimpleCell/SimpleCell';\nimport { CellCheckbox, CellCheckboxProps } from './CellCheckbox/CellCheckbox';\nimport { CellDragger } from './CellDragger/CellDragger';\nimport { DEFAULT_DRAGGABLE_LABEL } from './constants';\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?: (swappedItemRange: SwappedItemRange) => void;\n /\n Текст для кнопки перетаскивания ячейки\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 = DEFAULT_DRAGGABLE_LABEL,\n className,\n style,\n toggleButtonTestId,\n removeButtonTestId,\n ...restProps\n}: CellProps) => {\n const [dragging, setDragging] = React.useState(false);\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 dragger = draggable ? (\n <CellDragger\n elRef={rootElRef}\n className={styles['Cell__dragger']}\n disabled={disabled}\n onDragStateChange={setDragging}\n onDragFinish={onDragFinish}\n >\n {draggerLabel}\n </CellDragger>\n ) : null;\n\n let checkbox;\n if (selectable) {\n const checkboxProps: CellCheckboxProps = {\n name,\n value,\n defaultChecked,\n checked,\n disabled,\n onChange,\n };\n checkbox = <CellCheckbox className={styles['Cell__checkbox']} {...checkboxProps} />;\n }\n\n const simpleCellDisabled =\n (draggable && !selectable) \|\| (removable && !restProps.onClick) \|\| disabled;\n const hasActive = !simpleCellDisabled && !dragging;\n\n const cellClasses = classNames(\n styles['Cell'],\n dragging && styles['Cell--dragging'],\n platform === 'ios' && styles['Cell--ios'],\n removable && styles['Cell--removable'],\n Component === 'label' && styles['Cell--selectable'],\n disabled && styles['Cell--disabled'],\n );\n\n const simpleCellProps: SimpleCellProps = {\n hasActive: hasActive,\n hasHover: hasActive && !removable,\n ...restProps,\n className: styles['Cell__content'],\n Component: Component,\n before: (\n <React.Fragment>\n {draggable && platform !== 'ios' && dragger}\n {selectable && checkbox}\n {before}\n </React.Fragment>\n ),\n after: (\n <React.Fragment>\n {draggable && platform === 'ios' && dragger}\n {after}\n </React.Fragment>\n ),\n };\n\n if (restProps.onClick) {\n simpleCellProps.disabled = simpleCellDisabled;\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 toggleButtonTestId={toggleButtonTestId}\n removeButtonTestId={removeButtonTestId}\n >\n {platform === 'ios' ? (\n ({ isRemoving }) => {\n if (simpleCellProps.onClick) {\n simpleCellProps.disabled = isRemoving \|\| !simpleCellProps.disabled;\n }\n return <SimpleCell {...simpleCellProps} />;\n }\n ) : (\n <SimpleCell {...simpleCellProps} />\n )}\n </Removable>\n );\n }\n\n return (\n <div className={classNames(cellClasses, className)} style={style} ref={rootElRef}>\n <SimpleCell {...simpleCellProps} />\n </div>\n );\n};\n\nCell.Checkbox = CellCheckbox;\n"],"names":["React","classNames","noop","useExternRef","usePlatform","Removable","SimpleCell","CellCheckbox","CellDragger","DEFAULT_DRAGGABLE_LABEL","styles","Cell","mode","onRemove","removePlaceholder","onDragFinish","before","after","disabled","draggable","Component","ComponentProps","onChange","name","value","checked","defaultChecked","getRootRef","draggerLabel","className","style","toggleButtonTestId","removeButtonTestId","restProps","dragging","setDragging","useState","selectable","removable","platform","rootElRef","dragger","elRef","onDragStateChange","checkbox","checkboxProps","simpleCellDisabled","onClick","hasActive","cellClasses","simpleCellProps","hasHover","Fragment","e","current","isRemoving","div","ref","Checkbox"],"mappings":";AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,UAAU,EAAEC,IAAI,QAAQ,kBAAkB;AAEnD,SAASC,YAAY,QAAQ,2BAA2B;AACxD,SAASC,WAAW,QAAQ,0BAA0B;AAEtD,SAASC,SAAS,QAAwB,yBAAyB;AACnE,SAASC,UAAU,QAAyB,2BAA2B;AACvE,SAASC,YAAY,QAA2B,8BAA8B;AAC9E,SAASC,WAAW,QAAQ,4BAA4B;AACxD,SAASC,uBAAuB,QAAQ,cAAc;AACtD,OAAOC,YAAY,oBAAoB;AAoCvC;;CAEC,GACD,OAAO,MAAMC,OAAO,CAAC,EACnBC,IAAI,EACJC,WAAWX,IAAI,EACfY,oBAAoB,SAAS,EAC7BC,YAAY,EACZC,MAAM,EACNC,KAAK,EACLC,QAAQ,EACRC,SAAS,EACTC,WAAWC,cAAc,EACzBC,QAAQ,EACRC,IAAI,EACJC,KAAK,EACLC,OAAO,EACPC,cAAc,EACdC,UAAU,EACVC,eAAenB,uBAAuB,EACtCoB,SAAS,EACTC,KAAK,EACLC,kBAAkB,EAClBC,kBAAkB,EAClB,GAAGC,WACO;IACV,MAAM,CAACC,UAAUC,YAAY,GAAGnC,MAAMoC,QAAQ,CAAC;IAC/C,MAAMC,aAAazB,SAAS;IAC5B,MAAM0B,YAAY1B,SAAS;IAC3B,MAAMQ,YAAYiB,aAAa,UAAUhB;IAEzC,MAAMkB,WAAWnC;IAEjB,MAAMoC,YAAYrC,aAAawB;IAE/B,MAAMc,UAAUtB,0BACd,KAACX;QACCkC,OAAOF;QACPX,WAAWnB,MAAM,CAAC,gBAAgB;QAClCQ,UAAUA;QACVyB,mBAAmBR;QACnBpB,cAAcA;kBAEba;SAED;IAEJ,IAAIgB;IACJ,IAAIP,YAAY;QACd,MAAMQ,gBAAmC;YACvCtB;YACAC;YACAE;YACAD;YACAP;YACAI;QACF;QACAsB,yBAAW,KAACrC;YAAasB,WAAWnB,MAAM,CAAC,iBAAiB;YAAG,GAAGmC,aAAa;;IACjF;IAEA,MAAMC,qBACJ,AAAC3B,aAAa,CAACkB,cAAgBC,aAAa,CAACL,UAAUc,OAAO,IAAK7B;IACrE,MAAM8B,YAAY,CAACF,sBAAsB,CAACZ;IAE1C,MAAMe,cAAchD,WAClBS,MAAM,CAAC,OAAO,EACdwB,YAAYxB,MAAM,CAAC,iBAAiB,EACpC6B,aAAa,SAAS7B,MAAM,CAAC,YAAY,EACzC4B,aAAa5B,MAAM,CAAC,kBAAkB,EACtCU,cAAc,WAAWV,MAAM,CAAC,mBAAmB,EACnDQ,YAAYR,MAAM,CAAC,iBAAiB;IAGtC,MAAMwC,kBAAmC;QACvCF,WAAWA;QACXG,UAAUH,aAAa,CAACV;QACxB,GAAGL,SAAS;QACZJ,WAAWnB,MAAM,CAAC,gBAAgB;QAClCU,WAAWA;QACXJ,sBACE,MAAChB,MAAMoD,QAAQ;;gBACZjC,aAAaoB,aAAa,SAASE;gBACnCJ,cAAcO;gBACd5B;;;QAGLC,qBACE,MAACjB,MAAMoD,QAAQ;;gBACZjC,aAAaoB,aAAa,SAASE;gBACnCxB;;;IAGP;IAEA,IAAIgB,UAAUc,OAAO,EAAE;QACrBG,gBAAgBhC,QAAQ,GAAG4B;IAC7B;IAEA,IAAIR,WAAW;QACb,qBACE,KAACjC;YACCwB,WAAW5B,WAAWgD,aAAapB;YACnCC,OAAOA;YACPH,YAAYa;YACZ1B,mBAAmBA;YACnBD,UAAU,CAACwC,IAAMxC,SAASwC,GAAGb,UAAUc,OAAO;YAC9CvB,oBAAoBA;YACpBC,oBAAoBA;sBAEnBO,aAAa,QACZ,CAAC,EAAEgB,UAAU,EAAE;gBACb,IAAIL,gBAAgBH,OAAO,EAAE;oBAC3BG,gBAAgBhC,QAAQ,GAAGqC,cAAc,CAACL,gBAAgBhC,QAAQ;gBACpE;gBACA,qBAAO,KAACZ;oBAAY,GAAG4C,eAAe;;YACxC,kBAEA,KAAC5C;gBAAY,GAAG4C,eAAe;;;IAIvC;IAEA,qBACE,KAACM;QAAI3B,WAAW5B,WAAWgD,aAAapB;QAAYC,OAAOA;QAAO2B,KAAKjB;kBACrE,cAAA,KAAClC;YAAY,GAAG4C,eAAe;;;AAGrC,EAAE;AAEFvC,KAAK+C,QAAQ,GAAGnD"}

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

	@@ -1 +1 @@
1	- {"version":3,"sources":["../../../../../src/components/Cell/CellCheckbox/CellCheckbox.tsx"],"sourcesContent":["import * as React from 'react';\nimport {\n Icon20CheckBoxOff,\n Icon20CheckBoxOn,\n Icon20CheckCircleOff,\n Icon20CheckCircleOn,\n Icon24CheckBoxOff,\n Icon24CheckBoxOn,\n Icon24CheckCircleOff,\n Icon24CheckCircleOn,\n} from '@vkontakte/icons';\nimport { classNames } from '@vkontakte/vkjs';\nimport { usePlatform } from '../../../hooks/usePlatform';\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\nconst CheckCircleOn = () => (\n <AdaptiveIconRenderer IconCompact={Icon20CheckCircleOn} IconRegular={Icon24CheckCircleOn} />\n);\n\nconst CheckCircleOff = () => (\n <AdaptiveIconRenderer IconCompact={Icon20CheckCircleOff} IconRegular={Icon24CheckCircleOff} />\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 === 'ios' \|\| 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' ? CheckCircleOff : CheckBoxOff;\n const IconOn = typeIcon === 'circle' ? CheckCircleOn : 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","Icon20CheckCircleOff","Icon20CheckCircleOn","Icon24CheckBoxOff","Icon24CheckBoxOn","Icon24CheckCircleOff","Icon24CheckCircleOn","classNames","usePlatform","AdaptiveIconRenderer","VisuallyHidden","styles","CheckBoxOn","IconCompact","IconRegular","CheckBoxOff","CheckCircleOn","CheckCircleOff","useTypeIcon","type","platform","CellCheckbox","getRootRef","getRef","className","style","restProps","typeIcon","IconOff","IconOn","span","ref","Component","aria-hidden"],"~~rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","~~mappings":";AAAA,YAAYA,WAAW,QAAQ;AAC/B,SACEC,iBAAiB,EACjBC,gBAAgB,EAChBC,oBAAoB,EACpBC,mBAAmB,EACnBC,iBAAiB,EACjBC,gBAAgB,EAChBC,oBAAoB,EACpBC,mBAAmB,QACd,mBAAmB;AAC1B,SAASC,UAAU,QAAQ,kBAAkB;AAC7C,SAASC,WAAW,QAAQ,6BAA6B;AAEzD,SAASC,oBAAoB,QAAQ,kDAAkD;AACvF,SAASC,cAAc,QAAQ,sCAAsC;AAErE,OAAOC,YAAY,4BAA4B;AAE/C,MAAMC,aAAa,kBACjB,KAACH;QAAqBI,aAAab;QAAkBc,aAAaV;;AAGpE,MAAMW,cAAc,kBAClB,KAACN;QAAqBI,aAAad;QAAmBe,aAAaX;;AAGrE,MAAMa,gBAAgB,kBACpB,KAACP;QAAqBI,aAAaX;QAAqBY,aAAaR;;AAGvE,MAAMW,iBAAiB,kBACrB,KAACR;QAAqBI,aAAaZ;QAAsBa,aAAaT;;AAGxE,SAASa,YAAYC,IAA4C;IAC/D,MAAMC,WAAWZ;IAEjB,IAAIW,SAAS,QAAQ;QACnB,OAAOA;IACT;IAEA,IAAIC,aAAa,SAASA,aAAa,SAAS;QAC9C,OAAO;IACT;IAEA,OAAO;AACT;AAaA,OAAO,MAAMC,eAAe,CAAC,EAC3BC,UAAU,EACVC,MAAM,EACNC,SAAS,EACTC,KAAK,EACLN,OAAO,MAAM,EACb,GAAGO,WACe;IAClB,MAAMC,WAAWT,YAAYC;IAE7B,MAAMS,UAAUD,aAAa,WAAWV,iBAAiBF;IACzD,MAAMc,SAASF,aAAa,WAAWX,gBAAgBJ;IAEvD,qBACE,MAACkB;QAAKN,WAAWjB,WAAWI,MAAM,CAAC,eAAe,EAAEa;QAAYC,OAAOA;QAAOM,KAAKT;;0BACjF,KAACZ;gBACE,GAAGgB,SAAS;gBACbM,WAAU;gBACVb,MAAK;gBACLK,WAAWb,MAAM,CAAC,sBAAsB;gBACxCW,YAAYC;;0BAEd,KAACO;gBACCN,WAAWjB,WAAWI,MAAM,CAAC,qBAAqB,EAAEA,MAAM,CAAC,0BAA0B;gBACrFsB,aAAW;0BAEX,cAAA,KAACL;;0BAEH,KAACE;gBACCN,WAAWjB,WAAWI,MAAM,CAAC,qBAAqB,EAAEA,MAAM,CAAC,yBAAyB;gBACpFsB,aAAW;0BAEX,cAAA,KAACJ;;;;AAIT,EAAE"}
1	+ {"version":3,"sources":["../../../../../src/components/Cell/CellCheckbox/CellCheckbox.tsx"],"sourcesContent":["import * as React from 'react';\nimport {\n Icon20CheckBoxOff,\n Icon20CheckBoxOn,\n Icon20CheckCircleOff,\n Icon20CheckCircleOn,\n Icon24CheckBoxOff,\n Icon24CheckBoxOn,\n Icon24CheckCircleOff,\n Icon24CheckCircleOn,\n} from '@vkontakte/icons';\nimport { classNames } from '@vkontakte/vkjs';\nimport { usePlatform } from '../../../hooks/usePlatform';\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\nconst CheckCircleOn = () => (\n <AdaptiveIconRenderer IconCompact={Icon20CheckCircleOn} IconRegular={Icon24CheckCircleOn} />\n);\n\nconst CheckCircleOff = () => (\n <AdaptiveIconRenderer IconCompact={Icon20CheckCircleOff} IconRegular={Icon24CheckCircleOff} />\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 === 'ios' \|\| 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' ? CheckCircleOff : CheckBoxOff;\n const IconOn = typeIcon === 'circle' ? CheckCircleOn : 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","Icon20CheckCircleOff","Icon20CheckCircleOn","Icon24CheckBoxOff","Icon24CheckBoxOn","Icon24CheckCircleOff","Icon24CheckCircleOn","classNames","usePlatform","AdaptiveIconRenderer","VisuallyHidden","styles","CheckBoxOn","IconCompact","IconRegular","CheckBoxOff","CheckCircleOn","CheckCircleOff","useTypeIcon","type","platform","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,oBAAoB,EACpBC,mBAAmB,EACnBC,iBAAiB,EACjBC,gBAAgB,EAChBC,oBAAoB,EACpBC,mBAAmB,QACd,mBAAmB;AAC1B,SAASC,UAAU,QAAQ,kBAAkB;AAC7C,SAASC,WAAW,QAAQ,6BAA6B;AAEzD,SAASC,oBAAoB,QAAQ,kDAAkD;AACvF,SAASC,cAAc,QAAQ,sCAAsC;AAErE,OAAOC,YAAY,4BAA4B;AAE/C,MAAMC,aAAa,kBACjB,KAACH;QAAqBI,aAAab;QAAkBc,aAAaV;;AAGpE,MAAMW,cAAc,kBAClB,KAACN;QAAqBI,aAAad;QAAmBe,aAAaX;;AAGrE,MAAMa,gBAAgB,kBACpB,KAACP;QAAqBI,aAAaX;QAAqBY,aAAaR;;AAGvE,MAAMW,iBAAiB,kBACrB,KAACR;QAAqBI,aAAaZ;QAAsBa,aAAaT;;AAGxE,SAASa,YAAYC,IAA4C;IAC/D,MAAMC,WAAWZ;IAEjB,IAAIW,SAAS,QAAQ;QACnB,OAAOA;IACT;IAEA,IAAIC,aAAa,SAASA,aAAa,SAAS;QAC9C,OAAO;IACT;IAEA,OAAO;AACT;AAaA,OAAO,MAAMC,eAAe,CAAC,EAC3BC,UAAU,EACVC,MAAM,EACNC,SAAS,EACTC,KAAK,EACLN,OAAO,MAAM,EACb,GAAGO,WACe;IAClB,MAAMC,WAAWT,YAAYC;IAE7B,MAAMS,UAAUD,aAAa,WAAWV,iBAAiBF;IACzD,MAAMc,SAASF,aAAa,WAAWX,gBAAgBJ;IAEvD,qBACE,MAACkB;QAAKN,WAAWjB,WAAWI,MAAM,CAAC,eAAe,EAAEa;QAAYC,OAAOA;QAAOM,KAAKT;;0BACjF,KAACZ;gBACE,GAAGgB,SAAS;gBACbM,WAAU;gBACVb,MAAK;gBACLK,WAAWb,MAAM,CAAC,sBAAsB;gBACxCW,YAAYC;;0BAEd,KAACO;gBACCN,WAAWjB,WAAWI,MAAM,CAAC,qBAAqB,EAAEA,MAAM,CAAC,0BAA0B;gBACrFsB,aAAW;0BAEX,cAAA,KAACL;;0BAEH,KAACE;gBACCN,WAAWjB,WAAWI,MAAM,CAAC,qBAAqB,EAAEA,MAAM,CAAC,yBAAyB;gBACpFsB,aAAW;0BAEX,cAAA,KAACJ;;;;AAIT,EAAE"}