@itcase/ui-web 1.10.26 → 1.10.27

package/dist/cjs/components/DatePeriod.js

@@ -1 +1 @@
-"use strict";var e=require("react/jsx-runtime"),a=require("react"),r=require("clsx"),i=require("luxon"),s=require("@itcase/ui-core/hooks"),t=require("@itcase/ui-core/utils"),c=require("../../ChipsGroup_cjs_DmlWfqO5.js"),n=require("../../DatePicker_cjs_uTMwXLmJ.js");require("react-select"),require("../../primitives_cjs_EVP_2N_A.js");var p=require("../../SelectContainer_cjs_oasI4gzw.js");require("../../Group_cjs_CiLUYKP7.js");var d=require("@itcase/common");require("date-fns/locale"),require("react-datepicker"),require("../../Button_cjs_D0Fa5AsR.js"),require("../../Loader_cjs_4kGh3xPd.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=Object.values(d.DATE_PERIOD_INTERVALS);const u={appearance:o,setAppearance:e=>{u.appearance=e}};exports.DatePeriod=function(o){const{appearance:h,className:S,dataTestId:P,dataTour:z,type:m="year",datePeriodIntervalsList:_,datePeriodSelectFirstOptions:A,datePeriodSelectFirstPlaceholder:k="Выбрать период",datePeriodSelectFirstValue:I,datePeriodSelectSecondOptions:f,datePeriodSelectSecondPlaceholder:y="Выбрать период",datePeriodSelectSecondValue:j,datePeriodValueEnd:v,datePeriodValueStart:D,monthsShown:q=2,popperPlacement:L,selectFirstIsSearchable:C=!0,selectFirstWidth:g="180px",selectSecondIsSearchable:M=!0,selectSecondWidth:x="180px",selectsRange:b=!0,showWeekNumbers:w=!1,isDisabled:N,isSkeleton:F,onChangeDatePeriod:T,onChangeDatePeriodFirstSelect:E,onChangeDatePeriodSecondSelect:W,onKeyDown:O}=o,R=s.useAppearanceConfig(h,u,N),V=s.useDevicePropsGenerator(o,R),K=function(e="year",a){if("period"===e)return[];const r=a??l;if("year"===e)return r;const i="month"===e?d.DATE_PERIOD_INTERVALS.backMonth.value:d.DATE_PERIOD_INTERVALS.backQuarter.value,s=l.findIndex(e=>e.value===i),t=new Set(l.slice(0,s+1).map(e=>e.value));return r.filter(e=>t.has(e.value))}(m,_),{fillClass:X,chipsAppearance:G,chipsAppearanceSize:$,chipsShape:H,datePickerAppearance:J,datePickerAppearanceSize:B,datePickerInputAppearance:Q,datePickerInputAppearanceSize:U,datePickerInputFillHover:Y,datePickerInputTextSize:Z,selectAppearance:ee,selectAppearanceSize:ae,selectShape:re,shapeClass:ie,sizeClass:se}=V,te=a.useCallback(e=>{const a=e.dateIntervalsList[0],r=e.dateIntervalsList[1];T?.(new Date(a),new Date(r))},[T]),ce=a.useCallback(e=>{const a=e.dateIntervalsList[0],r=e.dateIntervalsList[1];let s=null,t=null;return D&&(s=i.DateTime.fromJSDate(new Date(D)).toISODate()),v&&(t=i.DateTime.fromJSDate(new Date(v)).toISODate()),a===s&&r===t},[v,D]);return e.jsxs("div",{className:r(S,"date-period",se&&`date-period_size_${se}`,F&&"skeleton"),"data-testid":P,"data-tour":z,children:[e.jsxs("div",{className:r("date-period__wrapper",ie&&`shape_${ie}`,X&&`fill_${X}`,"cursor_type_pointer"),children:[K.length>0&&e.jsx(c.ChipsGroup,{className:"date-period__choice",direction:"horizontal",children:K.map(a=>e.jsx(c.Chips,{appearance:t.mergeAppearanceKeys(G,$),label:a.label,shape:H,isActive:ce(a),onClick:()=>te(a)},a.value))}),e.jsx(n.DatePickerInput,{className:"date-period__datepicker",datePickerProps:{appearance:t.mergeAppearanceKeys(J,B),dateFormat:"dd/MM/yyyy",monthsShown:V.monthsShown??q,popperPlacement:L,selectsRange:b,showWeekNumbers:w,isClearable:!1,onKeyDown:O},endValue:v,inputProps:{appearance:t.mergeAppearanceKeys(Q,U,"ghost"),className:`date-period__datepicker-input date-period__datepicker-input_size_${se} `,fillHover:Y,textSize:Z,placeholder:"Выбрать период"},value:D,onChange:T})]}),A&&e.jsx(p.SelectContainer,{appearance:t.mergeAppearanceKeys(ee,ae),className:"date-period__select",width:V.selectFirstWidth??g,minWidth:V.selectFirstWidth??g,options:A,placeholder:k,shape:re,value:I??null,isSearchable:V.selectFirstIsSearchable??C,onChange:E}),f&&e.jsx(p.SelectContainer,{appearance:t.mergeAppearanceKeys(ee,ae),className:"date-period__select",width:V.selectSecondWidth??x,minWidth:V.selectSecondWidth??x,options:f,placeholder:y,shape:re,value:j??null,isSearchable:V.selectSecondIsSearchable??M,onChange:W})]})},exports.datePeriodAppearance=o,exports.datePeriodConfig=u;
+"use strict";var e=require("react/jsx-runtime"),a=require("react"),r=require("clsx"),i=require("luxon"),s=require("@itcase/ui-core/hooks"),t=require("@itcase/ui-core/utils"),c=require("../../ChipsGroup_cjs_DmlWfqO5.js"),n=require("../../DatePicker_cjs_uTMwXLmJ.js");require("react-select"),require("../../primitives_cjs_EVP_2N_A.js");var p=require("../../SelectContainer_cjs_oasI4gzw.js");require("../../Group_cjs_CiLUYKP7.js");var d=require("@itcase/common");require("date-fns/locale"),require("react-datepicker"),require("../../Button_cjs_D0Fa5AsR.js"),require("../../Loader_cjs_4kGh3xPd.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=Object.values(d.DATE_PERIOD_INTERVALS);const u={appearance:o,setAppearance:e=>{u.appearance=e}};exports.DatePeriod=function(o){const{appearance:h,className:S,dataTestId:P,dataTour:z,type:m="year",datePeriodIntervalsList:_,datePeriodSelectFirstOptions:A,datePeriodSelectFirstPlaceholder:k="Выбрать",datePeriodSelectFirstValue:I,datePeriodSelectSecondOptions:f,datePeriodSelectSecondPlaceholder:y="Выбрать",datePeriodSelectSecondValue:j,datePeriodValueEnd:v,datePeriodValueStart:D,monthsShown:q=2,popperPlacement:L,selectFirstIsSearchable:C=!0,selectFirstWidth:g="180px",selectSecondIsSearchable:M=!0,selectSecondWidth:x="180px",selectsRange:b=!0,showWeekNumbers:w=!1,isDisabled:N,isSkeleton:F,onChangeDatePeriod:T,onChangeDatePeriodFirstSelect:E,onChangeDatePeriodSecondSelect:W,onKeyDown:O}=o,R=s.useAppearanceConfig(h,u,N),V=s.useDevicePropsGenerator(o,R),{fillClass:K,chipsAppearance:X,chipsAppearanceSize:G,chipsShape:$,datePickerAppearance:H,datePickerAppearanceSize:J,datePickerInputAppearance:B,datePickerInputAppearanceSize:Q,datePickerInputFillHover:U,datePickerInputTextSize:Y,selectAppearance:Z,selectAppearanceSize:ee,selectShape:ae,shapeClass:re,sizeClass:ie}=V,se=function(e="year",a){if("period"===e)return[];const r=a??l;if("year"===e)return r;const i="month"===e?d.DATE_PERIOD_INTERVALS.backMonth.value:d.DATE_PERIOD_INTERVALS.backQuarter.value,s=l.findIndex(e=>e.value===i),t=new Set(l.slice(0,s+1).map(e=>e.value));return r.filter(e=>t.has(e.value))}(V.type??m,_),te=a.useCallback(e=>{const a=e.dateIntervalsList[0],r=e.dateIntervalsList[1];T?.(new Date(a),new Date(r))},[T]),ce=a.useCallback(e=>{const a=e.dateIntervalsList[0],r=e.dateIntervalsList[1];let s=null,t=null;return D&&(s=i.DateTime.fromJSDate(new Date(D)).toISODate()),v&&(t=i.DateTime.fromJSDate(new Date(v)).toISODate()),a===s&&r===t},[v,D]);return e.jsxs("div",{className:r(S,"date-period",ie&&`date-period_size_${ie}`,F&&"skeleton"),"data-testid":P,"data-tour":z,children:[e.jsxs("div",{className:r("date-period__wrapper",re&&`shape_${re}`,K&&`fill_${K}`,"cursor_type_pointer"),children:[se.length>0&&e.jsx(c.ChipsGroup,{className:"date-period__choice",direction:"horizontal",children:se.map(a=>e.jsx(c.Chips,{appearance:t.mergeAppearanceKeys(X,G),label:a.label,shape:$,isActive:ce(a),onClick:()=>te(a)},a.value))}),e.jsx(n.DatePickerInput,{className:"date-period__datepicker",datePickerProps:{appearance:t.mergeAppearanceKeys(H,J),dateFormat:"dd/MM/yyyy",monthsShown:V.monthsShown??q,popperPlacement:L,selectsRange:b,showWeekNumbers:w,isClearable:!1,onKeyDown:O},endValue:v,inputProps:{appearance:t.mergeAppearanceKeys(B,Q,"ghost"),className:`date-period__datepicker-input date-period__datepicker-input_size_${ie} `,fillHover:U,textSize:Y,placeholder:"Выбрать период"},value:D,onChange:T})]}),A&&e.jsx(p.SelectContainer,{appearance:t.mergeAppearanceKeys(Z,ee),className:"date-period__select",width:V.selectFirstWidth??g,minWidth:V.selectFirstWidth??g,options:A,placeholder:k,shape:ae,value:I??null,isSearchable:V.selectFirstIsSearchable??C,onChange:E}),f&&e.jsx(p.SelectContainer,{appearance:t.mergeAppearanceKeys(Z,ee),className:"date-period__select",width:V.selectSecondWidth??x,minWidth:V.selectSecondWidth??x,options:f,placeholder:y,shape:ae,value:j??null,isSearchable:V.selectSecondIsSearchable??M,onChange:W})]})},exports.datePeriodAppearance=o,exports.datePeriodConfig=u;

package/dist/components/DatePeriod.js

@@ -1 +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{useAppearanceConfig as s,useDevicePropsGenerator as c}from"@itcase/ui-core/hooks";import{mergeAppearanceKeys as p}from"@itcase/ui-core/utils";import{a as o,C as d}from"../ChipsGroup_es_D3y5WSL6.js";import{D as n}from"../DatePicker_es_Bq_AFDLO.js";import"react-select";import"../primitives_es_D7LYOijE.js";import{S as l}from"../SelectContainer_es_B4IWlcz3.js";import"../Group_es_DIuSNHx3.js";import{DATE_PERIOD_INTERVALS as u}from"@itcase/common";import"date-fns/locale";import"react-datepicker";import"../Button_es_DvzjOfyQ.js";import"../Loader_es_CdWc_Prk.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=Object.values(u);const m={appearance:h,setAppearance:e=>{m.appearance=e}};function z(h){const{appearance:z,className:P,dataTestId:_,dataTour:f,type:k="year",datePeriodIntervalsList:A,datePeriodSelectFirstOptions:y,datePeriodSelectFirstPlaceholder:I="Выбрать период",datePeriodSelectFirstValue:v,datePeriodSelectSecondOptions:L,datePeriodSelectSecondPlaceholder:M="Выбрать период",datePeriodSelectSecondValue:b,datePeriodValueEnd:D,datePeriodValueStart:w,monthsShown:C=2,popperPlacement:g,selectFirstIsSearchable:j=!0,selectFirstWidth:F="180px",selectSecondIsSearchable:x=!0,selectSecondWidth:N="180px",selectsRange:W=!0,showWeekNumbers:O=!1,isDisabled:V,isSkeleton:X,onChangeDatePeriod:$,onChangeDatePeriodFirstSelect:T,onChangeDatePeriodSecondSelect:G,onKeyDown:H}=h,J=s(z,m,V),K=c(h,J),R=function(e="year",a){if("period"===e)return[];const r=a??S;if("year"===e)return r;const t="month"===e?u.backMonth.value:u.backQuarter.value,i=S.findIndex(e=>e.value===t),s=new Set(S.slice(0,i+1).map(e=>e.value));return r.filter(e=>s.has(e.value))}(k,A),{fillClass:B,chipsAppearance:E,chipsAppearanceSize:Q,chipsShape:q,datePickerAppearance:U,datePickerAppearanceSize:Y,datePickerInputAppearance:Z,datePickerInputAppearanceSize:ee,datePickerInputFillHover:ae,datePickerInputTextSize:re,selectAppearance:te,selectAppearanceSize:ie,selectShape:se,shapeClass:ce,sizeClass:pe}=K,oe=r(e=>{const a=e.dateIntervalsList[0],r=e.dateIntervalsList[1];$?.(new Date(a),new Date(r))},[$]),de=r(e=>{const a=e.dateIntervalsList[0],r=e.dateIntervalsList[1];let t=null,s=null;return w&&(t=i.fromJSDate(new Date(w)).toISODate()),D&&(s=i.fromJSDate(new Date(D)).toISODate()),a===t&&r===s},[D,w]);return e("div",{className:t(P,"date-period",pe&&`date-period_size_${pe}`,X&&"skeleton"),"data-testid":_,"data-tour":f,children:[e("div",{className:t("date-period__wrapper",ce&&`shape_${ce}`,B&&`fill_${B}`,"cursor_type_pointer"),children:[R.length>0&&a(o,{className:"date-period__choice",direction:"horizontal",children:R.map(e=>a(d,{appearance:p(E,Q),label:e.label,shape:q,isActive:de(e),onClick:()=>oe(e)},e.value))}),a(n,{className:"date-period__datepicker",datePickerProps:{appearance:p(U,Y),dateFormat:"dd/MM/yyyy",monthsShown:K.monthsShown??C,popperPlacement:g,selectsRange:W,showWeekNumbers:O,isClearable:!1,onKeyDown:H},endValue:D,inputProps:{appearance:p(Z,ee,"ghost"),className:`date-period__datepicker-input date-period__datepicker-input_size_${pe} `,fillHover:ae,textSize:re,placeholder:"Выбрать период"},value:w,onChange:$})]}),y&&a(l,{appearance:p(te,ie),className:"date-period__select",width:K.selectFirstWidth??F,minWidth:K.selectFirstWidth??F,options:y,placeholder:I,shape:se,value:v??null,isSearchable:K.selectFirstIsSearchable??j,onChange:T}),L&&a(l,{appearance:p(te,ie),className:"date-period__select",width:K.selectSecondWidth??N,minWidth:K.selectSecondWidth??N,options:L,placeholder:M,shape:se,value:b??null,isSearchable:K.selectSecondIsSearchable??x,onChange:G})]})}export{z as DatePeriod,h as datePeriodAppearance,m as datePeriodConfig};
+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{useAppearanceConfig as s,useDevicePropsGenerator as c}from"@itcase/ui-core/hooks";import{mergeAppearanceKeys as p}from"@itcase/ui-core/utils";import{a as o,C as d}from"../ChipsGroup_es_D3y5WSL6.js";import{D as n}from"../DatePicker_es_Bq_AFDLO.js";import"react-select";import"../primitives_es_D7LYOijE.js";import{S as l}from"../SelectContainer_es_B4IWlcz3.js";import"../Group_es_DIuSNHx3.js";import{DATE_PERIOD_INTERVALS as u}from"@itcase/common";import"date-fns/locale";import"react-datepicker";import"../Button_es_DvzjOfyQ.js";import"../Loader_es_CdWc_Prk.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=Object.values(u);const m={appearance:h,setAppearance:e=>{m.appearance=e}};function z(h){const{appearance:z,className:P,dataTestId:_,dataTour:f,type:k="year",datePeriodIntervalsList:A,datePeriodSelectFirstOptions:y,datePeriodSelectFirstPlaceholder:I="Выбрать",datePeriodSelectFirstValue:v,datePeriodSelectSecondOptions:L,datePeriodSelectSecondPlaceholder:M="Выбрать",datePeriodSelectSecondValue:b,datePeriodValueEnd:D,datePeriodValueStart:w,monthsShown:C=2,popperPlacement:g,selectFirstIsSearchable:j=!0,selectFirstWidth:F="180px",selectSecondIsSearchable:x=!0,selectSecondWidth:N="180px",selectsRange:W=!0,showWeekNumbers:O=!1,isDisabled:V,isSkeleton:X,onChangeDatePeriod:$,onChangeDatePeriodFirstSelect:T,onChangeDatePeriodSecondSelect:G,onKeyDown:H}=h,J=s(z,m,V),K=c(h,J),{fillClass:R,chipsAppearance:B,chipsAppearanceSize:E,chipsShape:Q,datePickerAppearance:q,datePickerAppearanceSize:U,datePickerInputAppearance:Y,datePickerInputAppearanceSize:Z,datePickerInputFillHover:ee,datePickerInputTextSize:ae,selectAppearance:re,selectAppearanceSize:te,selectShape:ie,shapeClass:se,sizeClass:ce}=K,pe=function(e="year",a){if("period"===e)return[];const r=a??S;if("year"===e)return r;const t="month"===e?u.backMonth.value:u.backQuarter.value,i=S.findIndex(e=>e.value===t),s=new Set(S.slice(0,i+1).map(e=>e.value));return r.filter(e=>s.has(e.value))}(K.type??k,A),oe=r(e=>{const a=e.dateIntervalsList[0],r=e.dateIntervalsList[1];$?.(new Date(a),new Date(r))},[$]),de=r(e=>{const a=e.dateIntervalsList[0],r=e.dateIntervalsList[1];let t=null,s=null;return w&&(t=i.fromJSDate(new Date(w)).toISODate()),D&&(s=i.fromJSDate(new Date(D)).toISODate()),a===t&&r===s},[D,w]);return e("div",{className:t(P,"date-period",ce&&`date-period_size_${ce}`,X&&"skeleton"),"data-testid":_,"data-tour":f,children:[e("div",{className:t("date-period__wrapper",se&&`shape_${se}`,R&&`fill_${R}`,"cursor_type_pointer"),children:[pe.length>0&&a(o,{className:"date-period__choice",direction:"horizontal",children:pe.map(e=>a(d,{appearance:p(B,E),label:e.label,shape:Q,isActive:de(e),onClick:()=>oe(e)},e.value))}),a(n,{className:"date-period__datepicker",datePickerProps:{appearance:p(q,U),dateFormat:"dd/MM/yyyy",monthsShown:K.monthsShown??C,popperPlacement:g,selectsRange:W,showWeekNumbers:O,isClearable:!1,onKeyDown:H},endValue:D,inputProps:{appearance:p(Y,Z,"ghost"),className:`date-period__datepicker-input date-period__datepicker-input_size_${ce} `,fillHover:ee,textSize:ae,placeholder:"Выбрать период"},value:w,onChange:$})]}),y&&a(l,{appearance:p(re,te),className:"date-period__select",width:K.selectFirstWidth??F,minWidth:K.selectFirstWidth??F,options:y,placeholder:I,shape:ie,value:v??null,isSearchable:K.selectFirstIsSearchable??j,onChange:T}),L&&a(l,{appearance:p(re,te),className:"date-period__select",width:K.selectSecondWidth??N,minWidth:K.selectSecondWidth??N,options:L,placeholder:M,shape:ie,value:b??null,isSearchable:K.selectSecondIsSearchable??x,onChange:G})]})}export{z as DatePeriod,h as datePeriodAppearance,m as datePeriodConfig};

package/dist/types/components/DatePeriod/DatePeriod.interface.d.ts

@@ -6,6 +6,7 @@ import { ChipsProps } from 'src/components/Chips/Chips.interface';
 import { DatePickerInputProps } from 'src/components/DatePicker/DatePicker.interface';
 import type { InputProps } from 'src/components/Input';
 import { SelectAppearanceProps, SelectProps } from 'src/components/Select/Select.interface';
+type DatePeriodType = 'month' | 'period' | 'quarter' | 'year';
 type DatePeriodAppearanceProps<Option> = {
     chipsAppearance?: ChipsProps['appearance'];
     chipsAppearanceSize?: AppearanceSizeKey;
@@ -31,8 +32,9 @@ type DatePeriodAppearanceProps<Option> = {
     selectShape?: SelectProps<Option>['shape'];
     shape?: ShapeProps;
     size?: SizeProps;
+    type?: DatePeriodType;
+    typeMobile?: DatePeriodType;
 };
-type DatePeriodType = 'month' | 'period' | 'quarter' | 'year';
 type DatePeriodProps<Option = SelectOption> = DatePeriodAppearanceProps<Option> & StyleAttributes & {
     appearance?: CompositeAppearanceKeys;
     chipsShape?: ChipsProps['shape'];
@@ -62,7 +64,6 @@ type DatePeriodProps<Option = SelectOption> = DatePeriodAppearanceProps<Option>
     selectShape?: SelectProps<Option>['shape'];
     selectsRange?: DatePickerInputProps['selectsRange'];
     showWeekNumbers?: boolean;
-    type?: DatePeriodType;
 };
 type DatePeriodConfig = AppearanceConfig<AppearanceKeysDefault, DatePeriodAppearanceProps<SelectOption>>;
 type DatePeriodAppearance = DatePeriodConfig['appearance'];

package/dist/types/components/DatePeriod/DatePeriod.js

@@ -8,7 +8,7 @@ import { Chips, ChipsGroup } from 'src/components/Chips';
 import { DatePickerInput } from 'src/components/DatePicker';
 import { Select } from 'src/components/Select';
 import { datePeriodAppearance } from './DatePeriod.appearance';
-import { resolveDatePeriodIntervalsList } from './DatePeriod.utils';
+import { getDatePeriodIntervalsList } from './DatePeriod.utils';
 const datePeriodConfig = {
     appearance: datePeriodAppearance,
     setAppearance: (appearanceConfig) => {
@@ -16,11 +16,11 @@ const datePeriodConfig = {
     },
 };
 function DatePeriod(props) {
-    const { appearance, className, dataTestId, dataTour, type = 'year', datePeriodIntervalsList, 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;
+    const { appearance, className, dataTestId, dataTour, type = 'year', datePeriodIntervalsList, 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;
     const appearanceConfig = useAppearanceConfig(appearance, datePeriodConfig, isDisabled);
     const propsGenerator = useDevicePropsGenerator(props, appearanceConfig);
-    const resolvedDatePeriodIntervalsList = resolveDatePeriodIntervalsList(type, datePeriodIntervalsList);
     const { fillClass, chipsAppearance, chipsAppearanceSize, chipsShape, datePickerAppearance, datePickerAppearanceSize, datePickerInputAppearance, datePickerInputAppearanceSize, datePickerInputFillHover, datePickerInputTextSize, selectAppearance, selectAppearanceSize, selectShape, shapeClass, sizeClass, } = propsGenerator;
+    const resolvedDatePeriodIntervalsList = getDatePeriodIntervalsList((propsGenerator.type ?? type), datePeriodIntervalsList);
     const onClickPeriodChips = useCallback((selectedPeriodItem) => {
         const dateStartIso = selectedPeriodItem.dateIntervalsList[0];
         const dateEndIso = selectedPeriodItem.dateIntervalsList[1];

package/dist/types/components/DatePeriod/DatePeriod.utils.d.ts

@@ -1,4 +1,4 @@
 import type { DatePeriodItem } from '@itcase/common/types';
 import type { DatePeriodType } from './DatePeriod.interface';
-declare function resolveDatePeriodIntervalsList(type?: DatePeriodType, datePeriodIntervalsList?: DatePeriodItem[]): DatePeriodItem[];
-export { resolveDatePeriodIntervalsList };
+declare function getDatePeriodIntervalsList(type?: DatePeriodType, datePeriodIntervalsList?: DatePeriodItem[]): DatePeriodItem[];
+export { getDatePeriodIntervalsList };

package/dist/types/components/DatePeriod/DatePeriod.utils.js

@@ -1,6 +1,6 @@
 import { DATE_PERIOD_INTERVALS } from '@itcase/common';
 const DATE_PERIOD_INTERVALS_LIST = Object.values(DATE_PERIOD_INTERVALS);
-function resolveDatePeriodIntervalsList(type = 'year', datePeriodIntervalsList) {
+function getDatePeriodIntervalsList(type = 'year', datePeriodIntervalsList) {
     if (type === 'period') {
         return [];
     }
@@ -15,4 +15,4 @@ function resolveDatePeriodIntervalsList(type = 'year', datePeriodIntervalsList)
     const allowedValues = new Set(DATE_PERIOD_INTERVALS_LIST.slice(0, lastIndex + 1).map((item) => item.value));
     return sourceList.filter((item) => allowedValues.has(item.value));
 }
-export { resolveDatePeriodIntervalsList };
+export { getDatePeriodIntervalsList };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@itcase/ui-web",
-  "version": "1.10.26",
+  "version": "1.10.27",
   "description": "UI components",
   "keywords": "",
   "license": "MIT",
@@ -53,7 +53,7 @@
     "@itcase/tokens-am": "^1.1.57",
     "@itcase/tokens-baikal": "^1.1.54",
     "@itcase/tokens-palette": "^1.1.50",
-    "@itcase/ui-core": "^1.10.25",
+    "@itcase/ui-core": "^1.10.27",
     "@rc-component/tooltip": "^1.4.0",
     "axios": "^1.17.0",
     "clsx": "^2.1.1",
@@ -116,5 +116,5 @@
     "storybook": "^10.4.2",
     "typescript": "^6.0.3"
   },
-  "gitHead": "1b42b5a5751ae3e8cd183985b64179b8ea9ffeaf"
+  "gitHead": "3d4d84c876ebc1173a6696cda865324de82ed77b"
 }