@solostylist/ui-kit 1.0.230 → 2.0.1

package/dist/s-tool-bar/tool-bar-image-input.js

@@ -1,2 +1,148 @@
-import { t as e } from "../tool-bar-image-input-IdA6l71Y.js";
-export { e as ImageInput };
+import { actionHoverMedia as e, getFocusVisibleStyle as t } from "../theme/components/action-styles.js";
+import { getImageInputFiles as n } from "./utils.js";
+import { SIconButton as r } from "../s-icon-button/s-icon-button.js";
+import i, { useEffect as a } from "react";
+import { jsx as o, jsxs as s } from "react/jsx-runtime";
+import { Box as c, ButtonBase as l } from "@mui/material";
+import u from "@mui/icons-material/AddPhotoAlternate";
+import d from "@mui/icons-material/Close";
+//#region lib/s-tool-bar/tool-bar-image-input.tsx
+var f = i.memo(({ input: f, value: p, onChange: m, disabled: h }) => {
+	let g = i.useRef(null), [_, v] = i.useState([]), y = f.multiple ?? !1, b = f.maxImages ?? 5;
+	a(() => {
+		let e = [];
+		return v(((t) => {
+			if (!t) return [];
+			let n = Array.isArray(t) ? t : [t], r = [], i = /* @__PURE__ */ new Map();
+			return n.forEach((t) => {
+				if (t instanceof File) {
+					let n = URL.createObjectURL(t);
+					e.push(n);
+					let a = `file:${t.name}:${t.size}:${t.lastModified}`, o = i.get(a) ?? 0;
+					i.set(a, o + 1), r.push({
+						key: o > 0 ? `${a}:${o}` : a,
+						src: n
+					});
+				} else if (typeof t == "string") {
+					let e = `url:${t}`, n = i.get(e) ?? 0;
+					i.set(e, n + 1), r.push({
+						key: n > 0 ? `${e}:${n}` : e,
+						src: t
+					});
+				}
+			}), r;
+		})(p)), () => {
+			e.forEach((e) => URL.revokeObjectURL(e));
+		};
+	}, [p]);
+	let x = (e) => {
+		let t = e.target.files;
+		if (!(!t || t.length === 0)) {
+			if (y) {
+				let r = n(p), i = Array.from(t).slice(0, b - r.length);
+				m(e, [...r, ...i], i[0]);
+			} else m(e, t[0], t[0]);
+			e.target.value = "";
+		}
+	}, S = (e, t) => {
+		if (e.stopPropagation(), y && Array.isArray(p)) {
+			let n = p.filter((e, n) => n !== t);
+			m(e, n.length > 0 ? n : null);
+		} else m(e, null);
+	}, C = () => {
+		h || y && _.length >= b || g.current?.click();
+	}, w = y && _.length < b;
+	return /* @__PURE__ */ s(c, {
+		sx: {
+			display: "flex",
+			alignItems: "center",
+			gap: .75
+		},
+		children: [
+			/* @__PURE__ */ o("input", {
+				type: "file",
+				accept: "image/*",
+				...f.slotProps?.image ?? {},
+				ref: g,
+				multiple: y,
+				onChange: x,
+				disabled: h,
+				style: { display: "none" }
+			}),
+			_.map((t, n) => /* @__PURE__ */ s(c, {
+				sx: {
+					width: 50,
+					height: 50,
+					border: 1,
+					borderColor: h ? "action.disabled" : "divider",
+					borderRadius: 1,
+					display: "flex",
+					alignItems: "center",
+					justifyContent: "center",
+					cursor: h ? "not-allowed" : "default",
+					position: "relative",
+					overflow: "hidden",
+					"& .SToolBar-removeImageOverlay": { opacity: 1 },
+					"&:focus-within .SToolBar-removeImageOverlay": { opacity: 1 },
+					[e]: {
+						"& .SToolBar-removeImageOverlay": { opacity: 0 },
+						"&:hover .SToolBar-removeImageOverlay, &:focus-within .SToolBar-removeImageOverlay": { opacity: 1 }
+					}
+				},
+				children: [/* @__PURE__ */ o(c, {
+					component: "img",
+					src: t.src,
+					alt: `Preview ${n + 1}`,
+					sx: {
+						width: "100%",
+						height: "100%",
+						objectFit: "cover"
+					}
+				}), !h && /* @__PURE__ */ o(c, {
+					className: "SToolBar-removeImageOverlay",
+					sx: (e) => ({
+						position: "absolute",
+						inset: 0,
+						display: "flex",
+						alignItems: "center",
+						justifyContent: "center",
+						pointerEvents: "none",
+						transition: e.transitions.create("opacity", { duration: e.transitions.duration.shorter }),
+						"@media (prefers-reduced-motion: reduce)": { transition: "none" }
+					}),
+					children: /* @__PURE__ */ o(r, {
+						"aria-label": `Remove image ${n + 1}`,
+						onClick: (e) => S(e, n),
+						size: "small",
+						sx: { pointerEvents: "auto" },
+						variant: "overlay",
+						children: /* @__PURE__ */ o(d, { fontSize: "small" })
+					})
+				})]
+			}, t.key)),
+			(_.length === 0 || w) && /* @__PURE__ */ o(l, {
+				"aria-label": "Add image",
+				disabled: h,
+				onClick: C,
+				sx: (e) => ({
+					width: 50,
+					height: 50,
+					border: 1,
+					borderColor: h ? "action.disabled" : "divider",
+					borderRadius: 1,
+					color: h ? "action.disabled" : "action.active",
+					display: "flex",
+					alignItems: "center",
+					justifyContent: "center",
+					transition: e.transitions.create(["background-color", "border-color"], { duration: e.transitions.duration.shorter }),
+					"@media (hover: hover) and (pointer: fine)": { "&:hover": { bgcolor: "action.hover" } },
+					"&.Mui-focusVisible": t(e),
+					"@media (prefers-reduced-motion: reduce)": { transition: "none" }
+				}),
+				children: /* @__PURE__ */ o(u, { sx: { fontSize: 20 } })
+			})
+		]
+	});
+});
+//#endregion
+export { f as ImageInput };

