@six-group/ui-library 0.0.0-insider.c4e8588 → 0.0.0-insider.c8fa9a3

package/dist/collection/assets/pictograms/umbrella.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 510.2 510.2"><path d="M270.4 116.9V96.3H242v20.5c-78.8 7-141 73.3-141 153.8h28.3a20.8 20.8 0 1 1 41.6 0H199.9a20.8 20.8 0 1 1 41.6 0h.1l-.9 84.3c-.3 32.9-5 36.6-7.8 38.9l-25.1 20 17.6 22.2 25.1-20c13.4-10.7 18.3-26.6 18.6-60.8l.9-84.6a20.8 20.8 0 1 1 41.6 0H340.1a20.8 20.8 0 1 1 41.6 0H410a154.8 154.8 0 0 0-139.6-153.7zm90.4 104.6a48.8 48.8 0 0 0-35 14.7 48.8 48.8 0 0 0-70 0 48.8 48.8 0 0 0-70.3.3 49 49 0 0 0-46.7-13.7 126.2 126.2 0 0 1 233.4 0c-3.7-.8-7.5-1.3-11.4-1.3z"></path></svg>

package/dist/collection/assets/pictograms/unlock.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 510.2 510.2"><path d="M156.2 426.2h198.4a42.6 42.6 0 0 0 42.5-42.5V241.9a42.6 42.6 0 0 0-42.5-42.5H198.7V164a56.7 56.7 0 0 1 113.4 0h28.3a85 85 0 0 0-170 0v35.4h-14.2a42.6 42.6 0 0 0-42.5 42.5v141.7a42.6 42.6 0 0 0 42.5 42.6zM142 241.9c0-7.8 6.4-14.2 14.2-14.2h198.4c7.8 0 14.2 6.4 14.2 14.2v141.7c0 7.8-6.4 14.2-14.2 14.2H156.2c-7.8 0-14.2-6.4-14.2-14.2V241.9z"></path><path d="M241.2 256.1h28.3V327h-28.3z"></path></svg>

package/dist/collection/assets/pictograms/upload.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 510.2 510.2"><path d="M396.9 269.3h-28.3v28.3h28.3v99.2H113.4v-99.2h28.3v-28.3h-28.3A28.4 28.4 0 0 0 85 297.6v99.2a28.3 28.3 0 0 0 28.3 28.3h283.5a28.3 28.3 0 0 0 28.3-28.3v-99.2a28.2 28.2 0 0 0-28.2-28.3z"></path><path d="M347 175.2l-62.2-52.1v121.5a90.1 90.1 0 0 1-32.4 69.4l-36.3 30.4-18.2-21.7 36.3-30.4a62.4 62.4 0 0 0 22.3-47.7V123l-62.3 52.1-18.2-21.7 94.6-79.2 94.6 79.2-18.2 21.8z"></path></svg>

package/dist/collection/assets/pictograms/usb.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 510.2 510.2"><path d="M298.4 147.4v48.2h9.9l-.2 30.6a28.2 28.2 0 0 1-10.3 21.6l-27.1 24 .3-157.4h20.6l-35.1-35.1-35.1 35.1h21.2l-.3 200.7-27.8-24.6-.4-.3a28.2 28.2 0 0 1-10.3-21.6l-.2-26.4a25.5 25.5 0 1 0-28.3.2l.2 26.4a57 57 0 0 0 20.4 43.1l46.3 41.1v13.6a34.6 34.6 0 0 0 14.1 66 34.4 34.4 0 0 0 14.2-65.9l.1-56.8 45.4-40.2a56.6 56.6 0 0 0 20.4-43.1l.2-30.9h10v-48.2h-48.2z"></path></svg>

package/dist/collection/assets/pictograms/viena.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 510.2 510.2"><path d="M376 230.5c0-2.4-.1-4.8-.2-7.2 2.7 12 13.5 21 26.3 21.1 14.9 0 27.1-12.3 27.1-27.3l-54 .2c-3.1-28-15.9-53.1-34.9-71.9a27.1 27.1 0 0 0 42.5-22.2l-54.1-.1c0 6.5 2.2 12.4 6 17.1a120.11 120.11 0 0 0-66.5-28.9c8.9-4.4 15-13.9 15-24.5l-54.1.2c0 10.6 6.1 19.8 15 24.3-25.5 2.5-48.7 13.1-67 29.1 3.3-4.5 5.3-10.3 5.3-16.3l-54.1.2a27.1 27.1 0 0 0 27 27.1c5.5 0 10.6-1.6 14.9-4.5a119.6 119.6 0 0 0-33.3 70.4l-53.8.2c0 14.9 12.1 26.8 27 26.8 12.7 0 23.3-8.6 26.3-20.4-.1 2.2-.2 4.3-.2 6.5m0 .1c0 30.5 11.4 58.3 30.2 79.5l-52 .2c0 14.9 12.1 26.8 27 26.8a27.1 27.1 0 0 0 27-24.8c6.6 7.1 14.1 13.4 22.3 18.8l-42.9 83.4h-33.5v11h283.5v-11h-33.2l-43.4-83.3c8.8-5.7 16.9-12.6 23.9-20.4.4 14.5 12.3 26.2 27 26.3 14.9 0 27.1-12.3 27.1-27.3l-53.3.2c18.7-21.2 30.1-49 30.1-79.4m-77.3-5c-.8-9.3-4.7-17.8-10.6-24.4l39.1-39c16 16.6 26.2 38.9 27.4 63.4h-55.9zm-141.1-.1a97.88 97.88 0 0 1 26.9-62.7l39.3 39.3c-5.5 6.5-9 14.6-9.9 23.5l-56.3-.1zm164.5-68.2l-39.1 39c-6.5-5.2-14.6-8.6-23.4-9.3v-55.1c24 .9 45.8 10.4 62.5 25.4zm-69.6 29.9c-9 .8-17.1 4.4-23.6 9.9l-39.3-39.2a98.3 98.3 0 0 1 62.9-25.8v55.1zm0 84.6V329a98.3 98.3 0 0 1-33.1-7l26.4-51.4c2.2.5 4.4.9 6.7 1.1zm7.1.1c2.1-.2 4.2-.5 6.2-.9l26.8 51.3a98.17 98.17 0 0 1-33 6.9v-57.3zm-102.1-39.3h56.4c.6 8.8 4 16.9 9.2 23.4l-40.4 40.3a98.06 98.06 0 0 1-25.2-63.7zm30.2 68.9l37.7-37.6-24.8 48.2c-4.6-3.2-8.9-6.7-12.9-10.6zm153 113H171.8l37.8-73.4c6.3 2.7 12.9 4.8 19.7 6.4 0 14.9 12.1 27 27 27a27.1 27.1 0 0 0 27.1-27h-.3c6.7-1.5 13.1-3.6 19.3-6.2l38.3 73.2zm-54.4-150.1l37.7 37.6c-3.9 3.8-8.2 7.2-12.7 10.3l-25-47.9zm42.7 32.5l-40.1-40.1c5.6-6.6 9.2-15 9.9-24.2h56a98.73 98.73 0 0 1-25.8 64.3z"></path></svg>

package/dist/collection/assets/pictograms/viking.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 510.2 510.2"><path d="M337.2 350.4a15.3 15.3 0 1 1 0 30.6 15.3 15.3 0 0 1 0-30.6zm-79.8 0a15.3 15.3 0 1 1 0 30.6 15.3 15.3 0 0 1 0-30.6zm-79.1 0a15.3 15.3 0 1 1 0 30.6 15.3 15.3 0 0 1 0-30.6z"></path><path d="M409.5 145.1l-.4-60.3-28.3.2.4 60.3c0 8.4-3.6 16.3-10 21.8l18.3 21.6a56.7 56.7 0 0 0 20-43.6z"></path><path d="M125.1 188.6l18.3-21.7a28.3 28.3 0 0 1-10.1-21.7l.2-60.3-28.3-.1-.2 60.4a56 56 0 0 0 20.1 43.4z"></path><path d="M403.2 318.3c0-49.4-14.7-95.9-41.5-131.1-27.6-36.3-64.7-56.3-104.4-56.3s-76.8 20-104.4 56.3c-26.8 35.2-41.5 81.7-41.5 131.1v14.2h.1V424h291.8V318.3zM270.4 160.2c55.3 8.3 99.1 68.7 104.1 143.9H270.4V160.2zm-28.4.4v143.5H140.2c4.9-74.2 47.6-134 101.8-143.5zm132.9 235h-235v-63.2h235v63.2z"></path><circle cx="178.3" cy="365.7" r="15.3"></circle><circle cx="257.4" cy="365.7" r="15.3"></circle><circle cx="337.2" cy="365.7" r="15.3"></circle></svg>

package/dist/collection/assets/pictograms/visibility.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 510.2 510.2"><path d="M281 242.2s0-.1 0 0a25.2 25.2 0 0 0-50.4 0v25.2a25.2 25.2 0 0 0 50.4 0v-25.2z"></path><path d="M427.7 252.6c-.4-2.9-1.8-5.6-4-7.9a353 353 0 0 0-26-23.7l21.8-32.1-23.4-15.9-21.1 31c-12.4-8.4-25-15.5-37.6-21.2l13.1-35.1-26.6-9.9-13 35.2c-13.5-4-27.1-6.6-40.9-7.6v-36.7h-28.3v36.6c-14.6 1-28.5 3.7-41.4 7.4l-13-34.8-26.6 9.9 12.8 34.4a249.8 249.8 0 0 0-38.3 20.6L115 173.1 91.6 189l20.7 30.4c-17 13.7-26.8 24.9-27.9 26.1-3.4 3.9-4.2 9-2.8 13.6.4 2.9 1.8 5.6 4 7.8 53.1 53.1 109.8 80 168.4 80l6.9-.1c96.1-3.4 161.3-77.5 164-80.6a14 14 0 0 0 2.8-13.6zm-168.1 65.9c-49.8 1.7-98.6-19.5-145.2-63.2 19.3-18.4 69.7-59.8 135.1-62.1 49.8-1.8 98.7 19.5 145.5 63.1-19.5 18.5-70.1 60-135.4 62.2z"></path></svg>

