@solostylist/ui-kit 1.0.230 → 2.0.0

package/dist/s-switch/s-switch.d.ts

@@ -1,12 +1,34 @@
-import { default as React } from 'react';
-import { SwitchProps } from '@mui/material';
-/**
- * Props interface for SSwitch component - extends Material-UI SwitchProps
- * but removes 'content' to avoid conflicts with our custom content prop
- */
-export interface SSwitchProps extends Omit<SwitchProps, 'content'> {
-    /** Content displayed as a clickable label next to the switch */
-    content?: string | React.ReactNode;
-}
-export declare const SSwitch: React.ForwardRefExoticComponent<Omit<SSwitchProps, "ref"> & React.RefAttributes<HTMLButtonElement>>;
+import { FormControlLabelProps } from '@mui/material/FormControlLabel';
+import { SwitchProps } from '@mui/material/Switch';
+import { OwnerStateSlotProps as MuiOwnerStateSlotProps } from '../utils/slots';
+import * as React from 'react';
+export interface SSwitchOwnerState {
+    disabled: boolean;
+    labelPlacement: NonNullable<FormControlLabelProps['labelPlacement']>;
+    required: boolean;
+}
+type OwnerStateSlotProps<Props> = MuiOwnerStateSlotProps<Props, SSwitchOwnerState>;
+type ManagedControlProps = 'checked' | 'disabled' | 'inputRef' | 'name' | 'onChange' | 'required' | 'value';
+export interface SSwitchSlots {
+    /** Component used for the switch control. */
+    control?: React.ElementType;
+    /** Component used for the label text. */
+    typography?: React.ElementType;
+}
+export interface SSwitchSlotProps {
+    /** Props for the switch control. State managed by FormControlLabel stays on the root. */
+    control?: OwnerStateSlotProps<Omit<SwitchProps, ManagedControlProps>>;
+    /** Props forwarded to FormControlLabel's typography slot. */
+    typography?: NonNullable<FormControlLabelProps['slotProps']>['typography'];
+}
+/** A labelled MUI Switch composition with FormControlLabel-compatible root props. */
+export interface SSwitchProps extends Omit<FormControlLabelProps, 'control' | 'label' | 'slots' | 'slotProps'> {
+    /** Visible, clickable label for the switch. */
+    label: React.ReactNode;
+    /** Components used for the control and typography slots. */
+    slots?: SSwitchSlots;
+    /** Props or owner-state callbacks for the component slots. */
+    slotProps?: SSwitchSlotProps;
+}
+export declare const SSwitch: React.ForwardRefExoticComponent<Omit<SSwitchProps, "ref"> & React.RefAttributes<HTMLLabelElement>>;
 export default SSwitch;

package/dist/s-switch/s-switch.js

@@ -1,38 +1,2 @@
-import { forwardRef as e, useId as t } from "react";
-import { jsx as n, jsxs as r } from "react/jsx-runtime";
-import { Box as i, Stack as a, Switch as o, Typography as s } from "@mui/material";
-//#region lib/s-switch/s-switch.tsx
-var c = e(({ content: e, disabled: c, ...l }, u) => {
-	let d = t(), f = l.id ?? d, p = {
-		color: c ? "text.disabled" : "inherit",
-		cursor: c ? "not-allowed" : "pointer",
-		userSelect: "none"
-	};
-	return /* @__PURE__ */ r(a, {
-		direction: "row",
-		sx: {
-			alignItems: "center",
-			display: "flex",
-			justifyContent: "space-between"
-		},
-		children: [e && /* @__PURE__ */ n("label", {
-			htmlFor: f,
-			children: typeof e == "string" || typeof e == "number" ? /* @__PURE__ */ n(s, {
-				sx: p,
-				children: e
-			}) : /* @__PURE__ */ n(i, {
-				component: "span",
-				sx: p,
-				children: e
-			})
-		}), /* @__PURE__ */ n(o, {
-			ref: u,
-			...l,
-			disabled: c,
-			id: f
-		})]
-	});
-});
-c.displayName = "SSwitch";
-//#endregion
-export { c as SSwitch, c as default };
+import { t as e } from "../s-switch-B8bZAzLh.js";
+export { e as SSwitch, e as default };

package/dist/s-switch-B8bZAzLh.js