package/dist/s-tool-bar/tool-bar-inputs.js

@@ -1,32 +1,41 @@
-import { t as e } from "../tool-bar-image-input-IdA6l71Y.js";
-import { t } from "../s-select-HMWY7frm.js";
-import n from "react";
-import { jsx as r, jsxs as i } from "react/jsx-runtime";
-import { Box as a, Slider as o, TextField as s, Typography as c, outlinedInputClasses as l } from "@mui/material";
+import { toSxArray as e } from "../utils/sx.js";
+import { SSelect as t } from "../s-select/s-select.js";
+import { ImageInput as n } from "./tool-bar-image-input.js";
+import r from "react";
+import { jsx as i, jsxs as a } from "react/jsx-runtime";
+import { Box as o, Slider as s, TextField as c, Typography as l, outlinedInputClasses as u } from "@mui/material";
+import { mergeSlotProps as d } from "@mui/material/utils";
 //#region lib/s-tool-bar/tool-bar-inputs.tsx
-var u = n.memo(({ input: e, value: t, onChange: n, onFocus: i, onBlur: a, disabled: o }) => /* @__PURE__ */ r(s, {
-	value: t,
-	onChange: (e) => n(e.target.value),
-	onFocus: i,
-	onBlur: a,
-	placeholder: e.placeholder ?? e.label,
-	disabled: o,
-	multiline: !0,
-	minRows: e.minRows ?? 2,
-	maxRows: e.maxRows ?? 5,
-	fullWidth: !0,
-	variant: "outlined",
-	slotProps: { input: { sx: {
-		backgroundColor: "transparent",
-		border: "none",
-		padding: 0,
-		[`&.${l.focused}`]: { outline: "none" },
-		"& fieldset": { border: "none" },
-		"&:hover fieldset": { border: "none" },
-		"&.Mui-focused fieldset": { border: "none" }
-	} } },
-	...e.componentProps?.textarea ?? {}
-})), d = n.memo((e) => /* @__PURE__ */ r(c, {
+var f = r.memo(({ input: e, value: t, onChange: n, onFocus: r, onBlur: a, disabled: o }) => {
+	let { slotProps: s, ...l } = e.slotProps?.textarea ?? {};
+	return /* @__PURE__ */ i(c, {
+		value: t ?? "",
+		onChange: (e) => n(e, e.target.value),
+		onFocus: r,
+		onBlur: a,
+		placeholder: e.placeholder ?? e.label,
+		disabled: o,
+		multiline: !0,
+		minRows: e.minRows ?? 2,
+		maxRows: e.maxRows ?? 5,
+		fullWidth: !0,
+		variant: "outlined",
+		...l,
+		slotProps: {
+			...s,
+			htmlInput: d(s?.htmlInput, { "aria-label": e.label }),
+			input: d(s?.input, { sx: {
+				backgroundColor: "transparent",
+				border: "none",
+				padding: 0,
+				[`&.${u.focused}`]: { outline: "none" },
+				"& fieldset": { border: "none" },
+				"&:hover fieldset": { border: "none" },
+				"&.Mui-focused fieldset": { border: "none" }
+			} })
+		}
+	});
+}), p = r.memo((e) => /* @__PURE__ */ i(l, {
 	variant: "subtitle2",
 	sx: {
 		whiteSpace: "nowrap",
@@ -35,105 +44,123 @@ var u = n.memo(({ input: e, value: t, onChange: n, onFocus: i, onBlur: a, disabl
 		width: "100% !important"
 	},
 	children: e.label
-})), f = n.memo(({ input: e, value: t, onChange: n, onFocus: o, onBlur: c, disabled: l }) => /* @__PURE__ */ i(a, {
-	sx: {
-		width: 80,
-		display: "flex",
-		flexDirection: "column"
-	},
-	children: [/* @__PURE__ */ r(d, { label: e.label }), /* @__PURE__ */ r(s, {
-		type: "number",
-		value: t ?? e.defaultValue ?? 0,
-		onChange: (e) => n(Number(e.target.value)),
-		onFocus: o,
-		onBlur: c,
-		disabled: l,
-		slotProps: { htmlInput: {
-			min: e.min,
-			max: e.max,
-			step: e.step
-		} },
-		...e.componentProps?.number ?? {}
-	})]
-})), p = n.memo(({ input: e, value: n, onChange: o, onFocus: s, onBlur: c, disabled: l }) => /* @__PURE__ */ i(a, {
-	sx: {
-		width: 180,
-		display: "flex",
-		flexDirection: "column"
-	},
-	children: [/* @__PURE__ */ r(d, { label: e.label }), /* @__PURE__ */ r(t, {
-		value: n ?? e.defaultValue ?? "",
-		onChange: (e) => o(e.target.value),
-		onFocus: s,
-		onBlur: c,
-		disabled: l,
-		placeholder: e.placeholder,
-		options: e.options ?? [],
-		optionLabel: e.optionLabel,
-		optionValue: e.optionValue,
-		searchable: e.searchable,
-		searchPlaceholder: e.searchPlaceholder,
-		...e.componentProps?.select ?? {}
-	})]
-})), m = n.memo(({ input: e, value: t, onChange: n, onFocus: s, onBlur: l, disabled: u }) => /* @__PURE__ */ i(a, {
-	sx: {
-		width: 160,
-		display: "flex",
-		flexDirection: "column"
-	},
-	children: [/* @__PURE__ */ r(d, { label: e.label }), /* @__PURE__ */ i(a, {
+})), m = r.memo(({ input: e, value: t, onChange: n, onFocus: r, onBlur: s, disabled: l }) => {
+	let { slotProps: u, ...f } = e.slotProps?.number ?? {};
+	return /* @__PURE__ */ a(o, {
+		sx: {
+			width: 80,
+			display: "flex",
+			flexDirection: "column"
+		},
+		children: [/* @__PURE__ */ i(p, { label: e.label }), /* @__PURE__ */ i(c, {
+			type: "number",
+			value: typeof t == "number" ? t : "",
+			onChange: (e) => n(e, Number(e.target.value)),
+			onFocus: r,
+			onBlur: s,
+			disabled: l,
+			...f,
+			slotProps: {
+				...u,
+				htmlInput: d(u?.htmlInput, {
+					"aria-label": e.label,
+					min: e.min,
+					max: e.max,
+					step: e.step
+				})
+			}
+		})]
+	});
+}), h = r.memo(({ input: e, value: n, onChange: r, onFocus: s, onBlur: c, disabled: l }) => {
+	let { inputProps: u, ...d } = e.slotProps?.select ?? {};
+	return /* @__PURE__ */ a(o, {
+		sx: {
+			width: 180,
+			display: "flex",
+			flexDirection: "column"
+		},
+		children: [/* @__PURE__ */ i(p, { label: e.label }), /* @__PURE__ */ i(t, {
+			value: n ?? "",
+			onChange: (e) => r(e, e.target.value),
+			onFocus: s,
+			onBlur: c,
+			disabled: l,
+			placeholder: e.placeholder,
+			options: e.options ?? [],
+			optionLabel: e.optionLabel,
+			optionValue: e.optionValue,
+			searchable: e.searchable,
+			searchPlaceholder: e.searchPlaceholder,
+			...d,
+			inputProps: {
+				"aria-label": e.label,
+				...u
+			}
+		})]
+	});
+}), g = r.memo(({ input: t, value: n, onChange: r, onFocus: c, onBlur: u, disabled: d }) => {
+	let { sx: f, ...m } = t.slotProps?.slider ?? {};
+	return /* @__PURE__ */ a(o, {
 		sx: {
+			width: 160,
 			display: "flex",
-			alignItems: "center",
-			height: 36
+			flexDirection: "column"
 		},
-		children: [/* @__PURE__ */ r(o, {
-			value: t ?? e.defaultValue ?? e.min ?? 0,
-			onChange: (e, t) => n(t),
-			onMouseDown: s,
-			onMouseUp: l,
-			disabled: u,
-			min: e.min ?? 0,
-			max: e.max ?? 100,
-			step: e.step ?? 1,
-			sx: { flex: 1 },
-			...e.componentProps?.slider ?? {}
-		}), /* @__PURE__ */ r(c, {
-			variant: "body2",
+		children: [/* @__PURE__ */ i(p, { label: t.label }), /* @__PURE__ */ a(o, {
 			sx: {
-				minWidth: 60,
-				textAlign: "center"
+				display: "flex",
+				alignItems: "center",
+				height: 36
 			},
-			children: t ?? e.defaultValue ?? e.min ?? 0
+			children: [/* @__PURE__ */ i(s, {
+				"aria-label": t.label,
+				value: typeof n == "number" ? n : t.min ?? 0,
+				onChange: (e, t) => r(e, t),
+				onMouseDown: c,
+				onMouseUp: u,
+				disabled: d,
+				min: t.min ?? 0,
+				max: t.max ?? 100,
+				step: t.step ?? 1,
+				...m,
+				sx: [{ flex: 1 }, ...e(f)]
+			}), /* @__PURE__ */ i(l, {
+				variant: "body2",
+				sx: {
+					minWidth: 60,
+					textAlign: "center"
+				},
+				children: typeof n == "number" ? n : t.min ?? 0
+			})]
 		})]
-	})]
-})), h = (t) => {
-	switch (t.input.type) {
-		case "textarea": return /* @__PURE__ */ r(u, { ...t });
-		case "number": return /* @__PURE__ */ r(f, { ...t });
-		case "slider": return /* @__PURE__ */ r(m, { ...t });
-		case "select": return /* @__PURE__ */ r(p, { ...t });
-		case "image": return /* @__PURE__ */ r(e, {
-			input: t.input,
-			value: t.value,
-			onChange: t.onChange,
-			disabled: t.disabled
+	});
+}), _ = (e) => {
+	switch (e.input.type) {
+		case "textarea": return /* @__PURE__ */ i(f, { ...e });
+		case "number": return /* @__PURE__ */ i(m, { ...e });
+		case "slider": return /* @__PURE__ */ i(g, { ...e });
+		case "select": return /* @__PURE__ */ i(h, { ...e });
+		case "image": return /* @__PURE__ */ i(n, {
+			input: e.input,
+			value: e.value,
+			onChange: e.onChange,
+			disabled: e.disabled
 		});
 		default: return null;
 	}
-}, g = n.memo(({ input: e, value: t, disabled: n, onChange: i, onFocus: o, onBlur: s }) => e.renderInput ? /* @__PURE__ */ r(a, { children: e.renderInput({
+}, v = r.memo(({ input: e, value: t, disabled: n, onChange: r, onFocus: a, onBlur: s }) => e.renderInput ? /* @__PURE__ */ i(o, { children: e.renderInput({
 	value: t,
-	onChange: i,
-	onFocus: o,
+	onChange: r,
+	onFocus: a,
 	onBlur: s,
 	disabled: n
-}) }) : /* @__PURE__ */ r(h, {
+}) }) : /* @__PURE__ */ i(_, {
 	input: e,
 	value: t,
-	onChange: i,
-	onFocus: o,
+	onChange: r,
+	onFocus: a,
 	onBlur: s,
 	disabled: n
 }));
 //#endregion
-export { g as ToolbarInputItem };
+export { v as ToolbarInputItem };

package/dist/s-tool-bar/types.d.ts

@@ -1,10 +1,13 @@
 import { default as React } from 'react';
-import { SelectProps, SliderProps, TextFieldProps } from '@mui/material';
-import { SxProps, Theme } from '@mui/material/styles';
+import { BoxProps, DialogContentProps, DialogProps, DialogTitleProps, SliderProps, TextFieldProps } from '@mui/material';
+import { SSelectProps } from '../s-select';
+import { OwnerStateSlotProps as MuiOwnerStateSlotProps } from '../utils/slots';
 /**
  * Possible value types for SToolBar inputs
  */
 export type SToolBarValue = string | number | File | (string | File)[] | null;
+/** Source event emitted by native, React, or MUI input controls. */
+export type SToolBarChangeEvent = Event | React.SyntheticEvent;
 /**
  * Base type constraint for select options
  */
@@ -63,13 +66,13 @@ export interface SToolBarInput {
      *
      * Only the props relevant to the current `type` are used.
      */
-    componentProps?: SToolBarComponentProps;
+    slotProps?: SToolBarInputSlotProps;
     /** Custom renderer for the input */
     renderInput?: (props: {
         value: SToolBarValue;
-        onChange: (value: SToolBarValue) => void;
-        onFocus: () => void;
-        onBlur: () => void;
+        onChange: (event: SToolBarChangeEvent, value: SToolBarValue, file?: File) => void;
+        onFocus: (event: SToolBarChangeEvent) => void;
+        onBlur: (event: SToolBarChangeEvent) => void;
         disabled?: boolean;
     }) => React.ReactNode;
 }
@@ -77,28 +80,15 @@ export interface SToolBarInput {
  * Per-type overrides forwarded to the underlying child components.
  * Omit props that are already managed by SToolBar to avoid conflicts.
  */
-export interface SToolBarComponentProps {
+export interface SToolBarInputSlotProps {
     /** Extra props for the MUI TextField used in `textarea` inputs */
     textarea?: Omit<TextFieldProps, 'value' | 'onChange' | 'onFocus' | 'onBlur' | 'disabled' | 'multiline' | 'minRows' | 'maxRows' | 'fullWidth' | 'placeholder'>;
     /** Extra props for the MUI TextField used in `number` inputs */
-    number?: Omit<TextFieldProps, 'value' | 'onChange' | 'onFocus' | 'onBlur' | 'disabled' | 'type' | 'slotProps'>;
+    number?: Omit<TextFieldProps, 'value' | 'onChange' | 'onFocus' | 'onBlur' | 'disabled' | 'type'>;
     /** Extra props for the MUI Slider used in `slider` inputs */
     slider?: Omit<SliderProps, 'value' | 'onChange' | 'onMouseDown' | 'onMouseUp' | 'disabled' | 'min' | 'max' | 'step'>;
     /** Extra props for SSelect used in `select` inputs */
-    select?: Omit<SelectProps, 'ref' | 'value' | 'onChange' | 'onFocus' | 'onBlur' | 'disabled' | 'error' | 'variant'> & {
-        /** Field label displayed above the select */
-        label?: string | React.ReactNode;
-        /** Error message to display below the field */
-        error?: string;
-        /** Whether the field is required */
-        required?: boolean;
-        /** Whether to use simple value rendering */
-        simple?: boolean;
-        /** HTML id attribute for the select element */
-        htmlFor?: string;
-        /** Custom render function for dropdown options */
-        renderOption?: (option: SToolBarOption) => React.ReactNode;
-    };
+    select?: Omit<SSelectProps<SToolBarOption>, 'disabled' | 'onBlur' | 'onChange' | 'onFocus' | 'optionLabel' | 'options' | 'optionValue' | 'placeholder' | 'ref' | 'searchable' | 'searchPlaceholder' | 'value'>;
     /** Extra props for the native `<input type="file">` element used in `image` inputs */
     image?: Omit<React.InputHTMLAttributes<HTMLInputElement>, 'ref' | 'type' | 'multiple' | 'onChange' | 'disabled' | 'style'>;
 }
@@ -111,26 +101,45 @@ export interface SToolBarInputControlProps {
     /** Current value of the input */
     value: SToolBarValue;
     /** Callback when the value changes */
-    onChange: (value: SToolBarValue) => void;
+    onChange: (event: SToolBarChangeEvent, value: SToolBarValue, file?: File) => void;
     /** Callback when the input gains focus */
-    onFocus: () => void;
+    onFocus: (event: SToolBarChangeEvent) => void;
     /** Callback when the input loses focus */
-    onBlur: () => void;
+    onBlur: (event: SToolBarChangeEvent) => void;
     /** Whether the input is disabled */
     disabled?: boolean;
 }
 /**
  * Props interface for SToolBar component
  */
-export interface SToolBarProps {
+export type SToolBarOwnerState = SToolBarProps & {
+    position: 'bottom' | 'top';
+    processing: boolean;
+    relative: boolean;
+    uploading: boolean;
+};
+type OwnerStateSlotProps<Props> = MuiOwnerStateSlotProps<Props, SToolBarOwnerState>;
+export interface SToolBarSlots {
+    dialog?: React.ElementType;
+    dialogContent?: React.ElementType;
+    dialogTitle?: React.ElementType;
+    toolbar?: React.ElementType;
+}
+export interface SToolBarSlotProps {
+    dialog?: OwnerStateSlotProps<Omit<DialogProps, 'children' | 'open'>>;
+    dialogContent?: OwnerStateSlotProps<DialogContentProps>;
+    dialogTitle?: OwnerStateSlotProps<DialogTitleProps>;
+    toolbar?: OwnerStateSlotProps<BoxProps>;
+}
+export interface SToolBarProps extends Omit<BoxProps, 'children' | 'component' | 'onReset'> {
     /** Configuration for input fields */
     inputs?: SToolBarInput[];
     /** Callback when process button is clicked */
-    onProcess?: () => void;
+    onProcess?: React.MouseEventHandler<HTMLButtonElement>;
     /** Callback when reset button is clicked */
-    onReset?: () => void;
+    onReset?: React.MouseEventHandler<HTMLButtonElement>;
     /** Callback when download button is clicked */
-    onDownload?: () => void;
+    onDownload?: React.MouseEventHandler<HTMLButtonElement>;
     /** Whether the toolbar is in processing state */
     processing?: boolean;
     /** Whether the toolbar is in uploading state */
@@ -138,9 +147,9 @@ export interface SToolBarProps {
     /** Input values controlled externally */
     inputValues?: Record<string, SToolBarValue>;
     /** Callback when input values change */
-    onInputChange?: (key: string, value: SToolBarValue, file?: File) => void;
+    onInputChange?: (event: SToolBarChangeEvent, key: string, value: SToolBarValue, file?: File) => void;
     /** Custom action buttons between inputs and standard actions */
-    customActionButtons?: React.ReactNode;
+    actions?: React.ReactNode;
     /** Hide the main process button */
     hideProcessButton?: boolean;
     /** Override to disable the process button */
@@ -163,8 +172,9 @@ export interface SToolBarProps {
     position?: 'bottom' | 'top';
     /** Use relative positioning within container instead of fixed viewport positioning */
     relative?: boolean;
-    /** Custom styles for the outer container (wrapper) */
-    containerSx?: SxProps<Theme>;
-    /** Custom styles for the inner toolbar box */
-    sx?: SxProps<Theme>;
+    /** Components used for the toolbar and info-dialog slots. */
+    slots?: SToolBarSlots;
+    /** Props or owner-state callbacks for component slots. */
+    slotProps?: SToolBarSlotProps;
 }
+export {};

package/dist/s-tool-bar/utils.d.ts

@@ -1,6 +1,7 @@
 import { SToolBarInput, SToolBarValue } from './types';
 export declare function isRequiredInputFilled(input: SToolBarInput, value: SToolBarValue): boolean;
 export declare function getImageInputFiles(value: SToolBarValue): Array<string | File>;
+export declare function getToolBarInputValue(input: SToolBarInput, inputValues: Record<string, SToolBarValue>): SToolBarValue;
 export declare function groupInputsByType(inputs: SToolBarInput[]): {
     imageInputs: SToolBarInput[];
     textareaInputs: SToolBarInput[];

package/dist/s-tool-bar/utils.js

@@ -1,22 +1,25 @@
 //#region lib/s-tool-bar/utils.ts
-function e(e, t) {
-	return e.required ? e.type === "textarea" ? typeof t == "string" && t.trim() !== "" : e.type === "number" || e.type === "slider" ? t != null : e.type === "select" ? t != null && t !== "" : !0 : !0;
+function e(e, n) {
+	return e.required ? e.type === "textarea" ? typeof n == "string" && n.trim() !== "" : e.type === "number" || e.type === "slider" ? n != null : e.type === "select" ? n != null && n !== "" : e.type === "image" ? t(n).length > 0 : !0 : !0;
 }
 function t(e) {
-	return Array.isArray(e) ? e : e instanceof File || typeof e == "string" ? [e] : [];
+	return Array.isArray(e) ? e.filter((e) => e instanceof File || typeof e == "string" && e.trim() !== "") : e instanceof File || typeof e == "string" && e.trim() !== "" ? [e] : [];
 }
-function n(e) {
+function n(e, t) {
+	return Object.prototype.hasOwnProperty.call(t, e.key) ? t[e.key] : e.defaultValue ?? null;
+}
+function r(e) {
 	return e.reduce((e, t) => (t.type === "image" ? e.imageInputs.push(t) : t.type === "textarea" ? e.textareaInputs.push(t) : e.paramInputs.push(t), e), {
 		imageInputs: [],
 		textareaInputs: [],
 		paramInputs: []
 	});
 }
-function r(e, t) {
+function i(e, t) {
 	return e.length > 0 || t.length > 0;
 }
-function i(e, t, n, r) {
+function a(e, t, n, r) {
 	return e || !t || n || r;
 }
 //#endregion
-export { t as getImageInputFiles, n as groupInputsByType, r as hasVisibleInputSection, i as isProcessActionDisabled, e as isRequiredInputFilled };
+export { t as getImageInputFiles, n as getToolBarInputValue, r as groupInputsByType, i as hasVisibleInputSection, a as isProcessActionDisabled, e as isRequiredInputFilled };

package/dist/s-tool-item/index.d.ts

@@ -1,2 +1,3 @@
 export { default, default as SToolItem } from './s-tool-item';
-export type { SToolItemProps } from './s-tool-item';
+export type { SToolItemOwnerState, SToolItemProps, SToolItemSlotProps, SToolItemSlots } from './s-tool-item';
+export type {} from '../theme/component-augmentation';