@sebgroup/green-core 3.25.2 → 3.26.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 (432) hide show
  1. package/components/checkbox/checkbox-group/checkbox-group.component.js +4 -2
  2. package/components/checkbox/checkbox.component.js +11 -0
  3. package/components/datepicker/date-part-spinner.d.ts +4 -0
  4. package/components/datepicker/date-part-spinner.js +6 -0
  5. package/components/datepicker/datepicker.component.d.ts +1 -0
  6. package/components/datepicker/datepicker.component.js +92 -57
  7. package/components/datepicker/datepicker.styles.js +4 -0
  8. package/components/dropdown/dropdown.component.js +13 -1
  9. package/components/dropdown/option.component.js +1 -0
  10. package/components/filter-chips/filter-chips.component.js +1 -0
  11. package/components/form/form-control.d.ts +5 -0
  12. package/components/form/form-control.js +7 -0
  13. package/components/input/input.component.js +7 -2
  14. package/components/radio/radio-group/radio-group.component.js +8 -2
  15. package/components/radio/radio.component.d.ts +9 -0
  16. package/components/radio/radio.component.js +9 -3
  17. package/components/select/select.component.js +40 -13
  18. package/components/select/select.styles.js +4 -0
  19. package/components/switch/switch.component.js +22 -4
  20. package/components/switch/switch.styles.js +34 -0
  21. package/components/table/table.component.js +2 -1
  22. package/components/textarea/textarea.component.js +6 -1
  23. package/custom-elements.json +21811 -21306
  24. package/gds-element.js +1 -1
  25. package/generated/mcp/button/api.md +1 -0
  26. package/generated/mcp/checkbox/api.md +1 -0
  27. package/generated/mcp/checkbox-group/api.md +1 -0
  28. package/generated/mcp/components.json +1 -1
  29. package/generated/mcp/datepicker/api.md +1 -0
  30. package/generated/mcp/dropdown/api.md +1 -0
  31. package/generated/mcp/fab/api.md +1 -0
  32. package/generated/mcp/filter-chips/api.md +1 -0
  33. package/generated/mcp/icons.json +1 -1
  34. package/generated/mcp/index.json +1 -1
  35. package/generated/mcp/input/api.md +1 -0
  36. package/generated/mcp/radio/api.md +1 -0
  37. package/generated/mcp/radio-group/api.md +1 -0
  38. package/generated/mcp/switch/api.md +1 -0
  39. package/generated/mcp/textarea/api.md +1 -0
  40. package/generated/mcp/tokens.json +1 -1
  41. package/generated/react/alert/index.d.ts +2 -2
  42. package/generated/react/avatar/index.d.ts +2 -2
  43. package/generated/react/avatar-group/index.d.ts +2 -2
  44. package/generated/react/backdrop/index.d.ts +2 -2
  45. package/generated/react/badge/index.d.ts +2 -2
  46. package/generated/react/blur/index.d.ts +2 -2
  47. package/generated/react/breadcrumb/index.d.ts +2 -2
  48. package/generated/react/breadcrumbs/index.d.ts +2 -2
  49. package/generated/react/button/index.d.ts +3 -2
  50. package/generated/react/calendar/index.d.ts +2 -2
  51. package/generated/react/card/index.d.ts +2 -2
  52. package/generated/react/card-linked/index.d.ts +2 -2
  53. package/generated/react/card-pattern-01/index.d.ts +2 -2
  54. package/generated/react/checkbox/index.d.ts +3 -2
  55. package/generated/react/checkbox-group/index.d.ts +3 -2
  56. package/generated/react/coachmark/index.d.ts +2 -2
  57. package/generated/react/context-menu/index.d.ts +2 -2
  58. package/generated/react/datepicker/index.d.ts +3 -2
  59. package/generated/react/details/index.d.ts +2 -2
  60. package/generated/react/dialog/index.d.ts +2 -2
  61. package/generated/react/div/index.d.ts +2 -2
  62. package/generated/react/divider/index.d.ts +2 -2
  63. package/generated/react/dropdown/index.d.ts +3 -2
  64. package/generated/react/fab/index.d.ts +3 -2
  65. package/generated/react/filter-chip/index.d.ts +2 -2
  66. package/generated/react/filter-chips/index.d.ts +3 -2
  67. package/generated/react/flex/index.d.ts +2 -2
  68. package/generated/react/form-summary/index.d.ts +2 -2
  69. package/generated/react/formatted-account/index.d.ts +2 -2
  70. package/generated/react/formatted-date/index.d.ts +2 -2
  71. package/generated/react/formatted-number/index.d.ts +2 -2
  72. package/generated/react/grid/index.d.ts +2 -2
  73. package/generated/react/grouped-list/index.d.ts +2 -2
  74. package/generated/react/icons/icon-ai/index.d.ts +2 -2
  75. package/generated/react/icons/icon-airplane-up/index.d.ts +2 -2
  76. package/generated/react/icons/icon-archive/index.d.ts +2 -2
  77. package/generated/react/icons/icon-arrow/index.d.ts +2 -2
  78. package/generated/react/icons/icon-arrow-bottom-top/index.d.ts +2 -2
  79. package/generated/react/icons/icon-arrow-box-left/index.d.ts +2 -2
  80. package/generated/react/icons/icon-arrow-box-left-alt/index.d.ts +2 -2
  81. package/generated/react/icons/icon-arrow-box-right/index.d.ts +2 -2
  82. package/generated/react/icons/icon-arrow-down/index.d.ts +2 -2
  83. package/generated/react/icons/icon-arrow-inbox/index.d.ts +2 -2
  84. package/generated/react/icons/icon-arrow-left/index.d.ts +2 -2
  85. package/generated/react/icons/icon-arrow-left-right/index.d.ts +2 -2
  86. package/generated/react/icons/icon-arrow-out-of-box/index.d.ts +2 -2
  87. package/generated/react/icons/icon-arrow-right/index.d.ts +2 -2
  88. package/generated/react/icons/icon-arrow-right-circle/index.d.ts +2 -2
  89. package/generated/react/icons/icon-arrow-right-down-circle/index.d.ts +2 -2
  90. package/generated/react/icons/icon-arrow-right-up-circle/index.d.ts +2 -2
  91. package/generated/react/icons/icon-arrow-rotate-clockwise/index.d.ts +2 -2
  92. package/generated/react/icons/icon-arrow-rotate-counter-clockwise/index.d.ts +2 -2
  93. package/generated/react/icons/icon-arrow-rotate-left-right/index.d.ts +2 -2
  94. package/generated/react/icons/icon-arrow-rotate-right-left/index.d.ts +2 -2
  95. package/generated/react/icons/icon-arrow-share-left/index.d.ts +2 -2
  96. package/generated/react/icons/icon-arrow-share-right/index.d.ts +2 -2
  97. package/generated/react/icons/icon-arrow-split/index.d.ts +2 -2
  98. package/generated/react/icons/icon-arrow-up/index.d.ts +2 -2
  99. package/generated/react/icons/icon-arrow-wall-down/index.d.ts +2 -2
  100. package/generated/react/icons/icon-arrow-wall-left/index.d.ts +2 -2
  101. package/generated/react/icons/icon-arrow-wall-right/index.d.ts +2 -2
  102. package/generated/react/icons/icon-arrow-wall-up/index.d.ts +2 -2
  103. package/generated/react/icons/icon-arrows-repeat-right/index.d.ts +2 -2
  104. package/generated/react/icons/icon-asterisk/index.d.ts +2 -2
  105. package/generated/react/icons/icon-at/index.d.ts +2 -2
  106. package/generated/react/icons/icon-back/index.d.ts +2 -2
  107. package/generated/react/icons/icon-backward/index.d.ts +2 -2
  108. package/generated/react/icons/icon-bag/index.d.ts +2 -2
  109. package/generated/react/icons/icon-bank/index.d.ts +2 -2
  110. package/generated/react/icons/icon-banknote/index.d.ts +2 -2
  111. package/generated/react/icons/icon-banknote-2/index.d.ts +2 -2
  112. package/generated/react/icons/icon-barcode/index.d.ts +2 -2
  113. package/generated/react/icons/icon-bars-three/index.d.ts +2 -2
  114. package/generated/react/icons/icon-bars-two/index.d.ts +2 -2
  115. package/generated/react/icons/icon-basket/index.d.ts +2 -2
  116. package/generated/react/icons/icon-battery-loading/index.d.ts +2 -2
  117. package/generated/react/icons/icon-bell/index.d.ts +2 -2
  118. package/generated/react/icons/icon-block/index.d.ts +2 -2
  119. package/generated/react/icons/icon-book/index.d.ts +2 -2
  120. package/generated/react/icons/icon-bookmark/index.d.ts +2 -2
  121. package/generated/react/icons/icon-bookmark-check/index.d.ts +2 -2
  122. package/generated/react/icons/icon-bookmark-delete/index.d.ts +2 -2
  123. package/generated/react/icons/icon-bookmark-plus/index.d.ts +2 -2
  124. package/generated/react/icons/icon-bookmark-remove/index.d.ts +2 -2
  125. package/generated/react/icons/icon-books/index.d.ts +2 -2
  126. package/generated/react/icons/icon-brand-app-store/index.d.ts +2 -2
  127. package/generated/react/icons/icon-brand-apple-music/index.d.ts +2 -2
  128. package/generated/react/icons/icon-brand-bankid/index.d.ts +2 -2
  129. package/generated/react/icons/icon-brand-chrome/index.d.ts +2 -2
  130. package/generated/react/icons/icon-brand-facebook/index.d.ts +2 -2
  131. package/generated/react/icons/icon-brand-figma/index.d.ts +2 -2
  132. package/generated/react/icons/icon-brand-firefox/index.d.ts +2 -2
  133. package/generated/react/icons/icon-brand-github/index.d.ts +2 -2
  134. package/generated/react/icons/icon-brand-green/index.d.ts +2 -2
  135. package/generated/react/icons/icon-brand-instagram/index.d.ts +2 -2
  136. package/generated/react/icons/icon-brand-linkedin/index.d.ts +2 -2
  137. package/generated/react/icons/icon-brand-play-store/index.d.ts +2 -2
  138. package/generated/react/icons/icon-brand-rss-feed/index.d.ts +2 -2
  139. package/generated/react/icons/icon-brand-seb/index.d.ts +2 -2
  140. package/generated/react/icons/icon-brand-spotify/index.d.ts +2 -2
  141. package/generated/react/icons/icon-brand-storybook/index.d.ts +2 -2
  142. package/generated/react/icons/icon-brand-swish-word/index.d.ts +2 -2
  143. package/generated/react/icons/icon-brand-x/index.d.ts +2 -2
  144. package/generated/react/icons/icon-brush/index.d.ts +2 -2
  145. package/generated/react/icons/icon-bubble-annotation/index.d.ts +2 -2
  146. package/generated/react/icons/icon-bubbles/index.d.ts +2 -2
  147. package/generated/react/icons/icon-buildings/index.d.ts +2 -2
  148. package/generated/react/icons/icon-bullet-list/index.d.ts +2 -2
  149. package/generated/react/icons/icon-calculator/index.d.ts +2 -2
  150. package/generated/react/icons/icon-calendar/index.d.ts +2 -2
  151. package/generated/react/icons/icon-calendar-check/index.d.ts +2 -2
  152. package/generated/react/icons/icon-calendar-repeat/index.d.ts +2 -2
  153. package/generated/react/icons/icon-calender-add/index.d.ts +2 -2
  154. package/generated/react/icons/icon-call/index.d.ts +2 -2
  155. package/generated/react/icons/icon-car/index.d.ts +2 -2
  156. package/generated/react/icons/icon-carussel/index.d.ts +2 -2
  157. package/generated/react/icons/icon-chain-link/index.d.ts +2 -2
  158. package/generated/react/icons/icon-chain-link-broken/index.d.ts +2 -2
  159. package/generated/react/icons/icon-chart-two/index.d.ts +2 -2
  160. package/generated/react/icons/icon-checklist/index.d.ts +2 -2
  161. package/generated/react/icons/icon-checkmark/index.d.ts +2 -2
  162. package/generated/react/icons/icon-chevron-bottom/index.d.ts +2 -2
  163. package/generated/react/icons/icon-chevron-double-down/index.d.ts +2 -2
  164. package/generated/react/icons/icon-chevron-double-left/index.d.ts +2 -2
  165. package/generated/react/icons/icon-chevron-double-right/index.d.ts +2 -2
  166. package/generated/react/icons/icon-chevron-double-up/index.d.ts +2 -2
  167. package/generated/react/icons/icon-chevron-down-small/index.d.ts +2 -2
  168. package/generated/react/icons/icon-chevron-grabber-vertical/index.d.ts +2 -2
  169. package/generated/react/icons/icon-chevron-grabber-vertical-reversed/index.d.ts +2 -2
  170. package/generated/react/icons/icon-chevron-left/index.d.ts +2 -2
  171. package/generated/react/icons/icon-chevron-left-small/index.d.ts +2 -2
  172. package/generated/react/icons/icon-chevron-right/index.d.ts +2 -2
  173. package/generated/react/icons/icon-chevron-right-small/index.d.ts +2 -2
  174. package/generated/react/icons/icon-chevron-top/index.d.ts +2 -2
  175. package/generated/react/icons/icon-chevron-top-small/index.d.ts +2 -2
  176. package/generated/react/icons/icon-circle-ban/index.d.ts +2 -2
  177. package/generated/react/icons/icon-circle-check/index.d.ts +2 -2
  178. package/generated/react/icons/icon-circle-dots/index.d.ts +2 -2
  179. package/generated/react/icons/icon-circle-info/index.d.ts +2 -2
  180. package/generated/react/icons/icon-circle-minus/index.d.ts +2 -2
  181. package/generated/react/icons/icon-circle-placeholder-on/index.d.ts +2 -2
  182. package/generated/react/icons/icon-circle-plus/index.d.ts +2 -2
  183. package/generated/react/icons/icon-circle-questionmark/index.d.ts +2 -2
  184. package/generated/react/icons/icon-circle-x/index.d.ts +2 -2
  185. package/generated/react/icons/icon-circles-three/index.d.ts +2 -2
  186. package/generated/react/icons/icon-clock/index.d.ts +2 -2
  187. package/generated/react/icons/icon-cloud-download/index.d.ts +2 -2
  188. package/generated/react/icons/icon-cloud-upload/index.d.ts +2 -2
  189. package/generated/react/icons/icon-cloudy-sun/index.d.ts +2 -2
  190. package/generated/react/icons/icon-code/index.d.ts +2 -2
  191. package/generated/react/icons/icon-code-brackets/index.d.ts +2 -2
  192. package/generated/react/icons/icon-compass-round/index.d.ts +2 -2
  193. package/generated/react/icons/icon-cookies/index.d.ts +2 -2
  194. package/generated/react/icons/icon-copy/index.d.ts +2 -2
  195. package/generated/react/icons/icon-credit-card/index.d.ts +2 -2
  196. package/generated/react/icons/icon-credit-card-add/index.d.ts +2 -2
  197. package/generated/react/icons/icon-cross-large/index.d.ts +2 -2
  198. package/generated/react/icons/icon-cross-small/index.d.ts +2 -2
  199. package/generated/react/icons/icon-cup-hot/index.d.ts +2 -2
  200. package/generated/react/icons/icon-cursor/index.d.ts +2 -2
  201. package/generated/react/icons/icon-details/index.d.ts +2 -2
  202. package/generated/react/icons/icon-devices/index.d.ts +2 -2
  203. package/generated/react/icons/icon-direction/index.d.ts +2 -2
  204. package/generated/react/icons/icon-dollar/index.d.ts +2 -2
  205. package/generated/react/icons/icon-dot-grid-one-horizontal/index.d.ts +2 -2
  206. package/generated/react/icons/icon-dot-grid-one-vertical/index.d.ts +2 -2
  207. package/generated/react/icons/icon-dot-grid-three/index.d.ts +2 -2
  208. package/generated/react/icons/icon-dot-grid-two/index.d.ts +2 -2
  209. package/generated/react/icons/icon-email/index.d.ts +2 -2
  210. package/generated/react/icons/icon-emoji-angry/index.d.ts +2 -2
  211. package/generated/react/icons/icon-emoji-neutral/index.d.ts +2 -2
  212. package/generated/react/icons/icon-emoji-sad/index.d.ts +2 -2
  213. package/generated/react/icons/icon-emoji-smile/index.d.ts +2 -2
  214. package/generated/react/icons/icon-emoji-smiley/index.d.ts +2 -2
  215. package/generated/react/icons/icon-euro/index.d.ts +2 -2
  216. package/generated/react/icons/icon-expand/index.d.ts +2 -2
  217. package/generated/react/icons/icon-eye-open/index.d.ts +2 -2
  218. package/generated/react/icons/icon-eye-slash/index.d.ts +2 -2
  219. package/generated/react/icons/icon-fashion/index.d.ts +2 -2
  220. package/generated/react/icons/icon-fast-forward/index.d.ts +2 -2
  221. package/generated/react/icons/icon-file-bend/index.d.ts +2 -2
  222. package/generated/react/icons/icon-file-chart/index.d.ts +2 -2
  223. package/generated/react/icons/icon-file-text/index.d.ts +2 -2
  224. package/generated/react/icons/icon-files/index.d.ts +2 -2
  225. package/generated/react/icons/icon-filter/index.d.ts +2 -2
  226. package/generated/react/icons/icon-flag/index.d.ts +2 -2
  227. package/generated/react/icons/icon-floppy-disk/index.d.ts +2 -2
  228. package/generated/react/icons/icon-focus/index.d.ts +2 -2
  229. package/generated/react/icons/icon-folder/index.d.ts +2 -2
  230. package/generated/react/icons/icon-folder-add-right/index.d.ts +2 -2
  231. package/generated/react/icons/icon-fullscreen/index.d.ts +2 -2
  232. package/generated/react/icons/icon-gift/index.d.ts +2 -2
  233. package/generated/react/icons/icon-globus/index.d.ts +2 -2
  234. package/generated/react/icons/icon-graduate-cap/index.d.ts +2 -2
  235. package/generated/react/icons/icon-green-power/index.d.ts +2 -2
  236. package/generated/react/icons/icon-group/index.d.ts +2 -2
  237. package/generated/react/icons/icon-growth/index.d.ts +2 -2
  238. package/generated/react/icons/icon-headphones/index.d.ts +2 -2
  239. package/generated/react/icons/icon-heart/index.d.ts +2 -2
  240. package/generated/react/icons/icon-heart-beat/index.d.ts +2 -2
  241. package/generated/react/icons/icon-history/index.d.ts +2 -2
  242. package/generated/react/icons/icon-home-energy-one/index.d.ts +2 -2
  243. package/generated/react/icons/icon-home-energy-two/index.d.ts +2 -2
  244. package/generated/react/icons/icon-home-open/index.d.ts +2 -2
  245. package/generated/react/icons/icon-home-roof/index.d.ts +2 -2
  246. package/generated/react/icons/icon-horizontal-alignment-bottom/index.d.ts +2 -2
  247. package/generated/react/icons/icon-hourglass/index.d.ts +2 -2
  248. package/generated/react/icons/icon-images/index.d.ts +2 -2
  249. package/generated/react/icons/icon-inbox-empty/index.d.ts +2 -2
  250. package/generated/react/icons/icon-industry/index.d.ts +2 -2
  251. package/generated/react/icons/icon-jpg/index.d.ts +2 -2
  252. package/generated/react/icons/icon-key/index.d.ts +2 -2
  253. package/generated/react/icons/icon-knife-spoon/index.d.ts +2 -2
  254. package/generated/react/icons/icon-lab/index.d.ts +2 -2
  255. package/generated/react/icons/icon-law/index.d.ts +2 -2
  256. package/generated/react/icons/icon-leisure/index.d.ts +2 -2
  257. package/generated/react/icons/icon-light-bulb-simple/index.d.ts +2 -2
  258. package/generated/react/icons/icon-lightning/index.d.ts +2 -2
  259. package/generated/react/icons/icon-line-chart-four/index.d.ts +2 -2
  260. package/generated/react/icons/icon-line-chart-one/index.d.ts +2 -2
  261. package/generated/react/icons/icon-line-chart-three/index.d.ts +2 -2
  262. package/generated/react/icons/icon-line-chart-two/index.d.ts +2 -2
  263. package/generated/react/icons/icon-lock/index.d.ts +2 -2
  264. package/generated/react/icons/icon-macbook-air/index.d.ts +2 -2
  265. package/generated/react/icons/icon-magnifying-glass/index.d.ts +2 -2
  266. package/generated/react/icons/icon-map-pin/index.d.ts +2 -2
  267. package/generated/react/icons/icon-megaphone/index.d.ts +2 -2
  268. package/generated/react/icons/icon-menu-sidebar/index.d.ts +2 -2
  269. package/generated/react/icons/icon-mic-off/index.d.ts +2 -2
  270. package/generated/react/icons/icon-mic-on/index.d.ts +2 -2
  271. package/generated/react/icons/icon-minimize/index.d.ts +2 -2
  272. package/generated/react/icons/icon-minus-large/index.d.ts +2 -2
  273. package/generated/react/icons/icon-minus-small/index.d.ts +2 -2
  274. package/generated/react/icons/icon-money-hand/index.d.ts +2 -2
  275. package/generated/react/icons/icon-moneybag/index.d.ts +2 -2
  276. package/generated/react/icons/icon-moon/index.d.ts +2 -2
  277. package/generated/react/icons/icon-mute/index.d.ts +2 -2
  278. package/generated/react/icons/icon-newspaper/index.d.ts +2 -2
  279. package/generated/react/icons/icon-office/index.d.ts +2 -2
  280. package/generated/react/icons/icon-page-add/index.d.ts +2 -2
  281. package/generated/react/icons/icon-paper-plane-top-right/index.d.ts +2 -2
  282. package/generated/react/icons/icon-paperclip/index.d.ts +2 -2
  283. package/generated/react/icons/icon-pause/index.d.ts +2 -2
  284. package/generated/react/icons/icon-pdf/index.d.ts +2 -2
  285. package/generated/react/icons/icon-pencil-sign/index.d.ts +2 -2
  286. package/generated/react/icons/icon-pencil-sparkle/index.d.ts +2 -2
  287. package/generated/react/icons/icon-pencil-wave/index.d.ts +2 -2
  288. package/generated/react/icons/icon-pension/index.d.ts +2 -2
  289. package/generated/react/icons/icon-people/index.d.ts +2 -2
  290. package/generated/react/icons/icon-people-a11y/index.d.ts +2 -2
  291. package/generated/react/icons/icon-people-add/index.d.ts +2 -2
  292. package/generated/react/icons/icon-people-added/index.d.ts +2 -2
  293. package/generated/react/icons/icon-people-circle/index.d.ts +2 -2
  294. package/generated/react/icons/icon-people-copy/index.d.ts +2 -2
  295. package/generated/react/icons/icon-people-profile/index.d.ts +2 -2
  296. package/generated/react/icons/icon-people-remove/index.d.ts +2 -2
  297. package/generated/react/icons/icon-percent/index.d.ts +2 -2
  298. package/generated/react/icons/icon-phone/index.d.ts +2 -2
  299. package/generated/react/icons/icon-pie-chart/index.d.ts +2 -2
  300. package/generated/react/icons/icon-piggy-bank/index.d.ts +2 -2
  301. package/generated/react/icons/icon-pin/index.d.ts +2 -2
  302. package/generated/react/icons/icon-pinch/index.d.ts +2 -2
  303. package/generated/react/icons/icon-play/index.d.ts +2 -2
  304. package/generated/react/icons/icon-play-circle/index.d.ts +2 -2
  305. package/generated/react/icons/icon-plus-large/index.d.ts +2 -2
  306. package/generated/react/icons/icon-plus-small/index.d.ts +2 -2
  307. package/generated/react/icons/icon-png/index.d.ts +2 -2
  308. package/generated/react/icons/icon-poop/index.d.ts +2 -2
  309. package/generated/react/icons/icon-postcard/index.d.ts +2 -2
  310. package/generated/react/icons/icon-pound/index.d.ts +2 -2
  311. package/generated/react/icons/icon-power/index.d.ts +2 -2
  312. package/generated/react/icons/icon-power-plant/index.d.ts +2 -2
  313. package/generated/react/icons/icon-printer/index.d.ts +2 -2
  314. package/generated/react/icons/icon-push/index.d.ts +2 -2
  315. package/generated/react/icons/icon-qr-code/index.d.ts +2 -2
  316. package/generated/react/icons/icon-rainy/index.d.ts +2 -2
  317. package/generated/react/icons/icon-raising-hand/index.d.ts +2 -2
  318. package/generated/react/icons/icon-reading-list/index.d.ts +2 -2
  319. package/generated/react/icons/icon-receipt-bill/index.d.ts +2 -2
  320. package/generated/react/icons/icon-receiption-bell/index.d.ts +2 -2
  321. package/generated/react/icons/icon-record/index.d.ts +2 -2
  322. package/generated/react/icons/icon-refund/index.d.ts +2 -2
  323. package/generated/react/icons/icon-robot/index.d.ts +2 -2
  324. package/generated/react/icons/icon-rocket/index.d.ts +2 -2
  325. package/generated/react/icons/icon-run-shortcut/index.d.ts +2 -2
  326. package/generated/react/icons/icon-safari/index.d.ts +2 -2
  327. package/generated/react/icons/icon-satellite/index.d.ts +2 -2
  328. package/generated/react/icons/icon-school/index.d.ts +2 -2
  329. package/generated/react/icons/icon-scissors/index.d.ts +2 -2
  330. package/generated/react/icons/icon-search-menu/index.d.ts +2 -2
  331. package/generated/react/icons/icon-settings-gear/index.d.ts +2 -2
  332. package/generated/react/icons/icon-settings-slider-hor/index.d.ts +2 -2
  333. package/generated/react/icons/icon-settings-slider-ver/index.d.ts +2 -2
  334. package/generated/react/icons/icon-shapes/index.d.ts +2 -2
  335. package/generated/react/icons/icon-share/index.d.ts +2 -2
  336. package/generated/react/icons/icon-shield/index.d.ts +2 -2
  337. package/generated/react/icons/icon-shield-checked/index.d.ts +2 -2
  338. package/generated/react/icons/icon-shield-crossed/index.d.ts +2 -2
  339. package/generated/react/icons/icon-shopping-bag/index.d.ts +2 -2
  340. package/generated/react/icons/icon-signature/index.d.ts +2 -2
  341. package/generated/react/icons/icon-smartwatch/index.d.ts +2 -2
  342. package/generated/react/icons/icon-solar/index.d.ts +2 -2
  343. package/generated/react/icons/icon-sort/index.d.ts +2 -2
  344. package/generated/react/icons/icon-sort-ascending/index.d.ts +2 -2
  345. package/generated/react/icons/icon-sort-descending/index.d.ts +2 -2
  346. package/generated/react/icons/icon-sort-down/index.d.ts +2 -2
  347. package/generated/react/icons/icon-sort-up/index.d.ts +2 -2
  348. package/generated/react/icons/icon-square-arrow-top-right/index.d.ts +2 -2
  349. package/generated/react/icons/icon-square-behind-square/index.d.ts +2 -2
  350. package/generated/react/icons/icon-square-grid-circle/index.d.ts +2 -2
  351. package/generated/react/icons/icon-square-placeholder/index.d.ts +2 -2
  352. package/generated/react/icons/icon-star/index.d.ts +2 -2
  353. package/generated/react/icons/icon-store/index.d.ts +2 -2
  354. package/generated/react/icons/icon-sun/index.d.ts +2 -2
  355. package/generated/react/icons/icon-sunset-arrow-down/index.d.ts +2 -2
  356. package/generated/react/icons/icon-tag/index.d.ts +2 -2
  357. package/generated/react/icons/icon-target-arrow/index.d.ts +2 -2
  358. package/generated/react/icons/icon-television/index.d.ts +2 -2
  359. package/generated/react/icons/icon-tennis/index.d.ts +2 -2
  360. package/generated/react/icons/icon-text-edit/index.d.ts +2 -2
  361. package/generated/react/icons/icon-thermostat/index.d.ts +2 -2
  362. package/generated/react/icons/icon-thumbs-down/index.d.ts +2 -2
  363. package/generated/react/icons/icon-thumbs-up/index.d.ts +2 -2
  364. package/generated/react/icons/icon-ticket/index.d.ts +2 -2
  365. package/generated/react/icons/icon-trading-view-candles/index.d.ts +2 -2
  366. package/generated/react/icons/icon-trash-can/index.d.ts +2 -2
  367. package/generated/react/icons/icon-tree/index.d.ts +2 -2
  368. package/generated/react/icons/icon-trending-five/index.d.ts +2 -2
  369. package/generated/react/icons/icon-trending-four/index.d.ts +2 -2
  370. package/generated/react/icons/icon-trending-one/index.d.ts +2 -2
  371. package/generated/react/icons/icon-trending-three/index.d.ts +2 -2
  372. package/generated/react/icons/icon-trending-two/index.d.ts +2 -2
  373. package/generated/react/icons/icon-triangle-exclamation/index.d.ts +2 -2
  374. package/generated/react/icons/icon-truck/index.d.ts +2 -2
  375. package/generated/react/icons/icon-umbrella-security/index.d.ts +2 -2
  376. package/generated/react/icons/icon-unlocked/index.d.ts +2 -2
  377. package/generated/react/icons/icon-volume-full/index.d.ts +2 -2
  378. package/generated/react/icons/icon-volume-half/index.d.ts +2 -2
  379. package/generated/react/icons/icon-volume-off/index.d.ts +2 -2
  380. package/generated/react/icons/icon-wallet/index.d.ts +2 -2
  381. package/generated/react/icons/icon-warning-sign/index.d.ts +2 -2
  382. package/generated/react/icons/icon-wifi-full/index.d.ts +2 -2
  383. package/generated/react/icons/icon-youtube/index.d.ts +2 -2
  384. package/generated/react/icons/icon-zap/index.d.ts +2 -2
  385. package/generated/react/icons/icon-zoom-in/index.d.ts +2 -2
  386. package/generated/react/icons/icon-zoom-out/index.d.ts +2 -2
  387. package/generated/react/img/index.d.ts +2 -2
  388. package/generated/react/index.d.ts +3 -3
  389. package/generated/react/index.js +3 -3
  390. package/generated/react/input/index.d.ts +3 -2
  391. package/generated/react/link/index.d.ts +2 -2
  392. package/generated/react/list/index.d.ts +2 -2
  393. package/generated/react/list-item/index.d.ts +2 -2
  394. package/generated/react/list-item-pattern-01/index.d.ts +2 -2
  395. package/generated/react/mask/index.d.ts +2 -2
  396. package/generated/react/menu-button/index.d.ts +2 -2
  397. package/generated/react/menu-heading/index.d.ts +2 -2
  398. package/generated/react/menu-item/index.d.ts +2 -2
  399. package/generated/react/option/index.d.ts +2 -2
  400. package/generated/react/pagination/index.d.ts +2 -2
  401. package/generated/react/popover/index.d.ts +2 -2
  402. package/generated/react/radio/index.d.ts +3 -2
  403. package/generated/react/radio-group/index.d.ts +3 -2
  404. package/generated/react/rich-text/index.d.ts +2 -2
  405. package/generated/react/segment/index.d.ts +2 -2
  406. package/generated/react/segmented-control/index.d.ts +2 -2
  407. package/generated/react/select/index.d.ts +3 -2
  408. package/generated/react/sensitive-account/index.d.ts +2 -2
  409. package/generated/react/sensitive-date/index.d.ts +2 -2
  410. package/generated/react/sensitive-number/index.d.ts +2 -2
  411. package/generated/react/signal/index.d.ts +2 -2
  412. package/generated/react/slider/index.d.ts +2 -2
  413. package/generated/react/spinner/index.d.ts +2 -2
  414. package/generated/react/switch/index.d.ts +3 -2
  415. package/generated/react/tab/index.d.ts +2 -2
  416. package/generated/react/tab-panel/index.d.ts +2 -2
  417. package/generated/react/table/index.d.ts +2 -2
  418. package/generated/react/tabs/index.d.ts +2 -2
  419. package/generated/react/text/index.d.ts +2 -2
  420. package/generated/react/textarea/index.d.ts +3 -2
  421. package/generated/react/theme/index.d.ts +2 -2
  422. package/generated/react/video/index.d.ts +2 -2
  423. package/package.json +1 -1
  424. package/patterns/list-item-pattern-01/list-item-pattern-01.component.js +1 -0
  425. package/primitives/field-base/field-base.component.d.ts +4 -0
  426. package/primitives/field-base/field-base.component.js +40 -8
  427. package/primitives/field-base/field-base.styles.js +6 -1
  428. package/primitives/field-base/field-base.trans.styles.scss.js +1 -1
  429. package/shared-styles/rbcb-toggle.style.js +25 -3
  430. package/shared-styles/rbcb-toggle.template.d.ts +1 -0
  431. package/shared-styles/rbcb-toggle.template.js +2 -1
  432. package/utils/helpers/custom-element-scoping.js +1 -1
