@stn-uiux/pub-ui 0.1.81 → 0.1.84

package/dist/data/stnDatePicker.d.ts

@@ -2,13 +2,28 @@ type StnDateRange = {
     start: Date | null;
     end: Date | null;
 };
+/** `range`는 두 달, `single`은 한 달. 고르는 방식은 같다. 한 번은 시작일, 같은 날을 다시 누르면 그날만, 다른 날이면 범위. */
+type StnDatePickerMode = 'range' | 'single';
+/** 단건에 시간을 켤 때 시·분·초 위치. 기간 검색은 항상 달력 아래. */
+type StnDateTimePlacement = 'side' | 'bottom';
+type StnDatePresetKind = 'today' | 'days7' | 'month1' | 'month3' | 'thisMonth' | 'prevMonth';
+type StnDatePreset = {
+    id: string;
+    label: string;
+    getRange: (now: Date) => StnDateRange;
+};
+declare const STN_DATE_PRESET_LABEL: Record<StnDatePresetKind, string>;
+/** 바로가기 하나. `label`을 비우면 오늘·7일·1개월·3개월·당월·전월 중 해당 이름을 쓴다. */
+declare function createStnDatePreset(kind: StnDatePresetKind, label?: string): StnDatePreset;
+/** 화면에 둘 바로가기만 고른다. 순서는 배열 순서이고, 빼면 버튼도 빠진다. */
+declare function createStnDatePresets(kinds: readonly StnDatePresetKind[], labels?: Partial<Record<StnDatePresetKind, string>>): StnDatePreset[];
 declare const STN_DATE_PICKER_NAME = "Date range picker";
 declare const STN_DATE_PICKER_KO_NAME = "\uAE30\uAC04 \uC120\uD0DD \uB2EC\uB825";
