@solostylist/ui-kit 2.0.1 → 2.0.3

package/dist/s-animated-gradient-text/index.d.ts

@@ -0,0 +1,2 @@
+export { default, default as SAnimatedGradientText } from './s-animated-gradient-text';
+export type { SAnimatedGradientTextDirection, SAnimatedGradientTextComponent, SAnimatedGradientTextOwnProps, SAnimatedGradientTextOwnerState, SAnimatedGradientTextProps, SAnimatedGradientTextSlotProps, SAnimatedGradientTextSlots, } from './s-animated-gradient-text';

package/dist/s-animated-gradient-text/index.js

@@ -0,0 +1,2 @@
+import { SAnimatedGradientText as e } from "./s-animated-gradient-text.js";
+export { e as SAnimatedGradientText, e as default };

package/dist/s-animated-gradient-text/s-animated-gradient-text.d.ts

@@ -0,0 +1,64 @@
+import { TypographyOwnProps, TypographyProps } from '@mui/material';
+import { OwnerStateSlotProps } from '../utils/slots';
+import * as React from 'react';
+/** Axis the gradient sweeps along. */
+export type SAnimatedGradientTextDirection = 'diagonal' | 'horizontal' | 'vertical';
+interface SAnimatedGradientTextBaseProps extends Omit<TypographyOwnProps, 'children' | 'color'> {
+    /** Reverses the sweep on alternate cycles instead of restarting it. */
+    alternate?: boolean;
+    /** Duration of one gradient sweep, in milliseconds. */
+    animationDuration?: number;
+    /** Text content painted with the animated gradient. */
+    children: React.ReactNode;
+    /**
+     * At least two gradient stop colors, in order. The first stop is repeated at
+     * the end so a non-alternating loop wraps without a seam. Defaults to the theme
+     * primary and secondary semantic colors, so palette switches follow along.
+     */
+    colors?: readonly [string, string, ...string[]];
+    /** Axis the gradient sweeps along. */
+    direction?: SAnimatedGradientTextDirection;
+    /** Freezes the sweep while a fine pointer is over the text. */
+    pauseOnHover?: boolean;
+    /** Freezes the sweep. */
+    paused?: boolean;
+}
+export interface SAnimatedGradientTextOwnProps extends SAnimatedGradientTextBaseProps {
+    /** Components used for internal structural slots. */
+    slots?: SAnimatedGradientTextSlots;
+    /** Props or owner-state callbacks for internal structural slots. */
+    slotProps?: SAnimatedGradientTextSlotProps;
+}
+/** Props for <SAnimatedGradientText>. */
+export type SAnimatedGradientTextProps = SAnimatedGradientTextOwnProps & Omit<TypographyProps, keyof SAnimatedGradientTextOwnProps | 'children' | 'color'> & {
+    /**
+     * The root element or component rendered by MUI Typography.
+     *
+     * The public component overload narrows its native props when this is set.
+     */
+    component?: React.ElementType;
+};
+export interface SAnimatedGradientTextOwnerState extends SAnimatedGradientTextBaseProps {
+    alternate: boolean;
+    animationDuration: number;
+    direction: SAnimatedGradientTextDirection;
+    pauseOnHover: boolean;
+    paused: boolean;
+}
+export interface SAnimatedGradientTextSlots {
+    /** Component used for the root slot. */
+    root?: React.ElementType;
+}
+export interface SAnimatedGradientTextSlotProps {
+    /** Props or owner-state callback applied to the root slot. */
+    root?: OwnerStateSlotProps<Omit<TypographyProps, 'children' | 'color'>, SAnimatedGradientTextOwnerState>;
+}
+export interface SAnimatedGradientTextComponent {
+    <RootComponent extends React.ElementType = 'span'>(props: {
+        /** The root element or component rendered by MUI Typography. */
+        component?: RootComponent;
+    } & SAnimatedGradientTextOwnProps & Omit<React.ComponentPropsWithRef<NoInfer<RootComponent>>, keyof SAnimatedGradientTextOwnProps | 'children' | 'color' | 'component'>): React.JSX.Element | null;
+    displayName?: string;
+}
+export declare const SAnimatedGradientText: SAnimatedGradientTextComponent;
+export default SAnimatedGradientText;

package/dist/s-animated-gradient-text/s-animated-gradient-text.js

