@stn-uiux/pub-ui 0.1.70 → 0.1.71
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/{chunk-JHRYIWWJ.js → chunk-7YKAIENZ.js} +11 -1
- package/dist/chunk-7YKAIENZ.js.map +1 -0
- package/dist/chunk-RZCFFGBA.js +9 -0
- package/dist/chunk-RZCFFGBA.js.map +1 -0
- package/dist/data/index.js +2 -2
- package/dist/data/stnPackageVersion.d.ts +2 -2
- package/dist/data/stnPackageVersion.js +1 -1
- package/dist/data/stnSectionSide.d.ts +8 -0
- package/dist/data/stnSectionSide.js +1 -1
- package/dist/index.js +2 -2
- package/package.json +1 -1
- package/styles/components/stn-checkbox.css +20 -0
- package/styles/components/stn-label-prefix.css +16 -3
- package/styles/patterns/stn-section-side.css +9 -0
- package/styles/tokens/stn-colors-semantic.css +13 -1
- package/styles/tokens/stn-colors.css +9 -9
- package/styles/tokens/stn-size-semantic.css +3 -0
- package/dist/chunk-JHRYIWWJ.js.map +0 -1
- package/dist/chunk-QQYDH4WU.js +0 -9
- package/dist/chunk-QQYDH4WU.js.map +0 -1
|
@@ -17,6 +17,11 @@ var STN_SECTION_SIDE_SPEC = [
|
|
|
17
17
|
value: "`--stn-section-side-bg`",
|
|
18
18
|
note: "light white \xB7 dark gray-900"
|
|
19
19
|
},
|
|
20
|
+
{
|
|
21
|
+
property: "Translucent Bg",
|
|
22
|
+
value: "`--stn-section-side-bg-translucent`",
|
|
23
|
+
note: 'variant="translucent" \u2014 light white-50 \xB7 dark black-50 (blur 8px)'
|
|
24
|
+
},
|
|
20
25
|
{
|
|
21
26
|
property: "Border",
|
|
22
27
|
value: "`--stn-section-side-border`",
|
|
@@ -32,6 +37,11 @@ var STN_SECTION_SIDE_SPEC = [
|
|
|
32
37
|
property: "fill",
|
|
33
38
|
value: "`fill` prop \u2192 `.stn-section-side--fill`",
|
|
34
39
|
note: "list view \u2014 search+table \uC5F4 \uB192\uC774 \xB7 \uD558\uB2E8 inset\uC740 .stn-container padding-bottom"
|
|
40
|
+
},
|
|
41
|
+
{
|
|
42
|
+
property: "variant",
|
|
43
|
+
value: '`variant="translucent"`',
|
|
44
|
+
note: "\uAE00\uB798\uC2A4\uBAA8\uD53C\uC998 \uBC18\uD22C\uBA85 \uBE14\uB7EC \uD328\uB110 (.stn-section-side.translucent)"
|
|
35
45
|
}
|
|
36
46
|
];
|
|
37
47
|
var STN_SECTION_SIDE_USAGE = `import {
|
|
@@ -54,4 +64,4 @@ export {
|
|
|
54
64
|
STN_SECTION_SIDE_SPEC,
|
|
55
65
|
STN_SECTION_SIDE_USAGE
|
|
56
66
|
};
|
|
57
|
-
//# sourceMappingURL=chunk-
|
|
67
|
+
//# sourceMappingURL=chunk-7YKAIENZ.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../src/data/stnSectionSide.ts"],"sourcesContent":["/**\n * Infomap section-side panel\n * Dark 40000040:102539 · Light 40000042:187762\n * @see StnSectionSide · stn-section-side.css\n */\n\nexport const STN_SECTION_SIDE_FIGMA = {\n dark: '40000040:102539',\n light: '40000042:187762',\n} as const\n\nexport const STN_SECTION_SIDE_INTRO =\n '맵·대시보드 **사이드 패널** 패턴. Light: white · gray-25 border · radius 8 · shadow. Dark: gray-900 · gray-800 border · radius 10. 본문 `StnScroll` + `StnTree`.'\n\nexport const STN_SECTION_SIDE_SPEC = [\n { property: 'Width', value: '264px', note: 'Figma frame' },\n { property: 'Padding', value: '8px', note: '' },\n {\n property: 'Radius',\n value: '`--stn-section-side-radius`',\n note: 'light 8 · dark 10',\n },\n {\n property: 'Background',\n value: '`--stn-section-side-bg`',\n note: 'light white · dark gray-900',\n },\n {\n property: 'Translucent Bg',\n value: '`--stn-section-side-bg-translucent`',\n note: 'variant=\"translucent\" — light white-50 · dark black-50 (blur 8px)',\n },\n {\n property: 'Border',\n value: '`--stn-section-side-border`',\n note: 'light gray-25 · dark gray-800',\n },\n {\n property: 'Shadow',\n value: '`--stn-section-side-shadow`',\n note: 'light 0 3px 10px gray-75 · dark none',\n },\n { property: 'Body', value: 'StnScroll vertical', note: 'overflow tree' },\n {\n property: 'fill',\n value: '`fill` prop → `.stn-section-side--fill`',\n note: 'list view — search+table 열 높이 · 하단 inset은 .stn-container padding-bottom',\n },\n {\n property: 'variant',\n value: '`variant=\"translucent\"`',\n note: '글래스모피즘 반투명 블러 패널 (.stn-section-side.translucent)',\n },\n] as const\n\nexport 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>`\n"],"mappings":";AAMO,IAAM,yBAAyB;AAAA,EACpC,MAAM;AAAA,EACN,OAAO;AACT;AAEO,IAAM,yBACX;AAEK,IAAM,wBAAwB;AAAA,EACnC,EAAE,UAAU,SAAS,OAAO,SAAS,MAAM,cAAc;AAAA,EACzD,EAAE,UAAU,WAAW,OAAO,OAAO,MAAM,GAAG;AAAA,EAC9C;AAAA,IACE,UAAU;AAAA,IACV,OAAO;AAAA,IACP,MAAM;AAAA,EACR;AAAA,EACA;AAAA,IACE,UAAU;AAAA,IACV,OAAO;AAAA,IACP,MAAM;AAAA,EACR;AAAA,EACA;AAAA,IACE,UAAU;AAAA,IACV,OAAO;AAAA,IACP,MAAM;AAAA,EACR;AAAA,EACA;AAAA,IACE,UAAU;AAAA,IACV,OAAO;AAAA,IACP,MAAM;AAAA,EACR;AAAA,EACA;AAAA,IACE,UAAU;AAAA,IACV,OAAO;AAAA,IACP,MAAM;AAAA,EACR;AAAA,EACA,EAAE,UAAU,QAAQ,OAAO,sBAAsB,MAAM,gBAAgB;AAAA,EACvE;AAAA,IACE,UAAU;AAAA,IACV,OAAO;AAAA,IACP,MAAM;AAAA,EACR;AAAA,EACA;AAAA,IACE,UAAU;AAAA,IACV,OAAO;AAAA,IACP,MAAM;AAAA,EACR;AACF;AAEO,IAAM,yBAAyB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;","names":[]}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../src/data/stnPackageVersion.ts"],"sourcesContent":["/** Package version constants */\nexport const STN_UI_VERSION = '0.1.71'\nexport const STN_UI_VERSION_LABEL = 'v0.1.71'\n"],"mappings":";AACO,IAAM,iBAAiB;AACvB,IAAM,uBAAuB;","names":[]}
|
package/dist/data/index.js
CHANGED
|
@@ -105,7 +105,7 @@ import {
|
|
|
105
105
|
STN_SECTION_SIDE_INTRO,
|
|
106
106
|
STN_SECTION_SIDE_SPEC,
|
|
107
107
|
STN_SECTION_SIDE_USAGE
|
|
108
|
-
} from "../chunk-
|
|
108
|
+
} from "../chunk-7YKAIENZ.js";
|
|
109
109
|
import {
|
|
110
110
|
STN_SEGMENTED_FIGMA,
|
|
111
111
|
STN_SEGMENTED_HTML,
|
|
@@ -136,7 +136,7 @@ import {
|
|
|
136
136
|
import {
|
|
137
137
|
STN_UI_VERSION,
|
|
138
138
|
STN_UI_VERSION_LABEL
|
|
139
|
-
} from "../chunk-
|
|
139
|
+
} from "../chunk-RZCFFGBA.js";
|
|
140
140
|
import {
|
|
141
141
|
STN_PAGE_ENTER_MOTION_INTRO,
|
|
142
142
|
STN_PAGE_ENTER_MOTION_ROWS,
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
/** Package version constants */
|
|
2
|
-
declare const STN_UI_VERSION = "0.1.
|
|
3
|
-
declare const STN_UI_VERSION_LABEL = "v0.1.
|
|
2
|
+
declare const STN_UI_VERSION = "0.1.71";
|
|
3
|
+
declare const STN_UI_VERSION_LABEL = "v0.1.71";
|
|
4
4
|
|
|
5
5
|
export { STN_UI_VERSION, STN_UI_VERSION_LABEL };
|
|
@@ -24,6 +24,10 @@ declare const STN_SECTION_SIDE_SPEC: readonly [{
|
|
|
24
24
|
readonly property: "Background";
|
|
25
25
|
readonly value: "`--stn-section-side-bg`";
|
|
26
26
|
readonly note: "light white · dark gray-900";
|
|
27
|
+
}, {
|
|
28
|
+
readonly property: "Translucent Bg";
|
|
29
|
+
readonly value: "`--stn-section-side-bg-translucent`";
|
|
30
|
+
readonly note: "variant=\"translucent\" — light white-50 · dark black-50 (blur 8px)";
|
|
27
31
|
}, {
|
|
28
32
|
readonly property: "Border";
|
|
29
33
|
readonly value: "`--stn-section-side-border`";
|
|
@@ -40,6 +44,10 @@ declare const STN_SECTION_SIDE_SPEC: readonly [{
|
|
|
40
44
|
readonly property: "fill";
|
|
41
45
|
readonly value: "`fill` prop → `.stn-section-side--fill`";
|
|
42
46
|
readonly note: "list view — search+table 열 높이 · 하단 inset은 .stn-container padding-bottom";
|
|
47
|
+
}, {
|
|
48
|
+
readonly property: "variant";
|
|
49
|
+
readonly value: "`variant=\"translucent\"`";
|
|
50
|
+
readonly note: "글래스모피즘 반투명 블러 패널 (.stn-section-side.translucent)";
|
|
43
51
|
}];
|
|
44
52
|
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>";
|
|
45
53
|
|
package/dist/index.js
CHANGED
|
@@ -110,7 +110,7 @@ import {
|
|
|
110
110
|
STN_SECTION_SIDE_INTRO,
|
|
111
111
|
STN_SECTION_SIDE_SPEC,
|
|
112
112
|
STN_SECTION_SIDE_USAGE
|
|
113
|
-
} from "./chunk-
|
|
113
|
+
} from "./chunk-7YKAIENZ.js";
|
|
114
114
|
import {
|
|
115
115
|
STN_SEGMENTED_FIGMA,
|
|
116
116
|
STN_SEGMENTED_HTML,
|
|
@@ -141,7 +141,7 @@ import {
|
|
|
141
141
|
import {
|
|
142
142
|
STN_UI_VERSION,
|
|
143
143
|
STN_UI_VERSION_LABEL
|
|
144
|
-
} from "./chunk-
|
|
144
|
+
} from "./chunk-RZCFFGBA.js";
|
|
145
145
|
import {
|
|
146
146
|
STN_PAGE_ENTER_MOTION_INTRO,
|
|
147
147
|
STN_PAGE_ENTER_MOTION_ROWS,
|
package/package.json
CHANGED
|
@@ -68,6 +68,26 @@
|
|
|
68
68
|
background-color: var(--stn-checkbox-bg, transparent);
|
|
69
69
|
}
|
|
70
70
|
|
|
71
|
+
/* Variant: Translucent (반투명 블러 배경) */
|
|
72
|
+
.stn-checkbox.translucent input + label:before {
|
|
73
|
+
border-color: var(--stn-checkbox-border-translucent, var(--stn-border-subtle));
|
|
74
|
+
background-color: var(--stn-checkbox-bg-translucent, var(--stn-opacity-black-60));
|
|
75
|
+
backdrop-filter: blur(var(--stn-checkbox-translucent-blur, 4px));
|
|
76
|
+
-webkit-backdrop-filter: blur(var(--stn-checkbox-translucent-blur, 4px));
|
|
77
|
+
}
|
|
78
|
+
|
|
79
|
+
.stn-checkbox.translucent input:checked + label:before,
|
|
80
|
+
.stn-checkbox.translucent input:indeterminate + label:before,
|
|
81
|
+
.stn-checkbox.translucent.indeterminate input + label:before {
|
|
82
|
+
border-color: var(--stn-checkbox-border-translucent, var(--stn-border-subtle));
|
|
83
|
+
background-color: var(--stn-checkbox-bg-translucent, var(--stn-opacity-black-60));
|
|
84
|
+
}
|
|
85
|
+
|
|
86
|
+
.stn-checkbox.translucent input:disabled + label:before {
|
|
87
|
+
border-color: var(--stn-checkbox-disabled-border);
|
|
88
|
+
background-color: var(--stn-checkbox-disabled-bg);
|
|
89
|
+
}
|
|
90
|
+
|
|
71
91
|
.stn-checkbox input:checked + label:after {
|
|
72
92
|
content: '';
|
|
73
93
|
position: absolute;
|
|
@@ -7,7 +7,7 @@
|
|
|
7
7
|
* └── .stn-label-prefix__control (children slot — StnDropdown·StnTextField·StnDateRangeField 등)
|
|
8
8
|
*
|
|
9
9
|
* Props:
|
|
10
|
-
* variant : outline(기본) · filled · standard · transparent
|
|
10
|
+
* variant : outline(기본) · filled · standard · transparent · translucent
|
|
11
11
|
* size : sm(24px) · md(32px, 기본) · lg(40px)
|
|
12
12
|
* radius : none · sm · md · lg · xl (기본은 size에 따름)
|
|
13
13
|
* position : prefix(왼쪽, 기본) · suffix(오른쪽)
|
|
@@ -18,7 +18,7 @@
|
|
|
18
18
|
* 3. Divider (.stn-label-prefix__divider)
|
|
19
19
|
* 4. Control Slot (.stn-label-prefix__control)
|
|
20
20
|
* 5. Size (sm · md · lg)
|
|
21
|
-
* 6. Variant (outline · filled · standard · transparent)
|
|
21
|
+
* 6. Variant (outline · filled · standard · transparent · translucent)
|
|
22
22
|
* 7. Focus-within State
|
|
23
23
|
* 8. Suffix Position
|
|
24
24
|
* 9. Radius Override
|
|
@@ -199,11 +199,24 @@
|
|
|
199
199
|
background-color: transparent;
|
|
200
200
|
}
|
|
201
201
|
|
|
202
|
+
/* 6-5. Translucent (반투명 블러 배경) */
|
|
203
|
+
.stn-label-prefix.translucent {
|
|
204
|
+
border: var(--stn-size-1, 1px) solid var(--stn-label-prefix-border-translucent, var(--stn-border-subtle));
|
|
205
|
+
background-color: var(--stn-label-prefix-bg-translucent, var(--stn-opacity-black-60));
|
|
206
|
+
backdrop-filter: blur(var(--stn-label-prefix-translucent-blur, 8px));
|
|
207
|
+
-webkit-backdrop-filter: blur(var(--stn-label-prefix-translucent-blur, 8px));
|
|
208
|
+
}
|
|
209
|
+
|
|
210
|
+
.stn-label-prefix.translucent > .stn-label-prefix__label {
|
|
211
|
+
background-color: transparent;
|
|
212
|
+
}
|
|
213
|
+
|
|
202
214
|
/* ==========================================================================
|
|
203
215
|
7. Focus-within State
|
|
204
216
|
========================================================================== */
|
|
205
217
|
.stn-label-prefix.outline:focus-within,
|
|
206
|
-
.stn-label-prefix.filled:focus-within
|
|
218
|
+
.stn-label-prefix.filled:focus-within,
|
|
219
|
+
.stn-label-prefix.translucent:focus-within {
|
|
207
220
|
border-color: var(--stn-input-focus-fg, var(--stn-primary));
|
|
208
221
|
}
|
|
209
222
|
|
|
@@ -21,6 +21,15 @@
|
|
|
21
21
|
overflow: hidden;
|
|
22
22
|
}
|
|
23
23
|
|
|
24
|
+
/* translucent variant — 반투명 블러 글래스모피즘 외형 */
|
|
25
|
+
.stn-section-side.translucent,
|
|
26
|
+
.stn-section-side--translucent {
|
|
27
|
+
background: var(--stn-section-side-bg-translucent);
|
|
28
|
+
backdrop-filter: blur(var(--stn-section-side-translucent-blur, 8px));
|
|
29
|
+
-webkit-backdrop-filter: blur(var(--stn-section-side-translucent-blur, 8px));
|
|
30
|
+
border-color: var(--stn-section-side-border-translucent, var(--stn-border-subtle));
|
|
31
|
+
}
|
|
32
|
+
|
|
24
33
|
/* fullWidth prop 또는 부모 LNB 컨테이너 안에서 가로 100% 확장 지원 */
|
|
25
34
|
.stn-section-side.is-full-width,
|
|
26
35
|
.stn-section-side--full,
|
|
@@ -66,6 +66,8 @@
|
|
|
66
66
|
--stn-input-placeholder: var(--stn-gray-600);
|
|
67
67
|
--stn-dropdown-bg-translucent: var(--stn-opacity-black-25);
|
|
68
68
|
--stn-label-prefix-label-bg: var(--stn-gray-800);
|
|
69
|
+
--stn-label-prefix-bg-translucent: var(--stn-opacity-black-60);
|
|
70
|
+
--stn-label-prefix-border-translucent: var(--stn-border-subtle);
|
|
69
71
|
--stn-tooltip-bg-neutral: var(--stn-gray-700);
|
|
70
72
|
--stn-tooltip-fg-neutral: var(--stn-static-white);
|
|
71
73
|
--stn-tooltip-border-neutral: var(--stn-gray-600);
|
|
@@ -94,6 +96,8 @@
|
|
|
94
96
|
--stn-login-field-fg: var(--stn-gray-50);
|
|
95
97
|
--stn-login-field-placeholder: var(--stn-gray-500);
|
|
96
98
|
--stn-checkbox-bg: var(--stn-gray-900);
|
|
99
|
+
--stn-checkbox-bg-translucent: var(--stn-opacity-black-60);
|
|
100
|
+
--stn-checkbox-border-translucent: var(--stn-border-subtle);
|
|
97
101
|
--stn-checkbox-border: var(--stn-gray-650);
|
|
98
102
|
--stn-checkbox-check: var(--stn-blue-350);
|
|
99
103
|
--stn-checkbox-check-disabled: var(--stn-gray-500);
|
|
@@ -121,6 +125,8 @@
|
|
|
121
125
|
--stn-tree-server-icon: var(--stn-gray-400);
|
|
122
126
|
--stn-scroll-thumb: var(--stn-gray-650);
|
|
123
127
|
--stn-section-side-bg: var(--stn-gray-900);
|
|
128
|
+
--stn-section-side-bg-translucent: var(--stn-opacity-black-50);
|
|
129
|
+
--stn-section-side-border-translucent: var(--stn-border-subtle);
|
|
124
130
|
--stn-section-side-border: var(--stn-gray-800);
|
|
125
131
|
--stn-section-side-radius: 10px;
|
|
126
132
|
--stn-section-side-shadow: none;
|
|
@@ -325,7 +331,7 @@
|
|
|
325
331
|
--stn-progress-circle-accent-end: var(--stn-blue-300);
|
|
326
332
|
--stn-progress-circle-teal-start: var(--stn-teal-400);
|
|
327
333
|
--stn-progress-circle-teal-end: var(--stn-blue-400);
|
|
328
|
-
--stn-header-subtitle: var(--stn-gray-
|
|
334
|
+
--stn-header-subtitle: var(--stn-gray-300);
|
|
329
335
|
--stn-system-chip-dot: var(--stn-blue-400);
|
|
330
336
|
--stn-system-chip-dot-critical: var(--stn-red-400);
|
|
331
337
|
--stn-system-chip-dot-major: var(--stn-orange-400);
|
|
@@ -663,6 +669,8 @@
|
|
|
663
669
|
--stn-input-placeholder: var(--stn-gray-400);
|
|
664
670
|
--stn-dropdown-bg-translucent: var(--stn-opacity-white-50);
|
|
665
671
|
--stn-label-prefix-label-bg: var(--stn-gray-50);
|
|
672
|
+
--stn-label-prefix-bg-translucent: var(--stn-opacity-white-50);
|
|
673
|
+
--stn-label-prefix-border-translucent: var(--stn-border-subtle);
|
|
666
674
|
--stn-label-prefix-divider: var(--stn-gray-200);
|
|
667
675
|
--stn-label-prefix-label-color: var(--stn-gray-500);
|
|
668
676
|
--stn-tooltip-bg-neutral: var(--stn-gray-600);
|
|
@@ -691,6 +699,8 @@
|
|
|
691
699
|
--stn-login-field-fg: var(--stn-gray-900);
|
|
692
700
|
--stn-login-field-placeholder: var(--stn-gray-400);
|
|
693
701
|
--stn-checkbox-bg: var(--stn-static-white);
|
|
702
|
+
--stn-checkbox-bg-translucent: var(--stn-opacity-white-50);
|
|
703
|
+
--stn-checkbox-border-translucent: var(--stn-border-subtle);
|
|
694
704
|
--stn-checkbox-border: var(--stn-gray-200);
|
|
695
705
|
--stn-checkbox-check: var(--stn-blue-350);
|
|
696
706
|
--stn-checkbox-check-disabled: var(--stn-gray-400);
|
|
@@ -718,6 +728,8 @@
|
|
|
718
728
|
--stn-tree-server-icon: var(--stn-gray-400);
|
|
719
729
|
--stn-scroll-thumb: var(--stn-gray-200);
|
|
720
730
|
--stn-section-side-bg: var(--stn-static-white);
|
|
731
|
+
--stn-section-side-bg-translucent: var(--stn-opacity-white-50);
|
|
732
|
+
--stn-section-side-border-translucent: var(--stn-border-subtle);
|
|
721
733
|
--stn-section-side-border: var(--stn-gray-25);
|
|
722
734
|
--stn-section-side-radius: 8px;
|
|
723
735
|
--stn-section-side-shadow: 0 3px 10px var(--stn-gray-75);
|
|
@@ -91,15 +91,15 @@
|
|
|
91
91
|
--stn-blue-250: #5bc7fa;
|
|
92
92
|
--stn-blue-300: #46bdf7;
|
|
93
93
|
--stn-blue-350: #28b2f2;
|
|
94
|
-
--stn-blue-400: #
|
|
95
|
-
--stn-blue-450: #
|
|
96
|
-
--stn-blue-500: #
|
|
97
|
-
--stn-blue-550: #
|
|
98
|
-
--stn-blue-600: #
|
|
99
|
-
--stn-blue-650: #
|
|
100
|
-
--stn-blue-700: #
|
|
101
|
-
--stn-blue-750: #
|
|
102
|
-
--stn-blue-800: #
|
|
94
|
+
--stn-blue-400: #0091ef;
|
|
95
|
+
--stn-blue-450: #008edb;
|
|
96
|
+
--stn-blue-500: #007fc5;
|
|
97
|
+
--stn-blue-550: #006fac;
|
|
98
|
+
--stn-blue-600: #005e92;
|
|
99
|
+
--stn-blue-650: #004c77;
|
|
100
|
+
--stn-blue-700: #00385d;
|
|
101
|
+
--stn-blue-750: #001f46;
|
|
102
|
+
--stn-blue-800: #00182f;
|
|
103
103
|
--stn-cobalt-25: #f2f6ff;
|
|
104
104
|
--stn-cobalt-50: #e6eeff;
|
|
105
105
|
--stn-cobalt-75: #d9e5ff;
|
|
@@ -222,6 +222,9 @@
|
|
|
222
222
|
--stn-header-breadcrumb-mobile-max-width: var(--stn-size-140);
|
|
223
223
|
--stn-widget-translucent-blur: var(--stn-size-8);
|
|
224
224
|
--stn-dropdown-translucent-blur: var(--stn-size-8);
|
|
225
|
+
--stn-section-side-translucent-blur: var(--stn-size-8);
|
|
226
|
+
--stn-label-prefix-translucent-blur: var(--stn-size-8);
|
|
227
|
+
--stn-checkbox-translucent-blur: var(--stn-size-4);
|
|
225
228
|
--stn-widget-overlay-blur: var(--stn-size-4);
|
|
226
229
|
--stn-widget-severity-blur: var(--stn-size-6);
|
|
227
230
|
--stn-widget-dot-size: var(--stn-size-8);
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/data/stnSectionSide.ts"],"sourcesContent":["/**\n * Infomap section-side panel\n * Dark 40000040:102539 · Light 40000042:187762\n * @see StnSectionSide · stn-section-side.css\n */\n\nexport const STN_SECTION_SIDE_FIGMA = {\n dark: '40000040:102539',\n light: '40000042:187762',\n} as const\n\nexport const STN_SECTION_SIDE_INTRO =\n '맵·대시보드 **사이드 패널** 패턴. Light: white · gray-25 border · radius 8 · shadow. Dark: gray-900 · gray-800 border · radius 10. 본문 `StnScroll` + `StnTree`.'\n\nexport const STN_SECTION_SIDE_SPEC = [\n { property: 'Width', value: '264px', note: 'Figma frame' },\n { property: 'Padding', value: '8px', note: '' },\n {\n property: 'Radius',\n value: '`--stn-section-side-radius`',\n note: 'light 8 · dark 10',\n },\n {\n property: 'Background',\n value: '`--stn-section-side-bg`',\n note: 'light white · dark gray-900',\n },\n {\n property: 'Border',\n value: '`--stn-section-side-border`',\n note: 'light gray-25 · dark gray-800',\n },\n {\n property: 'Shadow',\n value: '`--stn-section-side-shadow`',\n note: 'light 0 3px 10px gray-75 · dark none',\n },\n { property: 'Body', value: 'StnScroll vertical', note: 'overflow tree' },\n {\n property: 'fill',\n value: '`fill` prop → `.stn-section-side--fill`',\n note: 'list view — search+table 열 높이 · 하단 inset은 .stn-container padding-bottom',\n },\n] as const\n\nexport 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>`\n"],"mappings":";AAMO,IAAM,yBAAyB;AAAA,EACpC,MAAM;AAAA,EACN,OAAO;AACT;AAEO,IAAM,yBACX;AAEK,IAAM,wBAAwB;AAAA,EACnC,EAAE,UAAU,SAAS,OAAO,SAAS,MAAM,cAAc;AAAA,EACzD,EAAE,UAAU,WAAW,OAAO,OAAO,MAAM,GAAG;AAAA,EAC9C;AAAA,IACE,UAAU;AAAA,IACV,OAAO;AAAA,IACP,MAAM;AAAA,EACR;AAAA,EACA;AAAA,IACE,UAAU;AAAA,IACV,OAAO;AAAA,IACP,MAAM;AAAA,EACR;AAAA,EACA;AAAA,IACE,UAAU;AAAA,IACV,OAAO;AAAA,IACP,MAAM;AAAA,EACR;AAAA,EACA;AAAA,IACE,UAAU;AAAA,IACV,OAAO;AAAA,IACP,MAAM;AAAA,EACR;AAAA,EACA,EAAE,UAAU,QAAQ,OAAO,sBAAsB,MAAM,gBAAgB;AAAA,EACvE;AAAA,IACE,UAAU;AAAA,IACV,OAAO;AAAA,IACP,MAAM;AAAA,EACR;AACF;AAEO,IAAM,yBAAyB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;","names":[]}
|
package/dist/chunk-QQYDH4WU.js
DELETED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/data/stnPackageVersion.ts"],"sourcesContent":["/** Package version constants */\nexport const STN_UI_VERSION = '0.1.68'\nexport const STN_UI_VERSION_LABEL = 'v0.1.68'\n"],"mappings":";AACO,IAAM,iBAAiB;AACvB,IAAM,uBAAuB;","names":[]}
|