@stn-uiux/pub-ui 0.1.77 → 0.1.78

package/dist/data/stnLayer0Background.d.ts

@@ -6,79 +6,45 @@ export { STN_LAYER0_BACKGROUND_ASSET_PATHS, STN_LAYER0_BACKGROUND_DEMO_IMAGES }
  * Dark:  80488 · 35369 · 84014 · 91183
  * @see StnLayer0Background · layouts/stn-layer0-bg.css
  */
-declare const STN_LAYER0_BACKGROUND_FIGMA: {
-    readonly none: "40000040:41267";
-    readonly noneDark: "40000040:80488";
-    readonly showroomA: "40000042:186876";
-    readonly showroomADark: "40002117:35369";
-    readonly showroomB: "40000042:186860";
-    readonly showroomBDark: "40000040:84014";
-    readonly mapLight: "40000042:202895";
-    readonly mapDark: "40000040:91183";
-    readonly login: "40004209:78293";
-    readonly loginDark: "40004209:78293";
-    readonly dashboard: "40004209:78300";
-    readonly dashboardDark: "40004209:78300";
-};
 type StnLayer0BackgroundKind = 'color' | 'gradient' | 'image';
-/** Figma 예제 프리셋 — color 1종 · gradient 1종 · image 7종 (light/dark 자동 전환) */
-type StnLayer0BackgroundPreset = 'none' | 'gradient' | 'showroom-a' | 'showroom-b' | 'map-light' | 'login' | 'dashboard' | 'infomap' | 'infomap-none';
+/** 바닥면 예제 프리셋 — color 1종 · gradient 1종 · image 5종 (light/dark 자동 전환) */
+type StnLayer0BackgroundPreset = 'none' | 'gradient' | 'list' | 'showroom-a' | 'showroom-b' | 'map-light' | 'login' | 'dashboard' | 'infomap' | 'infomap-none';
 
 declare const STN_LAYER0_BACKGROUND_INTRO = "\uD398\uC774\uC9C0 \uCD5C\uD558\uB2E8 \uB808\uBCA8(Level 0)\uC5D0 \uC704\uCE58\uD558\uB294 \uC2DC\uC2A4\uD15C \uBC14\uB2E5\uBA74 \uBC30\uACBD \uD328\uD134\uC785\uB2C8\uB2E4. \uB2E8\uC0C9 \uCEEC\uB7EC \uBC0F \uB9F5\u00B7\uD1A0\uD3F4\uB85C\uC9C0 \uCE94\uBC84\uC2A4 \uBC30\uACBD \uC774\uBBF8\uC9C0\uB97C `StnLayer0BackgroundPreset`\uC73C\uB85C \uC190\uC27D\uAC8C \uC801\uC6A9\uD560 \uC218 \uC788\uC2B5\uB2C8\uB2E4.";
 declare const STN_LAYER0_BACKGROUND_VARIANT_ROWS: readonly [{
     readonly preset: "none";
     readonly kind: "color";
-    readonly figma: "40000040:41267";
-    readonly figmaDark: "40000040:80488";
     readonly note: "Light gradient · Dark elevation surface-0 (gray-950)";
 }, {
-    readonly preset: "dashboard";
-    readonly kind: "image";
-    readonly figma: "40004209:78300";
-    readonly figmaDark: "40004209:78300";
-    readonly note: "Dashboard · light/dark pair";
+    readonly preset: "list";
+    readonly kind: "gradient";
+    readonly note: "List view · 테마 반응형 바닥면 (Default: 앰비언트 gradient, Blue: infomap-none 3D 그래픽)";
 }, {
-    readonly preset: "infomap";
-    readonly kind: "image";
-    readonly figma: "40004209:78300";
-    readonly figmaDark: "40004209:78300";
-    readonly note: "Infomap 3D Graphic · light/dark pair";
-}, {
-    readonly preset: "infomap-none";
+    readonly preset: "dashboard";
     readonly kind: "image";
-    readonly figma: "40004209:78300";
-    readonly figmaDark: "40004209:78300";
-    readonly note: "Infomap 3D Graphic (None/텍스트 없음) · light/dark pair";
+    readonly note: "Dashboard · light/dark pair (theme=\"blue\" 적용 시 infomap 그래픽으로 자동 전환)";
 }, {
     readonly preset: "showroom-a";
     readonly kind: "image";
-    readonly figma: "40000042:186876";
-    readonly figmaDark: "40002117:35369";
     readonly note: "Showroom A · dark logo stage";
 }, {
     readonly preset: "showroom-b";
     readonly kind: "image";
-    readonly figma: "40000042:186860";
-    readonly figmaDark: "40000040:84014";
     readonly note: "Showroom B · dark + radial vignette";
 }, {
     readonly preset: "map-light";
     readonly kind: "image";
-    readonly figma: "40000042:202895";
-    readonly figmaDark: "40000040:91183";
     readonly note: "Map light(+20% white) · Map dark";
 }, {
     readonly preset: "login";
     readonly kind: "image";
-    readonly figma: "40004209:78293";
-    readonly figmaDark: "40004209:78293";
     readonly note: "Login · light/dark pair";
 }];
 declare const STN_LAYER0_BACKGROUND_USAGE = "import {\n  StnLayer,\n  StnLayer0Background,\n  StnLayer0BackgroundPreset,\n  DashboardPageScaffold,\n} from '@stn-uiux/pub-ui-react'\n\n/** Map / Topology \u2014 wrapClassName\uB9CC (\uB9F5 \uBC30\uACBD\uC740 elevation CSS) */\n<DashboardPageScaffold\n  shell=\"layer\"\n  wrapClassName=\"stn-page--map-bg\"\n  gnb={\u2026}\n  header={\u2026}\n/>\n\n/** \uC77C\uBC18 \uD398\uC774\uC9C0 \u2014 L0 color (default = elevation-surface-0) */\n<StnLayer.Background>\n  <StnLayer0Background color=\"default\" />\n  <StnLayer.Content>{/* \uBCF8\uBB38 */}</StnLayer.Content>\n</StnLayer.Background>\n\n/** Figma image \uD504\uB9AC\uC14B \u2014 showroom \u00B7 map \u00B7 login */\n<StnLayer.Background>\n  <StnLayer0BackgroundPreset variant=\"map-light\" />\n  <StnLayer.Content>{/* \uBCF8\uBB38 */}</StnLayer.Content>\n</StnLayer.Background>\n\n<StnLayer.Background>\n  <StnLayer0BackgroundPreset variant=\"login\" />\n  <StnLayer.Content>{/* \uBCF8\uBB38 */}</StnLayer.Content>\n</StnLayer.Background>\n\n/** \uC9C1\uC811 \uC870\uD569 \u2014 light/dark \uC774\uBBF8\uC9C0 */\n<StnLayer.Background>\n  <StnLayer0Background\n    kind=\"image\"\n    src=\"/assets/bg-light.png\"\n    srcDark=\"/assets/bg-dark.png\"\n  />\n  <StnLayer.Content>\u2026</StnLayer.Content>\n</StnLayer.Background>";
 declare const STN_LAYER0_BACKGROUND_USAGE_HTML = "<!-- L0 background \u2014 color / image -->\n<div class=\"stn-elev-0 stn-layer0-bg\">\n  <!-- color -->\n  <div class=\"stn-layer0-bg color default\" aria-hidden=\"true\"></div>\n\n  <!-- \uB610\uB294 image -->\n  <div\n    class=\"stn-layer0-bg image\"\n    style=\"--stn-layer0-bg-image: url('/assets/bg-light.png')\"\n    aria-hidden=\"true\"\n  ></div>\n\n  <main class=\"stn-elev-1\"><!-- L1 content --></main>\n</div>";
 declare const STN_LAYER0_MAP_LIGHT_OVERLAY = 0.2;
 /** Patterns → Background playground 프리셋 (UI 라벨 · 내부 variant) */
