@vchasno/ui-kit 0.4.98 → 0.4.100

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.
package/CHANGELOG.md CHANGED
@@ -5,7 +5,26 @@ All notable changes to this project will be documented in this file.
5
5
  The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/),
6
6
  and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0.html).
7
7
 
8
- ## [Unreleased]
8
+ ## [0.4.100] - 2026-04-28
9
+
10
+ ### Added
11
+
12
+ - **DateRangePicker** — add `onConfirm?: (dates: [Date | null, Date | null]) => void` callback — fired when user confirms selection (Save button)
13
+ - **DateRangePicker** — add `onCancel?: () => void` callback — fired when user cancels (Cancel button, outside click, Escape key)
14
+
15
+ ### Changed
16
+
17
+ - **DateRangePicker** — outside-month days are now fully hidden (`visibility: hidden`, `pointer-events: none`) instead of being shown with muted styling; removes the previous MutationObserver-based day-number restore workaround
18
+ - **DateRangePicker** — calendar opens to the relevant month on open: month before `endDate` if set, otherwise `startDate` month, otherwise current month (`openToDate` + `subMonths`)
19
+ - **DateRangePicker** — calendar view resets correctly after clear or preset change via internal `calendarKey` counter
20
+
21
+ ## [0.4.99] - 2026-04-21
22
+
23
+ ### Changed
24
+
25
+ - **DateRangePicker** — extend `DateRangePickerProps` from `ReactDatePickerProps<true>` (with `Omit` of props controlled internally: `selectsRange`, `selectsMultiple`, `startDate`, `endDate`, `onChange`, `value`, `open`, `onInputClick`, `onClickOutside`, `monthsShown`, `shouldCloseOnSelect`, `renderCustomHeader`, `children`)
26
+ - Consumers now inherit the full `react-datepicker` prop surface (e.g. `fixedHeight`, `showPopperArrow`, `filterDate`, `excludeDates`, `calendarStartDay`, etc.)
27
+ - `dateFormat` now accepts `string | string[]` (matches base type); display formatting uses the first format when an array is passed
9
28
 
10
29
  ## [0.4.98] - 2026-04-20
11
30
 
@@ -0,0 +1,38 @@
1
+ import React from 'react';
2
+ import { ReactDatePickerProps } from 'react-datepicker';
3
+ import Select from '../../Select/Select.js';
4
+ import { LoadingFeedback, WithHint, ErrorFeedback, DataQa, HideEmptyMeta, WithPulseAnimation } from '../../types.js';
5
+
6
+ type ControlledReactDatePickerProps = 'selectsRange' | 'selectsMultiple' | 'startDate' | 'endDate' | 'onChange' | 'value' | 'open' | 'onInputClick' | 'onClickOutside' | 'monthsShown' | 'shouldCloseOnSelect' | 'renderCustomHeader' | 'children';
7
+ interface DateRangePickerProps extends Omit<ReactDatePickerProps<true>, ControlledReactDatePickerProps>, Partial<LoadingFeedback & WithHint & ErrorFeedback & DataQa & HideEmptyMeta & WithPulseAnimation> {
8
+ startDate: Date | null;
9
+ endDate: Date | null;
10
+ onChange: (dates: [Date | null, Date | null]) => void;
11
+ label?: string;
12
+ wide?: boolean;
13
+ cancelLabel?: string;
14
+ saveLabel?: string;
15
+ presets?: {
16
+ label: string;
17
+ range: [Date, Date];
18
+ }[];
19
+ presetPlaceholder?: string;
20
+ presetSelectProps?: Omit<React.ComponentProps<typeof Select>, 'options' | 'onChange' | 'value'>;
21
+ /** викликається при скасуванні вибору */
22
+ onCancel?: () => void;
23
+ /** викликається при підтвердженні вибору */
24
+ onConfirm?: (dates: [Date | null, Date | null]) => void;
25
+ disabled?: ReactDatePickerProps<true>['disabled'];
26
+ required?: ReactDatePickerProps<true>['required'];
27
+ isClearable?: ReactDatePickerProps<true>['isClearable'];
28
+ minDate?: ReactDatePickerProps<true>['minDate'];
29
+ maxDate?: ReactDatePickerProps<true>['maxDate'];
30
+ dateFormat?: ReactDatePickerProps<true>['dateFormat'];
31
+ className?: ReactDatePickerProps<true>['className'];
32
+ popperClassName?: ReactDatePickerProps<true>['popperClassName'];
33
+ portalId?: ReactDatePickerProps<true>['portalId'];
34
+ locale?: ReactDatePickerProps<true>['locale'];
35
+ }
36
+ declare const DateRangePicker: React.FC<DateRangePickerProps>;
37
+
38
+ export { type DateRangePickerProps, DateRangePicker as default };
@@ -0,0 +1,2 @@
1
+ import e from"react";import a from"react-datepicker";import t from"classnames";import{format as r,subMonths as n}from"date-fns";import{uk as l}from"date-fns/locale/uk";import c from"../../../icons/arrowLeft.js";import o from"../../../icons/arrowRight.js";import s from"../../../icons/calendar.js";import i from"../../../icons/clear.js";import p from"../../InputMeta/InputMeta.js";import m from"../../LabelText/LabelText.js";import u from"../../Select/Select.js";import"../../Select/SelectCreatable.js";import"react-select/async";import"react-select";import d from"../../Spinner/Spinner.js";import{pickerReducer as h,initialState as k}from"./DateRangePicker.reducer.js";let v=()=>e.createElement("span",{className:"vchasno-ui-date-range-picker__custom-close-icon"},i),b=({startDate:i,endDate:b,onChange:y,label:_,disabled:g,required:f,loading:E,hint:N,error:C,className:D,dateFormat:j="dd/MM/yyyy",dataQa:w,hideEmptyMeta:S=!1,wide:L=!1,pulse:x,isClearable:R=!1,minDate:A,maxDate:M,popperClassName:T,portalId:I,cancelLabel:P="Скасувати",saveLabel:q="Зберегти",locale:H=l,presets:O=[],presetPlaceholder:$="Обрати період",presetSelectProps:K,onCancel:z,onConfirm:B,...F})=>{var G,J;let[Q,U]=e.useReducer(h,k),{isOpen:V,tempStartDate:W,tempEndDate:X,selectedPreset:Y,calendarKey:Z}=Q,ee=()=>{z?.(),U({type:"cancel",startDate:i,endDate:b})},ea=(()=>{if(!i&&!b)return"";let e=Array.isArray(j)?j[0]:j;if(!e)return"";let a=i?r(i,e):"",t=b?r(b,e):"";return a&&t?`${a} - ${t}`:a||""})(),et=!!i||!!b;return e.createElement("label",{onClick:e=>e.preventDefault(),"data-qa":w,className:t("vchasno-ui-date-picker","vchasno-ui-date-range-picker",{"--loading":E,"--required":f,"--disabled":g,"--error":C,"--wide":L,"--not-empty":et,"--is-label":!!_},D),onKeyDown:e=>{"Escape"===e.key&&V&&ee()}},e.createElement("span",{className:t("vchasno-ui-date-range-picker__wrapper",{"vchasno-ui-pulse-animation":x&&!g})},_&&e.createElement(m,null,_),e.createElement(a,{key:Z,openToDate:(G=V?W:i,(J=V?X:b)?n(J,1):G||new Date),fixedHeight:!0,locale:H,disabled:g,placeholderText:"ДД/ММ/РРРР - ДД/ММ/РРРР",showPopperArrow:!1,className:t("vchasno-ui-date-range-picker__picker","vchasno-ui-date-picker__picker"),popperClassName:t("vchasno-ui-date-range-picker-popper",T),selectsRange:!0,startDate:V?W:i,endDate:V?X:b,onChange:e=>{let[a,t]=e;U({type:"tempChange",start:a,end:t})},monthsShown:2,shouldCloseOnSelect:!1,open:V,onInputClick:()=>{g||U({type:"open",startDate:i,endDate:b})},onClickOutside:ee,enableTabLoop:!1,minDate:A,maxDate:M,portalId:I,value:ea,renderCustomHeader:({monthDate:a,decreaseMonth:t,increaseMonth:n,prevMonthButtonDisabled:l,nextMonthButtonDisabled:s})=>e.createElement("div",{className:"vchasno-ui-date-range-picker__header"},e.createElement("button",{type:"button",className:"vchasno-ui-date-range-picker__nav-btn",onClick:t,disabled:l},e.createElement(c,null)),e.createElement("span",{className:"vchasno-ui-date-range-picker__month-title"},r(a,"LLLL, yyyy",{locale:"string"==typeof H?void 0:H})),e.createElement("button",{type:"button",className:"vchasno-ui-date-range-picker__nav-btn",onClick:n,disabled:s},e.createElement(o,null))),...F},e.createElement("div",{className:"vchasno-ui-date-range-picker__presets"},O.length>0&&e.createElement(u,{className:"vchasno-ui-date-range-picker__preset-select",isClearable:!0,options:O.map(e=>({label:e.label,value:e.label})),value:Y,placeholder:$,onChange:e=>{let a=Array.isArray(e)?null:e;if(!a){U({type:"reset"});return}let t=O.find(e=>e.label===a.value);t&&U({type:"presetSelect",option:a,start:t.range[0],end:t.range[1]})},hideEmptyMeta:!0,wide:!0,...K})),e.createElement("div",{className:"vchasno-ui-date-range-picker__actions"},e.createElement("button",{type:"button",className:"vchasno-ui-date-range-picker__cancel-btn",onClick:ee},P),e.createElement("button",{type:"button",className:"vchasno-ui-date-range-picker__save-btn",onClick:()=>{y([W,X]),B?.([W,X]),U({type:"close"})}},q))),E?e.createElement(d,{className:"vchasno-ui-date-range-picker__spinner"}):e.createElement(s,{className:"vchasno-ui-date-range-picker__custom-calendar-icon"}),R&&et&&!g&&e.createElement("button",{type:"button","aria-label":"Очистити",className:"vchasno-ui-date-range-picker__clear-btn",onClick:()=>{y([null,null]),U({type:"reset"})}},e.createElement(v,null))),!S||C||N?e.createElement(p,{hint:N,error:C}):null)};b.displayName="DateRangePicker";export{b as default};
2
+ //# sourceMappingURL=DateRangePicker.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"DateRangePicker.js","sources":["../../../../src/components/Datepicker/DateRangePicker/DateRangePicker.tsx"],"sourcesContent":["import React from 'react';\nimport type { ReactDatePickerProps } from 'react-datepicker';\nimport ReactDatePicker from 'react-datepicker';\n\nimport cn from 'classnames';\nimport { format, subMonths } from 'date-fns';\nimport { uk } from 'date-fns/locale/uk';\n\nimport ArrowLeftIcon from '../../../icons/arrowLeft';\nimport ArrowRightIcon from '../../../icons/arrowRight';\nimport CalendarIcon from '../../../icons/calendar';\nimport clearRawSvg from '../../../icons/clear';\nimport InputMeta from '../../InputMeta';\nimport LabelText from '../../LabelText';\nimport Select from '../../Select';\nimport type { SelectOption } from '../../Select';\nimport Spinner from '../../Spinner';\nimport type {\n DataQa,\n ErrorFeedback,\n HideEmptyMeta,\n LoadingFeedback,\n WithHint,\n WithPulseAnimation,\n} from '../../types';\nimport { initialState, pickerReducer } from './DateRangePicker.reducer';\n\nimport '../DatePicker.global.css';\nimport './DateRangePicker.global.css';\n\nconst CloseSvg = () => (\n <span className=\"vchasno-ui-date-range-picker__custom-close-icon\">{clearRawSvg}</span>\n);\n\ntype ControlledReactDatePickerProps =\n | 'selectsRange'\n | 'selectsMultiple'\n | 'startDate'\n | 'endDate'\n | 'onChange'\n | 'value'\n | 'open'\n | 'onInputClick'\n | 'onClickOutside'\n | 'monthsShown'\n | 'shouldCloseOnSelect'\n | 'renderCustomHeader'\n | 'children';\n\nexport interface DateRangePickerProps\n extends Omit<ReactDatePickerProps<true>, ControlledReactDatePickerProps>,\n Partial<\n LoadingFeedback & WithHint & ErrorFeedback & DataQa & HideEmptyMeta & WithPulseAnimation\n > {\n // Required controlled props (range-mode contract)\n startDate: Date | null;\n endDate: Date | null;\n onChange: (dates: [Date | null, Date | null]) => void;\n\n // UI-kit additions\n label?: string;\n wide?: boolean;\n cancelLabel?: string;\n saveLabel?: string;\n presets?: { label: string; range: [Date, Date] }[];\n presetPlaceholder?: string;\n presetSelectProps?: Omit<React.ComponentProps<typeof Select>, 'options' | 'onChange' | 'value'>;\n\n /** викликається при скасуванні вибору */\n onCancel?: () => void;\n /** викликається при підтвердженні вибору */\n onConfirm?: (dates: [Date | null, Date | null]) => void;\n\n // Explicit re-declarations for Storybook Controls visibility\n // (types inherited from ReactDatePickerProps<true> via indexed access — zero drift)\n disabled?: ReactDatePickerProps<true>['disabled'];\n required?: ReactDatePickerProps<true>['required'];\n isClearable?: ReactDatePickerProps<true>['isClearable'];\n minDate?: ReactDatePickerProps<true>['minDate'];\n maxDate?: ReactDatePickerProps<true>['maxDate'];\n dateFormat?: ReactDatePickerProps<true>['dateFormat'];\n className?: ReactDatePickerProps<true>['className'];\n popperClassName?: ReactDatePickerProps<true>['popperClassName'];\n portalId?: ReactDatePickerProps<true>['portalId'];\n locale?: ReactDatePickerProps<true>['locale'];\n}\n\nconst DateRangePicker: React.FC<DateRangePickerProps> = ({\n startDate,\n endDate,\n onChange,\n label,\n disabled,\n required,\n loading,\n hint,\n error,\n className,\n dateFormat = 'dd/MM/yyyy',\n dataQa,\n hideEmptyMeta = false,\n wide = false,\n pulse,\n isClearable = false,\n minDate,\n maxDate,\n popperClassName,\n portalId,\n cancelLabel = 'Скасувати',\n saveLabel = 'Зберегти',\n locale = uk,\n presets = [],\n presetPlaceholder = 'Обрати період',\n presetSelectProps,\n onCancel,\n onConfirm,\n ...props\n}) => {\n const [state, dispatch] = React.useReducer(pickerReducer, initialState);\n const { isOpen, tempStartDate, tempEndDate, selectedPreset, calendarKey } = state;\n\n const resolveOpenToDate = (start: Date | null, end: Date | null): Date => {\n if (end) return subMonths(end, 1);\n if (start) return start;\n return new Date();\n };\n\n const handleOpen = () => {\n if (disabled) return;\n dispatch({ type: 'open', startDate, endDate });\n };\n\n const handleTempChange = (dates: [Date | null, Date | null]) => {\n const [start, end] = dates;\n dispatch({ type: 'tempChange', start, end });\n };\n\n const handleSave = () => {\n onChange([tempStartDate, tempEndDate]);\n onConfirm?.([tempStartDate, tempEndDate]);\n dispatch({ type: 'close' });\n };\n\n const handleCancel = () => {\n onCancel?.();\n dispatch({ type: 'cancel', startDate, endDate });\n };\n\n const handleClear = () => {\n onChange([null, null]);\n dispatch({ type: 'reset' });\n };\n\n const handlePresetChange = (newValue: SelectOption | readonly SelectOption[] | null) => {\n const option = Array.isArray(newValue) ? null : (newValue as SelectOption | null);\n if (!option) {\n dispatch({ type: 'reset' });\n return;\n }\n const preset = presets.find((p) => p.label === option.value);\n if (preset) {\n dispatch({\n type: 'presetSelect',\n option,\n start: preset.range[0],\n end: preset.range[1],\n });\n }\n };\n\n const handleKeyDown = (e: React.KeyboardEvent) => {\n if (e.key === 'Escape' && isOpen) {\n handleCancel();\n }\n };\n\n const formatDisplayValue = (): string => {\n if (!startDate && !endDate) return '';\n const displayFormat = Array.isArray(dateFormat) ? dateFormat[0] : dateFormat;\n if (!displayFormat) return '';\n const startStr = startDate ? format(startDate, displayFormat) : '';\n const endStr = endDate ? format(endDate, displayFormat) : '';\n if (startStr && endStr) return `${startStr} - ${endStr}`;\n if (startStr) return startStr;\n return '';\n };\n\n const displayValue = formatDisplayValue();\n const valueExists = !!startDate || !!endDate;\n\n return (\n <label\n onClick={(e) => e.preventDefault()}\n data-qa={dataQa}\n className={cn(\n 'vchasno-ui-date-picker',\n 'vchasno-ui-date-range-picker',\n {\n '--loading': loading,\n '--required': required,\n '--disabled': disabled,\n '--error': error,\n '--wide': wide,\n '--not-empty': valueExists,\n '--is-label': !!label,\n },\n className,\n )}\n onKeyDown={handleKeyDown}\n >\n <span\n className={cn('vchasno-ui-date-range-picker__wrapper', {\n 'vchasno-ui-pulse-animation': pulse && !disabled,\n })}\n >\n {label && <LabelText>{label}</LabelText>}\n <ReactDatePicker\n key={calendarKey}\n openToDate={resolveOpenToDate(\n isOpen ? tempStartDate : startDate,\n isOpen ? tempEndDate : endDate,\n )}\n fixedHeight\n locale={locale}\n disabled={disabled}\n placeholderText=\"ДД/ММ/РРРР - ДД/ММ/РРРР\"\n showPopperArrow={false}\n className={cn(\n 'vchasno-ui-date-range-picker__picker',\n 'vchasno-ui-date-picker__picker',\n )}\n popperClassName={cn('vchasno-ui-date-range-picker-popper', popperClassName)}\n selectsRange\n startDate={isOpen ? tempStartDate : startDate}\n endDate={isOpen ? tempEndDate : endDate}\n onChange={handleTempChange}\n monthsShown={2}\n shouldCloseOnSelect={false}\n open={isOpen}\n onInputClick={handleOpen}\n onClickOutside={handleCancel}\n enableTabLoop={false}\n minDate={minDate}\n maxDate={maxDate}\n portalId={portalId}\n value={displayValue}\n renderCustomHeader={({\n monthDate,\n decreaseMonth,\n increaseMonth,\n prevMonthButtonDisabled,\n nextMonthButtonDisabled,\n }) => (\n <div className=\"vchasno-ui-date-range-picker__header\">\n <button\n type=\"button\"\n className=\"vchasno-ui-date-range-picker__nav-btn\"\n onClick={decreaseMonth}\n disabled={prevMonthButtonDisabled}\n >\n <ArrowLeftIcon />\n </button>\n <span className=\"vchasno-ui-date-range-picker__month-title\">\n {format(monthDate, 'LLLL, yyyy', {\n locale: typeof locale === 'string' ? undefined : locale,\n })}\n </span>\n <button\n type=\"button\"\n className=\"vchasno-ui-date-range-picker__nav-btn\"\n onClick={increaseMonth}\n disabled={nextMonthButtonDisabled}\n >\n <ArrowRightIcon />\n </button>\n </div>\n )}\n {...props}\n >\n <div className=\"vchasno-ui-date-range-picker__presets\">\n {presets.length > 0 && (\n <Select\n className=\"vchasno-ui-date-range-picker__preset-select\"\n isClearable\n options={presets.map((p) => ({\n label: p.label,\n value: p.label,\n }))}\n value={selectedPreset}\n placeholder={presetPlaceholder}\n onChange={handlePresetChange}\n hideEmptyMeta\n wide\n {...presetSelectProps}\n />\n )}\n </div>\n\n <div className=\"vchasno-ui-date-range-picker__actions\">\n <button\n type=\"button\"\n className=\"vchasno-ui-date-range-picker__cancel-btn\"\n onClick={handleCancel}\n >\n {cancelLabel}\n </button>\n <button\n type=\"button\"\n className=\"vchasno-ui-date-range-picker__save-btn\"\n onClick={handleSave}\n >\n {saveLabel}\n </button>\n </div>\n </ReactDatePicker>\n {loading ? (\n <Spinner className=\"vchasno-ui-date-range-picker__spinner\" />\n ) : (\n <CalendarIcon className=\"vchasno-ui-date-range-picker__custom-calendar-icon\" />\n )}\n {isClearable && valueExists && !disabled && (\n <button\n type=\"button\"\n aria-label=\"Очистити\"\n className=\"vchasno-ui-date-range-picker__clear-btn\"\n onClick={handleClear}\n >\n <CloseSvg />\n </button>\n )}\n </span>\n {hideEmptyMeta && !error && !hint ? null : <InputMeta hint={hint} error={error} />}\n </label>\n );\n};\n\nDateRangePicker.displayName = 'DateRangePicker';\n\nexport default DateRangePicker;\n"],"names":["CloseSvg","React","span","className","clearRawSvg","DateRangePicker","startDate","endDate","onChange","label","disabled","required","loading","hint","error","dateFormat","dataQa","hideEmptyMeta","wide","pulse","isClearable","minDate","maxDate","popperClassName","portalId","cancelLabel","saveLabel","locale","uk","presets","presetPlaceholder","presetSelectProps","onCancel","onConfirm","props","start","end","state","dispatch","useReducer","pickerReducer","initialState","isOpen","tempStartDate","tempEndDate","selectedPreset","calendarKey","handleCancel","type","displayValue","formatDisplayValue","displayFormat","Array","isArray","startStr","format","endStr","valueExists","onClick","e","preventDefault","data-qa","cn","onKeyDown","key","createElement","LabelText","ReactDatePicker","openToDate","subMonths","Date","fixedHeight","placeholderText","showPopperArrow","selectsRange","dates","monthsShown","shouldCloseOnSelect","open","onInputClick","onClickOutside","enableTabLoop","value","renderCustomHeader","monthDate","decreaseMonth","increaseMonth","prevMonthButtonDisabled","nextMonthButtonDisabled","div","button","ArrowLeftIcon","undefined","ArrowRightIcon","length","Select","options","map","p","placeholder","newValue","option","preset","find","range","Spinner","CalendarIcon","aria-label","InputMeta","displayName"],"mappings":"6pBA8BA,IAAMA,EAAW,IACbC,EAACC,aAAAA,CAAAA,OAAAA,CAAKC,UAAU,iDAAmDC,EAAAA,GAwDjEC,EAAkD,CAAC,CACrDC,UAAAA,CAAS,CACTC,QAAAA,CAAO,CACPC,SAAAA,CAAQ,CACRC,MAAAA,CAAK,CACLC,SAAAA,CAAQ,CACRC,SAAAA,CAAQ,CACRC,QAAAA,CAAO,CACPC,KAAAA,CAAI,CACJC,MAAAA,CAAK,CACLX,UAAAA,CAAS,CACTY,WAAAA,EAAa,YAAY,CACzBC,OAAAA,CAAM,CACNC,cAAAA,EAAgB,CAAA,CAAK,CACrBC,KAAAA,EAAO,CAAA,CAAK,CACZC,MAAAA,CAAK,CACLC,YAAAA,EAAc,CAAA,CAAK,CACnBC,QAAAA,CAAO,CACPC,QAAAA,CAAO,CACPC,gBAAAA,CAAe,CACfC,SAAAA,CAAQ,CACRC,YAAAA,EAAc,WAAW,CACzBC,UAAAA,EAAY,UAAU,CACtBC,OAAAA,EAASC,CAAE,CACXC,QAAAA,EAAU,EAAE,CACZC,kBAAAA,EAAoB,eAAe,CACnCC,kBAAAA,CAAiB,CACjBC,SAAAA,CAAQ,CACRC,UAAAA,CAAS,CACT,GAAGC,EACN,QAI8BC,EAAoBC,EAH/C,GAAM,CAACC,EAAOC,EAAS,CAAGrC,EAAMsC,UAAU,CAACC,EAAeC,GACpD,CAAEC,OAAAA,CAAM,CAAEC,cAAAA,CAAa,CAAEC,YAAAA,CAAW,CAAEC,eAAAA,CAAc,CAAEC,YAAAA,CAAW,CAAE,CAAGT,EAwBtEU,GAAe,KACjBf,MACAM,EAAS,CAAEU,KAAM,SAAU1C,UAAAA,EAAWC,QAAAA,CAAQ,EAClD,EAyCM0C,GAAeC,AAXM,CAAA,KACvB,GAAI,CAAC5C,GAAa,CAACC,EAAS,MAAO,GACnC,IAAM4C,EAAgBC,MAAMC,OAAO,CAACtC,GAAcA,CAAU,CAAC,EAAE,CAAGA,EAClE,GAAI,CAACoC,EAAe,MAAO,GAC3B,IAAMG,EAAWhD,EAAYiD,EAAOjD,EAAW6C,GAAiB,GAC1DK,EAASjD,EAAUgD,EAAOhD,EAAS4C,GAAiB,UAC1D,AAAIG,GAAYE,EAAe,GAAGF,EAAS,GAAG,EAAEE,EAAQ,CAAA,CACpDF,GACG,EACX,CAAA,IAGMG,GAAc,CAAC,CAACnD,GAAa,CAAC,CAACC,EAErC,OACIN,EAACQ,aAAAA,CAAAA,QAAAA,CACGiD,QAAS,AAACC,GAAMA,EAAEC,cAAc,GAChCC,UAAS7C,EACTb,UAAW2D,EACP,yBACA,+BACA,CACI,YAAalD,EACb,aAAcD,EACd,aAAcD,EACd,UAAWI,EACX,SAAUI,EACV,cAAeuC,GACf,aAAc,CAAC,CAAChD,CAEpBN,EAAAA,GAEJ4D,UAtCc,AAACJ,IACL,WAAVA,EAAEK,GAAG,EAAiBtB,GACtBK,IAER,GAoCQ9C,EAACC,aAAAA,CAAAA,OAAAA,CACGC,UAAW2D,EAAG,wCAAyC,CACnD,6BAA8B3C,GAAS,CAACT,CAC5C,IAECD,GAASR,EAAAgE,aAAA,CAACC,EAAWzD,KAAAA,GACtBR,EAACkE,aAAAA,CAAAA,EAAAA,CACGH,IAAKlB,EACLsB,UAAAA,EAjGWjC,EAkGPO,EAASC,EAAgBrC,EAjGzC,CAD2C8B,EAmG3BM,EAASE,EAAcrC,GAlGvB8D,EAAUjC,EAAK,GAC3BD,GACG,IAAImC,MAkGCC,YAAAA,CAAAA,EACA5C,OAAQA,EACRjB,SAAUA,EACV8D,gBAAgB,0BAChBC,gBAAiB,CAAA,EACjBtE,UAAW2D,EACP,uCACA,kCAEJvC,gBAAiBuC,EAAG,sCAAuCvC,GAC3DmD,aAAAA,CAAAA,EACApE,UAAWoC,EAASC,EAAgBrC,EACpCC,QAASmC,EAASE,EAAcrC,EAChCC,SAvGS,AAACmE,IACtB,GAAM,CAACxC,EAAOC,EAAI,CAAGuC,EACrBrC,EAAS,CAAEU,KAAM,aAAcb,MAAAA,EAAOC,IAAAA,CAAI,EAC9C,EAqGgBwC,YAAa,EACbC,oBAAqB,CAAA,EACrBC,KAAMpC,EACNqC,aAhHG,KACXrE,GACJ4B,EAAS,CAAEU,KAAM,OAAQ1C,UAAAA,EAAWC,QAAAA,CAAQ,EAChD,EA8GgByE,eAAgBjC,GAChBkC,cAAe,CAAA,EACf5D,QAASA,EACTC,QAASA,EACTE,SAAUA,EACV0D,MAAOjC,GACPkC,mBAAoB,CAAC,CACjBC,UAAAA,CAAS,CACTC,cAAAA,CAAa,CACbC,cAAAA,CAAa,CACbC,wBAAAA,CAAuB,CACvBC,wBAAAA,CAAuB,CAC1B,GACGvF,EAACwF,aAAAA,CAAAA,MAAAA,CAAItF,UAAU,wCACXF,EAACyF,aAAAA,CAAAA,SAAAA,CACG1C,KAAK,SACL7C,UAAU,wCACVuD,QAAS2B,EACT3E,SAAU6E,CAEV,EAAAtF,EAAAgE,aAAA,CAAC0B,SAEL1F,EAACC,aAAAA,CAAAA,OAAAA,CAAKC,UAAU,2CACXoD,EAAAA,EAAO6B,EAAW,aAAc,CAC7BzD,OAAQ,AAAkB,UAAlB,OAAOA,EAAsBiE,KAAAA,EAAYjE,CACrD,IAEJ1B,EAACyF,aAAAA,CAAAA,SAAAA,CACG1C,KAAK,SACL7C,UAAU,wCACVuD,QAAS4B,EACT5E,SAAU8E,GAEVvF,EAAC4F,aAAAA,CAAAA,EAAAA,QAIZ,GAAG3D,CAAAA,EAEJjC,EAACwF,aAAAA,CAAAA,MAAAA,CAAItF,UAAU,yCACV0B,EAAQiE,MAAM,CAAG,GACd7F,EAAC8F,aAAAA,CAAAA,EAAAA,CACG5F,UAAU,8CACViB,YAAAA,CAAAA,EACA4E,QAASnE,EAAQoE,GAAG,CAAC,AAACC,GAAO,CAAA,CACzBzF,MAAOyF,EAAEzF,KAAK,CACdyE,MAAOgB,EAAEzF,KAAAA,IAEbyE,MAAOrC,EACPsD,YAAarE,EACbtB,SAzID,AAAC4F,IACxB,IAAMC,EAASjD,MAAMC,OAAO,CAAC+C,GAAY,KAAQA,EACjD,GAAI,CAACC,EAAQ,CACT/D,EAAS,CAAEU,KAAM,OAAQ,GACzB,MACJ,CACA,IAAMsD,EAASzE,EAAQ0E,IAAI,CAAC,AAACL,GAAMA,EAAEzF,KAAK,GAAK4F,EAAOnB,KAAK,EACvDoB,GACAhE,EAAS,CACLU,KAAM,eACNqD,OAAAA,EACAlE,MAAOmE,EAAOE,KAAK,CAAC,EAAE,CACtBpE,IAAKkE,EAAOE,KAAK,CAAC,EAAE,AACxB,EAER,EA2H4BvF,cAAAA,CAAAA,EACAC,KAAAA,CAAAA,EACC,GAAGa,CAAAA,IAKhB9B,EAACwF,aAAAA,CAAAA,MAAAA,CAAItF,UAAU,yCACXF,EAACyF,aAAAA,CAAAA,SAAAA,CACG1C,KAAK,SACL7C,UAAU,2CACVuD,QAASX,EAERtB,EAAAA,GAELxB,EAACyF,aAAAA,CAAAA,SAAAA,CACG1C,KAAK,SACL7C,UAAU,yCACVuD,QA5KL,KACflD,EAAS,CAACmC,EAAeC,EAAY,EACrCX,IAAY,CAACU,EAAeC,EAAY,EACxCN,EAAS,CAAEU,KAAM,OAAQ,EAC7B,CA0KyBtB,EAAAA,KAIZd,EACGX,EAACwG,aAAAA,CAAAA,EAAAA,CAAQtG,UAAU,0CAEnBF,EAACyG,aAAAA,CAAAA,EAAAA,CAAavG,UAAU,uDAE3BiB,GAAeqC,IAAe,CAAC/C,GAC5BT,EAACyF,aAAAA,CAAAA,SAAAA,CACG1C,KAAK,SACL2D,aAAW,WACXxG,UAAU,0CACVuD,QAjLA,KAChBlD,EAAS,CAAC,KAAM,KAAK,EACrB8B,EAAS,CAAEU,KAAM,OAAQ,EAC7B,CAgLoB,EAAA/C,EAAAgE,aAAA,CAACjE,UAIZiB,CAAAA,GAAkBH,GAAUD,EAAcZ,EAAC2G,aAAAA,CAAAA,EAAAA,CAAU/F,KAAMA,EAAMC,MAAOA,IAArC,KAGhD,CAEAT,CAAAA,EAAgBwG,WAAW,CAAG"}
@@ -0,0 +1,2 @@
1
+ let e={isOpen:!1,tempStartDate:null,tempEndDate:null,selectedPreset:null,calendarKey:0};function t(e,t){switch(t.type){case"open":return{...e,isOpen:!0,tempStartDate:t.startDate,tempEndDate:t.endDate};case"close":return{...e,isOpen:!1};case"tempChange":return{...e,tempStartDate:t.start,tempEndDate:t.end,selectedPreset:null};case"cancel":return{...e,isOpen:!1,tempStartDate:t.startDate,tempEndDate:t.endDate,selectedPreset:null};case"reset":return{...e,tempStartDate:null,tempEndDate:null,selectedPreset:null,calendarKey:e.calendarKey+1};case"presetSelect":return{...e,selectedPreset:t.option,tempStartDate:t.start,tempEndDate:t.end,calendarKey:e.calendarKey+1}}}export{e as initialState,t as pickerReducer};
2
+ //# sourceMappingURL=DateRangePicker.reducer.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"DateRangePicker.reducer.js","sources":["../../../../src/components/Datepicker/DateRangePicker/DateRangePicker.reducer.ts"],"sourcesContent":["import type { SelectOption } from '../../Select';\n\nexport type PickerState = {\n isOpen: boolean;\n tempStartDate: Date | null;\n tempEndDate: Date | null;\n selectedPreset: SelectOption | null;\n calendarKey: number;\n};\n\nexport type PickerAction =\n | { type: 'open'; startDate: Date | null; endDate: Date | null }\n | { type: 'close' }\n | { type: 'tempChange'; start: Date | null; end: Date | null }\n | { type: 'cancel'; startDate: Date | null; endDate: Date | null }\n | { type: 'reset' }\n | { type: 'presetSelect'; option: SelectOption; start: Date; end: Date };\n\nexport const initialState: PickerState = {\n isOpen: false,\n tempStartDate: null,\n tempEndDate: null,\n selectedPreset: null,\n calendarKey: 0,\n};\n\nexport function pickerReducer(state: PickerState, action: PickerAction): PickerState {\n switch (action.type) {\n case 'open':\n return {\n ...state,\n isOpen: true,\n tempStartDate: action.startDate,\n tempEndDate: action.endDate,\n };\n case 'close':\n return { ...state, isOpen: false };\n case 'tempChange':\n return {\n ...state,\n tempStartDate: action.start,\n tempEndDate: action.end,\n selectedPreset: null,\n };\n case 'cancel':\n return {\n ...state,\n isOpen: false,\n tempStartDate: action.startDate,\n tempEndDate: action.endDate,\n selectedPreset: null,\n };\n case 'reset':\n return {\n ...state,\n tempStartDate: null,\n tempEndDate: null,\n selectedPreset: null,\n calendarKey: state.calendarKey + 1,\n };\n case 'presetSelect':\n return {\n ...state,\n selectedPreset: action.option,\n tempStartDate: action.start,\n tempEndDate: action.end,\n calendarKey: state.calendarKey + 1,\n };\n }\n}\n"],"names":["initialState","isOpen","tempStartDate","tempEndDate","selectedPreset","calendarKey","pickerReducer","state","action","type","startDate","endDate","start","end","option"],"mappings":"IAkBaA,EAA4B,CACrCC,OAAQ,CAAA,EACRC,cAAe,KACfC,YAAa,KACbC,eAAgB,KAChBC,YAAa,CACjB,EAEO,SAASC,EAAcC,CAAkB,CAAEC,CAAoB,EAClE,OAAQA,EAAOC,IAAI,EACf,IAAK,OACD,MAAO,CACH,GAAGF,CAAK,CACRN,OAAQ,CAAA,EACRC,cAAeM,EAAOE,SAAS,CAC/BP,YAAaK,EAAOG,OAAAA,AACxB,CACJ,KAAK,QACD,MAAO,CAAE,GAAGJ,CAAK,CAAEN,OAAQ,CAAA,CAAM,CACrC,KAAK,aACD,MAAO,CACH,GAAGM,CAAK,CACRL,cAAeM,EAAOI,KAAK,CAC3BT,YAAaK,EAAOK,GAAG,CACvBT,eAAgB,IACpB,CACJ,KAAK,SACD,MAAO,CACH,GAAGG,CAAK,CACRN,OAAQ,CAAA,EACRC,cAAeM,EAAOE,SAAS,CAC/BP,YAAaK,EAAOG,OAAO,CAC3BP,eAAgB,IACpB,CACJ,KAAK,QACD,MAAO,CACH,GAAGG,CAAK,CACRL,cAAe,KACfC,YAAa,KACbC,eAAgB,KAChBC,YAAaE,EAAMF,WAAW,CAAG,CACrC,CACJ,KAAK,eACD,MAAO,CACH,GAAGE,CAAK,CACRH,eAAgBI,EAAOM,MAAM,CAC7BZ,cAAeM,EAAOI,KAAK,CAC3BT,YAAaK,EAAOK,GAAG,CACvBR,YAAaE,EAAMF,WAAW,CAAG,CACrC,CACR,CACJ"}
@@ -2,4 +2,4 @@
2
2
  --vchasno-ui-color-surface-brand-default,var(--vchasno-ui-btn-primary-bg)
