@tedi-design-system/react 18.2.0-rc.1 → 18.2.0-rc.3

package/src/tedi/components/content/calendar/components/calendar-header/calendar-header.es.js

@@ -1,27 +1,27 @@
-import { jsxs as a, jsx as n, Fragment as v } from "react/jsx-runtime";
-import D from "../../../../../../../external/classnames/index.es.js";
-import { useCallback as B, useMemo as N } from "react";
+import { jsxs as a, jsx as n } from "react/jsx-runtime";
+import v from "../../../../../../../external/classnames/index.es.js";
+import { useCallback as B, useMemo as x } from "react";
 import { Icon as g } from "../../../../base/icon/icon.es.js";
 import { Text as C } from "../../../../base/typography/text/text.es.js";
-import { Button as m } from "../../../../buttons/button/button.es.js";
+import { Button as s } from "../../../../buttons/button/button.es.js";
 import r from "./calendar-header.module.scss.es.js";
 import { useLabels as G } from "../../../../../providers/label-provider/use-labels.es.js";
 import { useNavigation as H } from "../../../../../../../external/react-day-picker/dist/esm/types/deprecated.es.js";
 import { dateMatchModifiers as R } from "../../../../../../../external/react-day-picker/dist/esm/utils/dateMatchModifiers.es.js";
 import { Dropdown as c } from "../../../../overlays/dropdown/dropdown.es.js";
 function Z({
-  calendarMonth: Y,
-  monthYearSelectType: F = "dropdown",
-  onOpenMonthGrid: T,
-  onOpenYearGrid: L,
+  calendarMonth: L,
+  monthYearSelectType: D = "dropdown",
+  onOpenMonthGrid: Y,
+  onOpenYearGrid: F,
   showNavigation: _ = !0,
-  localeCode: p,
+  localeCode: u,
   disabledMatchers: o
 }) {
-  const f = F === "grid", { getLabel: u } = G(), { goToMonth: h, nextMonth: S, previousMonth: x } = H(), d = Y.date, i = d.getFullYear(), y = d.getMonth(), A = Array.from(
+  const f = D === "grid", T = D === "static" || !_, { getLabel: p } = G(), { goToMonth: h, nextMonth: N, previousMonth: S } = H(), d = L.date, i = d.getFullYear(), y = d.getMonth(), A = Array.from(
     { length: 12 },
-    (t, e) => new Date(i, e, 1).toLocaleString(p, { month: "long" })
-  ), I = (/* @__PURE__ */ new Date()).getFullYear(), s = Array.from({ length: 21 }, (t, e) => I - 10 + e), w = B(
+    (t, e) => new Date(i, e, 1).toLocaleString(u, { month: "long" })
+  ), I = (/* @__PURE__ */ new Date()).getFullYear(), m = Array.from({ length: 21 }, (t, e) => I - 10 + e), w = B(
     (t, e) => {
       if (!(o != null && o.length)) return !1;
       const l = new Date(t);
@@ -32,7 +32,7 @@ function Z({
       return !0;
     },
     [o]
-  ), j = N(() => {
+  ), j = x(() => {
     if (!(o != null && o.length)) return /* @__PURE__ */ new Set();
     const t = /* @__PURE__ */ new Set();
     for (let e = 0; e < 12; e++) {
@@ -40,53 +40,56 @@ function Z({
       w(l, k) && t.add(e);
     }
     return t;
-  }, [o, i, w]), O = N(() => {
+  }, [o, i, w]), O = x(() => {
     if (!(o != null && o.length)) return /* @__PURE__ */ new Set();
     const t = /* @__PURE__ */ new Set();
-    for (const e of s) {
+    for (const e of m) {
       const l = new Date(e, 0, 1), k = new Date(e, 11, 31);
       w(l, k) && t.add(e);
     }
     return t;
-  }, [o, s, w]);
+  }, [o, m, w]);
   return /* @__PURE__ */ a(
     "div",
     {
-      className: D(r["tedi-calendar__header"], {
+      className: v(r["tedi-calendar__header"], {
         [r["tedi-calendar__no-navigation"]]: !_
       }),
       children: [
         _ && /* @__PURE__ */ n(
-          m,
+          s,
           {
             type: "button",
-            onClick: () => x && h(x),
-            "aria-label": u("pickers.previousMonth"),
+            onClick: () => S && h(S),
+            "aria-label": p("pickers.previousMonth"),
             icon: "arrow_back",
             visualType: "neutral",
-            children: u("pickers.previousMonth")
+            children: p("pickers.previousMonth")
           }
         ),
-        _ ? f ? /* @__PURE__ */ a(v, { children: [
+        T ? /* @__PURE__ */ a("div", { className: r["tedi-calendar__month-year-label"], children: [
+          /* @__PURE__ */ n(C, { children: d.toLocaleString(u, { month: "long" }) }),
+          /* @__PURE__ */ n(C, { children: i })
+        ] }) : f ? /* @__PURE__ */ a("div", { className: r["tedi-calendar__title"], children: [
           /* @__PURE__ */ a(
-            m,
+            s,
             {
               noStyle: !0,
               className: r["tedi-calendar__month-year-selector"],
-              onClick: T,
+              onClick: Y,
               "data-testid": "tedi-calendar-month-trigger",
               children: [
-                d.toLocaleString(p, { month: "long" }),
+                d.toLocaleString(u, { month: "long" }),
                 /* @__PURE__ */ n(g, { name: "arrow_drop_down", color: "tertiary", className: r["tedi-calendar__month-year-caret"] })
               ]
             }
           ),
           /* @__PURE__ */ a(
-            m,
+            s,
             {
               noStyle: !0,
               className: r["tedi-calendar__month-year-selector"],
-              onClick: L,
+              onClick: F,
               "data-testid": "tedi-calendar-year-trigger",
               children: [
                 d.getFullYear(),
@@ -94,18 +97,18 @@ function Z({
               ]
             }
           )
-        ] }) : /* @__PURE__ */ a(v, { children: [
+        ] }) : /* @__PURE__ */ a("div", { className: r["tedi-calendar__title"], children: [
           /* @__PURE__ */ a(
             c,
             {
-              className: D(r["tedi-calendar__month-year-dropdown"], {
+              className: v(r["tedi-calendar__month-year-dropdown"], {
                 [r["tedi-calendar__picker-grid-dropdown"]]: f
               }),
               width: "auto",
               defaultActiveIndex: y,
               children: [
-                /* @__PURE__ */ n(c.Trigger, { children: /* @__PURE__ */ a(m, { noStyle: !0, className: r["tedi-calendar__month-year-selector"], children: [
-                  d.toLocaleString(p, { month: "long" }),
+                /* @__PURE__ */ n(c.Trigger, { children: /* @__PURE__ */ a(s, { noStyle: !0, className: r["tedi-calendar__month-year-selector"], children: [
+                  d.toLocaleString(u, { month: "long" }),
                   /* @__PURE__ */ n(
                     g,
                     {
@@ -133,13 +136,13 @@ function Z({
           /* @__PURE__ */ a(
             c,
             {
-              className: D(r["tedi-calendar__month-year-dropdown"], {
+              className: v(r["tedi-calendar__month-year-dropdown"], {
                 [r["tedi-calendar__picker-grid-dropdown"]]: f
               }),
               width: "auto",
-              defaultActiveIndex: s.indexOf(i) === -1 ? void 0 : s.indexOf(i),
+              defaultActiveIndex: m.indexOf(i) === -1 ? void 0 : m.indexOf(i),
               children: [
-                /* @__PURE__ */ n(c.Trigger, { children: /* @__PURE__ */ a(m, { noStyle: !0, className: r["tedi-calendar__month-year-selector"], children: [
+                /* @__PURE__ */ n(c.Trigger, { children: /* @__PURE__ */ a(s, { noStyle: !0, className: r["tedi-calendar__month-year-selector"], children: [
                   d.getFullYear(),
                   /* @__PURE__ */ n(
                     g,
@@ -151,7 +154,7 @@ function Z({
                     }
                   )
                 ] }) }),
-                /* @__PURE__ */ n(c.Content, { children: s.map((t, e) => /* @__PURE__ */ n(
+                /* @__PURE__ */ n(c.Content, { children: m.map((t, e) => /* @__PURE__ */ n(
                   c.Item,
                   {
                     index: e,
@@ -165,19 +168,16 @@ function Z({
               ]
             }
           )
-        ] }) : /* @__PURE__ */ a("div", { className: r["tedi-calendar__month-year-label"], children: [
-          /* @__PURE__ */ n(C, { children: d.toLocaleString(p, { month: "long" }) }),
-          /* @__PURE__ */ n(C, { children: i })
         ] }),
         _ && /* @__PURE__ */ n(
-          m,
+          s,
           {
             type: "button",
-            onClick: () => S && h(S),
+            onClick: () => N && h(N),
             visualType: "neutral",
-            "aria-label": u("pickers.nextMonth"),
+            "aria-label": p("pickers.nextMonth"),
             icon: "arrow_forward",
-            children: u("pickers.nextMonth")
+            children: p("pickers.nextMonth")
           }
         )
       ]

package/src/tedi/components/content/calendar/components/calendar-header/calendar-header.module.scss.cjs.js

@@ -1 +1 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e={"tedi-calendar__header":"tedi-calendar__header-b917e6c6","tedi-calendar__no-navigation":"tedi-calendar__no-navigation-6ed593b5","tedi-calendar__month-year-dropdown":"tedi-calendar__month-year-dropdown-87f6e081","tedi-calendar__month-year-selector":"tedi-calendar__month-year-selector-8fbb2727","tedi-calendar__month-year-caret":"tedi-calendar__month-year-caret-a08a1e16","tedi-calendar__month-year-label":"tedi-calendar__month-year-label-d3cf51de"};exports.default=e;
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e={"tedi-calendar__header":"tedi-calendar__header-b917e6c6","tedi-calendar__no-navigation":"tedi-calendar__no-navigation-6ed593b5","tedi-calendar__title":"tedi-calendar__title-bb2ef90a","tedi-calendar__month-year-dropdown":"tedi-calendar__month-year-dropdown-87f6e081","tedi-calendar__month-year-selector":"tedi-calendar__month-year-selector-8fbb2727","tedi-calendar__month-year-caret":"tedi-calendar__month-year-caret-a08a1e16","tedi-calendar__month-year-label":"tedi-calendar__month-year-label-d3cf51de"};exports.default=e;

package/src/tedi/components/content/calendar/components/calendar-header/calendar-header.module.scss.es.js

@@ -1,6 +1,7 @@
 const e = {
   "tedi-calendar__header": "tedi-calendar__header-b917e6c6",
   "tedi-calendar__no-navigation": "tedi-calendar__no-navigation-6ed593b5",
+  "tedi-calendar__title": "tedi-calendar__title-bb2ef90a",
   "tedi-calendar__month-year-dropdown": "tedi-calendar__month-year-dropdown-87f6e081",
   "tedi-calendar__month-year-selector": "tedi-calendar__month-year-selector-8fbb2727",
   "tedi-calendar__month-year-caret": "tedi-calendar__month-year-caret-a08a1e16",

package/src/tedi/components/form/date-field/date-field.cjs.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const p=require("react/jsx-runtime"),A=require("../../../../../external/@floating-ui/react/dist/floating-ui.react.cjs.js"),I=require("../../../../../external/classnames/index.cjs.js"),a=require("react"),_t=require("../../content/calendar/calendar.cjs.js"),xt=require("../multi-value-field/multi-value-field.cjs.js"),Mt=require("../textfield/textfield.cjs.js"),y=require("./date-field.module.scss.cjs.js"),P=require("./date-field-helpers.cjs.js"),Ct=require("./date-picker-modal/date-picker-modal.cjs.js"),At=require("../../../helpers/hooks/use-breakpoint-props.cjs.js"),Ft=require("../../../providers/label-provider/use-labels.cjs.js"),kt=require("../../../../../external/react-day-picker/dist/esm/locale/et.cjs.js"),me=require("../../../helpers/hooks/use-breakpoint.cjs.js"),Pt=require("../../../../../external/@floating-ui/dom/dist/floating-ui.dom.cjs.js"),G=require("../../../../../external/@floating-ui/react-dom/dist/floating-ui.react-dom.cjs.js"),vt=require("../../../../../external/react-day-picker/dist/esm/utils/dateMatchModifiers.cjs.js"),Te=a.forwardRef((T,v)=>{const{getCurrentBreakpointProps:je}=At.useBreakpointProps(T.defaultServerBreakpoint),{getLabel:z}=Ft.useLabels(),{useNativePicker:Se=!1,enableCalendar:h=!0,calendarTrigger:j="button",numberOfMonths:X}=je(T),{id:pe,mode:l="single",label:he,selected:w,onSelect:i,disabled:N,disabledMatchers:E,placeholder:Le,className:$e,formatDate:u,required:S,showOutsideDays:ge=!0,parseDate:He,monthYearSelectType:be,tagsDirection:Ue,showNavigation:ye=!0,selectionLevel:O="days",initialView:L,locale:De=kt.et,localeCode:$="et-EE",initialMonth:H,closeOnSelect:We,footer:_e,defaultValue:U,minDate:J,maxDate:K,disablePast:xe,disableFuture:Me,shouldDisableMonth:Q,shouldDisableYear:Z,readOnly:R,availableDays:Ce,inputProps:n,modal:ee=!1,modalProps:Ye,modalTitle:Ge,disabledDateErrorMessage:ze=z("dateField.disabledDateError"),invalidDateErrorMessage:Xe=z("dateField.invalidDateError"),useNativePicker:wt,enableCalendar:Nt,calendarTrigger:Et,numberOfMonths:Ot,defaultServerBreakpoint:Rt,sm:Vt,md:qt,lg:Bt,xl:It,xxl:Tt,...Ae}=T,f=Se&&l==="single",Fe=me.default(T.defaultServerBreakpoint),F=me.isBreakpointBelow(Fe,"md"),[Je,D]=a.useState(w??U),[g,V]=a.useState(!1),[te,ke]=a.useState(!1),[Ke,Pe]=a.useState(L??O),[re,_]=a.useState(""),[ve,m]=a.useState(!1),[we,ae]=a.useState(!1),b=h&&!f&&!R&&(ee===!0||typeof ee=="string"&&me.isBreakpointBelow(Fe,ee)),Ne=F&&!b&&typeof X=="number"&&X>1?1:X,c=w!==void 0,o=c?w:Je,ie=a.useRef(null),Ee=a.useRef(null),Qe=a.useCallback(e=>{ie.current=e,typeof v=="function"?v(e):v&&(v.current=e)},[v]),Ze=e=>{if(!e)return"";const t=e.getFullYear(),r=String(e.getMonth()+1).padStart(2,"0"),s=String(e.getDate()).padStart(2,"0");return`${t}-${r}-${s}`},et=f&&o instanceof Date?Ze(o):"",ne=a.useCallback((e,t)=>e instanceof Date?e:Array.isArray(e)&&e.length>0?[...e].sort((r,s)=>r.getTime()-s.getTime())[0]:e&&typeof e=="object"&&"from"in e&&e.from instanceof Date?e.from:e&&typeof e=="object"&&"to"in e&&e.to instanceof Date?e.to:t??new Date,[]),[tt,se]=a.useState(()=>ne(o,H));a.useEffect(()=>{g||se(ne(o,H))},[o,H,g,ne]),a.useEffect(()=>{g&&Pe(L??O)},[g,O,L]),a.useEffect(()=>{c&&D(w)},[w,c]);const x=a.useMemo(()=>new Intl.DateTimeFormat($,{day:"2-digit",month:"2-digit",year:"numeric"}),[$]),M=a.useCallback(e=>{if(!e)return"";if(e instanceof Date)return x.format(e);if(Array.isArray(e))return e.map(t=>x.format(t)).join(", ");if(e.from){const t=x.format(e.from);return e.to?`${t} – ${x.format(e.to)}`:t}return""},[x]),oe=We??l==="single",Oe=l==="multiple"&&Array.isArray(o)?o.map((e,t)=>({id:t,label:u?u(e):M(e),date:e})):[],W=a.useMemo(()=>{const e=[];return N&&(Array.isArray(N)?e.push(...N):e.push(N)),E&&(Array.isArray(E)?e.push(...E):e.push(E)),J&&e.push({before:J}),K&&e.push({after:K}),xe&&e.push({before:new Date}),Me&&e.push({after:new Date}),Q&&e.push(t=>Q(t)),Z&&e.push(t=>Z(t)),e},[N,E,J,K,xe,Me,Q,Z]),k=a.useCallback(e=>vt.dateMatchModifiers(e,W),[W]),rt=(e,t,r,s)=>{const d=l==="range"?P.resolveRangeSelection(e,o,t):e;if(m(!1),c||D(d),i==null||i(d,t,r,s),d){const C=u?u(d):M(d);_(C)}else _("");oe&&V(!1)},at=e=>{if(k(e))return;const t=l==="range"?{from:e,to:void 0}:l==="multiple"?[...Array.isArray(o)?o:[],e]:e;m(!1),c||D(t),i==null||i(t,e,{},{});const r=u?u(t):M(t);_(r),oe&&V(!1)},it=a.useMemo(()=>{const e=P.getLocaleDateParts(x),t=new RegExp(`^${P.buildDateRegexSource(e)}$`),{fieldOrder:r}=e;return s=>{const d=s.match(t);if(!d)return;const C={};r.forEach((yt,Dt)=>{C[yt]=Number(d[Dt+1])});const{day:ue,month:ce,year:fe}=C;if(ue===void 0||ce===void 0||fe===void 0)return;const B=new Date(fe,ce-1,ue);if(!(isNaN(B.getTime())||B.getFullYear()!==fe||B.getMonth()!==ce-1||B.getDate()!==ue))return B}},[x]),Re=e=>(He??(l==="single"?it:()=>{}))(e),Ve=e=>l==="single"&&e instanceof Date||l==="multiple"&&Array.isArray(e)||l==="range"&&!!e&&!Array.isArray(e)&&"from"in e,nt=e=>{if(_(e),ae(!1),e.trim()===""){m(!1);return}const t=Re(e);if(!Ve(t)){m(!1);return}const s=t&&!Array.isArray(t)&&"from"in t?t:null;if(t instanceof Date&&k(t)||Array.isArray(t)&&t.some(C=>C instanceof Date&&k(C))||!!s&&(s.from&&k(s.from)||s.to&&k(s.to))){m(!0);return}m(!1),c||D(t),i==null||i(t,t,{},{}),t instanceof Date&&se(t),oe&&V(!1)},st=()=>{if(re.trim()===""){ae(!1);return}ae(!Ve(Re(re)))};a.useEffect(()=>{if(c){const e=u?u(o):M(o);_(e)}},[o,c,u,M]),a.useEffect(()=>{if(!c&&U){const e=u?u(U):M(U);_(e)}},[]);const ot=A.useFloating({open:g,onOpenChange:V,placement:j==="input"?"bottom-start":"bottom-end",middleware:[G.offset(P.CALENDAR_POPOVER_OFFSET),G.flip(),G.shift({padding:P.CALENDAR_POPOVER_PADDING}),G.size({padding:P.CALENDAR_POPOVER_PADDING,apply({availableWidth:e,elements:t}){const r=t.floating;if(r.style.width="",r.style.maxWidth="",r.style.overflowX="",F)return;r.style.width="max-content",r.getBoundingClientRect().width>e&&(r.style.width="min-content",r.style.maxWidth=`${e}px`)}})],whileElementsMounted:Pt.autoUpdate}),{refs:q,context:Y,x:lt,y:dt,strategy:ut}=ot,ct=A.useClick(Y),qe=A.useInteractions([...h&&!f&&j==="input"&&!b?[ct]:[],A.useDismiss(Y,{outsidePress:e=>{const t=e.target;return!(t!=null&&t.closest('[role="menu"], [role="listbox"]'))}}),A.useRole(Y,{role:"dialog"})]);a.useEffect(()=>{var t,r;const e=l==="multiple"?((t=Ee.current)==null?void 0:t.wrapper)??null:((r=ie.current)==null?void 0:r.input)??null;q.setPositionReference(e??q.reference.current)},[l,g,q]);const ft=()=>{var t;const e=(t=ie.current)==null?void 0:t.input;if(e){if(typeof e.showPicker=="function")try{e.showPicker();return}catch{}e.focus()}},le=()=>{!h||R||(f?ft():b?ke(!0):V(e=>!e))},mt=e=>{if(m(!1),c||D(e),i==null||i(e,e,{},{}),e){const t=u?u(e):M(e);_(t)}else _("")},pt=e=>{if(!e){m(!1),c||D(void 0),i==null||i(void 0,void 0,{},{});return}const[t,r,s]=e.split("-").map(Number);if(!t||!r||!s)return;const d=new Date(t,r-1,s);if(!Number.isNaN(d.getTime())){if(k(d)){m(!0);return}m(!1),c||D(d),i==null||i(d,d,{},{})}},ht=qe.getReferenceProps(b&&j==="input"?{onClick:()=>le()}:void 0),{role:jt,"aria-expanded":St,"aria-haspopup":Lt,"aria-controls":gt,...bt}=ht,Be=b?void 0:gt,de=z("dateField.openCalendar"),Ie={"aria-label":de,"aria-expanded":b?te:g,"aria-haspopup":"dialog","aria-controls":Be};return p.jsxs(p.Fragment,{children:[p.jsx("div",{className:I.default(y.default["tedi-date-field__container"],$e),...bt,ref:q.setReference,children:l==="multiple"?p.jsx(xt.MultiValueField,{...n,ref:Ee,id:pe,label:he,tagsDirection:Ue,values:Oe.map(e=>e.label),icon:"calendar_today",onIconClick:le,iconButtonProps:h?Ie:{"aria-label":de},isClearable:!0,required:S,onChange:e=>{if(!Array.isArray(o))return;const t=Oe.filter(r=>e.includes(r.label)).map(r=>r.date);c||D(t),i==null||i(t,{},{},{})},className:I.default(y.default["tedi-date-field__textfield"],{[y.default["tedi-date-field__icon--disabled"]]:!h||R})}):p.jsx(Mt.TextField,{...n,ref:Qe,id:pe,label:he,readOnly:R,value:f?et:re,placeholder:Le,icon:"calendar_today",isClearable:!0,onIconClick:le,iconButtonProps:h&&!f?Ie:{"aria-label":de},onChange:e=>f?pt(e):nt(e),onBlur:e=>{var t;f||st(),(t=n==null?void 0:n.onBlur)==null||t.call(n,e)},required:S,invalid:ve||we||(n==null?void 0:n.invalid),helper:(()=>{const e=n==null?void 0:n.helper,t=ve?ze:we?Xe:null,r=t?{text:t,type:"error"}:null;return r?e?Array.isArray(e)?[...e,r]:[e,r]:r:e})(),className:I.default(y.default["tedi-date-field__textfield"],{[y.default["tedi-date-field__textfield--disabled"]]:n==null?void 0:n.disabled,[y.default["tedi-date-field__icon--disabled"]]:!h||R}),input:{...n==null?void 0:n.input,...f&&{type:"date"},...h&&!f&&j==="input"?{role:"combobox","aria-haspopup":"dialog","aria-expanded":b?te:g,"aria-controls":Be}:{}}})}),b&&p.jsx(Ct.DatePickerModal,{open:te,onOpenChange:ke,value:o,onConfirm:mt,mode:l,numberOfMonths:Ne,locale:De,localeCode:$,showOutsideDays:ge,disabledMatchers:W,required:S,availableDays:Ce,footer:_e,monthYearSelectType:be,showNavigation:ye,selectionLevel:O,initialView:L,initialMonth:H,modalProps:Ye,...Ae,title:Ge}),h&&!f&&!b&&p.jsx(A.FloatingPortal,{children:g&&p.jsx(A.FloatingFocusManager,{context:Y,modal:!1,initialFocus:-1,children:p.jsx("div",{ref:q.setFloating,className:I.default({[y.default["tedi-date-field__calendar-popover--fullwidth"]]:F}),...qe.getFloatingProps({style:{position:ut,top:dt??0,left:F?0:lt??0,right:F?0:void 0}}),children:p.jsx(_t.Calendar,{...Ae,numberOfMonths:Ne,view:Ke,selectionLevel:O,currentMonth:tt,setCurrentMonth:se,setView:Pe,mode:l,value:o,locale:De,localeCode:$,showOutsideDays:ge,disabledMatchers:W,required:S,availableDays:Ce,footer:_e,monthYearSelectType:be,showNavigation:ye,handleSelect:rt,applyValue:at,className:I.default(y.default["tedi-date-field__calendar"],{[y.default["tedi-date-field__calendar--fullwidth"]]:F})})})})})]})});Te.displayName="DateField";exports.DateField=Te;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const p=require("react/jsx-runtime"),A=require("../../../../../external/@floating-ui/react/dist/floating-ui.react.cjs.js"),I=require("../../../../../external/classnames/index.cjs.js"),a=require("react"),xt=require("../../content/calendar/calendar.cjs.js"),Mt=require("../multi-value-field/multi-value-field.cjs.js"),Ct=require("../textfield/textfield.cjs.js"),y=require("./date-field.module.scss.cjs.js"),P=require("./date-field-helpers.cjs.js"),At=require("./date-picker-modal/date-picker-modal.cjs.js"),Ft=require("../../../helpers/hooks/use-breakpoint-props.cjs.js"),kt=require("../../../providers/label-provider/use-labels.cjs.js"),Pt=require("../../../../../external/react-day-picker/dist/esm/locale/et.cjs.js"),me=require("../../../helpers/hooks/use-breakpoint.cjs.js"),vt=require("../../../../../external/@floating-ui/dom/dist/floating-ui.dom.cjs.js"),G=require("../../../../../external/@floating-ui/react-dom/dist/floating-ui.react-dom.cjs.js"),wt=require("../../../../../external/react-day-picker/dist/esm/utils/dateMatchModifiers.cjs.js"),je=a.forwardRef((T,v)=>{const{getCurrentBreakpointProps:Se}=Ft.useBreakpointProps(T.defaultServerBreakpoint),{getLabel:z}=kt.useLabels(),{useNativePicker:Le=!1,enableCalendar:h=!0,calendarTrigger:j="button",numberOfMonths:X}=Se(T),{id:pe,mode:l="single",label:he,selected:w,onSelect:i,disabled:N,disabledMatchers:E,placeholder:$e,className:He,formatDate:u,required:S,showOutsideDays:ge=!0,parseDate:Ue,monthYearSelectType:be,dayStatus:ye,tagsDirection:We,showNavigation:De=!0,selectionLevel:O="days",initialView:L,locale:_e=Pt.et,localeCode:$="et-EE",initialMonth:H,closeOnSelect:Ye,footer:xe,defaultValue:U,minDate:J,maxDate:K,disablePast:Me,disableFuture:Ce,shouldDisableMonth:Q,shouldDisableYear:Z,readOnly:R,availableDays:Ae,inputProps:n,modal:ee=!1,modalProps:Ge,modalTitle:ze,disabledDateErrorMessage:Xe=z("dateField.disabledDateError"),invalidDateErrorMessage:Je=z("dateField.invalidDateError"),useNativePicker:Nt,enableCalendar:Et,calendarTrigger:Ot,numberOfMonths:Rt,defaultServerBreakpoint:Vt,sm:qt,md:Bt,lg:It,xl:Tt,xxl:jt,...Fe}=T,f=Le&&l==="single",ke=me.default(T.defaultServerBreakpoint),F=me.isBreakpointBelow(ke,"md"),[Ke,D]=a.useState(w??U),[g,V]=a.useState(!1),[te,Pe]=a.useState(!1),[Qe,ve]=a.useState(L??O),[re,_]=a.useState(""),[we,m]=a.useState(!1),[Ne,ae]=a.useState(!1),b=h&&!f&&!R&&(ee===!0||typeof ee=="string"&&me.isBreakpointBelow(ke,ee)),Ee=F&&!b&&typeof X=="number"&&X>1?1:X,c=w!==void 0,o=c?w:Ke,ie=a.useRef(null),Oe=a.useRef(null),Ze=a.useCallback(e=>{ie.current=e,typeof v=="function"?v(e):v&&(v.current=e)},[v]),et=e=>{if(!e)return"";const t=e.getFullYear(),r=String(e.getMonth()+1).padStart(2,"0"),s=String(e.getDate()).padStart(2,"0");return`${t}-${r}-${s}`},tt=f&&o instanceof Date?et(o):"",ne=a.useCallback((e,t)=>e instanceof Date?e:Array.isArray(e)&&e.length>0?[...e].sort((r,s)=>r.getTime()-s.getTime())[0]:e&&typeof e=="object"&&"from"in e&&e.from instanceof Date?e.from:e&&typeof e=="object"&&"to"in e&&e.to instanceof Date?e.to:t??new Date,[]),[rt,se]=a.useState(()=>ne(o,H));a.useEffect(()=>{g||se(ne(o,H))},[o,H,g,ne]),a.useEffect(()=>{g&&ve(L??O)},[g,O,L]),a.useEffect(()=>{c&&D(w)},[w,c]);const x=a.useMemo(()=>new Intl.DateTimeFormat($,{day:"2-digit",month:"2-digit",year:"numeric"}),[$]),M=a.useCallback(e=>{if(!e)return"";if(e instanceof Date)return x.format(e);if(Array.isArray(e))return e.map(t=>x.format(t)).join(", ");if(e.from){const t=x.format(e.from);return e.to?`${t} – ${x.format(e.to)}`:t}return""},[x]),oe=Ye??l==="single",Re=l==="multiple"&&Array.isArray(o)?o.map((e,t)=>({id:t,label:u?u(e):M(e),date:e})):[],W=a.useMemo(()=>{const e=[];return N&&(Array.isArray(N)?e.push(...N):e.push(N)),E&&(Array.isArray(E)?e.push(...E):e.push(E)),J&&e.push({before:J}),K&&e.push({after:K}),Me&&e.push({before:new Date}),Ce&&e.push({after:new Date}),Q&&e.push(t=>Q(t)),Z&&e.push(t=>Z(t)),e},[N,E,J,K,Me,Ce,Q,Z]),k=a.useCallback(e=>wt.dateMatchModifiers(e,W),[W]),at=(e,t,r,s)=>{const d=l==="range"?P.resolveRangeSelection(e,o,t):e;if(m(!1),c||D(d),i==null||i(d,t,r,s),d){const C=u?u(d):M(d);_(C)}else _("");oe&&V(!1)},it=e=>{if(k(e))return;const t=l==="range"?{from:e,to:void 0}:l==="multiple"?[...Array.isArray(o)?o:[],e]:e;m(!1),c||D(t),i==null||i(t,e,{},{});const r=u?u(t):M(t);_(r),oe&&V(!1)},nt=a.useMemo(()=>{const e=P.getLocaleDateParts(x),t=new RegExp(`^${P.buildDateRegexSource(e)}$`),{fieldOrder:r}=e;return s=>{const d=s.match(t);if(!d)return;const C={};r.forEach((Dt,_t)=>{C[Dt]=Number(d[_t+1])});const{day:ue,month:ce,year:fe}=C;if(ue===void 0||ce===void 0||fe===void 0)return;const B=new Date(fe,ce-1,ue);if(!(isNaN(B.getTime())||B.getFullYear()!==fe||B.getMonth()!==ce-1||B.getDate()!==ue))return B}},[x]),Ve=e=>(Ue??(l==="single"?nt:()=>{}))(e),qe=e=>l==="single"&&e instanceof Date||l==="multiple"&&Array.isArray(e)||l==="range"&&!!e&&!Array.isArray(e)&&"from"in e,st=e=>{if(_(e),ae(!1),e.trim()===""){m(!1);return}const t=Ve(e);if(!qe(t)){m(!1);return}const s=t&&!Array.isArray(t)&&"from"in t?t:null;if(t instanceof Date&&k(t)||Array.isArray(t)&&t.some(C=>C instanceof Date&&k(C))||!!s&&(s.from&&k(s.from)||s.to&&k(s.to))){m(!0);return}m(!1),c||D(t),i==null||i(t,t,{},{}),t instanceof Date&&se(t),oe&&V(!1)},ot=()=>{if(re.trim()===""){ae(!1);return}ae(!qe(Ve(re)))};a.useEffect(()=>{if(c){const e=u?u(o):M(o);_(e)}},[o,c,u,M]),a.useEffect(()=>{if(!c&&U){const e=u?u(U):M(U);_(e)}},[]);const lt=A.useFloating({open:g,onOpenChange:V,placement:j==="input"?"bottom-start":"bottom-end",middleware:[G.offset(P.CALENDAR_POPOVER_OFFSET),G.flip(),G.shift({padding:P.CALENDAR_POPOVER_PADDING}),G.size({padding:P.CALENDAR_POPOVER_PADDING,apply({availableWidth:e,elements:t}){const r=t.floating;if(r.style.width="",r.style.maxWidth="",r.style.overflowX="",F)return;r.style.width="max-content",r.getBoundingClientRect().width>e&&(r.style.width="min-content",r.style.maxWidth=`${e}px`)}})],whileElementsMounted:vt.autoUpdate}),{refs:q,context:Y,x:dt,y:ut,strategy:ct}=lt,ft=A.useClick(Y),Be=A.useInteractions([...h&&!f&&j==="input"&&!b?[ft]:[],A.useDismiss(Y,{outsidePress:e=>{const t=e.target;return!(t!=null&&t.closest('[role="menu"], [role="listbox"]'))}}),A.useRole(Y,{role:"dialog"})]);a.useEffect(()=>{var t,r;const e=l==="multiple"?((t=Oe.current)==null?void 0:t.wrapper)??null:((r=ie.current)==null?void 0:r.input)??null;q.setPositionReference(e??q.reference.current)},[l,g,q]);const mt=()=>{var t;const e=(t=ie.current)==null?void 0:t.input;if(e){if(typeof e.showPicker=="function")try{e.showPicker();return}catch{}e.focus()}},le=()=>{!h||R||(f?mt():b?Pe(!0):V(e=>!e))},pt=e=>{if(m(!1),c||D(e),i==null||i(e,e,{},{}),e){const t=u?u(e):M(e);_(t)}else _("")},ht=e=>{if(!e){m(!1),c||D(void 0),i==null||i(void 0,void 0,{},{});return}const[t,r,s]=e.split("-").map(Number);if(!t||!r||!s)return;const d=new Date(t,r-1,s);if(!Number.isNaN(d.getTime())){if(k(d)){m(!0);return}m(!1),c||D(d),i==null||i(d,d,{},{})}},gt=Be.getReferenceProps(b&&j==="input"?{onClick:()=>le()}:void 0),{role:St,"aria-expanded":Lt,"aria-haspopup":$t,"aria-controls":bt,...yt}=gt,Ie=b?void 0:bt,de=z("dateField.openCalendar"),Te={"aria-label":de,"aria-expanded":b?te:g,"aria-haspopup":"dialog","aria-controls":Ie};return p.jsxs(p.Fragment,{children:[p.jsx("div",{className:I.default(y.default["tedi-date-field__container"],He),...yt,ref:q.setReference,children:l==="multiple"?p.jsx(Mt.MultiValueField,{...n,ref:Oe,id:pe,label:he,tagsDirection:We,values:Re.map(e=>e.label),icon:"calendar_today",onIconClick:le,iconButtonProps:h?Te:{"aria-label":de},isClearable:!0,required:S,onChange:e=>{if(!Array.isArray(o))return;const t=Re.filter(r=>e.includes(r.label)).map(r=>r.date);c||D(t),i==null||i(t,{},{},{})},className:I.default(y.default["tedi-date-field__textfield"],{[y.default["tedi-date-field__icon--disabled"]]:!h||R})}):p.jsx(Ct.TextField,{...n,ref:Ze,id:pe,label:he,readOnly:R,value:f?tt:re,placeholder:$e,icon:"calendar_today",isClearable:!0,onIconClick:le,iconButtonProps:h&&!f?Te:{"aria-label":de},onChange:e=>f?ht(e):st(e),onBlur:e=>{var t;f||ot(),(t=n==null?void 0:n.onBlur)==null||t.call(n,e)},required:S,invalid:we||Ne||(n==null?void 0:n.invalid),helper:(()=>{const e=n==null?void 0:n.helper,t=we?Xe:Ne?Je:null,r=t?{text:t,type:"error"}:null;return r?e?Array.isArray(e)?[...e,r]:[e,r]:r:e})(),className:I.default(y.default["tedi-date-field__textfield"],{[y.default["tedi-date-field__textfield--disabled"]]:n==null?void 0:n.disabled,[y.default["tedi-date-field__icon--disabled"]]:!h||R}),input:{...n==null?void 0:n.input,...f&&{type:"date"},...h&&!f&&j==="input"?{role:"combobox","aria-haspopup":"dialog","aria-expanded":b?te:g,"aria-controls":Ie}:{}}})}),b&&p.jsx(At.DatePickerModal,{open:te,onOpenChange:Pe,value:o,onConfirm:pt,mode:l,numberOfMonths:Ee,locale:_e,localeCode:$,showOutsideDays:ge,disabledMatchers:W,required:S,availableDays:Ae,footer:xe,monthYearSelectType:be,dayStatus:ye,showNavigation:De,selectionLevel:O,initialView:L,initialMonth:H,modalProps:Ge,...Fe,title:ze}),h&&!f&&!b&&p.jsx(A.FloatingPortal,{children:g&&p.jsx(A.FloatingFocusManager,{context:Y,modal:!1,initialFocus:-1,children:p.jsx("div",{ref:q.setFloating,className:I.default({[y.default["tedi-date-field__calendar-popover--fullwidth"]]:F}),...Be.getFloatingProps({style:{position:ct,top:ut??0,left:F?0:dt??0,right:F?0:void 0}}),children:p.jsx(xt.Calendar,{...Fe,numberOfMonths:Ee,view:Qe,selectionLevel:O,currentMonth:rt,setCurrentMonth:se,setView:ve,mode:l,value:o,locale:_e,localeCode:$,showOutsideDays:ge,disabledMatchers:W,required:S,availableDays:Ae,footer:xe,monthYearSelectType:be,dayStatus:ye,showNavigation:De,handleSelect:at,applyValue:it,className:I.default(y.default["tedi-date-field__calendar"],{[y.default["tedi-date-field__calendar--fullwidth"]]:F})})})})})]})});je.displayName="DateField";exports.DateField=je;

package/src/tedi/components/form/date-field/date-field.d.ts

@@ -1,6 +1,7 @@
 import { default as React } from 'react';
 import { DateRange, DayPickerProps, Locale, Matcher, OnSelectHandler } from 'react-day-picker';
 import { Breakpoint, BreakpointSupport } from '../../../helpers';
+import { DayStatusFn } from '../../content/calendar/calendar';
 import { ModalContentProps } from '../../overlays/modal/modal-content/modal-content';
 import { MultiValueFieldProps } from '../multi-value-field/multi-value-field';
 import { TextFieldForwardRef, TextFieldProps } from '../textfield/textfield';
@@ -127,9 +128,17 @@ export interface DateFieldProps extends BreakpointSupport<DateFieldBreakpointPro
      * Forwarded to the internal `Calendar` / `CalendarHeader`.
      * - `'dropdown'` (default) — each picker is a `<Select>` dropdown.
      * - `'grid'` — each picker opens a full grid of options.
+     * - `'static'` — the month/year is a plain, non-clickable label; only the
+     *   prev/next navigation buttons can change the month (disables month/year selection).
      * @default dropdown
      */
-    monthYearSelectType?: 'dropdown' | 'grid';
+    monthYearSelectType?: 'dropdown' | 'grid' | 'static';
+    /**
+     * Optional per-day status forwarded to the calendar. Return a `{ type, label }`
+     * to overlay a `StatusIndicator` dot on that day (the `label` is folded into the
+     * day's `aria-label`), or `null` / `undefined` for no status.
+     */
+    dayStatus?: DayStatusFn;
     /**
      * Show or hide the calendar header's previous/next navigation. When hidden, the month/year header
      * also becomes a static, non-interactive label (no dropdown / grid jumping) — so the calendar is