package/dist/collection/assets/pictograms/wallet.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 510.2 510.2"><path d="M371.2 150.8H138.7a28.3 28.3 0 0 0-28.3 28.3V335a28.3 28.3 0 0 0 28.3 28.3h232.4a28.3 28.3 0 0 0 28.3-28.3V179.1a28.2 28.2 0 0 0-28.2-28.3zM138.7 335.1V179.2h232.4v39.3H306a37.5 37.5 0 0 0 0 74.8h65.1v41.8H138.7zm232.5-105.6v52.8H306a26.4 26.4 0 1 1 0-52.8h65.2z"></path><circle cx="308.9" cy="255.7" r="14.2"></circle></svg>

package/dist/collection/assets/pictograms/warning.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 510.2 510.2"><path d="M390.1 425.2H120.2c-14.9 0-28.5-7.6-36.3-20.4a42.28 42.28 0 0 1-1.5-41.6l135.1-262.4c7.4-14 21.8-22.8 37.7-22.8 15.9 0 30.3 8.7 37.7 22.8v.1l135 262.3c6.8 13.3 6.3 28.8-1.5 41.6a42.23 42.23 0 0 1-36.3 20.4zM242.6 114l-135 262.2c-3.3 6.4-.7 11.8.5 13.9 1.2 2 4.9 6.8 12.1 6.8h269.9c7.2 0 10.9-4.8 12.1-6.8 1.2-2 3.8-7.5.5-13.9L267.7 114c-2.5-4.7-7.2-7.6-12.5-7.6-5.4 0-10.1 2.8-12.6 7.6z"></path><path d="M240.9 170.1h28.3v134.6h-28.3z"></path><circle cx="255" cy="347.3" r="21.2"></circle></svg>

package/dist/collection/assets/pictograms/way-up.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 510.2 510.2"><path d="M83.2 150.5l17.4 21.3L152 130l-1.1 83.4h-.1l-.7 54.1A51.7 51.7 0 0 1 131 307l-31.5 25.7 17.4 21.3 31.5-25.7a79.3 79.3 0 0 0 29.2-60.4l.7-51.4h.1l1.2-86.1 50.3 43.2 17.9-20.8-81.3-69.9-83.3 67.6z"></path><path d="M340.2 82.9L257 150.5l17.4 21.3 51.4-41.9-1.1 83.4h-.1l-.7 54.1a51.7 51.7 0 0 1-19.1 39.5l-31.5 25.7 17.4 21.3 31.5-25.7a79.3 79.3 0 0 0 29.2-60.4l.7-51.4h.1l1.2-86.1 50.3 43.2 17.9-20.8-81.4-69.8z"></path><path d="M85.4 395.2h340.2v28.3H85.4z"></path></svg>

package/dist/collection/assets/pictograms/wc-handicap.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 510.2 510.2"><path d="M208.6 202.6v60.3c0 15.8 6.9 30.6 19 40.7l28 23.5 13.6-16.3-28-23.5a32 32 0 0 1-11.4-24.4v-60.3h-21.2z"></path><path d="M240.5 188.3a39 39 0 0 0 39-39v-28.8a39 39 0 0 0-78 0v28.8a39 39 0 0 0 39 39zm-17.7-67.8a17.7 17.7 0 1 1 35.4 0v28.8a17.7 17.7 0 1 1-35.4 0v-28.8z"></path><path d="M229.9 428.7a99.4 99.4 0 0 0 99-92.1h9.9c5.9 0 11.4 2.9 14.7 7.9l34.1 51.2 17.7-11.8-34.1-51.2a38.8 38.8 0 0 0-32.4-17.4h-10.6a99.4 99.4 0 0 0-80.5-83.4v21.7a78 78 0 1 1-56.8 8.4v-23.8a99.4 99.4 0 0 0 39 190.5z"></path></svg>

package/dist/collection/assets/pictograms/wc-men.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 510.2 510.2"><path d="M255.1 188.3a39 39 0 0 1-39-39v-28.8a39 39 0 0 1 78 0v28.8a39 39 0 0 1-39 39zm0-85.5c-9.8 0-17.7 7.9-17.7 17.7v28.8a17.7 17.7 0 1 0 35.4 0v-28.8c0-9.8-7.9-17.7-17.7-17.7z"></path><path d="M265.7 297.6H287v127.6h-21.3z"></path><path d="M223.2 297.6h21.3v127.6h-21.3z"></path><path d="M211.4 185.7l-4.6 3.9a53 53 0 0 0-19 40.7v67.4h21.3v-67.4c0-9.5 4.2-18.4 11.4-24.4l4-3.4-13.1-16.8z"></path><path d="M303.4 189.6l-4.5-3.8-14.1 15.9 5 4.2a32 32 0 0 1 11.4 24.4v67.4h21.3v-67.4c-.1-15.8-7-30.6-19.1-40.7z"></path></svg>

package/dist/collection/assets/pictograms/wc-woman.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 510.2 510.2"><path d="M255.1 188.3a39 39 0 0 0 39-39v-28.8a39 39 0 0 0-78 0v28.8a39 39 0 0 0 39 39zm-17.7-67.8a17.7 17.7 0 1 1 35.4 0v28.8a17.7 17.7 0 1 1-35.4 0v-28.8z"></path><path d="M265.7 311.8c0 7.9-.6 15.1-1.6 21.7 2.1 11.9 5.7 21.9 9.2 31.7l2.5 7.1a176 176 0 0 0 11.2-60.6v-14.2h-21.3v14.3z"></path><path d="M244.5 311.8v-14.2h-21.3v14.2c0 29.1 7.4 49.9 13.3 66.5 4.2 11.9 7.9 22.2 7.9 32.7v14.2h21.3V411a115 115 0 0 0-9.2-39.8c-5.6-15.9-12-33.9-12-59.4z"></path><path d="M208.3 230.3c0-9.5 4.2-18.4 11.4-24.4l4.4-3.7-13-16.8-5.1 4.3a53 53 0 0 0-19 40.7v67.4h21.3v-67.5z"></path><path d="M289.8 205.9a32 32 0 0 1 11.4 24.4v67.4h21.3v-67.4c0-15.8-6.9-30.6-19-40.7l-4.5-3.8-14.1 15.9 4.9 4.2z"></path></svg>

package/dist/collection/assets/pictograms/wearables.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 510.2 510.2"><path d="M305.3 341.3h-103a20.6 20.6 0 0 1-20.6-20.6V194.6c0-11.4 9.2-20.6 20.6-20.6h103c11.4 0 20.6 9.2 20.6 20.6v126.1c0 11.4-9.2 20.6-20.6 20.6zm0-146.7h-103v126.1h103V194.6z"></path><path d="M213.3 86.5h81v72.6h-81z"></path><path d="M214 355.3h79.6V427H214z"></path><path d="M266.6 305.1l-4.8-4.8a54.8 54.8 0 0 0 16.1-39c0-14.7-5.7-28.6-16.1-39l4.8-4.8a61.4 61.4 0 0 1 18.1 43.8c0 16.6-6.4 32.2-18.1 43.8z"></path><path d="M253.7 293.5l-4.8-4.8a38.3 38.3 0 0 0 0-53.9l4.8-4.8a45.1 45.1 0 0 1 0 63.5z"></path><path d="M240.7 281l-4.8-4.8a21 21 0 0 0 0-29.6l4.8-4.8a27.6 27.6 0 0 1 0 39.2z"></path><path d="M227.8 270.1l-4.8-4.8a5.6 5.6 0 0 0 0-7.9l4.8-4.8a12.4 12.4 0 0 1 0 17.5z"></path><path d="M332.2 241.8h12v33.1h-12z"></path><path d="M337.9 255.9h23.6v4.7h-23.6z" transform="matrix(.00621 -1 1 .00621 89.3 606.4)"></path></svg>

package/dist/collection/assets/pictograms/webshop.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 510.2 510.2"><path d="M403.9 312.1h-28.3V184.5c0-3.9-3.2-7.1-7.1-7.1H141.7a7.1 7.1 0 0 0-7.1 7.1v127.6h-28.3V184.5a35.5 35.5 0 0 1 35.4-35.4h226.8a35.5 35.5 0 0 1 35.4 35.4v127.6z"></path><path d="M85 333.3v28.3h340.2v-28.3H85zM297.6 351h-85v-7h85v7z"></path><circle cx="237.1" cy="300.9" r="9"></circle><circle cx="280.4" cy="300.9" r="9"></circle><path d="M309.1 230.2a5.3 5.3 0 0 0-4.3-2.2h-66.3v10.8h59.1l-3.5 12.1h-63.7v10.8h60.5l-4.1 13.3-52.9.3c-6.6 0-8.9-1.7-10.7-6.3l-12.5-37.3-1.9-6.1c-3.8-15.1-10.9-16.1-15.9-16.5h-.2l-14.1.1v10.6l11.4.1c5.4 0 6.5 2.3 8.5 8.9l14.5 43.7.1.3c2.7 7 7 13.3 19.6 13.3 0 0 43.9 0 54.7-.3l3.5-.2c1.2 0 2.4-.4 3.3-1.1 1.3-1 2.5-3.8 3.2-5.9 2.2-7.1 12.7-43.8 12.7-43.8.3-1.5 0-3.3-1-4.6z"></path></svg>

