@solostylist/ui-kit 1.0.216 → 1.0.217

package/dist/s-date-picker/index.js

@@ -1,2 +1,2 @@
-import { t as e } from "../s-date-picker-C-FOMdpa.js";
+import { t as e } from "../s-date-picker-Fo7ezXTV.js";
 export { e as SDatePicker, e as default };

package/dist/s-date-picker/s-date-picker.d.ts

@@ -16,7 +16,7 @@ export interface SDatePickerProps extends DatePickerProps {
     hint?: string;
 }
 export declare const SDatePicker: {
-    ({ label, required, error, htmlFor, hint, ...props }: SDatePickerProps): React.JSX.Element;
+    ({ label, required, error, htmlFor, hint, slots, slotProps, ...props }: SDatePickerProps): React.JSX.Element;
     displayName: string;
 };
 export default SDatePicker;

package/dist/s-date-picker/s-date-picker.js

@@ -1,2 +1,2 @@
-import { t as e } from "../s-date-picker-C-FOMdpa.js";
+import { t as e } from "../s-date-picker-Fo7ezXTV.js";
 export { e as SDatePicker, e as default };

package/dist/{s-date-picker-C-FOMdpa.js → s-date-picker-Fo7ezXTV.js}

@@ -1,73 +1,74 @@
 import { n as e } from "./chunk-efA98nb6.js";
-import { _ as t } from "./createTheme-hnicUJQa.js";
-import { s as n } from "./memoTheme-DiKnacj0.js";
-import { t as r } from "./clsx-BTH_sxEO.js";
-import { t as i } from "./generateUtilityClass-D4Rn9MbW.js";
-import { t as a } from "./generateUtilityClasses-CX1nR7K3.js";
-import { t as o } from "./styled-C0_N3zFx.js";
-import { $ as s, A as c, F as l, M as u, N as d, O as f, P as p, Q as m, T as h, _ as g, b as _, et as v, j as y, m as b, n as x, p as S, s as C, t as w, v as T, w as E, y as ee, z as D } from "./useMobilePicker-C5bImMb9.js";
-import { i as O } from "./LocalizationProvider-C07_J3LH.js";
-import { a as k } from "./ButtonBase-1qqPHJym.js";
-import { i as A } from "./useSlot-BfqKgBbE.js";
-import { t as j } from "./extends-DtvfmDTb.js";
-import { t as M } from "./objectWithoutPropertiesLoose-Cq334jkZ.js";
-import { t as N } from "./Typography-Ci004UCT.js";
-import { SForm as P } from "./s-form/s-form.js";
-import * as F from "react";
-import { jsx as I } from "react/jsx-runtime";
-import { TextField as L, useTheme as R } from "@mui/material";
-//#region ../../node_modules/@mui/x-date-pickers/esm/DatePicker/datePickerToolbarClasses.js
+import { _ as t, i as n } from "./createTheme-YGsrOe_4.js";
+import { o as r } from "./memoTheme-BmiT8U43.js";
+import { t as i } from "./clsx-69XFQeWf.js";
+import { t as a } from "./generateUtilityClass-tRYNDrlH.js";
+import { t as o } from "./generateUtilityClasses-XrPHiTcM.js";
+import { t as s } from "./styled-BRk8Ukg1.js";
+import { $ as c, A as l, F as u, M as d, N as f, O as p, P as m, Q as h, T as g, _, b as v, et as y, j as b, m as x, n as S, p as C, s as w, t as T, v as ee, w as te, y as ne, z as E } from "./useMobilePicker-6o6QRlWL.js";
+import { a as D } from "./LocalizationProvider-DtVmtZ15.js";
+import { o as O, s as k } from "./theme-primitives-DHiY0aFC.js";
+import { a as A } from "./ButtonBase-Pxs48joz.js";
+import { i as j } from "./useSlot-CugRM0KJ.js";
+import { t as M } from "./extends-D8CDMpIy.js";
+import { t as N } from "./objectWithoutPropertiesLoose-BpY-kC5L.js";
+import { t as P } from "./Typography-Dy5dAg2u.js";
+import { SForm as F } from "./s-form/s-form.js";
+import * as I from "react";
+import { jsx as L } from "react/jsx-runtime";
+import { useTheme as R } from "@mui/material";
+//#region ../../node_modules/@mui/x-date-pickers/DatePicker/datePickerToolbarClasses.mjs
 function z(e) {
-	return i("MuiDatePickerToolbar", e);
+	return a("MuiDatePickerToolbar", e);
 }
