@pine-ds/core 3.7.0 → 3.8.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 (604) hide show
  1. package/components/form.js +16 -1
  2. package/components/form.js.map +1 -1
  3. package/components/index2.js +1 -1
  4. package/components/index2.js.map +1 -1
  5. package/components/mock-pds-modal.js +1 -1
  6. package/components/mock-pds-modal.js.map +1 -1
  7. package/components/pds-button2.js +1 -1
  8. package/components/pds-button2.js.map +1 -1
  9. package/components/pds-checkbox2.js +7 -4
  10. package/components/pds-checkbox2.js.map +1 -1
  11. package/components/pds-chip.js +1 -100
  12. package/components/pds-chip.js.map +1 -1
  13. package/components/pds-chip2.js +105 -0
  14. package/components/pds-chip2.js.map +1 -0
  15. package/components/pds-combobox.js +414 -43
  16. package/components/pds-combobox.js.map +1 -1
  17. package/components/pds-copytext.js +3 -3
  18. package/components/pds-copytext.js.map +1 -1
  19. package/components/pds-dropdown-menu.js +1 -1
  20. package/components/pds-dropdown-menu.js.map +1 -1
  21. package/components/pds-filter.js +3 -3
  22. package/components/pds-filter.js.map +1 -1
  23. package/components/pds-input.js +1 -1
  24. package/components/pds-input.js.map +1 -1
  25. package/components/pds-modal.js +1 -1
  26. package/components/pds-modal.js.map +1 -1
  27. package/components/pds-popover.js +123 -15
  28. package/components/pds-popover.js.map +1 -1
  29. package/components/pds-radio.js +10 -4
  30. package/components/pds-radio.js.map +1 -1
  31. package/components/pds-select.js +21 -5
  32. package/components/pds-select.js.map +1 -1
  33. package/components/pds-switch.js +7 -4
  34. package/components/pds-switch.js.map +1 -1
  35. package/components/pds-tab.js +1 -1
  36. package/components/pds-tab.js.map +1 -1
  37. package/components/pds-table-cell2.js +1 -1
  38. package/components/pds-table-cell2.js.map +1 -1
  39. package/components/pds-table-head-cell2.js +1 -1
  40. package/components/pds-table-head-cell2.js.map +1 -1
  41. package/components/pds-table-head.js +1 -1
  42. package/components/pds-table-head.js.map +1 -1
  43. package/components/pds-table-row.js +1 -1
  44. package/components/pds-table-row.js.map +1 -1
  45. package/components/pds-table.js +1 -1
  46. package/components/pds-table.js.map +1 -1
  47. package/components/pds-tabs.js +14 -4
  48. package/components/pds-tabs.js.map +1 -1
  49. package/components/pds-textarea.js +9 -6
  50. package/components/pds-textarea.js.map +1 -1
  51. package/components/pds-tooltip.js +4 -4
  52. package/components/pds-tooltip.js.map +1 -1
  53. package/dist/cjs/{form-Bx4nzJBo.js → form-hmpgbT1I.js} +18 -2
  54. package/dist/cjs/form-hmpgbT1I.js.map +1 -0
  55. package/dist/cjs/{index-CTirFLR-.js → index-DtnvzYhe.js} +3 -3
  56. package/dist/cjs/index-DtnvzYhe.js.map +1 -0
  57. package/dist/cjs/loader.cjs.js +1 -1
  58. package/dist/cjs/mock-pds-modal.cjs.entry.js +1 -1
  59. package/dist/cjs/mock-pds-modal.cjs.entry.js.map +1 -1
  60. package/dist/cjs/mock-pds-modal.entry.cjs.js.map +1 -1
  61. package/dist/cjs/pds-accordion.cjs.entry.js +1 -1
  62. package/dist/cjs/pds-avatar.cjs.entry.js +1 -1
  63. package/dist/cjs/pds-button.cjs.entry.js +2 -2
  64. package/dist/cjs/pds-button.cjs.entry.js.map +1 -1
  65. package/dist/cjs/pds-button.entry.cjs.js.map +1 -1
  66. package/dist/cjs/pds-checkbox.cjs.entry.js +8 -5
  67. package/dist/cjs/pds-checkbox.cjs.entry.js.map +1 -1
  68. package/dist/cjs/pds-checkbox.entry.cjs.js.map +1 -1
  69. package/dist/cjs/pds-chip.cjs.entry.js +3 -3
  70. package/dist/cjs/pds-chip.cjs.entry.js.map +1 -1
  71. package/dist/cjs/pds-chip.entry.cjs.js.map +1 -1
  72. package/dist/cjs/pds-combobox.cjs.entry.js +398 -40
  73. package/dist/cjs/pds-combobox.cjs.entry.js.map +1 -1
  74. package/dist/cjs/pds-combobox.entry.cjs.js.map +1 -1
  75. package/dist/cjs/pds-copytext.cjs.entry.js +4 -4
  76. package/dist/cjs/pds-copytext.cjs.entry.js.map +1 -1
  77. package/dist/cjs/pds-copytext.entry.cjs.js.map +1 -1
  78. package/dist/cjs/pds-dropdown-menu.cjs.entry.js +1 -1
  79. package/dist/cjs/pds-dropdown-menu.cjs.entry.js.map +1 -1
  80. package/dist/cjs/pds-dropdown-menu.entry.cjs.js.map +1 -1
  81. package/dist/cjs/pds-filter.cjs.entry.js +4 -4
  82. package/dist/cjs/pds-filter.cjs.entry.js.map +1 -1
  83. package/dist/cjs/pds-filter.entry.cjs.js.map +1 -1
  84. package/dist/cjs/pds-input.cjs.entry.js +3 -3
  85. package/dist/cjs/pds-input.cjs.entry.js.map +1 -1
  86. package/dist/cjs/pds-input.entry.cjs.js.map +1 -1
  87. package/dist/cjs/pds-link.cjs.entry.js +1 -1
  88. package/dist/cjs/pds-modal.cjs.entry.js +1 -1
  89. package/dist/cjs/pds-modal.cjs.entry.js.map +1 -1
  90. package/dist/cjs/pds-modal.entry.cjs.js.map +1 -1
  91. package/dist/cjs/pds-popover.cjs.entry.js +117 -12
  92. package/dist/cjs/pds-popover.cjs.entry.js.map +1 -1
  93. package/dist/cjs/pds-popover.entry.cjs.js.map +1 -1
  94. package/dist/cjs/pds-radio.cjs.entry.js +11 -5
  95. package/dist/cjs/pds-radio.cjs.entry.js.map +1 -1
  96. package/dist/cjs/pds-radio.entry.cjs.js.map +1 -1
  97. package/dist/cjs/pds-select.cjs.entry.js +20 -5
  98. package/dist/cjs/pds-select.cjs.entry.js.map +1 -1
  99. package/dist/cjs/pds-select.entry.cjs.js.map +1 -1
  100. package/dist/cjs/pds-sortable-item.cjs.entry.js +1 -1
  101. package/dist/cjs/pds-switch.cjs.entry.js +8 -5
  102. package/dist/cjs/pds-switch.cjs.entry.js.map +1 -1
  103. package/dist/cjs/pds-switch.entry.cjs.js.map +1 -1
  104. package/dist/cjs/pds-tab.cjs.entry.js +1 -1
  105. package/dist/cjs/pds-tab.cjs.entry.js.map +1 -1
  106. package/dist/cjs/pds-tab.entry.cjs.js.map +1 -1
  107. package/dist/cjs/pds-table-cell.cjs.entry.js +1 -1
  108. package/dist/cjs/pds-table-cell.cjs.entry.js.map +1 -1
  109. package/dist/cjs/pds-table-cell.entry.cjs.js.map +1 -1
  110. package/dist/cjs/pds-table-head-cell.cjs.entry.js +2 -2
  111. package/dist/cjs/pds-table-head-cell.cjs.entry.js.map +1 -1
  112. package/dist/cjs/pds-table-head-cell.entry.cjs.js.map +1 -1
  113. package/dist/cjs/pds-table-head.cjs.entry.js +1 -1
  114. package/dist/cjs/pds-table-head.cjs.entry.js.map +1 -1
  115. package/dist/cjs/pds-table-head.entry.cjs.js.map +1 -1
  116. package/dist/cjs/pds-table-row.cjs.entry.js +1 -1
  117. package/dist/cjs/pds-table-row.cjs.entry.js.map +1 -1
  118. package/dist/cjs/pds-table-row.entry.cjs.js.map +1 -1
  119. package/dist/cjs/pds-table.cjs.entry.js +1 -1
  120. package/dist/cjs/pds-table.cjs.entry.js.map +1 -1
  121. package/dist/cjs/pds-table.entry.cjs.js.map +1 -1
  122. package/dist/cjs/pds-tabs.cjs.entry.js +14 -4
  123. package/dist/cjs/pds-tabs.cjs.entry.js.map +1 -1
  124. package/dist/cjs/pds-tabs.entry.cjs.js.map +1 -1
  125. package/dist/cjs/pds-textarea.cjs.entry.js +10 -7
  126. package/dist/cjs/pds-textarea.cjs.entry.js.map +1 -1
  127. package/dist/cjs/pds-textarea.entry.cjs.js.map +1 -1
  128. package/dist/cjs/pds-tooltip.cjs.entry.js +4 -4
  129. package/dist/cjs/pds-tooltip.cjs.entry.js.map +1 -1
  130. package/dist/cjs/pds-tooltip.entry.cjs.js.map +1 -1
  131. package/dist/cjs/pine-core.cjs.js +1 -1
  132. package/dist/collection/components/pds-button/pds-button.css +6 -3
  133. package/dist/collection/components/pds-checkbox/pds-checkbox.js +7 -4
  134. package/dist/collection/components/pds-checkbox/pds-checkbox.js.map +1 -1
  135. package/dist/collection/components/pds-chip/pds-chip.css +2 -2
  136. package/dist/collection/components/pds-chip/pds-chip.js +17 -5
  137. package/dist/collection/components/pds-chip/pds-chip.js.map +1 -1
  138. package/dist/collection/components/pds-combobox/pds-combobox.css +175 -4
  139. package/dist/collection/components/pds-combobox/pds-combobox.js +516 -43
  140. package/dist/collection/components/pds-combobox/pds-combobox.js.map +1 -1
  141. package/dist/collection/components/pds-combobox/stories/pds-combobox.stories.js +79 -2
  142. package/dist/collection/components/pds-copytext/pds-copytext.css +6 -3
  143. package/dist/collection/components/pds-copytext/pds-copytext.js +2 -2
  144. package/dist/collection/components/pds-copytext/pds-copytext.js.map +1 -1
  145. package/dist/collection/components/pds-copytext/stories/pds-copytext.stories.js +1 -1
  146. package/dist/collection/components/pds-dropdown-menu/pds-dropdown-menu.css +1 -1
  147. package/dist/collection/components/pds-filters/pds-filter/pds-filter.css +1 -1
  148. package/dist/collection/components/pds-filters/pds-filter/pds-filter.js +2 -2
  149. package/dist/collection/components/pds-filters/pds-filter/pds-filter.js.map +1 -1
  150. package/dist/collection/components/pds-input/pds-input.css +18 -3
  151. package/dist/collection/components/pds-input/stories/pds-input.stories.js +42 -0
  152. package/dist/collection/components/pds-modal/pds-modal.css +2 -2
  153. package/dist/collection/components/pds-popover/pds-popover.css +3 -0
  154. package/dist/collection/components/pds-popover/pds-popover.js +226 -17
  155. package/dist/collection/components/pds-popover/pds-popover.js.map +1 -1
  156. package/dist/collection/components/pds-popover/popover-interface.js +2 -0
  157. package/dist/collection/components/pds-popover/popover-interface.js.map +1 -0
  158. package/dist/collection/components/pds-popover/stories/pds-popover.stories.js +1 -1
  159. package/dist/collection/components/pds-radio/pds-radio.js +10 -4
  160. package/dist/collection/components/pds-radio/pds-radio.js.map +1 -1
  161. package/dist/collection/components/pds-select/pds-select.css +1 -1
  162. package/dist/collection/components/pds-select/pds-select.js +19 -2
  163. package/dist/collection/components/pds-select/pds-select.js.map +1 -1
  164. package/dist/collection/components/pds-switch/pds-switch.js +7 -4
  165. package/dist/collection/components/pds-switch/pds-switch.js.map +1 -1
  166. package/dist/collection/components/pds-table/pds-table-cell/pds-table-cell.css +1 -1
  167. package/dist/collection/components/pds-table/pds-table-head/pds-table-head.css +1 -1
  168. package/dist/collection/components/pds-table/pds-table-head-cell/pds-table-head-cell.css +1 -1
  169. package/dist/collection/components/pds-table/pds-table-row/pds-table-row.css +1 -1
  170. package/dist/collection/components/pds-table/pds-table.css +1 -1
  171. package/dist/collection/components/pds-tabs/pds-tab/pds-tab.css +2 -2
  172. package/dist/collection/components/pds-tabs/pds-tabs.js +14 -4
  173. package/dist/collection/components/pds-tabs/pds-tabs.js.map +1 -1
  174. package/dist/collection/components/pds-tabs/stories/pds-tabs.stories.js +1 -1
  175. package/dist/collection/components/pds-textarea/pds-textarea.css +1 -1
  176. package/dist/collection/components/pds-textarea/pds-textarea.js +8 -5
  177. package/dist/collection/components/pds-textarea/pds-textarea.js.map +1 -1
  178. package/dist/collection/components/pds-tooltip/pds-tooltip.css +1 -1
  179. package/dist/collection/components/pds-tooltip/pds-tooltip.js +3 -3
  180. package/dist/collection/components/pds-tooltip/pds-tooltip.js.map +1 -1
  181. package/dist/collection/utils/form.js +15 -0
  182. package/dist/collection/utils/form.js.map +1 -1
  183. package/dist/collection/utils/types.js.map +1 -1
  184. package/dist/docs.json +341 -17
  185. package/dist/esm/form-DwjNklzi.js +47 -0
  186. package/dist/esm/form-DwjNklzi.js.map +1 -0
  187. package/dist/esm/{index-D4MkIUXU.js → index-D4zJBIgl.js} +3 -3
  188. package/dist/esm/index-D4zJBIgl.js.map +1 -0
  189. package/dist/esm/loader.js +1 -1
  190. package/dist/esm/mock-pds-modal.entry.js +1 -1
  191. package/dist/esm/mock-pds-modal.entry.js.map +1 -1
  192. package/dist/esm/pds-accordion.entry.js +1 -1
  193. package/dist/esm/pds-avatar.entry.js +1 -1
  194. package/dist/esm/pds-button.entry.js +2 -2
  195. package/dist/esm/pds-button.entry.js.map +1 -1
  196. package/dist/esm/pds-checkbox.entry.js +8 -5
  197. package/dist/esm/pds-checkbox.entry.js.map +1 -1
  198. package/dist/esm/pds-chip.entry.js +3 -3
  199. package/dist/esm/pds-chip.entry.js.map +1 -1
  200. package/dist/esm/pds-combobox.entry.js +398 -40
  201. package/dist/esm/pds-combobox.entry.js.map +1 -1
  202. package/dist/esm/pds-copytext.entry.js +4 -4
  203. package/dist/esm/pds-copytext.entry.js.map +1 -1
  204. package/dist/esm/pds-dropdown-menu.entry.js +1 -1
  205. package/dist/esm/pds-dropdown-menu.entry.js.map +1 -1
  206. package/dist/esm/pds-filter.entry.js +4 -4
  207. package/dist/esm/pds-filter.entry.js.map +1 -1
  208. package/dist/esm/pds-input.entry.js +3 -3
  209. package/dist/esm/pds-input.entry.js.map +1 -1
  210. package/dist/esm/pds-link.entry.js +1 -1
  211. package/dist/esm/pds-modal.entry.js +1 -1
  212. package/dist/esm/pds-modal.entry.js.map +1 -1
  213. package/dist/esm/pds-popover.entry.js +118 -13
  214. package/dist/esm/pds-popover.entry.js.map +1 -1
  215. package/dist/esm/pds-radio.entry.js +12 -6
  216. package/dist/esm/pds-radio.entry.js.map +1 -1
  217. package/dist/esm/pds-select.entry.js +20 -5
  218. package/dist/esm/pds-select.entry.js.map +1 -1
  219. package/dist/esm/pds-sortable-item.entry.js +1 -1
  220. package/dist/esm/pds-switch.entry.js +8 -5
  221. package/dist/esm/pds-switch.entry.js.map +1 -1
  222. package/dist/esm/pds-tab.entry.js +1 -1
  223. package/dist/esm/pds-tab.entry.js.map +1 -1
  224. package/dist/esm/pds-table-cell.entry.js +1 -1
  225. package/dist/esm/pds-table-cell.entry.js.map +1 -1
  226. package/dist/esm/pds-table-head-cell.entry.js +2 -2
  227. package/dist/esm/pds-table-head-cell.entry.js.map +1 -1
  228. package/dist/esm/pds-table-head.entry.js +1 -1
  229. package/dist/esm/pds-table-head.entry.js.map +1 -1
  230. package/dist/esm/pds-table-row.entry.js +1 -1
  231. package/dist/esm/pds-table-row.entry.js.map +1 -1
  232. package/dist/esm/pds-table.entry.js +1 -1
  233. package/dist/esm/pds-table.entry.js.map +1 -1
  234. package/dist/esm/pds-tabs.entry.js +14 -4
  235. package/dist/esm/pds-tabs.entry.js.map +1 -1
  236. package/dist/esm/pds-textarea.entry.js +10 -7
  237. package/dist/esm/pds-textarea.entry.js.map +1 -1
  238. package/dist/esm/pds-tooltip.entry.js +4 -4
  239. package/dist/esm/pds-tooltip.entry.js.map +1 -1
  240. package/dist/esm/pine-core.js +1 -1
  241. package/dist/esm-es5/form-DwjNklzi.js +2 -0
  242. package/dist/esm-es5/form-DwjNklzi.js.map +1 -0
  243. package/dist/esm-es5/{index-D4MkIUXU.js → index-D4zJBIgl.js} +1 -1
  244. package/dist/esm-es5/index-D4zJBIgl.js.map +1 -0
  245. package/dist/esm-es5/loader.js +1 -1
  246. package/dist/esm-es5/mock-pds-modal.entry.js +1 -1
  247. package/dist/esm-es5/mock-pds-modal.entry.js.map +1 -1
  248. package/dist/esm-es5/pds-accordion.entry.js +1 -1
  249. package/dist/esm-es5/pds-avatar.entry.js +1 -1
  250. package/dist/esm-es5/pds-button.entry.js +1 -1
  251. package/dist/esm-es5/pds-button.entry.js.map +1 -1
  252. package/dist/esm-es5/pds-checkbox.entry.js +1 -1
  253. package/dist/esm-es5/pds-checkbox.entry.js.map +1 -1
  254. package/dist/esm-es5/pds-chip.entry.js +1 -1
  255. package/dist/esm-es5/pds-chip.entry.js.map +1 -1
  256. package/dist/esm-es5/pds-combobox.entry.js +1 -1
  257. package/dist/esm-es5/pds-combobox.entry.js.map +1 -1
  258. package/dist/esm-es5/pds-copytext.entry.js +1 -1
  259. package/dist/esm-es5/pds-copytext.entry.js.map +1 -1
  260. package/dist/esm-es5/pds-dropdown-menu.entry.js +1 -1
  261. package/dist/esm-es5/pds-dropdown-menu.entry.js.map +1 -1
  262. package/dist/esm-es5/pds-filter.entry.js +1 -1
  263. package/dist/esm-es5/pds-filter.entry.js.map +1 -1
  264. package/dist/esm-es5/pds-input.entry.js +1 -1
  265. package/dist/esm-es5/pds-input.entry.js.map +1 -1
  266. package/dist/esm-es5/pds-link.entry.js +1 -1
  267. package/dist/esm-es5/pds-modal.entry.js +1 -1
  268. package/dist/esm-es5/pds-modal.entry.js.map +1 -1
  269. package/dist/esm-es5/pds-popover.entry.js +1 -1
  270. package/dist/esm-es5/pds-popover.entry.js.map +1 -1
  271. package/dist/esm-es5/pds-radio.entry.js +1 -1
  272. package/dist/esm-es5/pds-radio.entry.js.map +1 -1
  273. package/dist/esm-es5/pds-select.entry.js +1 -1
  274. package/dist/esm-es5/pds-select.entry.js.map +1 -1
  275. package/dist/esm-es5/pds-sortable-item.entry.js +1 -1
  276. package/dist/esm-es5/pds-switch.entry.js +1 -1
  277. package/dist/esm-es5/pds-switch.entry.js.map +1 -1
  278. package/dist/esm-es5/pds-tab.entry.js +1 -1
  279. package/dist/esm-es5/pds-tab.entry.js.map +1 -1
  280. package/dist/esm-es5/pds-table-cell.entry.js +1 -1
  281. package/dist/esm-es5/pds-table-cell.entry.js.map +1 -1
  282. package/dist/esm-es5/pds-table-head-cell.entry.js +1 -1
  283. package/dist/esm-es5/pds-table-head-cell.entry.js.map +1 -1
  284. package/dist/esm-es5/pds-table-head.entry.js +1 -1
  285. package/dist/esm-es5/pds-table-head.entry.js.map +1 -1
  286. package/dist/esm-es5/pds-table-row.entry.js +1 -1
  287. package/dist/esm-es5/pds-table-row.entry.js.map +1 -1
  288. package/dist/esm-es5/pds-table.entry.js +1 -1
  289. package/dist/esm-es5/pds-table.entry.js.map +1 -1
  290. package/dist/esm-es5/pds-tabs.entry.js +1 -1
  291. package/dist/esm-es5/pds-tabs.entry.js.map +1 -1
  292. package/dist/esm-es5/pds-textarea.entry.js +1 -1
  293. package/dist/esm-es5/pds-textarea.entry.js.map +1 -1
  294. package/dist/esm-es5/pds-tooltip.entry.js +1 -1
  295. package/dist/esm-es5/pds-tooltip.entry.js.map +1 -1
  296. package/dist/esm-es5/pine-core.js +1 -1
  297. package/dist/pine-core/mock-pds-modal.entry.esm.js.map +1 -1
  298. package/dist/pine-core/p-00346c62.system.entry.js +2 -0
  299. package/dist/pine-core/p-00346c62.system.entry.js.map +1 -0
  300. package/dist/pine-core/{p-8ded79aa.system.entry.js → p-0486ecc6.system.entry.js} +2 -2
  301. package/dist/pine-core/{p-8ded79aa.system.entry.js.map → p-0486ecc6.system.entry.js.map} +1 -1
  302. package/dist/pine-core/{p-af56cb57.entry.js → p-100de2b7.entry.js} +2 -2
  303. package/dist/pine-core/p-1b932ee3.entry.js +2 -0
  304. package/dist/pine-core/p-1b932ee3.entry.js.map +1 -0
  305. package/dist/pine-core/p-20466115.entry.js +2 -0
  306. package/dist/pine-core/p-20466115.entry.js.map +1 -0
  307. package/dist/pine-core/{p-72d87dc6.system.entry.js → p-2054b5cb.system.entry.js} +2 -2
  308. package/dist/pine-core/{p-c0601420.system.entry.js → p-2aab28b1.system.entry.js} +2 -2
  309. package/dist/pine-core/p-3dce3bc0.system.entry.js +2 -0
  310. package/dist/pine-core/p-3dce3bc0.system.entry.js.map +1 -0
  311. package/dist/pine-core/p-45d574f1.system.entry.js +2 -0
  312. package/dist/pine-core/p-45d574f1.system.entry.js.map +1 -0
  313. package/dist/pine-core/p-465e3418.system.entry.js +2 -0
  314. package/dist/pine-core/p-465e3418.system.entry.js.map +1 -0
  315. package/dist/pine-core/p-4xv5UVkx.system.js.map +1 -0
  316. package/dist/pine-core/p-538b3902.system.entry.js +2 -0
  317. package/dist/pine-core/p-538b3902.system.entry.js.map +1 -0
  318. package/dist/pine-core/p-61a25ab2.entry.js +2 -0
  319. package/dist/pine-core/p-61a25ab2.entry.js.map +1 -0
  320. package/dist/pine-core/p-6381a811.system.entry.js +4 -0
  321. package/dist/pine-core/p-6381a811.system.entry.js.map +1 -0
  322. package/dist/pine-core/p-6c36cab6.entry.js +2 -0
  323. package/dist/pine-core/p-6c36cab6.entry.js.map +1 -0
  324. package/dist/pine-core/p-6ed297cb.entry.js +2 -0
  325. package/dist/pine-core/p-6ed297cb.entry.js.map +1 -0
  326. package/dist/pine-core/p-708e963c.system.entry.js +2 -0
  327. package/dist/pine-core/p-708e963c.system.entry.js.map +1 -0
  328. package/dist/pine-core/p-7090d42d.system.entry.js +2 -0
  329. package/dist/pine-core/p-7090d42d.system.entry.js.map +1 -0
  330. package/dist/pine-core/{p-896e2f1b.entry.js → p-725c350c.entry.js} +2 -2
  331. package/dist/pine-core/{p-896e2f1b.entry.js.map → p-725c350c.entry.js.map} +1 -1
  332. package/dist/pine-core/p-75187352.system.entry.js +2 -0
  333. package/dist/pine-core/p-75187352.system.entry.js.map +1 -0
  334. package/dist/pine-core/p-79422986.entry.js +2 -0
  335. package/dist/pine-core/p-79422986.entry.js.map +1 -0
  336. package/dist/pine-core/p-81bc089e.entry.js +2 -0
  337. package/dist/pine-core/p-81bc089e.entry.js.map +1 -0
  338. package/dist/pine-core/p-85c41629.entry.js +2 -0
  339. package/dist/pine-core/p-85c41629.entry.js.map +1 -0
  340. package/dist/pine-core/p-86263a62.entry.js +2 -0
  341. package/dist/pine-core/p-86263a62.entry.js.map +1 -0
  342. package/dist/pine-core/p-87ed43d5.entry.js +2 -0
  343. package/dist/pine-core/p-87ed43d5.entry.js.map +1 -0
  344. package/dist/pine-core/{p-a54d6a53.entry.js → p-88773b86.entry.js} +2 -2
  345. package/dist/pine-core/p-8b4fb3f0.entry.js +2 -0
  346. package/dist/pine-core/p-8b4fb3f0.entry.js.map +1 -0
  347. package/dist/pine-core/p-8b5fc4b4.system.entry.js +2 -0
  348. package/dist/pine-core/p-8b5fc4b4.system.entry.js.map +1 -0
  349. package/dist/pine-core/p-94183716.entry.js +2 -0
  350. package/dist/pine-core/p-94183716.entry.js.map +1 -0
  351. package/dist/pine-core/p-9766923f.entry.js +2 -0
  352. package/dist/pine-core/p-9766923f.entry.js.map +1 -0
  353. package/dist/pine-core/p-9b335a9f.entry.js +2 -0
  354. package/dist/pine-core/p-9b335a9f.entry.js.map +1 -0
  355. package/dist/pine-core/p-9c579956.system.entry.js +2 -0
  356. package/dist/pine-core/p-9c579956.system.entry.js.map +1 -0
  357. package/dist/pine-core/p-9cf2b7a6.entry.js +2 -0
  358. package/dist/pine-core/p-9cf2b7a6.entry.js.map +1 -0
  359. package/dist/pine-core/{p-COwpA8ab.system.js.map → p-B-Doh1Wu.system.js.map} +1 -1
  360. package/dist/pine-core/{p-BSkbMuB5.system.js → p-BG99uNIQ.system.js} +1 -1
  361. package/dist/pine-core/p-BG99uNIQ.system.js.map +1 -0
  362. package/dist/pine-core/p-BHavepTY.system.js +2 -0
  363. package/dist/pine-core/p-BHavepTY.system.js.map +1 -0
  364. package/dist/pine-core/p-BLC5kuro.system.js.map +1 -0
  365. package/dist/pine-core/p-BPjnTOEL.system.js +1 -1
  366. package/dist/pine-core/{p-X5M4eshC.system.js.map → p-BRIdBthP.system.js.map} +1 -1
  367. package/dist/pine-core/{p-B57Bybw-.system.js.map → p-BkPtASB1.system.js.map} +1 -1
  368. package/dist/pine-core/p-Bkfqi7zE.system.js.map +1 -0
  369. package/dist/pine-core/p-C1KChp5Q.system.js.map +1 -0
  370. package/dist/pine-core/p-C2W-sHx5.system.js.map +1 -0
  371. package/dist/pine-core/p-CIBXMJd-.system.js.map +1 -0
  372. package/dist/pine-core/p-CJNB_wrl.system.js.map +1 -0
  373. package/dist/pine-core/p-CSa_b_JX.system.js.map +1 -0
  374. package/dist/pine-core/p-Cid662up.system.js.map +1 -0
  375. package/dist/pine-core/p-Cqzmj3D8.system.js.map +1 -0
  376. package/dist/pine-core/p-Cxlv_2hD.system.js.map +1 -0
  377. package/dist/pine-core/p-D0foS5EP.system.js.map +1 -0
  378. package/dist/pine-core/{p-D4MkIUXU.js → p-D4zJBIgl.js} +1 -1
  379. package/dist/pine-core/p-D4zJBIgl.js.map +1 -0
  380. package/dist/pine-core/p-DCjZr2HA.system.js.map +1 -0
  381. package/dist/pine-core/p-DN3VK2yy.system.js.map +1 -0
  382. package/dist/pine-core/{p-DgE9ds9o.system.js.map → p-DOqVoXeA.system.js.map} +1 -1
  383. package/dist/pine-core/p-DW3lkDNz.system.js.map +1 -0
  384. package/dist/pine-core/p-DfrSuf6X.system.js.map +1 -0
  385. package/dist/pine-core/p-DpemOPFJ.system.js.map +1 -0
  386. package/dist/pine-core/p-DpzRSULT.system.js.map +1 -0
  387. package/dist/pine-core/p-DtdXdmNp.system.js.map +1 -0
  388. package/dist/pine-core/p-Dw05F6Xg.system.js.map +1 -0
  389. package/dist/pine-core/p-DwjNklzi.js +2 -0
  390. package/dist/pine-core/p-DwjNklzi.js.map +1 -0
  391. package/dist/pine-core/p-GrmqKqN8.system.js.map +1 -0
  392. package/dist/pine-core/p-HHZU8rBT.system.js.map +1 -0
  393. package/dist/pine-core/p-a2708028.entry.js +2 -0
  394. package/dist/pine-core/p-a2708028.entry.js.map +1 -0
  395. package/dist/pine-core/{p-46820152.entry.js → p-a3785977.entry.js} +2 -2
  396. package/dist/pine-core/p-a707a7da.system.entry.js +2 -0
  397. package/dist/pine-core/p-a707a7da.system.entry.js.map +1 -0
  398. package/dist/pine-core/p-acd87a10.entry.js +2 -0
  399. package/dist/pine-core/p-acd87a10.entry.js.map +1 -0
  400. package/dist/pine-core/p-ae4ec5cf.system.entry.js +2 -0
  401. package/dist/pine-core/p-ae4ec5cf.system.entry.js.map +1 -0
  402. package/dist/pine-core/p-b23dd01c.entry.js +2 -0
  403. package/dist/pine-core/p-b23dd01c.entry.js.map +1 -0
  404. package/dist/pine-core/p-b9aafec7.system.entry.js +2 -0
  405. package/dist/pine-core/p-b9aafec7.system.entry.js.map +1 -0
  406. package/dist/pine-core/p-c3579585.system.entry.js +2 -0
  407. package/dist/pine-core/p-c3579585.system.entry.js.map +1 -0
  408. package/dist/pine-core/p-cffc98ae.entry.js +3 -0
  409. package/dist/pine-core/p-cffc98ae.entry.js.map +1 -0
  410. package/dist/pine-core/{p-559b4ebc.entry.js → p-d1b27fa4.entry.js} +2 -2
  411. package/dist/pine-core/p-d2b15290.system.entry.js +2 -0
  412. package/dist/pine-core/p-d2b15290.system.entry.js.map +1 -0
  413. package/dist/pine-core/p-d4d22aee.entry.js +2 -0
  414. package/dist/pine-core/p-d4d22aee.entry.js.map +1 -0
  415. package/dist/pine-core/{p-c63e7909.system.entry.js → p-dace69e7.system.entry.js} +2 -2
  416. package/dist/pine-core/p-e34c1224.system.entry.js +2 -0
  417. package/dist/pine-core/p-e34c1224.system.entry.js.map +1 -0
  418. package/dist/pine-core/p-e5adbf74.system.entry.js +2 -0
  419. package/dist/pine-core/p-e5adbf74.system.entry.js.map +1 -0
  420. package/dist/pine-core/p-e6085566.system.entry.js +2 -0
  421. package/dist/pine-core/p-e6085566.system.entry.js.map +1 -0
  422. package/dist/pine-core/p-e683e197.system.entry.js +2 -0
  423. package/dist/pine-core/p-e683e197.system.entry.js.map +1 -0
  424. package/dist/pine-core/p-e6b051e8.system.entry.js +2 -0
  425. package/dist/pine-core/p-e6b051e8.system.entry.js.map +1 -0
  426. package/dist/pine-core/{p-ab4307c7.system.entry.js → p-e702a8dc.system.entry.js} +2 -2
  427. package/dist/pine-core/p-f15cd180.entry.js +2 -0
  428. package/dist/pine-core/p-f15cd180.entry.js.map +1 -0
  429. package/dist/pine-core/p-f6d0bd39.entry.js +2 -0
  430. package/dist/pine-core/p-f6d0bd39.entry.js.map +1 -0
  431. package/dist/pine-core/p-f92d7570.system.entry.js +2 -0
  432. package/dist/pine-core/p-f92d7570.system.entry.js.map +1 -0
  433. package/dist/pine-core/{p-d325287b.entry.js.map → p-ozqEY4Zc.system.js.map} +1 -1
  434. package/dist/pine-core/pds-button.entry.esm.js.map +1 -1
  435. package/dist/pine-core/pds-checkbox.entry.esm.js.map +1 -1
  436. package/dist/pine-core/pds-chip.entry.esm.js.map +1 -1
  437. package/dist/pine-core/pds-combobox.entry.esm.js.map +1 -1
  438. package/dist/pine-core/pds-copytext.entry.esm.js.map +1 -1
  439. package/dist/pine-core/pds-dropdown-menu.entry.esm.js.map +1 -1
  440. package/dist/pine-core/pds-filter.entry.esm.js.map +1 -1
  441. package/dist/pine-core/pds-input.entry.esm.js.map +1 -1
  442. package/dist/pine-core/pds-modal.entry.esm.js.map +1 -1
  443. package/dist/pine-core/pds-popover.entry.esm.js.map +1 -1
  444. package/dist/pine-core/pds-radio.entry.esm.js.map +1 -1
  445. package/dist/pine-core/pds-select.entry.esm.js.map +1 -1
  446. package/dist/pine-core/pds-switch.entry.esm.js.map +1 -1
  447. package/dist/pine-core/pds-tab.entry.esm.js.map +1 -1
  448. package/dist/pine-core/pds-table-cell.entry.esm.js.map +1 -1
  449. package/dist/pine-core/pds-table-head-cell.entry.esm.js.map +1 -1
  450. package/dist/pine-core/pds-table-head.entry.esm.js.map +1 -1
  451. package/dist/pine-core/pds-table-row.entry.esm.js.map +1 -1
  452. package/dist/pine-core/pds-table.entry.esm.js.map +1 -1
  453. package/dist/pine-core/pds-tabs.entry.esm.js.map +1 -1
  454. package/dist/pine-core/pds-textarea.entry.esm.js.map +1 -1
  455. package/dist/pine-core/pds-tooltip.entry.esm.js.map +1 -1
  456. package/dist/pine-core/pine-core.css +1 -1
  457. package/dist/pine-core/pine-core.esm.js +1 -1
  458. package/dist/types/components/pds-checkbox/pds-checkbox.d.ts +1 -0
  459. package/dist/types/components/pds-chip/pds-chip.d.ts +3 -2
  460. package/dist/types/components/pds-combobox/pds-combobox.d.ts +56 -2
  461. package/dist/types/components/pds-popover/pds-popover.d.ts +33 -2
  462. package/dist/types/components/pds-popover/popover-interface.d.ts +8 -0
  463. package/dist/types/components/pds-radio/pds-radio.d.ts +3 -0
  464. package/dist/types/components/pds-select/pds-select.d.ts +6 -0
  465. package/dist/types/components/pds-switch/pds-switch.d.ts +1 -0
  466. package/dist/types/components/pds-textarea/pds-textarea.d.ts +1 -0
  467. package/dist/types/components.d.ts +94 -10
  468. package/dist/types/utils/form.d.ts +9 -0
  469. package/dist/types/utils/types.d.ts +2 -0
  470. package/hydrate/index.js +629 -101
  471. package/hydrate/index.mjs +629 -101
  472. package/package.json +2 -2
  473. package/dist/cjs/form-Bx4nzJBo.js.map +0 -1
  474. package/dist/cjs/index-CTirFLR-.js.map +0 -1
  475. package/dist/esm/form-DTL_39D_.js +0 -32
  476. package/dist/esm/form-DTL_39D_.js.map +0 -1
  477. package/dist/esm/index-D4MkIUXU.js.map +0 -1
  478. package/dist/esm-es5/form-DTL_39D_.js +0 -2
  479. package/dist/esm-es5/form-DTL_39D_.js.map +0 -1
  480. package/dist/esm-es5/index-D4MkIUXU.js.map +0 -1
  481. package/dist/pine-core/p-0075bbbe.system.entry.js +0 -2
  482. package/dist/pine-core/p-0075bbbe.system.entry.js.map +0 -1
  483. package/dist/pine-core/p-0975b749.system.entry.js +0 -2
  484. package/dist/pine-core/p-0975b749.system.entry.js.map +0 -1
  485. package/dist/pine-core/p-0befa8f0.entry.js +0 -2
  486. package/dist/pine-core/p-0befa8f0.entry.js.map +0 -1
  487. package/dist/pine-core/p-0d18171c.system.entry.js +0 -2
  488. package/dist/pine-core/p-0d18171c.system.entry.js.map +0 -1
  489. package/dist/pine-core/p-1773aeac.system.entry.js +0 -2
  490. package/dist/pine-core/p-1773aeac.system.entry.js.map +0 -1
  491. package/dist/pine-core/p-265372d3.entry.js +0 -2
  492. package/dist/pine-core/p-265372d3.entry.js.map +0 -1
  493. package/dist/pine-core/p-29b2af94.entry.js +0 -2
  494. package/dist/pine-core/p-29b2af94.entry.js.map +0 -1
  495. package/dist/pine-core/p-2b452883.system.entry.js +0 -2
  496. package/dist/pine-core/p-2b452883.system.entry.js.map +0 -1
  497. package/dist/pine-core/p-30e8c3ea.entry.js +0 -2
  498. package/dist/pine-core/p-30e8c3ea.entry.js.map +0 -1
  499. package/dist/pine-core/p-31f6fcc1.entry.js +0 -2
  500. package/dist/pine-core/p-31f6fcc1.entry.js.map +0 -1
  501. package/dist/pine-core/p-3b20aa93.system.entry.js +0 -2
  502. package/dist/pine-core/p-3b20aa93.system.entry.js.map +0 -1
  503. package/dist/pine-core/p-3e7933bf.entry.js +0 -2
  504. package/dist/pine-core/p-3e7933bf.entry.js.map +0 -1
  505. package/dist/pine-core/p-4534e8cc.system.entry.js +0 -2
  506. package/dist/pine-core/p-4534e8cc.system.entry.js.map +0 -1
  507. package/dist/pine-core/p-4b3a8cab.entry.js +0 -2
  508. package/dist/pine-core/p-4b3a8cab.entry.js.map +0 -1
  509. package/dist/pine-core/p-4c8bebd8.system.entry.js +0 -2
  510. package/dist/pine-core/p-4c8bebd8.system.entry.js.map +0 -1
  511. package/dist/pine-core/p-4dda1edf.entry.js +0 -2
  512. package/dist/pine-core/p-4dda1edf.entry.js.map +0 -1
  513. package/dist/pine-core/p-4e55730d.entry.js +0 -2
  514. package/dist/pine-core/p-4e55730d.entry.js.map +0 -1
  515. package/dist/pine-core/p-56f6f106.entry.js +0 -2
  516. package/dist/pine-core/p-56f6f106.entry.js.map +0 -1
  517. package/dist/pine-core/p-5cc0244d.system.entry.js +0 -2
  518. package/dist/pine-core/p-5cc0244d.system.entry.js.map +0 -1
  519. package/dist/pine-core/p-74f03e75.entry.js +0 -2
  520. package/dist/pine-core/p-74f03e75.entry.js.map +0 -1
  521. package/dist/pine-core/p-7b0517e5.system.entry.js +0 -2
  522. package/dist/pine-core/p-7b0517e5.system.entry.js.map +0 -1
  523. package/dist/pine-core/p-7b66bc50.entry.js +0 -3
  524. package/dist/pine-core/p-7b66bc50.entry.js.map +0 -1
  525. package/dist/pine-core/p-7eb22880.entry.js +0 -2
  526. package/dist/pine-core/p-7eb22880.entry.js.map +0 -1
  527. package/dist/pine-core/p-8501429f.entry.js +0 -2
  528. package/dist/pine-core/p-8501429f.entry.js.map +0 -1
  529. package/dist/pine-core/p-94fe15b0.system.entry.js +0 -2
  530. package/dist/pine-core/p-94fe15b0.system.entry.js.map +0 -1
  531. package/dist/pine-core/p-95aee0b1.entry.js +0 -2
  532. package/dist/pine-core/p-95aee0b1.entry.js.map +0 -1
  533. package/dist/pine-core/p-B02VgXkx.system.js.map +0 -1
  534. package/dist/pine-core/p-BFiM1S8V.system.js.map +0 -1
  535. package/dist/pine-core/p-BG7_qxVr.system.js +0 -2
  536. package/dist/pine-core/p-BG7_qxVr.system.js.map +0 -1
  537. package/dist/pine-core/p-BJhtHwq5.system.js.map +0 -1
  538. package/dist/pine-core/p-BQFgzIQT.system.js.map +0 -1
  539. package/dist/pine-core/p-BSkbMuB5.system.js.map +0 -1
  540. package/dist/pine-core/p-BigOVPun.system.js.map +0 -1
  541. package/dist/pine-core/p-BmFGXXkm.system.js.map +0 -1
  542. package/dist/pine-core/p-CHVzHNgU.system.js.map +0 -1
  543. package/dist/pine-core/p-CV0Lw9gs.system.js.map +0 -1
  544. package/dist/pine-core/p-CZqgW7e3.system.js.map +0 -1
  545. package/dist/pine-core/p-Cc1q-FuD.system.js.map +0 -1
  546. package/dist/pine-core/p-D3SrjYeb.system.js.map +0 -1
  547. package/dist/pine-core/p-D4MkIUXU.js.map +0 -1
  548. package/dist/pine-core/p-D9veIL-g.system.js.map +0 -1
  549. package/dist/pine-core/p-DGFR-x7P.system.js.map +0 -1
  550. package/dist/pine-core/p-DTL_39D_.js +0 -2
  551. package/dist/pine-core/p-DTL_39D_.js.map +0 -1
  552. package/dist/pine-core/p-DeR0sSWy.system.js.map +0 -1
  553. package/dist/pine-core/p-Df597YUK.system.js.map +0 -1
  554. package/dist/pine-core/p-Ek6vvXfI.system.js.map +0 -1
  555. package/dist/pine-core/p-WO5h6NYA.system.js.map +0 -1
  556. package/dist/pine-core/p-Z5rOSkoA.system.js.map +0 -1
  557. package/dist/pine-core/p-a5cf0088.system.entry.js +0 -2
  558. package/dist/pine-core/p-a5cf0088.system.entry.js.map +0 -1
  559. package/dist/pine-core/p-aa2782b9.system.entry.js +0 -2
  560. package/dist/pine-core/p-aa2782b9.system.entry.js.map +0 -1
  561. package/dist/pine-core/p-b32d34d0.entry.js +0 -2
  562. package/dist/pine-core/p-b32d34d0.entry.js.map +0 -1
  563. package/dist/pine-core/p-b378ca03.entry.js +0 -2
  564. package/dist/pine-core/p-b378ca03.entry.js.map +0 -1
  565. package/dist/pine-core/p-b699a14f.system.entry.js +0 -2
  566. package/dist/pine-core/p-b699a14f.system.entry.js.map +0 -1
  567. package/dist/pine-core/p-c2d2fe64.system.entry.js +0 -2
  568. package/dist/pine-core/p-c2d2fe64.system.entry.js.map +0 -1
  569. package/dist/pine-core/p-d325287b.entry.js +0 -2
  570. package/dist/pine-core/p-d52d96b5.system.entry.js +0 -4
  571. package/dist/pine-core/p-d52d96b5.system.entry.js.map +0 -1
  572. package/dist/pine-core/p-d5c63517.system.entry.js +0 -2
  573. package/dist/pine-core/p-d5c63517.system.entry.js.map +0 -1
  574. package/dist/pine-core/p-d65d252d.entry.js +0 -2
  575. package/dist/pine-core/p-d65d252d.entry.js.map +0 -1
  576. package/dist/pine-core/p-dbe41087.system.entry.js +0 -2
  577. package/dist/pine-core/p-dbe41087.system.entry.js.map +0 -1
  578. package/dist/pine-core/p-e03b7f4a.system.entry.js +0 -2
  579. package/dist/pine-core/p-e03b7f4a.system.entry.js.map +0 -1
  580. package/dist/pine-core/p-f6b269ac.entry.js +0 -2
  581. package/dist/pine-core/p-f6b269ac.entry.js.map +0 -1
  582. package/dist/pine-core/p-f70aef6e.system.entry.js +0 -2
  583. package/dist/pine-core/p-f70aef6e.system.entry.js.map +0 -1
  584. package/dist/pine-core/p-fd3d548f.entry.js +0 -2
  585. package/dist/pine-core/p-fd3d548f.entry.js.map +0 -1
  586. package/dist/pine-core/p-fddf82f8.entry.js +0 -2
  587. package/dist/pine-core/p-fddf82f8.entry.js.map +0 -1
  588. package/dist/pine-core/p-fdf22be1.system.entry.js +0 -2
  589. package/dist/pine-core/p-fdf22be1.system.entry.js.map +0 -1
  590. package/dist/pine-core/p-fe7ece91.system.entry.js +0 -2
  591. package/dist/pine-core/p-fe7ece91.system.entry.js.map +0 -1
  592. package/dist/pine-core/p-iM8w34Dq.system.js.map +0 -1
  593. package/dist/pine-core/p-kbAzjMDU.system.js.map +0 -1
  594. package/dist/pine-core/p-nawkAoxk.system.js.map +0 -1
  595. package/dist/pine-core/p-oDk-2Jyq.system.js.map +0 -1
  596. package/dist/pine-core/p-wlxYjeBe.system.js.map +0 -1
  597. /package/dist/pine-core/{p-af56cb57.entry.js.map → p-100de2b7.entry.js.map} +0 -0
  598. /package/dist/pine-core/{p-72d87dc6.system.entry.js.map → p-2054b5cb.system.entry.js.map} +0 -0
  599. /package/dist/pine-core/{p-c0601420.system.entry.js.map → p-2aab28b1.system.entry.js.map} +0 -0
  600. /package/dist/pine-core/{p-a54d6a53.entry.js.map → p-88773b86.entry.js.map} +0 -0
  601. /package/dist/pine-core/{p-46820152.entry.js.map → p-a3785977.entry.js.map} +0 -0
  602. /package/dist/pine-core/{p-559b4ebc.entry.js.map → p-d1b27fa4.entry.js.map} +0 -0
  603. /package/dist/pine-core/{p-c63e7909.system.entry.js.map → p-dace69e7.system.entry.js.map} +0 -0
  604. /package/dist/pine-core/{p-ab4307c7.system.entry.js.map → p-e702a8dc.system.entry.js.map} +0 -0
