@seed-design/rootage-artifacts 2.1.1 → 2.2.0

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.
@@ -24,6 +24,17 @@
24
24
  }
25
25
  ]
26
26
  },
27
+ {
28
+ "name": "motion",
29
+ "modes": [
30
+ {
31
+ "id": "preferred"
32
+ },
33
+ {
34
+ "id": "reduced"
35
+ }
36
+ ]
37
+ },
27
38
  {
28
39
  "name": "viewport-width",
29
40
  "modes": [
@@ -17,6 +17,15 @@
17
17
  "colorTimingFunction": {
18
18
  "type": "cubicBezier"
19
19
  },
20
+ "scale": {
21
+ "type": "number"
22
+ },
23
+ "scaleDuration": {
24
+ "type": "duration"
25
+ },
26
+ "scaleTimingFunction": {
27
+ "type": "cubicBezier"
28
+ },
20
29
  "color": {
21
30
  "type": "color"
22
31
  },
@@ -186,6 +195,14 @@
186
195
  "colorTimingFunction": {
187
196
  "type": "cubicBezier",
188
197
  "value": "$timing-function.easing"
198
+ },
199
+ "scaleDuration": {
200
+ "type": "duration",
201
+ "value": "$duration.pressed-scale"
202
+ },
203
+ "scaleTimingFunction": {
204
+ "type": "cubicBezier",
205
+ "value": "$timing-function.pressed-scale"
189
206
  }
190
207
  },
191
208
  "label": {
@@ -1084,6 +1101,19 @@
1084
1101
  }
1085
1102
  }
1086
1103
  }
1104
+ },
1105
+ {
1106
+ "states": [
1107
+ "pressed"
1108
+ ],
1109
+ "slots": {
1110
+ "root": {
1111
+ "scale": {
1112
+ "type": "number",
1113
+ "value": "$scale.s95"
1114
+ }
1115
+ }
1116
+ }
1087
1117
  }
1088
1118
  ]
1089
1119
  },
@@ -1210,6 +1240,19 @@
1210
1240
  }
1211
1241
  }
1212
1242
  }
1243
+ },
1244
+ {
1245
+ "states": [
1246
+ "pressed"
1247
+ ],
1248
+ "slots": {
1249
+ "root": {
1250
+ "scale": {
1251
+ "type": "number",
1252
+ "value": "$scale.s97"
1253
+ }
1254
+ }
1255
+ }
1213
1256
  }
1214
1257
  ]
1215
1258
  },
@@ -1336,6 +1379,19 @@
1336
1379
  }
1337
1380
  }
1338
1381
  }
1382
+ },
1383
+ {
1384
+ "states": [
1385
+ "pressed"
1386
+ ],
1387
+ "slots": {
1388
+ "root": {
1389
+ "scale": {
1390
+ "type": "number",
1391
+ "value": "$scale.s97"
1392
+ }
1393
+ }
1394
+ }
1339
1395
  }
1340
1396
  ]
1341
1397
  },
@@ -1465,6 +1521,19 @@
1465
1521
  }
1466
1522
  }
1467
1523
  }
1524
+ },
1525
+ {
1526
+ "states": [
1527
+ "pressed"
1528
+ ],
1529
+ "slots": {
1530
+ "root": {
1531
+ "scale": {
1532
+ "type": "number",
1533
+ "value": "$scale.s98"
1534
+ }
1535
+ }
1536
+ }
1468
1537
  }
1469
1538
  ]
1470
1539
  },
@@ -47,7 +47,7 @@
47
47
  },
48
48
  "contentScale": {
49
49
  "type": "number",
50
- "description": "pressed 시 배경 레이어는 좌우 폭이 marginX만큼 줄어들고, 배경 레이어 위 요소들이 위치하는 레이아웃 레이어는 scale로 인해 전체적으로 줄어드는 형태로 두 레이어가 별개로 작동합니다. OS 동작 줄이기 등의 설정이 켜진 경우 이 값을 1로 변경하여 사용합니다."
50
+ "description": "pressed 시 배경 레이어는 좌우 폭이 marginX만큼 줄어들고, 배경 레이어 위 요소들이 위치하는 레이아웃 레이어는 scale로 인해 전체적으로 줄어드는 형태로 두 레이어가 별개로 작동합니다."
51
51
  },
52
52
  "contentScaleDuration": {
53
53
  "type": "duration"
@@ -331,7 +331,7 @@
331
331
  },
332
332
  "contentScale": {
333
333
  "type": "number",
334
- "value": 0.97
334
+ "value": "$scale.s97"
335
335
  }
336
336
  }
