@pine-ds/icons 3.1.0 → 3.3.0-rc.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 (76) hide show
  1. package/components/pds-icon.d.ts +2 -2
  2. package/components/pds-icon.js +175 -171
  3. package/components/pds-icon.js.map +1 -1
  4. package/components/utils.js +65 -45
  5. package/components/utils.js.map +1 -1
  6. package/dist/cheatsheet.html +7 -5
  7. package/dist/cjs/{index-b35d5b0f.js → index-17212f65.js} +81 -21
  8. package/dist/cjs/index-17212f65.js.map +1 -0
  9. package/dist/cjs/index.cjs.js +2 -2
  10. package/dist/cjs/loader.cjs.js +2 -2
  11. package/dist/cjs/pds-icon.cjs.entry.js +152 -150
  12. package/dist/cjs/pds-icon.cjs.entry.js.map +1 -1
  13. package/dist/cjs/pds-icons.cjs.js +3 -3
  14. package/dist/cjs/pds-icons.cjs.js.map +1 -1
  15. package/dist/cjs/utils-8c57ce6a.js +101 -0
  16. package/dist/cjs/utils-8c57ce6a.js.map +1 -0
  17. package/dist/collection/collection-manifest.json +1 -1
  18. package/dist/collection/components/pds-icon/pds-icon.js +189 -168
  19. package/dist/collection/components/pds-icon/pds-icon.js.map +1 -1
  20. package/dist/collection/components/pds-icon/request.js +21 -21
  21. package/dist/collection/components/pds-icon/request.js.map +1 -1
  22. package/dist/collection/components/pds-icon/svg/premium.svg +1 -0
  23. package/dist/collection/components/pds-icon/svg/theme-store.svg +1 -1
  24. package/dist/collection/components/pds-icon/test/pds-icon.e2e.js +6 -6
  25. package/dist/collection/components/pds-icon/test/pds-icon.e2e.js.map +1 -1
  26. package/dist/collection/components/pds-icon/test/pds-icon.spec.js +69 -31
  27. package/dist/collection/components/pds-icon/test/pds-icon.spec.js.map +1 -1
  28. package/dist/collection/components/pds-icon/utils.js +61 -51
  29. package/dist/collection/components/pds-icon/utils.js.map +1 -1
  30. package/dist/collection/components/pds-icon/validate.js +35 -35
  31. package/dist/collection/components/pds-icon/validate.js.map +1 -1
  32. package/dist/docs.json +23 -2
  33. package/dist/esm/{index-8effeb27.js → index-d1a605fc.js} +81 -21
  34. package/dist/esm/index-d1a605fc.js.map +1 -0
  35. package/dist/esm/index.js +2 -2
  36. package/dist/esm/loader.js +3 -3
  37. package/dist/esm/pds-icon.entry.js +152 -150
  38. package/dist/esm/pds-icon.entry.js.map +1 -1
  39. package/dist/esm/pds-icons.js +4 -4
  40. package/dist/esm/pds-icons.js.map +1 -1
  41. package/dist/esm/utils-15462a67.js +95 -0
  42. package/dist/esm/utils-15462a67.js.map +1 -0
  43. package/dist/pds-icons/index.esm.js +1 -1
  44. package/dist/pds-icons/p-19d7058a.js +3 -0
  45. package/dist/pds-icons/p-19d7058a.js.map +1 -0
  46. package/dist/pds-icons/p-229b8f4e.entry.js +2 -0
  47. package/dist/pds-icons/p-229b8f4e.entry.js.map +1 -0
  48. package/dist/pds-icons/p-f0b1dbd6.js +2 -0
  49. package/dist/pds-icons/p-f0b1dbd6.js.map +1 -0
  50. package/dist/pds-icons/pds-icons.esm.js +1 -1
  51. package/dist/pds-icons/pds-icons.esm.js.map +1 -1
  52. package/dist/pds-icons.json +8 -1
  53. package/dist/pds-icons.symbols.svg +3 -2
  54. package/dist/svg/premium.svg +1 -0
  55. package/dist/svg/theme-store.svg +1 -1
  56. package/dist/types/components/pds-icon/pds-icon.d.ts +41 -35
  57. package/dist/types/components/pds-icon/utils.d.ts +4 -4
  58. package/dist/types/components.d.ts +8 -0
  59. package/dist/types/stencil-public-runtime.d.ts +29 -0
  60. package/icons/index.d.ts +2 -1
  61. package/icons/index.js +3 -2
  62. package/icons/index.mjs +3 -2
  63. package/icons/package.json +1 -1
  64. package/package.json +6 -6
  65. package/dist/cjs/index-b35d5b0f.js.map +0 -1
  66. package/dist/cjs/utils-395a38b7.js +0 -81
  67. package/dist/cjs/utils-395a38b7.js.map +0 -1
  68. package/dist/esm/index-8effeb27.js.map +0 -1
  69. package/dist/esm/utils-a0ad61d0.js +0 -75
  70. package/dist/esm/utils-a0ad61d0.js.map +0 -1
  71. package/dist/pds-icons/p-91678731.entry.js +0 -2
  72. package/dist/pds-icons/p-91678731.entry.js.map +0 -1
  73. package/dist/pds-icons/p-a3383818.js +0 -3
  74. package/dist/pds-icons/p-a3383818.js.map +0 -1
  75. package/dist/pds-icons/p-dc5765cb.js +0 -2
  76. package/dist/pds-icons/p-dc5765cb.js.map +0 -1