-declare const STN_DATE_PICKER_INTRO = "\uB2EC\uB825 \uC544\uC774\uCF58 \uD074\uB9AD \uC2DC \uC5F4\uB9AC\uB294 **\uAE30\uAC04 \uC120\uD0DD \uD31D\uC5C5**\uC785\uB2C8\uB2E4. 2\uAC1C\uC6D4 \uB2EC\uB825 \u00B7 \uBC94\uC704 \uD558\uC774\uB77C\uC774\uD2B8 \u00B7 \uC2DC\u00B7\uBD84\u00B7\uCD08(optional) \u00B7 \uD655\uC778 \uBC84\uD2BC. \uD2B8\uB9AC\uAC70\uB294 `StnDateRangeField`\uC640 \uB3D9\uC77C \uC2A4\uCF00\uC77C(S/M/L)\uC774\uBA70, \uD1B5\uD569 \uC870\uB9BD\uC740 `StnDateRangePickerField` \u00B7 \uD31D\uC5C5\uB9CC \uC4F0\uB824\uBA74 `StnDateRangePicker`. Pub HTML `ant-picker-dropdown` \u00B7 `--calendar-*` \uD1A0\uD070.";
+declare const STN_DATE_PICKER_INTRO = "\uB2EC\uB825 \uC544\uC774\uCF58 \uD074\uB9AD \uC2DC \uC5F4\uB9AC\uB294 **\uAE30\uAC04 \uC120\uD0DD \uD31D\uC5C5**\uC785\uB2C8\uB2E4. \uAE30\uBCF8\uC740 2\uAC1C\uC6D4 \uBC94\uC704\uC774\uACE0, `mode=\"single\"`\uC774\uBA74 \uB2EC\uB825 \uD55C \uB2EC\uC785\uB2C8\uB2E4. \uB2E8\uAC74\uC5D0 `showTime`\uC744 \uC8FC\uBA74 \uC2DC\u00B7\uBD84\u00B7\uCD08\uAC00 \uAE30\uBCF8\uC73C\uB85C \uB2EC\uB825 \uC624\uB978\uCABD\uC5D0 \uBD99\uACE0, `timePlacement=\"bottom\"`\uC774\uBA74 \uB2EC\uB825 \uC544\uB798\uC785\uB2C8\uB2E4. `presets`\uB294 \uC624\uB298\u00B77\uC77C\uCC98\uB7FC \uD558\uB2E8 \uBC84\uD2BC\uC774\uBA70, \uB2E8\uAC74\uC5D0\uC11C\uB3C4 \uADF8 \uAE30\uAC04 \uC804\uCCB4\uB97C \uACE0\uB985\uB2C8\uB2E4. \uD2B8\uB9AC\uAC70\uB294 `StnDateRangeField`\uC640 \uB3D9\uC77C \uC2A4\uCF00\uC77C(sm/md/lg)\uC774\uBA70, \uD1B5\uD569 \uC870\uB9BD\uC740 `StnDateRangePickerField` \u00B7 \uD31D\uC5C5\uB9CC \uC4F0\uB824\uBA74 `StnDateRangePicker`.";
 declare const STN_DATE_PICKER_PART_ROWS: readonly [{
     readonly part: "Trigger";
     readonly component: "StnDateRangeField";
-    readonly note: "기간 표시 + 달력 아이콘 · TextField S/M/L 스케일";
+    readonly note: "기간 표시 + 달력 아이콘 · TextField sm/md/lg 스케일";
 }, {
     readonly part: "Field + popup";
     readonly component: "StnDateRangePickerField";
@@ -16,28 +31,44 @@ declare const STN_DATE_PICKER_PART_ROWS: readonly [{
 }, {
     readonly part: "Panel only";
     readonly component: "StnDateRangePicker";
-    readonly note: "달력·시간·확인 UI만 · 커스텀 앵커에 연결";
+    readonly note: "달력·시간·취소·확인 UI만 · 커스텀 앵커에 연결";
 }];
 declare const STN_DATE_PICKER_SPEC: readonly [{
     readonly property: "Calendar";
-    readonly value: "2 months side-by-side";
-    readonly note: "범위 선택 · in-range 하이라이트";
+    readonly value: "range: 2 months · single: 1 month";
+    readonly note: "`mode` 기본 range";
+}, {
+    readonly property: "Size";
+    readonly value: "sm · md · lg";
+    readonly note: "필드·달력 칸·패딩 토큰 스케일. 기본 md";
+}, {
+    readonly property: "Hover preview";
+    readonly value: "start only → hover band";
+    readonly note: "시작일만 고른 뒤 다른 날 위에 올리면 범위 미리보기";
 }, {
     readonly property: "Time";
     readonly value: "optional `showTime`";
-    readonly note: "시·분·초 컬럼";
+    readonly note: "기간은 달력 아래. 단건은 `timePlacement`로 오른쪽 또는 아래";
+}, {
+    readonly property: "Presets";
+    readonly value: "optional `presets`";
+    readonly note: "하단 버튼 · 줄바꿈 · 단건에서도 기간 전체";
 }, {
     readonly property: "Apply";
     readonly value: "확인 button";
     readonly note: "적용 후 팝업 닫기";
+}, {
+    readonly property: "Cancel";
+    readonly value: "취소 button · Esc · outside";
+    readonly note: "반영 없이 닫기";
 }, {
     readonly property: "CSS";
     readonly value: "stn-date-picker.css";
-    readonly note: "--calendar-* 토큰";
+    readonly note: "--calendar-* · --stn-date-picker-* 토큰";
 }];
-declare const STN_DATE_PICKER_USAGE = "import { StnDateRangePickerField } from '@stn-uiux/pub-ui-react'\n\nconst [range, setRange] = useState({\n  start: new Date('2024-02-07T09:22:34'),\n  end: new Date('2024-03-07T09:22:34'),\n})\n\n<StnDateRangePickerField\n  size=\"M\"\n  value={range}\n  onChange={setRange}\n  showTime\n  aria-label=\"Search period\"\n/>";
-declare const STN_DATE_PICKER_USAGE_HTML = "<button\n  type=\"button\"\n  class=\"stn-date-range-field md\"\n  aria-label=\"Search period\"\n>\n  <span class=\"stn-date-range-field__inner\">\n    <span class=\"stn-date-range-field__text\">\n      <span class=\"stn-date-range-field__value\">2024-02-07 09:22:34</span>\n      <span class=\"stn-date-range-field__sep\" aria-hidden=\"true\">~</span>\n      <span class=\"stn-date-range-field__value\">2024-03-07 09:22:34</span>\n    </span>\n    <span class=\"stn-date-range-field__icon\" aria-hidden=\"true\"></span>\n  </span>\n</button>\n\n<!-- \uB2EC\uB825 \uD328\uB110 \u2014 stn-date-picker.css \u00B7 ant-picker-dropdown -->\n<div class=\"stn-date-picker ant-picker-dropdown\" role=\"dialog\" aria-label=\"\uAE30\uAC04 \uC120\uD0DD\">\n  <!-- 2-month calendar \u00B7 showTime columns \u00B7 \uD655\uC778 button -->\n</div>";
+declare const STN_DATE_PICKER_USAGE = "import { StnDateRangePickerField, createStnDatePresets } from '@stn-uiux/pub-ui-react'\n\nconst [range, setRange] = useState({\n  start: new Date('2024-02-07T09:22:34'),\n  end: new Date('2024-03-07T09:22:34'),\n})\n\n<StnDateRangePickerField\n  size=\"md\"\n  value={range}\n  onChange={setRange}\n  showTime\n  aria-label=\"Search period\"\n/>\n\n// \uB2E8\uAC74 + \uC2DC\uAC04. \uBC14\uB85C\uAC00\uAE30\uB294 \uD654\uBA74\uC774 \uBC30\uC5F4\uB85C \uC815\uD55C\uB2E4.\n<StnDateRangePickerField\n  mode=\"single\"\n  showTime\n  timePlacement=\"bottom\"\n  presets={createStnDatePresets(['today', 'days7', 'month1', 'month3', 'thisMonth', 'prevMonth'])}\n  value={day}\n  onChange={setDay}\n/>";
+declare const STN_DATE_PICKER_USAGE_HTML = "<button\n  type=\"button\"\n  class=\"stn-date-range-field md\"\n  aria-label=\"Search period\"\n>\n  <span class=\"stn-date-range-field__inner\">\n    <span class=\"stn-date-range-field__text\">\n      <span class=\"stn-date-range-field__value\">2024-02-07 09:22:34</span>\n      <span class=\"stn-date-range-field__sep\" aria-hidden=\"true\">~</span>\n      <span class=\"stn-date-range-field__value\">2024-03-07 09:22:34</span>\n    </span>\n    <span class=\"stn-date-range-field__icon\" aria-hidden=\"true\"></span>\n  </span>\n</button>\n\n<!-- \uB2EC\uB825 \uD328\uB110 \u2014 stn-date-picker.css -->\n<div class=\"stn-date-picker-dropdown\" role=\"dialog\" aria-label=\"\uAE30\uAC04 \uC120\uD0DD\">\n  <div class=\"stn-date-picker-dropdown__body\">\n    <div class=\"stn-date-picker-dropdown__panels\">\n      <div class=\"stn-date-picker-panel\">...</div>\n      <div class=\"stn-date-picker-panel\">...</div>\n    </div>\n    <div class=\"stn-date-picker-time\">\n      <div class=\"stn-date-picker-time__side\">...</div>\n      <div class=\"stn-date-picker-time__side\">...</div>\n    </div>\n    <div class=\"stn-date-picker-footer\">\n      <button type=\"button\" class=\"stn-btn text md\">\n        <span class=\"stn-btn__label\">\uCDE8\uC18C</span>\n      </button>\n      <button type=\"button\" class=\"stn-btn text md\">\n        <span class=\"stn-btn__label\">\uD655\uC778</span>\n      </button>\n    </div>\n  </div>\n</div>";
 declare const STN_DATE_PICKER_PANEL_USAGE = "import { StnDateRangePicker } from '@stn-uiux/pub-ui-react'\n\n<StnDateRangePicker\n  open\n  value={{ start, end }}\n  onChange={setDraft}\n  onApply={(next) => { setRange(next); setOpen(false) }}\n  onClose={() => setOpen(false)}\n  showTime\n/>";
 declare const STN_DATE_PICKER_WEEKDAYS: readonly ["일", "월", "화", "수", "목", "금", "토"];
 
-export { STN_DATE_PICKER_INTRO, STN_DATE_PICKER_KO_NAME, STN_DATE_PICKER_NAME, STN_DATE_PICKER_PANEL_USAGE, STN_DATE_PICKER_PART_ROWS, STN_DATE_PICKER_SPEC, STN_DATE_PICKER_USAGE, STN_DATE_PICKER_USAGE_HTML, STN_DATE_PICKER_WEEKDAYS, type StnDateRange };
+export { STN_DATE_PICKER_INTRO, STN_DATE_PICKER_KO_NAME, STN_DATE_PICKER_NAME, STN_DATE_PICKER_PANEL_USAGE, STN_DATE_PICKER_PART_ROWS, STN_DATE_PICKER_SPEC, STN_DATE_PICKER_USAGE, STN_DATE_PICKER_USAGE_HTML, STN_DATE_PICKER_WEEKDAYS, STN_DATE_PRESET_LABEL, type StnDatePickerMode, type StnDatePreset, type StnDatePresetKind, type StnDateRange, type StnDateTimePlacement, createStnDatePreset, createStnDatePresets };

package/dist/data/stnDatePicker.js

@@ -7,8 +7,11 @@ import {
   STN_DATE_PICKER_SPEC,
   STN_DATE_PICKER_USAGE,
   STN_DATE_PICKER_USAGE_HTML,
-  STN_DATE_PICKER_WEEKDAYS
-} from "../chunk-YBNEQ5LB.js";
+  STN_DATE_PICKER_WEEKDAYS,
+  STN_DATE_PRESET_LABEL,
+  createStnDatePreset,
+  createStnDatePresets
+} from "../chunk-QJN2Z6RG.js";
 import "../chunk-5F63CMM7.js";
 export {
   STN_DATE_PICKER_INTRO,
@@ -19,6 +22,9 @@ export {
   STN_DATE_PICKER_SPEC,
   STN_DATE_PICKER_USAGE,
   STN_DATE_PICKER_USAGE_HTML,
-  STN_DATE_PICKER_WEEKDAYS
+  STN_DATE_PICKER_WEEKDAYS,
+  STN_DATE_PRESET_LABEL,
+  createStnDatePreset,
+  createStnDatePresets
 };
 //# sourceMappingURL=stnDatePicker.js.map

package/dist/data/stnEmptyState.d.ts

@@ -0,0 +1,35 @@
+/**
+ * Empty State / Error page — 공통 빈·오류 상태 표면
+ * @see StnEmptyState (@stn-uiux/pub-ui-react)
+ * @see styles/components/stn-empty-state.css
+ */
+declare const STN_EMPTY_STATE_GRAPHICS: Record<StnEmptyStateKind, string>;
+declare const STN_EMPTY_STATE_INTRO = "\uC544\uC774\uCF58 \u00B7 3D \uC77C\uB7EC\uC2A4\uD2B8 \u00B7 \uC81C\uBAA9 \u00B7 \uC124\uBA85 \u00B7 \uC561\uC158 \uBC84\uD2BC\uC73C\uB85C \uAD6C\uC131\uB418\uB294 \uACF5\uD1B5 \uBE48\u00B7\uC624\uB958 \uC0C1\uD0DC\uC785\uB2C8\uB2E4. \uC704\uC82F \uBCF8\uBB38\uBD80\uD130 \uC804\uCCB4 \uD398\uC774\uC9C0(404 \uB4F1)\uAE4C\uC9C0 `kind` \uD504\uB9AC\uC14B \uB610\uB294 \uC2AC\uB86F\uC73C\uB85C \uC870\uB9BD\uD558\uBA70, 3D \uADF8\uB798\uD53D\uACFC \uC2EC\uBCFC \uC544\uC774\uCF58\uC744 \uC790\uC720\uB86D\uAC8C \uC120\uD0DD\uD560 \uC218 \uC788\uC2B5\uB2C8\uB2E4.";
+/** 대표 프리셋 10종 */
+declare const STN_EMPTY_STATE_KINDS: readonly ["no-data", "not-found", "unauthorized", "forbidden", "server-error", "network", "timeout", "maintenance", "search-empty", "load-failed"];
+type StnEmptyStateKind = (typeof STN_EMPTY_STATE_KINDS)[number];
+type StnEmptyStateTone = 'neutral' | 'info' | 'warning' | 'error' | 'success';
+type StnEmptyStateSize = 'sm' | 'md' | 'lg';
+type StnEmptyStatePreset = {
+    kind: StnEmptyStateKind;
+    /** HTTP/상태 코드 표기 (문서·뱃지용, 선택) */
+    code?: string;
+    label: string;
+    title: string;
+    description: string;
+    /** Iconography slug (`line/…` · `fill/…`) */
+    icon: string;
+    /** 3D 일러스트 그래픽 이미지 (Data URL / static asset) */
+    graphic?: string;
+    tone: StnEmptyStateTone;
+    /** 기본 1차 액션 라벨 (문서·프리셋 제안) */
+    primaryActionLabel?: string;
+    /** 기본 2차 액션 라벨 */
+    secondaryActionLabel?: string;
+};
+declare const STN_EMPTY_STATE_PRESETS: Record<StnEmptyStateKind, StnEmptyStatePreset>;
+declare const STN_EMPTY_STATE_KIND_ROWS: StnEmptyStatePreset[];
+declare const STN_EMPTY_STATE_REACT_USAGE = "import { StnEmptyState, StnButton } from '@stn-uiux/pub-ui-react'\n\n{/* \uD504\uB9AC\uC14B + \uAE30\uBCF8 \uC561\uC158 */}\n<StnEmptyState\n  kind=\"no-data\"\n  primaryAction={{ label: '\uB418\uB3CC\uC544\uAC00\uAE30', onClick: () => history.back() }}\n/>\n\n{/* \uC804\uCCB4 \uD398\uC774\uC9C0 (404) */}\n<StnEmptyState\n  kind=\"not-found\"\n  size=\"lg\"\n  fullPage\n  primaryAction={{ label: '\uD648\uC73C\uB85C', onClick: () => navigate('/') }}\n  secondaryAction={{ label: '\uB418\uB3CC\uC544\uAC00\uAE30', onClick: () => history.back() }}\n/>\n\n{/* \uC2AC\uB86F\uC73C\uB85C \uC644\uC804 \uCEE4\uC2A4\uD140 */}\n<StnEmptyState\n  icon=\"line/database\"\n  title=\"\uD45C\uC2DC\uD560 \uC7A5\uBE44\uAC00 \uC5C6\uC2B5\uB2C8\uB2E4.\"\n  description=\"\uC7A5\uBE44\uB97C \uB4F1\uB85D\uD558\uBA74 \uC5EC\uAE30\uC5D0 \uD45C\uC2DC\uB429\uB2C8\uB2E4.\"\n  tone=\"neutral\"\n  actions={\n    <>\n      <StnButton variant=\"contained\">\uC7A5\uBE44 \uB4F1\uB85D</StnButton>\n      <StnButton variant=\"outlined\">\uB418\uB3CC\uC544\uAC00\uAE30</StnButton>\n    </>\n  }\n/>";
+declare const STN_EMPTY_STATE_USAGE_HTML = "<!-- \uACF5\uD1B5 empty / error \uC0C1\uD0DC \u00B7 stn-empty-state.css -->\n<div class=\"stn-empty-state md tone-neutral\" role=\"status\">\n  <div class=\"stn-empty-state__icon\" aria-hidden=\"true\">\n    <!-- StnIcon: fill/exclamation-circle -->\n  </div>\n  <div class=\"stn-empty-state__body\">\n    <p class=\"stn-empty-state__title stn-text-title-2\">\uB370\uC774\uD130\uAC00 \uC5C6\uC2B5\uB2C8\uB2E4.</p>\n    <p class=\"stn-empty-state__description stn-text-body-3 stn-text-color-secondary\">\n      \uD45C\uC2DC\uD560 \uD56D\uBAA9\uC774 \uC5C6\uC2B5\uB2C8\uB2E4.\n    </p>\n  </div>\n  <div class=\"stn-empty-state__actions\">\n    <button type=\"button\" class=\"stn-btn contained md\">\uB418\uB3CC\uC544\uAC00\uAE30</button>\n  </div>\n</div>\n\n<!-- \uC804\uCCB4 \uD398\uC774\uC9C0 404 -->\n<div class=\"stn-empty-state lg page tone-warning\" role=\"status\">\n  \u2026\n</div>";
+
+export { STN_EMPTY_STATE_GRAPHICS, STN_EMPTY_STATE_INTRO, STN_EMPTY_STATE_KINDS, STN_EMPTY_STATE_KIND_ROWS, STN_EMPTY_STATE_PRESETS, STN_EMPTY_STATE_REACT_USAGE, STN_EMPTY_STATE_USAGE_HTML, type StnEmptyStateKind, type StnEmptyStatePreset, type StnEmptyStateSize, type StnEmptyStateTone };

package/dist/data/stnEmptyState.js

@@ -0,0 +1,19 @@
+import {
+  STN_EMPTY_STATE_GRAPHICS,
+  STN_EMPTY_STATE_INTRO,
+  STN_EMPTY_STATE_KINDS,
+  STN_EMPTY_STATE_KIND_ROWS,
+  STN_EMPTY_STATE_PRESETS,
+  STN_EMPTY_STATE_REACT_USAGE,
+  STN_EMPTY_STATE_USAGE_HTML
+} from "../chunk-APXT43OG.js";
+export {
+  STN_EMPTY_STATE_GRAPHICS,
+  STN_EMPTY_STATE_INTRO,
+  STN_EMPTY_STATE_KINDS,
+  STN_EMPTY_STATE_KIND_ROWS,
+  STN_EMPTY_STATE_PRESETS,
+  STN_EMPTY_STATE_REACT_USAGE,
+  STN_EMPTY_STATE_USAGE_HTML
+};
+//# sourceMappingURL=stnEmptyState.js.map

package/dist/data/stnEmptyState.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":[],"sourcesContent":[],"mappings":"","names":[]}

package/dist/data/stnPackageVersion.d.ts

@@ -1,5 +1,5 @@
 /** Package version constants */
-declare const STN_UI_VERSION = "0.1.80";
-declare const STN_UI_VERSION_LABEL = "v0.1.80";
+declare const STN_UI_VERSION = "0.1.84";
+declare const STN_UI_VERSION_LABEL = "v0.1.84";
 
 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-PSVPO4FH.js";
+} from "../chunk-P22H2BFQ.js";
 export {
   STN_UI_VERSION,
   STN_UI_VERSION_LABEL

package/dist/data/stnPopover.d.ts

@@ -0,0 +1,18 @@
+/**
+ * StnPopover — Data & Types
+ */
+type StnPopoverHorizontalOrigin = 'left' | 'center' | 'right' | number;
+type StnPopoverVerticalOrigin = 'top' | 'center' | 'bottom' | number;
+interface StnPopoverOrigin {
+    vertical: StnPopoverVerticalOrigin;
+    horizontal: StnPopoverHorizontalOrigin;
+}
+interface StnPopoverPosition {
+    top: number;
+    left: number;
+}
+type StnPopoverReference = 'anchorEl' | 'anchorPosition';
+declare const STN_POPOVER_INTRO = "\uD2B9\uC815 \uC5D8\uB9AC\uBA3C\uD2B8(anchorEl) \uB610\uB294 \uD654\uBA74 \uC88C\uD45C(anchorPosition)\uB97C \uAE30\uC900\uC73C\uB85C \uC9C0\uC815\uB41C \uC704\uCE58(anchorOrigin \uBC0F transformOrigin)\uC5D0 \uB744\uC6B0\uB294 STN \uD45C\uC900 \uD50C\uB85C\uD305 \uD31D\uC624\uBC84 \uCEF4\uD3EC\uB10C\uD2B8\uC785\uB2C8\uB2E4.";
+declare const STN_POPOVER_USAGE = "import { useState } from 'react'\nimport { StnButton, StnPopover } from '@stn-uiux/pub-ui-react'\n\nexport function PopoverExample() {\n  const [anchorEl, setAnchorEl] = useState<HTMLButtonElement | null>(null)\n\n  const handleClick = (event: React.MouseEvent<HTMLButtonElement>) => {\n    setAnchorEl(event.currentTarget)\n  }\n\n  const handleClose = () => {\n    setAnchorEl(null)\n  }\n\n  const open = Boolean(anchorEl)\n\n  return (\n    <>\n      <StnButton onClick={handleClick}>Open Popover</StnButton>\n      <StnPopover\n        open={open}\n        anchorEl={anchorEl}\n        onClose={handleClose}\n        anchorOrigin={{\n          vertical: 'bottom',\n          horizontal: 'left',\n        }}\n        transformOrigin={{\n          vertical: 'top',\n          horizontal: 'left',\n        }}\n      >\n        <div style={{ padding: 'var(--stn-space-16)' }}>\uD31D\uC624\uBC84 \uCF58\uD150\uCE20</div>\n      </StnPopover>\n    </>\n  )\n}";
+
+export { STN_POPOVER_INTRO, STN_POPOVER_USAGE, type StnPopoverHorizontalOrigin, type StnPopoverOrigin, type StnPopoverPosition, type StnPopoverReference, type StnPopoverVerticalOrigin };

package/dist/data/stnPopover.js

@@ -0,0 +1,9 @@
+import {
+  STN_POPOVER_INTRO,
+  STN_POPOVER_USAGE
+} from "../chunk-FLKGJJD5.js";
+export {
+  STN_POPOVER_INTRO,
+  STN_POPOVER_USAGE
+};
+//# sourceMappingURL=stnPopover.js.map

package/dist/data/stnPopover.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":[],"sourcesContent":[],"mappings":"","names":[]}

package/dist/data/stnSplitView.d.ts

@@ -0,0 +1,16 @@
+/**
+ * STN Split View Pattern — Side + Stage shell (SSOT types)
+ * Store locator / 망구성도 / 캔버스 탐색: 중첩 Card 없이 좌 패널 + 우 스테이지.
+ */
+type StnSplitViewSideWidth = 'sm' | 'md' | 'lg';
+type StnSplitViewOverlayPlacement = 'top-left' | 'top-right' | 'bottom-left' | 'bottom-center' | 'bottom-right' | 'center-left' | 'center-right';
+declare const STN_SPLIT_VIEW_SIDE_WIDTHS: readonly StnSplitViewSideWidth[];
+declare const STN_SPLIT_VIEW_OVERLAY_PLACEMENTS: readonly StnSplitViewOverlayPlacement[];
+declare const STN_SPLIT_VIEW_INTRO: {
+    name: string;
+    slug: string;
+    kind: "pattern";
+    description: string;
+};
+
+export { STN_SPLIT_VIEW_INTRO, STN_SPLIT_VIEW_OVERLAY_PLACEMENTS, STN_SPLIT_VIEW_SIDE_WIDTHS, type StnSplitViewOverlayPlacement, type StnSplitViewSideWidth };

package/dist/data/stnSplitView.js

@@ -0,0 +1,11 @@
+import {
+  STN_SPLIT_VIEW_INTRO,
+  STN_SPLIT_VIEW_OVERLAY_PLACEMENTS,
+  STN_SPLIT_VIEW_SIDE_WIDTHS
+} from "../chunk-W7K3FSAX.js";
+export {
+  STN_SPLIT_VIEW_INTRO,
+  STN_SPLIT_VIEW_OVERLAY_PLACEMENTS,
+  STN_SPLIT_VIEW_SIDE_WIDTHS
+};
+//# sourceMappingURL=stnSplitView.js.map

package/dist/data/stnSplitView.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":[],"sourcesContent":[],"mappings":"","names":[]}

package/dist/data/stnStepCards.d.ts

@@ -0,0 +1,32 @@
+import { ReactNode } from 'react';
+import { StnStepStatus } from './stnStepper.js';
+export { StnStepperLineThickness, StnStepperSize } from './stnStepper.js';
+
+/**
+ * STN Step Cards Pattern — SSOT Data & Type Definitions
+ */
+
+interface StnStepCardItem {
+    key?: string | number;
+    /** 카드 제목 위 단계 라벨. 없으면 STEP 01 */
+    stepLabel?: ReactNode;
+    title: ReactNode;
+    /** 이 카드의 결과 제목. 없으면 StnStepCards의 resultLabel */
+    resultLabel?: ReactNode;
+    /** 결과 값. 없으면 상태 이름(성공·진행·대기·오류·경고) */
+    resultText?: ReactNode;
+    status?: StnStepStatus;
+    /** 이 카드의 버튼 문구. 없으면 StnStepCards의 actionLabel */
+    actionLabel?: ReactNode;
+    onAction?: () => void;
+    /** 결과를 열 수 있는 상태여도 버튼을 막는다 */
+    actionDisabled?: boolean;
+}
+declare const STN_STEP_CARDS_INTRO: {
+    name: string;
+    slug: string;
+    kind: "pattern";
+    description: string;
+};
+
+export { STN_STEP_CARDS_INTRO, type StnStepCardItem, StnStepStatus };

package/dist/data/stnStepCards.js

@@ -0,0 +1,7 @@
+import {
+  STN_STEP_CARDS_INTRO
+} from "../chunk-NYZMUDVK.js";
+export {
+  STN_STEP_CARDS_INTRO
+};
+//# sourceMappingURL=stnStepCards.js.map

package/dist/data/stnStepCards.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":[],"sourcesContent":[],"mappings":"","names":[]}

package/dist/data/stnStepper.d.ts

@@ -0,0 +1,78 @@
+import { ReactNode } from 'react';
+
+/**
+ * STN Stepper — SSOT Data & Type Definitions
+ */
+
+/** 가로/세로 진행 방향 */
+type StnStepperOrientation = 'horizontal' | 'vertical';
+/** 세로(vertical) 모드일 때 스텝 노드와 연결선의 위치 (left: 기본 왼쪽, right: 오른쪽) */
+type StnStepperPosition = 'left' | 'right';
+/** STN 표준 규격 크기 스케일 (GEMINI.md Rule 1 강제 준수: xs, sm, md, lg, xl) */
+type StnStepperSize = 'xs' | 'sm' | 'md' | 'lg' | 'xl';
+/** 스텝 연결선 두께 설정 (1~4px 숫자 또는 'xs' | 'sm' | 'md' | 'lg' | 'xl' 프리셋, 커스텀 치수 문자열) */
+type StnStepperLineThickness = StnStepperSize | 1 | 2 | 3 | 4 | (number & {}) | string;
+/** 각 스텝의 5대 상태 (Status) */
+type StnStepStatus = 'wait' | 'running' | 'success' | 'warning' | 'error';
+/** 스텝 데이터 항목 정의 (Data-driven 배열용) */
+interface StnStepItem {
+    /** 고유 키 (미지정 시 인덱스) */
+    key?: string | number;
+    /** 메인 스텝 제목 */
+    label: ReactNode;
+    /** 서브 캡션 설명 */
+    caption?: ReactNode;
+    /** 세로(vertical) 모드에서 펼쳐질 본문 내용 슬롯 (폼, 상세 설명, Continue/Back 버튼 등) */
+    content?: ReactNode;
+    /** 세로(vertical) 모드에서 본문 내용 강제 펼침 여부 (미지정 시 activeStep과 일치할 때 자동 펼침) */
+    expanded?: boolean;
+    /** 상태 직접 지정 (미지정 시 activeStep과 인덱스 비교로 자동 산출) */
+    status?: StnStepStatus;
+    /** 커스텀 아이콘 (StnIcon 문자열 이름 또는 ReactNode) */
+    icon?: string | ReactNode;
+    /** 에러 여부 또는 커스텀 에러 문구 */
+    error?: boolean | ReactNode;
+    /** 에러 발생 시 표시할 상세 안내 텍스트 */
+    errorText?: ReactNode;
+    /** 비활성화 여부 */
+    disabled?: boolean;
+    /** 선택 사항 라벨 (예: '선택 사항' 배지/텍스트) */
+    optional?: ReactNode;
+    /** 클릭 핸들러 (nonLinear 모드에서 동작) */
+    onClick?: () => void;
+}
+/** 5대 상태별 시각적 표현 및 시멘틱 토큰 매핑 명세 */
+declare const STN_STEP_STATUS_SPEC: {
+    readonly success: {
+        readonly label: "완료 (Success)";
+        readonly token: "var(--stn-feedback-success)";
+        readonly icon: "line/check";
+        readonly desc: "성공적으로 완료된 단계";
+    };
+    readonly running: {
+        readonly label: "진행 중 (Running)";
+        readonly token: "var(--stn-primary)";
+        readonly icon: "spinner";
+        readonly desc: "현재 처리 중 또는 입력 진행 중인 단계";
+    };
+    readonly wait: {
+        readonly label: "대기 (Wait)";
+        readonly token: "var(--stn-border-default)";
+        readonly textToken: "var(--stn-text-tertiary)";
+        readonly desc: "아직 도달하지 않은 대기 단계";
+    };
+    readonly error: {
+        readonly label: "오류 (Error)";
+        readonly token: "var(--stn-feedback-error)";
+        readonly icon: "line/alert-circle";
+        readonly desc: "검증 실패 또는 실행 중 오류가 발생한 단계";
+    };
+    readonly warning: {
+        readonly label: "경고 (Warning)";
+        readonly token: "var(--stn-feedback-warning)";
+        readonly icon: "line/alert-triangle";
+        readonly desc: "주의가 필요하거나 추가 확인이 필요한 단계";
+    };
+};
+
+export { STN_STEP_STATUS_SPEC, type StnStepItem, type StnStepStatus, type StnStepperLineThickness, type StnStepperOrientation, type StnStepperPosition, type StnStepperSize };

package/dist/data/stnStepper.js

@@ -0,0 +1,7 @@
+import {
+  STN_STEP_STATUS_SPEC
+} from "../chunk-N4PVFFKV.js";
+export {
+  STN_STEP_STATUS_SPEC
+};
+//# sourceMappingURL=stnStepper.js.map

package/dist/data/stnStepper.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":[],"sourcesContent":[],"mappings":"","names":[]}

package/dist/data/stnTree.d.ts

@@ -44,6 +44,9 @@ declare const STN_TREE_PARTS: readonly [{
 }, {
     readonly part: ".stn-tree__toggle";
     readonly role: "펼침/접힘 chevron (arrow-left 12)";
+}, {
+    readonly part: ".stn-tree__cell--checkbox";
+    readonly role: "아이콘 좌측 선택 체크박스 셀 (`StnCheckbox`)";
 }, {
     readonly part: ".stn-tree__icon--root / --folder / --server";
     readonly role: "노드 종류별 16px 아이콘";

package/dist/data/stnTree.js

@@ -9,7 +9,7 @@ import {
   STN_TREE_SECTION_SIDE_FIGMA,
   STN_TREE_USAGE_HTML,
   describeTreePatternReact
-} from "../chunk-AOS3IX4T.js";
+} from "../chunk-65B7YUTE.js";
 export {
   STN_TREE_DEMO,
   STN_TREE_FIGMA,

package/dist/data/stnTypography.d.ts

@@ -37,6 +37,22 @@ declare const STN_TYPOGRAPHY_PRIMITIVE_GROUPS: readonly [{
     readonly label: "line-height";
     readonly rows: StnTypographyPrimitiveRow[];
 }];
+/**
+ * Responsive font scale — viewport 구간별 --stn-font-size-base 재지정.
+ * SSOT: tokens/typography/primitive.json (media blocks) → stn-typography.css
+ * 모든 --stn-font-size-* / --stn-text-*-size 가 base 비율(calc)이므로 base 하나로 일괄 스케일.
+ */
+type StnFontScaleStepRow = {
+    bp: 'xl' | 'lg' | 'md';
+    range: string;
+    media: string;
+    cssVar: `--${string}`;
+    basePx: number;
+};
+declare const STN_FONT_SCALE_STEPS: readonly StnFontScaleStepRow[];
+/** base 대비 실제 px (예: scalePx(14, 15) → 13.13) */
+declare function scaleFontPx(designPx: number, basePx: number): number;
+declare const STN_FONT_SCALE_USAGE = "/* 1) \uAE30\uBCF8 \u2014 \uD328\uD0A4\uC9C0 CSS\uB9CC \uBD88\uB7EC\uC624\uBA74 \uC790\uB3D9 \uC801\uC6A9 (\uCD94\uAC00 \uCF54\uB4DC \uC5C6\uC74C) */\n@import '@stn-uiux/pub-ui/styles.css';\n\n/* 2) \uB2E8\uACC4 \uAC12 \uC870\uC815 \u2014 \uD328\uD0A4\uC9C0 CSS \uB2E4\uC74C\uC5D0 \uC120\uC5B8 */\n:root {\n  --stn-font-size-base-lg: 15.5px;\n  --stn-font-size-base-md: 14.5px;\n}\n\n/* 3) \uBC18\uC751\uD615 \uCD95\uC18C \uB044\uAE30 \u2014 \uBAA8\uB4E0 \uD3ED\uC5D0\uC11C 16px \uACE0\uC815 */\n:root {\n  --stn-font-size-base-lg: 16px;\n  --stn-font-size-base-md: 16px;\n}\n\n/* \uCEF4\uD3EC\uB10C\uD2B8 CSS\uB294 \uD56D\uC0C1 \uD1A0\uD070\uB9CC \uCC38\uC870 \u2014 px \uC9C1\uC811 \uC9C0\uC815 \uC2DC \uC2A4\uCF00\uC77C\uC5D0\uC11C \uBE60\uC9D0 */\n.my-widget__title { font-size: var(--stn-text-title-medium-size); }";
 /** Canonical semantic text roles (KT taxonomy · Pub px). Use CSS vars in component styles. */
 declare const STN_TYPOGRAPHY_SEMANTIC_ROWS: StnTypographySemanticRow[];
 declare function typographyPrimitivesToJson(): Record<string, string>;
@@ -46,4 +62,4 @@ declare function typographySemanticsToJson(): Record<string, {
     usage: string;
 }>;
 
-export { STN_FONT_FAMILY_ROWS, STN_FONT_SIZE_ROWS, STN_FONT_WEIGHT_ROWS, STN_LINE_HEIGHT_ROWS, STN_TYPOGRAPHY_PRIMITIVE_GROUPS, STN_TYPOGRAPHY_SEMANTIC_ROWS, type StnTypographyPrimitiveRow, type StnTypographySemanticRow, typographyPrimitivesToJson, typographySemanticsToJson };
+export { STN_FONT_FAMILY_ROWS, STN_FONT_SCALE_STEPS, STN_FONT_SCALE_USAGE, STN_FONT_SIZE_ROWS, STN_FONT_WEIGHT_ROWS, STN_LINE_HEIGHT_ROWS, STN_TYPOGRAPHY_PRIMITIVE_GROUPS, STN_TYPOGRAPHY_SEMANTIC_ROWS, type StnFontScaleStepRow, type StnTypographyPrimitiveRow, type StnTypographySemanticRow, scaleFontPx, typographyPrimitivesToJson, typographySemanticsToJson };

package/dist/data/stnTypography.js

@@ -1,20 +1,26 @@
 import {
   STN_FONT_FAMILY_ROWS,
+  STN_FONT_SCALE_STEPS,
+  STN_FONT_SCALE_USAGE,
   STN_FONT_SIZE_ROWS,
   STN_FONT_WEIGHT_ROWS,
   STN_LINE_HEIGHT_ROWS,
   STN_TYPOGRAPHY_PRIMITIVE_GROUPS,
   STN_TYPOGRAPHY_SEMANTIC_ROWS,
+  scaleFontPx,
   typographyPrimitivesToJson,
   typographySemanticsToJson
-} from "../chunk-6FEWLKVE.js";
+} from "../chunk-2TRZNWCA.js";
 export {
   STN_FONT_FAMILY_ROWS,
+  STN_FONT_SCALE_STEPS,
+  STN_FONT_SCALE_USAGE,
   STN_FONT_SIZE_ROWS,
   STN_FONT_WEIGHT_ROWS,
   STN_LINE_HEIGHT_ROWS,
   STN_TYPOGRAPHY_PRIMITIVE_GROUPS,
   STN_TYPOGRAPHY_SEMANTIC_ROWS,
+  scaleFontPx,
   typographyPrimitivesToJson,
   typographySemanticsToJson
 };

package/dist/index.d.ts

@@ -5,14 +5,15 @@ export { STN_BREADCRUMB_DEMO_ITEMS, STN_BREADCRUMB_FIGMA, STN_BREADCRUMB_FIGMA_L
 export { STN_BREAKPOINT_INTRO, STN_BREAKPOINT_MEDIA, STN_BREAKPOINT_ROWS, StnBreakpointRow, breakpointTokensToJson } from './data/stnBreakpoint.js';
 export { STN_BUTTON_ICON_ONLY_INTRO, STN_BUTTON_ICON_ONLY_ROWS, STN_ICON_BUTTON_DEFAULT_SURFACE, STN_ICON_BUTTON_SURFACES, STN_ICON_BUTTON_VARIANTS, StnButtonIconOnlyRow, StnIconButtonSurface, StnIconButtonVariant } from './data/stnButtonIconOnly.js';
 export { STN_BUTTON_STATE_INTRO, STN_BUTTON_STATE_MATRIX, STN_BUTTON_STATE_STATES, STN_BUTTON_STATE_VARIANTS, STN_BUTTON_VARIANT_MAP, StnButtonFigmaVariant, StnButtonInteractionState, StnButtonPubStatus, StnButtonStateCell, getButtonStateCell } from './data/stnButtonStates.js';
-export { STN_CHART_INTRO } from './data/stnChart.js';
+export { STN_CHART_COLOR_DEFINITIONS, STN_CHART_INTRO, STN_CHART_STATUS_DEFINITIONS, StnChartColorDefinition, StnChartStatus, StnChartStatusDefinition } from './data/stnChart.js';
 export { STN_CHECKBOX_FIGMA, STN_CHECKBOX_INTRO, STN_CHECKBOX_PLAYGROUND_DEFAULT, STN_CHECKBOX_PLAYGROUND_INTRO, STN_CHECKBOX_PLAYGROUND_PROPERTIES, STN_CHECKBOX_REACT_USAGE, STN_CHECKBOX_USAGE_HTML, StnCheckboxPlaygroundConfig, countCheckboxPlaygroundCombinations, describeCheckboxPlaygroundReact, listCheckboxPlaygroundMatrix } from './data/stnCheckbox.js';
 export { STN_CHIP_BORDER_ACCENTS, STN_CHIP_GRADE_LEGACY_CLASS, STN_CHIP_GRADE_ROWS, STN_CHIP_INTRO, STN_CHIP_METRICS, STN_CHIP_USAGE_ROWS, StnChipBorderAccent, StnChipGrade, StnChipLegacyGradeClass, StnChipUsageRow } from './data/stnChip.js';
 export { STN_ALL_PALETTE_ROWS, STN_BLUE_SCALE, STN_COBALT_SCALE, STN_COLOR_RATIO_SEGMENTS, STN_COLOR_RATIO_SEGMENTS_DARK, STN_COLOR_RATIO_SEGMENTS_LIGHT, STN_CYAN_SCALE, STN_GRAY_SCALE, STN_GREEN_SCALE, STN_OPACITY_BLACK_SCALE, STN_OPACITY_WHITE_SCALE, STN_ORANGE_SCALE, STN_PURPLE_SCALE, STN_RED_SCALE, STN_SEMANTIC_DARK_ROWS, STN_SEMANTIC_DS_ALIAS_DARK, STN_SEMANTIC_DS_ALIAS_LIGHT, STN_SEMANTIC_LIGHT_ROWS, STN_SEMANTIC_PRIMARY_DARK, STN_SEMANTIC_PRIMARY_LIGHT, STN_STATIC, STN_TEAL_SCALE, STN_YELLOW_SCALE, SemanticJsonEntry, StnColorRatioSegment, StnPaletteRow, StnSemanticTokenRow, hexToRgbString, paletteToJsonRecord, semanticPaletteToJsonRecord } from './data/stnColorPalette.js';
-export { STN_DATE_PICKER_INTRO, STN_DATE_PICKER_KO_NAME, STN_DATE_PICKER_NAME, STN_DATE_PICKER_PANEL_USAGE, STN_DATE_PICKER_PART_ROWS, STN_DATE_PICKER_SPEC, STN_DATE_PICKER_USAGE, STN_DATE_PICKER_USAGE_HTML, STN_DATE_PICKER_WEEKDAYS, StnDateRange } from './data/stnDatePicker.js';
+export { STN_DATE_PICKER_INTRO, STN_DATE_PICKER_KO_NAME, STN_DATE_PICKER_NAME, STN_DATE_PICKER_PANEL_USAGE, STN_DATE_PICKER_PART_ROWS, STN_DATE_PICKER_SPEC, STN_DATE_PICKER_USAGE, STN_DATE_PICKER_USAGE_HTML, STN_DATE_PICKER_WEEKDAYS, STN_DATE_PRESET_LABEL, StnDatePickerMode, StnDatePreset, StnDatePresetKind, StnDateRange, StnDateTimePlacement, createStnDatePreset, createStnDatePresets } from './data/stnDatePicker.js';
 export { STN_DATE_RANGE_FIELD_DEMO, STN_DATE_RANGE_FIELD_FIGMA, STN_DATE_RANGE_FIELD_HTML, STN_DATE_RANGE_FIELD_INTRO, STN_DATE_RANGE_FIELD_NAME, STN_DATE_RANGE_FIELD_SIZE_ROWS, STN_DATE_RANGE_FIELD_USAGE, StnDateRangeFieldSize, formatStnDateRangeFieldValue, parseStnDateRangeFieldValue } from './data/stnDateRangeField.js';
 export { STN_DROPDOWN_HTML, STN_DROPDOWN_HTML_COUNTS, STN_DROPDOWN_INTRO, STN_DROPDOWN_INVENTORY, STN_DROPDOWN_MENU_INTRO, STN_DROPDOWN_MENU_USAGE, STN_DROPDOWN_SIZE_ROWS, STN_DROPDOWN_USAGE, StnDropdownDirection, StnDropdownHelperTextPosition, StnDropdownMode, StnDropdownModifier, StnDropdownNativeLayout, StnDropdownOption, StnDropdownSize, StnDropdownVariant } from './data/stnDropdown.js';
 export { STN_ELEVATION_LAYER_BG_INTRO, STN_ELEVATION_LAYER_INTRO, STN_ELEVATION_LAYER_INTRO_DARK, STN_ELEVATION_LAYER_INTRO_LIGHT, STN_ELEVATION_LAYER_STACK, STN_ELEVATION_LEVEL_ROWS, StnElevationLayerStackRow, StnElevationLevelRow, elevationTokensToJson, formatElevationSemanticDark, formatElevationSemanticLight } from './data/stnElevation.js';
+export { STN_EMPTY_STATE_GRAPHICS, STN_EMPTY_STATE_INTRO, STN_EMPTY_STATE_KINDS, STN_EMPTY_STATE_KIND_ROWS, STN_EMPTY_STATE_PRESETS, STN_EMPTY_STATE_REACT_USAGE, STN_EMPTY_STATE_USAGE_HTML, StnEmptyStateKind, StnEmptyStatePreset, StnEmptyStateSize, StnEmptyStateTone } from './data/stnEmptyState.js';
 export { STN_FEEDBACK_BY_KIND, STN_FEEDBACK_SEMANTIC_ROWS, STN_FEEDBACK_SOURCE, StnFeedbackKind } from './data/stnFeedbackColors.js';
 export { STN_NAV_MENU_SUB_ICON, STN_SIDE_NAV_ITEM_INTRO, STN_SIDE_NAV_ITEM_STATES, STN_SIDE_NAV_SUB_ICON } from './data/stnSideNavItem.js';
 export { STN_SIDE_NAVIGATION_INTRO, STN_SIDE_NAVIGATION_USAGE, STN_SIDE_NAV_ITEM_USAGE } from './data/stnSideNavigation.js';
@@ -60,12 +61,16 @@ export { STN_TOAST_DEMO_MSG, STN_TOAST_ICON_SLUG, STN_TOAST_INTRO, STN_TOAST_KIN
 export { STN_TOGGLE_BUTTON_PLAYGROUND_DEFAULT, STN_TOGGLE_BUTTON_PLAYGROUND_INTRO, STN_TOGGLE_BUTTON_PLAYGROUND_PROPERTIES, STN_TOGGLE_BUTTON_REACT_USAGE, STN_TOGGLE_BUTTON_USAGE_HTML, StnToggleButtonPlaygroundConfig, countToggleButtonPlaygroundCombinations, describeToggleButtonPlaygroundReact, listToggleButtonPlaygroundMatrix } from './data/stnToggleButton.js';
 export { STN_TREE_DEMO, STN_TREE_FIGMA, STN_TREE_INTRO, STN_TREE_PARTS, STN_TREE_PATTERN_PLAYGROUND_DEFAULT, STN_TREE_PATTERN_PLAYGROUND_PROPERTIES, STN_TREE_REACT_EXAMPLE, STN_TREE_SECTION_SIDE_FIGMA, STN_TREE_USAGE_HTML, StnTreeDemoNode, StnTreePatternPlaygroundConfig, describeTreePatternReact } from './data/stnTree.js';
 export { STN_TYPE_SCALE_CLASS, STN_TYPE_SCALE_INTRO, STN_TYPE_SCALE_ROWS, StnTypeScaleCategory, StnTypeScaleRow, resolveTypeScaleName, typeScalePill } from './data/stnTypeScale.js';
-export { STN_FONT_FAMILY_ROWS, STN_FONT_SIZE_ROWS, STN_FONT_WEIGHT_ROWS, STN_LINE_HEIGHT_ROWS, STN_TYPOGRAPHY_PRIMITIVE_GROUPS, STN_TYPOGRAPHY_SEMANTIC_ROWS, StnTypographyPrimitiveRow, StnTypographySemanticRow, typographyPrimitivesToJson, typographySemanticsToJson } from './data/stnTypography.js';
+export { STN_FONT_FAMILY_ROWS, STN_FONT_SCALE_STEPS, STN_FONT_SCALE_USAGE, STN_FONT_SIZE_ROWS, STN_FONT_WEIGHT_ROWS, STN_LINE_HEIGHT_ROWS, STN_TYPOGRAPHY_PRIMITIVE_GROUPS, STN_TYPOGRAPHY_SEMANTIC_ROWS, StnFontScaleStepRow, StnTypographyPrimitiveRow, StnTypographySemanticRow, scaleFontPx, typographyPrimitivesToJson, typographySemanticsToJson } from './data/stnTypography.js';
 export { STN_CARD_INTRO, STN_CARD_PADDINGS, STN_CARD_RADII, STN_CARD_SEVERITIES, STN_CARD_VARIANTS, StnCardPadding, StnCardRadius, StnCardSeverity, StnCardVariant } from './data/stnCard.js';
 export { STN_ALERT_CENTER_DASHBOARD_USAGE, STN_ALERT_CENTER_DASHBOARD_WIDGETS, STN_WIDGET_APPEARANCE_ROWS, STN_WIDGET_CHART_SLOT_HTML, STN_WIDGET_CHART_SLOT_REACT, STN_WIDGET_DISABILITY_STATUS_DEMO, STN_WIDGET_FIGMA, STN_WIDGET_FIGMA_DARK, STN_WIDGET_FIGMA_DARK_URL, STN_WIDGET_FIGMA_SHELL_HTML, STN_WIDGET_FIGMA_SHELL_REACT, STN_WIDGET_FIGMA_URL, STN_WIDGET_GRADE_ROW_DEMO, STN_WIDGET_HEADER_HTML, STN_WIDGET_HEADER_REACT, STN_WIDGET_INTRO, STN_WIDGET_KINDS, STN_WIDGET_SHELL_ROWS, STN_WIDGET_TOP5_BARS_DEMO, STN_WIDGET_TRAFFIC_BARS_DEMO, STN_WIDGET_USAGE, STN_WIDGET_USAGE_HTML, StnWidgetAppearance, StnWidgetAppearanceLegacy, StnWidgetAppearanceShell, StnWidgetAssetId, StnWidgetBackgroundMode, StnWidgetContentFamily, StnWidgetGradeRowGrade, StnWidgetKind, StnWidgetKindBodySlot, StnWidgetKindPreview, StnWidgetShell, buildStnWidgetKindUsage, getStnWidgetKind, isStnWidgetKindSlug, normalizeStnWidgetAppearance, resolveStnWidgetBackground, resolveStnWidgetKindAppearance, resolveStnWidgetKindBodySlot, stnWidgetSampleUrl } from './data/stnWidget.js';
 export { STN_STATUS_DEMO_STEPS, StnStatusDotState, StnStatusFlowStep, StnStatusFlowStepColor } from './data/stnStatus.js';
 export { StnTabIconPosition, StnTabIconSize, StnTabItem, StnTabPanelPadding, StnTabScrollButtons, StnTabsSize, StnTabsVariant } from './data/stnTabs.js';
 export { STN_DIVIDER_INTRO, STN_DIVIDER_ORIENTATIONS, STN_DIVIDER_TEXT_ALIGNS, STN_DIVIDER_VARIANTS, StnDividerOrientation, StnDividerTextAlign, StnDividerVariant } from './data/stnDivider.js';
+export { STN_STEP_STATUS_SPEC, StnStepItem, StnStepStatus, StnStepperLineThickness, StnStepperOrientation, StnStepperPosition, StnStepperSize } from './data/stnStepper.js';
+export { STN_POPOVER_INTRO, STN_POPOVER_USAGE, StnPopoverHorizontalOrigin, StnPopoverOrigin, StnPopoverPosition, StnPopoverReference, StnPopoverVerticalOrigin } from './data/stnPopover.js';
+export { STN_STEP_CARDS_INTRO, StnStepCardItem } from './data/stnStepCards.js';
+export { STN_SPLIT_VIEW_INTRO, STN_SPLIT_VIEW_OVERLAY_PLACEMENTS, STN_SPLIT_VIEW_SIDE_WIDTHS, StnSplitViewOverlayPlacement, StnSplitViewSideWidth } from './data/stnSplitView.js';
 export { STN_UI_CATALOG, STN_UI_COMPONENTS, STN_UI_FOUNDATIONS, StnUiComponentId, StnUiEntry, StnUiFoundationId } from './components.js';
 export { SYSTEM_ICON_DATA_URLS } from './data/stnSystemIconsData.generated.js';
 import 'react';