@solostylist/ui-kit 1.0.225 → 1.0.226

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

@@ -1,159 +1,5 @@
 import { default as React } from 'react';
-import { CheckboxProps, SelectProps, SliderProps, TextFieldProps } from '@mui/material';
-import { SxProps, Theme } from '@mui/material/styles';
-/**
- * Possible value types for SToolBar inputs
- */
-export type SToolBarValue = string | number | boolean | File | (string | File)[] | null;
-/**
- * Base type constraint for select options
- */
-export type SToolBarOption = string | number | Record<string, unknown>;
-/**
- * Supported input types for SToolBar
- */
-export type SToolBarInputType = 'textarea' | 'slider' | 'image' | 'number' | 'select' | 'checkbox';
-/**
- * Configuration for individual toolbar input fields
- */
-export interface SToolBarInput {
-    /** Unique identifier for the input */
-    key: string;
-    /** Display label for the input */
-    label: string;
-    /** Input type */
-    type: SToolBarInputType;
-    /** Whether the input is required */
-    required?: boolean;
-    /** Default value for the input */
-    defaultValue?: SToolBarValue;
-    /** Placeholder text (for textarea/number/select inputs) */
-    placeholder?: string;
-    /** Minimum value (for slider/number inputs) */
-    min?: number;
-    /** Maximum value (for slider/number inputs) */
-    max?: number;
-    /** Step value (for slider/number inputs) */
-    step?: number;
-    /** Minimum rows for textarea */
-    minRows?: number;
-    /** Maximum rows for textarea */
-    maxRows?: number;
-    /** Allow multiple images (for image inputs) */
-    multiple?: boolean;
-    /** Maximum number of images (for image inputs with multiple=true) */
-    maxImages?: number;
-    /** Select options (for select inputs) */
-    options?: SToolBarOption[];
-    /** Key to extract label from option objects (for select inputs) */
-    optionLabel?: string;
-    /** Key to extract value from option objects (for select inputs) */
-    optionValue?: string;
-    /** Enable search functionality in select dropdown */
-    searchable?: boolean;
-    /** Placeholder for search input in select dropdown */
-    searchPlaceholder?: string;
-    /**
-     * Extra props forwarded to the underlying child component.
-     * Each key targets the matching input type:
-     * - `textarea` / `number` → MUI `TextField`
-     * - `slider`              → MUI `Slider`
-     * - `select`              → `SSelect`
-     * - `checkbox`            → MUI `Checkbox`
-     * - `image`               → native `<input type="file">`
-     *
-     * Only the props relevant to the current `type` are used.
-     */
-    componentProps?: SToolBarComponentProps;
-    /** Custom renderer for the input */
-    renderInput?: (props: {
-        value: SToolBarValue;
-        onChange: (value: SToolBarValue) => void;
-        onFocus: () => void;
-        onBlur: () => void;
-        disabled?: boolean;
-    }) => React.ReactNode;
-}
-/**
- * Per-type overrides forwarded to the underlying child components.
- * Omit props that are already managed by SToolBar to avoid conflicts.
- */
-export interface SToolBarComponentProps {
-    /** 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'>;
-    /** 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;
-    };
-    /** Extra props for the MUI Checkbox used in `checkbox` inputs */
-    checkbox?: Omit<CheckboxProps, 'checked' | 'onChange' | 'onFocus' | 'onBlur' | 'disabled'>;
-    /** Extra props for the native `<input type="file">` element used in `image` inputs */
-    image?: Omit<React.InputHTMLAttributes<HTMLInputElement>, 'ref' | 'type' | 'multiple' | 'onChange' | 'disabled' | 'style'>;
-}
-/**
- * Props interface for SToolBar component
- */
-export interface SToolBarProps {
-    /** Configuration for input fields */
-    inputs?: SToolBarInput[];
-    /** Callback when process button is clicked */
-    onProcess?: () => void;
-    /** Callback when reset button is clicked */
-    onReset?: () => void;
-    /** Callback when download button is clicked */
-    onDownload?: () => void;
-    /** Whether the toolbar is in processing state */
-    processing?: boolean;
-    /** Whether the toolbar is in uploading state */
-    uploading?: boolean;
-    /** Input values controlled externally */
-    inputValues?: Record<string, SToolBarValue>;
-    /** Callback when input values change */
-    onInputChange?: (key: string, value: SToolBarValue, file?: File) => void;
-    /** Custom action buttons between inputs and standard actions */
-    customActionButtons?: React.ReactNode;
-    /** Hide the main process button */
-    hideProcessButton?: boolean;
-    /** Override to disable the process button */
-    processButtonDisabled?: boolean;
-    /** Function to check if an input should be disabled */
-    getInputDisabled?: (inputKey: string) => boolean;
-    /** Tooltip for process button */
-    processTooltip?: string;
-    /** Tooltip for download button */
-    downloadTooltip?: string;
-    /** Tooltip for reset button */
-    resetTooltip?: string;
-    /** Tooltip for info button */
-    infoTooltip?: string;
-    /** Info dialog title */
-    infoTitle?: string;
-    /** Info dialog content */
-    infoContent?: React.ReactNode;
-    /** Position of the toolbar */
-    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>;
-}
+import { SToolBarProps } from './types';
 export declare const SToolBar: {
     ({ inputs, onProcess, onReset, onDownload, processing, uploading, inputValues, onInputChange, customActionButtons, hideProcessButton, processButtonDisabled, getInputDisabled, processTooltip, downloadTooltip, resetTooltip, infoTooltip, infoTitle, infoContent, position, relative, containerSx, sx, }: SToolBarProps): React.JSX.Element;
     displayName: string;

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

@@ -1,2 +1,114 @@
-import { t as e } from "../s-tool-bar-DaZ2wT09.js";
-export { e as SToolBar, e as default };
+import { tint as e } from "../theme/utils.js";
+import { t } from "../tool-bar-action-buttons-B4QhqdK_.js";
+import { groupInputsByType as n, hasVisibleInputSection as r, isProcessActionDisabled as i, isRequiredInputFilled as a } from "./utils.js";
+import { ToolbarInputItem as o } from "./tool-bar-inputs.js";
+import { useCallback as s, useMemo as c, useState as l } from "react";
+import { jsx as u, jsxs as d } from "react/jsx-runtime";
+import { createPortal as f } from "react-dom";
+import { Box as p, Dialog as m, DialogContent as h, DialogTitle as g } from "@mui/material";
+//#region lib/s-tool-bar/s-tool-bar.tsx
+var _ = ({ inputs: _ = [], onProcess: v, onReset: y, onDownload: b, processing: x = !1, uploading: S = !1, inputValues: C = {}, onInputChange: w, customActionButtons: T, hideProcessButton: E = !1, processButtonDisabled: D = !1, getInputDisabled: O, processTooltip: k = "Process", downloadTooltip: A = "Download", resetTooltip: j = "Reset", infoTooltip: M = "Information", infoTitle: N = "Tool Information", infoContent: P, position: F = "bottom", relative: I = !1, containerSx: L, sx: R }) => {
+	let [z, B] = l(!1), V = c(() => _.length === 0 ? !0 : _.every((e) => a(e, C[e.key])), [_, C]), { imageInputs: H, textareaInputs: U, paramInputs: W } = c(() => n(_), [_]), G = r(H, W), K = i(D, V, S, x), q = s(() => {}, []), J = s(() => {}, []), Y = s((e, t, n) => {
+		w?.(e, t, n);
+	}, [w]), X = s(() => B(!0), []), Z = s(() => B(!1), []), Q = s((e) => {
+		let t = C[e.key];
+		return /* @__PURE__ */ u(o, {
+			input: e,
+			value: t,
+			onChange: (t) => Y(e.key, t),
+			onFocus: q,
+			onBlur: J,
+			disabled: O?.(e.key) ?? !1
+		}, e.key);
+	}, [
+		C,
+		O,
+		Y,
+		q,
+		J
+	]), $ = /* @__PURE__ */ d(p, {
+		sx: {
+			position: I ? "relative" : "fixed",
+			[F]: I ? "auto" : 20,
+			left: I ? "auto" : "50%",
+			transform: I ? "none" : "translateX(-50%)",
+			zIndex: I ? "auto" : 1300,
+			display: I ? "flex" : "block",
+			justifyContent: I ? "center" : "initial",
+			mt: I && F === "top" ? 2 : 0,
+			mb: I && F === "bottom" ? 2 : 0,
+			...L
+		},
+		children: [/* @__PURE__ */ d(p, {
+			sx: [(t) => ({
+				display: "flex",
+				flexDirection: "column",
+				gap: 2,
+				p: 2,
+				borderRadius: 1,
+				border: 1,
+				borderColor: "divider",
+				bgcolor: "background.default",
+				transition: "border 120ms ease-in",
+				"&:hover": { borderColor: (t.vars ?? t).palette.grey[500] },
+				"&:focus-within": {
+					outline: `3px solid ${e((t.vars ?? t).palette.primary[500], 50)}`,
+					borderColor: (t.vars ?? t).palette.primary[400]
+				}
+			}), ...Array.isArray(R) ? R : [R]],
+			children: [U.length > 0 && /* @__PURE__ */ u(p, {
+				sx: {
+					display: "flex",
+					flexDirection: "column",
+					gap: 2
+				},
+				children: U.map(Q)
+			}), /* @__PURE__ */ d(p, {
+				sx: {
+					display: "flex",
+					alignItems: "center",
+					gap: .5
+				},
+				children: [/* @__PURE__ */ u(p, {
+					sx: {
+						display: "flex",
+						alignItems: "center",
+						gap: 2,
+						flex: 1
+					},
+					children: G && /* @__PURE__ */ d(p, {
+						sx: {
+							display: "flex",
+							alignItems: "center",
+							gap: 1.5
+						},
+						children: [H.map(Q), W.map(Q)]
+					})
+				}), /* @__PURE__ */ u(t, {
+					customActionButtons: T,
+					infoContent: P,
+					infoTooltip: M,
+					downloadTooltip: A,
+					resetTooltip: j,
+					processTooltip: k,
+					hideProcessButton: E,
+					processActionDisabled: K,
+					onInfoOpen: X,
+					onDownload: b,
+					onReset: y,
+					onProcess: v
+				})]
+			})]
+		}), P && /* @__PURE__ */ d(m, {
+			open: z,
+			onClose: Z,
+			maxWidth: "sm",
+			fullWidth: !0,
+			children: [/* @__PURE__ */ u(g, { children: N }), /* @__PURE__ */ u(h, { children: P })]
+		})]
+	});
+	return !I && typeof window < "u" ? f($, document.body) : $;
+};
+_.displayName = "SToolBar";
+//#endregion
+export { _ as SToolBar, _ as default };

package/dist/s-tool-bar/tool-bar-action-buttons.d.ts

@@ -0,0 +1,15 @@
+import { default as React } from 'react';
+export declare const ToolbarActionButtons: React.NamedExoticComponent<{
+    customActionButtons?: React.ReactNode;
+    infoContent?: React.ReactNode;
+    infoTooltip: string;
+    downloadTooltip: string;
+    resetTooltip: string;
+    processTooltip: string;
+    hideProcessButton: boolean;
+    processActionDisabled: boolean;
+    onInfoOpen: () => void;
+    onDownload?: () => void;
+    onReset?: () => void;
+    onProcess?: () => void;
+}>;

package/dist/s-tool-bar/tool-bar-action-buttons.js

@@ -0,0 +1,2 @@
+import { t as e } from "../tool-bar-action-buttons-B4QhqdK_.js";
+export { e as ToolbarActionButtons };

package/dist/s-tool-bar/tool-bar-image-input.d.ts

@@ -0,0 +1,8 @@
+import { default as React } from 'react';
+import { SToolBarInput, SToolBarValue } from './types';
+export declare const ImageInput: React.NamedExoticComponent<{
+    input: SToolBarInput;
+    value: SToolBarValue;
+    onChange: (value: SToolBarValue) => void;
+    disabled?: boolean;
+}>;

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

@@ -0,0 +1,2 @@
+import { t as e } from "../tool-bar-image-input-BKFAtyJ1.js";
+export { e as ImageInput };

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

@@ -0,0 +1,3 @@
+import { default as React } from 'react';
+import { SToolBarInputControlProps } from './types';
+export declare const ToolbarInputItem: React.NamedExoticComponent<SToolBarInputControlProps>;

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

@@ -0,0 +1,139 @@
+import { t as e } from "../tool-bar-image-input-BKFAtyJ1.js";
+import { t } from "../s-select-BqWS_5Bs.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";
+//#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, {
+	variant: "subtitle2",
+	sx: {
+		whiteSpace: "nowrap",
+		overflow: "hidden",
+		textOverflow: "ellipsis",
+		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, {
+		sx: {
+			display: "flex",
+			alignItems: "center",
+			height: 36
+		},
+		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",
+			sx: {
+				minWidth: 60,
+				textAlign: "center"
+			},
+			children: t ?? e.defaultValue ?? e.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
+		});
+		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({
+	value: t,
+	onChange: i,
+	onFocus: o,
+	onBlur: s,
+	disabled: n
+}) }) : /* @__PURE__ */ r(h, {
+	input: e,
+	value: t,
+	onChange: i,
+	onFocus: o,
+	onBlur: s,
+	disabled: n
+}));
+//#endregion
+export { g as ToolbarInputItem };

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