@@ -2,7 +2,7 @@
2
2
  <html>
3
3
  <head>
4
4
  <meta charset="utf-8">
5
- <title>Pine icons 3.1.0 Cheatsheet</title>
5
+ <title>Pine icons 3.3.0-rc.0 Cheatsheet</title>
6
6
  <style>
7
7
  body {
8
8
  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
@@ -33,8 +33,8 @@
33
33
  </style>
34
34
  </head>
35
35
  <body>
36
- <h1>Pine Icons 3.1.0 Cheatsheet</h1>
37
- <h3>270 icons</h3>
36
+ <h1>Pine Icons 3.3.0-rc.0 Cheatsheet</h1>
37
+ <h3>271 icons</h3>
38
38
 
39
39
  <a href="./svg/access-key.svg"><svg><use href="#access-key" xlink:href="#access-key"/></svg></a>
40
40
  <a href="./svg/add.svg"><svg><use href="#add" xlink:href="#add"/></svg></a>
@@ -228,6 +228,7 @@
228
228
  <a href="./svg/play-outline.svg"><svg><use href="#play-outline" xlink:href="#play-outline"/></svg></a>
229
229
  <a href="./svg/play-store.svg"><svg><use href="#play-store" xlink:href="#play-store"/></svg></a>
230
230
  <a href="./svg/plug.svg"><svg><use href="#plug" xlink:href="#plug"/></svg></a>
231
+ <a href="./svg/premium.svg"><svg><use href="#premium" xlink:href="#premium"/></svg></a>
231
232
  <a href="./svg/present.svg"><svg><use href="#present" xlink:href="#present"/></svg></a>
232
233
  <a href="./svg/preview-off.svg"><svg><use href="#preview-off" xlink:href="#preview-off"/></svg></a>
233
234
  <a href="./svg/preview-on.svg"><svg><use href="#preview-on" xlink:href="#preview-on"/></svg></a>
@@ -306,7 +307,7 @@
306
307
  <a href="./svg/world.svg"><svg><use href="#world" xlink:href="#world"/></svg></a>
307
308
  <a href="./svg/wrench.svg"><svg><use href="#wrench" xlink:href="#wrench"/></svg></a>
308
309
  <a href="./svg/youtube.svg"><svg><use href="#youtube" xlink:href="#youtube"/></svg></a>
309
- <svg data-pdsicons="3.1.0" style="display:none">
310
+ <svg data-pdsicons="3.3.0-rc.0" style="display:none">
310
311
  <style>
311
312
  .pdsicon {
312
313
  fill: currentColor;
@@ -510,6 +511,7 @@
510
511
  <symbol id="play-outline" viewBox="0 0 16 16" class="pdsicon"><path fill-rule="evenodd" d="M3.109.084a.8.8 0 0 1 .838.076l9.6 7.2a.8.8 0 0 1 0 1.28l-9.6 7.2a.8.8 0 0 1-1.28-.64V.8a.8.8 0 0 1 .442-.716ZM4.267 2.4v11.2L11.733 8 4.267 2.4Z"/></symbol>
511
512
  <symbol id="play-store" viewBox="0 0 16 16" class="pdsicon"><path d="M15.022 7.373c-.1-.2-.301-.3-.502-.502L2.683.151c-.4-.201-.902-.201-1.304 0-.1.1-.3.2-.4.4-.101.201-.202.402-.202.603v13.542c0 .2.1.401.201.602.1.2.301.3.502.501.2.1.4.201.602.201.2 0 .4-.1.601-.2L14.52 8.977c.201 0 .402-.2.502-.401.1-.2.2-.401.2-.602 0-.2-.1-.401-.2-.602Zm-1.404.602L11.21 9.379 9.806 7.975 11.21 6.57l2.408 1.404Zm-3.612 2.107L4.69 13.09l4.113-4.113 1.203 1.104ZM4.69 2.859l5.316 3.01-1.203 1.103L4.69 2.859ZM7.9 7.975l-5.718 5.718V2.257L7.9 7.975Z"/></symbol>
512
513
  <symbol id="plug" viewBox="0 0 16 16" class="pdsicon"><path fill-rule="evenodd" d="M12.985 2.073a4 4 0 0 0-5.147.432L6.367 3.976l5.657 5.657 1.471-1.47a4 4 0 0 0 .432-5.147l1.683-1.683-.943-.942-1.682 1.682Zm-5.652 7.65L6.276 8.668 7.61 7.333l-.942-.942-1.334 1.333-1.357-1.357-1.471 1.47a4 4 0 0 0-.432 5.147L.39 14.667l.942.943 1.683-1.683a4 4 0 0 0 5.146-.432l1.471-1.471-1.357-1.357L9.61 9.333l-.942-.943-1.334 1.334Zm-.942.944L5.333 9.609l-.942-.942-.415-.415-.529.529a2.667 2.667 0 0 0 3.772 3.772l.529-.529-.415-.414-.942-.943Zm2.39-7.22a2.667 2.667 0 0 1 3.772 3.772l-.529.529-3.772-3.772.529-.529Z"/></symbol>
514
+ <symbol id="premium" viewBox="0 0 16 16" class="pdsicon"><path fill-rule="evenodd" d="M16 1.057V10H0V1.057l4.041 4.041L8 1.798l3.959 3.3L16 1.058ZM0 12.667v-1.334h16v1.334A1.334 1.334 0 0 1 14.667 14H1.333A1.334 1.334 0 0 1 0 12.667Z"/></symbol>
513
515
  <symbol id="present" viewBox="0 0 16 16" class="pdsicon"><path fill-rule="evenodd" d="M3.667 1.62a1.058 1.058 0 0 1 .777-.286c.993 0 1.706.62 2.21 1.372.144.214.265.43.363.628h-2.67a1.058 1.058 0 0 1-1.013-1c.014-.272.134-.528.333-.715ZM2.245 3.333A2.39 2.39 0 0 1 2 2.356v-.044A2.391 2.391 0 0 1 4.455.001c1.63.004 2.692 1.048 3.306 1.961.087.129.166.257.239.383a6.54 6.54 0 0 1 .238-.383C8.852 1.05 9.914.005 11.545.001a2.391 2.391 0 0 1 2.454 2.355 2.39 2.39 0 0 1-.245.978h1.579c.368 0 .666.298.666.667v2.666a.667.667 0 0 1-.667.667H8.666v7.333h4a.667.667 0 0 0 .667-.667V8.667a.667.667 0 0 1 1.333 0V14a2 2 0 0 1-2 2H3.333a2 2 0 0 1-2-2V8.667a.667.667 0 1 1 1.334 0V14a.667.667 0 0 0 .666.667h4V7.334H.667A.667.667 0 0 1 0 6.667V4.001c0-.369.298-.667.667-.667h1.578Zm2.081 1.333H1.333v1.334h6V4.667H4.454a2.388 2.388 0 0 1-.128 0Zm4.34 0v1.334h6V4.667h-2.993a2.385 2.385 0 0 1-.128 0H8.666Zm2.986-1.333a1.058 1.058 0 0 0 1.013-1 1.058 1.058 0 0 0-1.11-1c-.993 0-1.706.62-2.21 1.372-.144.214-.265.43-.363.628h2.67Z"/></symbol>
514
516
  <symbol id="preview-off" viewBox="0 0 16 16" class="pdsicon"><path d="M15.247 7.667c-.067-.12-1.067-1.827-2.76-3.214l1.986-1.986a.664.664 0 1 0-.94-.94l-2.146 2.146C10.407 3.087 9.273 2.667 8 2.667c-4.34 0-7.127 4.8-7.247 5a.65.65 0 0 0 0 .66c.067.12 1.067 1.826 2.76 3.213l-1.986 1.987c-.26.26-.26.68 0 .94.133.133.3.2.473.2s.34-.067.473-.194l2.147-2.146c.973.586 2.107 1.006 3.38 1.006 4.34 0 7.127-4.8 7.247-5a.696.696 0 0 0 0-.666ZM2.12 8C2.793 6.987 5.02 4 8 4c.873 0 1.68.26 2.407.653l-1.06 1.06c-.4-.233-.854-.38-1.347-.38A2.666 2.666 0 0 0 5.333 8c0 .493.147.947.38 1.347l-1.246 1.246C3.313 9.673 2.487 8.547 2.12 8Zm7.213 0c0 .733-.6 1.333-1.333 1.333-.12 0-.233-.02-.34-.046L9.287 7.66c.026.107.046.22.046.34ZM6.667 8c0-.733.6-1.333 1.333-1.333.12 0 .233.02.34.046L6.713 8.34A1.396 1.396 0 0 1 6.667 8ZM8 12c-.873 0-1.68-.26-2.407-.653l1.06-1.06c.4.233.854.38 1.347.38A2.666 2.666 0 0 0 10.667 8c0-.493-.147-.947-.38-1.347l1.246-1.246c1.154.92 1.98 2.046 2.34 2.593-.666 1.013-2.893 4-5.873 4Z"/></symbol>
515
517
  <symbol id="preview-on" viewBox="0 0 16 16" class="pdsicon"><path fill-rule="evenodd" d="M1.585 7.818A13.344 13.344 0 0 0 3.241 9.85c1.221 1.221 2.863 2.333 4.76 2.333 1.895 0 3.537-1.112 4.758-2.333a13.347 13.347 0 0 0 1.656-2.03 13.348 13.348 0 0 0-1.656-2.031C11.539 4.566 9.896 3.454 8 3.454c-1.896 0-3.538 1.111-4.758 2.332a13.345 13.345 0 0 0-1.657 2.031Zm13.688 0 .631-.361-.001-.002-.003-.005-.008-.014a13.813 13.813 0 0 0-.138-.225 14.797 14.797 0 0 0-1.967-2.452C12.462 3.434 10.467 2 8 2 5.532 2 3.538 3.434 2.213 4.759A14.8 14.8 0 0 0 .246 7.21a8.859 8.859 0 0 0-.138.225L.1 7.45l-.003.005v.001s-.001.001.63.362l-.631-.36a.727.727 0 0 0 0 .721l.631-.36-.631.36.001.003.003.004.008.014a5.202 5.202 0 0 0 .138.226 14.8 14.8 0 0 0 1.967 2.452c1.325 1.325 3.32 2.758 5.787 2.758 2.468 0 4.462-1.433 5.787-2.758a14.797 14.797 0 0 0 1.967-2.452 8.904 8.904 0 0 0 .138-.226l.008-.014.003-.004V8.18l-.63-.362Zm0 0 .631.361a.728.728 0 0 0 0-.722l-.631.361Z"/><path fill-rule="evenodd" d="M8 6.364a1.455 1.455 0 1 0 0 2.909 1.455 1.455 0 0 0 0-2.91ZM5.091 7.818a2.91 2.91 0 1 1 5.818 0 2.91 2.91 0 0 1-5.818 0Z"/></symbol>
@@ -558,7 +560,7 @@
558
560
  <symbol id="tablet-landscape" viewBox="0 0 16 16" class="pdsicon"><path fill-rule="evenodd" d="M14.667 13.333A.667.667 0 0 1 14 14H2a.666.666 0 0 1-.667-.667V2.667A.667.667 0 0 1 2 2h12a.667.667 0 0 1 .667.667v10.666Zm.747 1.415A2 2 0 0 0 16 13.333V2.667a2 2 0 0 0-2-2H2a2 2 0 0 0-2 2v10.666a2 2 0 0 0 2 2h12a2 2 0 0 0 1.414-.585Z"/><path d="M12 8a.667.667 0 1 1 1.333 0A.667.667 0 0 1 12 8Z"/></symbol>
559
561
  <symbol id="tablet-portrait" viewBox="0 0 16 16" class="pdsicon"><path fill-rule="evenodd" d="M2.667 14.667A.667.667 0 0 1 2 14V2a.667.667 0 0 1 .667-.667h10.666A.667.667 0 0 1 14 2v12a.667.667 0 0 1-.667.667H2.667Zm-1.415.747A2 2 0 0 0 2.667 16h10.666a2 2 0 0 0 2-2V2a2 2 0 0 0-2-2H2.667a2 2 0 0 0-2 2v12a2 2 0 0 0 .585 1.414Z"/><path d="M8 12a.667.667 0 1 1 0 1.333A.667.667 0 0 1 8 12Z"/></symbol>
560
562
  <symbol id="text-styles" viewBox="0 0 16 16" class="pdsicon"><path d="M7.814 13.312a.694.694 0 1 0 1.305-.472l-3.36-9.184A1 1 0 0 0 4.82 3h-.18a1 1 0 0 0-.94.656L.337 12.851a.685.685 0 1 0 1.29.461l.841-2.414a.2.2 0 0 1 .19-.134h4.104a.2.2 0 0 1 .188.133l.864 2.415ZM4.508 5.085a.2.2 0 0 1 .377-.001l1.434 4.03a.2.2 0 0 1-.189.267H3.286a.2.2 0 0 1-.189-.266l1.41-4.03ZM10.23 11.812c0 1.155.88 2.188 2.249 2.188.922 0 1.532-.412 1.898-.837.082-.095.28.09.29.216.024.302.271.393.574.393h.019c.39 0 .686-.347.667-.736a9.617 9.617 0 0 1-.01-.464V8.91c0-1.428-.783-2.674-2.795-2.674-1.258 0-2.296.728-2.643 1.83-.095.303.118.598.425.676.38.097.743-.182.924-.53.241-.463.685-.76 1.322-.76 1.02 0 1.453.592 1.453 1.306 0 .259-.112.486-.517.547l-1.817.289c-1.16.182-2.04.912-2.04 2.218Zm2.43.988c-.67 0-1.09-.517-1.09-1.064 0-.653.42-1.003.979-1.094l1.822-.296a.2.2 0 0 1 .232.197v.1c0 1.595-.867 2.157-1.942 2.157Z"/></symbol>
561
- <symbol id="theme-store" viewBox="0 0 16 16" class="pdsicon"><path fill-rule="evenodd" d="M2.095.99c.12-.2.337-.323.572-.323h10.666c.235 0 .451.123.572.323l2 3.334a.667.667 0 0 1 .095.341 2.661 2.661 0 0 1-4.443 1.983A2.65 2.65 0 0 1 8 6.649a2.651 2.651 0 0 1-3.557-.001A2.66 2.66 0 0 1 0 4.665c0-.12.033-.238.095-.341l2-3.334ZM3.045 2 1.342 4.835a1.328 1.328 0 0 0 2.506.431.667.667 0 0 1 1.193.002 1.318 1.318 0 0 0 2.36 0 .667.667 0 0 1 1.195 0 1.318 1.318 0 0 0 2.361 0 .667.667 0 0 1 1.193-.002 1.327 1.327 0 0 0 2.506-.431L12.956 2H3.044ZM2.667 8c.368 0 .666.298.666.667V14H6v-3.333c0-.368.298-.667.667-.667h2.666c.369 0 .667.299.667.667V14h2.667V8.667a.667.667 0 1 1 1.333 0v6a.667.667 0 0 1-.667.666H2.667A.667.667 0 0 1 2 14.667v-6C2 8.298 2.298 8 2.667 8Zm4.666 6h1.334v-2.667H7.333V14Z"/></symbol>
563
+ <symbol id="theme-store" viewBox="0 0 16 16" class="pdsicon"><path fill-rule="evenodd" d="M2.095.99c.12-.2.337-.323.572-.323h10.666c.235 0 .451.123.572.323l2 3.334a.667.667 0 0 1 .095.341 2.661 2.661 0 0 1-4.443 1.983A2.651 2.651 0 0 1 8 6.649a2.65 2.65 0 0 1-3.557-.001A2.661 2.661 0 0 1 0 4.665c0-.12.033-.238.095-.341l2-3.334ZM3.045 2 1.342 4.835a1.328 1.328 0 0 0 2.506.431.667.667 0 0 1 1.193.002 1.318 1.318 0 0 0 2.36 0 .667.667 0 0 1 1.195 0 1.318 1.318 0 0 0 2.361 0 .667.667 0 0 1 1.193-.002 1.328 1.328 0 0 0 2.506-.431L12.956 2H3.044ZM2.667 8c.368 0 .666.298.666.667V14H6v-3.333c0-.368.298-.667.667-.667h2.666c.369 0 .667.299.667.667V14h2.667V8.667a.667.667 0 1 1 1.333 0v6a.667.667 0 0 1-.667.666H2.667A.667.667 0 0 1 2 14.667v-6C2 8.298 2.298 8 2.667 8Zm4.666 6h1.334v-2.667H7.333V14Z"/></symbol>
562
564
  <symbol id="theme-store-filled" viewBox="0 0 16 16" class="pdsicon"><g clip-path="url(#a)"><path fill-rule="evenodd" d="m13.905.657 2 3.333a.667.667 0 0 1 .095.343 2.661 2.661 0 0 1-4.444 1.984 2.65 2.65 0 0 1-3.558 0 2.65 2.65 0 0 1-3.555 0A2.65 2.65 0 0 1 2.661 7h-.006A2.662 2.662 0 0 1 0 4.333c0-.12.033-.24.095-.343l2-3.333a.667.667 0 0 1 .572-.324h10.666a.667.667 0 0 1 .572.324Zm-2.347 7.258c.555.275 1.166.419 1.786.418.22-.003.44-.024.656-.062V15a.666.666 0 0 1-.667.667h-4v-4H6.667v4h-4A.667.667 0 0 1 2 15V8.273c.218.038.44.058.66.06a3.993 3.993 0 0 0 1.783-.416c.164.08.333.15.506.209a3.959 3.959 0 0 0 3.042-.206L8 7.917a3.965 3.965 0 0 0 3.55.003l.009-.005Z"/></g><defs><clipPath id="a"><path d="M0 0h16v16H0z"/></clipPath></defs></symbol>
563
565
  <symbol id="thumbs-down" viewBox="0 0 16 16" class="pdsicon"><path fill-rule="evenodd" d="M.667 0A.667.667 0 0 0 0 .667V8c0 .368.298.667.667.667H3.49l1.866 6.842c.079.29.342.491.643.491a2.667 2.667 0 0 0 2.667-2.667V10H13a2.667 2.667 0 0 0 2.636-3.072l-.718-4.667A2.667 2.667 0 0 0 12.285 0H.667Zm2.666 1.333h-2v6h2v-6Zm1.334 6.578V1.333h7.617A1.333 1.333 0 0 1 13.6 2.464l.718 4.667A1.333 1.333 0 0 1 13 8.667H8a.667.667 0 0 0-.667.666v4a1.333 1.333 0 0 1-.849 1.243L4.667 7.91Z"/></symbol>
564
566
  <symbol id="thumbs-down-filled" viewBox="0 0 16 16" class="pdsicon"><path fill-rule="evenodd" d="M14.115 9.757a2.667 2.667 0 0 0 1.522-2.829l-.717-4.667A2.653 2.653 0 0 0 12.284 0H4v8.667l2.023 6.842a.667.667 0 0 0 .644.491c1.47 0 2-1.196 2-2.667V10H13c.385 0 .765-.083 1.115-.243ZM.667 8.667h2V0h-2A.667.667 0 0 0 0 .667V8a.667.667 0 0 0 .667.667Z"/></symbol>
@@ -53,6 +53,13 @@ const uniqueTime = (key, measureText) => {
53
53
  }
54
54
  };
55
55
  const HYDRATED_CSS = '{visibility:hidden}.hydrated{visibility:inherit}';
56
+ /**
57
+ * Constant for styles to be globally applied to `slot-fb` elements for pseudo-slot behavior.
58
+ *
59
+ * Two cascading rules must be used instead of a `:not()` selector due to Stencil browser
60
+ * support as of Stencil v4.
61
+ */
62
+ const SLOT_FB_CSS = 'slot-fb{display:contents}slot-fb[hidden]{display:none}';
56
63
  const XLINK_NS = 'http://www.w3.org/1999/xlink';
57
64
  /**
58
65
  * Default style mode id
@@ -279,6 +286,10 @@ const addStyle = (styleContainerNode, cmpMeta, mode) => {
279
286
  }
280
287
  styleContainerNode.insertBefore(styleElm, styleContainerNode.querySelector('link'));
281
288
  }
289
+ // Add styles for `slot-fb` elements if we're using slots outside the Shadow DOM
290
+ if (cmpMeta.$flags$ & 4 /* CMP_FLAGS.hasSlotRelocation */) {
291
+ styleElm.innerHTML += SLOT_FB_CSS;
292
+ }
282
293
  if (appliedStyles) {
283
294
  appliedStyles.add(scopeId);
284
295
  }
