@tedi-design-system/react 17.0.0 → 17.1.0-rc.10

package/src/community/components/tooltip/tooltip-provider.es.js

@@ -1,11 +1,11 @@
 import { jsx as H } from "react/jsx-runtime";
-import { useFloating as W, useInteractions as A, useHover as L, safePolygon as k, useClick as S, useFocus as G, useRole as U, useDismiss as j } from "../../../../external/@floating-ui/react/dist/floating-ui.react.es.js";
+import { useFloating as W, useInteractions as A, useHover as L, useClick as k, useFocus as S, useRole as G, useDismiss as U, safePolygon as j } from "../../../../external/@floating-ui/react/dist/floating-ui.react.es.js";
 import s from "react";
-import { useLabels as B } from "../../../tedi/providers/label-provider/use-labels.es.js";
-import { useIsTouchDevice as q } from "../../../tedi/helpers/hooks/use-is-touch-device.es.js";
-import { useIsMounted as z } from "../../../tedi/helpers/hooks/use-is-mounted.es.js";
-import { autoUpdate as J } from "../../../../external/@floating-ui/dom/dist/floating-ui.dom.es.js";
-import { offset as K, flip as N, shift as Q, arrow as V } from "../../../../external/@floating-ui/react-dom/dist/floating-ui.react-dom.es.js";
+import { useIsTouchDevice as B } from "../../../tedi/helpers/hooks/use-is-touch-device.es.js";
+import { autoUpdate as q } from "../../../../external/@floating-ui/dom/dist/floating-ui.dom.es.js";
+import { offset as z, flip as J, shift as K, arrow as N } from "../../../../external/@floating-ui/react-dom/dist/floating-ui.react-dom.es.js";
+import { useLabels as Q } from "../../../tedi/providers/label-provider/use-labels.es.js";
+import { useIsMounted as V } from "../../../tedi/helpers/hooks/use-is-mounted.es.js";
 const X = 7, ce = 14, Y = 3, Z = Y + X, $ = s.createContext({
   open: !1,
   isMounted: !1,
@@ -27,7 +27,7 @@ const X = 7, ce = 14, Y = 3, Z = Y + X, $ = s.createContext({
   placement: "top",
   context: {}
 }), ie = (r) => {
-  const { getLabel: p } = B(), d = q(), {
+  const { getLabel: p } = Q(), d = B(), {
     children: m,
     placement: g = "bottom",
     openWith: o = d ? "click" : "hover",
@@ -43,34 +43,34 @@ const X = 7, ce = 14, Y = 3, Z = Y + X, $ = s.createContext({
     ...l
   } = r.focusManager ?? {}, { visuallyHiddenDismiss: y = a ? p("close") : !1 } = l ?? {}, [F, P] = s.useState(h), c = s.useRef(null), i = t && typeof n < "u" ? n : F, x = (u) => {
     typeof n > "u" && P(u), t == null || t(u);
-  }, T = z(), { x: D, y: M, refs: f, strategy: b, context: e, middlewareData: I, placement: _ } = W({
+  }, T = V(), { x: D, y: M, refs: f, strategy: b, context: e, middlewareData: I, placement: _ } = W({
     placement: g,
     open: i,
     onOpenChange: x,
     middleware: [
-      K(O),
-      N(),
-      Q({
+      z(O),
+      J(),
+      K({
         altBoundary: !0,
         padding: 8
       }),
-      V({
+      N({
         element: c,
         padding: 4
       })
     ],
-    whileElementsMounted: J
+    whileElementsMounted: q
   }), { getReferenceProps: C, getFloatingProps: E } = A([
     L(e, {
-      handleClose: k(),
+      handleClose: j(),
       enabled: o === "hover"
     }),
-    S(e),
-    G(e, {
+    k(e),
+    S(e, {
       enabled: o === "hover"
     }),
-    U(e, { role: v }),
-    j(e, {
+    G(e, { role: v }),
+    U(e, {
       ancestorScroll: !0,
       outsidePressEvent: o === "click" ? "mousedown" : "pointerdown"
       // https://floating-ui.com/docs/dialog#interaction-hooks
@@ -114,5 +114,6 @@ export {
   Z as DEFAULT_TOOLTIP_OFFSET,
   Y as GAP,
   $ as TooltipContext,
-  ie as TooltipProvider
+  ie as TooltipProvider,
+  ie as default
 };

package/src/community/components/tooltip/tooltip-trigger.cjs.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const u=require("../../../../external/@floating-ui/react/dist/floating-ui.react.cjs.js"),a=require("../../../../external/classnames/index.cjs.js"),t=require("react"),g=require("../../../tedi/components/base/icon/icon.cjs.js"),o=require("./tooltip.module.scss.cjs.js"),p=require("./tooltip-provider.cjs.js"),d=require("../../../tedi/providers/label-provider/use-labels.cjs.js"),f=r=>{const{children:e}=r,{getLabel:i}=d.useLabels(),{getReferenceProps:c,reference:n,openWith:s}=t.useContext(p.TooltipContext),l=u.useMergeRefs([n,e.ref]);return t.cloneElement(e,c({ref:l,tabIndex:0,label:e.type===g.Icon?i("tooltip.icon-trigger"):void 0,...e.props,className:a.default(o.default.tooltip__trigger,{[o.default["tooltip__trigger--click"]]:s==="click"},e.props.className)}))};exports.TooltipTrigger=f;
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const a=require("../../../../external/@floating-ui/react/dist/floating-ui.react.cjs.js"),g=require("../../../../external/classnames/index.cjs.js"),t=require("react"),p=require("../../../tedi/components/base/icon/icon.cjs.js"),o=require("./tooltip.module.scss.cjs.js"),d=require("./tooltip-provider.cjs.js"),f=require("../../../tedi/providers/label-provider/use-labels.cjs.js"),r=i=>{const{children:e}=i,{getLabel:l}=f.useLabels(),{getReferenceProps:s,reference:c,openWith:n}=t.useContext(d.TooltipContext),u=a.useMergeRefs([c,e.ref]);return t.cloneElement(e,s({ref:u,tabIndex:0,label:e.type===p.Icon?l("tooltip.icon-trigger"):void 0,...e.props,className:g.default(o.default.tooltip__trigger,{[o.default["tooltip__trigger--click"]]:n==="click"},e.props.className)}))};exports.TooltipTrigger=r;exports.default=r;

package/src/community/components/tooltip/tooltip-trigger.es.js

@@ -6,22 +6,23 @@ import t from "./tooltip.module.scss.es.js";
 import { TooltipContext as a } from "./tooltip-provider.es.js";
 import { useLabels as g } from "../../../tedi/providers/label-provider/use-labels.es.js";
 const T = (r) => {
-  const { children: e } = r, { getLabel: s } = g(), { getReferenceProps: i, reference: p, openWith: c } = o.useContext(a), l = m([p, e.ref]);
+  const { children: e } = r, { getLabel: s } = g(), { getReferenceProps: i, reference: l, openWith: p } = o.useContext(a), c = m([l, e.ref]);
   return o.cloneElement(
     e,
     i({
-      ref: l,
+      ref: c,
       tabIndex: 0,
       label: e.type === f ? s("tooltip.icon-trigger") : void 0,
       ...e.props,
       className: n(
         t.tooltip__trigger,
-        { [t["tooltip__trigger--click"]]: c === "click" },
+        { [t["tooltip__trigger--click"]]: p === "click" },
         e.props.className
       )
     })
   );
 };
 export {
-  T as TooltipTrigger
+  T as TooltipTrigger,
+  T as default
 };

package/src/community/components/tooltip/tooltip.cjs.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),r=require("../../../../external/@floating-ui/react/dist/floating-ui.react.cjs.js"),u=require("../../../../external/classnames/index.cjs.js"),y=require("react"),A=require("../card/utility.cjs.js"),o=require("./tooltip.module.scss.cjs.js"),n=require("./tooltip-provider.cjs.js"),F=require("../card/card.cjs.js"),W=require("../card/card-content/card-content.cjs.js"),S=d=>{const{children:g,maxWidth:l="medium",cardProps:t,className:f}=d,{open:m,x:p,y:x,strategy:h,focusManager:C,floating:q,arrowRef:j,getFloatingProps:w,placement:_,context:i}=y.useContext(n.TooltipContext),[b,a]=A.getCardBorderPlacementColor(t==null?void 0:t.border),c=()=>b&&a?`var(--color-${a})`:"none",s=c()!=="none",k=()=>t!=null&&t.background?`var(--color-${t==null?void 0:t.background})`:"var(--color-bg-default)",R=()=>{const T=e.jsx(r.FloatingFocusManager,{...C,context:i,children:e.jsxs("div",{...w({ref:q,style:{position:h,left:p??0,top:x??0},className:u.default(o.default.tooltip,f,{[o.default[`tooltip--${l}`]]:l})}),"data-placement":_,children:[e.jsx(r.FloatingArrow,{ref:v=>j.current=v,context:i,fill:k(),stroke:c(),strokeWidth:s?4:0,className:u.default(o.default.tooltip__arrow,{[o.default["tooltip__arrow--stroke"]]:s}),height:n.ARROW_HEIGHT,width:n.ARROW_WIDTH}),e.jsx(F.Card,{padding:.5,borderless:!0,...t,children:e.jsx(W.CardContent,{children:g})})]})});return m?T:null};return e.jsx(r.FloatingPortal,{"data-name":"tooltip",children:R()})};exports.Tooltip=S;
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("react/jsx-runtime"),r=require("../../../../external/@floating-ui/react/dist/floating-ui.react.cjs.js"),u=require("../../../../external/classnames/index.cjs.js"),F=require("react"),y=require("../card/utility.cjs.js"),o=require("./tooltip.module.scss.cjs.js"),n=require("./tooltip-provider.cjs.js"),W=require("../card/card.cjs.js"),M=require("../card/card-content/card-content.cjs.js"),d=g=>{const{children:f,maxWidth:l="medium",cardProps:t,className:m}=g,{open:p,x,y:h,strategy:C,focusManager:_,floating:q,arrowRef:j,getFloatingProps:w,placement:b,context:i}=F.useContext(n.TooltipContext),[k,a]=y.getCardBorderPlacementColor(t==null?void 0:t.border),s=()=>k&&a?`var(--color-${a})`:"none",c=s()!=="none",v=()=>t!=null&&t.background?`var(--color-${t==null?void 0:t.background})`:"var(--color-bg-default)",R=()=>{const T=e.jsx(r.FloatingFocusManager,{..._,context:i,children:e.jsxs("div",{...w({ref:q,style:{position:C,left:x??0,top:h??0},className:u.default(o.default.tooltip,m,{[o.default[`tooltip--${l}`]]:l})}),"data-placement":b,children:[e.jsx(r.FloatingArrow,{ref:A=>j.current=A,context:i,fill:v(),stroke:s(),strokeWidth:c?4:0,className:u.default(o.default.tooltip__arrow,{[o.default["tooltip__arrow--stroke"]]:c}),height:n.ARROW_HEIGHT,width:n.ARROW_WIDTH}),e.jsx(W.Card,{padding:.5,borderless:!0,...t,children:e.jsx(M.CardContent,{children:f})})]})});return p?T:null};return e.jsx(r.FloatingPortal,{"data-name":"tooltip",children:R()})};exports.Tooltip=d;exports.default=d;

package/src/community/components/tooltip/tooltip.es.js

@@ -8,7 +8,7 @@ import { TooltipContext as B, ARROW_WIDTH as H, ARROW_HEIGHT as $ } from "./tool
 import { Card as j } from "../card/card.es.js";
 import { CardContent as I } from "../card/card-content/card-content.es.js";
 const L = (c) => {
-  const { children: m, maxWidth: e = "medium", cardProps: o, className: d } = c, { open: p, x: f, y: g, strategy: u, focusManager: h, floating: C, arrowRef: w, getFloatingProps: x, placement: _, context: n } = y.useContext(B), [k, l] = N(o == null ? void 0 : o.border), a = () => k && l ? `var(--color-${l})` : "none", i = a() !== "none", A = () => o != null && o.background ? `var(--color-${o == null ? void 0 : o.background})` : "var(--color-bg-default)";
+  const { children: m, maxWidth: e = "medium", cardProps: o, className: d } = c, { open: f, x: p, y: u, strategy: g, focusManager: h, floating: C, arrowRef: w, getFloatingProps: x, placement: _, context: n } = y.useContext(B), [k, l] = N(o == null ? void 0 : o.border), a = () => k && l ? `var(--color-${l})` : "none", i = a() !== "none", A = () => o != null && o.background ? `var(--color-${o == null ? void 0 : o.background})` : "var(--color-bg-default)";
   return /* @__PURE__ */ t(b, { "data-name": "tooltip", children: (() => {
     const F = /* @__PURE__ */ t(W, { ...h, context: n, children: /* @__PURE__ */ T(
       "div",
@@ -16,9 +16,9 @@ const L = (c) => {
         ...x({
           ref: C,
           style: {
-            position: u,
-            left: f ?? 0,
-            top: g ?? 0
+            position: g,
+            left: p ?? 0,
+            top: u ?? 0
           },
           className: s(r.tooltip, d, { [r[`tooltip--${e}`]]: e })
         }),
@@ -41,9 +41,10 @@ const L = (c) => {
         ]
       }
     ) });
-    return p ? F : null;
+    return f ? F : null;
   })() });
 };
 export {
-  L as Tooltip
+  L as Tooltip,
+  L as default
 };

package/src/community/components/vertical-progress/vertical-progress-item.cjs.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),o=require("react"),C=require("../../../tedi/components/base/icon/icon.cjs.js"),p=require("../button/button.cjs.js"),j=require("../tag/tag.cjs.js"),b=require("./vertical-progress.cjs.js"),v=require("../card/card.cjs.js"),i=require("../card/card-content/card-content.cjs.js"),w=require("../../../tedi/providers/label-provider/use-labels.cjs.js"),c=require("../../../tedi/components/layout/grid/row.cjs.js"),n=require("../../../tedi/components/layout/grid/col.cjs.js"),s=o.createContext({index:0,title:null}),q=r=>{const{children:t}=r;return e.jsx(s.Provider,{value:r,children:e.jsx(v.Card,{children:e.jsxs(i.CardContent,{padding:.75,lg:{padding:1.5},children:[e.jsx(I,{}),t&&e.jsx(i.CardContent,{padding:{top:1,right:0,bottom:0,left:0},lg:{padding:{top:2,right:2.5,bottom:0,left:2.5}},children:t})]})})})},I=()=>{const{title:r,state:t,index:a,isToggable:l=!0}=o.useContext(s),{onItemOpen:d}=o.useContext(b.VerticalProgressContext),{getLabel:u}=w.useLabels(),g=l&&!(t==="disabled")&&!(t==="active"),h=()=>{switch(t){case"active":return"primary";case"completed":return"positive";case"error":return"important";default:return"default"}},x=()=>{switch(t){case"active":case"completed":case"error":return"default";default:return"ghost"}},m=()=>{switch(t){case"completed":return"check";case"error":return"exclamation";default:return"chevron_right"}};return e.jsxs(c.Row,{alignItems:"center",justifyContent:"between",children:[e.jsx(n.Col,{width:"auto",children:e.jsxs(c.Row,{gutterX:3,gutterY:0,alignItems:"center",wrap:"nowrap",children:[e.jsx(n.Col,{width:"auto",children:e.jsx(j.Tag,{iconOnly:!0,rounded:!0,color:h(),type:x(),children:e.jsx(C.Icon,{name:m(),size:16,color:"inherit"})})}),e.jsx(n.Col,{width:"auto",children:r})]})}),g&&e.jsx(n.Col,{width:"auto",children:e.jsx(p.Button,{visualType:"link",iconRight:"edit",onClick:()=>d(a),children:u("vertical-progress.edit")})})]})};exports.VerticalProgressItem=q;exports.VerticalProgressItemContext=s;
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("react/jsx-runtime"),o=require("react"),p=require("../../../tedi/components/base/icon/icon.cjs.js"),j=require("../button/button.cjs.js"),b=require("../tag/tag.cjs.js"),v=require("./vertical-progress.cjs.js"),w=require("../card/card.cjs.js"),i=require("../card/card-content/card-content.cjs.js"),q=require("../../../tedi/providers/label-provider/use-labels.cjs.js"),c=require("../../../tedi/components/layout/grid/row.cjs.js"),n=require("../../../tedi/components/layout/grid/col.cjs.js"),s=o.createContext({index:0,title:null}),a=r=>{const{children:t}=r;return e.jsx(s.Provider,{value:r,children:e.jsx(w.Card,{children:e.jsxs(i.CardContent,{padding:.75,lg:{padding:1.5},children:[e.jsx(I,{}),t&&e.jsx(i.CardContent,{padding:{top:1,right:0,bottom:0,left:0},lg:{padding:{top:2,right:2.5,bottom:0,left:2.5}},children:t})]})})})},I=()=>{const{title:r,state:t,index:l,isToggable:u=!0}=o.useContext(s),{onItemOpen:d}=o.useContext(v.VerticalProgressContext),{getLabel:g}=q.useLabels(),h=u&&!(t==="disabled")&&!(t==="active"),x=()=>{switch(t){case"active":return"primary";case"completed":return"positive";case"error":return"important";default:return"default"}},m=()=>{switch(t){case"active":case"completed":case"error":return"default";default:return"ghost"}},C=()=>{switch(t){case"completed":return"check";case"error":return"exclamation";default:return"chevron_right"}};return e.jsxs(c.Row,{alignItems:"center",justifyContent:"between",children:[e.jsx(n.Col,{width:"auto",children:e.jsxs(c.Row,{gutterX:3,gutterY:0,alignItems:"center",wrap:"nowrap",children:[e.jsx(n.Col,{width:"auto",children:e.jsx(b.Tag,{iconOnly:!0,rounded:!0,color:x(),type:m(),children:e.jsx(p.Icon,{name:C(),size:16,color:"inherit"})})}),e.jsx(n.Col,{width:"auto",children:r})]})}),h&&e.jsx(n.Col,{width:"auto",children:e.jsx(j.Button,{visualType:"link",iconRight:"edit",onClick:()=>d(l),children:g("vertical-progress.edit")})})]})};exports.VerticalProgressItem=a;exports.VerticalProgressItemContext=s;exports.default=a;

package/src/community/components/vertical-progress/vertical-progress-item.es.js

@@ -66,5 +66,6 @@ const s = n.createContext({
 };
 export {
   H as VerticalProgressItem,
-  s as VerticalProgressItemContext
+  s as VerticalProgressItemContext,
+  H as default
 };

package/src/community/components/vertical-progress/vertical-progress.cjs.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),o=require("react"),s=require("../../../tedi/components/layout/vertical-spacing/vertical-spacing.cjs.js"),r=o.createContext({onItemOpen:()=>null}),i=t=>{const{children:n,onItemOpen:c}=t;return e.jsx(r.Provider,{value:{onItemOpen:c},children:e.jsx(s.VerticalSpacing,{size:.5,children:n})})};exports.VerticalProgress=i;exports.VerticalProgressContext=r;
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("react/jsx-runtime"),c=require("react"),i=require("../../../tedi/components/layout/vertical-spacing/vertical-spacing.cjs.js"),r=c.createContext({onItemOpen:()=>null}),t=n=>{const{children:s,onItemOpen:o}=n;return e.jsx(r.Provider,{value:{onItemOpen:o},children:e.jsx(i.VerticalSpacing,{size:.5,children:s})})};exports.VerticalProgress=t;exports.VerticalProgressContext=r;exports.default=t;

package/src/community/components/vertical-progress/vertical-progress.es.js

@@ -9,5 +9,6 @@ const i = n.createContext({
 };
 export {
   m as VerticalProgress,
-  i as VerticalProgressContext
+  i as VerticalProgressContext,
+  m as default
 };

package/src/community/components/vertical-stepper/vertical-stepper.cjs.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),o=require("../../../../external/classnames/index.cjs.js"),t=require("./vertical-stepper.module.scss.cjs.js"),p=r=>{const{className:c,children:s,isCompact:l}=r,a=o.default(t.default.stepper,c,{[t.default["stepper--compact"]]:l});return e.jsx("nav",{children:e.jsx("ol",{role:"tree",className:a,children:s})})};exports.VerticalStepper=p;
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("react/jsx-runtime"),u=require("../../../../external/classnames/index.cjs.js"),t=require("./vertical-stepper.module.scss.cjs.js"),r=s=>{const{className:l,children:c,isCompact:a}=s,o=u.default(t.default.stepper,l,{[t.default["stepper--compact"]]:a});return e.jsx("nav",{children:e.jsx("ol",{role:"tree",className:o,children:c})})};exports.VerticalStepper=r;exports.default=r;

package/src/community/components/vertical-stepper/vertical-stepper.es.js

@@ -1,10 +1,11 @@
 import { jsx as e } from "react/jsx-runtime";
-import m from "../../../../external/classnames/index.es.js";
+import c from "../../../../external/classnames/index.es.js";
 import r from "./vertical-stepper.module.scss.es.js";
 const n = (t) => {
-  const { className: s, children: o, isCompact: p } = t, c = m(r.stepper, s, { [r["stepper--compact"]]: p });
-  return /* @__PURE__ */ e("nav", { children: /* @__PURE__ */ e("ol", { role: "tree", className: c, children: o }) });
+  const { className: s, children: o, isCompact: p } = t, a = c(r.stepper, s, { [r["stepper--compact"]]: p });
+  return /* @__PURE__ */ e("nav", { children: /* @__PURE__ */ e("ol", { role: "tree", className: a, children: o }) });
 };
 export {
-  n as VerticalStepper
+  n as VerticalStepper,
+  n as default
 };

package/src/community/helpers/hooks/use-breakpoint-props.cjs.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const s=require("react"),t=require("./use-breakpoint.cjs.js"),l=require("../../../../external/lodash-es/pickBy.cjs.js"),k=require("../../../../external/lodash-es/omit.cjs.js"),B=(i="xs")=>{const e=t.default(i),r=s.useMemo(()=>e?t.breakpoints.slice(0,t.breakpoints.indexOf(e)+1):[],[e]);return{getCurrentBreakpointProps:s.useCallback((o,a={})=>{const{sm:f,md:x,lg:g,xl:m,xxl:b,...u}=o,c=[...r.map(n=>l.default(n==="xs"?u:o[n],p=>p!==void 0))].filter(Boolean);return Object.assign(k.default(a,"defaultServerBreakpoint"),...c)},[r])}};exports.useBreakpointProps=B;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const s=require("react"),r=require("./use-breakpoint.cjs.js"),l=require("../../../../external/lodash-es/pickBy.cjs.js"),k=require("../../../../external/lodash-es/omit.cjs.js"),B=(i="xs")=>{const e=r.useBreakpoint(i),t=s.useMemo(()=>e?r.breakpoints.slice(0,r.breakpoints.indexOf(e)+1):[],[e]);return{getCurrentBreakpointProps:s.useCallback((o,a={})=>{const{sm:x,md:f,lg:g,xl:m,xxl:b,...u}=o,c=[...t.map(n=>l.default(n==="xs"?u:o[n],p=>p!==void 0))].filter(Boolean);return Object.assign(k.default(a,"defaultServerBreakpoint"),...c)},[t])}};exports.useBreakpointProps=B;

package/src/community/helpers/hooks/use-breakpoint-props.es.js

@@ -1,5 +1,5 @@
 import n from "react";
-import u, { breakpoints as s } from "./use-breakpoint.es.js";
+import { useBreakpoint as u, breakpoints as s } from "./use-breakpoint.es.js";
 import k from "../../../../external/lodash-es/pickBy.es.js";
 import l from "../../../../external/lodash-es/omit.es.js";
 const O = (i = "xs") => {

package/src/community/helpers/hooks/use-layout.cjs.js

@@ -1 +1 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const d=require("./use-breakpoint.cjs.js"),o=["xs","sm"],r=["md"],i=["lg","xl","xxl"],a=t=>{const s=d.default(),p=t==null?void 0:t.reduce((e,n)=>{switch(n){case"desktop":return[...e,...i];case"tablet":return[...e,...r];case"mobile":return[...e,...o];default:return[...e,n]}},[]);return s?p.includes(s):!1};exports.default=a;exports.desktopBreakpoints=i;exports.mobileBreakpoints=o;exports.tabletBreakpoints=r;exports.useLayout=a;
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const k=require("./use-breakpoint.cjs.js"),o=["xs","sm"],r=["md"],i=["lg","xl","xxl"],a=t=>{const s=k.useBreakpoint(),p=t==null?void 0:t.reduce((e,n)=>{switch(n){case"desktop":return[...e,...i];case"tablet":return[...e,...r];case"mobile":return[...e,...o];default:return[...e,n]}},[]);return s?p.includes(s):!1};exports.default=a;exports.desktopBreakpoints=i;exports.mobileBreakpoints=o;exports.tabletBreakpoints=r;exports.useLayout=a;

package/src/community/helpers/hooks/use-layout.es.js

@@ -1,4 +1,4 @@
-import o from "./use-breakpoint.es.js";
+import { useBreakpoint as o } from "./use-breakpoint.es.js";
 const i = ["xs", "sm"], p = ["md"], k = ["lg", "xl", "xxl"], a = (t) => {
   const s = o(), r = t == null ? void 0 : t.reduce((e, n) => {
     switch (n) {

package/src/tedi/components/buttons/button-group/button-group.cjs.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const o=require("react/jsx-runtime"),g=require("../../../../../external/classnames/index.cjs.js"),_=require("react"),n=require("../../base/icon/icon.cjs.js"),j=require("../button/button.cjs.js"),r=require("./button-group.module.scss.cjs.js"),B=require("../../../providers/label-provider/use-labels.cjs.js"),L=require("../../../helpers/hooks/use-breakpoint.cjs.js"),l=require("../../overlays/dropdown/dropdown.cjs.js"),C=x=>{const{getLabel:b}=B.useLabels(),{children:k,className:w,type:c="primary",onSelectionChange:i,stretch:q=!1,ariaLabel:I,size:f="default",enableMobileDropdown:v=!1,mobileBreakpoint:N="md",dropdownLabel:y=b("sidenav.submenu"),dropdownLabelMode:R="static"}=x,A=L.default(),D=L.isBreakpointBelow(A,N),m=_.Children.toArray(k).filter(e=>_.isValidElement(e)&&e.type===j.Button),t=m.find(e=>e.props.isActive),M=R==="static"?y:(t==null?void 0:t.props.children)??y,d=t==null?void 0:t.props.iconLeft,a=t==null?void 0:t.props.icon;return D&&v?o.jsxs(l.Dropdown,{width:"trigger",children:[o.jsx(l.Dropdown.Trigger,{children:o.jsxs(j.Button,{visualType:c,className:g.default(r.default["tedi-button-group__dropdown-trigger"],r.default[`tedi-button-group__dropdown-trigger--${c}`],w),noStyle:!0,fullWidth:!0,children:[d?o.jsx(n.Icon,{name:typeof d=="string"?d:d.name,color:"inherit"}):a?o.jsx(n.Icon,{name:typeof a=="string"?a:a.name,color:"inherit"}):o.jsx(n.Icon,{name:"menu",color:"inherit"}),M]})}),o.jsx(l.Dropdown.Content,{children:m.map((e,u)=>o.jsxs(l.Dropdown.Item,{index:u,active:e==null?void 0:e.props.isActive,disabled:e==null?void 0:e.props.disabled,onClick:s=>{var p,h;e.props.disabled||(s.type==="click"&&((h=(p=e.props).onClick)==null||h.call(p,s)),e.props.id&&(i==null||i(e.props.id)))},className:r.default["tedi-button-group__dropdown-item"],children:[e.props.iconLeft&&o.jsx(n.Icon,{name:typeof e.props.iconLeft=="string"?e.props.iconLeft:e.props.iconLeft.name,color:"inherit"}),e.props.children,e.props.iconRight&&o.jsx(n.Icon,{name:typeof e.props.iconRight=="string"?e.props.iconRight:e.props.iconRight.name,color:"inherit"})]},e.props.id||u))})]}):o.jsx("div",{className:g.default(r.default["tedi-button-group"],r.default[`tedi-button-group--${c}`],{[r.default["tedi-button-group--stretch"]]:q},w),role:"group","aria-label":I,children:m.map(e=>_.cloneElement(e,{className:g.default(r.default["tedi-button-group__item"],{[r.default["tedi-button-group__item--active"]]:e.props.isActive,[r.default["tedi-button-group__item--disabled"]]:e.props.disabled,[r.default[`tedi-button-group__item--size-${f}`]]:f},e.props.className),size:f,onClick:u=>{var s,p;(p=(s=e.props).onClick)==null||p.call(s,u),e.props.id&&(i==null||i(e.props.id))}}))})};exports.ButtonGroup=C;
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const o=require("react/jsx-runtime"),g=require("../../../../../external/classnames/index.cjs.js"),_=require("react"),n=require("../../base/icon/icon.cjs.js"),y=require("../button/button.cjs.js"),r=require("./button-group.module.scss.cjs.js"),L=require("../../../helpers/hooks/use-breakpoint.cjs.js"),C=require("../../../providers/label-provider/use-labels.cjs.js"),l=require("../../overlays/dropdown/dropdown.cjs.js"),x=b=>{const{getLabel:k}=C.useLabels(),{children:q,className:w,type:c="primary",onSelectionChange:i,stretch:I=!1,ariaLabel:v,size:f="default",enableMobileDropdown:N=!1,mobileBreakpoint:R="md",dropdownLabel:h=k("sidenav.submenu"),dropdownLabelMode:A="static"}=b,D=L.useBreakpoint(),M=L.isBreakpointBelow(D,R),m=_.Children.toArray(q).filter(e=>_.isValidElement(e)&&e.type===y.Button),t=m.find(e=>e.props.isActive),B=A==="static"?h:(t==null?void 0:t.props.children)??h,a=t==null?void 0:t.props.iconLeft,d=t==null?void 0:t.props.icon;return M&&N?o.jsxs(l.Dropdown,{width:"trigger",children:[o.jsx(l.Dropdown.Trigger,{children:o.jsxs(y.Button,{visualType:c,className:g.default(r.default["tedi-button-group__dropdown-trigger"],r.default[`tedi-button-group__dropdown-trigger--${c}`],w),noStyle:!0,fullWidth:!0,children:[a?o.jsx(n.Icon,{name:typeof a=="string"?a:a.name,color:"inherit"}):d?o.jsx(n.Icon,{name:typeof d=="string"?d:d.name,color:"inherit"}):o.jsx(n.Icon,{name:"menu",color:"inherit"}),B]})}),o.jsx(l.Dropdown.Content,{children:m.map((e,u)=>o.jsxs(l.Dropdown.Item,{index:u,active:e==null?void 0:e.props.isActive,disabled:e==null?void 0:e.props.disabled,onClick:s=>{var p,j;e.props.disabled||(s.type==="click"&&((j=(p=e.props).onClick)==null||j.call(p,s)),e.props.id&&(i==null||i(e.props.id)))},className:r.default["tedi-button-group__dropdown-item"],children:[e.props.iconLeft&&o.jsx(n.Icon,{name:typeof e.props.iconLeft=="string"?e.props.iconLeft:e.props.iconLeft.name,color:"inherit"}),e.props.children,e.props.iconRight&&o.jsx(n.Icon,{name:typeof e.props.iconRight=="string"?e.props.iconRight:e.props.iconRight.name,color:"inherit"})]},e.props.id||u))})]}):o.jsx("div",{className:g.default(r.default["tedi-button-group"],r.default[`tedi-button-group--${c}`],{[r.default["tedi-button-group--stretch"]]:I},w),role:"group","aria-label":v,children:m.map(e=>_.cloneElement(e,{className:g.default(r.default["tedi-button-group__item"],{[r.default["tedi-button-group__item--active"]]:e.props.isActive,[r.default["tedi-button-group__item--disabled"]]:e.props.disabled,[r.default[`tedi-button-group__item--size-${f}`]]:f},e.props.className),size:f,onClick:u=>{var s,p;(p=(s=e.props).onClick)==null||p.call(s,u),e.props.id&&(i==null||i(e.props.id))}}))})};exports.ButtonGroup=x;exports.default=x;

package/src/tedi/components/buttons/button-group/button-group.es.js

@@ -4,14 +4,14 @@ import { Children as x, isValidElement as z, cloneElement as D } from "react";
 import { Icon as a } from "../../base/icon/icon.es.js";
 import { Button as w } from "../button/button.es.js";
 import r from "./button-group.module.scss.es.js";
-import { useLabels as E } from "../../../providers/label-provider/use-labels.es.js";
-import T, { isBreakpointBelow as V } from "../../../helpers/hooks/use-breakpoint.es.js";
-import { Dropdown as c } from "../../overlays/dropdown/dropdown.es.js";
+import { useBreakpoint as E, isBreakpointBelow as T } from "../../../helpers/hooks/use-breakpoint.es.js";
+import { useLabels as V } from "../../../providers/label-provider/use-labels.es.js";
+import { Dropdown as m } from "../../overlays/dropdown/dropdown.es.js";
 const P = (k) => {
-  const { getLabel: N } = E(), {
+  const { getLabel: N } = V(), {
     children: b,
     className: h,
-    type: d = "primary",
+    type: c = "primary",
     onSelectionChange: p,
     stretch: v = !1,
     ariaLabel: A,
@@ -20,17 +20,17 @@ const P = (k) => {
     mobileBreakpoint: R = "md",
     dropdownLabel: y = N("sidenav.submenu"),
     dropdownLabelMode: C = "static"
-  } = k, M = T(), $ = V(M, R), f = x.toArray(b).filter(
+  } = k, M = E(), $ = T(M, R), f = x.toArray(b).filter(
     (o) => z(o) && o.type === w
   ), e = f.find((o) => o.props.isActive), j = C === "static" ? y : (e == null ? void 0 : e.props.children) ?? y, n = e == null ? void 0 : e.props.iconLeft, l = e == null ? void 0 : e.props.icon;
-  return $ && I ? /* @__PURE__ */ g(c, { width: "trigger", children: [
-    /* @__PURE__ */ i(c.Trigger, { children: /* @__PURE__ */ g(
+  return $ && I ? /* @__PURE__ */ g(m, { width: "trigger", children: [
+    /* @__PURE__ */ i(m.Trigger, { children: /* @__PURE__ */ g(
       w,
       {
-        visualType: d,
+        visualType: c,
         className: _(
           r["tedi-button-group__dropdown-trigger"],
-          r[`tedi-button-group__dropdown-trigger--${d}`],
+          r[`tedi-button-group__dropdown-trigger--${c}`],
           h
         ),
         noStyle: !0,
@@ -41,10 +41,10 @@ const P = (k) => {
         ]
       }
     ) }),
-    /* @__PURE__ */ i(c.Content, { children: f.map((o, m) => /* @__PURE__ */ g(
-      c.Item,
+    /* @__PURE__ */ i(m.Content, { children: f.map((o, d) => /* @__PURE__ */ g(
+      m.Item,
       {
-        index: m,
+        index: d,
         active: o == null ? void 0 : o.props.isActive,
         disabled: o == null ? void 0 : o.props.disabled,
         onClick: (s) => {
@@ -70,14 +70,14 @@ const P = (k) => {
           )
         ]
       },
-      o.props.id || m
+      o.props.id || d
     )) })
   ] }) : /* @__PURE__ */ i(
     "div",
     {
       className: _(
         r["tedi-button-group"],
-        r[`tedi-button-group--${d}`],
+        r[`tedi-button-group--${c}`],
         { [r["tedi-button-group--stretch"]]: v },
         h
       ),
@@ -95,9 +95,9 @@ const P = (k) => {
             o.props.className
           ),
           size: u,
-          onClick: (m) => {
+          onClick: (d) => {
             var s, t;
-            (t = (s = o.props).onClick) == null || t.call(s, m), o.props.id && (p == null || p(o.props.id));
+            (t = (s = o.props).onClick) == null || t.call(s, d), o.props.id && (p == null || p(o.props.id));
           }
         })
       )
@@ -105,5 +105,6 @@ const P = (k) => {
   );
 };
 export {
-  P as ButtonGroup
+  P as ButtonGroup,
+  P as default
 };

package/src/tedi/components/cards/card/card.cjs.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const o=require("react/jsx-runtime"),B=require("../../../../../external/classnames/index.cjs.js"),P=require("react"),e=require("./card.module.scss.cjs.js"),R=require("./card-content/card-content.cjs.js"),v=require("./card-context.cjs.js"),x=require("./card-header/card-header.cjs.js"),N=require("./card-notification/card-notification.cjs.js"),i=require("./utility.cjs.js"),j=require("../../../helpers/hooks/use-breakpoint-props.cjs.js"),n=P.forwardRef((t,c)=>{const{getCurrentBreakpointProps:s}=j.useBreakpointProps(t.defaultServerBreakpoint),{children:u,className:l,padding:f,background:C,borderRadius:b,borderless:m,border:p,...g}=s(t,{padding:1}),[d,a]=i.getCardBorderPlacementColor(p),r=i.resolveBorderRadius(b),q=B.default(e.default["tedi-card"],{[e.default[`tedi-card--border-${d}`]]:d,[e.default[`tedi-card--border--${a}`]]:a,[e.default["tedi-card--borderless"]]:m,[e.default["tedi-card--no-radius-tl"]]:!r.topLeft,[e.default["tedi-card--no-radius-tr"]]:!r.topRight,[e.default["tedi-card--no-radius-br"]]:!r.bottomRight,[e.default["tedi-card--no-radius-bl"]]:!r.bottomLeft},l);return o.jsx(v.CardContext.Provider,{value:{padding:f,background:C},children:o.jsx("div",{"data-name":"card","data-testid":"tedi-card",...g,className:q,ref:c,children:u})})});n.displayName="Card";const k=Object.assign(n,{Content:R.CardContent,Header:x.CardHeader,Notification:N.CardNotification});exports.Card=k;
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const o=require("react/jsx-runtime"),B=require("../../../../../external/classnames/index.cjs.js"),P=require("react"),e=require("./card.module.scss.cjs.js"),R=require("./card-content/card-content.cjs.js"),x=require("./card-context.cjs.js"),N=require("./card-header/card-header.cjs.js"),j=require("./card-notification/card-notification.cjs.js"),i=require("./utility.cjs.js"),k=require("../../../helpers/hooks/use-breakpoint-props.cjs.js"),n=P.forwardRef((t,c)=>{const{getCurrentBreakpointProps:u}=k.useBreakpointProps(t.defaultServerBreakpoint),{children:l,className:f,padding:C,background:b,borderRadius:m,borderless:p,border:g,...q}=u(t,{padding:1}),[d,a]=i.getCardBorderPlacementColor(g),r=i.resolveBorderRadius(m),v=B.default(e.default["tedi-card"],{[e.default[`tedi-card--border-${d}`]]:d,[e.default[`tedi-card--border--${a}`]]:a,[e.default["tedi-card--borderless"]]:p,[e.default["tedi-card--no-radius-tl"]]:!r.topLeft,[e.default["tedi-card--no-radius-tr"]]:!r.topRight,[e.default["tedi-card--no-radius-br"]]:!r.bottomRight,[e.default["tedi-card--no-radius-bl"]]:!r.bottomLeft},f);return o.jsx(x.CardContext.Provider,{value:{padding:C,background:b},children:o.jsx("div",{"data-name":"card","data-testid":"tedi-card",...q,className:v,ref:c,children:l})})});n.displayName="Card";const s=Object.assign(n,{Content:R.CardContent,Header:N.CardHeader,Notification:j.CardNotification});exports.Card=s;exports.default=s;

package/src/tedi/components/cards/card/card.es.js

@@ -31,5 +31,6 @@ const z = Object.assign(i, {
   Notification: h
 });
 export {
-  z as Card
+  z as Card,
+  z as default
 };

package/src/tedi/components/content/calendar/calendar-grid.cjs.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),t=require("../../../../../external/classnames/index.cjs.js"),a=require("../../base/typography/text/text.cjs.js"),l=require("../../buttons/button/button.cjs.js"),r=require("./calendar.module.scss.cjs.js"),j=require("../../layout/grid/row.cjs.js"),h=require("../../layout/grid/col.cjs.js"),s=({headerLabel:u,prevAriaLabel:n,nextAriaLabel:c,onPrev:o,onNext:f,items:x,onSelect:p,showNavigation:d,className:_})=>e.jsxs("div",{className:t.default(r.default["tedi-calendar__picker-grid-container"],_),"data-testid":"tedi-picker-grid-container",children:[e.jsxs("div",{className:t.default(r.default["tedi-calendar__picker-grid-header"],{[r.default["tedi-calendar__picker--no-navigation"]]:!d}),children:[d&&e.jsx(l.Button,{type:"button",onClick:o,"aria-label":n,icon:"arrow_back",visualType:"neutral",children:e.jsx(a.Text,{modifiers:"capitalize-first",children:n})}),e.jsx(a.Text,{modifiers:"capitalize-first",children:u}),d&&e.jsx(l.Button,{type:"button",onClick:f,"aria-label":c,icon:"arrow_forward",visualType:"neutral",children:e.jsx(a.Text,{modifiers:"capitalize-first",children:c})})]}),e.jsx("div",{className:t.default(r.default["tedi-calendar__picker-grid"]),children:e.jsx(j.Row,{gutter:2,children:x.map(i=>e.jsx(h.Col,{width:4,children:e.jsx(l.Button,{onClick:()=>p(i.value),className:t.default(r.default["tedi-calendar__grid-button"],{[r.default["tedi-calendar__grid-button--selected"]]:i.isSelected}),"aria-pressed":i.isSelected,noStyle:!0,children:i.label})},i.key))})})]});s.displayName="CalendarGrid";exports.CalendarGrid=s;

package/src/tedi/components/content/calendar/calendar-grid.d.ts

@@ -0,0 +1,21 @@
+export interface CalendarGridItem<T> {
+    key: React.Key;
+    value: T;
+    label: React.ReactNode;
+    isSelected?: boolean;
+}
+export interface CalendarGridProps<T> {
+    headerLabel: React.ReactNode;
+    prevAriaLabel: string;
+    nextAriaLabel: string;
+    onPrev: () => void;
+    onNext: () => void;
+    items: CalendarGridItem<T>[];
+    onSelect: (value: T) => void;
+    showNavigation?: boolean;
+    className?: string;
+}
+export declare const CalendarGrid: {
+    <T>({ headerLabel, prevAriaLabel, nextAriaLabel, onPrev, onNext, items, onSelect, showNavigation, className, }: CalendarGridProps<T>): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};

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

@@ -0,0 +1,55 @@
+import { jsxs as o, jsx as e } from "react/jsx-runtime";
+import a from "../../../../../external/classnames/index.es.js";
+import { Text as l } from "../../base/typography/text/text.es.js";
+import { Button as t } from "../../buttons/button/button.es.js";
+import r from "./calendar.module.scss.es.js";
+import { Row as h } from "../../layout/grid/row.es.js";
+import { Col as k } from "../../layout/grid/col.es.js";
+const y = ({
+  headerLabel: s,
+  prevAriaLabel: c,
+  nextAriaLabel: n,
+  onPrev: p,
+  onNext: m,
+  items: f,
+  onSelect: _,
+  showNavigation: d,
+  className: u
+}) => /* @__PURE__ */ o(
+  "div",
+  {
+    className: a(r["tedi-calendar__picker-grid-container"], u),
+    "data-testid": "tedi-picker-grid-container",
+    children: [
+      /* @__PURE__ */ o(
+        "div",
+        {
+          className: a(r["tedi-calendar__picker-grid-header"], {
+            [r["tedi-calendar__picker--no-navigation"]]: !d
+          }),
+          children: [
+            d && /* @__PURE__ */ e(t, { type: "button", onClick: p, "aria-label": c, icon: "arrow_back", visualType: "neutral", children: /* @__PURE__ */ e(l, { modifiers: "capitalize-first", children: c }) }),
+            /* @__PURE__ */ e(l, { modifiers: "capitalize-first", children: s }),
+            d && /* @__PURE__ */ e(t, { type: "button", onClick: m, "aria-label": n, icon: "arrow_forward", visualType: "neutral", children: /* @__PURE__ */ e(l, { modifiers: "capitalize-first", children: n }) })
+          ]
+        }
+      ),
+      /* @__PURE__ */ e("div", { className: a(r["tedi-calendar__picker-grid"]), children: /* @__PURE__ */ e(h, { gutter: 2, children: f.map((i) => /* @__PURE__ */ e(k, { width: 4, children: /* @__PURE__ */ e(
+        t,
+        {
+          onClick: () => _(i.value),
+          className: a(r["tedi-calendar__grid-button"], {
+            [r["tedi-calendar__grid-button--selected"]]: i.isSelected
+          }),
+          "aria-pressed": i.isSelected,
+          noStyle: !0,
+          children: i.label
+        }
+      ) }, i.key)) }) })
+    ]
+  }
+);
+y.displayName = "CalendarGrid";
+export {
+  y as CalendarGrid
+};

package/src/tedi/components/content/calendar/calendar.cjs.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const r=require("react/jsx-runtime"),O=require("../../../../../external/classnames/index.cjs.js"),d=require("./calendar.module.scss.cjs.js"),w=require("./components/calendar-header/calendar-header.cjs.js"),C=require("./components/calendar-month-grid/calendar-month-grid.cjs.js"),E=require("./components/calendar-year-grid/calendar-year-grid.cjs.js"),F=require("../../../../../external/react-day-picker/dist/esm/DayPicker.cjs.js"),H=require("../../../../../external/react-day-picker/dist/esm/locale/et.cjs.js"),A=({view:s="days",selectionLevel:m="days",currentMonth:c,setCurrentMonth:i,setView:l=()=>"days",mode:S="single",value:a,locale:j=H.et,localeCode:g="et-EE",showOutsideDays:q=!0,disabledMatchers:x,required:b,availableDays:t,unavailableDays:n,footer:k,monthYearSelectType:G,handleSelect:Y,applyValue:y,showNavigation:_=!0,className:u,...P})=>{const h=e=>t?Array.isArray(t)?t.some(f=>f.toDateString()===e.toDateString()):t(e):!0,p=e=>n?Array.isArray(n)?n.some(f=>f.toDateString()===e.toDateString()):n(e):!1,o=[...x??[],...t?[e=>!h(e)]:[],...n?[e=>p(e)]:[]],N=(()=>{switch(S){case"multiple":return{mode:"multiple",selected:Array.isArray(a)?a:void 0};case"range":return{mode:"range",selected:a&&!Array.isArray(a)&&!(a instanceof Date)?a:void 0};default:return{mode:"single",selected:a instanceof Date?a:void 0}}})();return r.jsxs("div",{className:d.default["tedi-calendar__wrapper"],children:[s==="years"&&r.jsx(E.YearGrid,{currentMonth:c,onNavigate:i,showNavigation:_,onSelectYear:e=>{i(e),m==="years"?y(new Date(e.getFullYear(),0,1)):l("months")},className:u}),s==="months"&&r.jsx(C.MonthGrid,{currentMonth:c,onNavigate:i,showNavigation:_,localeCode:g,onSelectMonth:e=>{i(e),m==="months"?y(e):l("days")},className:u}),s==="days"&&r.jsx(F.DayPicker,{...P,...N,locale:j,month:c,onMonthChange:i,showOutsideDays:q,disabled:o.length?o:void 0,required:b,components:{MonthCaption:e=>r.jsx(w.CalendarHeader,{...e,monthYearSelectType:G,onOpenMonthGrid:()=>l("months"),onOpenYearGrid:()=>l("years"),showNavigation:_,localeCode:g,disabledMatchers:o.length?o:void 0}),Nav:()=>r.jsx(r.Fragment,{})},footer:k,classNames:{root:O.default(d.default["tedi-calendar"],u),month_caption:d.default["tedi-calendar__caption"],head:d.default["tedi-calendar__head"],row:d.default["tedi-calendar__row"],day:d.default["tedi-calendar__day"],selected:d.default["tedi-calendar__day--selected"],weekday:d.default["tedi-calendar__weekday"],outside:d.default["tedi-calendar__outside-days"],range_start:d.default["tedi-calendar__range-start"],range_middle:d.default["tedi-calendar__range-middle"],range_end:d.default["tedi-calendar__range-end"],today:d.default["tedi-calendar__today"],disabled:d.default["tedi-calendar__disabled"],month:d.default["tedi-calendar__month"],months:d.default["tedi-calendar__months-container"],footer:d.default["tedi-calendar__footer"],week_number:d.default["tedi-calendar__week-number"]},modifiers:{available:e=>t?h(e):!1,unavailable:e=>n?p(e):!1},modifiersClassNames:{available:d.default["tedi-calendar__available-day"],unavailable:d.default["tedi-calendar__unavailable-day"]},onSelect:Y})]})};A.displayName="Calendar";exports.Calendar=A;

package/src/tedi/components/content/calendar/calendar.d.ts

@@ -0,0 +1,114 @@
+import { default as React } from 'react';
+import { DateRange, DayPickerProps, Locale, Matcher, OnSelectHandler } from 'react-day-picker';
+import { CalendarView, DateFieldMode } from '../../form/date-field/date-field';
+export interface CalendarProps extends Omit<DayPickerProps, 'mode' | 'selected' | 'onSelect'> {
+    /**
+     * Current view of the calendar. Can be `'days'`, `'months'`, or `'years'`.
+     * Controls which calendar grid is displayed.
+     */
+    view?: CalendarView;
+    /**
+     * **Selection granularity** — controls the level at which a click finalises
+     * the selection rather than drilling down to the next sub-grid:
+     * - `'years'` — clicking a year selects Jan 1 of that year and closes; the
+     *   calendar starts on the year grid.
+     * - `'months'` — clicking a month selects the first day of that month; the
+     *   calendar starts on the month grid.
+     * - `'days'` (default) — full day-level selection; the calendar starts on
+     *   the day grid.
+     *
+     * Distinct from `view` / `setView`, which control the *currently visible*
+     * grid — those flip as the user navigates between year / month / day.
+     * `selectionLevel` is the lowest level the user can drill down to before
+     * a click commits the selection.
+     * @default days
+     */
+    selectionLevel?: CalendarView;
+    /**
+     * The month currently displayed in the calendar. Used to render the correct month grid.
+     */
+    currentMonth: Date;
+    /**
+     * Callback to update the `currentMonth` when navigating months/years.
+     */
+    setCurrentMonth: (date: Date) => void;
+    /**
+     * Callback to update the current `view` (days, months, years) when the user switches calendar levels.
+     */
+    setView?: (view: CalendarView) => void;
+    /**
+     * Selection mode of the calendar. Can be `'single'`, `'multiple'`, or `'range'`.
+     */
+    mode?: DateFieldMode;
+    /**
+     * The currently selected value(s).
+     * - Single mode: `Date | undefined`
+     * - Multiple mode: `Date[]`
+     * - Range mode: `DateRange` (object with `from` and optional `to`)
+     */
+    value: Date | Date[] | DateRange | undefined;
+    /**
+     * Locale object for formatting and translating calendar labels (from `react-day-picker`).
+     */
+    locale?: Locale;
+    /**
+     * The locale code string used for date formatting. Defaults to 'et-EE'.
+     */
+    localeCode?: string;
+    /**
+     * Whether to display days from the previous and next months in the current month grid.
+     * Default is `true`.
+     */
+    showOutsideDays?: boolean;
+    /**
+     * Array of `Matcher`s or functions to disable specific dates. Used to prevent selection of certain days.
+     */
+    disabledMatchers?: Matcher[];
+    /**
+     * If `true`, a value must be selected before the calendar allows closing.
+     */
+    required?: boolean;
+    /**
+     * Array of available dates or a function to dynamically mark dates as available.
+     * Highlights selectable days without disabling other days.
+     */
+    availableDays?: Date[] | ((date: Date) => boolean);
+    /**
+     * Array of unavailable dates or a function to dynamically mark dates as unavailable.
+     * Used for styling and optionally disabling specific days.
+     */
+    unavailableDays?: Date[] | ((date: Date) => boolean);
+    /**
+     * Optional footer element to render below the calendar grid, e.g., for action buttons.
+     */
+    footer?: React.ReactNode;
+    /**
+     * How the month/year selector in the calendar header is rendered.
+     * Forwarded to the internal `CalendarHeader`.
+     * - `'dropdown'` (default) — each picker is a `<Select>` dropdown.
+     * - `'grid'` — each picker opens a full grid of options.
+     * @default dropdown
+     */
+    monthYearSelectType?: 'dropdown' | 'grid';
+    /**
+     * Callback fired when a date or date range is selected. Receives the selected value, day, modifiers, and event.
+     */
+    handleSelect: OnSelectHandler<Date | Date[] | DateRange | undefined>;
+    /**
+     * Callback to apply a selected date from month/year selection or programmatically.
+     */
+    applyValue: (date: Date) => void;
+    /**
+     * Show or hide previous/next navigation buttons in calendar header.
+     * Default is `true`.
+     */
+    showNavigation?: boolean;
+    /**
+     * Optional additional CSS class for the calendar container.
+     */
+    className?: string;
+}
+export declare const Calendar: {
+    ({ view, selectionLevel, currentMonth, setCurrentMonth, setView, mode, value, locale, localeCode, showOutsideDays, disabledMatchers, required, availableDays, unavailableDays, footer, monthYearSelectType, handleSelect, applyValue, showNavigation, className, ...dayPickerProps }: CalendarProps): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};