@solostylist/ui-kit 1.0.230 → 2.0.0

package/dist/theme-demo-components-section-gtIYRngY.js

@@ -0,0 +1,267 @@
+import { t as e } from "./createSvgIcon-B0SZlJF1.js";
+import { t } from "./Add-COc9VdNg.js";
+import { t as n } from "./Favorite-B_GsElm0.js";
+import { t as r } from "./s-text-field-BM4qk0mf.js";
+import { SButton as i } from "./s-button/s-button.js";
+import * as a from "react";
+import { jsx as o, jsxs as s } from "react/jsx-runtime";
+import { Box as c, Card as l, CardContent as u, Stack as d, Typography as f } from "@mui/material";
+//#region ../../node_modules/@mui/icons-material/Share.mjs
+var p = e(/* @__PURE__ */ o("path", { d: "M18 16.08c-.76 0-1.44.3-1.96.77L8.91 12.7c.05-.23.09-.46.09-.7s-.04-.47-.09-.7l7.05-4.11c.54.5 1.25.81 2.04.81 1.66 0 3-1.34 3-3s-1.34-3-3-3-3 1.34-3 3c0 .24.04.47.09.7L8.04 9.81C7.5 9.31 6.79 9 6 9c-1.66 0-3 1.34-3 3s1.34 3 3 3c.79 0 1.5-.31 2.04-.81l7.12 4.16c-.05.21-.08.43-.08.65 0 1.61 1.31 2.92 2.92 2.92s2.92-1.31 2.92-2.92-1.31-2.92-2.92-2.92" }), "Share"), m = e(/* @__PURE__ */ o("path", { d: "M12 17.27 18.18 21l-1.64-7.03L22 9.24l-7.19-.61L12 2 9.19 8.63 2 9.24l5.46 4.73L5.82 21z" }), "Star"), h = () => {
+	let [e, h] = a.useState("");
+	return /* @__PURE__ */ o(l, { children: /* @__PURE__ */ o(u, { children: /* @__PURE__ */ o(c, { children: /* @__PURE__ */ s(d, {
+		spacing: 3,
+		children: [
+			/* @__PURE__ */ s(c, { children: [/* @__PURE__ */ o(f, {
+				variant: "h6",
+				sx: { mb: 2 },
+				children: "Button Variants"
+			}), /* @__PURE__ */ s(d, {
+				direction: "row",
+				sx: {
+					flexWrap: "wrap",
+					gap: 2
+				},
+				children: [
+					/* @__PURE__ */ o(i, {
+						variant: "contained",
+						color: "primary",
+						children: "Contained"
+					}),
+					/* @__PURE__ */ o(i, {
+						variant: "outlined",
+						color: "primary",
+						children: "Outlined"
+					}),
+					/* @__PURE__ */ o(i, {
+						variant: "text",
+						color: "primary",
+						children: "Text"
+					})
+				]
+			})] }),
+			/* @__PURE__ */ s(c, { children: [/* @__PURE__ */ o(f, {
+				variant: "h6",
+				sx: { mb: 2 },
+				children: "Color Variants (Contained)"
+			}), /* @__PURE__ */ s(d, {
+				direction: "row",
+				sx: {
+					flexWrap: "wrap",
+					gap: 2
+				},
+				children: [
+					/* @__PURE__ */ o(i, {
+						variant: "contained",
+						color: "primary",
+						children: "Primary"
+					}),
+					/* @__PURE__ */ o(i, {
+						variant: "contained",
+						color: "secondary",
+						children: "Secondary"
+					}),
+					/* @__PURE__ */ o(i, {
+						variant: "contained",
+						color: "success",
+						children: "Success"
+					}),
+					/* @__PURE__ */ o(i, {
+						variant: "contained",
+						color: "warning",
+						children: "Warning"
+					}),
+					/* @__PURE__ */ o(i, {
+						variant: "contained",
+						color: "error",
+						children: "Error"
+					}),
+					/* @__PURE__ */ o(i, {
+						variant: "contained",
+						color: "info",
+						children: "Info"
+					})
+				]
+			})] }),
+			/* @__PURE__ */ s(c, { children: [/* @__PURE__ */ o(f, {
+				variant: "h6",
+				sx: { mb: 2 },
+				children: "Color Variants (Outlined)"
+			}), /* @__PURE__ */ s(d, {
+				direction: "row",
+				sx: {
+					flexWrap: "wrap",
+					gap: 2
+				},
+				children: [
+					/* @__PURE__ */ o(i, {
+						variant: "outlined",
+						color: "primary",
+						children: "Primary"
+					}),
+					/* @__PURE__ */ o(i, {
+						variant: "outlined",
+						color: "secondary",
+						children: "Secondary"
+					}),
+					/* @__PURE__ */ o(i, {
+						variant: "outlined",
+						color: "success",
+						children: "Success"
+					}),
+					/* @__PURE__ */ o(i, {
+						variant: "outlined",
+						color: "warning",
+						children: "Warning"
+					}),
+					/* @__PURE__ */ o(i, {
+						variant: "outlined",
+						color: "error",
+						children: "Error"
+					}),
+					/* @__PURE__ */ o(i, {
+						variant: "outlined",
+						color: "info",
+						children: "Info"
+					})
+				]
+			})] }),
+			/* @__PURE__ */ s(c, { children: [/* @__PURE__ */ o(f, {
+				variant: "h6",
+				sx: { mb: 2 },
+				children: "Button Sizes"
+			}), /* @__PURE__ */ s(d, {
+				direction: "row",
+				sx: {
+					alignItems: "center",
+					flexWrap: "wrap",
+					gap: 2
+				},
+				children: [
+					/* @__PURE__ */ o(i, {
+						variant: "contained",
+						color: "primary",
+						size: "small",
+						children: "Small"
+					}),
+					/* @__PURE__ */ o(i, {
+						variant: "contained",
+						color: "primary",
+						size: "medium",
+						children: "Medium"
+					}),
+					/* @__PURE__ */ o(i, {
+						variant: "contained",
+						color: "primary",
+						size: "large",
+						children: "Large"
+					})
+				]
+			})] }),
+			/* @__PURE__ */ s(c, { children: [/* @__PURE__ */ o(f, {
+				variant: "h6",
+				sx: { mb: 2 },
+				children: "Button States"
+			}), /* @__PURE__ */ s(d, {
+				direction: "row",
+				sx: {
+					flexWrap: "wrap",
+					gap: 2
+				},
+				children: [
+					/* @__PURE__ */ o(i, {
+						variant: "contained",
+						color: "primary",
+						children: "Default"
+					}),
+					/* @__PURE__ */ o(i, {
+						variant: "contained",
+						color: "primary",
+						disabled: !0,
+						children: "Disabled"
+					}),
+					/* @__PURE__ */ o(i, {
+						variant: "outlined",
+						color: "primary",
+						disabled: !0,
+						children: "Disabled Outlined"
+					}),
+					/* @__PURE__ */ o(i, {
+						variant: "text",
+						color: "primary",
+						disabled: !0,
+						children: "Disabled Text"
+					})
+				]
+			})] }),
+			/* @__PURE__ */ s(c, { children: [/* @__PURE__ */ o(f, {
+				variant: "h6",
+				sx: { mb: 2 },
+				children: "Buttons with Icons"
+			}), /* @__PURE__ */ s(d, {
+				direction: "row",
+				sx: {
+					flexWrap: "wrap",
+					gap: 2
+				},
+				children: [
+					/* @__PURE__ */ o(i, {
+						variant: "contained",
+						color: "primary",
+						startIcon: /* @__PURE__ */ o(t, {}),
+						children: "Start Icon"
+					}),
+					/* @__PURE__ */ o(i, {
+						variant: "contained",
+						color: "secondary",
+						endIcon: /* @__PURE__ */ o(p, {}),
+						children: "End Icon"
+					}),
+					/* @__PURE__ */ o(i, {
+						variant: "outlined",
+						color: "success",
+						startIcon: /* @__PURE__ */ o(m, {}),
+						children: "Outlined + Icon"
+					}),
+					/* @__PURE__ */ o(i, {
+						variant: "text",
+						color: "error",
+						endIcon: /* @__PURE__ */ o(n, {}),
+						children: "Text + Icon"
+					})
+				]
+			})] }),
+			/* @__PURE__ */ s(c, { children: [/* @__PURE__ */ o(f, {
+				variant: "h6",
+				sx: { mb: 2 },
+				children: "Form Components"
+			}), /* @__PURE__ */ s(d, {
+				sx: { gap: 2 },
+				children: [
+					/* @__PURE__ */ o(r, {
+						label: "Enhanced Text Field",
+						value: e,
+						onChange: (e) => h(e.target.value),
+						placeholder: "Enter text here...",
+						helperText: "This is an enhanced STextField component"
+					}),
+					/* @__PURE__ */ o(r, {
+						label: "Password Field",
+						type: "password",
+						placeholder: "Enter password...",
+						helperText: "Password input with custom styling"
+					}),
+					/* @__PURE__ */ o(r, {
+						label: "Multiline Text",
+						multiline: !0,
+						rows: 3,
+						placeholder: "Enter multiple lines...",
+						helperText: "Multiline text input"
+					})
+				]
+			})] })
+		]
+	}) }) }) });
+};
+//#endregion
+export { h as t };