@@ -409,11 +420,19 @@ const setAccessor = (elm, memberName, oldValue, newValue, isSvg, flags) => {
409
420
  // except for the first character, we keep the event name case
410
421
  memberName = ln[2] + memberName.slice(3);
411
422
  }
412
- if (oldValue) {
413
- plt.rel(elm, memberName, oldValue, false);
414
- }
415
- if (newValue) {
416
- plt.ael(elm, memberName, newValue, false);
423
+ if (oldValue || newValue) {
424
+ // Need to account for "capture" events.
425
+ // If the event name ends with "Capture", we'll update the name to remove
426
+ // the "Capture" suffix and make sure the event listener is setup to handle the capture event.
427
+ const capture = memberName.endsWith(CAPTURE_EVENT_SUFFIX);
428
+ // Make sure we only replace the last instance of "Capture"
429
+ memberName = memberName.replace(CAPTURE_EVENT_REGEX, '');
430
+ if (oldValue) {
431
+ plt.rel(elm, memberName, oldValue, capture);
432
+ }
433
+ if (newValue) {
434
+ plt.ael(elm, memberName, newValue, capture);
435
+ }
417
436
  }
418
437
  }
419
438
  else {
@@ -435,7 +454,11 @@ const setAccessor = (elm, memberName, oldValue, newValue, isSvg, flags) => {
435
454
  elm[memberName] = newValue;
436
455
  }
437
456
  }