@@ -0,0 +1,307 @@
+import { n as e } from "./chunk-C_CI6nMA.js";
+import { t } from "./prop-types-BzYPyWN7.js";
+import { r as n, t as r } from "./DefaultPropsProvider-ebWx4_5E.js";
+import { t as i } from "./clsx-DGZSe4Nt.js";
+import { t as a } from "./styled-Bog8QCl3.js";
+import { t as o } from "./memoTheme-qFyKAk7y.js";
+import { t as s } from "./useThemeProps-Cr28OQu3.js";
+import { t as c } from "./appendOwnerState-CELpvdMz.js";
+import { t as l } from "./useSlot-iIu8ek6E.js";
+import { t as u } from "./capitalize-CccCFNpQ.js";
+import { t as d } from "./createSimplePaletteValueFilter-C1gWywW_.js";
+import { t as f } from "./mergeSlotProps-xl1-PgWL.js";
+import { t as p } from "./SwitchBase-D7zqrstO.js";
+import { n as m, t as h } from "./switchClasses-eiq1bkQN.js";
+import { n as g, t as _ } from "./FormControlLabel-DzgppcC_.js";
+import * as v from "react";
+import { jsx as y, jsxs as b } from "react/jsx-runtime";
+//#region ../../node_modules/@mui/material/Switch/Switch.mjs
+var x = /* @__PURE__ */ e(t(), 1), S = (e) => {
+	let { classes: t, edge: r, size: i, color: a, checked: o, disabled: s } = e, c = n({
+		root: [
+			"root",
+			r && `edge${u(r)}`,
+			`size${u(i)}`
+		],
+		switchBase: [
+			"switchBase",
+			`color${u(a)}`,
+			o && "checked",
+			s && "disabled"
+		],
+		thumb: ["thumb"],
+		track: ["track"],
+		input: ["input"]
+	}, h, t);
+	return {
+		...t,
+		...c
+	};
+}, C = a("span", {
+	name: "MuiSwitch",
+	slot: "Root",
+	overridesResolver: (e, t) => {
+		let { ownerState: n } = e;
+		return [
+			t.root,
+			n.edge && t[`edge${u(n.edge)}`],
+			t[`size${u(n.size)}`]
+		];
+	}
+})({
+	display: "inline-flex",
+	width: 58,
+	height: 38,
+	overflow: "hidden",
+	padding: 12,
+	boxSizing: "border-box",
+	position: "relative",
+	flexShrink: 0,
+	zIndex: 0,
+	verticalAlign: "middle",
+	"@media print": { colorAdjust: "exact" },
+	variants: [
+		{
+			props: { edge: "start" },
+			style: { marginLeft: -8 }
+		},
+		{
+			props: { edge: "end" },
+			style: { marginRight: -8 }
+		},
+		{
+			props: { size: "small" },
+			style: {
+				width: 40,
+				height: 24,
+				padding: 7,
+				[`& .${m.thumb}`]: {
+					width: 16,
+					height: 16
+				},
+				[`& .${m.switchBase}`]: {
+					padding: 4,
+					[`&.${m.checked}`]: { transform: "translateX(16px)" }
+				}
+			}
+		}
+	]
+}), w = a(p, {
+	name: "MuiSwitch",
+	slot: "SwitchBase",
+	overridesResolver: (e, t) => {
+		let { ownerState: n } = e;
+		return [
+			t.switchBase,
+			{ [`& .${m.input}`]: t.input },
+			n.color !== "default" && t[`color${u(n.color)}`]
+		];
+	}
+})(o(({ theme: e }) => ({
+	position: "absolute",
+	top: 0,
+	left: 0,
+	zIndex: 1,
+	color: e.vars ? e.vars.palette.Switch.defaultColor : `${e.palette.mode === "light" ? e.palette.common.white : e.palette.grey[300]}`,
+	transition: e.transitions.create(["left", "transform"], { duration: e.transitions.duration.shortest }),
+	[`&.${m.checked}`]: { transform: "translateX(20px)" },
+	[`&.${m.disabled}`]: { color: e.vars ? e.vars.palette.Switch.defaultDisabledColor : `${e.palette.mode === "light" ? e.palette.grey[100] : e.palette.grey[600]}` },
+	[`&.${m.checked} + .${m.track}`]: { opacity: .5 },
+	[`&.${m.disabled} + .${m.track}`]: { opacity: e.vars ? e.vars.opacity.switchTrackDisabled : `${e.palette.mode === "light" ? .12 : .2}` },
+	[`& .${m.input}`]: {
+		left: "-100%",
+		width: "300%"
+	}
+})), o(({ theme: e }) => ({
+	"&:hover": {
+		backgroundColor: e.alpha((e.vars || e).palette.action.active, (e.vars || e).palette.action.hoverOpacity),
+		"@media (hover: none)": { backgroundColor: "transparent" }
+	},
+	variants: [...Object.entries(e.palette).filter(d(["light"])).map(([t]) => ({
+		props: { color: t },
+		style: {
+			[`&.${m.checked}`]: {
+				color: (e.vars || e).palette[t].main,
+				"&:hover": {
+					backgroundColor: e.alpha((e.vars || e).palette[t].main, (e.vars || e).palette.action.hoverOpacity),
+					"@media (hover: none)": { backgroundColor: "transparent" }
+				},
+				[`&.${m.disabled}`]: { color: e.vars ? e.vars.palette.Switch[`${t}DisabledColor`] : `${e.palette.mode === "light" ? e.lighten(e.palette[t].main, .62) : e.darken(e.palette[t].main, .55)}` }
+			},
+			[`&.${m.checked} + .${m.track}`]: { backgroundColor: (e.vars || e).palette[t].main }
+		}
+	}))]
+}))), T = a("span", {
+	name: "MuiSwitch",
+	slot: "Track"
+})(o(({ theme: e }) => ({
+	height: "100%",
+	width: "100%",
+	borderRadius: 14 / 2,
+	zIndex: -1,
+	transition: e.transitions.create(["opacity", "background-color"], { duration: e.transitions.duration.shortest }),
+	"@media (forced-colors: active)": {
+		boxSizing: "border-box",
+		border: "1px solid ButtonBorder"
+	},
+	backgroundColor: e.vars ? e.vars.palette.common.onBackground : `${e.palette.mode === "light" ? e.palette.common.black : e.palette.common.white}`,
+	opacity: e.vars ? e.vars.opacity.switchTrack : `${e.palette.mode === "light" ? .38 : .3}`
+}))), E = a("span", {
+	name: "MuiSwitch",
+	slot: "Thumb"
+})(o(({ theme: e }) => ({
+	boxShadow: (e.vars || e).shadows[1],
+	backgroundColor: "currentColor",
+	boxSizing: "border-box",
+	border: "1px solid transparent",
+	width: 20,
+	height: 20,
+	borderRadius: "50%"
+}))), D = /* @__PURE__ */ v.forwardRef(function(e, t) {
+	let n = r({
+		props: e,
+		name: "MuiSwitch"
+	}), { className: a, color: o = "primary", edge: s = !1, size: c = "medium", sx: u, slots: d = {}, slotProps: p = {}, ...m } = n, h = {
+		...n,
+		color: o,
+		edge: s,
+		size: c
+	}, g = S(h), _ = p.input, v = {
+		slots: d,
+		slotProps: p
+	}, [x, D] = l("root", {
+		className: i(g.root, a),
+		elementType: C,
+		externalForwardedProps: v,
+		ownerState: h,
+		additionalProps: { sx: u }
+	}), [O, k] = l("thumb", {
+		className: g.thumb,
+		elementType: E,
+		externalForwardedProps: v,
+		ownerState: h
+	}), A = /* @__PURE__ */ y(O, { ...k }), [j, M] = l("track", {
+		className: g.track,
+		elementType: T,
+		externalForwardedProps: v,
+		ownerState: h
+	});
+	return /* @__PURE__ */ b(x, {
+		...D,
+		children: [/* @__PURE__ */ y(w, {
+			type: "checkbox",
+			icon: A,
+			checkedIcon: A,
+			ref: t,
+			ownerState: h,
+			...m,
+			classes: {
+				...g,
+				root: g.switchBase
+			},
+			slots: {
+				...d.switchBase && { root: d.switchBase },
+				...d.input && { input: d.input }
+			},
+			slotProps: {
+				...p.switchBase && { root: typeof p.switchBase == "function" ? p.switchBase(h) : p.switchBase },
+				input: f(typeof _ == "function" ? _(h) : _, { role: "switch" })
+			}
+		}), /* @__PURE__ */ y(j, { ...M })]
+	});
+});
+process.env.NODE_ENV !== "production" && (D.propTypes = {
+	checked: x.default.bool,
+	checkedIcon: x.default.node,
+	classes: x.default.object,
+	className: x.default.string,
+	color: x.default.oneOfType([x.default.oneOf([
+		"default",
+		"primary",
+		"secondary",
+		"error",
+		"info",
+		"success",
+		"warning"
+	]), x.default.string]),
+	defaultChecked: x.default.bool,
+	disabled: x.default.bool,
+	disableRipple: x.default.bool,
+	edge: x.default.oneOf([
+		"end",
+		"start",
+		!1
+	]),
+	icon: x.default.node,
+	id: x.default.string,
+	onChange: x.default.func,
+	required: x.default.bool,
+	size: x.default.oneOfType([x.default.oneOf(["medium", "small"]), x.default.string]),
+	slotProps: x.default.shape({
+		input: x.default.oneOfType([x.default.func, x.default.object]),
+		root: x.default.oneOfType([x.default.func, x.default.object]),
+		switchBase: x.default.oneOfType([x.default.func, x.default.object]),
+		thumb: x.default.oneOfType([x.default.func, x.default.object]),
+		track: x.default.oneOfType([x.default.func, x.default.object])
+	}),
+	slots: x.default.shape({
+		input: x.default.elementType,
+		root: x.default.elementType,
+		switchBase: x.default.elementType,
+		thumb: x.default.elementType,
+		track: x.default.elementType
+	}),
+	sx: x.default.oneOfType([
+		x.default.arrayOf(x.default.oneOfType([
+			x.default.func,
+			x.default.object,
+			x.default.bool
+		])),
+		x.default.func,
+		x.default.object
+	]),
+	value: x.default.any
+});
+//#endregion
+//#region lib/s-switch/s-switch.tsx
+var O = a(_, {
+	name: "SSwitch",
+	slot: "Root",
+	shouldForwardProp: (e) => e !== "ownerState"
+})(({ theme: e }) => ({
+	display: "flex",
+	justifyContent: "space-between",
+	margin: 0,
+	userSelect: "none",
+	[`&&.${g.disabled}`]: { cursor: "not-allowed" },
+	[`&& .${g.label}.${g.disabled}`]: { color: (e.vars ?? e).palette.text.disabled }
+}));
+function k(e, t) {
+	return typeof e == "function" ? e(t) : e;
+}
+var A = v.forwardRef(function(e, t) {
+	let n = s({
+		props: e,
+		name: "SSwitch"
+	}), { disabled: r = !1, label: i, labelPlacement: a = "start", required: o = !1, slotProps: l, slots: u, ...d } = n, f = {
+		...n,
+		disabled: r,
+		labelPlacement: a,
+		required: o
+	}, p = u?.control ?? D, m = k(l?.control, f), h = c(u?.control, m ?? {}, f);
+	return /* @__PURE__ */ y(O, {
+		...d,
+		control: /* @__PURE__ */ y(p, { ...h }),
+		disabled: r,
+		label: i,
+		labelPlacement: a,
+		ownerState: f,
+		ref: t,
+		required: o,
+		slots: u?.typography ? { typography: u.typography } : void 0,
+		slotProps: l?.typography ? { typography: l.typography } : void 0
+	});
+});
+A.displayName = "SSwitch";
+//#endregion
+export { A as t };

