@ionic/core 8.8.20-dev.11790000033.12788d65 → 8.8.20-dev.11790063553.1c664fbb

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 (258) hide show
  1. package/components/ion-accordion-group.js +1 -1
  2. package/components/ion-accordion.js +1 -1
  3. package/components/ion-action-sheet.js +1 -1
  4. package/components/ion-alert.js +1 -1
  5. package/components/ion-avatar.js +1 -1
  6. package/components/ion-backdrop.js +1 -1
  7. package/components/ion-badge.js +1 -1
  8. package/components/ion-button.js +1 -1
  9. package/components/ion-buttons.js +1 -1
  10. package/components/ion-card-content.js +1 -1
  11. package/components/ion-card-subtitle.js +1 -1
  12. package/components/ion-card.js +1 -1
  13. package/components/ion-checkbox.js +1 -1
  14. package/components/ion-chip.js +1 -1
  15. package/components/ion-datetime.js +1 -1
  16. package/components/ion-divider.js +1 -1
  17. package/components/ion-header.js +1 -1
  18. package/components/ion-infinite-scroll-content.js +1 -1
  19. package/components/ion-input-otp.js +1 -1
  20. package/components/ion-input-password-toggle.js +1 -1
  21. package/components/ion-input.js +1 -1
  22. package/components/ion-item-option.js +1 -1
  23. package/components/ion-item-sliding.js +1 -1
  24. package/components/ion-item.js +1 -1
  25. package/components/ion-list-header.js +1 -1
  26. package/components/ion-loading.js +1 -1
  27. package/components/ion-menu.js +1 -1
  28. package/components/ion-modal.js +1 -1
  29. package/components/ion-picker-legacy.js +1 -1
  30. package/components/ion-popover.js +1 -1
  31. package/components/ion-progress-bar.js +1 -1
  32. package/components/ion-radio-group.js +1 -1
  33. package/components/ion-radio.js +1 -1
  34. package/components/ion-range.js +1 -1
  35. package/components/ion-refresher-content.js +1 -1
  36. package/components/ion-searchbar.js +1 -1
  37. package/components/ion-segment-button.js +1 -1
  38. package/components/ion-select-modal.js +1 -1
  39. package/components/ion-select-popover.js +1 -1
  40. package/components/ion-select.js +1 -1
  41. package/components/ion-spinner.js +1 -1
  42. package/components/ion-tab-bar.js +1 -1
  43. package/components/ion-tab-button.js +1 -1
  44. package/components/ion-textarea.js +1 -1
  45. package/components/ion-title.js +1 -1
  46. package/components/ion-toast.js +1 -1
  47. package/components/ion-toggle.js +1 -1
  48. package/components/ion-toolbar.js +1 -1
  49. package/components/p-1svnBvUl.js +4 -0
  50. package/components/p-B1Ckdhof.js +4 -0
  51. package/components/p-B5TpXnQx.js +4 -0
  52. package/components/p-BUXCqaSr.js +4 -0
  53. package/components/p-BvZgcjSv.js +4 -0
  54. package/components/p-C9LVKxmA.js +4 -0
  55. package/components/{p-CaXMr1SL.js → p-CHNTH0aX.js} +1 -1
  56. package/components/p-CHS_LN0q.js +4 -0
  57. package/components/p-CQ6qwFjM.js +4 -0
  58. package/components/p-CRSdVOdM.js +4 -0
  59. package/components/p-CXTSHWEJ.js +4 -0
  60. package/components/p-Cay-YWIl.js +4 -0
  61. package/components/{p-CaB0_AG0.js → p-DCFHJ88d.js} +1 -1
  62. package/components/p-DH-B6fol.js +4 -0
  63. package/components/p-DIvWgnWw.js +4 -0
  64. package/components/{p-CxhjkdQ_.js → p-DPBeQeU3.js} +1 -1
  65. package/components/p-DyWR_4Qt.js +4 -0
  66. package/components/{p-DYq-5riI.js → p-u7MhcNAg.js} +1 -1
  67. package/css/ionic/bundle.ionic.css +1 -1
  68. package/css/ionic/bundle.ionic.css.map +1 -1
  69. package/css/ionic/core.ionic.css +1 -1
  70. package/css/ionic/core.ionic.css.map +1 -1
  71. package/css/ionic/global.bundle.ionic.css +1 -1
  72. package/css/ionic/global.bundle.ionic.css.map +1 -1
  73. package/css/ionic/ionic-swiper.ionic.css +1 -1
  74. package/css/ionic/ionic-swiper.ionic.css.map +1 -1
  75. package/css/ionic/link.ionic.css +1 -1
  76. package/css/ionic/link.ionic.css.map +1 -1
  77. package/css/ionic/typography.ionic.css +1 -1
  78. package/css/ionic/typography.ionic.css.map +1 -1
  79. package/dist/cjs/ion-accordion_2.cjs.entry.js +2 -2
  80. package/dist/cjs/ion-action-sheet.cjs.entry.js +1 -1
  81. package/dist/cjs/ion-alert.cjs.entry.js +1 -1
  82. package/dist/cjs/ion-app_8.cjs.entry.js +4 -4
  83. package/dist/cjs/ion-avatar_3.cjs.entry.js +2 -2
  84. package/dist/cjs/ion-backdrop.cjs.entry.js +1 -1
  85. package/dist/cjs/ion-button_2.cjs.entry.js +1 -1
  86. package/dist/cjs/ion-card_5.cjs.entry.js +3 -3
  87. package/dist/cjs/ion-checkbox.cjs.entry.js +1 -1
  88. package/dist/cjs/ion-chip.cjs.entry.js +1 -1
  89. package/dist/cjs/ion-datetime_3.cjs.entry.js +1 -1
  90. package/dist/cjs/ion-divider.cjs.entry.js +1 -1
  91. package/dist/cjs/ion-input-otp.cjs.entry.js +1 -1
  92. package/dist/cjs/ion-input-password-toggle.cjs.entry.js +1 -1
  93. package/dist/cjs/ion-input.cjs.entry.js +1 -1
  94. package/dist/cjs/ion-item-option_3.cjs.entry.js +2 -2
  95. package/dist/cjs/ion-item_8.cjs.entry.js +2 -2
  96. package/dist/cjs/ion-modal.cjs.entry.js +1 -1
  97. package/dist/cjs/ion-popover.cjs.entry.js +1 -1
  98. package/dist/cjs/ion-progress-bar.cjs.entry.js +1 -1
  99. package/dist/cjs/ion-radio_2.cjs.entry.js +2 -2
  100. package/dist/cjs/ion-range.cjs.entry.js +1 -1
  101. package/dist/cjs/ion-searchbar.cjs.entry.js +1 -1
  102. package/dist/cjs/ion-segment_2.cjs.entry.js +1 -1
  103. package/dist/cjs/ion-select-modal.cjs.entry.js +1 -1
  104. package/dist/cjs/ion-select_3.cjs.entry.js +2 -2
  105. package/dist/cjs/ion-spinner.cjs.entry.js +1 -1
  106. package/dist/cjs/ion-tab-bar_2.cjs.entry.js +2 -2
  107. package/dist/cjs/ion-textarea.cjs.entry.js +1 -1
  108. package/dist/cjs/ion-toast.cjs.entry.js +1 -1
  109. package/dist/cjs/ion-toggle.cjs.entry.js +1 -1
  110. package/dist/collection/components/accordion/accordion.ionic.css +10 -12
  111. package/dist/collection/components/accordion-group/accordion-group.ionic.css +6 -6
  112. package/dist/collection/components/action-sheet/action-sheet.ionic.css +22 -26
  113. package/dist/collection/components/alert/alert.ionic.css +39 -45
  114. package/dist/collection/components/avatar/avatar.ionic.css +29 -35
  115. package/dist/collection/components/backdrop/backdrop.ionic.css +1 -1
  116. package/dist/collection/components/badge/badge.ionic.css +15 -18
  117. package/dist/collection/components/button/button.ionic.css +22 -26
  118. package/dist/collection/components/buttons/buttons.ionic.css +1 -1
  119. package/dist/collection/components/card/card.ionic.css +7 -7
  120. package/dist/collection/components/card-content/card-content.ionic.css +3 -4
  121. package/dist/collection/components/card-subtitle/card-subtitle.ionic.css +4 -5
  122. package/dist/collection/components/checkbox/checkbox.ionic.css +16 -17
  123. package/dist/collection/components/chip/chip.ionic.css +12 -13
  124. package/dist/collection/components/datetime/datetime.ionic.css +43 -49
  125. package/dist/collection/components/divider/divider.ionic.css +1 -1
  126. package/dist/collection/components/header/header.ionic.css +3 -8
  127. package/dist/collection/components/input/input.ionic.css +40 -43
  128. package/dist/collection/components/input-otp/input-otp.ionic.css +29 -31
  129. package/dist/collection/components/input-password-toggle/input-password-toggle.ionic.css +1 -1
  130. package/dist/collection/components/item/item.ionic.css +9 -10
  131. package/dist/collection/components/item-option/item-option.ionic.css +5 -6
  132. package/dist/collection/components/item-sliding/item-sliding.ionic.css +1 -1
  133. package/dist/collection/components/list-header/list-header.ionic.css +4 -5
  134. package/dist/collection/components/modal/modal.ionic.css +3 -3
  135. package/dist/collection/components/popover/popover.ionic.css +1 -1
  136. package/dist/collection/components/progress-bar/progress-bar.ionic.css +3 -3
  137. package/dist/collection/components/radio/radio.ionic.css +9 -10
  138. package/dist/collection/components/radio-group/radio-group.ionic.css +5 -6
  139. package/dist/collection/components/range/range.ionic.css +11 -12
  140. package/dist/collection/components/searchbar/searchbar.ionic.css +17 -18
  141. package/dist/collection/components/segment-button/segment-button.ionic.css +8 -9
  142. package/dist/collection/components/select/select.ionic.css +26 -29
  143. package/dist/collection/components/select-modal/select-modal.ionic.css +13 -16
  144. package/dist/collection/components/select-popover/select-popover.ionic.css +11 -13
  145. package/dist/collection/components/spinner/spinner.ionic.css +2 -2
  146. package/dist/collection/components/tab-bar/tab-bar.ionic.css +6 -6
  147. package/dist/collection/components/tab-button/tab-button.ionic.css +4 -5
  148. package/dist/collection/components/textarea/textarea.ionic.css +40 -43
  149. package/dist/collection/components/title/title.ionic.css +6 -8
  150. package/dist/collection/components/toast/toast.ionic.css +16 -19
  151. package/dist/collection/components/toggle/toggle.ionic.css +14 -16
  152. package/dist/collection/components/toolbar/toolbar.ionic.css +1 -1
  153. package/dist/docs.json +1 -1
  154. package/dist/esm/ion-accordion_2.entry.js +2 -2
  155. package/dist/esm/ion-action-sheet.entry.js +1 -1
  156. package/dist/esm/ion-alert.entry.js +1 -1
  157. package/dist/esm/ion-app_8.entry.js +4 -4
  158. package/dist/esm/ion-avatar_3.entry.js +2 -2
  159. package/dist/esm/ion-backdrop.entry.js +1 -1
  160. package/dist/esm/ion-button_2.entry.js +1 -1
  161. package/dist/esm/ion-card_5.entry.js +3 -3
  162. package/dist/esm/ion-checkbox.entry.js +1 -1
  163. package/dist/esm/ion-chip.entry.js +1 -1
  164. package/dist/esm/ion-datetime_3.entry.js +1 -1
  165. package/dist/esm/ion-divider.entry.js +1 -1
  166. package/dist/esm/ion-input-otp.entry.js +1 -1
  167. package/dist/esm/ion-input-password-toggle.entry.js +1 -1
  168. package/dist/esm/ion-input.entry.js +1 -1
  169. package/dist/esm/ion-item-option_3.entry.js +2 -2
  170. package/dist/esm/ion-item_8.entry.js +2 -2
  171. package/dist/esm/ion-modal.entry.js +1 -1
  172. package/dist/esm/ion-popover.entry.js +1 -1
  173. package/dist/esm/ion-progress-bar.entry.js +1 -1
  174. package/dist/esm/ion-radio_2.entry.js +2 -2
  175. package/dist/esm/ion-range.entry.js +1 -1
  176. package/dist/esm/ion-searchbar.entry.js +1 -1
  177. package/dist/esm/ion-segment_2.entry.js +1 -1
  178. package/dist/esm/ion-select-modal.entry.js +1 -1
  179. package/dist/esm/ion-select_3.entry.js +2 -2
  180. package/dist/esm/ion-spinner.entry.js +1 -1
  181. package/dist/esm/ion-tab-bar_2.entry.js +2 -2
  182. package/dist/esm/ion-textarea.entry.js +1 -1
  183. package/dist/esm/ion-toast.entry.js +1 -1
  184. package/dist/esm/ion-toggle.entry.js +1 -1
  185. package/dist/ionic/ionic.esm.js +1 -1
  186. package/dist/ionic/p-00006e47.entry.js +4 -0
  187. package/dist/ionic/p-009518a4.entry.js +4 -0
  188. package/dist/ionic/p-031a1e4a.entry.js +4 -0
  189. package/dist/ionic/p-053dc7c5.entry.js +4 -0
  190. package/dist/ionic/p-130765f7.entry.js +4 -0
  191. package/dist/ionic/p-1753c08d.entry.js +4 -0
  192. package/dist/ionic/{p-1febf200.entry.js → p-24cbfd66.entry.js} +1 -1
  193. package/dist/ionic/p-367d5fd5.entry.js +4 -0
  194. package/dist/ionic/{p-86208a0e.entry.js → p-3c070023.entry.js} +1 -1
  195. package/dist/ionic/p-404817bb.entry.js +4 -0
  196. package/dist/ionic/p-59386a0f.entry.js +4 -0
  197. package/dist/ionic/p-5971c704.entry.js +4 -0
  198. package/dist/ionic/p-61e298db.entry.js +4 -0
  199. package/dist/ionic/p-62d386b6.entry.js +4 -0
  200. package/dist/ionic/p-74ad4b7e.entry.js +4 -0
  201. package/dist/ionic/p-7703fee4.entry.js +4 -0
  202. package/dist/ionic/p-788418c5.entry.js +4 -0
  203. package/dist/ionic/p-7c7ce81c.entry.js +4 -0
  204. package/dist/ionic/p-7dfefd17.entry.js +4 -0
  205. package/dist/ionic/{p-316eed75.entry.js → p-877be084.entry.js} +1 -1
  206. package/dist/ionic/p-8930910d.entry.js +4 -0
  207. package/dist/ionic/p-89ce42f3.entry.js +4 -0
  208. package/dist/ionic/{p-1ce65194.entry.js → p-9b8f5965.entry.js} +1 -1
  209. package/dist/ionic/p-a1e40bc9.entry.js +4 -0
  210. package/dist/ionic/{p-0166d6e5.entry.js → p-b002b938.entry.js} +1 -1
  211. package/dist/ionic/p-d1a8bb39.entry.js +4 -0
  212. package/dist/ionic/p-e13cf1d8.entry.js +4 -0
  213. package/dist/ionic/p-e386bba3.entry.js +4 -0
  214. package/dist/ionic/p-e69338d9.entry.js +4 -0
  215. package/dist/ionic/p-f0b1da81.entry.js +4 -0
  216. package/dist/ionic/{p-75c7595c.entry.js → p-ff055c7b.entry.js} +1 -1
  217. package/hydrate/index.js +43 -43
  218. package/hydrate/index.mjs +43 -43
  219. package/package.json +3 -3
  220. package/components/p-Ba2Mmm22.js +0 -4
  221. package/components/p-BnQAsi91.js +0 -4
  222. package/components/p-C1L59jNd.js +0 -4
  223. package/components/p-CA81qANP.js +0 -4
  224. package/components/p-CHB9zWT6.js +0 -4
  225. package/components/p-CWqLCAML.js +0 -4
  226. package/components/p-CxoHM559.js +0 -4
  227. package/components/p-D2tZEPGv.js +0 -4
  228. package/components/p-D6zl6ZA8.js +0 -4
  229. package/components/p-Df6WZ6z0.js +0 -4
  230. package/components/p-DkfVuzjA.js +0 -4
  231. package/components/p-Ds3yn-R0.js +0 -4
  232. package/components/p-VrmyB-Wu.js +0 -4
  233. package/components/p-vUGYs065.js +0 -4
  234. package/dist/ionic/p-0a0a66e2.entry.js +0 -4
  235. package/dist/ionic/p-0ac15b5f.entry.js +0 -4
  236. package/dist/ionic/p-0c636ad3.entry.js +0 -4
  237. package/dist/ionic/p-1a609156.entry.js +0 -4
  238. package/dist/ionic/p-2016c1c0.entry.js +0 -4
  239. package/dist/ionic/p-296226f1.entry.js +0 -4
  240. package/dist/ionic/p-2a54aec2.entry.js +0 -4
  241. package/dist/ionic/p-2bf60b77.entry.js +0 -4
  242. package/dist/ionic/p-2e1d650a.entry.js +0 -4
  243. package/dist/ionic/p-40a21a22.entry.js +0 -4
  244. package/dist/ionic/p-431bc3ce.entry.js +0 -4
  245. package/dist/ionic/p-51542c69.entry.js +0 -4
  246. package/dist/ionic/p-711ba315.entry.js +0 -4
  247. package/dist/ionic/p-7cbf17f0.entry.js +0 -4
  248. package/dist/ionic/p-7f59020c.entry.js +0 -4
  249. package/dist/ionic/p-8303462c.entry.js +0 -4
  250. package/dist/ionic/p-a37444b3.entry.js +0 -4
  251. package/dist/ionic/p-ac3af8af.entry.js +0 -4
  252. package/dist/ionic/p-b3da2cc7.entry.js +0 -4
  253. package/dist/ionic/p-b4533070.entry.js +0 -4
  254. package/dist/ionic/p-b4901bce.entry.js +0 -4
  255. package/dist/ionic/p-c4ebdfd2.entry.js +0 -4
  256. package/dist/ionic/p-de4e8418.entry.js +0 -4
  257. package/dist/ionic/p-e086f8c3.entry.js +0 -4
  258. package/dist/ionic/p-ff74cf5d.entry.js +0 -4