438
- catch (e) { }
457
+ catch (e) {
458
+ /**
459
+ * in case someone tries to set a read-only property, e.g. "namespaceURI", we just ignore it
460
+ */
461
+ }
439
462
  }
440
463
  /**
441
464
  * Need to manually update attribute if:
@@ -474,7 +497,14 @@ const setAccessor = (elm, memberName, oldValue, newValue, isSvg, flags) => {
474
497
  }
475
498
  };
476
499
  const parseClassListRegex = /\s/;
500
+ /**
501
+ * Parsed a string of classnames into an array
502
+ * @param value className string, e.g. "foo bar baz"
503
+ * @returns list of classes, e.g. ["foo", "bar", "baz"]
504
+ */
477
505
  const parseClassList = (value) => (!value ? [] : value.split(parseClassListRegex));
506
+ const CAPTURE_EVENT_SUFFIX = 'Capture';
507
+ const CAPTURE_EVENT_REGEX = new RegExp(CAPTURE_EVENT_SUFFIX + '$');
478
508
  const updateElement = (oldVnode, newVnode, isSvgMode, memberName) => {
479
509
  // if the element passed in is a shadow root, which is a document fragment
480
510
  // then we want to be adding attrs/props to the shadow root's "host" element
@@ -883,9 +913,9 @@ const patch = (oldVNode, newVNode) => {
883
913
  }
884
914
  };