package/dist/collection/assets/pictograms/wlan-bluetooth.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 510.2 510.2"><path d="M160.2 142.4l-20-20a186.4 186.4 0 0 0-55 132.8c0 50.2 19.5 97.3 55 132.8l20-20c-30.1-30.1-46.7-70.2-46.7-112.8s16.6-82.7 46.7-112.8z"></path><path d="M181.4 173.1c-21.9 21.9-34 51-34 82s12.1 60.1 34 82l20-20a87 87 0 0 1 0-123.8l-20-20.2z"></path><path d="M370.1 122.3l-20 20c30.1 30.1 46.7 70.2 46.7 112.8s-16.6 82.6-46.7 112.8l20 20c35.5-35.5 55-82.6 55-132.8a187 187 0 0 0-55-132.8z"></path><path d="M328.9 173.1l-20 20a87.6 87.6 0 0 1 0 123.9l20 20a116 116 0 0 0 0-163.9z"></path><circle cx="255" cy="255.8" r="39.4"></circle></svg>

package/dist/collection/assets/pictograms/wlan.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 510.2 510.2"><path d="M433.3 201.8l-20 20a229.2 229.2 0 0 0-163.2-67.6c-61.6 0-119.6 24-163.2 67.6l-20-20c48.9-48.9 114-75.9 183.2-75.9s134.2 26.9 183.2 75.9z"></path><path d="M384.4 256l-20 20a159.6 159.6 0 0 0-225.5 0l-20-20a187.8 187.8 0 0 1 265.5 0z"></path><path d="M332 310.1l-20 20a87 87 0 0 0-123.8 0l-20-20a115.5 115.5 0 0 1 163.8 0z"></path><path d="M286.6 364.3l-20 20a23.2 23.2 0 0 0-33 0l-20-20a51.4 51.4 0 0 1 73 0z"></path></svg>

package/dist/collection/assets/pictograms/x.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 510.2 510.2"><path d="M406.6 124.1L386.5 104 255.3 235.3 123.9 103.8l-20.1 20.1 131.5 131.4-131.5 131.4 20.1 20.1 131.4-131.4 131.2 131.2 20.1-20.1-131.2-131.2z"></path></svg>

package/dist/collection/assets/pictograms/zurich.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 510.2 510.2"><path d="M332.4 342.7c3.9 13.1 5.4 26.5 6 40.1.1 1.2-.7 10.6-.5 12.4l1.8-2.8c25.7-45.2 52.4-98.4 78.1-143.6 5.8-10.2 5.2-20.5-1.5-28.4a21.7 21.7 0 0 0-31.9-1.8 22.4 22.4 0 0 0-1.5 32.8l2.9 2.8-2.1 3.6-50.5 80.1a7.2 7.2 0 0 0-.8 4.8M61.6 230.2c7.7-38.5 30.9-66.5 64.2-86.4a125 125 0 0 1 43.3-14.8c.4-2.1.8-4 1-5.8a6.9 6.9 0 0 1 4.4-5.8 25 25 0 0 1 16.4-1.6c3.7 1 5 2.9 4.8 6.7l-.4 4.5c28.2.2 55.7 2.3 83.2 4.8l-4.7 54.1-21.4.6c-3.1.1-5.4 1.3-6.3 4.4-.9 3.1-.4 6.2 2.5 7.9 2.6 1.5 5.7 3 8.5 3a3170.9 3170.9 0 0 0 69.6-1.5c-3.2 7.7-6.4 14.8-9.1 22-1.1 3-2.8 3.7-5.6 3.7-10.2 0-20.3.4-30.5.3-11-.1-22.1.1-33.1-.8a32.1 32.1 0 0 1-28.7-31.7 32.9 32.9 0 0 1 28.7-33.2l5.2-.4.6-6.6c-10.7-.3-21-.6-31.4-.7-.9 0-27.3.7-27.4 1.7-.8 9.8-3.6 46.5-4 56.3-.4 10 3.9 16.5 13.1 20.4 2.6 1.1 5.4 2 8.1 2.6 15.2 3.3 30.7 3.3 46.2 3.1l14.9-.4c-.9 5-1.4 9.5-2.5 13.9-.6 2.3.3 3.4 2 4.7a157.3 157.3 0 0 1 45 52l1.5 2.5a7112 7112 0 0 0 32.9-52.2c.6-.9.3-2.8-.3-3.9a47.1 47.1 0 0 1-3.8-37.6 50.7 50.7 0 0 1 41.9-35.5 51 51 0 0 1 50.7 19.7c24.9 35.3-1.9 67.2-1.9 67.2L365.6 395h-52.5a141.5 141.5 0 0 0-79.8-135c-1.6-.7-3.4-.9-5.2-1.1-10.7-1-21.5-1.1-31.9-3.1-20.2-3.7-30.3-16.2-31.7-36.8-1.1-17.1-.8-34.1.7-51.1l.9-10.6c-2.1.5-4 .9-5.7 1.5-37 12.7-62.3 37.3-71 75.7-8.7 38.5 2.6 72.2 31.7 98.9 16.4 15 51.9 46.9 68.6 61.6h-38c-8.4-7.5-43-36-51.2-43.6-35.7-32.6-48.4-74-38.9-121.2"></path></svg>

package/dist/collection/collection-manifest.json

@@ -1,5 +1,6 @@
 {
   "entries": [
+    "components/six-alert/six-alert.js",
     "components/six-item-picker/six-item-picker.js",
     "components/six-timepicker/six-timepicker.js",
     "components/six-datepicker/six-datepicker.js",
@@ -7,19 +8,18 @@
     "components/six-dropdown/six-dropdown.js",
     "components/six-file-list-item/six-file-list-item.js",
     "components/six-file-upload/six-file-upload.js",
-    "components/six-header/six-header.js",
+    "components/six-input/six-input.js",
     "components/six-language-switcher/six-language-switcher.js",
     "components/six-stage-indicator/six-stage-indicator.js",
-    "components/six-root/six-root.js",
     "components/six-search-field/six-search-field.js",
     "components/six-select/six-select.js",
     "components/six-tab-group/six-tab-group.js",
-    "components/six-alert/six-alert.js",
     "components/six-avatar/six-avatar.js",
     "components/six-badge/six-badge.js",
     "components/six-button/six-button.js",
     "components/six-card/six-card.js",
     "components/six-checkbox/six-checkbox.js",
+    "components/six-date/six-date.js",
     "components/six-details/six-details.js",
     "components/six-dialog/six-dialog.js",
     "components/six-drawer/six-drawer.js",
@@ -28,10 +28,14 @@
     "components/six-file-list/six-file-list.js",
     "components/six-footer/six-footer.js",
     "components/six-group-label/six-group-label.js",
+    "components/six-header/six-header.js",
+    "components/six-header-dropdown-item/six-header-dropdown-item.js",
+    "components/six-header-item/six-header-item.js",
+    "components/six-header-menu-button/six-header-menu-button.js",
     "components/six-icon/six-icon.js",
     "components/six-icon-button/six-icon-button.js",
-    "components/six-input/six-input.js",
     "components/six-layout-grid/six-layout-grid.js",
+    "components/six-logo/six-logo.js",
     "components/six-main-container/six-main-container.js",
     "components/six-menu-divider/six-menu-divider.js",
     "components/six-menu-item/six-menu-item.js",
@@ -41,6 +45,7 @@
     "components/six-progress-ring/six-progress-ring.js",
     "components/six-radio/six-radio.js",
     "components/six-range/six-range.js",
+    "components/six-root/six-root.js",
     "components/six-sidebar/six-sidebar.js",
     "components/six-sidebar-item/six-sidebar-item.js",
     "components/six-sidebar-item-group/six-sidebar-item-group.js",
@@ -51,13 +56,12 @@
     "components/six-tag/six-tag.js",
     "components/six-textarea/six-textarea.js",
     "components/six-tile/six-tile.js",
-    "components/six-tooltip/six-tooltip.js",
-    "wrappers/set-attributes/set-attributes.js"
+    "components/six-tooltip/six-tooltip.js"
   ],
   "compiler": {
     "name": "@stencil/core",
-    "version": "4.9.0",
-    "typescriptVersion": "5.2.2"
+    "version": "4.29.3",
+    "typescriptVersion": "5.5.4"
   },
   "collections": [],
   "bundles": []

package/dist/collection/components/six-alert/six-alert.css

@@ -6,6 +6,17 @@
   box-sizing: border-box;
 }
 
+/* Hides content visually while still making it available to screen readers */
+.sr-only {
+  clip: rect(0 0 0 0);
+  clip-path: inset(50%);
+  height: 1px;
+  overflow: hidden;
+  position: absolute;
+  white-space: nowrap;
+  width: 1px;
+}
+
 /**
  * @prop --box-shadow: The alert's box shadow.
  */
@@ -44,6 +55,10 @@
   visibility: hidden;
 }
 