@@ -0,0 +1,92 @@
+import { resolveOwnerStateSlotProps as e } from "../utils/slots.js";
+import * as t from "react";
+import { jsx as n } from "react/jsx-runtime";
+import { Typography as r, keyframes as i, styled as a, useThemeProps as o } from "@mui/material";
+import { mergeSlotProps as s, useForkRef as c } from "@mui/material/utils";
+import l from "@mui/utils/appendOwnerState";
+//#region lib/s-animated-gradient-text/s-animated-gradient-text.tsx
+var u = i`
+  from { background-position: 0% 50%; }
+  to { background-position: 100% 50%; }
+`, d = i`
+  from { background-position: 50% 0%; }
+  to { background-position: 50% 100%; }
+`, f = {
+	diagonal: {
+		angle: "to bottom right",
+		backgroundSize: "300% 300%",
+		keyframe: i`
+  from { background-position: 0% 0%; }
+  to { background-position: 100% 100%; }
+`
+	},
+	horizontal: {
+		angle: "to right",
+		backgroundSize: "300% 100%",
+		keyframe: u
+	},
+	vertical: {
+		angle: "to bottom",
+		backgroundSize: "100% 300%",
+		keyframe: d
+	}
+}, p = 200 / 3, m = (e, t) => {
+	let n = (e.vars ?? e).palette, { angle: r, backgroundSize: i, keyframe: a } = f[t.direction], o = t.colors?.length ? t.colors : [n.primary.main, n.secondary.main], s = [...o, o[0]].map((e, t) => `${e} ${t / o.length * p}%`).join(", ");
+	return {
+		animation: `${a} ${t.animationDuration}ms linear infinite`,
+		animationDirection: t.alternate ? "alternate" : "normal",
+		backgroundImage: `repeating-linear-gradient(${r}, ${s})`,
+		backgroundRepeat: "no-repeat",
+		backgroundSize: i,
+		"@media (prefers-reduced-motion: reduce)": {
+			animation: "none",
+			backgroundPosition: "center"
+		}
+	};
+}, h = a(r, {
+	name: "SAnimatedGradientText",
+	slot: "Root",
+	shouldForwardProp: (e) => e !== "ownerState"
+})(({ ownerState: e, theme: t }) => ({
+	...m(t, e),
+	backgroundClip: "text",
+	color: "transparent",
+	display: "inline-block",
+	WebkitBackgroundClip: "text",
+	WebkitTextFillColor: "transparent",
+	"@media (forced-colors: active)": {
+		backgroundImage: "none",
+		color: "CanvasText",
+		WebkitTextFillColor: "revert"
+	},
+	variants: [{
+		props: ({ ownerState: e }) => e.paused,
+		style: { animationPlayState: "paused" }
+	}, {
+		props: ({ ownerState: e }) => e.pauseOnHover,
+		style: { "@media (hover: hover) and (pointer: fine)": { "&:hover": { animationPlayState: "paused" } } }
+	}]
+}));
+function g(t, r) {
+	let i = o({
+		props: t,
+		name: "SAnimatedGradientText"
+	}), { alternate: a = !0, animationDuration: u = 8e3, children: d, colors: f, direction: p = "horizontal", pauseOnHover: m = !1, paused: g = !1, slotProps: _, slots: v, ...y } = i, b = {
+		...i,
+		alternate: a,
+		animationDuration: u,
+		colors: f,
+		direction: p,
+		pauseOnHover: m,
+		paused: g
+	}, x = v?.root ?? h, { ref: S, ...C } = l(x, s(e(_?.root, b), y), b), w = c(S, r);
+	return /* @__PURE__ */ n(x, {
+		...C,
+		ref: w,
+		children: d
+	});
+}
+var _ = t.forwardRef(g);
+_.displayName = "SAnimatedGradientText";
+//#endregion
+export { _ as SAnimatedGradientText, _ as default };

package/dist/s-announcement-bar/index.d.ts

@@ -0,0 +1,2 @@
+export { default, default as SAnnouncementBar } from './s-announcement-bar';
+export type { SAnnouncementBarOwnerState, SAnnouncementBarProps, SAnnouncementBarSlotProps, SAnnouncementBarSlots, SAnnouncementBarVariant, } from './s-announcement-bar';

package/dist/s-announcement-bar/index.js

@@ -0,0 +1,2 @@
+import { SAnnouncementBar as e } from "./s-announcement-bar.js";
+export { e as SAnnouncementBar, e as default };

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