337
337
  }
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "Rootage",
3
- "version": "2.1.1",
3
+ "version": "2.2.0",
4
4
  "resources": [
5
5
  {
6
6
  "path": "/collections.json"
@@ -299,6 +299,9 @@
299
299
  {
300
300
  "path": "/radius.json"
301
301
  },
302
+ {
303
+ "path": "/scale.json"
304
+ },
302
305
  {
303
306
  "path": "/shadow.json"
304
307
  },
@@ -0,0 +1,48 @@
1
+ {
2
+ "kind": "Tokens",
3
+ "metadata": {
4
+ "id": "scale",
5
+ "name": "Scale"
6
+ },
7
+ "data": {
8
+ "collection": "motion",
9
+ "tokens": {
10
+ "$scale.s95": {
11
+ "values": {
12
+ "preferred": {
13
+ "type": "number",
14
+ "value": 0.95
15
+ },
16
+ "reduced": {
17
+ "type": "number",
18
+ "value": 1
19
+ }
20
+ }
21
+ },
22
+ "$scale.s97": {
23
+ "values": {
24
+ "preferred": {
25
+ "type": "number",
26
+ "value": 0.97
27
+ },
28
+ "reduced": {
29
+ "type": "number",
30
+ "value": 1
31
+ }
32
+ }
33
+ },
34
+ "$scale.s98": {
35
+ "values": {
36
+ "preferred": {
37
+ "type": "number",
38
+ "value": 0.98
39
+ },
40
+ "reduced": {
41
+ "type": "number",
42
+ "value": 1
43
+ }
44
+ }
45
+ }
46
+ }
47
+ }
48
+ }
package/collections.yaml CHANGED
@@ -10,6 +10,10 @@ data:
10
10
  modes:
11
11
  - id: theme-light
12
12
  - id: theme-dark
13
+ - name: motion
14
+ modes:
15
+ - id: preferred
16
+ - id: reduced
13
17
  - name: viewport-width
14
18
  modes:
15
19
  - id: base
@@ -12,6 +12,12 @@ data:
12
12
  type: duration
13
13
  colorTimingFunction:
14
14
  type: cubicBezier
15
+ scale:
16
+ type: number
17
+ scaleDuration:
18
+ type: duration
19
+ scaleTimingFunction:
20
+ type: cubicBezier
15
21
  color:
16
22
  type: color
17
23
  strokeColor:
@@ -110,6 +116,8 @@ data:
110
116
  root:
111
117
  colorDuration: $duration.color-transition
112
118
  colorTimingFunction: $timing-function.easing
119
+ scaleDuration: $duration.pressed-scale
120
+ scaleTimingFunction: $timing-function.pressed-scale
113
121
  label:
114
122
  fontWeight: $font-weight.bold
115
123
  variant=brandSolid:
@@ -350,6 +358,9 @@ data:
350
358
  progressCircle:
351
359
  size: 14px
352
360
  thickness: 2px
361
+ pressed:
362
+ root:
363
+ scale: $scale.s95
353
364
  size=xsmall, layout=withText:
354
365
  enabled:
355
366
  root:
@@ -379,6 +390,9 @@ data:
379
390
  progressCircle:
380
391
  size: 14px
381
392
  thickness: 2px
393
+ pressed:
394
+ root:
395
+ scale: $scale.s97
382
396
  size=small, layout=withText:
383
397
  enabled:
384
398
  root:
@@ -408,6 +422,9 @@ data:
408
422
  progressCircle:
409
423
  size: 16px
410
424
  thickness: 2px
425
+ pressed:
426
+ root:
427
+ scale: $scale.s97
411
428
  size=medium, layout=withText:
412
429
  enabled:
413
430
  root:
@@ -437,6 +454,9 @@ data:
437
454
  progressCircle:
438
455
  size: 18px
439
456
  thickness: 2px
457
+ pressed:
458
+ root:
459
+ scale: $scale.s98
440
460
  size=large, layout=withText:
441
461
  enabled:
442
462
  root:
@@ -33,7 +33,7 @@ data:
33
33
  type: cubicBezier
34
34
  contentScale:
35
35
  type: number
36
- description: pressed 시 배경 레이어는 좌우 폭이 marginX만큼 줄어들고, 배경 레이어 위 요소들이 위치하는 레이아웃 레이어는 scale로 인해 전체적으로 줄어드는 형태로 두 레이어가 별개로 작동합니다. OS 동작 줄이기 등의 설정이 켜진 경우 이 값을 1로 변경하여 사용합니다.
36
+ description: pressed 시 배경 레이어는 좌우 폭이 marginX만큼 줄어들고, 배경 레이어 위 요소들이 위치하는 레이아웃 레이어는 scale로 인해 전체적으로 줄어드는 형태로 두 레이어가 별개로 작동합니다.
37
37
  contentScaleDuration:
38
38
  type: duration
39
39
  contentScaleTimingFunction:
@@ -142,7 +142,7 @@ data:
142
142
  color: $color.bg.transparent-pressed
143
143
  marginX: $dimension.x1_5
144
144
  cornerRadius: $dimension.x2_5
145
- contentScale: 0.97
145
+ contentScale: $scale.s97
146
146
  highlighted:
147
147
  root:
148
148
  color: $color.bg.brand-weak
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@seed-design/rootage-artifacts",
3
- "version": "2.1.1",
3
+ "version": "2.2.0",
4
4
  "repository": {
5
5
  "type": "git",
6
6
  "url": "git+https://github.com/daangn/seed-design.git",
package/scale.yaml ADDED
@@ -0,0 +1,19 @@
1
+ kind: Tokens
2
+ metadata:
3
+ id: scale
4
+ name: Scale
5
+ data:
6
+ collection: motion
7
+ tokens:
8
+ $scale.s95:
9
+ values:
10
+ preferred: 0.95
11
+ reduced: 1
12
+ $scale.s97:
13
+ values:
14
+ preferred: 0.97
15
+ reduced: 1
16
+ $scale.s98:
17
+ values:
18
+ preferred: 0.98
19
+ reduced: 1