@stn-uiux/pub-ui-react 0.1.76 → 0.1.78

package/dist/index.js

@@ -997,23 +997,24 @@ var StnModal = forwardRef6(function StnModal2({
       ...rest,
       children: /* @__PURE__ */ jsx9("div", { className: "stn-pop__cont", children: /* @__PURE__ */ jsxs5("div", { className: "stn-pop__panel", children: [
         /* @__PURE__ */ jsxs5("div", { className: "stn-pop__head", id: titleId, children: [
-          /* @__PURE__ */ jsxs5("div", { className: "stn-pop__head-row", children: [
-            /* @__PURE__ */ jsx9("h4", { children: title }),
-            headerExtra ? /* @__PURE__ */ jsx9("div", { className: "stn-pop__head-extra", children: headerExtra }) : null
+          /* @__PURE__ */ jsxs5("div", { className: "stn-pop__head-start", children: [
+            /* @__PURE__ */ jsxs5("div", { className: "stn-pop__head-row", children: [
+              /* @__PURE__ */ jsx9("h4", { children: title }),
+              headerExtra ? /* @__PURE__ */ jsx9("div", { className: "stn-pop__head-extra", children: headerExtra }) : null
+            ] }),
+            subtitle ? /* @__PURE__ */ jsx9("p", { className: "stn-pop__subtitle", children: subtitle }) : null
           ] }),
-          subtitle ? /* @__PURE__ */ jsx9("p", { className: "stn-pop__subtitle", children: subtitle }) : null
+          onClose ? /* @__PURE__ */ jsx9(
+            StnButton,
+            {
+              icon: "line/x",
+              variant: "ghost",
+              size: "sm",
+              "aria-label": "\uB2EB\uAE30",
+              onClick: onClose
+            }
+          ) : null
         ] }),
-        /* @__PURE__ */ jsx9(
-          StnButton,
-          {
-            icon: "line/x",
-            variant: "ghost",
-            size: "sm",
-            className: "stn-pop__close",
-            "aria-label": "\uB2EB\uAE30",
-            onClick: onClose
-          }
-        ),
         /* @__PURE__ */ jsx9("div", { className: cn("stn-pop__body", bodyClassName), children }),
         actions ? /* @__PURE__ */ jsx9(
           "div",
@@ -3093,15 +3094,57 @@ StnCard.Header = StnCardHeader;
 StnCard.Body = StnCardBody;
 StnCard.Footer = StnCardFooter;
 
+// src/components/StnText.tsx
+import { createElement, forwardRef as forwardRef17 } from "react";
+var DEFAULT_TAG = {
+  "display-1": "h1",
+  "display-2": "h1",
+  "display-3": "h1",
+  "heading-1": "h1",
+  "heading-2": "h2",
+  "heading-3": "h3",
+  "title-1": "h4",
+  "title-2": "h5",
+  "title-3": "h6",
+  "body-1": "p",
+  "body-2": "p",
+  "body-3": "p",
+  "body-small": "p",
+  "label-1": "span",
+  "label-2": "span",
+  "label-3": "span",
+  "label-4": "span",
+  "caption-large": "span",
+  caption: "span"
+};
+var StnText = forwardRef17(function StnText2({ variant = "body-3", as, weight, color, truncate, className, children, ...rest }, ref) {
+  const tag = as ?? DEFAULT_TAG[variant];
+  return createElement(
+    tag,
+    {
+      ref,
+      className: cn(
+        `stn-text-${variant}`,
+        "stn-text-reset-margin",
+        weight && `stn-text-weight-${weight}`,
+        color && `stn-text-color-${color}`,
+        truncate && "stn-text-truncate",
+        className
+      ),
+      ...rest
+    },
+    children
+  );
+});
+
 // src/patterns/sectionSide/StnSectionSide.tsx
-import { forwardRef as forwardRef17 } from "react";
+import { forwardRef as forwardRef18 } from "react";
 import { jsx as jsx22, jsxs as jsxs16 } from "react/jsx-runtime";
-var StnSectionSide = forwardRef17(function StnSectionSide2({
+var StnSectionSide = forwardRef18(function StnSectionSide2({
   children,
   header,
   footer,
   className,
-  variant = "solid",
   fill = true,
   fullWidth = false,
   collapsed = false,
@@ -3115,7 +3158,6 @@ var StnSectionSide = forwardRef17(function StnSectionSide2({
       ref,
       className: cn(
         "stn-section-side",
-        variant === "translucent" && "stn-section-side--translucent",
         fill && "stn-section-side--fill",
         fullWidth && "is-full-width",
         collapsed && "is-collapsed",
@@ -3145,9 +3187,9 @@ function StnSectionSidePreset({ tree, collapsed, ...sideProps }) {
 }
 
 // src/patterns/login/StnLoginCard.tsx
-import { forwardRef as forwardRef18 } from "react";
+import { forwardRef as forwardRef19 } from "react";
 import { jsx as jsx23, jsxs as jsxs17 } from "react/jsx-runtime";
-var StnLoginCardGlowWrapper = forwardRef18(
+var StnLoginCardGlowWrapper = forwardRef19(
   function StnLoginCardGlowWrapper2({ children, className, ...rest }, ref) {
     return /* @__PURE__ */ jsx23(
       "div",
@@ -3161,7 +3203,7 @@ var StnLoginCardGlowWrapper = forwardRef18(
     );
   }
 );
-var StnLoginCard = forwardRef18(function StnLoginCard2({
+var StnLoginCard = forwardRef19(function StnLoginCard2({
   brand,
   children,
   brandPosition = "left",
@@ -3192,12 +3234,12 @@ var StnLoginCard = forwardRef18(function StnLoginCard2({
   }
   return cardElement;
 });
-var StnLoginBrandStack = forwardRef18(
+var StnLoginBrandStack = forwardRef19(
   function StnLoginBrandStack2({ children, className, ...rest }, ref) {
     return /* @__PURE__ */ jsx23("div", { ref, className: cn("stn-login-brand-stack", className), ...rest, children });
   }
 );
-var StnLoginFormStack = forwardRef18(
+var StnLoginFormStack = forwardRef19(
   function StnLoginFormStack2({ children, className, ...rest }, ref) {
     return /* @__PURE__ */ jsx23(
       "form",
@@ -3211,7 +3253,7 @@ var StnLoginFormStack = forwardRef18(
     );
   }
 );
-var StnLoginFormFields = forwardRef18(
+var StnLoginFormFields = forwardRef19(
   function StnLoginFormFields2({ children, className, ...rest }, ref) {
     return /* @__PURE__ */ jsx23(
       "div",
@@ -3225,7 +3267,7 @@ var StnLoginFormFields = forwardRef18(
     );
   }
 );
-var StnLoginFormLinks = forwardRef18(
+var StnLoginFormLinks = forwardRef19(
   function StnLoginFormLinks2({ children, className, ...rest }, ref) {
     return /* @__PURE__ */ jsx23(
       "nav",
@@ -3240,7 +3282,7 @@ var StnLoginFormLinks = forwardRef18(
     );
   }
 );
-var StnLoginPlaceholder = forwardRef18(
+var StnLoginPlaceholder = forwardRef19(
   function StnLoginPlaceholder2({ children = "\uC18C\uC15C \uB85C\uADF8\uC778 \uAE30\uB2A5\uC740 \uC900\uBE44 \uC911\uC785\uB2C8\uB2E4.", className, ...rest }, ref) {
     return /* @__PURE__ */ jsx23("p", { ref, className: cn("stn-login__placeholder", className), ...rest, children });
   }
@@ -3249,11 +3291,11 @@ var StnLoginPlaceholder = forwardRef18(
 // src/patterns/login/StnLoginTextField.tsx
 import {
   cloneElement as cloneElement3,
-  forwardRef as forwardRef19,
+  forwardRef as forwardRef20,
   isValidElement as isValidElement3
 } from "react";
 import { jsx as jsx24, jsxs as jsxs18 } from "react/jsx-runtime";
-var StnLoginTextField = forwardRef19(
+var StnLoginTextField = forwardRef20(
   function StnLoginTextField2({
     icon,
     iconColor,
@@ -3313,7 +3355,7 @@ var StnLoginTextField = forwardRef19(
 );
 
 // src/components/StnLogo.tsx
-import { forwardRef as forwardRef20 } from "react";
+import { forwardRef as forwardRef21 } from "react";
 import { STN_INFOMAP_LOGO } from "@stn-uiux/pub-ui/data/stnBrand";
 import { jsx as jsx25, jsxs as jsxs19 } from "react/jsx-runtime";
 function sources(variant) {
@@ -3328,7 +3370,7 @@ function sources(variant) {
   }
   return { light: STN_INFOMAP_LOGO.full, dark: STN_INFOMAP_LOGO.fullDark };
 }
-var StnLogo = forwardRef20(function StnLogo2({ variant = "horizontal", size = "md", mode, theme, alt = "InfoMap SRM", className, ...rest }, ref) {
+var StnLogo = forwardRef21(function StnLogo2({ variant = "horizontal", size = "md", mode, theme, alt = "InfoMap SRM", className, ...rest }, ref) {
   const { light, dark } = sources(variant);
   const finalMode = mode ?? theme;
   return /* @__PURE__ */ jsxs19(
@@ -3551,11 +3593,11 @@ function StnChip(props) {
 
 // src/components/StnToggleButton.tsx
 import {
-  forwardRef as forwardRef21,
+  forwardRef as forwardRef22,
   useState as useState8
 } from "react";
 import { Fragment as Fragment3, jsx as jsx28, jsxs as jsxs22 } from "react/jsx-runtime";
-var StnToggleButton = forwardRef21(
+var StnToggleButton = forwardRef22(
   function StnToggleButton2({
     pressed: pressedProp,
     defaultPressed = false,
@@ -3654,9 +3696,9 @@ var StnToggleButton = forwardRef21(
 );
 
 // src/components/StnSwitch.tsx
-import { forwardRef as forwardRef22, useId as useId6 } from "react";
+import { forwardRef as forwardRef23, useId as useId6 } from "react";
 import { jsx as jsx29, jsxs as jsxs23 } from "react/jsx-runtime";
-var StnSwitch = forwardRef22(function StnSwitch2({
+var StnSwitch = forwardRef23(function StnSwitch2({
   label,
   size = "md",
   color,
@@ -3747,9 +3789,9 @@ var StnSwitch = forwardRef22(function StnSwitch2({
 });
 
 // src/components/StnRadio.tsx
-import { forwardRef as forwardRef23, useId as useId7 } from "react";
+import { forwardRef as forwardRef24, useId as useId7 } from "react";
 import { jsx as jsx30, jsxs as jsxs24 } from "react/jsx-runtime";
-var StnRadio = forwardRef23(function StnRadio2({
+var StnRadio = forwardRef24(function StnRadio2({
   label,
   size = "md",
   color,
@@ -3953,7 +3995,7 @@ function StnSegmented(props) {
 
 // src/components/tabs/StnTabs.tsx
 import {
-  forwardRef as forwardRef26,
+  forwardRef as forwardRef27,
   useState as useState9,
   useRef as useRef5,
   useEffect as useEffect8,
@@ -3979,9 +4021,9 @@ function StnTabContextProvider({
 }
 
 // src/components/tabs/StnTab.tsx
-import { forwardRef as forwardRef24 } from "react";
+import { forwardRef as forwardRef25 } from "react";
 import { jsx as jsx34, jsxs as jsxs26 } from "react/jsx-runtime";
-var StnTab = forwardRef24(function StnTab2({
+var StnTab = forwardRef25(function StnTab2({
   value,
   label,
   icon,
@@ -4053,9 +4095,9 @@ var StnTab = forwardRef24(function StnTab2({
 });
 
 // src/components/tabs/StnTabPanel.tsx
-import { forwardRef as forwardRef25 } from "react";
+import { forwardRef as forwardRef26 } from "react";
 import { jsx as jsx35 } from "react/jsx-runtime";
-var StnTabPanel = forwardRef25(function StnTabPanel2({
+var StnTabPanel = forwardRef26(function StnTabPanel2({
   value,
   current,
   padding = "md",
@@ -4092,7 +4134,7 @@ var StnTabPanel = forwardRef25(function StnTabPanel2({
 // src/components/tabs/StnTabs.tsx
 import { jsx as jsx36, jsxs as jsxs27 } from "react/jsx-runtime";
 var useIsomorphicLayoutEffect = typeof window !== "undefined" ? useLayoutEffect : useEffect8;
-var StnTabsRoot = forwardRef26(function StnTabs({
+var StnTabsRoot = forwardRef27(function StnTabs({
   value: controlledValue,
   defaultValue,
   onChange,
@@ -4605,7 +4647,7 @@ function StnDropdownMenu({
 }
 
 // src/components/StnTextField.tsx
-import { forwardRef as forwardRef27, useId as useId11 } from "react";
+import { forwardRef as forwardRef28, useId as useId11 } from "react";
 import { jsx as jsx39, jsxs as jsxs29 } from "react/jsx-runtime";
 function normalizeSize(size) {
   if (!size) return "md";
@@ -4633,7 +4675,7 @@ function resolveGlyph2(node) {
   if (typeof node === "string") return /* @__PURE__ */ jsx39(StnIcon, { name: node, size: 16, color: "currentColor" });
   return node;
 }
-var StnTextField = forwardRef27(function StnTextField2({
+var StnTextField = forwardRef28(function StnTextField2({
   size = "M",
   variant = "outlined",
   color,
@@ -4739,7 +4781,7 @@ var StnTextField = forwardRef27(function StnTextField2({
 
 // src/components/StnTextArea.tsx
 import {
-  forwardRef as forwardRef28,
+  forwardRef as forwardRef29,
   useId as useId12,
   useState as useState11
 } from "react";
@@ -4767,7 +4809,7 @@ function resolveGlyph3(node) {
   if (typeof node === "string") return /* @__PURE__ */ jsx40(StnIcon, { name: node, size: 16, color: "currentColor" });
   return node;
 }
-var StnTextArea = forwardRef28(function StnTextArea2({
+var StnTextArea = forwardRef29(function StnTextArea2({
   size = "md",
   variant = "outlined",
   color,
@@ -4891,7 +4933,7 @@ var StnTextArea = forwardRef28(function StnTextArea2({
 StnTextArea.displayName = "StnTextArea";
 
 // src/components/StnDateRangeField.tsx
-import { forwardRef as forwardRef29, useId as useId13 } from "react";
+import { forwardRef as forwardRef30, useId as useId13 } from "react";
 import {
   formatStnDateRangeFieldValue
 } from "@stn-uiux/pub-ui/data/stnDateRangeField";
@@ -4921,7 +4963,7 @@ function resolveValue(value, format) {
   const trimmed = value.trim();
   return trimmed || null;
 }
-var StnDateRangeField = forwardRef29(function StnDateRangeField2({
+var StnDateRangeField = forwardRef30(function StnDateRangeField2({
   size = "md",
   variant = "outline",
   start,
@@ -5914,17 +5956,15 @@ function StnHeaderToolbar({ children, className, ...rest }) {
 
 // src/index.ts
 import {
-  STN_LAYER0_BACKGROUND_FIGMA,
   STN_LAYER0_BACKGROUND_INTRO,
   STN_LAYER0_BACKGROUND_USAGE,
   STN_LAYER0_BACKGROUND_VARIANT_ROWS,
-  STN_LAYER0_BACKGROUND_DEMO_IMAGES as STN_LAYER0_BACKGROUND_DEMO_IMAGES2,
+  STN_LAYER0_BACKGROUND_DEMO_IMAGES,
   STN_LAYER0_MAP_LIGHT_OVERLAY as STN_LAYER0_MAP_LIGHT_OVERLAY2
 } from "@stn-uiux/pub-ui/data/stnLayer0Background";
 
 // src/patterns/background/StnLayer0Background.tsx
 import {
-  STN_LAYER0_BACKGROUND_DEMO_IMAGES,
   STN_LAYER0_MAP_LIGHT_OVERLAY
 } from "@stn-uiux/pub-ui/data/stnLayer0Background";
 import { jsx as jsx48, jsxs as jsxs37 } from "react/jsx-runtime";
@@ -5933,12 +5973,21 @@ function overlayStyle(overlay) {
   const pct = `${Math.min(100, Math.max(0, overlay * 100))}%`;
   return { "--stn-layer0-overlay-opacity": pct };
 }
+function handleImageError(e) {
+  const currentSrc = e.currentTarget.src;
+  if (currentSrc && currentSrc.startsWith("http") && currentSrc.includes("/images/layer0/")) {
+    const fallback = currentSrc.substring(currentSrc.indexOf("/images/layer0/"));
+    if (typeof window !== "undefined" && currentSrc !== window.location.origin + fallback) {
+      e.currentTarget.src = fallback;
+    }
+  }
+}
 function StnLayer0Background({
   variant,
   kind: kindProp,
   color = "default",
-  src: srcProp,
-  srcDark: srcDarkProp,
+  src,
+  srcDark,
   overlay: overlayProp,
   overlayDarkRadial: overlayDarkRadialProp,
   alt = "",
@@ -5946,92 +5995,23 @@ function StnLayer0Background({
   style,
   ...rest
 }) {
-  let src = srcProp;
-  let srcDark = srcDarkProp;
   let overlay = overlayProp;
   let overlayDarkRadial = overlayDarkRadialProp;
-  let isPresetImage = false;
-  if (variant && variant !== "none" && variant !== "color" && variant !== "gradient") {
-    isPresetImage = true;
-    if (variant === "dashboard") {
-      src = src ?? STN_LAYER0_BACKGROUND_DEMO_IMAGES.dashboard;
-      srcDark = srcDark ?? STN_LAYER0_BACKGROUND_DEMO_IMAGES.dashboardDark;
-    } else if (variant === "infomap") {
-      src = src ?? STN_LAYER0_BACKGROUND_DEMO_IMAGES.infomap;
-      srcDark = srcDark ?? STN_LAYER0_BACKGROUND_DEMO_IMAGES.infomapDark;
-    } else if (variant === "infomap-none") {
-      src = src ?? STN_LAYER0_BACKGROUND_DEMO_IMAGES.infomapNone;
-      srcDark = srcDark ?? STN_LAYER0_BACKGROUND_DEMO_IMAGES.infomapNoneDark;
-    } else if (variant === "showroom-a") {
-      src = src ?? STN_LAYER0_BACKGROUND_DEMO_IMAGES.showroomA;
-      srcDark = srcDark ?? STN_LAYER0_BACKGROUND_DEMO_IMAGES.showroomADark;
-    } else if (variant === "showroom-b") {
-      src = src ?? STN_LAYER0_BACKGROUND_DEMO_IMAGES.showroomB;
-      srcDark = srcDark ?? STN_LAYER0_BACKGROUND_DEMO_IMAGES.showroomBDark;
-      overlayDarkRadial = overlayDarkRadial ?? true;
-    } else if (variant === "login") {
-      src = src ?? STN_LAYER0_BACKGROUND_DEMO_IMAGES.login;
-      srcDark = srcDark ?? STN_LAYER0_BACKGROUND_DEMO_IMAGES.loginDark;
-    } else if (variant === "map-light") {
-      src = src ?? STN_LAYER0_BACKGROUND_DEMO_IMAGES.mapLight;
-      srcDark = srcDark ?? STN_LAYER0_BACKGROUND_DEMO_IMAGES.mapDark;
-      overlay = overlay ?? STN_LAYER0_MAP_LIGHT_OVERLAY;
-    }
+  if (variant === "none") {
+    return null;
   }
-  const kind = kindProp ?? (isPresetImage ? "image" : void 0);
-  const isImage = kind === "image" || Boolean(src || srcDark);
-  if (isImage) {
-    const paired = Boolean(src && srcDark);
+  if (variant === "color" || kindProp === "color") {
     return /* @__PURE__ */ jsx48(
       "div",
       {
-        className: cn("stn-layer0-bg", "image", className),
-        "aria-hidden": alt === "" ? true : void 0,
-        style: { ...overlayStyle(overlay), ...style },
-        ...rest,
-        children: /* @__PURE__ */ jsxs37("div", { className: "stn-layer0-bg__media", children: [
-          src ? /* @__PURE__ */ jsx48(
-            "img",
-            {
-              className: cn("stn-layer0-bg__img", paired && "light"),
-              src,
-              alt,
-              decoding: "async",
-              onError: (e) => {
-                if (src && src.startsWith("http") && src.includes("/images/layer0/")) {
-                  const fallback = src.substring(src.indexOf("/images/layer0/"));
-                  if (typeof window !== "undefined" && e.currentTarget.src !== window.location.origin + fallback) {
-                    e.currentTarget.src = fallback;
-                  }
-                }
-              }
-            }
-          ) : null,
-          srcDark ? /* @__PURE__ */ jsx48(
-            "img",
-            {
-              className: cn("stn-layer0-bg__img", paired ? "dark" : void 0),
-              src: srcDark,
-              alt,
-              decoding: "async",
-              onError: (e) => {
-                if (srcDark && srcDark.startsWith("http") && srcDark.includes("/images/layer0/")) {
-                  const fallback = srcDark.substring(srcDark.indexOf("/images/layer0/"));
-                  if (typeof window !== "undefined" && e.currentTarget.src !== window.location.origin + fallback) {
-                    e.currentTarget.src = fallback;
-                  }
-                }
-              }
-            }
-          ) : null,
-          overlay != null && overlay > 0 ? /* @__PURE__ */ jsx48("div", { className: "stn-layer0-bg__overlay", "aria-hidden": "true" }) : null,
-          overlayDarkRadial ? /* @__PURE__ */ jsx48("div", { className: "stn-layer0-bg__overlay radial", "aria-hidden": "true" }) : null
-        ] })
+        className: cn("stn-layer0-bg", "color", color, className),
+        "aria-hidden": "true",
+        style,
+        ...rest
       }
     );
   }
-  const isGradient = kind === "gradient" || variant === "gradient";
-  if (isGradient) {
+  if (variant === "gradient" || kindProp === "gradient") {
     return /* @__PURE__ */ jsx48(
       "div",
       {
@@ -6042,13 +6022,61 @@ function StnLayer0Background({
       }
     );
   }
-  return /* @__PURE__ */ jsx48(
+  if (src || srcDark) {
+    const paired = Boolean(src && srcDark);
+    return /* @__PURE__ */ jsxs37(
+      "div",
+      {
+        className: cn("stn-layer0-bg", "image", className),
+        "aria-hidden": alt === "" ? true : void 0,
+        style: { ...overlayStyle(overlay), ...style },
+        ...rest,
+        children: [
+          /* @__PURE__ */ jsxs37("div", { className: "stn-layer0-bg__media", children: [
+            src ? /* @__PURE__ */ jsx48(
+              "img",
+              {
+                className: cn("stn-layer0-bg__img", paired && "light"),
+                src,
+                alt,
+                decoding: "async",
+                onError: handleImageError
+              }
+            ) : null,
+            srcDark ? /* @__PURE__ */ jsx48(
+              "img",
+              {
+                className: cn("stn-layer0-bg__img", paired ? "dark" : void 0),
+                src: srcDark,
+                alt,
+                decoding: "async",
+                onError: handleImageError
+              }
+            ) : null
+          ] }),
+          overlay != null && overlay > 0 ? /* @__PURE__ */ jsx48("div", { className: "stn-layer0-bg__overlay", "aria-hidden": "true" }) : null,
+          overlayDarkRadial ? /* @__PURE__ */ jsx48("div", { className: "stn-layer0-bg__overlay radial", "aria-hidden": "true" }) : null
+        ]
+      }
+    );
+  }
+  const presetKey = variant ?? "dashboard";
+  if (presetKey === "map-light") {
+    overlay = overlay ?? STN_LAYER0_MAP_LIGHT_OVERLAY;
+  } else if (presetKey === "showroom-b") {
+    overlayDarkRadial = overlayDarkRadial ?? true;
+  }
+  return /* @__PURE__ */ jsxs37(
     "div",
     {
-      className: cn("stn-layer0-bg", "color", color, className),
-      "aria-hidden": "true",
-      style,
-      ...rest
+      className: cn("stn-layer0-bg", presetKey, className),
+      "aria-hidden": alt === "" ? true : void 0,
+      style: { ...overlayStyle(overlay), ...style },
+      ...rest,
+      children: [
+        overlay != null && overlay > 0 ? /* @__PURE__ */ jsx48("div", { className: "stn-layer0-bg__overlay", "aria-hidden": "true" }) : null,
+        overlayDarkRadial ? /* @__PURE__ */ jsx48("div", { className: "stn-layer0-bg__overlay radial", "aria-hidden": "true" }) : null
+      ]
     }
   );
 }
@@ -7522,7 +7550,7 @@ import {
 // src/layouts/StnStack.tsx
 import {
   Children as Children3,
-  forwardRef as forwardRef30,
+  forwardRef as forwardRef31,
   Fragment as Fragment6,
   isValidElement as isValidElement6
 } from "react";
@@ -7619,7 +7647,7 @@ function spacingClassesAndStyle(spacing) {
   }
   return { classes, inlineGap };
 }
-var StnStack = forwardRef30(function StnStack2({
+var StnStack = forwardRef31(function StnStack2({
   component,
   as,
   direction = "column",
@@ -8054,13 +8082,13 @@ var SideNavContext = createContext4({
 var useSideNav = () => useContext4(SideNavContext);
 
 // src/components/sideNav/StnSideNavItem.tsx
-import { forwardRef as forwardRef31 } from "react";
+import { forwardRef as forwardRef32 } from "react";
 import { STN_NAV_MENU_SUB_ICON } from "@stn-uiux/pub-ui/data/stnSideNavItem";
 import { jsx as jsx60, jsxs as jsxs48 } from "react/jsx-runtime";
 function maskStyle2(src) {
   return { maskImage: `url('${src}')`, WebkitMaskImage: `url('${src}')` };
 }
-var StnSideNavItem = forwardRef31(function StnSideNavItem2({
+var StnSideNavItem = forwardRef32(function StnSideNavItem2({
   label,
   id,
   iconSrc,
@@ -8179,12 +8207,12 @@ var StnSideNavItem = forwardRef31(function StnSideNavItem2({
 });
 
 // src/components/sideNav/StnSideNavHeader.tsx
-import { forwardRef as forwardRef33 } from "react";
+import { forwardRef as forwardRef34 } from "react";
 
 // src/components/sideNav/StnSideNavLogo.tsx
-import { forwardRef as forwardRef32 } from "react";
+import { forwardRef as forwardRef33 } from "react";
 import { jsx as jsx61 } from "react/jsx-runtime";
-var StnSideNavLogo = forwardRef32(
+var StnSideNavLogo = forwardRef33(
   function StnSideNavLogo2({ className, logoProps, ...rest }, ref) {
     const { collapsed } = useSideNav();
     return /* @__PURE__ */ jsx61(
@@ -8213,7 +8241,7 @@ var StnSideNavLogo = forwardRef32(
 
 // src/components/sideNav/StnSideNavHeader.tsx
 import { Fragment as Fragment7, jsx as jsx62, jsxs as jsxs49 } from "react/jsx-runtime";
-var StnSideNavHeader = forwardRef33(function StnSideNavHeader2({
+var StnSideNavHeader = forwardRef34(function StnSideNavHeader2({
   children,
   border = false,
   hasBorder = false,
@@ -8269,9 +8297,9 @@ var StnSideNavHeader = forwardRef33(function StnSideNavHeader2({
 });
 
 // src/components/sideNav/StnSideNavMenu.tsx
-import { forwardRef as forwardRef34 } from "react";
+import { forwardRef as forwardRef35 } from "react";
 import { jsx as jsx63 } from "react/jsx-runtime";
-var StnSideNavMenu = forwardRef34(function StnSideNavMenu2({
+var StnSideNavMenu = forwardRef35(function StnSideNavMenu2({
   children,
   className,
   scrollSize = "thin",
@@ -8299,13 +8327,13 @@ var StnSideNavMenu = forwardRef34(function StnSideNavMenu2({
 
 // src/components/sideNav/StnSideNavGroup.tsx
 import {
-  forwardRef as forwardRef35,
+  forwardRef as forwardRef36,
   useEffect as useEffect12,
   useRef as useRef8,
   useState as useState17
 } from "react";
 import { jsx as jsx64, jsxs as jsxs50 } from "react/jsx-runtime";
-var StnSideNavGroup = forwardRef35(function StnSideNavGroup2({
+var StnSideNavGroup = forwardRef36(function StnSideNavGroup2({
   label,
   parent,
   direction = "down",
@@ -8395,9 +8423,9 @@ var StnSideNavGroup = forwardRef35(function StnSideNavGroup2({
 });
 
 // src/components/sideNav/StnSideNavSpacer.tsx
-import { forwardRef as forwardRef36 } from "react";
+import { forwardRef as forwardRef37 } from "react";
 import { jsx as jsx65 } from "react/jsx-runtime";
-var StnSideNavSpacer = forwardRef36(function StnSideNavSpacer2({ className, style, ...rest }, ref) {
+var StnSideNavSpacer = forwardRef37(function StnSideNavSpacer2({ className, style, ...rest }, ref) {
   return /* @__PURE__ */ jsx65(
     "div",
     {
@@ -8411,9 +8439,9 @@ var StnSideNavSpacer = forwardRef36(function StnSideNavSpacer2({ className, styl
 });
 
 // src/components/sideNav/StnSideNavFooter.tsx
-import { forwardRef as forwardRef37 } from "react";
+import { forwardRef as forwardRef38 } from "react";
 import { jsx as jsx66 } from "react/jsx-runtime";
-var StnSideNavFooter = forwardRef37(function StnSideNavFooter2({ curved = false, children, className, ...rest }, ref) {
+var StnSideNavFooter = forwardRef38(function StnSideNavFooter2({ curved = false, children, className, ...rest }, ref) {
   return /* @__PURE__ */ jsx66(
     "nav",
     {
@@ -8427,9 +8455,9 @@ var StnSideNavFooter = forwardRef37(function StnSideNavFooter2({ curved = false,
 });
 
 // src/components/sideNav/StnSideNavToggle.tsx
-import { forwardRef as forwardRef38 } from "react";
+import { forwardRef as forwardRef39 } from "react";
 import { jsx as jsx67 } from "react/jsx-runtime";
-var StnSideNavToggle = forwardRef38(
+var StnSideNavToggle = forwardRef39(
   function StnSideNavToggle2({ className, onClick, ...rest }, ref) {
     const { collapsed, onToggleCollapse } = useSideNav();
     return /* @__PURE__ */ jsx67(
@@ -8465,9 +8493,9 @@ var StnSideNavToggle = forwardRef38(
 );
 
 // src/components/sideNav/StnSideNavWatermark.tsx
-import { forwardRef as forwardRef39 } from "react";
+import { forwardRef as forwardRef40 } from "react";
 import { jsx as jsx68 } from "react/jsx-runtime";
-var StnSideNavWatermark = forwardRef39(
+var StnSideNavWatermark = forwardRef40(
   function StnSideNavWatermark2({ size = "xl", mode, theme, className, ...rest }, ref) {
     return /* @__PURE__ */ jsx68(
       "div",
@@ -8483,9 +8511,9 @@ var StnSideNavWatermark = forwardRef39(
 );
 
 // src/components/sideNav/StnSideNavMobileTrigger.tsx
-import { forwardRef as forwardRef40, useEffect as useEffect13, useState as useState18 } from "react";
+import { forwardRef as forwardRef41, useEffect as useEffect13, useState as useState18 } from "react";
 import { jsx as jsx69, jsxs as jsxs51 } from "react/jsx-runtime";
-var StnSideNavMobileTrigger = forwardRef40(
+var StnSideNavMobileTrigger = forwardRef41(
   function StnSideNavMobileTrigger2({ floating = false, className, children, onClick, ...rest }, ref) {
     const { onToggleMobileOpen, mobileOpen: contextMobileOpen } = useSideNav();
     const [fallbackMobileOpen, setFallbackMobileOpen] = useState18(false);
@@ -8537,10 +8565,10 @@ var StnSideNavMobileTrigger = forwardRef40(
 
 // src/components/sideNav/StnSideNavSub.tsx
 import {
-  forwardRef as forwardRef41
+  forwardRef as forwardRef42
 } from "react";
 import { jsx as jsx70 } from "react/jsx-runtime";
-var StnSideNavSub = forwardRef41(
+var StnSideNavSub = forwardRef42(
   function StnSideNavSub2({ children, className, ...rest }, ref) {
     return /* @__PURE__ */ jsx70(
       "div",
@@ -8555,7 +8583,7 @@ var StnSideNavSub = forwardRef41(
     );
   }
 );
-var StnSideNavSubItem = forwardRef41(
+var StnSideNavSubItem = forwardRef42(
   function StnSideNavSubItem2({
     variant = "ghost",
     size = "md",
@@ -8597,9 +8625,9 @@ var StnSideNavSubItem = forwardRef41(
 );
 
 // src/components/sideNav/StnSideNavSubNav.tsx
-import { forwardRef as forwardRef42 } from "react";
+import { forwardRef as forwardRef43 } from "react";
 import { jsx as jsx71 } from "react/jsx-runtime";
-var StnSideNavSubNav = forwardRef42(
+var StnSideNavSubNav = forwardRef43(
   function StnSideNavSubNav2({
     dropdown = false,
     direction = "down",
@@ -8634,7 +8662,7 @@ var StnSideNavSubNav = forwardRef42(
 
 // src/patterns/sideNav/StnSideNavigation.tsx
 import {
-  forwardRef as forwardRef43,
+  forwardRef as forwardRef44,
   useCallback as useCallback9,
   useEffect as useEffect14,
   useMemo as useMemo4,
@@ -8656,7 +8684,7 @@ function useControllableState(controlledValue, defaultValue, onChange) {
   );
   return [value, setValue];
 }
-var StnSideNavigationRoot = forwardRef43(function StnSideNavigationRoot2({
+var StnSideNavigationRoot = forwardRef44(function StnSideNavigationRoot2({
   variant: variantProp,
   appearance,
   drawerVariant: drawerVariantProp,
@@ -9361,10 +9389,10 @@ var StnHeaderTitle = Object.assign(StnHeaderTitleRoot, {
 
 // src/layouts/StnContainer.tsx
 import {
-  forwardRef as forwardRef44
+  forwardRef as forwardRef45
 } from "react";
 import { jsx as jsx75 } from "react/jsx-runtime";
-var StnContainer = forwardRef44(function StnContainer2({
+var StnContainer = forwardRef45(function StnContainer2({
   component,
   as,
   maxWidth = "lg",
@@ -9402,7 +9430,7 @@ var StnContainer = forwardRef44(function StnContainer2({
 });
 
 // src/layouts/StnGrid.tsx
-import { forwardRef as forwardRef45 } from "react";
+import { forwardRef as forwardRef46 } from "react";
 import { jsx as jsx76 } from "react/jsx-runtime";
 var BREAKPOINTS2 = ["xs", "sm", "md", "lg", "xl"];
 var SPACING_CLASS = {
@@ -9469,7 +9497,7 @@ function sizeClasses(size) {
   }
   return classes;
 }
-var StnGrid = forwardRef45(function StnGrid2({
+var StnGrid = forwardRef46(function StnGrid2({
   component,
   as,
   container = false,
@@ -9538,7 +9566,6 @@ function StnLayerShell({
     "div",
     {
       id: wrapId,
-      "data-stn-layer-mode": "v2",
       "data-stn-gnb-side": gnbSide,
       className: cn("stn-wrap", isGnbRight && "stn-wrap--gnb-right", wrapClassName),
       children: [
@@ -10232,7 +10259,6 @@ function LoginPageScaffold({
     "div",
     {
       className: cn("stn-wrap stn-page--login", wrapClassName),
-      "data-stn-layer-mode": "v2",
       ...shellProps,
       children: [
         resolvedLayer0,
@@ -10461,8 +10487,7 @@ export {
   STN_HEADER_PAGE_TITLE_DEMO,
   STN_HEADER_USAGE,
   STN_HEADER_VARIANT_ROWS,
-  STN_LAYER0_BACKGROUND_DEMO_IMAGES2 as STN_LAYER0_BACKGROUND_DEMO_IMAGES,
-  STN_LAYER0_BACKGROUND_FIGMA,
+  STN_LAYER0_BACKGROUND_DEMO_IMAGES,
   STN_LAYER0_BACKGROUND_INTRO,
   STN_LAYER0_BACKGROUND_USAGE,
   STN_LAYER0_BACKGROUND_VARIANT_ROWS,
@@ -10673,6 +10698,7 @@ export {
   StnTableThCheck,
   StnTabs2 as StnTabs,
   StnTabsRoot,
+  StnText,
   StnTextArea,
   StnTextField,
   StnToastCloseButton,