@@ -0,0 +1,113 @@
+import { BoxProps, ChipProps, ContainerProps, TypographyProps } from '@mui/material';
+import { SIconButtonProps } from '../s-icon-button';
+import { OwnerStateSlotProps as MuiOwnerStateSlotProps } from '../utils/slots';
+import * as React from 'react';
+/** Background treatment of the bar. */
+export type SAnnouncementBarVariant = 'announcement' | 'plain';
+export interface SAnnouncementBarSlots {
+    /** Trailing cluster holding `actions`. */
+    actions?: React.ElementType;
+    /** Leading label chip. */
+    badge?: React.ElementType;
+    /** Width-constraining row inside the bar. */
+    container?: React.ElementType;
+    /** Button that dismisses the bar. */
+    dismissButton?: React.ElementType;
+    /** Button that toggles the collapsed action row on small screens. */
+    expandToggle?: React.ElementType;
+    /** Bloom layer anchored to the trailing side. */
+    glowEnd?: React.ElementType;
+    /** Bloom layer anchored to the leading side. */
+    glowStart?: React.ElementType;
+    /** Announcement message. */
+    message?: React.ElementType;
+    /** Full-bleed bar surface. */
+    root?: React.ElementType;
+}
+type OwnerStateSlotProps<Props> = MuiOwnerStateSlotProps<Props, SAnnouncementBarOwnerState>;
+export interface SAnnouncementBarSlotProps {
+    /** Props or owner-state callback for the actions slot. */
+    actions?: OwnerStateSlotProps<Omit<BoxProps, 'children'>>;
+    /** Props or owner-state callback for the badge slot. */
+    badge?: OwnerStateSlotProps<Omit<ChipProps, 'children' | 'label'>>;
+    /** Props or owner-state callback for the container slot. */
+    container?: OwnerStateSlotProps<Omit<ContainerProps, 'children'>>;
+    /** Props or owner-state callback for the dismiss button slot. */
+    dismissButton?: OwnerStateSlotProps<Omit<SIconButtonProps, 'children'>>;
+    /** Props or owner-state callback for the expand toggle slot. */
+    expandToggle?: OwnerStateSlotProps<Omit<SIconButtonProps, 'children'>>;
+    /** Props or owner-state callback for the trailing glow slot. */
+    glowEnd?: OwnerStateSlotProps<Omit<BoxProps, 'children'>>;
+    /** Props or owner-state callback for the leading glow slot. */
+    glowStart?: OwnerStateSlotProps<Omit<BoxProps, 'children'>>;
+    /** Props or owner-state callback for the message slot. */
+    message?: OwnerStateSlotProps<Omit<TypographyProps, 'children'>>;
+    /** Props or owner-state callback for the root slot. */
+    root?: OwnerStateSlotProps<Omit<BoxProps, 'children'>>;
+}
+/** Props for a full-bleed announcement bar. */
+export interface SAnnouncementBarProps extends Omit<BoxProps, 'children' | 'component' | 'title'> {
+    /** Trailing content — social links, a locale switcher, a call to action. */
+    actions?: React.ReactNode;
+    /** Duration of one gradient pan, in milliseconds. */
+    animationDuration?: number;
+    /** Leading label, rendered inside an `SChip`. */
+    badge?: React.ReactNode;
+    /** Announcement message. */
+    children?: React.ReactNode;
+    /** Accessible name of the expand toggle while the action row is open. */
+    collapseLabel?: string;
+    /**
+     * Collapses `actions` behind a toggle below the `sm` breakpoint, so a long
+     * message and a wide action row never fight for the same line on mobile.
+     */
+    collapsible?: boolean;
+    /**
+     * Gradient stop colors of the `announcement` variant, in order. Defaults to
+     * the live brand and secondary ramps so a palette switch follows along.
+     */
+    colors?: string[];
+    /** Initial expanded state of the collapsible action row. */
+    defaultExpanded?: boolean;
+    /** Initial visibility for uncontrolled dismissal. */
+    defaultOpen?: boolean;
+    /** Accessible name of the dismiss button. */
+    dismissLabel?: string;
+    /** Renders a dismiss button at the trailing end of the bar. */
+    dismissible?: boolean;
+    /** Expanded state of the collapsible action row for controlled usage. */
+    expanded?: boolean;
+    /** Accessible name of the expand toggle while the action row is closed. */
+    expandLabel?: string;
+    /** Called when the dismiss button is pressed. */
+    onClose?: (event: React.MouseEvent<HTMLButtonElement>) => void;
+    /** Called with the next expanded state when the toggle is pressed. */
+    onExpandedChange?: (event: React.MouseEvent<HTMLButtonElement>, expanded: boolean) => void;
+    /** Visibility for controlled dismissal. */
+    open?: boolean;
+    /** Freezes the gradient pan and the glow cycle. */
+    paused?: boolean;
+    /** Props or owner-state callbacks for internal structural slots. */
+    slotProps?: SAnnouncementBarSlotProps;
+    /** Components used for internal structural slots. */
+    slots?: SAnnouncementBarSlots;
+    /** Background treatment of the bar. */
+    variant?: SAnnouncementBarVariant;
+}
+export interface SAnnouncementBarOwnerState extends SAnnouncementBarProps {
+    animationDuration: number;
+    collapsible: boolean;
+    dismissible: boolean;
+    expanded: boolean;
+    open: boolean;
+    paused: boolean;
+    variant: SAnnouncementBarVariant;
+}
+/**
+ * Full-bleed announcement bar with a badge, a message, an action cluster and an
+ * optional dismiss control. The `announcement` variant paints an animated brand
+ * gradient with two drifting glow layers, all of which stop under
+ * `prefers-reduced-motion` or when `paused` is set.
+ */
+export declare const SAnnouncementBar: React.ForwardRefExoticComponent<Omit<SAnnouncementBarProps, "ref"> & React.RefAttributes<HTMLDivElement>>;
+export default SAnnouncementBar;

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