@@ -0,0 +1 @@
1
+ {"version":3,"names":["pdsInputTokensCss","labelCss","pdsInputCss","PdsInput","constructor","hostRef","this","inheritedAttributes","isComposing","hasPrefix","hasSuffix","hasPrepend","hasAppend","hasAction","type","value","hasFocus","onInputEvent","ev","input","target","emitInputChange","onChangeEvent","emitValueChange","onBlurEvent","focusedValue","pdsBlur","emit","onFocusEvent","pdsFocus","onCompositionStart","onCompositionEnd","setFocus","nativeInput","focus","updateAddonWidths","requestAnimationFrame","prefixEl","prefixWidth","offsetWidth","el","style","setProperty","suffixEl","suffixWidth","renderPrefix","querySelector","h","class","part","ref","name","onSlotchange","renderSuffix","renderPrepend","renderAppend","renderAction","componentWillLoad","Object","assign","inheritAriaAttributes","originalPdsInput","pdsInput","connectedCallback","attachInternals","internals","componentDidLoad","debounceChanged","updateFormValue","componentDidUpdate","debounce","undefined","debounceEvent","valueChanged","getValue","toString","event","newValue","pdsChange","setFormValue","setValidity","validity","validationMessage","formResetCallback","formDisabledCallback","disabled","formStateRestoreCallback","state","FormData","get","render","componentId","errorMessage","helperMessage","invalid","label","inputWrapperClasses","Host","key","readonly","hideLabel","fullWidth","htmlFor","required","assignDescription","autocomplete","id","max","maxlength","min","minlength","pattern","placeholder","readOnly","step","onInput","onChange","onBlur","onFocus","onCompositionstart","onCompositionend","messageId","icon","danger","size"],"sources":["src/components/pds-input/pds-input.tokens.scss?tag=pds-input&encapsulation=shadow","src/global/styles/utils/label.scss?tag=pds-input&encapsulation=shadow","src/components/pds-input/pds-input.scss?tag=pds-input&encapsulation=shadow","src/components/pds-input/pds-input.tsx"],"sourcesContent":["@use '~@kajabi-ui/styles/dist/pine/components/pds-input/pds-input.tokens'\n",":host {\n display: inline-block;\n}\n\n:host([aria-disabled=\"true\"]) label {\n color: var(--pine-color-text-label-disabled);\n}\n\n:host([aria-readonly=\"true\"]) {\n label {\n color: var(--pine-color-text-label-readonly);\n }\n}\n\nlabel {\n color: var(--pine-color-text-label);\n font: var(--pine-typography-body-medium);\n letter-spacing: var(--pine-letter-spacing);\n}\n",":host {\n --pds-input-background: var(--pine-color-background-container);\n --pds-input-border-color: var(--pine-color-border);\n --pds-input-border-color-hover: var(--pine-color-border-hover);\n --pds-input-border-color-disabled: var(--pine-color-border-disabled);\n\n --pds-input-border-radius: var(--pine-dimension-125);\n --pds-input-border-width: var(--pine-border-width-thin);\n --pds-input-padding-x: var(--pine-dimension-150);\n --pds-input-padding-y: calc(var(--pine-dimension-xs) - var(--pine-border-width));\n --pds-input-font: var(--pine-typography-body);\n --pds-input-text-color: var(--pine-color-text-active);\n --pds-input-placeholder-color: var(--pine-color-text-placeholder);\n --pds-input-icon-color: var(--pine-color-text-secondary);\n --pds-input-disabled-background: var(--pine-color-background-container-disabled);\n --pds-input-disabled-text-color: var(--pine-color-text-disabled);\n --pds-input-error-color: var(--pine-color-text-message-danger);\n --pds-input-error-background: var(--pine-input-color-background-danger);\n --pds-input-error-border: var(--pine-color-border-danger);\n --pds-input-error-border-hover: var(--pine-color-border-danger-hover);\n --pds-input-addon-background: var(--pine-color-background-subtle);\n --pds-input-addon-color: var(--pine-color-text-secondary);\n --pds-input-field-min-height: var(--pine-dimension-450);\n --box-shadow-focus: 0 0 0 1px #ffffff, 0 0 0 3px var(--pine-color-focus-ring);\n --box-shadow-focus-error: 0 0 0 1px #ffffff, 0 0 0 3px var(--pine-color-focus-ring-danger);\n\n display: inline;\n\n pds-select::part(select) {\n background-color: var(--pds-input-error-background);\n border-color: var(--pds-input-error-border);\n }\n\n &::part(prefix),\n &::part(suffix) {\n align-items: center;\n color: var(--pine-color-text-label-readonly);\n display: flex;\n height: 100%;\n position: absolute;\n top: 50%;\n transform: translateY(-50%);\n white-space: nowrap;\n z-index: var(--pine-z-index-raised);\n }\n\n &::part(prefix) {\n border-end-start-radius: var(--pds-input-border-radius);\n border-inline-end: var(--pine-border-width-none);\n border-start-start-radius: var(--pds-input-border-radius);\n left: var(--pds-input-padding-x);\n }\n\n &::part(suffix) {\n border-end-end-radius: var(--pds-input-border-radius);\n border-inline-start: var(--pine-border-width-none);\n border-start-end-radius: var(--pds-input-border-radius);\n right: var(--pds-input-padding-x);\n }\n\n &::part(prepend),\n &::part(append) {\n align-items: center;\n background-color: var(--pds-input-addon-background);\n border: var(--pds-input-border-width) solid var(--pds-input-border-color);\n color: var(--pds-input-addon-color);\n display: flex;\n overflow: visible;\n }\n\n &::part(prepend) {\n border-end-start-radius: var(--pds-input-border-radius);\n border-inline-end: var(--pine-border-width-none);\n border-start-start-radius: var(--pds-input-border-radius);\n }\n\n &::part(append) {\n border-end-end-radius: var(--pds-input-border-radius);\n border-inline-start: var(--pine-border-width-none);\n border-start-end-radius: var(--pds-input-border-radius);\n }\n}\n\n/* stylelint-disable-next-line */\n:host([has-prepend]) ::slotted(pds-button[slot=\"prepend\"]) {\n --pds-button-background: var(--pds-input-addon-background);\n --pds-button-border: var(--pine-border-width-none);\n --pds-button-border-radius: var(--pine-dimension-none);\n --pds-button-border-radius-end-end: var(--pine-dimension-none);\n --pds-button-border-radius-start-end: var(--pine-dimension-none);\n --pds-button-border-radius-start-start: var(--pds-input-border-radius);\n --pds-button-border-radius-end-start: var(--pds-input-border-radius);\n --pds-button-min-height: calc(var(--pine-dimension-450) - calc(2 * var(--pine-border-width)));\n --pds-button-box-shadow-focus: 0 0 0 3px var(--pine-color-focus-ring);\n --pds-button-outline-focus: none;\n}\n\n/* stylelint-disable-next-line */\n:host([has-append]) ::slotted(pds-button[slot=\"append\"]) {\n --pds-button-background: var(--pds-input-addon-background);\n --pds-button-border: var(--pine-border-width-none);\n --pds-button-border-radius: var(--pine-dimension-none);\n --pds-button-border-radius-end-start: var(--pine-dimension-none);\n --pds-button-border-radius-start-start: var(--pine-dimension-none);\n --pds-button-border-radius-start-end: var(--pds-input-border-radius);\n --pds-button-border-radius-end-end: var(--pds-input-border-radius);\n --pds-button-min-height: calc(var(--pine-dimension-450) - calc(2 * var(--pine-border-width)));\n --pds-button-box-shadow-focus: 0 0 0 3px var(--pine-color-focus-ring);\n --pds-button-outline-focus: none;\n}\n\n/* stylelint-disable-next-line */\n:host([has-prepend]) ::slotted(pds-select[slot=\"prepend\"]) {\n --pds-select-background: var(--pds-input-addon-background);\n --pds-select-border: var(--pine-border-width-none);\n --pds-select-border-radius-end-end: var(--pine-dimension-none);\n --pds-select-border-radius-start-end: var(--pine-dimension-none);\n --pds-select-min-height: calc(var(--pine-dimension-450) - calc(2 * var(--pine-border-width)));\n}\n\n/* stylelint-disable-next-line */\n:host([has-append]) ::slotted(pds-select[slot=\"append\"]) {\n --pds-select-background: var(--pds-input-addon-background);\n --pds-select-border: var(--pine-border-width-none);\n --pds-select-border-radius-end-start: var(--pine-dimension-none);\n --pds-select-border-radius-start-start: var(--pine-dimension-none);\n --pds-select-min-height: calc(var(--pine-dimension-450) - calc(2 * var(--pine-border-width)));\n}\n\n:host([aria-readonly=\"true\"]) {\n input {\n background-color: var(--pine-color-background-container-disabled);\n color: var(--pine-color-text-readonly);\n }\n}\n\n:host([disabled=\"true\"]) {\n &::part(prepend),\n &::part(append) {\n background-color: var(--pds-input-disabled-background);\n border: var(--pds-input-border-width) solid var(--pds-input-border-color-disabled);\n }\n}\n\n:host([full-width=\"true\"]) {\n width: 100%;\n}\n\n:host([invalid=\"true\"]) {\n &::part(prepend),\n &::part(append) {\n background-color: var(--pds-input-error-background);\n border: var(--pds-input-border-width) solid var(--pds-input-error-border);\n }\n}\n\n.pds-input {\n display: flex;\n flex-direction: column;\n}\n\n.pds-input__label-wrapper {\n align-items: center;\n display: flex;\n justify-content: space-between;\n margin-block-end: var(--pine-dimension-2xs);\n}\n\n.pds-input__label {\n color: var(--pine-color-text-active);\n margin-block-end: var(--pine-dimension-2xs);\n}\n\n// When label is inside wrapper, remove its margin\n.pds-input__label-wrapper .pds-input__label {\n margin-block-end: 0;\n}\n\n.pds-input__action {\n align-items: center;\n display: flex;\n gap: var(--pine-dimension-xs);\n margin-inline-start: var(--pine-dimension-xs);\n}\n\n.pds-input__field-wrapper {\n align-items: center;\n display: flex;\n position: relative;\n width: 100%;\n\n &.has-prefix .pds-input__field {\n padding-inline-start: calc(2 * var(--pds-input-padding-x) + var(--prefix-width, 1em));\n }\n\n &.has-suffix .pds-input__field {\n padding-inline-end: calc(2 * var(--pds-input-padding-x) + var(--suffix-width, 1em));\n }\n\n &.has-prepend .pds-input__field {\n border-end-start-radius: var(--pine-dimension-none);\n border-start-start-radius: var(--pine-dimension-none);\n }\n\n &.has-append .pds-input__field {\n border-end-end-radius: var(--pine-dimension-none);\n border-start-end-radius: var(--pine-dimension-none);\n }\n}\n\n.pds-input__field {\n background: var(--pds-input-background);\n border: var(--pds-input-border-width) solid var(--pds-input-border-color);\n border-radius: var(--pds-input-border-radius);\n box-sizing: border-box;\n color: var(--pds-input-text-color);\n flex: 1;\n font: var(--pds-input-font);\n letter-spacing: var(--pine-letter-spacing);\n min-height: var(--pds-input-field-min-height);\n min-width: var(--pine-dimension-none);\n padding: var(--pds-input-padding-y) var(--pds-input-padding-x);\n transition: border-color 0.2s ease;\n width: 100%;\n\n &:hover:not(:disabled) {\n border-color: var(--pds-input-border-color-hover);\n }\n\n &:disabled {\n background: var(--pds-input-disabled-background);\n border-color: var(--pine-color-border-disabled);\n color: var(--pds-input-disabled-text-color);\n cursor: not-allowed;\n\n &::placeholder {\n color: var(--pine-color-text-placeholder-disabled);\n }\n }\n\n .has-error &:hover:not(:disabled) {\n border-color: var(--pds-input-error-border-hover);\n }\n\n &:focus-visible:not(.has-error) {\n border-color: var(--pine-color-border-active);\n outline: var(--pine-outline-focus);\n outline-offset: var(--pine-border-width);\n position: relative;\n z-index: 1;\n\n :host([has-prepend]) &,\n :host([has-append]) &,\n :host([has-prefix]) &,\n :host([has-suffix]) & {\n outline-offset: var(--pine-dimension-none);\n }\n }\n\n &::placeholder {\n color: var(--pds-input-placeholder-color);\n }\n\n .has-error & {\n background-color: var(--pds-input-error-background);\n border-color: var(--pds-input-error-border);\n\n &:focus-visible {\n outline-color: var(--pine-color-focus-ring-danger);\n position: relative;\n z-index: 1;\n }\n }\n}\n\n.pds-input__error-message,\n.pds-input__helper-message {\n color: var(--pine-color-text-message);\n font: var(--pine-typography-body-sm);\n margin-block-end: var(--pine-dimension-none);\n margin-block-start: var(--pine-dimension-2xs);\n}\n\n.pds-input__error-message {\n align-items: center;\n color: var(--pds-input-error-color);\n display: flex;\n gap: var(--pine-dimension-2xs);\n}\n\n.visually-hidden {\n border: 0;\n clip: rect(0 0 0 0);\n clip-path: polygon(0 0, 0 0, 0 0);\n height: 1px;\n margin: -1px;\n overflow: hidden;\n padding: 0;\n position: absolute;\n white-space: nowrap;\n width: 1px;\n}\n","import { Component, Element, Event, EventEmitter, h, Host, Method, Prop, State, Watch } from '@stencil/core';\nimport { assignDescription, messageId } from '../../utils/form';\nimport { inheritAriaAttributes } from '@utils/attributes';\nimport type { Attributes } from '@utils/attributes';\nimport { InputChangeEventDetail, InputInputEventDetail } from './input-interface';\nimport { debounceEvent } from '@utils/utils';\nimport { danger } from '@pine-ds/icons/icons';\n\n/**\n * @slot append - Content to be displayed after the input field\n * @slot prefix - Content that is displayed visually within the input field before the input field\n * @slot prepend - Content to be displayed before the input field\n * @slot suffix - Content that is displayed visually within the input field after the input field\n * @slot action - Content to be displayed in the label area, typically for help icons or links\n */\n@Component({\n tag: 'pds-input',\n styleUrls: ['pds-input.tokens.scss', '../../global/styles/utils/label.scss', 'pds-input.scss'],\n shadow: true,\n formAssociated: true,\n})\nexport class PdsInput {\n\n private nativeInput?: HTMLInputElement;\n private inheritedAttributes: Attributes = {};\n private isComposing = false;\n private prefixEl?: HTMLElement;\n private suffixEl?: HTMLElement;\n private focusedValue?: string | number | null;\n private originalPdsInput?: EventEmitter<InputInputEventDetail>;\n private internals?: ElementInternals;\n\n @Element() el!: HTMLPdsInputElement;\n\n /**\n * If true, the input has prefix content (non-focusable)\n */\n @State() hasPrefix = false;\n\n /**\n * If true, the input has suffix content (non-focusable)\n */\n @State() hasSuffix = false;\n\n /**\n * If true, the input has prepend content (focusable)\n */\n @State() hasPrepend = false;\n\n /**\n * If true, the input has append content (focusable)\n */\n @State() hasAppend = false;\n\n /**\n * If true, the input has action content in the label area\n */\n @State() hasAction = false;\n\n /**\n * Emitted when the input loses focus.\n */\n @Event() pdsBlur!: EventEmitter<FocusEvent>;\n\n /**\n * Emitted when the value has changed.\n *\n * This event will not emit when programmatically setting the `value` property.\n */\n @Event() pdsChange!: EventEmitter<InputChangeEventDetail>;\n\n /**\n * Emitted when the input has focus.\n */\n @Event() pdsFocus!: EventEmitter<FocusEvent>;\n\n /**\n * Emitted when a keyboard input occurs.\n */\n @Event() pdsInput: EventEmitter<InputInputEventDetail>;\n\n /**\n * Sets focus on the native `input` in the `pds-input`. Use this method instead of the global\n * `input.focus()`.\n */\n @Method()\n async setFocus() {\n if (this.nativeInput) {\n this.nativeInput.focus();\n }\n }\n\n\n /**\n * Specifies if and how the browser provides `autocomplete` assistance for the field.\n */\n @Prop() autocomplete: string;\n\n /**\n * A unique identifier used for the underlying component `id` attribute.\n */\n @Prop() componentId!: string;\n\n /**\n * Sets the number of milliseconds to wait before updating the value.\n */\n @Prop() debounce?: number;\n\n /**\n * Determines whether or not the input field is disabled.\n */\n @Prop() disabled?: boolean;\n\n /**\n * Specifies the error message and provides an error-themed treatment to the field.\n */\n @Prop() errorMessage?: string;\n\n /**\n * Displays a message or hint below the input field.\n */\n @Prop() helperMessage?: string;\n\n /**\n * Determines whether or not the input field is invalid or throws an error.\n */\n @Prop() invalid?: boolean;\n\n /**\n * Text to be displayed as the input label.\n */\n @Prop() label?: string;\n\n /**\n * Visually hides the label text for instances where only the input should be displayed. Label remains accessible to assistive technology such as screen readers.\n * Note: When true, the action slot is also hidden to maintain a minimal UI.\n */\n @Prop() hideLabel: boolean;\n\n /**\n * Specifies the maximum value for the input field.\n */\n @Prop() max?: string;\n\n /**\n * Specifies the maximum number of characters allowed in the input field.\n */\n @Prop() maxlength?: string;\n\n /**\n * Specifies the minimum value for the input field.\n */\n @Prop() min?: string;\n\n /**\n * Specifies the minimum number of characters allowed in the input field.\n */\n @Prop() minlength?: string;\n\n /**\n * Specifies the name. Submitted with the form name/value pair.\n */\n @Prop() name?: string;\n\n /**\n * Specifies the regular expression that the input value is checked against.\n */\n @Prop() pattern?: string;\n\n /**\n * Specifies a short hint that describes the expected value of the input field.\n */\n @Prop() placeholder?: string;\n\n /**\n * Determines whether or not the input field is readonly.\n */\n @Prop() readonly?: boolean;\n\n /**\n * Determines whether or not the input field is required.\n */\n @Prop() required?: boolean;\n\n /**\n * Works with the `min` and `max` attributes to define increments for the input field.\n */\n @Prop() step?: string;\n\n /**\n * Determines the type of control that will be displayed\n * `'email'`, `'number'`, `'password'`, `'tel'`, `'text'`, `'url'`\n * @defaultValue \"text\"\n */\n @Prop() type = 'text';\n\n /**\n * The value of the input.\n */\n @Prop({mutable: true}) value?: string | number | null = '';\n\n /**\n * Determines whether or not the input field takes full width of its container.\n */\n @Prop() fullWidth?: boolean;\n\n /**\n * Determines if the input has focus.\n */\n @State() hasFocus = false;\n\n private updateAddonWidths() {\n requestAnimationFrame(() => {\n if (this.prefixEl) {\n const prefixWidth = this.prefixEl.offsetWidth;\n this.el.style.setProperty('--prefix-width', `${prefixWidth}px`);\n }\n\n if (this.suffixEl) {\n const suffixWidth = this.suffixEl.offsetWidth;\n this.el.style.setProperty('--suffix-width', `${suffixWidth}px`);\n }\n });\n }\n\n private renderPrefix() {\n const hasPrefix = this.el.querySelector('[slot=\"prefix\"]') !== null;\n if (hasPrefix) {\n return (\n <div class=\"pds-input__prefix\" part=\"prefix\" ref={(el) => this.prefixEl = el as HTMLElement}>\n <slot name=\"prefix\" onSlotchange={() => this.updateAddonWidths()}></slot>\n </div>\n );\n }\n return null;\n }\n\n private renderSuffix() {\n const hasSuffix = this.el.querySelector('[slot=\"suffix\"]') !== null;\n if (hasSuffix) {\n return (\n <div class=\"pds-input__suffix\" part=\"suffix\" ref={(el) => this.suffixEl = el as HTMLElement}>\n <slot name=\"suffix\" onSlotchange={() => this.updateAddonWidths()}></slot>\n </div>\n );\n }\n return null;\n }\n\n private renderPrepend() {\n const hasPrepend = this.el.querySelector('[slot=\"prepend\"]') !== null;\n if (hasPrepend) {\n return (\n <div class=\"pds-input__prepend\" part=\"prepend\">\n <slot name=\"prepend\"></slot>\n </div>\n );\n }\n return null;\n }\n\n private renderAppend() {\n const hasAppend = this.el.querySelector('[slot=\"append\"]') !== null;\n if (hasAppend) {\n return (\n <div class=\"pds-input__append\" part=\"append\">\n <slot name=\"append\"></slot>\n </div>\n );\n }\n return null;\n }\n\n private renderAction() {\n const hasAction = this.el.querySelector('[slot=\"action\"]') !== null;\n if (hasAction) {\n return (\n <div class=\"pds-input__action\" part=\"action\">\n <slot name=\"action\"></slot>\n </div>\n );\n }\n return null;\n }\n\n componentWillLoad() {\n this.inheritedAttributes = {\n ...inheritAriaAttributes(this.el)\n };\n this.hasPrefix = this.el.querySelector('[slot=\"prefix\"]') !== null;\n this.hasSuffix = this.el.querySelector('[slot=\"suffix\"]') !== null;\n this.hasPrepend = this.el.querySelector('[slot=\"prepend\"]') !== null;\n this.hasAppend = this.el.querySelector('[slot=\"append\"]') !== null;\n this.hasAction = this.el.querySelector('[slot=\"action\"]') !== null;\n\n // Store the original pdsInput event emitter\n this.originalPdsInput = this.pdsInput;\n }\n\n connectedCallback() {\n // Initialize ElementInternals for form association\n if (this.el.attachInternals) {\n this.internals = this.el.attachInternals();\n }\n }\n\n componentDidLoad() {\n this.debounceChanged();\n this.updateAddonWidths();\n // Set initial form value\n this.updateFormValue();\n }\n\n componentDidUpdate() {\n this.updateAddonWidths();\n }\n\n @Watch('debounce')\n protected debounceChanged() {\n const { pdsInput, debounce, originalPdsInput } = this;\n\n /**\n * If debounce is undefined, we have to manually revert the pdsInput emitter in case\n * debounce used to be set to a number. Otherwise, the event would stay debounced.\n */\n this.pdsInput = debounce === undefined ? originalPdsInput ?? pdsInput : debounceEvent(pdsInput, debounce);\n }\n\n @Watch('value')\n protected valueChanged() {\n const nativeInput = this.nativeInput;\n const value = this.getValue();\n\n if (nativeInput && nativeInput.value !== value && !this.isComposing) {\n nativeInput.value = value;\n }\n\n // Update form value when value changes\n this.updateFormValue();\n }\n\n private getValue(): string {\n return typeof this.value === 'number' ? this.value.toString() : (this.value || '').toString();\n }\n\n private onInputEvent = (ev: Event) => {\n const input = ev.target as HTMLInputElement | null;\n if (input) {\n this.value = input.value || '';\n }\n this.emitInputChange(ev);\n };\n\n private onChangeEvent = (ev: Event) => {\n this.emitValueChange(ev);\n };\n\n private onBlurEvent = (ev: FocusEvent) => {\n this.hasFocus = false;\n\n if (this.focusedValue !== this.value) {\n /**\n * Emits the `pdsChange` event when the input value\n * is different than the value when the input was focused.\n */\n this.emitValueChange(ev);\n }\n\n this.pdsBlur.emit(ev);\n };\n\n private onFocusEvent = (ev: FocusEvent) => {\n this.hasFocus = true;\n this.focusedValue = this.value;\n\n this.pdsFocus.emit(ev);\n };\n\n private onCompositionStart = () => {\n this.isComposing = true;\n }\n\n private onCompositionEnd = () => {\n this.isComposing = false;\n }\n\n /**\n * Emits a pdsChange event\n */\n private emitValueChange(event?: Event) {\n const { value } = this;\n const newValue = value == null ? value : value.toString();\n\n this.focusedValue = newValue;\n this.pdsChange.emit({ value: newValue, event });\n }\n\n /**\n * Emits a `pdsInput` event\n */\n private emitInputChange(event?: Event) {\n const { value } = this;\n\n // Checks for both null and undefined values\n const newValue = value == null ? value : value.toString();\n\n this.pdsInput.emit({ value: newValue, event });\n }\n\n /**\n * Updates the form value using ElementInternals API\n */\n private updateFormValue() {\n if (this.internals && this.internals.setFormValue) {\n const value = this.getValue();\n this.internals.setFormValue(value || null);\n\n // Set validity based on native input validation\n if (this.nativeInput && this.internals && this.internals.setValidity) {\n this.internals.setValidity(\n this.nativeInput.validity,\n this.nativeInput.validationMessage,\n this.nativeInput\n );\n }\n }\n }\n\n /**\n * Form Associated Custom Elements API: Called when the form is reset\n */\n formResetCallback() {\n this.value = '';\n this.updateFormValue();\n }\n\n /**\n * Form Associated Custom Elements API: Called when the form is disabled\n */\n formDisabledCallback(disabled: boolean) {\n this.disabled = disabled;\n }\n\n /**\n * Form Associated Custom Elements API: Called to restore form state\n */\n formStateRestoreCallback(state: string | FormData | null) {\n if (typeof state === 'string') {\n this.value = state;\n } else if (state instanceof FormData && this.name) {\n // Extract value from FormData using the input's name\n const value = state.get(this.name);\n if (typeof value === 'string') {\n this.value = value;\n }\n }\n }\n\n render() {\n const {\n componentId,\n disabled,\n errorMessage,\n helperMessage,\n invalid = false,\n label,\n } = this;\n\n const value = this.getValue();\n\n const inputWrapperClasses = {\n 'pds-input__field-wrapper': true,\n 'has-focus': this.hasFocus,\n 'has-error': invalid || !!errorMessage,\n 'is-disabled': disabled,\n 'has-prefix': this.hasPrefix,\n 'has-suffix': this.hasSuffix,\n 'has-prepend': this.hasPrepend,\n 'has-append': this.hasAppend,\n };\n\n return (\n <Host\n aria-disabled={this.disabled ? 'true' : null}\n aria-readonly={this.readonly ? 'true' : null}\n has-prefix={this.hasPrefix ? 'true' : null}\n has-suffix={this.hasSuffix ? 'true' : null}\n has-prepend={this.hasPrepend ? 'true' : null}\n has-append={this.hasAppend ? 'true' : null}\n has-action={this.hasAction && !this.hideLabel ? 'true' : null}\n full-width={this.fullWidth ? 'true' : null}\n >\n <div class=\"pds-input\">\n {label && (\n <div class=\"pds-input__label-wrapper\">\n <label htmlFor={componentId} class=\"pds-input__label\">\n <span class={this.hideLabel ? 'visually-hidden' : ''}>\n {label}\n {this.required && <span class=\"pds-input__required-indicator\"> *</span>}\n </span>\n </label>\n {!this.hideLabel && this.renderAction()}\n </div>\n )}\n\n <div class={inputWrapperClasses}>\n {this.renderPrepend()}\n {this.renderPrefix()}\n <input\n ref={(input) => (this.nativeInput = input)}\n class=\"pds-input__field\"\n aria-describedby={assignDescription(componentId, invalid, helperMessage)}\n aria-invalid={invalid ? \"true\" : undefined}\n autocomplete={this.autocomplete}\n disabled={disabled}\n id={componentId}\n max={this.max}\n maxlength={this.maxlength}\n min={this.min}\n minlength={this.minlength}\n name={this.name}\n pattern={this.pattern}\n placeholder={this.placeholder}\n readOnly={this.readonly}\n required={this.required}\n step={this.step}\n type={this.type}\n value={value}\n onInput={this.onInputEvent}\n onChange={this.onChangeEvent}\n onBlur={this.onBlurEvent}\n onFocus={this.onFocusEvent}\n onCompositionstart={this.onCompositionStart}\n onCompositionend={this.onCompositionEnd}\n {...this.inheritedAttributes}\n />\n {this.renderSuffix()}\n {this.renderAppend()}\n </div>\n\n {helperMessage && (\n <p class=\"pds-input__helper-message\" id={messageId(componentId, 'helper')}>\n {helperMessage}\n </p>\n )}\n\n {errorMessage && (\n <p class=\"pds-input__error-message\" id={messageId(componentId, 'error')}>\n <pds-icon icon={danger} size=\"small\" />\n {errorMessage}\n </p>\n )}\n </div>\n </Host>\n );\n }\n}\n"],"mappings":"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","ignoreList":[]}
@@ -1,2 +1,2 @@
1
- System.register(["./p-Cxvdulqq.system.js","./p-BSkbMuB5.system.js"],(function(e){"use strict";var s,t,r,i,a;return{setters:[function(e){s=e.r;t=e.h;r=e.H;i=e.g},function(e){a=e.h}],execute:function(){var d=".pds-sortable-item.sc-pds-sortable-item-h{-ms-flex-align:center;align-items:center;display:-ms-flexbox;display:flex;padding-block:var(--pine-dimension-xs);padding-inline:var(--pine-dimension-md)}.pds-sortable-item.sc-pds-sortable-item-h .pds-sortable-item__actions.sc-pds-sortable-item{-webkit-margin-start:auto;margin-inline-start:auto;-webkit-padding-start:var(--pine-dimension-md);padding-inline-start:var(--pine-dimension-md)}.pds-sortable-item.sc-pds-sortable-item-h .pds-sortable-item__handle.sc-pds-sortable-item{line-height:1;-webkit-margin-end:var(--pine-dimension-md);margin-inline-end:var(--pine-dimension-md)}.pds-sortable--bordered .pds-sortable-item.sc-pds-sortable-item-h:first-child{border-start-end-radius:calc(var(--pine-dimension-xs) * 1.25);border-start-start-radius:calc(var(--pine-dimension-xs) * 1.25)}.pds-sortable--bordered .pds-sortable-item.sc-pds-sortable-item-h:last-child{border-end-end-radius:calc(var(--pine-dimension-xs) * 1.25);border-end-start-radius:calc(var(--pine-dimension-xs) * 1.25)}.pds-sortable--divided .pds-sortable-item.sc-pds-sortable-item-h{-webkit-border-after:var(--pine-border);border-block-end:var(--pine-border)}.pds-sortable--divided .pds-sortable-item.sc-pds-sortable-item-h:last-child{-webkit-border-after:0;border-block-end:0}.pds-sortable--handle-type-row .pds-sortable-item.sc-pds-sortable-item-h{cursor:-webkit-grab;cursor:grab}.pds-sortable--handle-type-handle .pds-sortable-item.sc-pds-sortable-item-h .pds-sortable-item__handle.sc-pds-sortable-item{cursor:-webkit-grab;cursor:grab}.pds-sortable-item.sc-pds-sortable-item-h:hover{background-color:var(--pine-color-background-container-hover)}.pds-sortable-item.sc-pds-sortable-item-h:hover pds-icon.sc-pds-sortable-item{color:var(--pine-color-info)}.pds-sortable-item--drag.sc-pds-sortable-item-h{background-color:var(--pine-color-background-container);border-radius:0;-webkit-box-shadow:var(--pine-box-shadow-400);box-shadow:var(--pine-box-shadow-400);opacity:1}.pds-sortable-item--ghost.sc-pds-sortable-item-h{background-color:var(--pine-color-background-container-hover);border-radius:0}";var o=e("pds_sortable_item",function(){function e(e){s(this,e);this.enableActions=false;this.showHandle=false}e.prototype.componentWillRender=function(){this.sortableRef=this.el.closest("pds-sortable");if(this.sortableRef&&this.sortableRef.handleType==="handle"){this.showHandle=true}};e.prototype.render=function(){return t(r,{key:"5c5ada49c505d935bfe505997ab69e7eafc2f642",class:"pds-sortable-item",id:this.componentId},this.showHandle&&t("div",{key:"3041977b792e192192fa9c101f113eb42e87ceea",class:"pds-sortable-item__handle"},t("pds-icon",{key:"082a98c200abcc8023dc126ed83091167c59290e",icon:a})),t("slot",{key:"1e2b2154acee0c3ce09ec77b9949c761ff37181d"}),this.enableActions&&t("div",{key:"5b318f04eb9c74f660900163e17ba51e2c354538",class:"pds-sortable-item__actions"},t("slot",{key:"2c6631a860af0da48b3a007daeff69b59cfaff59",name:"sortable-item-actions"})))};Object.defineProperty(e.prototype,"el",{get:function(){return i(this)},enumerable:false,configurable:true});return e}());o.style=d}}}));
2
- //# sourceMappingURL=p-72d87dc6.system.entry.js.map
1
+ System.register(["./p-Cxvdulqq.system.js","./p-BG99uNIQ.system.js"],(function(e){"use strict";var s,t,r,i,a;return{setters:[function(e){s=e.r;t=e.h;r=e.H;i=e.g},function(e){a=e.h}],execute:function(){var d=".pds-sortable-item.sc-pds-sortable-item-h{-ms-flex-align:center;align-items:center;display:-ms-flexbox;display:flex;padding-block:var(--pine-dimension-xs);padding-inline:var(--pine-dimension-md)}.pds-sortable-item.sc-pds-sortable-item-h .pds-sortable-item__actions.sc-pds-sortable-item{-webkit-margin-start:auto;margin-inline-start:auto;-webkit-padding-start:var(--pine-dimension-md);padding-inline-start:var(--pine-dimension-md)}.pds-sortable-item.sc-pds-sortable-item-h .pds-sortable-item__handle.sc-pds-sortable-item{line-height:1;-webkit-margin-end:var(--pine-dimension-md);margin-inline-end:var(--pine-dimension-md)}.pds-sortable--bordered .pds-sortable-item.sc-pds-sortable-item-h:first-child{border-start-end-radius:calc(var(--pine-dimension-xs) * 1.25);border-start-start-radius:calc(var(--pine-dimension-xs) * 1.25)}.pds-sortable--bordered .pds-sortable-item.sc-pds-sortable-item-h:last-child{border-end-end-radius:calc(var(--pine-dimension-xs) * 1.25);border-end-start-radius:calc(var(--pine-dimension-xs) * 1.25)}.pds-sortable--divided .pds-sortable-item.sc-pds-sortable-item-h{-webkit-border-after:var(--pine-border);border-block-end:var(--pine-border)}.pds-sortable--divided .pds-sortable-item.sc-pds-sortable-item-h:last-child{-webkit-border-after:0;border-block-end:0}.pds-sortable--handle-type-row .pds-sortable-item.sc-pds-sortable-item-h{cursor:-webkit-grab;cursor:grab}.pds-sortable--handle-type-handle .pds-sortable-item.sc-pds-sortable-item-h .pds-sortable-item__handle.sc-pds-sortable-item{cursor:-webkit-grab;cursor:grab}.pds-sortable-item.sc-pds-sortable-item-h:hover{background-color:var(--pine-color-background-container-hover)}.pds-sortable-item.sc-pds-sortable-item-h:hover pds-icon.sc-pds-sortable-item{color:var(--pine-color-info)}.pds-sortable-item--drag.sc-pds-sortable-item-h{background-color:var(--pine-color-background-container);border-radius:0;-webkit-box-shadow:var(--pine-box-shadow-400);box-shadow:var(--pine-box-shadow-400);opacity:1}.pds-sortable-item--ghost.sc-pds-sortable-item-h{background-color:var(--pine-color-background-container-hover);border-radius:0}";var o=e("pds_sortable_item",function(){function e(e){s(this,e);this.enableActions=false;this.showHandle=false}e.prototype.componentWillRender=function(){this.sortableRef=this.el.closest("pds-sortable");if(this.sortableRef&&this.sortableRef.handleType==="handle"){this.showHandle=true}};e.prototype.render=function(){return t(r,{key:"5c5ada49c505d935bfe505997ab69e7eafc2f642",class:"pds-sortable-item",id:this.componentId},this.showHandle&&t("div",{key:"3041977b792e192192fa9c101f113eb42e87ceea",class:"pds-sortable-item__handle"},t("pds-icon",{key:"082a98c200abcc8023dc126ed83091167c59290e",icon:a})),t("slot",{key:"1e2b2154acee0c3ce09ec77b9949c761ff37181d"}),this.enableActions&&t("div",{key:"5b318f04eb9c74f660900163e17ba51e2c354538",class:"pds-sortable-item__actions"},t("slot",{key:"2c6631a860af0da48b3a007daeff69b59cfaff59",name:"sortable-item-actions"})))};Object.defineProperty(e.prototype,"el",{get:function(){return i(this)},enumerable:false,configurable:true});return e}());o.style=d}}}));
2
+ //# sourceMappingURL=p-2054b5cb.system.entry.js.map
@@ -1,2 +1,2 @@
1
- System.register(["./p-Cxvdulqq.system.js","./p-BSkbMuB5.system.js"],(function(e){"use strict";var n,i,a,t;return{setters:[function(e){n=e.r;i=e.h;a=e.H},function(e){t=e.d}],execute:function(){var r=":host{display:block}details{--number-animation-transform-timing:200ms;border-radius:var(--pine-dimension-xs)}details pds-icon{-webkit-transform:scaleY(1);transform:scaleY(1)}details[open]{background-color:var(--pine-color-background-container)}details[open] summary{color:var(--pine-color-text-active);font-weight:var(--pine-font-weight-semi-bold)}details[open] summary pds-icon{-webkit-transform:scaleY(-1);transform:scaleY(-1)}summary{background-color:var(--pine-color-background-container);border-radius:var(--pine-dimension-xs);color:var(--pine-color-text-readonly);font-family:var(--pine-font-family-body);font-size:var(--pine-font-size-body-md);font-weight:var(--pine-font-weight-medium);letter-spacing:var(--pine-letter-spacing);line-height:var(--pine-line-height-body);padding-block:calc(var(--pine-dimension-2xs) * 1.5);-webkit-padding-end:var(--pine-dimension-2xs);padding-inline-end:var(--pine-dimension-2xs);-webkit-padding-start:var(--pine-dimension-xs);padding-inline-start:var(--pine-dimension-xs);-ms-flex-align:center;align-items:center;display:-ms-flexbox;display:flex}summary::-webkit-details-marker{display:none}summary:hover{background:var(--pine-color-background-container-hover);color:var(--pine-color-text);cursor:pointer}summary:focus-visible{outline:var(--pine-outline-focus);position:relative}summary pds-icon{-webkit-margin-start:auto;margin-inline-start:auto}.pds-accordion__body{-webkit-padding-after:calc(var(--pine-dimension-sm) + 2);padding-block-end:calc(var(--pine-dimension-sm) + 2);padding-inline:calc(var(--pine-dimension-2xs) * 1.5)}";var o=e("pds_accordion",function(){function e(e){var i=this;n(this,e);this.isOpen=false;this.handleToggle=function(){i.isOpen=i.detailsEl.open};this.getOpenAttribute=function(){if(i.isOpen!==false){return{open:true}}return""}}e.prototype.handleOpenState=function(e){this.isOpen=e};e.prototype.componentDidLoad=function(){this.detailsEl.addEventListener("toggle",this.handleToggle)};e.prototype.render=function(){var e=this;return i(a,{key:"92a6e19b0376d9cc14a86c9dda2fbfeef11297e3",class:"pds-accordion",id:this.componentId},i("details",Object.assign({key:"0bb94526cebdcefcec62976c1623ef208aaa3119"},this.getOpenAttribute(),{ref:function(n){return e.detailsEl=n}}),i("summary",{key:"b599fe5da538efde146be5ff8db8a04faf5c6c1b",part:"accordion-button"},i("slot",{key:"8bdfa4448b41da6fd46232fe854f7c475fc633bf",name:"label"},"Details"),i("pds-icon",{key:"ca51ab8291047c08cef21ef55c85a8a47f8cb3e0",icon:t})),i("div",{key:"628dc7ce9263bbd983fc2353181e31b6fca0176a",part:"accordion-body",class:"pds-accordion__body"},i("slot",{key:"314d59312a3fbb2cc8a1c4d8a7f55634d16b079d"}))))};Object.defineProperty(e,"watchers",{get:function(){return{isOpen:["handleOpenState"]}},enumerable:false,configurable:true});return e}());o.style=r}}}));
2
- //# sourceMappingURL=p-c0601420.system.entry.js.map
1
+ System.register(["./p-Cxvdulqq.system.js","./p-BG99uNIQ.system.js"],(function(e){"use strict";var n,i,a,t;return{setters:[function(e){n=e.r;i=e.h;a=e.H},function(e){t=e.d}],execute:function(){var r=":host{display:block}details{--number-animation-transform-timing:200ms;border-radius:var(--pine-dimension-xs)}details pds-icon{-webkit-transform:scaleY(1);transform:scaleY(1)}details[open]{background-color:var(--pine-color-background-container)}details[open] summary{color:var(--pine-color-text-active);font-weight:var(--pine-font-weight-semi-bold)}details[open] summary pds-icon{-webkit-transform:scaleY(-1);transform:scaleY(-1)}summary{background-color:var(--pine-color-background-container);border-radius:var(--pine-dimension-xs);color:var(--pine-color-text-readonly);font-family:var(--pine-font-family-body);font-size:var(--pine-font-size-body-md);font-weight:var(--pine-font-weight-medium);letter-spacing:var(--pine-letter-spacing);line-height:var(--pine-line-height-body);padding-block:calc(var(--pine-dimension-2xs) * 1.5);-webkit-padding-end:var(--pine-dimension-2xs);padding-inline-end:var(--pine-dimension-2xs);-webkit-padding-start:var(--pine-dimension-xs);padding-inline-start:var(--pine-dimension-xs);-ms-flex-align:center;align-items:center;display:-ms-flexbox;display:flex}summary::-webkit-details-marker{display:none}summary:hover{background:var(--pine-color-background-container-hover);color:var(--pine-color-text);cursor:pointer}summary:focus-visible{outline:var(--pine-outline-focus);position:relative}summary pds-icon{-webkit-margin-start:auto;margin-inline-start:auto}.pds-accordion__body{-webkit-padding-after:calc(var(--pine-dimension-sm) + 2);padding-block-end:calc(var(--pine-dimension-sm) + 2);padding-inline:calc(var(--pine-dimension-2xs) * 1.5)}";var o=e("pds_accordion",function(){function e(e){var i=this;n(this,e);this.isOpen=false;this.handleToggle=function(){i.isOpen=i.detailsEl.open};this.getOpenAttribute=function(){if(i.isOpen!==false){return{open:true}}return""}}e.prototype.handleOpenState=function(e){this.isOpen=e};e.prototype.componentDidLoad=function(){this.detailsEl.addEventListener("toggle",this.handleToggle)};e.prototype.render=function(){var e=this;return i(a,{key:"92a6e19b0376d9cc14a86c9dda2fbfeef11297e3",class:"pds-accordion",id:this.componentId},i("details",Object.assign({key:"0bb94526cebdcefcec62976c1623ef208aaa3119"},this.getOpenAttribute(),{ref:function(n){return e.detailsEl=n}}),i("summary",{key:"b599fe5da538efde146be5ff8db8a04faf5c6c1b",part:"accordion-button"},i("slot",{key:"8bdfa4448b41da6fd46232fe854f7c475fc633bf",name:"label"},"Details"),i("pds-icon",{key:"ca51ab8291047c08cef21ef55c85a8a47f8cb3e0",icon:t})),i("div",{key:"628dc7ce9263bbd983fc2353181e31b6fca0176a",part:"accordion-body",class:"pds-accordion__body"},i("slot",{key:"314d59312a3fbb2cc8a1c4d8a7f55634d16b079d"}))))};Object.defineProperty(e,"watchers",{get:function(){return{isOpen:["handleOpenState"]}},enumerable:false,configurable:true});return e}());o.style=r}}}));
2
+ //# sourceMappingURL=p-2aab28b1.system.entry.js.map
@@ -0,0 +1,2 @@
1
+ System.register(["./p-Cxvdulqq.system.js","./p-kYMYDfJY.system.js"],(function(e){"use strict";var t,i,a,r,n,s;return{setters:[function(e){t=e.r;i=e.c;a=e.h;r=e.H;n=e.g},function(e){s=e.c}],execute:function(){var o=":host{--border-head-default:var(--pine-border-width-thin) solid var(--pine-color-grey-100);border-color:inherit;-webkit-box-sizing:border-box;box-sizing:border-box;display:table-header-group;vertical-align:middle}:host::part(checkbox-cell){background-color:var(--pine-color-background-container);inset-inline-start:var(--pine-dimension-none);position:-webkit-sticky;position:sticky;z-index:var(--pine-z-index-raised)}:host pds-table-checkbox-cell{-webkit-border-after:var(--border-head-default);border-block-end:var(--border-head-default)}";var d=e("pds_table_head",function(){function e(e){var a=this;t(this,e);this.pdsTableSelectAll=i(this,"pdsTableSelectAll");this.generateUniqueId=function(){var e=Math.random().toString(36).substring(2,8);var t=(new Date).toISOString().replace(/[:.]/g,"-");var i="".concat(e,"-").concat(t);return i};this.handleInput=function(e){a.isSelected=!e.target.checked;a.handleSelect(a.isSelected)};this.handleSelect=function(e){a.indeterminate=false;if(s("pds-table-head",a.hostElement)){a.pdsTableSelectAll.emit({isSelected:e})}}}e.prototype.componentWillLoad=function(){if(this.isSelected){this.handleSelect(this.isSelected)}};e.prototype.componentWillRender=function(){this.tableRef=this.hostElement.closest("pds-table");if(this.tableRef&&this.tableRef.fixedColumn){var e=this.hostElement.querySelector("pds-table-head-cell:first-child");e===null||e===void 0?void 0:e.classList.add("is-fixed")}};e.prototype.render=function(){return a(r,{key:"933e69ad28aaf0b899a8ee504088bc5b6396889d",role:"row",part:"head"},this.tableRef&&this.tableRef.selectable&&a("pds-table-head-cell",{key:"a006c965a4e9bacb4b8e07b34799bab6a0bd482a",part:this.tableRef.selectable?"checkbox-cell":""},a("pds-checkbox",{key:"d7f94ac83be970b2c2ed334296971bc6762602e2",componentId:this.generateUniqueId(),indeterminate:this.indeterminate,onInput:this.handleInput,label:"Select All Rows",hideLabel:true,checked:this.isSelected,part:"select-all-checkbox"})),a("slot",{key:"22edaaa12d31b2be1fd2835d6d4c2801386405af"}))};Object.defineProperty(e.prototype,"hostElement",{get:function(){return n(this)},enumerable:false,configurable:true});return e}());d.style=o}}}));
2
+ //# sourceMappingURL=p-3dce3bc0.system.entry.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"names":["pdsTableHeadCss","PdsTableHead","exports","class_1","hostRef","_this","this","generateUniqueId","randomString","Math","random","toString","substring","timestamp","Date","toISOString","replace","uniqueId","concat","handleInput","ev","isSelected","target","checked","handleSelect","indeterminate","closest","hostElement","pdsTableSelectAll","emit","prototype","componentWillLoad","componentWillRender","tableRef","fixedColumn","tableCell","querySelector","classList","add","render","h","Host","key","role","part","selectable","componentId","onInput","label","hideLabel"],"sources":["src/components/pds-table/pds-table-head/pds-table-head.scss?tag=pds-table-head&encapsulation=shadow","src/components/pds-table/pds-table-head/pds-table-head.tsx"],"sourcesContent":[":host {\n --border-head-default: var(--pine-border-width-thin) solid var(--pine-color-grey-100);\n\n border-color: inherit;\n box-sizing: border-box;\n display: table-header-group;\n vertical-align: middle;\n\n // used for pds-checkbox-cell\n // because it is in the ShadowDom\n &::part(checkbox-cell) {\n background-color: var(--pine-color-background-container);\n inset-inline-start: var(--pine-dimension-none);\n position: sticky;\n z-index: var(--pine-z-index-raised);\n }\n}\n\n:host pds-table-checkbox-cell {\n border-block-end: var(--border-head-default);\n}\n","import { Component, Element, Event, EventEmitter, Host, h, Prop } from '@stencil/core';\nimport { closest } from '@utils/closest';\n\n@Component({\n tag: 'pds-table-head',\n styleUrls: ['pds-table-head.scss'],\n shadow: true,\n})\nexport class PdsTableHead {\n @Element() hostElement: HTMLPdsTableHeadElement;\n private tableRef: HTMLPdsTableElement\n\n /**\n * Determines if the select all checkbox is in an indeterminate state.\n */\n @Prop({ mutable: true }) indeterminate?: boolean;\n\n /**\n * Determines if the table row is currently selected.\n * @defaultValue false\n */\n @Prop({mutable: true}) isSelected: boolean;\n\n /**\n * Event that is emitted when the select all checkbox is clicked, carrying the selected value.\n */\n @Event() pdsTableSelectAll: EventEmitter<{ isSelected: boolean }>;\n\n private generateUniqueId = () => {\n const randomString = Math.random().toString(36).substring(2, 8);\n const timestamp = new Date().toISOString().replace(/[:.]/g, '-');\n const uniqueId = `${randomString}-${timestamp}`;\n\n return uniqueId;\n }\n\n private handleInput = (ev: Event) => {\n this.isSelected = !(ev.target as HTMLInputElement).checked\n this.handleSelect(this.isSelected)\n };\n\n private handleSelect = (isSelected: boolean) => {\n this.indeterminate = false\n\n if ( closest('pds-table-head', this.hostElement) ) {\n this.pdsTableSelectAll.emit({ isSelected });\n }\n }\n\n componentWillLoad() {\n if (this.isSelected) {\n this.handleSelect(this.isSelected)\n }\n }\n\n componentWillRender() {\n this.tableRef = this.hostElement.closest('pds-table') as HTMLPdsTableElement;\n\n if (this.tableRef && this.tableRef.fixedColumn) {\n const tableCell = this.hostElement.querySelector('pds-table-head-cell:first-child');\n tableCell?.classList.add(\"is-fixed\");\n }\n }\n\n render() {\n return (\n <Host role=\"row\" part=\"head\">\n {this.tableRef && this.tableRef.selectable && (\n <pds-table-head-cell part={this.tableRef.selectable ? 'checkbox-cell' : ''}>\n <pds-checkbox\n componentId={this.generateUniqueId()}\n indeterminate={this.indeterminate}\n onInput={this.handleInput}\n label={\"Select All Rows\"}\n hideLabel={true}\n checked={this.isSelected}\n part=\"select-all-checkbox\"\n />\n </pds-table-head-cell>\n )}\n <slot></slot>\n </Host>\n );\n }\n}\n"],"mappings":"gNAAA,IAAMA,EAAkB,8hB,ICQXC,EAAYC,EAAA,4BALzB,SAAAC,EAAAC,GAAA,IAAAC,EAAAC,K,6DAyBUA,KAAgBC,iBAAG,WACzB,IAAMC,EAAeC,KAAKC,SAASC,SAAS,IAAIC,UAAU,EAAG,GAC7D,IAAMC,GAAY,IAAIC,MAAOC,cAAcC,QAAQ,QAAS,KAC5D,IAAMC,EAAW,GAAAC,OAAGV,EAAY,KAAAU,OAAIL,GAEpC,OAAOI,CACT,EAEQX,KAAAa,YAAc,SAACC,GACrBf,EAAKgB,YAAeD,EAAGE,OAA4BC,QACnDlB,EAAKmB,aAAanB,EAAKgB,WACzB,EAEQf,KAAAkB,aAAe,SAACH,GACtBhB,EAAKoB,cAAgB,MAErB,GAAKC,EAAQ,iBAAkBrB,EAAKsB,aAAe,CACjDtB,EAAKuB,kBAAkBC,KAAK,CAAER,WAAUA,G,CAE5C,CAqCD,CAnCClB,EAAA2B,UAAAC,kBAAA,WACE,GAAIzB,KAAKe,WAAY,CACnBf,KAAKkB,aAAalB,KAAKe,W,GAI3BlB,EAAA2B,UAAAE,oBAAA,WACE1B,KAAK2B,SAAW3B,KAAKqB,YAAYD,QAAQ,aAEzC,GAAIpB,KAAK2B,UAAY3B,KAAK2B,SAASC,YAAa,CAC9C,IAAMC,EAAY7B,KAAKqB,YAAYS,cAAc,mCACjDD,IAAS,MAATA,SAAS,SAATA,EAAWE,UAAUC,IAAI,W,GAI7BnC,EAAA2B,UAAAS,OAAA,WACE,OACEC,EAACC,EAAK,CAAAC,IAAA,2CAAAC,KAAK,MAAMC,KAAK,QACnBtC,KAAK2B,UAAY3B,KAAK2B,SAASY,YAC9BL,EAAqB,uBAAAE,IAAA,2CAAAE,KAAMtC,KAAK2B,SAASY,WAAa,gBAAkB,IACtEL,EAAA,gBAAAE,IAAA,2CACEI,YAAaxC,KAAKC,mBAClBkB,cAAenB,KAAKmB,cACpBsB,QAASzC,KAAKa,YACd6B,MAAO,kBACPC,UAAW,KACX1B,QAASjB,KAAKe,WACduB,KAAK,yBAIXJ,EAAa,QAAAE,IAAA,6C,gIAxEI,I","ignoreList":[]}
@@ -0,0 +1,2 @@
1
+ var __awaiter=this&&this.__awaiter||function(t,e,i,r){function n(t){return t instanceof i?t:new i((function(e){e(t)}))}return new(i||(i=Promise))((function(i,a){function o(t){try{d(r.next(t))}catch(t){a(t)}}function s(t){try{d(r["throw"](t))}catch(t){a(t)}}function d(t){t.done?i(t.value):n(t.value).then(o,s)}d((r=r.apply(t,e||[])).next())}))};var __generator=this&&this.__generator||function(t,e){var i={label:0,sent:function(){if(a[0]&1)throw a[1];return a[1]},trys:[],ops:[]},r,n,a,o;return o={next:s(0),throw:s(1),return:s(2)},typeof Symbol==="function"&&(o[Symbol.iterator]=function(){return this}),o;function s(t){return function(e){return d([t,e])}}function d(s){if(r)throw new TypeError("Generator is already executing.");while(o&&(o=0,s[0]&&(i=0)),i)try{if(r=1,n&&(a=s[0]&2?n["return"]:s[0]?n["throw"]||((a=n["return"])&&a.call(n),0):n.next)&&!(a=a.call(n,s[1])).done)return a;if(n=0,a)s=[s[0]&2,a.value];switch(s[0]){case 0:case 1:a=s;break;case 4:i.label++;return{value:s[1],done:false};case 5:i.label++;n=s[1];s=[0];continue;case 7:s=i.ops.pop();i.trys.pop();continue;default:if(!(a=i.trys,a=a.length>0&&a[a.length-1])&&(s[0]===6||s[0]===2)){i=0;continue}if(s[0]===3&&(!a||s[1]>a[0]&&s[1]<a[3])){i.label=s[1];break}if(s[0]===6&&i.label<a[1]){i.label=a[1];a=s;break}if(a&&i.label<a[2]){i.label=a[2];i.ops.push(s);break}if(a[2])i.ops.pop();i.trys.pop();continue}s=e.call(t,i)}catch(t){s=[6,t];n=0}finally{r=a=0}if(s[0]&5)throw s[1];return{value:s[0]?s[1]:void 0,done:true}}};System.register(["./p-Cxvdulqq.system.js"],(function(t){"use strict";var e,i,r,n;return{setters:[function(t){e=t.r;i=t.c;r=t.h;n=t.g}],execute:function(){var a=".pds-modal__backdrop{-ms-flex-align:start;align-items:flex-start;background-color:rgba(0, 0, 0, 0.4);border:0;display:-ms-flexbox;display:flex;height:100%;inset:0;-ms-flex-pack:center;justify-content:center;margin:0;max-height:100%;max-width:100%;opacity:0;padding:0;position:fixed;-webkit-transition:opacity 0.2s ease, visibility 0.2s ease;transition:opacity 0.2s ease, visibility 0.2s ease;visibility:hidden;width:100%;z-index:var(--pine-z-index-modal)}@supports ((-webkit-backdrop-filter: blur(3px)) or (backdrop-filter: blur(3px))){.pds-modal__backdrop{-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px)}}pds-modal .pds-modal__backdrop{z-index:var(--pine-z-index-priority)}.pds-modal__backdrop::-webkit-backdrop{background:transparent}.pds-modal__backdrop::-ms-backdrop{background:transparent}.pds-modal__backdrop::backdrop{background:transparent}.pds-modal__backdrop.open{opacity:1;visibility:visible}.pds-modal{background:var(--pine-color-background-container);border-radius:var(--pine-dimension-sm);-webkit-box-shadow:var(--pine-box-shadow-400);box-shadow:var(--pine-box-shadow-400);display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;margin:var(--pine-dimension-md);max-height:none;width:100%}.pds-modal.pds-modal--scrollable{max-height:calc(100vh - (5vh + 96px))}@supports (height: 100dvh){.pds-modal.pds-modal--scrollable{max-height:calc(100dvh - (5dvh + 96px))}}@media (min-width: 992px){.pds-modal{-webkit-margin-before:6vh;margin-block-start:6vh}@supports (height: 100dvh){.pds-modal{-webkit-margin-before:6dvh;margin-block-start:6dvh}}}@media (min-width: 1200px){.pds-modal{-webkit-margin-before:8vh;margin-block-start:8vh}@supports (height: 100dvh){.pds-modal{-webkit-margin-before:8dvh;margin-block-start:8dvh}}}.pds-modal--sm{max-width:520px}.pds-modal--md{max-width:700px}.pds-modal--lg{max-width:900px}.pds-modal--fullscreen{border-radius:0;height:100%;margin:0;max-height:100vh;max-width:100%}@supports (height: 100dvh){.pds-modal--fullscreen{max-height:100dvh}}.pds-modal--fullscreen.pds-modal--scrollable{max-height:100vh}@supports (height: 100dvh){.pds-modal--fullscreen.pds-modal--scrollable{max-height:100dvh}}.pds-modal--fullscreen .pds-modal-content{-ms-flex:1;flex:1}.pds-modal--scrollable pds-modal-content{-webkit-border-after:1px solid transparent;border-block-end:1px solid transparent;-webkit-border-before:1px solid transparent;border-block-start:1px solid transparent;overflow-y:auto}.pds-modal:not(.pds-modal--scrollable) pds-modal-content{overflow-y:visible}";var o=t("pds_modal",function(){function t(t){var r=this;e(this,t);this.pdsModalOpen=i(this,"pdsModalOpen");this.pdsModalClose=i(this,"pdsModalClose");this.focusableElements=[];this.backdropDismiss=true;this.open=false;this.size="md";this.scrollable=true;this.focusableElementsArray=[];this.handleBackdropClick=function(t){if(!r.backdropDismiss||!r.open)return;if(t.target.classList.contains("pds-modal__backdrop")){t.stopPropagation();if(r.isInnermostModal()){r.hideModal()}}};this.handleKeyDown=function(t){if(!r.open)return;if(t.key==="Escape"){if(r.isInnermostModal()){t.preventDefault();r.hideModal()}return}if(t.key==="Tab"){if(r.focusableElements.length===0)return;var e=r.focusableElements[0];var i=r.focusableElements[r.focusableElements.length-1];var n=document.activeElement;var a=n===e||e.contains(n);var o=n===i||i.contains(n);if(t.shiftKey&&a){t.preventDefault();r.focusElement(i)}else if(!t.shiftKey&&o){t.preventDefault();r.focusElement(e)}}}}t.prototype.componentDidLoad=function(){this.modalRef=this.el.querySelector(".pds-modal__backdrop");document.addEventListener("keydown",this.handleKeyDown)};t.prototype.disconnectedCallback=function(){document.removeEventListener("keydown",this.handleKeyDown)};t.prototype.handleOpenChange=function(t){if(t){this.showModal()}else{this.hideModal()}};t.prototype.updateFocusableElements=function(){if(!this.modalRef)return;var t=["a[href]","button:not([disabled])","input:not([disabled])","select:not([disabled])","textarea:not([disabled])",'[tabindex]:not([tabindex="-1"])',"pds-button:not([disabled])","pds-link:not([disabled])","pds-input:not([disabled])","pds-checkbox:not([disabled])","pds-radio:not([disabled])","pds-switch:not([disabled])","pds-select:not([disabled])"].join(",");this.focusableElements=Array.from(this.modalRef.querySelectorAll(t));this.focusableElements=this.focusableElements.filter((function(t){var e=window.getComputedStyle(t);return e.display!=="none"&&e.visibility!=="hidden"}))};t.prototype.setInitialFocus=function(){if(this.focusableElements.length===0)return;var t=this.focusableElements[0];this.focusElement(t)};t.prototype.focusElement=function(t){if(!t)return;try{t.focus();setTimeout((function(){if(document.activeElement!==t){if(t.shadowRoot){var e=t.shadowRoot.querySelector("button, [tabindex], input, a[href]");if(e){e.focus()}}}}),0)}catch(t){console.error("Error focusing element:",t)}};t.prototype.showModal=function(){return __awaiter(this,void 0,void 0,(function(){var t=this;return __generator(this,(function(e){if(this.modalRef){try{this.previousActiveElement=document.activeElement;this.modalRef.showModal();this.open=true;setTimeout((function(){t.updateFocusableElements();t.setInitialFocus();t.pdsModalOpen.emit()}),100)}catch(t){console.error("Failed to show modal:",t)}}return[2]}))}))};t.prototype.hideModal=function(){return __awaiter(this,void 0,void 0,(function(){return __generator(this,(function(t){if(this.modalRef){try{this.modalRef.close();this.open=false;if(this.previousActiveElement&&typeof this.previousActiveElement.focus==="function"){this.previousActiveElement.focus()}this.pdsModalClose.emit()}catch(t){console.error("Failed to hide modal:",t)}}return[2]}))}))};t.prototype.getBackdropZIndex=function(t){var e=t.querySelector(".pds-modal__backdrop");return e?parseInt(getComputedStyle(e).zIndex,10):-1};t.prototype.isInnermostModal=function(){var t=this;var e=Array.from(document.querySelectorAll("pds-modal")).filter((function(t){return t.open}));if(e.length===0)return false;var i=this.el.querySelector(".pds-modal__backdrop");if(!i)return false;var r=e.map((function(e){return t.getBackdropZIndex(e)}));var n=Math.max.apply(Math,r);var a=this.getBackdropZIndex(this.el);return a===n};t.prototype.render=function(){var t;return r("dialog",{key:"ca1fe22c9f9aa26e74234e5195c007760cbbf818",class:{"pds-modal__backdrop":true,open:this.open},"aria-modal":"true","aria-labelledby":"".concat(this.componentId,"-heading"),onClick:this.handleBackdropClick},r("div",{key:"d0f297574d53dc1718277a58c2ade00a5451f96b",class:(t={"pds-modal":true},t["pds-modal--".concat(this.size)]=true,t["pds-modal--scrollable"]=this.scrollable,t)},r("slot",{key:"37bb5abda88b4db9304884532951980ea8b9eaf8"})))};Object.defineProperty(t.prototype,"el",{get:function(){return n(this)},enumerable:false,configurable:true});Object.defineProperty(t,"watchers",{get:function(){return{open:["handleOpenChange"]}},enumerable:false,configurable:true});return t}());o.style=a}}}));
2
+ //# sourceMappingURL=p-45d574f1.system.entry.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"names":["pdsModalCss","PdsModal","exports","class_1","hostRef","_this","this","focusableElements","backdropDismiss","open","size","scrollable","focusableElementsArray","handleBackdropClick","e","target","classList","contains","stopPropagation","isInnermostModal","hideModal","handleKeyDown","key","preventDefault","length","firstFocusableElement","lastFocusableElement","activeElement","document","isFirstElement","isLastElement","shiftKey","focusElement","prototype","componentDidLoad","modalRef","el","querySelector","addEventListener","disconnectedCallback","removeEventListener","handleOpenChange","newValue","showModal","updateFocusableElements","selector","join","Array","from","querySelectorAll","filter","style","window","getComputedStyle","display","visibility","setInitialFocus","firstElement","element","focus","setTimeout","shadowRoot","focusableInShadow","error","console","previousActiveElement","pdsModalOpen","emit","close","pdsModalClose","getBackdropZIndex","modal","backdrop","parseInt","zIndex","openModals","thisBackdrop","modalZIndexes","map","maxZIndex","Math","max","apply","thisZIndex","render","h","class","concat","componentId","onClick","_a"],"sources":["src/components/pds-modal/pds-modal.scss?tag=pds-modal","src/components/pds-modal/pds-modal.tsx"],"sourcesContent":[".pds-modal__backdrop {\n align-items: flex-start;\n background-color: rgba(0, 0, 0, 0.4);\n border: 0;\n display: flex;\n height: 100%;\n inset: 0;\n justify-content: center;\n margin: 0;\n max-height: 100%;\n max-width: 100%;\n opacity: 0;\n padding: 0;\n position: fixed;\n transition: opacity 0.2s ease, visibility 0.2s ease;\n visibility: hidden;\n width: 100%;\n z-index: var(--pine-z-index-modal);\n\n @supports (backdrop-filter: blur(3px)) {\n backdrop-filter: blur(3px);\n }\n\n // Increase z-index for nested modals\n pds-modal & {\n z-index: var(--pine-z-index-priority);\n }\n\n &::backdrop {\n background: transparent;\n }\n\n &.open {\n opacity: 1;\n visibility: visible;\n }\n}\n\n.pds-modal {\n background: var(--pine-color-background-container);\n border-radius: var(--pine-dimension-sm);\n box-shadow: var(--pine-box-shadow-400);\n display: flex;\n flex-direction: column;\n margin: var(--pine-dimension-md);\n max-height: none;\n width: 100%;\n\n &.pds-modal--scrollable {\n max-height: calc(100vh - (calc(5vh + 96px)));\n\n @supports (height: 100dvh) {\n max-height: calc(100dvh - (calc(5dvh + 96px)));\n }\n }\n\n @media (min-width: 992px) {\n margin-block-start: 6vh;\n\n @supports (height: 100dvh) {\n margin-block-start: 6dvh;\n }\n }\n\n @media (min-width: 1200px) {\n margin-block-start: 8vh;\n\n @supports (height: 100dvh) {\n margin-block-start: 8dvh;\n }\n }\n}\n\n.pds-modal--sm {\n max-width: 520px;\n}\n\n.pds-modal--md {\n max-width: 700px;\n}\n\n.pds-modal--lg {\n max-width: 900px;\n}\n\n.pds-modal--fullscreen {\n border-radius: 0;\n height: 100%;\n margin: 0;\n max-height: 100vh;\n max-width: 100%;\n\n @supports (height: 100dvh) {\n max-height: 100dvh;\n }\n\n &.pds-modal--scrollable {\n max-height: 100vh;\n\n @supports (height: 100dvh) {\n max-height: 100dvh;\n }\n }\n}\n\n.pds-modal-content {\n .pds-modal--fullscreen & {\n flex: 1;\n }\n}\n\n// Scrollable modal styles (default behavior)\n.pds-modal--scrollable {\n pds-modal-content {\n border-block-end: 1px solid transparent;\n border-block-start: 1px solid transparent;\n overflow-y: auto;\n }\n}\n\n// Non-scrollable modal styles\n.pds-modal:not(.pds-modal--scrollable) {\n pds-modal-content {\n overflow-y: visible;\n }\n}\n\n","import { Component, Element, Event, EventEmitter, h, Method, Prop, State, Watch } from '@stencil/core';\n\n@Component({\n tag: 'pds-modal',\n styleUrl: 'pds-modal.scss',\n shadow: false\n})\nexport class PdsModal {\n private modalRef: HTMLDialogElement;\n private previousActiveElement: HTMLElement;\n private focusableElements: HTMLElement[] = [];\n\n @Element() el: HTMLPdsModalElement;\n\n /**\n * Whether the modal can be dismissed by clicking the backdrop\n * @default true\n */\n @Prop() backdropDismiss = true;\n\n /**\n * A unique identifier used for the underlying component `id` attribute.\n */\n @Prop() componentId: string;\n\n /**\n * Whether the modal is open\n * @default false\n */\n @Prop({ mutable: true }) open = false;\n\n /**\n * The size of the modal\n * @default 'md'\n */\n @Prop() size: 'sm' | 'md' | 'lg' | 'fullscreen' = 'md';\n\n /**\n * Whether the modal content should be scrollable\n * @default true\n */\n @Prop() scrollable = true;\n\n /**\n * Emitted when the modal is opened\n */\n @Event() pdsModalOpen: EventEmitter<void>;\n\n /**\n * Emitted when the modal is closed\n */\n @Event() pdsModalClose: EventEmitter<void>;\n\n /**\n * Stores the list of focusable elements in the modal\n */\n @State() focusableElementsArray: HTMLElement[] = [];\n\n componentDidLoad() {\n this.modalRef = this.el.querySelector('.pds-modal__backdrop') as HTMLDialogElement;\n // Add keyboard event listener\n document.addEventListener('keydown', this.handleKeyDown);\n }\n\n disconnectedCallback() {\n // Clean up event listener\n document.removeEventListener('keydown', this.handleKeyDown);\n }\n\n @Watch('open')\n handleOpenChange(newValue: boolean) {\n if (newValue) {\n this.showModal();\n } else {\n this.hideModal();\n }\n }\n\n /**\n * Updates the list of focusable elements in the modal\n */\n private updateFocusableElements() {\n if (!this.modalRef) return;\n\n // Get all focusable elements within the modal\n const selector = [\n 'a[href]',\n 'button:not([disabled])',\n 'input:not([disabled])',\n 'select:not([disabled])',\n 'textarea:not([disabled])',\n '[tabindex]:not([tabindex=\"-1\"])',\n 'pds-button:not([disabled])',\n 'pds-link:not([disabled])',\n 'pds-input:not([disabled])',\n 'pds-checkbox:not([disabled])',\n 'pds-radio:not([disabled])',\n 'pds-switch:not([disabled])',\n 'pds-select:not([disabled])',\n ].join(',');\n\n this.focusableElements = Array.from(\n this.modalRef.querySelectorAll(selector)\n ) as HTMLElement[];\n\n // Filter out elements with display: none or visibility: hidden\n this.focusableElements = this.focusableElements.filter(el => {\n const style = window.getComputedStyle(el);\n return style.display !== 'none' && style.visibility !== 'hidden';\n });\n }\n\n /**\n * Sets focus to the first focusable element in the modal\n */\n private setInitialFocus() {\n if (this.focusableElements.length === 0) return;\n\n // Focus the first focusable element\n const firstElement = this.focusableElements[0];\n\n // For web components, we need to ensure they're properly focused\n this.focusElement(firstElement);\n }\n\n /**\n * Helper method to focus an element, with special handling for web components\n */\n private focusElement(element: HTMLElement) {\n if (!element) return;\n\n try {\n // Try standard focus first\n element.focus();\n\n // Check if focus worked\n setTimeout(() => {\n if (document.activeElement !== element) {\n // For web components, try to find a focusable element inside\n if (element.shadowRoot) {\n const focusableInShadow = element.shadowRoot.querySelector(\n 'button, [tabindex], input, a[href]'\n ) as HTMLElement;\n\n if (focusableInShadow) {\n focusableInShadow.focus();\n }\n }\n }\n }, 0);\n } catch (error) {\n console.error('Error focusing element:', error);\n }\n }\n\n /**\n * Opens the modal\n */\n @Method()\n async showModal() {\n if (this.modalRef) {\n try {\n // Store the currently focused element to restore focus when modal closes\n this.previousActiveElement = document.activeElement as HTMLElement;\n\n // Use native dialog showModal method which makes the rest of the page inert\n this.modalRef.showModal();\n this.open = true;\n\n // Update focusable elements and set initial focus\n // Using a longer timeout to ensure all components are fully rendered\n setTimeout(() => {\n this.updateFocusableElements();\n this.setInitialFocus();\n this.pdsModalOpen.emit();\n }, 100);\n } catch (error) {\n console.error('Failed to show modal:', error);\n }\n }\n }\n\n /**\n * Closes the modal\n */\n @Method()\n async hideModal() {\n if (this.modalRef) {\n try {\n this.modalRef.close();\n this.open = false;\n\n // Restore focus to the element that was focused before the modal was opened\n if (this.previousActiveElement && typeof this.previousActiveElement.focus === 'function') {\n this.previousActiveElement.focus();\n }\n\n this.pdsModalClose.emit();\n } catch (error) {\n console.error('Failed to hide modal:', error);\n }\n }\n }\n\n private handleBackdropClick = (e: MouseEvent) => {\n if (!this.backdropDismiss || !this.open) return;\n\n if ((e.target as HTMLElement).classList.contains('pds-modal__backdrop')) {\n e.stopPropagation();\n\n // Only close if this is the innermost modal\n if (this.isInnermostModal()) {\n this.hideModal();\n }\n }\n };\n\n /**\n * Gets the z-index of a modal's backdrop element\n */\n private getBackdropZIndex(modal: Element): number {\n const backdrop = modal.querySelector('.pds-modal__backdrop');\n return backdrop ? parseInt(getComputedStyle(backdrop).zIndex, 10) : -1;\n }\n\n /**\n * Checks if this modal is the innermost (highest z-index) modal\n */\n private isInnermostModal(): boolean {\n // Find all open modals\n const openModals = Array.from(document.querySelectorAll('pds-modal')).filter(\n modal => modal.open\n );\n\n if (openModals.length === 0) return false;\n\n // Get this modal's backdrop element\n const thisBackdrop = this.el.querySelector('.pds-modal__backdrop');\n if (!thisBackdrop) return false;\n\n // Get computed z-index of all open modal backdrops\n const modalZIndexes = openModals.map(modal => this.getBackdropZIndex(modal));\n\n // Get the highest z-index\n const maxZIndex = Math.max(...modalZIndexes);\n\n // Check if this modal's backdrop has the highest z-index\n const thisZIndex = this.getBackdropZIndex(this.el);\n return thisZIndex === maxZIndex;\n }\n\n private handleKeyDown = (e: KeyboardEvent) => {\n // If the modal is not open, don't handle any keyboard events\n if (!this.open) return;\n\n // Handle Escape key to close the modal\n if (e.key === 'Escape') {\n // Only close if this is the innermost modal\n if (this.isInnermostModal()) {\n e.preventDefault();\n this.hideModal();\n }\n return;\n }\n\n // Handle Tab key for focus trapping\n if (e.key === 'Tab') {\n // If there are no focusable elements, do nothing\n if (this.focusableElements.length === 0) return;\n\n // Get the first and last focusable elements\n const firstFocusableElement = this.focusableElements[0];\n const lastFocusableElement = this.focusableElements[this.focusableElements.length - 1];\n\n // Get the current active element\n const activeElement = document.activeElement;\n\n // Check if we need to wrap focus\n const isFirstElement = activeElement === firstFocusableElement ||\n firstFocusableElement.contains(activeElement as Node);\n\n const isLastElement = activeElement === lastFocusableElement ||\n lastFocusableElement.contains(activeElement as Node);\n\n // If shift + tab is pressed and focus is on the first element, move to the last element\n if (e.shiftKey && isFirstElement) {\n e.preventDefault();\n this.focusElement(lastFocusableElement);\n }\n // If tab is pressed and focus is on the last element, move to the first element\n else if (!e.shiftKey && isLastElement) {\n e.preventDefault();\n this.focusElement(firstFocusableElement);\n }\n }\n };\n\n render() {\n return (\n <dialog\n class={{\n 'pds-modal__backdrop': true,\n 'open': this.open\n }}\n aria-modal=\"true\"\n aria-labelledby={`${this.componentId}-heading`}\n onClick={this.handleBackdropClick}\n >\n <div\n class={{\n 'pds-modal': true,\n [`pds-modal--${this.size}`]: true,\n 'pds-modal--scrollable': this.scrollable\n }}\n >\n <slot></slot>\n </div>\n </dialog>\n );\n }\n}\n"],"mappings":"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","ignoreList":[]}
@@ -0,0 +1,2 @@
1
+ var __awaiter=this&&this.__awaiter||function(e,r,i,n){function t(e){return e instanceof i?e:new i((function(r){r(e)}))}return new(i||(i=Promise))((function(i,o){function s(e){try{a(n.next(e))}catch(e){o(e)}}function d(e){try{a(n["throw"](e))}catch(e){o(e)}}function a(e){e.done?i(e.value):t(e.value).then(s,d)}a((n=n.apply(e,r||[])).next())}))};var __generator=this&&this.__generator||function(e,r){var i={label:0,sent:function(){if(o[0]&1)throw o[1];return o[1]},trys:[],ops:[]},n,t,o,s;return s={next:d(0),throw:d(1),return:d(2)},typeof Symbol==="function"&&(s[Symbol.iterator]=function(){return this}),s;function d(e){return function(r){return a([e,r])}}function a(d){if(n)throw new TypeError("Generator is already executing.");while(s&&(s=0,d[0]&&(i=0)),i)try{if(n=1,t&&(o=d[0]&2?t["return"]:d[0]?t["throw"]||((o=t["return"])&&o.call(t),0):t.next)&&!(o=o.call(t,d[1])).done)return o;if(t=0,o)d=[d[0]&2,o.value];switch(d[0]){case 0:case 1:o=d;break;case 4:i.label++;return{value:d[1],done:false};case 5:i.label++;t=d[1];d=[0];continue;case 7:d=i.ops.pop();i.trys.pop();continue;default:if(!(o=i.trys,o=o.length>0&&o[o.length-1])&&(d[0]===6||d[0]===2)){i=0;continue}if(d[0]===3&&(!o||d[1]>o[0]&&d[1]<o[3])){i.label=d[1];break}if(d[0]===6&&i.label<o[1]){i.label=o[1];o=d;break}if(o&&i.label<o[2]){i.label=o[2];i.ops.push(d);break}if(o[2])i.ops.pop();i.trys.pop();continue}d=r.call(e,i)}catch(e){d=[6,e];t=0}finally{n=o=0}if(d[0]&5)throw d[1];return{value:d[0]?d[1]:void 0,done:true}}};System.register(["./p-Cxvdulqq.system.js","./p-BHavepTY.system.js","./p-BhQhw0S3.system.js","./p-BG6uGRQj.system.js","./p-BG99uNIQ.system.js"],(function(e){"use strict";var r,i,n,t,o,s,d,a,p,l;return{setters:[function(e){r=e.r;i=e.c;n=e.h;t=e.H;o=e.g},function(e){s=e.a;d=e.m},function(e){a=e.i},function(e){p=e.d},function(e){l=e.i}],execute:function(){var u=":host{--pine-input-color-background-danger:var(--pine-color-red-050)}";var c=":host{display:inline-block}:host([aria-disabled=true]) label{color:var(--pine-color-text-label-disabled)}:host([aria-readonly=true]) label{color:var(--pine-color-text-label-readonly)}label{color:var(--pine-color-text-label);font:var(--pine-typography-body-medium);letter-spacing:var(--pine-letter-spacing)}";var h=":host{--pds-input-background:var(--pine-color-background-container);--pds-input-border-color:var(--pine-color-border);--pds-input-border-color-hover:var(--pine-color-border-hover);--pds-input-border-color-disabled:var(--pine-color-border-disabled);--pds-input-border-radius:var(--pine-dimension-125);--pds-input-border-width:var(--pine-border-width-thin);--pds-input-padding-x:var(--pine-dimension-150);--pds-input-padding-y:calc(var(--pine-dimension-xs) - var(--pine-border-width));--pds-input-font:var(--pine-typography-body);--pds-input-text-color:var(--pine-color-text-active);--pds-input-placeholder-color:var(--pine-color-text-placeholder);--pds-input-icon-color:var(--pine-color-text-secondary);--pds-input-disabled-background:var(--pine-color-background-container-disabled);--pds-input-disabled-text-color:var(--pine-color-text-disabled);--pds-input-error-color:var(--pine-color-text-message-danger);--pds-input-error-background:var(--pine-input-color-background-danger);--pds-input-error-border:var(--pine-color-border-danger);--pds-input-error-border-hover:var(--pine-color-border-danger-hover);--pds-input-addon-background:var(--pine-color-background-subtle);--pds-input-addon-color:var(--pine-color-text-secondary);--pds-input-field-min-height:var(--pine-dimension-450);--box-shadow-focus:0 0 0 1px #ffffff, 0 0 0 3px var(--pine-color-focus-ring);--box-shadow-focus-error:0 0 0 1px #ffffff, 0 0 0 3px var(--pine-color-focus-ring-danger);display:inline}:host pds-select::part(select){background-color:var(--pds-input-error-background);border-color:var(--pds-input-error-border)}:host::part(prefix),:host::part(suffix){-ms-flex-align:center;align-items:center;color:var(--pine-color-text-label-readonly);display:-ms-flexbox;display:flex;height:100%;position:absolute;top:50%;-webkit-transform:translateY(-50%);transform:translateY(-50%);white-space:nowrap;z-index:var(--pine-z-index-raised)}:host::part(prefix){border-end-start-radius:var(--pds-input-border-radius);-webkit-border-end:var(--pine-border-width-none);border-inline-end:var(--pine-border-width-none);border-start-start-radius:var(--pds-input-border-radius);left:var(--pds-input-padding-x)}:host::part(suffix){border-end-end-radius:var(--pds-input-border-radius);-webkit-border-start:var(--pine-border-width-none);border-inline-start:var(--pine-border-width-none);border-start-end-radius:var(--pds-input-border-radius);right:var(--pds-input-padding-x)}:host::part(prepend),:host::part(append){-ms-flex-align:center;align-items:center;background-color:var(--pds-input-addon-background);border:var(--pds-input-border-width) solid var(--pds-input-border-color);color:var(--pds-input-addon-color);display:-ms-flexbox;display:flex;overflow:visible}:host::part(prepend){border-end-start-radius:var(--pds-input-border-radius);-webkit-border-end:var(--pine-border-width-none);border-inline-end:var(--pine-border-width-none);border-start-start-radius:var(--pds-input-border-radius)}:host::part(append){border-end-end-radius:var(--pds-input-border-radius);-webkit-border-start:var(--pine-border-width-none);border-inline-start:var(--pine-border-width-none);border-start-end-radius:var(--pds-input-border-radius)}:host([has-prepend]) ::slotted(pds-button[slot=prepend]){--pds-button-background:var(--pds-input-addon-background);--pds-button-border:var(--pine-border-width-none);--pds-button-border-radius:var(--pine-dimension-none);--pds-button-border-radius-end-end:var(--pine-dimension-none);--pds-button-border-radius-start-end:var(--pine-dimension-none);--pds-button-border-radius-start-start:var(--pds-input-border-radius);--pds-button-border-radius-end-start:var(--pds-input-border-radius);--pds-button-min-height:calc(var(--pine-dimension-450) - calc(2 * var(--pine-border-width)));--pds-button-box-shadow-focus:0 0 0 3px var(--pine-color-focus-ring);--pds-button-outline-focus:none}:host([has-append]) ::slotted(pds-button[slot=append]){--pds-button-background:var(--pds-input-addon-background);--pds-button-border:var(--pine-border-width-none);--pds-button-border-radius:var(--pine-dimension-none);--pds-button-border-radius-end-start:var(--pine-dimension-none);--pds-button-border-radius-start-start:var(--pine-dimension-none);--pds-button-border-radius-start-end:var(--pds-input-border-radius);--pds-button-border-radius-end-end:var(--pds-input-border-radius);--pds-button-min-height:calc(var(--pine-dimension-450) - calc(2 * var(--pine-border-width)));--pds-button-box-shadow-focus:0 0 0 3px var(--pine-color-focus-ring);--pds-button-outline-focus:none}:host([has-prepend]) ::slotted(pds-select[slot=prepend]){--pds-select-background:var(--pds-input-addon-background);--pds-select-border:var(--pine-border-width-none);--pds-select-border-radius-end-end:var(--pine-dimension-none);--pds-select-border-radius-start-end:var(--pine-dimension-none);--pds-select-min-height:calc(var(--pine-dimension-450) - calc(2 * var(--pine-border-width)))}:host([has-append]) ::slotted(pds-select[slot=append]){--pds-select-background:var(--pds-input-addon-background);--pds-select-border:var(--pine-border-width-none);--pds-select-border-radius-end-start:var(--pine-dimension-none);--pds-select-border-radius-start-start:var(--pine-dimension-none);--pds-select-min-height:calc(var(--pine-dimension-450) - calc(2 * var(--pine-border-width)))}:host([aria-readonly=true]) input{background-color:var(--pine-color-background-container-disabled);color:var(--pine-color-text-readonly)}:host([disabled=true])::part(prepend),:host([disabled=true])::part(append){background-color:var(--pds-input-disabled-background);border:var(--pds-input-border-width) solid var(--pds-input-border-color-disabled)}:host([full-width=true]){width:100%}:host([invalid=true])::part(prepend),:host([invalid=true])::part(append){background-color:var(--pds-input-error-background);border:var(--pds-input-border-width) solid var(--pds-input-error-border)}.pds-input{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column}.pds-input__label-wrapper{-ms-flex-align:center;align-items:center;display:-ms-flexbox;display:flex;-ms-flex-pack:justify;justify-content:space-between;-webkit-margin-after:var(--pine-dimension-2xs);margin-block-end:var(--pine-dimension-2xs)}.pds-input__label{color:var(--pine-color-text-active);-webkit-margin-after:var(--pine-dimension-2xs);margin-block-end:var(--pine-dimension-2xs)}.pds-input__label-wrapper .pds-input__label{-webkit-margin-after:0;margin-block-end:0}.pds-input__action{-ms-flex-align:center;align-items:center;display:-ms-flexbox;display:flex;gap:var(--pine-dimension-xs);-webkit-margin-start:var(--pine-dimension-xs);margin-inline-start:var(--pine-dimension-xs)}.pds-input__field-wrapper{-ms-flex-align:center;align-items:center;display:-ms-flexbox;display:flex;position:relative;width:100%}.pds-input__field-wrapper.has-prefix .pds-input__field{-webkit-padding-start:calc(2 * var(--pds-input-padding-x) + var(--prefix-width, 1em));padding-inline-start:calc(2 * var(--pds-input-padding-x) + var(--prefix-width, 1em))}.pds-input__field-wrapper.has-suffix .pds-input__field{-webkit-padding-end:calc(2 * var(--pds-input-padding-x) + var(--suffix-width, 1em));padding-inline-end:calc(2 * var(--pds-input-padding-x) + var(--suffix-width, 1em))}.pds-input__field-wrapper.has-prepend .pds-input__field{border-end-start-radius:var(--pine-dimension-none);border-start-start-radius:var(--pine-dimension-none)}.pds-input__field-wrapper.has-append .pds-input__field{border-end-end-radius:var(--pine-dimension-none);border-start-end-radius:var(--pine-dimension-none)}.pds-input__field{background:var(--pds-input-background);border:var(--pds-input-border-width) solid var(--pds-input-border-color);border-radius:var(--pds-input-border-radius);-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--pds-input-text-color);-ms-flex:1;flex:1;font:var(--pds-input-font);letter-spacing:var(--pine-letter-spacing);min-height:var(--pds-input-field-min-height);min-width:var(--pine-dimension-none);padding:var(--pds-input-padding-y) var(--pds-input-padding-x);-webkit-transition:border-color 0.2s ease;transition:border-color 0.2s ease;width:100%}.pds-input__field:hover:not(:disabled){border-color:var(--pds-input-border-color-hover)}.pds-input__field:disabled{background:var(--pds-input-disabled-background);border-color:var(--pine-color-border-disabled);color:var(--pds-input-disabled-text-color);cursor:not-allowed}.pds-input__field:disabled::-webkit-input-placeholder{color:var(--pine-color-text-placeholder-disabled)}.pds-input__field:disabled::-moz-placeholder{color:var(--pine-color-text-placeholder-disabled)}.pds-input__field:disabled:-ms-input-placeholder{color:var(--pine-color-text-placeholder-disabled)}.pds-input__field:disabled::-ms-input-placeholder{color:var(--pine-color-text-placeholder-disabled)}.pds-input__field:disabled::placeholder{color:var(--pine-color-text-placeholder-disabled)}.has-error .pds-input__field:hover:not(:disabled){border-color:var(--pds-input-error-border-hover)}.pds-input__field:focus-visible:not(.has-error){border-color:var(--pine-color-border-active);outline:var(--pine-outline-focus);outline-offset:var(--pine-border-width);position:relative;z-index:1}:host([has-prepend]) .pds-input__field:focus-visible:not(.has-error),:host([has-append]) .pds-input__field:focus-visible:not(.has-error),:host([has-prefix]) .pds-input__field:focus-visible:not(.has-error),:host([has-suffix]) .pds-input__field:focus-visible:not(.has-error){outline-offset:var(--pine-dimension-none)}.pds-input__field::-webkit-input-placeholder{color:var(--pds-input-placeholder-color)}.pds-input__field::-moz-placeholder{color:var(--pds-input-placeholder-color)}.pds-input__field:-ms-input-placeholder{color:var(--pds-input-placeholder-color)}.pds-input__field::-ms-input-placeholder{color:var(--pds-input-placeholder-color)}.pds-input__field::placeholder{color:var(--pds-input-placeholder-color)}.has-error .pds-input__field{background-color:var(--pds-input-error-background);border-color:var(--pds-input-error-border)}.has-error .pds-input__field:focus-visible{outline-color:var(--pine-color-focus-ring-danger);position:relative;z-index:1}.pds-input__error-message,.pds-input__helper-message{color:var(--pine-color-text-message);font:var(--pine-typography-body-sm);-webkit-margin-after:var(--pine-dimension-none);margin-block-end:var(--pine-dimension-none);-webkit-margin-before:var(--pine-dimension-2xs);margin-block-start:var(--pine-dimension-2xs)}.pds-input__error-message{-ms-flex-align:center;align-items:center;color:var(--pds-input-error-color);display:-ms-flexbox;display:flex;gap:var(--pine-dimension-2xs)}.visually-hidden{border:0;clip:rect(0 0 0 0);-webkit-clip-path:polygon(0 0, 0 0, 0 0);clip-path:polygon(0 0, 0 0, 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;white-space:nowrap;width:1px}";var b=e("pds_input",function(){function e(e){var n=this;r(this,e);this.pdsBlur=i(this,"pdsBlur");this.pdsChange=i(this,"pdsChange");this.pdsFocus=i(this,"pdsFocus");this.pdsInput=i(this,"pdsInput");this.inheritedAttributes={};this.isComposing=false;this.hasPrefix=false;this.hasSuffix=false;this.hasPrepend=false;this.hasAppend=false;this.hasAction=false;this.type="text";this.value="";this.hasFocus=false;this.onInputEvent=function(e){var r=e.target;if(r){n.value=r.value||""}n.emitInputChange(e)};this.onChangeEvent=function(e){n.emitValueChange(e)};this.onBlurEvent=function(e){n.hasFocus=false;if(n.focusedValue!==n.value){n.emitValueChange(e)}n.pdsBlur.emit(e)};this.onFocusEvent=function(e){n.hasFocus=true;n.focusedValue=n.value;n.pdsFocus.emit(e)};this.onCompositionStart=function(){n.isComposing=true};this.onCompositionEnd=function(){n.isComposing=false}}e.prototype.setFocus=function(){return __awaiter(this,void 0,void 0,(function(){return __generator(this,(function(e){if(this.nativeInput){this.nativeInput.focus()}return[2]}))}))};e.prototype.updateAddonWidths=function(){var e=this;requestAnimationFrame((function(){if(e.prefixEl){var r=e.prefixEl.offsetWidth;e.el.style.setProperty("--prefix-width","".concat(r,"px"))}if(e.suffixEl){var i=e.suffixEl.offsetWidth;e.el.style.setProperty("--suffix-width","".concat(i,"px"))}}))};e.prototype.renderPrefix=function(){var e=this;var r=this.el.querySelector('[slot="prefix"]')!==null;if(r){return n("div",{class:"pds-input__prefix",part:"prefix",ref:function(r){return e.prefixEl=r}},n("slot",{name:"prefix",onSlotchange:function(){return e.updateAddonWidths()}}))}return null};e.prototype.renderSuffix=function(){var e=this;var r=this.el.querySelector('[slot="suffix"]')!==null;if(r){return n("div",{class:"pds-input__suffix",part:"suffix",ref:function(r){return e.suffixEl=r}},n("slot",{name:"suffix",onSlotchange:function(){return e.updateAddonWidths()}}))}return null};e.prototype.renderPrepend=function(){var e=this.el.querySelector('[slot="prepend"]')!==null;if(e){return n("div",{class:"pds-input__prepend",part:"prepend"},n("slot",{name:"prepend"}))}return null};e.prototype.renderAppend=function(){var e=this.el.querySelector('[slot="append"]')!==null;if(e){return n("div",{class:"pds-input__append",part:"append"},n("slot",{name:"append"}))}return null};e.prototype.renderAction=function(){var e=this.el.querySelector('[slot="action"]')!==null;if(e){return n("div",{class:"pds-input__action",part:"action"},n("slot",{name:"action"}))}return null};e.prototype.componentWillLoad=function(){this.inheritedAttributes=Object.assign({},a(this.el));this.hasPrefix=this.el.querySelector('[slot="prefix"]')!==null;this.hasSuffix=this.el.querySelector('[slot="suffix"]')!==null;this.hasPrepend=this.el.querySelector('[slot="prepend"]')!==null;this.hasAppend=this.el.querySelector('[slot="append"]')!==null;this.hasAction=this.el.querySelector('[slot="action"]')!==null;this.originalPdsInput=this.pdsInput};e.prototype.connectedCallback=function(){if(this.el.attachInternals){this.internals=this.el.attachInternals()}};e.prototype.componentDidLoad=function(){this.debounceChanged();this.updateAddonWidths();this.updateFormValue()};e.prototype.componentDidUpdate=function(){this.updateAddonWidths()};e.prototype.debounceChanged=function(){var e=this,r=e.pdsInput,i=e.debounce,n=e.originalPdsInput;this.pdsInput=i===undefined?n!==null&&n!==void 0?n:r:p(r,i)};e.prototype.valueChanged=function(){var e=this.nativeInput;var r=this.getValue();if(e&&e.value!==r&&!this.isComposing){e.value=r}this.updateFormValue()};e.prototype.getValue=function(){return typeof this.value==="number"?this.value.toString():(this.value||"").toString()};e.prototype.emitValueChange=function(e){var r=this.value;var i=r==null?r:r.toString();this.focusedValue=i;this.pdsChange.emit({value:i,event:e})};e.prototype.emitInputChange=function(e){var r=this.value;var i=r==null?r:r.toString();this.pdsInput.emit({value:i,event:e})};e.prototype.updateFormValue=function(){if(this.internals&&this.internals.setFormValue){var e=this.getValue();this.internals.setFormValue(e||null);if(this.nativeInput&&this.internals&&this.internals.setValidity){this.internals.setValidity(this.nativeInput.validity,this.nativeInput.validationMessage,this.nativeInput)}}};e.prototype.formResetCallback=function(){this.value="";this.updateFormValue()};e.prototype.formDisabledCallback=function(e){this.disabled=e};e.prototype.formStateRestoreCallback=function(e){if(typeof e==="string"){this.value=e}else if(e instanceof FormData&&this.name){var r=e.get(this.name);if(typeof r==="string"){this.value=r}}};e.prototype.render=function(){var e=this;var r=this,i=r.componentId,o=r.disabled,a=r.errorMessage,p=r.helperMessage,u=r.invalid,c=u===void 0?false:u,h=r.label;var b=this.getValue();var f={"pds-input__field-wrapper":true,"has-focus":this.hasFocus,"has-error":c||!!a,"is-disabled":o,"has-prefix":this.hasPrefix,"has-suffix":this.hasSuffix,"has-prepend":this.hasPrepend,"has-append":this.hasAppend};return n(t,{key:"354d45806da5e4b1c7a40f08f78d969b67e590ec","aria-disabled":this.disabled?"true":null,"aria-readonly":this.readonly?"true":null,"has-prefix":this.hasPrefix?"true":null,"has-suffix":this.hasSuffix?"true":null,"has-prepend":this.hasPrepend?"true":null,"has-append":this.hasAppend?"true":null,"has-action":this.hasAction&&!this.hideLabel?"true":null,"full-width":this.fullWidth?"true":null},n("div",{key:"9298d99d233733fd4da14ae3e47f9f111539b976",class:"pds-input"},h&&n("div",{key:"ade5fa1c70587487d62f5c3f8f50c3c567ca1f76",class:"pds-input__label-wrapper"},n("label",{key:"86a3a890317e2bf4e8d0b0cdc2d4ea10c8656a9f",htmlFor:i,class:"pds-input__label"},n("span",{key:"279a7b4540cd984a7c99a083f18b7a1854415ef1",class:this.hideLabel?"visually-hidden":""},h,this.required&&n("span",{key:"a12223c985ae3a6474a1ea6cb850a500c38af4e4",class:"pds-input__required-indicator"}," *"))),!this.hideLabel&&this.renderAction()),n("div",{key:"1b618690bbe9178b9b4c917fb7894ec2c17ac563",class:f},this.renderPrepend(),this.renderPrefix(),n("input",Object.assign({key:"171361ec863409965e71b96a636c6c5450047bf6",ref:function(r){return e.nativeInput=r},class:"pds-input__field","aria-describedby":s(i,c,p),"aria-invalid":c?"true":undefined,autocomplete:this.autocomplete,disabled:o,id:i,max:this.max,maxlength:this.maxlength,min:this.min,minlength:this.minlength,name:this.name,pattern:this.pattern,placeholder:this.placeholder,readOnly:this.readonly,required:this.required,step:this.step,type:this.type,value:b,onInput:this.onInputEvent,onChange:this.onChangeEvent,onBlur:this.onBlurEvent,onFocus:this.onFocusEvent,onCompositionstart:this.onCompositionStart,onCompositionend:this.onCompositionEnd},this.inheritedAttributes)),this.renderSuffix(),this.renderAppend()),p&&n("p",{key:"22f2f1d5efe8c9178bb2eecba072de728826f0c0",class:"pds-input__helper-message",id:d(i,"helper")},p),a&&n("p",{key:"d13ca2940f42cfaac744db106dbd5c6442fdd7e0",class:"pds-input__error-message",id:d(i,"error")},n("pds-icon",{key:"a1622ddd2868470683a2413893cb87d7479acde1",icon:l,size:"small"}),a)))};Object.defineProperty(e,"formAssociated",{get:function(){return true},enumerable:false,configurable:true});Object.defineProperty(e.prototype,"el",{get:function(){return o(this)},enumerable:false,configurable:true});Object.defineProperty(e,"watchers",{get:function(){return{debounce:["debounceChanged"],value:["valueChanged"]}},enumerable:false,configurable:true});return e}());b.style=u+(c+h)}}}));
2
+ //# sourceMappingURL=p-465e3418.system.entry.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"names":["pdsInputTokensCss","labelCss","pdsInputCss","PdsInput","exports","class_1","hostRef","_this","this","inheritedAttributes","isComposing","hasPrefix","hasSuffix","hasPrepend","hasAppend","hasAction","type","value","hasFocus","onInputEvent","ev","input","target","emitInputChange","onChangeEvent","emitValueChange","onBlurEvent","focusedValue","pdsBlur","emit","onFocusEvent","pdsFocus","onCompositionStart","onCompositionEnd","prototype","setFocus","nativeInput","focus","updateAddonWidths","requestAnimationFrame","prefixEl","prefixWidth","offsetWidth","el","style","setProperty","concat","suffixEl","suffixWidth","renderPrefix","querySelector","h","class","part","ref","name","onSlotchange","renderSuffix","renderPrepend","renderAppend","renderAction","componentWillLoad","Object","assign","inheritAriaAttributes","originalPdsInput","pdsInput","connectedCallback","attachInternals","internals","componentDidLoad","debounceChanged","updateFormValue","componentDidUpdate","_a","debounce","undefined","debounceEvent","valueChanged","getValue","toString","event","newValue","pdsChange","setFormValue","setValidity","validity","validationMessage","formResetCallback","formDisabledCallback","disabled","formStateRestoreCallback","state","FormData","get","render","componentId","errorMessage","helperMessage","_b","invalid","label","inputWrapperClasses","Host","key","readonly","hideLabel","fullWidth","htmlFor","required","assignDescription","autocomplete","id","max","maxlength","min","minlength","pattern","placeholder","readOnly","step","onInput","onChange","onBlur","onFocus","onCompositionstart","onCompositionend","messageId","icon","danger","size"],"sources":["src/components/pds-input/pds-input.tokens.scss?tag=pds-input&encapsulation=shadow","src/global/styles/utils/label.scss?tag=pds-input&encapsulation=shadow","src/components/pds-input/pds-input.scss?tag=pds-input&encapsulation=shadow","src/components/pds-input/pds-input.tsx"],"sourcesContent":["@use '~@kajabi-ui/styles/dist/pine/components/pds-input/pds-input.tokens'\n",":host {\n display: inline-block;\n}\n\n:host([aria-disabled=\"true\"]) label {\n color: var(--pine-color-text-label-disabled);\n}\n\n:host([aria-readonly=\"true\"]) {\n label {\n color: var(--pine-color-text-label-readonly);\n }\n}\n\nlabel {\n color: var(--pine-color-text-label);\n font: var(--pine-typography-body-medium);\n letter-spacing: var(--pine-letter-spacing);\n}\n",":host {\n --pds-input-background: var(--pine-color-background-container);\n --pds-input-border-color: var(--pine-color-border);\n --pds-input-border-color-hover: var(--pine-color-border-hover);\n --pds-input-border-color-disabled: var(--pine-color-border-disabled);\n\n --pds-input-border-radius: var(--pine-dimension-125);\n --pds-input-border-width: var(--pine-border-width-thin);\n --pds-input-padding-x: var(--pine-dimension-150);\n --pds-input-padding-y: calc(var(--pine-dimension-xs) - var(--pine-border-width));\n --pds-input-font: var(--pine-typography-body);\n --pds-input-text-color: var(--pine-color-text-active);\n --pds-input-placeholder-color: var(--pine-color-text-placeholder);\n --pds-input-icon-color: var(--pine-color-text-secondary);\n --pds-input-disabled-background: var(--pine-color-background-container-disabled);\n --pds-input-disabled-text-color: var(--pine-color-text-disabled);\n --pds-input-error-color: var(--pine-color-text-message-danger);\n --pds-input-error-background: var(--pine-input-color-background-danger);\n --pds-input-error-border: var(--pine-color-border-danger);\n --pds-input-error-border-hover: var(--pine-color-border-danger-hover);\n --pds-input-addon-background: var(--pine-color-background-subtle);\n --pds-input-addon-color: var(--pine-color-text-secondary);\n --pds-input-field-min-height: var(--pine-dimension-450);\n --box-shadow-focus: 0 0 0 1px #ffffff, 0 0 0 3px var(--pine-color-focus-ring);\n --box-shadow-focus-error: 0 0 0 1px #ffffff, 0 0 0 3px var(--pine-color-focus-ring-danger);\n\n display: inline;\n\n pds-select::part(select) {\n background-color: var(--pds-input-error-background);\n border-color: var(--pds-input-error-border);\n }\n\n &::part(prefix),\n &::part(suffix) {\n align-items: center;\n color: var(--pine-color-text-label-readonly);\n display: flex;\n height: 100%;\n position: absolute;\n top: 50%;\n transform: translateY(-50%);\n white-space: nowrap;\n z-index: var(--pine-z-index-raised);\n }\n\n &::part(prefix) {\n border-end-start-radius: var(--pds-input-border-radius);\n border-inline-end: var(--pine-border-width-none);\n border-start-start-radius: var(--pds-input-border-radius);\n left: var(--pds-input-padding-x);\n }\n\n &::part(suffix) {\n border-end-end-radius: var(--pds-input-border-radius);\n border-inline-start: var(--pine-border-width-none);\n border-start-end-radius: var(--pds-input-border-radius);\n right: var(--pds-input-padding-x);\n }\n\n &::part(prepend),\n &::part(append) {\n align-items: center;\n background-color: var(--pds-input-addon-background);\n border: var(--pds-input-border-width) solid var(--pds-input-border-color);\n color: var(--pds-input-addon-color);\n display: flex;\n overflow: visible;\n }\n\n &::part(prepend) {\n border-end-start-radius: var(--pds-input-border-radius);\n border-inline-end: var(--pine-border-width-none);\n border-start-start-radius: var(--pds-input-border-radius);\n }\n\n &::part(append) {\n border-end-end-radius: var(--pds-input-border-radius);\n border-inline-start: var(--pine-border-width-none);\n border-start-end-radius: var(--pds-input-border-radius);\n }\n}\n\n/* stylelint-disable-next-line */\n:host([has-prepend]) ::slotted(pds-button[slot=\"prepend\"]) {\n --pds-button-background: var(--pds-input-addon-background);\n --pds-button-border: var(--pine-border-width-none);\n --pds-button-border-radius: var(--pine-dimension-none);\n --pds-button-border-radius-end-end: var(--pine-dimension-none);\n --pds-button-border-radius-start-end: var(--pine-dimension-none);\n --pds-button-border-radius-start-start: var(--pds-input-border-radius);\n --pds-button-border-radius-end-start: var(--pds-input-border-radius);\n --pds-button-min-height: calc(var(--pine-dimension-450) - calc(2 * var(--pine-border-width)));\n --pds-button-box-shadow-focus: 0 0 0 3px var(--pine-color-focus-ring);\n --pds-button-outline-focus: none;\n}\n\n/* stylelint-disable-next-line */\n:host([has-append]) ::slotted(pds-button[slot=\"append\"]) {\n --pds-button-background: var(--pds-input-addon-background);\n --pds-button-border: var(--pine-border-width-none);\n --pds-button-border-radius: var(--pine-dimension-none);\n --pds-button-border-radius-end-start: var(--pine-dimension-none);\n --pds-button-border-radius-start-start: var(--pine-dimension-none);\n --pds-button-border-radius-start-end: var(--pds-input-border-radius);\n --pds-button-border-radius-end-end: var(--pds-input-border-radius);\n --pds-button-min-height: calc(var(--pine-dimension-450) - calc(2 * var(--pine-border-width)));\n --pds-button-box-shadow-focus: 0 0 0 3px var(--pine-color-focus-ring);\n --pds-button-outline-focus: none;\n}\n\n/* stylelint-disable-next-line */\n:host([has-prepend]) ::slotted(pds-select[slot=\"prepend\"]) {\n --pds-select-background: var(--pds-input-addon-background);\n --pds-select-border: var(--pine-border-width-none);\n --pds-select-border-radius-end-end: var(--pine-dimension-none);\n --pds-select-border-radius-start-end: var(--pine-dimension-none);\n --pds-select-min-height: calc(var(--pine-dimension-450) - calc(2 * var(--pine-border-width)));\n}\n\n/* stylelint-disable-next-line */\n:host([has-append]) ::slotted(pds-select[slot=\"append\"]) {\n --pds-select-background: var(--pds-input-addon-background);\n --pds-select-border: var(--pine-border-width-none);\n --pds-select-border-radius-end-start: var(--pine-dimension-none);\n --pds-select-border-radius-start-start: var(--pine-dimension-none);\n --pds-select-min-height: calc(var(--pine-dimension-450) - calc(2 * var(--pine-border-width)));\n}\n\n:host([aria-readonly=\"true\"]) {\n input {\n background-color: var(--pine-color-background-container-disabled);\n color: var(--pine-color-text-readonly);\n }\n}\n\n:host([disabled=\"true\"]) {\n &::part(prepend),\n &::part(append) {\n background-color: var(--pds-input-disabled-background);\n border: var(--pds-input-border-width) solid var(--pds-input-border-color-disabled);\n }\n}\n\n:host([full-width=\"true\"]) {\n width: 100%;\n}\n\n:host([invalid=\"true\"]) {\n &::part(prepend),\n &::part(append) {\n background-color: var(--pds-input-error-background);\n border: var(--pds-input-border-width) solid var(--pds-input-error-border);\n }\n}\n\n.pds-input {\n display: flex;\n flex-direction: column;\n}\n\n.pds-input__label-wrapper {\n align-items: center;\n display: flex;\n justify-content: space-between;\n margin-block-end: var(--pine-dimension-2xs);\n}\n\n.pds-input__label {\n color: var(--pine-color-text-active);\n margin-block-end: var(--pine-dimension-2xs);\n}\n\n// When label is inside wrapper, remove its margin\n.pds-input__label-wrapper .pds-input__label {\n margin-block-end: 0;\n}\n\n.pds-input__action {\n align-items: center;\n display: flex;\n gap: var(--pine-dimension-xs);\n margin-inline-start: var(--pine-dimension-xs);\n}\n\n.pds-input__field-wrapper {\n align-items: center;\n display: flex;\n position: relative;\n width: 100%;\n\n &.has-prefix .pds-input__field {\n padding-inline-start: calc(2 * var(--pds-input-padding-x) + var(--prefix-width, 1em));\n }\n\n &.has-suffix .pds-input__field {\n padding-inline-end: calc(2 * var(--pds-input-padding-x) + var(--suffix-width, 1em));\n }\n\n &.has-prepend .pds-input__field {\n border-end-start-radius: var(--pine-dimension-none);\n border-start-start-radius: var(--pine-dimension-none);\n }\n\n &.has-append .pds-input__field {\n border-end-end-radius: var(--pine-dimension-none);\n border-start-end-radius: var(--pine-dimension-none);\n }\n}\n\n.pds-input__field {\n background: var(--pds-input-background);\n border: var(--pds-input-border-width) solid var(--pds-input-border-color);\n border-radius: var(--pds-input-border-radius);\n box-sizing: border-box;\n color: var(--pds-input-text-color);\n flex: 1;\n font: var(--pds-input-font);\n letter-spacing: var(--pine-letter-spacing);\n min-height: var(--pds-input-field-min-height);\n min-width: var(--pine-dimension-none);\n padding: var(--pds-input-padding-y) var(--pds-input-padding-x);\n transition: border-color 0.2s ease;\n width: 100%;\n\n &:hover:not(:disabled) {\n border-color: var(--pds-input-border-color-hover);\n }\n\n &:disabled {\n background: var(--pds-input-disabled-background);\n border-color: var(--pine-color-border-disabled);\n color: var(--pds-input-disabled-text-color);\n cursor: not-allowed;\n\n &::placeholder {\n color: var(--pine-color-text-placeholder-disabled);\n }\n }\n\n .has-error &:hover:not(:disabled) {\n border-color: var(--pds-input-error-border-hover);\n }\n\n &:focus-visible:not(.has-error) {\n border-color: var(--pine-color-border-active);\n outline: var(--pine-outline-focus);\n outline-offset: var(--pine-border-width);\n position: relative;\n z-index: 1;\n\n :host([has-prepend]) &,\n :host([has-append]) &,\n :host([has-prefix]) &,\n :host([has-suffix]) & {\n outline-offset: var(--pine-dimension-none);\n }\n }\n\n &::placeholder {\n color: var(--pds-input-placeholder-color);\n }\n\n .has-error & {\n background-color: var(--pds-input-error-background);\n border-color: var(--pds-input-error-border);\n\n &:focus-visible {\n outline-color: var(--pine-color-focus-ring-danger);\n position: relative;\n z-index: 1;\n }\n }\n}\n\n.pds-input__error-message,\n.pds-input__helper-message {\n color: var(--pine-color-text-message);\n font: var(--pine-typography-body-sm);\n margin-block-end: var(--pine-dimension-none);\n margin-block-start: var(--pine-dimension-2xs);\n}\n\n.pds-input__error-message {\n align-items: center;\n color: var(--pds-input-error-color);\n display: flex;\n gap: var(--pine-dimension-2xs);\n}\n\n.visually-hidden {\n border: 0;\n clip: rect(0 0 0 0);\n clip-path: polygon(0 0, 0 0, 0 0);\n height: 1px;\n margin: -1px;\n overflow: hidden;\n padding: 0;\n position: absolute;\n white-space: nowrap;\n width: 1px;\n}\n","import { Component, Element, Event, EventEmitter, h, Host, Method, Prop, State, Watch } from '@stencil/core';\nimport { assignDescription, messageId } from '../../utils/form';\nimport { inheritAriaAttributes } from '@utils/attributes';\nimport type { Attributes } from '@utils/attributes';\nimport { InputChangeEventDetail, InputInputEventDetail } from './input-interface';\nimport { debounceEvent } from '@utils/utils';\nimport { danger } from '@pine-ds/icons/icons';\n\n/**\n * @slot append - Content to be displayed after the input field\n * @slot prefix - Content that is displayed visually within the input field before the input field\n * @slot prepend - Content to be displayed before the input field\n * @slot suffix - Content that is displayed visually within the input field after the input field\n * @slot action - Content to be displayed in the label area, typically for help icons or links\n */\n@Component({\n tag: 'pds-input',\n styleUrls: ['pds-input.tokens.scss', '../../global/styles/utils/label.scss', 'pds-input.scss'],\n shadow: true,\n formAssociated: true,\n})\nexport class PdsInput {\n\n private nativeInput?: HTMLInputElement;\n private inheritedAttributes: Attributes = {};\n private isComposing = false;\n private prefixEl?: HTMLElement;\n private suffixEl?: HTMLElement;\n private focusedValue?: string | number | null;\n private originalPdsInput?: EventEmitter<InputInputEventDetail>;\n private internals?: ElementInternals;\n\n @Element() el!: HTMLPdsInputElement;\n\n /**\n * If true, the input has prefix content (non-focusable)\n */\n @State() hasPrefix = false;\n\n /**\n * If true, the input has suffix content (non-focusable)\n */\n @State() hasSuffix = false;\n\n /**\n * If true, the input has prepend content (focusable)\n */\n @State() hasPrepend = false;\n\n /**\n * If true, the input has append content (focusable)\n */\n @State() hasAppend = false;\n\n /**\n * If true, the input has action content in the label area\n */\n @State() hasAction = false;\n\n /**\n * Emitted when the input loses focus.\n */\n @Event() pdsBlur!: EventEmitter<FocusEvent>;\n\n /**\n * Emitted when the value has changed.\n *\n * This event will not emit when programmatically setting the `value` property.\n */\n @Event() pdsChange!: EventEmitter<InputChangeEventDetail>;\n\n /**\n * Emitted when the input has focus.\n */\n @Event() pdsFocus!: EventEmitter<FocusEvent>;\n\n /**\n * Emitted when a keyboard input occurs.\n */\n @Event() pdsInput: EventEmitter<InputInputEventDetail>;\n\n /**\n * Sets focus on the native `input` in the `pds-input`. Use this method instead of the global\n * `input.focus()`.\n */\n @Method()\n async setFocus() {\n if (this.nativeInput) {\n this.nativeInput.focus();\n }\n }\n\n\n /**\n * Specifies if and how the browser provides `autocomplete` assistance for the field.\n */\n @Prop() autocomplete: string;\n\n /**\n * A unique identifier used for the underlying component `id` attribute.\n */\n @Prop() componentId!: string;\n\n /**\n * Sets the number of milliseconds to wait before updating the value.\n */\n @Prop() debounce?: number;\n\n /**\n * Determines whether or not the input field is disabled.\n */\n @Prop() disabled?: boolean;\n\n /**\n * Specifies the error message and provides an error-themed treatment to the field.\n */\n @Prop() errorMessage?: string;\n\n /**\n * Displays a message or hint below the input field.\n */\n @Prop() helperMessage?: string;\n\n /**\n * Determines whether or not the input field is invalid or throws an error.\n */\n @Prop() invalid?: boolean;\n\n /**\n * Text to be displayed as the input label.\n */\n @Prop() label?: string;\n\n /**\n * Visually hides the label text for instances where only the input should be displayed. Label remains accessible to assistive technology such as screen readers.\n * Note: When true, the action slot is also hidden to maintain a minimal UI.\n */\n @Prop() hideLabel: boolean;\n\n /**\n * Specifies the maximum value for the input field.\n */\n @Prop() max?: string;\n\n /**\n * Specifies the maximum number of characters allowed in the input field.\n */\n @Prop() maxlength?: string;\n\n /**\n * Specifies the minimum value for the input field.\n */\n @Prop() min?: string;\n\n /**\n * Specifies the minimum number of characters allowed in the input field.\n */\n @Prop() minlength?: string;\n\n /**\n * Specifies the name. Submitted with the form name/value pair.\n */\n @Prop() name?: string;\n\n /**\n * Specifies the regular expression that the input value is checked against.\n */\n @Prop() pattern?: string;\n\n /**\n * Specifies a short hint that describes the expected value of the input field.\n */\n @Prop() placeholder?: string;\n\n /**\n * Determines whether or not the input field is readonly.\n */\n @Prop() readonly?: boolean;\n\n /**\n * Determines whether or not the input field is required.\n */\n @Prop() required?: boolean;\n\n /**\n * Works with the `min` and `max` attributes to define increments for the input field.\n */\n @Prop() step?: string;\n\n /**\n * Determines the type of control that will be displayed\n * `'email'`, `'number'`, `'password'`, `'tel'`, `'text'`, `'url'`\n * @defaultValue \"text\"\n */\n @Prop() type = 'text';\n\n /**\n * The value of the input.\n */\n @Prop({mutable: true}) value?: string | number | null = '';\n\n /**\n * Determines whether or not the input field takes full width of its container.\n */\n @Prop() fullWidth?: boolean;\n\n /**\n * Determines if the input has focus.\n */\n @State() hasFocus = false;\n\n private updateAddonWidths() {\n requestAnimationFrame(() => {\n if (this.prefixEl) {\n const prefixWidth = this.prefixEl.offsetWidth;\n this.el.style.setProperty('--prefix-width', `${prefixWidth}px`);\n }\n\n if (this.suffixEl) {\n const suffixWidth = this.suffixEl.offsetWidth;\n this.el.style.setProperty('--suffix-width', `${suffixWidth}px`);\n }\n });\n }\n\n private renderPrefix() {\n const hasPrefix = this.el.querySelector('[slot=\"prefix\"]') !== null;\n if (hasPrefix) {\n return (\n <div class=\"pds-input__prefix\" part=\"prefix\" ref={(el) => this.prefixEl = el as HTMLElement}>\n <slot name=\"prefix\" onSlotchange={() => this.updateAddonWidths()}></slot>\n </div>\n );\n }\n return null;\n }\n\n private renderSuffix() {\n const hasSuffix = this.el.querySelector('[slot=\"suffix\"]') !== null;\n if (hasSuffix) {\n return (\n <div class=\"pds-input__suffix\" part=\"suffix\" ref={(el) => this.suffixEl = el as HTMLElement}>\n <slot name=\"suffix\" onSlotchange={() => this.updateAddonWidths()}></slot>\n </div>\n );\n }\n return null;\n }\n\n private renderPrepend() {\n const hasPrepend = this.el.querySelector('[slot=\"prepend\"]') !== null;\n if (hasPrepend) {\n return (\n <div class=\"pds-input__prepend\" part=\"prepend\">\n <slot name=\"prepend\"></slot>\n </div>\n );\n }\n return null;\n }\n\n private renderAppend() {\n const hasAppend = this.el.querySelector('[slot=\"append\"]') !== null;\n if (hasAppend) {\n return (\n <div class=\"pds-input__append\" part=\"append\">\n <slot name=\"append\"></slot>\n </div>\n );\n }\n return null;\n }\n\n private renderAction() {\n const hasAction = this.el.querySelector('[slot=\"action\"]') !== null;\n if (hasAction) {\n return (\n <div class=\"pds-input__action\" part=\"action\">\n <slot name=\"action\"></slot>\n </div>\n );\n }\n return null;\n }\n\n componentWillLoad() {\n this.inheritedAttributes = {\n ...inheritAriaAttributes(this.el)\n };\n this.hasPrefix = this.el.querySelector('[slot=\"prefix\"]') !== null;\n this.hasSuffix = this.el.querySelector('[slot=\"suffix\"]') !== null;\n this.hasPrepend = this.el.querySelector('[slot=\"prepend\"]') !== null;\n this.hasAppend = this.el.querySelector('[slot=\"append\"]') !== null;\n this.hasAction = this.el.querySelector('[slot=\"action\"]') !== null;\n\n // Store the original pdsInput event emitter\n this.originalPdsInput = this.pdsInput;\n }\n\n connectedCallback() {\n // Initialize ElementInternals for form association\n if (this.el.attachInternals) {\n this.internals = this.el.attachInternals();\n }\n }\n\n componentDidLoad() {\n this.debounceChanged();\n this.updateAddonWidths();\n // Set initial form value\n this.updateFormValue();\n }\n\n componentDidUpdate() {\n this.updateAddonWidths();\n }\n\n @Watch('debounce')\n protected debounceChanged() {\n const { pdsInput, debounce, originalPdsInput } = this;\n\n /**\n * If debounce is undefined, we have to manually revert the pdsInput emitter in case\n * debounce used to be set to a number. Otherwise, the event would stay debounced.\n */\n this.pdsInput = debounce === undefined ? originalPdsInput ?? pdsInput : debounceEvent(pdsInput, debounce);\n }\n\n @Watch('value')\n protected valueChanged() {\n const nativeInput = this.nativeInput;\n const value = this.getValue();\n\n if (nativeInput && nativeInput.value !== value && !this.isComposing) {\n nativeInput.value = value;\n }\n\n // Update form value when value changes\n this.updateFormValue();\n }\n\n private getValue(): string {\n return typeof this.value === 'number' ? this.value.toString() : (this.value || '').toString();\n }\n\n private onInputEvent = (ev: Event) => {\n const input = ev.target as HTMLInputElement | null;\n if (input) {\n this.value = input.value || '';\n }\n this.emitInputChange(ev);\n };\n\n private onChangeEvent = (ev: Event) => {\n this.emitValueChange(ev);\n };\n\n private onBlurEvent = (ev: FocusEvent) => {\n this.hasFocus = false;\n\n if (this.focusedValue !== this.value) {\n /**\n * Emits the `pdsChange` event when the input value\n * is different than the value when the input was focused.\n */\n this.emitValueChange(ev);\n }\n\n this.pdsBlur.emit(ev);\n };\n\n private onFocusEvent = (ev: FocusEvent) => {\n this.hasFocus = true;\n this.focusedValue = this.value;\n\n this.pdsFocus.emit(ev);\n };\n\n private onCompositionStart = () => {\n this.isComposing = true;\n }\n\n private onCompositionEnd = () => {\n this.isComposing = false;\n }\n\n /**\n * Emits a pdsChange event\n */\n private emitValueChange(event?: Event) {\n const { value } = this;\n const newValue = value == null ? value : value.toString();\n\n this.focusedValue = newValue;\n this.pdsChange.emit({ value: newValue, event });\n }\n\n /**\n * Emits a `pdsInput` event\n */\n private emitInputChange(event?: Event) {\n const { value } = this;\n\n // Checks for both null and undefined values\n const newValue = value == null ? value : value.toString();\n\n this.pdsInput.emit({ value: newValue, event });\n }\n\n /**\n * Updates the form value using ElementInternals API\n */\n private updateFormValue() {\n if (this.internals && this.internals.setFormValue) {\n const value = this.getValue();\n this.internals.setFormValue(value || null);\n\n // Set validity based on native input validation\n if (this.nativeInput && this.internals && this.internals.setValidity) {\n this.internals.setValidity(\n this.nativeInput.validity,\n this.nativeInput.validationMessage,\n this.nativeInput\n );\n }\n }\n }\n\n /**\n * Form Associated Custom Elements API: Called when the form is reset\n */\n formResetCallback() {\n this.value = '';\n this.updateFormValue();\n }\n\n /**\n * Form Associated Custom Elements API: Called when the form is disabled\n */\n formDisabledCallback(disabled: boolean) {\n this.disabled = disabled;\n }\n\n /**\n * Form Associated Custom Elements API: Called to restore form state\n */\n formStateRestoreCallback(state: string | FormData | null) {\n if (typeof state === 'string') {\n this.value = state;\n } else if (state instanceof FormData && this.name) {\n // Extract value from FormData using the input's name\n const value = state.get(this.name);\n if (typeof value === 'string') {\n this.value = value;\n }\n }\n }\n\n render() {\n const {\n componentId,\n disabled,\n errorMessage,\n helperMessage,\n invalid = false,\n label,\n } = this;\n\n const value = this.getValue();\n\n const inputWrapperClasses = {\n 'pds-input__field-wrapper': true,\n 'has-focus': this.hasFocus,\n 'has-error': invalid || !!errorMessage,\n 'is-disabled': disabled,\n 'has-prefix': this.hasPrefix,\n 'has-suffix': this.hasSuffix,\n 'has-prepend': this.hasPrepend,\n 'has-append': this.hasAppend,\n };\n\n return (\n <Host\n aria-disabled={this.disabled ? 'true' : null}\n aria-readonly={this.readonly ? 'true' : null}\n has-prefix={this.hasPrefix ? 'true' : null}\n has-suffix={this.hasSuffix ? 'true' : null}\n has-prepend={this.hasPrepend ? 'true' : null}\n has-append={this.hasAppend ? 'true' : null}\n has-action={this.hasAction && !this.hideLabel ? 'true' : null}\n full-width={this.fullWidth ? 'true' : null}\n >\n <div class=\"pds-input\">\n {label && (\n <div class=\"pds-input__label-wrapper\">\n <label htmlFor={componentId} class=\"pds-input__label\">\n <span class={this.hideLabel ? 'visually-hidden' : ''}>\n {label}\n {this.required && <span class=\"pds-input__required-indicator\"> *</span>}\n </span>\n </label>\n {!this.hideLabel && this.renderAction()}\n </div>\n )}\n\n <div class={inputWrapperClasses}>\n {this.renderPrepend()}\n {this.renderPrefix()}\n <input\n ref={(input) => (this.nativeInput = input)}\n class=\"pds-input__field\"\n aria-describedby={assignDescription(componentId, invalid, helperMessage)}\n aria-invalid={invalid ? \"true\" : undefined}\n autocomplete={this.autocomplete}\n disabled={disabled}\n id={componentId}\n max={this.max}\n maxlength={this.maxlength}\n min={this.min}\n minlength={this.minlength}\n name={this.name}\n pattern={this.pattern}\n placeholder={this.placeholder}\n readOnly={this.readonly}\n required={this.required}\n step={this.step}\n type={this.type}\n value={value}\n onInput={this.onInputEvent}\n onChange={this.onChangeEvent}\n onBlur={this.onBlurEvent}\n onFocus={this.onFocusEvent}\n onCompositionstart={this.onCompositionStart}\n onCompositionend={this.onCompositionEnd}\n {...this.inheritedAttributes}\n />\n {this.renderSuffix()}\n {this.renderAppend()}\n </div>\n\n {helperMessage && (\n <p class=\"pds-input__helper-message\" id={messageId(componentId, 'helper')}>\n {helperMessage}\n </p>\n )}\n\n {errorMessage && (\n <p class=\"pds-input__error-message\" id={messageId(componentId, 'error')}>\n <pds-icon icon={danger} size=\"small\" />\n {errorMessage}\n </p>\n )}\n </div>\n </Host>\n );\n }\n}\n"],"mappings":"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","ignoreList":[]}
@@ -0,0 +1 @@
1
+ {"version":3,"file":"p-4xv5UVkx.system.js","sources":["src/components/pds-copytext/pds-copytext.scss?tag=pds-copytext&encapsulation=shadow","src/components/pds-copytext/pds-copytext.tsx"],"sourcesContent":[":host(.pds-copytext) {\n // Update custom prop usage in Button before changing\n --copytext-color-background-hover: var(--pine-color-grey-200);\n\n\n pds-button {\n align-items: center;\n background: var(--pine-color-secondary);\n border-radius: var(--pine-border-radius-full);\n border-width: var(--pine-dimension-none);\n display: inline-flex;\n font-family: var(--pine-font-family-heading);\n font-size: var(--pine-font-size-body-md);\n font-weight: var(--pine-font-weight-body-medium);\n letter-spacing: var(--pine-letter-spacing);\n line-height: var(--pine-line-height-body);\n max-width: 100%;\n\n &::part(button) {\n padding-block: var(--pine-dimension-2xs);\n padding-inline: var(--pine-dimension-xs);\n }\n\n &::part(button):hover {\n // Update custom prop usage in Button before changing\n background-color: var(--copytext-color-background-hover);\n color: var(--pine-color-text-secondary-hover);\n }\n\n span {\n font-weight: var(--pine-font-weight-medium);\n margin-inline-end: var(--pine-dimension-xs);\n white-space: nowrap;\n }\n\n :nth-child(2) {\n flex-shrink: 0;\n }\n }\n\n // bordered\n\n &:host(.pds-copytext--bordered) {\n border-width: var(--pine-dimension-none);\n padding: var(--pine-dimension-none);\n\n pds-button {\n padding: var(--pine-dimension-none);\n\n &::part(button) {\n padding: var(--pine-dimension-none);\n }\n\n &::part(button):hover {\n background-color: transparent;\n }\n }\n\n span {\n border: var(--pine-border);\n border-radius: var(--pine-border-radius-full);\n margin-inline-end: var(--pine-dimension-sm);\n padding-block: var(--pine-dimension-xs);\n padding-inline: var(--pine-dimension-sm);\n }\n\n :hover {\n span {\n border: var(--pine-border-hover);\n }\n }\n }\n\n // full width and truncated\n &:host(.pds-copytext--full-width),\n &:host(.pds-copytext--truncated) {\n pds-button {\n display: inline-flex;\n min-width: auto;\n width: 100%;\n\n &::part(button-content),\n &::part(button-text) {\n flex-shrink: 1;\n width: 100%;\n }\n\n span {\n text-align: start;\n width: 100%;\n }\n }\n }\n\n // full width\n &:host(.pds-copytext--full-width) {\n pds-button {\n justify-content: space-between;\n }\n }\n\n // truncated\n &:host(.pds-copytext--truncated) {\n pds-button span {\n overflow: hidden;\n text-overflow: ellipsis;\n }\n }\n}\n","import { Component, Event, EventEmitter, Host, h, Prop } from '@stencil/core';\n\nimport { copy as copyIcon } from '@pine-ds/icons/icons';\n\n@Component({\n tag: 'pds-copytext',\n styleUrls: ['pds-copytext.scss'],\n shadow: true,\n})\nexport class PdsCopytext {\n /**\n * Determines whether `copytext` should have a visible border.\n * @defaultValue true\n */\n @Prop({ reflect: true }) border = true;\n\n /**\n * A unique identifier used for the underlying component `id` attribute.\n */\n @Prop() componentId: string;\n\n /**\n * Determines whether `copytext` should expand to the full width of its container.\n * @defaultValue false\n */\n @Prop() fullWidth = false;\n\n /**\n * Determines whether the `value` should truncate and display with an ellipsis.\n * @defaultValue false\n */\n @Prop() truncate = false;\n\n /**\n * The string displayed that is also copied to the clipboard upon interaction.\n */\n @Prop() value!: string;\n\n /**\n * Event fired when copyText button is clicked.\n */\n @Event() pdsCopyTextClick: EventEmitter;\n\n private copyToClipboard = async (value: string) => {\n try {\n if (typeof navigator.clipboard !== 'undefined') {\n await navigator.clipboard.writeText(value);\n this.pdsCopyTextClick.emit('Copied to clipboard');\n }\n } catch (err) {\n this.pdsCopyTextClick.emit(`Error writing text to clipboard: ${err}`);\n }\n };\n\n private handleClick = () => {\n this.copyToClipboard(this.value);\n };\n\n private classNames() {\n const classNames = ['pds-copytext'];\n\n if (this.border) {\n classNames.push('pds-copytext--bordered');\n }\n\n if (this.fullWidth) {\n classNames.push('pds-copytext--full-width');\n }\n\n if (this.truncate) {\n classNames.push('pds-copytext--truncated');\n }\n\n return classNames.join(' ');\n }\n\n render() {\n return (\n <Host class={this.classNames()} id={this.componentId}>\n <pds-button type=\"button\" variant=\"unstyled\" onClick={this.handleClick}>\n <span>{this.value}</span>\n <pds-icon icon={copyIcon} size=\"16px\"></pds-icon>\n </pds-button>\n </Host>\n );\n }\n}\n"],"names":["copyIcon"],"mappings":";;;;;;;;;;;;;;MAAA,MAAM,cAAc,GAAG,y1FAAy1F;;YCSn2F,WAAW,2BAAA,MAAA;MALxB,IAAA,WAAA,CAAA,OAAA,EAAA;;;MAME;;;MAGG;MACsB,QAAA,IAAM,CAAA,MAAA,GAAG,IAAI;MAOtC;;;MAGG;MACK,QAAA,IAAS,CAAA,SAAA,GAAG,KAAK;MAEzB;;;MAGG;MACK,QAAA,IAAQ,CAAA,QAAA,GAAG,KAAK;MAYhB,QAAA,IAAA,CAAA,eAAe,GAAG,OAAO,KAAa,KAAI;MAChD,YAAA,IAAI;MACF,gBAAA,IAAI,OAAO,SAAS,CAAC,SAAS,KAAK,WAAW,EAAE;0BAC9C,MAAM,SAAS,CAAC,SAAS,CAAC,SAAS,CAAC,KAAK,CAAC;MAC1C,oBAAA,IAAI,CAAC,gBAAgB,CAAC,IAAI,CAAC,qBAAqB,CAAC;;;kBAEnD,OAAO,GAAG,EAAE;sBACZ,IAAI,CAAC,gBAAgB,CAAC,IAAI,CAAC,CAAoC,iCAAA,EAAA,GAAG,CAAE,CAAA,CAAC;;MAEzE,SAAC;MAEO,QAAA,IAAW,CAAA,WAAA,GAAG,MAAK;MACzB,YAAA,IAAI,CAAC,eAAe,CAAC,IAAI,CAAC,KAAK,CAAC;MAClC,SAAC;MA8BF;UA5BS,UAAU,GAAA;MAChB,QAAA,MAAM,UAAU,GAAG,CAAC,cAAc,CAAC;MAEnC,QAAA,IAAI,IAAI,CAAC,MAAM,EAAE;MACf,YAAA,UAAU,CAAC,IAAI,CAAC,wBAAwB,CAAC;;MAG3C,QAAA,IAAI,IAAI,CAAC,SAAS,EAAE;MAClB,YAAA,UAAU,CAAC,IAAI,CAAC,0BAA0B,CAAC;;MAG7C,QAAA,IAAI,IAAI,CAAC,QAAQ,EAAE;MACjB,YAAA,UAAU,CAAC,IAAI,CAAC,yBAAyB,CAAC;;MAG5C,QAAA,OAAO,UAAU,CAAC,IAAI,CAAC,GAAG,CAAC;;UAG7B,MAAM,GAAA;MACJ,QAAA,QACE,CAAA,CAAC,IAAI,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAC,KAAK,EAAE,IAAI,CAAC,UAAU,EAAE,EAAE,EAAE,EAAE,IAAI,CAAC,WAAW,EAAA,EAClD,CAAA,CAAA,YAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAY,IAAI,EAAC,QAAQ,EAAC,OAAO,EAAC,UAAU,EAAC,OAAO,EAAE,IAAI,CAAC,WAAW,EAAA,EACpE,CAAO,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,EAAA,IAAI,CAAC,KAAK,CAAQ,EACzB,CAAU,CAAA,UAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,IAAI,EAAEA,IAAQ,EAAE,IAAI,EAAC,MAAM,EAAY,CAAA,CACtC,CACR;;;;;;;;;;;"}
@@ -0,0 +1,2 @@
1
+ System.register(["./p-Cxvdulqq.system.js","./p-BHavepTY.system.js","./p-BG99uNIQ.system.js","./p-BhQhw0S3.system.js"],(function(e){"use strict";var i,r,o,n,t,a,s,d,c,l;return{setters:[function(e){i=e.r;r=e.c;o=e.h;n=e.H;t=e.g},function(e){a=e.e;s=e.m;d=e.a},function(e){c=e.i},function(e){l=e.i}],execute:function(){var b=":host{display:inline-block}:host([aria-disabled=true]) label{color:var(--pine-color-text-label-disabled)}:host([aria-readonly=true]) label{color:var(--pine-color-text-label-readonly)}label{color:var(--pine-color-text-label);font:var(--pine-typography-body-medium);letter-spacing:var(--pine-letter-spacing)}";var p=':host{-ms-flex-align:center;align-items:center;display:-ms-flexbox;display:flex;-ms-flex-flow:row wrap;flex-flow:row wrap}:host(.is-invalid) input{border-color:var(--pine-color-border-danger)}:host(.is-invalid) input:checked{background:var(--pine-color-danger)}:host(.is-invalid) input:checked:hover{background:var(--pine-color-danger-hover);border-color:var(--pine-color-border-danger-hover)}:host(.is-invalid) input:focus-visible{outline-color:var(--pine-color-focus-ring-danger)}:host(.is-invalid) label,:host(.is-invalid) .pds-checkbox__message--error{color:var(--pine-color-text-message-danger)}:host(.is-indeterminate) input{background:var(--pine-color-accent);border-color:var(--pine-color-accent)}:host(.is-indeterminate) input:hover{background:var(--pine-color-accent);border-color:var(--pine-color-accent-hover)}:host(.is-indeterminate) input::after{border:1px solid var(--pine-color-secondary);-webkit-border-after:var(--pine-border-width-none);border-block-end:var(--pine-border-width-none);-webkit-border-before:var(--pine-border-width-none);border-block-start:var(--pine-border-width-none);-webkit-border-start:var(--pine-border-width-none);border-inline-start:var(--pine-border-width-none);content:"";display:block;height:7px;left:50%;position:absolute;top:50%;-webkit-transform:rotate(90deg) translate3d(-103%, 32%, 0);transform:rotate(90deg) translate3d(-103%, 32%, 0);width:4px}input{-webkit-appearance:none;-moz-appearance:none;appearance:none;background:var(--pine-color-background-container);border:var(--pine-border);border-radius:var(--pine-dimension-2xs);-ms-flex:none;flex:none;height:var(--pine-dimension-sm);margin:0;-webkit-margin-before:var(--pine-dimension-025);margin-block-start:var(--pine-dimension-025);position:relative;width:var(--pine-dimension-sm)}input:hover{background:var(--pine-color-background-container-hover);border:var(--pine-border-hover)}input:checked{background:var(--pine-color-accent);border-color:var(--pine-color-accent)}input:checked:hover{background:var(--pine-color-accent-hover);border-color:var(--pine-color-accent-hover)}input:checked::after{border:1px solid var(--pine-color-secondary);-webkit-border-before:var(--pine-border-width-none);border-block-start:var(--pine-border-width-none);-webkit-border-start:var(--pine-border-width-none);border-inline-start:var(--pine-border-width-none);content:"";display:block;height:7px;left:50%;position:absolute;top:50%;-webkit-transform:rotate(43deg) translate3d(-110%, -30%, 0);transform:rotate(43deg) translate3d(-110%, -30%, 0);width:4px}input:disabled{background:var(--pine-color-background-container-disabled);border-color:var(--pine-color-border-disabled);cursor:not-allowed}input:disabled:checked{background:var(--pine-color-background-container-disabled);border-color:var(--pine-color-border-disabled)}input:disabled:checked::after{border-color:var(--pine-color-grey-300)}input:disabled+label{cursor:not-allowed}input:disabled~.pds-checkbox__message{color:var(--pine-color-text-disabled)}input:focus-visible{outline:var(--pine-outline-focus)}label{display:-ms-flexbox;display:flex;gap:var(--pine-dimension-xs)}.visually-hidden{border:0;clip:rect(0 0 0 0);-webkit-clip-path:polygon(0 0, 0 0, 0 0);clip-path:polygon(0 0, 0 0, 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;white-space:nowrap;width:1px}.pds-checkbox__message{color:var(--pine-color-text-message);font:var(--pine-typography-body-sm-medium);-webkit-margin-before:6px;margin-block-start:6px;-webkit-margin-start:var(--pine-dimension-md);margin-inline-start:var(--pine-dimension-md);width:100%}.pds-checkbox__message--error{display:-ms-flexbox;display:flex;font-size:var(--pine-font-size-085);gap:var(--pine-dimension-050)}.pds-checkbox__message--error pds-icon{-webkit-margin-before:var(--pine-dimension-025);margin-block-start:var(--pine-dimension-025)}';var h=e("pds_checkbox",function(){function e(e){var o=this;i(this,e);this.pdsCheckboxChange=r(this,"pdsCheckboxChange");this.pdsCheckboxInput=r(this,"pdsCheckboxInput");this.inheritedAttributes={};this._type="checkbox";this.checked=false;this.handleCheckboxChange=function(e){if(o.disabled){return}var i=e.target;o.checked=i.checked;o.updateFormValue();o.pdsCheckboxChange.emit({checked:i.checked,value:o.value})};this.handleInput=function(){o.pdsCheckboxInput.emit({checked:o.checked,value:o.value})}}e.prototype.updateIndeterminate=function(){this.indeterminate=undefined};e.prototype.classNames=function(){var e=[];if(this.invalid){e.push("is-invalid")}if(this.indeterminate){e.push("is-indeterminate")}if(this.disabled){e.push("is-disabled")}return e.join(" ")};e.prototype.connectedCallback=function(){var e=this;if(this.el.attachInternals){this.internals=this.el.attachInternals()}a(this.el,(function(){return e._type}))};e.prototype.componentDidLoad=function(){this.updateFormValue()};e.prototype.checkedChanged=function(){this.updateFormValue()};e.prototype.updateFormValue=function(){var e;if(typeof jest!=="undefined"||typeof process!=="undefined"&&((e=process.env)===null||e===void 0?void 0:e.NODE_ENV)==="test"){return}if(this.internals&&this.internals.setFormValue){var i=this.checked?this.value||"on":null;this.internals.setFormValue(i)}if(this.internals&&this.internals.setValidity){this.internals.setValidity({})}};e.prototype.formStateRestoreCallback=function(e){if(e instanceof FormData){var i=this.value||"on";this.checked=e.get(this.name)===i}else if(typeof e==="string"){this.checked=e===(this.value||"on")}};e.prototype.componentWillLoad=function(){this.inheritedAttributes=Object.assign({},l(this.el))};e.prototype.render=function(){return o(n,{key:"03464c7d6a3dc475e266b5f913928d17b2a338d6",class:this.classNames()},o("label",{key:"194a98ecdaa1c2627c4a94a4aff9c3c83ddd3a0b",htmlFor:this.componentId},o("input",Object.assign({key:"8878b64c34ad11dca1e90b72afb0cd30017d3bc2",type:"checkbox","aria-describedby":d(this.componentId,this.invalid,this.errorMessage||this.helperMessage),"aria-invalid":this.invalid?"true":undefined,id:this.componentId,indeterminate:this.indeterminate,name:this.name,value:this.value,checked:this.checked,required:this.required,disabled:this.disabled,onChange:this.handleCheckboxChange,onInput:this.handleInput},this.inheritedAttributes)),o("span",{key:"f3db09d434084bf96b5f1b0da8c095d6517d91b5",class:this.hideLabel?"visually-hidden":""},this.label)),this.helperMessage&&o("div",{key:"c781a27975cdd7c4361fa9d29a06f915633f52ba",class:"pds-checkbox__message",id:s(this.componentId,"helper")},this.helperMessage),this.errorMessage&&o("div",{key:"b586e97855401f21dcbd5822e4bad099b6a7dc2a",class:"pds-checkbox__message pds-checkbox__message--error",id:s(this.componentId,"error"),"aria-live":"assertive"},o("pds-icon",{key:"98c8db2a196b84683aa777fd1a9a9291e30acf78",icon:c,size:"small"}),this.errorMessage))};Object.defineProperty(e,"formAssociated",{get:function(){return true},enumerable:false,configurable:true});Object.defineProperty(e.prototype,"el",{get:function(){return t(this)},enumerable:false,configurable:true});Object.defineProperty(e,"watchers",{get:function(){return{checked:["updateIndeterminate","checkedChanged"]}},enumerable:false,configurable:true});return e}());h.style=b+p}}}));
2
+ //# sourceMappingURL=p-538b3902.system.entry.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"names":["labelCss","pdsCheckboxCss","PdsCheckbox","exports","class_1","hostRef","_this","this","inheritedAttributes","_type","checked","handleCheckboxChange","e","disabled","target","updateFormValue","pdsCheckboxChange","emit","value","handleInput","pdsCheckboxInput","prototype","updateIndeterminate","indeterminate","undefined","classNames","invalid","push","join","connectedCallback","el","attachInternals","internals","exposeTypeProperty","componentDidLoad","checkedChanged","jest","process","_a","env","NODE_ENV","setFormValue","formValue","setValidity","formStateRestoreCallback","state","FormData","get","name","componentWillLoad","Object","assign","inheritAriaAttributes","render","h","Host","key","class","htmlFor","componentId","type","assignDescription","errorMessage","helperMessage","id","required","onChange","onInput","hideLabel","label","messageId","icon","danger","size"],"sources":["src/global/styles/utils/label.scss?tag=pds-checkbox&encapsulation=shadow","src/components/pds-checkbox/pds-checkbox.scss?tag=pds-checkbox&encapsulation=shadow","src/components/pds-checkbox/pds-checkbox.tsx"],"sourcesContent":[":host {\n display: inline-block;\n}\n\n:host([aria-disabled=\"true\"]) label {\n color: var(--pine-color-text-label-disabled);\n}\n\n:host([aria-readonly=\"true\"]) {\n label {\n color: var(--pine-color-text-label-readonly);\n }\n}\n\nlabel {\n color: var(--pine-color-text-label);\n font: var(--pine-typography-body-medium);\n letter-spacing: var(--pine-letter-spacing);\n}\n",":host {\n align-items: center;\n display: flex;\n flex-flow: row wrap;\n}\n\n:host(.is-invalid) {\n input {\n border-color: var(--pine-color-border-danger);\n\n &:checked {\n background: var( --pine-color-danger);\n\n &:hover {\n background: var(--pine-color-danger-hover);\n border-color: var(--pine-color-border-danger-hover);\n }\n }\n\n &:focus-visible {\n outline-color: var(--pine-color-focus-ring-danger);\n }\n }\n\n label,\n .pds-checkbox__message--error {\n color: var(--pine-color-text-message-danger);\n }\n}\n\n:host(.is-indeterminate) {\n input {\n background: var(--pine-color-accent);\n border-color: var(--pine-color-accent);\n\n &:hover {\n background: var(--pine-color-accent);\n border-color: var(--pine-color-accent-hover);\n }\n\n &::after {\n border: 1px solid var(--pine-color-secondary);\n border-block-end: var(--pine-border-width-none);\n border-block-start: var(--pine-border-width-none);\n border-inline-start: var(--pine-border-width-none);\n content: \"\";\n display: block;\n height: 7px;\n left: 50%;\n position: absolute;\n top: 50%;\n transform: rotate(90deg) translate3d(-103%, 32%, 0);\n width: 4px;\n }\n }\n}\n\ninput {\n appearance: none;\n background: var(--pine-color-background-container);\n border: var(--pine-border);\n border-radius: var(--pine-dimension-2xs);\n flex: none;\n height: var(--pine-dimension-sm);\n margin: 0;\n margin-block-start: var(--pine-dimension-025);\n position: relative;\n width: var(--pine-dimension-sm);\n\n &:hover {\n background: var(--pine-color-background-container-hover);\n border: var(--pine-border-hover);\n }\n\n &:checked {\n background: var(--pine-color-accent);\n border-color: var(--pine-color-accent);\n\n &:hover {\n background: var(--pine-color-accent-hover);\n border-color: var(--pine-color-accent-hover);\n }\n\n &::after {\n border: 1px solid var(--pine-color-secondary);\n border-block-start: var(--pine-border-width-none);\n border-inline-start: var(--pine-border-width-none);\n content: \"\";\n display: block;\n height: 7px;\n left: 50%;\n position: absolute;\n top: 50%;\n transform: rotate(43deg) translate3d(-110%, -30%, 0);\n width: 4px;\n }\n }\n\n &:disabled {\n background: var(--pine-color-background-container-disabled);\n border-color: var(--pine-color-border-disabled);\n cursor: not-allowed;\n\n &:checked {\n background: var(--pine-color-background-container-disabled);\n border-color: var(--pine-color-border-disabled);\n\n &::after {\n border-color: var(--pine-color-grey-300);\n }\n }\n\n + label {\n cursor: not-allowed;\n }\n\n ~ .pds-checkbox__message {\n color: var(--pine-color-text-disabled);\n }\n }\n\n &:focus-visible {\n outline: var(--pine-outline-focus);\n }\n}\n\nlabel {\n display: flex;\n gap: var(--pine-dimension-xs);\n}\n\n.visually-hidden {\n border: 0;\n clip: rect(0 0 0 0);\n clip-path: polygon(0 0, 0 0, 0 0);\n height: 1px;\n margin: -1px;\n overflow: hidden;\n padding: 0;\n position: absolute;\n white-space: nowrap;\n width: 1px;\n}\n\n.pds-checkbox__message {\n color: var(--pine-color-text-message);\n font: var(--pine-typography-body-sm-medium);\n margin-block-start: 6px;\n margin-inline-start: var(--pine-dimension-md);\n width: 100%;\n}\n\n.pds-checkbox__message--error {\n display: flex;\n font-size: var(--pine-font-size-085);\n gap: var(--pine-dimension-050);\n\n pds-icon {\n margin-block-start: var(--pine-dimension-025);\n }\n}\n","import { Component, Element, h, Prop, Host, Event, EventEmitter, Watch } from '@stencil/core';\nimport { assignDescription, messageId, exposeTypeProperty } from '../../utils/form';\nimport { CheckboxChangeEventDetail } from './checkbox-interface';\nimport { danger } from '@pine-ds/icons/icons';\n\nimport { inheritAriaAttributes } from '@utils/attributes';\nimport type { Attributes } from '@utils/attributes';\n\n@Component({\n tag: 'pds-checkbox',\n styleUrls: ['../../global/styles/utils/label.scss', 'pds-checkbox.scss'],\n shadow: true,\n formAssociated: true,\n})\nexport class PdsCheckbox {\n private inheritedAttributes: Attributes = {};\n private internals?: ElementInternals;\n private readonly _type = 'checkbox' as const;\n\n @Element() el: HTMLPdsCheckboxElement;\n\n /**\n * It determines whether or not the checkbox is checked.\n */\n @Prop({ mutable: true }) checked?: boolean = false;\n\n /**\n * A unique identifier used for the underlying component `id` attribute and the label `for` attribute.\n */\n @Prop() componentId!: string;\n\n /**\n * It determines whether or not the checkbox is disabled.\n */\n @Prop() disabled: boolean;\n\n /**\n * Displays message text describing an invalid state.\n */\n @Prop() errorMessage: string;\n\n /**\n * String used for helper message below checkbox.\n */\n @Prop() helperMessage: string;\n\n /**\n * If `true`, the checkbox will visually appear as indeterminate.\n * Only JavaScript can set the objects `indeterminate` property. See [MDN Web Docs](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/checkbox#indeterminate_state_checkboxes).\n */\n @Prop({ mutable: true }) indeterminate: boolean;\n\n /**\n * It determines whether or not the checkbox is invalid.\n */\n @Prop() invalid: boolean;\n\n /**\n * String used for label text next to checkbox.\n */\n @Prop() label: string;\n\n /**\n * Visually hides the label text for instances where only the checkbox should be displayed. Label remains accessible to assistive technology such as screen readers.\n */\n @Prop() hideLabel: boolean;\n\n /**\n * String used for checkbox `name` attribute.\n */\n @Prop() name: string;\n\n /**\n * It determines whether or not the checkbox is required.\n */\n @Prop() required: boolean;\n\n /**\n * The value of the checkbox that is submitted with a form.\n */\n @Prop() value: string;\n\n\n /**\n * Event emitted that contains the `value` and `checked`.\n */\n @Event() pdsCheckboxChange: EventEmitter<CheckboxChangeEventDetail>;\n\n @Event() pdsCheckboxInput: EventEmitter<CheckboxChangeEventDetail>;\n\n @Watch('checked')\n updateIndeterminate() {\n this.indeterminate = undefined\n }\n\n private handleCheckboxChange = (e: Event) => {\n if (this.disabled) {\n return;\n }\n\n const target = e.target as HTMLInputElement;\n this.checked = target.checked;\n\n this.updateFormValue();\n\n this.pdsCheckboxChange.emit({\n checked: target.checked,\n value: this.value\n });\n }\n\n private handleInput = () => {\n this.pdsCheckboxInput.emit({\n checked: this.checked,\n value: this.value\n });\n }\n\n private classNames() {\n const classNames = [];\n\n if (this.invalid) { classNames.push('is-invalid'); }\n if (this.indeterminate) { classNames.push('is-indeterminate'); }\n if (this.disabled) { classNames.push('is-disabled'); }\n\n return classNames.join(' ');\n }\n\n connectedCallback() {\n if (this.el.attachInternals) {\n this.internals = this.el.attachInternals();\n }\n\n // Expose type property on the element instance to match native form element behavior\n exposeTypeProperty(this.el, () => this._type);\n }\n\n componentDidLoad() {\n this.updateFormValue();\n }\n\n @Watch('checked')\n checkedChanged() {\n this.updateFormValue();\n }\n\n private updateFormValue() {\n if (typeof jest !== 'undefined' || typeof process !== 'undefined' && process.env?.NODE_ENV === 'test') {\n return;\n }\n\n if (this.internals && this.internals.setFormValue) {\n // For checkboxes, only send the value when checked, otherwise send null\n const formValue = this.checked ? (this.value || 'on') : null;\n this.internals.setFormValue(formValue);\n }\n\n if (this.internals && this.internals.setValidity) {\n this.internals.setValidity({});\n }\n }\n\n formStateRestoreCallback(state: string | FormData | null) {\n if (state instanceof FormData) {\n // For checkboxes, restore if the value exists in FormData\n const value = this.value || 'on';\n this.checked = state.get(this.name as string) === value;\n } else if (typeof state === 'string') {\n // Restore from string state\n this.checked = state === (this.value || 'on');\n }\n }\n\n componentWillLoad() {\n this.inheritedAttributes = {\n ...inheritAriaAttributes(this.el)\n }\n }\n\n render() {\n return (\n <Host class={this.classNames()}>\n <label htmlFor={this.componentId}>\n <input\n type=\"checkbox\"\n aria-describedby={assignDescription(this.componentId, this.invalid, this.errorMessage || this.helperMessage)}\n aria-invalid={this.invalid ? \"true\" : undefined}\n id={this.componentId}\n indeterminate={this.indeterminate}\n name={this.name}\n value={this.value}\n checked={this.checked}\n required={this.required}\n disabled={this.disabled}\n onChange={this.handleCheckboxChange}\n onInput={this.handleInput}\n {...this.inheritedAttributes}\n />\n <span class={this.hideLabel ? 'visually-hidden' : ''}>\n {this.label}\n </span>\n </label>\n {this.helperMessage &&\n <div\n class={'pds-checkbox__message'}\n id={messageId(this.componentId, 'helper')}\n >\n {this.helperMessage}\n </div>\n }\n {this.errorMessage &&\n <div\n class={`pds-checkbox__message pds-checkbox__message--error`}\n id={messageId(this.componentId, 'error')}\n aria-live=\"assertive\"\n >\n <pds-icon icon={danger} size=\"small\" />\n {this.errorMessage}\n </div>\n }\n </Host>\n );\n }\n}\n"],"mappings":"4TAAA,IAAMA,EAAW,qTCAjB,IAAMC,EAAiB,2wH,ICcVC,EAAWC,EAAA,0BANxB,SAAAC,EAAAC,GAAA,IAAAC,EAAAC,K,8GAOUA,KAAmBC,oBAAe,GAEzBD,KAAKE,MAAG,WAOAF,KAAOG,QAAa,MAuErCH,KAAAI,qBAAuB,SAACC,GAC9B,GAAIN,EAAKO,SAAU,CACjB,M,CAGF,IAAMC,EAASF,EAAEE,OACjBR,EAAKI,QAAUI,EAAOJ,QAEtBJ,EAAKS,kBAELT,EAAKU,kBAAkBC,KAAK,CAC1BP,QAASI,EAAOJ,QAChBQ,MAAOZ,EAAKY,OAEhB,EAEQX,KAAWY,YAAG,WACpBb,EAAKc,iBAAiBH,KAAK,CACzBP,QAASJ,EAAKI,QACdQ,MAAOZ,EAAKY,OAEhB,CA2GD,CApICd,EAAAiB,UAAAC,oBAAA,WACEf,KAAKgB,cAAgBC,S,EA0BfpB,EAAAiB,UAAAI,WAAA,WACN,IAAMA,EAAa,GAEnB,GAAIlB,KAAKmB,QAAS,CAAED,EAAWE,KAAK,a,CACpC,GAAIpB,KAAKgB,cAAe,CAAEE,EAAWE,KAAK,mB,CAC1C,GAAIpB,KAAKM,SAAU,CAAEY,EAAWE,KAAK,c,CAErC,OAAOF,EAAWG,KAAK,K,EAGzBxB,EAAAiB,UAAAQ,kBAAA,eAAAvB,EAAAC,KACE,GAAIA,KAAKuB,GAAGC,gBAAiB,CAC3BxB,KAAKyB,UAAYzB,KAAKuB,GAAGC,iB,CAI3BE,EAAmB1B,KAAKuB,IAAI,WAAM,OAAAxB,EAAKG,KAAL,G,EAGpCL,EAAAiB,UAAAa,iBAAA,WACE3B,KAAKQ,iB,EAIPX,EAAAiB,UAAAc,eAAA,WACE5B,KAAKQ,iB,EAGCX,EAAAiB,UAAAN,gBAAA,W,MACN,UAAWqB,OAAS,oBAAsBC,UAAY,eAAeC,EAAAD,QAAQE,OAAG,MAAAD,SAAA,SAAAA,EAAEE,YAAa,OAAQ,CACrG,M,CAGF,GAAIjC,KAAKyB,WAAazB,KAAKyB,UAAUS,aAAc,CAEjD,IAAMC,EAAYnC,KAAKG,QAAWH,KAAKW,OAAS,KAAQ,KACxDX,KAAKyB,UAAUS,aAAaC,E,CAG9B,GAAInC,KAAKyB,WAAazB,KAAKyB,UAAUW,YAAa,CAChDpC,KAAKyB,UAAUW,YAAY,G,GAI/BvC,EAAAiB,UAAAuB,yBAAA,SAAyBC,GACvB,GAAIA,aAAiBC,SAAU,CAE7B,IAAM5B,EAAQX,KAAKW,OAAS,KAC5BX,KAAKG,QAAUmC,EAAME,IAAIxC,KAAKyC,QAAoB9B,C,MAC7C,UAAW2B,IAAU,SAAU,CAEpCtC,KAAKG,QAAUmC,KAAWtC,KAAKW,OAAS,K,GAI5Cd,EAAAiB,UAAA4B,kBAAA,WACE1C,KAAKC,oBAAmB0C,OAAAC,OAAA,GACnBC,EAAsB7C,KAAKuB,I,EAIlC1B,EAAAiB,UAAAgC,OAAA,WACE,OACEC,EAACC,EAAI,CAAAC,IAAA,2CAACC,MAAOlD,KAAKkB,cAChB6B,EAAA,SAAAE,IAAA,2CAAOE,QAASnD,KAAKoD,aACnBL,EACE,QAAAJ,OAAAC,OAAA,CAAAK,IAAA,2CAAAI,KAAK,WAAU,mBACGC,EAAkBtD,KAAKoD,YAAapD,KAAKmB,QAASnB,KAAKuD,cAAgBvD,KAAKwD,eAAc,eAC9FxD,KAAKmB,QAAU,OAASF,UACtCwC,GAAIzD,KAAKoD,YACTpC,cAAehB,KAAKgB,cACpByB,KAAMzC,KAAKyC,KACX9B,MAAOX,KAAKW,MACZR,QAASH,KAAKG,QACduD,SAAU1D,KAAK0D,SACfpD,SAAUN,KAAKM,SACfqD,SAAU3D,KAAKI,qBACfwD,QAAS5D,KAAKY,aACVZ,KAAKC,sBAEX8C,EAAA,QAAAE,IAAA,2CAAMC,MAAOlD,KAAK6D,UAAY,kBAAoB,IAC/C7D,KAAK8D,QAGT9D,KAAKwD,eACJT,EAAA,OAAAE,IAAA,2CACEC,MAAO,wBACPO,GAAIM,EAAU/D,KAAKoD,YAAa,WAE/BpD,KAAKwD,eAGTxD,KAAKuD,cACJR,EAAA,OAAAE,IAAA,2CACEC,MAAO,qDACPO,GAAIM,EAAU/D,KAAKoD,YAAa,SAAQ,YAC9B,aAEVL,EAAA,YAAAE,IAAA,2CAAUe,KAAMC,EAAQC,KAAK,UAC5BlE,KAAKuD,c,oXA3MM,I","ignoreList":[]}
@@ -0,0 +1,2 @@
1
+ import{r as e,c as i,h as t,H as s,g as a}from"./p-Bf1dou5H.js";import{i as r,e as n,a as o,m as l}from"./p-DwjNklzi.js";import{d}from"./p-tJa4KYNO.js";import{i as c,a as h}from"./p-C0M1gTKv.js";import{i as p}from"./p-D4zJBIgl.js";const b=":host{display:inline-block}:host([aria-disabled=true]) label{color:var(--pine-color-text-label-disabled)}:host([aria-readonly=true]) label{color:var(--pine-color-text-label-readonly)}label{color:var(--pine-color-text-label);font:var(--pine-typography-body-medium);letter-spacing:var(--pine-letter-spacing)}";const f=":host{--pine-input-color-background-danger:var(--pine-color-red-050)}";const u=":host{display:inline-block;width:100%}:host([aria-readonly=true]) textarea{background-color:var(--pine-color-background-container-disabled);color:var(--pine-color-text-readonly)}.pds-textarea{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column}.pds-textarea__label-wrapper{-ms-flex-align:center;align-items:center;display:-ms-flexbox;display:flex;-ms-flex-pack:justify;justify-content:space-between}.pds-textarea__action{-ms-flex-align:center;align-items:center;display:-ms-flexbox;display:flex;gap:var(--pine-dimension-xs);-webkit-margin-start:var(--pine-dimension-xs);margin-inline-start:var(--pine-dimension-xs)}label{display:block;-webkit-margin-after:var(--pine-dimension-xs);margin-block-end:var(--pine-dimension-xs)}.pds-textarea__label-wrapper label{-webkit-margin-after:0;margin-block-end:0}.pds-textarea__helper-message{color:var(--pine-color-text-message);font:var(--pine-typography-body-sm-medium);-webkit-margin-before:var(--pine-dimension-2xs);margin-block-start:var(--pine-dimension-2xs)}.pds-textarea__error-message{-ms-flex-align:center;align-items:center;color:var(--pine-color-text-message-danger);display:-ms-flexbox;display:flex;font:var(--pine-typography-body-sm-medium);gap:var(--pine-dimension-2xs);-webkit-margin-before:var(--pine-dimension-2xs);margin-block-start:var(--pine-dimension-2xs)}.pds-textarea__field-wrapper{display:inline-block;position:relative;width:100%}.pds-textarea__field{background-color:var(--pine-color-background-container);border:var(--pine-border);border-radius:calc(var(--pine-dimension-xs) * 1.25);-webkit-box-sizing:border-box;box-sizing:border-box;font:var(--pine-typography-body);letter-spacing:var(--pine-letter-spacing);min-height:calc(var(--pine-dimension-xl) * 2);min-width:calc(var(--pine-dimension-xl) * 2);padding:var(--pine-dimension-xs) var(--pine-dimension-sm);resize:both;width:100%}:host([max-length]) .pds-textarea__field{padding-bottom:calc(var(--pine-dimension-xs) + var(--pine-dimension-md))}.pds-textarea__field:hover:not(:disabled,.is-invalid){border:var(--pine-border-hover)}.pds-textarea__field:disabled{background-color:var(--pine-color-background-container-disabled);color:var(--pine-color-text-disabled);cursor:not-allowed}.pds-textarea__field:focus-visible{outline:var(--pine-outline-focus);outline-offset:var(--pine-border-width)}.pds-textarea__field::-webkit-input-placeholder{color:var(--pine-color-text-placeholder)}.pds-textarea__field::-moz-placeholder{color:var(--pine-color-text-placeholder)}.pds-textarea__field:-ms-input-placeholder{color:var(--pine-color-text-placeholder)}.pds-textarea__field::-ms-input-placeholder{color:var(--pine-color-text-placeholder)}.pds-textarea__field::placeholder{color:var(--pine-color-text-placeholder)}.pds-textarea__field.is-invalid{background-color:var(--pine-input-color-background-danger);border-color:var(--pine-color-border-danger)}.pds-textarea__field.is-invalid:focus-visible{outline-color:var(--pine-color-focus-ring-danger)}.pds-textarea__character-counter{background:color-mix(in srgb, var(--pine-color-background-container) 80%, transparent);border-radius:calc(var(--pine-dimension-2xs) * 0.5);color:var(--pine-color-text-readonly);font:var(--pine-typography-body-sm-medium);padding:calc(var(--pine-dimension-2xs) * 0.5) var(--pine-dimension-2xs);pointer-events:none;position:absolute;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;white-space:nowrap;z-index:var(--pine-z-index)}:host([aria-disabled=true]) .pds-textarea__character-counter{background-color:var(--pine-color-background-container-disabled);color:var(--pine-color-text-disabled)}:host([aria-readonly=true]) .pds-textarea__character-counter{background-color:var(--pine-color-background-container-disabled);color:var(--pine-color-text-readonly)}.pds-textarea__field.is-invalid~.pds-textarea__character-counter{background-color:var(--pine-input-color-background-danger)}.visually-hidden{border:0;clip:rect(0 0 0 0);-webkit-clip-path:polygon(0 0, 0 0, 0 0);clip-path:polygon(0 0, 0 0, 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;white-space:nowrap;width:1px}";const m=class{constructor(t){e(this,t);this.pdsBlur=i(this,"pdsBlur");this.pdsFocus=i(this,"pdsFocus");this.pdsInput=i(this,"pdsInput");this.pdsTextareaChange=i(this,"pdsTextareaChange");this.inheritedAttributes={};this._type="textarea";this.disabled=false;this.invalid=false;this.name=this.componentId;this.readonly=false;this.required=false;this.value="";this.hasFocus=false;this.hasAction=false;this.onBlur=e=>{this.hasFocus=false;if(this.focusedValue!==this.value){this.emitValueChange(e)}this.pdsBlur.emit(e)};this.onFocus=e=>{this.hasFocus=true;this.focusedValue=this.value;this.pdsFocus.emit(e)};this.onInput=e=>{const i=e.target;if(i){if(this.maxLength&&i.value.length>this.maxLength){i.value=i.value.substring(0,this.maxLength)}this.value=i.value||""}this.emitInputChange(e);if(this.maxLength&&typeof ResizeObserver!=="undefined"){requestAnimationFrame((()=>{this.updateCharacterCounterPosition()}))}};this.onTextareaChange=e=>{this.emitValueChange(e)}}async setFocus(){if(this.nativeTextarea){this.nativeTextarea.focus()}}debounceChanged(){const{pdsInput:e,debounce:i,originalPdsInput:t}=this;this.pdsInput=i===undefined?t!==null&&t!==void 0?t:e:d(e,i)}valueChanged(){const e=this.nativeTextarea;const i=this.getValue();if(e&&e.value!==i){e.value=i}this.updateFormValue();if(this.maxLength&&typeof ResizeObserver!=="undefined"){this.updateCharacterCounterPosition()}}maxLengthChanged(){if(this.resizeObserver){this.resizeObserver.disconnect()}if(this.maxLength&&this.nativeTextarea){this.setupResizeObserver()}if(this.internals&&this.internals.setValidity&&this.nativeTextarea){const e=this.nativeTextarea.value.length>(this.maxLength||0);this.internals.setValidity({tooLong:e},e?"Value exceeds maxLength":"",this.nativeTextarea)}}emitInputChange(e){const{value:i}=this;this.pdsInput.emit({value:i,event:e})}emitValueChange(e){const i=e.target;r(i,this);const{value:t}=i;const s=t==null?t:t.toString();this.focusedValue=s;this.pdsTextareaChange.emit({value:s,event:e})}getValue(){return this.value||""}textareaClassNames(){const e=["pds-textarea__field"];if(this.invalid&&this.invalid===true){e.push("is-invalid")}return e.join(" ")}connectedCallback(){this.debounceChanged();if(this.el.attachInternals){this.internals=this.el.attachInternals()}}disconnectedCallback(){if(this.resizeObserver){this.resizeObserver.disconnect()}}componentWillLoad(){this.inheritedAttributes=Object.assign(Object.assign({},c(this.el)),h(this.el));this.hasAction=this.el.querySelector('[slot="action"]')!==null}componentDidLoad(){this.originalPdsInput=this.pdsInput;this.updateFormValue();this.setupResizeObserver();n(this.el,(()=>this._type))}setupResizeObserver(){if(!this.maxLength||!this.nativeTextarea)return;if(typeof ResizeObserver!=="undefined"){this.resizeObserver=new ResizeObserver((()=>{requestAnimationFrame((()=>{this.updateCharacterCounterPosition()}))}));this.resizeObserver.observe(this.nativeTextarea);requestAnimationFrame((()=>{this.updateCharacterCounterPosition()}))}}updateCharacterCounterPosition(){if(!this.characterCounter||!this.nativeTextarea)return;if(typeof ResizeObserver==="undefined")return;if(this.characterCounter.offsetWidth===0||this.characterCounter.offsetHeight===0){return}const e=this.nativeTextarea.offsetWidth;const i=this.nativeTextarea.offsetHeight;const t=this.characterCounter.offsetWidth;const s=this.characterCounter.offsetHeight;const a=e-t-8;const r=i-s-8;const n=Math.max(8,Math.min(a,e-t-8));const o=Math.max(8,Math.min(r,i-s-8));this.characterCounter.style.position="absolute";this.characterCounter.style.left=`${n}px`;this.characterCounter.style.top=`${o}px`;this.characterCounter.style.right="auto";this.characterCounter.style.bottom="auto"}renderCharacterCounter(){if(!this.maxLength){return null}const e=this.getValue().length;return t("div",{class:"pds-textarea__character-counter",ref:e=>this.characterCounter=e,role:"status","aria-live":"polite","aria-label":`${e} of ${this.maxLength} characters`},e," / ",this.maxLength)}renderAction(){const e=this.el.querySelector('[slot="action"]')!==null;if(e){return t("div",{class:"pds-textarea__action",part:"action"},t("slot",{name:"action"}))}return null}updateFormValue(){if(this.internals&&this.internals.setFormValue){const e=this.getValue();this.internals.setFormValue(e||null);if(this.nativeTextarea&&this.internals&&this.internals.setValidity){this.internals.setValidity(this.nativeTextarea.validity,this.nativeTextarea.validationMessage,this.nativeTextarea)}}}formResetCallback(){this.value="";this.updateFormValue()}formDisabledCallback(e){this.disabled=e}formStateRestoreCallback(e){if(typeof e==="string"){this.value=e}else if(e instanceof FormData&&this.name){const i=e.get(this.name);if(typeof i==="string"){this.value=i}}}render(){const e=this.getValue();return t(s,{key:"5ca3fed52ff7fd0b0497d01412bb7ca3746b2e7e","aria-disabled":this.disabled?"true":null,"aria-readonly":this.readonly?"true":null,"has-action":this.hasAction&&!this.hideLabel?"true":null},t("div",{key:"3761f27f234f9667ce8dffc77c5ede89159afaea",class:"pds-textarea"},this.label&&t("div",{key:"db533228166be7a303969703b2e92327e02e0b88",class:"pds-textarea__label-wrapper"},t("label",{key:"6e215f009e9297f5a1a415419f40064fd3168ad8",htmlFor:this.componentId},t("span",{key:"b48b3427bfdff3cef0ed18799cf64547b7e77e97",class:this.hideLabel?"visually-hidden":""},this.label)),!this.hideLabel&&this.renderAction()),t("div",{key:"23c4a2231dfd1b42e45d04f35e9dc2772d2df2fb",class:"pds-textarea__field-wrapper"},t("textarea",Object.assign({key:"7081f83eacc8dd5fdef8774b3887eb6109281aa6",ref:e=>this.nativeTextarea=e,"aria-describedby":o(this.componentId,this.invalid,this.helperMessage),"aria-invalid":this.invalid?"true":undefined,autocomplete:this.autocomplete,class:this.textareaClassNames(),disabled:this.disabled,id:this.componentId,maxlength:this.maxLength,name:this.name,placeholder:this.placeholder,readOnly:this.readonly,required:this.required,rows:this.rows,onBlur:this.onBlur,onChange:this.onTextareaChange,onFocus:this.onFocus,onInput:this.onInput},this.inheritedAttributes),e),this.renderCharacterCounter()),this.helperMessage&&t("p",{key:"237e251d35403fc4225123ac56476b656ab9ad48",class:"pds-textarea__helper-message",id:l(this.componentId,"helper")},this.helperMessage),this.invalid&&t("p",{key:"f4102e758212c00074bfbd144d311fa4fedf5b49","aria-live":"assertive",class:"pds-textarea__error-message",id:l(this.componentId,"error")},t("pds-icon",{key:"92535a264a990ff133a1e6dde709236b3157b2d0",icon:p,size:"small"}),this.errorMessage)))}static get formAssociated(){return true}get el(){return a(this)}static get watchers(){return{debounce:["debounceChanged"],value:["valueChanged"],maxLength:["maxLengthChanged"]}}};m.style=b+(f+u);export{m as pds_textarea};
2
+ //# sourceMappingURL=p-61a25ab2.entry.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"names":["labelCss","pdsInputTokensCss","pdsTextareaCss","PdsTextarea","constructor","hostRef","this","inheritedAttributes","_type","disabled","invalid","name","componentId","readonly","required","value","hasFocus","hasAction","onBlur","ev","focusedValue","emitValueChange","pdsBlur","emit","onFocus","pdsFocus","onInput","input","target","maxLength","length","substring","emitInputChange","ResizeObserver","requestAnimationFrame","updateCharacterCounterPosition","onTextareaChange","setFocus","nativeTextarea","focus","debounceChanged","pdsInput","debounce","originalPdsInput","undefined","debounceEvent","valueChanged","getValue","updateFormValue","maxLengthChanged","resizeObserver","disconnect","setupResizeObserver","internals","setValidity","isTooLong","tooLong","event","textarea","isRequired","newValue","toString","pdsTextareaChange","textareaClassNames","classNames","push","join","connectedCallback","el","attachInternals","disconnectedCallback","componentWillLoad","Object","assign","inheritAriaAttributes","inheritAttributes","querySelector","componentDidLoad","exposeTypeProperty","observe","characterCounter","offsetWidth","offsetHeight","textareaWidth","textareaHeight","counterWidth","counterHeight","rightPosition","bottomPosition","finalLeft","Math","max","min","finalTop","style","position","left","top","right","bottom","renderCharacterCounter","currentLength","h","class","ref","role","renderAction","part","setFormValue","validity","validationMessage","formResetCallback","formDisabledCallback","formStateRestoreCallback","state","FormData","get","render","Host","key","hideLabel","label","htmlFor","assignDescription","helperMessage","autocomplete","id","maxlength","placeholder","readOnly","rows","onChange","messageId","icon","danger","size","errorMessage"],"sources":["src/global/styles/utils/label.scss?tag=pds-textarea&encapsulation=shadow","src/components/pds-input/pds-input.tokens.scss?tag=pds-textarea&encapsulation=shadow","src/components/pds-textarea/pds-textarea.scss?tag=pds-textarea&encapsulation=shadow","src/components/pds-textarea/pds-textarea.tsx"],"sourcesContent":[":host {\n display: inline-block;\n}\n\n:host([aria-disabled=\"true\"]) label {\n color: var(--pine-color-text-label-disabled);\n}\n\n:host([aria-readonly=\"true\"]) {\n label {\n color: var(--pine-color-text-label-readonly);\n }\n}\n\nlabel {\n color: var(--pine-color-text-label);\n font: var(--pine-typography-body-medium);\n letter-spacing: var(--pine-letter-spacing);\n}\n","@use '~@kajabi-ui/styles/dist/pine/components/pds-input/pds-input.tokens'\n",":host {\n display: inline-block;\n width: 100%;\n}\n\n:host([aria-readonly=\"true\"]) {\n textarea {\n background-color: var(--pine-color-background-container-disabled);\n color: var(--pine-color-text-readonly);\n }\n}\n\n.pds-textarea {\n display: flex;\n flex-direction: column;\n}\n\n.pds-textarea__label-wrapper {\n align-items: center;\n display: flex;\n justify-content: space-between;\n}\n\n.pds-textarea__action {\n align-items: center;\n display: flex;\n gap: var(--pine-dimension-xs);\n margin-inline-start: var(--pine-dimension-xs);\n}\n\nlabel {\n display: block;\n margin-block-end: var(--pine-dimension-xs);\n}\n\n// When label is inside wrapper, remove its margin\n.pds-textarea__label-wrapper label {\n margin-block-end: 0;\n}\n\n.pds-textarea__helper-message {\n color: var(--pine-color-text-message);\n font: var(--pine-typography-body-sm-medium);\n margin-block-start: var(--pine-dimension-2xs);\n}\n\n.pds-textarea__error-message {\n align-items: center;\n color: var(--pine-color-text-message-danger);\n display: flex;\n font: var(--pine-typography-body-sm-medium);\n gap: var(--pine-dimension-2xs);\n margin-block-start: var(--pine-dimension-2xs);\n}\n\n.pds-textarea__field-wrapper {\n display: inline-block;\n position: relative;\n width: 100%;\n}\n\n.pds-textarea__field {\n background-color: var(--pine-color-background-container);\n border: var(--pine-border);\n border-radius: calc(var(--pine-dimension-xs) * 1.25);\n box-sizing: border-box;\n font: var(--pine-typography-body);\n letter-spacing: var(--pine-letter-spacing);\n min-height: calc(var(--pine-dimension-xl) * 2);\n min-width: calc(var(--pine-dimension-xl) * 2);\n padding: var(--pine-dimension-xs) var(--pine-dimension-sm);\n resize: both;\n width: 100%;\n\n // Add bottom padding when character counter is present\n :host([max-length]) & {\n padding-bottom: calc(var(--pine-dimension-xs) + var(--pine-dimension-md));\n }\n\n &:hover:not(:disabled, .is-invalid) {\n border: var(--pine-border-hover);\n }\n\n &:disabled {\n background-color: var(--pine-color-background-container-disabled);\n color: var(--pine-color-text-disabled);\n cursor: not-allowed;\n }\n\n &:focus-visible {\n outline: var(--pine-outline-focus);\n outline-offset: var(--pine-border-width);\n }\n\n &::placeholder {\n color: var(--pine-color-text-placeholder);\n }\n\n &.is-invalid {\n background-color: var(--pine-input-color-background-danger);\n border-color: var(--pine-color-border-danger);\n\n &:focus-visible {\n outline-color: var(--pine-color-focus-ring-danger);\n }\n }\n}\n\n.pds-textarea__character-counter {\n background: color-mix(in srgb, var(--pine-color-background-container) 80%, transparent);\n border-radius: calc(var(--pine-dimension-2xs) * 0.5);\n color: var(--pine-color-text-readonly);\n font: var(--pine-typography-body-sm-medium);\n padding: calc(var(--pine-dimension-2xs) * 0.5) var(--pine-dimension-2xs);\n pointer-events: none;\n position: absolute;\n user-select: none;\n white-space: nowrap;\n z-index: var(--pine-z-index);\n\n // Match textarea disabled state\n :host([aria-disabled=\"true\"]) & {\n background-color: var(--pine-color-background-container-disabled);\n color: var(--pine-color-text-disabled);\n }\n\n // Match textarea readonly state\n :host([aria-readonly=\"true\"]) & {\n background-color: var(--pine-color-background-container-disabled);\n color: var(--pine-color-text-readonly);\n }\n\n // Match textarea invalid state - target when field has is-invalid class\n .pds-textarea__field.is-invalid ~ & {\n background-color: var(--pine-input-color-background-danger);\n }\n}\n\n.visually-hidden {\n border: 0;\n clip: rect(0 0 0 0);\n clip-path: polygon(0 0, 0 0, 0 0);\n height: 1px;\n margin: -1px;\n overflow: hidden;\n padding: 0;\n position: absolute;\n white-space: nowrap;\n width: 1px;\n}\n","import { Component, Element, Event, EventEmitter, Host, h, Method, Prop, State, Watch } from '@stencil/core';\nimport { assignDescription, isRequired, messageId, exposeTypeProperty } from '../../utils/form';\nimport { TextareaChangeEventDetail, TextareaInputEventDetail } from './textarea-interface';\nimport { debounceEvent } from '@utils/utils';\nimport type { Attributes } from '@utils/attributes';\nimport { inheritAttributes, inheritAriaAttributes } from '@utils/attributes';\nimport { danger } from '@pine-ds/icons/icons';\n\n/**\n * @slot action - Content to be displayed in the label area, typically for help icons or links\n */\n@Component({\n tag: 'pds-textarea',\n styleUrls: [\n '../../global/styles/utils/label.scss',\n '../pds-input/pds-input.tokens.scss',\n 'pds-textarea.scss'\n ],\n shadow: true,\n formAssociated: true,\n})\nexport class PdsTextarea {\n\n private nativeTextarea?: HTMLTextAreaElement\n private focusedValue?: string | null;\n private inheritedAttributes: Attributes = {};\n private originalPdsInput?: EventEmitter<TextareaInputEventDetail>;\n private internals?: ElementInternals;\n private resizeObserver?: ResizeObserver;\n private characterCounter?: HTMLElement;\n private readonly _type = 'textarea' as const;\n\n @Element() el: HTMLPdsTextareaElement;\n\n /**\n * Emitted when the input loses focus.\n */\n @Event() pdsBlur!: EventEmitter<FocusEvent>;\n\n /**\n * Emitted when the input has focus.\n */\n @Event() pdsFocus!: EventEmitter<FocusEvent>;\n\n /**\n * Emitted when a keyboard input occurs.\n *\n * For elements that accept text input (`type=text`, `type=tel`, etc.), the interface\n * is [`InputEvent`](https://developer.mozilla.org/en-US/docs/Web/API/InputEvent); for others,\n * the interface is [`Event`](https://developer.mozilla.org/en-US/docs/Web/API/Event). If\n * the input is cleared on edit, the type is `null`.\n */\n @Event() pdsInput: EventEmitter<TextareaInputEventDetail>;\n\n /**\n * Event emitted whenever the value of the textarea changes.\n *\n * This event will not emit when programmatically setting the `value` property.\n */\n @Event() pdsTextareaChange: EventEmitter<TextareaChangeEventDetail>;\n\n /**\n * Sets focus on the native `textarea` in the `pds-textarea`. Use this method instead of the global\n * `textarea.focus()`.\n */\n @Method()\n async setFocus() {\n if (this.nativeTextarea) {\n this.nativeTextarea.focus();\n }\n }\n\n /**\n * Specifies if and how the browser provides `autocomplete` assistance for the field.\n */\n @Prop() autocomplete: string;\n\n /**\n * A unique identifier used for the underlying component `id` attribute.\n */\n @Prop() componentId!: string;\n\n /**\n * Determines whether or not the textarea is disabled.\n * @defaultValue false\n */\n @Prop() disabled = false;\n\n /**\n * The amount of time, in milliseconds, to wait to trigger the event after each keystroke.\n */\n @Prop() debounce?: number;\n\n /**\n * Displays an error message below the textarea field.\n */\n @Prop() errorMessage?: string;\n\n /**\n * Displays a message or hint below the textarea field.\n */\n @Prop() helperMessage?: string;\n\n /**\n * Determines whether or not the textarea is invalid or throws an error.\n * @defaultValue false\n */\n @Prop({mutable: true}) invalid = false; // eslint-disable-line @stencil-community/strict-mutable\n\n /**\n * Text to be displayed as the textarea label.\n */\n @Prop() label?: string;\n\n /**\n * Visually hides the label text for instances where only the textarea should be displayed. Label remains accessible to assistive technology such as screen readers.\n * Note: When true, the action slot is also hidden to maintain a minimal UI.\n */\n @Prop() hideLabel: boolean;\n\n /**\n * Specifies the name. Submitted with the form name/value pair. This value will mirror the componentId.\n */\n @Prop() name: string = this.componentId;\n\n /**\n * Specifies a short hint that describes the expected value of the textarea.\n */\n @Prop() placeholder?: string;\n\n /**\n * Determines whether or not the textarea is readonly.\n * @defaultValue false\n */\n @Prop() readonly = false;\n\n /**\n * Determines whether or not the textarea is required.\n * @defaultValue false\n */\n @Prop() required = false;\n\n /**\n * Sets number of rows of text visible without needing to scroll in the textarea.\n */\n @Prop() rows?: number;\n\n /**\n * Specifies the maximum number of characters allowed in the textarea. When set, displays a character counter.\n */\n @Prop({ reflect: true }) maxLength?: number;\n\n /**\n * The value of the textarea.\n */\n @Prop({mutable: true}) value?: string | null = '';\n\n @State() hasFocus = false;\n\n\n /**\n * If true, the textarea has action content in the label area\n */\n @State() hasAction = false;\n\n @Watch('debounce')\n protected debounceChanged() {\n const { pdsInput, debounce, originalPdsInput } = this;\n\n this.pdsInput = debounce === undefined ? originalPdsInput ?? pdsInput : debounceEvent(pdsInput, debounce);\n }\n\n /**\n * Update the native input element when the value changes\n */\n @Watch('value')\n protected valueChanged() {\n const nativeTextarea = this.nativeTextarea;\n const value = this.getValue();\n\n if (nativeTextarea && nativeTextarea.value !== value) {\n nativeTextarea.value = value;\n }\n\n // Update form value for Form Associated Custom Elements API\n this.updateFormValue();\n\n // Update character counter position in case content changes affect sizing\n if (this.maxLength && typeof ResizeObserver !== 'undefined') {\n this.updateCharacterCounterPosition();\n }\n }\n\n @Watch('maxLength')\n protected maxLengthChanged() {\n // Setup or teardown ResizeObserver based on maxLength\n if (this.resizeObserver) {\n this.resizeObserver.disconnect();\n }\n\n if (this.maxLength && this.nativeTextarea) {\n this.setupResizeObserver();\n }\n\n // Update ElementInternals validity when maxLength changes\n if (this.internals && this.internals.setValidity && this.nativeTextarea) {\n const isTooLong = this.nativeTextarea.value.length > (this.maxLength || 0);\n this.internals.setValidity(\n { tooLong: isTooLong },\n isTooLong ? 'Value exceeds maxLength' : '',\n this.nativeTextarea\n );\n }\n }\n\n /**\n * Emits an `pdsInput` event.\n */\n private emitInputChange(event?: Event) {\n const { value } = this;\n this.pdsInput.emit({ value, event });\n }\n\n /**\n * Emits an `pdsTextareaChange` event.\n */\n private emitValueChange(event?: Event) {\n const textarea = event.target as HTMLTextAreaElement;\n isRequired(textarea, this);\n\n const { value } = textarea;\n\n // Checks for both null and undefined values\n const newValue = value == null ? value : value.toString();\n this.focusedValue = newValue;\n this.pdsTextareaChange.emit({ value: newValue, event });\n }\n\n private getValue(): string {\n return this.value || '';\n }\n\n private onBlur = (ev: FocusEvent) => {\n this.hasFocus = false;\n\n if (this.focusedValue !== this.value) {\n this.emitValueChange(ev);\n }\n\n this.pdsBlur.emit(ev);\n };\n\n private onFocus = (ev: FocusEvent) => {\n this.hasFocus = true;\n this.focusedValue = this.value;\n\n this.pdsFocus.emit(ev);\n };\n\n private onInput = (ev: Event) => {\n const input = ev.target as HTMLTextAreaElement | null;\n if (input) {\n // Handle maxLength validation\n if (this.maxLength && input.value.length > this.maxLength) {\n // Prevent input beyond maxLength\n input.value = input.value.substring(0, this.maxLength);\n }\n this.value = input.value || '';\n }\n this.emitInputChange(ev);\n\n // Update counter position when content changes\n if (this.maxLength && typeof ResizeObserver !== 'undefined') {\n // Use requestAnimationFrame to ensure DOM is updated\n requestAnimationFrame(() => {\n this.updateCharacterCounterPosition();\n });\n }\n };\n\n private onTextareaChange = (ev: Event) => {\n this.emitValueChange(ev);\n };\n\n private textareaClassNames() {\n const classNames = ['pds-textarea__field'];\n\n if (this.invalid && this.invalid === true) {\n classNames.push('is-invalid');\n }\n\n return classNames.join(' ');\n }\n\n connectedCallback() {\n this.debounceChanged();\n // Initialize ElementInternals for form association\n if (this.el.attachInternals) {\n this.internals = this.el.attachInternals();\n }\n }\n\n disconnectedCallback() {\n // Clean up ResizeObserver\n if (this.resizeObserver) {\n this.resizeObserver.disconnect();\n }\n }\n\n componentWillLoad() {\n this.inheritedAttributes = {\n ...inheritAriaAttributes(this.el),\n ...inheritAttributes(this.el),\n };\n this.hasAction = this.el.querySelector('[slot=\"action\"]') !== null;\n }\n\n componentDidLoad() {\n this.originalPdsInput = this.pdsInput;\n // Set initial form value\n this.updateFormValue();\n\n // Setup ResizeObserver for character counter positioning\n this.setupResizeObserver();\n\n // Expose type property on the element instance to match native form element behavior\n exposeTypeProperty(this.el, () => this._type);\n }\n\n /**\n * Sets up ResizeObserver to track textarea resize for character counter positioning\n */\n private setupResizeObserver() {\n if (!this.maxLength || !this.nativeTextarea) return;\n\n // ResizeObserver may not be available in test environments\n if (typeof ResizeObserver !== 'undefined') {\n this.resizeObserver = new ResizeObserver(() => {\n // Use requestAnimationFrame to ensure DOM updates are complete\n requestAnimationFrame(() => {\n this.updateCharacterCounterPosition();\n });\n });\n\n this.resizeObserver.observe(this.nativeTextarea);\n\n // Initial positioning with a small delay to ensure counter is rendered\n requestAnimationFrame(() => {\n this.updateCharacterCounterPosition();\n });\n }\n }\n\n /**\n * Updates character counter position to stay within textarea boundaries during resize\n */\n private updateCharacterCounterPosition() {\n if (!this.characterCounter || !this.nativeTextarea) return;\n\n // Skip positioning in test environments where ResizeObserver isn't available\n if (typeof ResizeObserver === 'undefined') return;\n\n // Ensure the character counter has been rendered and has dimensions\n if (this.characterCounter.offsetWidth === 0 || this.characterCounter.offsetHeight === 0) {\n // Counter not ready or component hidden - return and let resize/input observers handle positioning later\n return;\n }\n\n // Position based on textarea's actual dimensions (which change during manual resize)\n const textareaWidth = this.nativeTextarea.offsetWidth;\n const textareaHeight = this.nativeTextarea.offsetHeight;\n const counterWidth = this.characterCounter.offsetWidth;\n const counterHeight = this.characterCounter.offsetHeight;\n\n // Calculate position within textarea boundaries with padding from edges\n const rightPosition = textareaWidth - counterWidth - 8;\n const bottomPosition = textareaHeight - counterHeight - 8;\n\n // Ensure counter stays within textarea boundaries even when resized very small\n const finalLeft = Math.max(8, Math.min(rightPosition, textareaWidth - counterWidth - 8));\n const finalTop = Math.max(8, Math.min(bottomPosition, textareaHeight - counterHeight - 8));\n\n // Apply absolute positioning within the field wrapper\n this.characterCounter.style.position = 'absolute';\n this.characterCounter.style.left = `${finalLeft}px`;\n this.characterCounter.style.top = `${finalTop}px`;\n this.characterCounter.style.right = 'auto';\n this.characterCounter.style.bottom = 'auto';\n }\n\n /**\n * Renders the character counter when maxLength is set\n */\n private renderCharacterCounter() {\n if (!this.maxLength) {\n return null;\n }\n\n const currentLength = this.getValue().length;\n return (\n <div\n class=\"pds-textarea__character-counter\"\n ref={(el) => this.characterCounter = el}\n role=\"status\"\n aria-live=\"polite\"\n aria-label={`${currentLength} of ${this.maxLength} characters`}\n >\n {currentLength} / {this.maxLength}\n </div>\n );\n }\n\n private renderAction() {\n const hasAction = this.el.querySelector('[slot=\"action\"]') !== null;\n if (hasAction) {\n return (\n <div class=\"pds-textarea__action\" part=\"action\">\n <slot name=\"action\"></slot>\n </div>\n );\n }\n return null;\n }\n\n /**\n * Updates the form value using ElementInternals API\n */\n private updateFormValue() {\n if (this.internals && this.internals.setFormValue) {\n const value = this.getValue();\n this.internals.setFormValue(value || null);\n\n // Set validity based on native textarea validation\n if (this.nativeTextarea && this.internals && this.internals.setValidity) {\n this.internals.setValidity(\n this.nativeTextarea.validity,\n this.nativeTextarea.validationMessage,\n this.nativeTextarea\n );\n }\n }\n }\n\n\n /**\n * Form Associated Custom Elements API: Called when the form is reset\n */\n formResetCallback() {\n this.value = '';\n this.updateFormValue();\n }\n\n /**\n * Form Associated Custom Elements API: Called when the form is disabled\n */\n formDisabledCallback(disabled: boolean) {\n this.disabled = disabled;\n }\n\n /**\n * Form Associated Custom Elements API: Called to restore form state\n */\n formStateRestoreCallback(state: string | FormData | null) {\n if (typeof state === 'string') {\n this.value = state;\n } else if (state instanceof FormData && this.name) {\n // Extract value from FormData using the textarea's name\n const value = state.get(this.name);\n if (typeof value === 'string') {\n this.value = value;\n }\n }\n }\n\n render() {\n const value = this.getValue();\n\n return (\n <Host\n aria-disabled={this.disabled ? 'true' : null}\n aria-readonly={this.readonly ? 'true' : null}\n has-action={this.hasAction && !this.hideLabel ? 'true' : null}\n >\n <div class=\"pds-textarea\">\n {this.label &&\n <div class=\"pds-textarea__label-wrapper\">\n <label htmlFor={this.componentId}>\n <span class={this.hideLabel ? 'visually-hidden' : ''}>\n {this.label}\n </span>\n </label>\n {!this.hideLabel && this.renderAction()}\n </div>\n }\n <div class=\"pds-textarea__field-wrapper\">\n <textarea\n ref={(el) => this.nativeTextarea = el }\n aria-describedby={assignDescription(this.componentId, this.invalid, this.helperMessage)}\n aria-invalid={this.invalid ? \"true\" : undefined}\n autocomplete={this.autocomplete}\n class={this.textareaClassNames()}\n disabled={this.disabled}\n id={this.componentId}\n maxlength={this.maxLength}\n name={this.name}\n placeholder={this.placeholder}\n readOnly={this.readonly}\n required={this.required}\n rows={this.rows}\n onBlur={this.onBlur}\n onChange={this.onTextareaChange}\n onFocus={this.onFocus}\n onInput={this.onInput}\n {...this.inheritedAttributes}\n >\n {value}\n </textarea>\n {this.renderCharacterCounter()}\n </div>\n {this.helperMessage &&\n <p\n class=\"pds-textarea__helper-message\"\n id={messageId(this.componentId, 'helper')}\n >\n {this.helperMessage}\n </p>\n }\n {this.invalid &&\n <p\n aria-live=\"assertive\"\n class=\"pds-textarea__error-message\"\n id={messageId(this.componentId, 'error')}\n >\n <pds-icon icon={danger} size=\"small\" />\n {this.errorMessage}\n </p>\n }\n </div>\n </Host>\n );\n }\n}\n"],"mappings":"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","ignoreList":[]}