@leabankab/component-library 8.6.1 → 8.8.0

package/dist/date-picker.mjs

@@ -7,18 +7,18 @@ import { LocalizationProvider as a } from "@mui/x-date-pickers/LocalizationProvi
 import { esES as o, fiFI as s, nbNO as c, svSE as l } from "@mui/x-date-pickers/locales";
 import { format as u } from "date-fns";
 import { es as d, fi as f, nb as p, sv as m } from "date-fns/locale";
-import { CalendarSearch as h, ChevronDown as ee, ChevronLeft as te, ChevronRight as g } from "lucide-react";
-import { useEffect as _, useMemo as ne, useRef as re, useState as ie } from "react";
-import { Drawer as v, createTranslation as y, useLanguage as ae } from "./component-library.es.js";
-import b from "@mui/material/Box";
-import x from "@mui/material/IconButton";
-import { usePickerActionsContext as S, usePickerAdapter as C } from "@mui/x-date-pickers/hooks";
-import { jsx as w, jsxs as T } from "react/jsx-runtime";
-import E from "@mui/material/Typography";
-import { MonthCalendar as oe } from "@mui/x-date-pickers/MonthCalendar";
-import { YearCalendar as se } from "@mui/x-date-pickers/YearCalendar";
+import { CalendarSearch as h, ChevronDown as g, ChevronLeft as ee, ChevronRight as te } from "lucide-react";
+import { useEffect as _, useMemo as ne, useRef as v, useState as re } from "react";
+import { Drawer as y, createTranslation as b, useLanguage as ie } from "./component-library.es.js";
+import x from "@mui/material/Box";
+import S from "@mui/material/IconButton";
+import { usePickerActionsContext as C, usePickerAdapter as w } from "@mui/x-date-pickers/hooks";
+import { jsx as T, jsxs as E } from "react/jsx-runtime";
+import D from "@mui/material/Typography";
+import { MonthCalendar as O } from "@mui/x-date-pickers/MonthCalendar";
+import { YearCalendar as ae } from "@mui/x-date-pickers/YearCalendar";
 //#region src/components/form/use-focus-target-ref.ts