package/dist/collection/components/item-option/item-option.ionic.css CHANGED
@@ -158,12 +158,11 @@
158
158
  padding-right: 0;
159
159
  padding-top: 0;
160
160
  padding-bottom: 0;
161
+ font-family: var(--token-font-family, -apple-system, system-ui, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol");
161
162
  font-size: var(--token-font-size-350, 0.875rem);
162
163
  font-weight: var(--token-font-weight-medium, 500);
163
- letter-spacing: var(--token-font-letter-spacing-1, 1%);
164
- line-height: var(--token-font-line-height-500, var(--token-scale-500, 20px));
165
- text-decoration: none;
166
- text-transform: none;
164
+ letter-spacing: var(--token-font-letter-spacing-100, 0.01em);
165
+ line-height: var(--token-font-line-height-500, 1.25rem);
167
166
  }
168
167
 
169
168
  .button-native {
@@ -251,9 +250,9 @@
251
250
  }
252
251
 
253
252
  :host(.item-option-subtle) {
254
- --background: var(--ion-color-primary-subtle, var(--token-bg-primary-subtle-default, var(--token-semantics-primary-100, var(--token-primitives-blue-100, #e9ecfc))));
253
+ --background: var(--ion-color-primary-subtle, var(--token-bg-primary-subtle-default, var(--token-semantics-primary-100, var(--token-primitives-blue-100, #f0f2ff))));
255
254
  --background-activated: var(--ion-color-primary-subtle-shade, var(--token-bg-primary-subtle-press, var(--token-semantics-primary-300, var(--token-primitives-blue-300, #d0d7fa))));
256
- --color: var(--ion-color-primary-subtle-contrast, var(--token-text-primary, var(--token-semantics-primary-900, var(--token-primitives-blue-900, #0d4bc3))));
255
+ --color: var(--ion-color-primary-subtle-contrast, var(--token-semantics-primary-900, var(--token-primitives-blue-900, #0d4bc3)));
257
256
  }
258
257
 
259
258
  :host(.item-option-subtle.ion-color) {
package/dist/collection/components/item-sliding/item-sliding.ionic.css CHANGED
@@ -179,7 +179,7 @@ ion-item-sliding .item {
179
179
  * convert to a unit other than $baselineUnit.
180
180
  */
181
181
  .item-sliding-transition-open .item {
182
- transition: transform var(--token-transition-time-250, 250ms) var(--token-transition-curve-smooth, cubic-bezier(0.25, 1, 0.5, 1));
182
+ transition: transform var(--token-transition-time-200, 200ms) var(--token-transition-curve-smooth, cubic-bezier(0.25, 1, 0.5, 1));
183
183
  }
184
184
 
185
185
  .item-sliding-transition-snapback .item {
package/dist/collection/components/list-header/list-header.ionic.css CHANGED
@@ -149,13 +149,12 @@
149
149
 
150
150
  :host {
151
151
  --background: transparent;
152
- --color: var(--token-text-default, var(--token-primitives-neutral-1200, #242424));
152
+ --color: var(--token-text-default, var(--token-primitives-neutral-1200, #242528));
153
+ font-family: var(--token-font-family, -apple-system, system-ui, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol");
153
154
  font-size: var(--token-font-size-350, 0.875rem);
154
155
  font-weight: var(--token-font-weight-medium, 500);
155
- letter-spacing: var(--token-font-letter-spacing-0, 0%);
156
- line-height: var(--token-font-line-height-600, var(--token-scale-600, 24px));
157
- text-decoration: none;
158
- text-transform: none;
156
+ letter-spacing: var(--token-font-letter-spacing-0, 0);
157
+ line-height: var(--token-font-line-height-600, 1.5rem);
159
158
  min-height: calc(var(--token-scale-1400, 56px) + var(--token-scale-050, 2px));
160
159
  /**
161
160
  * The focus rings from components like buttons and links
package/dist/collection/components/modal/modal.ionic.css CHANGED
@@ -198,9 +198,9 @@ ion-backdrop {
198
198
 
199
199
  :host {
200
200
  --background: var(--token-bg-surface-default, var(--token-primitives-base-white, #ffffff));
201
- --box-shadow: var(--token-elevation-3, 0px 2px 7px 0px rgba(0, 0, 0, 0.05), 0px 6px 32px 0px rgba(0, 0, 0, 0.16));
201
+ --box-shadow: var(--token-elevation-3, var(--token-shadow-offset-0, 0px) var(--token-shadow-offset-6, 6px) var(--token-shadow-blur-32, 32px) var(--token-shadow-spread-0, 0px) var(--token-shadow-6, rgba(0, 0, 0, 0.1607843137)), var(--token-shadow-offset-0, 0px) var(--token-shadow-offset-2, 2px) var(--token-shadow-blur-7, 7px) var(--token-shadow-spread-0, 0px) var(--token-shadow-2, rgba(0, 0, 0, 0.0509803922)));
202
202
  --backdrop-opacity: 0.7;
203
- color: var(--token-text-default, var(--token-primitives-neutral-1200, #242424));
203
+ color: var(--token-text-default, var(--token-primitives-neutral-1200, #242528));
204
204
  }
205
205
 
206
206
  :host(.modal-round) {
@@ -228,7 +228,7 @@ ion-backdrop {
228
228
  border-radius: var(--token-border-radius-100, var(--token-scale-100, 4px));
229
229
  width: var(--token-scale-1100, 44px);
230
230
  height: var(--token-scale-100, 4px);
231
- background-color: var(--token-primitives-neutral-300, #e0e0e0);
231
+ background-color: var(--token-primitives-neutral-300, #e6eaee);
232
232
  }
233
233
  .modal-handle::before {
234
234
  -webkit-padding-start: var(--token-space-100, var(--token-scale-100, 4px));
package/dist/collection/components/popover/popover.ionic.css CHANGED
@@ -263,7 +263,7 @@
263
263
  :host {
264
264
  --width: 250px;
265
265
  --max-height: 90%;
266
- --box-shadow: var(--token-elevation-4, 0px 3px 12px 0px rgba(0, 0, 0, 0.12), 0px 15px 48px 0px rgba(0, 0, 0, 0.18));
266
+ --box-shadow: var(--token-elevation-4, var(--token-shadow-offset-0, 0px) var(--token-shadow-offset-15, 15px) var(--token-shadow-blur-48, 48px) var(--token-shadow-spread-0, 0px) var(--token-shadow-7, rgba(0, 0, 0, 0.1803921569)), var(--token-shadow-offset-0, 0px) var(--token-shadow-offset-3, 3px) var(--token-shadow-blur-12, 12px) var(--token-shadow-spread-0, 0px) var(--token-shadow-5, rgba(0, 0, 0, 0.1215686275)));
267
267
  --backdrop-opacity: 0.3;
268
268
  }
269
269
 
package/dist/collection/components/progress-bar/progress-bar.ionic.css CHANGED
@@ -264,17 +264,17 @@
264
264
  }
265
265
  }
266
266
  :host {
267
- --background: var(--token-bg-neutral-subtle-default, var(--token-primitives-neutral-200, #eae9e9));
267
+ --background: var(--token-bg-neutral-subtle-default, var(--token-primitives-neutral-100, #f6f7fa));
268
268
  --progress-background: var(--ion-color-primary, var(--token-bg-primary-base-default, var(--token-semantics-primary-base, var(--token-semantics-primary-700, var(--token-primitives-blue-700, #105cef)))));
269
269
  height: var(--token-scale-100, 4px);
270
270
  }
271
271
 
272
272
  :host(.progress-bar-shape-round) {
273
- border-radius: var(--token-round-xs, var(--token-border-radius-full, 999px));
273
+ border-radius: var(--token-shape-round-xs, 999px);
274
274
  }
275
275
 
276
276
  :host(.progress-bar-shape-rectangular) {
277
- border-radius: var(--token-rectangular-xs, var(--token-border-radius-0, var(--token-scale-0, 0px)));
277
+ border-radius: var(--token-shape-rectangular-xs, 0px);
278
278
  }
279
279
 
280
280
  :host(.ion-color) .progress,
package/dist/collection/components/radio/radio.ionic.css CHANGED
@@ -276,21 +276,20 @@ input {
276
276
  }
277
277
 
278
278
  :host {
279
- --color: var(--token-border-input-default, var(--token-primitives-neutral-600, #8c8c8c));
279
+ --color: var(--token-border-input-default, var(--token-primitives-neutral-400, #d0d7df));
280
280
  --color-checked: var(--token-bg-primary-base-default, var(--token-semantics-primary-base, var(--token-semantics-primary-700, var(--token-primitives-blue-700, #105cef))));
281
281
  --border-width: var(--token-border-size-025, var(--token-scale-025, 1px));
282
- --border-style: var(--token-border-style-solid, solid);
282
+ --border-style: solid;
283
283
  --border-radius: var(--token-border-radius-full, 999px);
284
- --focus-ring-color: var(--token-border-focus-default, var(--token-primitives-blue-400, #b5c0f7));
284
+ --focus-ring-color: var(--token-border-focus-default, var(--token-semantics-primary-400, var(--token-primitives-blue-400, #b5c0f7)));
285
285
  --focus-ring-width: var(--token-border-size-050, var(--token-scale-050, 2px));
286
+ font-family: var(--token-font-family, -apple-system, system-ui, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol");
286
287
  font-size: var(--token-font-size-350, 0.875rem);
287
288
  font-weight: var(--token-font-weight-regular, 400);
288
- letter-spacing: var(--token-font-letter-spacing-0, 0%);
289
- line-height: var(--token-font-line-height-600, var(--token-scale-600, 24px));
290
- text-decoration: none;
291
- text-transform: none;
289
+ letter-spacing: var(--token-font-letter-spacing-0, 0);
290
+ line-height: var(--token-font-line-height-600, 1.5rem);
292
291
  min-height: var(--token-scale-1200, 48px);
293
- color: var(--token-text-default, var(--token-primitives-neutral-1200, #242424));
292
+ color: var(--token-text-default, var(--token-primitives-neutral-1200, #242528));
294
293
  }
295
294
 
296
295
  :host(.ion-color.radio-checked) .radio-icon {
@@ -399,7 +398,7 @@ input {
399
398
 
400
399
  :host(.ion-focused) .radio-icon {
401
400
  outline-offset: var(--focus-ring-width);
402
- outline: var(--focus-ring-width) var(--token-border-style-solid, solid) var(--focus-ring-color);
401
+ outline: var(--focus-ring-width) solid var(--focus-ring-color);
403
402
  }
404
403
 
405
404
  :host(.ion-activated) .radio-icon::after {
@@ -408,7 +407,7 @@ input {
408
407
  top: 0;
409
408
  bottom: 0;
410
409
  position: absolute;
411
- background-color: var(--token-state-press, rgba(36, 36, 36, 0.08));
410
+ background-color: var(--token-state-press, rgba(0, 0, 0, 0.0705882353));
412
411
  content: "";
413
412
  border-radius: inherit;
414
413
  top: calc(var(--border-width) * -1);
package/dist/collection/components/radio-group/radio-group.ionic.css CHANGED
@@ -84,20 +84,19 @@
84
84
  }
85
85
 
86
86
  .radio-group-top {
87
+ font-family: var(--token-font-family, -apple-system, system-ui, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol");
87
88
  font-size: var(--token-font-size-300, 0.75rem);
88
89
  font-weight: var(--token-font-weight-medium, 500);
89
- letter-spacing: var(--token-font-letter-spacing-0, 0%);
90
- line-height: var(--token-font-line-height-500, var(--token-scale-500, 20px));
91
- text-decoration: none;
92
- text-transform: none;
90
+ letter-spacing: var(--token-font-letter-spacing-0, 0);
91
+ line-height: var(--token-font-line-height-500, 1.25rem);
93
92
  }
94
93
 
95
94
  .radio-group-top .error-text {
96
- color: var(--token-text-danger, var(--token-semantics-danger-900, var(--token-primitives-red-900, #991b1b)));
95
+ color: var(--token-text-danger, var(--token-semantics-danger-800, var(--token-primitives-red-800, #d2002b)));
97
96
  }
98
97
 
99
98
  .radio-group-top .helper-text {
100
- color: var(--token-text-subtlest, var(--token-primitives-neutral-800, #626262));
99
+ color: var(--token-text-subtlest, var(--token-primitives-neutral-800, #6c727a));
101
100
  }
102
101
 
103
102
  :host(.in-list) .radio-group-top {
package/dist/collection/components/range/range.ionic.css CHANGED
@@ -351,16 +351,15 @@
351
351
  --knob-size: var(--token-scale-600, 24px);
352
352
  --knob-handle-size: var(--token-scale-1100, 44px);
353
353
  --bar-height: var(--token-scale-200, 8px);
354
- --bar-background: var(--token-bg-neutral-subtle-default, var(--token-primitives-neutral-200, #eae9e9));
354
+ --bar-background: var(--token-bg-neutral-subtle-default, var(--token-primitives-neutral-100, #f6f7fa));
355
355
  --bar-background-active: var(--ion-color-primary, var(--token-bg-primary-base-default, var(--token-semantics-primary-base, var(--token-semantics-primary-700, var(--token-primitives-blue-700, #105cef)))));
356
356
  --bar-border-radius: var(--token-border-radius-400, var(--token-scale-400, 16px));
357
357
  --height: var(--token-scale-1100, 44px);
358
+ font-family: var(--token-font-family, -apple-system, system-ui, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol");
358
359
  font-size: var(--token-font-size-350, 0.875rem);
359
360
  font-weight: var(--token-font-weight-regular, 400);
360
- letter-spacing: var(--token-font-letter-spacing-0, 0%);
361
- line-height: var(--token-font-line-height-600, var(--token-scale-600, 24px));
362
- text-decoration: none;
363
- text-transform: none;
361
+ letter-spacing: var(--token-font-letter-spacing-0, 0);
362
+ line-height: var(--token-font-line-height-600, 1.5rem);
364
363
  z-index: var(--token-z-index-100, 100);
365
364
  }
366
365
 
@@ -468,24 +467,24 @@
468
467
  min-width: var(--token-scale-700, 28px);
469
468
  transform: translate3d(0, -100%, 0);
470
469
  background: transparent;
471
- color: var(--token-text-default, var(--token-primitives-neutral-1200, #242424));
470
+ color: var(--token-text-default, var(--token-primitives-neutral-1200, #242528));
472
471
  font-size: var(--token-font-size-300, 0.75rem);
473
472
  text-align: center;
474
473
  }
475
474
 
476
475
  .range-knob {
477
476
  border-width: var(--token-border-size-025, var(--token-scale-025, 1px));
478
- border-style: var(--token-border-style-solid, solid);
477
+ border-style: solid;
479
478
  border-color: var(--token-border-primary, var(--token-semantics-primary-base, var(--token-semantics-primary-700, var(--token-primitives-blue-700, #105cef))));
480
479
  box-sizing: border-box;
481
480
  }
482
481
 
483
482
  :host(.range-disabled) {
484
- --bar-background: var(--token-bg-neutral-subtle-default, var(--token-primitives-neutral-200, #eae9e9));
483
+ --bar-background: var(--token-bg-neutral-subtle-default, var(--token-primitives-neutral-100, #f6f7fa));
485
484
  }
486
485
  :host(.range-disabled) .range-knob {
487
- border-color: var(--token-border-input-default, var(--token-primitives-neutral-600, #8c8c8c));
488
- background: var(--token-bg-input-disabled, var(--token-primitives-neutral-100, #f3f3f3));
486
+ border-color: var(--token-border-input-default, var(--token-primitives-neutral-400, #d0d7df));
487
+ background: var(--token-bg-input-disabled, var(--token-primitives-neutral-100, #f6f7fa));
489
488
  }
490
489
 
491
490
  :host(.range-label-placement-start) .label-text-wrapper {
@@ -558,10 +557,10 @@
558
557
 
559
558
  .range-knob-handle.ion-focused .range-knob {
560
559
  outline-offset: var(--token-border-size-050, var(--token-scale-050, 2px));
561
- outline: var(--token-border-size-050, var(--token-scale-050, 2px)) var(--token-border-style-solid, solid) var(--token-border-focus-default, var(--token-primitives-blue-400, #b5c0f7));
560
+ outline: var(--token-border-size-050, var(--token-scale-050, 2px)) solid var(--token-border-focus-default, var(--token-semantics-primary-400, var(--token-primitives-blue-400, #b5c0f7)));
562
561
  }
563
562
 
564
563
  .range-knob-handle.ion-activated .range-knob,
565
564
  .range-knob-handle.range-knob-pressed .range-knob {
566
- background: var(--token-bg-input-press, var(--token-primitives-neutral-200, #eae9e9));
565
+ background: var(--token-bg-input-press, var(--token-primitives-neutral-200, #ebeef2));
567
566
  }
package/dist/collection/components/searchbar/searchbar.ionic.css CHANGED
@@ -215,22 +215,21 @@
215
215
  * @prop --focus-ring-color: The color of the ring around the focused element.
216
216
  * @prop --focus-ring-width: The width of the ring around the focused element.
217
217
  */
218
- --background: var(--token-bg-neutral-subtle-default, var(--token-primitives-neutral-200, #eae9e9));
218
+ --background: var(--token-bg-neutral-subtle-default, var(--token-primitives-neutral-100, #f6f7fa));
219
219
  --border-radius: var(--token-border-radius-400, var(--token-scale-400, 16px));
220
220
  --box-shadow: none;
221
- --cancel-button-color: var(--token-primitives-neutral-800, #626262);
222
- --clear-button-color: var(--token-primitives-neutral-1000, #3b3b3b);
223
- --color: var(--token-text-default, var(--token-primitives-neutral-1200, #242424));
224
- --icon-color: var(--token-icon-subtlest, var(--token-primitives-neutral-800, #626262));
225
- --placeholder-color: var(--token-text-subtlest, var(--token-primitives-neutral-800, #626262));
226
- --focus-ring-color: var(--token-border-focus-default, var(--token-primitives-blue-400, #b5c0f7));
221
+ --cancel-button-color: var(--token-primitives-neutral-800, #6c727a);
222
+ --clear-button-color: var(--token-primitives-neutral-1000, #383e45);
223
+ --color: var(--token-text-default, var(--token-primitives-neutral-1200, #242528));
224
+ --icon-color: var(--token-icon-subtlest, var(--token-primitives-neutral-800, #6c727a));
225
+ --placeholder-color: var(--token-text-subtlest, var(--token-primitives-neutral-800, #6c727a));
226
+ --focus-ring-color: var(--token-border-focus-default, var(--token-semantics-primary-400, var(--token-primitives-blue-400, #b5c0f7)));
227
227
  --focus-ring-width: var(--token-border-size-050, var(--token-scale-050, 2px));
228
+ font-family: var(--token-font-family, -apple-system, system-ui, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol");
228
229
  font-size: var(--token-font-size-350, 0.875rem);
229
230
  font-weight: var(--token-font-weight-regular, 400);
230
- letter-spacing: var(--token-font-letter-spacing-0, 0%);
231
- line-height: var(--token-font-line-height-600, var(--token-scale-600, 24px));
232
- text-decoration: none;
233
- text-transform: none;
231
+ letter-spacing: var(--token-font-letter-spacing-0, 0);
232
+ line-height: var(--token-font-line-height-600, 1.5rem);
234
233
  padding-left: 0;
235
234
  padding-right: 0;
236
235
  padding-top: 0;
@@ -274,12 +273,12 @@
274
273
  .searchbar-clear-button:focus-visible,
275
274
  .searchbar-cancel-button:focus-visible ion-icon {
276
275
  border-radius: var(--token-border-radius-100, var(--token-scale-100, 4px));
277
- outline: var(--token-border-size-050, var(--token-scale-050, 2px)) var(--token-border-style-solid, solid) var(--token-border-focus-default, var(--token-primitives-blue-400, #b5c0f7));
276
+ outline: var(--token-border-size-050, var(--token-scale-050, 2px)) solid var(--token-border-focus-default, var(--token-semantics-primary-400, var(--token-primitives-blue-400, #b5c0f7)));
278
277
  opacity: 1;
279
278
  }
280
279
 
281
280
  :host(.searchbar-has-value) {
282
- --icon-color: var(--token-icon-default, var(--token-primitives-neutral-1200, #242424));
281
+ --icon-color: var(--token-icon-default, var(--token-primitives-neutral-1200, #242528));
283
282
  }
284
283
 
285
284
  :host(.in-toolbar.searchbar-should-show-cancel) .searchbar-cancel-button {
@@ -297,12 +296,12 @@
297
296
 
298
297
  /* Hover */
299
298
  :host(:hover) {
300
- --background: var(--token-primitives-neutral-200, #eae9e9);
299
+ --background: var(--token-primitives-neutral-200, #ebeef2);
301
300
  }
302
301
 
303
302
  /* Focus */
304
303
  :host(.searchbar-has-focus) .searchbar-input {
305
- outline: var(--focus-ring-width) var(--token-border-style-solid, solid) var(--focus-ring-color);
304
+ outline: var(--focus-ring-width) solid var(--focus-ring-color);
306
305
  }
307
306
 
308
307
  :host(.searchbar-has-focus) .searchbar-search-icon,
@@ -318,9 +317,9 @@
318
317
 
319
318
  /* Disabled */
320
319
  :host(.searchbar-disabled) {
321
- --color: var(--token-primitives-neutral-500, #a2a2a2);
322
- --icon-color: var(--token-icon-disabled, var(--token-primitives-neutral-500, #a2a2a2));
323
- --placeholder-color: var(--token-text-disabled, var(--token-primitives-neutral-500, #a2a2a2));
320
+ --color: var(--token-primitives-neutral-500, #9fa5ad);
321
+ --icon-color: var(--token-icon-disabled, var(--token-primitives-neutral-500, #9fa5ad));
322
+ --placeholder-color: var(--token-text-disabled, var(--token-primitives-neutral-500, #9fa5ad));
324
323
  cursor: default;
325
324
  pointer-events: none;
326
325
  }
package/dist/collection/components/segment-button/segment-button.ionic.css CHANGED
@@ -266,12 +266,12 @@
266
266
  */
267
267
  --background: none;
268
268
  --background-checked: var(--background);
269
- --color: var(--token-primitives-neutral-1200, #242424);
269
+ --color: var(--token-primitives-neutral-1200, #242528);
270
270
  --color-checked: var(--token-semantics-primary-base, var(--token-semantics-primary-700, var(--token-primitives-blue-700, #105cef)));
271
- --color-disabled: var(--token-primitives-neutral-500, #a2a2a2);
271
+ --color-disabled: var(--token-primitives-neutral-500, #9fa5ad);
272
272
  --border-width: var(--token-border-size-025, var(--token-scale-025, 1px));
273
- --border-color: var(--token-primitives-neutral-300, #e0e0e0);
274
- --border-style: var(--token-border-style-solid, solid);
273
+ --border-color: var(--token-primitives-neutral-300, #e6eaee);
274
+ --border-style: solid;
275
275
  --indicator-box-shadow: none;
276
276
  --indicator-color: var(--color-checked);
277
277
  --indicator-height: var(--token-border-size-025, var(--token-scale-025, 1px));
@@ -302,12 +302,11 @@
302
302
  }
303
303
 
304
304
  ::slotted(ion-label) {
305
+ font-family: var(--token-font-family, -apple-system, system-ui, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol");
305
306
  font-size: var(--token-font-size-350, 0.875rem);
306
307
  font-weight: var(--token-font-weight-medium, 500);
307
- letter-spacing: var(--token-font-letter-spacing-1, 1%);
308
- line-height: var(--token-font-line-height-500, var(--token-scale-500, 20px));
309
- text-decoration: none;
310
- text-transform: none;
308
+ letter-spacing: var(--token-font-letter-spacing-100, 0.01em);
309
+ line-height: var(--token-font-line-height-500, 1.25rem);
311
310
  }
312
311
 
313
312
  ::slotted(ion-icon) {
@@ -324,7 +323,7 @@
324
323
 
325
324
  :host(.ion-focused) .button-inner {
326
325
  outline-offset: var(--token-border-size-050, var(--token-scale-050, 2px));
327
- outline: var(--token-border-size-050, var(--token-scale-050, 2px)) var(--token-border-style-solid, solid) var(--token-border-focus-default, var(--token-primitives-blue-400, #b5c0f7));
326
+ outline: var(--token-border-size-050, var(--token-scale-050, 2px)) solid var(--token-border-focus-default, var(--token-semantics-primary-400, var(--token-primitives-blue-400, #b5c0f7)));
328
327
  }
329
328
 
330
329
  .segment-button-indicator {
package/dist/collection/components/select/select.ionic.css CHANGED
@@ -558,55 +558,53 @@ button {
558
558
 
559
559
  :host {
560
560
  --background: var(--token-bg-surface-default, var(--token-primitives-base-white, #ffffff));
561
- --border-color: var(--token-primitives-neutral-500, #a2a2a2);
561
+ --border-color: var(--token-primitives-neutral-500, #9fa5ad);
562
562
  --border-width: var(--token-border-size-025, var(--token-scale-025, 1px));
563
563
  --padding-start: var(--token-space-400, var(--token-scale-400, 16px));
564
564
  --padding-end: var(--token-space-400, var(--token-scale-400, 16px));
565
565
  --padding-top: var(--token-space-300, var(--token-scale-300, 12px));
566
566
  --padding-bottom: var(--token-space-300, var(--token-scale-300, 12px));
567
- --placeholder-color: var(--token-primitives-neutral-800, #626262);
567
+ --placeholder-color: var(--token-primitives-neutral-800, #6c727a);
568
568
  --placeholder-opacity: 1;
569
- --highlight-color-focused: var(--token-border-focus-default, var(--token-primitives-blue-400, #b5c0f7));
570
- --highlight-color-valid: var(--token-semantics-success-900, var(--token-primitives-green-900, #126f23));
571
- --highlight-color-invalid: var(--token-semantics-danger-800, var(--token-primitives-red-800, #bf2222));
569
+ --highlight-color-focused: var(--token-border-focus-default, var(--token-semantics-primary-400, var(--token-primitives-blue-400, #b5c0f7)));
570
+ --highlight-color-valid: var(--token-semantics-success-900, var(--token-primitives-green-900, #037046));
571
+ --highlight-color-invalid: var(--token-semantics-danger-800, var(--token-primitives-red-800, #d2002b));
572
572
  --select-text-gap: var(--token-space-300, var(--token-scale-300, 12px));
573
573
  min-height: var(--token-scale-1100, 44px);
574
574
  }
575
575
 
576
576
  .select-bottom {
577
577
  padding-top: var(--token-space-100, var(--token-scale-100, 4px));
578
+ font-family: var(--token-font-family, -apple-system, system-ui, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol");
578
579
  font-size: var(--token-font-size-300, 0.75rem);
579
580
  font-weight: var(--token-font-weight-medium, 500);
580
- letter-spacing: var(--token-font-letter-spacing-0, 0%);
581
- line-height: var(--token-font-line-height-500, var(--token-scale-500, 20px));
582
- text-decoration: none;
583
- text-transform: none;
581
+ letter-spacing: var(--token-font-letter-spacing-0, 0);
582
+ line-height: var(--token-font-line-height-500, 1.25rem);
584
583
  }
585
584
 
586
585
  .select-bottom .helper-text {
587
- color: var(--token-primitives-neutral-800, #626262);
586
+ color: var(--token-primitives-neutral-800, #6c727a);
588
587
  }
589
588
 
590
589
  .select-bottom .error-text {
591
- color: var(--token-text-danger, var(--token-semantics-danger-900, var(--token-primitives-red-900, #991b1b)));
590
+ color: var(--token-text-danger, var(--token-semantics-danger-800, var(--token-primitives-red-800, #d2002b)));
592
591
  }
593
592
 
594
593
  .select-text {
595
594
  min-width: var(--token-space-400, var(--token-scale-400, 16px));
596
- color: var(--token-text-subtlest, var(--token-primitives-neutral-800, #626262));
595
+ color: var(--token-text-subtlest, var(--token-primitives-neutral-800, #6c727a));
597
596
  }
598
597
 
599
598
  :host(.has-value) .select-text {
600
- color: var(--token-text-default, var(--token-primitives-neutral-1200, #242424));
599
+ color: var(--token-text-default, var(--token-primitives-neutral-1200, #242528));
601
600
  }
602
601
 
603
602
  .label-text-wrapper {
603
+ font-family: var(--token-font-family, -apple-system, system-ui, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol");
604
604
  font-size: var(--token-font-size-300, 0.75rem);
605
605
  font-weight: var(--token-font-weight-medium, 500);
606
- letter-spacing: var(--token-font-letter-spacing-0, 0%);
607
- line-height: var(--token-font-line-height-500, var(--token-scale-500, 20px));
608
- text-decoration: none;
609
- text-transform: none;
606
+ letter-spacing: var(--token-font-letter-spacing-0, 0);
607
+ line-height: var(--token-font-line-height-500, 1.25rem);
610
608
  /**
611
609
  * Label text should not extend
612
610
  * beyond the bounds of the select.
@@ -617,7 +615,7 @@ button {
617
615
  */
618
616
  max-width: var(--token-scale-5000, 200px);
619
617
  transition: color var(--token-transition-time-150, 150ms) var(--token-transition-curve-expressive, cubic-bezier(0.4, 0, 0.2, 1)), transform var(--token-transition-time-150, 150ms) var(--token-transition-curve-expressive, cubic-bezier(0.4, 0, 0.2, 1));
620
- color: var(--token-primitives-neutral-1000, #3b3b3b);
618
+ color: var(--token-primitives-neutral-1000, #383e45);
621
619
  }
622
620
 
623
621
  :host(.select-label-placement-start) .label-text-wrapper,
@@ -703,19 +701,18 @@ button {
703
701
  }
704
702
 
705
703
  .native-wrapper {
704
+ font-family: var(--token-font-family, -apple-system, system-ui, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol");
706
705
  font-size: var(--token-font-size-350, 0.875rem);
707
706
  font-weight: var(--token-font-weight-regular, 400);
708
- letter-spacing: var(--token-font-letter-spacing-0, 0%);
709
- line-height: var(--token-font-line-height-600, var(--token-scale-600, 24px));
710
- text-decoration: none;
711
- text-transform: none;
707
+ letter-spacing: var(--token-font-letter-spacing-0, 0);
708
+ line-height: var(--token-font-line-height-600, 1.5rem);
712
709
  /**
713
710
  * When the floating label appears on top of the
714
711
  * input, we need to fade the input out so that the
715
712
  * label does not overlap with the placeholder.
716
713
  */
717
714
  transition: opacity var(--token-transition-time-150, 150ms) var(--token-transition-curve-expressive, cubic-bezier(0.4, 0, 0.2, 1));
718
- color: var(--token-text-default, var(--token-primitives-neutral-1200, #242424));
715
+ color: var(--token-text-default, var(--token-primitives-neutral-1200, #242528));
719
716
  }
720
717
 
721
718
  :host(.select-label-placement-stacked) .native-wrapper,
@@ -753,11 +750,11 @@ button {
753
750
 
754
751
  .select-icon {
755
752
  transition: transform 0.15s var(--token-transition-curve-expressive, cubic-bezier(0.4, 0, 0.2, 1));
756
- color: var(--token-text-subtlest, var(--token-primitives-neutral-800, #626262));
753
+ color: var(--token-text-subtlest, var(--token-primitives-neutral-800, #6c727a));
757
754
  }
758
755
 
759
756
  :host(.has-value) .select-icon {
760
- color: var(--token-text-subtle, var(--token-primitives-neutral-1000, #3b3b3b));
757
+ color: var(--token-text-subtle, var(--token-primitives-neutral-1000, #383e45));
761
758
  }
762
759
 
763
760
  /**
@@ -770,18 +767,18 @@ button {
770
767
  }
771
768
 
772
769
  :host(.select-fill-solid) {
773
- --background: var(--token-bg-input-bold-default, var(--token-primitives-neutral-200, #eae9e9));
770
+ --background: var(--token-bg-input-bold-default, var(--token-primitives-neutral-200, #ebeef2));
774
771
  }
775
772
 
776
773
  :host(.select-disabled) {
777
- --background: var(--token-primitives-neutral-100, #f3f3f3);
778
- --border-color: var(--token-primitives-neutral-300, #e0e0e0);
774
+ --background: var(--token-primitives-neutral-100, #f6f7fa);
775
+ --border-color: var(--token-primitives-neutral-300, #e6eaee);
779
776
  }
780
777
 
781
778
  :host(.select-disabled) .label-text-wrapper,
782
779
  :host(.select-disabled) .select-text,
783
780
  :host(.select-disabled) .select-icon {
784
- color: var(--token-primitives-neutral-500, #a2a2a2);
781
+ color: var(--token-primitives-neutral-500, #9fa5ad);
785
782
  }
786
783
 
787
784
  :host(.select-shape-soft) {
package/dist/collection/components/select-modal/select-modal.ionic.css CHANGED
@@ -74,19 +74,18 @@
74
74
  }
75
75
 
76
76
  .select-option-description {
77
+ font-family: var(--token-font-family, -apple-system, system-ui, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol");
77
78
  font-size: var(--token-font-size-350, 0.875rem);
78
79
  font-weight: var(--token-font-weight-regular, 400);
79
- letter-spacing: var(--token-font-letter-spacing-0, 0%);
80
- line-height: var(--token-font-line-height-600, var(--token-scale-600, 24px));
81
- text-decoration: none;
82
- text-transform: none;
80
+ letter-spacing: var(--token-font-letter-spacing-0, 0);
81
+ line-height: var(--token-font-line-height-600, 1.5rem);
83
82
  -webkit-padding-start: var(--token-space-0, var(--token-scale-0, 0px));
84
83
  padding-inline-start: var(--token-space-0, var(--token-scale-0, 0px));
85
84
  -webkit-padding-end: var(--token-space-0, var(--token-scale-0, 0px));
86
85
  padding-inline-end: var(--token-space-0, var(--token-scale-0, 0px));
87
86
  padding-top: var(--token-space-0, var(--token-scale-0, 0px));
88
87
  padding-bottom: var(--token-space-0, var(--token-scale-0, 0px));
89
- color: var(--token-text-subtle, var(--token-primitives-neutral-1000, #3b3b3b));
88
+ color: var(--token-text-subtle, var(--token-primitives-neutral-1000, #383e45));
90
89
  font-size: var(--token-font-size-350, 0.875rem);
91
90
  }
92
91
 
@@ -197,20 +196,19 @@ ion-item {
197
196
  --border-width: var(--token-border-size-0, var(--token-scale-0, 0px));
198
197
  --background-focused: transparent;
199
198
  --background-focused-opacity: 1;
200
- --background-hover: var(--token-bg-neutral-subtlest-press, var(--token-primitives-neutral-200, #eae9e9));
199
+ --background-hover: var(--token-bg-neutral-subtlest-press, var(--token-primitives-neutral-200, #ebeef2));
201
200
  --background-hover-opacity: 1;
202
- --background-activated: var(--token-bg-neutral-subtlest-press, var(--token-primitives-neutral-200, #eae9e9));
201
+ --background-activated: var(--token-bg-neutral-subtlest-press, var(--token-primitives-neutral-200, #ebeef2));
203
202
  --background-activated-opacity: 1;
204
203
  --border-radius: var(--token-border-radius-400, var(--token-scale-400, 16px));
205
204
  }
206
205
 
207
206
  ion-toolbar {
207
+ font-family: var(--token-font-family, -apple-system, system-ui, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol");
208
208
  font-size: var(--token-font-size-450, 1.125rem);
209
209
  font-weight: var(--token-font-weight-medium, 500);
210
- letter-spacing: var(--token-font-letter-spacing-0, 0%);
211
- line-height: var(--token-font-line-height-700, var(--token-scale-700, 28px));
212
- text-decoration: none;
213
- text-transform: none;
210
+ letter-spacing: var(--token-font-letter-spacing-0, 0);
211
+ line-height: var(--token-font-line-height-700, 1.75rem);
214
212
  }
215
213
 
216
214
  ion-list ion-radio::part(container) {
@@ -228,17 +226,16 @@ ion-list ion-radio::part(label) {
228
226
 
229
227
  ion-list ion-radio::part(label),
230
228
  ion-list ion-checkbox::part(label) {
229
+ font-family: var(--token-font-family, -apple-system, system-ui, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol");
231
230
  font-size: var(--token-font-size-400, 1rem);
232
231
  font-weight: var(--token-font-weight-medium, 500);
233
- letter-spacing: var(--token-font-letter-spacing-0, 0%);
234
- line-height: var(--token-font-line-height-600, var(--token-scale-600, 24px));
235
- text-decoration: none;
236
- text-transform: none;
232
+ letter-spacing: var(--token-font-letter-spacing-0, 0);
233
+ line-height: var(--token-font-line-height-600, 1.5rem);
237
234
  }
238
235
 
239
236
  .item-radio-checked,
240
237
  .item-checkbox-checked {
241
- --background: var(--token-bg-primary-subtle-default, var(--token-semantics-primary-100, var(--token-primitives-blue-100, #e9ecfc)));
238
+ --background: var(--token-bg-primary-subtle-default, var(--token-semantics-primary-100, var(--token-primitives-blue-100, #f0f2ff)));
242
239
  }
243
240
 
244
241
  ion-content {
package/dist/collection/components/select-popover/select-popover.ionic.css CHANGED
@@ -74,19 +74,18 @@
74
74
  }
75
75
 
76
76
  .select-option-description {
77
+ font-family: var(--token-font-family, -apple-system, system-ui, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol");
77
78
  font-size: var(--token-font-size-350, 0.875rem);
78
79
  font-weight: var(--token-font-weight-regular, 400);
79
- letter-spacing: var(--token-font-letter-spacing-0, 0%);
80
- line-height: var(--token-font-line-height-600, var(--token-scale-600, 24px));
81
- text-decoration: none;
82
- text-transform: none;
80
+ letter-spacing: var(--token-font-letter-spacing-0, 0);
81
+ line-height: var(--token-font-line-height-600, 1.5rem);
83
82
  -webkit-padding-start: var(--token-space-0, var(--token-scale-0, 0px));
84
83
  padding-inline-start: var(--token-space-0, var(--token-scale-0, 0px));
85
84
  -webkit-padding-end: var(--token-space-0, var(--token-scale-0, 0px));
86
85
  padding-inline-end: var(--token-space-0, var(--token-scale-0, 0px));
87
86
  padding-top: var(--token-space-0, var(--token-scale-0, 0px));
88
87
  padding-bottom: var(--token-space-0, var(--token-scale-0, 0px));
89
- color: var(--token-text-subtle, var(--token-primitives-neutral-1000, #3b3b3b));
88
+ color: var(--token-text-subtle, var(--token-primitives-neutral-1000, #383e45));
90
89
  font-size: var(--token-font-size-350, 0.875rem);
91
90
  }
92
91
 
@@ -214,15 +213,15 @@ ion-item {
214
213
  --border-width: var(--token-border-size-0, var(--token-scale-0, 0px));
215
214
  --background-focused: transparent;
216
215
  --background-focused-opacity: 1;
217
- --background-hover: var(--token-bg-neutral-subtlest-press, var(--token-primitives-neutral-200, #eae9e9));
216
+ --background-hover: var(--token-bg-neutral-subtlest-press, var(--token-primitives-neutral-200, #ebeef2));
218
217
  --background-hover-opacity: 1;
219
- --background-activated: var(--token-bg-neutral-subtlest-press, var(--token-primitives-neutral-200, #eae9e9));
218
+ --background-activated: var(--token-bg-neutral-subtlest-press, var(--token-primitives-neutral-200, #ebeef2));
220
219
  --background-activated-opacity: 1;
221
220
  }
222
221
 
223
222
  ion-item.ion-focused.item-checkbox-checked,
224
223
  ion-item.ion-focused.item-radio-checked {
225
- --background-focused: var(--token-bg-primary-subtle-default, var(--token-semantics-primary-100, var(--token-primitives-blue-100, #e9ecfc)));
224
+ --background-focused: var(--token-bg-primary-subtle-default, var(--token-semantics-primary-100, var(--token-primitives-blue-100, #f0f2ff)));
226
225
  --background-focused-opacity: 1;
227
226
  }
228
227
 
@@ -241,15 +240,14 @@ ion-list ion-radio::part(label) {
241
240
 
242
241
  ion-list ion-radio::part(label),
243
242
  ion-list ion-checkbox::part(label) {
243
+ font-family: var(--token-font-family, -apple-system, system-ui, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol");
244
244
  font-size: var(--token-font-size-400, 1rem);
245
245
  font-weight: var(--token-font-weight-medium, 500);
246
- letter-spacing: var(--token-font-letter-spacing-0, 0%);
247
- line-height: var(--token-font-line-height-600, var(--token-scale-600, 24px));
248
- text-decoration: none;
249
- text-transform: none;
246
+ letter-spacing: var(--token-font-letter-spacing-0, 0);
247
+ line-height: var(--token-font-line-height-600, 1.5rem);
250
248
  }
251
249
 
252
250
  .item-radio-checked,
253
251
  .item-checkbox-checked {
254
- --background: var(--token-bg-primary-subtle-default, var(--token-semantics-primary-100, var(--token-primitives-blue-100, #e9ecfc)));
252
+ --background: var(--token-bg-primary-subtle-default, var(--token-semantics-primary-100, var(--token-primitives-blue-100, #f0f2ff)));
255
253
  }