@planningcenter/tapestry 2.6.0 → 2.6.1-qa-513.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.
Files changed (77) hide show
  1. package/dist/components/button/BaseButton.d.ts.map +1 -1
  2. package/dist/components/button/BaseButton.js +3 -2
  3. package/dist/components/button/BaseButton.js.map +1 -1
  4. package/dist/components/button/DropdownButton.js +1 -1
  5. package/dist/components/button/DropdownButton.js.map +1 -1
  6. package/dist/components/button/IconButton.js +1 -1
  7. package/dist/components/button/IconButton.js.map +1 -1
  8. package/dist/components/button/PageHeaderActionsDropdownButton.js +1 -1
  9. package/dist/components/button/PageHeaderActionsDropdownButton.js.map +1 -1
  10. package/dist/components/link/BaseLink.js +2 -2
  11. package/dist/components/link/BaseLink.js.map +1 -1
  12. package/dist/components/page-header/index.js +1 -1
  13. package/dist/components/sidenav/index.js +1 -1
  14. package/dist/index.css +264 -173
  15. package/dist/index.css.map +1 -1
  16. package/dist/index.d.ts +1 -0
  17. package/dist/index.d.ts.map +1 -1
  18. package/dist/reactRender.css +1241 -1150
  19. package/dist/reactRender.css.map +1 -1
  20. package/dist/reactRenderLegacy.css +1241 -1150
  21. package/dist/reactRenderLegacy.css.map +1 -1
  22. package/dist/tapestry-wc/dist/components/{p-5-Cvrlgk.js → p-BFofJs4X.js} +2 -2
  23. package/dist/tapestry-wc/dist/components/p-BFofJs4X.js.map +1 -0
  24. package/dist/tapestry-wc/dist/components/{p-D1rzJeWl.js → p-BeEJkvAo.js} +3 -3
  25. package/dist/tapestry-wc/dist/components/p-BeEJkvAo.js.map +1 -0
  26. package/dist/tapestry-wc/dist/components/{p-D0G2xpOq.js → p-DEm5QayP.js} +3 -3
  27. package/dist/tapestry-wc/dist/components/p-DEm5QayP.js.map +1 -0
  28. package/dist/tapestry-wc/dist/components/{p-DmP02I4b.js → p-W8KnNQAP.js} +3 -3
  29. package/dist/tapestry-wc/dist/components/p-W8KnNQAP.js.map +1 -0
  30. package/dist/tapestry-wc/dist/components/{p-74Cc2nEh.js → p-_HgLeFWa.js} +2 -2
  31. package/dist/tapestry-wc/dist/components/p-_HgLeFWa.js.map +1 -0
  32. package/dist/tapestry-wc/dist/components/tds-page-header-nav.js +2 -2
  33. package/dist/tapestry-wc/dist/components/tds-page-header-nav.js.map +1 -1
  34. package/dist/tapestry-wc/dist/components/tds-page-header.js +3 -3
  35. package/dist/tapestry-wc/dist/components/tds-page-header.js.map +1 -1
  36. package/dist/tapestry-wc/dist/components/tds-sidenav-item.js +3 -3
  37. package/dist/tapestry-wc/dist/components/tds-sidenav-item.js.map +1 -1
  38. package/dist/tapestry-wc/dist/components/tds-sidenav-responsive-header.js +2 -2
  39. package/dist/tapestry-wc/dist/components/tds-sidenav-responsive-header.js.map +1 -1
  40. package/dist/tapestry-wc/dist/components/tds-sidenav-section.js +3 -3
  41. package/dist/tapestry-wc/dist/components/tds-sidenav-section.js.map +1 -1
  42. package/dist/tapestry-wc/dist/components/tds-sidenav.js +5 -5
  43. package/dist/tapestry-wc/dist/components/tds-sidenav.js.map +1 -1
  44. package/dist/tokens/tokens-deprecated.json +158 -0
  45. package/dist/tokens/ts/react-native-tokens.d.ts +190 -54
  46. package/dist/tokens/ts/react-native-tokens.d.ts.map +1 -1
  47. package/dist/tokens/ts/react-native-tokens.js +92 -55
  48. package/dist/tokens/ts/react-native-tokens.js.map +1 -1
  49. package/dist/tokens/ts/tokens.d.ts +72 -54
  50. package/dist/tokens/ts/tokens.d.ts.map +1 -1
  51. package/dist/tokens/ts/tokens.js +72 -54
  52. package/dist/tokens/ts/tokens.js.map +1 -1
  53. package/dist/tokens-dark.css +90 -88
  54. package/dist/tokens-dark.css.map +1 -0
  55. package/dist/tokens-dark.js +1 -0
  56. package/dist/tokens-deprecated.css +109 -0
  57. package/dist/tokens-deprecated.css.map +1 -0
  58. package/dist/tokens-deprecated.d.ts +5 -0
  59. package/dist/tokens-deprecated.d.ts.map +1 -0
  60. package/dist/tokens-deprecated.js +1 -0
  61. package/dist/tokens.css +154 -172
  62. package/dist/tokens.css.map +1 -1
  63. package/dist/tokens.d.ts +3 -2
  64. package/dist/tokens.d.ts.map +1 -1
  65. package/dist/unstable.css +271 -180
  66. package/dist/unstable.css.map +1 -1
  67. package/dist/utilities/Icon.d.ts.map +1 -1
  68. package/dist/utilities/Icon.js +12 -19
  69. package/dist/utilities/Icon.js.map +1 -1
  70. package/package.json +7 -6
  71. package/dist/deprecated.css +0 -25
  72. package/dist/tapestry-wc/dist/components/p-5-Cvrlgk.js.map +0 -1
  73. package/dist/tapestry-wc/dist/components/p-74Cc2nEh.js.map +0 -1
  74. package/dist/tapestry-wc/dist/components/p-D0G2xpOq.js.map +0 -1
  75. package/dist/tapestry-wc/dist/components/p-D1rzJeWl.js.map +0 -1
  76. package/dist/tapestry-wc/dist/components/p-DmP02I4b.js.map +0 -1
  77. package/dist/tokens-dark-combined.js +0 -3