package/dist/theme-primitives-Dt_DT9b5.js

@@ -0,0 +1,255 @@
+import { o as e, t } from "./colorManipulator-DmUjcif3.js";
+import { t as n } from "./createTheme-xB2Em0Na.js";
+import { a as r, c as i, d as a, f as o, i as s, l as c, m as l, n as u, o as d, p as f, r as p, s as m, t as h, u as g } from "./colors-DKqWMRgW.js";
+import { a as _, i as v, n as y, o as b, r as x, s as S } from "./gradients-90SYkAC0.js";
+//#region ../core/dist/interaction.js
+var C = .9, w = { gradient: {
+	themeKey: "palette.gradient",
+	cssProperty: "backgroundImage"
+} }, T = n(), E = { palette: {
+	gradient: y,
+	blackAlpha: {
+		zero: b[0],
+		light: b[10],
+		medium: b[50],
+		dark: b[80],
+		full: b[100]
+	},
+	whiteAlpha: {
+		zero: S[0],
+		light: S[10],
+		medium: S[50],
+		dark: S[80],
+		full: S[100]
+	},
+	ui: { pulse: x },
+	primary: {
+		...u,
+		contrastText: b[100],
+		light: u[400],
+		main: u[500],
+		dark: u[500],
+		white: "#ffffff",
+		black: "#000000"
+	},
+	secondary: {
+		...f,
+		contrastText: b[100],
+		light: f[300],
+		main: e(f[400], .05),
+		dark: f[400],
+		white: "#ffffff",
+		black: "#000000"
+	},
+	info: {
+		...h,
+		contrastText: b[100],
+		light: h[300],
+		main: h[400],
+		dark: h[400],
+		white: "#ffffff",
+		black: "#000000"
+	},
+	warning: {
+		...o,
+		contrastText: b[100],
+		light: o[400],
+		main: o[500],
+		dark: o[500],
+		white: "#ffffff",
+		black: "#000000"
+	},
+	error: {
+		...l,
+		contrastText: b[100],
+		light: l[300],
+		main: e(l[400], .22),
+		dark: e(l[400], .15),
+		white: "#ffffff",
+		black: "#000000"
+	},
+	success: {
+		...s,
+		contrastText: b[100],
+		light: s[300],
+		main: s[400],
+		dark: s[400],
+		white: "#ffffff",
+		black: "#000000"
+	},
+	grey: p,
+	divider: t(p[700], .9),
+	background: {
+		default: p[900],
+		paper: p[800]
+	},
+	text: {
+		primary: p[50],
+		secondary: p[400],
+		disabled: p[500]
+	},
+	action: {
+		active: p[50],
+		hover: t(p[600], .2),
+		selected: t(p[600], .3)
+	},
+	baseShadow: "hsla(220, 30%, 5%, 0.7) 0px 4px 16px 0px, hsla(220, 25%, 10%, 0.8) 0px 8px 16px -5px"
+} }, D = {
+	light: { palette: {
+		gradient: v,
+		blackAlpha: {
+			zero: b[0],
+			light: b[10],
+			medium: b[50],
+			dark: b[80],
+			full: b[100]
+		},
+		whiteAlpha: {
+			zero: S[0],
+			light: S[10],
+			medium: S[50],
+			dark: S[80],
+			full: S[100]
+		},
+		ui: { pulse: _ },
+		primary: {
+			...d,
+			contrastText: d[50],
+			light: d[200],
+			main: d[500],
+			dark: d[700],
+			white: "#ffffff",
+			black: "#000000"
+		},
+		secondary: {
+			...g,
+			contrastText: g[50],
+			light: g[200],
+			main: g[500],
+			dark: g[700],
+			white: "#ffffff",
+			black: "#000000"
+		},
+		info: {
+			...r,
+			contrastText: r[50],
+			light: r[200],
+			main: r[700],
+			dark: r[800],
+			white: "#ffffff",
+			black: "#000000"
+		},
+		warning: {
+			...c,
+			contrastText: c[50],
+			light: c[200],
+			main: c[900],
+			dark: c[900],
+			white: "#ffffff",
+			black: "#000000"
+		},
+		error: {
+			...a,
+			contrastText: a[50],
+			light: a[200],
+			main: a[600],
+			dark: a[700],
+			white: "#ffffff",
+			black: "#000000"
+		},
+		success: {
+			...i,
+			contrastText: i[50],
+			light: i[200],
+			main: i[800],
+			dark: i[900],
+			white: "#ffffff",
+			black: "#000000"
+		},
+		grey: m,
+		divider: t(m[300], .9),
+		background: {
+			default: m[50],
+			paper: m[100]
+		},
+		text: {
+			primary: m[900],
+			secondary: m[600],
+			disabled: m[400]
+		},
+		action: {
+			active: m[900],
+			hover: t(m[300], .2),
+			selected: t(m[300], .3)
+		},
+		baseShadow: "rgba(15, 23, 42, 0.08) 0px 2px 8px 0px, rgba(15, 23, 42, 0.04) 0px 1px 2px -1px"
+	} },
+	dark: E
+}, O = {
+	fontFamily: "Outfit, sans-serif",
+	h1: {
+		fontSize: T.typography.pxToRem(36),
+		fontWeight: 600,
+		lineHeight: 1.2,
+		letterSpacing: -.5
+	},
+	h2: {
+		fontSize: T.typography.pxToRem(30),
+		fontWeight: 600,
+		lineHeight: 1.2
+	},
+	h3: {
+		fontSize: T.typography.pxToRem(24),
+		fontWeight: 600,
+		lineHeight: 1.2
+	},
+	h4: {
+		fontSize: T.typography.pxToRem(20),
+		fontWeight: 600,
+		lineHeight: 1.2
+	},
+	h5: {
+		fontSize: T.typography.pxToRem(18),
+		fontWeight: 600,
+		lineHeight: 1.2
+	},
+	h6: {
+		fontSize: T.typography.pxToRem(16),
+		fontWeight: 600,
+		lineHeight: 1.2
+	},
+	subtitle1: {
+		fontSize: T.typography.pxToRem(16),
+		fontWeight: 500
+	},
+	subtitle2: {
+		fontSize: T.typography.pxToRem(14),
+		fontWeight: 500
+	},
+	body1: {
+		fontSize: T.typography.pxToRem(16),
+		fontWeight: 400
+	},
+	body2: {
+		fontSize: T.typography.pxToRem(14),
+		fontWeight: 400
+	},
+	caption: {
+		fontSize: T.typography.pxToRem(12),
+		fontWeight: 400,
+		color: "var(--s-palette-text-secondary)"
+	}
+}, k = { borderRadius: 8 }, A = {
+	none: 0,
+	sm: k.borderRadius * .5,
+	md: k.borderRadius,
+	lg: k.borderRadius * 1.5,
+	xl: k.borderRadius * 2,
+	full: 9999
+}, j = { mediaHoverOpacity: C }, M = [
+	"none",
+	"var(--s-palette-baseShadow)",
+	...T.shadows.slice(2)
+];
+//#endregion
+export { k as a, M as i, j as n, w as o, A as r, O as s, D as t };

