@stn-uiux/pub-ui 0.1.82 → 0.1.85
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-6FEWLKVE.js → chunk-2TRZNWCA.js} +32 -2
- package/dist/chunk-2TRZNWCA.js.map +1 -0
- package/dist/{chunk-AJLP3Y53.js → chunk-2VSSPMZ3.js} +2 -2
- package/dist/{chunk-AJLP3Y53.js.map → chunk-2VSSPMZ3.js.map} +1 -1
- package/dist/chunk-5QPBSOJ6.js +9 -0
- package/dist/chunk-5QPBSOJ6.js.map +1 -0
- package/dist/{chunk-AOS3IX4T.js → chunk-65B7YUTE.js} +2 -1
- package/dist/{chunk-AOS3IX4T.js.map → chunk-65B7YUTE.js.map} +1 -1
- package/dist/chunk-APXT43OG.js +232 -0
- package/dist/chunk-APXT43OG.js.map +1 -0
- package/dist/chunk-ERZPIKPF.js +1 -0
- package/dist/chunk-FLKGJJD5.js +45 -0
- package/dist/chunk-FLKGJJD5.js.map +1 -0
- package/dist/{chunk-N46UQH6L.js → chunk-K6TWXWIO.js} +11 -2
- package/dist/chunk-K6TWXWIO.js.map +1 -0
- package/dist/chunk-N4PVFFKV.js +38 -0
- package/dist/chunk-N4PVFFKV.js.map +1 -0
- package/dist/chunk-NYZMUDVK.js +12 -0
- package/dist/chunk-NYZMUDVK.js.map +1 -0
- package/dist/chunk-QJN2Z6RG.js +160 -0
- package/dist/chunk-QJN2Z6RG.js.map +1 -0
- package/dist/chunk-W7K3FSAX.js +24 -0
- package/dist/chunk-W7K3FSAX.js.map +1 -0
- package/dist/cli.js +17 -17
- package/dist/components.d.ts +1 -1
- package/dist/components.js +1 -1
- package/dist/data/index.d.ts +7 -2
- package/dist/data/index.js +142 -92
- package/dist/data/stnCard.d.ts +1 -1
- package/dist/data/stnCard.js +1 -1
- package/dist/data/stnDatePicker.d.ts +41 -10
- package/dist/data/stnDatePicker.js +9 -3
- package/dist/data/stnEmptyState.d.ts +35 -0
- package/dist/data/stnEmptyState.js +19 -0
- package/dist/data/stnEmptyState.js.map +1 -0
- package/dist/data/stnPackageVersion.d.ts +2 -2
- package/dist/data/stnPackageVersion.js +1 -1
- package/dist/data/stnPopover.d.ts +18 -0
- package/dist/data/stnPopover.js +9 -0
- package/dist/data/stnPopover.js.map +1 -0
- package/dist/data/stnSplitView.d.ts +16 -0
- package/dist/data/stnSplitView.js +11 -0
- package/dist/data/stnSplitView.js.map +1 -0
- package/dist/data/stnStepCards.d.ts +32 -0
- package/dist/data/stnStepCards.js +7 -0
- package/dist/data/stnStepCards.js.map +1 -0
- package/dist/data/stnStepper.d.ts +78 -0
- package/dist/data/stnStepper.js +7 -0
- package/dist/data/stnStepper.js.map +1 -0
- package/dist/data/stnTree.d.ts +3 -0
- package/dist/data/stnTree.js +1 -1
- package/dist/data/stnTypography.d.ts +17 -1
- package/dist/data/stnTypography.js +7 -1
- package/dist/index.d.ts +7 -2
- package/dist/index.js +143 -93
- package/package.json +1 -1
- package/styles/@assets/images/empty-state/forbidden.png +0 -0
- package/styles/@assets/images/empty-state/load-failed.png +0 -0
- package/styles/@assets/images/empty-state/maintenance.png +0 -0
- package/styles/@assets/images/empty-state/network.png +0 -0
- package/styles/@assets/images/empty-state/no-data.png +0 -0
- package/styles/@assets/images/empty-state/not-found.png +0 -0
- package/styles/@assets/images/empty-state/search-empty.png +0 -0
- package/styles/@assets/images/empty-state/server-error.png +0 -0
- package/styles/@assets/images/empty-state/timeout.png +0 -0
- package/styles/@assets/images/empty-state/unauthorized.png +0 -0
- package/styles/components/stn-card.css +49 -13
- package/styles/components/stn-checkbox.css +1 -1
- package/styles/components/stn-date-picker.css +252 -45
- package/styles/components/stn-date-range-field.css +2 -2
- package/styles/components/stn-drawer.css +2 -2
- package/styles/components/stn-dropdown.css +2 -2
- package/styles/components/stn-empty-state.css +238 -0
- package/styles/components/stn-popover.css +52 -0
- package/styles/components/stn-radio.css +1 -1
- package/styles/components/stn-slider.css +1 -1
- package/styles/components/stn-stepper.css +570 -0
- package/styles/components/stn-switch.css +1 -1
- package/styles/components/stn-table.css +39 -1
- package/styles/components/stn-text-field.css +5 -1
- package/styles/components/stn-tooltip.css +1 -1
- package/styles/layouts/stn-container.css +8 -0
- package/styles/layouts/stn-layer0-bg.css +18 -17
- package/styles/patterns/stn-login-card.css +6 -0
- package/styles/patterns/stn-split-view.css +130 -0
- package/styles/patterns/stn-step-cards.css +60 -0
- package/styles/patterns/stn-tree.css +9 -0
- package/styles/style-pub.css +5 -0
- package/styles/tokens/stn-colors-semantic.css +54 -0
- package/styles/tokens/stn-elevation.css +1 -0
- package/styles/tokens/stn-size-semantic.css +37 -0
- package/styles/tokens/stn-size.css +1 -0
- package/styles/tokens/stn-spacing-semantic.css +11 -0
- package/styles/tokens/stn-typography-semantic.css +7 -1
- package/styles/tokens/stn-typography.css +16 -0
- package/dist/chunk-6FEWLKVE.js.map +0 -1
- package/dist/chunk-N46UQH6L.js.map +0 -1
- package/dist/chunk-THTVXGTK.js +0 -9
- package/dist/chunk-THTVXGTK.js.map +0 -1
- package/dist/chunk-WKQLAHIG.js +0 -1
- package/dist/chunk-YBNEQ5LB.js +0 -75
- package/dist/chunk-YBNEQ5LB.js.map +0 -1
- /package/dist/{chunk-WKQLAHIG.js.map → chunk-ERZPIKPF.js.map} +0 -0
|
@@ -11,18 +11,7 @@
|
|
|
11
11
|
1. L0 Background Image Tokens (CDN)
|
|
12
12
|
========================================================================== */
|
|
13
13
|
|
|
14
|
-
/* 1-1. Default Theme —
|
|
15
|
-
[data-mode='light'],
|
|
16
|
-
[data-theme='default'][data-mode='light'] {
|
|
17
|
-
--stn-l0-dashboard-bg: url('https://stn-design.vercel.app/images/layer0/dashboard-light.png');
|
|
18
|
-
--stn-l0-list-bg: var(--stn-gradient-l0-background);
|
|
19
|
-
--stn-l0-showroom-a-bg: url('https://stn-design.vercel.app/images/layer0/showroom-a-light.png');
|
|
20
|
-
--stn-l0-showroom-b-bg: url('https://stn-design.vercel.app/images/layer0/showroom-b-light.png');
|
|
21
|
-
--stn-l0-map-light-bg: url('https://stn-design.vercel.app/images/layer0/map-light.png');
|
|
22
|
-
--stn-l0-login-bg: url('https://stn-design.vercel.app/images/layer0/login-light.png');
|
|
23
|
-
}
|
|
24
|
-
|
|
25
|
-
/* 1-2. Default Theme — Dark Mode */
|
|
14
|
+
/* 1-1. Default Theme — Dark Mode (Base / Default) */
|
|
26
15
|
:root,
|
|
27
16
|
[data-mode='dark'],
|
|
28
17
|
[data-theme='default'][data-mode='dark'] {
|
|
@@ -34,18 +23,30 @@
|
|
|
34
23
|
--stn-l0-login-bg: url('https://stn-design.vercel.app/images/layer0/login-dark.png');
|
|
35
24
|
}
|
|
36
25
|
|
|
37
|
-
/* 1-
|
|
38
|
-
[data-
|
|
39
|
-
|
|
40
|
-
--stn-l0-
|
|
26
|
+
/* 1-2. Default Theme — Light Mode */
|
|
27
|
+
[data-mode='light'],
|
|
28
|
+
[data-theme='default'][data-mode='light'] {
|
|
29
|
+
--stn-l0-dashboard-bg: url('https://stn-design.vercel.app/images/layer0/dashboard-light.png');
|
|
30
|
+
--stn-l0-list-bg: var(--stn-gradient-l0-background);
|
|
31
|
+
--stn-l0-showroom-a-bg: url('https://stn-design.vercel.app/images/layer0/showroom-a-light.png');
|
|
32
|
+
--stn-l0-showroom-b-bg: url('https://stn-design.vercel.app/images/layer0/showroom-b-light.png');
|
|
33
|
+
--stn-l0-map-light-bg: url('https://stn-design.vercel.app/images/layer0/map-light.png');
|
|
34
|
+
--stn-l0-login-bg: url('https://stn-design.vercel.app/images/layer0/login-light.png');
|
|
41
35
|
}
|
|
42
36
|
|
|
43
|
-
/* 1-
|
|
37
|
+
/* 1-3. Blue Theme — Dark Mode (Base) */
|
|
38
|
+
[data-theme='blue'],
|
|
44
39
|
[data-theme='blue'][data-mode='dark'] {
|
|
45
40
|
--stn-l0-dashboard-bg: url('https://stn-design.vercel.app/images/layer0/infomap-dark.png');
|
|
46
41
|
--stn-l0-list-bg: url('https://stn-design.vercel.app/images/layer0/infomap-dark-none.png');
|
|
47
42
|
}
|
|
48
43
|
|
|
44
|
+
/* 1-4. Blue Theme — Light Mode */
|
|
45
|
+
[data-theme='blue'][data-mode='light'] {
|
|
46
|
+
--stn-l0-dashboard-bg: url('https://stn-design.vercel.app/images/layer0/infomap-light.png');
|
|
47
|
+
--stn-l0-list-bg: url('https://stn-design.vercel.app/images/layer0/infomap-light-none.png');
|
|
48
|
+
}
|
|
49
|
+
|
|
49
50
|
|
|
50
51
|
/* ==========================================================================
|
|
51
52
|
2. Base Layer 0 Shell
|
|
@@ -65,6 +65,12 @@
|
|
|
65
65
|
z-index: 0;
|
|
66
66
|
}
|
|
67
67
|
|
|
68
|
+
@media (prefers-reduced-motion: reduce) {
|
|
69
|
+
.stn-login-card-glow-wrapper::before {
|
|
70
|
+
animation: none;
|
|
71
|
+
}
|
|
72
|
+
}
|
|
73
|
+
|
|
68
74
|
@keyframes stnLoginCardBorderRotate {
|
|
69
75
|
0% { transform: rotate(0deg); }
|
|
70
76
|
100% { transform: rotate(360deg); }
|
|
@@ -0,0 +1,130 @@
|
|
|
1
|
+
@charset "utf-8";
|
|
2
|
+
/**
|
|
3
|
+
* StnSplitView — Side + Stage layout shell (SSOT)
|
|
4
|
+
* Recipe: Card(padding=none) + Body flush + SplitView + FloatingToolbar on Stage
|
|
5
|
+
*/
|
|
6
|
+
|
|
7
|
+
.stn-split-view {
|
|
8
|
+
box-sizing: border-box;
|
|
9
|
+
display: flex;
|
|
10
|
+
flex-direction: row;
|
|
11
|
+
align-items: stretch;
|
|
12
|
+
width: 100%;
|
|
13
|
+
min-width: 0;
|
|
14
|
+
min-height: 0;
|
|
15
|
+
}
|
|
16
|
+
|
|
17
|
+
.stn-split-view--fill {
|
|
18
|
+
flex: 1 1 0%;
|
|
19
|
+
height: 100%;
|
|
20
|
+
align-self: stretch;
|
|
21
|
+
}
|
|
22
|
+
|
|
23
|
+
/* ── Side ─────────────────────────────────────────── */
|
|
24
|
+
.stn-split-view__side {
|
|
25
|
+
box-sizing: border-box;
|
|
26
|
+
display: flex;
|
|
27
|
+
flex-direction: column;
|
|
28
|
+
flex: 0 0 auto;
|
|
29
|
+
width: var(--stn-split-view-side-width, var(--stn-split-view-side-width-md));
|
|
30
|
+
min-width: 0;
|
|
31
|
+
min-height: 0;
|
|
32
|
+
border-right: var(--stn-size-1, 1px) solid var(--stn-card-border-color, var(--stn-border-subtle));
|
|
33
|
+
background: transparent;
|
|
34
|
+
}
|
|
35
|
+
|
|
36
|
+
.stn-split-view__side--sm {
|
|
37
|
+
--stn-split-view-side-width: var(--stn-split-view-side-width-sm);
|
|
38
|
+
}
|
|
39
|
+
|
|
40
|
+
.stn-split-view__side--md {
|
|
41
|
+
--stn-split-view-side-width: var(--stn-split-view-side-width-md);
|
|
42
|
+
}
|
|
43
|
+
|
|
44
|
+
.stn-split-view__side--lg {
|
|
45
|
+
--stn-split-view-side-width: var(--stn-split-view-side-width-lg);
|
|
46
|
+
}
|
|
47
|
+
|
|
48
|
+
.stn-split-view__side--end {
|
|
49
|
+
border-right: none;
|
|
50
|
+
border-left: var(--stn-size-1, 1px) solid var(--stn-card-border-color, var(--stn-border-subtle));
|
|
51
|
+
order: 1;
|
|
52
|
+
}
|
|
53
|
+
|
|
54
|
+
.stn-split-view__side-header {
|
|
55
|
+
flex-shrink: 0;
|
|
56
|
+
display: flex;
|
|
57
|
+
flex-direction: column;
|
|
58
|
+
gap: var(--stn-space-8, 8px);
|
|
59
|
+
padding: var(--stn-space-12, 12px) var(--stn-space-16, 16px);
|
|
60
|
+
border-bottom: var(--stn-size-1, 1px) solid var(--stn-card-border-color, var(--stn-border-subtle));
|
|
61
|
+
}
|
|
62
|
+
|
|
63
|
+
.stn-split-view__side-body {
|
|
64
|
+
flex: 1 1 0%;
|
|
65
|
+
min-height: 0;
|
|
66
|
+
width: 100%;
|
|
67
|
+
}
|
|
68
|
+
|
|
69
|
+
.stn-split-view__side-body.stn-scroll {
|
|
70
|
+
padding: var(--stn-space-8, 8px) var(--stn-space-12, 12px);
|
|
71
|
+
}
|
|
72
|
+
|
|
73
|
+
/* ── Stage (floating toolbar / overlay positioning context) ── */
|
|
74
|
+
.stn-split-view__stage {
|
|
75
|
+
box-sizing: border-box;
|
|
76
|
+
position: relative;
|
|
77
|
+
display: flex;
|
|
78
|
+
flex-direction: column;
|
|
79
|
+
flex: 1 1 0%;
|
|
80
|
+
min-width: 0;
|
|
81
|
+
min-height: 0;
|
|
82
|
+
overflow: hidden;
|
|
83
|
+
}
|
|
84
|
+
|
|
85
|
+
/* Non-toolbar floating slots (legend, filters, callouts) */
|
|
86
|
+
.stn-split-view__overlay {
|
|
87
|
+
box-sizing: border-box;
|
|
88
|
+
position: absolute;
|
|
89
|
+
z-index: 10;
|
|
90
|
+
max-width: min(100%, var(--stn-split-view-overlay-max-width, var(--stn-size-320, 320px)));
|
|
91
|
+
pointer-events: auto;
|
|
92
|
+
}
|
|
93
|
+
|
|
94
|
+
.stn-split-view__overlay--top-left {
|
|
95
|
+
top: var(--stn-space-16, 16px);
|
|
96
|
+
left: var(--stn-space-16, 16px);
|
|
97
|
+
}
|
|
98
|
+
|
|
99
|
+
.stn-split-view__overlay--top-right {
|
|
100
|
+
top: var(--stn-space-16, 16px);
|
|
101
|
+
right: var(--stn-space-16, 16px);
|
|
102
|
+
}
|
|
103
|
+
|
|
104
|
+
.stn-split-view__overlay--bottom-left {
|
|
105
|
+
bottom: var(--stn-space-16, 16px);
|
|
106
|
+
left: var(--stn-space-16, 16px);
|
|
107
|
+
}
|
|
108
|
+
|
|
109
|
+
.stn-split-view__overlay--bottom-center {
|
|
110
|
+
bottom: var(--stn-space-16, 16px);
|
|
111
|
+
left: 50%;
|
|
112
|
+
transform: translateX(-50%);
|
|
113
|
+
}
|
|
114
|
+
|
|
115
|
+
.stn-split-view__overlay--bottom-right {
|
|
116
|
+
bottom: var(--stn-space-16, 16px);
|
|
117
|
+
right: var(--stn-space-16, 16px);
|
|
118
|
+
}
|
|
119
|
+
|
|
120
|
+
.stn-split-view__overlay--center-left {
|
|
121
|
+
top: 50%;
|
|
122
|
+
left: var(--stn-space-16, 16px);
|
|
123
|
+
transform: translateY(-50%);
|
|
124
|
+
}
|
|
125
|
+
|
|
126
|
+
.stn-split-view__overlay--center-right {
|
|
127
|
+
top: 50%;
|
|
128
|
+
right: var(--stn-space-16, 16px);
|
|
129
|
+
transform: translateY(-50%);
|
|
130
|
+
}
|
|
@@ -0,0 +1,60 @@
|
|
|
1
|
+
@charset "utf-8";
|
|
2
|
+
/**
|
|
3
|
+
* STN Pattern — Step cards (.stn-step-cards)
|
|
4
|
+
* 노드만 있는 가로 스텝퍼 아래, 단계마다 결과 카드를 같은 칸에 맞춘다.
|
|
5
|
+
*/
|
|
6
|
+
|
|
7
|
+
.stn-step-cards {
|
|
8
|
+
--stn-step-cards-count: 1;
|
|
9
|
+
|
|
10
|
+
display: flex;
|
|
11
|
+
flex-direction: column;
|
|
12
|
+
gap: var(--stn-space-16);
|
|
13
|
+
width: 100%;
|
|
14
|
+
box-sizing: border-box;
|
|
15
|
+
}
|
|
16
|
+
|
|
17
|
+
.stn-step-cards__grid {
|
|
18
|
+
display: grid;
|
|
19
|
+
grid-template-columns: repeat(var(--stn-step-cards-count), minmax(0, 1fr));
|
|
20
|
+
align-items: stretch;
|
|
21
|
+
}
|
|
22
|
+
|
|
23
|
+
.stn-step-cards__cell {
|
|
24
|
+
min-width: 0;
|
|
25
|
+
display: flex;
|
|
26
|
+
padding-inline: var(--stn-space-8);
|
|
27
|
+
}
|
|
28
|
+
|
|
29
|
+
.stn-step-cards .stn-card.stn-step-cards__card {
|
|
30
|
+
gap: var(--stn-space-12);
|
|
31
|
+
}
|
|
32
|
+
|
|
33
|
+
.stn-step-cards .stn-card.stn-step-cards__card.is-current {
|
|
34
|
+
border-color: var(--stn-primary);
|
|
35
|
+
}
|
|
36
|
+
|
|
37
|
+
.stn-step-cards__heading {
|
|
38
|
+
display: flex;
|
|
39
|
+
flex-direction: column;
|
|
40
|
+
gap: var(--stn-space-4);
|
|
41
|
+
min-width: 0;
|
|
42
|
+
}
|
|
43
|
+
|
|
44
|
+
.stn-step-cards__result {
|
|
45
|
+
display: flex;
|
|
46
|
+
align-items: baseline;
|
|
47
|
+
gap: var(--stn-space-6);
|
|
48
|
+
}
|
|
49
|
+
|
|
50
|
+
.stn-step-cards__action {
|
|
51
|
+
margin-top: auto;
|
|
52
|
+
}
|
|
53
|
+
|
|
54
|
+
.stn-step-cards .stn-step-cards__result-value.is-running {
|
|
55
|
+
color: var(--stn-primary);
|
|
56
|
+
}
|
|
57
|
+
|
|
58
|
+
.stn-step-cards .stn-step-cards__result-value.is-warning {
|
|
59
|
+
color: var(--stn-feedback-warning);
|
|
60
|
+
}
|
|
@@ -88,6 +88,15 @@
|
|
|
88
88
|
flex-basis: var(--stn-tree-cell-size);
|
|
89
89
|
}
|
|
90
90
|
|
|
91
|
+
.stn-tree__cell--checkbox {
|
|
92
|
+
flex-basis: var(--stn-tree-cell-size);
|
|
93
|
+
cursor: default;
|
|
94
|
+
}
|
|
95
|
+
|
|
96
|
+
.stn-tree__cell--checkbox .stn-checkbox {
|
|
97
|
+
margin: 0;
|
|
98
|
+
}
|
|
99
|
+
|
|
91
100
|
.stn-tree__guide {
|
|
92
101
|
display: block;
|
|
93
102
|
width: var(--stn-tree-guide-size);
|
package/styles/style-pub.css
CHANGED
|
@@ -65,6 +65,7 @@
|
|
|
65
65
|
@import './components/stn-scroll.css';
|
|
66
66
|
@import './components/stn-widget.css';
|
|
67
67
|
@import './components/stn-event-banner.css';
|
|
68
|
+
@import './components/stn-empty-state.css';
|
|
68
69
|
@import './components/stn-logo.css';
|
|
69
70
|
@import './components/stn-tooltip.css';
|
|
70
71
|
@import './components/stn-icon-box.css';
|
|
@@ -75,6 +76,8 @@
|
|
|
75
76
|
@import './components/stn-status.css';
|
|
76
77
|
@import './components/stn-tabs.css';
|
|
77
78
|
@import './components/stn-divider.css';
|
|
79
|
+
@import './components/stn-stepper.css';
|
|
80
|
+
@import './components/stn-popover.css';
|
|
78
81
|
|
|
79
82
|
/* --- 5. Patterns (Composite UI Recipes) --- */
|
|
80
83
|
@import './patterns/stn-section-side.css';
|
|
@@ -82,6 +85,8 @@
|
|
|
82
85
|
@import './patterns/stn-alert-center.css';
|
|
83
86
|
@import './patterns/stn-tree.css';
|
|
84
87
|
@import './patterns/stn-login-card.css';
|
|
88
|
+
@import './patterns/stn-step-cards.css';
|
|
85
89
|
@import './patterns/stn-login-text-field.css';
|
|
86
90
|
@import './patterns/stn-floating-toolbar.css';
|
|
91
|
+
@import './patterns/stn-split-view.css';
|
|
87
92
|
@import './patterns/stn-widget-patterns.css';
|
|
@@ -158,6 +158,10 @@
|
|
|
158
158
|
--stn-card-bg-flat: var(--stn-gray-850);
|
|
159
159
|
--stn-card-bg-elevated: var(--stn-gray-800);
|
|
160
160
|
--stn-card-border-color: var(--stn-gray-700);
|
|
161
|
+
--stn-card-severity-critical-bg: color-mix(in srgb, var(--stn-red-400) 5%, transparent);
|
|
162
|
+
--stn-card-severity-major-bg: color-mix(in srgb, var(--stn-orange-400) 5%, transparent);
|
|
163
|
+
--stn-card-severity-minor-bg: color-mix(in srgb, var(--stn-yellow-350) 5%, transparent);
|
|
164
|
+
--stn-card-severity-warning-bg: color-mix(in srgb, var(--stn-teal-400) 5%, transparent);
|
|
161
165
|
--stn-card-shadow: none;
|
|
162
166
|
--stn-search-requirement-bg: transparent;
|
|
163
167
|
--stn-search-requirement-border: var(--stn-gray-750);
|
|
@@ -694,6 +698,29 @@
|
|
|
694
698
|
--stn-chart-gauge-seg-9: var(--stn-chart-color-9);
|
|
695
699
|
--stn-chart-gauge-seg-10: var(--stn-chart-color-10);
|
|
696
700
|
--stn-widget-grade-row-track-bg: var(--stn-gray-750);
|
|
701
|
+
--stn-stepper-line-color: var(--stn-border-strong);
|
|
702
|
+
--stn-stepper-line-active-color: var(--stn-primary);
|
|
703
|
+
--stn-stepper-line-success-color: var(--stn-feedback-success);
|
|
704
|
+
--stn-stepper-line-error-color: var(--stn-feedback-error);
|
|
705
|
+
--stn-stepper-line-warning-color: var(--stn-feedback-warning);
|
|
706
|
+
--stn-stepper-node-wait-bg: var(--stn-elevation-surface-0);
|
|
707
|
+
--stn-stepper-node-wait-border: var(--stn-border-strong);
|
|
708
|
+
--stn-stepper-node-wait-fg: var(--stn-text-tertiary);
|
|
709
|
+
--stn-stepper-node-running-bg: var(--stn-primary);
|
|
710
|
+
--stn-stepper-node-running-border: var(--stn-primary);
|
|
711
|
+
--stn-stepper-node-running-fg: var(--stn-static-white);
|
|
712
|
+
--stn-stepper-node-running-ring: color-mix(in srgb, var(--stn-primary) 25%, transparent);
|
|
713
|
+
--stn-stepper-node-success-bg: var(--stn-opacity-white-10);
|
|
714
|
+
--stn-stepper-node-success-border: var(--stn-feedback-success);
|
|
715
|
+
--stn-stepper-node-success-fg: var(--stn-feedback-success);
|
|
716
|
+
--stn-stepper-node-error-bg: var(--stn-feedback-error);
|
|
717
|
+
--stn-stepper-node-error-border: var(--stn-feedback-error);
|
|
718
|
+
--stn-stepper-node-error-fg: var(--stn-static-white);
|
|
719
|
+
--stn-stepper-node-error-ring: color-mix(in srgb, var(--stn-feedback-error) 25%, transparent);
|
|
720
|
+
--stn-stepper-node-warning-bg: var(--stn-feedback-warning);
|
|
721
|
+
--stn-stepper-node-warning-border: var(--stn-feedback-warning);
|
|
722
|
+
--stn-stepper-node-warning-fg: var(--stn-static-white);
|
|
723
|
+
--stn-stepper-node-warning-ring: color-mix(in srgb, var(--stn-feedback-warning) 25%, transparent);
|
|
697
724
|
}
|
|
698
725
|
|
|
699
726
|
[data-mode='light'] {
|
|
@@ -847,6 +874,10 @@
|
|
|
847
874
|
--stn-card-bg-flat: var(--stn-gray-50);
|
|
848
875
|
--stn-card-bg-elevated: var(--stn-static-white);
|
|
849
876
|
--stn-card-border-color: var(--stn-border-subtle);
|
|
877
|
+
--stn-card-severity-critical-bg: var(--stn-red-50);
|
|
878
|
+
--stn-card-severity-major-bg: var(--stn-orange-50);
|
|
879
|
+
--stn-card-severity-minor-bg: var(--stn-yellow-50);
|
|
880
|
+
--stn-card-severity-warning-bg: var(--stn-teal-50);
|
|
850
881
|
--stn-card-shadow: var(--stn-shadow-2, 0 4px 14px rgba(0, 0, 0, 0.07));
|
|
851
882
|
--stn-search-requirement-bg: transparent;
|
|
852
883
|
--stn-search-requirement-border: var(--stn-gray-75);
|
|
@@ -1385,6 +1416,29 @@
|
|
|
1385
1416
|
--stn-chart-gauge-seg-9: var(--stn-chart-color-9);
|
|
1386
1417
|
--stn-chart-gauge-seg-10: var(--stn-chart-color-10);
|
|
1387
1418
|
--stn-widget-grade-row-track-bg: var(--stn-gray-200);
|
|
1419
|
+
--stn-stepper-line-color: var(--stn-border-strong);
|
|
1420
|
+
--stn-stepper-line-active-color: var(--stn-primary);
|
|
1421
|
+
--stn-stepper-line-success-color: var(--stn-feedback-success);
|
|
1422
|
+
--stn-stepper-line-error-color: var(--stn-feedback-error);
|
|
1423
|
+
--stn-stepper-line-warning-color: var(--stn-feedback-warning);
|
|
1424
|
+
--stn-stepper-node-wait-bg: var(--stn-elevation-surface-0);
|
|
1425
|
+
--stn-stepper-node-wait-border: var(--stn-border-strong);
|
|
1426
|
+
--stn-stepper-node-wait-fg: var(--stn-text-tertiary);
|
|
1427
|
+
--stn-stepper-node-running-bg: var(--stn-primary);
|
|
1428
|
+
--stn-stepper-node-running-border: var(--stn-primary);
|
|
1429
|
+
--stn-stepper-node-running-fg: var(--stn-static-white);
|
|
1430
|
+
--stn-stepper-node-running-ring: color-mix(in srgb, var(--stn-primary) 20%, transparent);
|
|
1431
|
+
--stn-stepper-node-success-bg: var(--stn-opacity-white-20);
|
|
1432
|
+
--stn-stepper-node-success-border: var(--stn-feedback-success);
|
|
1433
|
+
--stn-stepper-node-success-fg: var(--stn-feedback-success);
|
|
1434
|
+
--stn-stepper-node-error-bg: var(--stn-feedback-error);
|
|
1435
|
+
--stn-stepper-node-error-border: var(--stn-feedback-error);
|
|
1436
|
+
--stn-stepper-node-error-fg: var(--stn-static-white);
|
|
1437
|
+
--stn-stepper-node-error-ring: color-mix(in srgb, var(--stn-feedback-error) 20%, transparent);
|
|
1438
|
+
--stn-stepper-node-warning-bg: var(--stn-feedback-warning);
|
|
1439
|
+
--stn-stepper-node-warning-border: var(--stn-feedback-warning);
|
|
1440
|
+
--stn-stepper-node-warning-fg: var(--stn-static-white);
|
|
1441
|
+
--stn-stepper-node-warning-ring: color-mix(in srgb, var(--stn-feedback-warning) 20%, transparent);
|
|
1388
1442
|
}
|
|
1389
1443
|
|
|
1390
1444
|
[data-theme='blue'][data-mode='dark'] {
|
|
@@ -34,6 +34,11 @@
|
|
|
34
34
|
--stn-text-field-height-lg: var(--stn-size-40);
|
|
35
35
|
--stn-text-field-height-md: var(--stn-size-32);
|
|
36
36
|
--stn-text-field-height-sm: var(--stn-size-24);
|
|
37
|
+
--stn-card-header-min-height: var(--stn-size-40);
|
|
38
|
+
--stn-split-view-side-width-sm: var(--stn-size-220);
|
|
39
|
+
--stn-split-view-side-width-md: var(--stn-size-280);
|
|
40
|
+
--stn-split-view-side-width-lg: var(--stn-size-320);
|
|
41
|
+
--stn-split-view-overlay-max-width: var(--stn-size-320);
|
|
37
42
|
--stn-dropdown-height-sm: var(--stn-size-24);
|
|
38
43
|
--stn-dropdown-height-md: var(--stn-size-32);
|
|
39
44
|
--stn-dropdown-height-lg: var(--stn-size-40);
|
|
@@ -326,4 +331,36 @@
|
|
|
326
331
|
--stn-widget-grade-row-val-min-width: var(--stn-size-28);
|
|
327
332
|
--stn-widget-grade-row-pct-min-width: var(--stn-size-42);
|
|
328
333
|
--stn-widget-grade-row-grid-item-min-width: var(--stn-size-200);
|
|
334
|
+
--stn-empty-state-max-width: var(--stn-size-360);
|
|
335
|
+
--stn-empty-state-max-width-sm: var(--stn-size-280);
|
|
336
|
+
--stn-empty-state-max-width-md: var(--stn-size-360);
|
|
337
|
+
--stn-empty-state-max-width-lg: var(--stn-size-400);
|
|
338
|
+
--stn-empty-state-icon-size-sm: var(--stn-size-40);
|
|
339
|
+
--stn-empty-state-icon-size-md: var(--stn-size-56);
|
|
340
|
+
--stn-empty-state-icon-size-lg: var(--stn-size-72);
|
|
341
|
+
--stn-empty-state-graphic-width-sm: var(--stn-size-80);
|
|
342
|
+
--stn-empty-state-graphic-height-sm: var(--stn-size-60);
|
|
343
|
+
--stn-empty-state-graphic-width-md: var(--stn-size-140);
|
|
344
|
+
--stn-empty-state-graphic-height-md: var(--stn-size-90);
|
|
345
|
+
--stn-empty-state-graphic-width-lg: var(--stn-size-200);
|
|
346
|
+
--stn-empty-state-graphic-height-lg: var(--stn-size-140);
|
|
347
|
+
--stn-table-empty-min-height: var(--stn-size-220);
|
|
348
|
+
--stn-stepper-node-size-xs: var(--stn-size-24);
|
|
349
|
+
--stn-stepper-node-size-sm: var(--stn-size-28);
|
|
350
|
+
--stn-stepper-node-size-md: var(--stn-size-32);
|
|
351
|
+
--stn-stepper-node-size-lg: var(--stn-size-40);
|
|
352
|
+
--stn-stepper-node-size-xl: var(--stn-size-48);
|
|
353
|
+
--stn-stepper-icon-size-xs: var(--stn-size-12);
|
|
354
|
+
--stn-stepper-icon-size-sm: var(--stn-size-14);
|
|
355
|
+
--stn-stepper-icon-size-md: var(--stn-size-16);
|
|
356
|
+
--stn-stepper-icon-size-lg: var(--stn-size-20);
|
|
357
|
+
--stn-stepper-icon-size-xl: var(--stn-size-24);
|
|
358
|
+
--stn-stepper-line-thickness-xs: var(--stn-size-1);
|
|
359
|
+
--stn-stepper-line-thickness-sm: var(--stn-size-2);
|
|
360
|
+
--stn-stepper-line-thickness-md: var(--stn-size-2);
|
|
361
|
+
--stn-stepper-line-thickness-lg: var(--stn-size-2);
|
|
362
|
+
--stn-stepper-line-thickness-xl: var(--stn-size-3);
|
|
363
|
+
--stn-stepper-node-border-width: var(--stn-size-1);
|
|
364
|
+
--stn-stepper-node-border-width-active: var(--stn-size-2);
|
|
365
|
+
--stn-stepper-node-ring-width: var(--stn-size-3);
|
|
329
366
|
}
|
|
@@ -341,4 +341,15 @@
|
|
|
341
341
|
--stn-widget-grade-row-padding-y: var(--stn-space-4);
|
|
342
342
|
--stn-widget-grade-row-label-gap: var(--stn-space-6);
|
|
343
343
|
--stn-widget-grade-row-right-gap: var(--stn-space-8);
|
|
344
|
+
--stn-empty-state-gap-sm: var(--stn-space-12);
|
|
345
|
+
--stn-empty-state-gap-md: var(--stn-space-16);
|
|
346
|
+
--stn-empty-state-gap-lg: var(--stn-space-24);
|
|
347
|
+
--stn-empty-state-body-gap: var(--stn-space-8);
|
|
348
|
+
--stn-empty-state-actions-gap: var(--stn-space-8);
|
|
349
|
+
--stn-empty-state-padding-sm: var(--stn-space-16);
|
|
350
|
+
--stn-empty-state-padding-md: var(--stn-space-24);
|
|
351
|
+
--stn-empty-state-padding-lg: var(--stn-space-32);
|
|
352
|
+
--stn-empty-state-page-padding-y: var(--stn-space-48);
|
|
353
|
+
--stn-table-empty-cell-padding-y: var(--stn-space-32);
|
|
354
|
+
--stn-table-empty-cell-padding-x: var(--stn-space-16);
|
|
344
355
|
}
|
|
@@ -67,10 +67,16 @@
|
|
|
67
67
|
--stn-text-caption-medium-size: var(--stn-font-size-12);
|
|
68
68
|
--stn-text-caption-medium-weight: var(--stn-font-weight-regular);
|
|
69
69
|
--stn-text-caption-medium-line-height: var(--stn-line-height-reading-3);
|
|
70
|
+
--stn-text-caption-small-size: var(--stn-font-size-11);
|
|
71
|
+
--stn-text-caption-small-weight: var(--stn-font-weight-regular);
|
|
72
|
+
--stn-text-caption-small-line-height: var(--stn-line-height-reading-3);
|
|
70
73
|
--stn-text-caption-size: var(--stn-text-caption-medium-size);
|
|
74
|
+
--stn-input-label-line-height: var(--stn-line-height-default);
|
|
71
75
|
--stn-text-field-label-size: var(--stn-text-body-small-size);
|
|
72
76
|
--stn-text-field-label-weight: var(--stn-font-weight-medium);
|
|
73
|
-
--stn-text-field-label-line-height: var(--stn-line-height
|
|
77
|
+
--stn-text-field-label-line-height: var(--stn-input-label-line-height);
|
|
78
|
+
--stn-dropdown-label-line-height: var(--stn-input-label-line-height);
|
|
79
|
+
--stn-date-range-field-label-line-height: var(--stn-input-label-line-height);
|
|
74
80
|
--stn-text-field-helper-size: var(--stn-text-caption-medium-size);
|
|
75
81
|
--stn-text-field-helper-weight: var(--stn-font-weight-regular);
|
|
76
82
|
--stn-text-field-helper-line-height: var(--stn-text-caption-medium-line-height);
|
|
@@ -9,6 +9,8 @@
|
|
|
9
9
|
:root {
|
|
10
10
|
--stn-font-family-pretendard: Pretendard, -apple-system, BlinkMacSystemFont, system-ui, 'Apple SD Gothic Neo', 'Noto Sans KR', 'Malgun Gothic', sans-serif;
|
|
11
11
|
--stn-font-size-base: 16px;
|
|
12
|
+
--stn-font-size-base-lg: 15px;
|
|
13
|
+
--stn-font-size-base-md: 14px;
|
|
12
14
|
--stn-font-size-52: calc(var(--stn-font-size-base) * 52 / 16);
|
|
13
15
|
--stn-font-size-48: calc(var(--stn-font-size-base) * 48 / 16);
|
|
14
16
|
--stn-font-size-44: calc(var(--stn-font-size-base) * 44 / 16);
|
|
@@ -82,3 +84,17 @@
|
|
|
82
84
|
--stn-line-height-px-188: 188px;
|
|
83
85
|
--stn-line-height-px-300: 300px;
|
|
84
86
|
}
|
|
87
|
+
|
|
88
|
+
/* Responsive font scale · < xl(1440) → base-lg */
|
|
89
|
+
@media (max-width: 1439px) {
|
|
90
|
+
:root {
|
|
91
|
+
--stn-font-size-base: var(--stn-font-size-base-lg);
|
|
92
|
+
}
|
|
93
|
+
}
|
|
94
|
+
|
|
95
|
+
/* Responsive font scale · < lg(1280) → base-md (floor: no further shrink below md) */
|
|
96
|
+
@media (max-width: 1279px) {
|
|
97
|
+
:root {
|
|
98
|
+
--stn-font-size-base: var(--stn-font-size-base-md);
|
|
99
|
+
}
|
|
100
|
+
}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/data/stnTypography.ts"],"sourcesContent":["/**\n * Foundations Typography — primitives + semantic (KT-style roles, Pub px)\n * Pub 런타임: font-family.pretendard = font.css Pretendard (CDN)\n */\n\nexport type StnTypographyPrimitiveRow = {\n token: string\n cssVar: `--${string}`\n value: string\n note?: string\n}\n\nexport type StnTypographySemanticRow = {\n token: string\n cssVar: `--${string}`\n resolvesTo: string\n sampleClass?: string\n usage: string\n}\n\nfunction row(\n group: string,\n name: string,\n value: string,\n note?: string,\n): StnTypographyPrimitiveRow {\n const slug = name.replace(/\\./g, '-')\n return {\n token: `pub.${group}.${name}`,\n cssVar: `--stn-${group}-${slug}` as `--${string}`,\n value,\n note,\n }\n}\n\n/** Figma primitive — font-size (values scale from --stn-font-size-base) */\nexport const STN_FONT_SIZE_ROWS: StnTypographyPrimitiveRow[] = [\n row('font-size', 'base', '16px', '스케일 루트 · 이 값만 바꾸면 전체 비율 스케일'),\n row('font-size', '60', 'calc(base × 60/16)'),\n row('font-size', '45', 'calc(base × 45/16)', 'Pub 대시보드'),\n row('font-size', '42', 'calc(base × 42/16)', 'DS 랜딩'),\n row('font-size', '40', 'calc(base × 40/16)'),\n row('font-size', '36', 'calc(base × 36/16)'),\n row('font-size', '32', 'calc(base × 32/16)'),\n row('font-size', '30', 'calc(base × 30/16)', 'Pub 대시보드'),\n row('font-size', '28', 'calc(base × 28/16)', 'Pub · DS 마케팅'),\n row('font-size', '26', 'calc(base × 26/16)', 'Pub 대시보드'),\n row('font-size', '25', 'calc(base × 25/16)', 'Pub 대시보드'),\n row('font-size', '24', 'calc(base × 24/16)'),\n row('font-size', '22', 'calc(base × 22/16)'),\n row('font-size', '21', 'calc(base × 21/16)', 'Pub 대시보드'),\n row('font-size', '20', 'calc(base × 20/16)'),\n row('font-size', '19', 'calc(base × 19/16)', 'Pub 대시보드 보조'),\n row('font-size', '18', 'calc(base × 18/16)'),\n row('font-size', '17', 'calc(base × 17/16)'),\n row('font-size', '16', 'var(--stn-font-size-base)'),\n row('font-size', '15', 'calc(base × 15/16)'),\n row('font-size', '14', 'calc(base × 14/16)'),\n row('font-size', '13', 'calc(base × 13/16)'),\n row('font-size', '12', 'calc(base × 12/16)'),\n row('font-size', '11', 'calc(base × 11/16)', 'GNB 알림센터 등급 태그'),\n row('font-size', '10', 'calc(base × 10/16)'),\n row('font-size', '9', 'calc(base × 9/16)', '문서 미니 라벨'),\n row('font-size', '8', 'calc(base × 8/16)', '문서 미니 라벨'),\n]\n\nexport const STN_FONT_WEIGHT_ROWS: StnTypographyPrimitiveRow[] = [\n row('font-weight', 'bold', '700', 'Pretendard Bold'),\n row('font-weight', 'semibold', '600', 'Pretendard SemiBold'),\n row('font-weight', 'medium', '500', 'Pretendard Medium'),\n row('font-weight', 'regular', '400', 'Pretendard Regular'),\n]\n\nexport const STN_LINE_HEIGHT_ROWS: StnTypographyPrimitiveRow[] = [\n row('line-height', 'default', '148%', '→ 1.48'),\n row('line-height', 'reading-1', '170%', '→ 1.7'),\n row('line-height', 'reading-2', '158%', '→ 1.58'),\n row('line-height', 'reading-3', '130%', '→ 1.3'),\n row('line-height', 'none', '0', '아이콘·히든'),\n row('line-height', 'tight', '1', '한 줄 라벨'),\n row('line-height', 'compact', '1.12', 'Pub 버튼'),\n row('line-height', 'snug', '1.25', 'DS 문서'),\n row('line-height', 'dense', '0.9', 'Pub 태그'),\n]\n\nexport const STN_FONT_FAMILY_ROWS: StnTypographyPrimitiveRow[] = [\n {\n token: 'pub.font-family.pretendard',\n cssVar: '--stn-font-family-pretendard',\n value: 'Pretendard',\n note: 'font.css · CDN Pretendard (jsDelivr v1.3.9)',\n },\n]\n\nexport const STN_TYPOGRAPHY_PRIMITIVE_GROUPS = [\n { id: 'font-family', label: 'font-family', rows: STN_FONT_FAMILY_ROWS },\n { id: 'font-size', label: 'font-size', rows: STN_FONT_SIZE_ROWS },\n { id: 'font-weight', label: 'font-weight', rows: STN_FONT_WEIGHT_ROWS },\n { id: 'line-height', label: 'line-height', rows: STN_LINE_HEIGHT_ROWS },\n] as const\n\n/** Canonical semantic text roles (KT taxonomy · Pub px). Use CSS vars in component styles. */\nexport const STN_TYPOGRAPHY_SEMANTIC_ROWS: StnTypographySemanticRow[] = [\n {\n token: 'pub.font.display',\n cssVar: '--stn-font-display',\n resolvesTo: 'var(--stn-font-family-pretendard)',\n usage: '디스플레이 역할 패밀리',\n },\n {\n token: 'pub.font.body',\n cssVar: '--stn-font-body',\n resolvesTo: 'var(--stn-font-family-pretendard)',\n usage: '본문·UI 역할 패밀리 · body reset',\n },\n {\n token: 'pub.text.display.xlarge',\n cssVar: '--stn-text-display-xlarge-*',\n resolvesTo: '{font-size.60} / bold / 1.3',\n usage: '최상위 헤드라인 (PC)',\n },\n {\n token: 'pub.text.display.large',\n cssVar: '--stn-text-display-large-*',\n resolvesTo: '{font-size.40} / bold / 1.3',\n sampleClass: 'stn-typo-display-xl',\n usage: '메인 타이틀 · 히어로',\n },\n {\n token: 'pub.text.display.medium',\n cssVar: '--stn-text-display-medium-*',\n resolvesTo: '{font-size.36} / bold / 1.48',\n usage: '강조형 헤드라인',\n },\n {\n token: 'pub.text.heading.large',\n cssVar: '--stn-text-heading-large-*',\n resolvesTo: '{font-size.32} / bold / 1.48',\n sampleClass: 'stn-typo-display-lg',\n usage: '페이지 상위 제목',\n },\n {\n token: 'pub.text.heading.medium',\n cssVar: '--stn-text-heading-medium-*',\n resolvesTo: '{font-size.24} / bold / 1.48',\n sampleClass: 'stn-typo-display-md',\n usage: '하위 제목 · 위젯·카드 헤드라인',\n },\n {\n token: 'pub.text.heading.small',\n cssVar: '--stn-text-heading-small-*',\n resolvesTo: '{font-size.22} / bold / 1.48',\n usage: '소제목 · 그룹 제목',\n },\n {\n token: 'pub.text.title.large',\n cssVar: '--stn-text-title-large-*',\n resolvesTo: '{font-size.20} / bold / 1.48',\n usage: '콘텐츠 타이틀',\n },\n {\n token: 'pub.text.title.medium',\n cssVar: '--stn-text-title-medium-*',\n resolvesTo: '{font-size.18} / bold / 1.48',\n sampleClass: 'stn-typo-title-lg',\n usage: '모달·패널 타이틀 · 알림센터 헤더',\n },\n {\n token: 'pub.text.title.small',\n cssVar: '--stn-text-title-small-*',\n resolvesTo: '{font-size.16} / medium / 1.48',\n usage: '서브 타이틀 · 앱 헤더',\n },\n {\n token: 'pub.text.body.large',\n cssVar: '--stn-text-body-large-*',\n resolvesTo: '{font-size.16} / regular / 1.48',\n usage: '본문 (PC 권장)',\n },\n {\n token: 'pub.text.body.medium',\n cssVar: '--stn-text-body-medium-*',\n resolvesTo: '{font-size.14} / regular / 1.48',\n sampleClass: 'stn-typo-body-md',\n usage: 'Pub reset 기본 본문 · 테이블·폼',\n },\n {\n token: 'pub.text.body.small',\n cssVar: '--stn-text-body-small-*',\n resolvesTo: '{font-size.13} / regular / 1.48',\n usage: '본문 소형 · 테이블·목록 다수',\n },\n {\n token: 'pub.text.label.large',\n cssVar: '--stn-text-label-large-*',\n resolvesTo: '{font-size.17} / medium / 1.48',\n usage: '버튼 라벨 (PC)',\n },\n {\n token: 'pub.text.label.medium',\n cssVar: '--stn-text-label-medium-*',\n resolvesTo: '{font-size.15} / medium / 1.48',\n usage: '버튼 · 입력 폼 라벨',\n },\n {\n token: 'pub.text.label.small',\n cssVar: '--stn-text-label-small-*',\n resolvesTo: '{font-size.13} / medium / 1.48',\n usage: '입력 레이블 · GNB 2Depth',\n },\n {\n token: 'pub.text.label.xsmall',\n cssVar: '--stn-text-label-xsmall-*',\n resolvesTo: '{font-size.10} / medium / 1',\n usage: '바텀 아이콘 레이블',\n },\n {\n token: 'pub.text.caption.large',\n cssVar: '--stn-text-caption-large-*',\n resolvesTo: '{font-size.14} / regular / 1.3',\n usage: '캡션 대형 · 로그인 카드 서브캡션',\n },\n {\n token: 'pub.text.caption.medium',\n cssVar: '--stn-text-caption-medium-*',\n resolvesTo: '{font-size.12} / regular / 1.3',\n sampleClass: 'stn-typo-body-sm',\n usage: '캡션 · 툴팁 · 알림센터 목록',\n },\n]\n\nexport function typographyPrimitivesToJson(): Record<string, string> {\n const out: Record<string, string> = {}\n for (const g of STN_TYPOGRAPHY_PRIMITIVE_GROUPS) {\n for (const r of g.rows) {\n out[r.token] = r.value\n }\n }\n return out\n}\n\nexport function typographySemanticsToJson(): Record<\n string,\n { css: string; resolvesTo: string; usage: string }\n> {\n const out: Record<string, { css: string; resolvesTo: string; usage: string }> = {}\n for (const r of STN_TYPOGRAPHY_SEMANTIC_ROWS) {\n out[r.token] = {\n css: r.cssVar,\n resolvesTo: r.resolvesTo,\n usage: r.usage,\n }\n }\n return out\n}\n"],"mappings":"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","names":[]}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/components.ts"],"sourcesContent":["/**\n * STN Pub UI — component catalog (class-based HTML/CSS; React wrappers TBD)\n */\nexport type StnUiComponentId =\n | 'button'\n | 'chip'\n | 'side-navigation'\n | 'popup'\n | 'pagination'\n | 'data-table'\n | 'tree'\n\nexport type StnUiFoundationId =\n | 'color'\n | 'typography'\n | 'elevation'\n | 'space'\n | 'spacing-semantic'\n | 'radius'\n | 'radius-semantic'\n | 'gradients'\n\nexport type StnUiEntry = {\n id: StnUiComponentId | StnUiFoundationId\n kind: 'component' | 'foundation'\n label: string\n /** Pub HTML class prefix or shell selector */\n pubSelector: string\n /** CSS entry paths (package exports) */\n styles: string[]\n /** Spec module under @stn-uiux/pub-ui/data */\n dataModule?: string\n status: 'implemented' | 'partial' | 'planned'\n}\n\nexport const STN_UI_COMPONENTS: StnUiEntry[] = [\n {\n id: 'button',\n kind: 'component',\n label: 'Button',\n pubSelector: '.stn-btn',\n styles: ['@stn-uiux/pub-ui/styles.css'],\n dataModule: '@stn-uiux/pub-ui/data/stnButtonStates',\n status: 'implemented',\n },\n {\n id: 'chip',\n kind: 'component',\n label: 'Chip',\n pubSelector: '.stn-badge, .tag.critic, .error_tag',\n styles: ['@stn-uiux/pub-ui/styles.css'],\n dataModule: '@stn-uiux/pub-ui/data/stnPubChip',\n status: 'implemented',\n },\n {\n id: 'side-navigation',\n kind: 'component',\n label: 'Side Navigation',\n pubSelector: '.stn-side-nav',\n styles: ['@stn-uiux/pub-ui/styles.css'],\n dataModule: '@stn-uiux/pub-ui/data/stnSideNavigation',\n status: 'implemented',\n },\n {\n id: 'popup',\n kind: 'component',\n label: 'Popup',\n pubSelector: '.stn-pop',\n styles: ['@stn-uiux/pub-ui/styles.css'],\n dataModule: '@stn-uiux/pub-ui/data/stnPubPopup',\n status: 'implemented',\n },\n {\n id: 'pagination',\n kind: 'component',\n label: 'Pagination',\n pubSelector: '.stn-pagination',\n styles: ['@stn-uiux/pub-ui/styles.css'],\n dataModule: '@stn-uiux/pub-ui/data/stnPubPagination',\n status: 'implemented',\n },\n {\n id: 'data-table',\n kind: 'component',\n label: 'Data Table',\n pubSelector: '.stn-table',\n styles: ['@stn-uiux/pub-ui/styles.css'],\n dataModule: '@stn-uiux/pub-ui/data/stnPubTable',\n status: 'implemented',\n },\n {\n id: 'tree',\n kind: 'component',\n label: 'Tree',\n pubSelector: '.stn-tree',\n styles: ['@stn-uiux/pub-ui/styles.css'],\n dataModule: '@stn-uiux/pub-ui/data/stnPubTree',\n status: 'implemented',\n },\n]\n\nexport const STN_UI_FOUNDATIONS: StnUiEntry[] = [\n {\n id: 'color',\n kind: 'foundation',\n label: 'Color',\n pubSelector: ':root',\n styles: ['@stn-uiux/pub-ui/styles.css'],\n dataModule: '@stn-uiux/pub-ui/data/stnPubColorPalette',\n status: 'implemented',\n },\n {\n id: 'typography',\n kind: 'foundation',\n label: 'Typography',\n pubSelector: ':root',\n styles: ['@stn-uiux/pub-ui/styles.css'],\n dataModule: '@stn-uiux/pub-ui/data/stnPubTypography',\n status: 'implemented',\n },\n {\n id: 'elevation',\n kind: 'foundation',\n label: 'Elevation',\n pubSelector: ':root',\n styles: ['@stn-uiux/pub-ui/styles.css'],\n dataModule: '@stn-uiux/pub-ui/data/stnPubElevation',\n status: 'implemented',\n },\n {\n id: 'space',\n kind: 'foundation',\n label: 'Space',\n pubSelector: ':root',\n styles: ['@stn-uiux/pub-ui/styles.css'],\n dataModule: '@stn-uiux/pub-ui/data/stnPubSpace',\n status: 'implemented',\n },\n {\n id: 'spacing-semantic',\n kind: 'foundation',\n label: 'Spacing (semantic)',\n pubSelector: ':root',\n styles: ['@stn-uiux/pub-ui/styles.css'],\n dataModule: '@stn-uiux/pub-ui/data/stnPubSpacingSemantic',\n status: 'implemented',\n },\n {\n id: 'radius',\n kind: 'foundation',\n label: 'Radius',\n pubSelector: ':root',\n styles: ['@stn-uiux/pub-ui/styles.css'],\n dataModule: '@stn-uiux/pub-ui/data/stnPubRadius',\n status: 'implemented',\n },\n {\n id: 'radius-semantic',\n kind: 'foundation',\n label: 'Radius (semantic)',\n pubSelector: ':root',\n styles: ['@stn-uiux/pub-ui/styles.css'],\n dataModule: '@stn-uiux/pub-ui/data/stnPubRadiusSemantic',\n status: 'implemented',\n },\n {\n id: 'gradients',\n kind: 'foundation',\n label: 'Gradients',\n pubSelector: ':root',\n styles: ['@stn-uiux/pub-ui/styles.css'],\n dataModule: '@stn-uiux/pub-ui/data/stnPubGradients',\n status: 'implemented',\n },\n]\n\nexport const STN_UI_CATALOG = [...STN_UI_FOUNDATIONS, ...STN_UI_COMPONENTS]\n"],"mappings":"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","names":[]}
|
package/dist/chunk-THTVXGTK.js
DELETED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/data/stnPackageVersion.ts"],"sourcesContent":["/** Package version constants */\nexport const STN_UI_VERSION = '0.1.82'\nexport const STN_UI_VERSION_LABEL = 'v0.1.82'\n"],"mappings":";AACO,IAAM,iBAAiB;AACvB,IAAM,uBAAuB;","names":[]}
|
package/dist/chunk-WKQLAHIG.js
DELETED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
//# sourceMappingURL=chunk-WKQLAHIG.js.map
|