@solostylist/ui-kit 1.0.230 → 2.0.0

package/dist/s-pagination/types.js

@@ -6,10 +6,14 @@ var e = [
 	"error",
 	"info",
 	"warning"
-], t = {
+], t = [
+	"small",
+	"medium",
+	"large"
+], n = {
 	small: {
 		item: 26,
-		gap: 2,
+		gap: 6,
 		bar: 90
 	},
 	medium: {
@@ -22,6 +26,6 @@ var e = [
 		gap: 6,
 		bar: 150
 	}
-};
+}, r = (e) => n[e] ?? n.medium;
 //#endregion
-export { e as paginationColors, t as paginationDimensions };
+export { r as getPaginationDimensions, e as paginationColors, n as paginationDimensions, t as paginationSizes };

package/dist/s-pagination-Dt8Pk5Tp.js

@@ -0,0 +1,606 @@
+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 "./generateUtilityClass-PAIOm1jC.js";
+import { t as a } from "./clsx-DGZSe4Nt.js";
+import { t as o } from "./generateUtilityClasses-DvX505Gy.js";
+import { t as s } from "./styled-Bog8QCl3.js";
+import { t as c } from "./Stack-UMc4dV4G.js";
+import { t as l } from "./RtlProvider-B7uVJXUY.js";
+import { t as u } from "./memoTheme-qFyKAk7y.js";
+import { t as d } from "./Skeleton-iZFynl7z.js";
+import { t as f } from "./useThemeProps-Cr28OQu3.js";
+import { t as p } from "./ButtonBase-DxKtpFYs.js";
+import { t as m } from "./useControlled-C4QJnpiR.js";
+import { t as h } from "./useSlot-iIu8ek6E.js";
+import { t as g } from "./capitalize-CccCFNpQ.js";
+import { t as _ } from "./createSimplePaletteValueFilter-C1gWywW_.js";
+import { t as v } from "./createSvgIcon-B0SZlJF1.js";
+import { t as y } from "./integerPropType-Disnft4a.js";
+import { getPaginationDimensions as b } from "./s-pagination/types.js";
+import * as x from "react";
+import { jsx as S, jsxs as C } from "react/jsx-runtime";
+//#region ../../node_modules/@mui/material/Pagination/paginationClasses.mjs
+var w = /* @__PURE__ */ e(t(), 1);
+function T(e) {
+	return i("MuiPagination", e);
+}
+o("MuiPagination", [
+	"root",
+	"ul",
+	"outlined",
+	"text"
+]);
+//#endregion
+//#region ../../node_modules/@mui/material/usePagination/usePagination.mjs
+function E(e = {}) {
+	let { boundaryCount: t = 1, componentName: n = "usePagination", count: r = 1, defaultPage: i = 1, disabled: a = !1, hideNextButton: o = !1, hidePrevButton: s = !1, onChange: c, page: l, showFirstButton: u = !1, showLastButton: d = !1, siblingCount: f = 1, ...p } = e, [h, g] = m({
+		controlled: l,
+		default: i,
+		name: n,
+		state: "page"
+	}), _ = (e, t) => {
+		l || g(t), c && c(e, t);
+	}, v = (e, t) => {
+		let n = t - e + 1;
+		return Array.from({ length: n }, (t, n) => e + n);
+	}, y = v(1, Math.min(t, r)), b = v(Math.max(r - t + 1, t + 1), r), x = Math.max(Math.min(h - f, r - t - f * 2 - 1), t + 2), S = Math.min(Math.max(h + f, t + f * 2 + 2), r - t - 1), C = [
+		...u ? ["first"] : [],
+		...s ? [] : ["previous"],
+		...y,
+		...x > t + 2 ? ["start-ellipsis"] : t + 1 < r - t ? [t + 1] : [],
+		...v(x, S),
+		...S < r - t - 1 ? ["end-ellipsis"] : r - t > t ? [r - t] : [],
+		...b,
+		...o ? [] : ["next"],
+		...d ? ["last"] : []
+	], w = (e) => {
+		switch (e) {
+			case "first": return 1;
+			case "previous": return h - 1;
+			case "next": return h + 1;
+			case "last": return r;
+			default: return null;
+		}
+	};
+	return {
+		items: C.map((e) => typeof e == "number" ? {
+			onClick: (t) => {
+				_(t, e);
+			},
+			type: "page",
+			page: e,
+			selected: e === h,
+			disabled: a,
+			"aria-current": e === h ? "page" : void 0
+		} : {
+			onClick: (t) => {
+				_(t, w(e));
+			},
+			type: e,
+			page: w(e),
+			selected: !1,
+			disabled: a || !e.includes("ellipsis") && (e === "next" || e === "last" ? h >= r : h <= 1)
+		}),
+		...p
+	};
+}
+//#endregion
+//#region ../../node_modules/@mui/material/PaginationItem/paginationItemClasses.mjs
+function D(e) {
+	return i("MuiPaginationItem", e);
+}
+var O = o("MuiPaginationItem", [
+	"root",
+	"page",
+	"sizeSmall",
+	"sizeLarge",
+	"text",
+	"outlined",
+	"rounded",
+	"ellipsis",
+	"firstLast",
+	"previousNext",
+	"focusVisible",
+	"disabled",
+	"selected",
+	"icon",
+	"colorPrimary",
+	"colorSecondary"
+]), k = v(/* @__PURE__ */ S("path", { d: "M18.41 16.59L13.82 12l4.59-4.59L17 6l-6 6 6 6zM6 6h2v12H6z" }), "FirstPage"), A = v(/* @__PURE__ */ S("path", { d: "M5.59 7.41L10.18 12l-4.59 4.59L7 18l6-6-6-6zM16 6h2v12h-2z" }), "LastPage"), j = v(/* @__PURE__ */ S("path", { d: "M15.41 7.41L14 6l-6 6 6 6 1.41-1.41L10.83 12z" }), "NavigateBefore"), M = v(/* @__PURE__ */ S("path", { d: "M10 6L8.59 7.41 13.17 12l-4.58 4.59L10 18l6-6z" }), "NavigateNext"), N = (e, t) => {
+	let { ownerState: n } = e;
+	return [
+		t.root,
+		t[n.variant],
+		t[`size${g(n.size)}`],
+		n.shape === "rounded" && t.rounded,
+		n.type === "page" && t.page,
+		(n.type === "start-ellipsis" || n.type === "end-ellipsis") && t.ellipsis,
+		(n.type === "previous" || n.type === "next") && t.previousNext,
+		(n.type === "first" || n.type === "last") && t.firstLast
+	];
+}, P = (e) => {
+	let { classes: t, color: r, disabled: i, selected: a, size: o, shape: s, type: c, variant: l } = e;
+	return n({
+		root: [
+			"root",
+			`size${g(o)}`,
+			l,
+			s,
+			r !== "standard" && `color${g(r)}`,
+			i && "disabled",
+			a && "selected",
+			{
+				page: "page",
+				first: "firstLast",
+				last: "firstLast",
+				"start-ellipsis": "ellipsis",
+				"end-ellipsis": "ellipsis",
+				previous: "previousNext",
+				next: "previousNext"
+			}[c]
+		],
+		icon: ["icon"]
+	}, D, t);
+}, F = s("div", {
+	name: "MuiPaginationItem",
+	slot: "Root",
+	overridesResolver: N
+})(u(({ theme: e }) => ({
+	...e.typography.body2,
+	borderRadius: 32 / 2,
+	textAlign: "center",
+	boxSizing: "border-box",
+	minWidth: 32,
+	padding: "0 6px",
+	margin: "0 3px",
+	color: (e.vars || e).palette.text.primary,
+	height: "auto",
+	[`&.${O.disabled}`]: { opacity: (e.vars || e).palette.action.disabledOpacity },
+	variants: [{
+		props: { size: "small" },
+		style: {
+			minWidth: 26,
+			borderRadius: 26 / 2,
+			margin: "0 1px",
+			padding: "0 4px"
+		}
+	}, {
+		props: { size: "large" },
+		style: {
+			minWidth: 40,
+			borderRadius: 40 / 2,
+			padding: "0 10px",
+			fontSize: e.typography.pxToRem(15)
+		}
+	}]
+}))), I = s(p, {
+	name: "MuiPaginationItem",
+	slot: "Root",
+	overridesResolver: N
+})(u(({ theme: e }) => ({
+	...e.typography.body2,
+	borderRadius: 32 / 2,
+	textAlign: "center",
+	boxSizing: "border-box",
+	minWidth: 32,
+	height: 32,
+	padding: "0 6px",
+	margin: "0 3px",
+	color: (e.vars || e).palette.text.primary,
+	[`&.${O.focusVisible}`]: { backgroundColor: (e.vars || e).palette.action.focus },
+	[`&.${O.disabled}`]: { opacity: (e.vars || e).palette.action.disabledOpacity },
+	transition: e.transitions.create(["color", "background-color"], { duration: e.transitions.duration.short }),
+	"&:hover": {
+		backgroundColor: (e.vars || e).palette.action.hover,
+		"@media (hover: none)": { backgroundColor: "transparent" }
+	},
+	[`&.${O.selected}`]: {
+		backgroundColor: (e.vars || e).palette.action.selected,
+		"&:hover": {
+			backgroundColor: e.alpha((e.vars || e).palette.action.selected, `${(e.vars || e).palette.action.selectedOpacity} + ${(e.vars || e).palette.action.hoverOpacity}`),
+			"@media (hover: none)": { backgroundColor: (e.vars || e).palette.action.selected }
+		},
+		[`&.${O.focusVisible}`]: { backgroundColor: e.alpha((e.vars || e).palette.action.selected, `${(e.vars || e).palette.action.selectedOpacity} + ${(e.vars || e).palette.action.focusOpacity}`) },
+		[`&.${O.disabled}`]: {
+			opacity: 1,
+			color: (e.vars || e).palette.action.disabled,
+			backgroundColor: (e.vars || e).palette.action.selected
+		}
+	},
+	variants: [
+		{
+			props: { size: "small" },
+			style: {
+				minWidth: 26,
+				height: 26,
+				borderRadius: 26 / 2,
+				margin: "0 1px",
+				padding: "0 4px"
+			}
+		},
+		{
+			props: { size: "large" },
+			style: {
+				minWidth: 40,
+				height: 40,
+				borderRadius: 40 / 2,
+				padding: "0 10px",
+				fontSize: e.typography.pxToRem(15)
+			}
+		},
+		{
+			props: { shape: "rounded" },
+			style: { borderRadius: (e.vars || e).shape.borderRadius }
+		},
+		{
+			props: { variant: "outlined" },
+			style: {
+				border: e.vars ? `1px solid ${e.alpha(e.vars.palette.common.onBackground, .23)}` : `1px solid ${e.palette.mode === "light" ? "rgba(0, 0, 0, 0.23)" : "rgba(255, 255, 255, 0.23)"}`,
+				[`&.${O.selected}`]: { [`&.${O.disabled}`]: {
+					borderColor: (e.vars || e).palette.action.disabledBackground,
+					color: (e.vars || e).palette.action.disabled
+				} }
+			}
+		},
+		{
+			props: { variant: "text" },
+			style: { [`&.${O.selected}`]: { [`&.${O.disabled}`]: { color: (e.vars || e).palette.action.disabled } } }
+		},
+		...Object.entries(e.palette).filter(_(["dark", "contrastText"])).map(([t]) => ({
+			props: {
+				variant: "text",
+				color: t
+			},
+			style: { [`&.${O.selected}`]: {
+				color: (e.vars || e).palette[t].contrastText,
+				backgroundColor: (e.vars || e).palette[t].main,
+				"&:hover": {
+					backgroundColor: (e.vars || e).palette[t].dark,
+					"@media (hover: none)": { backgroundColor: (e.vars || e).palette[t].main }
+				},
+				[`&.${O.focusVisible}`]: { backgroundColor: (e.vars || e).palette[t].dark },
+				[`&.${O.disabled}`]: { color: (e.vars || e).palette.action.disabled }
+			} }
+		})),
+		...Object.entries(e.palette).filter(_(["light"])).map(([t]) => ({
+			props: {
+				variant: "outlined",
+				color: t
+			},
+			style: { [`&.${O.selected}`]: {
+				color: (e.vars || e).palette[t].main,
+				border: `1px solid ${e.alpha((e.vars || e).palette[t].main, .5)}`,
+				backgroundColor: e.alpha((e.vars || e).palette[t].main, (e.vars || e).palette.action.activatedOpacity),
+				"&:hover": {
+					backgroundColor: e.alpha((e.vars || e).palette[t].main, `${(e.vars || e).palette.action.activatedOpacity} + ${(e.vars || e).palette.action.focusOpacity}`),
+					"@media (hover: none)": { backgroundColor: "transparent" }
+				},
+				[`&.${O.focusVisible}`]: { backgroundColor: e.alpha((e.vars || e).palette[t].main, `${(e.vars || e).palette.action.activatedOpacity} + ${(e.vars || e).palette.action.focusOpacity}`) }
+			} }
+		}))
+	]
+}))), L = s("div", {
+	name: "MuiPaginationItem",
+	slot: "Icon"
+})(u(({ theme: e }) => ({
+	fontSize: e.typography.pxToRem(20),
+	margin: "0 -8px",
+	variants: [{
+		props: { size: "small" },
+		style: { fontSize: e.typography.pxToRem(18) }
+	}, {
+		props: { size: "large" },
+		style: { fontSize: e.typography.pxToRem(22) }
+	}]
+}))), R = /* @__PURE__ */ x.forwardRef(function(e, t) {
+	let n = r({
+		props: e,
+		name: "MuiPaginationItem"
+	}), { className: i, color: o = "standard", component: s, disabled: c = !1, page: u, selected: d = !1, shape: f = "circular", size: p = "medium", slots: m = {}, slotProps: g = {}, type: _ = "page", variant: v = "text", ...y } = n, b = {
+		...n,
+		color: o,
+		disabled: c,
+		selected: d,
+		shape: f,
+		size: p,
+		type: _,
+		variant: v
+	}, x = l(), w = P(b), T = {
+		slots: m,
+		slotProps: g
+	}, [E, D] = h("previous", {
+		elementType: j,
+		externalForwardedProps: T,
+		ownerState: b
+	}), [O, N] = h("next", {
+		elementType: M,
+		externalForwardedProps: T,
+		ownerState: b
+	}), [R, z] = h("first", {
+		elementType: k,
+		externalForwardedProps: T,
+		ownerState: b
+	}), [B, V] = h("last", {
+		elementType: A,
+		externalForwardedProps: T,
+		ownerState: b
+	}), H = x ? {
+		previous: "next",
+		next: "previous",
+		first: "last",
+		last: "first"
+	}[_] : _, U = {
+		previous: E,
+		next: O,
+		first: R,
+		last: B
+	}[H], W = {
+		previous: D,
+		next: N,
+		first: z,
+		last: V
+	}[H];
+	return _ === "start-ellipsis" || _ === "end-ellipsis" ? /* @__PURE__ */ S(F, {
+		ref: t,
+		ownerState: b,
+		className: a(w.root, i),
+		children: "…"
+	}) : /* @__PURE__ */ C(I, {
+		ref: t,
+		ownerState: b,
+		component: s,
+		internalNativeButton: !0,
+		disabled: c,
+		className: a(w.root, i),
+		...y,
+		children: [_ === "page" && u, U ? /* @__PURE__ */ S(L, {
+			...W,
+			className: w.icon,
+			as: U
+		}) : null]
+	});
+});
+process.env.NODE_ENV !== "production" && (R.propTypes = {
+	children: w.default.node,
+	classes: w.default.object,
+	className: w.default.string,
+	color: w.default.oneOfType([w.default.oneOf([
+		"primary",
+		"secondary",
+		"standard"
+	]), w.default.string]),
+	component: w.default.elementType,
+	disabled: w.default.bool,
+	nativeButton: w.default.bool,
+	page: w.default.node,
+	selected: w.default.bool,
+	shape: w.default.oneOf(["circular", "rounded"]),
+	size: w.default.oneOfType([w.default.oneOf([
+		"small",
+		"medium",
+		"large"
+	]), w.default.string]),
+	slotProps: w.default.shape({
+		first: w.default.oneOfType([w.default.func, w.default.object]),
+		last: w.default.oneOfType([w.default.func, w.default.object]),
+		next: w.default.oneOfType([w.default.func, w.default.object]),
+		previous: w.default.oneOfType([w.default.func, w.default.object])
+	}),
+	slots: w.default.shape({
+		first: w.default.elementType,
+		last: w.default.elementType,
+		next: w.default.elementType,
+		previous: w.default.elementType
+	}),
+	sx: w.default.oneOfType([
+		w.default.arrayOf(w.default.oneOfType([
+			w.default.func,
+			w.default.object,
+			w.default.bool
+		])),
+		w.default.func,
+		w.default.object
+	]),
+	type: w.default.oneOf([
+		"end-ellipsis",
+		"first",
+		"last",
+		"next",
+		"page",
+		"previous",
+		"start-ellipsis"
+	]),
+	variant: w.default.oneOfType([w.default.oneOf(["outlined", "text"]), w.default.string])
+});
+//#endregion
+//#region ../../node_modules/@mui/material/Pagination/Pagination.mjs
+var z = (e) => {
+	let { classes: t, variant: r } = e;
+	return n({
+		root: ["root", r],
+		ul: ["ul"]
+	}, T, t);
+}, B = s("nav", {
+	name: "MuiPagination",
+	slot: "Root",
+	overridesResolver: (e, t) => {
+		let { ownerState: n } = e;
+		return [t.root, t[n.variant]];
+	}
+})({}), V = s("ul", {
+	name: "MuiPagination",
+	slot: "Ul"
+})({
+	display: "flex",
+	flexWrap: "wrap",
+	alignItems: "center",
+	padding: 0,
+	margin: 0,
+	listStyle: "none"
+});
+function H(e, t, n) {
+	return e === "page" ? `${n ? "" : "Go to "}page ${t}` : `Go to ${e} page`;
+}
+var U = /* @__PURE__ */ x.forwardRef(function(e, t) {
+	let n = r({
+		props: e,
+		name: "MuiPagination"
+	}), { boundaryCount: i = 1, className: o, color: s = "standard", count: c = 1, defaultPage: l = 1, disabled: u = !1, getItemAriaLabel: d = H, hideNextButton: f = !1, hidePrevButton: p = !1, onChange: m, page: h, renderItem: g = (e) => /* @__PURE__ */ S(R, { ...e }), shape: _ = "circular", showFirstButton: v = !1, showLastButton: y = !1, siblingCount: b = 1, size: x = "medium", variant: C = "text", ...w } = n, { items: T } = E({
+		...n,
+		componentName: "Pagination"
+	}), D = {
+		...n,
+		boundaryCount: i,
+		color: s,
+		count: c,
+		defaultPage: l,
+		disabled: u,
+		getItemAriaLabel: d,
+		hideNextButton: f,
+		hidePrevButton: p,
+		renderItem: g,
+		shape: _,
+		showFirstButton: v,
+		showLastButton: y,
+		siblingCount: b,
+		size: x,
+		variant: C
+	}, O = z(D);
+	return /* @__PURE__ */ S(B, {
+		"aria-label": "pagination navigation",
+		className: a(O.root, o),
+		ownerState: D,
+		ref: t,
+		...w,
+		children: /* @__PURE__ */ S(V, {
+			className: O.ul,
+			ownerState: D,
+			children: T.map((e, t) => /* @__PURE__ */ S("li", { children: g({
+				...e,
+				color: s,
+				"aria-label": d(e.type, e.page, e.selected),
+				shape: _,
+				size: x,
+				variant: C
+			}) }, t))
+		})
+	});
+});
+process.env.NODE_ENV !== "production" && (U.propTypes = {
+	boundaryCount: y,
+	classes: w.default.object,
+	className: w.default.string,
+	color: w.default.oneOfType([w.default.oneOf([
+		"primary",
+		"secondary",
+		"standard"
+	]), w.default.string]),
+	count: y,
+	defaultPage: y,
+	disabled: w.default.bool,
+	getItemAriaLabel: w.default.func,
+	hideNextButton: w.default.bool,
+	hidePrevButton: w.default.bool,
+	onChange: w.default.func,
+	page: y,
+	renderItem: w.default.func,
+	shape: w.default.oneOf(["circular", "rounded"]),
+	showFirstButton: w.default.bool,
+	showLastButton: w.default.bool,
+	siblingCount: y,
+	size: w.default.oneOfType([w.default.oneOf([
+		"small",
+		"medium",
+		"large"
+	]), w.default.string]),
+	sx: w.default.oneOfType([
+		w.default.arrayOf(w.default.oneOfType([
+			w.default.func,
+			w.default.object,
+			w.default.bool
+		])),
+		w.default.func,
+		w.default.object
+	]),
+	variant: w.default.oneOfType([w.default.oneOf(["outlined", "text"]), w.default.string])
+});
+//#endregion
+//#region lib/s-pagination/s-pagination.tsx
+var W = 5, G = s(U, {
+	name: "SPagination",
+	slot: "Root",
+	shouldForwardProp: (e) => e !== "ownerState"
+})(({ ownerState: e }) => ({ ...e.loading && { display: "inline-flex" } })), K = x.forwardRef(function(e, t) {
+	let n = f({
+		props: e,
+		name: "SPagination"
+	}), { "aria-label": r = "pagination navigation", "aria-busy": i, className: a, color: o = "primary", count: s = 0, loading: l = !1, loadingIndicator: u, shape: p = "rounded", size: m = "medium", style: h, sx: g, variant: _ = "text", ...v } = n;
+	if (s <= 0) return null;
+	let y = b(m), w = l || v.disabled, T = {
+		...n,
+		"aria-label": r,
+		color: o,
+		count: s,
+		disabled: w,
+		loading: l,
+		shape: p,
+		size: m,
+		variant: _
+	}, E = /* @__PURE__ */ S(c, {
+		"aria-label": `${r} loading`,
+		direction: "row",
+		role: "progressbar",
+		sx: {
+			alignItems: "center",
+			display: "inline-flex",
+			gap: `${y.gap}px`
+		},
+		children: u ?? (p === "circular" ? Array.from({ length: W }, (e, t) => /* @__PURE__ */ S(d, {
+			variant: "circular",
+			width: y.item,
+			height: y.item
+		}, t)) : /* @__PURE__ */ C(x.Fragment, { children: [
+			/* @__PURE__ */ S(d, {
+				variant: "rounded",
+				width: y.item,
+				height: y.item
+			}),
+			/* @__PURE__ */ S(d, {
+				variant: "rounded",
+				width: y.bar,
+				height: y.item
+			}),
+			/* @__PURE__ */ S(d, {
+				variant: "rounded",
+				width: y.item,
+				height: y.item
+			})
+		] }))
+	});
+	return /* @__PURE__ */ S(G, {
+		...v,
+		"aria-label": r,
+		"aria-busy": i ?? (l || void 0),
+		className: a,
+		color: o,
+		count: l ? 1 : s,
+		disabled: w,
+		hideNextButton: l || v.hideNextButton,
+		hidePrevButton: l || v.hidePrevButton,
+		ownerState: T,
+		page: v.page,
+		ref: t,
+		renderItem: l ? () => E : v.renderItem,
+		shape: p,
+		showFirstButton: l ? !1 : v.showFirstButton,
+		showLastButton: l ? !1 : v.showLastButton,
+		size: m,
+		style: h,
+		sx: g,
+		variant: _
+	});
+});
+K.displayName = "SPagination";
+//#endregion
+export { K as t };