package/dist/s-tabs/index.d.ts

@@ -1,6 +1,8 @@
-export { default as STabs } from './s-tabs';
-export type { STabsProps, STabItem } from './s-tabs';
+export { default, default as STabs } from './s-tabs';
+export type { STabItem, STabOwnerState, STabsOwnerState, STabsProps, STabsSlotProps, STabsSlots, STabValue, } from './s-tabs';
 export { default as STab } from './s-tab';
 export type { STabProps } from './s-tab';
 export { default as STabPanel } from './s-tab-panel';
-export type { STabPanelProps } from './s-tab-panel';
+export type { STabPanelOwnerState, STabPanelProps } from './s-tab-panel';
+export { getTabId, getTabPanelId } from './tab-ids';
+export type {} from '../theme/component-augmentation';

package/dist/s-tabs/index.js

@@ -1,4 +1,5 @@
-import { STabs as e } from "./s-tabs.js";
-import t from "./s-tab.js";
-import { STabPanel as n } from "./s-tab-panel.js";
-export { t as STab, n as STabPanel, e as STabs };
+import { getTabId as e, getTabPanelId as t } from "./tab-ids.js";
+import { STabs as n } from "./s-tabs.js";
+import { STab as r } from "./s-tab.js";
+import { STabPanel as i } from "./s-tab-panel.js";
+export { r as STab, i as STabPanel, n as STabs, n as default, e as getTabId, t as getTabPanelId };

