@itcase/ui-web 1.10.22 → 1.10.24
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/dist/{DatePicker_cjs_Bk4MiKf1.js → DatePicker_cjs_Nh9EgPcT.js} +1 -1
- package/dist/{DatePicker_es_CEDY1nRx.js → DatePicker_es_DbD0yr_Y.js} +1 -1
- package/dist/cjs/components/DatePeriod.js +1 -1
- package/dist/cjs/components/DatePicker.js +1 -1
- package/dist/cjs/components/Tab.js +1 -1
- package/dist/components/DatePeriod.js +1 -1
- package/dist/components/DatePicker.js +1 -1
- package/dist/components/Tab.js +1 -1
- package/dist/types/components/DatePeriod/DatePeriod.interface.d.ts +8 -1
- package/dist/types/components/DatePeriod/DatePeriod.js +5 -3
- package/dist/types/components/DatePeriod/__test__/DatePeriodTest.stories.js +1 -1
- package/dist/types/components/DatePicker/DatePicker.js +1 -1
- package/dist/types/components/Tab/Tab.js +1 -1
- package/package.json +3 -3
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";var e=require("react/jsx-runtime"),t=require("react"),a=require("clsx"),r=require("date-fns/locale"),i=require("react-datepicker"),n=require("@itcase/ui-core/hooks"),o=require("./Button_cjs_C57gpGui.js"),c=require("./primitives_cjs_aZVOWoZJ.js"),s=require("./Input_cjs_D9PxC_lJ.js"),l=require("./default_cjs_BMdcKzhJ.js");const p={surfacePrimary:{dayTextColor:"surfaceTextPrimary",dayTextShape:"rounded",iconFillHover:"surfaceSecondary",iconItemFill:"surfaceItemPrimary",iconShape:"circular",monthTextColor:"surfaceTextPrimary",monthTextWeight:"400",yearTextColor:"surfaceTextPrimary",yearTextWeight:"400"},...{sizeL:{size:"l",daySize:"xs",dayTextSize:"m",iconFillSize:"24",iconLeft:l.icons14.Arrow.ChevronLeft,iconRight:l.icons14.Arrow.ChevronRight},sizeM:{size:"m",daySize:"xxl",dayTextSize:"m",iconFillSize:"24",iconLeft:l.icons14.Arrow.ChevronLeft,iconRight:l.icons14.Arrow.ChevronRight,iconSize:"14",monthTextSize:"m",yearTextSize:"m"},sizeS:{size:"s",daySize:"xs",dayTextSize:"m",iconFillSize:"24",iconLeft:l.icons14.Arrow.ChevronLeft,iconRight:l.icons14.Arrow.ChevronRight}},solid:{inputProps:{borderColor:"none"}},outlined:{inputProps:{fill:"none"}},full:{},ghost:{inputProps:{fill:"none",borderColor:"none"}}},u=e=>{const t=e.getDay()||7,a=new Date(e);a.setDate(e.getDate()-(t-1));const r=new Date(a);return r.setDate(a.getDate()+6),{mondayDate:a,sundayDate:r}},d={appearance:p,setAppearance:e=>{d.appearance=e}};const m=t.forwardRef((r,i)=>{const{inputIcon:n,inputProps:o,value:c,isClearable:l}=r,p=t.useMemo(()=>{if(c){const e=c.split(" - ");return e[0]===e[1]?e[0]:c}return""},[c]);return e.jsxs(t.Fragment,{children:[e.jsx(s.Input,{...r,...o,className:a(o?.className,"datepicker__input"),ref:i,autocomplete:"off",value:p}),n&&e.jsx(x,{...o}),l&&e.jsx(h,{datepickerRef:r.datepickerRef,...o})]})});function h(r){const{clearButton:i,clearButtonAppearance:n,clearIcon:s,clearIconAppearance:l,clearIconSrc:p,datepickerRef:u}=r,d=t.useCallback(e=>{u?.current?.onClearClick(e),u?.current?.handleFocus(e)},[]);return e.jsx(t.Fragment,{children:i?e.jsx(o.Button,{appearance:n,className:a("react-datepicker__clear-button","cursor_type_pointer"),label:i,onClick:d}):(s||p)&&e.jsx(c.Icon,{appearance:l,className:a("react-datepicker__clear-icon","cursor_type_pointer"),imageSrc:p,SvgImage:s,onClick:d})})}function x(t){const{inputIcon:r,inputIconFill:i,inputIconFillHover:n,inputIconFillSize:o,inputIconItemFill:s,inputIconShape:l,inputIconSize:p,inputIconSrc:u,onClick:d}=t;return e.jsx(c.Icon,{className:a("react-datepicker__input-icon","cursor_type_pointer"),size:p,fill:i,fillHover:n,fillSize:o,iconFill:s,imageSrc:u,shape:l,SvgImage:r,onClick:()=>d&&d()})}exports.DatePickerInput=function(s){const{className:l,dataTestId:p,dataTour:h,datePickerProps:x={},endValue:f,inputProps:y={},value:k,onChange:C}=s,{appearance:S,customTimeInput:g,disablePastDays:_,monthsShown:z,selectsRange:I,showWeekNumbers:v,showWeekPicker:T}=x,j=n.useAppearanceConfig(S,d),D=n.useDevicePropsGenerator(x,j),{daySize:P,dayTextColor:b,dayTextShape:F,dayTextSize:w,iconFill:N,iconFillHover:R,iconFillSize:A,iconItemFill:q,iconLeft:L,iconRight:W,iconShape:H,monthTextColor:B,monthTextSize:M,monthTextWeight:$,popper:O,popperPlacement:U,sizeClass:G,widthClass:V,yearTextColor:E,yearTextSize:J,yearTextWeight:K,isClearable:Q}=D,X=t.useRef(null),[Y,Z]=t.useMemo(()=>{let e,t;return k&&(e="string"==typeof k?new Date(k):k),f&&(t="string"==typeof f?new Date(f):f),[e,t]},[k,f]),ee=t.useCallback(e=>{const t=Array.isArray(e)?e:[e],[a,r]=t;if(a&&T){const{mondayDate:e,sundayDate:t}=u(a);C?.(e,t)}else C?.(a,r)},[T,C]),te=t.useCallback(e=>{const{mondayDate:t,sundayDate:a}=u(e);C?.(t,a)},[C]),ae=t.useCallback((t,a)=>e.jsx(o.Button,{className:"react-datepicker__day-button",size:P,label:a.getDate().toString(),labelTextColor:b,labelTextSize:w,shape:F}),[P,b,F,w]),re=t.useCallback(({decreaseMonth:t,increaseMonth:a,monthDate:r})=>e.jsxs("div",{className:"react-datepicker__header--div",children:[L&&e.jsx(c.Icon,{className:"react-datepicker__icon",fill:N,fillHover:R,fillSize:A,iconFill:q,shape:H,SvgImage:L,onClick:t}),e.jsxs("div",{className:"react-datepicker__data",children:[e.jsx(c.Text,{className:"react-datepicker__month",size:M,textColor:B,textWeight:$,children:r.toLocaleString("ru-RU",{month:"long"})}),e.jsx(c.Text,{className:"react-datepicker__year",size:J,textColor:E,textWeight:K,children:r.toLocaleString("ru-RU",{year:"numeric"})})]}),W&&e.jsx(c.Icon,{className:"react-datepicker__icon",fill:N,fillHover:R,fillSize:A,iconFill:q,shape:H,SvgImage:W,onClick:a})]}),[N,R,A,q,L,W,H,B,M,$,E,J,K]),{styles:ie}=n.useStyles(s);return e.jsx("div",{className:a(l,"datepicker",z&&"datepicker_multiple-months",g&&"datepicker_button",G&&`datepicker_size_${G}`,V&&`datepicker_width_${V}`),"data-testid":p,"data-tour":h,style:ie,children:e.jsx(i,{ref:X,...x,minDate:_?new Date:void 0,customInput:e.jsx(m,{datepickerRef:X,inputProps:y,isClearable:Q}),endDate:I?Z:void 0,locale:r.ru,outsideClickIgnoreClass:"react-datepicker-popper",popperClassName:O&&`react-datepicker-popper-${O}`,popperPlacement:U,preventOpenOnFocus:!0,renderCustomHeader:re,renderDayContents:ae,selected:Y,startDate:Y,isClearable:!1,onChange:ee,onWeekSelect:v?te:void 0})})},exports.datePickerAppearance=p,exports.datePickerConfig=d;
|
|
1
|
+
"use strict";var e=require("react/jsx-runtime"),t=require("react"),a=require("clsx"),r=require("date-fns/locale"),i=require("react-datepicker"),n=require("@itcase/ui-core/hooks"),o=require("./Button_cjs_C57gpGui.js"),c=require("./primitives_cjs_aZVOWoZJ.js"),s=require("./Input_cjs_D9PxC_lJ.js"),l=require("./default_cjs_BMdcKzhJ.js");const p={surfacePrimary:{dayTextColor:"surfaceTextPrimary",dayTextShape:"rounded",iconFillHover:"surfaceSecondary",iconItemFill:"surfaceItemPrimary",iconShape:"circular",monthTextColor:"surfaceTextPrimary",monthTextWeight:"400",yearTextColor:"surfaceTextPrimary",yearTextWeight:"400"},...{sizeL:{size:"l",daySize:"xs",dayTextSize:"m",iconFillSize:"24",iconLeft:l.icons14.Arrow.ChevronLeft,iconRight:l.icons14.Arrow.ChevronRight},sizeM:{size:"m",daySize:"xxl",dayTextSize:"m",iconFillSize:"24",iconLeft:l.icons14.Arrow.ChevronLeft,iconRight:l.icons14.Arrow.ChevronRight,iconSize:"14",monthTextSize:"m",yearTextSize:"m"},sizeS:{size:"s",daySize:"xs",dayTextSize:"m",iconFillSize:"24",iconLeft:l.icons14.Arrow.ChevronLeft,iconRight:l.icons14.Arrow.ChevronRight}},solid:{inputProps:{borderColor:"none"}},outlined:{inputProps:{fill:"none"}},full:{},ghost:{inputProps:{fill:"none",borderColor:"none"}}},u=e=>{const t=e.getDay()||7,a=new Date(e);a.setDate(e.getDate()-(t-1));const r=new Date(a);return r.setDate(a.getDate()+6),{mondayDate:a,sundayDate:r}},d={appearance:p,setAppearance:e=>{d.appearance=e}};const m=t.forwardRef((r,i)=>{const{inputIcon:n,inputProps:o,value:c,isClearable:l}=r,p=t.useMemo(()=>{if(c){const e=c.split(" - ");return e[0]===e[1]?e[0]:c}return""},[c]);return e.jsxs(t.Fragment,{children:[e.jsx(s.Input,{...r,...o,className:a(o?.className,"datepicker__input"),ref:i,autocomplete:"off",value:p}),n&&e.jsx(x,{...o}),l&&e.jsx(h,{datepickerRef:r.datepickerRef,...o})]})});function h(r){const{clearButton:i,clearButtonAppearance:n,clearIcon:s,clearIconAppearance:l,clearIconSrc:p,datepickerRef:u}=r,d=t.useCallback(e=>{u?.current?.onClearClick(e),u?.current?.handleFocus(e)},[]);return e.jsx(t.Fragment,{children:i?e.jsx(o.Button,{appearance:n,className:a("react-datepicker__clear-button","cursor_type_pointer"),label:i,onClick:d}):(s||p)&&e.jsx(c.Icon,{appearance:l,className:a("react-datepicker__clear-icon","cursor_type_pointer"),imageSrc:p,SvgImage:s,onClick:d})})}function x(t){const{inputIcon:r,inputIconFill:i,inputIconFillHover:n,inputIconFillSize:o,inputIconItemFill:s,inputIconShape:l,inputIconSize:p,inputIconSrc:u,onClick:d}=t;return e.jsx(c.Icon,{className:a("react-datepicker__input-icon","cursor_type_pointer"),size:p,fill:i,fillHover:n,fillSize:o,iconFill:s,imageSrc:u,shape:l,SvgImage:r,onClick:()=>d&&d()})}exports.DatePickerInput=function(s){const{className:l,dataTestId:p,dataTour:h,datePickerProps:x={},endValue:f,inputProps:y={},value:k,onChange:C}=s,{appearance:S,customTimeInput:g,disablePastDays:_,monthsShown:z,selectsRange:I,showWeekNumbers:v,showWeekPicker:T}=x,j=n.useAppearanceConfig(S,d),D=n.useDevicePropsGenerator(x,j),{daySize:P,dayTextColor:b,dayTextShape:F,dayTextSize:w,iconFill:N,iconFillHover:R,iconFillSize:A,iconItemFill:q,iconLeft:L,iconRight:W,iconShape:H,monthTextColor:B,monthTextSize:M,monthTextWeight:$,popper:O,popperPlacement:U,sizeClass:G,widthClass:V,yearTextColor:E,yearTextSize:J,yearTextWeight:K,isClearable:Q}=D,X=t.useRef(null),[Y,Z]=t.useMemo(()=>{let e,t;return k&&(e="string"==typeof k?new Date(k):k),f&&(t="string"==typeof f?new Date(f):f),[e,t]},[k,f]),ee=t.useCallback(e=>{const t=Array.isArray(e)?e:[e],[a,r]=t;if(a&&T){const{mondayDate:e,sundayDate:t}=u(a);C?.(e,t)}else C?.(a,r)},[T,C]),te=t.useCallback(e=>{const{mondayDate:t,sundayDate:a}=u(e);C?.(t,a)},[C]),ae=t.useCallback((t,a)=>e.jsx(o.Button,{className:"react-datepicker__day-button",size:P,label:a.getDate().toString(),labelTextColor:b,labelTextSize:w,shape:F}),[P,b,F,w]),re=t.useCallback(({decreaseMonth:t,increaseMonth:a,monthDate:r})=>e.jsxs("div",{className:"react-datepicker__header--div",children:[L&&e.jsx(c.Icon,{className:"react-datepicker__icon",fill:N,fillHover:R,fillSize:A,iconFill:q,shape:H,SvgImage:L,onClick:t}),e.jsxs("div",{className:"react-datepicker__data",children:[e.jsx(c.Text,{className:"react-datepicker__month",size:M,textColor:B,textWeight:$,children:r.toLocaleString("ru-RU",{month:"long"})}),e.jsx(c.Text,{className:"react-datepicker__year",size:J,textColor:E,textWeight:K,children:r.toLocaleString("ru-RU",{year:"numeric"})})]}),W&&e.jsx(c.Icon,{className:"react-datepicker__icon",fill:N,fillHover:R,fillSize:A,iconFill:q,shape:H,SvgImage:W,onClick:a})]}),[N,R,A,q,L,W,H,B,M,$,E,J,K]),{styles:ie}=n.useStyles(s);return e.jsx("div",{className:a(l,"datepicker",null!=z&&z>1&&"datepicker_multiple-months",g&&"datepicker_button",G&&`datepicker_size_${G}`,V&&`datepicker_width_${V}`),"data-testid":p,"data-tour":h,style:ie,children:e.jsx(i,{ref:X,...x,monthsShown:z,minDate:_?new Date:void 0,customInput:e.jsx(m,{datepickerRef:X,inputProps:y,isClearable:Q}),endDate:I?Z:void 0,locale:r.ru,outsideClickIgnoreClass:"react-datepicker-popper",popperClassName:O&&`react-datepicker-popper-${O}`,popperPlacement:U,preventOpenOnFocus:!0,renderCustomHeader:re,renderDayContents:ae,selected:Y,startDate:Y,isClearable:!1,onChange:ee,onWeekSelect:v?te:void 0})})},exports.datePickerAppearance=p,exports.datePickerConfig=d;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{jsxs as e,jsx as t}from"react/jsx-runtime";import a,{useMemo as r,useCallback as i,useRef as o}from"react";import n from"clsx";import{ru as c}from"date-fns/locale";import l from"react-datepicker";import{useAppearanceConfig as s,useDevicePropsGenerator as p,useStyles as d}from"@itcase/ui-core/hooks";import{B as m}from"./Button_es_W5dTrjgN.js";import{I as u,T as h}from"./primitives_es_BN7QUOlL.js";import{I as f}from"./Input_es_DabuPYuA.js";import{b as y}from"./default_es_CsYL84NN.js";const S={surfacePrimary:{dayTextColor:"surfaceTextPrimary",dayTextShape:"rounded",iconFillHover:"surfaceSecondary",iconItemFill:"surfaceItemPrimary",iconShape:"circular",monthTextColor:"surfaceTextPrimary",monthTextWeight:"400",yearTextColor:"surfaceTextPrimary",yearTextWeight:"400"},...{sizeL:{size:"l",daySize:"xs",dayTextSize:"m",iconFillSize:"24",iconLeft:y.Arrow.ChevronLeft,iconRight:y.Arrow.ChevronRight},sizeM:{size:"m",daySize:"xxl",dayTextSize:"m",iconFillSize:"24",iconLeft:y.Arrow.ChevronLeft,iconRight:y.Arrow.ChevronRight,iconSize:"14",monthTextSize:"m",yearTextSize:"m"},sizeS:{size:"s",daySize:"xs",dayTextSize:"m",iconFillSize:"24",iconLeft:y.Arrow.ChevronLeft,iconRight:y.Arrow.ChevronRight}},solid:{inputProps:{borderColor:"none"}},outlined:{inputProps:{fill:"none"}},full:{},ghost:{inputProps:{fill:"none",borderColor:"none"}}},_=e=>{const t=e.getDay()||7,a=new Date(e);a.setDate(e.getDate()-(t-1));const r=new Date(a);return r.setDate(a.getDate()+6),{mondayDate:a,sundayDate:r}},g={appearance:S,setAppearance:e=>{g.appearance=e}};function C(a){const{className:f,dataTestId:y,dataTour:S,datePickerProps:C={},endValue:x,inputProps:z={},value:T,onChange:v}=a,{appearance:I,customTimeInput:D,disablePastDays:F,monthsShown:w,selectsRange:P,showWeekNumbers:b,showWeekPicker:N}=C,R=s(I,g),A=p(C,R),{daySize:L,dayTextColor:W,dayTextShape:H,dayTextSize:j,iconFill:B,iconFillHover:M,iconFillSize:$,iconItemFill:O,iconLeft:U,iconRight:V,iconShape:q,monthTextColor:E,monthTextSize:G,monthTextWeight:J,popper:K,popperPlacement:Q,sizeClass:X,widthClass:Y,yearTextColor:Z,yearTextSize:ee,yearTextWeight:te,isClearable:ae}=A,re=o(null),[ie,oe]=r(()=>{let e,t;return T&&(e="string"==typeof T?new Date(T):T),x&&(t="string"==typeof x?new Date(x):x),[e,t]},[T,x]),ne=i(e=>{const t=Array.isArray(e)?e:[e],[a,r]=t;if(a&&N){const{mondayDate:e,sundayDate:t}=_(a);v?.(e,t)}else v?.(a,r)},[N,v]),ce=i(e=>{const{mondayDate:t,sundayDate:a}=_(e);v?.(t,a)},[v]),le=i((e,a)=>t(m,{className:"react-datepicker__day-button",size:L,label:a.getDate().toString(),labelTextColor:W,labelTextSize:j,shape:H}),[L,W,H,j]),se=i(({decreaseMonth:a,increaseMonth:r,monthDate:i})=>e("div",{className:"react-datepicker__header--div",children:[U&&t(u,{className:"react-datepicker__icon",fill:B,fillHover:M,fillSize:$,iconFill:O,shape:q,SvgImage:U,onClick:a}),e("div",{className:"react-datepicker__data",children:[t(h,{className:"react-datepicker__month",size:G,textColor:E,textWeight:J,children:i.toLocaleString("ru-RU",{month:"long"})}),t(h,{className:"react-datepicker__year",size:ee,textColor:Z,textWeight:te,children:i.toLocaleString("ru-RU",{year:"numeric"})})]}),V&&t(u,{className:"react-datepicker__icon",fill:B,fillHover:M,fillSize:$,iconFill:O,shape:q,SvgImage:V,onClick:r})]}),[B,M,$,O,U,V,q,E,G,J,Z,ee,te]),{styles:pe}=d(a);return t("div",{className:n(f,"datepicker",w&&"datepicker_multiple-months",D&&"datepicker_button",X&&`datepicker_size_${X}`,Y&&`datepicker_width_${Y}`),"data-testid":y,"data-tour":S,style:pe,children:t(l,{ref:re,...C,minDate:F?new Date:void 0,customInput:t(k,{datepickerRef:re,inputProps:z,isClearable:ae}),endDate:P?oe:void 0,locale:c,outsideClickIgnoreClass:"react-datepicker-popper",popperClassName:K&&`react-datepicker-popper-${K}`,popperPlacement:Q,preventOpenOnFocus:!0,renderCustomHeader:se,renderDayContents:le,selected:ie,startDate:ie,isClearable:!1,onChange:ne,onWeekSelect:b?ce:void 0})})}const k=a.forwardRef((i,o)=>{const{inputIcon:c,inputProps:l,value:s,isClearable:p}=i,d=r(()=>{if(s){const e=s.split(" - ");return e[0]===e[1]?e[0]:s}return""},[s]);return e(a.Fragment,{children:[t(f,{...i,...l,className:n(l?.className,"datepicker__input"),ref:o,autocomplete:"off",value:d}),c&&t(z,{...l}),p&&t(x,{datepickerRef:i.datepickerRef,...l})]})});function x(e){const{clearButton:r,clearButtonAppearance:o,clearIcon:c,clearIconAppearance:l,clearIconSrc:s,datepickerRef:p}=e,d=i(e=>{p?.current?.onClearClick(e),p?.current?.handleFocus(e)},[]);return t(a.Fragment,{children:r?t(m,{appearance:o,className:n("react-datepicker__clear-button","cursor_type_pointer"),label:r,onClick:d}):(c||s)&&t(u,{appearance:l,className:n("react-datepicker__clear-icon","cursor_type_pointer"),imageSrc:s,SvgImage:c,onClick:d})})}function z(e){const{inputIcon:a,inputIconFill:r,inputIconFillHover:i,inputIconFillSize:o,inputIconItemFill:c,inputIconShape:l,inputIconSize:s,inputIconSrc:p,onClick:d}=e;return t(u,{className:n("react-datepicker__input-icon","cursor_type_pointer"),size:s,fill:r,fillHover:i,fillSize:o,iconFill:c,imageSrc:p,shape:l,SvgImage:a,onClick:()=>d&&d()})}export{C as D,g as a,S as d};
|
|
1
|
+
import{jsxs as e,jsx as t}from"react/jsx-runtime";import a,{useMemo as r,useCallback as i,useRef as o}from"react";import n from"clsx";import{ru as c}from"date-fns/locale";import l from"react-datepicker";import{useAppearanceConfig as s,useDevicePropsGenerator as p,useStyles as d}from"@itcase/ui-core/hooks";import{B as m}from"./Button_es_W5dTrjgN.js";import{I as u,T as h}from"./primitives_es_BN7QUOlL.js";import{I as f}from"./Input_es_DabuPYuA.js";import{b as y}from"./default_es_CsYL84NN.js";const S={surfacePrimary:{dayTextColor:"surfaceTextPrimary",dayTextShape:"rounded",iconFillHover:"surfaceSecondary",iconItemFill:"surfaceItemPrimary",iconShape:"circular",monthTextColor:"surfaceTextPrimary",monthTextWeight:"400",yearTextColor:"surfaceTextPrimary",yearTextWeight:"400"},...{sizeL:{size:"l",daySize:"xs",dayTextSize:"m",iconFillSize:"24",iconLeft:y.Arrow.ChevronLeft,iconRight:y.Arrow.ChevronRight},sizeM:{size:"m",daySize:"xxl",dayTextSize:"m",iconFillSize:"24",iconLeft:y.Arrow.ChevronLeft,iconRight:y.Arrow.ChevronRight,iconSize:"14",monthTextSize:"m",yearTextSize:"m"},sizeS:{size:"s",daySize:"xs",dayTextSize:"m",iconFillSize:"24",iconLeft:y.Arrow.ChevronLeft,iconRight:y.Arrow.ChevronRight}},solid:{inputProps:{borderColor:"none"}},outlined:{inputProps:{fill:"none"}},full:{},ghost:{inputProps:{fill:"none",borderColor:"none"}}},_=e=>{const t=e.getDay()||7,a=new Date(e);a.setDate(e.getDate()-(t-1));const r=new Date(a);return r.setDate(a.getDate()+6),{mondayDate:a,sundayDate:r}},g={appearance:S,setAppearance:e=>{g.appearance=e}};function C(a){const{className:f,dataTestId:y,dataTour:S,datePickerProps:C={},endValue:x,inputProps:z={},value:T,onChange:v}=a,{appearance:I,customTimeInput:D,disablePastDays:F,monthsShown:w,selectsRange:P,showWeekNumbers:b,showWeekPicker:N}=C,R=s(I,g),A=p(C,R),{daySize:L,dayTextColor:W,dayTextShape:H,dayTextSize:j,iconFill:B,iconFillHover:M,iconFillSize:$,iconItemFill:O,iconLeft:U,iconRight:V,iconShape:q,monthTextColor:E,monthTextSize:G,monthTextWeight:J,popper:K,popperPlacement:Q,sizeClass:X,widthClass:Y,yearTextColor:Z,yearTextSize:ee,yearTextWeight:te,isClearable:ae}=A,re=o(null),[ie,oe]=r(()=>{let e,t;return T&&(e="string"==typeof T?new Date(T):T),x&&(t="string"==typeof x?new Date(x):x),[e,t]},[T,x]),ne=i(e=>{const t=Array.isArray(e)?e:[e],[a,r]=t;if(a&&N){const{mondayDate:e,sundayDate:t}=_(a);v?.(e,t)}else v?.(a,r)},[N,v]),ce=i(e=>{const{mondayDate:t,sundayDate:a}=_(e);v?.(t,a)},[v]),le=i((e,a)=>t(m,{className:"react-datepicker__day-button",size:L,label:a.getDate().toString(),labelTextColor:W,labelTextSize:j,shape:H}),[L,W,H,j]),se=i(({decreaseMonth:a,increaseMonth:r,monthDate:i})=>e("div",{className:"react-datepicker__header--div",children:[U&&t(u,{className:"react-datepicker__icon",fill:B,fillHover:M,fillSize:$,iconFill:O,shape:q,SvgImage:U,onClick:a}),e("div",{className:"react-datepicker__data",children:[t(h,{className:"react-datepicker__month",size:G,textColor:E,textWeight:J,children:i.toLocaleString("ru-RU",{month:"long"})}),t(h,{className:"react-datepicker__year",size:ee,textColor:Z,textWeight:te,children:i.toLocaleString("ru-RU",{year:"numeric"})})]}),V&&t(u,{className:"react-datepicker__icon",fill:B,fillHover:M,fillSize:$,iconFill:O,shape:q,SvgImage:V,onClick:r})]}),[B,M,$,O,U,V,q,E,G,J,Z,ee,te]),{styles:pe}=d(a);return t("div",{className:n(f,"datepicker",null!=w&&w>1&&"datepicker_multiple-months",D&&"datepicker_button",X&&`datepicker_size_${X}`,Y&&`datepicker_width_${Y}`),"data-testid":y,"data-tour":S,style:pe,children:t(l,{ref:re,...C,monthsShown:w,minDate:F?new Date:void 0,customInput:t(k,{datepickerRef:re,inputProps:z,isClearable:ae}),endDate:P?oe:void 0,locale:c,outsideClickIgnoreClass:"react-datepicker-popper",popperClassName:K&&`react-datepicker-popper-${K}`,popperPlacement:Q,preventOpenOnFocus:!0,renderCustomHeader:se,renderDayContents:le,selected:ie,startDate:ie,isClearable:!1,onChange:ne,onWeekSelect:b?ce:void 0})})}const k=a.forwardRef((i,o)=>{const{inputIcon:c,inputProps:l,value:s,isClearable:p}=i,d=r(()=>{if(s){const e=s.split(" - ");return e[0]===e[1]?e[0]:s}return""},[s]);return e(a.Fragment,{children:[t(f,{...i,...l,className:n(l?.className,"datepicker__input"),ref:o,autocomplete:"off",value:d}),c&&t(z,{...l}),p&&t(x,{datepickerRef:i.datepickerRef,...l})]})});function x(e){const{clearButton:r,clearButtonAppearance:o,clearIcon:c,clearIconAppearance:l,clearIconSrc:s,datepickerRef:p}=e,d=i(e=>{p?.current?.onClearClick(e),p?.current?.handleFocus(e)},[]);return t(a.Fragment,{children:r?t(m,{appearance:o,className:n("react-datepicker__clear-button","cursor_type_pointer"),label:r,onClick:d}):(c||s)&&t(u,{appearance:l,className:n("react-datepicker__clear-icon","cursor_type_pointer"),imageSrc:s,SvgImage:c,onClick:d})})}function z(e){const{inputIcon:a,inputIconFill:r,inputIconFillHover:i,inputIconFillSize:o,inputIconItemFill:c,inputIconShape:l,inputIconSize:s,inputIconSrc:p,onClick:d}=e;return t(u,{className:n("react-datepicker__input-icon","cursor_type_pointer"),size:s,fill:r,fillHover:i,fillSize:o,iconFill:c,imageSrc:p,shape:l,SvgImage:a,onClick:()=>d&&d()})}export{C as D,g as a,S as d};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";var e=require("react/jsx-runtime"),a=require("react"),r=require("clsx"),i=require("luxon"),s=require("@itcase/common"),t=require("@itcase/ui-core/hooks"),c=require("@itcase/ui-core/utils"),p=require("../../ChipsGroup_cjs_CzWdTtsJ.js"),d=require("../../
|
|
1
|
+
"use strict";var e=require("react/jsx-runtime"),a=require("react"),r=require("clsx"),i=require("luxon"),s=require("@itcase/common"),t=require("@itcase/ui-core/hooks"),c=require("@itcase/ui-core/utils"),p=require("../../ChipsGroup_cjs_CzWdTtsJ.js"),d=require("../../DatePicker_cjs_Nh9EgPcT.js");require("react-select"),require("../../primitives_cjs_aZVOWoZJ.js");var n=require("../../SelectContainer_cjs_5jmFWpE4.js");require("../../Group_cjs_CiLUYKP7.js"),require("date-fns/locale"),require("react-datepicker"),require("../../Button_cjs_C57gpGui.js"),require("../../Loader_cjs_niS6cx7A.js"),require("axios"),require("../../Input_cjs_D9PxC_lJ.js"),require("../../default_cjs_BMdcKzhJ.js"),require("@rc-component/tooltip"),require("react-inlinesvg"),require("@itcase/ui-core/hoc"),require("react-select/creatable");const o={surfacePrimary:{fill:"surfacePrimary",chipsAppearance:"surfacePrimary sizeM ghost rounded",datePickerAppearance:"surfacePrimary sizeM solid rounded",datePickerInputAppearance:"defaultPrimary sizeM solid rounded",selectAppearance:"defaultPrimary sizeM solid rounded"},surfaceSecondary:{fill:"surfaceSecondary",chipsAppearance:"surfacePrimary sizeM ghost rounded",datePickerAppearance:"surfacePrimary sizeM solid rounded",datePickerInputAppearance:"defaultPrimary sizeM solid rounded",selectAppearance:"defaultPrimary sizeM solid rounded"},sizeL:{size:"l",chipsAppearanceSize:"sizeXL",datePickerAppearanceSize:"sizeL",datePickerInputAppearanceSize:"sizeL",selectAppearanceSize:"sizeL"},sizeM:{size:"m",chipsAppearanceSize:"sizeL",datePickerAppearanceSize:"sizeM",datePickerInputAppearanceSize:"sizeM",selectAppearanceSize:"sizeM"},sizeS:{size:"s",chipsAppearanceSize:"sizeM",datePickerAppearanceSize:"sizeS",datePickerInputAppearanceSize:"sizeS",selectAppearanceSize:"sizeS"},circular:{shape:"circular"},rounded:{chipsShape:"rounded",selectShape:"rounded",shape:"rounded"},roundedXL:{chipsShape:"roundedXL",selectShape:"roundedXL",shape:"roundedXL"},roundedL:{chipsShape:"roundedL",selectShape:"roundedL",shape:"roundedL"},roundedM:{chipsShape:"roundedM",selectShape:"roundedM",shape:"roundedM"},roundedS:{chipsShape:"roundedS",selectShape:"roundedS",shape:"roundedS"}},l={appearance:o,setAppearance:e=>{l.appearance=e}};exports.DatePeriod=function(o){const{appearance:u,className:h,dataTestId:S,dataTour:P,datePeriodIntervalsList:z=Object.values(s.DATE_PERIOD_INTERVALS),datePeriodSelectFirstOptions:m,datePeriodSelectFirstPlaceholder:_="Выбрать период",datePeriodSelectFirstValue:A,datePeriodSelectSecondOptions:k,datePeriodSelectSecondPlaceholder:j="Выбрать период",datePeriodSelectSecondValue:I,datePeriodValueEnd:f,datePeriodValueStart:q,monthsShown:y=2,popperPlacement:D,selectFirstIsSearchable:C=!0,selectFirstWidth:L="180px",selectSecondIsSearchable:v=!0,selectSecondWidth:g="180px",selectsRange:M=!0,showWeekNumbers:x=!1,isDisabled:b,isSkeleton:w,onChangeDatePeriod:F,onChangeDatePeriodFirstSelect:N,onChangeDatePeriodSecondSelect:W,onKeyDown:K}=o,T=t.useAppearanceConfig(u,l,b),O=t.useDevicePropsGenerator(o,T),{fillClass:V,chipsAppearance:X,chipsAppearanceSize:E,chipsShape:G,datePickerAppearance:R,datePickerAppearanceSize:$,datePickerInputAppearance:H,datePickerInputAppearanceSize:J,datePickerInputFillHover:B,datePickerInputTextSize:Q,selectAppearance:U,selectAppearanceSize:Y,selectShape:Z,shapeClass:ee,sizeClass:ae}=O,re=a.useCallback(e=>{const a=e.dateIntervalsList[0],r=e.dateIntervalsList[1];F?.(new Date(a),new Date(r))},[F]),ie=a.useCallback(e=>{const a=e.dateIntervalsList[0],r=e.dateIntervalsList[1];let s=null,t=null;return q&&(s=i.DateTime.fromJSDate(new Date(q)).toISODate()),f&&(t=i.DateTime.fromJSDate(new Date(f)).toISODate()),a===s&&r===t},[f,q]);return e.jsxs("div",{className:r(h,"date-period",ae&&`date-period_size_${ae}`,w&&"skeleton"),"data-testid":S,"data-tour":P,children:[e.jsxs("div",{className:r("date-period__wrapper",ee&&`shape_${ee}`,V&&`fill_${V}`,"cursor_type_pointer"),children:[e.jsx(p.ChipsGroup,{className:"date-period__choice",direction:"horizontal",children:z.map(a=>e.jsx(p.Chips,{appearance:c.mergeAppearanceKeys(X,E),label:a.label,shape:G,isActive:ie(a),onClick:()=>re(a)},a.value))}),e.jsx(d.DatePickerInput,{className:"date-period__datepicker",datePickerProps:{appearance:c.mergeAppearanceKeys(R,$),dateFormat:"dd/MM/yyyy",monthsShown:O.monthsShown??y,popperPlacement:D,selectsRange:M,showWeekNumbers:x,isClearable:!1,onKeyDown:K},endValue:f,inputProps:{appearance:c.mergeAppearanceKeys(H,J,"ghost"),className:`date-period__datepicker-input date-period__datepicker-input_size_${ae} `,fillHover:B,textSize:Q,placeholder:"Выбрать период"},value:q,onChange:F})]}),m&&e.jsx(n.SelectContainer,{appearance:c.mergeAppearanceKeys(U,Y),className:"date-period__select",width:O.selectFirstWidth??L,minWidth:O.selectFirstWidth??L,options:m,placeholder:_,shape:Z,value:A??null,isSearchable:O.selectFirstIsSearchable??C,onChange:N}),k&&e.jsx(n.SelectContainer,{appearance:c.mergeAppearanceKeys(U,Y),className:"date-period__select",width:O.selectSecondWidth??g,minWidth:O.selectSecondWidth??g,options:k,placeholder:j,shape:Z,value:I??null,isSearchable:O.selectSecondIsSearchable??v,onChange:W})]})},exports.datePeriodAppearance=o,exports.datePeriodConfig=l;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";var e=require("../../
|
|
1
|
+
"use strict";var e=require("../../DatePicker_cjs_Nh9EgPcT.js");require("react/jsx-runtime"),require("react"),require("clsx"),require("date-fns/locale"),require("react-datepicker"),require("@itcase/ui-core/hooks"),require("../../Button_cjs_C57gpGui.js"),require("@itcase/ui-core/utils"),require("../../primitives_cjs_aZVOWoZJ.js"),require("@rc-component/tooltip"),require("react-inlinesvg"),require("@itcase/ui-core/hoc"),require("../../Loader_cjs_niS6cx7A.js"),require("axios"),require("@itcase/common"),require("../../Input_cjs_D9PxC_lJ.js"),require("../../default_cjs_BMdcKzhJ.js"),exports.DatePickerInput=e.DatePickerInput,exports.datePickerAppearance=e.datePickerAppearance,exports.datePickerConfig=e.datePickerConfig;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";var e=require("react/jsx-runtime"),i=require("react"),r=require("clsx"),a=require("@itcase/ui-core/hooks"),l=require("@itcase/ui-core/utils"),s=require("../../primitives_cjs_aZVOWoZJ.js");require("@rc-component/tooltip"),require("react-inlinesvg"),require("@itcase/ui-core/hoc");const c={warningPrimary:{fill:"warningPrimary",fillDisabled:"disabledPrimary",labelColor:"warningTextPrimary",labelColorActive:"warningTextPrimary",badgeAppearance:"warningPrimary sizeM solid rounded",dividerFill:"accentPrimary",dividerFillDisabled:"disabledPrimary"},errorPrimary:{fill:"errorPrimary",fillDisabled:"disabledPrimary",labelColor:"errorTextPrimary",labelColorActive:"errorTextPrimary",labelColorDisabled:"errorTextDisabled",badgeAppearance:"errorPrimary sizeM solid rounded",dividerFill:"accentPrimary",dividerFillDisabled:"errorDisabled"},successPrimary:{fill:"successPrimary",fillDisabled:"successDisabled",labelColor:"successTextPrimary",labelColorActive:"successTextPrimary",labelColorDisabled:"successTextDisabled",badgeAppearance:"successPrimary sizeM solid rounded",dividerFill:"accentPrimary",dividerFillDisabled:"successDisabled"},surfacePrimary:{fill:"surfacePrimary",fillActive:"surfaceActivePrimary",fillActiveHover:"surfaceHoverSecondary",fillDisabled:"surfaceDisabled",fillHover:"surfaceHoverSecondary",labelTextColor:"surfaceTextPrimary",labelTextColorActive:"surfaceTextPrimary",borderColor:"surfaceBorderPrimary",borderColorActive:"surfaceBorderActivePrimary",badgeAppearance:"accentPrimary sizeM solid circular",dividerFill:"surfacePrimary",dividerFillActive:"accentPrimary",dividerFillDisabled:"accentDisabled",iconFillIcon:"surfaceItemPrimary"},surfaceQuaternary:{fill:"surfaceQuaternary",fillActive:"accentActivePrimary",fillActiveHover:"surfaceHoverTertiary",fillDisabled:"surfaceDisabled",fillHover:"surfaceHoverQuaternary",labelTextColor:"surfaceTextPrimary",labelTextColorActive:"surfaceTextPrimary",borderColor:"surfaceBorderPrimary",borderColorActive:"surfaceBorderActivePrimary",badgeAppearance:"accentPrimary sizeM solid circular",dividerFillActive:"accentPrimary",dividerFillDisabled:"accentDisabled",iconFillIcon:"surfaceItemPrimary"},surfaceSecondary:{fill:"surfaceSecondary",fillActive:"surfaceActiveSecondary",fillActiveHover:"surfaceHoverTertiary",fillDisabled:"surfaceDisabled",fillHover:"surfaceHoverTertiary",labelTextColor:"surfaceTextPrimary",labelTextColorActive:"surfaceTextPrimary",borderColor:"surfaceBorderPrimary",borderColorActive:"surfaceBorderActivePrimary",badgeAppearance:"accentPrimary sizeM solid circular",dividerFillActive:"accentPrimary",dividerFillDisabled:"accentDisabled",iconFillIcon:"surfaceItemPrimary"},surfaceTertiary:{fill:"surfaceTertiary",fillActive:"surfaceActiveSecondary",fillActiveHover:"surfaceHoverTertiary",fillDisabled:"surfaceDisabled",fillHover:"surfaceHoverSecondary",labelTextColor:"surfaceTextPrimary",labelTextColorActive:"surfaceTextPrimary",borderColor:"surfaceBorderPrimary",borderColorActive:"surfaceBorderActivePrimary",badgeAppearance:"accentPrimary sizeM solid circular",dividerFillActive:"accentPrimary",dividerFillDisabled:"accentDisabled",iconFillIcon:"surfaceItemPrimary"},sizeXXL:{size:"xxl",labelTextSize:"s",badgeAppearanceSize:"sizeXS",dividerSize:"s",dividerSizeActive:"m"},sizeXL:{size:"xl",labelTextSize:"s",badgeAppearanceSize:"sizeXS",dividerSize:"s",dividerSizeActive:"m"},sizeL:{size:"l",labelTextSize:"s",badgeAppearanceSize:"sizeXS",dividerSize:"s",dividerSizeActive:"m"},sizeM:{size:"m",labelTextSize:"s",badgeAppearanceSize:"sizeXS",dividerSize:"s",dividerSizeActive:"m"},sizeS:{size:"s",labelTextSize:"s",badgeAppearanceSize:"sizeXS",dividerSize:"s",dividerSizeActive:"m"},sizeXS:{size:"xs",labelTextSize:"xs",badgeAppearanceSize:"sizeXS",dividerSize:"s",dividerSizeActive:"m"},sizeXXS:{size:"xxs",labelTextSize:"xs",badgeAppearanceSize:"sizeXXS",dividerSize:"s",dividerSizeActive:"m"},solid:{borderColor:"none",borderColorActive:"none"},outlined:{fill:"none"},full:{},ghost:{fill:"none",borderColor:"none",borderColorActive:"none",dividerFill:"none"}},t={appearance:c,setAppearance:e=>{t.appearance=e}};function o(c){const{appearance:o,className:d,dataTestId:n,dataTour:b,label:v,badgeValue:u,href:p,link:f,rel:y,target:m,before:x,after:A,isActive:z=!1,isDisabled:S=!1,isSkeleton:C,onClick:g,onMouseEnter:
|
|
1
|
+
"use strict";var e=require("react/jsx-runtime"),i=require("react"),r=require("clsx"),a=require("@itcase/ui-core/hooks"),l=require("@itcase/ui-core/utils"),s=require("../../primitives_cjs_aZVOWoZJ.js");require("@rc-component/tooltip"),require("react-inlinesvg"),require("@itcase/ui-core/hoc");const c={warningPrimary:{fill:"warningPrimary",fillDisabled:"disabledPrimary",labelColor:"warningTextPrimary",labelColorActive:"warningTextPrimary",badgeAppearance:"warningPrimary sizeM solid rounded",dividerFill:"accentPrimary",dividerFillDisabled:"disabledPrimary"},errorPrimary:{fill:"errorPrimary",fillDisabled:"disabledPrimary",labelColor:"errorTextPrimary",labelColorActive:"errorTextPrimary",labelColorDisabled:"errorTextDisabled",badgeAppearance:"errorPrimary sizeM solid rounded",dividerFill:"accentPrimary",dividerFillDisabled:"errorDisabled"},successPrimary:{fill:"successPrimary",fillDisabled:"successDisabled",labelColor:"successTextPrimary",labelColorActive:"successTextPrimary",labelColorDisabled:"successTextDisabled",badgeAppearance:"successPrimary sizeM solid rounded",dividerFill:"accentPrimary",dividerFillDisabled:"successDisabled"},surfacePrimary:{fill:"surfacePrimary",fillActive:"surfaceActivePrimary",fillActiveHover:"surfaceHoverSecondary",fillDisabled:"surfaceDisabled",fillHover:"surfaceHoverSecondary",labelTextColor:"surfaceTextPrimary",labelTextColorActive:"surfaceTextPrimary",borderColor:"surfaceBorderPrimary",borderColorActive:"surfaceBorderActivePrimary",badgeAppearance:"accentPrimary sizeM solid circular",dividerFill:"surfacePrimary",dividerFillActive:"accentPrimary",dividerFillDisabled:"accentDisabled",iconFillIcon:"surfaceItemPrimary"},surfaceQuaternary:{fill:"surfaceQuaternary",fillActive:"accentActivePrimary",fillActiveHover:"surfaceHoverTertiary",fillDisabled:"surfaceDisabled",fillHover:"surfaceHoverQuaternary",labelTextColor:"surfaceTextPrimary",labelTextColorActive:"surfaceTextPrimary",borderColor:"surfaceBorderPrimary",borderColorActive:"surfaceBorderActivePrimary",badgeAppearance:"accentPrimary sizeM solid circular",dividerFillActive:"accentPrimary",dividerFillDisabled:"accentDisabled",iconFillIcon:"surfaceItemPrimary"},surfaceSecondary:{fill:"surfaceSecondary",fillActive:"surfaceActiveSecondary",fillActiveHover:"surfaceHoverTertiary",fillDisabled:"surfaceDisabled",fillHover:"surfaceHoverTertiary",labelTextColor:"surfaceTextPrimary",labelTextColorActive:"surfaceTextPrimary",borderColor:"surfaceBorderPrimary",borderColorActive:"surfaceBorderActivePrimary",badgeAppearance:"accentPrimary sizeM solid circular",dividerFillActive:"accentPrimary",dividerFillDisabled:"accentDisabled",iconFillIcon:"surfaceItemPrimary"},surfaceTertiary:{fill:"surfaceTertiary",fillActive:"surfaceActiveSecondary",fillActiveHover:"surfaceHoverTertiary",fillDisabled:"surfaceDisabled",fillHover:"surfaceHoverSecondary",labelTextColor:"surfaceTextPrimary",labelTextColorActive:"surfaceTextPrimary",borderColor:"surfaceBorderPrimary",borderColorActive:"surfaceBorderActivePrimary",badgeAppearance:"accentPrimary sizeM solid circular",dividerFillActive:"accentPrimary",dividerFillDisabled:"accentDisabled",iconFillIcon:"surfaceItemPrimary"},sizeXXL:{size:"xxl",labelTextSize:"s",badgeAppearanceSize:"sizeXS",dividerSize:"s",dividerSizeActive:"m"},sizeXL:{size:"xl",labelTextSize:"s",badgeAppearanceSize:"sizeXS",dividerSize:"s",dividerSizeActive:"m"},sizeL:{size:"l",labelTextSize:"s",badgeAppearanceSize:"sizeXS",dividerSize:"s",dividerSizeActive:"m"},sizeM:{size:"m",labelTextSize:"s",badgeAppearanceSize:"sizeXS",dividerSize:"s",dividerSizeActive:"m"},sizeS:{size:"s",labelTextSize:"s",badgeAppearanceSize:"sizeXS",dividerSize:"s",dividerSizeActive:"m"},sizeXS:{size:"xs",labelTextSize:"xs",badgeAppearanceSize:"sizeXS",dividerSize:"s",dividerSizeActive:"m"},sizeXXS:{size:"xxs",labelTextSize:"xs",badgeAppearanceSize:"sizeXXS",dividerSize:"s",dividerSizeActive:"m"},solid:{borderColor:"none",borderColorActive:"none"},outlined:{fill:"none"},full:{},ghost:{fill:"none",borderColor:"none",borderColorActive:"none",dividerFill:"none"}},t={appearance:c,setAppearance:e=>{t.appearance=e}};function o(c){const{appearance:o,className:d,dataTestId:n,dataTour:b,label:v,badgeValue:u,href:p,link:f,rel:y,target:m,before:x,after:A,isActive:z=!1,isDisabled:S=!1,isSkeleton:C,onClick:g,onMouseEnter:T,children:P}=c,_=a.useAppearanceConfig(o,t,S),D=a.useDevicePropsGenerator(c,_),{rootClasses:h}=a.useActiveClasses({propsGenerator:D,isActive:z,isDisabled:S}),{justifyContentClass:F,alignClass:H,labelTextAlign:j,labelTextColor:w,labelTextColorActive:$,labelTextColorHover:I,labelTextSize:X,labelTextStyle:k,labelTextWeight:B,labelTextWrap:M,badgeAppearance:N,badgeAppearanceSize:q,badgeShape:L,badgeSize:W,badgeTextColor:G,badgeTextSize:Q,dividerFill:V,dividerFillActive:E,dividerFillActiveHover:K,dividerFillDisabled:O,dividerFillHover:J,dividerSize:R,dividerSizeActive:U,icon:Y,iconFill:Z,iconFillIcon:ee,iconFillSize:ie,iconShape:re,iconSize:ae,iconSrc:le,linkFill:se,shapeClass:ce,sizeClass:te,widthClass:oe}=D,{styles:de}=a.useStyles(c);return e.jsx("div",{className:r("tab",d,h,z&&"tab_state_active",S&&"tab_state_disabled",te&&`tab_size_${te}`,ce&&`shape_${ce}`,oe&&`width_${oe}`,F&&`tab_justify-content_${F}`,C&&"skeleton",g&&"cursor_type_pointer"),"data-testid":n&&`${n}Tab`,"data-tour":b,style:de,onClick:g,onMouseEnter:T,children:e.jsxs(s.Link,{className:r("tab__link",!S&&"cursor_type_pointer"),fill:se,href:f||p,rel:y,target:m,children:[x,P||e.jsxs(i.Fragment,{children:[e.jsxs("div",{className:r("tab__wrapper",H&&`align_${H}`),children:[v&&e.jsx(s.Text,{className:"tab__label",size:X,textAlign:j,textColor:w,textColorActive:$,textColorHover:I,textStyle:k,textWeight:B,textWrap:M,isActive:z,isDisabled:S,children:v}),Boolean(u)&&e.jsx(s.Badge,{appearance:l.mergeAppearanceKeys(N,q),dataTestId:n&&`${n}TabBadge`,size:W,textColor:G,textSize:Q,shape:L,value:u}),(Y||le)&&e.jsx(s.Icon,{className:"tab__icon_after",fill:Z,fillSize:ie,iconFill:ee,iconSize:ae,imageSrc:le,shape:re,SvgImage:Y})]}),z,e.jsx(s.Divider,{className:"tab__divider",width:"fill",direction:"horizontal",size:z?U:R,fill:V,fillActive:E,fillActiveHover:K,fillDisabled:O,fillHover:J,zIndex:"1",isActive:z,isDisabled:S})]}),A]})})}exports.Tab=o,exports.TabGroup=function(l){const{className:s,dataTestId:c,dataTour:t,horizontalScroll:d,style:n,tabAppearance:b,tabList:v,children:u}=l,p=a.useDevicePropsGenerator(l),{directionClass:f,alignClass:y,alignDirectionClass:m,fillClass:x,borderColorClass:A,borderTypeClass:z,borderWidthClass:S,widthClass:C,wrapClass:g}=p,{styles:T,wrapper:P}=a.useStyles(l);return e.jsx("div",{className:r(s,"tab-group","group",C&&`width_${C}`,m&&`align_${m}`,f&&`group_direction_${f}`,y&&`align_${y}`,x&&`fill_${x}`,d&&"group_scroll_horizontal",g&&`group_wrap_${g}`,A&&`border-color_${A}`,S&&`border-width_${S}`,z&&`border_type_${z}`),"data-testid":c,"data-tour":t,style:Object.assign({},T,n),children:d?e.jsxs("div",{className:"tab-group__wrapper",style:P,children:[v?.map(i=>e.jsx(o,{appearance:b,label:i.label,isActive:i.isActive},i.key)),u]}):e.jsxs(i.Fragment,{children:[v?.map(i=>e.jsx(o,{appearance:b,label:i.label,badgeValue:i.badgeValue,icon:i.icon,iconSrc:i.iconSrc,isActive:i.isActive,onClick:i.onClick},i.key)),u]})})},exports.tabAppearance=c,exports.tabConfig=t;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{jsxs as e,jsx as a}from"react/jsx-runtime";import{useCallback as r}from"react";import
|
|
1
|
+
import{jsxs as e,jsx as a}from"react/jsx-runtime";import{useCallback as r}from"react";import t from"clsx";import{DateTime as i}from"luxon";import{DATE_PERIOD_INTERVALS as s}from"@itcase/common";import{useAppearanceConfig as c,useDevicePropsGenerator as p}from"@itcase/ui-core/hooks";import{mergeAppearanceKeys as o}from"@itcase/ui-core/utils";import{a as d,C as n}from"../ChipsGroup_es_BGiou5c-.js";import{D as l}from"../DatePicker_es_DbD0yr_Y.js";import"react-select";import"../primitives_es_BN7QUOlL.js";import{S as u}from"../SelectContainer_es_C4vpMDC9.js";import"../Group_es_DIuSNHx3.js";import"date-fns/locale";import"react-datepicker";import"../Button_es_W5dTrjgN.js";import"../Loader_es_BnHFYlVt.js";import"axios";import"../Input_es_DabuPYuA.js";import"../default_es_CsYL84NN.js";import"@rc-component/tooltip";import"react-inlinesvg";import"@itcase/ui-core/hoc";import"react-select/creatable";const h={surfacePrimary:{fill:"surfacePrimary",chipsAppearance:"surfacePrimary sizeM ghost rounded",datePickerAppearance:"surfacePrimary sizeM solid rounded",datePickerInputAppearance:"defaultPrimary sizeM solid rounded",selectAppearance:"defaultPrimary sizeM solid rounded"},surfaceSecondary:{fill:"surfaceSecondary",chipsAppearance:"surfacePrimary sizeM ghost rounded",datePickerAppearance:"surfacePrimary sizeM solid rounded",datePickerInputAppearance:"defaultPrimary sizeM solid rounded",selectAppearance:"defaultPrimary sizeM solid rounded"},sizeL:{size:"l",chipsAppearanceSize:"sizeXL",datePickerAppearanceSize:"sizeL",datePickerInputAppearanceSize:"sizeL",selectAppearanceSize:"sizeL"},sizeM:{size:"m",chipsAppearanceSize:"sizeL",datePickerAppearanceSize:"sizeM",datePickerInputAppearanceSize:"sizeM",selectAppearanceSize:"sizeM"},sizeS:{size:"s",chipsAppearanceSize:"sizeM",datePickerAppearanceSize:"sizeS",datePickerInputAppearanceSize:"sizeS",selectAppearanceSize:"sizeS"},circular:{shape:"circular"},rounded:{chipsShape:"rounded",selectShape:"rounded",shape:"rounded"},roundedXL:{chipsShape:"roundedXL",selectShape:"roundedXL",shape:"roundedXL"},roundedL:{chipsShape:"roundedL",selectShape:"roundedL",shape:"roundedL"},roundedM:{chipsShape:"roundedM",selectShape:"roundedM",shape:"roundedM"},roundedS:{chipsShape:"roundedS",selectShape:"roundedS",shape:"roundedS"}},S={appearance:h,setAppearance:e=>{S.appearance=e}};function m(h){const{appearance:m,className:z,dataTestId:P,dataTour:_,datePeriodIntervalsList:f=Object.values(s),datePeriodSelectFirstOptions:A,datePeriodSelectFirstPlaceholder:k="Выбрать период",datePeriodSelectFirstValue:I,datePeriodSelectSecondOptions:L,datePeriodSelectSecondPlaceholder:y="Выбрать период",datePeriodSelectSecondValue:M,datePeriodValueEnd:v,datePeriodValueStart:D,monthsShown:b=2,popperPlacement:w,selectFirstIsSearchable:C=!0,selectFirstWidth:g="180px",selectSecondIsSearchable:j=!0,selectSecondWidth:F="180px",selectsRange:N=!0,showWeekNumbers:W=!1,isDisabled:x,isSkeleton:O,onChangeDatePeriod:V,onChangeDatePeriodFirstSelect:X,onChangeDatePeriodSecondSelect:$,onKeyDown:T}=h,G=c(m,S,x),H=p(h,G),{fillClass:J,chipsAppearance:K,chipsAppearanceSize:R,chipsShape:B,datePickerAppearance:E,datePickerAppearanceSize:q,datePickerInputAppearance:Q,datePickerInputAppearanceSize:U,datePickerInputFillHover:Y,datePickerInputTextSize:Z,selectAppearance:ee,selectAppearanceSize:ae,selectShape:re,shapeClass:te,sizeClass:ie}=H,se=r(e=>{const a=e.dateIntervalsList[0],r=e.dateIntervalsList[1];V?.(new Date(a),new Date(r))},[V]),ce=r(e=>{const a=e.dateIntervalsList[0],r=e.dateIntervalsList[1];let t=null,s=null;return D&&(t=i.fromJSDate(new Date(D)).toISODate()),v&&(s=i.fromJSDate(new Date(v)).toISODate()),a===t&&r===s},[v,D]);return e("div",{className:t(z,"date-period",ie&&`date-period_size_${ie}`,O&&"skeleton"),"data-testid":P,"data-tour":_,children:[e("div",{className:t("date-period__wrapper",te&&`shape_${te}`,J&&`fill_${J}`,"cursor_type_pointer"),children:[a(d,{className:"date-period__choice",direction:"horizontal",children:f.map(e=>a(n,{appearance:o(K,R),label:e.label,shape:B,isActive:ce(e),onClick:()=>se(e)},e.value))}),a(l,{className:"date-period__datepicker",datePickerProps:{appearance:o(E,q),dateFormat:"dd/MM/yyyy",monthsShown:H.monthsShown??b,popperPlacement:w,selectsRange:N,showWeekNumbers:W,isClearable:!1,onKeyDown:T},endValue:v,inputProps:{appearance:o(Q,U,"ghost"),className:`date-period__datepicker-input date-period__datepicker-input_size_${ie} `,fillHover:Y,textSize:Z,placeholder:"Выбрать период"},value:D,onChange:V})]}),A&&a(u,{appearance:o(ee,ae),className:"date-period__select",width:H.selectFirstWidth??g,minWidth:H.selectFirstWidth??g,options:A,placeholder:k,shape:re,value:I??null,isSearchable:H.selectFirstIsSearchable??C,onChange:X}),L&&a(u,{appearance:o(ee,ae),className:"date-period__select",width:H.selectSecondWidth??F,minWidth:H.selectSecondWidth??F,options:L,placeholder:y,shape:re,value:M??null,isSearchable:H.selectSecondIsSearchable??j,onChange:$})]})}export{m as DatePeriod,h as datePeriodAppearance,S as datePeriodConfig};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
export{D as DatePickerInput,d as datePickerAppearance,a as datePickerConfig}from"../
|
|
1
|
+
export{D as DatePickerInput,d as datePickerAppearance,a as datePickerConfig}from"../DatePicker_es_DbD0yr_Y.js";import"react/jsx-runtime";import"react";import"clsx";import"date-fns/locale";import"react-datepicker";import"@itcase/ui-core/hooks";import"../Button_es_W5dTrjgN.js";import"@itcase/ui-core/utils";import"../primitives_es_BN7QUOlL.js";import"@rc-component/tooltip";import"react-inlinesvg";import"@itcase/ui-core/hoc";import"../Loader_es_BnHFYlVt.js";import"axios";import"@itcase/common";import"../Input_es_DabuPYuA.js";import"../default_es_CsYL84NN.js";
|
package/dist/components/Tab.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
import{jsx as e,jsxs as i}from"react/jsx-runtime";import r from"react";import a from"clsx";import{useAppearanceConfig as l,useDevicePropsGenerator as s,useActiveClasses as c,useStyles as t}from"@itcase/ui-core/hooks";import{mergeAppearanceKeys as o}from"@itcase/ui-core/utils";import{d,T as n,B as b,I as v,D as m}from"../primitives_es_BN7QUOlL.js";import"@rc-component/tooltip";import"react-inlinesvg";import"@itcase/ui-core/hoc";const f={warningPrimary:{fill:"warningPrimary",fillDisabled:"disabledPrimary",labelColor:"warningTextPrimary",labelColorActive:"warningTextPrimary",badgeAppearance:"warningPrimary sizeM solid rounded",dividerFill:"accentPrimary",dividerFillDisabled:"disabledPrimary"},errorPrimary:{fill:"errorPrimary",fillDisabled:"disabledPrimary",labelColor:"errorTextPrimary",labelColorActive:"errorTextPrimary",labelColorDisabled:"errorTextDisabled",badgeAppearance:"errorPrimary sizeM solid rounded",dividerFill:"accentPrimary",dividerFillDisabled:"errorDisabled"},successPrimary:{fill:"successPrimary",fillDisabled:"successDisabled",labelColor:"successTextPrimary",labelColorActive:"successTextPrimary",labelColorDisabled:"successTextDisabled",badgeAppearance:"successPrimary sizeM solid rounded",dividerFill:"accentPrimary",dividerFillDisabled:"successDisabled"},surfacePrimary:{fill:"surfacePrimary",fillActive:"surfaceActivePrimary",fillActiveHover:"surfaceHoverSecondary",fillDisabled:"surfaceDisabled",fillHover:"surfaceHoverSecondary",labelTextColor:"surfaceTextPrimary",labelTextColorActive:"surfaceTextPrimary",borderColor:"surfaceBorderPrimary",borderColorActive:"surfaceBorderActivePrimary",badgeAppearance:"accentPrimary sizeM solid circular",dividerFill:"surfacePrimary",dividerFillActive:"accentPrimary",dividerFillDisabled:"accentDisabled",iconFillIcon:"surfaceItemPrimary"},surfaceQuaternary:{fill:"surfaceQuaternary",fillActive:"accentActivePrimary",fillActiveHover:"surfaceHoverTertiary",fillDisabled:"surfaceDisabled",fillHover:"surfaceHoverQuaternary",labelTextColor:"surfaceTextPrimary",labelTextColorActive:"surfaceTextPrimary",borderColor:"surfaceBorderPrimary",borderColorActive:"surfaceBorderActivePrimary",badgeAppearance:"accentPrimary sizeM solid circular",dividerFillActive:"accentPrimary",dividerFillDisabled:"accentDisabled",iconFillIcon:"surfaceItemPrimary"},surfaceSecondary:{fill:"surfaceSecondary",fillActive:"surfaceActiveSecondary",fillActiveHover:"surfaceHoverTertiary",fillDisabled:"surfaceDisabled",fillHover:"surfaceHoverTertiary",labelTextColor:"surfaceTextPrimary",labelTextColorActive:"surfaceTextPrimary",borderColor:"surfaceBorderPrimary",borderColorActive:"surfaceBorderActivePrimary",badgeAppearance:"accentPrimary sizeM solid circular",dividerFillActive:"accentPrimary",dividerFillDisabled:"accentDisabled",iconFillIcon:"surfaceItemPrimary"},surfaceTertiary:{fill:"surfaceTertiary",fillActive:"surfaceActiveSecondary",fillActiveHover:"surfaceHoverTertiary",fillDisabled:"surfaceDisabled",fillHover:"surfaceHoverSecondary",labelTextColor:"surfaceTextPrimary",labelTextColorActive:"surfaceTextPrimary",borderColor:"surfaceBorderPrimary",borderColorActive:"surfaceBorderActivePrimary",badgeAppearance:"accentPrimary sizeM solid circular",dividerFillActive:"accentPrimary",dividerFillDisabled:"accentDisabled",iconFillIcon:"surfaceItemPrimary"},sizeXXL:{size:"xxl",labelTextSize:"s",badgeAppearanceSize:"sizeXS",dividerSize:"s",dividerSizeActive:"m"},sizeXL:{size:"xl",labelTextSize:"s",badgeAppearanceSize:"sizeXS",dividerSize:"s",dividerSizeActive:"m"},sizeL:{size:"l",labelTextSize:"s",badgeAppearanceSize:"sizeXS",dividerSize:"s",dividerSizeActive:"m"},sizeM:{size:"m",labelTextSize:"s",badgeAppearanceSize:"sizeXS",dividerSize:"s",dividerSizeActive:"m"},sizeS:{size:"s",labelTextSize:"s",badgeAppearanceSize:"sizeXS",dividerSize:"s",dividerSizeActive:"m"},sizeXS:{size:"xs",labelTextSize:"xs",badgeAppearanceSize:"sizeXS",dividerSize:"s",dividerSizeActive:"m"},sizeXXS:{size:"xxs",labelTextSize:"xs",badgeAppearanceSize:"sizeXXS",dividerSize:"s",dividerSizeActive:"m"},solid:{borderColor:"none",borderColorActive:"none"},outlined:{fill:"none"},full:{},ghost:{fill:"none",borderColor:"none",borderColorActive:"none",dividerFill:"none"}},p={appearance:f,setAppearance:e=>{p.appearance=e}};function u(f){const{appearance:u,className:y,dataTestId:z,dataTour:A,label:S,badgeValue:x,href:C,link:
|
|
1
|
+
import{jsx as e,jsxs as i}from"react/jsx-runtime";import r from"react";import a from"clsx";import{useAppearanceConfig as l,useDevicePropsGenerator as s,useActiveClasses as c,useStyles as t}from"@itcase/ui-core/hooks";import{mergeAppearanceKeys as o}from"@itcase/ui-core/utils";import{d,T as n,B as b,I as v,D as m}from"../primitives_es_BN7QUOlL.js";import"@rc-component/tooltip";import"react-inlinesvg";import"@itcase/ui-core/hoc";const f={warningPrimary:{fill:"warningPrimary",fillDisabled:"disabledPrimary",labelColor:"warningTextPrimary",labelColorActive:"warningTextPrimary",badgeAppearance:"warningPrimary sizeM solid rounded",dividerFill:"accentPrimary",dividerFillDisabled:"disabledPrimary"},errorPrimary:{fill:"errorPrimary",fillDisabled:"disabledPrimary",labelColor:"errorTextPrimary",labelColorActive:"errorTextPrimary",labelColorDisabled:"errorTextDisabled",badgeAppearance:"errorPrimary sizeM solid rounded",dividerFill:"accentPrimary",dividerFillDisabled:"errorDisabled"},successPrimary:{fill:"successPrimary",fillDisabled:"successDisabled",labelColor:"successTextPrimary",labelColorActive:"successTextPrimary",labelColorDisabled:"successTextDisabled",badgeAppearance:"successPrimary sizeM solid rounded",dividerFill:"accentPrimary",dividerFillDisabled:"successDisabled"},surfacePrimary:{fill:"surfacePrimary",fillActive:"surfaceActivePrimary",fillActiveHover:"surfaceHoverSecondary",fillDisabled:"surfaceDisabled",fillHover:"surfaceHoverSecondary",labelTextColor:"surfaceTextPrimary",labelTextColorActive:"surfaceTextPrimary",borderColor:"surfaceBorderPrimary",borderColorActive:"surfaceBorderActivePrimary",badgeAppearance:"accentPrimary sizeM solid circular",dividerFill:"surfacePrimary",dividerFillActive:"accentPrimary",dividerFillDisabled:"accentDisabled",iconFillIcon:"surfaceItemPrimary"},surfaceQuaternary:{fill:"surfaceQuaternary",fillActive:"accentActivePrimary",fillActiveHover:"surfaceHoverTertiary",fillDisabled:"surfaceDisabled",fillHover:"surfaceHoverQuaternary",labelTextColor:"surfaceTextPrimary",labelTextColorActive:"surfaceTextPrimary",borderColor:"surfaceBorderPrimary",borderColorActive:"surfaceBorderActivePrimary",badgeAppearance:"accentPrimary sizeM solid circular",dividerFillActive:"accentPrimary",dividerFillDisabled:"accentDisabled",iconFillIcon:"surfaceItemPrimary"},surfaceSecondary:{fill:"surfaceSecondary",fillActive:"surfaceActiveSecondary",fillActiveHover:"surfaceHoverTertiary",fillDisabled:"surfaceDisabled",fillHover:"surfaceHoverTertiary",labelTextColor:"surfaceTextPrimary",labelTextColorActive:"surfaceTextPrimary",borderColor:"surfaceBorderPrimary",borderColorActive:"surfaceBorderActivePrimary",badgeAppearance:"accentPrimary sizeM solid circular",dividerFillActive:"accentPrimary",dividerFillDisabled:"accentDisabled",iconFillIcon:"surfaceItemPrimary"},surfaceTertiary:{fill:"surfaceTertiary",fillActive:"surfaceActiveSecondary",fillActiveHover:"surfaceHoverTertiary",fillDisabled:"surfaceDisabled",fillHover:"surfaceHoverSecondary",labelTextColor:"surfaceTextPrimary",labelTextColorActive:"surfaceTextPrimary",borderColor:"surfaceBorderPrimary",borderColorActive:"surfaceBorderActivePrimary",badgeAppearance:"accentPrimary sizeM solid circular",dividerFillActive:"accentPrimary",dividerFillDisabled:"accentDisabled",iconFillIcon:"surfaceItemPrimary"},sizeXXL:{size:"xxl",labelTextSize:"s",badgeAppearanceSize:"sizeXS",dividerSize:"s",dividerSizeActive:"m"},sizeXL:{size:"xl",labelTextSize:"s",badgeAppearanceSize:"sizeXS",dividerSize:"s",dividerSizeActive:"m"},sizeL:{size:"l",labelTextSize:"s",badgeAppearanceSize:"sizeXS",dividerSize:"s",dividerSizeActive:"m"},sizeM:{size:"m",labelTextSize:"s",badgeAppearanceSize:"sizeXS",dividerSize:"s",dividerSizeActive:"m"},sizeS:{size:"s",labelTextSize:"s",badgeAppearanceSize:"sizeXS",dividerSize:"s",dividerSizeActive:"m"},sizeXS:{size:"xs",labelTextSize:"xs",badgeAppearanceSize:"sizeXS",dividerSize:"s",dividerSizeActive:"m"},sizeXXS:{size:"xxs",labelTextSize:"xs",badgeAppearanceSize:"sizeXXS",dividerSize:"s",dividerSizeActive:"m"},solid:{borderColor:"none",borderColorActive:"none"},outlined:{fill:"none"},full:{},ghost:{fill:"none",borderColor:"none",borderColorActive:"none",dividerFill:"none"}},p={appearance:f,setAppearance:e=>{p.appearance=e}};function u(f){const{appearance:u,className:y,dataTestId:z,dataTour:A,label:S,badgeValue:x,href:C,link:T,rel:g,target:P,before:_,after:D,isActive:h=!1,isDisabled:F=!1,isSkeleton:H,onClick:w,onMouseEnter:$,children:I}=f,X=l(u,p,F),k=s(f,X),{rootClasses:B}=c({propsGenerator:k,isActive:h,isDisabled:F}),{justifyContentClass:M,alignClass:N,labelTextAlign:j,labelTextColor:W,labelTextColorActive:L,labelTextColorHover:Q,labelTextSize:V,labelTextStyle:E,labelTextWeight:G,labelTextWrap:O,badgeAppearance:q,badgeAppearanceSize:J,badgeShape:K,badgeSize:R,badgeTextColor:U,badgeTextSize:Y,dividerFill:Z,dividerFillActive:ee,dividerFillActiveHover:ie,dividerFillDisabled:re,dividerFillHover:ae,dividerSize:le,dividerSizeActive:se,icon:ce,iconFill:te,iconFillIcon:oe,iconFillSize:de,iconShape:ne,iconSize:be,iconSrc:ve,linkFill:me,shapeClass:fe,sizeClass:pe,widthClass:ue}=k,{styles:ye}=t(f);return e("div",{className:a("tab",y,B,h&&"tab_state_active",F&&"tab_state_disabled",pe&&`tab_size_${pe}`,fe&&`shape_${fe}`,ue&&`width_${ue}`,M&&`tab_justify-content_${M}`,H&&"skeleton",w&&"cursor_type_pointer"),"data-testid":z&&`${z}Tab`,"data-tour":A,style:ye,onClick:w,onMouseEnter:$,children:i(d,{className:a("tab__link",!F&&"cursor_type_pointer"),fill:me,href:T||C,rel:g,target:P,children:[_,I||i(r.Fragment,{children:[i("div",{className:a("tab__wrapper",N&&`align_${N}`),children:[S&&e(n,{className:"tab__label",size:V,textAlign:j,textColor:W,textColorActive:L,textColorHover:Q,textStyle:E,textWeight:G,textWrap:O,isActive:h,isDisabled:F,children:S}),Boolean(x)&&e(b,{appearance:o(q,J),dataTestId:z&&`${z}TabBadge`,size:R,textColor:U,textSize:Y,shape:K,value:x}),(ce||ve)&&e(v,{className:"tab__icon_after",fill:te,fillSize:de,iconFill:oe,iconSize:be,imageSrc:ve,shape:ne,SvgImage:ce})]}),h,e(m,{className:"tab__divider",width:"fill",direction:"horizontal",size:h?se:le,fill:Z,fillActive:ee,fillActiveHover:ie,fillDisabled:re,fillHover:ae,zIndex:"1",isActive:h,isDisabled:F})]}),D]})})}function y(l){const{className:c,dataTestId:o,dataTour:d,horizontalScroll:n,style:b,tabAppearance:v,tabList:m,children:f}=l,p=s(l),{directionClass:y,alignClass:z,alignDirectionClass:A,fillClass:S,borderColorClass:x,borderTypeClass:C,borderWidthClass:T,widthClass:g,wrapClass:P}=p,{styles:_,wrapper:D}=t(l);return e("div",{className:a(c,"tab-group","group",g&&`width_${g}`,A&&`align_${A}`,y&&`group_direction_${y}`,z&&`align_${z}`,S&&`fill_${S}`,n&&"group_scroll_horizontal",P&&`group_wrap_${P}`,x&&`border-color_${x}`,T&&`border-width_${T}`,C&&`border_type_${C}`),"data-testid":o,"data-tour":d,style:Object.assign({},_,b),children:n?i("div",{className:"tab-group__wrapper",style:D,children:[m?.map(i=>e(u,{appearance:v,label:i.label,isActive:i.isActive},i.key)),f]}):i(r.Fragment,{children:[m?.map(i=>e(u,{appearance:v,label:i.label,badgeValue:i.badgeValue,icon:i.icon,iconSrc:i.iconSrc,isActive:i.isActive,onClick:i.onClick},i.key)),f]})})}export{u as Tab,y as TabGroup,f as tabAppearance,p as tabConfig};
|
|
@@ -12,6 +12,8 @@ type DatePeriodAppearanceProps<Option> = {
|
|
|
12
12
|
chipsShape?: ChipsProps['shape'];
|
|
13
13
|
datePickerAppearance?: DatePickerInputProps['appearance'];
|
|
14
14
|
datePickerAppearanceSize?: AppearanceSizeKey;
|
|
15
|
+
monthsShown?: number;
|
|
16
|
+
monthsShownMobile?: number;
|
|
15
17
|
datePickerInputAppearance?: InputProps['appearance'];
|
|
16
18
|
datePickerInputAppearanceSize?: AppearanceSizeKey;
|
|
17
19
|
datePickerInputFillHover?: SelectProps<Option>['fillHover'];
|
|
@@ -20,6 +22,12 @@ type DatePeriodAppearanceProps<Option> = {
|
|
|
20
22
|
fillHover?: FillHoverProps;
|
|
21
23
|
selectAppearance?: SelectAppearanceProps<Option>['appearance'];
|
|
22
24
|
selectAppearanceSize?: AppearanceSizeKey;
|
|
25
|
+
selectFirstIsSearchable?: SelectProps<Option>['isSearchable'];
|
|
26
|
+
selectFirstWidth?: SelectProps<Option>['width'];
|
|
27
|
+
selectFirstWidthMobile?: SelectProps<Option>['width'];
|
|
28
|
+
selectSecondIsSearchable?: SelectProps<Option>['isSearchable'];
|
|
29
|
+
selectSecondWidth?: SelectProps<Option>['width'];
|
|
30
|
+
selectSecondWidthMobile?: SelectProps<Option>['width'];
|
|
23
31
|
selectShape?: SelectProps<Option>['shape'];
|
|
24
32
|
shape?: ShapeProps;
|
|
25
33
|
size?: SizeProps;
|
|
@@ -43,7 +51,6 @@ type DatePeriodProps<Option = SelectOption> = DatePeriodAppearanceProps<Option>
|
|
|
43
51
|
datePickerAppearanceSize?: AppearanceSizeKey;
|
|
44
52
|
isDisabled?: boolean;
|
|
45
53
|
isSkeleton?: boolean;
|
|
46
|
-
monthsShown?: number;
|
|
47
54
|
onChangeDatePeriod?: DatePickerInputProps['onChange'];
|
|
48
55
|
onChangeDatePeriodFirstSelect?: SelectProps<Option>['onChange'];
|
|
49
56
|
onChangeDatePeriodSecondSelect?: SelectProps<Option>['onChange'];
|
|
@@ -16,7 +16,7 @@ const datePeriodConfig = {
|
|
|
16
16
|
},
|
|
17
17
|
};
|
|
18
18
|
function DatePeriod(props) {
|
|
19
|
-
const { appearance, className, dataTestId, dataTour, datePeriodIntervalsList = Object.values(DATE_PERIOD_INTERVALS), datePeriodSelectFirstOptions, datePeriodSelectFirstPlaceholder, datePeriodSelectFirstValue, datePeriodSelectSecondOptions, datePeriodSelectSecondPlaceholder, datePeriodSelectSecondValue, datePeriodValueEnd, datePeriodValueStart, monthsShown, popperPlacement, selectsRange = true, showWeekNumbers =
|
|
19
|
+
const { appearance, className, dataTestId, dataTour, datePeriodIntervalsList = Object.values(DATE_PERIOD_INTERVALS), datePeriodSelectFirstOptions, datePeriodSelectFirstPlaceholder = 'Выбрать период', datePeriodSelectFirstValue, datePeriodSelectSecondOptions, datePeriodSelectSecondPlaceholder = 'Выбрать период', datePeriodSelectSecondValue, datePeriodValueEnd, datePeriodValueStart, monthsShown = 2, popperPlacement, selectFirstIsSearchable = true, selectFirstWidth = '180px', selectSecondIsSearchable = true, selectSecondWidth = '180px', selectsRange = true, showWeekNumbers = false, isDisabled, isSkeleton, onChangeDatePeriod, onChangeDatePeriodFirstSelect, onChangeDatePeriodSecondSelect, onKeyDown, } = props;
|
|
20
20
|
const appearanceConfig = useAppearanceConfig(appearance, datePeriodConfig, isDisabled);
|
|
21
21
|
const propsGenerator = useDevicePropsGenerator(props, appearanceConfig);
|
|
22
22
|
const { fillClass, chipsAppearance, chipsAppearanceSize, chipsShape, datePickerAppearance, datePickerAppearanceSize, datePickerInputAppearance, datePickerInputAppearanceSize, datePickerInputFillHover, datePickerInputTextSize, selectAppearance, selectAppearanceSize, selectShape, shapeClass, sizeClass, } = propsGenerator;
|
|
@@ -42,7 +42,7 @@ function DatePeriod(props) {
|
|
|
42
42
|
return (_jsxs("div", { className: clsx(className, 'date-period', sizeClass && `date-period_size_${sizeClass}`, isSkeleton && `skeleton`), "data-testid": dataTestId, "data-tour": dataTour, children: [_jsxs("div", { className: clsx('date-period__wrapper', shapeClass && `shape_${shapeClass}`, fillClass && `fill_${fillClass}`, 'cursor_type_pointer'), children: [_jsx(ChipsGroup, { className: "date-period__choice", direction: "horizontal", children: datePeriodIntervalsList.map((datePeriodItem) => (_jsx(Chips, { appearance: mergeAppearanceKeys(chipsAppearance, chipsAppearanceSize), label: datePeriodItem.label, shape: chipsShape, isActive: checkIsChipsActive(datePeriodItem), onClick: () => onClickPeriodChips(datePeriodItem) }, datePeriodItem.value))) }), _jsx(DatePickerInput, { className: "date-period__datepicker", datePickerProps: {
|
|
43
43
|
appearance: mergeAppearanceKeys(datePickerAppearance, datePickerAppearanceSize),
|
|
44
44
|
dateFormat: 'dd/MM/yyyy',
|
|
45
|
-
monthsShown: monthsShown,
|
|
45
|
+
monthsShown: propsGenerator.monthsShown ?? monthsShown,
|
|
46
46
|
popperPlacement: popperPlacement,
|
|
47
47
|
selectsRange: selectsRange,
|
|
48
48
|
showWeekNumbers: showWeekNumbers,
|
|
@@ -54,6 +54,8 @@ function DatePeriod(props) {
|
|
|
54
54
|
fillHover: datePickerInputFillHover,
|
|
55
55
|
textSize: datePickerInputTextSize,
|
|
56
56
|
placeholder: 'Выбрать период',
|
|
57
|
-
}, value: datePeriodValueStart, onChange: onChangeDatePeriod })] }), datePeriodSelectFirstOptions && (_jsx(Select, { appearance: mergeAppearanceKeys(selectAppearance, selectAppearanceSize), className: "date-period__select", width:
|
|
57
|
+
}, value: datePeriodValueStart, onChange: onChangeDatePeriod })] }), datePeriodSelectFirstOptions && (_jsx(Select, { appearance: mergeAppearanceKeys(selectAppearance, selectAppearanceSize), className: "date-period__select", width: (propsGenerator.selectFirstWidth ??
|
|
58
|
+
selectFirstWidth), minWidth: propsGenerator.selectFirstWidth ?? selectFirstWidth, options: datePeriodSelectFirstOptions, placeholder: datePeriodSelectFirstPlaceholder, shape: selectShape, value: datePeriodSelectFirstValue ?? null, isSearchable: propsGenerator.selectFirstIsSearchable ?? selectFirstIsSearchable, onChange: onChangeDatePeriodFirstSelect })), datePeriodSelectSecondOptions && (_jsx(Select, { appearance: mergeAppearanceKeys(selectAppearance, selectAppearanceSize), className: "date-period__select", width: (propsGenerator.selectSecondWidth ??
|
|
59
|
+
selectSecondWidth), minWidth: propsGenerator.selectSecondWidth ?? selectSecondWidth, options: datePeriodSelectSecondOptions, placeholder: datePeriodSelectSecondPlaceholder, shape: selectShape, value: datePeriodSelectSecondValue ?? null, isSearchable: propsGenerator.selectSecondIsSearchable ?? selectSecondIsSearchable, onChange: onChangeDatePeriodSecondSelect }))] }));
|
|
58
60
|
}
|
|
59
61
|
export { DatePeriod, datePeriodConfig };
|
|
@@ -22,7 +22,7 @@ const Component = (args) => {
|
|
|
22
22
|
setStartDatePickerPeriod(start ? new Date(start).toISOString() : start);
|
|
23
23
|
setEndDatePickerPeriod(end ? new Date(end).toISOString() : end);
|
|
24
24
|
}, []);
|
|
25
|
-
return (_jsx(DatePeriod, { ...args, appearance: "surfaceSecondary sizeL solid rounded", datePeriodValueEnd: endDatePickerPeriod, datePeriodValueStart: startDatePickerPeriod,
|
|
25
|
+
return (_jsx(DatePeriod, { ...args, appearance: "surfaceSecondary sizeL solid rounded", datePeriodValueEnd: endDatePickerPeriod, datePeriodValueStart: startDatePickerPeriod, onChangeDatePeriod: onChangeDatePeriod }));
|
|
26
26
|
};
|
|
27
27
|
export const ChangeChips = {
|
|
28
28
|
play: async ({ args, canvas, step }) => {
|
|
@@ -78,7 +78,7 @@ function DatePickerInput(props) {
|
|
|
78
78
|
yearTextWeight,
|
|
79
79
|
]);
|
|
80
80
|
const { styles: datePickerStyles } = useStyles(props);
|
|
81
|
-
return (_jsx("div", { className: clsx(className, 'datepicker', monthsShown && 'datepicker_multiple-months', customTimeInput && 'datepicker_button', sizeClass && `datepicker_size_${sizeClass}`, widthClass && `datepicker_width_${widthClass}`), "data-testid": dataTestId, "data-tour": dataTour, style: datePickerStyles, children: _jsx(DatePicker, { ref: datepickerRef, ...datePickerProps, minDate: disablePastDays ? new Date() : undefined, customInput: _jsx(DatePickerCustomInput, { datepickerRef: datepickerRef, inputProps: inputProps, isClearable: isClearable }), endDate: selectsRange ? dateEnd : undefined, locale: ru, outsideClickIgnoreClass: "react-datepicker-popper", popperClassName: popper && `react-datepicker-popper-${popper}`, popperPlacement: popperPlacement, preventOpenOnFocus: true, renderCustomHeader: renderCustomHeader, renderDayContents: renderDayContents, selected: dateStart, startDate: dateStart, isClearable: false, onChange: handleChange, onWeekSelect: showWeekNumbers ? handleWeekSelect : undefined }) }));
|
|
81
|
+
return (_jsx("div", { className: clsx(className, 'datepicker', monthsShown != null && monthsShown > 1 && 'datepicker_multiple-months', customTimeInput && 'datepicker_button', sizeClass && `datepicker_size_${sizeClass}`, widthClass && `datepicker_width_${widthClass}`), "data-testid": dataTestId, "data-tour": dataTour, style: datePickerStyles, children: _jsx(DatePicker, { ref: datepickerRef, ...datePickerProps, monthsShown: monthsShown, minDate: disablePastDays ? new Date() : undefined, customInput: _jsx(DatePickerCustomInput, { datepickerRef: datepickerRef, inputProps: inputProps, isClearable: isClearable }), endDate: selectsRange ? dateEnd : undefined, locale: ru, outsideClickIgnoreClass: "react-datepicker-popper", popperClassName: popper && `react-datepicker-popper-${popper}`, popperPlacement: popperPlacement, preventOpenOnFocus: true, renderCustomHeader: renderCustomHeader, renderDayContents: renderDayContents, selected: dateStart, startDate: dateStart, isClearable: false, onChange: handleChange, onWeekSelect: showWeekNumbers ? handleWeekSelect : undefined }) }));
|
|
82
82
|
}
|
|
83
83
|
const DatePickerCustomInput = React.forwardRef((props, ref) => {
|
|
84
84
|
const { inputIcon, inputProps, value, isClearable } = props;
|
|
@@ -26,6 +26,6 @@ function Tab(props) {
|
|
|
26
26
|
});
|
|
27
27
|
const { justifyContentClass, alignClass, labelTextAlign, labelTextColor, labelTextColorActive, labelTextColorHover, labelTextSize, labelTextStyle, labelTextWeight, labelTextWrap, badgeAppearance, badgeAppearanceSize, badgeShape, badgeSize, badgeTextColor, badgeTextSize, dividerFill, dividerFillActive, dividerFillActiveHover, dividerFillDisabled, dividerFillHover, dividerSize, dividerSizeActive, icon, iconFill, iconFillIcon, iconFillSize, iconShape, iconSize, iconSrc, linkFill, shapeClass, sizeClass, widthClass, } = propsGenerator;
|
|
28
28
|
const { styles: tab } = useStyles(props);
|
|
29
|
-
return (_jsx("div", { className: clsx('tab', className, rootClasses, isActive && 'tab_state_active', isDisabled && 'tab_state_disabled', sizeClass && `tab_size_${sizeClass}`, shapeClass && `shape_${shapeClass}`, widthClass && `width_${widthClass}`, justifyContentClass && `tab_justify-content_${justifyContentClass}`, isSkeleton && `skeleton`, onClick && 'cursor_type_pointer'), "data-testid": dataTestId && `${dataTestId}Tab`, "data-tour": dataTour, style: tab, onClick: onClick, onMouseEnter: onMouseEnter, children: _jsxs(Link, { className: clsx('tab__link', !isDisabled && 'cursor_type_pointer'), fill: linkFill, href: link || href, rel: rel, target: target, children: [before, children || (_jsxs(React.Fragment, { children: [_jsxs("div", { className: clsx('tab__wrapper', alignClass && `align_${alignClass}`), children: [label && (_jsx(Text, { className: "tab__label", size: labelTextSize, textAlign: labelTextAlign, textColor: labelTextColor, textColorActive: labelTextColorActive, textColorHover: labelTextColorHover, textStyle: labelTextStyle, textWeight: labelTextWeight, textWrap: labelTextWrap, isActive: isActive, isDisabled: isDisabled, children: label })), Boolean(badgeValue) && (_jsx(Badge, { appearance: mergeAppearanceKeys(badgeAppearance, badgeAppearanceSize), size: badgeSize, textColor: badgeTextColor, textSize: badgeTextSize, shape: badgeShape, value: badgeValue })), (icon || iconSrc) && (_jsx(Icon, { className: "tab__icon_after", fill: iconFill, fillSize: iconFillSize, iconFill: iconFillIcon, iconSize: iconSize, imageSrc: iconSrc, shape: iconShape, SvgImage: icon }))] }), isActive, _jsx(Divider, { className: "tab__divider", width: "fill", direction: "horizontal", size: isActive ? dividerSizeActive : dividerSize, fill: dividerFill, fillActive: dividerFillActive, fillActiveHover: dividerFillActiveHover, fillDisabled: dividerFillDisabled, fillHover: dividerFillHover, zIndex: "1", isActive: isActive, isDisabled: isDisabled })] })), after] }) }));
|
|
29
|
+
return (_jsx("div", { className: clsx('tab', className, rootClasses, isActive && 'tab_state_active', isDisabled && 'tab_state_disabled', sizeClass && `tab_size_${sizeClass}`, shapeClass && `shape_${shapeClass}`, widthClass && `width_${widthClass}`, justifyContentClass && `tab_justify-content_${justifyContentClass}`, isSkeleton && `skeleton`, onClick && 'cursor_type_pointer'), "data-testid": dataTestId && `${dataTestId}Tab`, "data-tour": dataTour, style: tab, onClick: onClick, onMouseEnter: onMouseEnter, children: _jsxs(Link, { className: clsx('tab__link', !isDisabled && 'cursor_type_pointer'), fill: linkFill, href: link || href, rel: rel, target: target, children: [before, children || (_jsxs(React.Fragment, { children: [_jsxs("div", { className: clsx('tab__wrapper', alignClass && `align_${alignClass}`), children: [label && (_jsx(Text, { className: "tab__label", size: labelTextSize, textAlign: labelTextAlign, textColor: labelTextColor, textColorActive: labelTextColorActive, textColorHover: labelTextColorHover, textStyle: labelTextStyle, textWeight: labelTextWeight, textWrap: labelTextWrap, isActive: isActive, isDisabled: isDisabled, children: label })), Boolean(badgeValue) && (_jsx(Badge, { appearance: mergeAppearanceKeys(badgeAppearance, badgeAppearanceSize), dataTestId: dataTestId && `${dataTestId}TabBadge`, size: badgeSize, textColor: badgeTextColor, textSize: badgeTextSize, shape: badgeShape, value: badgeValue })), (icon || iconSrc) && (_jsx(Icon, { className: "tab__icon_after", fill: iconFill, fillSize: iconFillSize, iconFill: iconFillIcon, iconSize: iconSize, imageSrc: iconSrc, shape: iconShape, SvgImage: icon }))] }), isActive, _jsx(Divider, { className: "tab__divider", width: "fill", direction: "horizontal", size: isActive ? dividerSizeActive : dividerSize, fill: dividerFill, fillActive: dividerFillActive, fillActiveHover: dividerFillActiveHover, fillDisabled: dividerFillDisabled, fillHover: dividerFillHover, zIndex: "1", isActive: isActive, isDisabled: isDisabled })] })), after] }) }));
|
|
30
30
|
}
|
|
31
31
|
export { Tab, tabConfig };
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@itcase/ui-web",
|
|
3
|
-
"version": "1.10.
|
|
3
|
+
"version": "1.10.24",
|
|
4
4
|
"description": "UI components",
|
|
5
5
|
"keywords": "",
|
|
6
6
|
"license": "MIT",
|
|
@@ -53,7 +53,7 @@
|
|
|
53
53
|
"@itcase/tokens-am": "^1.1.57",
|
|
54
54
|
"@itcase/tokens-baikal": "^1.1.54",
|
|
55
55
|
"@itcase/tokens-palette": "^1.1.50",
|
|
56
|
-
"@itcase/ui-core": "^1.10.
|
|
56
|
+
"@itcase/ui-core": "^1.10.24",
|
|
57
57
|
"@rc-component/tooltip": "^1.4.0",
|
|
58
58
|
"axios": "^1.17.0",
|
|
59
59
|
"clsx": "^2.1.1",
|
|
@@ -116,5 +116,5 @@
|
|
|
116
116
|
"storybook": "^10.4.2",
|
|
117
117
|
"typescript": "^6.0.3"
|
|
118
118
|
},
|
|
119
|
-
"gitHead": "
|
|
119
|
+
"gitHead": "228a9c71351b273ccd1cb06e78c4adcb96d2ad68"
|
|
120
120
|
}
|