@@ -0,0 +1,272 @@
+import { toSxArray as e } from "../utils/sx.js";
+import { resolveOwnerStateSlotProps as t } from "../utils/slots.js";
+import { SIconButton as n } from "../s-icon-button/s-icon-button.js";
+import { SChip as r } from "../s-chip/s-chip.js";
+import * as i from "react";
+import { Fragment as a, jsx as o, jsxs as s } from "react/jsx-runtime";
+import { Box as c, Container as l, Typography as u, keyframes as d, styled as f, useThemeProps as p } from "@mui/material";
+import { mergeSlotProps as m, useControlled as h, useEventCallback as g, useForkRef as _ } from "@mui/material/utils";
+import v from "@mui/utils/appendOwnerState";
+import ee from "@mui/icons-material/Close";
+import te from "@mui/icons-material/Add";
+import y from "@mui/icons-material/Remove";
+//#region lib/s-announcement-bar/s-announcement-bar.tsx
+var b = "@media (prefers-reduced-motion: reduce)", x = "-45%", S = "blur(58px) saturate(105%)", C = "scale(1.14)", w = "blur(8px) saturate(115%)", T = "100% 100%, 220% 220%", E = "115deg", D = .34, O = "--SAnnouncementBar-scrimOpacity", k = .62, A = d`
+  0% { background-position: 0 0, 0% 50%; }
+  50% { background-position: 0 0, 100% 50%; }
+  100% { background-position: 0 0, 0% 50%; }
+`, j = d`
+  0%, 28% { opacity: 0; }
+  33%, 61% { opacity: 0.36; }
+  66%, 100% { opacity: 0; }
+`, M = d`
+  0%, 61% { opacity: 0; }
+  66%, 94% { opacity: 0.28; }
+  100% { opacity: 0; }
+`, N = ({ ownerState: e }) => e.variant === "announcement", P = (e, t) => {
+	let n = (e.vars ?? e).palette;
+	return t.colors?.length ? t.colors : [
+		n.primary[900],
+		n.primary[600],
+		n.secondary[400],
+		n.secondary[200]
+	];
+}, F = (e) => e.map((t, n) => `${t} ${n / Math.max(e.length - 1, 1) * 100}%`).join(", "), I = (e, t, n) => ({
+	animation: `${n} ${t.animationDuration}ms ${e.transitions.easing.easeInOut} infinite`,
+	filter: S,
+	inset: x,
+	opacity: 0,
+	pointerEvents: "none",
+	position: "absolute",
+	transform: C,
+	willChange: "opacity",
+	zIndex: 0,
+	[b]: {
+		animation: "none",
+		opacity: .3
+	}
+}), ne = f(c, {
+	name: "SAnnouncementBar",
+	slot: "Root",
+	shouldForwardProp: (e) => e !== "ownerState"
+})(({ ownerState: e, theme: t }) => {
+	let n = (t.vars ?? t).palette, r = `rgba(${n.background.paperChannel} / var(${O}))`;
+	return {
+		...t.typography.body2,
+		minHeight: t.spacing(5),
+		overflow: "hidden",
+		position: "relative",
+		width: "100%",
+		variants: [
+			{
+				props: ({ ownerState: e }) => e.variant === "plain",
+				style: {
+					backgroundColor: n.background.paper,
+					borderBottom: `1px solid ${n.divider}`,
+					color: n.text.primary
+				}
+			},
+			{
+				props: N,
+				style: {
+					[O]: k,
+					animation: `${A} ${e.animationDuration}ms ${t.transitions.easing.easeInOut} infinite`,
+					backdropFilter: w,
+					backgroundImage: `linear-gradient(${r}, ${r}), linear-gradient(${E}, ${F(P(t, e))})`,
+					backgroundSize: T,
+					borderBottom: `1px solid rgba(${n.primary.mainChannel} / ${D})`,
+					boxShadow: t.shadows[1],
+					color: n.text.primary,
+					isolation: "isolate",
+					[b]: {
+						animation: "none",
+						backgroundPosition: "0 0, 50% 50%"
+					}
+				}
+			},
+			{
+				props: ({ ownerState: e }) => e.paused,
+				style: { "&, & > *": { animationPlayState: "paused" } }
+			}
+		]
+	};
+}), re = f(c, {
+	name: "SAnnouncementBar",
+	slot: "GlowStart",
+	shouldForwardProp: (e) => e !== "ownerState"
+})(({ ownerState: e, theme: t }) => {
+	let n = P(t, e);
+	return {
+		...I(t, e, j),
+		backgroundImage: `radial-gradient(circle at 18% 50%, ${n[n.length - 1]} 0%, ${n[Math.max(n.length - 2, 0)]} 36%, transparent 70%)`
+	};
+}), ie = f(c, {
+	name: "SAnnouncementBar",
+	slot: "GlowEnd",
+	shouldForwardProp: (e) => e !== "ownerState"
+})(({ ownerState: e, theme: t }) => {
+	let n = P(t, e);
+	return {
+		...I(t, e, M),
+		backgroundImage: `radial-gradient(circle at 82% 50%, ${n[Math.min(1, n.length - 1)]} 0%, ${n[0]} 38%, transparent 72%)`
+	};
+}), ae = f(l, {
+	name: "SAnnouncementBar",
+	slot: "Container",
+	shouldForwardProp: (e) => e !== "ownerState"
+})(({ theme: e }) => ({
+	alignItems: "center",
+	display: "flex",
+	flexWrap: "wrap",
+	gap: e.spacing(1),
+	minHeight: e.spacing(5),
+	paddingBlock: e.spacing(.5),
+	position: "relative",
+	zIndex: 1
+})), oe = f(r, {
+	name: "SAnnouncementBar",
+	slot: "Badge",
+	shouldForwardProp: (e) => e !== "ownerState"
+})(({ theme: e }) => ({
+	flexShrink: 0,
+	height: e.spacing(3),
+	variants: [{ props: N }]
+})), se = f(u, {
+	name: "SAnnouncementBar",
+	slot: "Message",
+	shouldForwardProp: (e) => e !== "ownerState"
+})({
+	flex: "1 1 auto",
+	minWidth: 0
+}), ce = f(c, {
+	name: "SAnnouncementBar",
+	slot: "Actions",
+	shouldForwardProp: (e) => e !== "ownerState"
+})(({ theme: e }) => ({
+	alignItems: "center",
+	color: "inherit",
+	display: "flex",
+	flexShrink: 0,
+	gap: e.spacing(1.5),
+	marginInlineStart: "auto",
+	"& a": { color: "inherit" },
+	variants: [{
+		props: ({ ownerState: e }) => e.collapsible,
+		style: { [e.breakpoints.down("sm")]: { display: "none" } }
+	}, {
+		props: ({ ownerState: e }) => e.collapsible && e.expanded,
+		style: { [e.breakpoints.down("sm")]: {
+			display: "flex",
+			flexBasis: "100%",
+			marginInlineStart: 0,
+			order: 4
+		} }
+	}]
+})), le = f(n, {
+	name: "SAnnouncementBar",
+	slot: "ExpandToggle",
+	shouldForwardProp: (e) => e !== "ownerState"
+})(({ theme: e }) => ({
+	display: "none",
+	flexShrink: 0,
+	order: 2,
+	[e.breakpoints.down("sm")]: { display: "inline-flex" }
+})), ue = f(n, {
+	name: "SAnnouncementBar",
+	slot: "DismissButton",
+	shouldForwardProp: (e) => e !== "ownerState"
+})({
+	flexShrink: 0,
+	order: 3
+}), L = i.forwardRef(function(n, r) {
+	let c = p({
+		props: n,
+		name: "SAnnouncementBar"
+	}), { actions: l, animationDuration: u = 7e3, badge: d, children: f, collapseLabel: b = "Hide announcement details", collapsible: x = !1, colors: S, defaultExpanded: C = !1, defaultOpen: w = !0, dismissLabel: T = "Dismiss announcement", dismissible: E = !1, expandLabel: D = "Show announcement details", expanded: O, onClose: k, onExpandedChange: A, open: j, paused: M = !1, slotProps: N, slots: P, sx: F, variant: I = "plain", ...L } = c, [R, z] = h({
+		controlled: O,
+		default: C,
+		name: "SAnnouncementBar",
+		state: "expanded"
+	}), [B, V] = h({
+		controlled: j,
+		default: w,
+		name: "SAnnouncementBar",
+		state: "open"
+	}), H = {
+		...c,
+		animationDuration: u,
+		collapsible: x,
+		colors: S,
+		dismissible: E,
+		expanded: R,
+		open: B,
+		paused: M,
+		variant: I
+	}, U = P?.root ?? ne, W = P?.glowStart ?? re, G = P?.glowEnd ?? ie, K = P?.container ?? ae, q = P?.badge ?? oe, J = P?.message ?? se, Y = P?.actions ?? ce, X = P?.expandToggle ?? le, Z = P?.dismissButton ?? ue, Q = `${i.useId()}-actions`, de = g((e) => {
+		let t = !R;
+		z(t), A?.(e, t);
+	}), fe = g((e) => {
+		V(!1), k?.(e);
+	}), { ref: pe, sx: me, ...he } = v(U, m(t(N?.root, H), {
+		...L,
+		"aria-label": L["aria-label"] ?? "Announcement",
+		role: "region"
+	}), H), ge = _(pe, r), $ = v(W, t(N?.glowStart, H) ?? {}, H), _e = v(G, t(N?.glowEnd, H) ?? {}, H), ve = v(K, t(N?.container, H) ?? {}, H), ye = v(q, m(t(N?.badge, H), {
+		color: "error",
+		size: "small"
+	}), H), be = v(J, m(t(N?.message, H), {
+		component: "span",
+		variant: "body2"
+	}), H), xe = v(Y, m(t(N?.actions, H), { id: Q }), H), Se = v(X, m(t(N?.expandToggle, H), {
+		"aria-controls": Q,
+		"aria-expanded": R,
+		"aria-label": R ? b : D,
+		color: "inherit",
+		onClick: de,
+		size: "small"
+	}), H), Ce = v(Z, m(t(N?.dismissButton, H), {
+		"aria-label": T,
+		color: "inherit",
+		onClick: fe,
+		size: "small"
+	}), H);
+	return B ? /* @__PURE__ */ s(U, {
+		...he,
+		ref: ge,
+		sx: [...e(me), ...e(F)],
+		children: [I === "announcement" ? /* @__PURE__ */ s(a, { children: [/* @__PURE__ */ o(W, {
+			...$,
+			"aria-hidden": !0
+		}), /* @__PURE__ */ o(G, {
+			..._e,
+			"aria-hidden": !0
+		})] }) : null, /* @__PURE__ */ s(K, {
+			...ve,
+			children: [
+				d == null ? null : /* @__PURE__ */ o(q, {
+					...ye,
+					label: d
+				}),
+				f == null ? null : /* @__PURE__ */ o(J, {
+					...be,
+					children: f
+				}),
+				l == null ? null : /* @__PURE__ */ o(Y, {
+					...xe,
+					children: l
+				}),
+				x && l != null ? /* @__PURE__ */ o(X, {
+					...Se,
+					children: o(R ? y : te, {})
+				}) : null,
+				E ? /* @__PURE__ */ o(Z, {
+					...Ce,
+					children: /* @__PURE__ */ o(ee, {})
+				}) : null
+			]
+		})]
+	}) : null;
+});
+L.displayName = "SAnnouncementBar";
+//#endregion
+export { L as SAnnouncementBar, L as default };

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

@@ -17,6 +17,8 @@ export interface SCarouselSlotProps {
     dots?: Omit<BoxProps<'ul'>, 'ref'>;
     nextButton?: SIconButtonProps;
     previousButton?: SIconButtonProps;
+    /** Props for the Embla overflow viewport. */
+    viewport?: Omit<BoxProps<'div'>, 'children' | 'ref'>;
 }
 export interface SCarouselProps extends Omit<BoxProps, 'children' | 'component'> {
     /** Carousel slides. */