@riverty/web-components 5.7.0 → 6.0.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 (273) hide show
  1. package/CHANGELOG.md +128 -0
  2. package/custom-elements.json +152 -372
  3. package/dist/cjs/index-DJ4H_bFj.js +6 -10
  4. package/dist/cjs/loader.cjs.js +1 -1
  5. package/dist/cjs/r-accordion-panel.cjs.entry.js +1 -1
  6. package/dist/cjs/r-accordion-section.cjs.entry.js +1 -1
  7. package/dist/cjs/r-accordion-trigger.cjs.entry.js +5 -35
  8. package/dist/cjs/r-accordion.cjs.entry.js +3 -7
  9. package/dist/cjs/r-alert.cjs.entry.js +45 -14
  10. package/dist/cjs/r-badge.cjs.entry.js +1 -1
  11. package/dist/cjs/r-button.cjs.entry.js +2 -2
  12. package/dist/cjs/r-checkbox-group.cjs.entry.js +28 -24
  13. package/dist/cjs/r-checkbox.cjs.entry.js +97 -81
  14. package/dist/cjs/r-dialog.cjs.entry.js +3 -11
  15. package/dist/cjs/r-hint_2.cjs.entry.js +50 -0
  16. package/dist/cjs/{r-hint_3.cjs.entry.js → r-icon-button_2.cjs.entry.js} +64 -51
  17. package/dist/cjs/r-icon.cjs.entry.js +1 -1
  18. package/dist/cjs/r-input-code.cjs.entry.js +133 -25
  19. package/dist/cjs/r-input-date.cjs.entry.js +87 -23
  20. package/dist/cjs/r-input-password.cjs.entry.js +34 -13
  21. package/dist/cjs/r-input-phone-number.cjs.entry.js +30 -22
  22. package/dist/cjs/r-input.cjs.entry.js +108 -49
  23. package/dist/cjs/r-list-item.cjs.entry.js +5 -5
  24. package/dist/cjs/r-pagination.cjs.entry.js +1 -1
  25. package/dist/cjs/r-panel.cjs.entry.js +2 -2
  26. package/dist/cjs/r-popover-action.cjs.entry.js +2 -2
  27. package/dist/cjs/r-popover-content.cjs.entry.js +1 -1
  28. package/dist/cjs/r-popover-headline.cjs.entry.js +1 -1
  29. package/dist/cjs/r-popover-trigger.cjs.entry.js +1 -1
  30. package/dist/cjs/r-popover.cjs.entry.js +3 -3
  31. package/dist/cjs/r-progress-bar.cjs.entry.js +1 -1
  32. package/dist/cjs/r-radio-button-description.cjs.entry.js +1 -1
  33. package/dist/cjs/r-radio-button-leading.cjs.entry.js +1 -1
  34. package/dist/cjs/r-radio-button-title.cjs.entry.js +1 -1
  35. package/dist/cjs/r-radio-button-trailing.cjs.entry.js +1 -1
  36. package/dist/cjs/r-radio-button.cjs.entry.js +29 -12
  37. package/dist/cjs/r-radio-group.cjs.entry.js +32 -32
  38. package/dist/cjs/r-select-option.cjs.entry.js +1 -1
  39. package/dist/cjs/r-select.cjs.entry.js +116 -40
  40. package/dist/cjs/r-skip-link.cjs.entry.js +1 -1
  41. package/dist/cjs/r-stepper-item.cjs.entry.js +2 -2
  42. package/dist/cjs/r-stepper.cjs.entry.js +1 -1
  43. package/dist/cjs/r-tab-panel.cjs.entry.js +1 -1
  44. package/dist/cjs/r-tab.cjs.entry.js +1 -1
  45. package/dist/cjs/r-tabs-list.cjs.entry.js +1 -1
  46. package/dist/cjs/r-tabs.cjs.entry.js +1 -1
  47. package/dist/cjs/r-textarea.cjs.entry.js +24 -23
  48. package/dist/cjs/r-toast-group.cjs.entry.js +1 -1
  49. package/dist/cjs/r-toast.cjs.entry.js +51 -20
  50. package/dist/cjs/web-components.cjs.js +1 -1
  51. package/dist/collection/collection-manifest.json +0 -1
  52. package/dist/collection/components/accordion/accordion.css +0 -2
  53. package/dist/collection/components/accordion/accordion.js +4 -8
  54. package/dist/collection/components/accordion/exports.js +1 -1
  55. package/dist/collection/components/accordion-panel/accordion-panel.js +1 -1
  56. package/dist/collection/components/accordion-section/accordion-section.js +1 -1
  57. package/dist/collection/components/accordion-trigger/accordion-trigger.css +0 -4
  58. package/dist/collection/components/accordion-trigger/accordion-trigger.js +4 -215
  59. package/dist/collection/components/alert/alert.css +58 -12
  60. package/dist/collection/components/alert/alert.js +92 -17
  61. package/dist/collection/components/alert/exports.js +1 -1
  62. package/dist/collection/components/badge/badge.js +1 -1
  63. package/dist/collection/components/button/button.css +6 -7
  64. package/dist/collection/components/button/button.js +1 -1
  65. package/dist/collection/components/checkbox/checkbox.js +121 -104
  66. package/dist/collection/components/checkbox-group/checkbox-group.js +48 -63
  67. package/dist/collection/components/dialog/dialog.css +1 -3
  68. package/dist/collection/components/dialog/dialog.js +2 -10
  69. package/dist/collection/components/hint/hint.js +2 -2
  70. package/dist/collection/components/icon/bundled-icons/riverty-kit.json +1 -1
  71. package/dist/collection/components/icon/riverty-kit.js +1 -1
  72. package/dist/collection/components/icon-button/icon-button.css +0 -7
  73. package/dist/collection/components/icon-button/icon-button.js +3 -3
  74. package/dist/collection/components/input/input.css +3 -0
  75. package/dist/collection/components/input/input.js +221 -378
  76. package/dist/collection/components/input-code/exports.js +2 -0
  77. package/dist/collection/components/input-code/input-code.js +335 -34
  78. package/dist/collection/components/input-date/input-date.js +237 -87
  79. package/dist/collection/components/input-password/exports.js +1 -0
  80. package/dist/collection/components/input-password/input-password.css +1 -0
  81. package/dist/collection/components/input-password/input-password.js +233 -75
  82. package/dist/collection/components/input-phone-number/input-phone-number.js +50 -85
  83. package/dist/collection/components/label/label.js +3 -113
  84. package/dist/collection/components/list-item/list-item/list-item.css +7 -7
  85. package/dist/collection/components/list-item/list-item/list-item.js +4 -26
  86. package/dist/collection/components/pagination/pagination.css +23 -23
  87. package/dist/collection/components/panel/panel.js +2 -2
  88. package/dist/collection/components/popover/exports.js +0 -1
  89. package/dist/collection/components/popover/popover.css +13 -13
  90. package/dist/collection/components/popover/popover.js +2 -55
  91. package/dist/collection/components/popover-action/popover-action.css +3 -5
  92. package/dist/collection/components/popover-action/popover-action.js +1 -1
  93. package/dist/collection/components/popover-content/popover-content.js +1 -1
  94. package/dist/collection/components/popover-headline/popover-headline.js +1 -1
  95. package/dist/collection/components/popover-trigger/popover-trigger.js +1 -1
  96. package/dist/collection/components/progress-bar/progress-bar.js +1 -1
  97. package/dist/collection/components/radio-button/radio-button.js +49 -12
  98. package/dist/collection/components/radio-button-description/radio-button-description.js +1 -1
  99. package/dist/collection/components/radio-button-leading/radio-button-leading.js +1 -1
  100. package/dist/collection/components/radio-button-title/radio-button-title.js +1 -1
  101. package/dist/collection/components/radio-button-trailing/radio-button-trailing.js +1 -1
  102. package/dist/collection/components/radio-group/radio-group.js +53 -135
  103. package/dist/collection/components/select/select.js +197 -349
  104. package/dist/collection/components/select-option/select-option.js +1 -1
  105. package/dist/collection/components/skip-link/skip-link.js +1 -1
  106. package/dist/collection/components/stepper/stepper.js +1 -1
  107. package/dist/collection/components/stepper-item/stepper-item.js +2 -2
  108. package/dist/collection/components/tab/tab.js +1 -1
  109. package/dist/collection/components/tab-panel/tab-panel.js +1 -1
  110. package/dist/collection/components/tabs/tabs.js +1 -1
  111. package/dist/collection/components/tabs-list/tabs-list.js +1 -1
  112. package/dist/collection/components/textarea/textarea.js +44 -163
  113. package/dist/collection/components/toast/toast.css +22 -14
  114. package/dist/collection/components/toast/toast.js +95 -43
  115. package/dist/collection/components/toast-group/toast-group.js +1 -1
  116. package/dist/collection/components/tooltip/tooltip.js +1 -1
  117. package/dist/esm/index-Da7qOBFr.js +6 -10
  118. package/dist/esm/loader.js +1 -1
  119. package/dist/esm/r-accordion-panel.entry.js +1 -1
  120. package/dist/esm/r-accordion-section.entry.js +1 -1
  121. package/dist/esm/r-accordion-trigger.entry.js +5 -35
  122. package/dist/esm/r-accordion.entry.js +3 -7
  123. package/dist/esm/r-alert.entry.js +45 -14
  124. package/dist/esm/r-badge.entry.js +1 -1
  125. package/dist/esm/r-button.entry.js +2 -2
  126. package/dist/esm/r-checkbox-group.entry.js +28 -24
  127. package/dist/esm/r-checkbox.entry.js +97 -81
  128. package/dist/esm/r-dialog.entry.js +3 -11
  129. package/dist/esm/r-hint_2.entry.js +47 -0
  130. package/dist/esm/{r-hint_3.entry.js → r-icon-button_2.entry.js} +65 -51
  131. package/dist/esm/r-icon.entry.js +1 -1
  132. package/dist/esm/r-input-code.entry.js +133 -25
  133. package/dist/esm/r-input-date.entry.js +87 -23
  134. package/dist/esm/r-input-password.entry.js +34 -13
  135. package/dist/esm/r-input-phone-number.entry.js +30 -22
  136. package/dist/esm/r-input.entry.js +108 -49
  137. package/dist/esm/r-list-item.entry.js +5 -5
  138. package/dist/esm/r-pagination.entry.js +1 -1
  139. package/dist/esm/r-panel.entry.js +2 -2
  140. package/dist/esm/r-popover-action.entry.js +2 -2
  141. package/dist/esm/r-popover-content.entry.js +1 -1
  142. package/dist/esm/r-popover-headline.entry.js +1 -1
  143. package/dist/esm/r-popover-trigger.entry.js +1 -1
  144. package/dist/esm/r-popover.entry.js +3 -3
  145. package/dist/esm/r-progress-bar.entry.js +1 -1
  146. package/dist/esm/r-radio-button-description.entry.js +1 -1
  147. package/dist/esm/r-radio-button-leading.entry.js +1 -1
  148. package/dist/esm/r-radio-button-title.entry.js +1 -1
  149. package/dist/esm/r-radio-button-trailing.entry.js +1 -1
  150. package/dist/esm/r-radio-button.entry.js +29 -12
  151. package/dist/esm/r-radio-group.entry.js +32 -32
  152. package/dist/esm/r-select-option.entry.js +1 -1
  153. package/dist/esm/r-select.entry.js +116 -40
  154. package/dist/esm/r-skip-link.entry.js +1 -1
  155. package/dist/esm/r-stepper-item.entry.js +2 -2
  156. package/dist/esm/r-stepper.entry.js +1 -1
  157. package/dist/esm/r-tab-panel.entry.js +1 -1
  158. package/dist/esm/r-tab.entry.js +1 -1
  159. package/dist/esm/r-tabs-list.entry.js +1 -1
  160. package/dist/esm/r-tabs.entry.js +1 -1
  161. package/dist/esm/r-textarea.entry.js +24 -23
  162. package/dist/esm/r-toast-group.entry.js +1 -1
  163. package/dist/esm/r-toast.entry.js +51 -20
  164. package/dist/esm/web-components.js +1 -1
  165. package/dist/types/components/accordion/accordion.d.ts +1 -5
  166. package/dist/types/components/accordion/exports.d.ts +1 -1
  167. package/dist/types/components/accordion-trigger/accordion-trigger.d.ts +0 -36
  168. package/dist/types/components/alert/alert.d.ts +9 -1
  169. package/dist/types/components/alert/exports.d.ts +1 -1
  170. package/dist/types/components/checkbox/checkbox.d.ts +29 -34
  171. package/dist/types/components/checkbox-group/checkbox-group.d.ts +6 -11
  172. package/dist/types/components/dialog/dialog.d.ts +0 -2
  173. package/dist/types/components/input/input.d.ts +35 -72
  174. package/dist/types/components/input-code/exports.d.ts +4 -0
  175. package/dist/types/components/input-code/input-code.d.ts +54 -7
  176. package/dist/types/components/input-date/input-date.d.ts +30 -16
  177. package/dist/types/components/input-password/exports.d.ts +1 -0
  178. package/dist/types/components/input-password/input-password.d.ts +53 -16
  179. package/dist/types/components/input-phone-number/input-phone-number.d.ts +5 -16
  180. package/dist/types/components/label/label.d.ts +0 -18
  181. package/dist/types/components/list-item/list-item/list-item.d.ts +0 -6
  182. package/dist/types/components/popover/exports.d.ts +0 -2
  183. package/dist/types/components/popover/popover.d.ts +1 -14
  184. package/dist/types/components/radio-button/radio-button.d.ts +5 -0
  185. package/dist/types/components/radio-group/radio-group.d.ts +6 -28
  186. package/dist/types/components/select/select.d.ts +34 -52
  187. package/dist/types/components/textarea/textarea.d.ts +5 -32
  188. package/dist/types/components/toast/toast.d.ts +10 -7
  189. package/dist/types/components.d.ts +347 -647
  190. package/dist/web-components/bundled-icons/riverty-kit.json +1 -1
  191. package/dist/web-components/p-0347feff.entry.js +1 -0
  192. package/dist/web-components/p-05738503.entry.js +1 -0
  193. package/dist/web-components/p-0e4c8bf1.entry.js +1 -0
  194. package/dist/web-components/p-1da75540.entry.js +1 -0
  195. package/dist/web-components/p-26ef77d6.entry.js +1 -0
  196. package/dist/web-components/p-3884c6e7.entry.js +1 -0
  197. package/dist/web-components/p-3a5a67e7.entry.js +1 -0
  198. package/dist/web-components/p-3f60c6c0.entry.js +1 -0
  199. package/dist/web-components/p-4254a383.entry.js +1 -0
  200. package/dist/web-components/{p-87f39749.entry.js → p-4595fa8e.entry.js} +1 -1
  201. package/dist/web-components/{p-4e3df002.entry.js → p-4cc58c6a.entry.js} +1 -1
  202. package/dist/web-components/p-5441b746.entry.js +1 -0
  203. package/dist/web-components/{p-72fa1fd1.entry.js → p-550e2237.entry.js} +1 -1
  204. package/dist/web-components/p-589baaf9.entry.js +1 -0
  205. package/dist/web-components/p-60341de2.entry.js +1 -0
  206. package/dist/web-components/{p-4bd3e077.entry.js → p-60ca994e.entry.js} +1 -1
  207. package/dist/web-components/{p-44ae9f33.entry.js → p-62b788bf.entry.js} +1 -1
  208. package/dist/web-components/{p-2b2f581a.entry.js → p-6303b9fe.entry.js} +1 -1
  209. package/dist/web-components/p-63fd817d.entry.js +1 -0
  210. package/dist/web-components/{p-e0e2f2b2.entry.js → p-673dbfd0.entry.js} +1 -1
  211. package/dist/web-components/p-67fa3f84.entry.js +1 -0
  212. package/dist/web-components/p-6a4f3836.entry.js +1 -0
  213. package/dist/web-components/p-6cc2ea2c.entry.js +1 -0
  214. package/dist/web-components/p-70784685.entry.js +1 -0
  215. package/dist/web-components/{p-429213ea.entry.js → p-7fed6f4d.entry.js} +1 -1
  216. package/dist/web-components/p-8a66d20c.entry.js +1 -0
  217. package/dist/web-components/{p-0bb04d79.entry.js → p-8b4d2448.entry.js} +1 -1
  218. package/dist/web-components/{p-c7f8e59b.entry.js → p-8c31cbd5.entry.js} +1 -1
  219. package/dist/web-components/p-8dac326b.entry.js +1 -0
  220. package/dist/web-components/{p-1c2497de.entry.js → p-9ef1bbee.entry.js} +1 -1
  221. package/dist/web-components/p-a0dbde7c.entry.js +1 -0
  222. package/dist/web-components/{p-755cc697.entry.js → p-a71485d8.entry.js} +1 -1
  223. package/dist/web-components/p-a7d22c76.entry.js +1 -0
  224. package/dist/web-components/{p-85a9af42.entry.js → p-ae251d2f.entry.js} +1 -1
  225. package/dist/web-components/{p-77155630.entry.js → p-b98ab649.entry.js} +1 -1
  226. package/dist/web-components/p-b9e3b3d6.entry.js +1 -0
  227. package/dist/web-components/p-c1e748f2.entry.js +1 -0
  228. package/dist/web-components/p-c478712b.entry.js +1 -0
  229. package/dist/web-components/{p-72c0c0d8.entry.js → p-d054eb4d.entry.js} +1 -1
  230. package/dist/web-components/p-d433a828.entry.js +1 -0
  231. package/dist/web-components/p-d7726e46.entry.js +1 -0
  232. package/dist/web-components/p-d819c8e5.entry.js +1 -0
  233. package/dist/web-components/p-e2188953.entry.js +1 -0
  234. package/dist/web-components/{p-3b4e3faf.entry.js → p-e5945c01.entry.js} +1 -1
  235. package/dist/web-components/{p-d1379ac6.entry.js → p-f9d5004c.entry.js} +1 -1
  236. package/dist/web-components/web-components.esm.js +1 -1
  237. package/package.json +1 -1
  238. package/dist/cjs/r-accordion-item.cjs.entry.js +0 -78
  239. package/dist/cjs/r-icon-button.cjs.entry.js +0 -81
  240. package/dist/collection/components/accordion-item/accordion-item.css +0 -121
  241. package/dist/collection/components/accordion-item/accordion-item.js +0 -138
  242. package/dist/esm/r-accordion-item.entry.js +0 -76
  243. package/dist/esm/r-icon-button.entry.js +0 -79
  244. package/dist/types/components/accordion-item/accordion-item.d.ts +0 -26
  245. package/dist/web-components/p-00ca474f.entry.js +0 -1
  246. package/dist/web-components/p-289eb4b0.entry.js +0 -1
  247. package/dist/web-components/p-2b8e12ae.entry.js +0 -1
  248. package/dist/web-components/p-2e2c8a5b.entry.js +0 -1
  249. package/dist/web-components/p-3a39932b.entry.js +0 -1
  250. package/dist/web-components/p-3bc93d65.entry.js +0 -1
  251. package/dist/web-components/p-44be9992.entry.js +0 -1
  252. package/dist/web-components/p-4652635a.entry.js +0 -1
  253. package/dist/web-components/p-51a5804b.entry.js +0 -1
  254. package/dist/web-components/p-63474b32.entry.js +0 -1
  255. package/dist/web-components/p-74d2a563.entry.js +0 -1
  256. package/dist/web-components/p-7ad8e78b.entry.js +0 -1
  257. package/dist/web-components/p-8028c2a9.entry.js +0 -1
  258. package/dist/web-components/p-96ddeb7f.entry.js +0 -1
  259. package/dist/web-components/p-9d898089.entry.js +0 -1
  260. package/dist/web-components/p-9e50120b.entry.js +0 -1
  261. package/dist/web-components/p-9eb1f262.entry.js +0 -1
  262. package/dist/web-components/p-a022f356.entry.js +0 -1
  263. package/dist/web-components/p-a7e7f8fa.entry.js +0 -1
  264. package/dist/web-components/p-b2f03016.entry.js +0 -1
  265. package/dist/web-components/p-c300c22f.entry.js +0 -1
  266. package/dist/web-components/p-c937bd92.entry.js +0 -1
  267. package/dist/web-components/p-cbcd7699.entry.js +0 -1
  268. package/dist/web-components/p-d93c240d.entry.js +0 -1
  269. package/dist/web-components/p-e4b66277.entry.js +0 -1
  270. package/dist/web-components/p-e6a31881.entry.js +0 -1
  271. package/dist/web-components/p-f6a92287.entry.js +0 -1
  272. package/dist/web-components/p-f770e22b.entry.js +0 -1
  273. package/dist/web-components/p-f952161b.entry.js +0 -1