885
915
  /**
886
- * 'Nullify' any VDom `ref` callbacks on a VDom node or its children by
887
- * calling them with `null`. This signals that the DOM element corresponding to
888
- * the VDom node has been removed from the DOM.
916
+ * 'Nullify' any VDom `ref` callbacks on a VDom node or its children by calling
917
+ * them with `null`. This signals that the DOM element corresponding to the VDom
918
+ * node has been removed from the DOM.
889
919
  *
890
920
  * @param vNode a virtual DOM node
891
921
  */
@@ -1252,13 +1282,13 @@ const setValue = (ref, propName, newVal, cmpMeta) => {
1252
1282
  */
1253
1283
  const proxyComponent = (Cstr, cmpMeta, flags) => {
1254
1284
  var _a;
1285
+ const prototype = Cstr.prototype;
1255
1286
  if (cmpMeta.$members$) {
1256
1287
  if (Cstr.watchers) {
1257
1288
  cmpMeta.$watchers$ = Cstr.watchers;
1258
1289
  }
1259
1290
  // It's better to have a const than two Object.entries()
1260
1291
  const members = Object.entries(cmpMeta.$members$);
1261
- const prototype = Cstr.prototype;
1262
1292
  members.map(([memberName, [memberFlags]]) => {
1263
1293
  if ((memberFlags & 31 /* MEMBER_FLAGS.Prop */ ||
1264
1294
  ((flags & 2 /* PROXY_FLAGS.proxyState */) && memberFlags & 32 /* MEMBER_FLAGS.State */))) {
@@ -1281,6 +1311,7 @@ const proxyComponent = (Cstr, cmpMeta, flags) => {
1281
1311
  const attrNameToPropName = new Map();
1282
1312
  prototype.attributeChangedCallback = function (attrName, oldValue, newValue) {
1283
1313
  plt.jmp(() => {
1314
+ var _a;
1284
1315
  const propName = attrNameToPropName.get(attrName);
1285
1316
  // In a web component lifecycle the attributeChangedCallback runs prior to connectedCallback
1286
1317
  // in the case where an attribute was set inline.
@@ -1336,11 +1367,12 @@ const proxyComponent = (Cstr, cmpMeta, flags) => {
1336
1367
  // 1. The instance is ready
1337
1368
  // 2. The watchers are ready
1338
1369
  // 3. The value has changed
1339
- if (!(flags & 8 /* HOST_FLAGS.isConstructingInstance */) &&
1370
+ if (flags &&
1371
+ !(flags & 8 /* HOST_FLAGS.isConstructingInstance */) &&
1340
1372
  flags & 128 /* HOST_FLAGS.isWatchReady */ &&
1341
1373
  newValue !== oldValue) {
1342
1374
  const instance = hostRef.$lazyInstance$ ;
1343
- const entry = cmpMeta.$watchers$[attrName];
1375
+ const entry = (_a = cmpMeta.$watchers$) === null || _a === void 0 ? void 0 : _a[attrName];
1344
1376
  entry === null || entry === void 0 ? void 0 : entry.forEach((callbackName) => {
1345
1377
  if (instance[callbackName] != null) {
1346
1378
  instance[callbackName].call(instance, newValue, oldValue, attrName);
@@ -1362,10 +1394,11 @@ const proxyComponent = (Cstr, cmpMeta, flags) => {
1362
1394
  ...members
1363
1395
  .filter(([_, m]) => m[0] & 15 /* MEMBER_FLAGS.HasAttribute */)
1364
1396
  .map(([propName, m]) => {
1397
+ var _a;
1365
1398
  const attrName = m[1] || propName;
1366
1399
  attrNameToPropName.set(attrName, propName);
1367
1400
  if (m[0] & 512 /* MEMBER_FLAGS.ReflectAttr */) {
1368
- cmpMeta.$attrsToReflect$.push([propName, attrName]);
1401
+ (_a = cmpMeta.$attrsToReflect$) === null || _a === void 0 ? void 0 : _a.push([propName, attrName]);
1369
1402
  }
1370
1403
  return attrName;
1371
1404
  }),
@@ -1374,7 +1407,18 @@ const proxyComponent = (Cstr, cmpMeta, flags) => {
1374
1407
  }
1375
1408
  return Cstr;
1376
1409
  };
1377
- const initializeComponent = async (elm, hostRef, cmpMeta, hmrVersionId, Cstr) => {
1410
+ /**
1411
+ * Initialize a Stencil component given a reference to its host element, its
1412
+ * runtime bookkeeping data structure, runtime metadata about the component,
1413
+ * and (optionally) an HMR version ID.
1414
+ *
1415
+ * @param elm a host element
1416
+ * @param hostRef the element's runtime bookkeeping object
1417
+ * @param cmpMeta runtime metadata for the Stencil component
1418
+ * @param hmrVersionId an (optional) HMR version ID
1419
+ */
1420
+ const initializeComponent = async (elm, hostRef, cmpMeta, hmrVersionId) => {
1421
+ let Cstr;
1378
1422
  // initializeComponent
1379
1423
  if ((hostRef.$flags$ & 32 /* HOST_FLAGS.hasInitializedComponent */) === 0) {
1380
1424
  // Let the runtime know that the component has been initialized
@@ -1532,12 +1576,13 @@ const bootstrapLazy = (lazyBundles, options = {}) => {
1532
1576
  const customElements = win.customElements;
1533
1577
  const head = doc.head;
1534
1578
  const metaCharset = /*@__PURE__*/ head.querySelector('meta[charset]');
1535
- const visibilityStyle = /*@__PURE__*/ doc.createElement('style');
1579
+ const dataStyles = /*@__PURE__*/ doc.createElement('style');
1536
1580
  const deferredConnectedCallbacks = [];
1537
1581
  let appLoadFallback;
1538
1582
  let isBootstrapping = true;
1539
1583
  Object.assign(plt, options);
1540
1584
  plt.$resourcesUrl$ = new URL(options.resourcesUrl || './', doc.baseURI).href;
1585
+ let hasSlotRelocation = false;
1541
1586
  lazyBundles.map((lazyBundle) => {
1542
1587
  lazyBundle[1].map((compactMeta) => {
1543
1588
  var _a;
@@ -1547,6 +1592,11 @@ const bootstrapLazy = (lazyBundles, options = {}) => {
1547
1592
  $members$: compactMeta[2],
1548
1593
  $listeners$: compactMeta[3],
1549
1594
  };
1595
+ // Check if we are using slots outside the shadow DOM in this component.
1596
+ // We'll use this information later to add styles for `slot-fb` elements
1597
+ if (cmpMeta.$flags$ & 4 /* CMP_FLAGS.hasSlotRelocation */) {
1598
+ hasSlotRelocation = true;
1599
+ }
1550
1600
  {
1551
1601
  cmpMeta.$members$ = compactMeta[2];
1552
1602
  }
@@ -1603,15 +1653,25 @@ const bootstrapLazy = (lazyBundles, options = {}) => {
1603
1653
  }
1604
1654
  });
1605
1655
  });
1656
+ // Add styles for `slot-fb` elements if any of our components are using slots outside the Shadow DOM
1657
+ if (hasSlotRelocation) {
1658
+ dataStyles.innerHTML += SLOT_FB_CSS;
1659
+ }
1660
+ // Add hydration styles
1606
1661
  {
1607
- visibilityStyle.innerHTML = cmpTags + HYDRATED_CSS;
1608
- visibilityStyle.setAttribute('data-styles', '');
1662
+ dataStyles.innerHTML += cmpTags + HYDRATED_CSS;
1663
+ }
1664
+ // If we have styles, add them to the DOM
1665
+ if (dataStyles.innerHTML.length) {
1666
+ dataStyles.setAttribute('data-styles', '');
1609
1667
  // Apply CSP nonce to the style tag if it exists
1610
1668
  const nonce = (_a = plt.$nonce$) !== null && _a !== void 0 ? _a : queryNonceMetaTagContent(doc);
1611
1669
  if (nonce != null) {
1612
- visibilityStyle.setAttribute('nonce', nonce);
1670
+ dataStyles.setAttribute('nonce', nonce);
1613
1671
  }
1614
- head.insertBefore(visibilityStyle, metaCharset ? metaCharset.nextSibling : head.firstChild);
1672
+ // Insert the styles into the document head
1673
+ // NOTE: this _needs_ to happen last so we can ensure the nonce (and other attributes) are applied
1674
+ head.insertBefore(dataStyles, metaCharset ? metaCharset.nextSibling : head.firstChild);
1615
1675
  }
1616
1676
  // Process deferred connectedCallbacks now all components have been registered
1617
1677
  isBootstrapping = false;
@@ -1763,7 +1823,7 @@ const flush = () => {
1763
1823
  }
1764
1824
  }
1765
1825
  };
1766
- const nextTick = /*@__PURE__*/ (cb) => promiseResolve().then(cb);
1826
+ const nextTick = (cb) => promiseResolve().then(cb);
1767
1827
  const writeTask = /*@__PURE__*/ queueTask(queueDomWrites, true);
1768
1828
 
1769
1829
  exports.Host = Host;
@@ -1775,4 +1835,4 @@ exports.promiseResolve = promiseResolve;
1775
1835
  exports.registerInstance = registerInstance;
1776
1836
  exports.setNonce = setNonce;
1777
1837
 
1778
- //# sourceMappingURL=index-b35d5b0f.js.map
1838
+ //# sourceMappingURL=index-17212f65.js.map