@seed-design/rootage-artifacts 1.1.5-alpha-20251124091756 → 1.1.6

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.
Files changed (12) hide show
  1. package/components/action-button.yaml +2 -2
  2. package/components/callout.yaml +4 -2
  3. package/components/contextual-floating-button.yaml +1 -8
  4. package/components/floating-action-button.yaml +1 -8
  5. package/components/menu-sheet-item.yaml +21 -0
  6. package/components/page-banner.yaml +19 -0
  7. package/components/radiomark.yaml +20 -9
  8. package/components/segmented-control.yaml +0 -10
  9. package/components/skeleton.yaml +3 -3
  10. package/components/toggle-button.yaml +2 -2
  11. package/package.json +1 -1
  12. package/shadow.yaml +63 -0
package/components/action-button.yaml CHANGED
@@ -326,8 +326,8 @@ data:
326
326
  suffixIcon:
327
327
  size: $dimension.x3_5
328
328
  label:
329
- fontSize: $font-size.t4
330
- lineHeight: $line-height.t4
329
+ fontSize: $font-size.t3
330
+ lineHeight: $line-height.t3
331
331
  size=xsmall, layout=iconOnly:
332
332
  enabled:
333
333
  root:
package/components/callout.yaml CHANGED
@@ -20,6 +20,8 @@ data:
20
20
  type: dimension
21
21
  color:
22
22
  type: color
23
+ gradient:
24
+ type: gradient
23
25
  prefixIcon:
24
26
  properties:
25
27
  size:
@@ -178,7 +180,7 @@ data:
178
180
  tone=magic:
179
181
  enabled:
180
182
  root:
181
- color: $gradient.glow-magic
183
+ gradient: $gradient.glow-magic
182
184
  prefixIcon:
183
185
  color: $color.fg.neutral
184
186
  title:
@@ -191,4 +193,4 @@ data:
191
193
  color: $color.fg.neutral
192
194
  pressed:
193
195
  root:
194
- color: $gradient.glow-magic-pressed
196
+ gradient: $gradient.glow-magic-pressed
package/components/contextual-floating-button.yaml CHANGED
@@ -65,14 +65,7 @@ data:
65
65
  enabled:
66
66
  root:
67
67
  cornerRadius: $radius.full
68
- shadow:
69
- type: shadow
70
- value:
71
- - offsetX: 0px
72
- offsetY: 2px
73
- blur: 6px
74
- spread: 0px
75
- color: "#00000026"
68
+ shadow: $shadow.s3
76
69
  colorDuration: $duration.color-transition
77
70
  colorTimingFunction: $timing-function.easing
78
71
  progressCircle:
package/components/floating-action-button.yaml CHANGED
@@ -58,14 +58,7 @@ data:
58
58
  root:
59
59
  color: $color.bg.brand-solid
60
60
  cornerRadius: $radius.full
61
- shadow:
62
- type: shadow
63
- value:
64
- - offsetX: 0px
65
- offsetY: 2px
66
- blur: 6px
67
- spread: 0px
68
- color: "#00000026"
61
+ shadow: $shadow.s3
69
62
  colorDuration: $duration.color-transition
70
63
  colorTimingFunction: $timing-function.easing
71
64
  layoutDuration: $duration.d4
package/components/menu-sheet-item.yaml CHANGED
@@ -24,6 +24,10 @@ data:
24
24
  type: dimension
25
25
  color:
26
26
  type: color
27
+ content:
28
+ properties:
29
+ gap:
30
+ type: dimension
27
31
  label:
28
32
  properties:
29
33
  color:
@@ -34,6 +38,16 @@ data:
34
38
  type: dimension
35
39
  fontWeight:
36
40
  type: number
41
+ description:
42
+ properties:
43
+ color:
44
+ type: color
45
+ fontSize:
46
+ type: dimension
47
+ lineHeight:
48
+ type: dimension
49
+ fontWeight:
50
+ type: number
37
51
  definitions:
38
52
  base:
39
53
  enabled:
@@ -45,10 +59,17 @@ data:
45
59
  gap: $dimension.x3_5
46
60
  prefixIcon:
47
61
  size: 22px
62
+ content:
63
+ gap: $dimension.x0_5
48
64
  label:
49
65
  fontSize: $font-size.t5
50
66
  lineHeight: $line-height.t5
51
67
  fontWeight: $font-weight.regular
68
+ description:
69
+ fontSize: $font-size.t3
70
+ lineHeight: $line-height.t3
71
+ fontWeight: $font-weight.medium
72
+ color: $color.fg.neutral-subtle
52
73
  pressed:
53
74
  root:
54
75
  color: $color.bg.neutral-weak-pressed
package/components/page-banner.yaml CHANGED
@@ -16,6 +16,8 @@ data:
16
16
  type: dimension
17
17
  color:
18
18
  type: color
19
+ gradient:
20
+ type: gradient
19
21
  prefixIcon:
20
22
  properties:
21
23
  size:
@@ -271,3 +273,20 @@ data:
271
273
  pressed:
272
274
  root:
273
275
  color: $color.bg.critical-solid-pressed
276
+ tone=magic, variant=weak:
277
+ enabled:
278
+ root:
279
+ gradient: $gradient.glow-magic
280
+ prefixIcon:
281
+ color: $color.fg.neutral
282
+ title:
283
+ color: $color.fg.neutral
284
+ description:
285
+ color: $color.fg.neutral
286
+ button:
287
+ color: $color.fg.neutral
288
+ suffixIcon:
289
+ color: $color.fg.neutral
290
+ pressed:
291
+ root:
292
+ gradient: $gradient.glow-magic-pressed
package/components/radiomark.yaml CHANGED
@@ -49,15 +49,6 @@ data:
49
49
  root:
50
50
  strokeWidth: 0px