-a("MuiDatePickerToolbar", ["root", "title"]);
+o("MuiDatePickerToolbar", ["root", "title"]);
 //#endregion
-//#region ../../node_modules/@mui/x-date-pickers/esm/DatePicker/DatePickerToolbar.js
-var B = /* @__PURE__ */ e(t()), V = [
+//#region ../../node_modules/@mui/x-date-pickers/DatePicker/DatePickerToolbar.mjs
+var B = /* @__PURE__ */ e(t(), 1), V = [
 	"toolbarFormat",
 	"toolbarPlaceholder",
 	"className",
 	"classes"
-], H = (e) => n({
+], H = (e) => r({
 	root: ["root"],
 	title: ["title"]
-}, z, e), U = o(S, {
+}, z, e), U = s(C, {
 	name: "MuiDatePickerToolbar",
 	slot: "Root"
-})({}), W = o(N, {
+})({}), W = s(P, {
 	name: "MuiDatePickerToolbar",
 	slot: "Title"
 })({ variants: [{
 	props: { pickerOrientation: "landscape" },
 	style: { margin: "auto 16px auto auto" }
-}] }), G = /* @__PURE__ */ F.forwardRef(function(e, t) {
-	let n = O({
+}] }), G = /* @__PURE__ */ I.forwardRef(function(e, t) {
+	let n = D({
 		props: e,
 		name: "MuiDatePickerToolbar"
-	}), { toolbarFormat: i, toolbarPlaceholder: a = "––", className: o, classes: s } = n, c = M(n, V), l = p(), { value: u, views: f, orientation: h } = y(), g = d(), _ = b(), v = H(s), x = F.useMemo(() => {
+	}), { toolbarFormat: r, toolbarPlaceholder: a = "––", className: o, classes: s } = n, c = N(n, V), l = m(), { value: u, views: d, orientation: p } = b(), g = f(), _ = x(), v = H(s), y = I.useMemo(() => {
 		if (!l.isValid(u)) return a;
-		let e = m(l, {
-			format: i,
-			views: f
+		let e = h(l, {
+			format: r,
+			views: d
 		}, !0);
 		return l.formatByString(u, e);
 	}, [
 		u,
-		i,
+		r,
 		a,
 		l,
-		f
+		d
 	]);
-	return /* @__PURE__ */ I(U, j({
+	return /* @__PURE__ */ L(U, M({
 		ref: t,
 		toolbarTitle: g.datePickerToolbarTitle,
-		className: r(v.root, o)
-	}, c, { children: /* @__PURE__ */ I(W, {
+		className: i(v.root, o)
+	}, c, { children: /* @__PURE__ */ L(W, {
 		variant: "h4",
-		align: h === "landscape" ? "left" : "center",
+		align: p === "landscape" ? "left" : "center",
 		ownerState: _,
 		className: v.title,
-		children: x
+		children: y
 	}) }));
 });
 process.env.NODE_ENV !== "production" && (G.displayName = "DatePickerToolbar"), process.env.NODE_ENV !== "production" && (G.propTypes = {
@@ -88,44 +89,45 @@ process.env.NODE_ENV !== "production" && (G.displayName = "DatePickerToolbar"),
 	toolbarPlaceholder: B.default.node
 });
 //#endregion
-//#region ../../node_modules/@mui/x-date-pickers/esm/DatePicker/shared.js
+//#region ../../node_modules/@mui/x-date-pickers/DatePicker/shared.mjs
 function K(e, t) {
-	let n = O({
+	let n = D({
 		props: e,
 		name: t
 	});
-	return j({}, n, E(n), { localeText: F.useMemo(() => n.localeText?.toolbarTitle == null ? n.localeText : j({}, n.localeText, { datePickerToolbarTitle: n.localeText.toolbarTitle }), [n.localeText]) }, s({
+	return M({}, n, te(n), { localeText: I.useMemo(() => n.localeText?.toolbarTitle == null ? n.localeText : M({}, n.localeText, { datePickerToolbarTitle: n.localeText.toolbarTitle }), [n.localeText]) }, c({
 		views: n.views,
 		openTo: n.openTo,
 		defaultViews: ["year", "day"],
 		defaultOpenTo: "day"
-	}), { slots: j({ toolbar: G }, n.slots) });
+	}), { slots: M({ toolbar: G }, n.slots) });
 }
 //#endregion
-//#region ../../node_modules/@mui/x-date-pickers/esm/DateField/useDateField.js
-var q = (e) => f({
-	manager: h(e),
+//#region ../../node_modules/@mui/x-date-pickers/DateField/useDateField.mjs
+var q = (e) => p({
+	manager: g(),
 	props: e
-}), J = ["slots", "slotProps"], Y = /* @__PURE__ */ F.forwardRef(function(e, t) {
-	let n = O({
+}), J = ["slots", "slotProps"], Y = /* @__PURE__ */ I.forwardRef(function(e, t) {
+	let n = D({
 		props: e,
 		name: "MuiDateField"
-	}), { slots: r, slotProps: i } = n, a = M(n, J), o = q(ee({
+	}), { slots: r, slotProps: i } = n, a = N(n, J), o = q(ne({
 		slotProps: i,
 		ref: t,
 		externalForwardedProps: a
 	}));
-	return /* @__PURE__ */ I(T, {
+	return /* @__PURE__ */ L(ee, {
 		slots: r,
 		slotProps: i,
 		inputRef: a.inputRef,
-		children: /* @__PURE__ */ I(g, {
+		children: /* @__PURE__ */ L(_, {
 			fieldResponse: o,
-			defaultOpenPickerIcon: _
+			defaultOpenPickerIcon: v
 		})
 	});
 });
 process.env.NODE_ENV !== "production" && (Y.displayName = "DateField"), process.env.NODE_ENV !== "production" && (Y.propTypes = {
+	areAllSectionsEmpty: B.default.bool,
 	autoFocus: B.default.bool,
 	className: B.default.string,
 	clearable: B.default.bool,
@@ -143,19 +145,17 @@ process.env.NODE_ENV !== "production" && (Y.displayName = "DateField"), process.
 	disabled: B.default.bool,
 	disableFuture: B.default.bool,
 	disablePast: B.default.bool,
-	enableAccessibleFieldDOMStructure: B.default.bool,
+	endAdornment: B.default.node,
+	error: B.default.bool,
+	fieldRef: B.default.oneOfType([B.default.func, B.default.object]),
 	focused: B.default.bool,
 	format: B.default.string,
 	formatDensity: B.default.oneOf(["dense", "spacious"]),
-	FormHelperTextProps: B.default.object,
 	fullWidth: B.default.bool,
 	helperText: B.default.node,
 	hiddenLabel: B.default.bool,
 	id: B.default.string,
-	InputLabelProps: B.default.object,
-	inputProps: B.default.object,
-	InputProps: B.default.object,
-	inputRef: k,
+	inputRef: A,
 	label: B.default.node,
 	margin: B.default.oneOf([
 		"dense",
@@ -168,8 +168,12 @@ process.env.NODE_ENV !== "production" && (Y.displayName = "DateField"), process.
 	onBlur: B.default.func,
 	onChange: B.default.func,
 	onClear: B.default.func,
+	onClick: B.default.func,
 	onError: B.default.func,
 	onFocus: B.default.func,
+	onInput: B.default.func,
+	onKeyDown: B.default.func,
+	onPaste: B.default.func,
 	onSelectedSectionsChange: B.default.func,
 	openPickerButtonPosition: B.default.oneOf(["end", "start"]),
 	readOnly: B.default.bool,
@@ -194,6 +198,7 @@ process.env.NODE_ENV !== "production" && (Y.displayName = "DateField"), process.
 	size: B.default.oneOf(["medium", "small"]),
 	slotProps: B.default.object,
 	slots: B.default.object,
+	startAdornment: B.default.node,
 	style: B.default.object,
 	sx: B.default.oneOfType([
 		B.default.arrayOf(B.default.oneOfType([
@@ -205,7 +210,6 @@ process.env.NODE_ENV !== "production" && (Y.displayName = "DateField"), process.
 		B.default.object
 	]),
 	timezone: B.default.string,
-	unstableFieldRef: B.default.oneOfType([B.default.func, B.default.object]),
 	value: B.default.object,
 	variant: B.default.oneOf([
 		"filled",
@@ -214,28 +218,28 @@ process.env.NODE_ENV !== "production" && (Y.displayName = "DateField"), process.
 	])
 });
 //#endregion
-//#region ../../node_modules/@mui/x-date-pickers/esm/DesktopDatePicker/DesktopDatePicker.js
-var X = /* @__PURE__ */ F.forwardRef(function(e, t) {
-	let n = p(), r = K(e, "MuiDesktopDatePicker"), i = j({
-		day: C,
-		month: C,
-		year: C
-	}, r.viewRenderers), { renderPicker: a } = x({
+//#region ../../node_modules/@mui/x-date-pickers/DesktopDatePicker/DesktopDatePicker.mjs
+var X = /* @__PURE__ */ I.forwardRef(function(e, t) {
+	let n = m(), r = K(e, "MuiDesktopDatePicker"), i = M({
+		day: w,
+		month: w,
+		year: w
+	}, r.viewRenderers), { renderPicker: a } = S({
 		ref: t,
-		props: j({}, r, {
+		props: M({}, r, {
 			closeOnSelect: r.closeOnSelect ?? !0,
 			viewRenderers: i,
-			format: m(n, r, !1),
+			format: h(n, r, !1),
 			yearsPerRow: r.yearsPerRow ?? 4,
-			slots: j({ field: Y }, r.slots),
-			slotProps: j({}, r.slotProps, {
-				field: (e) => j({}, A(r.slotProps?.field, e), u(r)),
-				toolbar: j({ hidden: !0 }, r.slotProps?.toolbar)
+			slots: M({ field: Y }, r.slots),
+			slotProps: M({}, r.slotProps, {
+				field: (e) => M({}, j(r.slotProps?.field, e), d(r)),
+				toolbar: M({ hidden: !0 }, r.slotProps?.toolbar)
 			})
 		}),
-		valueManager: D,
+		valueManager: E,
 		valueType: "date",
-		validator: c,
+		validator: l,
 		steps: null
 	});
 	return a();
@@ -252,11 +256,11 @@ process.env.NODE_ENV !== "production" && (X.displayName = "DesktopDatePicker"),
 	disableOpenPicker: B.default.bool,
 	disablePast: B.default.bool,
 	displayWeekNumber: B.default.bool,
-	enableAccessibleFieldDOMStructure: B.default.any,
 	fixedWeekNumber: B.default.number,
 	format: B.default.string,
 	formatDensity: B.default.oneOf(["dense", "spacious"]),
-	inputRef: k,
+	inputRef: A,
+	keepOpenDuringFieldFocus: B.default.bool,
 	label: B.default.node,
 	loading: B.default.bool,
 	localeText: B.default.object,
@@ -332,26 +336,26 @@ process.env.NODE_ENV !== "production" && (X.displayName = "DesktopDatePicker"),
 	yearsPerRow: B.default.oneOf([3, 4])
 };
 //#endregion
-//#region ../../node_modules/@mui/x-date-pickers/esm/MobileDatePicker/MobileDatePicker.js
-var Z = /* @__PURE__ */ F.forwardRef(function(e, t) {
-	let n = p(), r = K(e, "MuiMobileDatePicker"), { renderPicker: i } = w({
+//#region ../../node_modules/@mui/x-date-pickers/MobileDatePicker/MobileDatePicker.mjs
+var Z = /* @__PURE__ */ I.forwardRef(function(e, t) {
+	let n = m(), r = K(e, "MuiMobileDatePicker"), { renderPicker: i } = T({
 		ref: t,
-		props: j({}, r, {
-			viewRenderers: j({
-				day: C,
-				month: C,
-				year: C
+		props: M({}, r, {
+			viewRenderers: M({
+				day: w,
+				month: w,
+				year: w
 			}, r.viewRenderers),
-			format: m(n, r, !1),
-			slots: j({ field: Y }, r.slots),
-			slotProps: j({}, r.slotProps, {
-				field: (e) => j({}, A(r.slotProps?.field, e), u(r)),
-				toolbar: j({ hidden: !1 }, r.slotProps?.toolbar)
+			format: h(n, r, !1),
+			slots: M({ field: Y }, r.slots),
+			slotProps: M({}, r.slotProps, {
+				field: (e) => M({}, j(r.slotProps?.field, e), d(r)),
+				toolbar: M({ hidden: !1 }, r.slotProps?.toolbar)
 			})
 		}),
-		valueManager: D,
+		valueManager: E,
 		valueType: "date",
-		validator: c,
+		validator: l,
 		steps: null
 	});
 	return i();
@@ -368,11 +372,11 @@ process.env.NODE_ENV !== "production" && (Z.displayName = "MobileDatePicker"), Z
 	disableOpenPicker: B.default.bool,
 	disablePast: B.default.bool,
 	displayWeekNumber: B.default.bool,
-	enableAccessibleFieldDOMStructure: B.default.any,
 	fixedWeekNumber: B.default.number,
 	format: B.default.string,
 	formatDensity: B.default.oneOf(["dense", "spacious"]),
-	inputRef: k,
+	inputRef: A,
+	keepOpenDuringFieldFocus: B.default.bool,
 	label: B.default.node,
 	loading: B.default.bool,
 	localeText: B.default.object,
@@ -448,13 +452,13 @@ process.env.NODE_ENV !== "production" && (Z.displayName = "MobileDatePicker"), Z
 	yearsPerRow: B.default.oneOf([3, 4])
 };
 //#endregion
-//#region ../../node_modules/@mui/x-date-pickers/esm/DatePicker/DatePicker.js
-var te = ["desktopModeMediaQuery"], Q = /* @__PURE__ */ F.forwardRef(function(e, t) {
-	let n = O({
+//#region ../../node_modules/@mui/x-date-pickers/DatePicker/DatePicker.mjs
+var re = ["desktopModeMediaQuery"], Q = /* @__PURE__ */ I.forwardRef(function(e, t) {
+	let n = D({
 		props: e,
 		name: "MuiDatePicker"
-	}), { desktopModeMediaQuery: r = l } = n, i = M(n, te);
-	return v(r, { defaultMatches: !0 }) ? /* @__PURE__ */ I(X, j({ ref: t }, i)) : /* @__PURE__ */ I(Z, j({ ref: t }, i));
+	}), { desktopModeMediaQuery: r = u } = n, i = N(n, re);
+	return y(r, { defaultMatches: !0 }) ? /* @__PURE__ */ L(X, M({ ref: t }, i)) : /* @__PURE__ */ L(Z, M({ ref: t }, i));
 });
 process.env.NODE_ENV !== "production" && (Q.displayName = "DatePicker"), process.env.NODE_ENV !== "production" && (Q.propTypes = {
 	autoFocus: B.default.bool,
@@ -469,11 +473,11 @@ process.env.NODE_ENV !== "production" && (Q.displayName = "DatePicker"), process
 	disableOpenPicker: B.default.bool,
 	disablePast: B.default.bool,
 	displayWeekNumber: B.default.bool,
-	enableAccessibleFieldDOMStructure: B.default.any,
 	fixedWeekNumber: B.default.number,
 	format: B.default.string,
 	formatDensity: B.default.oneOf(["dense", "spacious"]),
-	inputRef: k,
+	inputRef: A,
+	keepOpenDuringFieldFocus: B.default.bool,
 	label: B.default.node,
 	loading: B.default.bool,
 	localeText: B.default.object,
@@ -550,20 +554,16 @@ process.env.NODE_ENV !== "production" && (Q.displayName = "DatePicker"), process
 });
 //#endregion
 //#region lib/s-date-picker/s-date-picker.tsx
-var $ = ({ label: e, required: t = !1, error: n, htmlFor: r, hint: i, ...a }) => {
-	let o = R();
-	return /* @__PURE__ */ I(P, {
+var $ = ({ label: e, required: t = !1, error: r, htmlFor: i, hint: a, slots: o, slotProps: s, ...c }) => {
+	let l = R();
+	return /* @__PURE__ */ L(F, {
 		label: e,
 		required: t,
-		error: n,
-		htmlFor: r,
-		hint: i,
-		children: /* @__PURE__ */ I(Q, {
-			enableAccessibleFieldDOMStructure: !1,
-			slots: {
-				textField: L,
-				...a.slots ?? {}
-			},
+		error: r,
+		htmlFor: i,
+		hint: a,
+		children: /* @__PURE__ */ L(Q, {
+			slots: { ...o ?? {} },
 			slotProps: {
 				openPickerButton: {
 					edge: "end",
@@ -571,14 +571,60 @@ var $ = ({ label: e, required: t = !1, error: n, htmlFor: r, hint: i, ...a }) =>
 				},
 				popper: { sx: { "& .MuiPaper-root": {
 					border: "1px solid",
-					borderColor: (o.vars ?? o).palette.divider,
-					borderRadius: (o.vars ?? o).shape.borderRadius,
+					borderColor: (l.vars ?? l).palette.divider,
+					borderRadius: (l.vars ?? l).shape.borderRadius,
 					boxShadow: "none",
 					backgroundImage: "none"
 				} } },
-				...a.slotProps ?? {}
+				...s ?? {},
+				textField: (e) => {
+					let t = typeof s?.textField == "function" ? s.textField(e) : s?.textField, a = t?.sx;
+					return {
+						fullWidth: !0,
+						id: i,
+						error: !!r,
+						...t,
+						sx: [{
+							"& .MuiPickersOutlinedInput-root": {
+								height: l.spacing(5),
+								minHeight: l.spacing(5),
+								px: 1.5,
+								py: 0,
+								color: (l.vars ?? l).palette.text.primary,
+								borderRadius: (l.vars ?? l).shape.borderRadius,
+								border: `1px solid ${(l.vars ?? l).palette.divider}`,
+								backgroundColor: (l.vars ?? l).palette.background.default,
+								transition: "border 120ms ease-in",
+								"&:hover": { borderColor: k[500] },
+								"&:focus-within": {
+									outline: `3px solid ${n(O[500], .5)}`,
+									borderColor: O[400]
+								},
+								"&.MuiPickersInputBase-focused": {
+									outline: `3px solid ${n(O[500], .5)}`,
+									borderColor: O[400]
+								},
+								"&.MuiPickersInputBase-error": { borderColor: (l.vars ?? l).palette.error.main },
+								"&.MuiPickersInputBase-inputSizeSmall": {
+									height: l.spacing(4.5),
+									minHeight: l.spacing(4.5)
+								}
+							},
+							"& .MuiPickersInputBase-sectionsContainer": {
+								alignItems: "center",
+								height: "100%",
+								p: "0 !important"
+							},
+							"& .MuiPickersOutlinedInput-notchedOutline": { border: "none !important" },
+							"& .MuiPickersInputBase-input::placeholder": {
+								opacity: 1,
+								color: (l.vars ?? l).palette.text.secondary
+							}
+						}, ...Array.isArray(a) ? a : a ? [a] : []]
+					};
+				}
 			},
-			...a
+			...c
 		})
 	});
 };

package/dist/s-datetime-picker/index.js

@@ -1,2 +1,2 @@
-import { t as e } from "../s-datetime-picker-qg0m55tj.js";
+import { t as e } from "../s-datetime-picker-BcpyhYZf.js";
 export { e as SDateTimePicker, e as default };

package/dist/s-datetime-picker/s-datetime-picker.d.ts

@@ -17,7 +17,7 @@ export interface SDateTimePickerProps extends DateTimePickerProps {
     hint?: string;
 }
 export declare const SDateTimePicker: {
-    ({ label, required, error, htmlFor, hint, ...props }: SDateTimePickerProps): React.JSX.Element;
+    ({ label, required, error, htmlFor, hint, slots, slotProps, ...props }: SDateTimePickerProps): React.JSX.Element;
     displayName: string;
 };
 export default SDateTimePicker;

package/dist/s-datetime-picker/s-datetime-picker.js

@@ -1,2 +1,2 @@
-import { t as e } from "../s-datetime-picker-qg0m55tj.js";
+import { t as e } from "../s-datetime-picker-BcpyhYZf.js";
 export { e as SDateTimePicker, e as default };