@dialpad/dialtone-tokens 1.23.3 → 1.23.4

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 (14) hide show
  1. package/README.md +14 -13
  2. package/dist/android/java/tokens-dark.kt +1 -1
  3. package/dist/android/java/tokens-light.kt +1 -1
  4. package/dist/android/res/values/colors-dark.xml +1 -1
  5. package/dist/android/res/values/colors-light.xml +1 -1
  6. package/dist/android/res/values/dimens.xml +1 -1
  7. package/dist/css/variables-dark.css +7 -7
  8. package/dist/css/variables-light.css +7 -7
  9. package/dist/doc.json +120 -60
  10. package/dist/ios/tokens-dark.swift +1 -1
  11. package/dist/ios/tokens-light.swift +1 -1
  12. package/dist/less/variables-dark.less +7 -7
  13. package/dist/less/variables-light.less +7 -7
  14. package/package.json +1 -1
package/README.md CHANGED
@@ -2,7 +2,9 @@
2
2
 
3
3
  Design tokens for Dialpad's design system Dialtone and everything related to building and publishing them.
4
4
 
5
- Design tokens are all the defined values that are part of the design system, such as color, spacing, typography, and more. The goal is to store design tokens as JSON and output and publish them to many different formats (CSS, LESS, Android, iOS, etc) upon build.
5
+ Design tokens are all the defined values that are part of the design system, such as color, spacing, typography, and
6
+ more. The goal is to store design tokens as JSON and output and publish them to many different formats (CSS, LESS,
7
+ Android, iOS, etc) upon build.
6
8
 
7
9
  ## Usage
8
10
 
@@ -11,19 +13,20 @@ To use Dialtone Tokens in your project:
11
13
  ### Web (npm)
12
14
 
13
15
  #### Install Dependency
14
- ```
16
+
17
+ ```shell
15
18
  npm install @dialpad/dialtone-tokens
16
19
  ```
17
20
 
18
21
  #### Import CSS Tokens
19
22
 
20
- ```
21
- @import "node_modules/@dialpad/dialtone/css/variables.css";
23
+ ```css
24
+ @import "node_modules/@dialpad/dialtone-css/css/variables.css";
22
25
  ```
23
26
 
24
27
  #### Use CSS Token
25
28
 
26
- ```
29
+ ```css
27
30
  .my-css-class {
28
31
  color: var(--dt-color-purple-200)
29
32
  }
@@ -33,13 +36,13 @@ Or
33
36
 
34
37
  #### Import LESS Tokens
35
38
 
36
- ```
37
- @import "node_modules/@dialpad/dialtone/less/variables.less";
39
+ ```less
40
+ @import "node_modules/@dialpad/dialtone-css/less/variables.less";
38
41
  ```
39
42
 
40
43
  #### Use LESS Token
41
44
 
42
- ```
45
+ ```less
43
46
  .my-css-class {
44
47
  color: @dt-color-purple-200
45
48
  }
@@ -50,11 +53,11 @@ Or
50
53
  1. Within your XCode project `File > Swift Packages > Add Package Dependency`
51
54
  2. Enter repository url: `https://github.com/dialpad/dialtone-tokens-swift`
52
55
 
53
-
54
56
  ### Android (compose/xml)
55
57
 
56
58
  #### pom.xml
57
- ```
59
+
60
+ ```xml
58
61
  <dependency>
59
62
  <groupId>design.dialpad.tokens</groupId>
60
63
  <artifactId>dialtone-tokens</artifactId>
@@ -64,7 +67,7 @@ Or
64
67
 
65
68
  #### Install Dependency
66
69
 
67
- ```
70
+ ```shell
68
71
  mvn install
69
72
  ```
70
73
 
@@ -80,8 +83,6 @@ import design.dialpad.DialtoneTokens;
80
83
  DialtoneTokens.dtColorPurple200
81
84
  ``` -->
82
85
 
83
-
84
-
85
86
  ## Quick Start for Contributors
86
87
 
87
88
  1. clone repo
package/dist/android/java/tokens-dark.kt CHANGED
@@ -1,7 +1,7 @@
1
1
 
2
2
 
3
3
  // Do not edit directly
4
- // Generated on Wed, 13 Dec 2023 21:33:47 GMT
4
+ // Generated on Tue, 19 Dec 2023 20:54:41 GMT
5
5
 
6
6
 
7
7
 
package/dist/android/java/tokens-light.kt CHANGED
@@ -1,7 +1,7 @@
1
1
 
2
2
 
3
3
  // Do not edit directly