@@ -0,0 +1,170 @@
+import { default as React } from 'react';
+import { SelectProps, SliderProps, TextFieldProps } from '@mui/material';
+import { SxProps, Theme } from '@mui/material/styles';
+/**
+ * Possible value types for SToolBar inputs
+ */
+export type SToolBarValue = string | number | File | (string | File)[] | null;
+/**
+ * Base type constraint for select options
+ */
+export type SToolBarOption = string | number | Record<string, unknown>;
+/**
+ * Supported input types for SToolBar
+ */
+export type SToolBarInputType = 'textarea' | 'slider' | 'image' | 'number' | 'select';
+/**
+ * Configuration for individual toolbar input fields
+ */
+export interface SToolBarInput {
+    /** Unique identifier for the input */
+    key: string;
+    /** Display label for the input */
+    label: string;
+    /** Input type */
+    type: SToolBarInputType;
+    /** Whether the input is required */
+    required?: boolean;
+    /** Default value for the input */
+    defaultValue?: SToolBarValue;
+    /** Placeholder text (for textarea/number/select inputs) */
+    placeholder?: string;
+    /** Minimum value (for slider/number inputs) */
+    min?: number;
+    /** Maximum value (for slider/number inputs) */
+    max?: number;
+    /** Step value (for slider/number inputs) */
+    step?: number;
+    /** Minimum rows for textarea */
+    minRows?: number;
+    /** Maximum rows for textarea */
+    maxRows?: number;
+    /** Allow multiple images (for image inputs) */
+    multiple?: boolean;
+    /** Maximum number of images (for image inputs with multiple=true) */
+    maxImages?: number;
+    /** Select options (for select inputs) */
+    options?: SToolBarOption[];
+    /** Key to extract label from option objects (for select inputs) */
+    optionLabel?: string;
+    /** Key to extract value from option objects (for select inputs) */
+    optionValue?: string;
+    /** Enable search functionality in select dropdown */
+    searchable?: boolean;
+    /** Placeholder for search input in select dropdown */
+    searchPlaceholder?: string;
+    /**
+     * Extra props forwarded to the underlying child component.
+     * Each key targets the matching input type:
+     * - `textarea` / `number` → MUI `TextField`
+     * - `slider`              → MUI `Slider`
+     * - `select`              → `SSelect`
+     * - `image`               → native `<input type="file">`
+     *
+     * Only the props relevant to the current `type` are used.
+     */
+    componentProps?: SToolBarComponentProps;
+    /** Custom renderer for the input */
+    renderInput?: (props: {
+        value: SToolBarValue;
+        onChange: (value: SToolBarValue) => void;
+        onFocus: () => void;
+        onBlur: () => void;
+        disabled?: boolean;
+    }) => React.ReactNode;
+}
+/**
+ * Per-type overrides forwarded to the underlying child components.
+ * Omit props that are already managed by SToolBar to avoid conflicts.
+ */
+export interface SToolBarComponentProps {
+    /** 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'>;
+    /** 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;
+    };
+    /** Extra props for the native `<input type="file">` element used in `image` inputs */
+    image?: Omit<React.InputHTMLAttributes<HTMLInputElement>, 'ref' | 'type' | 'multiple' | 'onChange' | 'disabled' | 'style'>;
+}
+/**
+ * Props shared by the built-in input controls rendered inside SToolBar
+ */
+export interface SToolBarInputControlProps {
+    /** Input configuration */
+    input: SToolBarInput;
+    /** Current value of the input */
+    value: SToolBarValue;
+    /** Callback when the value changes */
+    onChange: (value: SToolBarValue) => void;
+    /** Callback when the input gains focus */
+    onFocus: () => void;
+    /** Callback when the input loses focus */
+    onBlur: () => void;
+    /** Whether the input is disabled */
+    disabled?: boolean;
+}
+/**
+ * Props interface for SToolBar component
+ */
+export interface SToolBarProps {
+    /** Configuration for input fields */
+    inputs?: SToolBarInput[];
+    /** Callback when process button is clicked */
+    onProcess?: () => void;
+    /** Callback when reset button is clicked */
+    onReset?: () => void;
+    /** Callback when download button is clicked */
+    onDownload?: () => void;
+    /** Whether the toolbar is in processing state */
+    processing?: boolean;
+    /** Whether the toolbar is in uploading state */
+    uploading?: boolean;
+    /** Input values controlled externally */
+    inputValues?: Record<string, SToolBarValue>;
+    /** Callback when input values change */
+    onInputChange?: (key: string, value: SToolBarValue, file?: File) => void;
+    /** Custom action buttons between inputs and standard actions */
+    customActionButtons?: React.ReactNode;
+    /** Hide the main process button */
+    hideProcessButton?: boolean;
+    /** Override to disable the process button */
+    processButtonDisabled?: boolean;
+    /** Function to check if an input should be disabled */
+    getInputDisabled?: (inputKey: string) => boolean;
+    /** Tooltip for process button */
+    processTooltip?: string;
+    /** Tooltip for download button */
+    downloadTooltip?: string;
+    /** Tooltip for reset button */
+    resetTooltip?: string;
+    /** Tooltip for info button */
+    infoTooltip?: string;
+    /** Info dialog title */
+    infoTitle?: string;
+    /** Info dialog content */
+    infoContent?: React.ReactNode;
+    /** Position of the toolbar */
+    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>;
+}

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