package/dist/s-pixel-reveal/index.d.ts

@@ -1,2 +1,3 @@
 export { default, default as SPixelReveal } from './s-pixel-reveal';
-export type { SPixelRevealProps } from './s-pixel-reveal';
+export type { SPixelRevealOwnerState, SPixelRevealProps } from './s-pixel-reveal';
+export type {} from '../theme/component-augmentation';

package/dist/s-pixel-reveal/s-pixel-reveal.d.ts

@@ -1,8 +1,9 @@
 import { default as React } from 'react';
+import { BoxProps } from '@mui/material';
 /**
  * Props interface for SPixelReveal component
  */
-export interface SPixelRevealProps extends Omit<React.HTMLAttributes<HTMLDivElement>, 'children'> {
+export interface SPixelRevealProps extends Omit<BoxProps, 'children' | 'component'> {
     /** Spacing between pixels in the grid */
     gap?: number;
     /** Animation speed multiplier (0-100) */
@@ -20,5 +21,12 @@ export interface SPixelRevealProps extends Omit<React.HTMLAttributes<HTMLDivElem
     /** If true, all pixels appear immediately without wave/delay effect */
     instant?: boolean;
 }
-export declare const SPixelReveal: React.ForwardRefExoticComponent<SPixelRevealProps & React.RefAttributes<HTMLDivElement>>;
+export interface SPixelRevealOwnerState extends SPixelRevealProps {
+    gap: number;
+    hasImage: boolean;
+    instant: boolean;
+    loading: boolean;
+    speed: number;
+}
+export declare const SPixelReveal: React.ForwardRefExoticComponent<Omit<SPixelRevealProps, "ref"> & React.RefAttributes<HTMLDivElement>>;
 export default SPixelReveal;