@redvars/peacock 3.1.2 → 3.1.3

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 (346) hide show
  1. package/.rollup.cache/E/git/redvars/peacock/components/dist/src/LoaderUtils.d.ts +0 -1
  2. package/.rollup.cache/E/git/redvars/peacock/components/dist/src/LoaderUtils.js +0 -1
  3. package/.rollup.cache/E/git/redvars/peacock/components/dist/src/LoaderUtils.js.map +1 -1
  4. package/.rollup.cache/E/git/redvars/peacock/components/dist/src/avatar/avatar.d.ts +1 -1
  5. package/.rollup.cache/E/git/redvars/peacock/components/dist/src/avatar/avatar.js +1 -1
  6. package/.rollup.cache/E/git/redvars/peacock/components/dist/src/avatar/avatar.js.map +1 -1
  7. package/.rollup.cache/E/git/redvars/peacock/components/dist/src/badge/badge.d.ts +1 -1
  8. package/.rollup.cache/E/git/redvars/peacock/components/dist/src/badge/badge.js +1 -1
  9. package/.rollup.cache/E/git/redvars/peacock/components/dist/src/badge/badge.js.map +1 -1
  10. package/.rollup.cache/E/git/redvars/peacock/components/dist/src/button/button.d.ts +99 -0
  11. package/.rollup.cache/E/git/redvars/peacock/components/dist/src/button/button.js +292 -0
  12. package/.rollup.cache/E/git/redvars/peacock/components/dist/src/button/button.js.map +1 -0
  13. package/.rollup.cache/E/git/redvars/peacock/components/dist/src/button/index.d.ts +1 -0
  14. package/.rollup.cache/E/git/redvars/peacock/components/dist/src/button/index.js +2 -0
  15. package/.rollup.cache/E/git/redvars/peacock/components/dist/src/button/index.js.map +1 -0
  16. package/.rollup.cache/E/git/redvars/peacock/components/dist/src/clock/ClockController.d.ts +10 -0
  17. package/.rollup.cache/E/git/redvars/peacock/components/dist/src/clock/ClockController.js +22 -0
  18. package/.rollup.cache/E/git/redvars/peacock/components/dist/src/clock/ClockController.js.map +1 -0
  19. package/.rollup.cache/E/git/redvars/peacock/components/dist/src/clock/clock.d.ts +4 -6
  20. package/.rollup.cache/E/git/redvars/peacock/components/dist/src/clock/clock.js +8 -25
  21. package/.rollup.cache/E/git/redvars/peacock/components/dist/src/clock/clock.js.map +1 -1
  22. package/.rollup.cache/E/git/redvars/peacock/components/dist/src/code-highlighter/code-highlighter.d.ts +26 -0
  23. package/.rollup.cache/E/git/redvars/peacock/components/dist/src/code-highlighter/code-highlighter.js +60 -0
  24. package/.rollup.cache/E/git/redvars/peacock/components/dist/src/code-highlighter/code-highlighter.js.map +1 -0
  25. package/.rollup.cache/E/git/redvars/peacock/components/dist/src/code-highlighter/index.d.ts +1 -0
  26. package/.rollup.cache/E/git/redvars/peacock/components/dist/src/code-highlighter/index.js +2 -0
  27. package/.rollup.cache/E/git/redvars/peacock/components/dist/src/code-highlighter/index.js.map +1 -0
  28. package/.rollup.cache/E/git/redvars/peacock/components/dist/src/code-highlighter/local.d.ts +6 -0
  29. package/.rollup.cache/E/git/redvars/peacock/components/dist/src/code-highlighter/local.js +7 -0
  30. package/.rollup.cache/E/git/redvars/peacock/components/dist/src/code-highlighter/local.js.map +1 -0
  31. package/.rollup.cache/E/git/redvars/peacock/components/dist/src/divider/divider.d.ts +1 -2
  32. package/.rollup.cache/E/git/redvars/peacock/components/dist/src/divider/divider.js +1 -8
  33. package/.rollup.cache/E/git/redvars/peacock/components/dist/src/divider/divider.js.map +1 -1
  34. package/.rollup.cache/E/git/redvars/peacock/components/dist/src/elevation/elevation.css.d.ts +1 -0
  35. package/.rollup.cache/E/git/redvars/peacock/components/dist/src/elevation/elevation.css.js +47 -0
  36. package/.rollup.cache/E/git/redvars/peacock/components/dist/src/elevation/elevation.css.js.map +1 -0
  37. package/.rollup.cache/E/git/redvars/peacock/components/dist/src/elevation/elevation.d.ts +27 -0
  38. package/.rollup.cache/E/git/redvars/peacock/components/dist/src/elevation/elevation.js +31 -0
  39. package/.rollup.cache/E/git/redvars/peacock/components/dist/src/elevation/elevation.js.map +1 -0
  40. package/.rollup.cache/E/git/redvars/peacock/components/dist/src/elevation/index.d.ts +1 -0
  41. package/.rollup.cache/E/git/redvars/peacock/components/dist/src/elevation/index.js +2 -0
  42. package/.rollup.cache/E/git/redvars/peacock/components/dist/src/elevation/index.js.map +1 -0
  43. package/.rollup.cache/E/git/redvars/peacock/components/dist/src/focus-ring/FocusAttachableController.d.ts +9 -0
  44. package/.rollup.cache/E/git/redvars/peacock/components/dist/src/focus-ring/FocusAttachableController.js +25 -0
  45. package/.rollup.cache/E/git/redvars/peacock/components/dist/src/focus-ring/FocusAttachableController.js.map +1 -0
  46. package/.rollup.cache/E/git/redvars/peacock/components/dist/src/focus-ring/focus-ring.d.ts +35 -0
  47. package/.rollup.cache/E/git/redvars/peacock/components/dist/src/focus-ring/focus-ring.js +81 -0
  48. package/.rollup.cache/E/git/redvars/peacock/components/dist/src/focus-ring/focus-ring.js.map +1 -0
  49. package/.rollup.cache/E/git/redvars/peacock/components/dist/src/focus-ring/index.d.ts +1 -0
  50. package/.rollup.cache/E/git/redvars/peacock/components/dist/src/focus-ring/index.js +2 -0
  51. package/.rollup.cache/E/git/redvars/peacock/components/dist/src/focus-ring/index.js.map +1 -0
  52. package/.rollup.cache/E/git/redvars/peacock/components/dist/src/icon/icon.d.ts +3 -2
  53. package/.rollup.cache/E/git/redvars/peacock/components/dist/src/icon/icon.js +4 -4
  54. package/.rollup.cache/E/git/redvars/peacock/components/dist/src/icon/icon.js.map +1 -1
  55. package/.rollup.cache/E/git/redvars/peacock/components/dist/src/index.d.ts +4 -0
  56. package/.rollup.cache/E/git/redvars/peacock/components/dist/src/index.js +4 -0
  57. package/.rollup.cache/E/git/redvars/peacock/components/dist/src/index.js.map +1 -1
  58. package/.rollup.cache/E/git/redvars/peacock/components/dist/src/peacock-loader.js +24 -18
  59. package/.rollup.cache/E/git/redvars/peacock/components/dist/src/peacock-loader.js.map +1 -1
  60. package/.rollup.cache/E/git/redvars/peacock/components/dist/src/ripple/index.d.ts +1 -0
  61. package/.rollup.cache/E/git/redvars/peacock/components/dist/src/ripple/index.js +2 -0
  62. package/.rollup.cache/E/git/redvars/peacock/components/dist/src/ripple/index.js.map +1 -0
  63. package/.rollup.cache/E/git/redvars/peacock/components/dist/src/ripple/ripple.d.ts +9 -0
  64. package/.rollup.cache/E/git/redvars/peacock/components/dist/src/ripple/ripple.js +125 -0
  65. package/.rollup.cache/E/git/redvars/peacock/components/dist/src/ripple/ripple.js.map +1 -0
  66. package/.rollup.cache/E/git/redvars/peacock/components/dist/src/utils.d.ts +4 -0
  67. package/.rollup.cache/E/git/redvars/peacock/components/dist/src/utils.js +22 -1
  68. package/.rollup.cache/E/git/redvars/peacock/components/dist/src/utils.js.map +1 -1
  69. package/.rollup.cache/E/git/redvars/peacock/components/dist/tsconfig.tsbuildinfo +1 -1
  70. package/bin/typedoc-gen.mjs +3 -4
  71. package/demo/index.html +45 -41
  72. package/dist/LoaderUtils.d.ts +23 -0
  73. package/dist/LoaderUtils.d.ts.map +1 -0
  74. package/dist/assets/styles/tokens.css +21 -53
  75. package/dist/avatar/avatar.d.ts +28 -0
  76. package/dist/avatar/avatar.d.ts.map +1 -0
  77. package/dist/avatar/index.d.ts +2 -0
  78. package/dist/avatar/index.d.ts.map +1 -0
  79. package/dist/avatar/p-avatar.d.ts +4 -0
  80. package/dist/avatar/p-avatar.d.ts.map +1 -0
  81. package/dist/avatar.js +42 -40
  82. package/dist/avatar.js.map +1 -1
  83. package/dist/badge/badge.d.ts +24 -0
  84. package/dist/badge/badge.d.ts.map +1 -0
  85. package/dist/badge/index.d.ts +2 -0
  86. package/dist/badge/index.d.ts.map +1 -0
  87. package/dist/badge/p-badge.d.ts +4 -0
  88. package/dist/badge/p-badge.d.ts.map +1 -0
  89. package/dist/badge.js +37 -36
  90. package/dist/badge.js.map +1 -1
  91. package/dist/button/button.d.ts +103 -0
  92. package/dist/button/button.d.ts.map +1 -0
  93. package/dist/button/index.d.ts +2 -0
  94. package/dist/button/index.d.ts.map +1 -0
  95. package/dist/button.js +710 -0
  96. package/dist/button.js.map +1 -0
  97. package/dist/class-map-BzIzngvN.js +89 -0
  98. package/dist/class-map-BzIzngvN.js.map +1 -0
  99. package/dist/class-map-CBk4-iMN.js +11 -0
  100. package/dist/class-map-CBk4-iMN.js.map +1 -0
  101. package/dist/class-map-Cavm-B1S.js +11 -0
  102. package/dist/class-map-Cavm-B1S.js.map +1 -0
  103. package/dist/class-map-DL5vM0J2.js +11 -0
  104. package/dist/class-map-DL5vM0J2.js.map +1 -0
  105. package/dist/class-map-IbP5VjmB.js +11 -0
  106. package/dist/class-map-IbP5VjmB.js.map +1 -0
  107. package/dist/clock/ClockController.d.ts +11 -0
  108. package/dist/clock/ClockController.d.ts.map +1 -0
  109. package/dist/clock/clock.d.ts +26 -0
  110. package/dist/clock/clock.d.ts.map +1 -0
  111. package/dist/clock/index.d.ts +2 -0
  112. package/dist/clock/index.d.ts.map +1 -0
  113. package/dist/clock.js +42 -35
  114. package/dist/clock.js.map +1 -1
  115. package/dist/code-highlighter/code-highlighter.d.ts +27 -0
  116. package/dist/code-highlighter/code-highlighter.d.ts.map +1 -0
  117. package/dist/code-highlighter/index.d.ts +2 -0
  118. package/dist/code-highlighter/index.d.ts.map +1 -0
  119. package/dist/code-highlighter/local.d.ts +7 -0
  120. package/dist/code-highlighter/local.d.ts.map +1 -0
  121. package/dist/code-highlighter.js +66 -0
  122. package/dist/code-highlighter.js.map +1 -0
  123. package/dist/custom-elements-jsdocs.json +589 -34
  124. package/dist/directive-CkFJvUQK.js +45 -0
  125. package/dist/directive-CkFJvUQK.js.map +1 -0
  126. package/dist/divider/divider.d.ts +28 -0
  127. package/dist/divider/divider.d.ts.map +1 -0
  128. package/dist/divider/index.d.ts +2 -0
  129. package/dist/divider/index.d.ts.map +1 -0
  130. package/dist/divider.js +55 -61
  131. package/dist/divider.js.map +1 -1
  132. package/dist/elevation/elevation.d.ts +28 -0
  133. package/dist/elevation/elevation.d.ts.map +1 -0
  134. package/dist/elevation/index.d.ts +2 -0
  135. package/dist/elevation/index.d.ts.map +1 -0
  136. package/dist/elevation-Bl1N6qEq.js +100 -0
  137. package/dist/elevation-Bl1N6qEq.js.map +1 -0
  138. package/dist/elevation-CbF5he8B.js +103 -0
  139. package/dist/elevation-CbF5he8B.js.map +1 -0
  140. package/dist/elevation-D3F6Z1jU.js +100 -0
  141. package/dist/elevation-D3F6Z1jU.js.map +1 -0
  142. package/dist/elevation.js +77 -0
  143. package/dist/elevation.js.map +1 -0
  144. package/dist/focus-ring/FocusAttachableController.d.ts +10 -0
  145. package/dist/focus-ring/FocusAttachableController.d.ts.map +1 -0
  146. package/dist/focus-ring/focus-ring.d.ts +36 -0
  147. package/dist/focus-ring/focus-ring.d.ts.map +1 -0
  148. package/dist/focus-ring/index.d.ts +2 -0
  149. package/dist/focus-ring/index.d.ts.map +1 -0
  150. package/dist/focus-ring.js +105 -0
  151. package/dist/focus-ring.js.map +1 -0
  152. package/dist/icon/datasource.d.ts +3 -0
  153. package/dist/icon/datasource.d.ts.map +1 -0
  154. package/dist/icon/icon.d.ts +42 -0
  155. package/dist/icon/icon.d.ts.map +1 -0
  156. package/dist/icon/index.d.ts +2 -0
  157. package/dist/icon/index.d.ts.map +1 -0
  158. package/dist/icon/p-icon.d.ts +4 -0
  159. package/dist/icon/p-icon.d.ts.map +1 -0
  160. package/dist/icon.js +26 -26
  161. package/dist/icon.js.map +1 -1
  162. package/dist/index.d.ts +9 -0
  163. package/dist/index.d.ts.map +1 -0
  164. package/dist/index.js +9 -5
  165. package/dist/index.js.map +1 -1
  166. package/dist/link/link.css.d.ts +3 -0
  167. package/dist/link/link.css.d.ts.map +1 -0
  168. package/dist/lit-element-B7NX__Gq.js +2851 -0
  169. package/dist/lit-element-B7NX__Gq.js.map +1 -0
  170. package/dist/lit-element-Bq5B2QNv.js +28 -0
  171. package/dist/lit-element-Bq5B2QNv.js.map +1 -0
  172. package/dist/lit-element-CkD27PXL.js +28 -0
  173. package/dist/lit-element-CkD27PXL.js.map +1 -0
  174. package/dist/lit-element-DHH1_Q-3.js +28 -0
  175. package/dist/lit-element-DHH1_Q-3.js.map +1 -0
  176. package/dist/peacock-loader.d.ts +2 -0
  177. package/dist/peacock-loader.d.ts.map +1 -0
  178. package/dist/peacock-loader.js +465 -116
  179. package/dist/peacock-loader.js.map +1 -1
  180. package/dist/property-BXcRN0hQ.js +39 -0
  181. package/dist/property-BXcRN0hQ.js.map +1 -0
  182. package/dist/property-CR1ZrEd9.js +45 -0
  183. package/dist/property-CR1ZrEd9.js.map +1 -0
  184. package/dist/property-CqSbFxyM.js +45 -0
  185. package/dist/property-CqSbFxyM.js.map +1 -0
  186. package/dist/property-DNaigT7h.js +39 -0
  187. package/dist/property-DNaigT7h.js.map +1 -0
  188. package/dist/property-yt9tIYgR.js +39 -0
  189. package/dist/property-yt9tIYgR.js.map +1 -0
  190. package/dist/query-CV342L_h.js +189 -0
  191. package/dist/query-CV342L_h.js.map +1 -0
  192. package/dist/ripple-Blc5Rqhb.js +102 -0
  193. package/dist/ripple-Blc5Rqhb.js.map +1 -0
  194. package/dist/ripple-BqTcEQAP.js +102 -0
  195. package/dist/ripple-BqTcEQAP.js.map +1 -0
  196. package/dist/ripple-BqUjb18i.js +105 -0
  197. package/dist/ripple-BqUjb18i.js.map +1 -0
  198. package/dist/ripple-Buzs-MON.js +106 -0
  199. package/dist/ripple-Buzs-MON.js.map +1 -0
  200. package/dist/ripple-Bz5B_LoE.js +102 -0
  201. package/dist/ripple-Bz5B_LoE.js.map +1 -0
  202. package/dist/ripple-CAq7Ix6x.js +106 -0
  203. package/dist/ripple-CAq7Ix6x.js.map +1 -0
  204. package/dist/ripple-CDqSm_Vy.js +106 -0
  205. package/dist/ripple-CDqSm_Vy.js.map +1 -0
  206. package/dist/ripple-CJtPH28B.js +102 -0
  207. package/dist/ripple-CJtPH28B.js.map +1 -0
  208. package/dist/ripple-CKTd8obC.js +92 -0
  209. package/dist/ripple-CKTd8obC.js.map +1 -0
  210. package/dist/ripple-CKnDWTVQ.js +107 -0
  211. package/dist/ripple-CKnDWTVQ.js.map +1 -0
  212. package/dist/ripple-CeR8eLuc.js +93 -0
  213. package/dist/ripple-CeR8eLuc.js.map +1 -0
  214. package/dist/ripple-Czp3eR6w.js +127 -0
  215. package/dist/ripple-Czp3eR6w.js.map +1 -0
  216. package/dist/ripple-DIab1MaY.js +106 -0
  217. package/dist/ripple-DIab1MaY.js.map +1 -0
  218. package/dist/ripple-DUFMimxZ.js +120 -0
  219. package/dist/ripple-DUFMimxZ.js.map +1 -0
  220. package/dist/ripple-DVmDdoNV.js +102 -0
  221. package/dist/ripple-DVmDdoNV.js.map +1 -0
  222. package/dist/ripple-DYnhXK5d.js +118 -0
  223. package/dist/ripple-DYnhXK5d.js.map +1 -0
  224. package/dist/ripple-DnudV47f.js +102 -0
  225. package/dist/ripple-DnudV47f.js.map +1 -0
  226. package/dist/ripple-DsC-h31M.js +119 -0
  227. package/dist/ripple-DsC-h31M.js.map +1 -0
  228. package/dist/ripple-DvM0SPd9.js +128 -0
  229. package/dist/ripple-DvM0SPd9.js.map +1 -0
  230. package/dist/ripple-NWIiDgX2.js +128 -0
  231. package/dist/ripple-NWIiDgX2.js.map +1 -0
  232. package/dist/ripple-X3U_R8lT.js +106 -0
  233. package/dist/ripple-X3U_R8lT.js.map +1 -0
  234. package/dist/ripple.js +128 -0
  235. package/dist/ripple.js.map +1 -0
  236. package/dist/src/LoaderUtils.d.ts +0 -1
  237. package/dist/src/avatar/avatar.d.ts +1 -1
  238. package/dist/src/badge/badge.d.ts +1 -1
  239. package/dist/src/button/button.d.ts +99 -0
  240. package/dist/src/button/index.d.ts +1 -0
  241. package/dist/src/clock/ClockController.d.ts +10 -0
  242. package/dist/src/clock/clock.d.ts +4 -6
  243. package/dist/src/code-highlighter/code-highlighter.d.ts +26 -0
  244. package/dist/src/code-highlighter/index.d.ts +1 -0
  245. package/dist/src/code-highlighter/local.d.ts +6 -0
  246. package/dist/src/divider/divider.d.ts +1 -2
  247. package/dist/src/elevation/elevation.css.d.ts +1 -0
  248. package/dist/src/elevation/elevation.d.ts +27 -0
  249. package/dist/src/elevation/index.d.ts +1 -0
  250. package/dist/src/focus-ring/FocusAttachableController.d.ts +9 -0
  251. package/dist/src/focus-ring/focus-ring.d.ts +35 -0
  252. package/dist/src/focus-ring/index.d.ts +1 -0
  253. package/dist/src/icon/icon.d.ts +3 -2
  254. package/dist/src/index.d.ts +4 -0
  255. package/dist/src/ripple/index.d.ts +1 -0
  256. package/dist/src/ripple/ripple.d.ts +9 -0
  257. package/dist/src/utils.d.ts +4 -0
  258. package/dist/state-BXOdKkbT.js +10 -0
  259. package/dist/state-BXOdKkbT.js.map +1 -0
  260. package/dist/state-BfUul2Gq.js +10 -0
  261. package/dist/state-BfUul2Gq.js.map +1 -0
  262. package/dist/state-CNX6DhqO.js +10 -0
  263. package/dist/state-CNX6DhqO.js.map +1 -0
  264. package/dist/state-Cl3mjeR1.js +10 -0
  265. package/dist/state-Cl3mjeR1.js.map +1 -0
  266. package/dist/state-WDFgnqnd.js +36 -0
  267. package/dist/state-WDFgnqnd.js.map +1 -0
  268. package/dist/style-inject.es--nCJ9F_D.js +55 -0
  269. package/dist/style-inject.es--nCJ9F_D.js.map +1 -0
  270. package/dist/style-inject.es-tgCJW-Cu.js +29 -0
  271. package/dist/style-inject.es-tgCJW-Cu.js.map +1 -0
  272. package/dist/styleMixins.css-0Uq-6ouM.js +14 -0
  273. package/dist/styleMixins.css-0Uq-6ouM.js.map +1 -0
  274. package/dist/styleMixins.css-B8H9wDNA.js +17 -0
  275. package/dist/styleMixins.css-B8H9wDNA.js.map +1 -0
  276. package/dist/styleMixins.css-DrUsqddl.js +17 -0
  277. package/dist/styleMixins.css-DrUsqddl.js.map +1 -0
  278. package/dist/styleMixins.css-fokZCyF-.js +17 -0
  279. package/dist/styleMixins.css-fokZCyF-.js.map +1 -0
  280. package/dist/styleMixins.css.d.ts +10 -0
  281. package/dist/styleMixins.css.d.ts.map +1 -0
  282. package/dist/text/text.css.d.ts +3 -0
  283. package/dist/text/text.css.d.ts.map +1 -0
  284. package/dist/tsconfig.tsbuildinfo +1 -1
  285. package/dist/typedoc.json +340489 -0
  286. package/dist/utils-BVap5huR.js +157 -0
  287. package/dist/utils-BVap5huR.js.map +1 -0
  288. package/dist/utils-CY3RyfcA.js +157 -0
  289. package/dist/utils-CY3RyfcA.js.map +1 -0
  290. package/dist/utils-CdOdn2dW.js +149 -0
  291. package/dist/utils-CdOdn2dW.js.map +1 -0
  292. package/dist/utils-DD_cg6Ms.js +157 -0
  293. package/dist/utils-DD_cg6Ms.js.map +1 -0
  294. package/dist/utils.d.ts +8 -0
  295. package/dist/utils.d.ts.map +1 -0
  296. package/package.json +4 -2
  297. package/readme.md +1 -1
  298. package/rollup.config.js +9 -1
  299. package/scss/mixin.scss +50 -0
  300. package/src/LoaderUtils.ts +122 -122
  301. package/src/avatar/avatar.scss +38 -0
  302. package/src/avatar/avatar.ts +1 -1
  303. package/src/badge/badge.scss +31 -0
  304. package/src/badge/badge.ts +1 -1
  305. package/src/button/_button-sizes.scss +59 -0
  306. package/src/button/button.scss +430 -0
  307. package/src/button/button.ts +304 -0
  308. package/src/button/demo/index.html +42 -0
  309. package/src/button/index.ts +1 -0
  310. package/src/clock/ClockController.ts +32 -0
  311. package/src/clock/clock.scss +9 -0
  312. package/src/clock/clock.ts +39 -57
  313. package/src/code-highlighter/code-highlighter.scss +0 -0
  314. package/src/code-highlighter/code-highlighter.ts +58 -0
  315. package/src/code-highlighter/demo/index.html +58 -0
  316. package/src/code-highlighter/index.ts +1 -0
  317. package/src/code-highlighter/local.ts +11 -0
  318. package/src/divider/divider.scss +56 -0
  319. package/src/divider/divider.ts +1 -7
  320. package/src/elevation/demo/index.html +58 -0
  321. package/src/elevation/elevation.scss +61 -0
  322. package/src/elevation/elevation.ts +32 -0
  323. package/src/elevation/index.ts +1 -0
  324. package/src/focus-ring/FocusAttachableController.ts +36 -0
  325. package/src/focus-ring/demo/index.html +58 -0
  326. package/src/focus-ring/focus-ring.scss +22 -0
  327. package/src/focus-ring/focus-ring.ts +83 -0
  328. package/src/focus-ring/index.ts +1 -0
  329. package/src/icon/icon.scss +19 -0
  330. package/src/icon/icon.ts +131 -131
  331. package/src/index.ts +9 -5
  332. package/src/link/demo/index.html +34 -0
  333. package/src/link/link.scss +24 -0
  334. package/src/peacock-loader.ts +69 -64
  335. package/src/ripple/index.ts +1 -0
  336. package/src/ripple/ripple.ts +134 -0
  337. package/src/styles.d.ts +3 -1
  338. package/src/text/text.scss +48 -0
  339. package/src/utils.ts +29 -1
  340. package/tsconfig.json +23 -22
  341. package/demo/int.html +0 -31
  342. package/src/avatar/avatar.css.ts +0 -41
  343. package/src/badge/badge.css.ts +0 -34
  344. package/src/clock/clock.css.ts +0 -12
  345. package/src/divider/divider.css.ts +0 -58
  346. package/src/icon/icon.css.ts +0 -22