package/dist/toggle-button-Cxi5CfXC.js

@@ -0,0 +1,104 @@
+import { t as e } from "./generateUtilityClasses-DvX505Gy.js";
+import { t } from "./buttonBaseClasses-BvBqFLb_.js";
+import { actionHoverMedia as n, getFocusVisibleStyle as r, getSelectedActionStyle as i, isSemanticActionColor as a, reducedPressMotionStyle as o, semanticActionColors as s } from "./theme/components/action-styles.js";
+//#region ../../node_modules/@mui/material/ToggleButton/toggleButtonClasses.mjs
+var c = e("MuiToggleButton", [
+	"root",
+	"disabled",
+	"selected",
+	"standard",
+	"primary",
+	"secondary",
+	"sizeSmall",
+	"sizeMedium",
+	"sizeLarge",
+	"fullWidth"
+]), l = (e) => {
+	let i = (e.vars ?? e).palette;
+	return {
+		backgroundColor: i.action.selected,
+		color: i.text.primary,
+		[`&.${t.focusVisible}`]: {
+			...r(e),
+			backgroundColor: i.action.selected
+		},
+		[n]: { "&:hover": {
+			backgroundColor: i.action.selected,
+			color: i.text.primary
+		} },
+		[`&.${c.disabled}`]: {
+			backgroundColor: i.action.disabledBackground,
+			borderColor: "transparent",
+			color: i.action.disabled
+		}
+	};
+}, u = {
+	defaultProps: { disableFocusRipple: !0 },
+	styleOverrides: { root: ({ ownerState: e, theme: u }) => {
+		let d = (u.vars ?? u).palette, f = e.color ?? "standard", p = a(f) ? d[f] : d.primary;
+		return {
+			borderRadius: (u.vars ?? u).shape.borderRadius,
+			boxSizing: "border-box",
+			gap: u.spacing(1),
+			fontWeight: 500,
+			paddingBlock: 0,
+			textTransform: "none",
+			transition: u.transitions.create([
+				"background-color",
+				"border-color",
+				"color"
+			], { duration: u.transitions.duration.shorter }),
+			[`&.${t.focusVisible}`]: r(u, p),
+			[n]: { [`&:hover:not(.${c.selected})`]: {
+				backgroundColor: d.action.hover,
+				color: d.text.primary
+			} },
+			[`&:active:not(.${c.disabled}):not(.${c.selected})`]: { backgroundColor: d.action.selected },
+			[`&.${c.disabled}:not(.${c.selected})`]: {
+				backgroundColor: "transparent",
+				borderColor: d.action.disabledBackground,
+				color: d.action.disabled
+			},
+			...o,
+			variants: [
+				{
+					props: { size: "small" },
+					style: {
+						height: u.spacing(4.5),
+						minWidth: u.spacing(4.5),
+						paddingInline: u.spacing(1.5)
+					}
+				},
+				{
+					props: { size: "medium" },
+					style: {
+						height: u.spacing(5),
+						minWidth: u.spacing(5),
+						paddingInline: u.spacing(2)
+					}
+				},
+				{
+					props: { size: "large" },
+					style: {
+						height: u.spacing(5.5),
+						minWidth: u.spacing(5.5),
+						paddingInline: u.spacing(2.5)
+					}
+				},
+				{
+					props: { color: "standard" },
+					style: { [`&.${c.selected}`]: l(u) }
+				},
+				...s.map((e) => ({
+					props: { color: e },
+					style: { [`&.${c.selected}`]: {
+						...i(u, e),
+						borderColor: "transparent"
+					} }
+				}))
+			]
+		};
+	} }
+};
+//#endregion
+export { u as t };