-type StnLayer0BackgroundPlaygroundPresetId = 'dashboard' | 'infomap' | 'infomap-none' | 'color' | 'gradient' | 'map' | 'topology' | 'none';
+type StnLayer0BackgroundPlaygroundPresetId = 'list' | 'dashboard' | 'color' | 'gradient' | 'map' | 'topology' | 'none';
 declare const STN_LAYER0_BACKGROUND_PLAYGROUND_PRESETS: {
     id: StnLayer0BackgroundPlaygroundPresetId;
     label: string;
@@ -86,4 +52,4 @@ declare const STN_LAYER0_BACKGROUND_PLAYGROUND_PRESETS: {
     variant?: StnLayer0BackgroundPreset;
 }[];
 
-export { STN_LAYER0_BACKGROUND_FIGMA, STN_LAYER0_BACKGROUND_INTRO, STN_LAYER0_BACKGROUND_PLAYGROUND_PRESETS, STN_LAYER0_BACKGROUND_USAGE, STN_LAYER0_BACKGROUND_USAGE_HTML, STN_LAYER0_BACKGROUND_VARIANT_ROWS, STN_LAYER0_MAP_LIGHT_OVERLAY, type StnLayer0BackgroundKind, type StnLayer0BackgroundPlaygroundPresetId, type StnLayer0BackgroundPreset };
+export { STN_LAYER0_BACKGROUND_INTRO, STN_LAYER0_BACKGROUND_PLAYGROUND_PRESETS, STN_LAYER0_BACKGROUND_USAGE, STN_LAYER0_BACKGROUND_USAGE_HTML, STN_LAYER0_BACKGROUND_VARIANT_ROWS, STN_LAYER0_MAP_LIGHT_OVERLAY, type StnLayer0BackgroundKind, type StnLayer0BackgroundPlaygroundPresetId, type StnLayer0BackgroundPreset };

package/dist/data/stnLayer0Background.js

@@ -1,12 +1,11 @@
 import {
-  STN_LAYER0_BACKGROUND_FIGMA,
   STN_LAYER0_BACKGROUND_INTRO,
   STN_LAYER0_BACKGROUND_PLAYGROUND_PRESETS,
   STN_LAYER0_BACKGROUND_USAGE,
   STN_LAYER0_BACKGROUND_USAGE_HTML,
   STN_LAYER0_BACKGROUND_VARIANT_ROWS,
   STN_LAYER0_MAP_LIGHT_OVERLAY
-} from "../chunk-FSSMH6VS.js";
+} from "../chunk-TEK632EJ.js";
 import {
   STN_LAYER0_BACKGROUND_ASSET_PATHS,
   STN_LAYER0_BACKGROUND_DEMO_IMAGES
@@ -14,7 +13,6 @@ import {
 export {
   STN_LAYER0_BACKGROUND_ASSET_PATHS,
   STN_LAYER0_BACKGROUND_DEMO_IMAGES,
-  STN_LAYER0_BACKGROUND_FIGMA,
   STN_LAYER0_BACKGROUND_INTRO,
   STN_LAYER0_BACKGROUND_PLAYGROUND_PRESETS,
   STN_LAYER0_BACKGROUND_USAGE,

package/dist/data/stnLayout.d.ts

@@ -78,7 +78,7 @@ type StnLnbSide = 'left' | 'right';
 /** 대시보드·맵 화면 내 고정 슬롯 */
 type StnLayoutRegion = 'top_right' | 'dashboard' | 'dashboard_left' | 'dashboard_right' | 'dashboard_body' | 'wrap_topology' | 'map' | 'dash_canvas';
 declare const STN_LAYOUT_PAGE_TREE: ".stn-wrap (legacy v1: #wrap)\n\u251C\u2500\u2500 .stn-side-nav           (absolute overlay \u00B7 StnSideNavigation)\n\u2514\u2500\u2500 .stn-layer-1            (L1 \u00B7 \uB124\uBE44 \uC81C\uC678 \uC601\uC5ED)\n    \u251C\u2500\u2500 .stn-layer-1__header     (Header)\n    \u2514\u2500\u2500 .stn-content-area / .stn-stack\n        \u2514\u2500\u2500 .stn-stack \u2026";
-declare const STN_LAYOUT_LAYER_PAGE_TREE: ".stn-wrap                         (Root Shell \u00B7 data-stn-layer-mode=\"v2\")\n\u251C\u2500\u2500 StnLayer.Background           (L0 \u00B7 layer0-bg)\n\u251C\u2500\u2500 .stn-side-nav / StnSideNavigation  (absolute overlay \u00B7 wrap \uC9C1\uC18D)\n\u251C\u2500\u2500 [data-stn-layer-role=\"utility\"]  (toast \u00B7 audio)\n\u2514\u2500\u2500 StnLayer.Content (.stn-layer-1) (L1 \u2014 \uD558\uB098)\n    \u251C\u2500\u2500 .stn-layer-1__header\n    \u2514\u2500\u2500 .stn-content-area / .stn-stack\n        \u2514\u2500\u2500 lnb_box | content_box | .stn-stack";
+declare const STN_LAYOUT_LAYER_PAGE_TREE: ".stn-wrap                         (Root Shell)\n\u251C\u2500\u2500 StnLayer.Background           (L0 \u00B7 layer0-bg)\n\u251C\u2500\u2500 .stn-side-nav / StnSideNavigation  (absolute overlay \u00B7 wrap \uC9C1\uC18D)\n\u251C\u2500\u2500 [data-stn-layer-role=\"utility\"]  (toast \u00B7 audio)\n\u2514\u2500\u2500 StnLayer.Content (.stn-layer-1) (L1 \u2014 \uD558\uB098)\n    \u251C\u2500\u2500 .stn-layer-1__header\n    \u2514\u2500\u2500 .stn-content-area / .stn-stack\n        \u2514\u2500\u2500 lnb_box | content_box | .stn-stack";
 declare const STN_LAYOUT_CONTENT_ROWS: {
     modifier: StnContentAreaModifier;
     pubClass: string;

package/dist/data/stnLayout.js

@@ -27,7 +27,7 @@ import {
   applyLnbSideToModifiers,
   pubContentAreaClasses,
   pubLayoutRegionClass
-} from "../chunk-2ZYBBVBT.js";
+} from "../chunk-36QC3ZAD.js";
 export {
   STN_ALERT_CENTER_PAGE_SCAFFOLD_USAGE,
   STN_LAYER_SHELL_USAGE,

package/dist/data/stnLogin.d.ts

@@ -9,6 +9,6 @@ declare const STN_LOGIN_ASSETS: {
 };
 declare const STN_LOGIN_INTRO = "\uB85C\uADF8\uC778 \uD398\uC774\uC9C0\uB294 LoginPageScaffold(\uD398\uC774\uC9C0) + StnLayer0BackgroundPreset(\uBC14\uB2E5) + StnLoginCard(\uCE74\uB4DC)\uC785\uB2C8\uB2E4. \uBC30\uACBD\u00B7\uB85C\uACE0\uB294 \uAC01 \uCEF4\uD3EC\uB10C\uD2B8\uC758 variant\uB97C \uBC14\uAFD4 \uC7A1\uC2B5\uB2C8\uB2E4. onLogin\uB9CC \uB118\uAE30\uBA74 \uAE30\uBCF8 \uC870\uB9BD(login \uBC30\uACBD \u00B7 \uAC00\uB85C XL \uB85C\uACE0)\uC774 \uB4E4\uC5B4\uAC11\uB2C8\uB2E4.";
 declare const STN_LOGIN_USAGE = "import { useState, type FormEvent } from 'react'\nimport {\n  LoginPageScaffold,\n  StnLayer0BackgroundPreset,\n  StnLoginCard,\n  StnLoginBrandStack,\n  StnLoginFormStack,\n  StnLoginFormFields,\n  StnLoginFormLinks,\n  StnLoginTextField,\n  StnLogo,\n  StnSegmented,\n  StnButton,\n} from '@stn-uiux/pub-ui-react'\n\nfunction LoginPage() {\n  const [mode, setMode] = useState<'normal' | 'social'>('normal')\n  const [userId, setUserId] = useState('')\n  const [password, setPassword] = useState('')\n\n  function handleSubmit(e: FormEvent) {\n    e.preventDefault()\n    // \uB85C\uADF8\uC778 API \uD638\uCD9C\n  }\n\n  return (\n    <LoginPageScaffold\n      layer0={<StnLayer0BackgroundPreset variant=\"login\" />}\n      cardGlow={true}\n    >\n      <StnLoginCard\n        glow={true}\n        brand={\n          <StnLoginBrandStack>\n            <StnLogo variant=\"vertical\" size=\"xl\" />\n            <p className=\"stn-login-card__caption\">Server Resource Monitoring</p>\n          </StnLoginBrandStack>\n        }\n      >\n        <StnLoginFormStack onSubmit={handleSubmit}>\n          <StnSegmented\n            aria-label=\"\uB85C\uADF8\uC778 \uBC29\uC2DD\"\n            value={mode}\n            onChange={(v) => setMode(v as 'normal' | 'social')}\n            options={[\n              { value: 'normal', label: '\uC77C\uBC18 \uB85C\uADF8\uC778' },\n              { value: 'social', label: '\uC18C\uC15C \uB85C\uADF8\uC778' },\n            ]}\n          />\n          {mode === 'normal' && (\n            <StnLoginFormFields>\n              <StnLoginTextField\n                icon=\"line/user\"\n                name=\"username\"\n                autoComplete=\"username\"\n                placeholder=\"\uC544\uC774\uB514\"\n                value={userId}\n                onChange={(e) => setUserId(e.target.value)}\n                aria-label=\"\uC544\uC774\uB514\"\n              />\n              <StnLoginTextField\n                icon=\"line/lock\"\n                type=\"password\"\n                name=\"password\"\n                autoComplete=\"current-password\"\n                placeholder=\"\uBE44\uBC00\uBC88\uD638\"\n                value={password}\n                onChange={(e) => setPassword(e.target.value)}\n                aria-label=\"\uBE44\uBC00\uBC88\uD638\"\n              />\n            </StnLoginFormFields>\n          )}\n          <StnButton type=\"submit\" size=\"xl\" fullWidth>\n            \uB85C\uADF8\uC778\n          </StnButton>\n          <StnLoginFormLinks>\n            <a href=\"#signup\">\uD68C\uC6D0\uAC00\uC785</a>\n            <a href=\"#recover\">\uC544\uC774\uB514 / \uBE44\uBC00\uBC88\uD638 \uCC3E\uAE30</a>\n          </StnLoginFormLinks>\n        </StnLoginFormStack>\n      </StnLoginCard>\n    </LoginPageScaffold>\n  )\n}";
-declare const STN_LOGIN_HTML = "<div class=\"stn-wrap stn-page--login\" data-stn-layer-mode=\"v2\">\n  <div class=\"stn-layer0-bg image\" aria-hidden=\"true\"><!-- L0 login --></div>\n  <main class=\"stn-elev-1\" data-stn-layer-role=\"content\">\n    <div class=\"stn-login\">\n      <div class=\"stn-login-card\">\n        <div class=\"stn-login-card__brand\">\n          <div class=\"stn-login-brand-stack\">\n            <span class=\"stn-logo horizontal xl\">\n              <img class=\"stn-logo__img light\" src=\"/@assets/svg/brand/infomap-logo-full.png\" alt=\"InfoMap SRM\" />\n              <img class=\"stn-logo__img dark\" src=\"/@assets/svg/brand/infomap-logo-full-dark.png\" alt=\"\" />\n            </span>\n            <p class=\"stn-login-card__caption\">Server Resource Monitoring</p>\n          </div>\n        </div>\n        <div class=\"stn-login-card__form\">\n          <form class=\"stn-login-form-stack\">\n            <div class=\"stn-segmented\" role=\"radiogroup\" aria-label=\"\uB85C\uADF8\uC778 \uBC29\uC2DD\">\n              <button type=\"button\" class=\"stn-segmented__item active\" role=\"radio\" aria-checked=\"true\">\uC77C\uBC18 \uB85C\uADF8\uC778</button>\n              <button type=\"button\" class=\"stn-segmented__item\" role=\"radio\" aria-checked=\"false\">\uC18C\uC15C \uB85C\uADF8\uC778</button>\n            </div>\n            <div class=\"stn-login-form-fields\">\n              <div class=\"stn-login-text-field\">\n                <span class=\"stn-icon-box md stn-login-text-field__icon-box\" aria-hidden>\n                  <span class=\"stn-icon stn-icon--masked\" style=\"background-color: currentColor; width: 16px; height: 16px;\"></span>\n                </span>\n                <input type=\"text\" class=\"stn-login-text-field__control\" placeholder=\"\uC544\uC774\uB514\" autocomplete=\"username\" />\n              </div>\n              <div class=\"stn-login-text-field\">\n                <span class=\"stn-icon-box md stn-login-text-field__icon-box\" aria-hidden>\n                  <span class=\"stn-icon stn-icon--masked\" style=\"background-color: currentColor; width: 16px; height: 16px;\"></span>\n                </span>\n                <input type=\"password\" class=\"stn-login-text-field__control\" placeholder=\"\uBE44\uBC00\uBC88\uD638\" autocomplete=\"current-password\" />\n              </div>\n            </div>\n            <button type=\"submit\" class=\"stn-btn contained xl full\">\uB85C\uADF8\uC778</button>\n            <nav class=\"stn-login-form-links\" aria-label=\"\uACC4\uC815 \uAD00\uB9AC \uB9C1\uD06C\">\n              <a href=\"#signup\">\uD68C\uC6D0\uAC00\uC785</a>\n              <a href=\"#recover\">\uC544\uC774\uB514 / \uBE44\uBC00\uBC88\uD638 \uCC3E\uAE30</a>\n            </nav>\n          </form>\n        </div>\n      </div>\n    </div>\n  </main>\n</div>";
+declare const STN_LOGIN_HTML = "<div class=\"stn-wrap stn-page--login\">\n  <div class=\"stn-layer0-bg image\" aria-hidden=\"true\"><!-- L0 login --></div>\n  <main class=\"stn-elev-1\" data-stn-layer-role=\"content\">\n    <div class=\"stn-login\">\n      <div class=\"stn-login-card\">\n        <div class=\"stn-login-card__brand\">\n          <div class=\"stn-login-brand-stack\">\n            <span class=\"stn-logo horizontal xl\">\n              <img class=\"stn-logo__img light\" src=\"/@assets/svg/brand/infomap-logo-full.png\" alt=\"InfoMap SRM\" />\n              <img class=\"stn-logo__img dark\" src=\"/@assets/svg/brand/infomap-logo-full-dark.png\" alt=\"\" />\n            </span>\n            <p class=\"stn-login-card__caption\">Server Resource Monitoring</p>\n          </div>\n        </div>\n        <div class=\"stn-login-card__form\">\n          <form class=\"stn-login-form-stack\">\n            <div class=\"stn-segmented\" role=\"radiogroup\" aria-label=\"\uB85C\uADF8\uC778 \uBC29\uC2DD\">\n              <button type=\"button\" class=\"stn-segmented__item active\" role=\"radio\" aria-checked=\"true\">\uC77C\uBC18 \uB85C\uADF8\uC778</button>\n              <button type=\"button\" class=\"stn-segmented__item\" role=\"radio\" aria-checked=\"false\">\uC18C\uC15C \uB85C\uADF8\uC778</button>\n            </div>\n            <div class=\"stn-login-form-fields\">\n              <div class=\"stn-login-text-field\">\n                <span class=\"stn-icon-box md stn-login-text-field__icon-box\" aria-hidden>\n                  <span class=\"stn-icon stn-icon--masked\" style=\"background-color: currentColor; width: 16px; height: 16px;\"></span>\n                </span>\n                <input type=\"text\" class=\"stn-login-text-field__control\" placeholder=\"\uC544\uC774\uB514\" autocomplete=\"username\" />\n              </div>\n              <div class=\"stn-login-text-field\">\n                <span class=\"stn-icon-box md stn-login-text-field__icon-box\" aria-hidden>\n                  <span class=\"stn-icon stn-icon--masked\" style=\"background-color: currentColor; width: 16px; height: 16px;\"></span>\n                </span>\n                <input type=\"password\" class=\"stn-login-text-field__control\" placeholder=\"\uBE44\uBC00\uBC88\uD638\" autocomplete=\"current-password\" />\n              </div>\n            </div>\n            <button type=\"submit\" class=\"stn-btn contained xl full\">\uB85C\uADF8\uC778</button>\n            <nav class=\"stn-login-form-links\" aria-label=\"\uACC4\uC815 \uAD00\uB9AC \uB9C1\uD06C\">\n              <a href=\"#signup\">\uD68C\uC6D0\uAC00\uC785</a>\n              <a href=\"#recover\">\uC544\uC774\uB514 / \uBE44\uBC00\uBC88\uD638 \uCC3E\uAE30</a>\n            </nav>\n          </form>\n        </div>\n      </div>\n    </div>\n  </main>\n</div>";
 
 export { STN_LOGIN_ASSETS, STN_LOGIN_FIGMA, STN_LOGIN_HTML, STN_LOGIN_INTRO, STN_LOGIN_USAGE };

package/dist/data/stnLogin.js

@@ -4,7 +4,7 @@ import {
   STN_LOGIN_HTML,
   STN_LOGIN_INTRO,
   STN_LOGIN_USAGE
-} from "../chunk-3CYSR7V4.js";
+} from "../chunk-QGC3IK52.js";
 import "../chunk-NGUMR3D6.js";
 export {
   STN_LOGIN_ASSETS,

package/dist/data/stnPackageVersion.d.ts

@@ -1,5 +1,5 @@
 /** Package version constants */
-declare const STN_UI_VERSION = "0.1.77";
-declare const STN_UI_VERSION_LABEL = "v0.1.77";
+declare const STN_UI_VERSION = "0.1.78";
+declare const STN_UI_VERSION_LABEL = "v0.1.78";
 
 export { STN_UI_VERSION, STN_UI_VERSION_LABEL };

package/dist/data/stnPackageVersion.js

@@ -1,7 +1,7 @@
 import {
   STN_UI_VERSION,
   STN_UI_VERSION_LABEL
-} from "../chunk-RSKMNZIS.js";
+} from "../chunk-GYPBZAB2.js";
 export {
   STN_UI_VERSION,
   STN_UI_VERSION_LABEL

package/dist/data/stnPopup.d.ts

@@ -105,8 +105,8 @@ declare const STN_POPUP_PARTS: readonly [{
     readonly note: "56px · h4 16 SemiBold · theme title token";
 }, {
     readonly part: "Close";
-    readonly selector: ".stn-pop__close";
-    readonly note: "StnButton icon=\"line/x\" size=sm · top 14 / right 16";
+    readonly selector: "StnButton (line/x)";
+    readonly note: "StnButton icon=\"line/x\" size=sm (24px) · 헤더 Flex 우측";
 }, {
     readonly part: "Body";
     readonly selector: ".stn-pop__body";
@@ -157,13 +157,13 @@ declare const STN_POPUP_TOKEN_ROWS: readonly [{
     readonly resolvesTo: "56px";
     readonly usage: ".stn-pop__actions";
 }, {
-    readonly token: "--stn-pop-close-size";
-    readonly resolvesTo: "icon-size.xsmall (16px)";
-    readonly usage: ".stn-pop__close hit";
+    readonly token: "--stn-size-24";
+    readonly resolvesTo: "24px";
+    readonly usage: "닫기 버튼 규격 (sm 24px)";
 }, {
-    readonly token: "--stn-pop-close-icon";
-    readonly resolvesTo: "icon-size.xsmall (16px)";
-    readonly usage: ".stn-pop__close glyph";
+    readonly token: "--stn-size-16";
+    readonly resolvesTo: "16px";
+    readonly usage: "닫기 아이콘 규격 (16px)";
 }, {
     readonly token: "--stn-pop-surface";
     readonly resolvesTo: "gray.850 (dark) · white (light)";

package/dist/data/stnPopup.js

@@ -12,7 +12,7 @@ import {
   STN_POPUP_USAGE,
   STN_POPUP_USAGE_HTML,
   resolveStnPopupSizeFromWidth
-} from "../chunk-75GHU6VI.js";
+} from "../chunk-G4SOYIHZ.js";
 export {
   STN_POPUP_INTRO,
   STN_POPUP_INVENTORY_ROWS,

package/dist/data/stnSectionSide.d.ts

@@ -27,7 +27,7 @@ declare const STN_SECTION_SIDE_SPEC: readonly [{
 }, {
     readonly property: "Translucent Bg";
     readonly value: "`--stn-section-side-bg-translucent`";
-    readonly note: "variant=\"translucent\" — light white-50 · dark black-50 (blur 8px)";
+    readonly note: "variant=\"translucent\" — light white-50 · dark black-25 (blur 8px)";
 }, {
     readonly property: "Border";
     readonly value: "`--stn-section-side-border`";
@@ -44,10 +44,6 @@ declare const STN_SECTION_SIDE_SPEC: readonly [{
     readonly property: "fill";
     readonly value: "`fill` prop → `.stn-section-side--fill`";
     readonly note: "list view — search+table 열 높이 · 하단 inset은 .stn-container padding-bottom";
-}, {
-    readonly property: "variant";
-    readonly value: "`variant=\"translucent\"`";
-    readonly note: "글래스모피즘 반투명 블러 패널 (.stn-section-side.translucent)";
 }];
 declare const STN_SECTION_SIDE_USAGE = "import {\n  StnSectionSide,\n  StnTree,\n} from '@stn-uiux/pub-ui-react'\nimport { STN_TREE_DEMO } from '@stn-uiux/pub-ui/data/stnTree'\n\n<StnSectionSide style={{ height: 360 }}>\n  <StnTree\n    heading=\"FOLDER STRUCTURE\"\n    nodes={STN_TREE_DEMO}\n    defaultExpandedIds={['root', 'group-a', 'equip', 'group-b']}\n  />\n</StnSectionSide>";
 

package/dist/data/stnSectionSide.js

@@ -3,7 +3,7 @@ import {
   STN_SECTION_SIDE_INTRO,
   STN_SECTION_SIDE_SPEC,
   STN_SECTION_SIDE_USAGE
-} from "../chunk-7YKAIENZ.js";
+} from "../chunk-RVYQ7WL3.js";
 export {
   STN_SECTION_SIDE_FIGMA,
   STN_SECTION_SIDE_INTRO,

package/dist/index.d.ts

@@ -22,7 +22,7 @@ export { STN_HEADER_TITLE_DEMO, STN_HEADER_TITLE_FIGMA, STN_HEADER_TITLE_FRAME,
 export { STN_ICONOGRAPHY_INTRO, STN_ICONOGRAPHY_PRIMITIVE_ROWS, STN_ICONOGRAPHY_SEMANTIC_ROWS, STN_ICON_HARDCODED_PX_AUDIT, STN_ICON_INVENTORY_CATEGORY_LABELS, STN_ICON_INVENTORY_ROWS, StnIconFigmaSize, StnIconInventoryCategory, StnIconInventoryRow, StnIconSizeStep, StnIconographyPrimitiveRow, StnIconographySemanticRow, iconographyPrimitiveToJson, iconographySemanticToJson } from './data/stnIconography.js';
 export { STN_INPUT_WIDTH_PRESETS, StnInputWidthPreset, StnInputWidthValue, StnResolvedInputWidth, isStnInputFullWidth, isStnInputWidthPreset, resolveStnInputWidth, toStnInputWidthPreset } from './data/stnInputWidth.js';
 export { STN_ELEVATION_Z_INDEX, STN_LAYER_DIM_MODAL_HTML, STN_LAYER_INTRO, STN_LAYER_ROLE_ROWS, STN_LAYER_ROLE_TO_LEVEL, STN_LAYER_ROLE_USAGE, STN_LAYER_SURFACE_ROWS, StnElevationLevel, StnLayerRole, StnLayerSurface } from './data/stnLayer.js';
-export { STN_LAYER0_BACKGROUND_FIGMA, STN_LAYER0_BACKGROUND_INTRO, STN_LAYER0_BACKGROUND_PLAYGROUND_PRESETS, STN_LAYER0_BACKGROUND_USAGE, STN_LAYER0_BACKGROUND_USAGE_HTML, STN_LAYER0_BACKGROUND_VARIANT_ROWS, STN_LAYER0_MAP_LIGHT_OVERLAY, StnLayer0BackgroundKind, StnLayer0BackgroundPlaygroundPresetId, StnLayer0BackgroundPreset } from './data/stnLayer0Background.js';
+export { STN_LAYER0_BACKGROUND_INTRO, STN_LAYER0_BACKGROUND_PLAYGROUND_PRESETS, STN_LAYER0_BACKGROUND_USAGE, STN_LAYER0_BACKGROUND_USAGE_HTML, STN_LAYER0_BACKGROUND_VARIANT_ROWS, STN_LAYER0_MAP_LIGHT_OVERLAY, StnLayer0BackgroundKind, StnLayer0BackgroundPlaygroundPresetId, StnLayer0BackgroundPreset } from './data/stnLayer0Background.js';
 export { STN_CDN_ASSET_BASE, STN_LAYER0_BACKGROUND_ASSET_PATHS, STN_LAYER0_BACKGROUND_DEMO_IMAGES } from './data/stnLayer0BackgroundAssets.js';
 export { STN_ALERT_CENTER_PAGE_SCAFFOLD_USAGE, STN_LAYER_SHELL_USAGE, STN_LAYOUT_ALERT_CENTER_USAGE, STN_LAYOUT_CONTENT_ROWS, STN_LAYOUT_INTRO, STN_LAYOUT_LAYER_PAGE_TREE, STN_LAYOUT_LIST_LAYER_TABS, STN_LAYOUT_LIST_VIEW_BARE_USAGE, STN_LAYOUT_LIST_VIEW_INTRO, STN_LAYOUT_LIST_VIEW_USAGE, STN_LAYOUT_MAP_DASHBOARD_HEADER_USAGE, STN_LAYOUT_MAP_DASHBOARD_INTRO, STN_LAYOUT_MAP_DASHBOARD_USAGE, STN_LAYOUT_MAP_LAYER_TABS, STN_LAYOUT_PAGE_TREE, STN_LAYOUT_PLAYGROUND_TABS, STN_LAYOUT_RECIPES, STN_LAYOUT_REGION_ROWS, STN_LAYOUT_SCREEN_RECIPES, STN_LAYOUT_SHELL_USAGE, STN_LAYOUT_SLOT_USAGE, STN_LAYOUT_WHEN_TO_USE, STN_PAGE_SCAFFOLD_COMPOUND_USAGE, STN_PAGE_SCAFFOLD_INTRO, STN_PAGE_SCAFFOLD_KINDS, StnContentAreaModifier, StnLayoutListLayerTabId, StnLayoutMapLayerTabId, StnLayoutRegion, StnLayoutScreenKind, StnLnbSide, StnPageScaffoldKind, applyLnbSideToModifiers, pubContentAreaClasses, pubLayoutRegionClass } from './data/stnLayout.js';
 export { STN_LIST_TABLE_FIGMA, STN_LIST_TABLE_FOOTER_MAX_ACTIONS, STN_LIST_TABLE_OPTION_ROWS, STN_LIST_TABLE_PAGE_SIZE_OPTIONS, StnListTableOptionRow } from './data/stnListTable.js';

package/dist/index.js

@@ -111,7 +111,7 @@ import {
   STN_SECTION_SIDE_INTRO,
   STN_SECTION_SIDE_SPEC,
   STN_SECTION_SIDE_USAGE
-} from "./chunk-7YKAIENZ.js";
+} from "./chunk-RVYQ7WL3.js";
 import {
   STN_SEGMENTED_FIGMA,
   STN_SEGMENTED_HTML,
@@ -124,7 +124,7 @@ import {
   STN_LOGIN_HTML,
   STN_LOGIN_INTRO,
   STN_LOGIN_USAGE
-} from "./chunk-3CYSR7V4.js";
+} from "./chunk-QGC3IK52.js";
 import {
   STN_MAP_DASHBOARD_OPTION_ROWS
 } from "./chunk-3DAZMM4T.js";
@@ -142,7 +142,7 @@ import {
 import {
   STN_UI_VERSION,
   STN_UI_VERSION_LABEL
-} from "./chunk-RSKMNZIS.js";
+} from "./chunk-GYPBZAB2.js";
 import {
   STN_PAGE_ENTER_MOTION_INTRO,
   STN_PAGE_ENTER_MOTION_ROWS,
@@ -412,7 +412,7 @@ import {
   STN_POPUP_USAGE,
   STN_POPUP_USAGE_HTML,
   resolveStnPopupSizeFromWidth
-} from "./chunk-75GHU6VI.js";
+} from "./chunk-G4SOYIHZ.js";
 import {
   STN_ELEVATION_Z_INDEX,
   STN_LAYER_DIM_MODAL_HTML,
@@ -423,14 +423,13 @@ import {
   STN_LAYER_SURFACE_ROWS
 } from "./chunk-EQ6LUBD6.js";
 import {
-  STN_LAYER0_BACKGROUND_FIGMA,
   STN_LAYER0_BACKGROUND_INTRO,
   STN_LAYER0_BACKGROUND_PLAYGROUND_PRESETS,
   STN_LAYER0_BACKGROUND_USAGE,
   STN_LAYER0_BACKGROUND_USAGE_HTML,
   STN_LAYER0_BACKGROUND_VARIANT_ROWS,
   STN_LAYER0_MAP_LIGHT_OVERLAY
-} from "./chunk-FSSMH6VS.js";
+} from "./chunk-TEK632EJ.js";
 import {
   STN_CDN_ASSET_BASE,
   STN_LAYER0_BACKGROUND_ASSET_PATHS,
@@ -465,7 +464,7 @@ import {
   applyLnbSideToModifiers,
   pubContentAreaClasses,
   pubLayoutRegionClass
-} from "./chunk-2ZYBBVBT.js";
+} from "./chunk-36QC3ZAD.js";
 import {
   STN_LOADING_SKELETON_COLORS,
   STN_LOADING_SKELETON_INTRO,
@@ -688,7 +687,6 @@ export {
   STN_INPUT_WIDTH_PRESETS,
   STN_LAYER0_BACKGROUND_ASSET_PATHS,
   STN_LAYER0_BACKGROUND_DEMO_IMAGES,
-  STN_LAYER0_BACKGROUND_FIGMA,
   STN_LAYER0_BACKGROUND_INTRO,
   STN_LAYER0_BACKGROUND_PLAYGROUND_PRESETS,
   STN_LAYER0_BACKGROUND_USAGE,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@stn-uiux/pub-ui",
-  "version": "0.1.77",
+  "version": "0.1.78",
   "description": "STN Pub design system — tokens, specs, and CSS for product HTML / React apps",
   "type": "module",
   "sideEffects": [

package/styles/components/stn-label-prefix.css

@@ -45,7 +45,7 @@
 .stn-label-prefix:has(.stn-dropdown.on),
 .stn-label-prefix:has(.stn-date-picker-popup),
 .stn-label-prefix:focus-within:has(.select_option) {
-  overflow: visible !important;
+  overflow: visible;
 }
 
 /* StnLabelPrefix 내부 드롭다운: 컨트롤 영역 기준으로 팝업 정렬 (방안 1) */
@@ -175,6 +175,8 @@
   background-color: var(--stn-input-bg);
 }
 
+
+
 /* 6-2. Filled (배경 채움) */
 .stn-label-prefix.filled {
   border: var(--stn-size-1, 1px) solid var(--stn-input-filled-border, transparent);
@@ -202,7 +204,7 @@
 /* 6-5. Translucent (반투명 블러 배경) */
 .stn-label-prefix.translucent {
   border: var(--stn-size-1, 1px) solid var(--stn-label-prefix-border-translucent, var(--stn-border-subtle));
-  background-color: var(--stn-label-prefix-bg-translucent, var(--stn-opacity-black-60));
+  background-color: var(--stn-label-prefix-bg-translucent, var(--stn-opacity-black-30));
   backdrop-filter: blur(var(--stn-label-prefix-translucent-blur, 8px));
   -webkit-backdrop-filter: blur(var(--stn-label-prefix-translucent-blur, 8px));
 }