@seedgrid/fe-components 2026.3.5 → 2026.3.11

package/dist/buttons/SgFloatActionButton.d.ts

@@ -1,7 +1,6 @@
 import * as React from "react";
 export type FABPosition = "left-top" | "left-center" | "left-bottom" | "center-top" | "center-bottom" | "right-top" | "right-center" | "right-bottom";
 export type FABSeverity = "primary" | "secondary" | "success" | "info" | "warning" | "help" | "danger" | "plain";
-export type FABVariant = FABSeverity;
 export type FABSize = "sm" | "md" | "lg";
 export type FABShape = "circle" | "rounded" | "square";
 export type FABElevation = "none" | "sm" | "md" | "lg";
@@ -13,7 +12,7 @@ export type SgFABAction = {
     label?: string;
     onClick?: () => void;
     severity?: FABSeverity;
-    variant?: FABSeverity;
+    floatActionButtonStyle?: FABSeverity;
     disabled?: boolean;
 };
 export type SgFloatActionButtonProps = {
@@ -30,7 +29,7 @@ export type SgFloatActionButtonProps = {
     enableDragDrop?: boolean;
     dragId?: string;
     severity?: FABSeverity;
-    variant?: FABSeverity;
+    floatActionButtonStyle?: FABSeverity;
     color?: string;
     size?: FABSize;
     shape?: FABShape;

package/dist/buttons/SgFloatActionButton.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"SgFloatActionButton.d.ts","sourceRoot":"","sources":["../../src/buttons/SgFloatActionButton.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAuC/B,MAAM,MAAM,WAAW,GACnB,UAAU,GAAG,aAAa,GAAG,aAAa,GAC1C,YAAY,GAAG,eAAe,GAC9B,WAAW,GAAG,cAAc,GAAG,cAAc,CAAC;AAElD,MAAM,MAAM,WAAW,GACnB,SAAS,GACT,WAAW,GACX,SAAS,GACT,MAAM,GACN,SAAS,GACT,MAAM,GACN,QAAQ,GACR,OAAO,CAAC;AAEZ,MAAM,MAAM,UAAU,GAAG,WAAW,CAAC;AACrC,MAAM,MAAM,OAAO,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;AACzC,MAAM,MAAM,QAAQ,GAAG,QAAQ,GAAG,SAAS,GAAG,QAAQ,CAAC;AACvD,MAAM,MAAM,YAAY,GAAG,MAAM,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;AACvD,MAAM,MAAM,YAAY,GAAG,OAAO,GAAG,OAAO,GAAG,MAAM,GAAG,QAAQ,GAAG,OAAO,GAAG,MAAM,CAAC;AACpF,MAAM,MAAM,mBAAmB,GAAG,OAAO,GAAG,OAAO,GAAG,OAAO,CAAC;AAC9D,MAAM,MAAM,aAAa,GAAG,QAAQ,GAAG,QAAQ,GAAG,aAAa,GAAG,gBAAgB,CAAC;AAEnF,MAAM,MAAM,WAAW,GAAG;IACxB,IAAI,EAAE,KAAK,CAAC,SAAS,CAAC;IACtB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,QAAQ,CAAC,EAAE,WAAW,CAAC;IAEvB,OAAO,CAAC,EAAE,WAAW,CAAC;IACtB,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB,CAAC;AAEF,MAAM,MAAM,wBAAwB,GAAG;IACrC,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,YAAY,CAAC,EAAE,KAAK,GAAG,OAAO,GAAG,QAAQ,GAAG,MAAM,CAAC;IACnD,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,IAAI,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACvB,UAAU,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC7B,QAAQ,CAAC,EAAE,WAAW,CAAC;IACvB,MAAM,CAAC,EAAE;QAAE,CAAC,CAAC,EAAE,MAAM,CAAC;QAAC,CAAC,CAAC,EAAE,MAAM,CAAA;KAAE,CAAC;IACpC,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,QAAQ,CAAC,EAAE,WAAW,CAAC;IAEvB,OAAO,CAAC,EAAE,WAAW,CAAC;IACtB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,KAAK,CAAC,EAAE,QAAQ,CAAC;IACjB,SAAS,CAAC,EAAE,YAAY,CAAC;IACzB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B,aAAa,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IAC9B,SAAS,CAAC,EAAE,YAAY,CAAC;IACzB,WAAW,CAAC,EAAE,mBAAmB,CAAC;IAClC,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAC3B,SAAS,CAAC,EAAE,IAAI,GAAG,MAAM,GAAG,MAAM,GAAG,OAAO,CAAC;IAC7C,IAAI,CAAC,EAAE,aAAa,CAAC;IACrB,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,OAAO,CAAC,EAAE,WAAW,EAAE,CAAC;IACxB,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,KAAK,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;IAC5B,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB,CAAC;AA6NF,wBAAgB,mBAAmB,CAAC,KAAK,EAAE,QAAQ,CAAC,wBAAwB,CAAC,2CAyhB5E;yBAzhBe,mBAAmB"}
+{"version":3,"file":"SgFloatActionButton.d.ts","sourceRoot":"","sources":["../../src/buttons/SgFloatActionButton.tsx"],"names":[],"mappings":"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"}

package/dist/buttons/SgFloatActionButton.js

@@ -214,7 +214,7 @@ export function SgFloatActionButton(props) {
     const i18n = useComponentsI18n();
     const hasEnvironmentProvider = useHasSgEnvironmentProvider();
     const { load: loadPersistedState, save: savePersistedState, clear: clearPersistedState } = useSgPersistence();
-    const { hint, hintDelay = 300, icon, activeIcon, position = "right-bottom", offset, enableDragDrop = false, dragId, severity = "primary", variant, color, size = "md", shape = "circle", elevation = "md", disabled = false, loading = false, autoHideOnScroll = false, hideDirection = "down", animation = "scale", animationOn = "mount", animationDuration = 200, type = "linear", radius, transitionDelay = 30, actions, onClick, className, style, zIndex = 50, absolute = false, } = props;
+    const { hint, hintDelay = 300, icon, activeIcon, position = "right-bottom", offset, enableDragDrop = false, dragId, severity = "primary", floatActionButtonStyle, color, size = "md", shape = "circle", elevation = "md", disabled = false, loading = false, autoHideOnScroll = false, hideDirection = "down", animation = "scale", animationOn = "mount", animationDuration = 200, type = "linear", radius, transitionDelay = 30, actions, onClick, className, style, zIndex = 50, absolute = false, } = props;
     const hintPos = props.hintPosition ?? DEFAULT_HINT[position];
     const dir = props.direction ?? DEFAULT_DIR[position];
     const [mounted, setMounted] = React.useState(false);
@@ -512,7 +512,7 @@ export function SgFloatActionButton(props) {
         dragMoved.current = false;
     }, [clearStoredPosition, dragId]);
     /* colors */
-    const resolvedSeverity = severity ?? variant ?? "primary";
+    const resolvedSeverity = severity ?? floatActionButtonStyle ?? "primary";
     const c = COLORS[resolvedSeverity];
     const bg = color ?? c.bg;
     const fg = color ? "white" : c.fg;
@@ -629,7 +629,7 @@ export function SgFloatActionButton(props) {
             handleContextMenu(event);
         }, children: [animation === "pulse" && (_jsx("style", { children: `@keyframes sg-fab-pulse{0%,100%{transform:scale(1)}50%{transform:scale(1.08)}}` })), actions?.map((a, i) => {
                 const p = actPos[i] ?? { x: 0, y: 0 };
-                const actionSeverity = a.severity ?? a.variant ?? "plain";
+                const actionSeverity = a.severity ?? a.floatActionButtonStyle ?? "plain";
                 const ac = COLORS[actionSeverity];
                 return (_jsx("div", { className: "absolute", style: {
                         transform: open ? `translate(${p.x}px, ${p.y}px) scale(1)` : "translate(0,0) scale(0)",

package/dist/buttons/SgSplitButton.d.ts

@@ -26,6 +26,7 @@ export type SgSplitButtonProps = {
     items: SgSplitButtonItem[];
     customColors?: SgButtonCustomColors;
     className?: string;
+    style?: React.CSSProperties;
 };
 export declare const SgSplitButton: React.ForwardRefExoticComponent<SgSplitButtonProps & React.RefAttributes<HTMLDivElement>>;
 export {};

package/dist/buttons/SgSplitButton.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"SgSplitButton.d.ts","sourceRoot":"","sources":["../../src/buttons/SgSplitButton.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,KAAK,EAAE,oBAAoB,EAAE,MAAM,YAAY,CAAC;AAEvD,KAAK,QAAQ,GACT,SAAS,GACT,WAAW,GACX,SAAS,GACT,MAAM,GACN,SAAS,GACT,MAAM,GACN,QAAQ,CAAC;AAEb,KAAK,UAAU,GAAG,OAAO,GAAG,SAAS,GAAG,OAAO,CAAC;AAEhD,KAAK,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;AAE/B,KAAK,KAAK,GAAG,SAAS,GAAG,SAAS,GAAG,QAAQ,CAAC;AAE9C,KAAK,SAAS,GAAG,MAAM,GAAG,IAAI,GAAG,IAAI,CAAC;AAEtC,MAAM,MAAM,iBAAiB,GAAG;IAC9B,KAAK,EAAE,MAAM,CAAC;IACd,IAAI,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACvB,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,SAAS,CAAC,EAAE,OAAO,CAAC;CACrB,CAAC;AAEF,MAAM,MAAM,kBAAkB,GAAG;IAC/B,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B,QAAQ,CAAC,EAAE,QAAQ,CAAC;IACpB,UAAU,CAAC,EAAE,UAAU,CAAC;IACxB,IAAI,CAAC,EAAE,IAAI,CAAC;IACZ,KAAK,CAAC,EAAE,KAAK,CAAC;IACd,SAAS,CAAC,EAAE,SAAS,CAAC;IACtB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,KAAK,EAAE,iBAAiB,EAAE,CAAC;IAC3B,YAAY,CAAC,EAAE,oBAAoB,CAAC;IACpC,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,CAAC;AAmBF,eAAO,MAAM,aAAa,2FAiIzB,CAAC"}
+{"version":3,"file":"SgSplitButton.d.ts","sourceRoot":"","sources":["../../src/buttons/SgSplitButton.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,KAAK,EAAE,oBAAoB,EAAE,MAAM,YAAY,CAAC;AAEvD,KAAK,QAAQ,GACT,SAAS,GACT,WAAW,GACX,SAAS,GACT,MAAM,GACN,SAAS,GACT,MAAM,GACN,QAAQ,CAAC;AAEb,KAAK,UAAU,GAAG,OAAO,GAAG,SAAS,GAAG,OAAO,CAAC;AAEhD,KAAK,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;AAE/B,KAAK,KAAK,GAAG,SAAS,GAAG,SAAS,GAAG,QAAQ,CAAC;AAE9C,KAAK,SAAS,GAAG,MAAM,GAAG,IAAI,GAAG,IAAI,CAAC;AAEtC,MAAM,MAAM,iBAAiB,GAAG;IAC9B,KAAK,EAAE,MAAM,CAAC;IACd,IAAI,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACvB,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,SAAS,CAAC,EAAE,OAAO,CAAC;CACrB,CAAC;AAEF,MAAM,MAAM,kBAAkB,GAAG;IAC/B,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B,QAAQ,CAAC,EAAE,QAAQ,CAAC;IACpB,UAAU,CAAC,EAAE,UAAU,CAAC;IACxB,IAAI,CAAC,EAAE,IAAI,CAAC;IACZ,KAAK,CAAC,EAAE,KAAK,CAAC;IACd,SAAS,CAAC,EAAE,SAAS,CAAC;IACtB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,KAAK,EAAE,iBAAiB,EAAE,CAAC;IAC3B,YAAY,CAAC,EAAE,oBAAoB,CAAC;IACpC,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,KAAK,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;CAC7B,CAAC;AAmBF,eAAO,MAAM,aAAa,2FAkIzB,CAAC"}

package/dist/buttons/SgSplitButton.js

@@ -5,7 +5,7 @@ import { SgButton } from "./SgButton";
 function ChevronDown({ className }) {
     return (_jsx("svg", { className: className, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", "aria-hidden": "true", children: _jsx("path", { d: "m6 9 6 6 6-6" }) }));
 }
-export const SgSplitButton = React.forwardRef(({ label, leftIcon, severity = "primary", appearance = "solid", size = "md", shape = "default", elevation = "none", disabled = false, loading = false, onClick, items, customColors, className }, ref) => {
+export const SgSplitButton = React.forwardRef(({ label, leftIcon, severity = "primary", appearance = "solid", size = "md", shape = "default", elevation = "none", disabled = false, loading = false, onClick, items, customColors, className, style }, ref) => {
     const [open, setOpen] = React.useState(false);
     const containerRef = React.useRef(null);
     const menuRef = React.useRef(null);
@@ -50,6 +50,6 @@ export const SgSplitButton = React.forwardRef(({ label, leftIcon, severity = "pr
         lg: { menu: "min-w-[180px]", item: "px-5 py-2.5", text: "text-base", iconSize: "size-5" }
     };
     const s = sizeClasses[size];
-    return (_jsxs("div", { ref: containerRef, className: `relative inline-flex ${className ?? ""}`, children: [_jsx(SgButton, { severity: severity, appearance: appearance, size: size, shape: shape, elevation: elevation, disabled: disabled, loading: loading, leftIcon: leftIcon, onClick: onClick, customColors: customColors, className: "rounded-r-none", children: label }), _jsx(SgButton, { severity: severity, appearance: appearance, size: size, shape: shape, elevation: elevation, disabled: disabled || loading, leftIcon: _jsx(ChevronDown, { className: "size-4" }), onClick: toggle, customColors: customColors, className: `rounded-l-none ${dividerBorderClass}`, "aria-haspopup": "true", "aria-expanded": open }), open && (_jsx("div", { ref: menuRef, role: "menu", className: `absolute left-0 top-full z-50 mt-1 ${s.menu} overflow-hidden rounded-lg shadow-lg bg-background text-foreground border border-border`, children: items.map((item, i) => (_jsxs(React.Fragment, { children: [item.separator && i > 0 ? (_jsx("div", { className: "my-0.5 border-t border-border" })) : null, _jsxs("button", { role: "menuitem", type: "button", disabled: item.disabled, className: `flex w-full items-center gap-2 ${s.item} ${s.text} transition-colors hover:bg-muted/60 disabled:opacity-50 disabled:cursor-not-allowed`, onClick: () => handleItemClick(item), children: [item.icon ? _jsx("span", { className: `shrink-0 ${s.iconSize}`, children: item.icon }) : null, _jsx("span", { children: item.label })] })] }, i))) }))] }));
+    return (_jsxs("div", { ref: containerRef, className: `relative inline-flex ${className ?? ""}`, style: style, children: [_jsx(SgButton, { severity: severity, appearance: appearance, size: size, shape: shape, elevation: elevation, disabled: disabled, loading: loading, leftIcon: leftIcon, onClick: onClick, customColors: customColors, className: "rounded-r-none", children: label }), _jsx(SgButton, { severity: severity, appearance: appearance, size: size, shape: shape, elevation: elevation, disabled: disabled || loading, leftIcon: _jsx(ChevronDown, { className: "size-4" }), onClick: toggle, customColors: customColors, className: `rounded-l-none ${dividerBorderClass}`, "aria-haspopup": "true", "aria-expanded": open }), open && (_jsx("div", { ref: menuRef, role: "menu", className: `absolute left-0 top-full z-50 mt-1 ${s.menu} overflow-hidden rounded-lg shadow-lg bg-background text-foreground border border-border`, children: items.map((item, i) => (_jsxs(React.Fragment, { children: [item.separator && i > 0 ? (_jsx("div", { className: "my-0.5 border-t border-border" })) : null, _jsxs("button", { role: "menuitem", type: "button", disabled: item.disabled, className: `flex w-full items-center gap-2 ${s.item} ${s.text} transition-colors hover:bg-muted/60 disabled:opacity-50 disabled:cursor-not-allowed`, onClick: () => handleItemClick(item), children: [item.icon ? _jsx("span", { className: `shrink-0 ${s.iconSize}`, children: item.icon }) : null, _jsx("span", { children: item.label })] })] }, i))) }))] }));
 });
 SgSplitButton.displayName = "SgSplitButton";

package/dist/commons/SgBadge.d.ts

@@ -22,7 +22,7 @@ export type SgBadgePartsClassName = {
 export type SgBadgeProps = {
     value?: React.ReactNode;
     severity?: SgBadgeSeverity;
-    variant?: SgBadgeVariant;
+    badgeStyle?: SgBadgeVariant;
     size?: SgBadgeSize;
     rounded?: boolean;
     dot?: boolean;
@@ -41,6 +41,7 @@ export type SgBadgeProps = {
     hint?: string;
     customColors?: SgBadgeCustomColors;
     className?: string;
+    style?: React.CSSProperties;
     partsClassName?: SgBadgePartsClassName;
     "aria-label"?: string;
 };

package/dist/commons/SgBadge.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"SgBadge.d.ts","sourceRoot":"","sources":["../../src/commons/SgBadge.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,MAAM,MAAM,eAAe,GACvB,SAAS,GACT,WAAW,GACX,SAAS,GACT,SAAS,GACT,QAAQ,GACR,MAAM,GACN,SAAS,GACT,QAAQ,CAAC;AAEb,MAAM,MAAM,cAAc,GAAG,OAAO,GAAG,MAAM,GAAG,SAAS,GAAG,OAAO,CAAC;AACpE,MAAM,MAAM,WAAW,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;AAEpD,MAAM,MAAM,mBAAmB,GAAG;IAChC,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,IAAI,CAAC,EAAE,MAAM,CAAC;CACf,CAAC;AAEF,MAAM,MAAM,qBAAqB,GAAG;IAClC,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,GAAG,CAAC,EAAE,MAAM,CAAC;CACd,CAAC;AAEF,MAAM,MAAM,YAAY,GAAG;IACzB,KAAK,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACxB,QAAQ,CAAC,EAAE,eAAe,CAAC;IAC3B,OAAO,CAAC,EAAE,cAAc,CAAC;IACzB,IAAI,CAAC,EAAE,WAAW,CAAC;IACnB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,GAAG,CAAC,EAAE,OAAO,CAAC;IACd,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B,SAAS,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC5B,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,QAAQ,CAAC,EAAE,MAAM,IAAI,CAAC;IACtB,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,OAAO,CAAC,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,UAAU,KAAK,IAAI,CAAC;IACxC,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,YAAY,CAAC,EAAE,mBAAmB,CAAC;IACnC,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,cAAc,CAAC,EAAE,qBAAqB,CAAC;IACvC,YAAY,CAAC,EAAE,MAAM,CAAC;CACvB,CAAC;AA0HF,wBAAgB,OAAO,CAAC,KAAK,EAAE,QAAQ,CAAC,YAAY,CAAC,kDAiHpD;yBAjHe,OAAO"}
+{"version":3,"file":"SgBadge.d.ts","sourceRoot":"","sources":["../../src/commons/SgBadge.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,MAAM,MAAM,eAAe,GACvB,SAAS,GACT,WAAW,GACX,SAAS,GACT,SAAS,GACT,QAAQ,GACR,MAAM,GACN,SAAS,GACT,QAAQ,CAAC;AAEb,MAAM,MAAM,cAAc,GAAG,OAAO,GAAG,MAAM,GAAG,SAAS,GAAG,OAAO,CAAC;AACpE,MAAM,MAAM,WAAW,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;AAEpD,MAAM,MAAM,mBAAmB,GAAG;IAChC,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,IAAI,CAAC,EAAE,MAAM,CAAC;CACf,CAAC;AAEF,MAAM,MAAM,qBAAqB,GAAG;IAClC,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,GAAG,CAAC,EAAE,MAAM,CAAC;CACd,CAAC;AAEF,MAAM,MAAM,YAAY,GAAG;IACzB,KAAK,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACxB,QAAQ,CAAC,EAAE,eAAe,CAAC;IAC3B,UAAU,CAAC,EAAE,cAAc,CAAC;IAC5B,IAAI,CAAC,EAAE,WAAW,CAAC;IACnB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,GAAG,CAAC,EAAE,OAAO,CAAC;IACd,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B,SAAS,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC5B,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,QAAQ,CAAC,EAAE,MAAM,IAAI,CAAC;IACtB,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,OAAO,CAAC,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,UAAU,KAAK,IAAI,CAAC;IACxC,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,YAAY,CAAC,EAAE,mBAAmB,CAAC;IACnC,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,KAAK,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;IAC5B,cAAc,CAAC,EAAE,qBAAqB,CAAC;IACvC,YAAY,CAAC,EAAE,MAAM,CAAC;CACvB,CAAC;AA0HF,wBAAgB,OAAO,CAAC,KAAK,EAAE,QAAQ,CAAC,YAAY,CAAC,kDAmHpD;yBAnHe,OAAO"}

package/dist/commons/SgBadge.js

@@ -108,11 +108,12 @@ function getDisplayValue(value, max, showZero) {
     return value ?? null;
 }
 export function SgBadge(props) {
-    const { value, severity = "primary", variant = "solid", size = "md", rounded = true, dot = false, pulse = false, max, showZero = true, leftIcon, rightIcon, removable = false, onRemove, removeAriaLabel = "Remover", autoRemove = false, onClick, disabled, title, hint, customColors, className, partsClassName, ...aria } = props;
+    const { value, severity = "primary", badgeStyle = "solid", size = "md", rounded = true, dot = false, pulse = false, max, showZero = true, leftIcon, rightIcon, removable = false, onRemove, removeAriaLabel = "Remover", autoRemove = false, onClick, disabled, title, hint, customColors, className, style, partsClassName, ...aria } = props;
     const displayValue = getDisplayValue(value, max, showZero);
     const [autoRemoved, setAutoRemoved] = React.useState(false);
+    const cssVars = buildVars(severity, customColors);
     if (dot) {
-        return (_jsxs("span", { title: hint ?? title, className: cn("relative inline-flex items-center justify-center", partsClassName?.dot, className), style: buildVars(severity, customColors), ...aria, children: [pulse ? (_jsx("span", { className: "absolute inline-flex size-3 rounded-full bg-[var(--sg-badge-bg)] opacity-75 animate-ping" })) : null, _jsx("span", { className: "inline-flex size-2.5 rounded-full bg-[var(--sg-badge-bg)]" })] }));
+        return (_jsxs("span", { title: hint ?? title, className: cn("relative inline-flex items-center justify-center", partsClassName?.dot, className), style: { ...cssVars, ...style }, ...aria, children: [pulse ? (_jsx("span", { className: "absolute inline-flex size-3 rounded-full bg-[var(--sg-badge-bg)] opacity-75 animate-ping" })) : null, _jsx("span", { className: "inline-flex size-2.5 rounded-full bg-[var(--sg-badge-bg)]" })] }));
     }
     if (autoRemoved)
         return null;
@@ -120,18 +121,18 @@ export function SgBadge(props) {
         return null;
     const isButton = typeof onClick === "function";
     const Tag = isButton ? "button" : "span";
-    const base = cn("inline-flex items-center gap-1.5 whitespace-nowrap font-medium", "transition-[color,background-color,border-color] duration-150", SIZE[size], rounded ? "rounded-full" : "rounded-md", variant === "solid"
+    const base = cn("inline-flex items-center gap-1.5 whitespace-nowrap font-medium", "transition-[color,background-color,border-color] duration-150", SIZE[size], rounded ? "rounded-full" : "rounded-md", badgeStyle === "solid"
         ? "bg-[var(--sg-badge-bg)] text-[var(--sg-badge-fg)] border border-[var(--sg-badge-border)]"
-        : variant === "soft"
+        : badgeStyle === "soft"
             ? "bg-[var(--sg-badge-soft-bg)] text-[var(--sg-badge-soft-fg)] border border-transparent"
-            : variant === "outline"
+            : badgeStyle === "outline"
                 ? "bg-transparent text-[var(--sg-badge-bg)] border border-[var(--sg-badge-border)]"
-                : "bg-transparent text-[var(--sg-badge-bg)] border border-transparent", variant === "ghost" || variant === "outline"
+                : "bg-transparent text-[var(--sg-badge-bg)] border border-transparent", badgeStyle === "ghost" || badgeStyle === "outline"
         ? "hover:bg-[var(--sg-badge-hover-bg)] hover:text-[var(--sg-badge-hover-fg)] hover:border-[var(--sg-badge-hover-border)]"
         : "", isButton
         ? cn("cursor-pointer select-none", "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-[var(--sg-badge-ring)] focus-visible:ring-offset-2 focus-visible:ring-offset-background", disabled ? "pointer-events-none opacity-50" : "")
         : "", className, partsClassName?.container);
-    return (_jsxs(Tag, { type: isButton ? "button" : undefined, title: hint ?? title, onClick: disabled ? undefined : onClick, disabled: isButton ? disabled : undefined, style: buildVars(severity, customColors), className: base, role: isButton ? undefined : "status", ...aria, children: [leftIcon ? _jsx("span", { className: cn("inline-flex", ICON_SIZE[size]), children: leftIcon }) : null, displayValue !== null ? _jsx("span", { className: cn("inline-flex items-center", partsClassName?.label), children: displayValue }) : null, rightIcon ? _jsx("span", { className: cn("inline-flex", ICON_SIZE[size]), children: rightIcon }) : null, removable ? (_jsx("button", { type: "button", onClick: (e) => {
+    return (_jsxs(Tag, { type: isButton ? "button" : undefined, title: hint ?? title, onClick: disabled ? undefined : onClick, disabled: isButton ? disabled : undefined, style: { ...cssVars, ...style }, className: base, role: isButton ? undefined : "status", ...aria, children: [leftIcon ? _jsx("span", { className: cn("inline-flex", ICON_SIZE[size]), children: leftIcon }) : null, displayValue !== null ? _jsx("span", { className: cn("inline-flex items-center", partsClassName?.label), children: displayValue }) : null, rightIcon ? _jsx("span", { className: cn("inline-flex", ICON_SIZE[size]), children: rightIcon }) : null, removable ? (_jsx("button", { type: "button", onClick: (e) => {
                     e.stopPropagation();
                     if (autoRemove)
                         setAutoRemoved(true);

package/dist/commons/SgBadgeOverlay.d.ts

@@ -5,6 +5,7 @@ export type SgBadgeOverlayProps = {
     badge: React.ReactNode;
     placement?: SgBadgeOverlayPlacement;
     className?: string;
+    style?: React.CSSProperties;
 };
 export declare function SgBadgeOverlay(props: Readonly<SgBadgeOverlayProps>): import("react/jsx-runtime").JSX.Element;
 export declare namespace SgBadgeOverlay {

package/dist/commons/SgBadgeOverlay.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"SgBadgeOverlay.d.ts","sourceRoot":"","sources":["../../src/commons/SgBadgeOverlay.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAM/B,MAAM,MAAM,uBAAuB,GAC/B,UAAU,GACV,WAAW,GACX,aAAa,GACb,cAAc,GACd,OAAO,GACP,MAAM,GACN,KAAK,GACL,QAAQ,CAAC;AAEb,MAAM,MAAM,mBAAmB,GAAG;IAChC,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,KAAK,EAAE,KAAK,CAAC,SAAS,CAAC;IACvB,SAAS,CAAC,EAAE,uBAAuB,CAAC;IACpC,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,CAAC;AAEF,wBAAgB,cAAc,CAAC,KAAK,EAAE,QAAQ,CAAC,mBAAmB,CAAC,2CAmBlE;yBAnBe,cAAc"}
+{"version":3,"file":"SgBadgeOverlay.d.ts","sourceRoot":"","sources":["../../src/commons/SgBadgeOverlay.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAM/B,MAAM,MAAM,uBAAuB,GAC/B,UAAU,GACV,WAAW,GACX,aAAa,GACb,cAAc,GACd,OAAO,GACP,MAAM,GACN,KAAK,GACL,QAAQ,CAAC;AAEb,MAAM,MAAM,mBAAmB,GAAG;IAChC,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,KAAK,EAAE,KAAK,CAAC,SAAS,CAAC;IACvB,SAAS,CAAC,EAAE,uBAAuB,CAAC;IACpC,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,KAAK,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;CAC7B,CAAC;AAEF,wBAAgB,cAAc,CAAC,KAAK,EAAE,QAAQ,CAAC,mBAAmB,CAAC,2CAmBlE;yBAnBe,cAAc"}

package/dist/commons/SgBadgeOverlay.js

@@ -4,7 +4,7 @@ function cn(...parts) {
     return parts.filter(Boolean).join(" ");
 }
 export function SgBadgeOverlay(props) {
-    const { children, badge, placement = "top-right", className } = props;
+    const { children, badge, placement = "top-right", className, style } = props;
     const pos = {
         "top-left": "left-0 top-0 -translate-x-1/3 -translate-y-1/3",
         "top-right": "right-0 top-0 translate-x-1/3 -translate-y-1/3",
@@ -15,6 +15,6 @@ export function SgBadgeOverlay(props) {
         top: "top-0 left-1/2 -translate-x-1/2 -translate-y-1/2",
         bottom: "bottom-0 left-1/2 -translate-x-1/2 translate-y-1/2"
     };
-    return (_jsxs("span", { className: cn("relative inline-flex", className), children: [children, _jsx("span", { className: cn("absolute", pos[placement]), children: badge })] }));
+    return (_jsxs("span", { className: cn("relative inline-flex", className), style: style, children: [children, _jsx("span", { className: cn("absolute", pos[placement]), children: badge })] }));
 }
 SgBadgeOverlay.displayName = "SgBadgeOverlay";

package/dist/commons/SgToastHost.d.ts

@@ -0,0 +1,17 @@
+import { type SgToasterProps } from "./SgToaster";
+export type SgToastHostProps = SgToasterProps;
+/**
+ * SgToastHost — marks the location where toasts will appear.
+ *
+ * Drop it anywhere in your tree. If multiple hosts exist simultaneously
+ * (e.g. one in a layout and one inside the page), the one deeper in the
+ * React tree (last to mount) takes priority. When that host unmounts the
+ * next most-recently-mounted host becomes active automatically.
+ *
+ * When any SgToastHost is present, SgToaster automatically defers to it
+ * and stops rendering, so both components can coexist without duplication.
+ *
+ * Accepts the same props as SgToaster (position, duration, richColors, etc.).
+ */
+export declare function SgToastHost(props: SgToastHostProps): import("react/jsx-runtime").JSX.Element | null;
+//# sourceMappingURL=SgToastHost.d.ts.map

package/dist/commons/SgToastHost.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"SgToastHost.d.ts","sourceRoot":"","sources":["../../src/commons/SgToastHost.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAmC,KAAK,cAAc,EAAE,MAAM,aAAa,CAAC;AAanF,MAAM,MAAM,gBAAgB,GAAG,cAAc,CAAC;AAE9C;;;;;;;;;;;;GAYG;AACH,wBAAgB,WAAW,CAAC,KAAK,EAAE,gBAAgB,kDAiClD"}

package/dist/commons/SgToastHost.js

@@ -0,0 +1,45 @@
+"use client";
+import { jsx as _jsx } from "react/jsx-runtime";
+import React from "react";
+import { SgToaster, SgToasterHostContext } from "./SgToaster";
+import { registerHost, unregisterHost, getActiveHostId, subscribeHostRegistry, nextHostId } from "./sgToastHostRegistry";
+/**
+ * SgToastHost — marks the location where toasts will appear.
+ *
+ * Drop it anywhere in your tree. If multiple hosts exist simultaneously
+ * (e.g. one in a layout and one inside the page), the one deeper in the
+ * React tree (last to mount) takes priority. When that host unmounts the
+ * next most-recently-mounted host becomes active automatically.
+ *
+ * When any SgToastHost is present, SgToaster automatically defers to it
+ * and stops rendering, so both components can coexist without duplication.
+ *
+ * Accepts the same props as SgToaster (position, duration, richColors, etc.).
+ */
+export function SgToastHost(props) {
+    // Stable ID across re-renders, generated once per component instance.
+    const idRef = React.useRef(null);
+    if (idRef.current === null) {
+        idRef.current = nextHostId();
+    }
+    const id = idRef.current;
+    // Start as inactive to avoid SSR hydration mismatches.
+    const [isActive, setIsActive] = React.useState(false);
+    // Register on mount, unregister on unmount.
+    React.useEffect(() => {
+        registerHost(id);
+        setIsActive(getActiveHostId() === id);
+        return () => {
+            unregisterHost(id);
+        };
+    }, [id]);
+    // React to other hosts registering / unregistering.
+    React.useEffect(() => {
+        return subscribeHostRegistry(() => {
+            setIsActive(getActiveHostId() === id);
+        });
+    }, [id]);
+    if (!isActive)
+        return null;
+    return (_jsx(SgToasterHostContext.Provider, { value: true, children: _jsx(SgToaster, { ...props }) }));
+}

package/dist/commons/SgToaster.d.ts

@@ -16,5 +16,7 @@ export type SgToasterProps = Omit<React.HTMLAttributes<HTMLDivElement>, "childre
     transparency?: number;
     customColors?: SgToasterCustomColors;
 };
-export declare function SgToaster(props: SgToasterProps): import("react/jsx-runtime").JSX.Element;
+/** @internal — used by SgToastHost to skip the host-presence check */
+export declare const SgToasterHostContext: React.Context<boolean>;
+export declare function SgToaster(props: SgToasterProps): import("react/jsx-runtime").JSX.Element | null;
 //# sourceMappingURL=SgToaster.d.ts.map

package/dist/commons/SgToaster.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"SgToaster.d.ts","sourceRoot":"","sources":["../../src/commons/SgToaster.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAqC,KAAK,aAAa,EAAE,MAAM,WAAW,CAAC;AAMlF,MAAM,MAAM,iBAAiB,GACzB,WAAW,GACX,UAAU,GACV,YAAY,GACZ,cAAc,GACd,aAAa,GACb,eAAe,CAAC;AAEpB,MAAM,MAAM,mBAAmB,GAAG;IAChC,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB,CAAC;AAEF,MAAM,MAAM,qBAAqB,GAAG,OAAO,CACzC,MAAM,CAAC,aAAa,CAAC,MAAM,CAAC,EAAE,mBAAmB,CAAC,CACnD,CAAC;AAEF,MAAM,MAAM,cAAc,GAAG,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC,EAAE,UAAU,CAAC,GAAG;IACpF,QAAQ,CAAC,EAAE,iBAAiB,CAAC;IAC7B,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,YAAY,CAAC,EAAE,qBAAqB,CAAC;CACtC,CAAC;AAgGF,wBAAgB,SAAS,CAAC,KAAK,EAAE,cAAc,2CAkI9C"}
+{"version":3,"file":"SgToaster.d.ts","sourceRoot":"","sources":["../../src/commons/SgToaster.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAqC,KAAK,aAAa,EAAE,MAAM,WAAW,CAAC;AAOlF,MAAM,MAAM,iBAAiB,GACzB,WAAW,GACX,UAAU,GACV,YAAY,GACZ,cAAc,GACd,aAAa,GACb,eAAe,CAAC;AAEpB,MAAM,MAAM,mBAAmB,GAAG;IAChC,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB,CAAC;AAEF,MAAM,MAAM,qBAAqB,GAAG,OAAO,CACzC,MAAM,CAAC,aAAa,CAAC,MAAM,CAAC,EAAE,mBAAmB,CAAC,CACnD,CAAC;AAEF,MAAM,MAAM,cAAc,GAAG,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC,EAAE,UAAU,CAAC,GAAG;IACpF,QAAQ,CAAC,EAAE,iBAAiB,CAAC;IAC7B,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,YAAY,CAAC,EAAE,qBAAqB,CAAC;CACtC,CAAC;AAgGF,sEAAsE;AACtE,eAAO,MAAM,oBAAoB,wBAA6B,CAAC;AAE/D,wBAAgB,SAAS,CAAC,KAAK,EAAE,cAAc,kDA6I9C"}

package/dist/commons/SgToaster.js

@@ -2,6 +2,7 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import React from "react";
 import { dismissSgToast, subscribeSgToasts } from "./SgToast";
+import { hasAnyHost, subscribeHostRegistry } from "./sgToastHostRegistry";
 function cn(...parts) {
     return parts.filter(Boolean).join(" ");
 }
@@ -91,11 +92,21 @@ function resolveToastColors(type, richColors, customColors) {
         fg: custom?.fg ?? base.fg
     };
 }
+/** @internal — used by SgToastHost to skip the host-presence check */
+export const SgToasterHostContext = React.createContext(false);
 export function SgToaster(props) {
+    const renderedByHost = React.useContext(SgToasterHostContext);
     const { position = "top-right", duration = 4000, visibleToasts = 6, closeButton = true, richColors = true, transparency = 0, customColors, className, style, ...rest } = props;
     const [toasts, setToasts] = React.useState([]);
     const timersRef = React.useRef({});
+    const [hostPresent, setHostPresent] = React.useState(() => !renderedByHost && hasAnyHost());
     React.useEffect(() => subscribeSgToasts(setToasts), []);
+    React.useEffect(() => {
+        if (renderedByHost)
+            return;
+        setHostPresent(hasAnyHost());
+        return subscribeHostRegistry(() => setHostPresent(hasAnyHost()));
+    }, [renderedByHost]);
     const visible = React.useMemo(() => {
         if (visibleToasts <= 0) {
             return [];
@@ -137,6 +148,8 @@ export function SgToaster(props) {
         };
     }, []);
     const toastOpacity = 1 - clampTransparency(transparency) / 100;
+    if (hostPresent)
+        return null;
     return (_jsx("div", { className: cn("pointer-events-none fixed z-[1100] flex max-h-screen w-full flex-col gap-2 p-4 sm:w-auto", POSITION_CLASS[position], className), style: style, ...rest, children: visible.map((toast) => {
             const typeColors = resolveToastColors(toast.type, richColors, customColors);
             const canClose = toast.closeButton ?? closeButton;

package/dist/commons/sgToastHostRegistry.d.ts

@@ -0,0 +1,7 @@
+export declare function registerHost(id: string): void;
+export declare function unregisterHost(id: string): void;
+export declare function getActiveHostId(): string | null;
+export declare function hasAnyHost(): boolean;
+export declare function subscribeHostRegistry(fn: () => void): () => void;
+export declare function nextHostId(): string;
+//# sourceMappingURL=sgToastHostRegistry.d.ts.map

package/dist/commons/sgToastHostRegistry.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"sgToastHostRegistry.d.ts","sourceRoot":"","sources":["../../src/commons/sgToastHostRegistry.ts"],"names":[],"mappings":"AAeA,wBAAgB,YAAY,CAAC,EAAE,EAAE,MAAM,QAKtC;AAED,wBAAgB,cAAc,CAAC,EAAE,EAAE,MAAM,QAMxC;AAED,wBAAgB,eAAe,IAAI,MAAM,GAAG,IAAI,CAE/C;AAED,wBAAgB,UAAU,IAAI,OAAO,CAEpC;AAED,wBAAgB,qBAAqB,CAAC,EAAE,EAAE,MAAM,IAAI,GAAG,MAAM,IAAI,CAKhE;AAED,wBAAgB,UAAU,IAAI,MAAM,CAGnC"}

package/dist/commons/sgToastHostRegistry.js

@@ -0,0 +1,41 @@
+// ---------------------------------------------------------------------------
+// Shared host registry — used by both SgToastHost and SgToaster.
+//
+// SgToastHost instances push/pop themselves onto this stack.
+// SgToaster subscribes: if the stack is non-empty it yields to the active host.
+// ---------------------------------------------------------------------------
+let _counter = 0;
+const _stack = [];
+const _listeners = new Set();
+function _notify() {
+    _listeners.forEach((fn) => fn());
+}
+export function registerHost(id) {
+    if (!_stack.includes(id)) {
+        _stack.push(id);
+        _notify();
+    }
+}
+export function unregisterHost(id) {
+    const i = _stack.indexOf(id);
+    if (i >= 0) {
+        _stack.splice(i, 1);
+        _notify();
+    }
+}
+export function getActiveHostId() {
+    return _stack[_stack.length - 1] ?? null;
+}
+export function hasAnyHost() {
+    return _stack.length > 0;
+}
+export function subscribeHostRegistry(fn) {
+    _listeners.add(fn);
+    return () => {
+        _listeners.delete(fn);
+    };
+}
+export function nextHostId() {
+    _counter += 1;
+    return `sg-toast-host-${_counter}`;
+}

package/dist/digits/segment-digit/SgSegmentDigit.d.ts

@@ -0,0 +1,15 @@
+import * as React from "react";
+export type SgSegmentDigitProps = {
+    /** Character rendered by the component (first character is used). */
+    value: string;
+    /** Display height in pixels. */
+    size?: number;
+    /** Color of active segments. */
+    color?: string;
+    /** Additional classes on outer wrapper. */
+    className?: string;
+    /** Additional inline styles on outer wrapper. */
+    style?: React.CSSProperties;
+};
+export declare function SgSegmentDigit({ value, size, color, className, style }: Readonly<SgSegmentDigitProps>): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=SgSegmentDigit.d.ts.map

package/dist/digits/segment-digit/SgSegmentDigit.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"SgSegmentDigit.d.ts","sourceRoot":"","sources":["../../../src/digits/segment-digit/SgSegmentDigit.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AA2F/B,MAAM,MAAM,mBAAmB,GAAG;IAChC,qEAAqE;IACrE,KAAK,EAAE,MAAM,CAAC;IACd,gCAAgC;IAChC,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,gCAAgC;IAChC,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,2CAA2C;IAC3C,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,iDAAiD;IACjD,KAAK,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;CAC7B,CAAC;AAEF,wBAAgB,cAAc,CAAC,EAC7B,KAAK,EACL,IAAS,EACT,KAAK,EACL,SAAS,EACT,KAAK,EACN,EAAE,QAAQ,CAAC,mBAAmB,CAAC,2CAkC/B"}

package/dist/digits/segment-digit/SgSegmentDigit.js

@@ -0,0 +1,96 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+function cn(...parts) {
+    return parts.filter(Boolean).join(" ");
+}
+function round(n) {
+    return Math.round(n * 1000) / 1000;
+}
+const DIGIT_GLYPHS = {
+    "0": [
+        { x: 1, y: 0, w: 4, h: 1 },
+        { x: 5, y: 1, w: 1, h: 4 },
+        { x: 5, y: 5, w: 1, h: 4 },
+        { x: 1, y: 9, w: 4, h: 1 },
+        { x: 0, y: 5, w: 1, h: 4 },
+        { x: 0, y: 1, w: 1, h: 4 }
+    ],
+    "1": [
+        { x: 5, y: 1, w: 1, h: 4 },
+        { x: 5, y: 5, w: 1, h: 4 }
+    ],
+    "2": [
+        { x: 1, y: 0, w: 4, h: 1 },
+        { x: 5, y: 1, w: 1, h: 4 },
+        { x: 1, y: 4.5, w: 4, h: 1 },
+        { x: 0, y: 5, w: 1, h: 4 },
+        { x: 1, y: 9, w: 4, h: 1 }
+    ],
+    "3": [
+        { x: 1, y: 0, w: 4, h: 1 },
+        { x: 5, y: 1, w: 1, h: 4 },
+        { x: 1, y: 4.5, w: 4, h: 1 },
+        { x: 5, y: 5, w: 1, h: 4 },
+        { x: 1, y: 9, w: 4, h: 1 }
+    ],
+    "4": [
+        { x: 0, y: 1, w: 1, h: 4 },
+        { x: 5, y: 1, w: 1, h: 4 },
+        { x: 1, y: 4.5, w: 4, h: 1 },
+        { x: 5, y: 5, w: 1, h: 4 }
+    ],
+    "5": [
+        { x: 1, y: 0, w: 4, h: 1 },
+        { x: 0, y: 1, w: 1, h: 4 },
+        { x: 1, y: 4.5, w: 4, h: 1 },
+        { x: 5, y: 5, w: 1, h: 4 },
+        { x: 1, y: 9, w: 4, h: 1 }
+    ],
+    "6": [
+        { x: 1, y: 0, w: 4, h: 1 },
+        { x: 0, y: 1, w: 1, h: 4 },
+        { x: 1, y: 4.5, w: 4, h: 1 },
+        { x: 0, y: 5, w: 1, h: 4 },
+        { x: 5, y: 5, w: 1, h: 4 },
+        { x: 1, y: 9, w: 4, h: 1 }
+    ],
+    "7": [
+        { x: 1, y: 0, w: 4, h: 1 },
+        { x: 5, y: 1, w: 1, h: 4 },
+        { x: 5, y: 5, w: 1, h: 4 }
+    ],
+    "8": [
+        { x: 1, y: 0, w: 4, h: 1 },
+        { x: 5, y: 1, w: 1, h: 4 },
+        { x: 5, y: 5, w: 1, h: 4 },
+        { x: 1, y: 9, w: 4, h: 1 },
+        { x: 0, y: 5, w: 1, h: 4 },
+        { x: 0, y: 1, w: 1, h: 4 },
+        { x: 1, y: 4.5, w: 4, h: 1 }
+    ],
+    "9": [
+        { x: 1, y: 0, w: 4, h: 1 },
+        { x: 5, y: 1, w: 1, h: 4 },
+        { x: 5, y: 5, w: 1, h: 4 },
+        { x: 1, y: 9, w: 4, h: 1 },
+        { x: 0, y: 1, w: 1, h: 4 },
+        { x: 1, y: 4.5, w: 4, h: 1 }
+    ],
+    "-": [{ x: 1, y: 4.5, w: 4, h: 1 }],
+    " ": []
+};
+const COLON_GLYPH = [
+    { x: 1.5, y: 2, w: 1, h: 1 },
+    { x: 1.5, y: 7, w: 1, h: 1 }
+];
+export function SgSegmentDigit({ value, size = 16, color, className, style }) {
+    const char = (value ?? " ").charAt(0);
+    const normalized = char === ":" ? ":" : (DIGIT_GLYPHS[char] ? char : " ");
+    const isColon = normalized === ":";
+    const glyph = isColon ? COLON_GLYPH : DIGIT_GLYPHS[normalized] ?? DIGIT_GLYPHS[" "] ?? [];
+    const viewWidth = isColon ? 4 : 6;
+    const viewHeight = 10;
+    const scale = Math.max(0.2, size / viewHeight);
+    const width = round(viewWidth * scale);
+    const height = round(viewHeight * scale);
+    return (_jsx("svg", { role: "img", "aria-label": value, width: width, height: height, viewBox: `0 0 ${viewWidth} ${viewHeight}`, className: cn("inline-block align-middle text-neutral-800 dark:text-neutral-200", className), style: { color, ...style }, children: glyph.map((segment, idx) => (_jsx("rect", { x: segment.x, y: segment.y, width: segment.w, height: segment.h, rx: 0.3, fill: "currentColor" }, `${normalized}-${idx}`))) }));
+}

package/dist/digits/segment-digit/index.d.ts

@@ -0,0 +1,3 @@
+export { SgSegmentDigit } from "./SgSegmentDigit";
+export type { SgSegmentDigitProps } from "./SgSegmentDigit";
+//# sourceMappingURL=index.d.ts.map

package/dist/digits/segment-digit/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/digits/segment-digit/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAE,MAAM,kBAAkB,CAAC;AAClD,YAAY,EAAE,mBAAmB,EAAE,MAAM,kBAAkB,CAAC"}

package/dist/digits/segment-digit/index.js

@@ -0,0 +1 @@
+export { SgSegmentDigit } from "./SgSegmentDigit";

package/dist/digits/seven-segment-digit/SgSevenSegmentDigit.d.ts

@@ -0,0 +1,36 @@
+import * as React from "react";
+export type SgSevenSegmentDigitPalette = "red" | "blue" | "yellow" | "green" | "white";
+export type SgSevenSegmentDigitProps = {
+    /** Character rendered by the component (first character is used). */
+    value: string;
+    /** Preset visual palette for active, inactive and background colors. */
+    palette?: SgSevenSegmentDigitPalette;
+    /** Color of active segments. */
+    color?: string;
+    /** Background color of the component panel. */
+    backgroundColor?: string;
+    /** Color of inactive segments. */
+    offColor?: string;
+    /** Component height in pixels. */
+    size?: number;
+    /** Component width in pixels. By default, derived from `size`. */
+    width?: number;
+    /** Segment thickness in pixels. */
+    thickness?: number;
+    /** Internal panel padding in pixels. */
+    padding?: number;
+    /** Border radius of the panel in pixels. */
+    rounded?: number;
+    /** Applies a subtle skew to mimic classic LED displays. */
+    skew?: number;
+    /** Enables glow effect on active segments. */
+    glow?: boolean;
+    /** Segment transition duration in milliseconds. */
+    transitionMs?: number;
+    /** Additional classes on outer wrapper. */
+    className?: string;
+    /** Additional inline styles on outer wrapper. */
+    style?: React.CSSProperties;
+};
+export declare function SgSevenSegmentDigit({ value, palette, color, backgroundColor, offColor, size, width, thickness, padding, rounded, skew, glow, transitionMs, className, style }: Readonly<SgSevenSegmentDigitProps>): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=SgSevenSegmentDigit.d.ts.map

package/dist/digits/seven-segment-digit/SgSevenSegmentDigit.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"SgSevenSegmentDigit.d.ts","sourceRoot":"","sources":["../../../src/digits/seven-segment-digit/SgSevenSegmentDigit.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAsC/B,MAAM,MAAM,0BAA0B,GAAG,KAAK,GAAG,MAAM,GAAG,QAAQ,GAAG,OAAO,GAAG,OAAO,CAAC;AAiCvF,MAAM,MAAM,wBAAwB,GAAG;IACrC,qEAAqE;IACrE,KAAK,EAAE,MAAM,CAAC;IACd,wEAAwE;IACxE,OAAO,CAAC,EAAE,0BAA0B,CAAC;IACrC,gCAAgC;IAChC,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,+CAA+C;IAC/C,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,kCAAkC;IAClC,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,kCAAkC;IAClC,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,kEAAkE;IAClE,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,mCAAmC;IACnC,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,wCAAwC;IACxC,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,4CAA4C;IAC5C,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,2DAA2D;IAC3D,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,8CAA8C;IAC9C,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,mDAAmD;IACnD,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,2CAA2C;IAC3C,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,iDAAiD;IACjD,KAAK,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;CAC7B,CAAC;AAQF,wBAAgB,mBAAmB,CAAC,EAClC,KAAK,EACL,OAAe,EACf,KAAK,EACL,eAAe,EACf,QAAQ,EACR,IAAU,EACV,KAAK,EACL,SAAc,EACd,OAAY,EACZ,OAAY,EACZ,IAAS,EACT,IAAW,EACX,YAAkB,EAClB,SAAS,EACT,KAAK,EACN,EAAE,QAAQ,CAAC,wBAAwB,CAAC,2CA+EpC"}