+.alert--shadow {
+  box-shadow: var(--six-shadow-medium);
+}
+
 .alert--open {
   opacity: 1;
   transform: none;

package/dist/collection/components/six-alert/six-alert.js

@@ -1,4 +1,5 @@
 import { h } from "@stencil/core";
+import { getSlot } from "../../utils/slot";
 const toastStack = Object.assign(document.createElement('div'), { className: 'six-toast-stack' });
 /**
  * @since 1.0
@@ -16,11 +17,27 @@ const toastStack = Object.assign(document.createElement('div'), { className: 'si
  */
 export class SixAlert {
     constructor() {
+        this.isVisible = false;
+        /** Indicates whether or not the alert is open. You can use this in lieu of the show/hide methods. */
+        this.open = false;
+        /** Set to true to make the alert closable. */
+        this.closable = false;
+        /** The type of alert. */
+        this.type = 'primary';
+        /**
+         * The length of time, in milliseconds, the alert will show before closing itself.
+         * If the user hovers over the toast alert, the timer will pause.
+         * On leaving the element with the mouse, the timer resets.
+         */
+        this.duration = Infinity;
         this.handleCloseClick = () => {
             this.hide();
         };
-        this.handleMouseMove = () => {
-            this.restartAutoHide();
+        this.handleMouseEnter = () => {
+            this.pauseAutoHide();
+        };
+        this.handleMouseLeave = () => {
+            this.resetAutoHide();
         };
         this.handleTransitionEnd = (event) => {
             const target = event.target;
@@ -30,11 +47,6 @@ export class SixAlert {
                 this.open ? this.sixAfterShow.emit() : this.sixAfterHide.emit();
             }
         };
-        this.isVisible = false;
-        this.open = false;
-        this.closable = false;
-        this.type = 'primary';
-        this.duration = Infinity;
     }
     handleOpenChange() {
         this.open ? this.show() : this.hide();
@@ -84,13 +96,33 @@ export class SixAlert {
      * Displays the alert as a toast notification. This will move the alert out of its position in the DOM and, when
      * dismissed, it will be removed from the DOM completely. By storing a reference to the alert, you can reuse it by
      * calling this method again. The returned promise will resolve after the alert is hidden.
+     * @param adjustPosition  If true, the top and right position of the toast stack is shifted according to the
+     *                        six-root header's height and the presence of a vertical scrollbar.
      */
-    async toast() {
+    async toast(adjustPosition = true) {
         return new Promise((resolve) => {
+            var _a;
             if (!toastStack.parentElement) {
                 document.body.append(toastStack);
             }
             toastStack.append(this.host);
+            if (adjustPosition) {
+                const sixRoot = document.querySelector('six-root');
+                const headerSlot = getSlot(sixRoot, 'header');
+                const mainSlot = (_a = sixRoot === null || sixRoot === void 0 ? void 0 : sixRoot.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelector('host main');
+                if (mainSlot != null && mainSlot instanceof HTMLElement) {
+                    const scrollbarWidth = mainSlot.offsetWidth - mainSlot.clientWidth;
+                    toastStack.style.right = `${scrollbarWidth}px`;
+                }
+                if (headerSlot != null) {
+                    const rect = headerSlot === null || headerSlot === void 0 ? void 0 : headerSlot.getBoundingClientRect();
+                    toastStack.style.top = `${rect.top + rect.height}px`;
+                }
+            }
+            else {
+                toastStack.style.top = '0';
+                toastStack.style.right = '0';
+            }
             requestAnimationFrame(() => this.show());
             this.host.addEventListener('six-alert-after-hide', () => {
                 this.host.remove();
@@ -102,14 +134,21 @@ export class SixAlert {
             }, { once: true });
         });
     }
-    restartAutoHide() {
+    pauseAutoHide() {
         clearTimeout(this.autoHideTimeout);
+    }
+    resetAutoHide() {
         if (this.open && this.duration < Infinity) {
             this.autoHideTimeout = window.setTimeout(() => this.hide(), this.duration);
         }
     }
+    restartAutoHide() {
+        this.pauseAutoHide();
+        this.resetAutoHide();
+    }
     render() {
-        return (h("div", { part: "base", class: {
+        const asToast = this.host.closest('.six-toast-stack') != null;
+        return (h("div", { key: 'cd9d14bef5923cf2ec8add1f61e92733aa9dd59f', part: "base", class: {
                 alert: true,
                 'alert--open': this.open,
                 'alert--visible': this.isVisible,
@@ -119,7 +158,8 @@ export class SixAlert {
                 'alert--info': this.type === 'info',
                 'alert--warning': this.type === 'warning',
                 'alert--danger': this.type === 'danger',
-            }, role: "alert", "aria-live": "assertive", "aria-atomic": "true", "aria-hidden": this.open ? 'false' : 'true', onMouseMove: this.handleMouseMove, onTransitionEnd: this.handleTransitionEnd }, h("span", { part: "icon", class: "alert__icon" }, h("slot", { name: "icon" })), h("span", { part: "message", class: "alert__message" }, h("slot", null)), this.closable && (h("span", { class: "alert__close" }, h("six-icon-button", { name: "clear", exportparts: "base:close-button", onClick: this.handleCloseClick })))));
+                'alert--shadow': asToast,
+            }, role: "alert", "aria-live": "assertive", "aria-atomic": "true", "aria-hidden": this.open ? 'false' : 'true', onTransitionEnd: this.handleTransitionEnd, onMouseEnter: this.handleMouseEnter, onMouseLeave: this.handleMouseLeave }, h("span", { key: 'fb6e8cf52eb87ddb1a81a797482457b3afccaa98', part: "icon", class: "alert__icon" }, h("slot", { key: '3d97a399ac05620214ef8a4d6a19c37a103f76a2', name: "icon" })), h("span", { key: '3984ce04838d33a688b6cfafb7827646e0e9d582', part: "message", class: "alert__message" }, h("slot", { key: 'f84ff31b7b74571b2ff9f074b617cb344313939e' })), this.closable && (h("span", { key: '5291d4a747001042ad9882c32427094019e16dbb', class: "alert__close" }, h("six-icon-button", { key: '48a38b0a283400ae84ed95df38a43ee6a41e1fb0', name: "clear", exportparts: "base:close-button", onClick: this.handleCloseClick })))));
     }
     static get is() { return "six-alert"; }
     static get encapsulation() { return "shadow"; }
@@ -137,6 +177,7 @@ export class SixAlert {
         return {
             "open": {
                 "type": "boolean",
+                "attribute": "open",
                 "mutable": true,
                 "complexType": {
                     "original": "boolean",
@@ -149,12 +190,14 @@ export class SixAlert {
                     "tags": [],
                     "text": "Indicates whether or not the alert is open. You can use this in lieu of the show/hide methods."
                 },
-                "attribute": "open",
+                "getter": false,
+                "setter": false,
                 "reflect": true,
                 "defaultValue": "false"
             },
             "closable": {
                 "type": "boolean",
+                "attribute": "closable",
                 "mutable": false,
                 "complexType": {
                     "original": "boolean",
@@ -167,17 +210,25 @@ export class SixAlert {
                     "tags": [],
                     "text": "Set to true to make the alert closable."
                 },
-                "attribute": "closable",
+                "getter": false,
+                "setter": false,
                 "reflect": true,
                 "defaultValue": "false"
             },
             "type": {
                 "type": "string",
+                "attribute": "type",
                 "mutable": false,
                 "complexType": {
-                    "original": "'primary' | 'success' | 'info' | 'warning' | 'danger'",
+                    "original": "AlertType",
                     "resolved": "\"danger\" | \"info\" | \"primary\" | \"success\" | \"warning\"",
-                    "references": {}
+                    "references": {
+                        "AlertType": {
+                            "location": "local",
+                            "path": "/home/runner/work/six-webcomponents/six-webcomponents/libraries/ui-library/src/components/six-alert/six-alert.tsx",
+                            "id": "src/components/six-alert/six-alert.tsx::AlertType"
+                        }
+                    }
                 },
                 "required": false,
                 "optional": false,
@@ -185,12 +236,14 @@ export class SixAlert {
                     "tags": [],
                     "text": "The type of alert."
                 },
-                "attribute": "type",
+                "getter": false,
+                "setter": false,
                 "reflect": true,
                 "defaultValue": "'primary'"
             },
             "duration": {
                 "type": "number",
+                "attribute": "duration",
                 "mutable": false,
                 "complexType": {
                     "original": "number",
@@ -201,9 +254,10 @@ export class SixAlert {
                 "optional": false,
                 "docs": {
                     "tags": [],
-                    "text": "The length of time, in milliseconds, the alert will show before closing itself. If the user interacts with the\nalert before it closes (e.g. moves the mouse over it), the timer will restart."
+                    "text": "The length of time, in milliseconds, the alert will show before closing itself.\nIf the user hovers over the toast alert, the timer will pause.\nOn leaving the element with the mouse, the timer resets."
                 },
-                "attribute": "duration",
+                "getter": false,
+                "setter": false,
                 "reflect": false,
                 "defaultValue": "Infinity"
             }
@@ -339,8 +393,12 @@ export class SixAlert {
             },
             "toast": {
                 "complexType": {
-                    "signature": "() => Promise<void>",
-                    "parameters": [],
+                    "signature": "(adjustPosition?: boolean) => Promise<void>",
+                    "parameters": [{
+                            "name": "adjustPosition",
+                            "type": "boolean",
+                            "docs": "If true, the top and right position of the toast stack is shifted according to the\nsix-root header's height and the presence of a vertical scrollbar."
+                        }],
                     "references": {
                         "Promise": {
                             "location": "global",
@@ -351,7 +409,10 @@ export class SixAlert {
                 },
                 "docs": {
                     "text": "Displays the alert as a toast notification. This will move the alert out of its position in the DOM and, when\ndismissed, it will be removed from the DOM completely. By storing a reference to the alert, you can reuse it by\ncalling this method again. The returned promise will resolve after the alert is hidden.",
-                    "tags": []
+                    "tags": [{
+                            "name": "param",
+                            "text": "adjustPosition If true, the top and right position of the toast stack is shifted according to the\nsix-root header's height and the presence of a vertical scrollbar."
+                        }]
                 }
             }
         };

package/dist/collection/components/six-alert/six-alert.js.map

@@ -1 +1 @@
-{"version":3,"file":"six-alert.js","sourceRoot":"","sources":["../../../src/components/six-alert/six-alert.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, Element, Event, EventEmitter, Method, Prop, State, Watch, h } from '@stencil/core';\nimport { EmptyPayload } from '../../utils/types';\n\nconst toastStack = Object.assign(document.createElement('div'), { className: 'six-toast-stack' });\n\n/**\n * @since 1.0\n * @status stable\n *\n * Forked from https://github.com/shoelace-style/shoelace version v2.0.0-beta27.\n *\n * @slot - The alert's content.\n * @slot icon - An icon to show in the alert.\n *\n * @part base - The component's base wrapper.\n * @part icon - The container that wraps the alert icon.\n * @part message - The alert message.\n * @part close-button - The close button.\n */\n\n@Component({\n  tag: 'six-alert',\n  styleUrl: 'six-alert.scss',\n  shadow: true,\n})\nexport class SixAlert {\n  private autoHideTimeout?: number;\n\n  @Element() host!: HTMLSixAlertElement;\n\n  @State() isVisible = false;\n\n  /** Indicates whether or not the alert is open. You can use this in lieu of the show/hide methods. */\n  @Prop({ mutable: true, reflect: true }) open = false;\n\n  /** Set to true to make the alert closable. */\n  @Prop({ reflect: true }) closable = false;\n\n  /** The type of alert. */\n  @Prop({ reflect: true }) type: 'primary' | 'success' | 'info' | 'warning' | 'danger' = 'primary';\n\n  /**\n   * The length of time, in milliseconds, the alert will show before closing itself. If the user interacts with the\n   * alert before it closes (e.g. moves the mouse over it), the timer will restart.\n   */\n  @Prop() duration = Infinity;\n\n  @Watch('open')\n  handleOpenChange() {\n    this.open ? this.show() : this.hide();\n  }\n\n  @Watch('duration')\n  handleDurationChange() {\n    this.restartAutoHide();\n  }\n\n  /** Emitted when the alert opens. Calling `event.preventDefault()` will prevent it from being opened. */\n  @Event({ eventName: 'six-alert-show' }) sixShow!: EventEmitter<EmptyPayload>;\n\n  /** Emitted after the alert opens and all transitions are complete. */\n  @Event({ eventName: 'six-alert-after-show' }) sixAfterShow!: EventEmitter<EmptyPayload>;\n\n  /** Emitted when the alert closes. Calling `event.preventDefault()` will prevent it from being closed. */\n  @Event({ eventName: 'six-alert-hide' }) sixHide!: EventEmitter<EmptyPayload>;\n\n  /** Emitted after the alert closes and all transitions are complete. */\n  @Event({ eventName: 'six-alert-after-hide' }) sixAfterHide!: EventEmitter<EmptyPayload>;\n\n  componentWillLoad() {\n    // Show on init if open\n    if (this.open) {\n      this.show();\n    }\n  }\n\n  /** Shows the alert. */\n  @Method()\n  async show() {\n    // Prevent subsequent calls to the method, whether manually or triggered by the `open` watcher\n    if (this.isVisible) {\n      return;\n    }\n\n    const sixShow = this.sixShow.emit();\n    if (sixShow.defaultPrevented) {\n      this.open = false;\n      return;\n    }\n\n    this.isVisible = true;\n    this.open = true;\n\n    if (this.duration < Infinity) {\n      this.autoHideTimeout = window.setTimeout(() => this.hide(), this.duration);\n    }\n  }\n\n  /** Hides the alert */\n  @Method()\n  async hide() {\n    // Prevent subsequent calls to the method, whether manually or triggered by the `open` watcher\n    if (!this.isVisible) {\n      return;\n    }\n\n    const sixHide = this.sixHide.emit();\n    if (sixHide.defaultPrevented) {\n      this.open = true;\n      return;\n    }\n\n    clearTimeout(this.autoHideTimeout);\n    this.isVisible = false;\n    this.open = false;\n  }\n\n  /**\n   * Displays the alert as a toast notification. This will move the alert out of its position in the DOM and, when\n   * dismissed, it will be removed from the DOM completely. By storing a reference to the alert, you can reuse it by\n   * calling this method again. The returned promise will resolve after the alert is hidden.\n   */\n  @Method()\n  async toast() {\n    return new Promise<void>((resolve) => {\n      if (!toastStack.parentElement) {\n        document.body.append(toastStack);\n      }\n\n      toastStack.append(this.host);\n      requestAnimationFrame(() => this.show());\n\n      this.host.addEventListener(\n        'six-alert-after-hide',\n        () => {\n          this.host.remove();\n          resolve();\n\n          // Remove the toast stack from the DOM when there are no more alerts\n          if (toastStack.querySelector('six-alert') === null) {\n            toastStack.remove();\n          }\n        },\n        { once: true }\n      );\n    });\n  }\n\n  private handleCloseClick = () => {\n    this.hide();\n  };\n\n  private handleMouseMove = () => {\n    this.restartAutoHide();\n  };\n\n  private handleTransitionEnd = (event: TransitionEvent) => {\n    const target = event.target as HTMLElement;\n\n    // Ensure we only emit one event when the target element is no longer visible\n    if (event.propertyName === 'opacity' && target.classList.contains('alert')) {\n      this.isVisible = this.open;\n      this.open ? this.sixAfterShow.emit() : this.sixAfterHide.emit();\n    }\n  };\n\n  private restartAutoHide() {\n    clearTimeout(this.autoHideTimeout);\n    if (this.open && this.duration < Infinity) {\n      this.autoHideTimeout = window.setTimeout(() => this.hide(), this.duration);\n    }\n  }\n\n  render() {\n    return (\n      <div\n        part=\"base\"\n        class={{\n          alert: true,\n          'alert--open': this.open,\n          'alert--visible': this.isVisible,\n          'alert--closable': this.closable,\n          'alert--primary': this.type === 'primary',\n          'alert--success': this.type === 'success',\n          'alert--info': this.type === 'info',\n          'alert--warning': this.type === 'warning',\n          'alert--danger': this.type === 'danger',\n        }}\n        role=\"alert\"\n        aria-live=\"assertive\"\n        aria-atomic=\"true\"\n        aria-hidden={this.open ? 'false' : 'true'}\n        onMouseMove={this.handleMouseMove}\n        onTransitionEnd={this.handleTransitionEnd}\n      >\n        <span part=\"icon\" class=\"alert__icon\">\n          <slot name=\"icon\" />\n        </span>\n\n        <span part=\"message\" class=\"alert__message\">\n          <slot />\n        </span>\n\n        {this.closable && (\n          <span class=\"alert__close\">\n            <six-icon-button\n              name=\"clear\"\n              exportparts=\"base:close-button\"\n              onClick={this.handleCloseClick}\n            ></six-icon-button>\n          </span>\n        )}\n      </div>\n    );\n  }\n}\n"]}
+{"version":3,"file":"six-alert.js","sourceRoot":"","sources":["../../../src/components/six-alert/six-alert.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,OAAO,EAAE,KAAK,EAAgB,CAAC,EAAE,MAAM,EAAE,IAAI,EAAE,KAAK,EAAE,KAAK,EAAE,MAAM,eAAe,CAAC;AAEvG,OAAO,EAAE,OAAO,EAAE,MAAM,kBAAkB,CAAC;AAE3C,MAAM,UAAU,GAAG,MAAM,CAAC,MAAM,CAAC,QAAQ,CAAC,aAAa,CAAC,KAAK,CAAC,EAAE,EAAE,SAAS,EAAE,iBAAiB,EAAE,CAAC,CAAC;AAElG;;;;;;;;;;;;;GAaG;AAOH,MAAM,OAAO,QAAQ;IALrB;QAUW,cAAS,GAAG,KAAK,CAAC;QAE3B,qGAAqG;QAC7D,SAAI,GAAG,KAAK,CAAC;QAErD,8CAA8C;QACrB,aAAQ,GAAG,KAAK,CAAC;QAE1C,yBAAyB;QACA,SAAI,GAAc,SAAS,CAAC;QAErD;;;;WAIG;QACK,aAAQ,GAAG,QAAQ,CAAC;QAyIpB,qBAAgB,GAAG,GAAG,EAAE;YAC9B,IAAI,CAAC,IAAI,EAAE,CAAC;QACd,CAAC,CAAC;QAEM,qBAAgB,GAAG,GAAG,EAAE;YAC9B,IAAI,CAAC,aAAa,EAAE,CAAC;QACvB,CAAC,CAAC;QAEM,qBAAgB,GAAG,GAAG,EAAE;YAC9B,IAAI,CAAC,aAAa,EAAE,CAAC;QACvB,CAAC,CAAC;QAEM,wBAAmB,GAAG,CAAC,KAAsB,EAAE,EAAE;YACvD,MAAM,MAAM,GAAG,KAAK,CAAC,MAAqB,CAAC;YAE3C,6EAA6E;YAC7E,IAAI,KAAK,CAAC,YAAY,KAAK,SAAS,IAAI,MAAM,CAAC,SAAS,CAAC,QAAQ,CAAC,OAAO,CAAC,EAAE,CAAC;gBAC3E,IAAI,CAAC,SAAS,GAAG,IAAI,CAAC,IAAI,CAAC;gBAC3B,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC,IAAI,CAAC,YAAY,CAAC,IAAI,EAAE,CAAC,CAAC,CAAC,IAAI,CAAC,YAAY,CAAC,IAAI,EAAE,CAAC;YAClE,CAAC;QACH,CAAC,CAAC;KAgDH;IA1MC,gBAAgB;QACd,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC,IAAI,CAAC,IAAI,EAAE,CAAC,CAAC,CAAC,IAAI,CAAC,IAAI,EAAE,CAAC;IACxC,CAAC;IAGD,oBAAoB;QAClB,IAAI,CAAC,eAAe,EAAE,CAAC;IACzB,CAAC;IAcD,iBAAiB;QACf,uBAAuB;QACvB,IAAI,IAAI,CAAC,IAAI,EAAE,CAAC;YACd,IAAI,CAAC,IAAI,EAAE,CAAC;QACd,CAAC;IACH,CAAC;IAED,uBAAuB;IAEvB,KAAK,CAAC,IAAI;QACR,8FAA8F;QAC9F,IAAI,IAAI,CAAC,SAAS,EAAE,CAAC;YACnB,OAAO;QACT,CAAC;QAED,MAAM,OAAO,GAAG,IAAI,CAAC,OAAO,CAAC,IAAI,EAAE,CAAC;QACpC,IAAI,OAAO,CAAC,gBAAgB,EAAE,CAAC;YAC7B,IAAI,CAAC,IAAI,GAAG,KAAK,CAAC;YAClB,OAAO;QACT,CAAC;QAED,IAAI,CAAC,SAAS,GAAG,IAAI,CAAC;QACtB,IAAI,CAAC,IAAI,GAAG,IAAI,CAAC;QAEjB,IAAI,IAAI,CAAC,QAAQ,GAAG,QAAQ,EAAE,CAAC;YAC7B,IAAI,CAAC,eAAe,GAAG,MAAM,CAAC,UAAU,CAAC,GAAG,EAAE,CAAC,IAAI,CAAC,IAAI,EAAE,EAAE,IAAI,CAAC,QAAQ,CAAC,CAAC;QAC7E,CAAC;IACH,CAAC;IAED,sBAAsB;IAEtB,KAAK,CAAC,IAAI;QACR,8FAA8F;QAC9F,IAAI,CAAC,IAAI,CAAC,SAAS,EAAE,CAAC;YACpB,OAAO;QACT,CAAC;QAED,MAAM,OAAO,GAAG,IAAI,CAAC,OAAO,CAAC,IAAI,EAAE,CAAC;QACpC,IAAI,OAAO,CAAC,gBAAgB,EAAE,CAAC;YAC7B,IAAI,CAAC,IAAI,GAAG,IAAI,CAAC;YACjB,OAAO;QACT,CAAC;QAED,YAAY,CAAC,IAAI,CAAC,eAAe,CAAC,CAAC;QACnC,IAAI,CAAC,SAAS,GAAG,KAAK,CAAC;QACvB,IAAI,CAAC,IAAI,GAAG,KAAK,CAAC;IACpB,CAAC;IAED;;;;;;OAMG;IAEH,KAAK,CAAC,KAAK,CAAC,cAAc,GAAG,IAAI;QAC/B,OAAO,IAAI,OAAO,CAAO,CAAC,OAAO,EAAE,EAAE;;YACnC,IAAI,CAAC,UAAU,CAAC,aAAa,EAAE,CAAC;gBAC9B,QAAQ,CAAC,IAAI,CAAC,MAAM,CAAC,UAAU,CAAC,CAAC;YACnC,CAAC;YACD,UAAU,CAAC,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;YAE7B,IAAI,cAAc,EAAE,CAAC;gBACnB,MAAM,OAAO,GAAG,QAAQ,CAAC,aAAa,CAAC,UAAU,CAAC,CAAC;gBACnD,MAAM,UAAU,GAAG,OAAO,CAAC,OAAO,EAAE,QAAQ,CAAC,CAAC;gBAC9C,MAAM,QAAQ,GAAG,MAAA,OAAO,aAAP,OAAO,uBAAP,OAAO,CAAE,UAAU,0CAAE,aAAa,CAAC,WAAW,CAAC,CAAC;gBACjE,IAAI,QAAQ,IAAI,IAAI,IAAI,QAAQ,YAAY,WAAW,EAAE,CAAC;oBACxD,MAAM,cAAc,GAAG,QAAQ,CAAC,WAAW,GAAG,QAAQ,CAAC,WAAW,CAAC;oBACnE,UAAU,CAAC,KAAK,CAAC,KAAK,GAAG,GAAG,cAAc,IAAI,CAAC;gBACjD,CAAC;gBACD,IAAI,UAAU,IAAI,IAAI,EAAE,CAAC;oBACvB,MAAM,IAAI,GAAG,UAAU,aAAV,UAAU,uBAAV,UAAU,CAAE,qBAAqB,EAAE,CAAC;oBACjD,UAAU,CAAC,KAAK,CAAC,GAAG,GAAG,GAAG,IAAI,CAAC,GAAG,GAAG,IAAI,CAAC,MAAM,IAAI,CAAC;gBACvD,CAAC;YACH,CAAC;iBAAM,CAAC;gBACN,UAAU,CAAC,KAAK,CAAC,GAAG,GAAG,GAAG,CAAC;gBAC3B,UAAU,CAAC,KAAK,CAAC,KAAK,GAAG,GAAG,CAAC;YAC/B,CAAC;YAED,qBAAqB,CAAC,GAAG,EAAE,CAAC,IAAI,CAAC,IAAI,EAAE,CAAC,CAAC;YAEzC,IAAI,CAAC,IAAI,CAAC,gBAAgB,CACxB,sBAAsB,EACtB,GAAG,EAAE;gBACH,IAAI,CAAC,IAAI,CAAC,MAAM,EAAE,CAAC;gBACnB,OAAO,EAAE,CAAC;gBAEV,oEAAoE;gBACpE,IAAI,UAAU,CAAC,aAAa,CAAC,WAAW,CAAC,KAAK,IAAI,EAAE,CAAC;oBACnD,UAAU,CAAC,MAAM,EAAE,CAAC;gBACtB,CAAC;YACH,CAAC,EACD,EAAE,IAAI,EAAE,IAAI,EAAE,CACf,CAAC;QACJ,CAAC,CAAC,CAAC;IACL,CAAC;IAEO,aAAa;QACnB,YAAY,CAAC,IAAI,CAAC,eAAe,CAAC,CAAC;IACrC,CAAC;IAEO,aAAa;QACnB,IAAI,IAAI,CAAC,IAAI,IAAI,IAAI,CAAC,QAAQ,GAAG,QAAQ,EAAE,CAAC;YAC1C,IAAI,CAAC,eAAe,GAAG,MAAM,CAAC,UAAU,CAAC,GAAG,EAAE,CAAC,IAAI,CAAC,IAAI,EAAE,EAAE,IAAI,CAAC,QAAQ,CAAC,CAAC;QAC7E,CAAC;IACH,CAAC;IAEO,eAAe;QACrB,IAAI,CAAC,aAAa,EAAE,CAAC;QACrB,IAAI,CAAC,aAAa,EAAE,CAAC;IACvB,CAAC;IAwBD,MAAM;QACJ,MAAM,OAAO,GAAG,IAAI,CAAC,IAAI,CAAC,OAAO,CAAC,kBAAkB,CAAC,IAAI,IAAI,CAAC;QAE9D,OAAO,CACL,4DACE,IAAI,EAAC,MAAM,EACX,KAAK,EAAE;gBACL,KAAK,EAAE,IAAI;gBACX,aAAa,EAAE,IAAI,CAAC,IAAI;gBACxB,gBAAgB,EAAE,IAAI,CAAC,SAAS;gBAChC,iBAAiB,EAAE,IAAI,CAAC,QAAQ;gBAChC,gBAAgB,EAAE,IAAI,CAAC,IAAI,KAAK,SAAS;gBACzC,gBAAgB,EAAE,IAAI,CAAC,IAAI,KAAK,SAAS;gBACzC,aAAa,EAAE,IAAI,CAAC,IAAI,KAAK,MAAM;gBACnC,gBAAgB,EAAE,IAAI,CAAC,IAAI,KAAK,SAAS;gBACzC,eAAe,EAAE,IAAI,CAAC,IAAI,KAAK,QAAQ;gBACvC,eAAe,EAAE,OAAO;aACzB,EACD,IAAI,EAAC,OAAO,eACF,WAAW,iBACT,MAAM,iBACL,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,MAAM,EACzC,eAAe,EAAE,IAAI,CAAC,mBAAmB,EACzC,YAAY,EAAE,IAAI,CAAC,gBAAgB,EACnC,YAAY,EAAE,IAAI,CAAC,gBAAgB;YAEnC,6DAAM,IAAI,EAAC,MAAM,EAAC,KAAK,EAAC,aAAa;gBACnC,6DAAM,IAAI,EAAC,MAAM,GAAG,CACf;YAEP,6DAAM,IAAI,EAAC,SAAS,EAAC,KAAK,EAAC,gBAAgB;gBACzC,8DAAQ,CACH;YAEN,IAAI,CAAC,QAAQ,IAAI,CAChB,6DAAM,KAAK,EAAC,cAAc;gBACxB,wEACE,IAAI,EAAC,OAAO,EACZ,WAAW,EAAC,mBAAmB,EAC/B,OAAO,EAAE,IAAI,CAAC,gBAAgB,GACb,CACd,CACR,CACG,CACP,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, Element, Event, EventEmitter, h, Method, Prop, State, Watch } from '@stencil/core';\nimport { EmptyPayload } from '../../utils/types';\nimport { getSlot } from '../../utils/slot';\n\nconst toastStack = Object.assign(document.createElement('div'), { className: 'six-toast-stack' });\n\n/**\n * @since 1.0\n * @status stable\n *\n * Forked from https://github.com/shoelace-style/shoelace version v2.0.0-beta27.\n *\n * @slot - The alert's content.\n * @slot icon - An icon to show in the alert.\n *\n * @part base - The component's base wrapper.\n * @part icon - The container that wraps the alert icon.\n * @part message - The alert message.\n * @part close-button - The close button.\n */\n\n@Component({\n  tag: 'six-alert',\n  styleUrl: 'six-alert.scss',\n  shadow: true,\n})\nexport class SixAlert {\n  private autoHideTimeout?: number;\n\n  @Element() host!: HTMLSixAlertElement;\n\n  @State() isVisible = false;\n\n  /** Indicates whether or not the alert is open. You can use this in lieu of the show/hide methods. */\n  @Prop({ mutable: true, reflect: true }) open = false;\n\n  /** Set to true to make the alert closable. */\n  @Prop({ reflect: true }) closable = false;\n\n  /** The type of alert. */\n  @Prop({ reflect: true }) type: AlertType = 'primary';\n\n  /**\n   * The length of time, in milliseconds, the alert will show before closing itself.\n   * If the user hovers over the toast alert, the timer will pause.\n   * On leaving the element with the mouse, the timer resets.\n   */\n  @Prop() duration = Infinity;\n\n  @Watch('open')\n  handleOpenChange() {\n    this.open ? this.show() : this.hide();\n  }\n\n  @Watch('duration')\n  handleDurationChange() {\n    this.restartAutoHide();\n  }\n\n  /** Emitted when the alert opens. Calling `event.preventDefault()` will prevent it from being opened. */\n  @Event({ eventName: 'six-alert-show' }) sixShow!: EventEmitter<EmptyPayload>;\n\n  /** Emitted after the alert opens and all transitions are complete. */\n  @Event({ eventName: 'six-alert-after-show' }) sixAfterShow!: EventEmitter<EmptyPayload>;\n\n  /** Emitted when the alert closes. Calling `event.preventDefault()` will prevent it from being closed. */\n  @Event({ eventName: 'six-alert-hide' }) sixHide!: EventEmitter<EmptyPayload>;\n\n  /** Emitted after the alert closes and all transitions are complete. */\n  @Event({ eventName: 'six-alert-after-hide' }) sixAfterHide!: EventEmitter<EmptyPayload>;\n\n  componentWillLoad() {\n    // Show on init if open\n    if (this.open) {\n      this.show();\n    }\n  }\n\n  /** Shows the alert. */\n  @Method()\n  async show() {\n    // Prevent subsequent calls to the method, whether manually or triggered by the `open` watcher\n    if (this.isVisible) {\n      return;\n    }\n\n    const sixShow = this.sixShow.emit();\n    if (sixShow.defaultPrevented) {\n      this.open = false;\n      return;\n    }\n\n    this.isVisible = true;\n    this.open = true;\n\n    if (this.duration < Infinity) {\n      this.autoHideTimeout = window.setTimeout(() => this.hide(), this.duration);\n    }\n  }\n\n  /** Hides the alert */\n  @Method()\n  async hide() {\n    // Prevent subsequent calls to the method, whether manually or triggered by the `open` watcher\n    if (!this.isVisible) {\n      return;\n    }\n\n    const sixHide = this.sixHide.emit();\n    if (sixHide.defaultPrevented) {\n      this.open = true;\n      return;\n    }\n\n    clearTimeout(this.autoHideTimeout);\n    this.isVisible = false;\n    this.open = false;\n  }\n\n  /**\n   * Displays the alert as a toast notification. This will move the alert out of its position in the DOM and, when\n   * dismissed, it will be removed from the DOM completely. By storing a reference to the alert, you can reuse it by\n   * calling this method again. The returned promise will resolve after the alert is hidden.\n   * @param adjustPosition  If true, the top and right position of the toast stack is shifted according to the\n   *                        six-root header's height and the presence of a vertical scrollbar.\n   */\n  @Method()\n  async toast(adjustPosition = true) {\n    return new Promise<void>((resolve) => {\n      if (!toastStack.parentElement) {\n        document.body.append(toastStack);\n      }\n      toastStack.append(this.host);\n\n      if (adjustPosition) {\n        const sixRoot = document.querySelector('six-root');\n        const headerSlot = getSlot(sixRoot, 'header');\n        const mainSlot = sixRoot?.shadowRoot?.querySelector('host main');\n        if (mainSlot != null && mainSlot instanceof HTMLElement) {\n          const scrollbarWidth = mainSlot.offsetWidth - mainSlot.clientWidth;\n          toastStack.style.right = `${scrollbarWidth}px`;\n        }\n        if (headerSlot != null) {\n          const rect = headerSlot?.getBoundingClientRect();\n          toastStack.style.top = `${rect.top + rect.height}px`;\n        }\n      } else {\n        toastStack.style.top = '0';\n        toastStack.style.right = '0';\n      }\n\n      requestAnimationFrame(() => this.show());\n\n      this.host.addEventListener(\n        'six-alert-after-hide',\n        () => {\n          this.host.remove();\n          resolve();\n\n          // Remove the toast stack from the DOM when there are no more alerts\n          if (toastStack.querySelector('six-alert') === null) {\n            toastStack.remove();\n          }\n        },\n        { once: true }\n      );\n    });\n  }\n\n  private pauseAutoHide() {\n    clearTimeout(this.autoHideTimeout);\n  }\n\n  private resetAutoHide() {\n    if (this.open && this.duration < Infinity) {\n      this.autoHideTimeout = window.setTimeout(() => this.hide(), this.duration);\n    }\n  }\n\n  private restartAutoHide() {\n    this.pauseAutoHide();\n    this.resetAutoHide();\n  }\n\n  private handleCloseClick = () => {\n    this.hide();\n  };\n\n  private handleMouseEnter = () => {\n    this.pauseAutoHide();\n  };\n\n  private handleMouseLeave = () => {\n    this.resetAutoHide();\n  };\n\n  private handleTransitionEnd = (event: TransitionEvent) => {\n    const target = event.target as HTMLElement;\n\n    // Ensure we only emit one event when the target element is no longer visible\n    if (event.propertyName === 'opacity' && target.classList.contains('alert')) {\n      this.isVisible = this.open;\n      this.open ? this.sixAfterShow.emit() : this.sixAfterHide.emit();\n    }\n  };\n\n  render() {\n    const asToast = this.host.closest('.six-toast-stack') != null;\n\n    return (\n      <div\n        part=\"base\"\n        class={{\n          alert: true,\n          'alert--open': this.open,\n          'alert--visible': this.isVisible,\n          'alert--closable': this.closable,\n          'alert--primary': this.type === 'primary',\n          'alert--success': this.type === 'success',\n          'alert--info': this.type === 'info',\n          'alert--warning': this.type === 'warning',\n          'alert--danger': this.type === 'danger',\n          'alert--shadow': asToast,\n        }}\n        role=\"alert\"\n        aria-live=\"assertive\"\n        aria-atomic=\"true\"\n        aria-hidden={this.open ? 'false' : 'true'}\n        onTransitionEnd={this.handleTransitionEnd}\n        onMouseEnter={this.handleMouseEnter}\n        onMouseLeave={this.handleMouseLeave}\n      >\n        <span part=\"icon\" class=\"alert__icon\">\n          <slot name=\"icon\" />\n        </span>\n\n        <span part=\"message\" class=\"alert__message\">\n          <slot />\n        </span>\n\n        {this.closable && (\n          <span class=\"alert__close\">\n            <six-icon-button\n              name=\"clear\"\n              exportparts=\"base:close-button\"\n              onClick={this.handleCloseClick}\n            ></six-icon-button>\n          </span>\n        )}\n      </div>\n    );\n  }\n}\n\nexport type AlertType = 'primary' | 'success' | 'info' | 'warning' | 'danger';\n"]}

package/dist/collection/components/six-avatar/six-avatar.css

@@ -6,6 +6,17 @@
   box-sizing: border-box;
 }
 
+/* Hides content visually while still making it available to screen readers */
+.sr-only {
+  clip: rect(0 0 0 0);
+  clip-path: inset(50%);
+  height: 1px;
+  overflow: hidden;
+  position: absolute;
+  white-space: nowrap;
+  width: 1px;
+}
+
 /**
  * @prop --size: The size of the avatar.
  */

package/dist/collection/components/six-avatar/six-avatar.js

@@ -14,22 +14,26 @@ import { h } from "@stencil/core";
  */
 export class SixAvatar {
     constructor() {
-        this.handleImageError = () => {
-            this.hasError = true;
-        };
         this.hasError = false;
+        /** The image source to use for the avatar. */
         this.image = '';
+        /** Alternative text for the image. */
         this.alt = '';
+        /** Initials to use as a fallback when no image is available (1-2 characters max recommended). */
         this.initials = '';
+        /** The shape of the avatar. */
         this.shape = 'circle';
+        this.handleImageError = () => {
+            this.hasError = true;
+        };
     }
     render() {
-        return (h("div", { part: "base", class: {
+        return (h("div", { key: '1aaade211fdffbe4e64a03942be0f2dc045f2ba5', part: "base", class: {
                 avatar: true,
                 'avatar--circle': this.shape === 'circle',
                 'avatar--rounded': this.shape === 'rounded',
                 'avatar--square': this.shape === 'square',
-            }, role: "image", "aria-label": this.alt, tabIndex: 0 }, this.initials === '' && (h("div", { part: "icon", class: "avatar__icon" }, h("slot", { name: "icon" }, h("six-icon", null, "person")))), this.initials && (h("div", { part: "initials", class: "avatar__initials" }, this.initials)), this.image && !this.hasError && (h("img", { part: "image", class: "avatar__image", src: this.image, onError: this.handleImageError }))));
+            }, role: "image", "aria-label": this.alt, tabIndex: 0 }, this.initials === '' && (h("div", { key: '08f51e38d5961efe8a1edd229b19173a76773fac', part: "icon", class: "avatar__icon" }, h("slot", { key: '93a72971ee8e0e0cc700341520f456e8284b76e6', name: "icon" }, h("six-icon", { key: 'bc3fcbdde635da80270e3ea545b11113ee6512c1' }, "person")))), this.initials && (h("div", { key: '0531c544e1400e170161de648afeb1a27ddcbfb6', part: "initials", class: "avatar__initials" }, this.initials)), this.image && !this.hasError && (h("img", { key: 'aae3851a20d505d4ee266828ac777a2518bdaf6e', part: "image", class: "avatar__image", src: this.image, onError: this.handleImageError }))));
     }
     static get is() { return "six-avatar"; }
     static get encapsulation() { return "shadow"; }
@@ -47,6 +51,7 @@ export class SixAvatar {
         return {
             "image": {
                 "type": "string",
+                "attribute": "image",
                 "mutable": false,
                 "complexType": {
                     "original": "string",
@@ -59,12 +64,14 @@ export class SixAvatar {
                     "tags": [],
                     "text": "The image source to use for the avatar."
                 },
-                "attribute": "image",
+                "getter": false,
+                "setter": false,
                 "reflect": false,
                 "defaultValue": "''"
             },
             "alt": {
                 "type": "string",
+                "attribute": "alt",
                 "mutable": false,
                 "complexType": {
                     "original": "string",
@@ -77,12 +84,14 @@ export class SixAvatar {
                     "tags": [],
                     "text": "Alternative text for the image."
                 },
-                "attribute": "alt",
+                "getter": false,
+                "setter": false,
                 "reflect": false,
                 "defaultValue": "''"
             },
             "initials": {
                 "type": "string",
+                "attribute": "initials",
                 "mutable": false,
                 "complexType": {
                     "original": "string",
@@ -95,12 +104,14 @@ export class SixAvatar {
                     "tags": [],
                     "text": "Initials to use as a fallback when no image is available (1-2 characters max recommended)."
                 },
-                "attribute": "initials",
+                "getter": false,
+                "setter": false,
                 "reflect": false,
                 "defaultValue": "''"
             },
             "shape": {
                 "type": "string",
+                "attribute": "shape",
                 "mutable": false,
                 "complexType": {
                     "original": "'circle' | 'square' | 'rounded'",
@@ -113,7 +124,8 @@ export class SixAvatar {
                     "tags": [],
                     "text": "The shape of the avatar."
                 },
-                "attribute": "shape",
+                "getter": false,
+                "setter": false,
                 "reflect": false,
                 "defaultValue": "'circle'"
             }

package/dist/collection/components/six-avatar/six-avatar.js.map

@@ -1 +1 @@
-{"version":3,"file":"six-avatar.js","sourceRoot":"","sources":["../../../src/components/six-avatar/six-avatar.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,CAAC,EAAE,IAAI,EAAE,KAAK,EAAE,MAAM,eAAe,CAAC;AAE1D;;;;;;;;;;;;GAYG;AAMH,MAAM,OAAO,SAAS;;QAeZ,qBAAgB,GAAG,GAAG,EAAE;YAC9B,IAAI,CAAC,QAAQ,GAAG,IAAI,CAAC;QACvB,CAAC,CAAC;wBAhBkB,KAAK;qBAGT,EAAE;mBAGJ,EAAE;wBAGG,EAAE;qBAG4B,QAAQ;;IAMzD,MAAM;QACJ,OAAO,CACL,WACE,IAAI,EAAC,MAAM,EACX,KAAK,EAAE;gBACL,MAAM,EAAE,IAAI;gBACZ,gBAAgB,EAAE,IAAI,CAAC,KAAK,KAAK,QAAQ;gBACzC,iBAAiB,EAAE,IAAI,CAAC,KAAK,KAAK,SAAS;gBAC3C,gBAAgB,EAAE,IAAI,CAAC,KAAK,KAAK,QAAQ;aAC1C,EACD,IAAI,EAAC,OAAO,gBACA,IAAI,CAAC,GAAG,EACpB,QAAQ,EAAE,CAAC;YAEV,IAAI,CAAC,QAAQ,KAAK,EAAE,IAAI,CACvB,WAAK,IAAI,EAAC,MAAM,EAAC,KAAK,EAAC,cAAc;gBACnC,YAAM,IAAI,EAAC,MAAM;oBACf,6BAA2B,CACtB,CACH,CACP;YAEA,IAAI,CAAC,QAAQ,IAAI,CAChB,WAAK,IAAI,EAAC,UAAU,EAAC,KAAK,EAAC,kBAAkB,IAC1C,IAAI,CAAC,QAAQ,CACV,CACP;YAEA,IAAI,CAAC,KAAK,IAAI,CAAC,IAAI,CAAC,QAAQ,IAAI,CAC/B,WAAK,IAAI,EAAC,OAAO,EAAC,KAAK,EAAC,eAAe,EAAC,GAAG,EAAE,IAAI,CAAC,KAAK,EAAE,OAAO,EAAE,IAAI,CAAC,gBAAgB,GAAI,CAC5F,CACG,CACP,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, h, Prop, State } from '@stencil/core';\n\n/**\n * @since 1.0\n * @status stable\n *\n * Forked from https://github.com/shoelace-style/shoelace version v2.0.0-beta27.\n *\n * @slot icon - The default icon to use when no image or initials are present.\n *\n * @part base - The component's base wrapper.\n * @part icon - The container that wraps the avatar icon.\n * @part initials - The container that wraps the avatar initials.\n * @part image - The avatar image.\n */\n@Component({\n  tag: 'six-avatar',\n  styleUrl: 'six-avatar.scss',\n  shadow: true,\n})\nexport class SixAvatar {\n  @State() hasError = false;\n\n  /** The image source to use for the avatar. */\n  @Prop() image = '';\n\n  /** Alternative text for the image. */\n  @Prop() alt = '';\n\n  /** Initials to use as a fallback when no image is available (1-2 characters max recommended). */\n  @Prop() initials = '';\n\n  /** The shape of the avatar. */\n  @Prop() shape: 'circle' | 'square' | 'rounded' = 'circle';\n\n  private handleImageError = () => {\n    this.hasError = true;\n  };\n\n  render() {\n    return (\n      <div\n        part=\"base\"\n        class={{\n          avatar: true,\n          'avatar--circle': this.shape === 'circle',\n          'avatar--rounded': this.shape === 'rounded',\n          'avatar--square': this.shape === 'square',\n        }}\n        role=\"image\"\n        aria-label={this.alt}\n        tabIndex={0}\n      >\n        {this.initials === '' && (\n          <div part=\"icon\" class=\"avatar__icon\">\n            <slot name=\"icon\">\n              <six-icon>person</six-icon>\n            </slot>\n          </div>\n        )}\n\n        {this.initials && (\n          <div part=\"initials\" class=\"avatar__initials\">\n            {this.initials}\n          </div>\n        )}\n\n        {this.image && !this.hasError && (\n          <img part=\"image\" class=\"avatar__image\" src={this.image} onError={this.handleImageError} />\n        )}\n      </div>\n    );\n  }\n}\n"]}
+{"version":3,"file":"six-avatar.js","sourceRoot":"","sources":["../../../src/components/six-avatar/six-avatar.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,CAAC,EAAE,IAAI,EAAE,KAAK,EAAE,MAAM,eAAe,CAAC;AAE1D;;;;;;;;;;;;GAYG;AAMH,MAAM,OAAO,SAAS;IALtB;QAMW,aAAQ,GAAG,KAAK,CAAC;QAE1B,8CAA8C;QACtC,UAAK,GAAG,EAAE,CAAC;QAEnB,sCAAsC;QAC9B,QAAG,GAAG,EAAE,CAAC;QAEjB,iGAAiG;QACzF,aAAQ,GAAG,EAAE,CAAC;QAEtB,+BAA+B;QACvB,UAAK,GAAoC,QAAQ,CAAC;QAElD,qBAAgB,GAAG,GAAG,EAAE;YAC9B,IAAI,CAAC,QAAQ,GAAG,IAAI,CAAC;QACvB,CAAC,CAAC;KAoCH;IAlCC,MAAM;QACJ,OAAO,CACL,4DACE,IAAI,EAAC,MAAM,EACX,KAAK,EAAE;gBACL,MAAM,EAAE,IAAI;gBACZ,gBAAgB,EAAE,IAAI,CAAC,KAAK,KAAK,QAAQ;gBACzC,iBAAiB,EAAE,IAAI,CAAC,KAAK,KAAK,SAAS;gBAC3C,gBAAgB,EAAE,IAAI,CAAC,KAAK,KAAK,QAAQ;aAC1C,EACD,IAAI,EAAC,OAAO,gBACA,IAAI,CAAC,GAAG,EACpB,QAAQ,EAAE,CAAC;YAEV,IAAI,CAAC,QAAQ,KAAK,EAAE,IAAI,CACvB,4DAAK,IAAI,EAAC,MAAM,EAAC,KAAK,EAAC,cAAc;gBACnC,6DAAM,IAAI,EAAC,MAAM;oBACf,4EAA2B,CACtB,CACH,CACP;YAEA,IAAI,CAAC,QAAQ,IAAI,CAChB,4DAAK,IAAI,EAAC,UAAU,EAAC,KAAK,EAAC,kBAAkB,IAC1C,IAAI,CAAC,QAAQ,CACV,CACP;YAEA,IAAI,CAAC,KAAK,IAAI,CAAC,IAAI,CAAC,QAAQ,IAAI,CAC/B,4DAAK,IAAI,EAAC,OAAO,EAAC,KAAK,EAAC,eAAe,EAAC,GAAG,EAAE,IAAI,CAAC,KAAK,EAAE,OAAO,EAAE,IAAI,CAAC,gBAAgB,GAAI,CAC5F,CACG,CACP,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, h, Prop, State } from '@stencil/core';\n\n/**\n * @since 1.0\n * @status stable\n *\n * Forked from https://github.com/shoelace-style/shoelace version v2.0.0-beta27.\n *\n * @slot icon - The default icon to use when no image or initials are present.\n *\n * @part base - The component's base wrapper.\n * @part icon - The container that wraps the avatar icon.\n * @part initials - The container that wraps the avatar initials.\n * @part image - The avatar image.\n */\n@Component({\n  tag: 'six-avatar',\n  styleUrl: 'six-avatar.scss',\n  shadow: true,\n})\nexport class SixAvatar {\n  @State() hasError = false;\n\n  /** The image source to use for the avatar. */\n  @Prop() image = '';\n\n  /** Alternative text for the image. */\n  @Prop() alt = '';\n\n  /** Initials to use as a fallback when no image is available (1-2 characters max recommended). */\n  @Prop() initials = '';\n\n  /** The shape of the avatar. */\n  @Prop() shape: 'circle' | 'square' | 'rounded' = 'circle';\n\n  private handleImageError = () => {\n    this.hasError = true;\n  };\n\n  render() {\n    return (\n      <div\n        part=\"base\"\n        class={{\n          avatar: true,\n          'avatar--circle': this.shape === 'circle',\n          'avatar--rounded': this.shape === 'rounded',\n          'avatar--square': this.shape === 'square',\n        }}\n        role=\"image\"\n        aria-label={this.alt}\n        tabIndex={0}\n      >\n        {this.initials === '' && (\n          <div part=\"icon\" class=\"avatar__icon\">\n            <slot name=\"icon\">\n              <six-icon>person</six-icon>\n            </slot>\n          </div>\n        )}\n\n        {this.initials && (\n          <div part=\"initials\" class=\"avatar__initials\">\n            {this.initials}\n          </div>\n        )}\n\n        {this.image && !this.hasError && (\n          <img part=\"image\" class=\"avatar__image\" src={this.image} onError={this.handleImageError} />\n        )}\n      </div>\n    );\n  }\n}\n"]}