@solostylist/ui-kit 1.0.230 → 2.0.0

package/dist/theme/components/month-calendar.js

@@ -1,7 +1,18 @@
-import { n as e } from "../../monthCalendarClasses-BLfBep-t.js";
-//#region lib/theme/components/month-calendar.tsx
-var t = {
-	defaultProps: { monthsPerRow: 4 },
+import { t as e } from "../../styled-Bog8QCl3.js";
+import { t } from "../../ButtonBase-DxKtpFYs.js";
+import { actionHoverMedia as n, getFocusVisibleStyle as r, getSelectedActionStyle as i } from "./action-styles.js";
+import { n as a } from "../../monthCalendarClasses-BYVHyEfI.js";
+var o = {
+	defaultProps: {
+		monthsPerRow: 4,
+		slots: { monthButton: e(t, {
+			name: "MuiMonthCalendar",
+			slot: "Button"
+		})(({ theme: e }) => ({
+			...e.typography.subtitle1,
+			color: "unset"
+		})) }
+	},
 	styleOverrides: {
 		root: ({ theme: e }) => ({
 			width: e.spacing(38),
@@ -13,18 +24,16 @@ var t = {
 			paddingTop: 0,
 			paddingBottom: 0
 		}),
-		button: ({ theme: t }) => ({
-			height: t.spacing(4),
-			width: `calc((100% - ${t.spacing(3)}) / 4)`,
-			borderRadius: (t.vars ?? t).shape.borderRadius,
-			"&:hover, &:focus": { backgroundColor: (t.vars ?? t).palette.action.hover },
-			[`&.${e.selected}`]: {
-				backgroundColor: (t.vars ?? t).palette.primary[800],
-				color: (t.vars ?? t).palette.primary[50],
-				"&:hover, &:focus": { backgroundColor: (t.vars ?? t).palette.primary[900] }
-			}
+		button: ({ theme: e }) => ({
+			height: e.spacing(4),
+			width: `calc((100% - ${e.spacing(3)}) / 4)`,
+			borderRadius: (e.vars ?? e).shape.borderRadius,
+			[n]: { "&:hover": { backgroundColor: (e.vars ?? e).palette.action.hover } },
+			"&.Mui-focusVisible": r(e),
+			"&.Mui-disabled": { color: (e.vars ?? e).palette.action.disabled },
+			[`&.${a.selected}`]: { ...i(e, "primary") }
 		})
 	}
 };
 //#endregion
-export { t as MuiMonthCalendar };
+export { o as MuiMonthCalendar };

package/dist/theme/components/multi-section-digital-clock-section.d.ts

@@ -0,0 +1,2 @@
+import { Components, Theme } from '@mui/material/styles';
+export declare const MuiMultiSectionDigitalClockSection: Components<Theme>['MuiMultiSectionDigitalClockSection'];

package/dist/theme/components/multi-section-digital-clock-section.js

@@ -1,25 +1,23 @@
+import { actionHoverMedia as e, getFocusVisibleStyle as t, getSelectedActionStyle as n } from "./action-styles.js";
 //#region lib/theme/components/multi-section-digital-clock-section.tsx
-var e = { styleOverrides: {
+var r = { styleOverrides: {
 	root: ({ theme: e }) => ({
-		width: e.spacing(5),
-		"&:not(:first-of-type)": { width: `calc(${e.spacing(5)} + 1px)` }
+		width: e.spacing(6),
+		"&:not(:first-of-type)": { width: `calc(${e.spacing(6)} + 1px)` }
 	}),
-	item: ({ theme: e }) => ({
-		width: e.spacing(4),
-		height: e.spacing(4),
-		minHeight: e.spacing(4),
+	item: ({ theme: r }) => ({
+		width: r.spacing(4),
+		height: r.spacing(4),
+		minHeight: r.spacing(4),
 		flexShrink: 0,
 		padding: 0,
-		margin: e.spacing(.5),
-		"&:first-of-type": { marginTop: e.spacing(.5) },
-		borderRadius: (e.vars ?? e).shape.borderRadius,
-		"&:hover, &.Mui-focusVisible": { backgroundColor: (e.vars ?? e).palette.action.hover },
-		"&.Mui-selected": {
-			backgroundColor: (e.vars ?? e).palette.primary[800],
-			color: (e.vars ?? e).palette.primary[50],
-			"&:focus-visible, &:hover": { backgroundColor: (e.vars ?? e).palette.primary[900] }
-		}
+		margin: r.spacing(.5, 1),
+		"&:first-of-type": { marginTop: r.spacing(.5) },
+		borderRadius: (r.vars ?? r).shape.borderRadius,
+		[e]: { "&:hover": { backgroundColor: (r.vars ?? r).palette.action.hover } },
+		"&.Mui-focusVisible": t(r),
+		"&.Mui-selected": { ...n(r, "primary") }
 	})
 } };
 //#endregion
-export { e as MuiMultiSectionDigitalClockSection };
+export { r as MuiMultiSectionDigitalClockSection };

package/dist/theme/components/outlined-input.d.ts

@@ -1,24 +1,44 @@
 import { Theme } from '@mui/material/styles';
 export declare const MuiOutlinedInput: {
     styleOverrides: {
-        input: ({ ownerState, theme }: import('@mui/material').OutlinedInputProps & Record<string, unknown> & {
+        input: ({ theme }: import('@mui/material').OutlinedInputProps & Record<string, unknown> & {
             ownerState: import('@mui/material').OutlinedInputProps & Record<string, unknown>;
         } & {
             theme: Theme;
         }) => {
+            padding: number;
+            variants: ({
+                props: (props: import('@mui/material').OutlinedInputProps & Record<string, unknown> & {
+                    ownerState: import('@mui/material').OutlinedInputProps & Record<string, unknown>;
+                } & {
+                    theme: Theme;
+                } & {
+                    ownerState: import('@mui/material').OutlinedInputProps & Record<string, unknown>;
+                }) => boolean;
+                style: {
+                    height: string;
+                    '&::-webkit-outer-spin-button, &::-webkit-inner-spin-button'?: undefined;
+                    MozAppearance?: undefined;
+                };
+            } | {
+                props: {
+                    type: string;
+                };
+                style: {
+                    '&::-webkit-outer-spin-button, &::-webkit-inner-spin-button': {
+                        WebkitAppearance: string;
+                        margin: number;
+                    };
+                    MozAppearance: "textfield";
+                    height?: undefined;
+                };
+            })[];
             '&:-webkit-autofill': {
                 boxShadow: string;
             };
             '&:-moz-autofill': {
                 boxShadow: string;
             };
-            '&::-webkit-outer-spin-button, &::-webkit-inner-spin-button'?: {
-                WebkitAppearance: string;
-                margin: number;
-            } | undefined;
-            MozAppearance?: "textfield" | undefined;
-            height?: string | undefined;
-            padding: number;
         };
         root: ({ theme }: import('@mui/material').OutlinedInputProps & Record<string, unknown> & {
             ownerState: import('@mui/material').OutlinedInputProps & Record<string, unknown>;
@@ -31,30 +51,44 @@ export declare const MuiOutlinedInput: {
                 height?: undefined;
                 color?: undefined;
                 outline?: undefined;
+                '&:hover'?: undefined;
             } | {
                 minHeight: string;
                 borderColor?: undefined;
                 height?: undefined;
                 color?: undefined;
                 outline?: undefined;
+                '&:hover'?: undefined;
             } | {
                 height: string;
                 borderColor?: undefined;
                 minHeight?: undefined;
                 color?: undefined;
                 outline?: undefined;
+                '&:hover'?: undefined;
             } | {
                 color: string;
                 borderColor?: undefined;
                 minHeight?: undefined;
                 height?: undefined;
                 outline?: undefined;
+                '&:hover'?: undefined;
             } | {
                 outline: string;
                 borderColor: string;
                 minHeight?: undefined;
                 height?: undefined;
                 color?: undefined;
+                '&:hover'?: undefined;
+            } | {
+                borderColor: string;
+                '&:hover': {
+                    borderColor: string;
+                };
+                minHeight?: undefined;
+                height?: undefined;
+                color?: undefined;
+                outline?: undefined;
             };
             padding: string;
             color: string;

package/dist/theme/components/outlined-input.js

@@ -1,39 +1,50 @@
-import { i as e } from "../../createTheme-Bnw5w28O.js";
-import { c as t, s as n } from "../../theme-primitives-CiQYd9Cc.js";
-import { n as r } from "../../outlinedInputClasses-DPwt_pSZ.js";
-import { n as i } from "../../inputAdornmentClasses-ZoGTcUz5.js";
+import { n as e } from "../../outlinedInputClasses-DECY98u0.js";
+import { n as t } from "../../inputAdornmentClasses-D5yYK5bM.js";
 //#region lib/theme/components/outlined-input.tsx
-var a = { styleOverrides: {
-	input: ({ ownerState: e, theme: t }) => ({
+var n = { styleOverrides: {
+	input: ({ theme: e }) => ({
 		padding: 0,
-		...!e.multiline && { height: `${22 / 16}em` },
-		...e.type === "number" && {
-			"&::-webkit-outer-spin-button, &::-webkit-inner-spin-button": {
-				WebkitAppearance: "none",
-				margin: 0
-			},
-			MozAppearance: "textfield"
-		},
-		"&:-webkit-autofill": { boxShadow: `${(t.vars ?? t).palette.background.default} 0px 0px 0px 100px inset !important` },
-		"&:-moz-autofill": { boxShadow: `${(t.vars ?? t).palette.background.default} 0px 0px 0px 100px inset !important` }
+		variants: [{
+			props: (e) => !e.multiline,
+			style: { height: `${22 / 16}em` }
+		}, {
+			props: { type: "number" },
+			style: {
+				"&::-webkit-outer-spin-button, &::-webkit-inner-spin-button": {
+					WebkitAppearance: "none",
+					margin: 0
+				},
+				MozAppearance: "textfield"
+			}
+		}],
+		"&:-webkit-autofill": { boxShadow: `${(e.vars ?? e).palette.background.default} 0px 0px 0px 100px inset !important` },
+		"&:-moz-autofill": { boxShadow: `${(e.vars ?? e).palette.background.default} 0px 0px 0px 100px inset !important` }
 	}),
-	root: ({ theme: a }) => ({
-		padding: a.spacing(1, 1.5),
-		color: (a.vars ?? a).palette.text.primary,
-		borderRadius: (a.vars ?? a).shape.borderRadius,
-		border: `1px solid ${(a.vars ?? a).palette.divider}`,
-		backgroundColor: (a.vars ?? a).palette.background.default,
+	root: ({ theme: n }) => ({
+		padding: n.spacing(1, 1.5),
+		color: (n.vars ?? n).palette.text.primary,
+		borderRadius: (n.vars ?? n).shape.borderRadius,
+		border: `1px solid ${(n.vars ?? n).palette.divider}`,
+		backgroundColor: (n.vars ?? n).palette.background.default,
 		transition: "border 120ms ease-in",
-		"&:hover": { borderColor: t[500] },
-		"&:not(.MuiInputBase-sizeSmall)": { minHeight: a.spacing(5) },
-		"&.MuiInputBase-sizeSmall": { height: a.spacing(4.5) },
-		[`&:has(input:placeholder-shown) .${i.root}`]: { color: (a.vars ?? a).palette.text.secondary },
-		[`&.${r.focused}`]: {
-			outline: `3px solid ${e(n[500], .5)}`,
-			borderColor: n[400]
+		"&:hover": { borderColor: (n.vars ?? n).palette.grey[500] },
+		"&:not(.MuiInputBase-sizeSmall)": { minHeight: n.spacing(5) },
+		"&.MuiInputBase-sizeSmall": { height: n.spacing(4.5) },
+		[`&:has(input:placeholder-shown) .${t.root}`]: { color: (n.vars ?? n).palette.text.secondary },
+		[`&.${e.focused}`]: {
+			outline: `3px solid rgba(${(n.vars ?? n).palette.primary.mainChannel} / 0.5)`,
+			borderColor: (n.vars ?? n).palette.primary[400]
+		},
+		[`&.${e.error}:not(.${e.disabled})`]: {
+			borderColor: (n.vars ?? n).palette.error.main,
+			"&:hover": { borderColor: (n.vars ?? n).palette.error.main }
+		},
+		[`&.${e.error}.${e.focused}`]: {
+			outline: `3px solid rgba(${(n.vars ?? n).palette.error.mainChannel} / 0.5)`,
+			borderColor: (n.vars ?? n).palette.error.main
 		}
 	}),
 	notchedOutline: { border: "none" }
 } };
 //#endregion
-export { a as MuiOutlinedInput };
+export { n as MuiOutlinedInput };