package/dist/{tool-bar-action-buttons-CSXNDen6.js → tool-bar-action-buttons-Dt-pV3GA.js}

@@ -1,6 +1,6 @@
-import { t as e } from "./createSvgIcon-HW-tbFcL.js";
-import { t } from "./Download-SNal6U7j.js";
-import { t as n } from "./InfoOutlined-BCzG-5py.js";
+import { t as e } from "./createSvgIcon-B0SZlJF1.js";
+import { t } from "./Download-DtvoRwpl.js";
+import { t as n } from "./InfoOutlined-VC7X46pc.js";
 import r from "react";
 import { jsx as i, jsxs as a } from "react/jsx-runtime";
 import { Box as o, IconButton as s, Tooltip as c } from "@mui/material";
@@ -17,6 +17,7 @@ var l = e(/* @__PURE__ */ i("path", { d: "m19 9 1.25-2.75L23 5l-2.75-1.25L19 1l-
 		r && /* @__PURE__ */ i(c, {
 			title: d,
 			children: /* @__PURE__ */ i(s, {
+				"aria-label": d,
 				onClick: _,
 				children: /* @__PURE__ */ i(n, {})
 			})
@@ -24,6 +25,7 @@ var l = e(/* @__PURE__ */ i("path", { d: "m19 9 1.25-2.75L23 5l-2.75-1.25L19 1l-
 		/* @__PURE__ */ i(c, {
 			title: f,
 			children: /* @__PURE__ */ i(s, {
+				"aria-label": f,
 				onClick: v,
 				children: /* @__PURE__ */ i(t, {})
 			})
@@ -31,6 +33,7 @@ var l = e(/* @__PURE__ */ i("path", { d: "m19 9 1.25-2.75L23 5l-2.75-1.25L19 1l-
 		/* @__PURE__ */ i(c, {
 			title: p,
 			children: /* @__PURE__ */ i(s, {
+				"aria-label": p,
 				onClick: y,
 				children: /* @__PURE__ */ i(u, {})
 			})
@@ -38,6 +41,7 @@ var l = e(/* @__PURE__ */ i("path", { d: "m19 9 1.25-2.75L23 5l-2.75-1.25L19 1l-
 		!h && /* @__PURE__ */ i(c, {
 			title: m,
 			children: /* @__PURE__ */ i("span", { children: /* @__PURE__ */ i(s, {
+				"aria-label": m,
 				onClick: b,
 				disabled: g,
 				size: "large",