-var D = (e, t) => {
+var oe = (e, t) => {
 	if (typeof e == "function") {
 		let n = e(t);
 		return {
@@ -31,27 +31,27 @@ var D = (e, t) => {
 		ref: e,
 		target: t
 	};
-}, O = (e) => {
+}, k = (e) => {
 	if (!e) return;
 	let { ref: t, cleanup: n } = e;
 	n ? n() : typeof t == "function" ? t(null) : t && (t.current = null);
 };
-function ce(e, t, n) {
-	let r = re(null);
+function se(e, t, n) {
+	let r = v(null);
 	_(() => {
 		let i = t.current, a = null;
 		if (i) {
 			for (let e of n) if (a = i.querySelector(e), a) break;
 		}
 		let o = r.current;
-		o && o.ref === e && o.target === a || (O(o), r.current = e ? D(e, a) : null);
+		o && o.ref === e && o.target === a || (k(o), r.current = e ? oe(e, a) : null);
 	}), _(() => () => {
-		O(r.current), r.current = null;
+		k(r.current), r.current = null;
 	}, []);
 }
 //#endregion
 //#region src/theme/tokens/breakpoints.ts
-var k = {
+var ce = {
 	xs: 0,
 	sm: 600,
 	md: 900,
@@ -188,28 +188,36 @@ var k = {
 	tight: 1.25,
 	snug: 1.4,
 	normal: 1.5
-}, { purple: F, teal: I, blue: L, amber: R, red: z, neutral: B, white: V, beige: H } = A, U = {
+}, { purple: F, teal: I, blue: L, amber: R, red: z, neutral: B, white: V, beige: H } = A, U = (e, t) => {
+	let [n, r, i] = [
+		1,
+		3,
+		5
+	].map((t) => parseInt(e.slice(t, t + 2), 16));
+	return `rgba(${n}, ${r}, ${i}, ${t})`;
+}, W = {
+	hover: "#E3D8DA",
+	contrastHover: "#241B26",
+	textContrastHover: "#CD86D6"
+}, G = {
 	bg: {
 		base: V,
 		subtle: B[50],
 		muted: H[100],
 		contrast: B[950],
 		accent: F[100],
-		overlay: ((e, t) => {
-			let [n, r, i] = [
-				1,
-				3,
-				5
-			].map((t) => parseInt(e.slice(t, t + 2), 16));
-			return `rgba(${n}, ${r}, ${i}, ${t})`;
-		})(B[950], .5)
+		overlay: U(B[950], .5),
+		hover: W.hover,
+		"contrast-hover": W.contrastHover,
+		"contrast-accent": F[800]
 	},
 	text: {
 		base: B[950],
 		subtle: B[500],
 		muted: B[400],
 		accent: F[600],
-		contrast: V
+		contrast: V,
+		"contrast-hover": W.textContrastHover
 	},
 	border: {
 		base: B[200],
@@ -254,15 +262,16 @@ var k = {
 			subtle: I[100]
 		}
 	}
-}, W = {
+}, K = {
 	xs: "0 1px 2px 0 rgb(0 0 0 / 0.05)",
 	sm: "0px 1px 3px 0px rgba(0, 0, 0, 0.10), 0px 1px 2px -1px rgba(0, 0, 0, 0.10)",
 	md: "0px 4px 6px -1px rgba(0, 0, 0, 0.10), 0px 2px 4px -2px rgba(0, 0, 0, 0.10)",
 	lg: "0px 10px 15px -3px rgba(0, 0, 0, 0.10), 0px 4px 6px -4px rgba(0, 0, 0, 0.10)",
 	xl: "0px 20px 25px -5px rgba(0, 0, 0, 0.10), 0px 8px 10px -6px rgba(0, 0, 0, 0.10)",
 	"2xl": "0px 25px 50px -12px rgba(0, 0, 0, 0.25)",
+	soft: "0 0 6px 0 rgba(86, 86, 118, 0.10)",
 	inner: "0px 2px 4px 0px rgba(0, 0, 0, 0.05) inset"
-}, G = {
+}, q = {
 	sm: 4,
 	md: 5,
 	lg: 6,
@@ -273,56 +282,60 @@ var k = {
 	"5xl": 32,
 	huge: 64,
 	full: 100
-}, K = 8, q = 16, J = (e) => `${e * K / q}rem`, le = 16, Y = {
+}, le = 8, ue = 16, J = (e) => `${e * le / ue}rem`, de = 16, fe = {
 	base: 16,
 	ratio: 1.125
-}, ue = (e) => Math.round(Y.base * Y.ratio ** e), de = (e) => `${ue(e) / le}rem`, X = (e, t, n, r = "0") => ({
+}, pe = (e) => Math.round(fe.base * fe.ratio ** e), me = (e) => `${pe(e) / de}rem`, Y = (e, t, n, r = "0") => ({
 	step: e,
 	fontWeight: t,
 	lineHeight: n,
 	letterSpacing: r
-}), fe = {
+}), he = {
 	display: {
-		sm: X(10, "semibold", "none"),
-		md: X(12, "semibold", "none")
+		sm: Y(10, "semibold", "none"),
+		md: Y(12, "semibold", "none")
 	},
 	heading: {
-		xs: X(0, "semibold", "snug"),
-		sm: X(2, "semibold", "snug"),
-		md: X(4, "semibold", "snug"),
-		lg: X(6, "semibold", "tight"),
-		xl: X(8, "semibold", "tight")
+		xs: Y(0, "semibold", "snug"),
+		sm: Y(2, "semibold", "snug"),
+		md: Y(4, "semibold", "snug"),
+		lg: Y(6, "semibold", "tight"),
+		xl: Y(8, "semibold", "tight")
+	},
+	title: {
+		md: Y(4, "regular", "snug"),
+		xl: Y(8, "regular", "tight")
 	},
 	body: {
-		xs: X(-2, "regular", "normal"),
-		sm: X(-1, "regular", "normal"),
-		md: X(0, "regular", "normal"),
-		lg: X(1, "regular", "normal")
+		xs: Y(-2, "regular", "normal"),
+		sm: Y(-1, "regular", "normal"),
+		md: Y(0, "regular", "normal"),
+		lg: Y(1, "regular", "normal")
 	},
 	label: {
-		sm: X(-2, "medium", "tight"),
-		md: X(-1, "medium", "tight"),
-		lg: X(0, "medium", "tight")
+		sm: Y(-2, "medium", "tight"),
+		md: Y(-1, "medium", "tight"),
+		lg: Y(0, "medium", "tight")
 	}
-}, pe = Object.entries(fe).flatMap(([e, t]) => Object.entries(t).map(([t, n]) => [`${e}-${t}`, n])), me = Object.fromEntries(pe), he = (e) => {
-	let { step: t, fontWeight: n, lineHeight: r, letterSpacing: i } = me[e];
+}, ge = Object.entries(he).flatMap(([e, t]) => Object.entries(t).map(([t, n]) => [`${e}-${t}`, n])), _e = Object.fromEntries(ge), ve = (e) => {
+	let { step: t, fontWeight: n, lineHeight: r, letterSpacing: i } = _e[e];
 	return {
-		fontSize: de(t),
+		fontSize: me(t),
 		fontWeight: N[n],
 		lineHeight: P[r],
 		letterSpacing: i
 	};
-}, Z = {
+}, X = {
 	standard: "ease-in-out",
 	spring: "cubic-bezier(0.34, 1.56, 0.64, 1)"
-}, Q = {
+}, Z = {
 	fast: "0.15s",
 	normal: "0.2s",
 	emphasis: "0.3s"
-}, ge = (e, t = Q.normal, n = Z.standard) => e.map((e) => `${e} ${t} ${n}`).join(", "), $ = { "&:focus-visible": {
+}, Q = (e, t = Z.normal, n = X.standard) => e.map((e) => `${e} ${t} ${n}`).join(", "), $ = { "&:focus-visible": {
 	outline: "2px solid",
-	outlineColor: U.text.base
-} }, _e = y({
+	outlineColor: G.text.base
+} }, ye = b({
 	previousMonth: {
 		no: "Forrige måned",
 		se: "Föregående månad",
@@ -347,7 +360,7 @@ var k = {
 		fi: "vaihda päivänäkymään",
 		es: "cambiar a vista de fecha"
 	}
-}), ve = (e) => e.charAt(0).toUpperCase() + e.slice(1), ye = {
+}), be = (e) => e.charAt(0).toUpperCase() + e.slice(1), xe = {
 	width: 40,
 	height: 40,
 	border: "1px solid",
@@ -359,12 +372,12 @@ var k = {
 		color: "text.base"
 	}
 };
-function be({ currentMonth: e, onMonthChange: t, onViewChange: n, view: r, minDate: i, maxDate: a, disabled: o, labels: s }) {
-	let c = C(), l = {
-		..._e(),
+function Se({ currentMonth: e, onMonthChange: t, onViewChange: n, view: r, minDate: i, maxDate: a, disabled: o, labels: s }) {
+	let c = w(), l = {
+		...ye(),
 		...s
-	}, u = r === "day", d = !!o || i != null && !c.isAfter(e, c.startOfMonth(i)), f = !!o || a != null && !c.isBefore(c.startOfMonth(e), c.startOfMonth(a)), p = `${ve(c.formatByString(e, "LLLL"))} ${c.getYear(e)}`, m = `${p}, ${u ? l.switchToYearView : l.switchToDayView}`;
-	return /* @__PURE__ */ T(b, {
+	}, u = r === "day", d = !!o || i != null && !c.isAfter(e, c.startOfMonth(i)), f = !!o || a != null && !c.isBefore(c.startOfMonth(e), c.startOfMonth(a)), p = `${be(c.formatByString(e, "LLLL"))} ${c.getYear(e)}`, m = `${p}, ${u ? l.switchToYearView : l.switchToDayView}`;
+	return /* @__PURE__ */ E(x, {
 		sx: {
 			display: "flex",
 			alignItems: "center",
@@ -374,20 +387,20 @@ function be({ currentMonth: e, onMonthChange: t, onViewChange: n, view: r, minDa
 			pb: 1
 		},
 		children: [
-			u ? /* @__PURE__ */ w(x, {
+			u ? /* @__PURE__ */ T(S, {
 				"aria-label": l.previousMonth,
 				disabled: d,
 				onClick: () => t(c.addMonths(e, -1)),
-				sx: ye,
-				children: /* @__PURE__ */ w(te, {
+				sx: xe,
+				children: /* @__PURE__ */ T(ee, {
 					size: 20,
 					"aria-hidden": !0
 				})
-			}) : /* @__PURE__ */ w(b, { sx: {
+			}) : /* @__PURE__ */ T(x, { sx: {
 				width: 40,
 				height: 40
 			} }),
-			/* @__PURE__ */ T(b, {
+			/* @__PURE__ */ E(x, {
 				component: "button",
 				type: "button",
 				"aria-label": m,
@@ -414,7 +427,7 @@ function be({ currentMonth: e, onMonthChange: t, onViewChange: n, view: r, minDa
 					},
 					...$
 				},
-				children: [p, /* @__PURE__ */ w(b, {
+				children: [p, /* @__PURE__ */ T(x, {
 					component: "span",
 					sx: {
 						display: "inline-flex",
@@ -422,22 +435,22 @@ function be({ currentMonth: e, onMonthChange: t, onViewChange: n, view: r, minDa
 						transition: "transform .15s",
 						transform: u ? "none" : "rotate(180deg)"
 					},
-					children: /* @__PURE__ */ w(ee, {
+					children: /* @__PURE__ */ T(g, {
 						size: 16,
 						"aria-hidden": !0
 					})
 				})]
 			}),
-			u ? /* @__PURE__ */ w(x, {
+			u ? /* @__PURE__ */ T(S, {
 				"aria-label": l.nextMonth,
 				disabled: f,
 				onClick: () => t(c.addMonths(e, 1)),
-				sx: ye,
-				children: /* @__PURE__ */ w(g, {
+				sx: xe,
+				children: /* @__PURE__ */ T(te, {
 					size: 20,
 					"aria-hidden": !0
 				})
-			}) : /* @__PURE__ */ w(b, { sx: {
+			}) : /* @__PURE__ */ T(x, { sx: {
 				width: 40,
 				height: 40
 			} })
@@ -446,14 +459,14 @@ function be({ currentMonth: e, onMonthChange: t, onViewChange: n, view: r, minDa
 }
 //#endregion
 //#region src/date-picker/drawer-toolbar.tsx
-function xe({ eyebrow: e, title: t, titleId: n, hidden: r }) {
-	return r ? null : /* @__PURE__ */ T(b, {
+function Ce({ eyebrow: e, title: t, titleId: n, hidden: r }) {
+	return r ? null : /* @__PURE__ */ E(x, {
 		sx: {
 			px: 3,
 			pt: 1,
 			pb: 1.5
 		},
-		children: [e != null && /* @__PURE__ */ w(E, {
+		children: [e != null && /* @__PURE__ */ T(D, {
 			component: "p",
 			sx: {
 				color: "text.accent",
@@ -464,7 +477,7 @@ function xe({ eyebrow: e, title: t, titleId: n, hidden: r }) {
 				mb: .5
 			},
 			children: e
-		}), t != null && /* @__PURE__ */ w(E, {
+		}), t != null && /* @__PURE__ */ T(D, {
 			component: "h2",
 			id: n,
 			sx: {
@@ -478,53 +491,53 @@ function xe({ eyebrow: e, title: t, titleId: n, hidden: r }) {
 }
 //#endregion
 //#region src/date-picker/theme/field-base.ts
-var Se = "54px", Ce = {
+var we = "54px", Te = {
 	paddingInlineStart: "0.9rem",
 	paddingBlockStart: "1.5rem",
 	paddingBlockEnd: "0.5rem"
-}, we = (e) => ({
+}, Ee = (e) => ({
 	[`& .${e}`]: {
 		top: 0,
 		inset: 0
 	},
 	[`& .${e} legend`]: { display: "none" }
-}), Te = (e) => ({
+}), De = (e) => ({
 	[`&:hover:not(:focus-within):not(.Mui-disabled):not(.Mui-error) .${e}`]: {
 		borderWidth: "2px",
-		borderColor: U.border.strong
+		borderColor: G.border.strong
 	},
 	[`&:focus-within:not(.Mui-error) .${e}`]: {
 		borderWidth: "2px",
-		borderColor: U.border.accent
+		borderColor: G.border.accent
 	},
 	[`&.Mui-error .${e}`]: {
 		borderWidth: "2px",
-		borderColor: U.status.error.base
+		borderColor: G.status.error.base
 	},
 	[`&.Mui-error:hover:not(:focus-within):not(.Mui-disabled) .${e}`]: {
 		borderWidth: "2px",
-		borderColor: U.status.error.base
+		borderColor: G.status.error.base
 	},
 	[`&.Mui-error:focus-within .${e}`]: {
 		borderWidth: "2px",
-		borderColor: U.status.error.base
+		borderColor: G.status.error.base
 	}
-}), Ee = "MuiPickersOutlinedInput-notchedOutline", De = {
+}), Oe = "MuiPickersOutlinedInput-notchedOutline", ke = {
 	MuiPickersOutlinedInput: { styleOverrides: {
 		root: {
 			boxSizing: "border-box",
 			alignItems: "flex-start",
 			padding: 0,
-			borderRadius: G.xl,
-			height: Se,
+			borderRadius: q.xl,
+			height: we,
 			lineHeight: "normal",
-			...we(Ee),
-			...Te(Ee),
+			...Ee(Oe),
+			...De(Oe),
 			"& .MuiInputAdornment-root": { alignSelf: "center" },
 			"& .MuiInputAdornment-positionEnd": { marginRight: J(2) }
 		},
 		sectionsContainer: {
-			...Ce,
+			...Te,
 			paddingInlineEnd: "0.9rem"
 		}
 	} },
@@ -549,24 +562,24 @@ var Se = "54px", Ce = {
 		},
 		weekDayLabel: {
 			fontSize: M.sm,
-			color: U.text.subtle
+			color: G.text.subtle
 		}
 	} },
 	MuiPickerDay: { styleOverrides: { root: {
 		width: 40,
 		height: 40,
 		fontSize: M.md,
-		color: U.text.base,
+		color: G.text.base,
 		backgroundColor: "transparent",
-		"&:hover, &:focus": { backgroundColor: U.bg.subtle },
+		"&:hover, &:focus": { backgroundColor: G.bg.subtle },
 		"&.MuiPickerDay-selected": {
-			backgroundColor: U.primary.base,
-			color: U.primary.contrast,
-			"&:hover, &:focus": { backgroundColor: U.primary.hover }
+			backgroundColor: G.primary.base,
+			color: G.primary.contrast,
+			"&:hover, &:focus": { backgroundColor: G.primary.hover }
 		},
-		"&.Mui-disabled, &.MuiPickerDay-disabled": { color: U.text.muted },
+		"&.Mui-disabled, &.MuiPickerDay-disabled": { color: G.text.muted },
 		"&.MuiPickerDay-today:not(.MuiPickerDay-selected)": {
-			outline: `1px solid ${U.border.base}`,
+			outline: `1px solid ${G.border.base}`,
 			outlineOffset: -1
 		}
 	} } },
@@ -582,20 +595,20 @@ var Se = "54px", Ce = {
 			maxWidth: "31%",
 			fontSize: M.md,
 			fontWeight: 500,
-			color: U.text.base,
+			color: G.text.base,
 			backgroundColor: "transparent",
-			borderRadius: G["3xl"],
+			borderRadius: q["3xl"],
 			height: J(6),
 			margin: 0,
-			"&:hover, &:focus": { backgroundColor: U.bg.subtle },
+			"&:hover, &:focus": { backgroundColor: G.bg.subtle },
 			"&.Mui-selected, &.MuiMonthCalendar-selected": {
-				backgroundColor: U.primary.base,
-				color: U.primary.contrast,
-				"&:hover, &:focus": { backgroundColor: U.primary.hover }
+				backgroundColor: G.primary.base,
+				color: G.primary.contrast,
+				"&:hover, &:focus": { backgroundColor: G.primary.hover }
 			},
 			"&.Mui-disabled, &.MuiMonthCalendar-disabled": {
 				backgroundColor: "transparent",
-				color: U.text.muted
+				color: G.text.muted
 			}
 		}
 	} },
@@ -611,42 +624,42 @@ var Se = "54px", Ce = {
 			maxWidth: "31%",
 			fontSize: M.md,
 			fontWeight: 500,
-			color: U.text.base,
+			color: G.text.base,
 			backgroundColor: "transparent",
-			borderRadius: G["3xl"],
+			borderRadius: q["3xl"],
 			height: J(6),
 			margin: 0,
-			"&:hover, &:focus": { backgroundColor: U.bg.subtle },
+			"&:hover, &:focus": { backgroundColor: G.bg.subtle },
 			"&.Mui-selected, &.MuiYearCalendar-selected": {
-				backgroundColor: U.primary.base,
-				color: U.primary.contrast,
-				"&:hover, &:focus": { backgroundColor: U.primary.hover }
+				backgroundColor: G.primary.base,
+				color: G.primary.contrast,
+				"&:hover, &:focus": { backgroundColor: G.primary.hover }
 			},
 			"&.Mui-disabled, &.MuiYearCalendar-disabled": {
 				backgroundColor: "transparent",
-				color: U.text.muted
+				color: G.text.muted
 			}
 		}
 	} },
 	MuiPickerPopper: { styleOverrides: { paper: {
 		width: "100%",
 		boxSizing: "border-box",
-		borderRadius: G.xl,
-		boxShadow: W.md,
-		border: `1px solid ${U.border.subtle}`
+		borderRadius: q.xl,
+		boxShadow: K.md,
+		border: `1px solid ${G.border.subtle}`
 	} } }
-}, Oe = {
+}, Ae = {
 	defaultProps: { variant: "outlined" },
 	styleOverrides: { root: { position: "relative" } }
-}, ke = { styleOverrides: { root: he("body-sm") } }, Ae = {
+}, je = { styleOverrides: { root: ve("body-sm") } }, Me = {
 	defaultProps: { size: "large" },
 	styleOverrides: {
 		root: {
 			...$,
-			borderRadius: G.full,
+			borderRadius: q.full,
 			textTransform: "none",
 			border: "2px solid",
-			transition: [ge(["background-color"], Q.emphasis, Z.spring), ge(["color"], Q.emphasis, Z.spring)].join(", "),
+			transition: [Q(["background-color"], Z.emphasis, X.spring), Q(["color"], Z.emphasis, X.spring)].join(", "),
 			svg: { flexShrink: 0 }
 		},
 		sizeSmall: {
@@ -667,34 +680,34 @@ var Se = "54px", Ce = {
 	variants: [{
 		props: { color: "primary" },
 		style: {
-			borderColor: U.border.strong,
-			color: U.text.base,
+			borderColor: G.border.strong,
+			color: G.text.base,
 			"&:hover": {
-				borderColor: U.primary.base,
-				backgroundColor: U.primary.base,
-				color: U.primary.contrast
+				borderColor: G.primary.base,
+				backgroundColor: G.primary.base,
+				color: G.primary.contrast
 			}
 		}
 	}, {
 		props: { color: "secondary" },
 		style: {
-			borderColor: U.primary.base,
-			color: U.primary.base,
+			borderColor: G.primary.base,
+			color: G.primary.base,
 			"&:hover": {
-				borderColor: U.border.strong,
-				backgroundColor: U.primary.base,
-				color: U.primary.contrast
+				borderColor: G.border.strong,
+				backgroundColor: G.primary.base,
+				color: G.primary.contrast
 			}
 		}
 	}]
-}, je = { styleOverrides: { shrink: { top: "1rem" } } }, Me = {
+}, Ne = { styleOverrides: { shrink: { top: "1rem" } } }, Pe = {
 	fontFamily: j,
 	fontWeight: N.regular,
-	color: U.text.base,
+	color: G.text.base,
 	"& strong": { fontWeight: N.medium },
 	"& a": {
-		color: `${U.text.base} !important`,
-		textDecorationColor: `${U.text.base} !important`,
+		color: `${G.text.base} !important`,
+		textDecorationColor: `${G.text.base} !important`,
 		fontWeight: N.regular
 	},
 	h1: void 0,
@@ -720,28 +733,28 @@ var Se = "54px", Ce = {
 	},
 	button: void 0,
 	caption: void 0
-}, Ne = (e) => ({
+}, Fe = (e) => ({
 	...e,
 	main: e.base,
 	dark: e.hover,
 	light: e.subtle,
 	contrastText: e.contrast
-}), Pe = t({
-	breakpoints: { values: k },
+}), Ie = t({
+	breakpoints: { values: ce },
 	palette: {
-		...U,
-		primary: Ne(U.primary),
-		secondary: Ne(U.secondary)
+		...G,
+		primary: Fe(G.primary),
+		secondary: Fe(G.secondary)
 	},
-	typography: Me,
+	typography: Pe,
 	components: {
-		...De,
-		MuiIconButton: Ae,
-		MuiFormControl: Oe,
-		MuiFormHelperText: ke,
-		MuiInputLabel: je
+		...ke,
+		MuiIconButton: Me,
+		MuiFormControl: Ae,
+		MuiFormHelperText: je,
+		MuiInputLabel: Ne
 	}
-}), Fe = y({
+}), Le = b({
 	selectDate: {
 		no: "Velg dato",
 		se: "Välj datum",
@@ -754,7 +767,7 @@ var Se = "54px", Ce = {
 		fi: "Valitse kuukausi ja vuosi",
 		es: "Seleccionar mes y año"
 	}
-}), Ie = y({
+}), Re = b({
 	month: {
 		no: "Måned",
 		se: "Månad",
@@ -773,7 +786,7 @@ var Se = "54px", Ce = {
 		fi: "Valitse näkymä",
 		es: "Seleccionar vista"
 	}
-}), Le = (e, t) => {
+}), ze = (e, t) => {
 	let n = {
 		view: "month",
 		label: t.month
@@ -783,12 +796,12 @@ var Se = "54px", Ce = {
 	};
 	return e === "year-month" ? [r, n] : [n, r];
 };
-function Re({ currentView: e, onViewChange: t, order: n = "month-year", labels: r }) {
+function Be({ currentView: e, onViewChange: t, order: n = "month-year", labels: r }) {
 	let i = {
-		...Ie(),
+		...Re(),
 		...r
-	}, a = Le(n, i);
-	return /* @__PURE__ */ w(b, {
+	}, a = ze(n, i);
+	return /* @__PURE__ */ T(x, {
 		role: "group",
 		"aria-label": i.selectView,
 		sx: {
@@ -801,7 +814,7 @@ function Re({ currentView: e, onViewChange: t, order: n = "month-year", labels:
 		},
 		children: a.map(({ view: n, label: r }) => {
 			let i = n === e;
-			return /* @__PURE__ */ w(b, {
+			return /* @__PURE__ */ T(x, {
 				component: "button",
 				type: "button",
 				"aria-pressed": i,
@@ -829,15 +842,15 @@ function Re({ currentView: e, onViewChange: t, order: n = "month-year", labels:
 }
 //#endregion
 //#region src/date-picker/view-renderers.tsx
-var ze = (e = "month-year", t) => {
+var Ve = (e = "month-year", t) => {
 	let n = e === "year-month", r = (r) => {
-		let i = S();
-		return /* @__PURE__ */ T("div", { children: [/* @__PURE__ */ w(Re, {
+		let i = C();
+		return /* @__PURE__ */ E("div", { children: [/* @__PURE__ */ T(Be, {
 			currentView: "month",
 			onViewChange: (e) => i.setView(e),
 			order: e,
 			labels: t
-		}), /* @__PURE__ */ w(oe, {
+		}), /* @__PURE__ */ T(O, {
 			value: r.value ?? null,
 			referenceDate: r.referenceDate,
 			minDate: r.minDate,
@@ -851,13 +864,13 @@ var ze = (e = "month-year", t) => {
 			}
 		})] });
 	}, i = (r) => {
-		let i = S();
-		return /* @__PURE__ */ T("div", { children: [/* @__PURE__ */ w(Re, {
+		let i = C();
+		return /* @__PURE__ */ E("div", { children: [/* @__PURE__ */ T(Be, {
 			currentView: "year",
 			onViewChange: (e) => i.setView(e),
 			order: e,
 			labels: t
-		}), /* @__PURE__ */ w(se, {
+		}), /* @__PURE__ */ T(ae, {
 			value: r.value ?? null,
 			referenceDate: r.referenceDate,
 			minDate: r.minDate,
@@ -872,27 +885,27 @@ var ze = (e = "month-year", t) => {
 		})] });
 	};
 	return {
-		month: (e) => /* @__PURE__ */ w(r, { ...e }),
-		year: (e) => /* @__PURE__ */ w(i, { ...e })
+		month: (e) => /* @__PURE__ */ T(r, { ...e }),
+		year: (e) => /* @__PURE__ */ T(i, { ...e })
 	};
-}, Be = [
+}, He = [
 	"year",
 	"month",
 	"day"
-], Ve = Pe.breakpoints.up("sm"), He = { "--drawer-radius": "1.5rem" }, Ue = ["[role=\"spinbutton\"]"], We = {
+], Ue = Ie.breakpoints.up("sm"), We = { "--drawer-radius": "1.5rem" }, Ge = ["[role=\"spinbutton\"]"], Ke = {
 	no: p,
 	se: m,
 	fi: f,
 	es: d
-}, Ge = {
+}, qe = {
 	no: c,
 	se: l,
 	fi: s,
 	es: o
-}, Ke = (e) => Ge[e].components.MuiLocalizationProvider.defaultProps.localeText, qe = () => /* @__PURE__ */ w(h, {
+}, Je = (e) => qe[e].components.MuiLocalizationProvider.defaultProps.localeText, Ye = () => /* @__PURE__ */ T(h, {
 	size: 20,
 	"aria-hidden": !0
-}), Je = (e) => (t) => u(t, "EEEEEE", { locale: e }).toLowerCase(), Ye = {
+}), Xe = (e) => (t) => u(t, "EEEEEE", { locale: e }).toLowerCase(), Ze = {
 	name: "sameWidth",
 	enabled: !0,
 	phase: "beforeWrite",
@@ -905,40 +918,40 @@ var ze = (e = "month-year", t) => {
 		e.elements.popper.style.width = `${t.offsetWidth}px`;
 	}
 };
-function Xe({ open: e, onClose: t, children: n, slotProps: r }) {
+function Qe({ open: e, onClose: t, children: n, slotProps: r }) {
 	let i = (typeof r?.paper == "object" ? r.paper : void 0)?.["aria-labelledby"];
-	return /* @__PURE__ */ w(v.Root, {
+	return /* @__PURE__ */ T(y.Root, {
 		side: "bottom",
 		open: e,
 		onOpenChange: (e, n) => {
 			e || t?.(n.event, n.reason === "outside-press" ? "backdropClick" : "escapeKeyDown");
 		},
-		children: /* @__PURE__ */ T(v.Portal, { children: [/* @__PURE__ */ w(v.Backdrop, {}), /* @__PURE__ */ w(v.Viewport, { children: /* @__PURE__ */ T(v.Popup, {
+		children: /* @__PURE__ */ E(y.Portal, { children: [/* @__PURE__ */ T(y.Backdrop, {}), /* @__PURE__ */ T(y.Viewport, { children: /* @__PURE__ */ E(y.Popup, {
 			"aria-labelledby": i,
-			style: He,
-			children: [/* @__PURE__ */ w(v.Handle, {}), n]
+			style: We,
+			children: [/* @__PURE__ */ T(y.Handle, {}), n]
 		}) })] })
 	});
 }
-function Ze(t) {
-	return /* @__PURE__ */ w(e, {
-		theme: Pe,
-		children: /* @__PURE__ */ w(Qe, { ...t })
+function $e(t) {
+	return /* @__PURE__ */ T(e, {
+		theme: Ie,
+		children: /* @__PURE__ */ T(et, { ...t })
 	});
 }
-function Qe({ value: e, defaultValue: t, onValueChange: o, onBlur: s, ref: c, name: l, label: u, helperText: d, error: f, disabled: p, required: m, readOnly: h, minDate: ee, maxDate: te, disablePast: g, disableFuture: _, views: v = Be, monthYearOrder: y = "month-year", format: b, referenceDate: x, open: S, onOpenChange: C, desktopModeMediaQuery: T = Ve, eyebrow: E, title: oe, viewToggleLabels: se, calendarHeaderLabels: D, className: O, style: k }) {
-	let A = ae(), j = Fe(), M = n(T), N = We[A], P = !v.includes("day"), F = oe ?? (P ? j.selectMonthYear : j.selectDate), I = P && y === "year-month", L = b ?? (I ? "yyyy MMMM" : void 0), R = P ? ze(y, se) : void 0, z = I ? "year" : P ? "month" : void 0, B = ne(() => Je(N), [N]), V = re(null);
-	ce(c, V, Ue);
-	let [H, U] = ie(!1), W = S ?? H, G = (e) => {
+function et({ value: e, defaultValue: t, onValueChange: o, onBlur: s, ref: c, name: l, label: u, helperText: d, error: f, disabled: p, required: m, readOnly: h, minDate: g, maxDate: ee, disablePast: te, disableFuture: _, views: y = He, monthYearOrder: b = "month-year", format: x, referenceDate: S, open: C, onOpenChange: w, desktopModeMediaQuery: E = Ue, eyebrow: D, title: O, viewToggleLabels: ae, calendarHeaderLabels: oe, className: k, style: ce }) {
+	let A = ie(), j = Le(), M = n(E), N = Ke[A], P = !y.includes("day"), F = O ?? (P ? j.selectMonthYear : j.selectDate), I = P && b === "year-month", L = x ?? (I ? "yyyy MMMM" : void 0), R = P ? Ve(b, ae) : void 0, z = I ? "year" : P ? "month" : void 0, B = ne(() => Xe(N), [N]), V = v(null);
+	se(c, V, Ge);
+	let [H, U] = re(!1), W = C ?? H, G = (e) => {
 		W || e.currentTarget.contains(e.relatedTarget) || s?.();
 	}, K = {
-		openPickerIcon: qe,
-		...P ? {} : { calendarHeader: be }
+		openPickerIcon: Ye,
+		...P ? {} : { calendarHeader: Se }
 	}, q = M ? K : {
 		...K,
-		dialog: Xe,
-		toolbar: xe
-	}, J = {
+		dialog: Qe,
+		toolbar: Ce
+	}, le = {
 		openPickerButton: { sx: {
 			border: "none",
 			color: "text.subtle",
@@ -947,15 +960,15 @@ function Qe({ value: e, defaultValue: t, onValueChange: o, onBlur: s, ref: c, na
 				color: "text.base"
 			}
 		} },
-		popper: { modifiers: [Ye] },
-		...P ? {} : { calendarHeader: { labels: D } },
+		popper: { modifiers: [Ze] },
+		...P ? {} : { calendarHeader: { labels: oe } },
 		textField: {
 			error: f,
 			required: m,
 			helperText: d,
 			fullWidth: !0,
-			className: O,
-			style: k,
+			className: k,
+			style: ce,
 			slotProps: { root: {
 				ref: V,
 				onBlur: G
@@ -965,16 +978,16 @@ function Qe({ value: e, defaultValue: t, onValueChange: o, onBlur: s, ref: c, na
 			actionBar: { actions: [] },
 			toolbar: {
 				hidden: !1,
-				eyebrow: E,
+				eyebrow: D,
 				title: F
 			}
 		}
 	};
-	return /* @__PURE__ */ w(a, {
+	return /* @__PURE__ */ T(a, {
 		dateAdapter: r,
 		adapterLocale: N,
-		localeText: Ke(A),
-		children: /* @__PURE__ */ w(i, {
+		localeText: Je(A),
+		children: /* @__PURE__ */ T(i, {
 			value: e,
 			defaultValue: t,
 			onChange: (e, t) => o?.(e, { validationError: t.validationError }),
@@ -982,31 +995,31 @@ function Qe({ value: e, defaultValue: t, onValueChange: o, onBlur: s, ref: c, na
 			label: u,
 			disabled: p,
 			readOnly: h,
-			minDate: ee,
-			maxDate: te,
-			disablePast: g,
+			minDate: g,
+			maxDate: ee,
+			disablePast: te,
 			disableFuture: _,
-			views: v,
+			views: y,
 			openTo: z,
 			format: L,
-			referenceDate: x,
+			referenceDate: S,
 			viewRenderers: R,
 			dayOfWeekFormatter: B,
-			desktopModeMediaQuery: T,
+			desktopModeMediaQuery: E,
 			closeOnSelect: !0,
 			slots: q,
-			slotProps: J,
-			open: S,
+			slotProps: le,
+			open: C,
 			onOpen: () => {
-				U(!0), C?.(!0);
+				U(!0), w?.(!0);
 			},
 			onClose: () => {
-				U(!1), C?.(!1), s?.();
+				U(!1), w?.(!1), s?.();
 			}
 		})
 	});
 }
 //#endregion
-export { Ze as DatePicker };
+export { $e as DatePicker };
 
 //# sourceMappingURL=date-picker.mjs.map