package/dist/tokens/ts/react-native-tokens.js CHANGED
@@ -7,9 +7,11 @@ const reactNativeTokens = {
7
7
  "--t-border-radius-lg": 8,
8
8
  "--t-border-radius-xl": 16,
9
9
  "--t-border-radius-round": 56,
10
- "--t-border-radius-default": 4,
11
- "--t-border-width-default": 1,
10
+ "--t-border-radius": 4,
11
+ "--t-border-width": 1,
12
12
  "--t-border-width-thick": 2,
13
+ "--t-border-size-default": 1,
14
+ "--t-border-size-thick": 2,
13
15
  "--t-spacing-1": 8,
14
16
  "--t-spacing-2": 16,
15
17
  "--t-spacing-3": 24,
@@ -19,6 +21,7 @@ const reactNativeTokens = {
19
21
  "--t-spacing-7": 56,
20
22
  "--t-spacing-fourth": 2,
21
23
  "--t-spacing-half": 4,
24
+ "--t-spacing-1-half": 12,
22
25
  "--t-element-size-3xl": 48,
23
26
  "--t-element-size-2xl": 32,
24
27
  "--t-element-size-xl": 24,
@@ -39,6 +42,7 @@ const reactNativeTokens = {
39
42
  "--t-font-weight-medium": "500",
40
43
  "--t-font-weight-semibold": "600",
41
44
  "--t-font-weight-bold": "700",
45
+ "--t-font-weight-semi-bold": "600",
42
46
  "--t-container-size-xl": 48,
43
47
  "--t-container-size-lg": 40,
44
48
  "--t-container-size-md": 32,
@@ -50,13 +54,13 @@ const reactNativeTokens = {
50
54
  "--t-avatar-size-48": 48,
51
55
  "--t-avatar-size-72": 72,
52
56
  "--t-avatar-size-112": 112,
53
- "--t-text-color-default-headline": { light: "hsl(0, 0%, 12%)", dark: "hsl(0, 0%, 94%)" },
54
- "--t-text-color-default-primary": { light: "hsl(0, 0%, 24%)", dark: "hsl(0, 0%, 80%)" },
55
- "--t-text-color-default-secondary": { light: "hsl(0, 0%, 42%)", dark: "hsl(0, 0%, 54%)" },
56
- "--t-text-color-default-disabled": { light: "hsl(0, 0%, 81%)", dark: "hsl(0, 0%, 25%)" },
57
- "--t-text-color-default-placeholder": { light: "hsl(0, 0%, 58%)", dark: "hsl(0, 0%, 38%)" },
58
- "--t-text-color-default-inverted": { light: "hsl(0, 0%, 100%)", dark: "hsl(0, 0%, 100%)" },
59
- "--t-text-color-interaction-primary": { light: "hsl(204, 100%, 40%)", dark: "hsl(204, 68%, 55%)" },
57
+ "--t-text-color-headline": { light: "hsl(0, 0%, 12%)", dark: "hsl(0, 0%, 94%)" },
58
+ "--t-text-color": { light: "hsl(0, 0%, 24%)", dark: "hsl(0, 0%, 80%)" },
59
+ "--t-text-color-secondary": { light: "hsl(0, 0%, 42%)", dark: "hsl(0, 0%, 54%)" },
60
+ "--t-text-color-disabled": { light: "hsl(0, 0%, 81%)", dark: "hsl(0, 0%, 25%)" },
61
+ "--t-text-color-placeholder": { light: "hsl(0, 0%, 58%)", dark: "hsl(0, 0%, 38%)" },
62
+ "--t-text-color-inverted": { light: "hsl(0, 0%, 100%)", dark: "hsl(0, 0%, 100%)" },
63
+ "--t-text-color-interaction": { light: "hsl(204, 100%, 40%)", dark: "hsl(204, 68%, 55%)" },
60
64
  "--t-text-color-interaction-hover": { light: "hsl(204, 100%, 35%)", dark: "hsl(204, 68%, 50%)" },
61
65
  "--t-text-color-interaction-active": { light: "hsl(204, 100%, 30%)", dark: "hsl(204, 68%, 45%)" },
62
66
  "--t-text-color-interaction-visited": { light: "hsl(204, 100%, 30%)", dark: "hsl(204, 68%, 50%)" },
@@ -87,19 +91,21 @@ const reactNativeTokens = {
87
91
  "--t-text-color-tag-bold-pink": { light: "hsl(327, 88%, 20%)", dark: "hsl(0, 0%, 100%)" },
88
92
  "--t-text-color-tag-bold-purple": { light: "hsl(268, 71%, 27%)", dark: "hsl(0, 0%, 100%)" },
89
93
  "--t-text-color-tag-bold-magenta": { light: "hsl(285, 71%, 20%)", dark: "hsl(0, 0%, 100%)" },
90
- "--t-icon-color-default-primary": { light: "hsl(0, 0%, 24%)", dark: "hsl(0, 0%, 80%)" },
91
- "--t-icon-color-default-secondary": { light: "hsl(0, 0%, 42%)", dark: "hsl(0, 0%, 54%)" },
92
- "--t-icon-color-default-dim": { light: "hsl(0, 0%, 58%)", dark: "hsl(0, 0%, 38%)" },
93
- "--t-icon-color-default-disabled": { light: "hsl(0, 0%, 81%)", dark: "hsl(0, 0%, 25%)" },
94
- "--t-icon-color-default-inverted": { light: "hsl(0, 0%, 100%)", dark: "hsl(0, 0%, 100%)" },
95
- "--t-icon-color-status-neutral-primary": { light: "hsl(0, 0%, 42%)", dark: "hsl(0, 0%, 54%)" },
94
+ "--t-icon-color": { light: "hsl(0, 0%, 24%)", dark: "hsl(0, 0%, 80%)" },
95
+ "--t-icon-color-secondary": { light: "hsl(0, 0%, 42%)", dark: "hsl(0, 0%, 54%)" },
96
+ "--t-icon-color-dim": { light: "hsl(0, 0%, 58%)", dark: "hsl(0, 0%, 38%)" },
97
+ "--t-icon-color-disabled": { light: "hsl(0, 0%, 81%)", dark: "hsl(0, 0%, 25%)" },
98
+ "--t-icon-color-inverted": { light: "hsl(0, 0%, 100%)", dark: "hsl(0, 0%, 100%)" },
99
+ "--t-icon-color-status-neutral": { light: "hsl(0, 0%, 42%)", dark: "hsl(0, 0%, 54%)" },
96
100
  "--t-icon-color-status-neutral-secondary": { light: "hsl(0, 0%, 58%)", dark: "hsl(0, 0%, 38%)" },
97
101
  "--t-icon-color-status-neutral-bold": { light: "hsl(0, 0%, 24%)", dark: "hsl(0, 0%, 80%)" },
98
- "--t-icon-color-status-info-primary": { light: "hsl(204, 100%, 40%)", dark: "hsl(204, 68%, 55%)" },
99
- "--t-icon-color-status-success-primary": { light: "hsl(96, 57%, 33%)", dark: "hsl(96, 57%, 33%)" },
102
+ "--t-icon-color-status-neutral-dark": { light: "hsl(0, 0%, 24%)", dark: "hsl(0, 0%, 24%)" },
103
+ "--t-icon-color-status-info": { light: "hsl(204, 100%, 40%)", dark: "hsl(204, 68%, 55%)" },
104
+ "--t-icon-color-status-info-secondary": { light: "hsl(204, 100%, 40%)", dark: "hsl(204, 100%, 40%)" },
105
+ "--t-icon-color-status-success": { light: "hsl(96, 57%, 33%)", dark: "hsl(96, 57%, 33%)" },
100
106
  "--t-icon-color-status-success-secondary": { light: "hsl(97, 57%, 40%)", dark: "hsl(97, 57%, 40%)" },
101
- "--t-icon-color-status-warning-primary": { light: "hsl(42, 84%, 49%)", dark: "hsl(42, 84%, 49%)" },
102
- "--t-icon-color-status-error-primary": { light: "hsl(8, 60%, 47%)", dark: "hsl(8, 61%, 61%)" },
107
+ "--t-icon-color-status-warning": { light: "hsl(42, 84%, 49%)", dark: "hsl(42, 84%, 49%)" },
108
+ "--t-icon-color-status-error": { light: "hsl(8, 60%, 47%)", dark: "hsl(8, 61%, 61%)" },
103
109
  "--t-fill-color-neutral-100": { light: "hsl(0, 0%, 100%)", dark: "hsl(0, 0%, 10%)" },
104
110
  "--t-fill-color-neutral-000": { light: "hsl(0, 0%, 12%)", dark: "hsl(0, 0%, 98%)" },
105
111
  "--t-fill-color-neutral-010": { light: "hsl(0, 0%, 24%)", dark: "hsl(0, 0%, 88%)" },
@@ -112,32 +118,41 @@ const reactNativeTokens = {
112
118
  "--t-fill-color-neutral-070": { light: "hsl(0, 0%, 95%)", dark: "hsl(0, 0%, 17%)" },
113
119
  "--t-fill-color-neutral-080": { light: "hsl(0, 0%, 97%)", dark: "hsl(0, 0%, 15%)" },
114
120
  "--t-fill-color-neutral-090": { light: "hsl(0, 0%, 98%)", dark: "hsl(0, 0%, 12%)" },
115
- "--t-fill-color-interaction-default": { light: "hsl(204, 100%, 40%)", dark: "hsl(204, 100%, 35%)" },
121
+ "--t-fill-color-interaction": { light: "hsl(204, 100%, 40%)", dark: "hsl(204, 100%, 35%)" },
116
122
  "--t-fill-color-interaction-hover": { light: "hsl(204, 100%, 35%)", dark: "hsl(204, 100%, 40%)" },
117
123
  "--t-fill-color-interaction-active": { light: "hsl(204, 100%, 30%)", dark: "hsl(204, 80%, 45%)" },
118
124
  "--t-fill-color-interaction-disabled": { light: "hsl(0, 0%, 81%)", dark: "hsl(0, 0%, 25%)" },
119
125
  "--t-fill-color-control-neutral-off": { light: "hsl(0, 0%, 58%)", dark: "hsl(0, 0%, 32%)" },
120
126
  "--t-fill-color-control-neutral-on": { light: "hsl(0, 0%, 24%)", dark: "hsl(0, 0%, 50%)" },
121
- "--t-fill-color-control-primary": { light: "hsl(204, 100%, 40%)", dark: "hsl(204, 100%, 35%)" },
127
+ "--t-fill-color-control": { light: "hsl(204, 100%, 40%)", dark: "hsl(204, 100%, 35%)" },
122
128
  "--t-fill-color-control-secondary": { light: "hsl(97, 57%, 40%)", dark: "hsl(97, 57%, 40%)" },
123
129
  "--t-fill-color-control-error": { light: "hsl(8, 60%, 47%)", dark: "hsl(8, 60%, 47%)" },
124
130
  "--t-fill-color-control-disabled": { light: "hsl(0, 0%, 81%)", dark: "hsl(0, 0%, 20%)" },
125
- "--t-fill-color-status-neutral-solid": { light: "hsl(0, 0%, 42%)", dark: "hsl(0, 0%, 24%)" },
131
+ "--t-fill-color-status-neutral": { light: "hsl(0, 0%, 42%)", dark: "hsl(0, 0%, 24%)" },
126
132
  "--t-fill-color-status-neutral-ghost": { light: "hsl(0, 0%, 93%)", dark: "hsl(0, 0%, 18%)" },
127
133
  "--t-fill-color-status-neutral-dim": { light: "hsl(0, 0%, 97%)", dark: "hsl(0, 0%, 15%)" },
128
- "--t-fill-color-status-info-solid": { light: "hsl(204, 100%, 40%)", dark: "hsl(204, 100%, 35%)" },
134
+ "--t-fill-color-status-neutral-solid": { light: "hsl(0, 0%, 42%)", dark: "hsl(0, 0%, 42%)" },
135
+ "--t-fill-color-status-info": { light: "hsl(204, 100%, 40%)", dark: "hsl(204, 100%, 35%)" },
129
136
  "--t-fill-color-status-info-ghost": { light: "hsl(203, 94%, 94%)", dark: "hsl(204, 32%, 15%)" },
130
137
  "--t-fill-color-status-info-dim": { light: "hsl(204, 100%, 97%)", dark: "hsl(206, 22%, 15%)" },
131
- "--t-fill-color-status-success-solid": { light: "hsl(96, 57%, 33%)", dark: "hsl(96, 57%, 33%)" },
138
+ "--t-fill-color-status-info-solid": { light: "hsl(204, 100%, 40%)", dark: "hsl(204, 100%, 40%)" },
139
+ "--t-fill-color-status-success": { light: "hsl(96, 57%, 33%)", dark: "hsl(96, 57%, 33%)" },
132
140
  "--t-fill-color-status-success-ghost": { light: "hsl(97, 57%, 90%)", dark: "hsl(125, 17%, 15%)" },
133
141
  "--t-fill-color-status-success-dim": { light: "hsl(96, 60%, 95%)", dark: "hsl(120, 12%, 14%)" },
134
- "--t-fill-color-status-warning-solid": { light: "hsl(42, 84%, 63%)", dark: "hsl(42, 84%, 63%)" },
142
+ "--t-fill-color-status-success-solid": { light: "hsl(96, 57%, 33%)", dark: "hsl(96, 57%, 33%)" },
143
+ "--t-fill-color-status-warning": { light: "hsl(42, 84%, 63%)", dark: "hsl(42, 84%, 63%)" },
135
144
  "--t-fill-color-status-warning-ghost": { light: "hsl(42, 87%, 94%)", dark: "hsl(41, 18%, 17%)" },
136
145
  "--t-fill-color-status-warning-dim": { light: "hsl(42, 87%, 97%)", dark: "hsl(42, 13%, 15%)" },
137
- "--t-fill-color-status-error-solid": { light: "hsl(8, 60%, 47%)", dark: "hsl(8, 60%, 47%)" },
146
+ "--t-fill-color-status-warning-solid": { light: "hsl(42, 84%, 63%)", dark: "hsl(42, 84%, 63%)" },
147
+ "--t-fill-color-status-error": { light: "hsl(8, 60%, 47%)", dark: "hsl(8, 60%, 47%)" },
138
148
  "--t-fill-color-status-error-ghost": { light: "hsl(9, 59%, 93%)", dark: "hsl(8, 20%, 16%)" },
139
149
  "--t-fill-color-status-error-dim": { light: "hsl(7, 60%, 97%)", dark: "hsl(10, 16%, 15%)" },
140
- "--t-fill-color-tooltip-primary": { light: "hsla(0, 0%, 12%, 0.9)", dark: "hsla(0, 0%, 24%, 0.9)" },
150
+ "--t-fill-color-status-error-solid": { light: "hsl(8, 60%, 47%)", dark: "hsl(8, 60%, 47%)" },
151
+ "--t-fill-color-alert-info": { light: "hsl(204, 94%, 49%)", dark: "hsl(204, 94%, 49%)" },
152
+ "--t-fill-color-alert-success": { light: "hsl(122, 60%, 41%)", dark: "hsl(122, 60%, 41%)" },
153
+ "--t-fill-color-alert-warning": { light: "hsl(43, 96%, 58%)", dark: "hsl(43, 96%, 58%)" },
154
+ "--t-fill-color-alert-error": { light: "hsl(4, 77%, 59%)", dark: "hsl(4, 77%, 59%)" },
155
+ "--t-fill-color-tooltip": { light: "hsla(0, 0%, 12%, 0.9)", dark: "hsla(0, 0%, 24%, 0.9)" },
141
156
  "--t-fill-color-product-accounts-010": { light: "hsl(212, 54%, 93%)", dark: "hsl(212, 54%, 93%)" },
142
157
  "--t-fill-color-product-accounts-020": { light: "hsl(209, 53%, 90%)", dark: "hsl(209, 53%, 90%)" },
143
158
  "--t-fill-color-product-accounts-030": { light: "hsl(210, 56%, 70%)", dark: "hsl(210, 56%, 70%)" },
@@ -218,7 +233,7 @@ const reactNativeTokens = {
218
233
  "--t-fill-color-product-services-060": { light: "hsl(89, 62%, 31%)", dark: "hsl(89, 62%, 31%)" },
219
234
  "--t-fill-color-product-services-070": { light: "hsl(89, 62%, 26%)", dark: "hsl(89, 62%, 26%)" },
220
235
  "--t-fill-color-product-services-080": { light: "hsl(89, 63%, 21%)", dark: "hsl(89, 63%, 21%)" },
221
- "--t-fill-color-product-staff-base": { light: "hsl(328, 100%, 45%)", dark: "hsl(328, 100%, 45%)" },
236
+ "--t-fill-color-product-staff": { light: "hsl(328, 100%, 45%)", dark: "hsl(328, 100%, 45%)" },
222
237
  "--t-fill-color-product-staff-dark": { light: "hsl(328, 100%, 38%)", dark: "hsl(328, 100%, 38%)" },
223
238
  "--t-fill-color-product-staff-darker": { light: "hsl(328, 100%, 33%)", dark: "hsl(328, 100%, 33%)" },
224
239
  "--t-fill-color-product-accounts-gradient-brand": { "stops": [{ "color": "#32a7f0", "position": 0 }, { "color": "#3f75e5", "position": 1 }], "type": "linear", "angle": 135 },
@@ -298,47 +313,69 @@ const reactNativeTokens = {
298
313
  "--t-fill-color-tag-indigo-020": { light: "hsl(233, 79%, 87%)", dark: "hsl(236, 22%, 29%)" },
299
314
  "--t-fill-color-tag-indigo-030": { light: "hsl(233, 77%, 81%)", dark: "hsl(236, 26%, 50%)" },
300
315
  "--t-fill-color-tag-indigo-040": { light: "hsl(236, 79%, 74%)", dark: "hsl(236, 34%, 56%)" },
301
- "--t-fill-color-button-neutral-solid-default": { light: "hsl(0, 0%, 93%)", dark: "hsl(0, 0%, 19%)" },
316
+ "--t-fill-color-button-neutral-solid": { light: "hsl(0, 0%, 93%)", dark: "hsl(0, 0%, 19%)" },
302
317
  "--t-fill-color-button-neutral-solid-hover": { light: "hsl(0, 0%, 88%)", dark: "hsl(0, 0%, 24%)" },
303
318
  "--t-fill-color-button-neutral-solid-active": { light: "hsl(0, 0%, 81%)", dark: "hsl(0, 0%, 32%)" },
304
319
  "--t-fill-color-button-neutral-solid-disabled": { light: "hsl(0, 0%, 95%)", dark: "hsl(0, 0%, 12%)" },
305
- "--t-fill-color-button-neutral-outline-dim-default": { light: "hsla(0, 0%, 100%, 0)", dark: "hsl(0, 0%, 15%)" },
306
- "--t-fill-color-button-neutral-outline-dim-hover": { light: "hsl(0, 0%, 95%)", dark: "hsl(0, 0%, 17%)" },
307
- "--t-fill-color-button-neutral-outline-dim-active": { light: "hsl(0, 0%, 93%)", dark: "hsl(0, 0%, 19%)" },
308
- "--t-fill-color-button-neutral-outline-dim-disabled": { light: "hsl(0, 0%, 98%)", dark: "hsl(0, 0%, 12%)" },
309
- "--t-fill-color-button-neutral-ghost-default": { light: "hsla(0, 0%, 100%, 0)", dark: "hsla(0, 0%, 0%, 0)" },
320
+ "--t-fill-color-button-neutral-outline": { light: "hsla(0, 0%, 100%, 0)", dark: "hsl(0, 0%, 15%)" },
321
+ "--t-fill-color-button-neutral-outline-hover": { light: "hsl(0, 0%, 95%)", dark: "hsl(0, 0%, 17%)" },
322
+ "--t-fill-color-button-neutral-outline-active": { light: "hsl(0, 0%, 93%)", dark: "hsl(0, 0%, 19%)" },
323
+ "--t-fill-color-button-neutral-outline-disabled": { light: "hsl(0, 0%, 98%)", dark: "hsl(0, 0%, 12%)" },
324
+ "--t-fill-color-button-neutral-ghost": { light: "hsla(0, 0%, 100%, 0)", dark: "hsla(0, 0%, 0%, 0)" },
310
325
  "--t-fill-color-button-neutral-ghost-hover": { light: "hsl(0, 0%, 95%)", dark: "hsl(0, 0%, 17%)" },
311
326
  "--t-fill-color-button-neutral-ghost-active": { light: "hsl(0, 0%, 93%)", dark: "hsl(0, 0%, 19%)" },
312
327
  "--t-fill-color-button-neutral-ghost-disabled": { light: "hsla(0, 0%, 100%, 0)", dark: "hsla(0, 0%, 0%, 0)" },
313
- "--t-fill-color-button-neutral-responsive-header-default": { light: "hsla(0, 0%, 0%, 0.1)", dark: "hsla(0, 0%, 0%, 0.1)" },
328
+ "--t-fill-color-button-neutral-ghost-disabled-solid": { light: "hsl(0, 0%, 98%)", dark: "hsl(0, 0%, 100%)" },
329
+ "--t-fill-color-button-neutral-responsive-header": { light: "hsla(0, 0%, 0%, 0.1)", dark: "hsla(0, 0%, 0%, 0.1)" },
314
330
  "--t-fill-color-button-neutral-responsive-header-hover": { light: "hsla(0, 0%, 0%, 0.2)", dark: "hsla(0, 0%, 0%, 0.2)" },
315
331
  "--t-fill-color-button-neutral-responsive-header-active": { light: "hsla(0, 0%, 0%, 0.3)", dark: "hsla(0, 0%, 0%, 0.3)" },
316
332
  "--t-fill-color-button-neutral-responsive-header-disabled": { light: "hsla(0, 0%, 0%, 0.05)", dark: "hsla(0, 0%, 100%, 0.05)" },
317
- "--t-fill-color-button-interaction-solid-default": { light: "hsl(204, 100%, 40%)", dark: "hsl(204, 100%, 35%)" },
333
+ "--t-fill-color-button-neutral-outline-dim-default": { light: "hsla(0, 0%, 100%, 0)", dark: "hsla(0, 0%, 100%, 0)" },
334
+ "--t-fill-color-button-neutral-outline-dim-hover": { light: "hsl(0, 0%, 95%)", dark: "hsl(0, 0%, 95%)" },
335
+ "--t-fill-color-button-neutral-outline-dim-active": { light: "hsl(0, 0%, 93%)", dark: "hsl(0, 0%, 93%)" },
336
+ "--t-fill-color-button-neutral-outline-dim-disabled": { light: "hsl(0, 0%, 98%)", dark: "hsl(0, 0%, 98%)" },
337
+ "--t-fill-color-button-neutral-outline-dim-disabled-solid": { light: "hsl(0, 0%, 98%)", dark: "hsl(0, 0%, 100%)" },
338
+ "--t-fill-color-button-interaction-solid": { light: "hsl(204, 100%, 40%)", dark: "hsl(204, 100%, 35%)" },
318
339
  "--t-fill-color-button-interaction-solid-hover": { light: "hsl(204, 100%, 35%)", dark: "hsl(204, 100%, 40%)" },
319
340
  "--t-fill-color-button-interaction-solid-active": { light: "hsl(204, 100%, 30%)", dark: "hsl(204, 80%, 45%)" },
320
341
  "--t-fill-color-button-interaction-solid-disabled": { light: "hsl(0, 0%, 95%)", dark: "hsl(0, 0%, 12%)" },
321
- "--t-fill-color-button-interaction-outline-dim-default": { light: "hsla(0, 0%, 100%, 0)", dark: "hsl(204, 32%, 15%)" },
322
- "--t-fill-color-button-interaction-outline-dim-hover": { light: "hsl(204, 100%, 97%)", dark: "hsl(204, 39%, 17%)" },
323
- "--t-fill-color-button-interaction-outline-dim-active": { light: "hsl(203, 94%, 94%)", dark: "hsl(205, 45%, 18%)" },
324
- "--t-fill-color-button-interaction-outline-dim-disabled": { light: "hsl(0, 0%, 98%)", dark: "hsl(0, 0%, 12%)" },
325
- "--t-fill-color-button-interaction-ghost-default": { light: "hsla(0, 0%, 100%, 0)", dark: "hsla(0, 0%, 0%, 0)" },
342
+ "--t-fill-color-button-interaction-outline": { light: "hsla(0, 0%, 100%, 0)", dark: "hsl(204, 32%, 15%)" },
343
+ "--t-fill-color-button-interaction-outline-hover": { light: "hsl(204, 100%, 97%)", dark: "hsl(204, 39%, 17%)" },
344
+ "--t-fill-color-button-interaction-outline-active": { light: "hsl(203, 94%, 94%)", dark: "hsl(205, 45%, 18%)" },
345
+ "--t-fill-color-button-interaction-outline-disabled": { light: "hsl(0, 0%, 98%)", dark: "hsl(0, 0%, 12%)" },
346
+ "--t-fill-color-button-interaction-ghost": { light: "hsla(0, 0%, 100%, 0)", dark: "hsla(0, 0%, 0%, 0)" },
326
347
  "--t-fill-color-button-interaction-ghost-hover": { light: "hsl(204, 100%, 97%)", dark: "hsl(204, 32%, 15%)" },
327
348
  "--t-fill-color-button-interaction-ghost-active": { light: "hsl(203, 94%, 94%)", dark: "hsl(204, 39%, 17%)" },
328
349
  "--t-fill-color-button-interaction-ghost-disabled": { light: "hsla(0, 0%, 100%, 0)", dark: "hsla(0, 0%, 0%, 0)" },
329
- "--t-fill-color-button-delete-solid-default": { light: "hsl(8, 60%, 47%)", dark: "hsl(8, 60%, 40%)" },
350
+ "--t-fill-color-button-interaction-outline-dim-default": { light: "hsla(0, 0%, 100%, 0)", dark: "hsla(0, 0%, 100%, 0)" },
351
+ "--t-fill-color-button-interaction-outline-dim-hover": { light: "hsl(204, 100%, 97%)", dark: "hsl(204, 100%, 97%)" },
352
+ "--t-fill-color-button-interaction-outline-dim-active": { light: "hsl(203, 94%, 94%)", dark: "hsl(203, 94%, 94%)" },
353
+ "--t-fill-color-button-interaction-outline-dim-disabled": { light: "hsl(0, 0%, 98%)", dark: "hsl(0, 0%, 98%)" },
354
+ "--t-fill-color-button-create-solid-default": { light: "hsl(96, 57%, 33%)", dark: "hsl(0, 0%, 25%)" },
355
+ "--t-fill-color-button-create-solid-hover": { light: "hsl(97, 57%, 28%)", dark: "hsl(0, 0%, 25%)" },
356
+ "--t-fill-color-button-create-solid-active": { light: "hsl(97, 57%, 23%)", dark: "hsl(0, 0%, 25%)" },
357
+ "--t-fill-color-button-create-solid-disabled": { light: "hsl(0, 0%, 81%)", dark: "hsl(0, 0%, 25%)" },
358
+ "--t-fill-color-button-create-ghost-default": { light: "hsla(0, 0%, 100%, 0)", dark: "hsla(0, 0%, 100%, 0)" },
359
+ "--t-fill-color-button-create-ghost-hover": { light: "hsl(96, 60%, 95%)", dark: "hsla(0, 0%, 100%, 0)" },
360
+ "--t-fill-color-button-create-ghost-active": { light: "hsl(97, 57%, 90%)", dark: "hsla(0, 0%, 100%, 0)" },
361
+ "--t-fill-color-button-create-ghost-disabled": { light: "hsla(0, 0%, 100%, 0)", dark: "hsla(0, 0%, 100%, 0)" },
362
+ "--t-fill-color-button-delete-solid": { light: "hsl(8, 60%, 47%)", dark: "hsl(8, 60%, 40%)" },
330
363
  "--t-fill-color-button-delete-solid-hover": { light: "hsl(8, 60%, 45%)", dark: "hsl(8, 60%, 45%)" },
331
364
  "--t-fill-color-button-delete-solid-active": { light: "hsl(8, 60%, 40%)", dark: "hsl(8, 60%, 47%)" },
332
365
  "--t-fill-color-button-delete-solid-disabled": { light: "hsl(0, 0%, 95%)", dark: "hsl(0, 0%, 12%)" },
333
- "--t-fill-color-button-delete-outline-dim-default": { light: "hsla(0, 0%, 100%, 0)", dark: "hsl(8, 20%, 16%)" },
334
- "--t-fill-color-button-delete-outline-dim-hover": { light: "hsl(7, 60%, 97%)", dark: "hsl(9, 24%, 17%)" },
335
- "--t-fill-color-button-delete-outline-dim-active": { light: "hsl(9, 59%, 93%)", dark: "hsl(9, 29%, 19%)" },
336
- "--t-fill-color-button-delete-outline-dim-disabled": { light: "hsl(0, 0%, 98%)", dark: "hsl(0, 0%, 12%)" },
337
- "--t-fill-color-button-delete-ghost-default": { light: "hsla(0, 0%, 100%, 0)", dark: "hsla(0, 0%, 0%, 0)" },
366
+ "--t-fill-color-button-delete-outline": { light: "hsla(0, 0%, 100%, 0)", dark: "hsl(8, 20%, 16%)" },
367
+ "--t-fill-color-button-delete-outline-hover": { light: "hsl(7, 60%, 97%)", dark: "hsl(9, 24%, 17%)" },
368
+ "--t-fill-color-button-delete-outline-active": { light: "hsl(9, 59%, 93%)", dark: "hsl(9, 29%, 19%)" },
369
+ "--t-fill-color-button-delete-outline-disabled": { light: "hsl(0, 0%, 98%)", dark: "hsl(0, 0%, 12%)" },
370
+ "--t-fill-color-button-delete-ghost": { light: "hsla(0, 0%, 100%, 0)", dark: "hsla(0, 0%, 0%, 0)" },
338
371
  "--t-fill-color-button-delete-ghost-hover": { light: "hsl(7, 60%, 97%)", dark: "hsl(8, 20%, 16%)" },
339
372
  "--t-fill-color-button-delete-ghost-active": { light: "hsl(9, 59%, 93%)", dark: "hsl(9, 24%, 17%)" },
340
373
  "--t-fill-color-button-delete-ghost-disabled": { light: "hsla(0, 0%, 100%, 0)", dark: "hsla(0, 0%, 0%, 0)" },
341
- "--t-fill-color-button-pill-default": { light: "hsl(0, 0%, 93%)", dark: "hsl(0, 0%, 18%)" },
374
+ "--t-fill-color-button-delete-outline-dim-default": { light: "hsla(0, 0%, 100%, 0)", dark: "hsla(0, 0%, 100%, 0)" },
375
+ "--t-fill-color-button-delete-outline-dim-hover": { light: "hsl(7, 60%, 97%)", dark: "hsl(7, 60%, 97%)" },
376
+ "--t-fill-color-button-delete-outline-dim-active": { light: "hsl(9, 59%, 93%)", dark: "hsl(9, 59%, 93%)" },
377
+ "--t-fill-color-button-delete-outline-dim-disabled": { light: "hsl(0, 0%, 98%)", dark: "hsl(0, 0%, 98%)" },
378
+ "--t-fill-color-button-pill": { light: "hsl(0, 0%, 93%)", dark: "hsl(0, 0%, 18%)" },
342
379
  "--t-fill-color-button-pill-hover": { light: "hsl(0, 0%, 88%)", dark: "hsl(0, 0%, 21%)" },
343
380
  "--t-fill-color-button-pill-active": { light: "hsl(0, 0%, 88%)", dark: "hsl(0, 0%, 21%)" },
344
381
  "--t-fill-color-button-pill-disabled": { light: "hsl(0, 0%, 93%)", dark: "hsl(0, 0%, 18%)" },
@@ -371,13 +408,13 @@ const reactNativeTokens = {
371
408
  "--t-fill-color-transparency-dark-static-090": { light: "hsla(0, 0%, 0%, 0.9)", dark: "hsla(0, 0%, 0%, 0.9)" },
372
409
  "--t-surface-color-card": { light: "hsl(0, 0%, 100%)", dark: "hsl(0, 0%, 12%)" },
373
410
  "--t-surface-color-canvas": { light: "hsl(0, 0%, 100%)", dark: "hsl(0, 0%, 10%)" },
374
- "--t-border-color-default-base": { light: "hsl(0, 0%, 88%)", dark: "hsl(0, 0%, 21%)" },
375
- "--t-border-color-default-dark": { light: "hsl(0, 0%, 81%)", dark: "hsl(0, 0%, 25%)" },
376
- "--t-border-color-default-darker": { light: "hsl(0, 0%, 68%)", dark: "hsl(0, 0%, 33%)" },
377
- "--t-border-color-default-darkest": { light: "hsl(0, 0%, 58%)", dark: "hsl(0, 0%, 38%)" },
378
- "--t-border-color-default-disabled": { light: "hsl(0, 0%, 88%)", dark: "hsl(0, 0%, 21%)" },
379
- "--t-border-color-default-dim": { light: "hsl(0, 0%, 95%)", dark: "hsl(0, 0%, 16%)" },
380
- "--t-border-color-default-white": { light: "hsl(0, 0%, 100%)", dark: "hsl(0, 0%, 12%)" },
411
+ "--t-border-color": { light: "hsl(0, 0%, 88%)", dark: "hsl(0, 0%, 21%)" },
412
+ "--t-border-color-dark": { light: "hsl(0, 0%, 81%)", dark: "hsl(0, 0%, 25%)" },
413
+ "--t-border-color-darker": { light: "hsl(0, 0%, 68%)", dark: "hsl(0, 0%, 33%)" },
414
+ "--t-border-color-darkest": { light: "hsl(0, 0%, 58%)", dark: "hsl(0, 0%, 38%)" },
415
+ "--t-border-color-disabled": { light: "hsl(0, 0%, 88%)", dark: "hsl(0, 0%, 21%)" },
416
+ "--t-border-color-dim": { light: "hsl(0, 0%, 95%)", dark: "hsl(0, 0%, 16%)" },
417
+ "--t-border-color-white": { light: "hsl(0, 0%, 100%)", dark: "hsl(0, 0%, 12%)" },
381
418
  "--t-border-color-status-neutral": { light: "hsl(0, 0%, 58%)", dark: "hsl(0, 0%, 38%)" },
382
419
  "--t-border-color-status-info": { light: "hsl(204, 100%, 40%)", dark: "hsl(204, 100%, 35%)" },
383
420
  "--t-border-color-status-success": { light: "hsl(97, 57%, 40%)", dark: "hsl(97, 57%, 40%)" },