4
- // Generated on Wed, 13 Dec 2023 21:33:47 GMT
4
+ // Generated on Tue, 19 Dec 2023 20:54:40 GMT
5
5
 
6
6
 
7
7
 
package/dist/android/res/values/colors-dark.xml CHANGED
@@ -2,7 +2,7 @@
2
2
 
3
3
  <!--
4
4
  Do not edit directly
5
- Generated on Wed, 13 Dec 2023 21:33:47 GMT
5
+ Generated on Tue, 19 Dec 2023 20:54:40 GMT
6
6
  -->
7
7
  <resources>
8
8
  <color name="dt_dark_radio_color_border_unchecked">#ff808080</color>
package/dist/android/res/values/colors-light.xml CHANGED
@@ -2,7 +2,7 @@
2
2
 
3
3
  <!--
4
4
  Do not edit directly
5
- Generated on Wed, 13 Dec 2023 21:33:47 GMT
5
+ Generated on Tue, 19 Dec 2023 20:54:40 GMT
6
6
  -->
7
7
  <resources>
8
8
  <color name="dt_light_radio_color_border_unchecked">#ffaaaaaa</color>
package/dist/android/res/values/dimens.xml CHANGED
@@ -2,7 +2,7 @@
2
2
 
3
3
  <!--
4
4
  Do not edit directly
5
- Generated on Wed, 13 Dec 2023 21:33:47 GMT
5
+ Generated on Tue, 19 Dec 2023 20:54:40 GMT
6
6
  -->
7
7
  <resources>
8
8
  <dimen name="dt_dark_radio_size_width">16px</dimen>
package/dist/css/variables-dark.css CHANGED
@@ -1,6 +1,6 @@
1
1
  /**
2
2
  * Do not edit directly
3
- * Generated on Wed, 13 Dec 2023 21:33:46 GMT
3
+ * Generated on Tue, 19 Dec 2023 20:54:40 GMT
4
4
  */
5
5
 