3
3
  );border:1px solid transparent;border-radius:var(--vchasno-ui-border-radius-md);color:var(--vchasno-ui-btn-primary-color);cursor:pointer;font-size:var(--vchasno-ui-btn-font-size);font-weight:500;min-height:40px;padding:0 24px;transition:background-color var(--vchasno-ui-transition-duration-sec,.3s),color var(--vchasno-ui-transition-duration-sec,.3s)}.vchasno-ui-date-range-picker__save-btn:hover{background-color:var(
4
4
  --vchasno-ui-color-surface-brand-default-hover,var(--vchasno-ui-btn-primary-hover-bg)
5
- )}.vchasno-ui-date-range-picker-popper .react-datepicker__navigation{display:none}.vchasno-ui-date-range-picker-popper .vchasno-ui-date-range-picker__header{align-items:center;display:flex;justify-content:space-between;padding:8px 0 15px}.vchasno-ui-date-range-picker__month-title{color:var(--vchasno-ui-input-font-color);font-size:14px;font-weight:500;text-transform:capitalize}.vchasno-ui-date-range-picker__nav-btn{align-items:center;background:transparent;border:none;border-radius:var(--vchasno-ui-border-radius-md);color:var(--vchasno-ui-calendar-default-icon-color);cursor:pointer;display:flex;height:30px;justify-content:center;width:30px}.vchasno-ui-date-range-picker__nav-btn:hover{background-color:var(--vchasno-ui-color-gray-100)}.vchasno-ui-date-range-picker__nav-btn:disabled{cursor:not-allowed;opacity:.3}.vchasno-ui-date-range-picker-popper .react-datepicker__day--in-range:not(.react-datepicker__day--range-start,.react-datepicker__day--range-end){background-color:var(--vchasno-ui-color-utility-blue-50);border-radius:0;color:var(--vchasno-ui-input-font-color);font-weight:400}.vchasno-ui-date-range-picker-popper .react-datepicker__day--range-end,.vchasno-ui-date-range-picker-popper .react-datepicker__day--range-start{background-color:var(--vchasno-ui-calendar-select-color);color:var(--vchasno-ui-color-gray-0);font-weight:700}.vchasno-ui-date-range-picker-popper .react-datepicker__day--range-start.react-datepicker__day--range-end{border-radius:var(--vchasno-ui-border-radius-md)}.vchasno-ui-date-range-picker-popper .react-datepicker__day--in-selecting-range:not(.react-datepicker__day--in-range){background-color:var(--vchasno-ui-calendar-select-color)}.react-datepicker__day.react-datepicker__day--in-range.react-datepicker__day--today.react-datepicker__day--outside-month,.vchasno-ui-date-range-picker-popper .react-datepicker__day--today.react-datepicker__day--outside-month:empty{border:none}.vchasno-ui-date-range-picker-popper .react-datepicker__day--in-range.react-datepicker__day--today{border-radius:var(--vchasno-ui-border-radius-md)}.react-datepicker__day.react-datepicker__day--in-range.react-datepicker__day--outside-month{background-color:transparent;color:var(--vchasno-ui-color-surface-disabled-1)}.vchasno-ui-flex-box{align-content:flex-start;display:flex;flex-direction:row;gap:10px;max-width:100%}.vchasno-ui-text{color:var(--vchasno-ui-text-primary-color,#252d3d)}.vchasno-ui-text.--ellipsis{display:inline-block;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.vchasno-ui-text.--secondary{color:var(--vchasno-ui-text-secondary-color,#5a6a81)}.vchasno-ui-text.--success{color:var(--vchasno-ui-text-success-color,#1cb800)}.vchasno-ui-text.--warning{color:var(--vchasno-ui-text-warning-color,#ff9c01)}.vchasno-ui-text.--danger{color:var(--vchasno-ui-text-error-color,#f54f4f)}.vchasno-ui-text.--code{background:hsla(0,0%,59%,.1);border:1px solid var(--vchasno-ui-input-border-color-default);border-radius:var(--vchasno-ui-border-radius-sm);font-size:85%;margin:0 .2em;padding:.2em .4em .1em}.vchasno-ui-text.--inherit{font-size:inherit}.vchasno-ui-text.--like-link,.vchasno-ui-text.--link{color:var(--vchasno-ui-text-link-color);cursor:pointer}.vchasno-ui-text.--link{text-decoration-line:underline}.vchasno-ui-text.--normal{font-size:1rem;line-height:1.1rem}.vchasno-ui-text.--small{font-size:.8rem;line-height:.9rem}.vchasno-ui-text.--large{font-size:1.2rem;line-height:1.3rem}.vchasno-ui-text.--required:after{color:var(--vchasno-ui-text-error-color,#f54f4f);content:"*";position:relative;right:-2px;top:-3px}strong.vchasno-ui-text{font-weight:700}.vchasno-ui-FollowUs{min-height:24px;min-width:24px}.vchasno-ui-FollowUs__label{font-size:14px}.vchasno-ui-FollowUs__link{display:block;flex-grow:0;flex-shrink:0;height:24px;transition:filter .3s;width:24px}.vchasno-ui-FollowUs__link img{display:block}.vchasno-ui-FollowUs__link:hover{filter:brightness(80%)}.vchasno-ui-input{display:inline-flex;flex-direction:column;gap:5px;max-width:100%}.vchasno-ui-input input::placeholder{color:var(--vchasno-ui-input-placeholder-color);font-size:var(--vchasno-ui-input-font-size);line-height:calc(var(--vchasno-ui-input-font-size)*1.2);transition:color var(--vchasno-ui-transition-duration-sec,.3s)}.vchasno-ui-input .vchasno-ui-mask-input,.vchasno-ui-input .vchasno-ui-text-input{flex-grow:1}.vchasno-ui-input.--wide{width:100%}.vchasno-ui-input__wrapper{align-items:center;background-color:var(--vchasno-ui-input-bg-color);border:1px solid var(--vchasno-ui-input-border-color-default);border-radius:var(--vchasno-ui-border-radius-md);box-sizing:border-box;display:flex;min-height:50px;outline:3px solid transparent;padding-left:16px;padding-right:33px;position:relative;transition:border var(--vchasno-ui-transition-duration-sec,.3s)}.vchasno-ui-input__wrapper>input{max-width:100%}.vchasno-ui-input__wrapper__start-element{align-items:center;display:flex;flex-grow:0;flex-shrink:0;font-size:var(--vchasno-ui-input-font-size,14px);line-height:var(--vchasno-ui-input-font-size,14px);margin-right:5px}.vchasno-ui-input__feedback{display:block;height:18px;position:absolute;right:10px;top:50%;transform:translateY(-50%);width:18px}.vchasno-ui-input__clear-btn{cursor:pointer;display:block;height:18px;transition:transform var(--vchasno-ui-transition-duration-sec,.3s);width:18px}.vchasno-ui-input__clear-btn svg{height:100%;transition:color var(--vchasno-ui-transition-duration-sec,.3s);width:100%}.vchasno-ui-input__clear-btn:hover svg{color:var(--vchasno-ui-input-color-error)}.vchasno-ui-input .vchasno-ui-spinner__svg__circle,.vchasno-ui-input .vchasno-ui-spinner__svg__path{stroke:var(--vchasno-ui-input-border-color-focused)}.vchasno-ui-input.--disabled .vchasno-ui-input__wrapper{background-color:var(--vchasno-ui-input-bg-color-disabled);color:var(--vchasno-ui-input-font-color-disabled)}.vchasno-ui-input:not(.--disabled) .vchasno-ui-input__wrapper:hover{cursor:text}.vchasno-ui-input:not(.--disabled):hover .vchasno-ui-input__wrapper{border-color:var(--vchasno-ui-input-border-color-focused)}.vchasno-ui-input:not(.--disabled):focus-within .vchasno-ui-input__wrapper{border-color:var(--vchasno-ui-input-border-color-focused);outline-color:var(--vchasno-ui-input-outline-color-focused)}.vchasno-ui-input:not(.--disabled).--error .vchasno-ui-input__wrapper{border-color:var(--vchasno-ui-input-color-error);outline-color:var(--vchasno-ui-input-outline-color-error)}.vchasno-ui-input.--disabled,.vchasno-ui-input.--disabled *{cursor:not-allowed;opacity:.8}.vchasno-ui-input.--is-label input::placeholder{visibility:hidden}.vchasno-ui-input.--is-label:focus-within input::placeholder{visibility:visible}.vchasno-ui-mask-input{font-size:var(--vchasno-ui-input-font-size);line-height:var(--vchasno-ui-input-font-size);position:relative}.vchasno-ui-mask-input::placeholder{color:var(--vchasno-ui-input-placeholder-color);font-size:var(--vchasno-ui-input-font-size);line-height:calc(var(--vchasno-ui-input-font-size)*1.2);transition:color var(--vchasno-ui-transition-duration-sec,.3s)}.szh-menu-button{box-sizing:border-box}.vchasno-ui-menu-button{align-items:center;border:none;border-radius:var(--vchasno-ui-border-radius-sm);cursor:pointer;display:flex;justify-content:center;padding:5px;transition:background-color var(--vchasno-ui-transition-duration-sec)}.vchasno-ui-menu-button:hover{background-color:var(--vchasno-ui-menu-button-bg)}.szh-menu__item{align-items:center;border-radius:var(--vchasno-ui-border-radius-sm);cursor:pointer;display:flex;padding:10px 12px;position:relative;transition:background-color var(--vchasno-ui-transition-duration-sec)}.szh-menu__item+.szh-menu__item{margin-top:4px}.szh-menu__item:focus{outline:none}.szh-menu__item--hover{background-color:var(--vchasno-ui-menu-item-hover-bg)}.szh-menu__item--focusable{background-color:inherit;cursor:default}.szh-menu__item--disabled{color:#aaa;cursor:default}.vchasno-ui-menu-submenu.szh-menu__submenu>.szh-menu__item{padding:10px 12px}.vchasno-ui-menu-submenu .szh-menu__item--submenu:after{display:none}.vchasno-ui-menu-submenu-label-container{width:100%}.szh-menu{background-color:#fff;border:1px solid var(--vchasno-ui-input-border-color-default);border-radius:var(--vchasno-ui-border-radius-md);box-sizing:border-box;color:#212529;list-style:none;margin:0;min-width:10rem;padding:8px;user-select:none;width:max-content;z-index:100}.szh-menu:focus{outline:none}.szh-menu__arrow{background-color:#fff;border-color:rgba(0,0,0,.1) transparent transparent rgba(0,0,0,.1);border-style:solid;border-width:1px;box-sizing:border-box;height:.75rem;width:.75rem;z-index:-1}.szh-menu__arrow--dir-left{right:-.375rem;transform:translateY(-50%) rotate(135deg)}.szh-menu__arrow--dir-right{left:-.375rem;transform:translateY(-50%) rotate(-45deg)}.szh-menu__arrow--dir-top{bottom:-.375rem;transform:translateX(-50%) rotate(-135deg)}.szh-menu__arrow--dir-bottom{top:-.375rem;transform:translateX(-50%) rotate(45deg)}.szh-menu__group{box-sizing:border-box}.szh-menu__radio-group{list-style:none;margin:0;padding:0}.szh-menu__divider{background-color:rgba(0,0,0,.12);height:1px;margin:.5rem 0}.szh-menu-container--itemTransition .szh-menu__item{transition-duration:.15s;transition-property:background-color,color;transition-timing-function:ease-in-out}.szh-menu__item--type-radio{padding-left:2.2rem}.szh-menu__item--type-radio:before{content:"○";font-size:.8rem;left:.8rem;position:absolute;top:.55rem}.szh-menu__item--type-radio.szh-menu__item--checked:before{content:"●"}.szh-menu__item--type-checkbox{padding-left:2.2rem}.szh-menu__item--type-checkbox:before{left:.8rem;position:absolute}.szh-menu__item--type-checkbox.szh-menu__item--checked:before{content:"✔"}.szh-menu__submenu>.szh-menu__item{padding-right:2.5rem}.szh-menu__submenu>.szh-menu__item:after{content:"❯";position:absolute;right:1rem}.szh-menu__header{color:#888;font-size:.8rem;padding:.2rem 1.5rem;text-transform:uppercase}.vchasno-ui-MobileAppLinks{min-width:100px}.vchasno-ui-MobileAppLinks__label{font-size:14px}.vchasno-ui-MobileAppLinks__link{aspect-ratio:300/89;display:block;max-width:150px;transition:filter .3s}.vchasno-ui-MobileAppLinks__link img{display:block}.vchasno-ui-MobileAppLinks__link:hover{filter:brightness(80%)}.vchasno-ui-pagination{align-items:center;display:inline-flex;flex-shrink:0;font-size:14px;gap:10px}.vchasno-ui-pagination__item{align-items:center;background-color:#fff;border:1px solid transparent;border-radius:var(--vchasno-ui-border-radius-md);cursor:pointer;display:flex;flex-grow:0;flex-shrink:0;height:var(--vchasno-ui-pagination-size);justify-content:center;min-width:var(--vchasno-ui-pagination-size);outline:0;text-align:center;transition:background-color var(--vchasno-ui-transition-duration-sec,.3s),border var(--vchasno-ui-transition-duration-sec,.3s);user-select:none;vertical-align:middle}.vchasno-ui-pagination__item-arrow{align-items:center;display:inline-flex;justify-content:center}.vchasno-ui-pagination__item:not(.vchasno-ui-pagination__item-disabled):focus-visible{border-color:var(--vchasno-ui-pagination-border-color);box-shadow:0 0 0 2px var(--vchasno-ui-pagination-focus-shadow-color);z-index:1}.vchasno-ui-pagination__item:not(.vchasno-ui-pagination__item-disabled):hover{background-color:var(--vchasno-ui-pagination-hover-bg-color)}.vchasno-ui-pagination__item-active{border-color:var(--vchasno-ui-pagination-border-color)}.vchasno-ui-pagination__item-disabled{cursor:not-allowed;opacity:.8}.vchasno-ui-pagination__item-hidden{display:none}.--text-start{text-align:start}.--text-center{text-align:center}.--text-end{text-align:end}.--text-justify{text-align:justify}.vchasno-ui-paragraph{color:var(--vchasno-ui-text-primary-color)}.vchasno-ui-paragraph.--ellipsis{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.vchasno-ui-paragraph.--ellipsis-line{-webkit-box-orient:vertical;display:-webkit-box;overflow:hidden;text-overflow:ellipsis;white-space:unset}.vchasno-ui-paragraph.--text-center{text-align:center}.vchasno-ui-paragraph.--text-left{text-align:left}.vchasno-ui-paragraph.--text-right{text-align:right}.vchasno-ui-paragraph.--text-justify{text-align:justify}.vchasno-ui-ProjectsPopover{background-color:#fff;border-radius:var(--vchasno-ui-border-radius-md);box-sizing:border-box;display:inline-block;max-width:calc(100vw - 32px);padding:24px 16px 0;width:440px}.vchasno-ui-ProjectsPopover__content{display:flex;flex-direction:column;gap:32px}.vchasno-ui-ProjectsPopover__products{box-sizing:border-box;display:flex;flex-wrap:wrap;gap:10px;width:calc(100% + 32px)}.vchasno-ui-ProjectsPopover a:hover{color:unset;text-decoration:none}.vchasno-ui-ProjectsPopover--border{border:1px solid #e2e9f3}.vchasno-ui-ProjectsPopover__title{font-size:16px;font-style:normal;font-weight:500;line-height:18px;width:100%}.vchasno-ui-ProjectsPopover__box{align-items:center;aspect-ratio:198/80;border:1px solid #e2e9f3;border-radius:var(--vchasno-ui-border-radius-md);box-sizing:border-box;color:var(--vchasno-ui-text-primary-color);display:inline-flex;gap:8px;padding:20px;text-decoration:none;transition:background-color .3s;width:198px}.vchasno-ui-ProjectsPopover__box>svg{max-width:90%}.vchasno-ui-ProjectsPopover__box__icon{border-radius:var(--vchasno-ui-border-radius-full);box-sizing:border-box;flex-shrink:0;height:40px;width:40px}.vchasno-ui-ProjectsPopover__box:hover{background-color:#f3f8fb;cursor:pointer}.vchasno-ui-ProjectsPopover__box__title{font-size:14px;font-style:normal;font-weight:400;line-height:26px}.vchasno-ui-ProjectsPopover .vchasno-ui-ProjectsPopover__footer{align-items:center;background:#e0eeff;border-bottom-left-radius:var(--vchasno-ui-border-radius-md);border-bottom-right-radius:var(--vchasno-ui-border-radius-md);color:#6e809a;display:flex;font-size:12px;font-weight:400;justify-content:center;margin:0 -16px;min-height:42px}.vchasno-ui-ProjectsPopover .vchasno-ui-ProjectsPopover__footer>a{color:#0890de;text-decoration:none}.vchasno-ui-ProjectsPopover__tooltip-hint{text-align:center}@media screen and (width <= 480px){.vchasno-ui-ProjectsPopover{width:330px}.vchasno-ui-ProjectsPopover__box{aspect-ratio:1/1;flex-direction:column;justify-content:center;padding:10px;width:calc(50% - 20px)}}.vchasno-ui-PulseDot{background-color:var(--vchasno-ui-pulse-dot-color);border-radius:var(--vchasno-ui-border-radius-full);height:var(--vchasno-ui-pulse-dot-size);position:relative;width:var(--vchasno-ui-pulse-dot-size)}.vchasno-ui-PulseDot:after,.vchasno-ui-PulseDot:before{background:inherit;border-radius:var(--vchasno-ui-border-radius-full);content:"";height:100%;pointer-events:none;position:absolute;width:100%}.vchasno-ui-PulseDot:before{animation:pulse 2s ease-out infinite}.vchasno-ui-PulseDot:after{animation:pulse 2s ease-out 1s infinite}@keyframes pulse{to{opacity:0;transform:scale(2)}}:root{--toastify-color-light:var(--vchasno-ui-snackbar-color-light);--toastify-color-dark:var(--vchasno-ui-snackbar-color-dark);--toastify-color-info:var(--vchasno-ui-snackbar-color-info);--toastify-color-success:var(--vchasno-ui-snackbar-color-success);--toastify-color-warning:var(--vchasno-ui-snackbar-color-warning);--toastify-color-error:var(--vchasno-ui-snackbar-color-error);--toastify-color-transparent:var(--vchasno-ui-snackbar-color-transparent);--toastify-icon-color-info:var(--vchasno-ui-snackbar-icon-color-info);--toastify-icon-color-success:var(--vchasno-ui-snackbar-icon-color-success);--toastify-icon-color-warning:var(--vchasno-ui-snackbar-icon-color-warning);--toastify-icon-color-error:var(--vchasno-ui-snackbar-icon-color-error);--toastify-toast-width:var(--vchasno-ui-snackbar-toast-width);--toastify-toast-offset:var(--vchasno-ui-snackbar-toast-offset);--toastify-toast-top:var(--vchasno-ui-snackbar-toast-top);--toastify-toast-right:var(--vchasno-ui-snackbar-toast-right);--toastify-toast-left:var(--vchasno-ui-snackbar-toast-left);--toastify-toast-bottom:var(--vchasno-ui-snackbar-toast-bottom);--toastify-toast-background:var(--vchasno-ui-snackbar-toast-background);--toastify-toast-min-height:var(--vchasno-ui-snackbar-toast-min-height);--toastify-toast-max-height:var(--vchasno-ui-snackbar-toast-max-height);--toastify-toast-bd-radius:var(--vchasno-ui-snackbar-toast-bd-radius);--toastify-font-family:var(--vchasno-ui-snackbar-font-family);--toastify-z-index:var(--vchasno-ui-snackbar-z-index);--toastify-text-color-light:var(--vchasno-ui-snackbar-text-color-light);--toastify-text-color-dark:var(--vchasno-ui-snackbar-text-color-dark);--toastify-text-color-info:var(--vchasno-ui-snackbar-text-color-info);--toastify-text-color-success:var(--vchasno-ui-snackbar-text-color-success);--toastify-text-color-warning:var(--vchasno-ui-snackbar-text-color-warning);--toastify-text-color-error:var(--vchasno-ui-snackbar-text-color-error);--toastify-spinner-color:var(--vchasno-ui-snackbar-spinner-color);--toastify-spinner-color-empty-area:var(--vchasno-ui-snackbar-spinner-color-empty-area);--toastify-color-progress-light:var(--vchasno-ui-snackbar-color-progress-light);--toastify-color-progress-dark:var(--vchasno-ui-snackbar-color-progress-dark);--toastify-color-progress-info:var(--vchasno-ui-snackbar-color-progress-info);--toastify-color-progress-success:var(--vchasno-ui-snackbar-color-progress-success);--toastify-color-progress-warning:var(--vchasno-ui-snackbar-color-progress-warning);--toastify-color-progress-error:var(--vchasno-ui-snackbar-color-progress-error);--toastify-color-progress-bgo:var(--vchasno-ui-snackbar-color-progress-bgo)}.Toastify__toast-container{box-sizing:border-box;color:#fff;padding:4px;position:fixed;transform:translateZ(var(--toastify-z-index));width:var(--toastify-toast-width);z-index:var(--toastify-z-index)}.Toastify__toast-container--top-left{left:1em;top:1em}.Toastify__toast-container--top-center{left:50%;top:1em;transform:translateX(-50%)}.Toastify__toast-container--top-right{right:1em;top:1em}.Toastify__toast-container--bottom-left{bottom:1em;left:1em}.Toastify__toast-container--bottom-center{bottom:1em;left:50%;transform:translateX(-50%)}.Toastify__toast-container--bottom-right{bottom:1em;right:1em}@media only screen and (width <= 480px){.Toastify__toast-container{left:0;margin:0;padding:0;width:100vw}.Toastify__toast-container--top-center,.Toastify__toast-container--top-left,.Toastify__toast-container--top-right{top:0;transform:translateX(0)}.Toastify__toast-container--bottom-center,.Toastify__toast-container--bottom-left,.Toastify__toast-container--bottom-right{bottom:0;transform:translateX(0)}.Toastify__toast-container--rtl{left:auto;right:0}}.Toastify__toast{-ms-flex-pack:justify;border-radius:var(--vchasno-ui-border-radius-sm);box-shadow:0 1px 10px 0 rgba(0,0,0,.1),0 2px 15px 0 rgb(0 0 0/5%);box-sizing:border-box;cursor:default;direction:ltr;display:flex;font-family:var(--toastify-font-family);justify-content:space-between;margin-bottom:1rem;max-height:var(--toastify-toast-max-height);min-height:var(--toastify-toast-min-height);overflow:hidden;padding:8px;position:relative;z-index:0}.Toastify__toast--rtl{direction:rtl}.Toastify__toast--close-on-click{cursor:pointer}.Toastify__toast-body{-ms-flex-align:center;align-items:center;display:flex;flex:1 1 auto;margin:auto 0;padding:6px}.Toastify__toast-body>div:last-child{flex:1;word-break:break-word}.Toastify__toast-icon{-ms-flex-negative:0;-webkit-margin-end:10px;display:flex;flex-shrink:0;margin-inline-end:10px;width:20px}.Toastify--animate{animation-duration:.7s;animation-fill-mode:both}.Toastify--animate-icon{animation-duration:.3s;animation-fill-mode:both}@media only screen and (width <= 480px){.Toastify__toast{border-radius:var(--vchasno-ui-border-radius-none);margin-bottom:0}}.Toastify__toast-theme--dark{background:var(--toastify-color-dark);color:var(--toastify-text-color-dark)}.Toastify__toast-theme--colored.Toastify__toast--default,.Toastify__toast-theme--light{background:var(--toastify-color-light);color:var(--toastify-text-color-light)}.Toastify__toast-theme--colored.Toastify__toast--info{background:var(--toastify-color-info);color:var(--toastify-text-color-info)}.Toastify__toast-theme--colored.Toastify__toast--success{background:var(--toastify-color-success);color:var(--toastify-text-color-success)}.Toastify__toast-theme--colored.Toastify__toast--warning{background:var(--toastify-color-warning);color:var(--toastify-text-color-warning)}.Toastify__toast-theme--colored.Toastify__toast--error{background:var(--toastify-color-error);color:var(--toastify-text-color-error)}.Toastify__progress-bar-theme--light{background:var(--toastify-color-progress-light)}.Toastify__progress-bar-theme--dark{background:var(--toastify-color-progress-dark)}.Toastify__progress-bar--info{background:var(--toastify-color-progress-info)}.Toastify__progress-bar--success{background:var(--toastify-color-progress-success)}.Toastify__progress-bar--warning{background:var(--toastify-color-progress-warning)}.Toastify__progress-bar--error{background:var(--toastify-color-progress-error)}.Toastify__progress-bar-theme--colored.Toastify__progress-bar--error,.Toastify__progress-bar-theme--colored.Toastify__progress-bar--info,.Toastify__progress-bar-theme--colored.Toastify__progress-bar--success,.Toastify__progress-bar-theme--colored.Toastify__progress-bar--warning{background:var(--toastify-color-transparent)}.Toastify__close-button{-ms-flex-item-align:start;align-self:flex-start;background:transparent;border:none;color:#fff;cursor:pointer;opacity:.7;outline:none;padding:0;transition:.3s ease}.Toastify__close-button--light{color:#000;opacity:.3}.Toastify__close-button>svg{fill:currentcolor;height:16px;width:14px}.Toastify__close-button:focus,.Toastify__close-button:hover{opacity:1}@keyframes Toastify__trackProgress{0%{transform:scaleX(1)}to{transform:scaleX(0)}}.Toastify__progress-bar{bottom:0;height:5px;left:0;opacity:.7;position:absolute;transform-origin:left;width:100%;z-index:var(--toastify-z-index)}.Toastify__progress-bar--animated{animation:Toastify__trackProgress linear 1 forwards}.Toastify__progress-bar--controlled{transition:transform .2s}.Toastify__progress-bar--rtl{left:auto;right:0;transform-origin:right}.Toastify__spinner{animation:Toastify__spin .65s linear infinite;border:2px solid;border-color:var(--toastify-spinner-color-empty-area);border-radius:var(--vchasno-ui-border-radius-full);border-right-color:var(--toastify-spinner-color);box-sizing:border-box;height:20px;width:20px}@keyframes Toastify__bounceInRight{0%,60%,75%,90%,to{animation-timing-function:cubic-bezier(.215,.61,.355,1)}0%{opacity:0;transform:translate3d(3000px,0,0)}60%{opacity:1;transform:translate3d(-25px,0,0)}75%{transform:translate3d(10px,0,0)}90%{transform:translate3d(-5px,0,0)}to{transform:none}}@keyframes Toastify__bounceOutRight{20%{opacity:1;transform:translate3d(-20px,0,0)}to{opacity:0;transform:translate3d(2000px,0,0)}}@keyframes Toastify__bounceInLeft{0%,60%,75%,90%,to{animation-timing-function:cubic-bezier(.215,.61,.355,1)}0%{opacity:0;transform:translate3d(-3000px,0,0)}60%{opacity:1;transform:translate3d(25px,0,0)}75%{transform:translate3d(-10px,0,0)}90%{transform:translate3d(5px,0,0)}to{transform:none}}@keyframes Toastify__bounceOutLeft{20%{opacity:1;transform:translate3d(20px,0,0)}to{opacity:0;transform:translate3d(-2000px,0,0)}}@keyframes Toastify__bounceInUp{0%,60%,75%,90%,to{animation-timing-function:cubic-bezier(.215,.61,.355,1)}0%{opacity:0;transform:translate3d(0,3000px,0)}60%{opacity:1;transform:translate3d(0,-20px,0)}75%{transform:translate3d(0,10px,0)}90%{transform:translate3d(0,-5px,0)}to{transform:translateZ(0)}}@keyframes Toastify__bounceOutUp{20%{transform:translate3d(0,-10px,0)}40%,45%{opacity:1;transform:translate3d(0,20px,0)}to{opacity:0;transform:translate3d(0,-2000px,0)}}@keyframes Toastify__bounceInDown{0%,60%,75%,90%,to{animation-timing-function:cubic-bezier(.215,.61,.355,1)}0%{opacity:0;transform:translate3d(0,-3000px,0)}60%{opacity:1;transform:translate3d(0,25px,0)}75%{transform:translate3d(0,-10px,0)}90%{transform:translate3d(0,5px,0)}to{transform:none}}@keyframes Toastify__bounceOutDown{20%{transform:translate3d(0,10px,0)}40%,45%{opacity:1;transform:translate3d(0,-20px,0)}to{opacity:0;transform:translate3d(0,2000px,0)}}.Toastify__bounce-enter--bottom-left,.Toastify__bounce-enter--top-left{animation-name:Toastify__bounceInLeft}.Toastify__bounce-enter--bottom-right,.Toastify__bounce-enter--top-right{animation-name:Toastify__bounceInRight}.Toastify__bounce-enter--top-center{animation-name:Toastify__bounceInDown}.Toastify__bounce-enter--bottom-center{animation-name:Toastify__bounceInUp}.Toastify__bounce-exit--bottom-left,.Toastify__bounce-exit--top-left{animation-name:Toastify__bounceOutLeft}.Toastify__bounce-exit--bottom-right,.Toastify__bounce-exit--top-right{animation-name:Toastify__bounceOutRight}.Toastify__bounce-exit--top-center{animation-name:Toastify__bounceOutUp}.Toastify__bounce-exit--bottom-center{animation-name:Toastify__bounceOutDown}@keyframes Toastify__zoomIn{0%{opacity:0;transform:scale3d(.3,.3,.3)}50%{opacity:1}}@keyframes Toastify__zoomOut{0%{opacity:1}50%{opacity:0;transform:scale3d(.3,.3,.3)}to{opacity:0}}.Toastify__zoom-enter{animation-name:Toastify__zoomIn}.Toastify__zoom-exit{animation-name:Toastify__zoomOut}@keyframes Toastify__flipIn{0%{animation-timing-function:ease-in;opacity:0;transform:perspective(400px) rotateX(90deg)}40%{animation-timing-function:ease-in;transform:perspective(400px) rotateX(-20deg)}60%{opacity:1;transform:perspective(400px) rotateX(10deg)}80%{transform:perspective(400px) rotateX(-5deg)}to{transform:perspective(400px)}}@keyframes Toastify__flipOut{0%{transform:perspective(400px)}30%{opacity:1;transform:perspective(400px) rotateX(-20deg)}to{opacity:0;transform:perspective(400px) rotateX(90deg)}}.Toastify__flip-enter{animation-name:Toastify__flipIn}.Toastify__flip-exit{animation-name:Toastify__flipOut}@keyframes Toastify__slideInRight{0%{transform:translate3d(110%,0,0);visibility:visible}to{transform:translateZ(0)}}@keyframes Toastify__slideInLeft{0%{transform:translate3d(-110%,0,0);visibility:visible}to{transform:translateZ(0)}}@keyframes Toastify__slideInUp{0%{transform:translate3d(0,110%,0);visibility:visible}to{transform:translateZ(0)}}@keyframes Toastify__slideInDown{0%{transform:translate3d(0,-110%,0);visibility:visible}to{transform:translateZ(0)}}@keyframes Toastify__slideOutRight{0%{transform:translateZ(0)}to{transform:translate3d(110%,0,0);visibility:hidden}}@keyframes Toastify__slideOutLeft{0%{transform:translateZ(0)}to{transform:translate3d(-110%,0,0);visibility:hidden}}@keyframes Toastify__slideOutDown{0%{transform:translateZ(0)}to{transform:translate3d(0,500px,0);visibility:hidden}}@keyframes Toastify__slideOutUp{0%{transform:translateZ(0)}to{transform:translate3d(0,-500px,0);visibility:hidden}}.Toastify__slide-enter--bottom-left,.Toastify__slide-enter--top-left{animation-name:Toastify__slideInLeft}.Toastify__slide-enter--bottom-right,.Toastify__slide-enter--top-right{animation-name:Toastify__slideInRight}.Toastify__slide-enter--top-center{animation-name:Toastify__slideInDown}.Toastify__slide-enter--bottom-center{animation-name:Toastify__slideInUp}.Toastify__slide-exit--bottom-left,.Toastify__slide-exit--top-left{animation-name:Toastify__slideOutLeft}.Toastify__slide-exit--bottom-right,.Toastify__slide-exit--top-right{animation-name:Toastify__slideOutRight}.Toastify__slide-exit--top-center{animation-name:Toastify__slideOutUp}.Toastify__slide-exit--bottom-center{animation-name:Toastify__slideOutDown}@keyframes Toastify__spin{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}.vchasno-ui-snackbar .vchasno-ui-snackbar-toast{background:var(--vchasno-ui-snackbar-toast-background);border-radius:var(--toastify-toast-bd-radius);box-sizing:border-box;max-width:var(--vchasno-ui-snackbar-toast-max-width);min-width:var(--vchasno-ui-snackbar-toast-min-width);padding:5px 10px;width:auto}.vchasno-ui-snackbar .vchasno-ui-snackbar-body{padding:0 8px 0 0}.vchasno-ui-snackbar-with-action-container{align-items:center;display:flex;gap:26px;justify-content:space-between;padding-bottom:5px;padding-top:5px}.vchasno-ui-snackbar-action-button{border:none;color:var(--vchasno-ui-snackbar-action-button-color);cursor:pointer;flex-shrink:0;font-size:14px;font-weight:500;line-height:20px;margin-left:auto}.vchasno-ui-snackbar .Toastify__toast-icon{font-size:20px;margin-right:10px}.vchasno-ui-snackbar .Toastify__close-button{align-items:center;align-self:center;display:flex;justify-content:center}.vchasno-ui-SplashLogo__logo-box{--vchasno-ui-splash-screen-logo-box-width:300px;--vchasno-ui-splash-screen-logo-box-height:100px;--vchasno-ui-splash-screen-logo-color:#252d3d;--vchasno-ui-splash-screen-animation-duration:2s;animation:wave var(--vchasno-ui-splash-screen-animation-duration) infinite linear forwards;background-image:linear-gradient(to right,transparent,var(--vchasno-ui-splash-screen-logo-color),transparent);background-size:var(--vchasno-ui-splash-screen-logo-box-width) var(--vchasno-ui-splash-screen-logo-box-height);display:inline-block;height:var(--vchasno-ui-splash-screen-logo-box-height);width:var(--vchasno-ui-splash-screen-logo-box-width)}@keyframes wave{0%{background-position:calc(var(--vchasno-ui-splash-screen-logo-box-width)*-1) 0}to{background-position:0 0}}.vchasno-ui-SvgBorder{--vchasno-ui-svg-border-animation-duration-sec:1s;--vchasno-ui-svg-border-stroke-dashoffset:100%;position:relative}.vchasno-ui-SvgBorder__svg{left:0;overflow:visible;pointer-events:none;position:absolute;top:0;transform:translateZ(0);transition:var(--vchasno-ui-transition-duration-sec);z-index:-1}.vchasno-ui-SvgBorder__svg--animation-border-offset{animation:stroke-offset var(--vchasno-ui-svg-border-animation-duration-sec) linear infinite;animation-play-state:paused}.vchasno-ui-SvgBorder__svg--animation-play{animation-play-state:running}@keyframes stroke-offset{to{stroke-dashoffset:var(--vchasno-ui-svg-border-stroke-dashoffset)}}.vchasno-ui-switch{--vchasno-ui-switch-border-radius:100px;--vchasno-ui-switc-hcircle-size:calc(var(--vchasno-ui-switch-height) - 4px);align-content:center;cursor:pointer;display:inline-flex;line-height:var(--vchasno-ui-switch-height)}.vchasno-ui-switch.--sm{--vchasno-ui-switch-height:20px}.vchasno-ui-switch.--md{--vchasno-ui-switch-height:30px}.vchasno-ui-switch.--lg{--vchasno-ui-switch-height:40px}.vchasno-ui-switch--bg{aspect-ratio:36/20;background:var(--vchasno-ui-switch-color-bg);border-radius:var(--vchasno-ui-switch-border-radius);box-shadow:inset 0 2px 0 rgba(57,96,131,.2);box-sizing:border-box;display:inline-flex;flex-shrink:0;height:var(--vchasno-ui-switch-height,20px);position:relative;transition:background-color .3s;z-index:0}.vchasno-ui-switch__active .vchasno-ui-switch--bg{background:var(--vchasno-ui-switch-active-color-bg)}.vchasno-ui-switch__disabled{cursor:default;opacity:.7}.vchasno-ui-switch--circle{align-items:center;aspect-ratio:1/1;background-color:var(--vchasno-ui-switch-circle-color);border-radius:var(--vchasno-ui-border-radius-full);display:flex;height:var(--vchasno-ui-switc-hcircle-size);justify-content:center;left:0;position:absolute;top:0;transform:translate(2px,2px);transition:transform .3s}.vchasno-ui-switch--bg>input:checked+.vchasno-ui-switch--circle{transform:translate(18px,2px)}.vchasno-ui-switch.--md .vchasno-ui-switch--bg>input:checked+.vchasno-ui-switch--circle{transform:translate(26px,2px)}.vchasno-ui-switch.--lg .vchasno-ui-switch--bg>input:checked+.vchasno-ui-switch--circle{transform:translate(34px,2px)}.vchasno-ui-spinner{color:var(--vchasno-ui-switch-spinner-color)}.vchasno-ui-switch--label{color:var(--vchasno-ui-input-font-color);font-size:var(--vchasno-ui-input-font-size);margin-left:12px;user-select:none}.vchasno-ui-tabs-wrapper{-ms-overflow-style:none;position:relative;scrollbar-width:none;width:100%}.vchasno-ui-tabs-wrapper::-webkit-scrollbar{display:none}.--h-scroll{overflow:auto}.vchasno-ui-tabs-wrapper-root{position:relative}.vchasno-ui-tabs-wrapper-root:after,.vchasno-ui-tabs-wrapper-root:before{bottom:0;content:"";display:block;pointer-events:none;position:absolute;top:0;width:30px}.--ping-right:after{box-shadow:inset -12px 0 8px -8px rgb(0 0 0/8%);right:0}.--ping-left:before{box-shadow:inset 12px 0 8px -8px rgb(0 0 0/8%);left:0}.vchasno-ui-tabs{--active-color:var(--vchasno-ui-tabs-active-color);display:flex;font-size:16px;font-weight:500;position:relative}.vchasno-ui-tabs__indicator{background-color:var(--active-color);border-radius:var(--vchasno-ui-border-radius-sm);bottom:-1px;display:block;height:3px;left:0;position:absolute;transform:translateX(0);transition:transform var(--vchasno-ui-transition-duration-sec,.3s),width var(--vchasno-ui-transition-duration-sec,.3s);width:10px;z-index:1}.--h-scroll .vchasno-ui-tabs__indicator{display:none}.vchasno-ui-tabs-wrapper-root.--skip-animation .vchasno-ui-tabs__indicator{transition:none}.vchasno-ui-tabs__label-item{align-items:center;color:#252d3d;cursor:pointer;display:inline-flex;flex-grow:0;flex-shrink:0;height:50px;padding:0 15px;position:relative;transition:color var(--vchasno-ui-transition-duration-sec),background-color var(--vchasno-ui-transition-duration-sec);user-select:none}.vchasno-ui-tabs__label-item:after{background-color:var(--active-color);border-radius:var(--vchasno-ui-border-radius-sm);bottom:0;content:"";display:block;height:0;left:0;position:absolute;right:0;transition:height var(--vchasno-ui-transition-duration-sec);z-index:1}.--h-scroll .vchasno-ui-tabs__label-item.--active:after{height:3px}.vchasno-ui-tabs-wrapper:not(.--h-scroll) .vchasno-ui-tabs{border-bottom:1px solid #e2e9f3}.vchasno-ui-tabs__label-item.--active,.vchasno-ui-tabs__label-item:not(.--disabled):hover{color:var(--active-color)}.vchasno-ui-tabs__label-item.--disabled{cursor:not-allowed;opacity:.5}.vchasno-ui-textarea-input-container .vchasno-ui-input__wrapper{height:auto;padding-bottom:10px;padding-top:10px}.vchasno-ui-textarea-input{border:0;color:var(--vchasno-ui-text-primary-color);font-size:var(--vchasno-ui-input-font-size);line-height:calc(var(--vchasno-ui-input-font-size)*1.2);resize:none;width:100%}.vchasno-ui-textarea-input::placeholder{color:var(--vchasno-ui-input-placeholder-color);font-size:var(--vchasno-ui-input-font-size);line-height:calc(var(--vchasno-ui-input-font-size)*1.2);transition:color var(--vchasno-ui-transition-duration-sec,.3s)}.vchasno-ui-input__wrapper__label{transform:none}.vchasno-ui-textarea-input+.vchasno-ui-label-text{top:0;transform:translateY(10px);transition:transform var(--vchasno-ui-transition-duration-sec,.3s),font-size var(--vchasno-ui-transition-duration-sec,.3s)}.vchasno-ui-textarea-input:focus:not(.--disabled)+.vchasno-ui-label-text,.vchasno-ui-textarea-input:not(:placeholder-shown)+.vchasno-ui-label-text{top:0;transform:translateY(-12px)}.vchasno-ui-text-input{font-size:var(--vchasno-ui-input-font-size);line-height:var(--vchasno-ui-input-font-size)}.vchasno-ui-text-input::-webkit-inner-spin-button,.vchasno-ui-text-input::-webkit-outer-spin-button{appearance:none;margin:0}.vchasno-ui-text-input[type=number]{appearance:textfield}.vchasno-ui-text-input::placeholder{color:var(--vchasno-ui-input-placeholder-color);font-size:var(--vchasno-ui-input-font-size);line-height:var(--vchasno-ui-input-font-size);transition:color var(--vchasno-ui-transition-duration-sec,.3s)}@supports selector(:not(:placeholder-shown)){.vchasno-ui-input__clear-btn{transform:scale(0)}.vchasno-ui-text-input:not(:placeholder-shown)+.vchasno-ui-input__feedback .vchasno-ui-input__clear-btn{transform:scale(1)}.vchasno-ui-text-input:not(:placeholder-shown)+.vchasno-ui-label-text+.vchasno-ui-input__feedback .vchasno-ui-input__clear-btn{transform:scale(1)}}.vchasno-ui-title{color:var(--vchasno-ui-text-primary-color,#252d3d)}.vchasno-ui-title.--pretty{text-wrap:pretty}.vchasno-ui-title.--ellipsis{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.vchasno-ui-title h1,h1.vchasno-ui-title{font-size:32px;font-weight:700;line-height:40px}.vchasno-ui-title h2,h2.vchasno-ui-title{font-size:24px;font-weight:700;line-height:28px}.vchasno-ui-title h3,h3.vchasno-ui-title{font-size:20px;font-weight:500;line-height:24px}.vchasno-ui-title h4,h4.vchasno-ui-title{font-size:16px;font-weight:400;line-height:20px}.vchasno-ui-title h5,h5.vchasno-ui-title{font-size:12px;font-weight:400;line-height:14px}.vchasno-ui-PasswordInput{font-size:var(--vchasno-ui-input-font-size);line-height:var(--vchasno-ui-input-font-size);min-width:176px}.vchasno-ui-PasswordInput::-webkit-inner-spin-button,.vchasno-ui-PasswordInput::-webkit-outer-spin-button{appearance:none;margin:0}.vchasno-ui-PasswordInput::placeholder{color:var(--vchasno-ui-input-placeholder-color);font-size:var(--vchasno-ui-input-font-size);line-height:var(--vchasno-ui-input-font-size);transition:color var(--vchasno-ui-transition-duration-sec,.3s)}.vchasno-ui-PasswordInput--type-password{caret-color:var(--vchasno-ui-input-placeholder-color);font-family:Verdana,sans-serif}.vchasno-ui-PasswordInput--type-password:not(:placeholder-shown){letter-spacing:.2em}.vchasno-ui-PasswordInput__eye{color:var(--vchasno-ui-input-font-color-disabled);cursor:pointer;display:flex;flex-shrink:0;place-items:center center;position:absolute;right:16px;top:50%;transform:translateY(-50%);width:20px}.vchasno-ui-PasswordInput__eye--active{color:var(--vchasno-ui-input-placeholder-color)}.vchasno-ui-PasswordInput__eye svg{transition:color var(--vchasno-ui-transition-duration-sec,.3s)}.vchasno-ui-input__wrapper:has(.vchasno-ui-PasswordInput__eye){padding-right:40px}.vchasno-ui-input__wrapper:has(.vchasno-ui-PasswordInput__eye) .vchasno-ui-input__feedback{display:none}.vchasno-ui-slider.vchasno-ui-slider-root{height:2px}.vchasno-ui-slider .vchasno-ui-slider-mark{background-color:#e2e9f3;border-radius:var(--vchasno-ui-border-radius-full);height:8px;width:8px}.vchasno-ui-slider .vchasno-ui-slider-mark.MuiSlider-markActive{background-color:var(--vchasno-ui-slider-color)}.vchasno-ui-slider .vchasno-ui-slider-mark-label{color:var(--vchasno-ui-label-color-default)}.vchasno-ui-slider .vchasno-ui-slider-rail{background-color:#e2e9f3}.vchasno-ui-slider .vchasno-ui-slider-track{background-color:var(--vchasno-ui-slider-color);border-color:var(--vchasno-ui-slider-color)}.vchasno-ui-slider .vchasno-ui-slider-thumb{background-color:var(--vchasno-ui-slider-color);height:24px;width:24px}.vchasno-ui-slider .vchasno-ui-slider-thumb.Mui-focusVisible,.vchasno-ui-slider .vchasno-ui-slider-thumb:hover{box-shadow:0 0 0 8px var(--vchasno-ui-slider-thumb-box-shadow-color)}.vchasno-ui-slider .vchasno-ui-slider-thumb.Mui-active{box-shadow:0 0 0 14px var(--vchasno-ui-slider-thumb-box-shadow-color)}.vchasno-ui-breadcrumbs{font-size:14px;line-height:20px}.vchasno-ui-breadcrumbs-separator{margin:0 2px}.vchasno-ui-avatar{--avatar-size:40px;--avatar-font-size:16px;align-items:center;background-color:#e2e9f3;border-radius:var(--avatar-radius);color:#6e809a;display:inline-flex;font-size:var(--avatar-font-size);font-weight:var(--vchasno-ui-font-weight-medium);height:var(--avatar-size);justify-content:center;line-height:1;overflow:hidden;user-select:none;vertical-align:middle;width:var(--avatar-size)}.vchasno-ui-avatar,.vchasno-ui-avatar--shape-circular{--avatar-radius:var(--vchasno-ui-border-radius-full)}.vchasno-ui-avatar--shape-rounded{--avatar-radius:var(--vchasno-ui-border-radius-md)}.vchasno-ui-avatar--size-xs{--avatar-size:24px;--avatar-font-size:var(--vchasno-ui-font-size-2xs)}.vchasno-ui-avatar--size-sm{--avatar-size:32px;--avatar-font-size:var(--vchasno-ui-font-size-xs)}.vchasno-ui-avatar--size-md{--avatar-size:40px;--avatar-font-size:var(--vchasno-ui-font-size-md)}.vchasno-ui-avatar--size-lg{--avatar-size:56px;--avatar-font-size:var(--vchasno-ui-font-size-xl)}.vchasno-ui-avatar--size-xl{--avatar-size:88px;--avatar-font-size:var(--vchasno-ui-font-size-2xl)}.vchasno-ui-avatar__image{height:100%;object-fit:cover;width:100%}.vchasno-ui-avatar__fallback{align-items:center;display:flex;height:100%;justify-content:center;width:100%}
5
+ )}.vchasno-ui-date-range-picker-popper .react-datepicker__navigation{display:none}.vchasno-ui-date-range-picker-popper .vchasno-ui-date-range-picker__header{align-items:center;display:flex;justify-content:space-between;padding:8px 0 15px}.vchasno-ui-date-range-picker__month-title{color:var(--vchasno-ui-input-font-color);font-size:14px;font-weight:500;text-transform:capitalize}.vchasno-ui-date-range-picker__nav-btn{align-items:center;background:transparent;border:none;border-radius:var(--vchasno-ui-border-radius-md);color:var(--vchasno-ui-calendar-default-icon-color);cursor:pointer;display:flex;height:30px;justify-content:center;width:30px}.vchasno-ui-date-range-picker__nav-btn:hover{background-color:var(--vchasno-ui-color-gray-100)}.vchasno-ui-date-range-picker__nav-btn:disabled{cursor:not-allowed;opacity:.3}.vchasno-ui-date-range-picker-popper .react-datepicker__day--in-range:not(.react-datepicker__day--range-start,.react-datepicker__day--range-end){background-color:var(--vchasno-ui-color-utility-blue-50);border-radius:0;color:var(--vchasno-ui-input-font-color);font-weight:400}.vchasno-ui-date-range-picker-popper .react-datepicker__day--range-end,.vchasno-ui-date-range-picker-popper .react-datepicker__day--range-start{background-color:var(--vchasno-ui-calendar-select-color);color:var(--vchasno-ui-color-gray-0);font-weight:700}.vchasno-ui-date-range-picker-popper .react-datepicker__day--range-start.react-datepicker__day--range-end{border-radius:var(--vchasno-ui-border-radius-md)}.vchasno-ui-date-range-picker-popper .react-datepicker__day--in-selecting-range:not(.react-datepicker__day--in-range){background-color:var(--vchasno-ui-calendar-select-color)}.vchasno-ui-date-range-picker-popper .react-datepicker__day--in-range.react-datepicker__day--today{border-radius:var(--vchasno-ui-border-radius-md)}.vchasno-ui-date-range-picker-popper .react-datepicker__day--outside-month{pointer-events:none;visibility:hidden}.vchasno-ui-flex-box{align-content:flex-start;display:flex;flex-direction:row;gap:10px;max-width:100%}.vchasno-ui-text{color:var(--vchasno-ui-text-primary-color,#252d3d)}.vchasno-ui-text.--ellipsis{display:inline-block;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.vchasno-ui-text.--secondary{color:var(--vchasno-ui-text-secondary-color,#5a6a81)}.vchasno-ui-text.--success{color:var(--vchasno-ui-text-success-color,#1cb800)}.vchasno-ui-text.--warning{color:var(--vchasno-ui-text-warning-color,#ff9c01)}.vchasno-ui-text.--danger{color:var(--vchasno-ui-text-error-color,#f54f4f)}.vchasno-ui-text.--code{background:hsla(0,0%,59%,.1);border:1px solid var(--vchasno-ui-input-border-color-default);border-radius:var(--vchasno-ui-border-radius-sm);font-size:85%;margin:0 .2em;padding:.2em .4em .1em}.vchasno-ui-text.--inherit{font-size:inherit}.vchasno-ui-text.--like-link,.vchasno-ui-text.--link{color:var(--vchasno-ui-text-link-color);cursor:pointer}.vchasno-ui-text.--link{text-decoration-line:underline}.vchasno-ui-text.--normal{font-size:1rem;line-height:1.1rem}.vchasno-ui-text.--small{font-size:.8rem;line-height:.9rem}.vchasno-ui-text.--large{font-size:1.2rem;line-height:1.3rem}.vchasno-ui-text.--required:after{color:var(--vchasno-ui-text-error-color,#f54f4f);content:"*";position:relative;right:-2px;top:-3px}strong.vchasno-ui-text{font-weight:700}.vchasno-ui-FollowUs{min-height:24px;min-width:24px}.vchasno-ui-FollowUs__label{font-size:14px}.vchasno-ui-FollowUs__link{display:block;flex-grow:0;flex-shrink:0;height:24px;transition:filter .3s;width:24px}.vchasno-ui-FollowUs__link img{display:block}.vchasno-ui-FollowUs__link:hover{filter:brightness(80%)}.vchasno-ui-input{display:inline-flex;flex-direction:column;gap:5px;max-width:100%}.vchasno-ui-input input::placeholder{color:var(--vchasno-ui-input-placeholder-color);font-size:var(--vchasno-ui-input-font-size);line-height:calc(var(--vchasno-ui-input-font-size)*1.2);transition:color var(--vchasno-ui-transition-duration-sec,.3s)}.vchasno-ui-input .vchasno-ui-mask-input,.vchasno-ui-input .vchasno-ui-text-input{flex-grow:1}.vchasno-ui-input.--wide{width:100%}.vchasno-ui-input__wrapper{align-items:center;background-color:var(--vchasno-ui-input-bg-color);border:1px solid var(--vchasno-ui-input-border-color-default);border-radius:var(--vchasno-ui-border-radius-md);box-sizing:border-box;display:flex;min-height:50px;outline:3px solid transparent;padding-left:16px;padding-right:33px;position:relative;transition:border var(--vchasno-ui-transition-duration-sec,.3s)}.vchasno-ui-input__wrapper>input{max-width:100%}.vchasno-ui-input__wrapper__start-element{align-items:center;display:flex;flex-grow:0;flex-shrink:0;font-size:var(--vchasno-ui-input-font-size,14px);line-height:var(--vchasno-ui-input-font-size,14px);margin-right:5px}.vchasno-ui-input__feedback{display:block;height:18px;position:absolute;right:10px;top:50%;transform:translateY(-50%);width:18px}.vchasno-ui-input__clear-btn{cursor:pointer;display:block;height:18px;transition:transform var(--vchasno-ui-transition-duration-sec,.3s);width:18px}.vchasno-ui-input__clear-btn svg{height:100%;transition:color var(--vchasno-ui-transition-duration-sec,.3s);width:100%}.vchasno-ui-input__clear-btn:hover svg{color:var(--vchasno-ui-input-color-error)}.vchasno-ui-input .vchasno-ui-spinner__svg__circle,.vchasno-ui-input .vchasno-ui-spinner__svg__path{stroke:var(--vchasno-ui-input-border-color-focused)}.vchasno-ui-input.--disabled .vchasno-ui-input__wrapper{background-color:var(--vchasno-ui-input-bg-color-disabled);color:var(--vchasno-ui-input-font-color-disabled)}.vchasno-ui-input:not(.--disabled) .vchasno-ui-input__wrapper:hover{cursor:text}.vchasno-ui-input:not(.--disabled):hover .vchasno-ui-input__wrapper{border-color:var(--vchasno-ui-input-border-color-focused)}.vchasno-ui-input:not(.--disabled):focus-within .vchasno-ui-input__wrapper{border-color:var(--vchasno-ui-input-border-color-focused);outline-color:var(--vchasno-ui-input-outline-color-focused)}.vchasno-ui-input:not(.--disabled).--error .vchasno-ui-input__wrapper{border-color:var(--vchasno-ui-input-color-error);outline-color:var(--vchasno-ui-input-outline-color-error)}.vchasno-ui-input.--disabled,.vchasno-ui-input.--disabled *{cursor:not-allowed;opacity:.8}.vchasno-ui-input.--is-label input::placeholder{visibility:hidden}.vchasno-ui-input.--is-label:focus-within input::placeholder{visibility:visible}.vchasno-ui-mask-input{font-size:var(--vchasno-ui-input-font-size);line-height:var(--vchasno-ui-input-font-size);position:relative}.vchasno-ui-mask-input::placeholder{color:var(--vchasno-ui-input-placeholder-color);font-size:var(--vchasno-ui-input-font-size);line-height:calc(var(--vchasno-ui-input-font-size)*1.2);transition:color var(--vchasno-ui-transition-duration-sec,.3s)}.szh-menu-button{box-sizing:border-box}.vchasno-ui-menu-button{align-items:center;border:none;border-radius:var(--vchasno-ui-border-radius-sm);cursor:pointer;display:flex;justify-content:center;padding:5px;transition:background-color var(--vchasno-ui-transition-duration-sec)}.vchasno-ui-menu-button:hover{background-color:var(--vchasno-ui-menu-button-bg)}.szh-menu__item{align-items:center;border-radius:var(--vchasno-ui-border-radius-sm);cursor:pointer;display:flex;padding:10px 12px;position:relative;transition:background-color var(--vchasno-ui-transition-duration-sec)}.szh-menu__item+.szh-menu__item{margin-top:4px}.szh-menu__item:focus{outline:none}.szh-menu__item--hover{background-color:var(--vchasno-ui-menu-item-hover-bg)}.szh-menu__item--focusable{background-color:inherit;cursor:default}.szh-menu__item--disabled{color:#aaa;cursor:default}.vchasno-ui-menu-submenu.szh-menu__submenu>.szh-menu__item{padding:10px 12px}.vchasno-ui-menu-submenu .szh-menu__item--submenu:after{display:none}.vchasno-ui-menu-submenu-label-container{width:100%}.szh-menu{background-color:#fff;border:1px solid var(--vchasno-ui-input-border-color-default);border-radius:var(--vchasno-ui-border-radius-md);box-sizing:border-box;color:#212529;list-style:none;margin:0;min-width:10rem;padding:8px;user-select:none;width:max-content;z-index:100}.szh-menu:focus{outline:none}.szh-menu__arrow{background-color:#fff;border-color:rgba(0,0,0,.1) transparent transparent rgba(0,0,0,.1);border-style:solid;border-width:1px;box-sizing:border-box;height:.75rem;width:.75rem;z-index:-1}.szh-menu__arrow--dir-left{right:-.375rem;transform:translateY(-50%) rotate(135deg)}.szh-menu__arrow--dir-right{left:-.375rem;transform:translateY(-50%) rotate(-45deg)}.szh-menu__arrow--dir-top{bottom:-.375rem;transform:translateX(-50%) rotate(-135deg)}.szh-menu__arrow--dir-bottom{top:-.375rem;transform:translateX(-50%) rotate(45deg)}.szh-menu__group{box-sizing:border-box}.szh-menu__radio-group{list-style:none;margin:0;padding:0}.szh-menu__divider{background-color:rgba(0,0,0,.12);height:1px;margin:.5rem 0}.szh-menu-container--itemTransition .szh-menu__item{transition-duration:.15s;transition-property:background-color,color;transition-timing-function:ease-in-out}.szh-menu__item--type-radio{padding-left:2.2rem}.szh-menu__item--type-radio:before{content:"○";font-size:.8rem;left:.8rem;position:absolute;top:.55rem}.szh-menu__item--type-radio.szh-menu__item--checked:before{content:"●"}.szh-menu__item--type-checkbox{padding-left:2.2rem}.szh-menu__item--type-checkbox:before{left:.8rem;position:absolute}.szh-menu__item--type-checkbox.szh-menu__item--checked:before{content:"✔"}.szh-menu__submenu>.szh-menu__item{padding-right:2.5rem}.szh-menu__submenu>.szh-menu__item:after{content:"❯";position:absolute;right:1rem}.szh-menu__header{color:#888;font-size:.8rem;padding:.2rem 1.5rem;text-transform:uppercase}.vchasno-ui-MobileAppLinks{min-width:100px}.vchasno-ui-MobileAppLinks__label{font-size:14px}.vchasno-ui-MobileAppLinks__link{aspect-ratio:300/89;display:block;max-width:150px;transition:filter .3s}.vchasno-ui-MobileAppLinks__link img{display:block}.vchasno-ui-MobileAppLinks__link:hover{filter:brightness(80%)}.vchasno-ui-pagination{align-items:center;display:inline-flex;flex-shrink:0;font-size:14px;gap:10px}.vchasno-ui-pagination__item{align-items:center;background-color:#fff;border:1px solid transparent;border-radius:var(--vchasno-ui-border-radius-md);cursor:pointer;display:flex;flex-grow:0;flex-shrink:0;height:var(--vchasno-ui-pagination-size);justify-content:center;min-width:var(--vchasno-ui-pagination-size);outline:0;text-align:center;transition:background-color var(--vchasno-ui-transition-duration-sec,.3s),border var(--vchasno-ui-transition-duration-sec,.3s);user-select:none;vertical-align:middle}.vchasno-ui-pagination__item-arrow{align-items:center;display:inline-flex;justify-content:center}.vchasno-ui-pagination__item:not(.vchasno-ui-pagination__item-disabled):focus-visible{border-color:var(--vchasno-ui-pagination-border-color);box-shadow:0 0 0 2px var(--vchasno-ui-pagination-focus-shadow-color);z-index:1}.vchasno-ui-pagination__item:not(.vchasno-ui-pagination__item-disabled):hover{background-color:var(--vchasno-ui-pagination-hover-bg-color)}.vchasno-ui-pagination__item-active{border-color:var(--vchasno-ui-pagination-border-color)}.vchasno-ui-pagination__item-disabled{cursor:not-allowed;opacity:.8}.vchasno-ui-pagination__item-hidden{display:none}.--text-start{text-align:start}.--text-center{text-align:center}.--text-end{text-align:end}.--text-justify{text-align:justify}.vchasno-ui-paragraph{color:var(--vchasno-ui-text-primary-color)}.vchasno-ui-paragraph.--ellipsis{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.vchasno-ui-paragraph.--ellipsis-line{-webkit-box-orient:vertical;display:-webkit-box;overflow:hidden;text-overflow:ellipsis;white-space:unset}.vchasno-ui-paragraph.--text-center{text-align:center}.vchasno-ui-paragraph.--text-left{text-align:left}.vchasno-ui-paragraph.--text-right{text-align:right}.vchasno-ui-paragraph.--text-justify{text-align:justify}.vchasno-ui-ProjectsPopover{background-color:#fff;border-radius:var(--vchasno-ui-border-radius-md);box-sizing:border-box;display:inline-block;max-width:calc(100vw - 32px);padding:24px 16px 0;width:440px}.vchasno-ui-ProjectsPopover__content{display:flex;flex-direction:column;gap:32px}.vchasno-ui-ProjectsPopover__products{box-sizing:border-box;display:flex;flex-wrap:wrap;gap:10px;width:calc(100% + 32px)}.vchasno-ui-ProjectsPopover a:hover{color:unset;text-decoration:none}.vchasno-ui-ProjectsPopover--border{border:1px solid #e2e9f3}.vchasno-ui-ProjectsPopover__title{font-size:16px;font-style:normal;font-weight:500;line-height:18px;width:100%}.vchasno-ui-ProjectsPopover__box{align-items:center;aspect-ratio:198/80;border:1px solid #e2e9f3;border-radius:var(--vchasno-ui-border-radius-md);box-sizing:border-box;color:var(--vchasno-ui-text-primary-color);display:inline-flex;gap:8px;padding:20px;text-decoration:none;transition:background-color .3s;width:198px}.vchasno-ui-ProjectsPopover__box>svg{max-width:90%}.vchasno-ui-ProjectsPopover__box__icon{border-radius:var(--vchasno-ui-border-radius-full);box-sizing:border-box;flex-shrink:0;height:40px;width:40px}.vchasno-ui-ProjectsPopover__box:hover{background-color:#f3f8fb;cursor:pointer}.vchasno-ui-ProjectsPopover__box__title{font-size:14px;font-style:normal;font-weight:400;line-height:26px}.vchasno-ui-ProjectsPopover .vchasno-ui-ProjectsPopover__footer{align-items:center;background:#e0eeff;border-bottom-left-radius:var(--vchasno-ui-border-radius-md);border-bottom-right-radius:var(--vchasno-ui-border-radius-md);color:#6e809a;display:flex;font-size:12px;font-weight:400;justify-content:center;margin:0 -16px;min-height:42px}.vchasno-ui-ProjectsPopover .vchasno-ui-ProjectsPopover__footer>a{color:#0890de;text-decoration:none}.vchasno-ui-ProjectsPopover__tooltip-hint{text-align:center}@media screen and (width <= 480px){.vchasno-ui-ProjectsPopover{width:330px}.vchasno-ui-ProjectsPopover__box{aspect-ratio:1/1;flex-direction:column;justify-content:center;padding:10px;width:calc(50% - 20px)}}.vchasno-ui-PulseDot{background-color:var(--vchasno-ui-pulse-dot-color);border-radius:var(--vchasno-ui-border-radius-full);height:var(--vchasno-ui-pulse-dot-size);position:relative;width:var(--vchasno-ui-pulse-dot-size)}.vchasno-ui-PulseDot:after,.vchasno-ui-PulseDot:before{background:inherit;border-radius:var(--vchasno-ui-border-radius-full);content:"";height:100%;pointer-events:none;position:absolute;width:100%}.vchasno-ui-PulseDot:before{animation:pulse 2s ease-out infinite}.vchasno-ui-PulseDot:after{animation:pulse 2s ease-out 1s infinite}@keyframes pulse{to{opacity:0;transform:scale(2)}}:root{--toastify-color-light:var(--vchasno-ui-snackbar-color-light);--toastify-color-dark:var(--vchasno-ui-snackbar-color-dark);--toastify-color-info:var(--vchasno-ui-snackbar-color-info);--toastify-color-success:var(--vchasno-ui-snackbar-color-success);--toastify-color-warning:var(--vchasno-ui-snackbar-color-warning);--toastify-color-error:var(--vchasno-ui-snackbar-color-error);--toastify-color-transparent:var(--vchasno-ui-snackbar-color-transparent);--toastify-icon-color-info:var(--vchasno-ui-snackbar-icon-color-info);--toastify-icon-color-success:var(--vchasno-ui-snackbar-icon-color-success);--toastify-icon-color-warning:var(--vchasno-ui-snackbar-icon-color-warning);--toastify-icon-color-error:var(--vchasno-ui-snackbar-icon-color-error);--toastify-toast-width:var(--vchasno-ui-snackbar-toast-width);--toastify-toast-offset:var(--vchasno-ui-snackbar-toast-offset);--toastify-toast-top:var(--vchasno-ui-snackbar-toast-top);--toastify-toast-right:var(--vchasno-ui-snackbar-toast-right);--toastify-toast-left:var(--vchasno-ui-snackbar-toast-left);--toastify-toast-bottom:var(--vchasno-ui-snackbar-toast-bottom);--toastify-toast-background:var(--vchasno-ui-snackbar-toast-background);--toastify-toast-min-height:var(--vchasno-ui-snackbar-toast-min-height);--toastify-toast-max-height:var(--vchasno-ui-snackbar-toast-max-height);--toastify-toast-bd-radius:var(--vchasno-ui-snackbar-toast-bd-radius);--toastify-font-family:var(--vchasno-ui-snackbar-font-family);--toastify-z-index:var(--vchasno-ui-snackbar-z-index);--toastify-text-color-light:var(--vchasno-ui-snackbar-text-color-light);--toastify-text-color-dark:var(--vchasno-ui-snackbar-text-color-dark);--toastify-text-color-info:var(--vchasno-ui-snackbar-text-color-info);--toastify-text-color-success:var(--vchasno-ui-snackbar-text-color-success);--toastify-text-color-warning:var(--vchasno-ui-snackbar-text-color-warning);--toastify-text-color-error:var(--vchasno-ui-snackbar-text-color-error);--toastify-spinner-color:var(--vchasno-ui-snackbar-spinner-color);--toastify-spinner-color-empty-area:var(--vchasno-ui-snackbar-spinner-color-empty-area);--toastify-color-progress-light:var(--vchasno-ui-snackbar-color-progress-light);--toastify-color-progress-dark:var(--vchasno-ui-snackbar-color-progress-dark);--toastify-color-progress-info:var(--vchasno-ui-snackbar-color-progress-info);--toastify-color-progress-success:var(--vchasno-ui-snackbar-color-progress-success);--toastify-color-progress-warning:var(--vchasno-ui-snackbar-color-progress-warning);--toastify-color-progress-error:var(--vchasno-ui-snackbar-color-progress-error);--toastify-color-progress-bgo:var(--vchasno-ui-snackbar-color-progress-bgo)}.Toastify__toast-container{box-sizing:border-box;color:#fff;padding:4px;position:fixed;transform:translateZ(var(--toastify-z-index));width:var(--toastify-toast-width);z-index:var(--toastify-z-index)}.Toastify__toast-container--top-left{left:1em;top:1em}.Toastify__toast-container--top-center{left:50%;top:1em;transform:translateX(-50%)}.Toastify__toast-container--top-right{right:1em;top:1em}.Toastify__toast-container--bottom-left{bottom:1em;left:1em}.Toastify__toast-container--bottom-center{bottom:1em;left:50%;transform:translateX(-50%)}.Toastify__toast-container--bottom-right{bottom:1em;right:1em}@media only screen and (width <= 480px){.Toastify__toast-container{left:0;margin:0;padding:0;width:100vw}.Toastify__toast-container--top-center,.Toastify__toast-container--top-left,.Toastify__toast-container--top-right{top:0;transform:translateX(0)}.Toastify__toast-container--bottom-center,.Toastify__toast-container--bottom-left,.Toastify__toast-container--bottom-right{bottom:0;transform:translateX(0)}.Toastify__toast-container--rtl{left:auto;right:0}}.Toastify__toast{-ms-flex-pack:justify;border-radius:var(--vchasno-ui-border-radius-sm);box-shadow:0 1px 10px 0 rgba(0,0,0,.1),0 2px 15px 0 rgb(0 0 0/5%);box-sizing:border-box;cursor:default;direction:ltr;display:flex;font-family:var(--toastify-font-family);justify-content:space-between;margin-bottom:1rem;max-height:var(--toastify-toast-max-height);min-height:var(--toastify-toast-min-height);overflow:hidden;padding:8px;position:relative;z-index:0}.Toastify__toast--rtl{direction:rtl}.Toastify__toast--close-on-click{cursor:pointer}.Toastify__toast-body{-ms-flex-align:center;align-items:center;display:flex;flex:1 1 auto;margin:auto 0;padding:6px}.Toastify__toast-body>div:last-child{flex:1;word-break:break-word}.Toastify__toast-icon{-ms-flex-negative:0;-webkit-margin-end:10px;display:flex;flex-shrink:0;margin-inline-end:10px;width:20px}.Toastify--animate{animation-duration:.7s;animation-fill-mode:both}.Toastify--animate-icon{animation-duration:.3s;animation-fill-mode:both}@media only screen and (width <= 480px){.Toastify__toast{border-radius:var(--vchasno-ui-border-radius-none);margin-bottom:0}}.Toastify__toast-theme--dark{background:var(--toastify-color-dark);color:var(--toastify-text-color-dark)}.Toastify__toast-theme--colored.Toastify__toast--default,.Toastify__toast-theme--light{background:var(--toastify-color-light);color:var(--toastify-text-color-light)}.Toastify__toast-theme--colored.Toastify__toast--info{background:var(--toastify-color-info);color:var(--toastify-text-color-info)}.Toastify__toast-theme--colored.Toastify__toast--success{background:var(--toastify-color-success);color:var(--toastify-text-color-success)}.Toastify__toast-theme--colored.Toastify__toast--warning{background:var(--toastify-color-warning);color:var(--toastify-text-color-warning)}.Toastify__toast-theme--colored.Toastify__toast--error{background:var(--toastify-color-error);color:var(--toastify-text-color-error)}.Toastify__progress-bar-theme--light{background:var(--toastify-color-progress-light)}.Toastify__progress-bar-theme--dark{background:var(--toastify-color-progress-dark)}.Toastify__progress-bar--info{background:var(--toastify-color-progress-info)}.Toastify__progress-bar--success{background:var(--toastify-color-progress-success)}.Toastify__progress-bar--warning{background:var(--toastify-color-progress-warning)}.Toastify__progress-bar--error{background:var(--toastify-color-progress-error)}.Toastify__progress-bar-theme--colored.Toastify__progress-bar--error,.Toastify__progress-bar-theme--colored.Toastify__progress-bar--info,.Toastify__progress-bar-theme--colored.Toastify__progress-bar--success,.Toastify__progress-bar-theme--colored.Toastify__progress-bar--warning{background:var(--toastify-color-transparent)}.Toastify__close-button{-ms-flex-item-align:start;align-self:flex-start;background:transparent;border:none;color:#fff;cursor:pointer;opacity:.7;outline:none;padding:0;transition:.3s ease}.Toastify__close-button--light{color:#000;opacity:.3}.Toastify__close-button>svg{fill:currentcolor;height:16px;width:14px}.Toastify__close-button:focus,.Toastify__close-button:hover{opacity:1}@keyframes Toastify__trackProgress{0%{transform:scaleX(1)}to{transform:scaleX(0)}}.Toastify__progress-bar{bottom:0;height:5px;left:0;opacity:.7;position:absolute;transform-origin:left;width:100%;z-index:var(--toastify-z-index)}.Toastify__progress-bar--animated{animation:Toastify__trackProgress linear 1 forwards}.Toastify__progress-bar--controlled{transition:transform .2s}.Toastify__progress-bar--rtl{left:auto;right:0;transform-origin:right}.Toastify__spinner{animation:Toastify__spin .65s linear infinite;border:2px solid;border-color:var(--toastify-spinner-color-empty-area);border-radius:var(--vchasno-ui-border-radius-full);border-right-color:var(--toastify-spinner-color);box-sizing:border-box;height:20px;width:20px}@keyframes Toastify__bounceInRight{0%,60%,75%,90%,to{animation-timing-function:cubic-bezier(.215,.61,.355,1)}0%{opacity:0;transform:translate3d(3000px,0,0)}60%{opacity:1;transform:translate3d(-25px,0,0)}75%{transform:translate3d(10px,0,0)}90%{transform:translate3d(-5px,0,0)}to{transform:none}}@keyframes Toastify__bounceOutRight{20%{opacity:1;transform:translate3d(-20px,0,0)}to{opacity:0;transform:translate3d(2000px,0,0)}}@keyframes Toastify__bounceInLeft{0%,60%,75%,90%,to{animation-timing-function:cubic-bezier(.215,.61,.355,1)}0%{opacity:0;transform:translate3d(-3000px,0,0)}60%{opacity:1;transform:translate3d(25px,0,0)}75%{transform:translate3d(-10px,0,0)}90%{transform:translate3d(5px,0,0)}to{transform:none}}@keyframes Toastify__bounceOutLeft{20%{opacity:1;transform:translate3d(20px,0,0)}to{opacity:0;transform:translate3d(-2000px,0,0)}}@keyframes Toastify__bounceInUp{0%,60%,75%,90%,to{animation-timing-function:cubic-bezier(.215,.61,.355,1)}0%{opacity:0;transform:translate3d(0,3000px,0)}60%{opacity:1;transform:translate3d(0,-20px,0)}75%{transform:translate3d(0,10px,0)}90%{transform:translate3d(0,-5px,0)}to{transform:translateZ(0)}}@keyframes Toastify__bounceOutUp{20%{transform:translate3d(0,-10px,0)}40%,45%{opacity:1;transform:translate3d(0,20px,0)}to{opacity:0;transform:translate3d(0,-2000px,0)}}@keyframes Toastify__bounceInDown{0%,60%,75%,90%,to{animation-timing-function:cubic-bezier(.215,.61,.355,1)}0%{opacity:0;transform:translate3d(0,-3000px,0)}60%{opacity:1;transform:translate3d(0,25px,0)}75%{transform:translate3d(0,-10px,0)}90%{transform:translate3d(0,5px,0)}to{transform:none}}@keyframes Toastify__bounceOutDown{20%{transform:translate3d(0,10px,0)}40%,45%{opacity:1;transform:translate3d(0,-20px,0)}to{opacity:0;transform:translate3d(0,2000px,0)}}.Toastify__bounce-enter--bottom-left,.Toastify__bounce-enter--top-left{animation-name:Toastify__bounceInLeft}.Toastify__bounce-enter--bottom-right,.Toastify__bounce-enter--top-right{animation-name:Toastify__bounceInRight}.Toastify__bounce-enter--top-center{animation-name:Toastify__bounceInDown}.Toastify__bounce-enter--bottom-center{animation-name:Toastify__bounceInUp}.Toastify__bounce-exit--bottom-left,.Toastify__bounce-exit--top-left{animation-name:Toastify__bounceOutLeft}.Toastify__bounce-exit--bottom-right,.Toastify__bounce-exit--top-right{animation-name:Toastify__bounceOutRight}.Toastify__bounce-exit--top-center{animation-name:Toastify__bounceOutUp}.Toastify__bounce-exit--bottom-center{animation-name:Toastify__bounceOutDown}@keyframes Toastify__zoomIn{0%{opacity:0;transform:scale3d(.3,.3,.3)}50%{opacity:1}}@keyframes Toastify__zoomOut{0%{opacity:1}50%{opacity:0;transform:scale3d(.3,.3,.3)}to{opacity:0}}.Toastify__zoom-enter{animation-name:Toastify__zoomIn}.Toastify__zoom-exit{animation-name:Toastify__zoomOut}@keyframes Toastify__flipIn{0%{animation-timing-function:ease-in;opacity:0;transform:perspective(400px) rotateX(90deg)}40%{animation-timing-function:ease-in;transform:perspective(400px) rotateX(-20deg)}60%{opacity:1;transform:perspective(400px) rotateX(10deg)}80%{transform:perspective(400px) rotateX(-5deg)}to{transform:perspective(400px)}}@keyframes Toastify__flipOut{0%{transform:perspective(400px)}30%{opacity:1;transform:perspective(400px) rotateX(-20deg)}to{opacity:0;transform:perspective(400px) rotateX(90deg)}}.Toastify__flip-enter{animation-name:Toastify__flipIn}.Toastify__flip-exit{animation-name:Toastify__flipOut}@keyframes Toastify__slideInRight{0%{transform:translate3d(110%,0,0);visibility:visible}to{transform:translateZ(0)}}@keyframes Toastify__slideInLeft{0%{transform:translate3d(-110%,0,0);visibility:visible}to{transform:translateZ(0)}}@keyframes Toastify__slideInUp{0%{transform:translate3d(0,110%,0);visibility:visible}to{transform:translateZ(0)}}@keyframes Toastify__slideInDown{0%{transform:translate3d(0,-110%,0);visibility:visible}to{transform:translateZ(0)}}@keyframes Toastify__slideOutRight{0%{transform:translateZ(0)}to{transform:translate3d(110%,0,0);visibility:hidden}}@keyframes Toastify__slideOutLeft{0%{transform:translateZ(0)}to{transform:translate3d(-110%,0,0);visibility:hidden}}@keyframes Toastify__slideOutDown{0%{transform:translateZ(0)}to{transform:translate3d(0,500px,0);visibility:hidden}}@keyframes Toastify__slideOutUp{0%{transform:translateZ(0)}to{transform:translate3d(0,-500px,0);visibility:hidden}}.Toastify__slide-enter--bottom-left,.Toastify__slide-enter--top-left{animation-name:Toastify__slideInLeft}.Toastify__slide-enter--bottom-right,.Toastify__slide-enter--top-right{animation-name:Toastify__slideInRight}.Toastify__slide-enter--top-center{animation-name:Toastify__slideInDown}.Toastify__slide-enter--bottom-center{animation-name:Toastify__slideInUp}.Toastify__slide-exit--bottom-left,.Toastify__slide-exit--top-left{animation-name:Toastify__slideOutLeft}.Toastify__slide-exit--bottom-right,.Toastify__slide-exit--top-right{animation-name:Toastify__slideOutRight}.Toastify__slide-exit--top-center{animation-name:Toastify__slideOutUp}.Toastify__slide-exit--bottom-center{animation-name:Toastify__slideOutDown}@keyframes Toastify__spin{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}.vchasno-ui-snackbar .vchasno-ui-snackbar-toast{background:var(--vchasno-ui-snackbar-toast-background);border-radius:var(--toastify-toast-bd-radius);box-sizing:border-box;max-width:var(--vchasno-ui-snackbar-toast-max-width);min-width:var(--vchasno-ui-snackbar-toast-min-width);padding:5px 10px;width:auto}.vchasno-ui-snackbar .vchasno-ui-snackbar-body{padding:0 8px 0 0}.vchasno-ui-snackbar-with-action-container{align-items:center;display:flex;gap:26px;justify-content:space-between;padding-bottom:5px;padding-top:5px}.vchasno-ui-snackbar-action-button{border:none;color:var(--vchasno-ui-snackbar-action-button-color);cursor:pointer;flex-shrink:0;font-size:14px;font-weight:500;line-height:20px;margin-left:auto}.vchasno-ui-snackbar .Toastify__toast-icon{font-size:20px;margin-right:10px}.vchasno-ui-snackbar .Toastify__close-button{align-items:center;align-self:center;display:flex;justify-content:center}.vchasno-ui-SplashLogo__logo-box{--vchasno-ui-splash-screen-logo-box-width:300px;--vchasno-ui-splash-screen-logo-box-height:100px;--vchasno-ui-splash-screen-logo-color:#252d3d;--vchasno-ui-splash-screen-animation-duration:2s;animation:wave var(--vchasno-ui-splash-screen-animation-duration) infinite linear forwards;background-image:linear-gradient(to right,transparent,var(--vchasno-ui-splash-screen-logo-color),transparent);background-size:var(--vchasno-ui-splash-screen-logo-box-width) var(--vchasno-ui-splash-screen-logo-box-height);display:inline-block;height:var(--vchasno-ui-splash-screen-logo-box-height);width:var(--vchasno-ui-splash-screen-logo-box-width)}@keyframes wave{0%{background-position:calc(var(--vchasno-ui-splash-screen-logo-box-width)*-1) 0}to{background-position:0 0}}.vchasno-ui-SvgBorder{--vchasno-ui-svg-border-animation-duration-sec:1s;--vchasno-ui-svg-border-stroke-dashoffset:100%;position:relative}.vchasno-ui-SvgBorder__svg{left:0;overflow:visible;pointer-events:none;position:absolute;top:0;transform:translateZ(0);transition:var(--vchasno-ui-transition-duration-sec);z-index:-1}.vchasno-ui-SvgBorder__svg--animation-border-offset{animation:stroke-offset var(--vchasno-ui-svg-border-animation-duration-sec) linear infinite;animation-play-state:paused}.vchasno-ui-SvgBorder__svg--animation-play{animation-play-state:running}@keyframes stroke-offset{to{stroke-dashoffset:var(--vchasno-ui-svg-border-stroke-dashoffset)}}.vchasno-ui-switch{--vchasno-ui-switch-border-radius:100px;--vchasno-ui-switc-hcircle-size:calc(var(--vchasno-ui-switch-height) - 4px);align-content:center;cursor:pointer;display:inline-flex;line-height:var(--vchasno-ui-switch-height)}.vchasno-ui-switch.--sm{--vchasno-ui-switch-height:20px}.vchasno-ui-switch.--md{--vchasno-ui-switch-height:30px}.vchasno-ui-switch.--lg{--vchasno-ui-switch-height:40px}.vchasno-ui-switch--bg{aspect-ratio:36/20;background:var(--vchasno-ui-switch-color-bg);border-radius:var(--vchasno-ui-switch-border-radius);box-shadow:inset 0 2px 0 rgba(57,96,131,.2);box-sizing:border-box;display:inline-flex;flex-shrink:0;height:var(--vchasno-ui-switch-height,20px);position:relative;transition:background-color .3s;z-index:0}.vchasno-ui-switch__active .vchasno-ui-switch--bg{background:var(--vchasno-ui-switch-active-color-bg)}.vchasno-ui-switch__disabled{cursor:default;opacity:.7}.vchasno-ui-switch--circle{align-items:center;aspect-ratio:1/1;background-color:var(--vchasno-ui-switch-circle-color);border-radius:var(--vchasno-ui-border-radius-full);display:flex;height:var(--vchasno-ui-switc-hcircle-size);justify-content:center;left:0;position:absolute;top:0;transform:translate(2px,2px);transition:transform .3s}.vchasno-ui-switch--bg>input:checked+.vchasno-ui-switch--circle{transform:translate(18px,2px)}.vchasno-ui-switch.--md .vchasno-ui-switch--bg>input:checked+.vchasno-ui-switch--circle{transform:translate(26px,2px)}.vchasno-ui-switch.--lg .vchasno-ui-switch--bg>input:checked+.vchasno-ui-switch--circle{transform:translate(34px,2px)}.vchasno-ui-spinner{color:var(--vchasno-ui-switch-spinner-color)}.vchasno-ui-switch--label{color:var(--vchasno-ui-input-font-color);font-size:var(--vchasno-ui-input-font-size);margin-left:12px;user-select:none}.vchasno-ui-tabs-wrapper{-ms-overflow-style:none;position:relative;scrollbar-width:none;width:100%}.vchasno-ui-tabs-wrapper::-webkit-scrollbar{display:none}.--h-scroll{overflow:auto}.vchasno-ui-tabs-wrapper-root{position:relative}.vchasno-ui-tabs-wrapper-root:after,.vchasno-ui-tabs-wrapper-root:before{bottom:0;content:"";display:block;pointer-events:none;position:absolute;top:0;width:30px}.--ping-right:after{box-shadow:inset -12px 0 8px -8px rgb(0 0 0/8%);right:0}.--ping-left:before{box-shadow:inset 12px 0 8px -8px rgb(0 0 0/8%);left:0}.vchasno-ui-tabs{--active-color:var(--vchasno-ui-tabs-active-color);display:flex;font-size:16px;font-weight:500;position:relative}.vchasno-ui-tabs__indicator{background-color:var(--active-color);border-radius:var(--vchasno-ui-border-radius-sm);bottom:-1px;display:block;height:3px;left:0;position:absolute;transform:translateX(0);transition:transform var(--vchasno-ui-transition-duration-sec,.3s),width var(--vchasno-ui-transition-duration-sec,.3s);width:10px;z-index:1}.--h-scroll .vchasno-ui-tabs__indicator{display:none}.vchasno-ui-tabs-wrapper-root.--skip-animation .vchasno-ui-tabs__indicator{transition:none}.vchasno-ui-tabs__label-item{align-items:center;color:#252d3d;cursor:pointer;display:inline-flex;flex-grow:0;flex-shrink:0;height:50px;padding:0 15px;position:relative;transition:color var(--vchasno-ui-transition-duration-sec),background-color var(--vchasno-ui-transition-duration-sec);user-select:none}.vchasno-ui-tabs__label-item:after{background-color:var(--active-color);border-radius:var(--vchasno-ui-border-radius-sm);bottom:0;content:"";display:block;height:0;left:0;position:absolute;right:0;transition:height var(--vchasno-ui-transition-duration-sec);z-index:1}.--h-scroll .vchasno-ui-tabs__label-item.--active:after{height:3px}.vchasno-ui-tabs-wrapper:not(.--h-scroll) .vchasno-ui-tabs{border-bottom:1px solid #e2e9f3}.vchasno-ui-tabs__label-item.--active,.vchasno-ui-tabs__label-item:not(.--disabled):hover{color:var(--active-color)}.vchasno-ui-tabs__label-item.--disabled{cursor:not-allowed;opacity:.5}.vchasno-ui-textarea-input-container .vchasno-ui-input__wrapper{height:auto;padding-bottom:10px;padding-top:10px}.vchasno-ui-textarea-input{border:0;color:var(--vchasno-ui-text-primary-color);font-size:var(--vchasno-ui-input-font-size);line-height:calc(var(--vchasno-ui-input-font-size)*1.2);resize:none;width:100%}.vchasno-ui-textarea-input::placeholder{color:var(--vchasno-ui-input-placeholder-color);font-size:var(--vchasno-ui-input-font-size);line-height:calc(var(--vchasno-ui-input-font-size)*1.2);transition:color var(--vchasno-ui-transition-duration-sec,.3s)}.vchasno-ui-input__wrapper__label{transform:none}.vchasno-ui-textarea-input+.vchasno-ui-label-text{top:0;transform:translateY(10px);transition:transform var(--vchasno-ui-transition-duration-sec,.3s),font-size var(--vchasno-ui-transition-duration-sec,.3s)}.vchasno-ui-textarea-input:focus:not(.--disabled)+.vchasno-ui-label-text,.vchasno-ui-textarea-input:not(:placeholder-shown)+.vchasno-ui-label-text{top:0;transform:translateY(-12px)}.vchasno-ui-text-input{font-size:var(--vchasno-ui-input-font-size);line-height:var(--vchasno-ui-input-font-size)}.vchasno-ui-text-input::-webkit-inner-spin-button,.vchasno-ui-text-input::-webkit-outer-spin-button{appearance:none;margin:0}.vchasno-ui-text-input[type=number]{appearance:textfield}.vchasno-ui-text-input::placeholder{color:var(--vchasno-ui-input-placeholder-color);font-size:var(--vchasno-ui-input-font-size);line-height:var(--vchasno-ui-input-font-size);transition:color var(--vchasno-ui-transition-duration-sec,.3s)}@supports selector(:not(:placeholder-shown)){.vchasno-ui-input__clear-btn{transform:scale(0)}.vchasno-ui-text-input:not(:placeholder-shown)+.vchasno-ui-input__feedback .vchasno-ui-input__clear-btn{transform:scale(1)}.vchasno-ui-text-input:not(:placeholder-shown)+.vchasno-ui-label-text+.vchasno-ui-input__feedback .vchasno-ui-input__clear-btn{transform:scale(1)}}.vchasno-ui-title{color:var(--vchasno-ui-text-primary-color,#252d3d)}.vchasno-ui-title.--pretty{text-wrap:pretty}.vchasno-ui-title.--ellipsis{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.vchasno-ui-title h1,h1.vchasno-ui-title{font-size:32px;font-weight:700;line-height:40px}.vchasno-ui-title h2,h2.vchasno-ui-title{font-size:24px;font-weight:700;line-height:28px}.vchasno-ui-title h3,h3.vchasno-ui-title{font-size:20px;font-weight:500;line-height:24px}.vchasno-ui-title h4,h4.vchasno-ui-title{font-size:16px;font-weight:400;line-height:20px}.vchasno-ui-title h5,h5.vchasno-ui-title{font-size:12px;font-weight:400;line-height:14px}.vchasno-ui-PasswordInput{font-size:var(--vchasno-ui-input-font-size);line-height:var(--vchasno-ui-input-font-size);min-width:176px}.vchasno-ui-PasswordInput::-webkit-inner-spin-button,.vchasno-ui-PasswordInput::-webkit-outer-spin-button{appearance:none;margin:0}.vchasno-ui-PasswordInput::placeholder{color:var(--vchasno-ui-input-placeholder-color);font-size:var(--vchasno-ui-input-font-size);line-height:var(--vchasno-ui-input-font-size);transition:color var(--vchasno-ui-transition-duration-sec,.3s)}.vchasno-ui-PasswordInput--type-password{caret-color:var(--vchasno-ui-input-placeholder-color);font-family:Verdana,sans-serif}.vchasno-ui-PasswordInput--type-password:not(:placeholder-shown){letter-spacing:.2em}.vchasno-ui-PasswordInput__eye{color:var(--vchasno-ui-input-font-color-disabled);cursor:pointer;display:flex;flex-shrink:0;place-items:center center;position:absolute;right:16px;top:50%;transform:translateY(-50%);width:20px}.vchasno-ui-PasswordInput__eye--active{color:var(--vchasno-ui-input-placeholder-color)}.vchasno-ui-PasswordInput__eye svg{transition:color var(--vchasno-ui-transition-duration-sec,.3s)}.vchasno-ui-input__wrapper:has(.vchasno-ui-PasswordInput__eye){padding-right:40px}.vchasno-ui-input__wrapper:has(.vchasno-ui-PasswordInput__eye) .vchasno-ui-input__feedback{display:none}.vchasno-ui-slider.vchasno-ui-slider-root{height:2px}.vchasno-ui-slider .vchasno-ui-slider-mark{background-color:#e2e9f3;border-radius:var(--vchasno-ui-border-radius-full);height:8px;width:8px}.vchasno-ui-slider .vchasno-ui-slider-mark.MuiSlider-markActive{background-color:var(--vchasno-ui-slider-color)}.vchasno-ui-slider .vchasno-ui-slider-mark-label{color:var(--vchasno-ui-label-color-default)}.vchasno-ui-slider .vchasno-ui-slider-rail{background-color:#e2e9f3}.vchasno-ui-slider .vchasno-ui-slider-track{background-color:var(--vchasno-ui-slider-color);border-color:var(--vchasno-ui-slider-color)}.vchasno-ui-slider .vchasno-ui-slider-thumb{background-color:var(--vchasno-ui-slider-color);height:24px;width:24px}.vchasno-ui-slider .vchasno-ui-slider-thumb.Mui-focusVisible,.vchasno-ui-slider .vchasno-ui-slider-thumb:hover{box-shadow:0 0 0 8px var(--vchasno-ui-slider-thumb-box-shadow-color)}.vchasno-ui-slider .vchasno-ui-slider-thumb.Mui-active{box-shadow:0 0 0 14px var(--vchasno-ui-slider-thumb-box-shadow-color)}.vchasno-ui-breadcrumbs{font-size:14px;line-height:20px}.vchasno-ui-breadcrumbs-separator{margin:0 2px}.vchasno-ui-avatar{--avatar-size:40px;--avatar-font-size:16px;align-items:center;background-color:#e2e9f3;border-radius:var(--avatar-radius);color:#6e809a;display:inline-flex;font-size:var(--avatar-font-size);font-weight:var(--vchasno-ui-font-weight-medium);height:var(--avatar-size);justify-content:center;line-height:1;overflow:hidden;user-select:none;vertical-align:middle;width:var(--avatar-size)}.vchasno-ui-avatar,.vchasno-ui-avatar--shape-circular{--avatar-radius:var(--vchasno-ui-border-radius-full)}.vchasno-ui-avatar--shape-rounded{--avatar-radius:var(--vchasno-ui-border-radius-md)}.vchasno-ui-avatar--size-xs{--avatar-size:24px;--avatar-font-size:var(--vchasno-ui-font-size-2xs)}.vchasno-ui-avatar--size-sm{--avatar-size:32px;--avatar-font-size:var(--vchasno-ui-font-size-xs)}.vchasno-ui-avatar--size-md{--avatar-size:40px;--avatar-font-size:var(--vchasno-ui-font-size-md)}.vchasno-ui-avatar--size-lg{--avatar-size:56px;--avatar-font-size:var(--vchasno-ui-font-size-xl)}.vchasno-ui-avatar--size-xl{--avatar-size:88px;--avatar-font-size:var(--vchasno-ui-font-size-2xl)}.vchasno-ui-avatar__image{height:100%;object-fit:cover;width:100%}.vchasno-ui-avatar__fallback{align-items:center;display:flex;height:100%;justify-content:center;width:100%}
package/dist/index.d.ts CHANGED
@@ -9,7 +9,7 @@ export { composeBubblePath } from './components/BubbleBox/utils.js';
9
9
  export { default as Button, ButtonProps } from './components/Button/Button.js';
10
10
  export { default as Checkbox, CheckboxProps } from './components/Checkbox/Checkbox.js';
11
11
  export { DatePickerProps, default as Datepicker } from './components/Datepicker/DatePicker.js';
12
- export { default as DateRangePicker, DateRangePickerProps } from './components/Datepicker/DateRangePicker.js';
12
+ export { default as DateRangePicker, DateRangePickerProps } from './components/Datepicker/DateRangePicker/DateRangePicker.js';
13
13
  export { default as FlexBox, FlexBoxProps } from './components/FlexBox/FlexBox.js';
14
14
  export { default as FollowUs, FollowUsProps } from './components/FollowUs/FollowUs.js';
15
15
  export { default as Input, InputProps } from './components/Input/Input.js';
package/dist/index.js CHANGED
@@ -1,2 +1,2 @@
1
- export{default as BodyPortal}from"./components/BodyPortal/BodyPortal.js";export{default as ScrollableBox}from"./components/ScrollableBox/ScrollableBox.js";export{useElementScrollable}from"./components/ScrollableBox/useElementScrollable.js";export{default as FullScreenModal}from"./components/FullScreenModal/FullScreenModal.js";export{default as Alert}from"./components/Alert/Alert.js";export{default as BlackTooltip}from"./components/BlackTooltip/BlackTooltip.js";export{default as BubbleBox}from"./components/BubbleBox/BubbleBox.js";export{composeBubblePath}from"./components/BubbleBox/utils.js";export{default as Button}from"./components/Button/Button.js";export{default as Checkbox}from"./components/Checkbox/Checkbox.js";export{default as Datepicker}from"./components/Datepicker/DatePicker.js";export{default as DateRangePicker}from"./components/Datepicker/DateRangePicker.js";export{default as FlexBox}from"./components/FlexBox/FlexBox.js";export{default as FollowUs}from"./components/FollowUs/FollowUs.js";export{default as Input}from"./components/Input/Input.js";export{default as InputMeta}from"./components/InputMeta/InputMeta.js";export{default as LabelText}from"./components/LabelText/LabelText.js";export{default as MaskInput}from"./components/MaskInput/MaskInput.js";export{default as Menu}from"./components/Menu/Menu.js";export{MenuButton}from"./components/MenuButton/MenuButton.js";export{MenuItem}from"./components/MenuItem/MenuItem.js";export{default as MobileAppLinks}from"./components/MobileAppLinks/MobileAppLinks.js";export{default as Pagination}from"./components/Pagination/Pagination.js";export{BasePagination}from"./components/Pagination/BasePagination.js";export{default as Paragraph}from"./components/Paragraph/Paragraph.js";export{default as ProjectsPopover}from"./components/ProjectsPopover/ProjectsPopover.js";export{default as PulseDot}from"./components/PulseDot/PulseDot.js";export{default as Select,SelectComponents}from"./components/Select/Select.js";export{default as SelectCreatable}from"./components/Select/SelectCreatable.js";export{default as AsyncSelect}from"./components/Select/AsyncSelect.js";export{default as Snackbar,snackbarToast}from"./components/Snackbar/Snackbar.js";export{default as Spinner}from"./components/Spinner/Spinner.js";export{default as SplashLogo}from"./components/SplashLogo/SplashLogo.js";export{default as SvgBorder}from"./components/SvgBorder/SvgBorder.js";export{composeRoundedBorderPath}from"./components/SvgBorder/utils.js";export{default as Switch}from"./components/Switch/Switch.js";export{default as Tabs}from"./components/Tabs/Tabs.js";export{default as Text}from"./components/Text/Text.js";export{default as TextAreaInput}from"./components/TextAreaInput/TextAreaInput.js";export{default as TextInput}from"./components/TextInput/TextInput.js";export{default as Title}from"./components/Title/Title.js";export{useClientRect}from"./hooks/useClientRect.js";export{default as PasswordInput}from"./components/PasswordInput/PasswordInput.js";export{default as Slider}from"./components/Slider/Slider.js";export{default as SnowEffect}from"./components/SnowEffect/SnowEffect.js";export{default as Breadcrumbs}from"./components/Breadcrumbs/Breadcrumbs.js";export{default as Avatar}from"./components/Avatar/Avatar.js";
1
+ export{default as BodyPortal}from"./components/BodyPortal/BodyPortal.js";export{default as ScrollableBox}from"./components/ScrollableBox/ScrollableBox.js";export{useElementScrollable}from"./components/ScrollableBox/useElementScrollable.js";export{default as FullScreenModal}from"./components/FullScreenModal/FullScreenModal.js";export{default as Alert}from"./components/Alert/Alert.js";export{default as BlackTooltip}from"./components/BlackTooltip/BlackTooltip.js";export{default as BubbleBox}from"./components/BubbleBox/BubbleBox.js";export{composeBubblePath}from"./components/BubbleBox/utils.js";export{default as Button}from"./components/Button/Button.js";export{default as Checkbox}from"./components/Checkbox/Checkbox.js";export{default as Datepicker}from"./components/Datepicker/DatePicker.js";export{default as DateRangePicker}from"./components/Datepicker/DateRangePicker/DateRangePicker.js";export{default as FlexBox}from"./components/FlexBox/FlexBox.js";export{default as FollowUs}from"./components/FollowUs/FollowUs.js";export{default as Input}from"./components/Input/Input.js";export{default as InputMeta}from"./components/InputMeta/InputMeta.js";export{default as LabelText}from"./components/LabelText/LabelText.js";export{default as MaskInput}from"./components/MaskInput/MaskInput.js";export{default as Menu}from"./components/Menu/Menu.js";export{MenuButton}from"./components/MenuButton/MenuButton.js";export{MenuItem}from"./components/MenuItem/MenuItem.js";export{default as MobileAppLinks}from"./components/MobileAppLinks/MobileAppLinks.js";export{default as Pagination}from"./components/Pagination/Pagination.js";export{BasePagination}from"./components/Pagination/BasePagination.js";export{default as Paragraph}from"./components/Paragraph/Paragraph.js";export{default as ProjectsPopover}from"./components/ProjectsPopover/ProjectsPopover.js";export{default as PulseDot}from"./components/PulseDot/PulseDot.js";export{default as Select,SelectComponents}from"./components/Select/Select.js";export{default as SelectCreatable}from"./components/Select/SelectCreatable.js";export{default as AsyncSelect}from"./components/Select/AsyncSelect.js";export{default as Snackbar,snackbarToast}from"./components/Snackbar/Snackbar.js";export{default as Spinner}from"./components/Spinner/Spinner.js";export{default as SplashLogo}from"./components/SplashLogo/SplashLogo.js";export{default as SvgBorder}from"./components/SvgBorder/SvgBorder.js";export{composeRoundedBorderPath}from"./components/SvgBorder/utils.js";export{default as Switch}from"./components/Switch/Switch.js";export{default as Tabs}from"./components/Tabs/Tabs.js";export{default as Text}from"./components/Text/Text.js";export{default as TextAreaInput}from"./components/TextAreaInput/TextAreaInput.js";export{default as TextInput}from"./components/TextInput/TextInput.js";export{default as Title}from"./components/Title/Title.js";export{useClientRect}from"./hooks/useClientRect.js";export{default as PasswordInput}from"./components/PasswordInput/PasswordInput.js";export{default as Slider}from"./components/Slider/Slider.js";export{default as SnowEffect}from"./components/SnowEffect/SnowEffect.js";export{default as Breadcrumbs}from"./components/Breadcrumbs/Breadcrumbs.js";export{default as Avatar}from"./components/Avatar/Avatar.js";
2
2
  //# sourceMappingURL=index.js.map
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@vchasno/ui-kit",
3
- "version": "0.4.98",
3
+ "version": "0.4.100",
4
4
  "description": "React UI components for Vchasno applications",
5
5
  "main": "dist/index.js",
6
6
  "module": "dist/index.js",
@@ -1,33 +0,0 @@
1
- import React from 'react';
2
- import { ReactDatePickerProps } from 'react-datepicker';
3
- import Select from '../Select/Select.js';
4
- import { LoadingFeedback, WithHint, ErrorFeedback, DataQa, HideEmptyMeta, WithPulseAnimation } from '../types.js';
5
-
6
- interface DateRangePickerProps extends Partial<LoadingFeedback & WithHint & ErrorFeedback & DataQa & HideEmptyMeta & WithPulseAnimation> {
7
- startDate: Date | null;
8
- endDate: Date | null;
9
- onChange: (dates: [Date | null, Date | null]) => void;
10
- label?: string;
11
- disabled?: boolean;
12
- required?: boolean;
13
- isClearable?: boolean;
14
- wide?: boolean;
15
- minDate?: Date;
16
- maxDate?: Date;
17
- dateFormat?: string;
18
- className?: string;
19
- popperClassName?: string;
20
- portalId?: string;
21
- cancelLabel?: string;
22
- saveLabel?: string;
23
- locale?: ReactDatePickerProps['locale'];
24
- presets?: {
25
- label: string;
26
- range: [Date, Date];
27
- }[];
28
- presetPlaceholder?: string;
29
- presetSelectProps?: Omit<React.ComponentProps<typeof Select>, 'options' | 'onChange' | 'value'>;
30
- }
31
- declare const DateRangePicker: React.FC<DateRangePickerProps>;
32
-
33
- export { type DateRangePickerProps, DateRangePicker as default };
@@ -1,2 +0,0 @@
1
- import e from"react";import t from"react-datepicker";import a from"classnames";import{format as n}from"date-fns";import{uk as r}from"date-fns/locale/uk";import l from"../../icons/arrowLeft.js";import c from"../../icons/arrowRight.js";import o from"../../icons/calendar.js";import i from"../../icons/clear.js";import s from"../InputMeta/InputMeta.js";import u from"../LabelText/LabelText.js";import m from"../Select/Select.js";import"../Select/SelectCreatable.js";import"react-select/async";import"react-select";import p from"../Spinner/Spinner.js";let d=()=>e.createElement("span",{className:"vchasno-ui-date-range-picker__custom-close-icon"},i),h=({startDate:i,endDate:h,onChange:b,label:k,disabled:v,required:_,loading:g,hint:f,error:y,className:E,dateFormat:N="dd/MM/yyyy",dataQa:C,hideEmptyMeta:S=!1,wide:w=!1,pulse:j,isClearable:L=!1,minDate:x,maxDate:D,popperClassName:A,portalId:q,cancelLabel:M="Скасувати",saveLabel:I="Зберегти",locale:R=r,presets:T=[],presetPlaceholder:O="Обрати період",presetSelectProps:P,...F})=>{let[H,$]=e.useState(!1),[K,z]=e.useState(null),[B,G]=e.useState(null),[J,Q]=e.useState(null);e.useEffect(()=>{if(!H)return;let e=()=>{let e=document.querySelector(".vchasno-ui-date-range-picker-popper");e&&e.querySelectorAll(".react-datepicker__day--outside-month").forEach(e=>{if(e.textContent?.trim())return;let t=(e.getAttribute("aria-label")??"").match(/\d+/);t?.[0]&&(e.textContent=t[0])})},t=requestAnimationFrame(e),a=document.querySelector(".vchasno-ui-date-range-picker-popper"),n=new MutationObserver(e);return a&&n.observe(a,{childList:!0,subtree:!0}),()=>{cancelAnimationFrame(t),n.disconnect()}},[H]);let U=()=>{z(i),G(h),Q(null),$(!1)},V=(()=>{if(!i&&!h)return"";let e=i?n(i,N):"",t=h?n(h,N):"";return e&&t?`${e} - ${t}`:e||""})(),W=!!i||!!h;return e.createElement("label",{onClick:e=>e.preventDefault(),"data-qa":C,className:a("vchasno-ui-date-picker","vchasno-ui-date-range-picker",{"--loading":g,"--required":_,"--disabled":v,"--error":y,"--wide":w,"--not-empty":W,"--is-label":!!k},E),onKeyDown:e=>{"Escape"===e.key&&H&&U()}},e.createElement("span",{className:a("vchasno-ui-date-range-picker__wrapper",{"vchasno-ui-pulse-animation":j&&!v})},k&&e.createElement(u,null,k),e.createElement(t,{fixedHeight:!0,locale:R,disabled:v,placeholderText:"ДД/ММ/РРРР - ДД/ММ/РРРР",showPopperArrow:!1,className:a("vchasno-ui-date-range-picker__picker","vchasno-ui-date-picker__picker"),popperClassName:a("vchasno-ui-date-range-picker-popper",A),selectsRange:!0,startDate:H?K:i,endDate:H?B:h,onChange:e=>{let[t,a]=e;z(t),G(a),Q(null)},monthsShown:2,shouldCloseOnSelect:!1,open:H,onInputClick:()=>{v||(z(i),G(h),$(!0))},onClickOutside:U,enableTabLoop:!1,minDate:x,maxDate:D,portalId:q,value:V,renderCustomHeader:({monthDate:t,decreaseMonth:a,increaseMonth:r,prevMonthButtonDisabled:o,nextMonthButtonDisabled:i})=>e.createElement("div",{className:"vchasno-ui-date-range-picker__header"},e.createElement("button",{type:"button",className:"vchasno-ui-date-range-picker__nav-btn",onClick:a,disabled:o},e.createElement(l,null)),e.createElement("span",{className:"vchasno-ui-date-range-picker__month-title"},n(t,"LLLL, yyyy",{locale:"string"==typeof R?void 0:R})),e.createElement("button",{type:"button",className:"vchasno-ui-date-range-picker__nav-btn",onClick:r,disabled:i},e.createElement(c,null))),...F},T.length>0&&e.createElement("div",{className:"vchasno-ui-date-range-picker__presets"},e.createElement(m,{className:"vchasno-ui-date-range-picker__preset-select",isClearable:!0,options:T.map(e=>({label:e.label,value:e.label})),value:J,placeholder:O,onChange:e=>{let t=Array.isArray(e)?null:e;if(!t){Q(null),z(null),G(null);return}let a=T.find(e=>e.label===t.value);a&&(Q(t),z(a.range[0]),G(a.range[1]))},hideEmptyMeta:!0,wide:!0,...P})),e.createElement("div",{className:"vchasno-ui-date-range-picker__actions"},e.createElement("button",{type:"button",className:"vchasno-ui-date-range-picker__cancel-btn",onClick:U},M),e.createElement("button",{type:"button",className:"vchasno-ui-date-range-picker__save-btn",onClick:()=>{b([K,B]),$(!1)}},I))),g?e.createElement(p,{className:"vchasno-ui-date-range-picker__spinner"}):e.createElement(o,{className:"vchasno-ui-date-range-picker__custom-calendar-icon"}),L&&W&&!v&&e.createElement("button",{type:"button","aria-label":"Очистити",className:"vchasno-ui-date-range-picker__clear-btn",onClick:()=>{b([null,null]),z(null),G(null),Q(null)}},e.createElement(d,null))),!S||y||f?e.createElement(s,{hint:f,error:y}):null)};h.displayName="DateRangePicker";export{h as default};
2
- //# sourceMappingURL=DateRangePicker.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"DateRangePicker.js","sources":["../../../src/components/Datepicker/DateRangePicker.tsx"],"sourcesContent":["import React from 'react';\nimport type { ReactDatePickerProps } from 'react-datepicker';\nimport ReactDatePicker from 'react-datepicker';\n\nimport cn from 'classnames';\nimport { format } from 'date-fns';\nimport { uk } from 'date-fns/locale/uk';\n\nimport ArrowLeftIcon from '../../icons/arrowLeft';\nimport ArrowRightIcon from '../../icons/arrowRight';\nimport CalendarIcon from '../../icons/calendar';\nimport clearRawSvg from '../../icons/clear';\nimport InputMeta from '../InputMeta';\nimport LabelText from '../LabelText';\nimport Select from '../Select';\nimport type { SelectOption } from '../Select';\nimport Spinner from '../Spinner';\nimport type {\n DataQa,\n ErrorFeedback,\n HideEmptyMeta,\n LoadingFeedback,\n WithHint,\n WithPulseAnimation,\n} from '../types';\n\nimport './DatePicker.global.css';\nimport './DateRangePicker.global.css';\n\nconst CloseSvg = () => (\n <span className=\"vchasno-ui-date-range-picker__custom-close-icon\">{clearRawSvg}</span>\n);\n\nexport interface DateRangePickerProps\n extends Partial<\n LoadingFeedback & WithHint & ErrorFeedback & DataQa & HideEmptyMeta & WithPulseAnimation\n > {\n startDate: Date | null;\n endDate: Date | null;\n onChange: (dates: [Date | null, Date | null]) => void;\n label?: string;\n disabled?: boolean;\n required?: boolean;\n isClearable?: boolean;\n wide?: boolean;\n minDate?: Date;\n maxDate?: Date;\n dateFormat?: string;\n className?: string;\n popperClassName?: string;\n portalId?: string;\n cancelLabel?: string;\n saveLabel?: string;\n locale?: ReactDatePickerProps['locale'];\n presets?: { label: string; range: [Date, Date] }[];\n presetPlaceholder?: string;\n presetSelectProps?: Omit<React.ComponentProps<typeof Select>, 'options' | 'onChange' | 'value'>;\n}\n\nconst DateRangePicker: React.FC<DateRangePickerProps> = ({\n startDate,\n endDate,\n onChange,\n label,\n disabled,\n required,\n loading,\n hint,\n error,\n className,\n dateFormat = 'dd/MM/yyyy',\n dataQa,\n hideEmptyMeta = false,\n wide = false,\n pulse,\n isClearable = false,\n minDate,\n maxDate,\n popperClassName,\n portalId,\n cancelLabel = 'Скасувати',\n saveLabel = 'Зберегти',\n locale = uk,\n presets = [],\n presetPlaceholder = 'Обрати період',\n presetSelectProps,\n ...props\n}) => {\n const [isOpen, setIsOpen] = React.useState(false);\n const [tempStartDate, setTempStartDate] = React.useState<Date | null>(null);\n const [tempEndDate, setTempEndDate] = React.useState<Date | null>(null);\n const [selectedPreset, setSelectedPreset] = React.useState<SelectOption | null>(null);\n\n // react-datepicker hides outside-month day text when monthsShown > 1\n // (monthShowsDuplicateDaysStart/End). This effect restores the day numbers\n // by reading each cell's aria-label and extracting the date.\n React.useEffect(() => {\n if (!isOpen) return;\n\n const fillEmptyDays = () => {\n const container = document.querySelector('.vchasno-ui-date-range-picker-popper');\n if (!container) return;\n container.querySelectorAll('.react-datepicker__day--outside-month').forEach((el) => {\n if (el.textContent?.trim()) return;\n const ariaLabel = el.getAttribute('aria-label') ?? '';\n const match = ariaLabel.match(/\\d+/);\n if (match?.[0]) {\n el.textContent = match[0];\n }\n });\n };\n\n const frame = requestAnimationFrame(fillEmptyDays);\n\n const container = document.querySelector('.vchasno-ui-date-range-picker-popper');\n const observer = new MutationObserver(fillEmptyDays);\n if (container) {\n observer.observe(container, { childList: true, subtree: true });\n }\n\n return () => {\n cancelAnimationFrame(frame);\n observer.disconnect();\n };\n }, [isOpen]);\n\n const handleOpen = () => {\n if (disabled) return;\n setTempStartDate(startDate);\n setTempEndDate(endDate);\n setIsOpen(true);\n };\n\n const handleTempChange = (dates: [Date | null, Date | null]) => {\n const [start, end] = dates;\n setTempStartDate(start);\n setTempEndDate(end);\n setSelectedPreset(null);\n };\n\n const handleSave = () => {\n onChange([tempStartDate, tempEndDate]);\n setIsOpen(false);\n };\n\n const handleCancel = () => {\n setTempStartDate(startDate);\n setTempEndDate(endDate);\n setSelectedPreset(null);\n setIsOpen(false);\n };\n\n const handleClear = () => {\n onChange([null, null]);\n setTempStartDate(null);\n setTempEndDate(null);\n setSelectedPreset(null);\n };\n\n const handlePresetChange = (newValue: SelectOption | readonly SelectOption[] | null) => {\n const option = Array.isArray(newValue) ? null : (newValue as SelectOption | null);\n if (!option) {\n setSelectedPreset(null);\n setTempStartDate(null);\n setTempEndDate(null);\n return;\n }\n const preset = presets.find((p) => p.label === option.value);\n if (preset) {\n setSelectedPreset(option);\n setTempStartDate(preset.range[0]);\n setTempEndDate(preset.range[1]);\n }\n };\n\n const handleKeyDown = (e: React.KeyboardEvent) => {\n if (e.key === 'Escape' && isOpen) {\n handleCancel();\n }\n };\n\n const formatDisplayValue = (): string => {\n if (!startDate && !endDate) return '';\n const startStr = startDate ? format(startDate, dateFormat) : '';\n const endStr = endDate ? format(endDate, dateFormat) : '';\n if (startStr && endStr) return `${startStr} - ${endStr}`;\n if (startStr) return startStr;\n return '';\n };\n\n const displayValue = formatDisplayValue();\n const valueExists = !!startDate || !!endDate;\n\n return (\n <label\n onClick={(e) => e.preventDefault()}\n data-qa={dataQa}\n className={cn(\n 'vchasno-ui-date-picker',\n 'vchasno-ui-date-range-picker',\n {\n '--loading': loading,\n '--required': required,\n '--disabled': disabled,\n '--error': error,\n '--wide': wide,\n '--not-empty': valueExists,\n '--is-label': !!label,\n },\n className,\n )}\n onKeyDown={handleKeyDown}\n >\n <span\n className={cn('vchasno-ui-date-range-picker__wrapper', {\n 'vchasno-ui-pulse-animation': pulse && !disabled,\n })}\n >\n {label && <LabelText>{label}</LabelText>}\n <ReactDatePicker\n fixedHeight\n locale={locale}\n disabled={disabled}\n placeholderText=\"ДД/ММ/РРРР - ДД/ММ/РРРР\"\n showPopperArrow={false}\n className={cn(\n 'vchasno-ui-date-range-picker__picker',\n 'vchasno-ui-date-picker__picker',\n )}\n popperClassName={cn('vchasno-ui-date-range-picker-popper', popperClassName)}\n selectsRange\n startDate={isOpen ? tempStartDate : startDate}\n endDate={isOpen ? tempEndDate : endDate}\n onChange={handleTempChange}\n monthsShown={2}\n shouldCloseOnSelect={false}\n open={isOpen}\n onInputClick={handleOpen}\n onClickOutside={handleCancel}\n enableTabLoop={false}\n minDate={minDate}\n maxDate={maxDate}\n portalId={portalId}\n value={displayValue}\n renderCustomHeader={({\n monthDate,\n decreaseMonth,\n increaseMonth,\n prevMonthButtonDisabled,\n nextMonthButtonDisabled,\n }) => (\n <div className=\"vchasno-ui-date-range-picker__header\">\n <button\n type=\"button\"\n className=\"vchasno-ui-date-range-picker__nav-btn\"\n onClick={decreaseMonth}\n disabled={prevMonthButtonDisabled}\n >\n <ArrowLeftIcon />\n </button>\n <span className=\"vchasno-ui-date-range-picker__month-title\">\n {format(monthDate, 'LLLL, yyyy', {\n locale: typeof locale === 'string' ? undefined : locale,\n })}\n </span>\n <button\n type=\"button\"\n className=\"vchasno-ui-date-range-picker__nav-btn\"\n onClick={increaseMonth}\n disabled={nextMonthButtonDisabled}\n >\n <ArrowRightIcon />\n </button>\n </div>\n )}\n {...props}\n >\n {presets.length > 0 && (\n <div className=\"vchasno-ui-date-range-picker__presets\">\n <Select\n className=\"vchasno-ui-date-range-picker__preset-select\"\n isClearable\n options={presets.map((p) => ({\n label: p.label,\n value: p.label,\n }))}\n value={selectedPreset}\n placeholder={presetPlaceholder}\n onChange={handlePresetChange}\n hideEmptyMeta\n wide\n {...presetSelectProps}\n />\n </div>\n )}\n <div className=\"vchasno-ui-date-range-picker__actions\">\n <button\n type=\"button\"\n className=\"vchasno-ui-date-range-picker__cancel-btn\"\n onClick={handleCancel}\n >\n {cancelLabel}\n </button>\n <button\n type=\"button\"\n className=\"vchasno-ui-date-range-picker__save-btn\"\n onClick={handleSave}\n >\n {saveLabel}\n </button>\n </div>\n </ReactDatePicker>\n {loading ? (\n <Spinner className=\"vchasno-ui-date-range-picker__spinner\" />\n ) : (\n <CalendarIcon className=\"vchasno-ui-date-range-picker__custom-calendar-icon\" />\n )}\n {isClearable && valueExists && !disabled && (\n <button\n type=\"button\"\n aria-label=\"Очистити\"\n className=\"vchasno-ui-date-range-picker__clear-btn\"\n onClick={handleClear}\n >\n <CloseSvg />\n </button>\n )}\n </span>\n {hideEmptyMeta && !error && !hint ? null : <InputMeta hint={hint} error={error} />}\n </label>\n );\n};\n\nDateRangePicker.displayName = 'DateRangePicker';\n\nexport default DateRangePicker;\n"],"names":["CloseSvg","React","span","className","clearRawSvg","DateRangePicker","startDate","endDate","onChange","label","disabled","required","loading","hint","error","dateFormat","dataQa","hideEmptyMeta","wide","pulse","isClearable","minDate","maxDate","popperClassName","portalId","cancelLabel","saveLabel","locale","uk","presets","presetPlaceholder","presetSelectProps","props","isOpen","setIsOpen","useState","tempStartDate","setTempStartDate","tempEndDate","setTempEndDate","selectedPreset","setSelectedPreset","useEffect","fillEmptyDays","container","document","querySelector","querySelectorAll","forEach","el","textContent","trim","match","ariaLabel","getAttribute","frame","requestAnimationFrame","observer","MutationObserver","observe","childList","subtree","cancelAnimationFrame","disconnect","handleCancel","displayValue","formatDisplayValue","startStr","format","endStr","valueExists","onClick","e","preventDefault","data-qa","cn","onKeyDown","key","createElement","LabelText","ReactDatePicker","fixedHeight","placeholderText","showPopperArrow","selectsRange","dates","start","end","monthsShown","shouldCloseOnSelect","open","onInputClick","onClickOutside","enableTabLoop","value","renderCustomHeader","monthDate","decreaseMonth","increaseMonth","prevMonthButtonDisabled","nextMonthButtonDisabled","div","button","type","ArrowLeftIcon","undefined","ArrowRightIcon","length","Select","options","map","p","placeholder","newValue","option","Array","isArray","preset","find","range","Spinner","CalendarIcon","aria-label","InputMeta","displayName"],"mappings":"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"}