@@ -2271,7 +2271,9 @@ const InputPhoneNumber = class {
2271
2271
  return;
2272
2272
  if (this.error)
2273
2273
  return;
2274
- this.getValidityStateData();
2274
+ const { validityState, validityMessage } = this.getValidityStateData();
2275
+ this.validityState = validityState;
2276
+ this.validityMessage = validityMessage;
2275
2277
  const isValid = this.validityState === 'valid';
2276
2278
  this.valid = isValid;
2277
2279
  this.invalid = !isValid;
@@ -2282,22 +2284,25 @@ const InputPhoneNumber = class {
2282
2284
  };
2283
2285
  this.getValidityStateData = () => {
2284
2286
  var _a, _b;
2287
+ let validityState = '';
2288
+ let validityMessage = '';
2285
2289
  if (!this.required && !((_a = this.phoneNumber) === null || _a === void 0 ? void 0 : _a.length)) {
2286
- this.validityState = 'valid';
2287
- return;
2290
+ validityState = 'valid';
2291
+ return { validityState, validityMessage };
2288
2292
  }
2289
2293
  if (!((_b = this.phoneNumber) === null || _b === void 0 ? void 0 : _b.length)) {
2290
- this.validityState = 'valueMissing';
2291
- this.validityMessage = this.valueMissingMessage;
2292
- return;
2294
+ validityState = 'valueMissing';
2295
+ validityMessage = this.valueMissingMessage;
2296
+ return { validityState, validityMessage };
2293
2297
  }
2294
2298
  const isPhoneNumberValid = this.countryCode ? this.getPhoneValidationResult(this.phoneNumber, this.countryCode).isValid : false;
2295
2299
  if (!isPhoneNumberValid) {
2296
- this.validityState = 'invalid';
2297
- this.validityMessage = this.customErrorMessage;
2298
- return;
2300
+ validityState = 'invalid';
2301
+ validityMessage = this.customErrorMessage;
2302
+ return { validityState, validityMessage };
2299
2303
  }
2300
- this.validityState = 'valid';
2304
+ validityState = 'valid';
2305
+ return { validityState, validityMessage };
2301
2306
  };
2302
2307
  this.onSubmitForm = (event) => {
2303
2308
  if (this.isNoValidate)
@@ -2339,6 +2344,14 @@ const InputPhoneNumber = class {
2339
2344
  this.customErrorMessage = message;
2340
2345
  this.validateFormElement(this.nativeElement);
2341
2346
  }
2347
+ /**
2348
+ * Validates the input phone number without triggering UI and returns a boolean indicating its validity.
2349
+ * @returns A boolean indicating whether the input phone number is valid.
2350
+ */
2351
+ async checkValidity() {
2352
+ const { validityState } = this.getValidityStateData();
2353
+ return validityState === 'valid';
2354
+ }
2342
2355
  /** Check validity and reveal validation state. */
2343
2356
  async reportValidity() {
2344
2357
  this.validateFormElement(this.nativeElement);
@@ -2479,14 +2492,10 @@ const InputPhoneNumber = class {
2479
2492
  this.disconnectEventListeners();
2480
2493
  }
2481
2494
  render() {
2482
- const { label, fieldIndicator, hint, name, form, inputLabel, tooltip, tooltipIcon, tooltipIconColor, disabled, uniqueId, required, valid, invalid, novalidate, phoneNumber, fullPhoneNumber, fullWidth } = this;
2483
- // DEPRECATED: will be removed in November 2025 release.
2484
- const tooltipAttrs = tooltip ? {
2485
- tooltip,
2486
- 'tooltip-icon': tooltipIcon,
2487
- 'tooltip-icon-color': tooltipIconColor,
2488
- } : {};
2489
- const labelAttr = Object.assign({ fieldIndicator }, tooltipAttrs);
2495
+ const { label, fieldIndicator, hint, name, form, inputLabel, disabled, uniqueId, required, valid, invalid, novalidate, phoneNumber, fullPhoneNumber, fullWidth } = this;
2496
+ const labelAttr = {
2497
+ fieldIndicator
2498
+ };
2490
2499
  const inputAttrs = {
2491
2500
  id: uniqueId,
2492
2501
  form,
@@ -2496,10 +2505,9 @@ const InputPhoneNumber = class {
2496
2505
  disabled,
2497
2506
  'aria-describedby': this.ariaDescribedBy
2498
2507
  };
2499
- return (h(Host, { key: '87f5720347e3627524f95f7110088b8eddef7f8f' }, h("div", { key: '091e2048f011ff4167b35434567149de061954bd', class: "r-input-phone-number--label-container" }, h("label", { key: '80994d1cfd1b6f2228fb231f64894e660bdb1a1c', id: `${uniqueId}-label` }, label &&
2500
- h("r-label", Object.assign({ key: '36fa07371ee2c9d37645060a29f2d6f4ffe66342' }, labelAttr), label)), h("slot", { key: '76034d24a4208a46ee92185221256b9b5e87f971', name: "popover" })), hint &&
2501
- h("r-hint", { key: '574a0ec6541310640594eed29e0c301f5f9a01f7', id: `${uniqueId}-hint`, role: "note" }, hint), h("div", { key: '63f37ce77a8e247091e0e6bf55632a834e19992d', class: "r-input-phone-number", role: "group", "aria-labelledby": `${uniqueId}-label`, "aria-describedby": this.ariaDescribedBy }, h("slot", { key: '36f3e834567d3ce77b6d89ae3e835eee630675b7' }), h("r-input", { key: '2f8dc7a95823b3107d8e24f90ae53791554c19af', label: inputLabel, value: phoneNumber, internal: true, valid: valid, invalid: invalid, required: required, readonly: this.readonly, novalidate: true, fullWidth: fullWidth, type: "tel", error: this.errorMessage || '', onRInput: this.handleOnInput, onRChange: this.handleInputOnChange, disabled: disabled }, valid && phoneNumber &&
2502
- h("r-icon", { key: '4559b1d4c55e35b2ef9560554a62d4742bca875e', slot: "trailing", name: "circled-check", size: "s", color: "var(--r-status-success-regular)" }))), h("input", Object.assign({ key: 'c68a9255419c41e8b9fc02127d5f3b68cd14f40b', type: "hidden" }, inputAttrs, { readonly: this.readonly, value: fullPhoneNumber, ref: el => this.nativeElement = el })), h("r-hint", { key: '43712e3a6b916945b1a00d3c6d8ace5f7bdcc1d7', "aria-live": "polite", "aria-atomic": "true", id: `${uniqueId}-message`, class: !this.hasMessage && 'visually-hidden', variant: "error" }, this.hasMessage ? (this.hasError ? this.error : this.validityMessage) : '')));
2508
+ return (h(Host, { key: '97edc0f9bbc4a3823e628bb08be3b3abbbcfe6ec' }, h("div", { key: '8a5236c58655d47368bfaa9bcea6bde3c39c6a22', class: "r-input-phone-number--label-container" }, h("label", { key: 'ae6e6e72381864d67d98f4429856cf5b1943943c', id: `${uniqueId}-label` }, label &&
2509
+ h("r-label", Object.assign({ key: 'd760960dbf5806084b0a10d14fef218ca5e4cd79' }, labelAttr), label)), h("slot", { key: '4f9bcaba34f2f49592a3167958bd091eeac9f6be', name: "popover" })), hint &&
2510
+ h("r-hint", { key: '0c3f402b7f9369dcea2c84478e12ed0ea241fd0a', id: `${uniqueId}-hint`, role: "note" }, hint), h("div", { key: '43e5dbd9ca897cfc2ca05e6ab020c321871f3961', class: "r-input-phone-number", role: "group", "aria-labelledby": `${uniqueId}-label`, "aria-describedby": this.ariaDescribedBy }, h("slot", { key: '4e3f891eb21f15927d6a33e7ba6728c09d20e981' }), h("r-input", { key: '6bd6e929e396bf515511fdd978d00df9de54cc37', label: inputLabel, value: phoneNumber, internal: true, valid: valid, invalid: invalid, required: required, readonly: this.readonly, novalidate: true, fullWidth: fullWidth, type: "tel", error: this.errorMessage || '', onRInput: this.handleOnInput, onRChange: this.handleInputOnChange, disabled: disabled })), h("input", Object.assign({ key: 'f113123ef2fa2096b686d132ce11ca11970ab1be', type: "hidden" }, inputAttrs, { readonly: this.readonly, value: fullPhoneNumber, ref: el => this.nativeElement = el })), h("r-hint", { key: 'd00477c3a27f999c4a3079710c34266ed47e0e57', "aria-live": "polite", "aria-atomic": "true", id: `${uniqueId}-message`, class: !this.hasMessage && 'visually-hidden', variant: "error" }, this.hasMessage ? (this.hasError ? this.error : this.validityMessage) : '')));
2503
2511
  }
2504
2512
  get host() { return getElement(this); }
2505
2513
  static get watchers() { return {
@@ -1,12 +1,11 @@
1
1
  import { r as registerInstance, c as createEvent, h, H as Host, g as getElement } from './index-Da7qOBFr.js';
2
2
  import { a as appendControlToFormData } from './formData-DvLT8-y3.js';
3
3
 
4
- const inputCss = ":host{display:inline-flex;flex-direction:column;vertical-align:top;--r-label--margin-bottom:0}:host slot{display:contents}:host([readonly]:not([readonly=false])){--r-input--container--background-color:var(--r-background-soft, #f3f1f0);--r-input--container--border-color:transparent transparent var(--r-border-soft, #686868) transparent;--r-input--container--cursor:text}:host(:hover:not([disabled]:not([disabled=false])):not([readonly]:not([readonly=false]))){--r-input--container--background-color:var(--r-background-interactive-hovered, rgba(40, 40, 40, 0.04))}:host(.focused){--r-input--container--box-shadow:0 0 0 6px var(--r-border-focused-outlined);--r-input--container--outline:2px solid var(--r-border-focused);--r-input--container--outline-offset:2px}:host(:active:not([disabled]:not([disabled=false])):not([readonly]:not([readonly=false]))){--r-input--container--background-color:var(--r-background-interactive-pressed, rgba(40, 40, 40, 0.12))}:host([expanded]:not([expanded=false])),:host([full-width]:not([full-width=false])){display:block}:host([disabled]:not([disabled=false])){--r-input--container--opacity:0.4;--r-input--container--cursor:not-allowed;--r-input--container--pointer-events:none;--r-input--container--background-color:transparent}:host([invalid]:not([invalid=false])){--r-input--container--border-color:var(--r-status-error-regular, #b00c15);--r-input--container--background-color:var(--r-status-error-soft, #fef6f6)}.r-input{display:var(--r-input--display, flex);flex:var(--r-input--flex, 1);flex-direction:var(--r-input--flex-direction, column);width:var(--r-input--width, auto);font-family:var(--r-input--font-family, system-ui);position:var(--r-input--position, relative);border-radius:var(--r-input--border-radius, 0);cursor:var(--r-input--cursor, inherit)}.r-input--label-container{display:var(--r-input--label-container--display, flex);gap:var(--r-input--label-container--gap, var(--r-spacing-100, 1rem));align-items:var(--r-input--label-container--align-items, center);justify-content:var(--r-input--label-container--align-items, space-between)}.r-input--label-container ::slotted([slot=popover]){display:var(--r-input--popover--display, inline-flex);height:var(--r-input--popover--height, var(--r-spacing-150, 1.5));align-items:var(--r-input--popover--align-items, center);justify-content:var(--r-input--popover--justify-content, center);margin-right:var(--r-input--popover--margin-right, -0.25rem);--r-popover--trigger--min-width:var(--r-input--popover-trigger--min-width, var(--r-spacing-150, 1.5));--r-popover--trigger--min-height:var(--r-input--popover--trigger--min-height, var(--r-spacing-150, 1.5))}.r-input--label{cursor:var(--r-input--label--cursor, inherit)}.r-input--input{font-family:var(--r-input--input--font-family, system-ui);font-size:var(--r-input--input--font-size, 1em);width:var(--r-input--input--width, 100%);max-width:var(--r-input--input--max-width, 100%);height:var(--r-input--input--height, var(--r-spacing-275, 2.75rem));border-radius:var(--r-input--input--border-radius, 0);border:var(--r-input--input--border, none);color:var(--r-input--input--color, var(--r-text-regular, #282828));background-color:var(--r-input--input--background-color, none);appearance:var(--r-input--input--appearance, none);box-sizing:var(--r-input--input--box-sizing, border-box);outline:var(--r-input--input--outline, none);cursor:var(--r-input--input--cursor, inherit);pointer-events:var(--r-input--input--pointer-events, auto)}.r-input--input:autofill,.r-input--input:-webkit-autofill{-webkit-background-clip:text !important}.r-input--input::-ms-reveal{display:var(--r-input--input--ms-reveal--display, none)}.r-input--input::placeholder{color:var(--r-input--input--placeholder--color, var(--r-text-soft, #686868))}.r-input--input[type=search]::-webkit-search-cancel-button{cursor:var(--r-input--input-clear--cursor, pointer);display:var(--r-input--input-clear--display, block);height:var(--r-input--input-clear--height, 0.875rem);width:var(--r-input--input-clear--width, 0.875rem);appearance:var(--r-input--input-clear--appearance, none);background-repeat:var(--r-input--input-clear--background-repeat, no-repeat);background-image:var(--r-input--input-clear--background-image, url(\"data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20fill%3D%22none%22%20stroke-width%3D%221.5%22%20viewBox%3D%220.75%200.75%2022.5%2022.5%22%3E%3Cpath%20id%3D%22Vector%202269%22%20stroke%3D%22currentColor%22%20d%3D%22M1.5%201.5L22.5%2022.5%22%2F%3E%3Cpath%20id%3D%22Vector%202270%22%20stroke%3D%22currentColor%22%20d%3D%22M22.5%201.5L1.5%2022.5%22%2F%3E%3C%2Fsvg%3E\"));background-size:var(--r-input--input-clear--background-size, contain);margin-inline:var(--r-input--input-clear--margin-inline, 0);color:currentColor}.r-input--button{position:var(--r-input--icon-button--position, absolute);width:var(--r-input--icon-button--width, calc(1.125em + var(--r-input--icon--width)));height:var(--r-input--icon-button--height, 100%);top:var(--r-input--icon-button--top, 0);right:var(--r-input--icon-button--right, auto);bottom:var(--r-input--icon-button--bottom, auto);left:var(--r-input--icon-button--left, 0);cursor:var(--r-input--icon-button--cursor, inherit)}.r-input--container{position:var(--r-input--container--position, relative);display:var(--r-input--container--display, flex);align-items:var(--r-input--container--align-items, center);gap:var(--r-input--container--gap, 0.625rem);height:var(--r-input--container--height, var(--r-spacing-275, 2.75rem));background-color:var(--r-input--container--background-color, var(--r-background-softest, #fff));border-width:var(--r-input--container--border-width, 1px);border-style:var(--r-input--container--border-style, solid);border-color:var(--r-input--container--border-color, var(--r-border-soft, #686868));box-sizing:var(--r-input--container--box-sizing, border-box);box-shadow:var(--r-input--container--box-shadow, none);outline:var(--r-input--container--outline, none);outline-offset:var(--r-input--container--outline-offset, 0);padding-top:var(--r-input--container--padding-top, 0.6875rem);padding-right:var(--r-input--container--padding-right, var(--r-spacing-075, 0.75rem));padding-bottom:var(--r-input--container--padding-bottom, 0.6875rem);padding-left:var(--r-input--container--padding-left, var(--r-spacing-0275, 0.75rem));opacity:var(--r-input--container--opacity, 1);pointer-events:var(--r-input--container--pointer-events, auto);line-height:var(--r-input--container--line-height, 1);cursor:var(--r-input--container--cursor, inherit);margin-top:var(--r-input--container--margin-top, var(--r-spacing-025, 0.25rem))}.r-input--container slot[name=leading]{color:var(--r-input--container-leading--color, var(--r-icon-soft, #686868))}.r-input--message:has(r-hint),.r-input--message ::slotted([slot=message]){margin-top:var(--r-input--message--margin-top, var(--r-spacing-025, 0.25rem))}.r-input--trailing{display:var(--r-input--trailing--display, flex);margin-left:var(--r-input--trailing--margin-left, auto);align-items:var(--r-input--trailing--align-items, center);gap:var(--r-input--trailing--gap, 0.625rem)}.r-input--readonly-icon{color:var(--r-input--readonly-icon--color, var(--r-icon-soft, #686868))}.visually-hidden{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0, 0, 0, 0);border:0}";
4
+ const inputCss = ":host{display:inline-flex;flex-direction:column;vertical-align:top;--r-label--margin-bottom:0}:host slot{display:contents}:host([readonly]:not([readonly=false])){--r-input--container--background-color:var(--r-background-soft, #f3f1f0);--r-input--container--border-color:transparent transparent var(--r-border-soft, #686868) transparent;--r-input--container--cursor:text}:host(:hover:not([disabled]:not([disabled=false])):not([readonly]:not([readonly=false]))){--r-input--container--background-color:var(--r-background-interactive-hovered, rgba(40, 40, 40, 0.04))}:host(.focused){--r-input--container--box-shadow:0 0 0 6px var(--r-border-focused-outlined);--r-input--container--outline:2px solid var(--r-border-focused);--r-input--container--outline-offset:2px}:host(:active:not([disabled]:not([disabled=false])):not([readonly]:not([readonly=false]))){--r-input--container--background-color:var(--r-background-interactive-pressed, rgba(40, 40, 40, 0.12))}:host([expanded]:not([expanded=false])),:host([full-width]:not([full-width=false])){display:block}:host([disabled]:not([disabled=false])){--r-input--container--opacity:0.4;--r-input--container--cursor:not-allowed;--r-input--container--pointer-events:none;--r-input--container--background-color:transparent}:host([invalid]:not([invalid=false])){--r-input--container--border-color:var(--r-status-error-regular, #b00c15);--r-input--container--background-color:var(--r-status-error-soft, #fef6f6)}.r-input{display:var(--r-input--display, flex);flex:var(--r-input--flex, 1);flex-direction:var(--r-input--flex-direction, column);width:var(--r-input--width, auto);font-family:var(--r-input--font-family, system-ui);position:var(--r-input--position, relative);border-radius:var(--r-input--border-radius, 0);cursor:var(--r-input--cursor, inherit)}.r-input--label-container{display:var(--r-input--label-container--display, flex);gap:var(--r-input--label-container--gap, var(--r-spacing-100, 1rem));align-items:var(--r-input--label-container--align-items, center);justify-content:var(--r-input--label-container--align-items, space-between)}.r-input--label-container ::slotted([slot=popover]){display:var(--r-input--popover--display, inline-flex);height:var(--r-input--popover--height, var(--r-spacing-150, 1.5));align-items:var(--r-input--popover--align-items, center);justify-content:var(--r-input--popover--justify-content, center);margin-right:var(--r-input--popover--margin-right, -0.25rem);--r-popover--trigger--min-width:var(--r-input--popover-trigger--min-width, var(--r-spacing-150, 1.5));--r-popover--trigger--min-height:var(--r-input--popover--trigger--min-height, var(--r-spacing-150, 1.5))}.r-input--label{cursor:var(--r-input--label--cursor, inherit)}.r-input--input{font-family:var(--r-input--input--font-family, system-ui);font-size:var(--r-input--input--font-size, 1em);width:var(--r-input--input--width, 100%);max-width:var(--r-input--input--max-width, 100%);height:var(--r-input--input--height, var(--r-spacing-275, 2.75rem));border-radius:var(--r-input--input--border-radius, 0);border:var(--r-input--input--border, none);color:var(--r-input--input--color, var(--r-text-regular, #282828));background-color:var(--r-input--input--background-color, none);appearance:var(--r-input--input--appearance, none);box-sizing:var(--r-input--input--box-sizing, border-box);outline:var(--r-input--input--outline, none);cursor:var(--r-input--input--cursor, inherit);pointer-events:var(--r-input--input--pointer-events, auto)}.r-input--input:autofill,.r-input--input:-webkit-autofill{-webkit-background-clip:text !important}.r-input--input::-ms-reveal{display:var(--r-input--input--ms-reveal--display, none)}.r-input--input::placeholder{color:var(--r-input--input--placeholder--color, var(--r-text-soft, #686868))}.r-input--input[type=search]::-webkit-search-cancel-button{cursor:var(--r-input--input-clear--cursor, pointer);display:var(--r-input--input-clear--display, block);height:var(--r-input--input-clear--height, 0.875rem);width:var(--r-input--input-clear--width, 0.875rem);appearance:var(--r-input--input-clear--appearance, none);background-repeat:var(--r-input--input-clear--background-repeat, no-repeat);background-image:var(--r-input--input-clear--background-image, url(\"data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20fill%3D%22none%22%20stroke-width%3D%221.5%22%20viewBox%3D%220.75%200.75%2022.5%2022.5%22%3E%3Cpath%20id%3D%22Vector%202269%22%20stroke%3D%22currentColor%22%20d%3D%22M1.5%201.5L22.5%2022.5%22%2F%3E%3Cpath%20id%3D%22Vector%202270%22%20stroke%3D%22currentColor%22%20d%3D%22M22.5%201.5L1.5%2022.5%22%2F%3E%3C%2Fsvg%3E\"));background-size:var(--r-input--input-clear--background-size, contain);margin-inline:var(--r-input--input-clear--margin-inline, 0);color:currentColor}.r-input--button{position:var(--r-input--icon-button--position, absolute);width:var(--r-input--icon-button--width, calc(1.125em + var(--r-input--icon--width)));height:var(--r-input--icon-button--height, 100%);top:var(--r-input--icon-button--top, 0);right:var(--r-input--icon-button--right, auto);bottom:var(--r-input--icon-button--bottom, auto);left:var(--r-input--icon-button--left, 0);cursor:var(--r-input--icon-button--cursor, inherit)}.r-input--container{position:var(--r-input--container--position, relative);display:var(--r-input--container--display, flex);align-items:var(--r-input--container--align-items, center);gap:var(--r-input--container--gap, 0.625rem);height:var(--r-input--container--height, var(--r-spacing-275, 2.75rem));background-color:var(--r-input--container--background-color, var(--r-background-softest, #fff));border-width:var(--r-input--container--border-width, 1px);border-style:var(--r-input--container--border-style, solid);border-color:var(--r-input--container--border-color, var(--r-border-soft, #686868));box-sizing:var(--r-input--container--box-sizing, border-box);box-shadow:var(--r-input--container--box-shadow, none);outline:var(--r-input--container--outline, none);outline-offset:var(--r-input--container--outline-offset, 0);padding-top:var(--r-input--container--padding-top, 0.6875rem);padding-right:var(--r-input--container--padding-right, var(--r-spacing-075, 0.75rem));padding-bottom:var(--r-input--container--padding-bottom, 0.6875rem);padding-left:var(--r-input--container--padding-left, var(--r-spacing-0275, 0.75rem));opacity:var(--r-input--container--opacity, 1);pointer-events:var(--r-input--container--pointer-events, auto);line-height:var(--r-input--container--line-height, 1);cursor:var(--r-input--container--cursor, inherit);margin-top:var(--r-input--container--margin-top, var(--r-spacing-025, 0.25rem))}.r-input--container slot[name=leading]{color:var(--r-input--container-leading--color, var(--r-icon-soft, #686868))}.r-input--message:has(r-hint),.r-input--message ::slotted([slot=message]){margin-top:var(--r-input--message--margin-top, var(--r-spacing-025, 0.25rem))}.r-input--trailing{display:var(--r-input--trailing--display, flex);margin-left:var(--r-input--trailing--margin-left, auto);align-items:var(--r-input--trailing--align-items, center);gap:var(--r-input--trailing--gap, 0.625rem)}.r-input--validation-icon{display:var(--r-input--validation-icon--display, inline-block)}.r-input--readonly-icon{color:var(--r-input--readonly-icon--color, var(--r-icon-soft, #686868))}.visually-hidden{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0, 0, 0, 0);border:0}";
5
5
 
6
6
  const RInput = class {
7
7
  constructor(hostRef) {
8
8
  registerInstance(this, hostRef);
9
- this.rClickIcon = createEvent(this, "rClickIcon");
10
9
  this.rValidate = createEvent(this, "rValidate");
11
10
  this.rInput = createEvent(this, "rInput");
12
11
  this.rBlur = createEvent(this, "rBlur");
@@ -23,24 +22,19 @@ const RInput = class {
23
22
  */
24
23
  this.value = '';
25
24
  /**
26
- * @deprecated Will be removed November 2025.
27
- * Position of legacy icon: `start` | `end`.
28
- */
29
- this.iconPosition = 'start';
30
- /**
31
- * @deprecated Will be removed November 2025.
32
- * Legacy boolean to show a validation marker icon.
33
- */
34
- this.validMarker = false;
35
- /**
36
- * @deprecated Will be removed November 2025.
37
- * Icon name used when `validMarker` is active and state is valid.
38
- */
39
- this.validMarkerIcon = 'circled-check';
25
+ * When `true` field renders valid/invalid marker within.
26
+ */
27
+ this.validityMarker = true;
40
28
  /** Validity state passed from validateFormElement function after validation */
41
29
  this.validityState = '';
42
30
  /** Validity message passed from validateFormElement function after validation */
43
31
  this.validityMessage = '';
32
+ /** Defines if the component has been touched by user */
33
+ this.touched = false;
34
+ /** Defines if the value has been changed by user interaction */
35
+ this.dirty = false;
36
+ /** Private flag to prevent validation during reset */
37
+ this.isResetting = false;
44
38
  this.nativeElement = null;
45
39
  this.uniqueId = `r-input-${Date.now().toString(32)}${Math.random().toString(32)}`.replace(/\./g, '');
46
40
  /**
@@ -48,16 +42,29 @@ const RInput = class {
48
42
  * */
49
43
  this.initial = {};
50
44
  this.getValidityStateData = (element) => {
45
+ let validityState = '';
46
+ let validityMessage = '';
47
+ if (this.type === 'email' && this.pattern) {
48
+ element.setCustomValidity('');
49
+ validityState = this.validEmailPattern ? 'valid' : 'patternMismatch';
50
+ validityMessage = this.validEmailPattern ? '' : this.patternMismatchMessage;
51
+ return { validityState, validityMessage };
52
+ }
51
53
  for (const state in element.validity) {
52
54
  if (element.validity[state]) {
53
- this.validityState = state;
54
- if (this[state + 'Message']) {
55
- this.validityMessage = this[state + 'Message'];
56
- return;
55
+ validityState = state;
56
+ const customMessage = this[state + 'Message'];
57
+ if (customMessage) {
58
+ validityMessage = customMessage;
59
+ return { validityState, validityMessage };
57
60
  }
58
- this.validityMessage = element.validationMessage;
61
+ validityMessage = element.validationMessage;
62
+ // Found an error, use it even if no custom message
63
+ return { validityState, validityMessage };
59
64
  }
60
65
  }
66
+ // No errors found, field is valid
67
+ return { validityState: 'valid', validityMessage: '' };
61
68
  };
62
69
  this.validateFormElement = (element) => {
63
70
  if (element === null)
@@ -66,13 +73,13 @@ const RInput = class {
66
73
  return;
67
74
  if (this.error)
68
75
  return;
69
- if (this.type === 'email' && this.pattern) {
70
- element.setCustomValidity('');
71
- this.validityState = this.validEmailPattern ? 'valid' : 'patternMismatch';
72
- this.validityMessage = this.validEmailPattern ? '' : this.patternMismatchMessage;
76
+ // Trigger browser validation to populate validity states
77
+ if (element.checkValidity) {
78
+ element.checkValidity();
73
79
  }
74
- else
75
- this.getValidityStateData(element);
80
+ const { validityState, validityMessage } = this.getValidityStateData(element);
81
+ this.validityState = validityState;
82
+ this.validityMessage = validityMessage;
76
83
  const isValid = this.validityState === 'valid';
77
84
  this.valid = isValid;
78
85
  this.invalid = !isValid;
@@ -85,6 +92,8 @@ const RInput = class {
85
92
  if (this.readonly)
86
93
  return;
87
94
  this.value = event.target.value;
95
+ this.touched = true;
96
+ this.dirty = true;
88
97
  const { host, value } = this;
89
98
  this.rInput.emit({ element: host, value });
90
99
  };
@@ -92,11 +101,14 @@ const RInput = class {
92
101
  if (this.readonly)
93
102
  return;
94
103
  this.value = event.target.value;
104
+ this.touched = true;
105
+ this.dirty = true;
95
106
  const { host, value } = this;
96
107
  this.rChange.emit({ element: host, value });
97
108
  };
98
109
  this.onBlur = () => {
99
110
  this.host.classList.remove('focused');
111
+ this.touched = true;
100
112
  this.validateFormElement(this.nativeElement);
101
113
  this.rBlur.emit();
102
114
  };
@@ -110,17 +122,25 @@ const RInput = class {
110
122
  this.onResetForm = () => {
111
123
  if (this.readonly)
112
124
  return;
125
+ this.isResetting = true;
126
+ this.markAsPristine();
113
127
  this.validityState = null;
114
128
  this.validityMessage = null;
115
- this.setValue(this.initial['value']);
129
+ // Restore initial value without triggering validation
130
+ if (this.nativeElement) {
131
+ this.nativeElement.value = this.initial['value'] || '';
132
+ }
133
+ this.value = this.initial['value'];
116
134
  this.invalid = this.initial['invalid'];
117
135
  this.valid = !this.invalid;
136
+ this.isResetting = false;
118
137
  const { host, value } = this;
119
138
  this.rReset.emit({ element: host, value });
120
139
  };
121
140
  this.onSubmitForm = (event) => {
122
141
  if (this.isNoValidate)
123
142
  return;
143
+ this.touched = true;
124
144
  this.validateFormElement(this.nativeElement);
125
145
  if (this.invalid) {
126
146
  event.preventDefault();
@@ -204,9 +224,39 @@ const RInput = class {
204
224
  * Set the current value programmatically (does not fire native input/change automatically).
205
225
  */
206
226
  async setValue(value) {
207
- this.nativeElement.value = value;
227
+ if (this.nativeElement) {
228
+ this.nativeElement.value = value;
229
+ }
230
+ this.value = value;
208
231
  this.validateFormElement(this.nativeElement);
209
232
  }
233
+ /**
234
+ * Validates the input without triggering UI and returns a boolean indicating its validity.
235
+ * @returns A boolean indicating whether the input is valid.
236
+ */
237
+ async checkValidity() {
238
+ const { validityState } = this.getValidityStateData(this.nativeElement);
239
+ return validityState === 'valid';
240
+ }
241
+ /**
242
+ * Gets the touched state (whether user has interacted with the input)
243
+ */
244
+ async isTouched() {
245
+ return this.touched;
246
+ }
247
+ /**
248
+ * Gets the dirty state (whether value has been changed by user)
249
+ */
250
+ async isDirty() {
251
+ return this.dirty;
252
+ }
253
+ /**
254
+ * Resets touched and dirty states to pristine (untouched/clean)
255
+ */
256
+ async markAsPristine() {
257
+ this.touched = false;
258
+ this.dirty = false;
259
+ }
210
260
  /** Identify wrapping form element */
211
261
  get parentFormEl() {
212
262
  return this.host.closest('form') || document.querySelector(`#${this.form}`) || null;
@@ -222,11 +272,8 @@ const RInput = class {
222
272
  get hasValidationError() {
223
273
  return (this.validityState !== 'valid' || this.invalid) && !!(this.validityMessage || this.customErrorMessage);
224
274
  }
225
- get hasValidationSuccess() {
226
- return (this.validityState === 'valid' || this.valid) && !!this.validMessage && this.showValid;
227
- }
228
275
  get hasMessage() {
229
- return this.hasError || this.hasValidationError || this.hasValidationSuccess;
276
+ return this.hasError || this.hasValidationError;
230
277
  }
231
278
  /**
232
279
  * Determine whether this element should be ignored
@@ -270,10 +317,15 @@ const RInput = class {
270
317
  this.disconnectFormEventListeners();
271
318
  }
272
319
  handleValueChange() {
273
- this.validateFormElement(this.nativeElement);
320
+ if (!this.isResetting) {
321
+ this.validateFormElement(this.nativeElement);
322
+ }
323
+ }
324
+ handleTypeChange() {
325
+ this.setValue(this.nativeElement.value);
274
326
  }
275
327
  render() {
276
- const { name, placeholder, required, fieldIndicator, maxlength, minlength, min, max, value, disabled, form, pattern, invalid, valid, validMarker, hint, label, internal, tooltip, tooltipIcon, tooltipIconColor, uniqueId, autocomplete, readonly, autofocus } = this;
328
+ const { name, placeholder, required, fieldIndicator, maxlength, minlength, min, max, value, disabled, form, pattern, invalid, valid, hint, label, internal, uniqueId, autocomplete, readonly, autofocus, passwordrules, validityMarker } = this;
277
329
  const inputAttrs = {
278
330
  disabled,
279
331
  readonly,
@@ -289,6 +341,7 @@ const RInput = class {
289
341
  pattern,
290
342
  autocomplete,
291
343
  autofocus: autofocus || null,
344
+ passwordrules,
292
345
  id: uniqueId,
293
346
  'data-value': value,
294
347
  'aria-placeholder': placeholder,
@@ -296,20 +349,25 @@ const RInput = class {
296
349
  'aria-required': `${required || false}`,
297
350
  'aria-describedby': this.ariaDescribedBy
298
351
  };
299
- // DEPRECATED: will be removed in November 2025 release.
300
- const tooltipAttrs = tooltip && !disabled ? {
301
- tooltip,
302
- 'tooltip-icon': tooltipIcon,
303
- 'tooltip-icon-color': tooltipIconColor,
352
+ const labelAttr = label ? {
353
+ id: `${uniqueId}-label`,
354
+ fieldIndicator
304
355
  } : {};
305
- const labelAttr = label ? Object.assign({ id: `${uniqueId}-label`, fieldIndicator }, tooltipAttrs) : {};
306
356
  const renderValidationMarker = () => {
307
- if (!validMarker)
308
- return null;
309
- if (!valid && !invalid)
357
+ const icons = {
358
+ valid: 'circled-check',
359
+ invalid: 'circled-exclamation-mark'
360
+ };
361
+ const colors = {
362
+ valid: '--r-status-success-regular',
363
+ invalid: '--r-status-error-regular'
364
+ };
365
+ const shouldShowValidMarker = !!validityMarker && !!valid && !!value;
366
+ const shouldShowInvalidMarker = !!validityMarker && !!invalid;
367
+ if (!shouldShowValidMarker && !shouldShowInvalidMarker)
310
368
  return null;
311
- const iconName = invalid ? 'circled-exclamation-mark' : 'circled-check';
312
- const iconColor = invalid ? '--r-status-error-regular' : '--r-status-success-regular';
369
+ const iconName = shouldShowInvalidMarker ? icons.invalid : icons.valid;
370
+ const iconColor = shouldShowInvalidMarker ? colors.invalid : colors.valid;
313
371
  return h("r-icon", { class: "r-input--validation-icon", "aria-hidden": true, size: "s", name: iconName, color: iconColor });
314
372
  };
315
373
  // Filter out event listener properties based on naming convention.
@@ -320,17 +378,18 @@ const RInput = class {
320
378
  }
321
379
  return acc;
322
380
  }, {});
323
- return (h(Host, { onClick: this.handleClick, onKeyup: this.handleKeyup }, h("div", { class: internal ? 'visually-hidden' : 'r-input--label-container' }, h("label", { htmlFor: uniqueId }, label ?
381
+ return (h(Host, { onClick: this.handleClick, onKeyup: this.handleKeyup, "data-touched": `${this.touched}`, "data-dirty": `${this.dirty}` }, h("div", { class: internal ? 'visually-hidden' : 'r-input--label-container' }, h("label", { htmlFor: uniqueId }, label ?
324
382
  h("r-label", Object.assign({ class: "r-input--label" }, labelAttr), label)
325
383
  :
326
384
  h("slot", { name: "label" })), h("slot", { name: "popover" })), hint &&
327
385
  h("r-hint", { id: `${uniqueId}-hint`, role: "note" }, hint), h("div", { class: "r-input--container" }, h("slot", { name: "leading" }), h("input", Object.assign({ class: "r-input--input", type: this.type }, inputAttrs, eventListeners, { ref: el => this.nativeElement = el, value: this.value, onInput: this.onInput, onChange: this.onChange, onBlur: this.onBlur, onFocus: this.onFocus })), h("div", { class: "r-input--trailing" }, this.readonly &&
328
386
  h("r-icon", { class: "r-input--readonly-icon", name: "pen-disabled", size: "s" }), renderValidationMarker(), this.hasTrailingSlot &&
329
- h("slot", { name: "trailing" }))), h("div", { id: `${uniqueId}-message`, "aria-live": !internal ? 'polite' : null, class: !internal ? 'r-input--message' : 'visually-hidden' }, h("slot", { name: "message" }, this.hasMessage && h("r-hint", { variant: valid ? 'success' : 'error' }, this.hasError && this.error, this.hasValidationError && (this.customErrorMessage || this.validityMessage), this.hasValidationSuccess && this.validMessage)))));
387
+ h("slot", { name: "trailing" }))), h("div", { id: `${uniqueId}-message`, "aria-live": !internal ? 'polite' : null, class: !internal ? 'r-input--message' : 'visually-hidden' }, h("slot", { name: "message" }, this.hasMessage && h("r-hint", { variant: valid ? 'success' : 'error' }, this.hasError && this.error, this.hasValidationError && (this.customErrorMessage || this.validityMessage))))));
330
388
  }
331
389
  get host() { return getElement(this); }
332
390
  static get watchers() { return {
333
- "value": ["handleValueChange"]
391
+ "value": ["handleValueChange"],
392
+ "type": ["handleTypeChange"]
334
393
  }; }
335
394
  };
336
395
  RInput.style = inputCss;
@@ -1,6 +1,6 @@
1
1
  import { r as registerInstance, h, F as Fragment, H as Host, g as getElement } from './index-Da7qOBFr.js';
2
2
 
3
- const listItemCss = ":host([alignment=top]){--r-list-item--trailing-text--font-weight:bold;--r-list-item--trailing--align-self:start}:host([alignment=bottom]) .r-list-item{--r-list-item--trailing--align-self:end}:host([divider]:not([divider=false])){--r-list-item--border-color:var(--r-border-soft, #686868);--r-list-item--border-width:0 0 1px 0}:host([active]) .r-list-item{--r-list-item--background-color:var(--r-background-interactive-pressed, rgba(40, 40, 40, 0.12))}:host([variant=navitem]:not([active]):hover:not([disabled]:not([disabled=false])))>.r-list-item,:host([href]:not([active]):hover:not([disabled]:not([disabled=false])))>.r-list-item{--r-list-item--cursor:pointer;--r-list-item--background-color:var(--r-background-interactive-hovered, rgba(40, 40, 40, 0.04))}:host([variant=navitem][has-sub-items]:hover:not([disabled]:not([disabled=false])))>.r-list-item-wrapper>.r-list-item{--r-list-item--cursor:pointer;--r-list-item--background-color:var(--r-background-interactive-hovered, rgba(40, 40, 40, 0.04))}:host([variant=navitem][has-sub-items]:has([active]):hover:not([disabled]:not([disabled=false])))>.r-list-item-wrapper>.r-list-item{--r-list-item--cursor:pointer;--r-list-item--background-color:transparent}:host([variant=navitem][expanded])>.r-list-item-wrapper>.r-list-item{--r-list-item--headline--font-weight:600;--r-list-item--trailing-icon--transform:rotate(180deg);--r-list-item--trailing-icon--color:var(--r-icon-regular, #282828)}:host([variant=navitem][active-parent]:not([expanded])),:host([variant=navitem][active]:not([expanded])){--r-list-item--background-color:var(--r-background-interactive-activated, rgba(40, 40, 40, 0.08))}:host([variant=subitem]) .r-list-item{--r-list-item--margin-left:27px;--r-list-item--border-width:0 0 0 1px;--r-list-item--border-color:var(--r-border-soft, #686868)}:host([variant=subitem][active]) .r-list-item{--r-list-item--background-color:var(--r-background-interactive-pressed, rgba(40, 40, 40, 0.12))}:host(:focus-visible:not(:active)) .r-list-item{--r-list-item--box-shadow:0 0 0 6px var(--r-border-focused-outlined, #fff);--r-list-item--outline:2px solid var(--r-border-focused, #0071e3);--r-list-item--outline-offset:2px}:host(:focus-within) .r-list-item[href]{--r-list-item--box-shadow:0 0 0 6px var(--r-border-focused-outlined, #fff);--r-list-item--outline:2px solid var(--r-border-focused, #0071e3);--r-list-item--outline-offset:2px}:host([disabled]:not([disabled=false])){cursor:not-allowed;--r-list-item--background-color:transparent}:host([disabled]:not([disabled=false])[divider]:not([divider=false])){--r-list-item--border-color:rgba(104,104,104, 0.4);--r-list-item--leading-icon--color:rgba(104,104,104, 0.4)}:host([truncate-description]:not([truncate-description=false])){--r-list-item--description--white-space:nowrap}:host{display:var(--display, block);pointer-events:var(--pointer-events, auto);outline:var(--outline, none);font-family:var(--font-family, var(--r-font-family-text, system-ui));line-height:var(--line-height, var(--r-line-height-m, 1.5));color:var(--color, var(--r-text-regular, #282828))}.r-list-item{display:var(--r-list-item--display, flex);align-items:var(--r-list-item--align-items, center);justify-content:var(--r-list-item--justify-content, center);gap:var(--r-list-item--gap, 16px);width:var(--r-list-item--width, inherit);padding:var(--r-list-item--padding, 16px);margin-left:var(--r-list-item--margin-left, 0);opacity:var(--r-list-item--opacity, 1);color:var(--r-list-item--color, inherit);box-shadow:var(--r-list-item--box-shadow, none);outline:var(--r-list-item--outline, none);outline-offset:var(--r-list-item--outline-offset, 0);text-decoration:var(--r-list-item--text-decoration, none);background-color:var(--r-list-item--background-color, transparent);border-style:var(--r-list-item--border-style, solid);border-width:var(--r-list-item--border-width, 0);border-color:var(--r-list-item--border-color, transparent);cursor:var(--r-list-item--cursor, inherit);font-weight:var(--r-list-item--font-weight, var(--r-font-weight-regular, 400));outline:var(--r-list-item--outline, none)}.r-list-item--leading{color:var(--r-list-item--leading--color, var(--r-icon-soft, #686868))}.r-list-item--leading-icon{color:var(--r-list-item--leading-icon--color, var(--r-icon-soft, #686868))}.r-list-item--trailing{display:var(--r-list-item--trailing--display, flex);align-self:var(--r-list-item--trailing--align-self, center);gap:var(--r-list-item--trailing--gap, 8px);color:var(--r-list-item--trailing--color, inherit)}.r-list-item--trailing-icon{transition:var(--r-list-item--trailing-icon--transition, transform 250ms ease-in-out);transform:var(--r-list-item--trailing-icon--transform, rotate(0deg));color:var(--r-list-item--trailing-icon--color, inherit)}.r-list-item--trailing-text{font-weight:var(--r-list-item--trailing-text--font-weight, 400);white-space:var(--r-list-item--trailing-text--white-space, nowrap)}.r-list-item--trailing ::slotted(*){display:var(--r-list-item--trailing-slotted--display, flex);gap:var(--r-list-item--trailing-slotted--display, 8px)}.r-list-item--text{display:var(--r-list-item--text--display, flex);flex-grow:var(--r-list-item--text--flex-grow, 1);flex-direction:var(--r-list-item--text--flex-direction, column);gap:var(--r-list-item--text--gap, 2px);white-space:var(--r-list-item--text--white-space, normal);overflow:var(--r-list-item--text--overflow, hidden);text-overflow:var(--r-list-item--text--text-overflow, ellipsis);font-weight:var(--r-list-item--trailing-text--font-weight, inherit)}.r-list-item--headline{font-size:var(--r-list-item--headline--font-size, 1rem);font-weight:var(--r-list-item--headline--font-weight, 600);line-height:var(--r-list-item--headline--line-height, 1.5);color:var(--r-list-item--headline--color, inherit)}.r-list-item--subtext,.r-list-item--description{font-size:var(--r-list-item--description--font-size, var(--r-list-item--subtext--font-size, 1rem));font-weight:var(--r-list-item--description--font-weight, var(--r-list-item--subtext--font-weight, 400));line-height:var(--r-list-item--description--line-height, var(--r-list-item--subtext--line-height, 1.5));color:var(--r-list-item--description--color, var(--r-list-item--subtext--color, var(--r-text-regular, #282828)));white-space:var(--r-list-item--description--white-space, normal);overflow:var(--r-list-item--description--overflow, hidden);text-overflow:var(--r-list-item--description--text-overflow, ellipsis)}.r-list-item--subtext ::slotted(a),.r-list-item--description ::slotted(a){color:var(--r-list-item--description--color, var(--r-list-item--subtext--slotted--color, inherit))}";
3
+ const listItemCss = ":host([alignment=top]){--r-list-item--trailing-text--font-weight:bold;--r-list-item--trailing--align-self:start}:host([alignment=bottom]) .r-list-item{--r-list-item--trailing--align-self:end}:host([divider]:not([divider=false])){--r-list-item--border-color:var(--r-border-soft, #686868);--r-list-item--border-width:0 0 1px 0}:host([active]) .r-list-item{--r-list-item--background-color:var(--r-background-interactive-pressed, rgba(40, 40, 40, 0.12))}:host([variant=navitem]:not([active]):hover:not([disabled]:not([disabled=false])))>.r-list-item,:host([href]:not([active]):hover:not([disabled]:not([disabled=false])))>.r-list-item{--r-list-item--cursor:pointer;--r-list-item--background-color:var(--r-background-interactive-hovered, rgba(40, 40, 40, 0.04))}:host([variant=navitem][has-sub-items]:hover:not([disabled]:not([disabled=false])))>.r-list-item-wrapper>.r-list-item{--r-list-item--cursor:pointer;--r-list-item--background-color:var(--r-background-interactive-hovered, rgba(40, 40, 40, 0.04))}:host([variant=navitem][has-sub-items]:has([active]):hover:not([disabled]:not([disabled=false])))>.r-list-item-wrapper>.r-list-item{--r-list-item--cursor:pointer;--r-list-item--background-color:transparent}:host([variant=navitem][expanded])>.r-list-item-wrapper>.r-list-item{--r-list-item--headline--font-weight:600;--r-list-item--trailing-icon--transform:rotate(180deg);--r-list-item--trailing-icon--color:var(--r-icon-regular, #282828)}:host([variant=navitem][active-parent]:not([expanded])),:host([variant=navitem][active]:not([expanded])){--r-list-item--background-color:var(--r-background-interactive-activated, rgba(40, 40, 40, 0.08))}:host([variant=subitem]) .r-list-item{--r-list-item--margin-left:27px;--r-list-item--border-width:0 0 0 1px;--r-list-item--border-color:var(--r-border-soft, #686868)}:host([variant=subitem][active]) .r-list-item{--r-list-item--background-color:var(--r-background-interactive-pressed, rgba(40, 40, 40, 0.12))}:host(:focus-visible:not(:active)) .r-list-item{--r-list-item--box-shadow:0 0 0 6px var(--r-border-focused-outlined, #fff);--r-list-item--outline:2px solid var(--r-border-focused, #0071e3);--r-list-item--outline-offset:2px}:host(:focus-within) .r-list-item[href]{--r-list-item--box-shadow:0 0 0 6px var(--r-border-focused-outlined, #fff);--r-list-item--outline:2px solid var(--r-border-focused, #0071e3);--r-list-item--outline-offset:2px}:host([disabled]:not([disabled=false])){cursor:not-allowed;--r-list-item--background-color:transparent}:host([disabled]:not([disabled=false])[divider]:not([divider=false])){--r-list-item--border-color:rgba(104,104,104, 0.4);--r-list-item--leading-icon--color:rgba(104,104,104, 0.4)}:host([truncate-description]:not([truncate-description=false])){--r-list-item--description--white-space:nowrap}:host{display:var(--display, block);pointer-events:var(--pointer-events, auto);outline:var(--outline, none);font-family:var(--font-family, var(--r-font-family-text, system-ui));line-height:var(--line-height, var(--r-line-height-m, 1.5));color:var(--color, var(--r-text-regular, #282828))}.r-list-item{display:var(--r-list-item--display, flex);align-items:var(--r-list-item--align-items, center);justify-content:var(--r-list-item--justify-content, center);gap:var(--r-list-item--gap, 16px);width:var(--r-list-item--width, inherit);padding:var(--r-list-item--padding, 16px);margin-left:var(--r-list-item--margin-left, 0);opacity:var(--r-list-item--opacity, 1);color:var(--r-list-item--color, inherit);box-shadow:var(--r-list-item--box-shadow, none);outline:var(--r-list-item--outline, none);outline-offset:var(--r-list-item--outline-offset, 0);text-decoration:var(--r-list-item--text-decoration, none);background-color:var(--r-list-item--background-color, transparent);border-style:var(--r-list-item--border-style, solid);border-width:var(--r-list-item--border-width, 0);border-color:var(--r-list-item--border-color, transparent);cursor:var(--r-list-item--cursor, inherit);font-weight:var(--r-list-item--font-weight, var(--r-font-weight-regular, 400));outline:var(--r-list-item--outline, none)}.r-list-item--leading{color:var(--r-list-item--leading--color, var(--r-icon-soft, #686868))}.r-list-item--leading-icon{color:var(--r-list-item--leading-icon--color, var(--r-icon-soft, #686868))}.r-list-item--trailing{display:var(--r-list-item--trailing--display, flex);align-self:var(--r-list-item--trailing--align-self, center);gap:var(--r-list-item--trailing--gap, 8px);color:var(--r-list-item--trailing--color, inherit)}.r-list-item--trailing-icon{transition:var(--r-list-item--trailing-icon--transition, transform 250ms ease-in-out);transform:var(--r-list-item--trailing-icon--transform, rotate(0deg));color:var(--r-list-item--trailing-icon--color, inherit)}.r-list-item--trailing-text{font-weight:var(--r-list-item--trailing-text--font-weight, 400);white-space:var(--r-list-item--trailing-text--white-space, nowrap)}.r-list-item--trailing ::slotted(*){display:var(--r-list-item--trailing-slotted--display, flex);gap:var(--r-list-item--trailing-slotted--display, 8px)}.r-list-item--text{display:var(--r-list-item--text--display, flex);flex-grow:var(--r-list-item--text--flex-grow, 1);flex-direction:var(--r-list-item--text--flex-direction, column);gap:var(--r-list-item--text--gap, 2px);white-space:var(--r-list-item--text--white-space, normal);overflow:var(--r-list-item--text--overflow, hidden);text-overflow:var(--r-list-item--text--text-overflow, ellipsis);font-weight:var(--r-list-item--trailing-text--font-weight, inherit)}.r-list-item--headline{font-size:var(--r-list-item--headline--font-size, 1rem);font-weight:var(--r-list-item--headline--font-weight, 600);line-height:var(--r-list-item--headline--line-height, 1.5);color:var(--r-list-item--headline--color, inherit)}.r-list-item--description{font-size:var(--r-list-item--description--font-size, 1rem);font-weight:var(--r-list-item--description--font-weight, 400);line-height:var(--r-list-item--description--line-height, 1.5);color:var(--r-list-item--description--color, var(--r-text-regular, #282828));white-space:var(--r-list-item--description--white-space, normal);overflow:var(--r-list-item--description--overflow, hidden);text-overflow:var(--r-list-item--description--text-overflow, ellipsis)}.r-list-item--description ::slotted(a){color:var(--r-list-item--description--color, inherit)}";
4
4
 
5
5
  const RListItem = class {
6
6
  constructor(hostRef) {
@@ -48,7 +48,7 @@ const RListItem = class {
48
48
  return this.isEl('[slot="headline"]');
49
49
  }
50
50
  get isDescriptionSlot() {
51
- return this.isEl('[slot="description"]') || this.isEl('[slot="subtext"]');
51
+ return this.isEl('[slot="description"]');
52
52
  }
53
53
  get hasSubitems() {
54
54
  return this.isEl('[variant="subitem"]');
@@ -81,15 +81,15 @@ const RListItem = class {
81
81
  return this.href && !this.disabled ? 'a' : 'div';
82
82
  }
83
83
  render() {
84
- const { leadingIcon, leadingIconSrc, trailingIcon, trailingIconSrc, headline, trailingText, subtext, description } = this;
84
+ const { leadingIcon, leadingIconSrc, trailingIcon, trailingIconSrc, headline, trailingText, description } = this;
85
85
  const TagName = this.tagName;
86
86
  const itemAttrs = Object.assign({ href: TagName === 'a' ? this.href : null }, (this.disabled ? { role: 'link', 'aria-disabled': 'true' } : null));
87
87
  const ListItemContent = (h(TagName, Object.assign({ class: "r-list-item" }, itemAttrs), this.isLeading &&
88
88
  h("span", { class: "r-list-item--leading" }, h("slot", { name: "leading" }, this.isLeadingIcon && !this.hideLeadingIcon &&
89
89
  h("r-icon", { class: "r-list-item--leading-icon", name: leadingIcon, src: leadingIconSrc }))), h("span", { class: "r-list-item--text" }, !this.isTextSlot ?
90
90
  h(Fragment, null, (this.isHeadlineSlot || headline) &&
91
- h("span", { class: "r-list-item--headline" }, h("slot", { name: "headline" }, headline)), (description || this.isDescriptionSlot || subtext) &&
92
- h("span", { class: "r-list-item--description" }, h("slot", { name: "subtext" }, subtext), h("slot", { name: "description" }, description)))
91
+ h("span", { class: "r-list-item--headline" }, h("slot", { name: "headline" }, headline)), (description || this.isDescriptionSlot) &&
92
+ h("span", { class: "r-list-item--description" }, h("slot", { name: "description" }, description)))
93
93
  :
94
94
  h("slot", { name: "text" })), this.isTrailing &&
95
95
  h("span", { class: "r-list-item--trailing" }, h("slot", { name: "trailing" }, this.isTrailingIcon && !trailingText &&
@@ -1,6 +1,6 @@
1
1
  import { r as registerInstance, c as createEvent, h, H as Host, g as getElement, F as Fragment } from './index-Da7qOBFr.js';
2
2
 
3
- const paginationCss = ":host{--r-pagination--display:flex;--r-pagination--list-style:none;--r-pagination--align-items:center;--r-pagination--justify-content:center;--r-pagination--font-family:var(--r-font-family-text);--r-pagination--margin:0 auto;--r-pagination--flex-direction:column;--r-pagination--width:100%;--r-pagination--max-width:664px;--r-pagination--margin:0 auto;--r-pagination--item--display:flex;--r-pagination--item--align-items:center;--r-pagination--item--justify-content:center;--r-pagination--item--margin-right:-1px;--r-pagination--item--color:var(--r-text-regular);--r-pagination--item--background-color:transparent;--r-pagination--item--width:48px;--r-pagination--item--height:48px;--r-pagination--item--border-width:1px;--r-pagination--item--border-style:solid;--r-pagination--item--border-color:var(--r-border-softer);--r-pagination--item--z-index:0;--r-pagination--item--font-family:inherit;--r-pagination--button--width:100%;--r-pagination--button--height:100%;--r-pagination--button--color:var(--r-text-regular);--r-pagination--button--background-color:transparent;--r-pagination--button--border-width:0;--r-pagination--button--padding:0;--r-pagination--button--font-size:var(--r-font-size-300);--r-pagination--header--display:flex;--r-pagination--header--align-items:center;--r-pagination--header--justify-content:space-between;--r-pagination--header--min-width:287px;--r-pagination--footer--display:flex;--r-pagination--footer--justify-content:center;--r-pagination--footer--width:100%;--r-pagination--item--disabled-text:none;--r-pagination--font-size:var(--r-font-size-200);display:block}:host([variant=minimized]){--r-pagination--max-width:440px}:host([variant=standard]){--r-pagination--max-width:560px}:host([variant=maximized]){--r-pagination--max-width:664px}.r-pagination r-select{--r-select--font-size:var(--r-pagination--font-size, 12px);--r-select-option--font-size:var(--r-pagination--font-size, 12px)}.r-pagination{align-items:var(--r-pagination--align-items);display:var(--r-pagination--display);flex-direction:var(--r-pagination--flex-direction);font-family:var(--r-pagination--font-family);font-size:var(--r-pagination--font-size);justify-content:var(--r-pagination--justify-content);list-style:var(--r-pagination--list-style);margin:var(--r-pagination--margin);max-width:var(--r-pagination--max-width);user-select:var(--r-pagination--item--disabled-text);width:var(--r-pagination--width)}.r-pagination--footer{align-items:var(--r-pagination--header--align-items);display:var(--r-pagination--footer--display);justify-content:var(--r-pagination--footer--justify-content)}.r-pagination--header{align-items:var(--r-pagination--header--align-items);display:var(--r-pagination--header--display);justify-content:var(--r-pagination--header--justify-content);font-family:var(--r-pagination--font-family);min-width:var(--r-pagination--header--min-width)}.r-pagination--header--select{min-width:auto;--width:unset !important}.r-pagination--header label{font-size:var(--r-pagination--font-size)}.r-pagination--item{--r-button--display:flex;--r-button--width:var(--r-pagination--button--width);--r-button--height:var(--r-pagination--button--height);--r-button--color:var(--r-pagination--button--color);--r-button--background-color:var(--r-pagination--button--background-color);--r-button--border-width:var(--r-pagination--button--border-width);--r-button--padding:var(--r-pagination--button--padding);--r-button--icon--width:auto;--r-button--icon--height:auto;align-items:var(--r-pagination--item--align-items);background-color:var(--r-pagination--item--background-color);color:var(--r-pagination--item--color);display:var(--r-pagination--item--display);font-family:var(--r-pagination--item--font-family);height:var(--r-pagination--item--height);justify-content:var(--r-pagination--item--justify-content);margin-left:var(--r-pagination--item--margin-left);margin-right:var(--r-pagination--item--margin-right);opacity:var(--r-pagination--item--opacity);width:var(--r-pagination--item--width);z-index:var(--r-pagination--item--z-index)}.r-pagination--item:hover{--r-pagination--item--background-color:var(--r-background-interactive-hovered)}.r-pagination--item:focus{--r-pagination--item--outline-color:var(--r-border-focused);--r-pagination--item--box-shadow:0 0 0 3px var(--r-border-focused-outlined);--r-pagination--item--z-index:1}.r-pagination--item:active{--r-pagination--item--background-color:var(--r-background-interactive-pressed)}.r-pagination--item.stepper{--r-pagination--item--background-color:transparent}.r-pagination--item.active{--r-pagination--item--color:var(--r-text-regular);--r-pagination--item--background-color:var(--r-background-interactive-activated);font-weight:var(--r-font-weight-semibold)}.r-pagination--item.arrow.previous{--r-pagination--item--margin-left:0;--r-pagination--item--margin-right:16px}.r-pagination--item.arrow.next{--r-pagination--item--margin-left:16px;--r-pagination--item--margin-right:0}.r-pagination--item.arrow.first{--r-pagination--item--margin-left:0;--r-pagination--item--margin-right:8px}.r-pagination--item.arrow.last{--r-pagination--item--margin-left:8px;--r-pagination--item--margin-right:0}.r-pagination--item.disabled,.r-pagination--item.disabled:hover{--r-pagination--item--opacity:0.4;--r-pagination--item--background-color:transparent}.r-pagination--item.number{--r-button--font-size:0.813rem}";
3
+ const paginationCss = ":host{--r-pagination--display:flex;--r-pagination--list-style:none;--r-pagination--align-items:center;--r-pagination--justify-content:center;--r-pagination--font-family:var(--r-font-family-text);--r-pagination--margin:0 auto;--r-pagination--flex-direction:column;--r-pagination--width:100%;--r-pagination--max-width:664px;--r-pagination--margin:0 auto;--r-pagination--item--display:flex;--r-pagination--item--align-items:center;--r-pagination--item--justify-content:center;--r-pagination--item--margin-right:-1px;--r-pagination--item--color:var(--r-text-regular);--r-pagination--item--background-color:transparent;--r-pagination--item--width:48px;--r-pagination--item--height:48px;--r-pagination--item--border-width:1px;--r-pagination--item--border-style:solid;--r-pagination--item--border-color:var(--r-border-softer);--r-pagination--item--z-index:0;--r-pagination--item--font-family:inherit;--r-pagination--button--width:100%;--r-pagination--button--height:100%;--r-pagination--button--color:var(--r-text-regular);--r-pagination--button--background-color:transparent;--r-pagination--button--border-width:0;--r-pagination--button--padding:0;--r-pagination--button--font-size:var(--r-font-size-300);--r-pagination--header--display:flex;--r-pagination--header--align-items:center;--r-pagination--header--justify-content:space-between;--r-pagination--header--min-width:287px;--r-pagination--footer--display:flex;--r-pagination--footer--justify-content:center;--r-pagination--footer--width:100%;--r-pagination--item--disabled-text:none;--r-pagination--font-size:var(--r-font-size-200);display:block}:host([variant=minimized]){--r-pagination--max-width:440px}:host([variant=standard]){--r-pagination--max-width:560px}:host([variant=maximized]){--r-pagination--max-width:664px}.r-pagination r-select{--r-select--font-size:var(--r-pagination--font-size, 12px);--r-select-option--font-size:var(--r-pagination--font-size, 12px)}.r-pagination{align-items:var(--r-pagination--align-items);display:var(--r-pagination--display);flex-direction:var(--r-pagination--flex-direction);font-family:var(--r-pagination--font-family);font-size:var(--r-pagination--font-size);justify-content:var(--r-pagination--justify-content);list-style:var(--r-pagination--list-style);margin:var(--r-pagination--margin);max-width:var(--r-pagination--max-width);user-select:var(--r-pagination--item--disabled-text);width:var(--r-pagination--width)}.r-pagination--footer{align-items:var(--r-pagination--header--align-items);display:var(--r-pagination--footer--display);justify-content:var(--r-pagination--footer--justify-content)}.r-pagination--header{align-items:var(--r-pagination--header--align-items);display:var(--r-pagination--header--display);justify-content:var(--r-pagination--header--justify-content);font-family:var(--r-pagination--font-family);min-width:var(--r-pagination--header--min-width)}.r-pagination--header--select{min-width:auto;--width:unset !important}.r-pagination--header label{font-size:var(--r-pagination--font-size)}.r-pagination--item:hover{--r-pagination--item--background-color:var(--r-background-interactive-hovered)}.r-pagination--item:focus{--r-pagination--item--outline-color:var(--r-border-focused);--r-pagination--item--box-shadow:0 0 0 3px var(--r-border-focused-outlined);--r-pagination--item--z-index:1}.r-pagination--item:active{--r-pagination--item--background-color:var(--r-background-interactive-pressed)}.r-pagination--item.stepper{--r-pagination--item--background-color:transparent}.r-pagination--item.active{--r-pagination--item--color:var(--r-text-regular);--r-pagination--item--background-color:var(--r-background-interactive-activated);font-weight:var(--r-font-weight-semibold)}.r-pagination--item.arrow.previous{--r-pagination--item--margin-left:0;--r-pagination--item--margin-right:16px}.r-pagination--item.arrow.next{--r-pagination--item--margin-left:16px;--r-pagination--item--margin-right:0}.r-pagination--item.arrow.first{--r-pagination--item--margin-left:0;--r-pagination--item--margin-right:8px}.r-pagination--item.arrow.last{--r-pagination--item--margin-left:8px;--r-pagination--item--margin-right:0}.r-pagination--item.disabled,.r-pagination--item.disabled:hover{--r-pagination--item--opacity:0.4;--r-pagination--item--background-color:transparent}.r-pagination--item.number{--r-button--font-size:0.813rem}.r-pagination--item{--r-button--display:flex;--r-button--width:var(--r-pagination--button--width);--r-button--height:var(--r-pagination--button--height);--r-button--color:var(--r-pagination--button--color);--r-button--background-color:var(--r-pagination--button--background-color);--r-button--border-width:var(--r-pagination--button--border-width);--r-button--padding:var(--r-pagination--button--padding);--r-button--icon--width:auto;--r-button--icon--height:auto;align-items:var(--r-pagination--item--align-items);background-color:var(--r-pagination--item--background-color);color:var(--r-pagination--item--color);display:var(--r-pagination--item--display);font-family:var(--r-pagination--item--font-family);height:var(--r-pagination--item--height);justify-content:var(--r-pagination--item--justify-content);margin-left:var(--r-pagination--item--margin-left);margin-right:var(--r-pagination--item--margin-right);opacity:var(--r-pagination--item--opacity);width:var(--r-pagination--item--width);z-index:var(--r-pagination--item--z-index)}";
4
4
 
5
5
  const RPagination = class {
6
6
  constructor(hostRef) {
@@ -166,10 +166,10 @@ const Panel = class {
166
166
  }
167
167
  }
168
168
  render() {
169
- return (h(Host, { key: 'f57ca21d8a782d736984c091af8ad7bede50f81b', collapsed: this.isCollapsed }, h("div", { key: '138a6e18232630123667ad328c393c93e4908cf6', class: "r-panel" }, h("div", { key: '377662f16e8fca37a557adaf4fd8329e47828303', class: "r-panel--header" }, this.hasHeader && (h("a", { key: 'f183b59e3dff6ca76905b2b52902d2e6ec6f2709', class: "logo-wrapper", href: this.logoLink }, this.isCollapsed ?
169
+ return (h(Host, { key: '4898806bfe378b36f5fc784a6a4ea4477f164d86', collapsed: this.isCollapsed }, h("div", { key: 'f0acaedbc5e440b20a49791d5a3544955bdcd1f7', class: "r-panel" }, h("div", { key: '390898c282414aecd4cfd75e4da80fb6b04e8ffa', class: "r-panel--header" }, this.hasHeader && (h("a", { key: '9358558193e8c7ec82d8bf40240b9fb8d00d902d', class: "logo-wrapper", href: this.logoLink }, this.isCollapsed ?
170
170
  h("slot", { name: "logo-collapsed" })
171
171
  :
172
- h("slot", { name: "logo-expanded" }))), this.variant === 'modal' ? (h("r-button", { class: "r-panel--trigger", variant: "blank", title: `${this.labelCollapse}`, icon: "cross", "r-aria-label": `${this.labelCollapse}`, onClick: this.handleFullyCollapsedButtonClick })) : this.variant === 'drawer' ? (h("r-button", { class: "r-panel--trigger", variant: "blank", title: this.isCollapsed ? `${this.labelExpand}` : `${this.labelCollapse}`, icon: "angle-left", "r-aria-label": this.isCollapsed ? `${this.labelExpand}` : `${this.labelCollapse}`, onClick: this.handleSemiCollapsedButtonClick })) : this.variant === 'visible' ? (null) : null), h("div", { key: '0f239dc288b9c73f348341e99a06cce9e4499a0e', class: "r-panel--body" }, h("slot", { key: '6fd883065b4db924b1c245e7ea5bcf71229f0840' })), this.hasFooter && !this.isCollapsed && (h("div", { key: 'ce6a1f84358a505940d3ef04c5c218caa972b090', class: "r-panel--footer" }, h("slot", { key: 'e4422d8955e7e64babab3b3f04cfa06f32dad74a', name: "footer" }))))));
172
+ h("slot", { name: "logo-expanded" }))), this.variant === 'modal' ? (h("r-button", { class: "r-panel--trigger", variant: "blank", title: `${this.labelCollapse}`, icon: "cross", "r-aria-label": `${this.labelCollapse}`, onClick: this.handleFullyCollapsedButtonClick })) : this.variant === 'drawer' ? (h("r-button", { class: "r-panel--trigger", variant: "blank", title: this.isCollapsed ? `${this.labelExpand}` : `${this.labelCollapse}`, icon: "angle-left", "r-aria-label": this.isCollapsed ? `${this.labelExpand}` : `${this.labelCollapse}`, onClick: this.handleSemiCollapsedButtonClick })) : this.variant === 'visible' ? (null) : null), h("div", { key: '070e63b95136c2cab2bf7a1a84390568c1341c47', class: "r-panel--body" }, h("slot", { key: 'e595b40da67e61bb23638d5ea1a615005d705a41' })), this.hasFooter && !this.isCollapsed && (h("div", { key: '7adb855c7aa805299abba58795aacb27ce4e6ba5', class: "r-panel--footer" }, h("slot", { key: '6e438b003d443bf62b2faad2bf180a4466190e77', name: "footer" }))))));
173
173
  }
174
174
  get host() { return getElement(this); }
175
175
  static get watchers() { return {
@@ -3,7 +3,7 @@ import { s as setupInverseThemeAwareness, a as stopInverseThemeAwareness } from
3
3
  import { f as focusableElements } from './focusable-ky1yonnS.js';
4
4
  import './style-observer-4Uv3PpKT.js';
5
5
 
6
- const popoverActionCss = ":host slot{display:contents}::slotted(r-button){--r-button--color:var(--r-text-regular);--r-button--border-color:rgba(0,0,0,0);--r-button--background-color:rgba(0,0,0,0);--r-button--slot--position:relative;--r-button--slot--text-decoration:underline;--r-button--padding:12px 0.125rem 19px 0.125rem;--r-button--slot--text-underline-offset:12px}::slotted(r-button:hover:not([disabled]):not([disabled=false])){--r-button--border-color:var(--r-border-soft);--r-button--background-color:var(--r-background-interactive-hovered)}::slotted(r-button:active:not([disabled]):not([disabled=false])){--r-button--background-color:var(--r-background-interactive-pressed);--r-button--border-color:var(--r-border-soft)}";
6
+ const popoverActionCss = ":host slot{display:contents}::slotted(r-button){--r-button--color:var(--r-text-regular);--r-button--border-width:0;--r-button--background-color:rgba(0,0,0,0);--r-button--slot--position:relative;--r-button--slot--text-decoration:underline;--r-button--padding:10px 2px 18px 2px;--r-button--slot--text-underline-offset:9px}::slotted(r-button:hover:not([disabled]):not([disabled=false])){--r-button--background-color:var(--r-background-interactive-hovered)}::slotted(r-button:active:not([disabled]):not([disabled=false])){--r-button--background-color:var(--r-background-interactive-pressed)}";
7
7
 
8
8
  const PopoverAction = class {
9
9
  constructor(hostRef) {
@@ -69,7 +69,7 @@ const PopoverAction = class {
69
69
  return focusableElements(this.host);
70
70
  }
71
71
  render() {
72
- return (h(Host, { key: '573250bc4f9a1a8725e8808885854ca320b203bc', slot: "action" }, h("slot", { key: 'd753af20723fb9e2ae49f9977cda81fa1c3df8c6', onSlotchange: this.handleSlotChange })));
72
+ return (h(Host, { key: '898d4a649622403956b34ea5065ca5135e67c595', slot: "action" }, h("slot", { key: 'f61e085a1797778c33f07eaf3987cd743d56a662', onSlotchange: this.handleSlotChange })));
73
73
  }
74
74
  get host() { return getElement(this); }
75
75
  };
@@ -51,7 +51,7 @@ const PopoverContent = class {
51
51
  return focusableElements(this.host);
52
52
  }
53
53
  render() {
54
- return (h(Host, { key: 'ec778d5e0a294bcbe389039abc6f0b620b7bc69c', slot: "content", class: "r-typography" }, h("slot", { key: '40c27d279a1093be8a98731881ad83da147f5bbc' })));
54
+ return (h(Host, { key: 'b85780e40b627c6d859af763113bc88e21768f88', slot: "content", class: "r-typography" }, h("slot", { key: '7bd5e6152e29a4e20d837c21e1df7bff68a673da' })));
55
55
  }
56
56
  get host() { return getElement(this); }
57
57
  };
@@ -17,7 +17,7 @@ const PopoverHeadline = class {
17
17
  stopInverseThemeAwareness(this.host, themeContextElement);
18
18
  }
19
19
  render() {
20
- return (h(Host, { key: 'f878fb9ca3ffe1df00088bbd2fe1b6321130228a', slot: "headline" }, h("slot", { key: '1a477943ab993f8960f3e77dd90a72a276bf4200' })));
20
+ return (h(Host, { key: '6b604401e4e82c17a300f00d6af33902b38f493c', slot: "headline" }, h("slot", { key: '64c8c6ff661e0317ba3ae0d4f32f6424d91fccbe' })));
21
21
  }
22
22
  get host() { return getElement(this); }
23
23
  };
@@ -59,7 +59,7 @@ const PopoverTrigger = class {
59
59
  (_a = this.activeElement) === null || _a === void 0 ? void 0 : _a.blur();
60
60
  }
61
61
  render() {
62
- return (h(Host, { key: '78536189423d25a1cf3ee3630512ad44b2dbd444', slot: "trigger", onMouseEnter: this.handleMouseEnter, onMouseLeave: this.handleMouseLeave }, h("slot", { key: 'e634da1b6053eb1c0df7f08f5486f9492c2bd4d0' })));
62
+ return (h(Host, { key: 'fe285ee3a91600ee0e0cebeb9f5818eb30d89f06', slot: "trigger", onMouseEnter: this.handleMouseEnter, onMouseLeave: this.handleMouseLeave }, h("slot", { key: '3782871f7aac634d3c1ccef2f516cdf00916b4f6' })));
63
63
  }
64
64
  get host() { return getElement(this); }
65
65
  };