@@ -454,7 +454,7 @@ export declare const GdsText: {
454
454
  tabIndex?: number | undefined;
455
455
  blur?: (() => void) | undefined;
456
456
  focus?: ((options?: FocusOptions) => void) | undefined;
457
- }, "dir" | "slot" | "style" | "title" | "accessKey" | "draggable" | "hidden" | "inert" | "lang" | "popover" | "translate" | "className" | "id" | "prefix" | "role" | "contentEditable" | "enterKeyHint" | "inputMode" | "nonce" | "tabIndex" | "aria-label" | "property" | "content" | "color" | "aria-selected" | "defaultChecked" | "defaultValue" | "popoverTargetAction" | "aria-haspopup" | "aria-expanded" | "rel" | "aria-valuemin" | "aria-valuemax" | "aria-valuetext" | "aria-checked" | "aria-disabled" | "aria-description" | "aria-invalid" | "aria-describedby" | "aria-live" | "onToggle" | "resource" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "autoCapitalize" | "autoFocus" | "contextMenu" | "spellCheck" | "radioGroup" | "about" | "datatype" | "inlist" | "rev" | "typeof" | "vocab" | "autoCorrect" | "autoSave" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "popoverTarget" | "is" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-braillelabel" | "aria-brailleroledescription" | "aria-busy" | "aria-colcount" | "aria-colindex" | "aria-colindextext" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-details" | "aria-dropeffect" | "aria-errormessage" | "aria-flowto" | "aria-grabbed" | "aria-hidden" | "aria-keyshortcuts" | "aria-labelledby" | "aria-level" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowindextext" | "aria-rowspan" | "aria-setsize" | "aria-sort" | "aria-valuenow" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onResize" | "onResizeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerLeave" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onBeforeToggle" | "onTransitionCancel" | "onTransitionCancelCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "onTransitionRun" | "onTransitionRunCapture" | "onTransitionStart" | "onTransitionStartCapture">, "children"> & {
457
+ }, "dir" | "slot" | "style" | "title" | "accessKey" | "draggable" | "hidden" | "inert" | "lang" | "popover" | "translate" | "className" | "id" | "prefix" | "role" | "contentEditable" | "enterKeyHint" | "inputMode" | "nonce" | "tabIndex" | "aria-label" | "property" | "content" | "color" | "aria-selected" | "defaultChecked" | "defaultValue" | "popoverTargetAction" | "aria-haspopup" | "aria-expanded" | "rel" | "aria-valuemin" | "aria-valuemax" | "aria-valuetext" | "aria-checked" | "aria-disabled" | "aria-description" | "aria-invalid" | "aria-describedby" | "aria-readonly" | "aria-live" | "onToggle" | "resource" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "autoCapitalize" | "autoFocus" | "contextMenu" | "spellCheck" | "radioGroup" | "about" | "datatype" | "inlist" | "rev" | "typeof" | "vocab" | "autoCorrect" | "autoSave" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "popoverTarget" | "is" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-braillelabel" | "aria-brailleroledescription" | "aria-busy" | "aria-colcount" | "aria-colindex" | "aria-colindextext" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-details" | "aria-dropeffect" | "aria-errormessage" | "aria-flowto" | "aria-grabbed" | "aria-hidden" | "aria-keyshortcuts" | "aria-labelledby" | "aria-level" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowindextext" | "aria-rowspan" | "aria-setsize" | "aria-sort" | "aria-valuenow" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onResize" | "onResizeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerLeave" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onBeforeToggle" | "onTransitionCancel" | "onTransitionCancelCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "onTransitionRun" | "onTransitionRunCapture" | "onTransitionStart" | "onTransitionStartCapture">, "children"> & {
458
458
  children?: React.ReactNode;
459
459
  } & {
460
460
  dir?: string | undefined | undefined;
@@ -496,6 +496,7 @@ export declare const GdsText: {
496
496
  "aria-description"?: string | undefined | undefined;
497
497
  "aria-invalid"?: boolean | "false" | "true" | "grammar" | "spelling" | undefined | undefined;
498
498
  "aria-describedby"?: string | undefined | undefined;
499
+ "aria-readonly"?: (boolean | "true" | "false") | undefined;
499
500
  "aria-live"?: "off" | "assertive" | "polite" | undefined | undefined;
500
501
  onToggle?: import("react").ToggleEventHandler<HTMLElement> | undefined;
501
502
  resource?: string | undefined | undefined;
@@ -553,7 +554,6 @@ export declare const GdsText: {
553
554
  "aria-placeholder"?: string | undefined | undefined;
554
555
  "aria-posinset"?: number | undefined | undefined;
555
556
  "aria-pressed"?: boolean | "false" | "mixed" | "true" | undefined | undefined;
556
- "aria-readonly"?: (boolean | "true" | "false") | undefined;
557
557
  "aria-relevant"?: "additions" | "additions removals" | "additions text" | "all" | "removals" | "removals additions" | "removals text" | "text" | "text additions" | "text removals" | undefined | undefined;
558
558
  "aria-required"?: (boolean | "true" | "false") | undefined;
559
559
  "aria-roledescription"?: string | undefined | undefined;
@@ -74,6 +74,7 @@ export declare const GdsTextarea: {
74
74
  value?: string | undefined;
75
75
  name?: string;
76
76
  disabled?: boolean;
77
+ readonly?: boolean;
77
78
  readonly form?: HTMLFormElement | null | undefined;
78
79
  readonly validity?: ValidityState | undefined;
79
80
  readonly validationMessage?: string | undefined;
@@ -457,7 +458,7 @@ export declare const GdsTextarea: {
457
458
  nonce?: string | undefined;
458
459
  tabIndex?: number | undefined;
459
460
  blur?: (() => void) | undefined;
460
- }, "dir" | "slot" | "style" | "title" | "accessKey" | "draggable" | "hidden" | "inert" | "lang" | "popover" | "translate" | "className" | "id" | "prefix" | "role" | "contentEditable" | "enterKeyHint" | "inputMode" | "nonce" | "tabIndex" | "aria-label" | "property" | "content" | "color" | "aria-selected" | "defaultChecked" | "defaultValue" | "popoverTargetAction" | "aria-haspopup" | "aria-expanded" | "rel" | "aria-valuemin" | "aria-valuemax" | "aria-valuetext" | "aria-checked" | "aria-disabled" | "aria-description" | "aria-invalid" | "aria-describedby" | "aria-live" | "onToggle" | "resource" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "autoCapitalize" | "autoFocus" | "contextMenu" | "spellCheck" | "radioGroup" | "about" | "datatype" | "inlist" | "rev" | "typeof" | "vocab" | "autoCorrect" | "autoSave" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "popoverTarget" | "is" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-braillelabel" | "aria-brailleroledescription" | "aria-busy" | "aria-colcount" | "aria-colindex" | "aria-colindextext" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-details" | "aria-dropeffect" | "aria-errormessage" | "aria-flowto" | "aria-grabbed" | "aria-hidden" | "aria-keyshortcuts" | "aria-labelledby" | "aria-level" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowindextext" | "aria-rowspan" | "aria-setsize" | "aria-sort" | "aria-valuenow" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onResize" | "onResizeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerLeave" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onBeforeToggle" | "onTransitionCancel" | "onTransitionCancelCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "onTransitionRun" | "onTransitionRunCapture" | "onTransitionStart" | "onTransitionStartCapture">, "children"> & {
461
+ }, "dir" | "slot" | "style" | "title" | "accessKey" | "draggable" | "hidden" | "inert" | "lang" | "popover" | "translate" | "className" | "id" | "prefix" | "role" | "contentEditable" | "enterKeyHint" | "inputMode" | "nonce" | "tabIndex" | "aria-label" | "property" | "content" | "color" | "aria-selected" | "defaultChecked" | "defaultValue" | "popoverTargetAction" | "aria-haspopup" | "aria-expanded" | "rel" | "aria-valuemin" | "aria-valuemax" | "aria-valuetext" | "aria-checked" | "aria-disabled" | "aria-description" | "aria-invalid" | "aria-describedby" | "aria-readonly" | "aria-live" | "onToggle" | "resource" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "autoCapitalize" | "autoFocus" | "contextMenu" | "spellCheck" | "radioGroup" | "about" | "datatype" | "inlist" | "rev" | "typeof" | "vocab" | "autoCorrect" | "autoSave" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "popoverTarget" | "is" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-braillelabel" | "aria-brailleroledescription" | "aria-busy" | "aria-colcount" | "aria-colindex" | "aria-colindextext" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-details" | "aria-dropeffect" | "aria-errormessage" | "aria-flowto" | "aria-grabbed" | "aria-hidden" | "aria-keyshortcuts" | "aria-labelledby" | "aria-level" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowindextext" | "aria-rowspan" | "aria-setsize" | "aria-sort" | "aria-valuenow" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onResize" | "onResizeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerLeave" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onBeforeToggle" | "onTransitionCancel" | "onTransitionCancelCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "onTransitionRun" | "onTransitionRunCapture" | "onTransitionStart" | "onTransitionStartCapture">, "children"> & {
461
462
  children?: React.ReactNode;
462
463
  } & {
463
464
  dir?: string | undefined | undefined;
@@ -499,6 +500,7 @@ export declare const GdsTextarea: {
499
500
  "aria-description"?: string | undefined | undefined;
500
501
  "aria-invalid"?: boolean | "false" | "true" | "grammar" | "spelling" | undefined | undefined;
501
502
  "aria-describedby"?: string | undefined | undefined;
503
+ "aria-readonly"?: (boolean | "true" | "false") | undefined;
502
504
  "aria-live"?: "off" | "assertive" | "polite" | undefined | undefined;
503
505
  onToggle?: import("react").ToggleEventHandler<HTMLElement> | undefined;
504
506
  resource?: string | undefined | undefined;
@@ -556,7 +558,6 @@ export declare const GdsTextarea: {
556
558
  "aria-placeholder"?: string | undefined | undefined;
557
559
  "aria-posinset"?: number | undefined | undefined;
558
560
  "aria-pressed"?: boolean | "false" | "mixed" | "true" | undefined | undefined;
559
- "aria-readonly"?: (boolean | "true" | "false") | undefined;
560
561
  "aria-relevant"?: "additions" | "additions removals" | "additions text" | "all" | "removals" | "removals additions" | "removals text" | "text" | "text additions" | "text removals" | undefined | undefined;
561
562
  "aria-required"?: (boolean | "true" | "false") | undefined;
562
563
  "aria-roledescription"?: string | undefined | undefined;
@@ -397,7 +397,7 @@ export declare const GdsTheme: {
397
397
  tabIndex?: number | undefined;
398
398
  blur?: (() => void) | undefined;
399
399
  focus?: ((options?: FocusOptions) => void) | undefined;
400
- }, "dir" | "slot" | "style" | "title" | "accessKey" | "draggable" | "hidden" | "inert" | "lang" | "popover" | "translate" | "className" | "id" | "prefix" | "role" | "contentEditable" | "enterKeyHint" | "inputMode" | "nonce" | "tabIndex" | "aria-label" | "property" | "content" | "color" | "aria-selected" | "defaultChecked" | "defaultValue" | "popoverTargetAction" | "aria-haspopup" | "aria-expanded" | "rel" | "aria-valuemin" | "aria-valuemax" | "aria-valuetext" | "aria-checked" | "aria-disabled" | "aria-description" | "aria-invalid" | "aria-describedby" | "aria-live" | "onToggle" | "resource" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "autoCapitalize" | "autoFocus" | "contextMenu" | "spellCheck" | "radioGroup" | "about" | "datatype" | "inlist" | "rev" | "typeof" | "vocab" | "autoCorrect" | "autoSave" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "popoverTarget" | "is" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-braillelabel" | "aria-brailleroledescription" | "aria-busy" | "aria-colcount" | "aria-colindex" | "aria-colindextext" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-details" | "aria-dropeffect" | "aria-errormessage" | "aria-flowto" | "aria-grabbed" | "aria-hidden" | "aria-keyshortcuts" | "aria-labelledby" | "aria-level" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowindextext" | "aria-rowspan" | "aria-setsize" | "aria-sort" | "aria-valuenow" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onResize" | "onResizeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerLeave" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onBeforeToggle" | "onTransitionCancel" | "onTransitionCancelCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "onTransitionRun" | "onTransitionRunCapture" | "onTransitionStart" | "onTransitionStartCapture">, "children"> & {
400
+ }, "dir" | "slot" | "style" | "title" | "accessKey" | "draggable" | "hidden" | "inert" | "lang" | "popover" | "translate" | "className" | "id" | "prefix" | "role" | "contentEditable" | "enterKeyHint" | "inputMode" | "nonce" | "tabIndex" | "aria-label" | "property" | "content" | "color" | "aria-selected" | "defaultChecked" | "defaultValue" | "popoverTargetAction" | "aria-haspopup" | "aria-expanded" | "rel" | "aria-valuemin" | "aria-valuemax" | "aria-valuetext" | "aria-checked" | "aria-disabled" | "aria-description" | "aria-invalid" | "aria-describedby" | "aria-readonly" | "aria-live" | "onToggle" | "resource" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "autoCapitalize" | "autoFocus" | "contextMenu" | "spellCheck" | "radioGroup" | "about" | "datatype" | "inlist" | "rev" | "typeof" | "vocab" | "autoCorrect" | "autoSave" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "popoverTarget" | "is" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-braillelabel" | "aria-brailleroledescription" | "aria-busy" | "aria-colcount" | "aria-colindex" | "aria-colindextext" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-details" | "aria-dropeffect" | "aria-errormessage" | "aria-flowto" | "aria-grabbed" | "aria-hidden" | "aria-keyshortcuts" | "aria-labelledby" | "aria-level" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowindextext" | "aria-rowspan" | "aria-setsize" | "aria-sort" | "aria-valuenow" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onResize" | "onResizeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerLeave" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onBeforeToggle" | "onTransitionCancel" | "onTransitionCancelCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "onTransitionRun" | "onTransitionRunCapture" | "onTransitionStart" | "onTransitionStartCapture">, "children"> & {
401
401
  children?: React.ReactNode;
402
402
  } & {
403
403
  dir?: string | undefined | undefined;
@@ -439,6 +439,7 @@ export declare const GdsTheme: {
439
439
  "aria-description"?: string | undefined | undefined;
440
440
  "aria-invalid"?: boolean | "false" | "true" | "grammar" | "spelling" | undefined | undefined;
441
441
  "aria-describedby"?: string | undefined | undefined;
442
+ "aria-readonly"?: (boolean | "true" | "false") | undefined;
442
443
  "aria-live"?: "off" | "assertive" | "polite" | undefined | undefined;
443
444
  onToggle?: import("react").ToggleEventHandler<HTMLElement> | undefined;
444
445
  resource?: string | undefined | undefined;
@@ -496,7 +497,6 @@ export declare const GdsTheme: {
496
497
  "aria-placeholder"?: string | undefined | undefined;
497
498
  "aria-posinset"?: number | undefined | undefined;
498
499
  "aria-pressed"?: boolean | "false" | "mixed" | "true" | undefined | undefined;
499
- "aria-readonly"?: (boolean | "true" | "false") | undefined;
500
500
  "aria-relevant"?: "additions" | "additions removals" | "additions text" | "all" | "removals" | "removals additions" | "removals text" | "text" | "text additions" | "text removals" | undefined | undefined;
501
501
  "aria-required"?: (boolean | "true" | "false") | undefined;
502
502
  "aria-roledescription"?: string | undefined | undefined;
@@ -432,7 +432,7 @@ export declare const GdsVideo: {
432
432
  tabIndex?: number | undefined;
433
433
  blur?: (() => void) | undefined;
434
434
  focus?: ((options?: FocusOptions) => void) | undefined;
435
- }, "dir" | "slot" | "style" | "title" | "accessKey" | "draggable" | "hidden" | "inert" | "lang" | "popover" | "translate" | "className" | "id" | "prefix" | "role" | "contentEditable" | "enterKeyHint" | "inputMode" | "nonce" | "tabIndex" | "aria-label" | "property" | "content" | "color" | "aria-selected" | "defaultChecked" | "defaultValue" | "popoverTargetAction" | "aria-haspopup" | "aria-expanded" | "rel" | "aria-valuemin" | "aria-valuemax" | "aria-valuetext" | "aria-checked" | "aria-disabled" | "aria-description" | "aria-invalid" | "aria-describedby" | "aria-live" | "onToggle" | "resource" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "autoCapitalize" | "autoFocus" | "contextMenu" | "spellCheck" | "radioGroup" | "about" | "datatype" | "inlist" | "rev" | "typeof" | "vocab" | "autoCorrect" | "autoSave" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "popoverTarget" | "is" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-braillelabel" | "aria-brailleroledescription" | "aria-busy" | "aria-colcount" | "aria-colindex" | "aria-colindextext" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-details" | "aria-dropeffect" | "aria-errormessage" | "aria-flowto" | "aria-grabbed" | "aria-hidden" | "aria-keyshortcuts" | "aria-labelledby" | "aria-level" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowindextext" | "aria-rowspan" | "aria-setsize" | "aria-sort" | "aria-valuenow" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onResize" | "onResizeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerLeave" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onBeforeToggle" | "onTransitionCancel" | "onTransitionCancelCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "onTransitionRun" | "onTransitionRunCapture" | "onTransitionStart" | "onTransitionStartCapture">, "children"> & {
435
+ }, "dir" | "slot" | "style" | "title" | "accessKey" | "draggable" | "hidden" | "inert" | "lang" | "popover" | "translate" | "className" | "id" | "prefix" | "role" | "contentEditable" | "enterKeyHint" | "inputMode" | "nonce" | "tabIndex" | "aria-label" | "property" | "content" | "color" | "aria-selected" | "defaultChecked" | "defaultValue" | "popoverTargetAction" | "aria-haspopup" | "aria-expanded" | "rel" | "aria-valuemin" | "aria-valuemax" | "aria-valuetext" | "aria-checked" | "aria-disabled" | "aria-description" | "aria-invalid" | "aria-describedby" | "aria-readonly" | "aria-live" | "onToggle" | "resource" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "autoCapitalize" | "autoFocus" | "contextMenu" | "spellCheck" | "radioGroup" | "about" | "datatype" | "inlist" | "rev" | "typeof" | "vocab" | "autoCorrect" | "autoSave" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "popoverTarget" | "is" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-braillelabel" | "aria-brailleroledescription" | "aria-busy" | "aria-colcount" | "aria-colindex" | "aria-colindextext" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-details" | "aria-dropeffect" | "aria-errormessage" | "aria-flowto" | "aria-grabbed" | "aria-hidden" | "aria-keyshortcuts" | "aria-labelledby" | "aria-level" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowindextext" | "aria-rowspan" | "aria-setsize" | "aria-sort" | "aria-valuenow" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onResize" | "onResizeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerLeave" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onBeforeToggle" | "onTransitionCancel" | "onTransitionCancelCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "onTransitionRun" | "onTransitionRunCapture" | "onTransitionStart" | "onTransitionStartCapture">, "children"> & {
436
436
  children?: React.ReactNode;
437
437
  } & {
438
438
  dir?: string | undefined | undefined;
@@ -474,6 +474,7 @@ export declare const GdsVideo: {
474
474
  "aria-description"?: string | undefined | undefined;
475
475
  "aria-invalid"?: boolean | "false" | "true" | "grammar" | "spelling" | undefined | undefined;
476
476
  "aria-describedby"?: string | undefined | undefined;
477
+ "aria-readonly"?: (boolean | "true" | "false") | undefined;
477
478
  "aria-live"?: "off" | "assertive" | "polite" | undefined | undefined;
478
479
  onToggle?: import("react").ToggleEventHandler<HTMLElement> | undefined;
479
480
  resource?: string | undefined | undefined;
@@ -531,7 +532,6 @@ export declare const GdsVideo: {
531
532
  "aria-placeholder"?: string | undefined | undefined;
532
533
  "aria-posinset"?: number | undefined | undefined;
533
534
  "aria-pressed"?: boolean | "false" | "mixed" | "true" | undefined | undefined;
534
- "aria-readonly"?: (boolean | "true" | "false") | undefined;
535
535
  "aria-relevant"?: "additions" | "additions removals" | "additions text" | "all" | "removals" | "removals additions" | "removals text" | "text" | "text additions" | "text removals" | undefined | undefined;
536
536
  "aria-required"?: (boolean | "true" | "false") | undefined;
537
537
  "aria-roledescription"?: string | undefined | undefined;
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@sebgroup/green-core",
3
3
  "description": "A carefully crafted set of Web Components, laying the foundation of the Green Design System.",
4
- "version": "3.25.2",
4
+ "version": "3.26.0",
5
5
  "main": "index.js",
6
6
  "module": "index.js",
7
7
  "type": "module",
@@ -107,6 +107,7 @@ renderCheckbox_fn = function() {
107
107
  checked: this.checked,
108
108
  indeterminate: this.indeterminate,
109
109
  disabled: this.disabled,
110
+ readonly: false,
110
111
  invalid: false
111
112
  })}
112
113
  </div>
@@ -26,6 +26,10 @@ export declare class GdsFieldBase extends GdsElement {
26
26
  * Whether the field is disabled.
27
27
  */
28
28
  disabled: boolean;
29
+ /**
30
+ * Whether the field is read-only. Renders a distinct style and a solid lock icon.
31
+ */
32
+ readonly: boolean;
29
33
  /**
30
34
  * Whether the field is invalid.
31
35
  */
@@ -4,10 +4,12 @@ import {
4
4
  __privateGet,
5
5
  __privateMethod
6
6
  } from "../../chunks/chunk.H2T4A5YY.js";
7
- var _handleSlotChange, _GdsFieldBase_instances, renderFieldContents_fn, renderSlotLead_fn, renderSlotMain_fn, renderSlotAction_fn, renderSlotTrail_fn;
7
+ var _handleSlotChange, _GdsFieldBase_instances, renderFieldContents_fn, renderRightSlots_fn, renderReadonlyIcon_fn, renderSlotLead_fn, renderSlotMain_fn, renderSlotAction_fn, renderSlotTrail_fn;
8
8
  import { localized } from "@lit/localize";
9
9
  import { property, query, state } from "lit/decorators.js";
10
10
  import { classMap } from "lit/directives/class-map.js";
11
+ import { nothing } from "lit/html.js";
12
+ import { IconLock } from "../../components/icon/icons/lock.component.js";
11
13
  import { GdsElement } from "../../gds-element.js";
12
14
  import { gdsCustomElement, html } from "../../scoping.js";
13
15
  import { TransitionalStyles } from "../../transitional-styles.js";
@@ -20,6 +22,7 @@ let GdsFieldBase = class extends GdsElement {
20
22
  this.size = "large";
21
23
  this.multiline = false;
22
24
  this.disabled = false;
25
+ this.readonly = false;
23
26
  this.invalid = false;
24
27
  this._leadSlotOccupied = false;
25
28
  this._leadHasBadge = false;
@@ -53,7 +56,8 @@ let GdsFieldBase = class extends GdsElement {
53
56
  invalid: this.invalid ?? false,
54
57
  multiline: this.multiline,
55
58
  disabled: this.disabled,
56
- "lead-slot-occupied": this._leadSlotOccupied,
59
+ readonly: this.readonly,
60
+ "lead-slot-occupied": this._leadSlotOccupied || this.readonly,
57
61
  "lead-has-badge": this._leadHasBadge,
58
62
  "trail-slot-occupied": this._trailSlotOccupied,
59
63
  "action-slot-occupied": this._actionSlotOccupied,
@@ -76,22 +80,44 @@ let GdsFieldBase = class extends GdsElement {
76
80
  _handleSlotChange = new WeakMap();
77
81
  _GdsFieldBase_instances = new WeakSet();
78
82
  renderFieldContents_fn = function() {
83
+ return [
84
+ __privateMethod(this, _GdsFieldBase_instances, renderReadonlyIcon_fn).call(this),
85
+ __privateMethod(this, _GdsFieldBase_instances, renderSlotLead_fn).call(this),
86
+ __privateMethod(this, _GdsFieldBase_instances, renderSlotMain_fn).call(this),
87
+ __privateMethod(this, _GdsFieldBase_instances, renderRightSlots_fn).call(this)
88
+ ];
89
+ };
90
+ renderRightSlots_fn = function() {
79
91
  const rightSlotsWrapClasses = {
80
92
  right: true,
81
93
  "as-flex": this.multiline && (this._trailSlotOccupied || this._actionSlotOccupied)
82
94
  };
83
95
  return html`
84
- ${__privateMethod(this, _GdsFieldBase_instances, renderSlotLead_fn).call(this)} ${__privateMethod(this, _GdsFieldBase_instances, renderSlotMain_fn).call(this)}
85
96
  <div class="${classMap(rightSlotsWrapClasses)}">
86
97
  ${__privateMethod(this, _GdsFieldBase_instances, renderSlotAction_fn).call(this)} ${__privateMethod(this, _GdsFieldBase_instances, renderSlotTrail_fn).call(this)}
87
98
  </div>
88
99
  `;
89
100
  };
101
+ renderReadonlyIcon_fn = function() {
102
+ if (!this.readonly) return nothing;
103
+ return html`
104
+ <gds-icon-lock
105
+ size=${this.size === "small" ? "m" : "l"}
106
+ color="disabled-01"
107
+ solid
108
+ ></gds-icon-lock>
109
+ `;
110
+ };
90
111
  renderSlotLead_fn = function() {
91
- return html` <slot
92
- name="lead"
93
- @slotchange=${(e) => __privateGet(this, _handleSlotChange).call(this, "lead", e)}
94
- ></slot>`;
112
+ if (this.readonly) return nothing;
113
+ return html`
114
+ <span class="lead-slot-content" ?hidden=${!this._leadSlotOccupied}>
115
+ <slot
116
+ name="lead"
117
+ @slotchange=${(e) => __privateGet(this, _handleSlotChange).call(this, "lead", e)}
118
+ ></slot>
119
+ </span>
120
+ `;
95
121
  };
96
122
  renderSlotMain_fn = function() {
97
123
  return html`<div
@@ -131,6 +157,12 @@ __decorateClass([
131
157
  reflect: true
132
158
  })
133
159
  ], GdsFieldBase.prototype, "disabled", 2);
160
+ __decorateClass([
161
+ property({
162
+ type: Boolean,
163
+ reflect: true
164
+ })
165
+ ], GdsFieldBase.prototype, "readonly", 2);
134
166
  __decorateClass([
135
167
  property({ type: Boolean })
136
168
  ], GdsFieldBase.prototype, "invalid", 2);
@@ -153,7 +185,7 @@ __decorateClass([
153
185
  watch("disabled")
154
186
  ], GdsFieldBase.prototype, "_handleDisabledChange", 1);
155
187
  GdsFieldBase = __decorateClass([
156
- gdsCustomElement("gds-field-base"),
188
+ gdsCustomElement("gds-field-base", { dependsOn: [IconLock] }),
157
189
  localized()
158
190
  ], GdsFieldBase);
159
191
  export {
@@ -83,6 +83,11 @@ const style = css`
83
83
  pointer-events: none;
84
84
  }
85
85
 
86
+ .field.readonly {
87
+ background: var(--gds-sys-color-l3-disabled-01);
88
+ border-color: var(--gds-sys-color-l3-disabled-01);
89
+ }
90
+
86
91
  .field.invalid {
87
92
  background: var(--gds-sys-color-l3-negative-02);
88
93
  border-color: var(--gds-sys-color-border-negative-01);
@@ -133,7 +138,7 @@ const style = css`
133
138
  }
134
139
 
135
140
  @media (hover: hover) {
136
- .field:hover {
141
+ .field:hover:not(.readonly) {
137
142
  background: color-mix(
138
143
  in srgb,
139
144
  var(--gds-sys-color-l3-neutral-02),
@@ -1,2 +1,2 @@
1
- const styles = "/* stylelint-disable max-nesting-depth */\n/**\n * Assert that a map is in ascending order\n * @mixin assert-ascending\n * @param {Map} $map - The map to check\n * @param {String} $map-name - The name of the map\n */\n/**\n * Assert that the first breakpoint in a map starts at zero\n * @mixin assert-starts-at-zero\n * @param {Map} $map - The map to check\n * @param {String} $map-name - The name of the map\n */\n/**\n * Check if a value is important\n * @function is-important\n * @param {Boolean} $important - Whether the value is important\n * @return {String} - \"!important\" if true, otherwise an empty string\n */\n/**\n * Replace a substring in a string\n * @function str-replace\n * @param {String} $string - The original string\n * @param {String} $search - The substring to replace\n * @param {String} $replace - The replacement string\n * @return {String} - The updated string\n */\n/**\n * Convert a map to its negative variant\n * @function negativify-map\n * @param {Map} $map - The map to convert\n * @return {Map} - The negative variant of the map\n */\n/**\n * Generate utility classes\n * @mixin generate-utility\n * @param {Map} $utility - Utility map\n * @param {String} $infix - Infix for class names\n * @param {Boolean} $is-rfs-media-query - Whether to use RFS media query\n */\n/* stylelint-enable max-nesting-depth */\n/**\n * Calculate the luminance for a color.\n * @function luminance\n * @param {Color} $color - The color to calculate luminance for\n * @return {Number} - The luminance value\n */\n/**\n * Calculate the contrast ratio between two colors.\n * @function color-contrast\n * @param {Color} $fg - Foreground color\n * @param {Color} $bg - Background color\n * @return {Number} - The contrast ratio\n */\n/**\n * Remove the unit of a length\n * @function strip-unit\n * @param {Number} $number - Number to remove unit from\n * @return {Number} - Unitless number\n */\n/**\n * Validate font size\n * @function validate-font-size\n * @param {Number} $size - Font size to validate\n * @return {Number} - Validated font size in pixels\n */\n/**\n * Get ratio for WCAG level\n * @function get-ratio\n * @param {String} $level - WCAG level\n * @param {Number} $size - Font size\n * @param {Boolean} $bold - Is bold\n * @param {Boolean} $graphic - Is graphic\n * @return {Number} - Ratio value\n */\n/**\n * Determine if a color is light or dark\n * @function light-or-dark\n * @param {Color} $color - The color to check\n * @return {String} - \"light\" or \"dark\"\n */\n/**\n * Get the most legible color (black or white) for a given background color\n * @function most-legible-color\n * @param {Color} $color - The background color\n * @return {Color} - The most legible color\n */\n/**\n * Get the desired color combination for foreground and background colors\n * @function desired-color-combination\n * @param {Color} $fg - Foreground color\n * @param {Color} $bg - Background color\n * @param {Number} $offsetThreshold - Offset threshold\n * @param {Number} $ratio - Contrast ratio\n * @return {List} - List containing background and foreground colors\n */\n/**\n * @mixin desired-color-combination\n * @param {Color} $fg - Foreground color\n * @param {Color} $bg - Background color\n * @param {Number} $offsetThreshold - Offset threshold\n * @param {Number} $ratio - Contrast ratio\n */\n/**\n * Get an accessible color for a given foreground and background color\n * @function a11y-color\n * @param {Color} $fg - Foreground color\n * @param {Color} $bg - Background color\n * @param {String} $level - WCAG level\n * @param {Number} $size - Font size\n * @param {Boolean} $bold - Is bold\n * @param {Boolean} $graphic - Is graphic\n * @param {Number} $maxOffset - Maximum offset\n * @param {Boolean} $darkMode - Is dark mode\n * @param {Number} $ratio - Contrast ratio\n * @return {Color} - Accessible color\n */\n/**\n * Get the maximum contrast color\n * @function max-contrast\n * @param {Color} $fg - Foreground color\n * @param {Color} $bg - Background color\n * @param {Color} $max - Maximum contrast color\n * @return {Color} - Maximum contrast color\n */\n/**\n * Get the RGB values of a color as a string\n * @function stripped-rgb\n * @param {Color} $color - The color\n * @return {String} - RGB values as a string\n */\n/**\n * Get the HSL values of a color as a string\n * @function stripped-hsl\n * @param {Color} $color - The color\n * @return {String} - HSL values as a string\n */\n/**\n * Convert a map of colors to a map of HSL values\n * @function hsl-map\n * @param {Map} $colors - Map of colors\n * @return {Map} - Map of HSL values\n */\n/**\n* @deprecated\n* Use `add-focus` instead\n*/\n/** add background color, color and border-color to element when it has focus-visible i.e. tab focus */\n/**\n * Breakpoint viewport sizes and media queries.\n *\n * Breakpoints are defined as a map of (name: minimum width), order from small to large:\n *\n * (xs: 0, sm: 576px, md: 768px, lg: 992px, xl: 1200px)\n *\n * The map defined in the `$grid-breakpoints` global variable is used as the `$breakpoints` argument by default.\n */\n/**\n * Name of the next breakpoint, or null for the last breakpoint.\n *\n * >> breakpoint-next(sm)\n * md\n * >> breakpoint-next(sm, (xs: 0, sm: 576px, md: 768px, lg: 992px, xl: 1200px))\n * md\n * >> breakpoint-next(sm, $breakpoint-names: (xs sm md lg xl))\n * md\n */\n/**\n * Minimum breakpoint width. Null for the smallest (first) breakpoint.\n *\n * >> breakpoint-min(sm, (xs: 0, sm: 576px, md: 768px, lg: 992px, xl: 1200px))\n * 576px\n */\n/**\n * Maximum breakpoint width.\n * The maximum value is reduced by 0.02px to work around the limitations of\n * `min-` and `max-` prefixes and viewports with fractional widths.\n * See https://www.w3.org/TR/mediaqueries-4/#mq-min-max\n * Uses 0.02px rather than 0.01px to work around a current rounding bug in Safari.\n * See https://bugs.webkit.org/show_bug.cgi?id=178261\n *\n * >> breakpoint-max(md, (xs: 0, sm: 576px, md: 768px, lg: 992px, xl: 1200px))\n * 767.98px\n */\n/**\n * Returns a blank string if smallest breakpoint, otherwise returns the name with a dash in front.\n * Useful for making responsive utilities.\n *\n * >> breakpoint-infix(xs, (xs: 0, sm: 576px, md: 768px, lg: 992px, xl: 1200px))\n * \"\" (Returns a blank string)\n * >> breakpoint-infix(sm, (xs: 0, sm: 576px, md: 768px, lg: 992px, xl: 1200px))\n * \"-sm\"\n */\n/**\n * Media of at least the minimum breakpoint width. No query for the smallest breakpoint.\n * Makes the @content apply to the given breakpoint and wider.\n */\n/**\n * Media of at most the maximum breakpoint width. No query for the largest breakpoint.\n * Makes the @content apply to the given breakpoint and narrower.\n */\n/**\n * Media that spans multiple breakpoint widths.\n * Makes the @content apply between the min and max breakpoints\n */\n/**\n * Media between the breakpoint's minimum and maximum widths.\n * No minimum for the smallest breakpoint, and no maximum for the largest one.\n * Makes the @content apply only to the given breakpoint, not viewports any wider or narrower.\n */\n@layer base, reset, transitional-styles;\n@layer transitional-styles {\n .field {\n border-radius: 0.25rem;\n border: solid 1px var(--gds-sys-color-base-600);\n --border-color: var(--gds-sys-color-base-600);\n }\n .field:focus:not(:focus-visible) {\n box-shadow: none;\n outline: 0;\n }\n .field:focus, .field:focus-within {\n outline-color: var(--gds-sys-color-focus-outline, var(--gds-sys-color-base-900));\n outline-style: solid;\n outline-width: 0.125rem;\n outline-offset: 0.125rem;\n }\n .field {\n align-items: stretch;\n gap: var(--gds-sys-space-xs);\n background-color: var(--gds-sys-color-background-primary);\n box-sizing: border-box;\n color: var(--gds-sys-color-text-primary);\n cursor: text;\n display: flex;\n justify-content: space-between;\n align-items: center;\n padding: calc(var(--gds-sys-space-xs) - 1px) var(--gds-sys-space-xs) calc(var(--gds-sys-space-xs) - 1px) var(--gds-sys-space-m);\n min-block-size: 44px;\n }\n .field:hover {\n background-color: var(--grey-200);\n }\n .field.small {\n font-size: 0.875rem;\n min-height: 2rem;\n }\n .field.multiline {\n align-items: flex-start;\n padding: calc(var(--gds-sys-space-s) - 1px) var(--gds-sys-space-s) calc(var(--gds-sys-space-s) - 1px) var(--gds-sys-space-m);\n height: -moz-max-content;\n height: max-content;\n }\n .field.action-slot-occupied:not(.trail-slot-occupied) {\n padding-right: var(--gds-sys-space-xs);\n }\n .field.lead-slot-occupied {\n padding-left: var(--gds-sys-space-xs);\n }\n .field.trail-slot-occupied {\n padding: calc(var(--gds-sys-space-xs) - 1px) var(--gds-sys-space-m);\n }\n .field slot[name=action]::slotted(*) {\n margin: -3px 0 -3px -3px;\n }\n .field:focus-within {\n outline-color: currentColor;\n }\n .field.invalid {\n border-color: var(--gds-sys-color-border-negative-01);\n color: var(--gds-sys-color-content-negative-01);\n border-bottom-width: 2px;\n }\n .field.disabled {\n background: var(--gds-sys-color-l3-disabled-01);\n color: var(--gds-sys-color-content-disabled-01);\n border-color: transparent;\n pointer-events: none;\n }\n .main-slot-wrap {\n display: flex;\n flex: 1;\n }\n slot:not([name])::slotted(*) {\n color: currentColor;\n }\n slot[name=lead]::slotted([gds-element^=gds-icon-]) {\n align-items: center;\n justify-content: center;\n display: flex;\n min-width: var(--gds-sys-space-l);\n }\n}";
1
+ const styles = "/* stylelint-disable max-nesting-depth */\n/**\n * Assert that a map is in ascending order\n * @mixin assert-ascending\n * @param {Map} $map - The map to check\n * @param {String} $map-name - The name of the map\n */\n/**\n * Assert that the first breakpoint in a map starts at zero\n * @mixin assert-starts-at-zero\n * @param {Map} $map - The map to check\n * @param {String} $map-name - The name of the map\n */\n/**\n * Check if a value is important\n * @function is-important\n * @param {Boolean} $important - Whether the value is important\n * @return {String} - \"!important\" if true, otherwise an empty string\n */\n/**\n * Replace a substring in a string\n * @function str-replace\n * @param {String} $string - The original string\n * @param {String} $search - The substring to replace\n * @param {String} $replace - The replacement string\n * @return {String} - The updated string\n */\n/**\n * Convert a map to its negative variant\n * @function negativify-map\n * @param {Map} $map - The map to convert\n * @return {Map} - The negative variant of the map\n */\n/**\n * Generate utility classes\n * @mixin generate-utility\n * @param {Map} $utility - Utility map\n * @param {String} $infix - Infix for class names\n * @param {Boolean} $is-rfs-media-query - Whether to use RFS media query\n */\n/* stylelint-enable max-nesting-depth */\n/**\n * Calculate the luminance for a color.\n * @function luminance\n * @param {Color} $color - The color to calculate luminance for\n * @return {Number} - The luminance value\n */\n/**\n * Calculate the contrast ratio between two colors.\n * @function color-contrast\n * @param {Color} $fg - Foreground color\n * @param {Color} $bg - Background color\n * @return {Number} - The contrast ratio\n */\n/**\n * Remove the unit of a length\n * @function strip-unit\n * @param {Number} $number - Number to remove unit from\n * @return {Number} - Unitless number\n */\n/**\n * Validate font size\n * @function validate-font-size\n * @param {Number} $size - Font size to validate\n * @return {Number} - Validated font size in pixels\n */\n/**\n * Get ratio for WCAG level\n * @function get-ratio\n * @param {String} $level - WCAG level\n * @param {Number} $size - Font size\n * @param {Boolean} $bold - Is bold\n * @param {Boolean} $graphic - Is graphic\n * @return {Number} - Ratio value\n */\n/**\n * Determine if a color is light or dark\n * @function light-or-dark\n * @param {Color} $color - The color to check\n * @return {String} - \"light\" or \"dark\"\n */\n/**\n * Get the most legible color (black or white) for a given background color\n * @function most-legible-color\n * @param {Color} $color - The background color\n * @return {Color} - The most legible color\n */\n/**\n * Get the desired color combination for foreground and background colors\n * @function desired-color-combination\n * @param {Color} $fg - Foreground color\n * @param {Color} $bg - Background color\n * @param {Number} $offsetThreshold - Offset threshold\n * @param {Number} $ratio - Contrast ratio\n * @return {List} - List containing background and foreground colors\n */\n/**\n * @mixin desired-color-combination\n * @param {Color} $fg - Foreground color\n * @param {Color} $bg - Background color\n * @param {Number} $offsetThreshold - Offset threshold\n * @param {Number} $ratio - Contrast ratio\n */\n/**\n * Get an accessible color for a given foreground and background color\n * @function a11y-color\n * @param {Color} $fg - Foreground color\n * @param {Color} $bg - Background color\n * @param {String} $level - WCAG level\n * @param {Number} $size - Font size\n * @param {Boolean} $bold - Is bold\n * @param {Boolean} $graphic - Is graphic\n * @param {Number} $maxOffset - Maximum offset\n * @param {Boolean} $darkMode - Is dark mode\n * @param {Number} $ratio - Contrast ratio\n * @return {Color} - Accessible color\n */\n/**\n * Get the maximum contrast color\n * @function max-contrast\n * @param {Color} $fg - Foreground color\n * @param {Color} $bg - Background color\n * @param {Color} $max - Maximum contrast color\n * @return {Color} - Maximum contrast color\n */\n/**\n * Get the RGB values of a color as a string\n * @function stripped-rgb\n * @param {Color} $color - The color\n * @return {String} - RGB values as a string\n */\n/**\n * Get the HSL values of a color as a string\n * @function stripped-hsl\n * @param {Color} $color - The color\n * @return {String} - HSL values as a string\n */\n/**\n * Convert a map of colors to a map of HSL values\n * @function hsl-map\n * @param {Map} $colors - Map of colors\n * @return {Map} - Map of HSL values\n */\n/**\n* @deprecated\n* Use `add-focus` instead\n*/\n/** add background color, color and border-color to element when it has focus-visible i.e. tab focus */\n/**\n * Breakpoint viewport sizes and media queries.\n *\n * Breakpoints are defined as a map of (name: minimum width), order from small to large:\n *\n * (xs: 0, sm: 576px, md: 768px, lg: 992px, xl: 1200px)\n *\n * The map defined in the `$grid-breakpoints` global variable is used as the `$breakpoints` argument by default.\n */\n/**\n * Name of the next breakpoint, or null for the last breakpoint.\n *\n * >> breakpoint-next(sm)\n * md\n * >> breakpoint-next(sm, (xs: 0, sm: 576px, md: 768px, lg: 992px, xl: 1200px))\n * md\n * >> breakpoint-next(sm, $breakpoint-names: (xs sm md lg xl))\n * md\n */\n/**\n * Minimum breakpoint width. Null for the smallest (first) breakpoint.\n *\n * >> breakpoint-min(sm, (xs: 0, sm: 576px, md: 768px, lg: 992px, xl: 1200px))\n * 576px\n */\n/**\n * Maximum breakpoint width.\n * The maximum value is reduced by 0.02px to work around the limitations of\n * `min-` and `max-` prefixes and viewports with fractional widths.\n * See https://www.w3.org/TR/mediaqueries-4/#mq-min-max\n * Uses 0.02px rather than 0.01px to work around a current rounding bug in Safari.\n * See https://bugs.webkit.org/show_bug.cgi?id=178261\n *\n * >> breakpoint-max(md, (xs: 0, sm: 576px, md: 768px, lg: 992px, xl: 1200px))\n * 767.98px\n */\n/**\n * Returns a blank string if smallest breakpoint, otherwise returns the name with a dash in front.\n * Useful for making responsive utilities.\n *\n * >> breakpoint-infix(xs, (xs: 0, sm: 576px, md: 768px, lg: 992px, xl: 1200px))\n * \"\" (Returns a blank string)\n * >> breakpoint-infix(sm, (xs: 0, sm: 576px, md: 768px, lg: 992px, xl: 1200px))\n * \"-sm\"\n */\n/**\n * Media of at least the minimum breakpoint width. No query for the smallest breakpoint.\n * Makes the @content apply to the given breakpoint and wider.\n */\n/**\n * Media of at most the maximum breakpoint width. No query for the largest breakpoint.\n * Makes the @content apply to the given breakpoint and narrower.\n */\n/**\n * Media that spans multiple breakpoint widths.\n * Makes the @content apply between the min and max breakpoints\n */\n/**\n * Media between the breakpoint's minimum and maximum widths.\n * No minimum for the smallest breakpoint, and no maximum for the largest one.\n * Makes the @content apply only to the given breakpoint, not viewports any wider or narrower.\n */\n@layer base, reset, transitional-styles;\n@layer transitional-styles {\n .field {\n border-radius: 0.25rem;\n border: solid 1px var(--gds-sys-color-base-600);\n --border-color: var(--gds-sys-color-base-600);\n }\n .field:focus:not(:focus-visible) {\n box-shadow: none;\n outline: 0;\n }\n .field:focus, .field:focus-within {\n outline-color: var(--gds-sys-color-focus-outline, var(--gds-sys-color-base-900));\n outline-style: solid;\n outline-width: 0.125rem;\n outline-offset: 0.125rem;\n }\n .field {\n align-items: stretch;\n gap: var(--gds-sys-space-xs);\n background-color: var(--gds-sys-color-background-primary);\n box-sizing: border-box;\n color: var(--gds-sys-color-text-primary);\n cursor: text;\n display: flex;\n justify-content: space-between;\n align-items: center;\n padding: calc(var(--gds-sys-space-xs) - 1px) var(--gds-sys-space-xs) calc(var(--gds-sys-space-xs) - 1px) var(--gds-sys-space-m);\n min-block-size: 44px;\n }\n .field:hover:not(.readonly) {\n background-color: var(--grey-200);\n }\n .field.small {\n font-size: 0.875rem;\n min-height: 2rem;\n }\n .field.multiline {\n align-items: flex-start;\n padding: calc(var(--gds-sys-space-s) - 1px) var(--gds-sys-space-s) calc(var(--gds-sys-space-s) - 1px) var(--gds-sys-space-m);\n height: -moz-max-content;\n height: max-content;\n }\n .field.action-slot-occupied:not(.trail-slot-occupied) {\n padding-right: var(--gds-sys-space-xs);\n }\n .field.lead-slot-occupied {\n padding-left: var(--gds-sys-space-xs);\n }\n .field.trail-slot-occupied {\n padding: calc(var(--gds-sys-space-xs) - 1px) var(--gds-sys-space-m);\n }\n .field slot[name=action]::slotted(*) {\n margin: -3px 0 -3px -3px;\n }\n .field:focus-within {\n outline-color: currentColor;\n }\n .field.invalid {\n border-color: var(--gds-sys-color-border-negative-01);\n color: var(--gds-sys-color-content-negative-01);\n border-bottom-width: 2px;\n }\n .field.disabled {\n background: var(--gds-sys-color-l3-disabled-01);\n color: var(--gds-sys-color-content-disabled-01);\n border-color: transparent;\n pointer-events: none;\n }\n .field.readonly {\n background: var(--gds-sys-color-l3-disabled-01);\n border-color: var(--gds-sys-color-l3-disabled-01);\n }\n .main-slot-wrap {\n display: flex;\n flex: 1;\n }\n slot:not([name])::slotted(*) {\n color: currentColor;\n }\n slot[name=lead]::slotted([gds-element^=gds-icon-]) {\n align-items: center;\n justify-content: center;\n display: flex;\n min-width: var(--gds-sys-space-l);\n }\n}";
2
2
  export default styles;
@@ -120,6 +120,23 @@ var rbcb_toggle_style_default = css`
120
120
  background-color: var(--gds-sys-color-l3-disabled-02);
121
121
  }
122
122
 
123
+ .--readonly .rbcb__toggle {
124
+ box-shadow: none;
125
+ background-color: var(--gds-sys-color-l3-disabled-02);
126
+ }
127
+
128
+ .--readonly .rbcb__icon {
129
+ /* content-disabled-02 is the readable pairing for an l3-disabled-02 fill */
130
+ color: var(--gds-sys-color-content-disabled-02);
131
+ }
132
+
133
+ .rbcb--radio.--readonly.--checked .rbcb__toggle {
134
+ /* Radio is the exception: only the checked ring swaps to a neutral fill with a gray ring; unchecked stays the same gray fill as checkbox/switch */
135
+ background-color: var(--gds-sys-color-l1-neutral-01);
136
+ box-shadow: inset 0 0 0 var(--_toggle-border-width-checked)
137
+ var(--gds-sys-color-l3-disabled-02);
138
+ }
139
+
123
140
  .--invalid .rbcb__toggle {
124
141
  background-color: var(--gds-sys-color-l3-negative-02);
125
142
  box-shadow: inset 0 0 0 var(--gds-sys-space-5xs)
@@ -169,10 +186,15 @@ var rbcb_toggle_style_default = css`
169
186
  outline: none;
170
187
  }
171
188
 
172
- :host([gds-element='gds-radio']:focus-visible) .rbcb__perimeter,
173
- :host([gds-element='gds-checkbox']):has(.visually-hidden-checkbox:focus-visible)
189
+ :host([gds-element='gds-radio']:focus-visible)
190
+ .rbcb:not(.--disabled)
191
+ .rbcb__perimeter,
192
+ :host([gds-element='gds-checkbox']):has(
193
+ .visually-hidden-checkbox:focus-visible
194
+ )
174
195
  .rbcb__perimeter,
175
- .rbcb-wrapper:has(.visually-hidden-checkbox:focus-visible) .rbcb__perimeter {
196
+ .rbcb-wrapper:has(.visually-hidden-checkbox:focus-visible) .rbcb__perimeter,
197
+ :host([readonly]:focus-within) .rbcb:not(.--disabled) .rbcb__perimeter {
176
198
  outline-width: var(--gds-sys-space-4xs);
177
199
  scale: 1;
178
200
  }
@@ -3,6 +3,7 @@ export interface RbcbTemplateProps {
3
3
  checked: boolean;
4
4
  indeterminate: boolean;
5
5
  disabled: boolean;
6
+ readonly: boolean;
6
7
  invalid: boolean;
7
8
  }
8
9
  /**
@@ -5,13 +5,14 @@ import { html } from "../scoping.js";
5
5
  const checkboxToggle = (props) => template({ ...props, type: "checkbox" });
6
6
  const radioToggle = (props) => template({ ...props, type: "radio" });
7
7
  const template = (props) => {
8
- const { type, checked, indeterminate, disabled, invalid } = props;
8
+ const { type, checked, indeterminate, disabled, readonly, invalid } = props;
9
9
  const modifiers = {
10
10
  "rbcb--checkbox": type === "checkbox",
11
11
  "rbcb--radio": type === "radio",
12
12
  "--checked": checked,
13
13
  "--indeterminate": indeterminate,
14
14
  "--disabled": disabled,
15
+ "--readonly": readonly,
15
16
  "--invalid": invalid
16
17
  };
17
18
  return html`
@@ -1,6 +1,6 @@
1
1
  import "../../chunks/chunk.H2T4A5YY.js";
2
2
  import { html as litHtml } from "lit";
3
- const VER_SUFFIX = "-8308c9";
3
+ const VER_SUFFIX = "-0d3f1f";
4
4
  class ScopedElementRegistry {
5
5
  static get instance() {
6
6
  if (!globalThis.__gdsElementLookupTable?.[VER_SUFFIX])