51
51
  strokeColor: "#00000000"
52
- disabled:
53
- root:
54
- color: $color.palette.gray-300
55
- disabled,selected:
56
- root:
57
- color: $color.bg.transparent
58
- strokeColor: $color.palette.gray-300
59
- icon:
60
- color: $color.palette.gray-300
61
52
 
62
53
  tone=brand:
63
54
  enabled,selected:
@@ -68,6 +59,16 @@ data:
68
59
  enabled,selected,pressed:
69
60
  root:
70
61
  color: $color.bg.brand-solid-pressed
62
+ disabled:
63
+ root:
64
+ color: $color.palette.gray-300
65
+ disabled,selected:
66
+ root:
67
+ color: $color.bg.transparent
68
+ strokeWidth: 1px
69
+ strokeColor: $color.palette.gray-300
70
+ icon:
71
+ color: $color.palette.gray-300
71
72
  tone=neutral:
72
73
  enabled,selected:
73
74
  root:
@@ -77,6 +78,16 @@ data:
77
78
  enabled,selected,pressed:
78
79
  root:
79
80
  color: $color.bg.neutral-inverted-pressed
81
+ disabled:
82
+ root:
83
+ color: $color.palette.gray-300
84
+ disabled,selected:
85
+ root:
86
+ color: $color.bg.transparent
87
+ strokeWidth: 1px
88
+ strokeColor: $color.palette.gray-300
89
+ icon:
90
+ color: $color.palette.gray-300
80
91
 
81
92
  size=medium:
82
93
  enabled:
package/components/segmented-control.yaml CHANGED
@@ -25,8 +25,6 @@ data:
25
25
  type: dimension
26
26
  strokeColor:
27
27
  type: color
28
- shadow:
29
- type: shadow
30
28
  transformDuration:
31
29
  type: duration
32
30
  transformTimingFunction:
@@ -43,13 +41,5 @@ data:
43
41
  cornerRadius: $radius.full
44
42
  strokeWidth: 1px
45
43
  strokeColor: $color.stroke.neutral-muted
46
- shadow:
47
- type: shadow
48
- value:
49
- - offsetX: 0px
50
- offsetY: 1px
51
- blur: 6px
52
- spread: 0px
53
- color: "#0000000d"
54
44
  transformDuration: $duration.d4
55
45
  transformTimingFunction: $timing-function.easing
package/components/skeleton.yaml CHANGED
@@ -18,7 +18,7 @@ data:
18
18
  type: duration
19
19
  timingFunction:
20
20
  type: cubicBezier
21
- color:
21
+ gradient:
22
22
  type: gradient
23
23
  definitions:
24
24
  base:
@@ -47,10 +47,10 @@ data:
47
47
  root:
48
48
  color: $color.palette.gray-200
49
49
  shimmer:
50
- color: $gradient.shimmer-neutral
50
+ gradient: $gradient.shimmer-neutral
51
51
  tone=magic:
52
52
  enabled:
53
53
  root:
54
54
  color: $color.bg.magic-weak
55
55
  shimmer:
56
- color: $gradient.shimmer-magic
56
+ gradient: $gradient.shimmer-magic
package/components/toggle-button.yaml CHANGED
@@ -171,8 +171,8 @@ data:
171
171
  suffixIcon:
172
172
  size: $dimension.x3_5
173
173
  label:
174
- fontSize: $font-size.t4
175
- lineHeight: $line-height.t4
174
+ fontSize: $font-size.t3
175
+ lineHeight: $line-height.t3
176
176
  progressCircle:
177
177
  size: 14px
178
178
  thickness: 2px
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@seed-design/rootage-artifacts",
3
- "version": "1.1.5-alpha-20251124091756",
3
+ "version": "1.1.6",
4
4
  "repository": {
5
5
  "type": "git",
6
6
  "url": "git+https://github.com/daangn/seed-design.git",
package/shadow.yaml ADDED
@@ -0,0 +1,63 @@
1
+ kind: Tokens
2
+ metadata:
3
+ id: shadow
4
+ name: Shadow
5
+ lastUpdated: 25-12-08
6
+ data:
7
+ collection: color
8
+ tokens:
9
+ $shadow.s1:
10
+ values:
11
+ theme-light:
12
+ type: shadow
13
+ value:
14
+ - offsetX: 0px
15
+ offsetY: 1px
16
+ blur: 4px
17
+ spread: 0px
18
+ color: "#00000014"
19
+ theme-dark:
20
+ type: shadow
21
+ value:
22
+ - offsetX: 0px
23
+ offsetY: 1px
24
+ blur: 4px
25
+ spread: 0px
26
+ color: "#00000080"
27
+ $shadow.s2:
28
+ values:
29
+ theme-light:
30
+ type: shadow
31
+ value:
32
+ - offsetX: 0px
33
+ offsetY: 2px
34
+ blur: 10px
35
+ spread: 0px
36
+ color: "#0000001a"
37
+ theme-dark:
38
+ type: shadow
39
+ value:
40
+ - offsetX: 0px
41
+ offsetY: 2px
42
+ blur: 10px
43
+ spread: 0px
44
+ color: "#000000ad"
45
+ $shadow.s3:
46
+ description: 화면의 다른 요소들보다 가장 높은 계층에 위치할 때 사용됩니다.
47
+ values:
48
+ theme-light:
49
+ type: shadow
50
+ value:
51
+ - offsetX: 0px
52
+ offsetY: 4px
53
+ blur: 16px
54
+ spread: 0px
55
+ color: "#0000001f"
56
+ theme-dark:
57
+ type: shadow
58
+ value:
59
+ - offsetX: 0px
60
+ offsetY: 4px
61
+ blur: 16px
62
+ spread: 0px
63
+ color: "#000000cc"