package/src/divider/divider.ts CHANGED
@@ -1,7 +1,7 @@
1
1
  import { html, LitElement } from 'lit';
2
2
  import { property, state } from 'lit/decorators.js';
3
3
  import { classMap } from 'lit/directives/class-map.js';
4
- import { styles } from './divider.css.js';
4
+ import styles from './divider.scss';
5
5
  import { observerSlotChangesWithCallback } from '../utils.js';
6
6
 
7
7
  /**
@@ -56,10 +56,4 @@ export class Divider extends LitElement {
56
56
  <div class="line"></div>
57
57
  </div>`;
58
58
  }
59
-
60
- #handleSlotChange(event: { target: any }) {
61
- const slot = event.target;
62
- // Check assignedElements length
63
- this.slotHasContent = slot.assignedNodes({ flatten: true }).length > 0;
64
- }
65
59
  }
package/src/elevation/demo/index.html ADDED
@@ -0,0 +1,58 @@
1
+ <!doctype html>
2
+ <html lang='en-GB'>
3
+ <head>
4
+ <meta charset='utf-8'>
5
+ <meta name='viewport' content='width=device-width, initial-scale=1.0, viewport-fit=cover' />
6
+ <link rel='stylesheet' href='/dist/assets/styles/tokens.css' />
7
+ <link href="https://fonts.googleapis.com/css2?family=Noto+Sans+Mono:wght@100..900&family=Noto+Sans:ital,wght@0,100..900;1,100..900&display=swap" rel="stylesheet">
8
+
9
+ <style>
10
+ body {
11
+ background: #fafafa;
12
+ }
13
+ </style>
14
+ </head>
15
+ <body>
16
+
17
+ <style>
18
+ .elevated-element {
19
+ position: relative;
20
+ border-radius: 4px;
21
+ padding: var(--spacing-200);
22
+ }
23
+ </style>
24
+
25
+ <div class="elevated-element">
26
+ <p-elevation style="--elevation-level: 1"></p-elevation>
27
+ Level 1
28
+ </div>
29
+
30
+ <div class="elevated-element">
31
+ <p-elevation style="--elevation-level: 2"></p-elevation>
32
+ Level 2
33
+ </div>
34
+
35
+
36
+ <div class="elevated-element">
37
+ <p-elevation style="--elevation-level: 3"></p-elevation>
38
+ Level 3
39
+ </div>
40
+
41
+ <div class="elevated-element">
42
+ <p-elevation style="--elevation-level: 4"></p-elevation>
43
+ Level 4
44
+ </div>
45
+
46
+ <div class="elevated-element">
47
+ <p-elevation style="--elevation-level: 5"></p-elevation>
48
+ Level 5
49
+ </div>
50
+
51
+
52
+
53
+ <script type='module'>
54
+ import { Elevation } from '/dist/index.js';
55
+ window.customElements.define('p-elevation', Elevation);
56
+ </script>
57
+ </body>
58
+ </html>
package/src/elevation/elevation.scss ADDED
@@ -0,0 +1,61 @@
1
+ /**
2
+ * Derived from Material Design Elevation
3
+ * https://github.com/material-components/material-web/blob/main/elevation/internal/_elevation.scss
4
+ */
5
+
6
+ :host,
7
+ .shadow,
8
+ .shadow::before,
9
+ .shadow::after {
10
+ border-radius: inherit;
11
+ inset: 0;
12
+ position: absolute;
13
+ transition-duration: inherit;
14
+ transition-property: inherit;
15
+ transition-timing-function: inherit;
16
+ }
17
+
18
+ :host {
19
+ display: flex;
20
+ pointer-events: none;
21
+ transition-property: box-shadow, opacity;
22
+ --elevation-level: 0;
23
+ --elevation-color: var(--elevation-color-default, black);
24
+ }
25
+
26
+ .shadow::before,
27
+ .shadow::after {
28
+ content: '';
29
+ transition-property: box-shadow, opacity;
30
+
31
+ // Elevation doesn't share styles with multiple variants, so we normally
32
+ // would not use private custom properties. However, these variables are
33
+ // repeated several times in the styles below, and a shorter custom property
34
+ // reduces the CSS size, minified and gzip.
35
+ --_level: var(--elevation-level);
36
+ --_shadow-color: var(--elevation-color);
37
+ }
38
+
39
+ // Key box shadow
40
+ .shadow::before {
41
+ // level0: box-shadow: 0px 0px 0px 0px;
42
+ // level1: box-shadow: 0px 1px 2px 0px;
43
+ // level2: box-shadow: 0px 1px 2px 0px;
44
+ // level3: box-shadow: 0px 1px 3px 0px;
45
+ // level4: box-shadow: 0px 2px 3px 0px;
46
+ // level5: box-shadow: 0px 4px 4px 0px;
47
+ box-shadow: 0 calc(1px * (clamp(0, var(--_level), 1) + clamp(0, var(--_level) - 3, 1) + 2 * clamp(0, var(--_level) - 4, 1))) calc(1px * (2 * clamp(0, var(--_level), 1) + clamp(0, var(--_level) - 2, 1) + clamp(0, var(--_level) - 4, 1))) 0 var(--_shadow-color);
48
+ opacity: 0.3;
49
+ }
50
+
51
+ // Ambient box shadow
52
+ .shadow::after {
53
+ // level0: box-shadow: 0px 0px 0px 0px;
54
+ // level1: box-shadow: 0px 1px 3px 1px;
55
+ // level2: box-shadow: 0px 2px 6px 2px;
56
+ // level3: box-shadow: 0px 4px 8px 3px;
57
+ // level4: box-shadow: 0px 6px 10px 4px;
58
+ // level5: box-shadow: 0px 8px 12px 6px;
59
+ box-shadow: 0 calc(1px * (clamp(0, var(--_level), 1) + clamp(0, var(--_level) - 1, 1) + 2 * clamp(0, var(--_level) - 2, 3))) calc(1px * (3 * clamp(0, var(--_level), 2) + 2 * clamp(0, var(--_level) - 2, 3))) calc(1px * (clamp(0, var(--_level), 4) + 2 * clamp(0, var(--_level) - 4, 1))) var(--_shadow-color);
60
+ opacity: 0.15;
61
+ }
package/src/elevation/elevation.ts ADDED
@@ -0,0 +1,32 @@
1
+ import { html, LitElement } from 'lit';
2
+ import styles from './elevation.scss';
3
+
4
+ /**
5
+ * @label Elevation
6
+ * @tag p-elevation
7
+ * @rawTag elevation
8
+ *
9
+ * @summary Adds elevation to an element.
10
+ * @overview
11
+ * - Elevation adds a shadow effect to an element to give it depth.
12
+ * - It can be used to create a sense of hierarchy or to draw attention to a particular element.
13
+ *
14
+ * @cssprop --elevation-level - Controls the elevation level of the shadow.
15
+ * @cssprop --elevation-color - Controls the color of the shadow.
16
+ *
17
+ * @example
18
+ * ```html
19
+ * <div style="position: relative; padding: var(--spacing-200); border-radius: var(--shape-corner-small);">
20
+ * <p-elevation style='--elevation-level: 2'></p-elevation>
21
+ * Level 2
22
+ * </div>
23
+ * ```
24
+ * @tags display
25
+ */
26
+ export class Elevation extends LitElement {
27
+ static styles = [styles];
28
+
29
+ render() {
30
+ return html`<span class="shadow"></span>`;
31
+ }
32
+ }
package/src/elevation/index.ts ADDED
@@ -0,0 +1 @@
1
+ export { Elevation } from './elevation.js';
package/src/focus-ring/FocusAttachableController.ts ADDED
@@ -0,0 +1,36 @@
1
+ import { ReactiveController, ReactiveControllerHost } from 'lit';
2
+
3
+ export class FocusAttachableController implements ReactiveController {
4
+ host: ReactiveControllerHost;
5
+
6
+ getControlElement: () => HTMLElement;
7
+
8
+ visible = false;
9
+
10
+ constructor(
11
+ host: ReactiveControllerHost,
12
+ getControlElement: () => HTMLElement,
13
+ ) {
14
+ (this.host = host).addController(this);
15
+ this.getControlElement = getControlElement;
16
+ }
17
+
18
+ hostConnected() {
19
+ // Start a timer when the host is connected
20
+ console.log('connected');
21
+ if (this.getControlElement) {
22
+ const element = this.getControlElement();
23
+ element.addEventListener('focus', () => {
24
+ console.log('focus');
25
+ // @ts-ignore
26
+ this.host.handleEvent();
27
+ this.host.requestUpdate();
28
+ });
29
+ }
30
+ }
31
+
32
+ // eslint-disable-next-line class-methods-use-this
33
+ hostDisconnected() {
34
+ console.log('disconnected');
35
+ }
36
+ }
package/src/focus-ring/demo/index.html ADDED
@@ -0,0 +1,58 @@
1
+ <!doctype html>
2
+ <html lang='en-GB'>
3
+ <head>
4
+ <meta charset='utf-8'>
5
+ <meta name='viewport' content='width=device-width, initial-scale=1.0, viewport-fit=cover' />
6
+ <link rel='stylesheet' href='/dist/assets/styles/tokens.css' />
7
+ <link href="https://fonts.googleapis.com/css2?family=Noto+Sans+Mono:wght@100..900&family=Noto+Sans:ital,wght@0,100..900;1,100..900&display=swap" rel="stylesheet">
8
+
9
+ <style>
10
+ body {
11
+ background: #fafafa;
12
+ }
13
+ </style>
14
+ </head>
15
+ <body>
16
+
17
+ <style>
18
+ .elevated-element {
19
+ position: relative;
20
+ border-radius: 4px;
21
+ padding: var(--spacing-200);
22
+ }
23
+ </style>
24
+
25
+ <div class="elevated-element">
26
+ <p-elevation style="--elevation-level: 1"></p-elevation>
27
+ Level 1
28
+ </div>
29
+
30
+ <div class="elevated-element">
31
+ <p-elevation style="--elevation-level: 2"></p-elevation>
32
+ Level 2
33
+ </div>
34
+
35
+
36
+ <div class="elevated-element">
37
+ <p-elevation style="--elevation-level: 3"></p-elevation>
38
+ Level 3
39
+ </div>
40
+
41
+ <div class="elevated-element">
42
+ <p-elevation style="--elevation-level: 4"></p-elevation>
43
+ Level 4
44
+ </div>
45
+
46
+ <div class="elevated-element">
47
+ <p-elevation style="--elevation-level: 5"></p-elevation>
48
+ Level 5
49
+ </div>
50
+
51
+
52
+
53
+ <script type='module'>
54
+ import { Elevation } from '/dist/index.js';
55
+ window.customElements.define('p-elevation', Elevation);
56
+ </script>
57
+ </body>
58
+ </html>
package/src/focus-ring/focus-ring.scss ADDED
@@ -0,0 +1,22 @@
1
+ :host {
2
+ display: none;
3
+ pointer-events: none;
4
+ position: absolute;
5
+ border-start-start-radius: var(--focus-ring-shape-start-start);
6
+ border-start-end-radius: var(--focus-ring-shape-start-end);
7
+ border-end-start-radius: var(--focus-ring-shape-end-start);
8
+ border-end-end-radius: var(--focus-ring-shape-end-end);
9
+ inset: calc(-1 * var(--focus-ring-inset, 2px));
10
+
11
+ animation-delay: 0s, calc(var(--focus-ring-duration, 600ms) * .25);
12
+ animation-duration: calc(var(--focus-ring-duration, 600ms) * .25), calc(var(--focus-ring-duration, 600ms) * .75);
13
+ animation-timing-function: var(--easing-standard);
14
+ box-sizing: border-box;
15
+
16
+ animation-name: outward-grow, outward-shrink;
17
+ }
18
+
19
+ :host([visible]) {
20
+ display: flex;
21
+ outline: 3px solid var(--color-primary);
22
+ }
package/src/focus-ring/focus-ring.ts ADDED
@@ -0,0 +1,83 @@
1
+ import { LitElement, nothing } from 'lit';
2
+ import { property } from 'lit/decorators.js';
3
+ import styles from './focus-ring.scss';
4
+
5
+ /**
6
+ * @label Elevation
7
+ * @tag p-elevation
8
+ * @rawTag elevation
9
+ *
10
+ * @summary Adds elevation to an element.
11
+ * @overview
12
+ * - Elevation adds a shadow effect to an element to give it depth.
13
+ * - It can be used to create a sense of hierarchy or to draw attention to a particular element.
14
+ *
15
+ * @cssprop --elevation-level - Controls the elevation level of the shadow.
16
+ * @cssprop --elevation-color - Controls the color of the shadow.
17
+ *
18
+ * @example
19
+ * ```html
20
+ * <div style="position: relative; padding: var(--spacing-200); border-radius: var(--shape-corner-small);">
21
+ * <p-elevation style='--elevation-level: 2'></p-elevation>
22
+ * Level 2
23
+ * </div>
24
+ * ```
25
+ * @tags display
26
+ */
27
+ export class FocusRing extends LitElement {
28
+ static styles = [styles];
29
+
30
+ @property({ type: Boolean, reflect: true }) visible: boolean = false;
31
+
32
+ render() {
33
+ return nothing;
34
+ }
35
+
36
+ _control?: HTMLElement;
37
+
38
+ get control() {
39
+ return this._control || null;
40
+ }
41
+
42
+ set control(control: HTMLElement | null) {
43
+ if (control) {
44
+ this._control = control;
45
+ } else {
46
+ this.detach();
47
+ }
48
+ }
49
+
50
+ connectedCallback() {
51
+ super.connectedCallback();
52
+ this.attach();
53
+ }
54
+
55
+ disconnectedCallback() {
56
+ this.detach();
57
+ super.disconnectedCallback();
58
+ }
59
+
60
+ attach() {
61
+ // @ts-ignore - buttonElement is not defined on the base class
62
+ this._control?.buttonElement?.addEventListener('focusin', () => {
63
+ this.visible =
64
+ // @ts-ignore - buttonElement is not defined on the base class
65
+ this._control?.buttonElement?.matches(':focus-visible') ?? false;
66
+ });
67
+ // @ts-ignore - buttonElement is not defined on the base class
68
+ this._control?.buttonElement?.addEventListener('focusout', () => {
69
+ this.visible = false;
70
+ });
71
+ // @ts-ignore - buttonElement is not defined on the base class
72
+ this._control?.buttonElement?.addEventListener('pointerdown', () => {
73
+ this.visible = false;
74
+ });
75
+ }
76
+
77
+ detach() {
78
+ this._control?.removeEventListener('focusin', () => {});
79
+ this._control?.removeEventListener('focusout', () => {});
80
+ this._control?.removeEventListener('pointerdown', () => {});
81
+ this._control = undefined;
82
+ }
83
+ }
package/src/focus-ring/index.ts ADDED
@@ -0,0 +1 @@
1
+ export { FocusRing } from './focus-ring.js';
package/src/icon/icon.scss ADDED
@@ -0,0 +1,19 @@
1
+ :host {
2
+ display: inline-block;
3
+ vertical-align: middle;
4
+ --icon-size: inherit;
5
+ --icon-color: inherit;
6
+ }
7
+
8
+ .icon {
9
+ display: inline-block;
10
+ vertical-align: middle;
11
+ height: var(--icon-size, 1rem);
12
+ width: var(--icon-size, 1rem);
13
+
14
+ svg {
15
+ fill: var(--icon-color);
16
+ height: 100%;
17
+ width: 100%;
18
+ }
19
+ }
package/src/icon/icon.ts CHANGED
@@ -1,131 +1,131 @@
1
- import { html, LitElement } from 'lit';
2
- import { property, state } from 'lit/decorators.js';
3
- import { unsafeSVG } from 'lit/directives/unsafe-svg.js';
4
- import { fetchIcon, fetchSVG } from './datasource.js';
5
- import { sanitizeSvg } from '../utils.js';
6
- import { styles } from './icon.css.js';
7
-
8
- /**
9
- * @label Icon
10
- * @tag p-icon
11
- * @rawTag icon
12
- * @summary Icons are visual symbols used to represent ideas, objects, or actions.
13
- * @overview Icons are visual symbols used to represent ideas, objects, or actions. They communicate messages at a glance, afford interactivity, and draw attention to important information.
14
- *
15
- * @cssprop --icon-color - Controls the color of the icon.
16
- * @cssprop [--icon-size=1rem] - Controls the size of the icon. Defaults to "1rem"
17
- *
18
- * @example
19
- * ```html
20
- * <p-icon name="home"></p-icon>
21
- * ```
22
- *
23
- */
24
- export class Icon extends LitElement {
25
- static styles = [styles];
26
-
27
- /**
28
- * The identifier for the icon.
29
- * This name corresponds to a specific SVG asset in the icon set.
30
- */
31
- @property({ type: String, reflect: true }) name?: string;
32
-
33
- @property({ type: String, reflect: true }) src?: string;
34
-
35
- @property({ type: String }) provider: 'material-symbols' | 'carbon' =
36
- 'material-symbols';
37
-
38
- @state()
39
- private svgContent: string = '';
40
-
41
- // loading + error states for consumers/tests
42
- @state()
43
- private loading: boolean = false;
44
-
45
- @state()
46
- private error: Error | null = null;
47
-
48
- // token to avoid race conditions when multiple fetches overlap
49
- private _fetchId = 0;
50
-
51
- // optional debounce for rapid property changes
52
- private _debounceTimer: number | undefined;
53
-
54
- firstUpdated() {
55
- // perform initial fetch once component is connected and rendered
56
- this.__scheduleUpdate();
57
- }
58
-
59
- updated(changedProperties: any) {
60
- // only refetch when name or src changed
61
- if (changedProperties.has('name') || changedProperties.has('src')) {
62
- this.__scheduleUpdate();
63
- }
64
- }
65
-
66
- render() {
67
- // accessible wrapper; consumers can provide a fallback via <slot name="fallback">.
68
- return html` <div class="icon">
69
- ${this.svgContent
70
- ? unsafeSVG(this.svgContent)
71
- : html`<slot name="fallback"></slot>`}
72
- </div>`;
73
- }
74
-
75
- // small debounce to coalesce rapid changes (50ms)
76
- private __scheduleUpdate() {
77
- if (this._debounceTimer) {
78
- clearTimeout(this._debounceTimer as any);
79
- }
80
- // @ts-ignore - setTimeout in DOM returns number
81
- this._debounceTimer = window.setTimeout(() => this.__updateSvg(), 50);
82
- }
83
-
84
- /**
85
- * @internal
86
- */
87
- private async __updateSvg() {
88
- this._fetchId += 1;
89
- const currentId = this._fetchId;
90
- this.loading = true;
91
- this.error = null;
92
-
93
- try {
94
- let raw: string | undefined;
95
-
96
- if (this.name) {
97
- raw = await fetchIcon(this.name, this.provider);
98
- } else if (this.src) {
99
- raw = await fetchSVG(this.src);
100
- } else {
101
- raw = '';
102
- }
103
-
104
- // If another fetch started after this one, ignore this result
105
- if (currentId !== this._fetchId) return;
106
-
107
- if (raw) {
108
- this.svgContent = sanitizeSvg(raw);
109
- } else {
110
- this.svgContent = '';
111
- }
112
- } catch (err: any) {
113
- // capture and surface error, but avoid throwing
114
- this.error = err instanceof Error ? err : new Error(String(err));
115
- this.svgContent = '';
116
- // bubble an event so consumers can react
117
- this.dispatchEvent(
118
- new CustomEvent('icon-error', {
119
- detail: { name: this.name, src: this.src, error: this.error },
120
- bubbles: true,
121
- composed: true,
122
- }),
123
- );
124
- } finally {
125
- // ensure loading is cleared unless another fetch started
126
- if (currentId === this._fetchId) {
127
- this.loading = false;
128
- }
129
- }
130
- }
131
- }
1
+ import { html, LitElement } from 'lit';
2
+ import { property, state } from 'lit/decorators.js';
3
+ import { unsafeSVG } from 'lit/directives/unsafe-svg.js';
4
+ import { fetchIcon, fetchSVG } from './datasource.js';
5
+ import { sanitizeSvg } from '../utils.js';
6
+ import styles from './icon.scss';
7
+
8
+ export type IconProvider = 'material-symbols' | 'material-icons';
9
+ /**
10
+ * @label Icon
11
+ * @tag p-icon
12
+ * @rawTag icon
13
+ * @summary Icons are visual symbols used to represent ideas, objects, or actions.
14
+ * @overview Icons are visual symbols used to represent ideas, objects, or actions. They communicate messages at a glance, afford interactivity, and draw attention to important information.
15
+ *
16
+ * @cssprop --icon-color - Controls the color of the icon.
17
+ * @cssprop [--icon-size=1rem] - Controls the size of the icon. Defaults to "1rem"
18
+ *
19
+ * @example
20
+ * ```html
21
+ * <p-icon name="home"></p-icon>
22
+ * ```
23
+ *
24
+ */
25
+ export class Icon extends LitElement {
26
+ static styles = [styles];
27
+
28
+ /**
29
+ * The identifier for the icon.
30
+ * This name corresponds to a specific SVG asset in the icon set.
31
+ */
32
+ @property({ type: String, reflect: true }) name?: string;
33
+
34
+ @property({ type: String, reflect: true }) src?: string;
35
+
36
+ @property({ type: String }) provider: IconProvider = 'material-symbols';
37
+
38
+ @state()
39
+ private svgContent: string = '';
40
+
41
+ // loading + error states for consumers/tests
42
+ @state() // @ts-ignore
43
+ private loading: boolean = false;
44
+
45
+ @state()
46
+ private error: Error | null = null;
47
+
48
+ // token to avoid race conditions when multiple fetches overlap
49
+ private _fetchId = 0;
50
+
51
+ // optional debounce for rapid property changes
52
+ private _debounceTimer: number | undefined;
53
+
54
+ firstUpdated() {
55
+ // perform initial fetch once component is connected and rendered
56
+ this.__scheduleUpdate();
57
+ }
58
+
59
+ updated(changedProperties: any) {
60
+ // only refetch when name or src changed
61
+ if (changedProperties.has('name') || changedProperties.has('src')) {
62
+ this.__scheduleUpdate();
63
+ }
64
+ }
65
+
66
+ render() {
67
+ // accessible wrapper; consumers can provide a fallback via <slot name="fallback">.
68
+ return html` <div class="icon">
69
+ ${this.svgContent
70
+ ? unsafeSVG(this.svgContent)
71
+ : html`<slot name="fallback"></slot>`}
72
+ </div>`;
73
+ }
74
+
75
+ // small debounce to coalesce rapid changes (50ms)
76
+ private __scheduleUpdate() {
77
+ if (this._debounceTimer) {
78
+ clearTimeout(this._debounceTimer as any);
79
+ }
80
+ // @ts-ignore - setTimeout in DOM returns number
81
+ this._debounceTimer = window.setTimeout(() => this.__updateSvg(), 50);
82
+ }
83
+
84
+ /**
85
+ * @internal
86
+ */
87
+ private async __updateSvg() {
88
+ this._fetchId += 1;
89
+ const currentId = this._fetchId;
90
+ this.loading = true;
91
+ this.error = null;
92
+
93
+ try {
94
+ let raw: string | undefined;
95
+
96
+ if (this.name) {
97
+ raw = await fetchIcon(this.name, this.provider);
98
+ } else if (this.src) {
99
+ raw = await fetchSVG(this.src);
100
+ } else {
101
+ raw = '';
102
+ }
103
+
104
+ // If another fetch started after this one, ignore this result
105
+ if (currentId !== this._fetchId) return;
106
+
107
+ if (raw) {
108
+ this.svgContent = sanitizeSvg(raw);
109
+ } else {
110
+ this.svgContent = '';
111
+ }
112
+ } catch (err: any) {
113
+ // capture and surface error, but avoid throwing
114
+ this.error = err instanceof Error ? err : new Error(String(err));
115
+ this.svgContent = '';
116
+ // bubble an event so consumers can react
117
+ this.dispatchEvent(
118
+ new CustomEvent('icon-error', {
119
+ detail: { name: this.name, src: this.src, error: this.error },
120
+ bubbles: true,
121
+ composed: true,
122
+ }),
123
+ );
124
+ } finally {
125
+ // ensure loading is cleared unless another fetch started
126
+ if (currentId === this._fetchId) {
127
+ this.loading = false;
128
+ }
129
+ }
130
+ }
131
+ }
package/src/index.ts CHANGED
@@ -1,5 +1,9 @@
1
- export { Icon } from './icon/index.js';
2
- export { Avatar } from './avatar/index.js';
3
- export { Badge } from './badge/index.js';
4
- export { Divider } from './divider/index.js';
5
- export { Clock } from './clock/index.js';
1
+ export { Icon } from './icon/index.js';
2
+ export { Avatar } from './avatar/index.js';
3
+ export { Badge } from './badge/index.js';
4
+ export { Divider } from './divider/index.js';
5
+ export { Clock } from './clock/index.js';
6
+ export { Elevation } from './elevation/index.js';
7
+ export { Button } from './button/index.js';
8
+ export { FocusRing } from './focus-ring/index.js';
9
+ export { Ripple } from './ripple/index.js';