package/dist/s-tabs/s-tab-panel.d.ts

@@ -1,17 +1,19 @@
-import { default as React } from 'react';
 import { BoxProps } from '@mui/material';
-/**
- * Props interface for STabPanel component
- */
-export interface STabPanelProps extends BoxProps {
-    /** Content to display in the tab panel */
+import * as React from 'react';
+export interface STabPanelProps extends Omit<BoxProps, 'component'> {
+    /** Content displayed by the panel. */
     children?: React.ReactNode;
-    /** Index (or value) of this specific tab panel */
+    /** Value represented by this panel. */
     index: number | string;
-    /** Current active tab index (or value) from the parent tabs component */
-    value: number | string;
-    /** Keep the panel mounted in the DOM when not active */
+    /** Shared ID prefix used by the related STabs instance. */
+    idPrefix: string;
+    /** Keep the panel content mounted while inactive. */
     keepMounted?: boolean;
+    /** Current selected value. */
+    value: number | string;
 }
+export type STabPanelOwnerState = STabPanelProps & {
+    active: boolean;
+};
 export declare const STabPanel: React.ForwardRefExoticComponent<Omit<STabPanelProps, "ref"> & React.RefAttributes<HTMLDivElement>>;
 export default STabPanel;

package/dist/s-tabs/s-tab-panel.js

@@ -1,23 +1,30 @@
-import { forwardRef as e } from "react";
-import { jsx as t } from "react/jsx-runtime";
-import { Box as n } from "@mui/material";
+import { getTabId as e, getTabPanelId as t } from "./tab-ids.js";
+import * as n from "react";
+import { jsx as r } from "react/jsx-runtime";
+import { Box as i, styled as a, useThemeProps as o } from "@mui/material";
 //#region lib/s-tabs/s-tab-panel.tsx
-var r = e(({ children: e, value: r, index: i, keepMounted: a = !1, sx: o, ...s }, c) => {
-	let l = r === i;
-	return l || a ? /* @__PURE__ */ t(n, {
-		ref: c,
+var s = a(i, {
+	name: "STabPanel",
+	slot: "Root"
+})({}), c = n.forwardRef(function(n, i) {
+	let a = o({
+		props: n,
+		name: "STabPanel"
+	}), { children: c, value: l, index: u, idPrefix: d, keepMounted: f = !1, id: p = t(d, u), ...m } = a, h = l === u, g = {
+		...a,
+		active: h
+	};
+	return /* @__PURE__ */ r(s, {
+		...m,
+		ref: i,
 		role: "tabpanel",
-		hidden: !l,
-		id: `tabpanel-${i}`,
-		"aria-labelledby": `tab-${i}`,
-		sx: {
-			...o,
-			display: l ? "block" : "none"
-		},
-		...s,
-		children: e
-	}) : null;
+		hidden: !h,
+		id: p,
+		"aria-labelledby": e(d, u),
+		ownerState: g,
+		children: (f || h) && c
+	});
 });
-r.displayName = "STabPanel";
+c.displayName = "STabPanel";
 //#endregion
-export { r as STabPanel, r as default };
+export { c as STabPanel, c as default };

package/dist/s-tabs/s-tab.d.ts

@@ -1,5 +1,6 @@
-import { default as React } from 'react';
 import { TabProps } from '@mui/material';
+/** Exact MUI Tab props, including polymorphic `component` support. */
 export type STabProps = TabProps;
-declare const STab: React.ForwardRefExoticComponent<Omit<STabProps, "ref"> & React.RefAttributes<HTMLDivElement>>;
+/** SoloStylist export of the unmodified MUI Tab contract. */
+export declare const STab: import('@mui/material').ExtendButtonBase<import('@mui/material').TabTypeMap<{}, "div">>;
 export default STab;

package/dist/s-tabs/s-tab.js

@@ -1,11 +1,5 @@
-import { forwardRef as e } from "react";
-import { jsx as t } from "react/jsx-runtime";
-import { Tab as n } from "@mui/material";
+import { Tab as e } from "@mui/material";
 //#region lib/s-tabs/s-tab.tsx
-var r = e((e, r) => /* @__PURE__ */ t(n, {
-	ref: r,
-	...e
-}));
-r.displayName = "STab";
+var t = e;
 //#endregion
-export { r as default };
+export { t as STab, t as default };

package/dist/s-tabs/s-tabs.d.ts

@@ -1,38 +1,52 @@
-import { default as React } from 'react';
 import { BoxProps, TabProps, TabsProps } from '@mui/material';
-/**
- * Props interface for STabs component
- */
-export interface STabsProps extends Omit<TabsProps, 'children'> {
-    /** Array of tab configuration objects defining the tabs to display */
-    tabs: STabItem[];
-    /** Index of the currently active tab. Set to false for uncontrolled mode */
-    activeTab?: number | string | false;
-    /** Callback function called when a tab is selected */
-    onTabChange?: (event: React.SyntheticEvent, value: number | string) => void;
-    /** Tab panel content. Children are matched to tabs by index */
-    children?: React.ReactNode;
-    /** Additional props passed to the tab panel wrapper Box component */
-    tabPanelProps?: BoxProps;
-}
-/**
- * Configuration object interface for individual tabs in STabs
- */
-export interface STabItem {
-    /** The content displayed in the tab */
+import { OwnerStateSlotProps as MuiOwnerStateSlotProps } from '../utils/slots';
+import * as React from 'react';
+export type STabValue = number | string | false;
+export interface STabItem extends Omit<TabProps, 'aria-controls' | 'id' | 'label' | 'value'> {
+    /** The content displayed in the tab. */
     label: React.ReactNode;
-    /** Custom value for the tab. If not provided, uses the tab index */
+    /** Stable value for controlled selection. Defaults to the item index. */
     value?: number | string;
-    /** Whether the tab is disabled and cannot be selected */
-    disabled?: boolean;
-    /** Icon element to display in the tab */
-    icon?: React.ReactElement;
-    /** Position of the icon relative to the label */
-    iconPosition?: 'start' | 'end' | 'top' | 'bottom';
-    /** Whether the tab label should wrap to multiple lines */
-    wrapped?: boolean;
-    /** Additional props passed to the underlying Material-UI Tab component */
-    tabProps?: Omit<TabProps, 'label' | 'value' | 'disabled' | 'icon' | 'iconPosition' | 'wrapped'>;
+}
+export type STabsOwnerState = STabsProps & {
+    activeIndex: number;
+    orientation: NonNullable<TabsProps['orientation']>;
+    value: STabValue;
+};
+export interface STabOwnerState extends STabsOwnerState {
+    index: number;
+    item: STabItem;
+}
+type SlotProps<Props, OwnerState> = MuiOwnerStateSlotProps<Props, OwnerState>;
+export interface STabsSlots {
+    list?: React.ElementType;
+    panel?: React.ElementType;
+    root?: React.ElementType;
+    tab?: React.ElementType;
+}
+export interface STabsSlotProps {
+    list?: SlotProps<Omit<TabsProps, 'children' | 'onChange' | 'orientation' | 'value'>, STabsOwnerState>;
+    panel?: SlotProps<Omit<BoxProps, 'aria-labelledby' | 'component' | 'id' | 'role'>, STabsOwnerState>;
+    root?: SlotProps<Omit<BoxProps, 'component'>, STabsOwnerState>;
+    tab?: SlotProps<Omit<TabProps, 'aria-controls' | 'id' | 'label' | 'value'>, STabOwnerState>;
+}
+export interface STabsProps extends Omit<BoxProps, 'children' | 'component' | 'defaultValue' | 'onChange' | 'value'> {
+    /** Tab panel content matched to tab items by index. */
+    children?: React.ReactNode;
+    /** Initial value for uncontrolled usage. */
+    defaultValue?: STabValue;
+    /** Tabs orientation. */
+    orientation?: TabsProps['orientation'];
+    /** Called when the selected tab changes. */
+    onChange?: (event: React.SyntheticEvent, value: STabValue) => void;
+    /** Components used for each structural slot. */
+    slots?: STabsSlots;
+    /** Props or owner-state callbacks for each structural slot. */
+    slotProps?: STabsSlotProps;
+    /** Tab definitions. Standard MUI Tab props are accepted directly on each item. */
+    tabs: STabItem[];
+    /** Current value for controlled usage. */
+    value?: STabValue;
 }
 export declare const STabs: React.ForwardRefExoticComponent<Omit<STabsProps, "ref"> & React.RefAttributes<HTMLDivElement>>;
 export default STabs;