@@ -0,0 +1,10 @@
+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 groupInputsByType(inputs: SToolBarInput[]): {
+    imageInputs: SToolBarInput[];
+    textareaInputs: SToolBarInput[];
+    paramInputs: SToolBarInput[];
+};
+export declare function hasVisibleInputSection(imageInputs: SToolBarInput[], paramInputs: SToolBarInput[]): boolean;
+export declare function isProcessActionDisabled(processButtonDisabled: boolean, areRequiredInputsFilled: boolean, uploading: boolean, processing: boolean): boolean;

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

@@ -0,0 +1,22 @@
+//#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 t(e) {
+	return Array.isArray(e) ? e : e instanceof File || typeof e == "string" ? [e] : [];
+}
+function n(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) {
+	return e.length > 0 || t.length > 0;
+}
+function i(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 };

package/dist/theme/components/accordion-summary.js

@@ -1,8 +1,8 @@
-import { s as e } from "../../theme-primitives-D2vHHGiX.js";
+import { c as e } from "../../theme-primitives-7ruiI7gY.js";
 //#region lib/theme/components/accordion-summary.tsx
 var t = { styleOverrides: { root: ({ theme: t }) => ({
 	border: "none",
-	borderRadius: 8,
+	borderRadius: (t.vars ?? t).shape.borderRadius,
 	"&:hover": { backgroundColor: e[50] },
 	"&:focus-visible": { backgroundColor: "transparent" },
 	...t.applyStyles("dark", { "&:hover": { backgroundColor: e[800] } })