6
6
  .dialtone-theme-dark {
@@ -246,9 +246,9 @@
246
246
  --dt-space-90-percent: 90%;
247
247
  --dt-space-95-percent: 95%;
248
248
  --dt-space-100-percent: 100%;
249
- --dt-color-neutral-white: #ffffff;
250
- --dt-color-neutral-black: #000000;
251
- --dt-color-neutral-transparent: transparent;
249
+ --dt-color-neutral-white: #ffffff; /* White color independent of any theme. */
250
+ --dt-color-neutral-black: #000000; /* Black color independent of any theme. */
251
+ --dt-color-neutral-transparent: transparent; /* Transparent color independent of any theme. */
252
252
  --dt-color-black-100: #000000;
253
253
  --dt-color-black-200: #262626;
254
254
  --dt-color-black-300: #3A3A3A;
@@ -294,9 +294,9 @@
294
294
  --dt-color-tan-300: #87807B;
295
295
  --dt-color-tan-400: #CEC8C4;
296
296
  --dt-color-tan-500: #F2F0EE;
297
- --dt-color-gradient-magenta-purple: linear-gradient(135deg, #F9008E 10%, #7C52FF 90%);
298
- --dt-color-brand-purple: #7C52FF;
299
- --dt-color-brand-magenta: #F9008E;
297
+ --dt-color-gradient-magenta-purple: linear-gradient(135deg, #F9008E 10%, #7C52FF 90%); /* Gradient for Ai-oriented treatments. */
298
+ --dt-color-brand-purple: #7C52FF; /* Primary brand color. */
299
+ --dt-color-brand-magenta: #F9008E; /* Secondary brand color, typically used as an accent color. */
300
300
  --dt-color-foreground-primary: #E6E6E6; /* Default text color throughout the UI. */
301
301
  --dt-color-foreground-secondary: #C2C2C2; /* Example uses include introduction paragraphs, labels, and descriptions paired with form elements. */
302
302
  --dt-color-foreground-tertiary: #AAAAAA; /* Used to imply visual hierarchy relative to primary and secondary text colors, e.g. headlines and labels. */
package/dist/css/variables-light.css CHANGED
@@ -1,6 +1,6 @@
1
1
  /**
2
2
  * Do not edit directly
3
- * Generated on Wed, 13 Dec 2023 21:33:46 GMT
3
+ * Generated on Tue, 19 Dec 2023 20:54:39 GMT
4
4
  */
5
5
 
6
6
  .dialtone-theme-light {
@@ -246,9 +246,9 @@
246
246
  --dt-space-90-percent: 90%;
247
247
  --dt-space-95-percent: 95%;
248
248
  --dt-space-100-percent: 100%;
249
- --dt-color-neutral-white: #ffffff;
250
- --dt-color-neutral-black: #000000;
251
- --dt-color-neutral-transparent: transparent;
249
+ --dt-color-neutral-white: #ffffff; /* White color independent of any theme. */
250
+ --dt-color-neutral-black: #000000; /* Black color independent of any theme. */
251
+ --dt-color-neutral-transparent: transparent; /* Transparent color independent of any theme. */
252
252
  --dt-color-black-100: #F9F9F9;
253
253
  --dt-color-black-200: #E9E9E9;
254
254
  --dt-color-black-300: #D2D2D2;
@@ -294,9 +294,9 @@
294
294
  --dt-color-tan-300: #87807B;
295
295
  --dt-color-tan-400: #3F3D3C;
296
296
  --dt-color-tan-500: #121212;
297
- --dt-color-gradient-magenta-purple: linear-gradient(135deg, #F9008E 10%, #7C52FF 90%);
298
- --dt-color-brand-purple: #7C52FF;
299
- --dt-color-brand-magenta: #F9008E;
297
+ --dt-color-gradient-magenta-purple: linear-gradient(135deg, #F9008E 10%, #7C52FF 90%); /* Gradient for Ai-oriented treatments. */
298
+ --dt-color-brand-purple: #7C52FF; /* Primary brand color. */
299
+ --dt-color-brand-magenta: #F9008E; /* Secondary brand color, typically used as an accent color. */
300
300
  --dt-color-foreground-primary: #000000; /* Default text color throughout the UI. */
301
301
  --dt-color-foreground-secondary: #3A3A3A; /* Example uses include introduction paragraphs, labels, and descriptions paired with form elements. */
302
302
  --dt-color-foreground-tertiary: #555555; /* Used to imply visual hierarchy relative to primary and secondary text colors, e.g. headlines and labels. */
package/dist/doc.json CHANGED
@@ -5316,67 +5316,82 @@
5316
5316
  "color/neutral/white": {
5317
5317
  "css/variables": {
5318
5318
  "name": "var(--dt-color-neutral-white)",
5319
- "value": "#ffffff"
5319
+ "value": "#ffffff",
5320
+ "description": "White color independent of any theme."
5320
5321
  },
5321
5322
  "less/variables": {
5322
5323
  "name": "dt-color-neutral-white",
5323
- "value": "#ffffff"
5324
+ "value": "#ffffff",
5325
+ "description": "White color independent of any theme."
5324
5326
  },
5325
5327
  "android/resources": {
5326
5328
  "name": "dt_light_color_neutral_white",
5327
- "value": "#ffffffff"
5329
+ "value": "#ffffffff",
5330
+ "description": "White color independent of any theme."
5328
5331
  },
5329
5332
  "compose/object": {
5330
5333
  "name": "dtColorNeutralWhite",
5331
- "value": "Color(0xffffffff)"
5334
+ "value": "Color(0xffffffff)",
5335
+ "description": "White color independent of any theme."
5332
5336
  },
5333
5337
  "ios-swift/enum.swift": {
5334
5338
  "name": "dtColorNeutralWhite",
5335
- "value": "UIColor(red: 1.000, green: 1.000, blue: 1.000, alpha: 1)"
5339
+ "value": "UIColor(red: 1.000, green: 1.000, blue: 1.000, alpha: 1)",
5340
+ "description": "White color independent of any theme."
5336
5341
  }
5337
5342
  },
5338
5343
  "color/neutral/black": {
5339
5344
  "css/variables": {
5340
5345
  "name": "var(--dt-color-neutral-black)",
5341
- "value": "#000000"
5346
+ "value": "#000000",
5347
+ "description": "Black color independent of any theme."
5342
5348
  },
5343
5349
  "less/variables": {
5344
5350
  "name": "dt-color-neutral-black",
5345
- "value": "#000000"
5351
+ "value": "#000000",
5352
+ "description": "Black color independent of any theme."
5346
5353
  },
5347
5354
  "android/resources": {
5348
5355
  "name": "dt_light_color_neutral_black",
5349
- "value": "#ff000000"
5356
+ "value": "#ff000000",
5357
+ "description": "Black color independent of any theme."
5350
5358
  },
5351
5359
  "compose/object": {
5352
5360
  "name": "dtColorNeutralBlack",
5353
- "value": "Color(0xff000000)"
5361
+ "value": "Color(0xff000000)",
5362
+ "description": "Black color independent of any theme."
5354
5363
  },
5355
5364
  "ios-swift/enum.swift": {
5356
5365
  "name": "dtColorNeutralBlack",
5357
- "value": "UIColor(red: 0.000, green: 0.000, blue: 0.000, alpha: 1)"
5366
+ "value": "UIColor(red: 0.000, green: 0.000, blue: 0.000, alpha: 1)",
5367
+ "description": "Black color independent of any theme."
5358
5368
  }
5359
5369
  },
5360
5370
  "color/neutral/transparent": {
5361
5371
  "css/variables": {
5362
5372
  "name": "var(--dt-color-neutral-transparent)",
5363
- "value": "transparent"
5373
+ "value": "transparent",
5374
+ "description": "Transparent color independent of any theme."
5364
5375
  },
5365
5376
  "less/variables": {
5366
5377
  "name": "dt-color-neutral-transparent",
5367
- "value": "transparent"
5378
+ "value": "transparent",
5379
+ "description": "Transparent color independent of any theme."
5368
5380
  },
5369
5381
  "android/resources": {
5370
5382
  "name": "dt_light_color_neutral_transparent",
5371
- "value": "#00ffffff"
5383
+ "value": "#00ffffff",
5384
+ "description": "Transparent color independent of any theme."
5372
5385
  },
5373
5386
  "compose/object": {
5374
5387
  "name": "dtColorNeutralTransparent",
5375
- "value": "Color(0x00000000)"
5388
+ "value": "Color(0x00000000)",
5389
+ "description": "Transparent color independent of any theme."
5376
5390
  },
5377
5391
  "ios-swift/enum.swift": {
5378
5392
  "name": "dtColorNeutralTransparent",
5379
- "value": "UIColor(red: 0.000, green: 0.000, blue: 0.000, alpha: 0)"
5393
+ "value": "UIColor(red: 0.000, green: 0.000, blue: 0.000, alpha: 0)",
5394
+ "description": "Transparent color independent of any theme."
5380
5395
  }
5381
5396
  },
5382
5397
  "color/black/100": {
@@ -6372,67 +6387,82 @@
6372
6387
  "color/gradient/magenta-purple": {
6373
6388
  "css/variables": {
6374
6389
  "name": "var(--dt-color-gradient-magenta-purple)",
6375
- "value": "linear-gradient(135deg, #F9008E 10%, #7C52FF 90%)"
6390
+ "value": "linear-gradient(135deg, #F9008E 10%, #7C52FF 90%)",
6391
+ "description": "Gradient for Ai-oriented treatments."
6376
6392
  },
6377
6393
  "less/variables": {
6378
6394
  "name": "dt-color-gradient-magenta-purple",
6379
- "value": "linear-gradient(135deg, #F9008E 10%, #7C52FF 90%)"
6395
+ "value": "linear-gradient(135deg, #F9008E 10%, #7C52FF 90%)",
6396
+ "description": "Gradient for Ai-oriented treatments."
6380
6397
  },
6381
6398
  "android/resources": {
6382
6399
  "name": "dt_light_color_gradient_magenta_purple",
6383
- "value": "#ff000000"
6400
+ "value": "#ff000000",
6401
+ "description": "Gradient for Ai-oriented treatments."
6384
6402
  },
6385
6403
  "compose/object": {
6386
6404
  "name": "dtColorGradientMagentaPurple",
6387
- "value": "Color(0xff000000)"
6405
+ "value": "Color(0xff000000)",
6406
+ "description": "Gradient for Ai-oriented treatments."
6388
6407
  },
6389
6408
  "ios-swift/enum.swift": {
6390
6409
  "name": "dtColorGradientMagentaPurple",
6391
- "value": "UIColor(red: 0.000, green: 0.000, blue: 0.000, alpha: 1)"
6410
+ "value": "UIColor(red: 0.000, green: 0.000, blue: 0.000, alpha: 1)",
6411
+ "description": "Gradient for Ai-oriented treatments."
6392
6412
  }
6393
6413
  },
6394
6414
  "color/brand/purple": {
6395
6415
  "css/variables": {
6396
6416
  "name": "var(--dt-color-brand-purple)",
6397
- "value": "#7C52FF"
6417
+ "value": "#7C52FF",
6418
+ "description": "Primary brand color."
6398
6419
  },
6399
6420
  "less/variables": {
6400
6421
  "name": "dt-color-brand-purple",
6401
- "value": "#7C52FF"
6422
+ "value": "#7C52FF",
6423
+ "description": "Primary brand color."
6402
6424
  },
6403
6425
  "android/resources": {
6404
6426
  "name": "dt_light_color_brand_purple",
6405
- "value": "#ff7c52ff"
6427
+ "value": "#ff7c52ff",
6428
+ "description": "Primary brand color."
6406
6429
  },
6407
6430
  "compose/object": {
6408
6431
  "name": "dtColorBrandPurple",
6409
- "value": "Color(0xff7c52ff)"
6432
+ "value": "Color(0xff7c52ff)",
6433
+ "description": "Primary brand color."
6410
6434
  },
6411
6435
  "ios-swift/enum.swift": {
6412
6436
  "name": "dtColorBrandPurple",
6413
- "value": "UIColor(red: 0.486, green: 0.322, blue: 1.000, alpha: 1)"
6437
+ "value": "UIColor(red: 0.486, green: 0.322, blue: 1.000, alpha: 1)",
6438
+ "description": "Primary brand color."
6414
6439
  }
6415
6440
  },
6416
6441
  "color/brand/magenta": {
6417
6442
  "css/variables": {
6418
6443
  "name": "var(--dt-color-brand-magenta)",
6419
- "value": "#F9008E"
6444
+ "value": "#F9008E",
6445
+ "description": "Secondary brand color, typically used as an accent color."
6420
6446
  },
6421
6447
  "less/variables": {
6422
6448
  "name": "dt-color-brand-magenta",
6423
- "value": "#F9008E"
6449
+ "value": "#F9008E",
6450
+ "description": "Secondary brand color, typically used as an accent color."
6424
6451
  },
6425
6452
  "android/resources": {
6426
6453
  "name": "dt_light_color_brand_magenta",
6427
- "value": "#fff9008e"
6454
+ "value": "#fff9008e",
6455
+ "description": "Secondary brand color, typically used as an accent color."
6428
6456
  },
6429
6457
  "compose/object": {
6430
6458
  "name": "dtColorBrandMagenta",
6431
- "value": "Color(0xfff9008e)"
6459
+ "value": "Color(0xfff9008e)",
6460
+ "description": "Secondary brand color, typically used as an accent color."
6432
6461
  },
6433
6462
  "ios-swift/enum.swift": {
6434
6463
  "name": "dtColorBrandMagenta",
6435
- "value": "UIColor(red: 0.976, green: 0.000, blue: 0.557, alpha: 1)"
6464
+ "value": "UIColor(red: 0.976, green: 0.000, blue: 0.557, alpha: 1)",
6465
+ "description": "Secondary brand color, typically used as an accent color."
6436
6466
  }
6437
6467
  },
6438
6468
  "color/foreground/primary": {
@@ -23015,67 +23045,82 @@
23015
23045
  "color/neutral/white": {
23016
23046
  "css/variables": {
23017
23047
  "name": "var(--dt-color-neutral-white)",
23018
- "value": "#ffffff"
23048
+ "value": "#ffffff",
23049
+ "description": "White color independent of any theme."
23019
23050
  },
23020
23051
  "less/variables": {
23021
23052
  "name": "dt-color-neutral-white",
23022
- "value": "#ffffff"
23053
+ "value": "#ffffff",
23054
+ "description": "White color independent of any theme."
23023
23055
  },
23024
23056
  "android/resources": {
23025
23057
  "name": "dt_dark_color_neutral_white",
23026
- "value": "#ffffffff"
23058
+ "value": "#ffffffff",
23059
+ "description": "White color independent of any theme."
23027
23060
  },
23028
23061
  "compose/object": {
23029
23062
  "name": "dtColorNeutralWhite",
23030
- "value": "Color(0xffffffff)"
23063
+ "value": "Color(0xffffffff)",
23064
+ "description": "White color independent of any theme."
23031
23065
  },
23032
23066
  "ios-swift/enum.swift": {
23033
23067
  "name": "dtColorNeutralWhite",
23034
- "value": "UIColor(red: 1.000, green: 1.000, blue: 1.000, alpha: 1)"
23068
+ "value": "UIColor(red: 1.000, green: 1.000, blue: 1.000, alpha: 1)",
23069
+ "description": "White color independent of any theme."
23035
23070
  }
23036
23071
  },
23037
23072
  "color/neutral/black": {
23038
23073
  "css/variables": {
23039
23074
  "name": "var(--dt-color-neutral-black)",
23040
- "value": "#000000"
23075
+ "value": "#000000",
23076
+ "description": "Black color independent of any theme."
23041
23077
  },
23042
23078
  "less/variables": {
23043
23079
  "name": "dt-color-neutral-black",
23044
- "value": "#000000"
23080
+ "value": "#000000",
23081
+ "description": "Black color independent of any theme."
23045
23082
  },
23046
23083
  "android/resources": {
23047
23084
  "name": "dt_dark_color_neutral_black",
23048
- "value": "#ff000000"
23085
+ "value": "#ff000000",
23086
+ "description": "Black color independent of any theme."
23049
23087
  },
23050
23088
  "compose/object": {
23051
23089
  "name": "dtColorNeutralBlack",
23052
- "value": "Color(0xff000000)"
23090
+ "value": "Color(0xff000000)",
23091
+ "description": "Black color independent of any theme."
23053
23092
  },
23054
23093
  "ios-swift/enum.swift": {
23055
23094
  "name": "dtColorNeutralBlack",
23056
- "value": "UIColor(red: 0.000, green: 0.000, blue: 0.000, alpha: 1)"
23095
+ "value": "UIColor(red: 0.000, green: 0.000, blue: 0.000, alpha: 1)",
23096
+ "description": "Black color independent of any theme."
23057
23097
  }
23058
23098
  },
23059
23099
  "color/neutral/transparent": {
23060
23100
  "css/variables": {
23061
23101
  "name": "var(--dt-color-neutral-transparent)",
23062
- "value": "transparent"
23102
+ "value": "transparent",
23103
+ "description": "Transparent color independent of any theme."
23063
23104
  },
23064
23105
  "less/variables": {
23065
23106
  "name": "dt-color-neutral-transparent",
23066
- "value": "transparent"
23107
+ "value": "transparent",
23108
+ "description": "Transparent color independent of any theme."
23067
23109
  },
23068
23110
  "android/resources": {
23069
23111
  "name": "dt_dark_color_neutral_transparent",
23070
- "value": "#00ffffff"
23112
+ "value": "#00ffffff",
23113
+ "description": "Transparent color independent of any theme."
23071
23114
  },
23072
23115
  "compose/object": {
23073
23116
  "name": "dtColorNeutralTransparent",
23074
- "value": "Color(0x00000000)"
23117
+ "value": "Color(0x00000000)",
23118
+ "description": "Transparent color independent of any theme."
23075
23119
  },
23076
23120
  "ios-swift/enum.swift": {
23077
23121
  "name": "dtColorNeutralTransparent",
23078
- "value": "UIColor(red: 0.000, green: 0.000, blue: 0.000, alpha: 0)"
23122
+ "value": "UIColor(red: 0.000, green: 0.000, blue: 0.000, alpha: 0)",
23123
+ "description": "Transparent color independent of any theme."
23079
23124
  }
23080
23125
  },
23081
23126
  "color/black/100": {
@@ -24121,67 +24166,82 @@
24121
24166
  "color/gradient/magenta-purple": {
24122
24167
  "css/variables": {
24123
24168
  "name": "var(--dt-color-gradient-magenta-purple)",
24124
- "value": "linear-gradient(135deg, #F9008E 10%, #7C52FF 90%)"
24169
+ "value": "linear-gradient(135deg, #F9008E 10%, #7C52FF 90%)",
24170
+ "description": "Gradient for Ai-oriented treatments."
24125
24171
  },
24126
24172
  "less/variables": {
24127
24173
  "name": "dt-color-gradient-magenta-purple",
24128
- "value": "linear-gradient(135deg, #F9008E 10%, #7C52FF 90%)"
24174
+ "value": "linear-gradient(135deg, #F9008E 10%, #7C52FF 90%)",
24175
+ "description": "Gradient for Ai-oriented treatments."
24129
24176
  },
24130
24177
  "android/resources": {
24131
24178
  "name": "dt_dark_color_gradient_magenta_purple",
24132
- "value": "#ff000000"
24179
+ "value": "#ff000000",
24180
+ "description": "Gradient for Ai-oriented treatments."
24133
24181
  },
24134
24182
  "compose/object": {
24135
24183
  "name": "dtColorGradientMagentaPurple",
24136
- "value": "Color(0xff000000)"
24184
+ "value": "Color(0xff000000)",
24185
+ "description": "Gradient for Ai-oriented treatments."
24137
24186
  },
24138
24187
  "ios-swift/enum.swift": {
24139
24188
  "name": "dtColorGradientMagentaPurple",
24140
- "value": "UIColor(red: 0.000, green: 0.000, blue: 0.000, alpha: 1)"
24189
+ "value": "UIColor(red: 0.000, green: 0.000, blue: 0.000, alpha: 1)",
24190
+ "description": "Gradient for Ai-oriented treatments."
24141
24191
  }
24142
24192
  },
24143
24193
  "color/brand/purple": {
24144
24194
  "css/variables": {
24145
24195
  "name": "var(--dt-color-brand-purple)",
24146
- "value": "#7C52FF"
24196
+ "value": "#7C52FF",
24197
+ "description": "Primary brand color."
24147
24198
  },
24148
24199
  "less/variables": {
24149
24200
  "name": "dt-color-brand-purple",
24150
- "value": "#7C52FF"
24201
+ "value": "#7C52FF",
24202
+ "description": "Primary brand color."
24151
24203
  },
24152
24204
  "android/resources": {
24153
24205
  "name": "dt_dark_color_brand_purple",
24154
- "value": "#ff7c52ff"
24206
+ "value": "#ff7c52ff",
24207
+ "description": "Primary brand color."
24155
24208
  },
24156
24209
  "compose/object": {
24157
24210
  "name": "dtColorBrandPurple",
24158
- "value": "Color(0xff7c52ff)"
24211
+ "value": "Color(0xff7c52ff)",
24212
+ "description": "Primary brand color."
24159
24213
  },
24160
24214
  "ios-swift/enum.swift": {
24161
24215
  "name": "dtColorBrandPurple",
24162
- "value": "UIColor(red: 0.486, green: 0.322, blue: 1.000, alpha: 1)"
24216
+ "value": "UIColor(red: 0.486, green: 0.322, blue: 1.000, alpha: 1)",
24217
+ "description": "Primary brand color."
24163
24218
  }
24164
24219
  },
24165
24220
  "color/brand/magenta": {
24166
24221
  "css/variables": {
24167
24222
  "name": "var(--dt-color-brand-magenta)",
24168
- "value": "#F9008E"
24223
+ "value": "#F9008E",
24224
+ "description": "Secondary brand color, typically used as an accent color."
24169
24225
  },
24170
24226
  "less/variables": {
24171
24227
  "name": "dt-color-brand-magenta",
24172
- "value": "#F9008E"
24228
+ "value": "#F9008E",
24229
+ "description": "Secondary brand color, typically used as an accent color."
24173
24230
  },
24174
24231
  "android/resources": {
24175
24232
  "name": "dt_dark_color_brand_magenta",
24176
- "value": "#fff9008e"
24233
+ "value": "#fff9008e",
24234
+ "description": "Secondary brand color, typically used as an accent color."
24177
24235
  },
24178
24236
  "compose/object": {
24179
24237
  "name": "dtColorBrandMagenta",
24180
- "value": "Color(0xfff9008e)"
24238
+ "value": "Color(0xfff9008e)",
24239
+ "description": "Secondary brand color, typically used as an accent color."
24181
24240
  },
24182
24241
  "ios-swift/enum.swift": {
24183
24242
  "name": "dtColorBrandMagenta",
24184
- "value": "UIColor(red: 0.976, green: 0.000, blue: 0.557, alpha: 1)"
24243
+ "value": "UIColor(red: 0.976, green: 0.000, blue: 0.557, alpha: 1)",
24244
+ "description": "Secondary brand color, typically used as an accent color."
24185
24245
  }
24186
24246
  },
24187
24247
  "color/foreground/primary": {
package/dist/ios/tokens-dark.swift CHANGED
@@ -4,7 +4,7 @@
4
4
  //
5
5
 
6
6
  // Do not edit directly
7
- // Generated on Wed, 13 Dec 2023 21:33:47 GMT
7
+ // Generated on Tue, 19 Dec 2023 20:54:41 GMT
8
8
 
9
9
 
10
10
  import UIKit
package/dist/ios/tokens-light.swift CHANGED
@@ -4,7 +4,7 @@
4
4
  //
5
5
 
6
6
  // Do not edit directly
7
- // Generated on Wed, 13 Dec 2023 21:33:47 GMT
7
+ // Generated on Tue, 19 Dec 2023 20:54:40 GMT
8
8
 
9
9
 
10
10
  import UIKit
package/dist/less/variables-dark.less CHANGED
@@ -1,6 +1,6 @@
1
1
 
2
2
  // Do not edit directly
3
- // Generated on Wed, 13 Dec 2023 21:33:47 GMT
3
+ // Generated on Tue, 19 Dec 2023 20:54:40 GMT
4
4
 
5
5
  @dt-font-size-100: 1.2rem; // small
6
6
  @dt-font-size-200: 1.5rem; // medium / base
@@ -244,9 +244,9 @@
244
244
  @dt-space-90-percent: 90%;
245
245
  @dt-space-95-percent: 95%;
246
246
  @dt-space-100-percent: 100%;
247
- @dt-color-neutral-white: #ffffff;
248
- @dt-color-neutral-black: #000000;
249
- @dt-color-neutral-transparent: transparent;
247
+ @dt-color-neutral-white: #ffffff; // White color independent of any theme.
248
+ @dt-color-neutral-black: #000000; // Black color independent of any theme.
249
+ @dt-color-neutral-transparent: transparent; // Transparent color independent of any theme.
250
250
  @dt-color-black-100: #000000;
251
251
  @dt-color-black-200: #262626;
252
252
  @dt-color-black-300: #3A3A3A;
@@ -292,9 +292,9 @@
292
292
  @dt-color-tan-300: #87807B;
293
293
  @dt-color-tan-400: #CEC8C4;
294
294
  @dt-color-tan-500: #F2F0EE;
295
- @dt-color-gradient-magenta-purple: linear-gradient(135deg, #F9008E 10%, #7C52FF 90%);
296
- @dt-color-brand-purple: #7C52FF;
297
- @dt-color-brand-magenta: #F9008E;
295
+ @dt-color-gradient-magenta-purple: linear-gradient(135deg, #F9008E 10%, #7C52FF 90%); // Gradient for Ai-oriented treatments.
296
+ @dt-color-brand-purple: #7C52FF; // Primary brand color.
297
+ @dt-color-brand-magenta: #F9008E; // Secondary brand color, typically used as an accent color.
298
298
  @dt-color-foreground-primary: #E6E6E6; // Default text color throughout the UI.
299
299
  @dt-color-foreground-secondary: #C2C2C2; // Example uses include introduction paragraphs, labels, and descriptions paired with form elements.
300
300
  @dt-color-foreground-tertiary: #AAAAAA; // Used to imply visual hierarchy relative to primary and secondary text colors, e.g. headlines and labels.
package/dist/less/variables-light.less CHANGED
@@ -1,6 +1,6 @@
1
1
 
2
2
  // Do not edit directly
3
- // Generated on Wed, 13 Dec 2023 21:33:46 GMT
3
+ // Generated on Tue, 19 Dec 2023 20:54:39 GMT
4
4
 
5
5
  @dt-font-size-100: 1.2rem; // small
6
6
  @dt-font-size-200: 1.5rem; // medium / base
@@ -244,9 +244,9 @@
244
244
  @dt-space-90-percent: 90%;
245
245
  @dt-space-95-percent: 95%;
246
246
  @dt-space-100-percent: 100%;
247
- @dt-color-neutral-white: #ffffff;
248
- @dt-color-neutral-black: #000000;
249
- @dt-color-neutral-transparent: transparent;
247
+ @dt-color-neutral-white: #ffffff; // White color independent of any theme.
248
+ @dt-color-neutral-black: #000000; // Black color independent of any theme.
249
+ @dt-color-neutral-transparent: transparent; // Transparent color independent of any theme.
250
250
  @dt-color-black-100: #F9F9F9;
251
251
  @dt-color-black-200: #E9E9E9;
252
252
  @dt-color-black-300: #D2D2D2;
@@ -292,9 +292,9 @@
292
292
  @dt-color-tan-300: #87807B;
293
293
  @dt-color-tan-400: #3F3D3C;
294
294
  @dt-color-tan-500: #121212;
295
- @dt-color-gradient-magenta-purple: linear-gradient(135deg, #F9008E 10%, #7C52FF 90%);
296
- @dt-color-brand-purple: #7C52FF;
297
- @dt-color-brand-magenta: #F9008E;
295
+ @dt-color-gradient-magenta-purple: linear-gradient(135deg, #F9008E 10%, #7C52FF 90%); // Gradient for Ai-oriented treatments.
296
+ @dt-color-brand-purple: #7C52FF; // Primary brand color.
297
+ @dt-color-brand-magenta: #F9008E; // Secondary brand color, typically used as an accent color.
298
298
  @dt-color-foreground-primary: #000000; // Default text color throughout the UI.
299
299
  @dt-color-foreground-secondary: #3A3A3A; // Example uses include introduction paragraphs, labels, and descriptions paired with form elements.
300
300
  @dt-color-foreground-tertiary: #555555; // Used to imply visual hierarchy relative to primary and secondary text colors, e.g. headlines and labels.
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@dialpad/dialtone-tokens",
3
- "version": "1.23.3",
3
+ "version": "1.23.4",
4
4
  "description": "Design tokens for Dialtone.",
5
5
  "main": "index.js",
6
6
  "type": "module",