globuswebcomponents 1.9.7 → 1.9.8

package/dist/collection/components/gb-file-upload-item-base/gb-file-upload-item-base.js

@@ -2,15 +2,16 @@ import { h, Fragment } from "@stencil/core";
 import { StateEnum } from "../../models/reusableModels";
 export class GbFileUploadItemBase {
     constructor() {
+        this.label = '';
         this.heightSize = 'md';
     }
     render() {
-        return (h("div", { key: 'a3a3415a710c7644dec94ccc997afd13b59d8455', class: `file_upload_item_base_container ${this.state} ${this.heightSize}` }, this.state === 'default' && (h(Fragment, null, this.heightSize === 'md' && [
-            h("div", { key: '4bb638ffed1c45d40cb5986837f54be4c39c842b', class: `default ${this.heightSize}` }, h("div", { key: '79951549f77ccb9af408e457a7cf1b555f269b3c', class: "file_upload_icon" }, h("svg", { key: '4fa7d90bf4772a3cc8b99c1d4be1055b091fca21', xmlns: "http://www.w3.org/2000/svg", width: "24", height: "24", viewBox: "0 0 24 24", fill: "none" }, h("path", { key: '52a8a7566bd9c1d2c42dca3989d5f86df5a2d273', d: "M17.5 9.01101V8.261L17.4981 8.26101L17.5 9.01101ZM9.54945 9.61023C9.8804 9.85933 10.3506 9.79298 10.5997 9.46204C10.8488 9.1311 10.7825 8.66088 10.4515 8.41178L9.54945 9.61023ZM15.6641 11.5394C15.4006 11.8591 15.4462 12.3317 15.7658 12.5952C16.0854 12.8587 16.5581 12.8132 16.8216 12.4936L15.6641 11.5394ZM17.9174 17.2546C17.5057 17.3002 17.209 17.6709 17.2546 18.0826C17.3002 18.4943 17.6709 18.791 18.0826 18.7454L17.9174 17.2546ZM5.85054 18.6623C6.25644 18.7448 6.65241 18.4827 6.73496 18.0768C6.8175 17.6709 6.55537 17.2749 6.14946 17.1924L5.85054 18.6623ZM12 13V12.25V13ZM11.25 21C11.25 21.4142 11.5858 21.75 12 21.75C12.4142 21.75 12.75 21.4142 12.75 21H11.25ZM8.96219 14.9773C8.67349 15.2743 8.68023 15.7491 8.97726 16.0378C9.27428 16.3265 9.74911 16.3198 10.0378 16.0227L8.96219 14.9773ZM13.9622 16.0227C14.2509 16.3198 14.7257 16.3265 15.0227 16.0378C15.3198 15.7491 15.3265 15.2743 15.0378 14.9773L13.9622 16.0227ZM12 3.75C14.6221 3.75 16.75 5.87987 16.75 8.51009H18.25C18.25 5.05403 15.4531 2.25 12 2.25V3.75ZM17.5 9.76101C19.5698 9.76101 21.25 11.4423 21.25 13.5193H22.75C22.75 10.6165 20.4008 8.26101 17.5 8.26101V9.76101ZM17.4794 9.76106L17.5019 9.761L17.4981 8.26101L17.4757 8.26106L17.4794 9.76106ZM16.75 8.51009C16.75 8.6565 16.7434 8.80117 16.7306 8.94386L18.2246 9.07826C18.2414 8.89095 18.25 8.70143 18.25 8.51009H16.75ZM2.75 13.0183C2.75 10.8031 4.43748 8.98389 6.5916 8.77853L6.44924 7.2853C3.53048 7.56356 1.25 10.0247 1.25 13.0183H2.75ZM6.5916 8.77853C6.72581 8.76574 6.86203 8.75917 7 8.75917V7.25917C6.81443 7.25917 6.6307 7.268 6.44924 7.2853L6.5916 8.77853ZM7.26768 8.09603C7.47668 5.66023 9.51709 3.75 12 3.75V2.25C8.72939 2.25 6.04797 4.76511 5.77317 7.9678L7.26768 8.09603ZM7 8.75917C7.95746 8.75917 8.83914 9.07557 9.54945 9.61023L10.4515 8.41178C9.49035 7.68831 8.29419 7.25917 7 7.25917V8.75917ZM16.7306 8.94386C16.6423 9.92517 16.2569 10.8203 15.6641 11.5394L16.8216 12.4936C17.6003 11.5489 18.1084 10.37 18.2246 9.07826L16.7306 8.94386ZM21.25 13.5193C21.25 15.4544 19.7906 17.0471 17.9174 17.2546L18.0826 18.7454C20.7093 18.4545 22.75 16.2252 22.75 13.5193H21.25ZM6.14946 17.1924C4.21067 16.7981 2.75 15.079 2.75 13.0183H1.25C1.25 15.8044 3.22485 18.1283 5.85054 18.6623L6.14946 17.1924ZM11.25 13V21H12.75V13H11.25ZM12 12.25C11.7417 12.25 11.5193 12.339 11.3578 12.4254C11.1904 12.515 11.0348 12.631 10.8968 12.7485C10.6213 12.9832 10.3457 13.285 10.0995 13.5755C9.85056 13.8693 9.60952 14.1784 9.40971 14.4328C9.19651 14.7042 9.05089 14.886 8.96219 14.9773L10.0378 16.0227C10.1949 15.8612 10.3971 15.604 10.5893 15.3593C10.7949 15.0975 11.0169 14.8132 11.2439 14.5452C11.4738 14.274 11.6873 14.0456 11.8694 13.8905C11.9601 13.8132 12.0255 13.7694 12.0656 13.7479C12.1116 13.7233 12.0832 13.75 12 13.75V12.25ZM15.0378 14.9773C14.9491 14.886 14.8035 14.7042 14.5903 14.4328C14.3905 14.1784 14.1494 13.8693 13.9005 13.5755C13.6543 13.285 13.3787 12.9832 13.1032 12.7485C12.9652 12.631 12.8096 12.515 12.6422 12.4254C12.4807 12.339 12.2583 12.25 12 12.25V13.75C11.9168 13.75 11.8884 13.7233 11.9344 13.7479C11.9745 13.7694 12.0399 13.8132 12.1306 13.8905C12.3127 14.0456 12.5262 14.274 12.7561 14.5452C12.9831 14.8132 13.2051 15.0975 13.4107 15.3593C13.6029 15.604 13.8051 15.8612 13.9622 16.0227L15.0378 14.9773Z", fill: "#4B5565" }))), h("div", { key: '1a08c72a0afd4db4c4f27aa34210d843966685db', class: "default_content" }, h("p", { key: 'e20401f70f4b65f7e4de1d7ae3de1e5d814044b8', class: "upload_text text-sm-semi-bold" }, "Tap to upload"), h("p", { key: '2f0627348cf1ca1aab6260d1085193cdcccb1fd6', class: "file_type_text text-xs-regular" }, "SVG, PNG, JPG or GIF (max. 800x400px)"))),
-            h("gb-button", { key: 'b46ab9fb2b1f543a208e80d8442e9677d5a51eb3', size: "sm", hierarchy: "link_color", icon: "default", class: "upload_btn_md", "icon-leading": true, onClick: () => this.uploadButtonClicked.emit() }, h("p", { key: 'f1458b6d022c5c32d85db97e4de5997764495823' }, "Upload")),
+        return (h("div", { key: '6bb12dc9b274a9e17973b5a32ce9fab2ba7bb316', class: "overall_container" }, h("p", { key: '9fb60ec3edf105a1e6db1e34d9ecab8314f74143', class: "label_text text-sm-semi-bold" }, this.label), h("div", { key: 'e6b3063f050af1e1cebd1aae5056e1bb760c159d', class: `file_upload_item_base_container ${this.state} ${this.heightSize}` }, this.state === 'default' && (h(Fragment, null, this.heightSize === 'md' && [
+            h("div", { key: 'cfe050b5c4c8e68bd55bef292f73af78e52194c9', class: `default ${this.heightSize}` }, h("div", { key: 'a34ebc0c017f1c3acc408387d70b3738e18eccbe', class: "file_upload_icon" }, h("svg", { key: 'cce1f36b8a8df8453d6b80ce733aed22695a1f03', xmlns: "http://www.w3.org/2000/svg", width: "24", height: "24", viewBox: "0 0 24 24", fill: "none" }, h("path", { key: '7ce9cd9f0b464d084b5577cb991078e4d13ca261', d: "M17.5 9.01101V8.261L17.4981 8.26101L17.5 9.01101ZM9.54945 9.61023C9.8804 9.85933 10.3506 9.79298 10.5997 9.46204C10.8488 9.1311 10.7825 8.66088 10.4515 8.41178L9.54945 9.61023ZM15.6641 11.5394C15.4006 11.8591 15.4462 12.3317 15.7658 12.5952C16.0854 12.8587 16.5581 12.8132 16.8216 12.4936L15.6641 11.5394ZM17.9174 17.2546C17.5057 17.3002 17.209 17.6709 17.2546 18.0826C17.3002 18.4943 17.6709 18.791 18.0826 18.7454L17.9174 17.2546ZM5.85054 18.6623C6.25644 18.7448 6.65241 18.4827 6.73496 18.0768C6.8175 17.6709 6.55537 17.2749 6.14946 17.1924L5.85054 18.6623ZM12 13V12.25V13ZM11.25 21C11.25 21.4142 11.5858 21.75 12 21.75C12.4142 21.75 12.75 21.4142 12.75 21H11.25ZM8.96219 14.9773C8.67349 15.2743 8.68023 15.7491 8.97726 16.0378C9.27428 16.3265 9.74911 16.3198 10.0378 16.0227L8.96219 14.9773ZM13.9622 16.0227C14.2509 16.3198 14.7257 16.3265 15.0227 16.0378C15.3198 15.7491 15.3265 15.2743 15.0378 14.9773L13.9622 16.0227ZM12 3.75C14.6221 3.75 16.75 5.87987 16.75 8.51009H18.25C18.25 5.05403 15.4531 2.25 12 2.25V3.75ZM17.5 9.76101C19.5698 9.76101 21.25 11.4423 21.25 13.5193H22.75C22.75 10.6165 20.4008 8.26101 17.5 8.26101V9.76101ZM17.4794 9.76106L17.5019 9.761L17.4981 8.26101L17.4757 8.26106L17.4794 9.76106ZM16.75 8.51009C16.75 8.6565 16.7434 8.80117 16.7306 8.94386L18.2246 9.07826C18.2414 8.89095 18.25 8.70143 18.25 8.51009H16.75ZM2.75 13.0183C2.75 10.8031 4.43748 8.98389 6.5916 8.77853L6.44924 7.2853C3.53048 7.56356 1.25 10.0247 1.25 13.0183H2.75ZM6.5916 8.77853C6.72581 8.76574 6.86203 8.75917 7 8.75917V7.25917C6.81443 7.25917 6.6307 7.268 6.44924 7.2853L6.5916 8.77853ZM7.26768 8.09603C7.47668 5.66023 9.51709 3.75 12 3.75V2.25C8.72939 2.25 6.04797 4.76511 5.77317 7.9678L7.26768 8.09603ZM7 8.75917C7.95746 8.75917 8.83914 9.07557 9.54945 9.61023L10.4515 8.41178C9.49035 7.68831 8.29419 7.25917 7 7.25917V8.75917ZM16.7306 8.94386C16.6423 9.92517 16.2569 10.8203 15.6641 11.5394L16.8216 12.4936C17.6003 11.5489 18.1084 10.37 18.2246 9.07826L16.7306 8.94386ZM21.25 13.5193C21.25 15.4544 19.7906 17.0471 17.9174 17.2546L18.0826 18.7454C20.7093 18.4545 22.75 16.2252 22.75 13.5193H21.25ZM6.14946 17.1924C4.21067 16.7981 2.75 15.079 2.75 13.0183H1.25C1.25 15.8044 3.22485 18.1283 5.85054 18.6623L6.14946 17.1924ZM11.25 13V21H12.75V13H11.25ZM12 12.25C11.7417 12.25 11.5193 12.339 11.3578 12.4254C11.1904 12.515 11.0348 12.631 10.8968 12.7485C10.6213 12.9832 10.3457 13.285 10.0995 13.5755C9.85056 13.8693 9.60952 14.1784 9.40971 14.4328C9.19651 14.7042 9.05089 14.886 8.96219 14.9773L10.0378 16.0227C10.1949 15.8612 10.3971 15.604 10.5893 15.3593C10.7949 15.0975 11.0169 14.8132 11.2439 14.5452C11.4738 14.274 11.6873 14.0456 11.8694 13.8905C11.9601 13.8132 12.0255 13.7694 12.0656 13.7479C12.1116 13.7233 12.0832 13.75 12 13.75V12.25ZM15.0378 14.9773C14.9491 14.886 14.8035 14.7042 14.5903 14.4328C14.3905 14.1784 14.1494 13.8693 13.9005 13.5755C13.6543 13.285 13.3787 12.9832 13.1032 12.7485C12.9652 12.631 12.8096 12.515 12.6422 12.4254C12.4807 12.339 12.2583 12.25 12 12.25V13.75C11.9168 13.75 11.8884 13.7233 11.9344 13.7479C11.9745 13.7694 12.0399 13.8132 12.1306 13.8905C12.3127 14.0456 12.5262 14.274 12.7561 14.5452C12.9831 14.8132 13.2051 15.0975 13.4107 15.3593C13.6029 15.604 13.8051 15.8612 13.9622 16.0227L15.0378 14.9773Z", fill: "#4B5565" }))), h("div", { key: 'f69db9870421c4b5bfe40876214ec83d5579b02a', class: "default_content" }, h("p", { key: 'bb7b88bbdc8d2302324058fda5f66059cb405888', class: "upload_text text-sm-semi-bold" }, "Tap to upload"), h("p", { key: 'b26539cba8818b32eb42cc534c4d5edd565486e9', class: "file_type_text text-xs-regular" }, "SVG, PNG, JPG or GIF (max. 800x400px)"))),
+            h("gb-button", { key: '7b6649dda04d8ab1f071b7024e548eb923fb7486', size: "sm", hierarchy: "link_color", icon: "default", class: "upload_btn_md", "icon-leading": true, onClick: () => this.uploadButtonClicked.emit() }, h("p", { key: '75f251530af8575e8a8fd5c245ce2baf0b2410e4' }, "Upload")),
         ], this.heightSize === 'lg' && [
-            h("div", { key: '9b074f921260a9065922f53841f9e99f44a144a5', class: `default ${this.heightSize}` }, h("div", { key: 'ff487170a5c14580c2e8669654e9cc9be73911ed', class: "file_upload_icon" }, h("svg", { key: '52d81a2064c441ff21ca0d2e28f6228f9101fd19', xmlns: "http://www.w3.org/2000/svg", width: "24", height: "24", viewBox: "0 0 24 24", fill: "none" }, h("path", { key: '980a1844dc36d1b27cda2c6cccc157d74f79dbed', d: "M17.5 9.01101V8.261L17.4981 8.26101L17.5 9.01101ZM9.54945 9.61023C9.8804 9.85933 10.3506 9.79298 10.5997 9.46204C10.8488 9.1311 10.7825 8.66088 10.4515 8.41178L9.54945 9.61023ZM15.6641 11.5394C15.4006 11.8591 15.4462 12.3317 15.7658 12.5952C16.0854 12.8587 16.5581 12.8132 16.8216 12.4936L15.6641 11.5394ZM17.9174 17.2546C17.5057 17.3002 17.209 17.6709 17.2546 18.0826C17.3002 18.4943 17.6709 18.791 18.0826 18.7454L17.9174 17.2546ZM5.85054 18.6623C6.25644 18.7448 6.65241 18.4827 6.73496 18.0768C6.8175 17.6709 6.55537 17.2749 6.14946 17.1924L5.85054 18.6623ZM12 13V12.25V13ZM11.25 21C11.25 21.4142 11.5858 21.75 12 21.75C12.4142 21.75 12.75 21.4142 12.75 21H11.25ZM8.96219 14.9773C8.67349 15.2743 8.68023 15.7491 8.97726 16.0378C9.27428 16.3265 9.74911 16.3198 10.0378 16.0227L8.96219 14.9773ZM13.9622 16.0227C14.2509 16.3198 14.7257 16.3265 15.0227 16.0378C15.3198 15.7491 15.3265 15.2743 15.0378 14.9773L13.9622 16.0227ZM12 3.75C14.6221 3.75 16.75 5.87987 16.75 8.51009H18.25C18.25 5.05403 15.4531 2.25 12 2.25V3.75ZM17.5 9.76101C19.5698 9.76101 21.25 11.4423 21.25 13.5193H22.75C22.75 10.6165 20.4008 8.26101 17.5 8.26101V9.76101ZM17.4794 9.76106L17.5019 9.761L17.4981 8.26101L17.4757 8.26106L17.4794 9.76106ZM16.75 8.51009C16.75 8.6565 16.7434 8.80117 16.7306 8.94386L18.2246 9.07826C18.2414 8.89095 18.25 8.70143 18.25 8.51009H16.75ZM2.75 13.0183C2.75 10.8031 4.43748 8.98389 6.5916 8.77853L6.44924 7.2853C3.53048 7.56356 1.25 10.0247 1.25 13.0183H2.75ZM6.5916 8.77853C6.72581 8.76574 6.86203 8.75917 7 8.75917V7.25917C6.81443 7.25917 6.6307 7.268 6.44924 7.2853L6.5916 8.77853ZM7.26768 8.09603C7.47668 5.66023 9.51709 3.75 12 3.75V2.25C8.72939 2.25 6.04797 4.76511 5.77317 7.9678L7.26768 8.09603ZM7 8.75917C7.95746 8.75917 8.83914 9.07557 9.54945 9.61023L10.4515 8.41178C9.49035 7.68831 8.29419 7.25917 7 7.25917V8.75917ZM16.7306 8.94386C16.6423 9.92517 16.2569 10.8203 15.6641 11.5394L16.8216 12.4936C17.6003 11.5489 18.1084 10.37 18.2246 9.07826L16.7306 8.94386ZM21.25 13.5193C21.25 15.4544 19.7906 17.0471 17.9174 17.2546L18.0826 18.7454C20.7093 18.4545 22.75 16.2252 22.75 13.5193H21.25ZM6.14946 17.1924C4.21067 16.7981 2.75 15.079 2.75 13.0183H1.25C1.25 15.8044 3.22485 18.1283 5.85054 18.6623L6.14946 17.1924ZM11.25 13V21H12.75V13H11.25ZM12 12.25C11.7417 12.25 11.5193 12.339 11.3578 12.4254C11.1904 12.515 11.0348 12.631 10.8968 12.7485C10.6213 12.9832 10.3457 13.285 10.0995 13.5755C9.85056 13.8693 9.60952 14.1784 9.40971 14.4328C9.19651 14.7042 9.05089 14.886 8.96219 14.9773L10.0378 16.0227C10.1949 15.8612 10.3971 15.604 10.5893 15.3593C10.7949 15.0975 11.0169 14.8132 11.2439 14.5452C11.4738 14.274 11.6873 14.0456 11.8694 13.8905C11.9601 13.8132 12.0255 13.7694 12.0656 13.7479C12.1116 13.7233 12.0832 13.75 12 13.75V12.25ZM15.0378 14.9773C14.9491 14.886 14.8035 14.7042 14.5903 14.4328C14.3905 14.1784 14.1494 13.8693 13.9005 13.5755C13.6543 13.285 13.3787 12.9832 13.1032 12.7485C12.9652 12.631 12.8096 12.515 12.6422 12.4254C12.4807 12.339 12.2583 12.25 12 12.25V13.75C11.9168 13.75 11.8884 13.7233 11.9344 13.7479C11.9745 13.7694 12.0399 13.8132 12.1306 13.8905C12.3127 14.0456 12.5262 14.274 12.7561 14.5452C12.9831 14.8132 13.2051 15.0975 13.4107 15.3593C13.6029 15.604 13.8051 15.8612 13.9622 16.0227L15.0378 14.9773Z", fill: "#4B5565" }))), h("div", { key: 'b5ff5e83a4d856e253e999fc6030bd45f6815e39', class: "default_content" }, h("p", { key: '69aa3585d9d25f611f13381689711418bb789de8', class: `upload_text text-sm-regular ${this.heightSize}` }, h("gb-button", { key: 'c335eb5d889f249bed95dc8b425be40cc7e0b881', size: "sm", hierarchy: "link_color", icon: "default", onClick: () => this.uploadButtonClicked.emit() }, h("p", { key: '591ff45a9f1524f9ac103adef24fe841111e0e7c' }, "Click to upload")), "or drag and drop"), h("p", { key: 'ede90a0cb925fbad2243e1a333f08c8d8ac45bdb', class: "file_type_text text-xs-regular" }, "SVG, PNG, JPG or GIF (max. 800x400px)"))),
-        ])), this.state === 'in_progress' && (h("div", { key: '88ffe81b69a6776bdf1617b69fa9dad3c85b4d88', class: `in_progress_div ${this.heightSize}` }, h("div", { key: '34bb458e886f6249e4f257fd62133b0b3fe21259', class: "file_icon" }, h("gb-file-type-icon", { key: '8b1e4550b64fa0fb9a8074db7adbfacb6b616027', "file-style": this.icon === 'outline' ? 'default' : this.icon === 'solid' ? 'solid' : null, "file-type": this.fileType })), h("div", { key: 'dd9ac8f8ccf62717a8b57e01a3e1198f031d3391', class: "in_progress_content" }, this.heightSize === 'md' && (h(Fragment, null, h("p", { key: '9c8bcde51fca32cea4a23cd519c8facf8c59cada', class: `file_type_text ${this.state} text-sm-medium` }, this.fileName, ".", this.fileType), h("p", { key: 'ba7dc1de3474f12d0018c31e16260631c1c09087', class: `file_size_text ${this.state} text-sm-regular` }, this.fileSize), h("gb-progress-bar", { key: '5fbeb49d0c3f700bef98759ada0537dc98908fca', progress: this.progress, "show-label": true, "label-position": "right", class: "progress_bar" }), h("gb-button-close", { key: '3993ada956deae0d7e96947f4eaeb599e34f5cea', size: "sm", color: "gray", class: "close_button", onClick: () => this.cancelUpload.emit() }))), this.heightSize === 'lg' && (h(Fragment, null, h("p", { key: 'f9df19955d61e27ed25ee3a2b952630c9d6f16c7', class: `file_type_text ${this.state} text-sm-medium` }, this.fileName, ".", this.fileType), h("p", { key: 'ab29b9caf203419d47148b10bb44ef504c42b68c', class: `file_size_text ${this.state} text-sm-regular` }, this.fileSize), h("gb-progress-bar", { key: 'f134cef59bfddb1c7bc79136b7db4bf27c09b950', progress: this.progress, "show-label": true, "label-position": "right", class: "progress_bar" }), h("gb-button-close", { key: '8b2128338e8f100b0f78361a189d74ad1ef2b88d', size: "sm", color: "gray", class: "close_button", onClick: () => this.cancelUpload.emit() })))))), this.state === 'complete' && (h("div", { key: 'cc9be10718961cf20edf0de1c1724c09ebdb3949', class: `complete ${this.heightSize}` }, h("div", { key: '87a0a0d7d9b4698c57f321a866b6b1407a628ae0', class: "file_icon" }, h("gb-file-type-icon", { key: 'eff148d9a96e39480b256a4d347fb674f03146c8', "file-style": this.icon === 'outline' ? 'default' : this.icon === 'solid' ? 'solid' : null, "file-type": this.fileType })), h("div", { key: '62c8158494f9b2bdbf596e5f3c27091881ee8036', class: `complete_content ${this.heightSize}` }, this.heightSize === 'md' && (h(Fragment, null, h("p", { key: 'ddca6f0eef9ed6f0e0f6f7a45496141283f9fe0e', class: `file_type_text ${this.state} text-sm-medium` }, this.fileName, ".", this.fileType), h("p", { key: '856d49703d4ef1e4e9916e82861c871fdbdae5d1', class: `file_size_text ${this.state} text-sm-regular` }, `${this.fileSize}`, " \u2013 ", `${this.progress}`, "% uploaded"), h("gb-button", { key: '7cbff1e480536918a9183ad38738d567ba246a0a', size: "sm", hierarchy: "tertiary_gray", icon: "only", "icon-leading": true, "icon-leading-swap": "assets/delete-02.svg", class: "delete_button", onClick: () => this.deleteFileUpload.emit() }))), this.heightSize === 'lg' && (h(Fragment, null, h("p", { key: '4ea5dcf105cbf2ff92d12d776b251165c5ca9b80', class: `file_type_text ${this.state} text-sm-medium` }, this.fileName, ".", this.fileType), h("p", { key: '28173a5ef641c999f69ac50f6ad189e5cb8c5261', class: `file_size_text ${this.state} text-sm-regular` }, this.fileSize, " \u2013 ", `${this.progress}`, " % uploaded"), h("gb-button", { key: '8e3347cccc0ead2bcad033326f69a7afed1eeab1', size: "sm", hierarchy: "tertiary_gray", icon: "default", "icon-leading": true, "icon-leading-swap": "assets/delete-02.svg", onClick: () => this.deleteFileUpload.emit() }, h("p", { key: '866a1666cb1f0eb1f03808be75745598566959a9' }, "Clear"))))))), this.state === 'error' && (h("div", { key: '436318a5a53fe3cb1e40436a2b1cdf50796d9ec9', class: `error ${this.heightSize}` }, h("div", { key: '5eec4d6165144edb154cd16632a1ac1922d631a5', class: "file_icon" }, h("gb-file-type-icon", { key: '53d17eee4d5cba29e152c8d8c764db8f84daf5d6', "file-style": this.icon === 'outline' ? 'default' : this.icon === 'solid' ? 'solid' : null, "file-type": this.fileType })), h("div", { key: 'b10c49fcc02b71db3caa752f3333369880801f34', class: "error_content" }, this.heightSize === 'md' && (h(Fragment, null, h("div", { key: '913c2fb57e9a828d8711008e53a7f20047db35b7', class: "error_content_text" }, h("p", { key: '37b337142ce79ca0147353657fb14825fd12e2d8', class: `file_type_text ${this.state} text-sm-medium` }, this.fileName, ".", this.fileType), h("p", { key: '44a71d1f8f662d4f1fe22a9ba7d49a232cefcfa8', class: `file_size_text ${this.state} text-sm-regular` }, "Upload failed, please try again")), h("div", { key: 'c7791e5924c34c1621be469e5cc8181cb58c483b', class: "try_again_btn" }, h("gb-button", { key: '963f1dce10e4cc4c05132a297cb362ebfe169ce3', size: "sm", hierarchy: "link_color", icon: "default", destructive: true, onClick: () => this.tryAgainClicked.emit() }, h("p", { key: '713597a9ec9d9bc0ec8ca2088e2e1bd14aa7cc5c' }, "Try again"))), h("gb-button", { key: '99f02593782211e016b35507522a68d14e58c24d', size: "sm", hierarchy: "tertiary_gray", icon: "only", destructive: true, "icon-leading": true, "icon-leading-swap": "assets/delete-02.svg", class: "delete_button", onClick: () => this.deleteFileUpload.emit() }))), this.heightSize === 'lg' && (h(Fragment, null, h("p", { key: '2162e38d7433cdeff72f369aeef92dad55082606', class: `file_type_text ${this.state} text-sm-medium` }, this.fileName, ".", this.fileType), h("p", { key: '64c10b4588c11d7bf56e292b2409543a66e4da30', class: `file_size_text ${this.state} text-sm-regular` }, this.fileSize, " \u2013 ", `${this.progress}`, "% uploaded"), h("div", { key: 'eefd222783aaa460d173fa51b3e57a9de8251592', class: "btns" }, h("gb-button", { key: 'c4f0d280efd37d6afbd189f2309ffa0b3d368ffd', size: "sm", hierarchy: "tertiary_gray", icon: "default", destructive: true, "icon-leading": true, "icon-leading-swap": "assets/delete-02.svg", onClick: () => this.deleteFileUpload.emit() }, h("p", { key: 'cb02e1ee8c4764452d9ef853ddd6a743dcf07015' }, "Clear")), h("div", { key: 'a6bb3f44d9bc7033e9a69b504b251d2c86676e27', class: "btn" }, h("gb-button", { key: '534ca24806e8870204b32ed1bbfde46be1ff81f5', size: "sm", hierarchy: "link_color", icon: StateEnum.Default, destructive: true, class: "btn", onClick: () => this.tryAgainClicked.emit() }, h("p", { key: '5b27ff29dcc1f5dd27a25f73c5070a323d3607a5' }, "Try again")))))))))));
+            h("div", { key: 'ce4474b258c04087026432aa2e1a219aad6cc907', class: `default ${this.heightSize}` }, h("div", { key: '501b16dfd838d1378d7abaa2b8825e1fbb8c14b7', class: "file_upload_icon" }, h("svg", { key: 'f195656e1d4b92c9777b5acd512a391e9f2b4dfe', xmlns: "http://www.w3.org/2000/svg", width: "24", height: "24", viewBox: "0 0 24 24", fill: "none" }, h("path", { key: '128d849894371933008d5b61335daf1d0e0af47f', d: "M17.5 9.01101V8.261L17.4981 8.26101L17.5 9.01101ZM9.54945 9.61023C9.8804 9.85933 10.3506 9.79298 10.5997 9.46204C10.8488 9.1311 10.7825 8.66088 10.4515 8.41178L9.54945 9.61023ZM15.6641 11.5394C15.4006 11.8591 15.4462 12.3317 15.7658 12.5952C16.0854 12.8587 16.5581 12.8132 16.8216 12.4936L15.6641 11.5394ZM17.9174 17.2546C17.5057 17.3002 17.209 17.6709 17.2546 18.0826C17.3002 18.4943 17.6709 18.791 18.0826 18.7454L17.9174 17.2546ZM5.85054 18.6623C6.25644 18.7448 6.65241 18.4827 6.73496 18.0768C6.8175 17.6709 6.55537 17.2749 6.14946 17.1924L5.85054 18.6623ZM12 13V12.25V13ZM11.25 21C11.25 21.4142 11.5858 21.75 12 21.75C12.4142 21.75 12.75 21.4142 12.75 21H11.25ZM8.96219 14.9773C8.67349 15.2743 8.68023 15.7491 8.97726 16.0378C9.27428 16.3265 9.74911 16.3198 10.0378 16.0227L8.96219 14.9773ZM13.9622 16.0227C14.2509 16.3198 14.7257 16.3265 15.0227 16.0378C15.3198 15.7491 15.3265 15.2743 15.0378 14.9773L13.9622 16.0227ZM12 3.75C14.6221 3.75 16.75 5.87987 16.75 8.51009H18.25C18.25 5.05403 15.4531 2.25 12 2.25V3.75ZM17.5 9.76101C19.5698 9.76101 21.25 11.4423 21.25 13.5193H22.75C22.75 10.6165 20.4008 8.26101 17.5 8.26101V9.76101ZM17.4794 9.76106L17.5019 9.761L17.4981 8.26101L17.4757 8.26106L17.4794 9.76106ZM16.75 8.51009C16.75 8.6565 16.7434 8.80117 16.7306 8.94386L18.2246 9.07826C18.2414 8.89095 18.25 8.70143 18.25 8.51009H16.75ZM2.75 13.0183C2.75 10.8031 4.43748 8.98389 6.5916 8.77853L6.44924 7.2853C3.53048 7.56356 1.25 10.0247 1.25 13.0183H2.75ZM6.5916 8.77853C6.72581 8.76574 6.86203 8.75917 7 8.75917V7.25917C6.81443 7.25917 6.6307 7.268 6.44924 7.2853L6.5916 8.77853ZM7.26768 8.09603C7.47668 5.66023 9.51709 3.75 12 3.75V2.25C8.72939 2.25 6.04797 4.76511 5.77317 7.9678L7.26768 8.09603ZM7 8.75917C7.95746 8.75917 8.83914 9.07557 9.54945 9.61023L10.4515 8.41178C9.49035 7.68831 8.29419 7.25917 7 7.25917V8.75917ZM16.7306 8.94386C16.6423 9.92517 16.2569 10.8203 15.6641 11.5394L16.8216 12.4936C17.6003 11.5489 18.1084 10.37 18.2246 9.07826L16.7306 8.94386ZM21.25 13.5193C21.25 15.4544 19.7906 17.0471 17.9174 17.2546L18.0826 18.7454C20.7093 18.4545 22.75 16.2252 22.75 13.5193H21.25ZM6.14946 17.1924C4.21067 16.7981 2.75 15.079 2.75 13.0183H1.25C1.25 15.8044 3.22485 18.1283 5.85054 18.6623L6.14946 17.1924ZM11.25 13V21H12.75V13H11.25ZM12 12.25C11.7417 12.25 11.5193 12.339 11.3578 12.4254C11.1904 12.515 11.0348 12.631 10.8968 12.7485C10.6213 12.9832 10.3457 13.285 10.0995 13.5755C9.85056 13.8693 9.60952 14.1784 9.40971 14.4328C9.19651 14.7042 9.05089 14.886 8.96219 14.9773L10.0378 16.0227C10.1949 15.8612 10.3971 15.604 10.5893 15.3593C10.7949 15.0975 11.0169 14.8132 11.2439 14.5452C11.4738 14.274 11.6873 14.0456 11.8694 13.8905C11.9601 13.8132 12.0255 13.7694 12.0656 13.7479C12.1116 13.7233 12.0832 13.75 12 13.75V12.25ZM15.0378 14.9773C14.9491 14.886 14.8035 14.7042 14.5903 14.4328C14.3905 14.1784 14.1494 13.8693 13.9005 13.5755C13.6543 13.285 13.3787 12.9832 13.1032 12.7485C12.9652 12.631 12.8096 12.515 12.6422 12.4254C12.4807 12.339 12.2583 12.25 12 12.25V13.75C11.9168 13.75 11.8884 13.7233 11.9344 13.7479C11.9745 13.7694 12.0399 13.8132 12.1306 13.8905C12.3127 14.0456 12.5262 14.274 12.7561 14.5452C12.9831 14.8132 13.2051 15.0975 13.4107 15.3593C13.6029 15.604 13.8051 15.8612 13.9622 16.0227L15.0378 14.9773Z", fill: "#4B5565" }))), h("div", { key: 'e2e9fdd1d51673ad40592e4a952cd16f4b07d626', class: "default_content" }, h("p", { key: '73223f710a88347b3d33e461d03c0d99b149cd3a', class: `upload_text text-sm-regular ${this.heightSize}` }, h("gb-button", { key: '2ec7da502ea0845953540fe3408f004c0a033fc5', size: "sm", hierarchy: "link_color", icon: "default", onClick: () => this.uploadButtonClicked.emit() }, h("p", { key: '68a598fb8f9640b7e9e3b8ff7f0ebe4b69174617' }, "Click to upload")), "or drag and drop"), h("p", { key: '66812ec63f5645825c3ed7c225f6e1b81239c60e', class: "file_type_text text-xs-regular" }, "SVG, PNG, JPG or GIF (max. 800x400px)"))),
+        ])), this.state === 'in_progress' && (h("div", { key: '11ecf5b25da05f11e2c7e04ceaad5e81dc5482f2', class: `in_progress_div ${this.heightSize}` }, h("div", { key: '9f48061994a8c83d010ce86c68223071d049b8e2', class: "file_icon" }, h("gb-file-type-icon", { key: '2e8e0762911e781507af9449021e2815a14fd10d', "file-style": this.icon === 'outline' ? 'default' : this.icon === 'solid' ? 'solid' : null, "file-type": this.fileType })), h("div", { key: '8d7a3fd06fb0f0e6dcdec180ac61cfdf66379e0e', class: "in_progress_content" }, this.heightSize === 'md' && (h(Fragment, null, h("p", { key: '06e14f442086510de2181d655a7cc694a92d8219', class: `file_type_text ${this.state} text-sm-medium` }, this.fileName, ".", this.fileType), h("p", { key: '7709696aec5c1f1381771b287b6cbe5a25aeed03', class: `file_size_text ${this.state} text-sm-regular` }, this.fileSize), h("gb-progress-bar", { key: '8b87223d01600f47a4d58498b950e445e8db59fc', progress: this.progress, "show-label": true, "label-position": "right", class: "progress_bar" }), h("gb-button-close", { key: 'a0d93b19df6bd451b32e18dc4de9d05a5b324b9b', size: "sm", color: "gray", class: "close_button", onClick: () => this.cancelUpload.emit() }))), this.heightSize === 'lg' && (h(Fragment, null, h("p", { key: '1729f5a9527dafef8122161ca0f7d646d14a0e2f', class: `file_type_text ${this.state} text-sm-medium` }, this.fileName, ".", this.fileType), h("p", { key: '3b68411d3e62d528340c9b664b326c2f7f81c558', class: `file_size_text ${this.state} text-sm-regular` }, this.fileSize), h("gb-progress-bar", { key: 'e96e20bd88a34418025b0d526ff1c80c3a025eef', progress: this.progress, "show-label": true, "label-position": "right", class: "progress_bar" }), h("gb-button-close", { key: '6f1da86a6075b4739b0a7c31a171512ed72b3277', size: "sm", color: "gray", class: "close_button", onClick: () => this.cancelUpload.emit() })))))), this.state === 'complete' && (h("div", { key: '87c98b4b6449f65b224ab21ed9aff125bfbe60c6', class: `complete ${this.heightSize}` }, h("div", { key: '6c7836ba60078667100b7edbe4ae8718fe5af27b', class: "file_icon" }, h("gb-file-type-icon", { key: '7c01a423ad1a9ed9237dc8845ebb43be2a2da246', "file-style": this.icon === 'outline' ? 'default' : this.icon === 'solid' ? 'solid' : null, "file-type": this.fileType })), h("div", { key: 'be48efdc56323fcd98f099cfcc9aa21284063048', class: `complete_content ${this.heightSize}` }, this.heightSize === 'md' && (h(Fragment, null, h("p", { key: '0c682c19c62d07881aa8230752cfebf08c1e4678', class: `file_type_text ${this.state} text-sm-medium` }, this.fileName, ".", this.fileType), h("p", { key: '8b0288c8655834e76a230b317face14b70d96a8c', class: `file_size_text ${this.state} text-sm-regular` }, `${this.fileSize}`, " \u2013 ", `${this.progress}`, "% uploaded"), h("gb-button", { key: '2372ce710fafad19dae4ef659c2481d062ba4f72', size: "sm", hierarchy: "tertiary_gray", icon: "only", "icon-leading": true, "icon-leading-swap": "assets/delete-02.svg", class: "delete_button", onClick: () => this.deleteFileUpload.emit() }))), this.heightSize === 'lg' && (h(Fragment, null, h("p", { key: '42b720ebd0e24b95e29c185c5485813cc98f4391', class: `file_type_text ${this.state} text-sm-medium` }, this.fileName, ".", this.fileType), h("p", { key: '36061fb764aec9f10f72ac00b6540c5d43fddf80', class: `file_size_text ${this.state} text-sm-regular` }, this.fileSize, " \u2013 ", `${this.progress}`, " % uploaded"), h("gb-button", { key: '549c995f03d39f3954996548d1861224e838960f', size: "sm", hierarchy: "tertiary_gray", icon: "default", "icon-leading": true, "icon-leading-swap": "assets/delete-02.svg", onClick: () => this.deleteFileUpload.emit() }, h("p", { key: '0860be0cb1ff72f86129ff86ce13043ee0a62f8f' }, "Clear"))))))), this.state === 'error' && (h("div", { key: '6d42aed4b5ec2257d0a75540c2e051a8e55528ad', class: `error ${this.heightSize}` }, h("div", { key: '73ddc90cb61f08ae1d816ad21172da283d7574f2', class: "file_icon" }, h("gb-file-type-icon", { key: 'de25f5790f1497ba55dc893de2a21368ca4ab414', "file-style": this.icon === 'outline' ? 'default' : this.icon === 'solid' ? 'solid' : null, "file-type": this.fileType })), h("div", { key: 'cdda6b1cdb7c8c02495f4560d103bdc52a2fc985', class: "error_content" }, this.heightSize === 'md' && (h(Fragment, null, h("div", { key: '7ecc1508fb8deafdd82a08a49fedada26c45b49b', class: "error_content_text" }, h("p", { key: '93b585c9d91d03816746283b273c69db36a0c8f3', class: `file_type_text ${this.state} text-sm-medium` }, this.fileName, ".", this.fileType), h("p", { key: '847016a4e22a39905c9a7abef9acad477e9c45c2', class: `file_size_text ${this.state} text-sm-regular` }, "Upload failed, please try again")), h("div", { key: '380237f4d7f527ec95103ea6c1718c175866bead', class: "try_again_btn" }, h("gb-button", { key: '5e6b90b3ba5d9f115fe3a21707b12652e94661c3', size: "sm", hierarchy: "link_color", icon: "default", destructive: true, onClick: () => this.tryAgainClicked.emit() }, h("p", { key: '896fc20bace7a5c3e509783c5f2fd8a049f39fcf' }, "Try again"))), h("gb-button", { key: '7cbce02c99eec0735e31edec3762b15976218fda', size: "sm", hierarchy: "tertiary_gray", icon: "only", destructive: true, "icon-leading": true, "icon-leading-swap": "assets/delete-02.svg", class: "delete_button", onClick: () => this.deleteFileUpload.emit() }))), this.heightSize === 'lg' && (h(Fragment, null, h("p", { key: 'cb5c8b3c7d5d589f3edb563ba2ac3044007a03a0', class: `file_type_text ${this.state} text-sm-medium` }, this.fileName, ".", this.fileType), h("p", { key: 'e1a6bb31d08804da54a3c1ca330d52440f4524b9', class: `file_size_text ${this.state} text-sm-regular` }, this.fileSize, " \u2013 ", `${this.progress}`, "% uploaded"), h("div", { key: '8009e1792475240489af724e5ebeec54a7e056a4', class: "btns" }, h("gb-button", { key: '9453a44556b6306923c66c8bf7785f71c7443dd4', size: "sm", hierarchy: "tertiary_gray", icon: "default", destructive: true, "icon-leading": true, "icon-leading-swap": "assets/delete-02.svg", onClick: () => this.deleteFileUpload.emit() }, h("p", { key: '1bc4da83260e4fc259d3aadbb670e03f3d322e82' }, "Clear")), h("div", { key: 'a709307dfa2454d8b627ebbfce64676539b04bfb', class: "btn" }, h("gb-button", { key: '3546f44381ca87d8839bad42cf5278949703f08f', size: "sm", hierarchy: "link_color", icon: StateEnum.Default, destructive: true, class: "btn", onClick: () => this.tryAgainClicked.emit() }, h("p", { key: 'd0e8d03ce3a8ff82ed29228b6534b9b40668b823' }, "Try again"))))))))))));
     }
     static get is() { return "gb-file-upload-item-base"; }
     static get encapsulation() { return "shadow"; }
@@ -51,6 +52,26 @@ export class GbFileUploadItemBase {
                 "attribute": "icon",
                 "reflect": false
             },
+            "label": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "attribute": "label",
+                "reflect": false,
+                "defaultValue": "''"
+            },
             "state": {
                 "type": "string",
                 "mutable": false,

package/dist/collection/components/gb-file-upload-item-base/gb-file-upload-item-base.js.map

@@ -1 +1 @@
-{"version":3,"file":"gb-file-upload-item-base.js","sourceRoot":"","sources":["../../../src/components/gb-file-upload-item-base/gb-file-upload-item-base.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, h, Prop, Fragment, Event, EventEmitter } from '@stencil/core';\r\nimport { FileIconTypes, FileUploadIconType, FileUploadStates, GeneralSizes, StateEnum } from '../../models/reusableModels';\r\n\r\n@Component({\r\n  tag: 'gb-file-upload-item-base',\r\n  styleUrl: 'gb-file-upload-item-base.css',\r\n  shadow: true,\r\n})\r\nexport class GbFileUploadItemBase {\r\n  @Prop() icon: FileUploadIconType;\r\n  @Prop() state: FileUploadStates;\r\n  @Prop() heightSize: GeneralSizes = 'md';\r\n  @Prop() fileType: FileIconTypes;\r\n  // @Prop() buttonState: StateEnum = StateEnum.Default;\r\n  @Prop() progress: number;\r\n  // @Prop() size: number;\r\n  @Prop() fileSize: number;\r\n  @Prop() fileName: string;\r\n  @Event() uploadButtonClicked: EventEmitter<void>;\r\n  @Event() cancelUpload: EventEmitter<void>;\r\n  @Event() deleteFileUpload: EventEmitter<void>;\r\n  @Event() tryAgainClicked: EventEmitter<void>;\r\n\r\n  render() {\r\n    return (\r\n      <div class={`file_upload_item_base_container ${this.state} ${this.heightSize}`}>\r\n        {this.state === 'default' && (\r\n          <>\r\n            {this.heightSize === 'md' && [\r\n              <div class={`default ${this.heightSize}`}>\r\n                <div class=\"file_upload_icon\">\r\n                  <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\">\r\n                    <path\r\n                      d=\"M17.5 9.01101V8.261L17.4981 8.26101L17.5 9.01101ZM9.54945 9.61023C9.8804 9.85933 10.3506 9.79298 10.5997 9.46204C10.8488 9.1311 10.7825 8.66088 10.4515 8.41178L9.54945 9.61023ZM15.6641 11.5394C15.4006 11.8591 15.4462 12.3317 15.7658 12.5952C16.0854 12.8587 16.5581 12.8132 16.8216 12.4936L15.6641 11.5394ZM17.9174 17.2546C17.5057 17.3002 17.209 17.6709 17.2546 18.0826C17.3002 18.4943 17.6709 18.791 18.0826 18.7454L17.9174 17.2546ZM5.85054 18.6623C6.25644 18.7448 6.65241 18.4827 6.73496 18.0768C6.8175 17.6709 6.55537 17.2749 6.14946 17.1924L5.85054 18.6623ZM12 13V12.25V13ZM11.25 21C11.25 21.4142 11.5858 21.75 12 21.75C12.4142 21.75 12.75 21.4142 12.75 21H11.25ZM8.96219 14.9773C8.67349 15.2743 8.68023 15.7491 8.97726 16.0378C9.27428 16.3265 9.74911 16.3198 10.0378 16.0227L8.96219 14.9773ZM13.9622 16.0227C14.2509 16.3198 14.7257 16.3265 15.0227 16.0378C15.3198 15.7491 15.3265 15.2743 15.0378 14.9773L13.9622 16.0227ZM12 3.75C14.6221 3.75 16.75 5.87987 16.75 8.51009H18.25C18.25 5.05403 15.4531 2.25 12 2.25V3.75ZM17.5 9.76101C19.5698 9.76101 21.25 11.4423 21.25 13.5193H22.75C22.75 10.6165 20.4008 8.26101 17.5 8.26101V9.76101ZM17.4794 9.76106L17.5019 9.761L17.4981 8.26101L17.4757 8.26106L17.4794 9.76106ZM16.75 8.51009C16.75 8.6565 16.7434 8.80117 16.7306 8.94386L18.2246 9.07826C18.2414 8.89095 18.25 8.70143 18.25 8.51009H16.75ZM2.75 13.0183C2.75 10.8031 4.43748 8.98389 6.5916 8.77853L6.44924 7.2853C3.53048 7.56356 1.25 10.0247 1.25 13.0183H2.75ZM6.5916 8.77853C6.72581 8.76574 6.86203 8.75917 7 8.75917V7.25917C6.81443 7.25917 6.6307 7.268 6.44924 7.2853L6.5916 8.77853ZM7.26768 8.09603C7.47668 5.66023 9.51709 3.75 12 3.75V2.25C8.72939 2.25 6.04797 4.76511 5.77317 7.9678L7.26768 8.09603ZM7 8.75917C7.95746 8.75917 8.83914 9.07557 9.54945 9.61023L10.4515 8.41178C9.49035 7.68831 8.29419 7.25917 7 7.25917V8.75917ZM16.7306 8.94386C16.6423 9.92517 16.2569 10.8203 15.6641 11.5394L16.8216 12.4936C17.6003 11.5489 18.1084 10.37 18.2246 9.07826L16.7306 8.94386ZM21.25 13.5193C21.25 15.4544 19.7906 17.0471 17.9174 17.2546L18.0826 18.7454C20.7093 18.4545 22.75 16.2252 22.75 13.5193H21.25ZM6.14946 17.1924C4.21067 16.7981 2.75 15.079 2.75 13.0183H1.25C1.25 15.8044 3.22485 18.1283 5.85054 18.6623L6.14946 17.1924ZM11.25 13V21H12.75V13H11.25ZM12 12.25C11.7417 12.25 11.5193 12.339 11.3578 12.4254C11.1904 12.515 11.0348 12.631 10.8968 12.7485C10.6213 12.9832 10.3457 13.285 10.0995 13.5755C9.85056 13.8693 9.60952 14.1784 9.40971 14.4328C9.19651 14.7042 9.05089 14.886 8.96219 14.9773L10.0378 16.0227C10.1949 15.8612 10.3971 15.604 10.5893 15.3593C10.7949 15.0975 11.0169 14.8132 11.2439 14.5452C11.4738 14.274 11.6873 14.0456 11.8694 13.8905C11.9601 13.8132 12.0255 13.7694 12.0656 13.7479C12.1116 13.7233 12.0832 13.75 12 13.75V12.25ZM15.0378 14.9773C14.9491 14.886 14.8035 14.7042 14.5903 14.4328C14.3905 14.1784 14.1494 13.8693 13.9005 13.5755C13.6543 13.285 13.3787 12.9832 13.1032 12.7485C12.9652 12.631 12.8096 12.515 12.6422 12.4254C12.4807 12.339 12.2583 12.25 12 12.25V13.75C11.9168 13.75 11.8884 13.7233 11.9344 13.7479C11.9745 13.7694 12.0399 13.8132 12.1306 13.8905C12.3127 14.0456 12.5262 14.274 12.7561 14.5452C12.9831 14.8132 13.2051 15.0975 13.4107 15.3593C13.6029 15.604 13.8051 15.8612 13.9622 16.0227L15.0378 14.9773Z\"\r\n                      fill=\"#4B5565\"\r\n                    />\r\n                  </svg>\r\n                </div>\r\n                <div class=\"default_content\">\r\n                  <p class=\"upload_text text-sm-semi-bold\">Tap to upload</p>\r\n                  <p class=\"file_type_text text-xs-regular\">SVG, PNG, JPG or GIF (max. 800x400px)</p>\r\n                </div>\r\n              </div>,\r\n              <gb-button size=\"sm\" hierarchy=\"link_color\" icon=\"default\" class=\"upload_btn_md\" icon-leading={true} onClick={() => this.uploadButtonClicked.emit()}>\r\n                <p>Upload</p>\r\n              </gb-button>,\r\n            ]}\r\n            {this.heightSize === 'lg' && [\r\n              <div class={`default ${this.heightSize}`}>\r\n                <div class=\"file_upload_icon\">\r\n                  <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\">\r\n                    <path\r\n                      d=\"M17.5 9.01101V8.261L17.4981 8.26101L17.5 9.01101ZM9.54945 9.61023C9.8804 9.85933 10.3506 9.79298 10.5997 9.46204C10.8488 9.1311 10.7825 8.66088 10.4515 8.41178L9.54945 9.61023ZM15.6641 11.5394C15.4006 11.8591 15.4462 12.3317 15.7658 12.5952C16.0854 12.8587 16.5581 12.8132 16.8216 12.4936L15.6641 11.5394ZM17.9174 17.2546C17.5057 17.3002 17.209 17.6709 17.2546 18.0826C17.3002 18.4943 17.6709 18.791 18.0826 18.7454L17.9174 17.2546ZM5.85054 18.6623C6.25644 18.7448 6.65241 18.4827 6.73496 18.0768C6.8175 17.6709 6.55537 17.2749 6.14946 17.1924L5.85054 18.6623ZM12 13V12.25V13ZM11.25 21C11.25 21.4142 11.5858 21.75 12 21.75C12.4142 21.75 12.75 21.4142 12.75 21H11.25ZM8.96219 14.9773C8.67349 15.2743 8.68023 15.7491 8.97726 16.0378C9.27428 16.3265 9.74911 16.3198 10.0378 16.0227L8.96219 14.9773ZM13.9622 16.0227C14.2509 16.3198 14.7257 16.3265 15.0227 16.0378C15.3198 15.7491 15.3265 15.2743 15.0378 14.9773L13.9622 16.0227ZM12 3.75C14.6221 3.75 16.75 5.87987 16.75 8.51009H18.25C18.25 5.05403 15.4531 2.25 12 2.25V3.75ZM17.5 9.76101C19.5698 9.76101 21.25 11.4423 21.25 13.5193H22.75C22.75 10.6165 20.4008 8.26101 17.5 8.26101V9.76101ZM17.4794 9.76106L17.5019 9.761L17.4981 8.26101L17.4757 8.26106L17.4794 9.76106ZM16.75 8.51009C16.75 8.6565 16.7434 8.80117 16.7306 8.94386L18.2246 9.07826C18.2414 8.89095 18.25 8.70143 18.25 8.51009H16.75ZM2.75 13.0183C2.75 10.8031 4.43748 8.98389 6.5916 8.77853L6.44924 7.2853C3.53048 7.56356 1.25 10.0247 1.25 13.0183H2.75ZM6.5916 8.77853C6.72581 8.76574 6.86203 8.75917 7 8.75917V7.25917C6.81443 7.25917 6.6307 7.268 6.44924 7.2853L6.5916 8.77853ZM7.26768 8.09603C7.47668 5.66023 9.51709 3.75 12 3.75V2.25C8.72939 2.25 6.04797 4.76511 5.77317 7.9678L7.26768 8.09603ZM7 8.75917C7.95746 8.75917 8.83914 9.07557 9.54945 9.61023L10.4515 8.41178C9.49035 7.68831 8.29419 7.25917 7 7.25917V8.75917ZM16.7306 8.94386C16.6423 9.92517 16.2569 10.8203 15.6641 11.5394L16.8216 12.4936C17.6003 11.5489 18.1084 10.37 18.2246 9.07826L16.7306 8.94386ZM21.25 13.5193C21.25 15.4544 19.7906 17.0471 17.9174 17.2546L18.0826 18.7454C20.7093 18.4545 22.75 16.2252 22.75 13.5193H21.25ZM6.14946 17.1924C4.21067 16.7981 2.75 15.079 2.75 13.0183H1.25C1.25 15.8044 3.22485 18.1283 5.85054 18.6623L6.14946 17.1924ZM11.25 13V21H12.75V13H11.25ZM12 12.25C11.7417 12.25 11.5193 12.339 11.3578 12.4254C11.1904 12.515 11.0348 12.631 10.8968 12.7485C10.6213 12.9832 10.3457 13.285 10.0995 13.5755C9.85056 13.8693 9.60952 14.1784 9.40971 14.4328C9.19651 14.7042 9.05089 14.886 8.96219 14.9773L10.0378 16.0227C10.1949 15.8612 10.3971 15.604 10.5893 15.3593C10.7949 15.0975 11.0169 14.8132 11.2439 14.5452C11.4738 14.274 11.6873 14.0456 11.8694 13.8905C11.9601 13.8132 12.0255 13.7694 12.0656 13.7479C12.1116 13.7233 12.0832 13.75 12 13.75V12.25ZM15.0378 14.9773C14.9491 14.886 14.8035 14.7042 14.5903 14.4328C14.3905 14.1784 14.1494 13.8693 13.9005 13.5755C13.6543 13.285 13.3787 12.9832 13.1032 12.7485C12.9652 12.631 12.8096 12.515 12.6422 12.4254C12.4807 12.339 12.2583 12.25 12 12.25V13.75C11.9168 13.75 11.8884 13.7233 11.9344 13.7479C11.9745 13.7694 12.0399 13.8132 12.1306 13.8905C12.3127 14.0456 12.5262 14.274 12.7561 14.5452C12.9831 14.8132 13.2051 15.0975 13.4107 15.3593C13.6029 15.604 13.8051 15.8612 13.9622 16.0227L15.0378 14.9773Z\"\r\n                      fill=\"#4B5565\"\r\n                    />\r\n                  </svg>\r\n                </div>\r\n                <div class=\"default_content\">\r\n                  <p class={`upload_text text-sm-regular ${this.heightSize}`}>\r\n                    <gb-button size=\"sm\" hierarchy=\"link_color\" icon=\"default\" onClick={() => this.uploadButtonClicked.emit()}>\r\n                      <p>Click to upload</p>\r\n                    </gb-button>\r\n                    or drag and drop\r\n                  </p>\r\n                  <p class=\"file_type_text text-xs-regular\">SVG, PNG, JPG or GIF (max. 800x400px)</p>\r\n                </div>\r\n              </div>,\r\n            ]}\r\n          </>\r\n        )}\r\n        {this.state === 'in_progress' && (\r\n          <div class={`in_progress_div ${this.heightSize}`}>\r\n            <div class=\"file_icon\">\r\n              <gb-file-type-icon file-style={this.icon === 'outline' ? 'default' : this.icon === 'solid' ? 'solid' : null} file-type={this.fileType}></gb-file-type-icon>\r\n            </div>\r\n            <div class=\"in_progress_content\">\r\n              {this.heightSize === 'md' && (\r\n                <>\r\n                  <p class={`file_type_text ${this.state} text-sm-medium`}>\r\n                    {this.fileName}.{this.fileType}\r\n                  </p>\r\n                  <p class={`file_size_text ${this.state} text-sm-regular`}>{this.fileSize}</p>\r\n                  <gb-progress-bar progress={this.progress} show-label={true} label-position=\"right\" class=\"progress_bar\"></gb-progress-bar>\r\n                  <gb-button-close size=\"sm\" color=\"gray\" class=\"close_button\" onClick={() => this.cancelUpload.emit()}></gb-button-close>\r\n                </>\r\n              )}\r\n              {this.heightSize === 'lg' && (\r\n                <>\r\n                  <p class={`file_type_text ${this.state} text-sm-medium`}>\r\n                    {this.fileName}.{this.fileType}\r\n                  </p>\r\n                  <p class={`file_size_text ${this.state} text-sm-regular`}>{this.fileSize}</p>\r\n                  <gb-progress-bar progress={this.progress} show-label={true} label-position=\"right\" class=\"progress_bar\"></gb-progress-bar>\r\n                  <gb-button-close size=\"sm\" color=\"gray\" class=\"close_button\" onClick={() => this.cancelUpload.emit()}></gb-button-close>\r\n                </>\r\n              )}\r\n            </div>\r\n          </div>\r\n        )}\r\n        {this.state === 'complete' && (\r\n          <div class={`complete ${this.heightSize}`}>\r\n            <div class=\"file_icon\">\r\n              <gb-file-type-icon file-style={this.icon === 'outline' ? 'default' : this.icon === 'solid' ? 'solid' : null} file-type={this.fileType}></gb-file-type-icon>\r\n            </div>\r\n            <div class={`complete_content ${this.heightSize}`}>\r\n              {this.heightSize === 'md' && (\r\n                <>\r\n                  <p class={`file_type_text ${this.state} text-sm-medium`}>\r\n                    {this.fileName}.{this.fileType}\r\n                  </p>\r\n                  <p class={`file_size_text ${this.state} text-sm-regular`}>\r\n                    {`${this.fileSize}`} – {`${this.progress}`}% uploaded\r\n                  </p>\r\n                  <gb-button\r\n                    size=\"sm\"\r\n                    hierarchy=\"tertiary_gray\"\r\n                    icon=\"only\"\r\n                    icon-leading={true}\r\n                    icon-leading-swap=\"assets/delete-02.svg\"\r\n                    class=\"delete_button\"\r\n                    onClick={() => this.deleteFileUpload.emit()}\r\n                  ></gb-button>\r\n                </>\r\n              )}\r\n              {this.heightSize === 'lg' && (\r\n                <>\r\n                  <p class={`file_type_text ${this.state} text-sm-medium`}>\r\n                    {this.fileName}.{this.fileType}\r\n                  </p>\r\n                  <p class={`file_size_text ${this.state} text-sm-regular`}>\r\n                    {this.fileSize} – {`${this.progress}`} % uploaded\r\n                  </p>\r\n                  <gb-button\r\n                    size=\"sm\"\r\n                    hierarchy=\"tertiary_gray\"\r\n                    icon=\"default\"\r\n                    icon-leading={true}\r\n                    icon-leading-swap=\"assets/delete-02.svg\"\r\n                    onClick={() => this.deleteFileUpload.emit()}\r\n                  >\r\n                    <p>Clear</p>\r\n                  </gb-button>\r\n                </>\r\n              )}\r\n            </div>\r\n          </div>\r\n        )}\r\n        {this.state === 'error' && (\r\n          <div class={`error ${this.heightSize}`}>\r\n            <div class=\"file_icon\">\r\n              <gb-file-type-icon file-style={this.icon === 'outline' ? 'default' : this.icon === 'solid' ? 'solid' : null} file-type={this.fileType}></gb-file-type-icon>\r\n            </div>\r\n            <div class=\"error_content\">\r\n              {this.heightSize === 'md' && (\r\n                <>\r\n                  <div class=\"error_content_text\">\r\n                    <p class={`file_type_text ${this.state} text-sm-medium`}>\r\n                      {this.fileName}.{this.fileType}\r\n                    </p>\r\n                    <p class={`file_size_text ${this.state} text-sm-regular`}>Upload failed, please try again</p>\r\n                  </div>\r\n                  <div class=\"try_again_btn\">\r\n                    <gb-button size=\"sm\" hierarchy=\"link_color\" icon=\"default\" destructive={true} onClick={() => this.tryAgainClicked.emit()}>\r\n                      <p>Try again</p>\r\n                    </gb-button>\r\n                  </div>\r\n                  <gb-button\r\n                    size=\"sm\"\r\n                    hierarchy=\"tertiary_gray\"\r\n                    icon=\"only\"\r\n                    destructive={true}\r\n                    icon-leading={true}\r\n                    icon-leading-swap=\"assets/delete-02.svg\"\r\n                    class=\"delete_button\"\r\n                    onClick={() => this.deleteFileUpload.emit()}\r\n                  ></gb-button>\r\n                </>\r\n              )}\r\n              {this.heightSize === 'lg' && (\r\n                <>\r\n                  <p class={`file_type_text ${this.state} text-sm-medium`}>\r\n                    {this.fileName}.{this.fileType}\r\n                  </p>\r\n                  <p class={`file_size_text ${this.state} text-sm-regular`}>\r\n                    {this.fileSize} – {`${this.progress}`}% uploaded\r\n                  </p>\r\n                  <div class=\"btns\">\r\n                    <gb-button\r\n                      size=\"sm\"\r\n                      hierarchy=\"tertiary_gray\"\r\n                      icon=\"default\"\r\n                      destructive={true}\r\n                      icon-leading={true}\r\n                      icon-leading-swap=\"assets/delete-02.svg\"\r\n                      onClick={() => this.deleteFileUpload.emit()}\r\n                    >\r\n                      <p>Clear</p>\r\n                    </gb-button>\r\n                    <div class=\"btn\">\r\n                      <gb-button size=\"sm\" hierarchy=\"link_color\" icon={StateEnum.Default} destructive={true} class=\"btn\" onClick={() => this.tryAgainClicked.emit()}>\r\n                        <p>Try again</p>\r\n                      </gb-button>\r\n                    </div>\r\n                  </div>\r\n                </>\r\n              )}\r\n            </div>\r\n          </div>\r\n        )}\r\n      </div>\r\n    );\r\n  }\r\n}\r\n"]}
+{"version":3,"file":"gb-file-upload-item-base.js","sourceRoot":"","sources":["../../../src/components/gb-file-upload-item-base/gb-file-upload-item-base.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, h, Prop, Fragment, Event, EventEmitter } from '@stencil/core';\r\nimport { FileIconTypes, FileUploadIconType, FileUploadStates, GeneralSizes, StateEnum } from '../../models/reusableModels';\r\n\r\n@Component({\r\n  tag: 'gb-file-upload-item-base',\r\n  styleUrl: 'gb-file-upload-item-base.css',\r\n  shadow: true,\r\n})\r\nexport class GbFileUploadItemBase {\r\n  @Prop() icon: FileUploadIconType;\r\n  @Prop() label: string = '';\r\n  @Prop() state: FileUploadStates;\r\n  @Prop() heightSize: GeneralSizes = 'md';\r\n  @Prop() fileType: FileIconTypes;\r\n  // @Prop() buttonState: StateEnum = StateEnum.Default;\r\n  @Prop() progress: number;\r\n  // @Prop() size: number;\r\n  @Prop() fileSize: number;\r\n  @Prop() fileName: string;\r\n  @Event() uploadButtonClicked: EventEmitter<void>;\r\n  @Event() cancelUpload: EventEmitter<void>;\r\n  @Event() deleteFileUpload: EventEmitter<void>;\r\n  @Event() tryAgainClicked: EventEmitter<void>;\r\n\r\n  render() {\r\n    return (\r\n      <div class=\"overall_container\">\r\n        <p class=\"label_text text-sm-semi-bold\">{this.label}</p>\r\n        <div class={`file_upload_item_base_container ${this.state} ${this.heightSize}`}>\r\n          {this.state === 'default' && (\r\n            <>\r\n              {this.heightSize === 'md' && [\r\n                <div class={`default ${this.heightSize}`}>\r\n                  <div class=\"file_upload_icon\">\r\n                    <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\">\r\n                      <path\r\n                        d=\"M17.5 9.01101V8.261L17.4981 8.26101L17.5 9.01101ZM9.54945 9.61023C9.8804 9.85933 10.3506 9.79298 10.5997 9.46204C10.8488 9.1311 10.7825 8.66088 10.4515 8.41178L9.54945 9.61023ZM15.6641 11.5394C15.4006 11.8591 15.4462 12.3317 15.7658 12.5952C16.0854 12.8587 16.5581 12.8132 16.8216 12.4936L15.6641 11.5394ZM17.9174 17.2546C17.5057 17.3002 17.209 17.6709 17.2546 18.0826C17.3002 18.4943 17.6709 18.791 18.0826 18.7454L17.9174 17.2546ZM5.85054 18.6623C6.25644 18.7448 6.65241 18.4827 6.73496 18.0768C6.8175 17.6709 6.55537 17.2749 6.14946 17.1924L5.85054 18.6623ZM12 13V12.25V13ZM11.25 21C11.25 21.4142 11.5858 21.75 12 21.75C12.4142 21.75 12.75 21.4142 12.75 21H11.25ZM8.96219 14.9773C8.67349 15.2743 8.68023 15.7491 8.97726 16.0378C9.27428 16.3265 9.74911 16.3198 10.0378 16.0227L8.96219 14.9773ZM13.9622 16.0227C14.2509 16.3198 14.7257 16.3265 15.0227 16.0378C15.3198 15.7491 15.3265 15.2743 15.0378 14.9773L13.9622 16.0227ZM12 3.75C14.6221 3.75 16.75 5.87987 16.75 8.51009H18.25C18.25 5.05403 15.4531 2.25 12 2.25V3.75ZM17.5 9.76101C19.5698 9.76101 21.25 11.4423 21.25 13.5193H22.75C22.75 10.6165 20.4008 8.26101 17.5 8.26101V9.76101ZM17.4794 9.76106L17.5019 9.761L17.4981 8.26101L17.4757 8.26106L17.4794 9.76106ZM16.75 8.51009C16.75 8.6565 16.7434 8.80117 16.7306 8.94386L18.2246 9.07826C18.2414 8.89095 18.25 8.70143 18.25 8.51009H16.75ZM2.75 13.0183C2.75 10.8031 4.43748 8.98389 6.5916 8.77853L6.44924 7.2853C3.53048 7.56356 1.25 10.0247 1.25 13.0183H2.75ZM6.5916 8.77853C6.72581 8.76574 6.86203 8.75917 7 8.75917V7.25917C6.81443 7.25917 6.6307 7.268 6.44924 7.2853L6.5916 8.77853ZM7.26768 8.09603C7.47668 5.66023 9.51709 3.75 12 3.75V2.25C8.72939 2.25 6.04797 4.76511 5.77317 7.9678L7.26768 8.09603ZM7 8.75917C7.95746 8.75917 8.83914 9.07557 9.54945 9.61023L10.4515 8.41178C9.49035 7.68831 8.29419 7.25917 7 7.25917V8.75917ZM16.7306 8.94386C16.6423 9.92517 16.2569 10.8203 15.6641 11.5394L16.8216 12.4936C17.6003 11.5489 18.1084 10.37 18.2246 9.07826L16.7306 8.94386ZM21.25 13.5193C21.25 15.4544 19.7906 17.0471 17.9174 17.2546L18.0826 18.7454C20.7093 18.4545 22.75 16.2252 22.75 13.5193H21.25ZM6.14946 17.1924C4.21067 16.7981 2.75 15.079 2.75 13.0183H1.25C1.25 15.8044 3.22485 18.1283 5.85054 18.6623L6.14946 17.1924ZM11.25 13V21H12.75V13H11.25ZM12 12.25C11.7417 12.25 11.5193 12.339 11.3578 12.4254C11.1904 12.515 11.0348 12.631 10.8968 12.7485C10.6213 12.9832 10.3457 13.285 10.0995 13.5755C9.85056 13.8693 9.60952 14.1784 9.40971 14.4328C9.19651 14.7042 9.05089 14.886 8.96219 14.9773L10.0378 16.0227C10.1949 15.8612 10.3971 15.604 10.5893 15.3593C10.7949 15.0975 11.0169 14.8132 11.2439 14.5452C11.4738 14.274 11.6873 14.0456 11.8694 13.8905C11.9601 13.8132 12.0255 13.7694 12.0656 13.7479C12.1116 13.7233 12.0832 13.75 12 13.75V12.25ZM15.0378 14.9773C14.9491 14.886 14.8035 14.7042 14.5903 14.4328C14.3905 14.1784 14.1494 13.8693 13.9005 13.5755C13.6543 13.285 13.3787 12.9832 13.1032 12.7485C12.9652 12.631 12.8096 12.515 12.6422 12.4254C12.4807 12.339 12.2583 12.25 12 12.25V13.75C11.9168 13.75 11.8884 13.7233 11.9344 13.7479C11.9745 13.7694 12.0399 13.8132 12.1306 13.8905C12.3127 14.0456 12.5262 14.274 12.7561 14.5452C12.9831 14.8132 13.2051 15.0975 13.4107 15.3593C13.6029 15.604 13.8051 15.8612 13.9622 16.0227L15.0378 14.9773Z\"\r\n                        fill=\"#4B5565\"\r\n                      />\r\n                    </svg>\r\n                  </div>\r\n                  <div class=\"default_content\">\r\n                    <p class=\"upload_text text-sm-semi-bold\">Tap to upload</p>\r\n                    <p class=\"file_type_text text-xs-regular\">SVG, PNG, JPG or GIF (max. 800x400px)</p>\r\n                  </div>\r\n                </div>,\r\n                <gb-button size=\"sm\" hierarchy=\"link_color\" icon=\"default\" class=\"upload_btn_md\" icon-leading={true} onClick={() => this.uploadButtonClicked.emit()}>\r\n                  <p>Upload</p>\r\n                </gb-button>,\r\n              ]}\r\n              {this.heightSize === 'lg' && [\r\n                <div class={`default ${this.heightSize}`}>\r\n                  <div class=\"file_upload_icon\">\r\n                    <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\">\r\n                      <path\r\n                        d=\"M17.5 9.01101V8.261L17.4981 8.26101L17.5 9.01101ZM9.54945 9.61023C9.8804 9.85933 10.3506 9.79298 10.5997 9.46204C10.8488 9.1311 10.7825 8.66088 10.4515 8.41178L9.54945 9.61023ZM15.6641 11.5394C15.4006 11.8591 15.4462 12.3317 15.7658 12.5952C16.0854 12.8587 16.5581 12.8132 16.8216 12.4936L15.6641 11.5394ZM17.9174 17.2546C17.5057 17.3002 17.209 17.6709 17.2546 18.0826C17.3002 18.4943 17.6709 18.791 18.0826 18.7454L17.9174 17.2546ZM5.85054 18.6623C6.25644 18.7448 6.65241 18.4827 6.73496 18.0768C6.8175 17.6709 6.55537 17.2749 6.14946 17.1924L5.85054 18.6623ZM12 13V12.25V13ZM11.25 21C11.25 21.4142 11.5858 21.75 12 21.75C12.4142 21.75 12.75 21.4142 12.75 21H11.25ZM8.96219 14.9773C8.67349 15.2743 8.68023 15.7491 8.97726 16.0378C9.27428 16.3265 9.74911 16.3198 10.0378 16.0227L8.96219 14.9773ZM13.9622 16.0227C14.2509 16.3198 14.7257 16.3265 15.0227 16.0378C15.3198 15.7491 15.3265 15.2743 15.0378 14.9773L13.9622 16.0227ZM12 3.75C14.6221 3.75 16.75 5.87987 16.75 8.51009H18.25C18.25 5.05403 15.4531 2.25 12 2.25V3.75ZM17.5 9.76101C19.5698 9.76101 21.25 11.4423 21.25 13.5193H22.75C22.75 10.6165 20.4008 8.26101 17.5 8.26101V9.76101ZM17.4794 9.76106L17.5019 9.761L17.4981 8.26101L17.4757 8.26106L17.4794 9.76106ZM16.75 8.51009C16.75 8.6565 16.7434 8.80117 16.7306 8.94386L18.2246 9.07826C18.2414 8.89095 18.25 8.70143 18.25 8.51009H16.75ZM2.75 13.0183C2.75 10.8031 4.43748 8.98389 6.5916 8.77853L6.44924 7.2853C3.53048 7.56356 1.25 10.0247 1.25 13.0183H2.75ZM6.5916 8.77853C6.72581 8.76574 6.86203 8.75917 7 8.75917V7.25917C6.81443 7.25917 6.6307 7.268 6.44924 7.2853L6.5916 8.77853ZM7.26768 8.09603C7.47668 5.66023 9.51709 3.75 12 3.75V2.25C8.72939 2.25 6.04797 4.76511 5.77317 7.9678L7.26768 8.09603ZM7 8.75917C7.95746 8.75917 8.83914 9.07557 9.54945 9.61023L10.4515 8.41178C9.49035 7.68831 8.29419 7.25917 7 7.25917V8.75917ZM16.7306 8.94386C16.6423 9.92517 16.2569 10.8203 15.6641 11.5394L16.8216 12.4936C17.6003 11.5489 18.1084 10.37 18.2246 9.07826L16.7306 8.94386ZM21.25 13.5193C21.25 15.4544 19.7906 17.0471 17.9174 17.2546L18.0826 18.7454C20.7093 18.4545 22.75 16.2252 22.75 13.5193H21.25ZM6.14946 17.1924C4.21067 16.7981 2.75 15.079 2.75 13.0183H1.25C1.25 15.8044 3.22485 18.1283 5.85054 18.6623L6.14946 17.1924ZM11.25 13V21H12.75V13H11.25ZM12 12.25C11.7417 12.25 11.5193 12.339 11.3578 12.4254C11.1904 12.515 11.0348 12.631 10.8968 12.7485C10.6213 12.9832 10.3457 13.285 10.0995 13.5755C9.85056 13.8693 9.60952 14.1784 9.40971 14.4328C9.19651 14.7042 9.05089 14.886 8.96219 14.9773L10.0378 16.0227C10.1949 15.8612 10.3971 15.604 10.5893 15.3593C10.7949 15.0975 11.0169 14.8132 11.2439 14.5452C11.4738 14.274 11.6873 14.0456 11.8694 13.8905C11.9601 13.8132 12.0255 13.7694 12.0656 13.7479C12.1116 13.7233 12.0832 13.75 12 13.75V12.25ZM15.0378 14.9773C14.9491 14.886 14.8035 14.7042 14.5903 14.4328C14.3905 14.1784 14.1494 13.8693 13.9005 13.5755C13.6543 13.285 13.3787 12.9832 13.1032 12.7485C12.9652 12.631 12.8096 12.515 12.6422 12.4254C12.4807 12.339 12.2583 12.25 12 12.25V13.75C11.9168 13.75 11.8884 13.7233 11.9344 13.7479C11.9745 13.7694 12.0399 13.8132 12.1306 13.8905C12.3127 14.0456 12.5262 14.274 12.7561 14.5452C12.9831 14.8132 13.2051 15.0975 13.4107 15.3593C13.6029 15.604 13.8051 15.8612 13.9622 16.0227L15.0378 14.9773Z\"\r\n                        fill=\"#4B5565\"\r\n                      />\r\n                    </svg>\r\n                  </div>\r\n                  <div class=\"default_content\">\r\n                    <p class={`upload_text text-sm-regular ${this.heightSize}`}>\r\n                      <gb-button size=\"sm\" hierarchy=\"link_color\" icon=\"default\" onClick={() => this.uploadButtonClicked.emit()}>\r\n                        <p>Click to upload</p>\r\n                      </gb-button>\r\n                      or drag and drop\r\n                    </p>\r\n                    <p class=\"file_type_text text-xs-regular\">SVG, PNG, JPG or GIF (max. 800x400px)</p>\r\n                  </div>\r\n                </div>,\r\n              ]}\r\n            </>\r\n          )}\r\n          {this.state === 'in_progress' && (\r\n            <div class={`in_progress_div ${this.heightSize}`}>\r\n              <div class=\"file_icon\">\r\n                <gb-file-type-icon file-style={this.icon === 'outline' ? 'default' : this.icon === 'solid' ? 'solid' : null} file-type={this.fileType}></gb-file-type-icon>\r\n              </div>\r\n              <div class=\"in_progress_content\">\r\n                {this.heightSize === 'md' && (\r\n                  <>\r\n                    <p class={`file_type_text ${this.state} text-sm-medium`}>\r\n                      {this.fileName}.{this.fileType}\r\n                    </p>\r\n                    <p class={`file_size_text ${this.state} text-sm-regular`}>{this.fileSize}</p>\r\n                    <gb-progress-bar progress={this.progress} show-label={true} label-position=\"right\" class=\"progress_bar\"></gb-progress-bar>\r\n                    <gb-button-close size=\"sm\" color=\"gray\" class=\"close_button\" onClick={() => this.cancelUpload.emit()}></gb-button-close>\r\n                  </>\r\n                )}\r\n                {this.heightSize === 'lg' && (\r\n                  <>\r\n                    <p class={`file_type_text ${this.state} text-sm-medium`}>\r\n                      {this.fileName}.{this.fileType}\r\n                    </p>\r\n                    <p class={`file_size_text ${this.state} text-sm-regular`}>{this.fileSize}</p>\r\n                    <gb-progress-bar progress={this.progress} show-label={true} label-position=\"right\" class=\"progress_bar\"></gb-progress-bar>\r\n                    <gb-button-close size=\"sm\" color=\"gray\" class=\"close_button\" onClick={() => this.cancelUpload.emit()}></gb-button-close>\r\n                  </>\r\n                )}\r\n              </div>\r\n            </div>\r\n          )}\r\n          {this.state === 'complete' && (\r\n            <div class={`complete ${this.heightSize}`}>\r\n              <div class=\"file_icon\">\r\n                <gb-file-type-icon file-style={this.icon === 'outline' ? 'default' : this.icon === 'solid' ? 'solid' : null} file-type={this.fileType}></gb-file-type-icon>\r\n              </div>\r\n              <div class={`complete_content ${this.heightSize}`}>\r\n                {this.heightSize === 'md' && (\r\n                  <>\r\n                    <p class={`file_type_text ${this.state} text-sm-medium`}>\r\n                      {this.fileName}.{this.fileType}\r\n                    </p>\r\n                    <p class={`file_size_text ${this.state} text-sm-regular`}>\r\n                      {`${this.fileSize}`} – {`${this.progress}`}% uploaded\r\n                    </p>\r\n                    <gb-button\r\n                      size=\"sm\"\r\n                      hierarchy=\"tertiary_gray\"\r\n                      icon=\"only\"\r\n                      icon-leading={true}\r\n                      icon-leading-swap=\"assets/delete-02.svg\"\r\n                      class=\"delete_button\"\r\n                      onClick={() => this.deleteFileUpload.emit()}\r\n                    ></gb-button>\r\n                  </>\r\n                )}\r\n                {this.heightSize === 'lg' && (\r\n                  <>\r\n                    <p class={`file_type_text ${this.state} text-sm-medium`}>\r\n                      {this.fileName}.{this.fileType}\r\n                    </p>\r\n                    <p class={`file_size_text ${this.state} text-sm-regular`}>\r\n                      {this.fileSize} – {`${this.progress}`} % uploaded\r\n                    </p>\r\n                    <gb-button\r\n                      size=\"sm\"\r\n                      hierarchy=\"tertiary_gray\"\r\n                      icon=\"default\"\r\n                      icon-leading={true}\r\n                      icon-leading-swap=\"assets/delete-02.svg\"\r\n                      onClick={() => this.deleteFileUpload.emit()}\r\n                    >\r\n                      <p>Clear</p>\r\n                    </gb-button>\r\n                  </>\r\n                )}\r\n              </div>\r\n            </div>\r\n          )}\r\n          {this.state === 'error' && (\r\n            <div class={`error ${this.heightSize}`}>\r\n              <div class=\"file_icon\">\r\n                <gb-file-type-icon file-style={this.icon === 'outline' ? 'default' : this.icon === 'solid' ? 'solid' : null} file-type={this.fileType}></gb-file-type-icon>\r\n              </div>\r\n              <div class=\"error_content\">\r\n                {this.heightSize === 'md' && (\r\n                  <>\r\n                    <div class=\"error_content_text\">\r\n                      <p class={`file_type_text ${this.state} text-sm-medium`}>\r\n                        {this.fileName}.{this.fileType}\r\n                      </p>\r\n                      <p class={`file_size_text ${this.state} text-sm-regular`}>Upload failed, please try again</p>\r\n                    </div>\r\n                    <div class=\"try_again_btn\">\r\n                      <gb-button size=\"sm\" hierarchy=\"link_color\" icon=\"default\" destructive={true} onClick={() => this.tryAgainClicked.emit()}>\r\n                        <p>Try again</p>\r\n                      </gb-button>\r\n                    </div>\r\n                    <gb-button\r\n                      size=\"sm\"\r\n                      hierarchy=\"tertiary_gray\"\r\n                      icon=\"only\"\r\n                      destructive={true}\r\n                      icon-leading={true}\r\n                      icon-leading-swap=\"assets/delete-02.svg\"\r\n                      class=\"delete_button\"\r\n                      onClick={() => this.deleteFileUpload.emit()}\r\n                    ></gb-button>\r\n                  </>\r\n                )}\r\n                {this.heightSize === 'lg' && (\r\n                  <>\r\n                    <p class={`file_type_text ${this.state} text-sm-medium`}>\r\n                      {this.fileName}.{this.fileType}\r\n                    </p>\r\n                    <p class={`file_size_text ${this.state} text-sm-regular`}>\r\n                      {this.fileSize} – {`${this.progress}`}% uploaded\r\n                    </p>\r\n                    <div class=\"btns\">\r\n                      <gb-button\r\n                        size=\"sm\"\r\n                        hierarchy=\"tertiary_gray\"\r\n                        icon=\"default\"\r\n                        destructive={true}\r\n                        icon-leading={true}\r\n                        icon-leading-swap=\"assets/delete-02.svg\"\r\n                        onClick={() => this.deleteFileUpload.emit()}\r\n                      >\r\n                        <p>Clear</p>\r\n                      </gb-button>\r\n                      <div class=\"btn\">\r\n                        <gb-button size=\"sm\" hierarchy=\"link_color\" icon={StateEnum.Default} destructive={true} class=\"btn\" onClick={() => this.tryAgainClicked.emit()}>\r\n                          <p>Try again</p>\r\n                        </gb-button>\r\n                      </div>\r\n                    </div>\r\n                  </>\r\n                )}\r\n              </div>\r\n            </div>\r\n          )}\r\n        </div>\r\n      </div>\r\n    );\r\n  }\r\n}\r\n"]}

package/dist/collection/components/gb-filter-button/gb-filter-button.js

@@ -10,7 +10,7 @@ export class GbFilterButton {
         }
     }
     render() {
-        return (h("div", { key: '833ac00d47f07fd7d987af564a636725eb2948cb', class: `filter_button_div` }, h("gb-button", { key: 'ca98cafb9db7fbb5bc35233dd16f3d755819a3e9', size: "md", state: "default", hierarchy: "secondary_gray", icon: this.iconOnly ? 'only' : 'default', "icon-leading": true, "icon-leading-swap": "assets/filter-horizontal-stroke.svg" }, h("p", { key: '3d928110b33a5dfa7e2db5b0627b188d6fbe34cd' }, "Filter")), this.state === 'applied' && (h("gb-badge", { key: '05b300278c32cb78d1aa7c066a39007953b88152', size: "sm", type: "pill_color", color: "error", icon: "false", class: `badge ${this.state}` }, h("slot", { key: 'dfdc451173a3e6aec045caa6f64e76e4639271bf', name: "filter_count" })))));
+        return (h("div", { key: 'b4e58a379fdd33068d893dec1eff4ede36a132b7', class: `filter_button_div` }, h("gb-button", { key: '12359cf7e9c0592d6f23d688c0ac90c476ef21ba', size: "md", state: "default", hierarchy: "secondary_gray", icon: this.iconOnly ? 'only' : 'default', "icon-leading": true, "icon-leading-swap": "assets/filter-horizontal-stroke.svg" }, h("p", { key: '229e8cbb782fd811d591915260d2568e1a00b6e3' }, "Filter")), this.state === 'applied' && (h("gb-badge", { key: '29154cd735022afaa9ba2e271baccaf0d993e621', size: "sm", type: "pill_color", color: "error", icon: "false", class: `badge ${this.state}` }, h("slot", { key: '8d2ccf7a9bd5d8851f36d7d41825e9400b90be07', name: "filter_count" })))));
     }
     static get is() { return "gb-filter-button"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/gb-header/gb-header.js

@@ -48,7 +48,7 @@ export class GbHeader {
         const notificationIconSrc = getAssetPath(`assets/notification-03.svg`);
         const logo = getAssetPath(`assets/globus_bank_logo_blue.svg`);
         const iconLogo = getAssetPath(`assets/globus_bank_logo_white.svg`);
-        return (h("div", { key: 'a6857c591e0e27b733ea30b8895aba0ca08f3b99', class: `header_div` }, h("div", { key: 'ac7ee20a148d437f820d1587423a943e28e9f78b', class: "content" }, this.showLogo && (h(Fragment, null, h("div", { key: 'b1792255a27df730398a5c9eeb2afffc2423d508', class: "logo", onClick: () => this.onNavBarItemClicked('logo') }, h("img", { key: '430601c5e9c29674eca7d6db2efc42a03aae3ba1', src: logo, alt: "" })), h("div", { key: '817af15270a52f20a8ac176513db0ca28a7b8c7c', class: "icon_logo", onClick: () => this.onNavBarItemClicked('logo') }, h("img", { key: '5567c7cf01d64c1b9f9b3d673af0e36d4155693b', src: iconLogo, alt: "" })))), h("div", { key: 'da8343435d5cedeb9a4962bc4f098853a7e3da3a', class: "inner_content" }, h("div", { key: '071f16a7bea8c532d96a7ad7ac6303dd097176f8', class: `action` }, this.showHelp && h("gb-header-icon", { key: '572865a5e03f88bee5afb03133778494e2a97837', state: StateEnum.Default, icon: helpIconSrc, onClick: () => this.onNavBarItemClicked('help') }), this.showNotification && (h("gb-header-icon", { key: '4205539fa2661cddae6953a3cf1b5b0f1296b25c', state: this.state, icon: notificationIconSrc, "show-indicator": this.showIndicator, onClick: () => this.onNavBarItemClicked('notification') }))), h("gb-avatar", { key: '1a73c35d68e2fcb5d56731d97a4e17c1ff362fe3', size: "md", text: this.text, placeholder: this.placeholder, color: this.color, "show-border": this.showBorder, onClick: () => this.onNavBarItemClicked('avatar') }, this.text ? h("slot", { slot: "initials", name: "initials" }) : h("slot", { name: "image", slot: "image" }))))));
+        return (h("div", { key: 'ed47b16659821bb879c75657ae21a951cc433383', class: `header_div` }, h("div", { key: '81924f93458e7d697f34a6218546708a824c53da', class: "content" }, this.showLogo && (h(Fragment, null, h("div", { key: '4bef92b9f1c5ab8d1f86ae7b18e8594d4dd1b578', class: "logo", onClick: () => this.onNavBarItemClicked('logo') }, h("img", { key: 'f17f2b4d13bd847339dbfca799e887f2fb4944b9', src: logo, alt: "" })), h("div", { key: '9ac5546b083adcbfd01bb1d9df67e9f94a6ee500', class: "icon_logo", onClick: () => this.onNavBarItemClicked('logo') }, h("img", { key: '3173270556d4a6a1fe16c962e3a965cf191e907f', src: iconLogo, alt: "" })))), h("div", { key: '8af4b52ecfaec331c2df3f639f7ef35005c5bf3b', class: "inner_content" }, h("div", { key: '34bf9bf61f660183b15bcfd6ee30e2fbf1a55476', class: `action` }, this.showHelp && h("gb-header-icon", { key: 'ada4dc1cc3390535d8e7310cac1a6658d4d6151f', state: StateEnum.Default, icon: helpIconSrc, onClick: () => this.onNavBarItemClicked('help') }), this.showNotification && (h("gb-header-icon", { key: 'f3dc1e84cfc18f1ba1650cd7a0147bc7c069a577', state: this.state, icon: notificationIconSrc, "show-indicator": this.showIndicator, onClick: () => this.onNavBarItemClicked('notification') }))), h("gb-avatar", { key: '4a2e4f89327d3ffc7bae0a54f01dd6de3920f017', size: "md", text: this.text, placeholder: this.placeholder, color: this.color, "show-border": this.showBorder, onClick: () => this.onNavBarItemClicked('avatar') }, this.text ? h("slot", { slot: "initials", name: "initials" }) : h("slot", { name: "image", slot: "image" }))))));
     }
     static get is() { return "gb-header"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/gb-header-icon/gb-header-icon.js

@@ -7,13 +7,13 @@ export class GbHeaderIcon {
     }
     render() {
         return [
-            h("div", { key: '778b39fedef5fc9a088c965f840db994299e15ab', class: `background ${this.state}` }, this.state === StateEnum.Default && [
+            h("div", { key: '97c9a6bacffe1f528f27ff061466fb2559c38ff3', class: `background ${this.state}` }, this.state === StateEnum.Default && [
                 // <svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20" fill="none">
                 //     <path d="M3.72919 7.73286L4.47919 7.73293V7.73286H3.72919ZM16.2706 7.73286H15.5206V7.73293L16.2706 7.73286ZM16.3065 14.2952L16.5863 14.9911L16.3065 14.2952ZM3.6933 14.2952L3.97308 13.5994L3.97308 13.5994L3.6933 14.2952ZM16.8452 10.1617L16.2307 10.5916L16.2332 10.5951L16.8452 10.1617ZM17.8916 11.9951L17.1507 12.1115L17.1507 12.1115L17.8916 11.9951ZM3.15459 10.1617L3.76669 10.5951L3.76915 10.5916L3.15459 10.1617ZM2.10819 11.9951L1.36728 11.8786H1.36728L2.10819 11.9951ZM7.9616 16.909C7.63517 16.654 7.16384 16.7119 6.90886 17.0383C6.65388 17.3648 6.7118 17.8361 7.03824 18.0911L7.9616 16.909ZM12.9616 18.0911C13.288 17.8361 13.346 17.3648 13.091 17.0383C12.836 16.7119 12.3647 16.654 12.0382 16.909L12.9616 18.0911ZM16.0268 13.5994C12.4873 15.0225 7.51251 15.0225 3.97308 13.5994L3.41351 14.9911C7.31201 16.5586 12.6878 16.5586 16.5863 14.9911L16.0268 13.5994ZM17.0206 7.73286C17.0206 3.94514 13.8537 0.916687 9.99992 0.916687V2.41669C13.0726 2.41669 15.5206 4.82007 15.5206 7.73286H17.0206ZM4.47919 7.73286C4.47919 4.82007 6.92727 2.41669 9.99992 2.41669V0.916687C6.14612 0.916687 2.97919 3.94514 2.97919 7.73286H4.47919ZM3.97308 13.5994C3.14627 13.2669 2.75147 12.7326 2.84909 12.1115L1.36728 11.8786C1.11048 13.5125 2.30023 14.5434 3.41351 14.9911L3.97308 13.5994ZM16.5863 14.9911C17.6996 14.5434 18.8894 13.5125 18.6326 11.8786L17.1507 12.1115C17.2484 12.7326 16.8536 13.2669 16.0268 13.5994L16.5863 14.9911ZM17.4598 9.73179C17.0815 9.19099 17.0207 8.58744 17.0206 7.7328L15.5206 7.73293C15.5207 8.61212 15.5638 9.63826 16.2307 10.5916L17.4598 9.73179ZM3.76915 10.5916C4.43604 9.63825 4.47911 8.61212 4.47919 7.73293L2.97919 7.7328C2.97911 8.58744 2.91834 9.19099 2.54003 9.73179L3.76915 10.5916ZM2.54251 9.72827C2.45079 9.8578 2.35253 9.98608 2.23845 10.1379C2.12877 10.2839 2.00871 10.4463 1.89595 10.6178C1.67289 10.957 1.44576 11.3793 1.36728 11.8786L2.84909 12.1115C2.87952 11.9179 2.97611 11.7052 3.14928 11.4419C3.23464 11.3121 3.33082 11.1812 3.43773 11.0389C3.54024 10.9024 3.65891 10.7473 3.76668 10.5951L2.54251 9.72827ZM16.2332 10.5951C16.3409 10.7473 16.4596 10.9024 16.5621 11.0389C16.669 11.1812 16.7652 11.3121 16.8506 11.4419C17.0237 11.7052 17.1203 11.9179 17.1507 12.1115L18.6326 11.8786C18.5541 11.3793 18.327 10.957 18.1039 10.6178C17.9911 10.4463 17.8711 10.2839 17.7614 10.1379C17.6473 9.98608 17.5491 9.8578 17.4573 9.72827L16.2332 10.5951ZM9.99992 17.5834C9.20289 17.5834 8.49015 17.3218 7.9616 16.909L7.03824 18.0911C7.83658 18.7147 8.87606 19.0834 9.99992 19.0834V17.5834ZM12.0382 16.909C11.5097 17.3218 10.7969 17.5834 9.99992 17.5834V19.0834C11.1238 19.0834 12.1633 18.7147 12.9616 18.0911L12.0382 16.909Z" fill="#4B5565"/>
                 // </svg>,
-                h("img", { key: '9ff70be346108f0f732849d54395fa4a6f34420c', src: this.icon, alt: "", class: "icon" }),
-                h(Fragment, null, this.showIndicator && (h("div", { key: '955cbdd195cc579f716f302677722f07dfbccddb', class: "red_dot" })))
-            ], this.state === StateEnum.Disabled && (h("svg", { key: '3936ebe032ee899b3c4580b8d1aefd61889dae40', xmlns: "http://www.w3.org/2000/svg", width: "20", height: "20", viewBox: "0 0 20 20", fill: "none" }, h("path", { key: '74467626a4f3e76597816bb66348fe1710ea31a3', d: "M3.72919 7.73286L4.47919 7.73293V7.73286H3.72919ZM16.2706 7.73286H15.5206V7.73293L16.2706 7.73286ZM16.3065 14.2952L16.5863 14.9911L16.3065 14.2952ZM3.6933 14.2952L3.97308 13.5994L3.97308 13.5994L3.6933 14.2952ZM16.8452 10.1617L16.2307 10.5916L16.2332 10.5951L16.8452 10.1617ZM17.8916 11.9951L17.1507 12.1115L17.1507 12.1115L17.8916 11.9951ZM3.15459 10.1617L3.76669 10.5951L3.76915 10.5916L3.15459 10.1617ZM2.10819 11.9951L1.36728 11.8786H1.36728L2.10819 11.9951ZM7.9616 16.909C7.63517 16.654 7.16384 16.7119 6.90886 17.0383C6.65388 17.3648 6.7118 17.8361 7.03824 18.0911L7.9616 16.909ZM12.9616 18.0911C13.288 17.8361 13.346 17.3648 13.091 17.0383C12.836 16.7119 12.3647 16.654 12.0382 16.909L12.9616 18.0911ZM16.0268 13.5994C12.4873 15.0225 7.51251 15.0225 3.97308 13.5994L3.41351 14.9911C7.31201 16.5586 12.6878 16.5586 16.5863 14.9911L16.0268 13.5994ZM17.0206 7.73286C17.0206 3.94514 13.8537 0.916687 9.99992 0.916687V2.41669C13.0726 2.41669 15.5206 4.82007 15.5206 7.73286H17.0206ZM4.47919 7.73286C4.47919 4.82007 6.92727 2.41669 9.99992 2.41669V0.916687C6.14612 0.916687 2.97919 3.94514 2.97919 7.73286H4.47919ZM3.97308 13.5994C3.14627 13.2669 2.75147 12.7326 2.84909 12.1115L1.36728 11.8786C1.11048 13.5125 2.30023 14.5434 3.41351 14.9911L3.97308 13.5994ZM16.5863 14.9911C17.6996 14.5434 18.8894 13.5125 18.6326 11.8786L17.1507 12.1115C17.2484 12.7326 16.8536 13.2669 16.0268 13.5994L16.5863 14.9911ZM17.4598 9.73179C17.0815 9.19099 17.0207 8.58744 17.0206 7.7328L15.5206 7.73293C15.5207 8.61212 15.5638 9.63826 16.2307 10.5916L17.4598 9.73179ZM3.76915 10.5916C4.43604 9.63825 4.47911 8.61212 4.47919 7.73293L2.97919 7.7328C2.97911 8.58744 2.91834 9.19099 2.54003 9.73179L3.76915 10.5916ZM2.54251 9.72827C2.45079 9.8578 2.35253 9.98608 2.23845 10.1379C2.12877 10.2839 2.00871 10.4463 1.89595 10.6178C1.67289 10.957 1.44576 11.3793 1.36728 11.8786L2.84909 12.1115C2.87952 11.9179 2.97611 11.7052 3.14928 11.4419C3.23464 11.3121 3.33082 11.1812 3.43773 11.0389C3.54024 10.9024 3.65891 10.7473 3.76668 10.5951L2.54251 9.72827ZM16.2332 10.5951C16.3409 10.7473 16.4596 10.9024 16.5621 11.0389C16.669 11.1812 16.7652 11.3121 16.8506 11.4419C17.0237 11.7052 17.1203 11.9179 17.1507 12.1115L18.6326 11.8786C18.5541 11.3793 18.327 10.957 18.1039 10.6178C17.9911 10.4463 17.8711 10.2839 17.7614 10.1379C17.6473 9.98608 17.5491 9.8578 17.4573 9.72827L16.2332 10.5951ZM9.99992 17.5834C9.20289 17.5834 8.49015 17.3218 7.9616 16.909L7.03824 18.0911C7.83658 18.7147 8.87606 19.0834 9.99992 19.0834V17.5834ZM12.0382 16.909C11.5097 17.3218 10.7969 17.5834 9.99992 17.5834V19.0834C11.1238 19.0834 12.1633 18.7147 12.9616 18.0911L12.0382 16.909Z", fill: "#CDD5DF" }))))
+                h("img", { key: '61779868e994cdeb8ad7b3b962338e5de967dbbf', src: this.icon, alt: "", class: "icon" }),
+                h(Fragment, null, this.showIndicator && (h("div", { key: 'c7c8a724f33c71c7c155788669258a542be54174', class: "red_dot" })))
+            ], this.state === StateEnum.Disabled && (h("svg", { key: '12b82a50c2878375dc662d50b118ccf4d64e432e', xmlns: "http://www.w3.org/2000/svg", width: "20", height: "20", viewBox: "0 0 20 20", fill: "none" }, h("path", { key: '6441c9f5fbbd827945c319d786274a0959f9ecd5', d: "M3.72919 7.73286L4.47919 7.73293V7.73286H3.72919ZM16.2706 7.73286H15.5206V7.73293L16.2706 7.73286ZM16.3065 14.2952L16.5863 14.9911L16.3065 14.2952ZM3.6933 14.2952L3.97308 13.5994L3.97308 13.5994L3.6933 14.2952ZM16.8452 10.1617L16.2307 10.5916L16.2332 10.5951L16.8452 10.1617ZM17.8916 11.9951L17.1507 12.1115L17.1507 12.1115L17.8916 11.9951ZM3.15459 10.1617L3.76669 10.5951L3.76915 10.5916L3.15459 10.1617ZM2.10819 11.9951L1.36728 11.8786H1.36728L2.10819 11.9951ZM7.9616 16.909C7.63517 16.654 7.16384 16.7119 6.90886 17.0383C6.65388 17.3648 6.7118 17.8361 7.03824 18.0911L7.9616 16.909ZM12.9616 18.0911C13.288 17.8361 13.346 17.3648 13.091 17.0383C12.836 16.7119 12.3647 16.654 12.0382 16.909L12.9616 18.0911ZM16.0268 13.5994C12.4873 15.0225 7.51251 15.0225 3.97308 13.5994L3.41351 14.9911C7.31201 16.5586 12.6878 16.5586 16.5863 14.9911L16.0268 13.5994ZM17.0206 7.73286C17.0206 3.94514 13.8537 0.916687 9.99992 0.916687V2.41669C13.0726 2.41669 15.5206 4.82007 15.5206 7.73286H17.0206ZM4.47919 7.73286C4.47919 4.82007 6.92727 2.41669 9.99992 2.41669V0.916687C6.14612 0.916687 2.97919 3.94514 2.97919 7.73286H4.47919ZM3.97308 13.5994C3.14627 13.2669 2.75147 12.7326 2.84909 12.1115L1.36728 11.8786C1.11048 13.5125 2.30023 14.5434 3.41351 14.9911L3.97308 13.5994ZM16.5863 14.9911C17.6996 14.5434 18.8894 13.5125 18.6326 11.8786L17.1507 12.1115C17.2484 12.7326 16.8536 13.2669 16.0268 13.5994L16.5863 14.9911ZM17.4598 9.73179C17.0815 9.19099 17.0207 8.58744 17.0206 7.7328L15.5206 7.73293C15.5207 8.61212 15.5638 9.63826 16.2307 10.5916L17.4598 9.73179ZM3.76915 10.5916C4.43604 9.63825 4.47911 8.61212 4.47919 7.73293L2.97919 7.7328C2.97911 8.58744 2.91834 9.19099 2.54003 9.73179L3.76915 10.5916ZM2.54251 9.72827C2.45079 9.8578 2.35253 9.98608 2.23845 10.1379C2.12877 10.2839 2.00871 10.4463 1.89595 10.6178C1.67289 10.957 1.44576 11.3793 1.36728 11.8786L2.84909 12.1115C2.87952 11.9179 2.97611 11.7052 3.14928 11.4419C3.23464 11.3121 3.33082 11.1812 3.43773 11.0389C3.54024 10.9024 3.65891 10.7473 3.76668 10.5951L2.54251 9.72827ZM16.2332 10.5951C16.3409 10.7473 16.4596 10.9024 16.5621 11.0389C16.669 11.1812 16.7652 11.3121 16.8506 11.4419C17.0237 11.7052 17.1203 11.9179 17.1507 12.1115L18.6326 11.8786C18.5541 11.3793 18.327 10.957 18.1039 10.6178C17.9911 10.4463 17.8711 10.2839 17.7614 10.1379C17.6473 9.98608 17.5491 9.8578 17.4573 9.72827L16.2332 10.5951ZM9.99992 17.5834C9.20289 17.5834 8.49015 17.3218 7.9616 16.909L7.03824 18.0911C7.83658 18.7147 8.87606 19.0834 9.99992 19.0834V17.5834ZM12.0382 16.909C11.5097 17.3218 10.7969 17.5834 9.99992 17.5834V19.0834C11.1238 19.0834 12.1633 18.7147 12.9616 18.0911L12.0382 16.909Z", fill: "#CDD5DF" }))))
         ];
     }
     static get is() { return "gb-header-icon"; }

package/dist/collection/components/gb-help-dropdown/gb-help-dropdown.js

@@ -4,7 +4,7 @@ export class GbHelpDropdown {
         this.helpItemClicked.emit(item);
     }
     render() {
-        return (h("div", { key: '164389ea9986138dddb167a7026b52941591c089', class: "dropdown-container" }, h("div", { key: '4536ab5d27df811e4c008dbe1993990ff399c63e', class: "user_guide" }, h("gb-dropdown-items-with-shortcut", { key: 'f542b3dd71476c037a19bb9b2a5e0525b952be9b', icon: true, iconSrc: "assets/book_open.svg", label: "Download user guide", onClick: () => this.onHelpItemClicked('download_user_guide') })), h("div", { key: '50d26cd0ad02e1e23f0deb772d501a1e88246f1a', class: "bug" }, h("gb-dropdown-items-with-shortcut", { key: '0bf5e7651e0c9f5bb37e0545cf2ce63eab1c07fb', icon: true, iconSrc: "assets/bug_02.svg", label: "Report a bug", onClick: () => this.onHelpItemClicked('report_a_bug') })), this.showLogError && (h("div", { key: '6dd952d61ec83280e4b27e8316b6995527ff0c73', class: "log_error" }, h("gb-dropdown-items-with-shortcut", { key: 'f0c0a8db4868395bc3c9dd83d096750b9729f6d1', icon: true, iconSrc: "assets/alert_02.svg", label: "Log a profile error", onClick: () => this.onHelpItemClicked('log_a_profile_error') })))));
+        return (h("div", { key: '75109d06f200749d4d251e3c0c9e049f8e1b0d2a', class: "dropdown-container" }, h("div", { key: '9d31b1c436f56c9c14a6a8487ede5199f1aa9b1b', class: "user_guide" }, h("gb-dropdown-items-with-shortcut", { key: 'd628b63bca2be623e6a405be3b97e435a6457cee', icon: true, iconSrc: "assets/book_open.svg", label: "Download user guide", onClick: () => this.onHelpItemClicked('download_user_guide') })), h("div", { key: 'f6e7e193f8800988c992820988eb490305a7b443', class: "bug" }, h("gb-dropdown-items-with-shortcut", { key: '98b82da2eae6ce99add1c179c8f4ad8c47c36874', icon: true, iconSrc: "assets/bug_02.svg", label: "Report a bug", onClick: () => this.onHelpItemClicked('report_a_bug') })), this.showLogError && (h("div", { key: '5dc2485a2e730e84c9345fd107ca506543f9374d', class: "log_error" }, h("gb-dropdown-items-with-shortcut", { key: '4dffb691b91e8d442eca27405484e1a8721a30f5', icon: true, iconSrc: "assets/alert_02.svg", label: "Log a profile error", onClick: () => this.onHelpItemClicked('log_a_profile_error') })))));
     }
     static get is() { return "gb-help-dropdown"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/gb-help-tooltip/gb-help-tooltip.js

@@ -16,7 +16,7 @@ export class GbHelpTooltip {
         }
     }
     render() {
-        return (h("div", { key: 'f0e7c10131ec815d84fc283213b229484bea429a', class: `help_tooltip` }, h("svg", { key: '2be8b2e3fe662ae97aaf16b99fb903124f1757b1', xmlns: "http://www.w3.org/2000/svg", width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", onMouseEnter: () => (this.showHelpTooltip = true), onMouseLeave: () => (this.showHelpTooltip = false), class: "help_circle" }, h("path", { key: '5197d0d866c106d5dc658b10f015a479629e5dab', d: "M6.66659 6C6.66659 5.26362 7.26354 4.66666 7.99992 4.66666C8.7363 4.66666 9.33325 5.26362 9.33325 6C9.33325 6.26543 9.25569 6.51275 9.12199 6.72052C8.72352 7.33978 7.99992 7.93028 7.99992 8.66666V9M7.99458 11.3333H8.00057M14.6666 8C14.6666 11.6819 11.6818 14.6667 7.99992 14.6667C4.31802 14.6667 1.33325 11.6819 1.33325 8C1.33325 4.3181 4.31802 1.33333 7.99992 1.33333C11.6818 1.33333 14.6666 4.3181 14.6666 8Z", stroke: "#697586", "stroke-width": "1.5", "stroke-linecap": "round", "stroke-linejoin": "round" })), this.showHelpTooltip && (h("gb-tooltip", { key: '97cb9349ce76ee8029960629b46589da51fbb086', "show-arrow": true, arrow: "bottom_right", "show-supporting-text": this.showSupportingText, class: "tooltip" }, h("slot", { key: 'b4f80dae8338f94c4aa622847158f46bc1e51ea1', name: "label", slot: "label" }), h("slot", { key: '226eef5e7160f941eb7654293955beca189dab9d', name: "supporting_text", slot: "supporting_text" })))));
+        return (h("div", { key: '68d201c795ba7ca1dbb879e439a0ebd25a792dd8', class: `help_tooltip` }, h("svg", { key: 'e04adbb7b1d909107cbfe4e414de176481c30b71', xmlns: "http://www.w3.org/2000/svg", width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", onMouseEnter: () => (this.showHelpTooltip = true), onMouseLeave: () => (this.showHelpTooltip = false), class: "help_circle" }, h("path", { key: 'acca7b0ecfb087a2acb52f0d2e0dee62c187302f', d: "M6.66659 6C6.66659 5.26362 7.26354 4.66666 7.99992 4.66666C8.7363 4.66666 9.33325 5.26362 9.33325 6C9.33325 6.26543 9.25569 6.51275 9.12199 6.72052C8.72352 7.33978 7.99992 7.93028 7.99992 8.66666V9M7.99458 11.3333H8.00057M14.6666 8C14.6666 11.6819 11.6818 14.6667 7.99992 14.6667C4.31802 14.6667 1.33325 11.6819 1.33325 8C1.33325 4.3181 4.31802 1.33333 7.99992 1.33333C11.6818 1.33333 14.6666 4.3181 14.6666 8Z", stroke: "#697586", "stroke-width": "1.5", "stroke-linecap": "round", "stroke-linejoin": "round" })), this.showHelpTooltip && (h("gb-tooltip", { key: '3b46bd58b01c5c4b6d1d3a37f7680381bb4cedef', "show-arrow": true, arrow: "bottom_right", "show-supporting-text": this.showSupportingText, class: "tooltip" }, h("slot", { key: '991f0b6a225d726804ad5eb85b8f27975cc9d595', name: "label", slot: "label" }), h("slot", { key: 'db986ed9f67921bf863a95728289c93165a50ebd', name: "supporting_text", slot: "supporting_text" })))));
     }
     static get is() { return "gb-help-tooltip"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/gb-horizontal-tabs/gb-horizontal-tabs.js

@@ -39,7 +39,7 @@ export class GbHorizontalTabs {
         this.tabItemClicked.emit(index);
     }
     render() {
-        return (h("div", { key: '3b1920a88809dfb49440c74ad184445d99d4f481', class: `horizontal_tab_div ${this.type} ${this.fullWidth ? 'full_width' : ''}` }, h("gb-tab-button-base", { key: '20a20413649f5dd00ec78a65b7c9afe1f6a6f15d', class: `tab_button_base ${this.fullWidth ? 'full_width' : ''}`, size: this.size, "full-width": this.fullWidth, type: this.type === 'button_white_border' ? 'button_white' : this.type === 'rounded_button_white_border' ? 'rounded_button_white' : this.type, onClick: () => this.handleTabClick(0), current: this.internalActiveIndex === 0, "tab-name": this.firstTabName, badge: this.badge, alignment: "horizontal" }, h("slot", { key: '0611c6bb94b010be1003787bfe4f3a54854ba8b6', slot: "count", name: "first_tab_count" })), h("gb-tab-button-base", { key: 'dc376ba593885090509345b7fda7a332eb00d8a9', class: `tab_button_base ${this.fullWidth ? 'full_width' : ''}`, size: this.size, "full-width": this.fullWidth, type: this.type === 'button_white_border' ? 'button_white' : this.type === 'rounded_button_white_border' ? 'rounded_button_white' : this.type, onClick: () => this.handleTabClick(1), current: this.internalActiveIndex === 1, "tab-name": this.secondTabName, badge: this.badge, alignment: "horizontal" }, h("slot", { key: '1f38137c3ae6924790ceebee137afa070c16ebdc', slot: "count", name: "second_tab_count" })), this.thirdTabName && (h("gb-tab-button-base", { key: '01c4678df2268b9a8092df5723f4dec50f4062a0', class: `tab_button_base ${this.fullWidth ? 'full_width' : ''}`, size: this.size, "full-width": this.fullWidth, type: this.type === 'button_white_border' ? 'button_white' : this.type === 'rounded_button_white_border' ? 'rounded_button_white' : this.type, onClick: () => this.handleTabClick(2), current: this.internalActiveIndex === 2, "tab-name": this.thirdTabName, badge: this.badge, alignment: "horizontal" }, h("slot", { key: 'f444e103cc9248b9104922705b76ed6a8f9248f2', slot: "count", name: "third_tab_count" }))), this.fourthTabName && (h("gb-tab-button-base", { key: 'd1dcf334d7a85a3868ca959ea9780d124d72d2a7', class: `tab_button_base ${this.fullWidth ? 'full_width' : ''}`, size: this.size, "full-width": this.fullWidth, type: this.type === 'button_white_border' ? 'button_white' : this.type === 'rounded_button_white_border' ? 'rounded_button_white' : this.type, onClick: () => this.handleTabClick(3), current: this.internalActiveIndex === 3, "tab-name": this.fourthTabName, badge: this.badge, alignment: "horizontal" }, h("slot", { key: 'c0bae57a617400d0147bcde9171c78b35c605010', slot: "count", name: "fourth_tab_count" }))), this.fifthTabName && (h("gb-tab-button-base", { key: '927cf97cdef06a969b51d6ab2b1333ae377bbd34', class: `tab_button_base ${this.fullWidth ? 'full_width' : ''}`, size: this.size, "full-width": this.fullWidth, type: this.type === 'button_white_border' ? 'button_white' : this.type === 'rounded_button_white_border' ? 'rounded_button_white' : this.type, onClick: () => this.handleTabClick(4), current: this.internalActiveIndex === 4, "tab-name": this.fifthTabName, badge: this.badge, alignment: "horizontal" }, h("slot", { key: 'c1efb5497265efc605a5a482ec5b1327141727aa', slot: "count", name: "fifth_tab_count" }))), this.sixthTabName && (h("gb-tab-button-base", { key: 'dd1d409fed40f3f165dfb98667b1512e70b98f93', class: `tab_button_base ${this.fullWidth ? 'full_width' : ''}`, size: this.size, "full-width": this.fullWidth, type: this.type === 'button_white_border' ? 'button_white' : this.type === 'rounded_button_white_border' ? 'rounded_button_white' : this.type, onClick: () => this.handleTabClick(5), current: this.internalActiveIndex === 5, "tab-name": this.sixthTabName, badge: this.badge, alignment: "horizontal" }, h("slot", { key: '9ea012b1c7a4e5412519d30ba0dcc4924553fcbc', slot: "count", name: "sixth_tab_count" }))), this.seventhTabName && (h("gb-tab-button-base", { key: '429b660158593959a16879cb2d19972d4b674cf1', class: `tab_button_base ${this.fullWidth ? 'full_width' : ''}`, size: this.size, "full-width": this.fullWidth, type: this.type === 'button_white_border' ? 'button_white' : this.type === 'rounded_button_white_border' ? 'rounded_button_white' : this.type, onClick: () => this.handleTabClick(6), current: this.internalActiveIndex === 6, "tab-name": this.seventhTabName, badge: this.badge, alignment: "horizontal" }, h("slot", { key: 'f5edf9bf2b2273ca4b910a6ff2a3a540d6270da6', slot: "count", name: "seventh_tab_count" }))), this.eighthTabName && (h("gb-tab-button-base", { key: '6cca2769d91b34d338577c13effd3d1bfa224be0', class: `tab_button_base ${this.fullWidth ? 'full_width' : ''}`, size: this.size, "full-width": this.fullWidth, type: this.type === 'button_white_border' ? 'button_white' : this.type === 'rounded_button_white_border' ? 'rounded_button_white' : this.type, onClick: () => this.handleTabClick(7), current: this.internalActiveIndex === 7, "tab-name": this.eighthTabName, badge: this.badge, alignment: "horizontal" }, h("slot", { key: '893e4d8e89e2000ae86274e59c40721f490ce24a', slot: "count", name: "eighth_tab_count" }))), this.ninthTabName && (h("gb-tab-button-base", { key: '443959c5a0328911058846e9913f96b5996036e0', class: `tab_button_base ${this.fullWidth ? 'full_width' : ''}`, size: this.size, "full-width": this.fullWidth, type: this.type === 'button_white_border' ? 'button_white' : this.type === 'rounded_button_white_border' ? 'rounded_button_white' : this.type, onClick: () => this.handleTabClick(8), current: this.internalActiveIndex === 8, "tab-name": this.ninthTabName, badge: this.badge, alignment: "horizontal" }, h("slot", { key: '15932831c3b006ec379b090bb825eca188e5e298', slot: "count", name: "ninth_tab_count" }))), this.tenthTabName && (h("gb-tab-button-base", { key: '8504c04a048848eb437c054758f935aa730e0962', class: `tab_button_base ${this.fullWidth ? 'full_width' : ''}`, size: this.size, "full-width": this.fullWidth, type: this.type === 'button_white_border' ? 'button_white' : this.type === 'rounded_button_white_border' ? 'rounded_button_white' : this.type, onClick: () => this.handleTabClick(9), current: this.internalActiveIndex === 9, "tab-name": this.tenthTabName, badge: this.badge, alignment: "horizontal" }, h("slot", { key: '87ad5175547f63a0c609ce80c645fffaa039f6c5', slot: "count", name: "tenth_tab_count" }))), this.eleventhTabName && (h("gb-tab-button-base", { key: '05eaed02cd080373133f3b03df4a1143471bd096', class: `tab_button_base ${this.fullWidth ? 'full_width' : ''}`, size: this.size, "full-width": this.fullWidth, type: this.type === 'button_white_border' ? 'button_white' : this.type === 'rounded_button_white_border' ? 'rounded_button_white' : this.type, onClick: () => this.handleTabClick(10), current: this.internalActiveIndex === 10, "tab-name": this.eleventhTabName, badge: this.badge, alignment: "horizontal" }, h("slot", { key: '0aea14b8e4a0b5a3acffc9b38cdd32fc0fca64a2', slot: "count", name: "eleventh_tab_count" }))), this.twelfthTabName && (h("gb-tab-button-base", { key: '847fcb7d86d73e87fefb2eb7c8dfb0134ccff8a2', class: `tab_button_base ${this.fullWidth ? 'full_width' : ''}`, size: this.size, "full-width": this.fullWidth, type: this.type === 'button_white_border' ? 'button_white' : this.type === 'rounded_button_white_border' ? 'rounded_button_white' : this.type, onClick: () => this.handleTabClick(11), current: this.internalActiveIndex === 11, "tab-name": this.twelfthTabName, badge: this.badge, alignment: "horizontal" }, h("slot", { key: '62cb2f9879e89b15a7dddb57cbb4d91fc13c2467', slot: "count", name: "twelfth_tab_count" }))), this.thirteenthTabName && (h("gb-tab-button-base", { key: '33540865dee0fc181376722e67a885c968819c9a', class: `tab_button_base ${this.fullWidth ? 'full_width' : ''}`, size: this.size, "full-width": this.fullWidth, type: this.type === 'button_white_border' ? 'button_white' : this.type === 'rounded_button_white_border' ? 'rounded_button_white' : this.type, onClick: () => this.handleTabClick(12), current: this.internalActiveIndex === 12, "tab-name": this.thirteenthTabName, badge: this.badge, alignment: "horizontal" }, h("slot", { key: 'e3a7ccbcf197a0769c757de73811e533fd955aba', slot: "count", name: "thirteenth_tab_count" }))), this.fourteenthTabName && (h("gb-tab-button-base", { key: '34f774d4fa7e841ff28dcfe86568d2aeccbe0f85', class: `tab_button_base ${this.fullWidth ? 'full_width' : ''}`, size: this.size, "full-width": this.fullWidth, type: this.type === 'button_white_border' ? 'button_white' : this.type === 'rounded_button_white_border' ? 'rounded_button_white' : this.type, onClick: () => this.handleTabClick(13), current: this.internalActiveIndex === 13, "tab-name": this.fourteenthTabName, badge: this.badge, alignment: "horizontal" }, h("slot", { key: 'bc0ae0f054bc1aae9ad80c5b2be3356b26c995e6', slot: "count", name: "fourteenth_tab_count" }))), this.fifteenthTabName && (h("gb-tab-button-base", { key: 'd511e0462c258c96a8dfcce5ebce5c5e54c7f104', class: `tab_button_base ${this.fullWidth ? 'full_width' : ''}`, size: this.size, "full-width": this.fullWidth, type: this.type === 'button_white_border' ? 'button_white' : this.type === 'rounded_button_white_border' ? 'rounded_button_white' : this.type, onClick: () => this.handleTabClick(14), current: this.internalActiveIndex === 14, "tab-name": this.fifteenthTabName, badge: this.badge, alignment: "horizontal" }, h("slot", { key: '0e626c841eaec8347685f6988d4a69366153cb81', slot: "count", name: "fifteenth_tab_count" }))), this.sixteenthTabName && (h("gb-tab-button-base", { key: '1e5247555a17caad180574385c44f7996b826885', class: `tab_button_base ${this.fullWidth ? 'full_width' : ''}`, size: this.size, "full-width": this.fullWidth, type: this.type === 'button_white_border' ? 'button_white' : this.type === 'rounded_button_white_border' ? 'rounded_button_white' : this.type, onClick: () => this.handleTabClick(15), current: this.internalActiveIndex === 15, "tab-name": this.sixteenthTabName, badge: this.badge, alignment: "horizontal" }, h("slot", { key: '1b1b65c004cdbb3f1e2a8f1d58f71223900e4acd', slot: "count", name: "sixteenth_tab_count" }))), this.seventeenthTabName && (h("gb-tab-button-base", { key: '902f3d49a315f83304e9c9d6e0192a7971ad3f91', class: `tab_button_base ${this.fullWidth ? 'full_width' : ''}`, size: this.size, "full-width": this.fullWidth, type: this.type === 'button_white_border' ? 'button_white' : this.type === 'rounded_button_white_border' ? 'rounded_button_white' : this.type, onClick: () => this.handleTabClick(16), current: this.internalActiveIndex === 16, "tab-name": this.seventeenthTabName, badge: this.badge, alignment: "horizontal" }, h("slot", { key: '0836db52f01a022a24cdd534508f7aa6aa96dc56', slot: "count", name: "seventeenth_tab_count" }))), this.eighteenthTabName && (h("gb-tab-button-base", { key: '30951b03016804392e3bd87e2337e6496c644e40', class: `tab_button_base ${this.fullWidth ? 'full_width' : ''}`, size: this.size, "full-width": this.fullWidth, type: this.type === 'button_white_border' ? 'button_white' : this.type === 'rounded_button_white_border' ? 'rounded_button_white' : this.type, onClick: () => this.handleTabClick(17), current: this.internalActiveIndex === 17, "tab-name": this.eighteenthTabName, badge: this.badge, alignment: "horizontal" }, h("slot", { key: '3d07fd07a28292199d706c5cb4b8df5c88d405e2', slot: "count", name: "eighteenth_tab_count" }))), this.nineteenthTabName && (h("gb-tab-button-base", { key: '56b36c6e3b0c2ca38ae96ed977731af3cfe97f18', class: `tab_button_base ${this.fullWidth ? 'full_width' : ''}`, size: this.size, "full-width": this.fullWidth, type: this.type === 'button_white_border' ? 'button_white' : this.type === 'rounded_button_white_border' ? 'rounded_button_white' : this.type, onClick: () => this.handleTabClick(18), current: this.internalActiveIndex === 18, "tab-name": this.nineteenthTabName, badge: this.badge, alignment: "horizontal" }, h("slot", { key: '1e7fdcfff751247f9fbc2d816514bc42c4238929', slot: "count", name: "nineteenth_tab_count" }))), this.twentiethTabName && (h("gb-tab-button-base", { key: '8e3dfaa7336e13334e672c1317208682fe4650f9', class: `tab_button_base ${this.fullWidth ? 'full_width' : ''}`, size: this.size, "full-width": this.fullWidth, type: this.type === 'button_white_border' ? 'button_white' : this.type === 'rounded_button_white_border' ? 'rounded_button_white' : this.type, onClick: () => this.handleTabClick(19), current: this.internalActiveIndex === 19, "tab-name": this.twentiethTabName, badge: this.badge, alignment: "horizontal" }, h("slot", { key: '2a235b772139617381d69a4ca52130cbbb5e6105', slot: "count", name: "twentieth_tab_count" })))));
+        return (h("div", { key: 'b91fe53b4c69b84919bd6f657684d3a20c5e5b90', class: `horizontal_tab_div ${this.type} ${this.fullWidth ? 'full_width' : ''}` }, h("gb-tab-button-base", { key: '25ac5ee99a072f992e837d3ed37dfd0a193c1618', class: `tab_button_base ${this.fullWidth ? 'full_width' : ''}`, size: this.size, "full-width": this.fullWidth, type: this.type === 'button_white_border' ? 'button_white' : this.type === 'rounded_button_white_border' ? 'rounded_button_white' : this.type, onClick: () => this.handleTabClick(0), current: this.internalActiveIndex === 0, "tab-name": this.firstTabName, badge: this.badge, alignment: "horizontal" }, h("slot", { key: '5b100286bacfdc304a325edf2b7a60a3e9b2318b', slot: "count", name: "first_tab_count" })), h("gb-tab-button-base", { key: '6510c06740418d418e9b5ee31be9b9cfc9f0da26', class: `tab_button_base ${this.fullWidth ? 'full_width' : ''}`, size: this.size, "full-width": this.fullWidth, type: this.type === 'button_white_border' ? 'button_white' : this.type === 'rounded_button_white_border' ? 'rounded_button_white' : this.type, onClick: () => this.handleTabClick(1), current: this.internalActiveIndex === 1, "tab-name": this.secondTabName, badge: this.badge, alignment: "horizontal" }, h("slot", { key: '0411e3cbb758826b53a804c1cfcf7fe3d761cc6a', slot: "count", name: "second_tab_count" })), this.thirdTabName && (h("gb-tab-button-base", { key: '5a89309d1e9d747f0af4a543c9381f68524ba5d1', class: `tab_button_base ${this.fullWidth ? 'full_width' : ''}`, size: this.size, "full-width": this.fullWidth, type: this.type === 'button_white_border' ? 'button_white' : this.type === 'rounded_button_white_border' ? 'rounded_button_white' : this.type, onClick: () => this.handleTabClick(2), current: this.internalActiveIndex === 2, "tab-name": this.thirdTabName, badge: this.badge, alignment: "horizontal" }, h("slot", { key: '188c58076c20bedaa834d265a47d69e61aeb9fbc', slot: "count", name: "third_tab_count" }))), this.fourthTabName && (h("gb-tab-button-base", { key: '301581a8036f412a5aad04b6bc38a30e809906c8', class: `tab_button_base ${this.fullWidth ? 'full_width' : ''}`, size: this.size, "full-width": this.fullWidth, type: this.type === 'button_white_border' ? 'button_white' : this.type === 'rounded_button_white_border' ? 'rounded_button_white' : this.type, onClick: () => this.handleTabClick(3), current: this.internalActiveIndex === 3, "tab-name": this.fourthTabName, badge: this.badge, alignment: "horizontal" }, h("slot", { key: '2086a825b4d21d062556bbe6f4e9608524a0bf87', slot: "count", name: "fourth_tab_count" }))), this.fifthTabName && (h("gb-tab-button-base", { key: '66f8a912e3b52994d2e409b0793211b34d5f5787', class: `tab_button_base ${this.fullWidth ? 'full_width' : ''}`, size: this.size, "full-width": this.fullWidth, type: this.type === 'button_white_border' ? 'button_white' : this.type === 'rounded_button_white_border' ? 'rounded_button_white' : this.type, onClick: () => this.handleTabClick(4), current: this.internalActiveIndex === 4, "tab-name": this.fifthTabName, badge: this.badge, alignment: "horizontal" }, h("slot", { key: '4662152d80be5b32985662a436e80c4ae4b65112', slot: "count", name: "fifth_tab_count" }))), this.sixthTabName && (h("gb-tab-button-base", { key: '7f481d74886ba5776d2d45937735d8d5b8a9119f', class: `tab_button_base ${this.fullWidth ? 'full_width' : ''}`, size: this.size, "full-width": this.fullWidth, type: this.type === 'button_white_border' ? 'button_white' : this.type === 'rounded_button_white_border' ? 'rounded_button_white' : this.type, onClick: () => this.handleTabClick(5), current: this.internalActiveIndex === 5, "tab-name": this.sixthTabName, badge: this.badge, alignment: "horizontal" }, h("slot", { key: '1ca3470bf70c2a6efcf7ced7ee7a12b686136515', slot: "count", name: "sixth_tab_count" }))), this.seventhTabName && (h("gb-tab-button-base", { key: '2a8283626a0d2767c43f88192301b1ef5c6bdf02', class: `tab_button_base ${this.fullWidth ? 'full_width' : ''}`, size: this.size, "full-width": this.fullWidth, type: this.type === 'button_white_border' ? 'button_white' : this.type === 'rounded_button_white_border' ? 'rounded_button_white' : this.type, onClick: () => this.handleTabClick(6), current: this.internalActiveIndex === 6, "tab-name": this.seventhTabName, badge: this.badge, alignment: "horizontal" }, h("slot", { key: '5a76b21fdb1a7423c9ab125f0c1c470b6a37f595', slot: "count", name: "seventh_tab_count" }))), this.eighthTabName && (h("gb-tab-button-base", { key: 'a2b2c141853b7b5f345357a8a77fa5e00ab05931', class: `tab_button_base ${this.fullWidth ? 'full_width' : ''}`, size: this.size, "full-width": this.fullWidth, type: this.type === 'button_white_border' ? 'button_white' : this.type === 'rounded_button_white_border' ? 'rounded_button_white' : this.type, onClick: () => this.handleTabClick(7), current: this.internalActiveIndex === 7, "tab-name": this.eighthTabName, badge: this.badge, alignment: "horizontal" }, h("slot", { key: 'bda5a5a3ef13b96a30fbf88730ca88fc228a96f9', slot: "count", name: "eighth_tab_count" }))), this.ninthTabName && (h("gb-tab-button-base", { key: '600698a65026c37302b6e6731ab49003d0cd6aa0', class: `tab_button_base ${this.fullWidth ? 'full_width' : ''}`, size: this.size, "full-width": this.fullWidth, type: this.type === 'button_white_border' ? 'button_white' : this.type === 'rounded_button_white_border' ? 'rounded_button_white' : this.type, onClick: () => this.handleTabClick(8), current: this.internalActiveIndex === 8, "tab-name": this.ninthTabName, badge: this.badge, alignment: "horizontal" }, h("slot", { key: '059dfaed44f72c96d66ac62cf7cb4adfc0b887b8', slot: "count", name: "ninth_tab_count" }))), this.tenthTabName && (h("gb-tab-button-base", { key: '2cae861d74c8d74c4c8086072eb40de17b755898', class: `tab_button_base ${this.fullWidth ? 'full_width' : ''}`, size: this.size, "full-width": this.fullWidth, type: this.type === 'button_white_border' ? 'button_white' : this.type === 'rounded_button_white_border' ? 'rounded_button_white' : this.type, onClick: () => this.handleTabClick(9), current: this.internalActiveIndex === 9, "tab-name": this.tenthTabName, badge: this.badge, alignment: "horizontal" }, h("slot", { key: '36a98e1b1165717c8d3f54e1fb00fedf0cc3591d', slot: "count", name: "tenth_tab_count" }))), this.eleventhTabName && (h("gb-tab-button-base", { key: '06bd61fed60c690e7189a408321378cd6fc326e8', class: `tab_button_base ${this.fullWidth ? 'full_width' : ''}`, size: this.size, "full-width": this.fullWidth, type: this.type === 'button_white_border' ? 'button_white' : this.type === 'rounded_button_white_border' ? 'rounded_button_white' : this.type, onClick: () => this.handleTabClick(10), current: this.internalActiveIndex === 10, "tab-name": this.eleventhTabName, badge: this.badge, alignment: "horizontal" }, h("slot", { key: '02aef57986d13c7599a3495d4580c4dc442fb55e', slot: "count", name: "eleventh_tab_count" }))), this.twelfthTabName && (h("gb-tab-button-base", { key: '3a773d6c55676a8e52cae4f52c5e832417216c95', class: `tab_button_base ${this.fullWidth ? 'full_width' : ''}`, size: this.size, "full-width": this.fullWidth, type: this.type === 'button_white_border' ? 'button_white' : this.type === 'rounded_button_white_border' ? 'rounded_button_white' : this.type, onClick: () => this.handleTabClick(11), current: this.internalActiveIndex === 11, "tab-name": this.twelfthTabName, badge: this.badge, alignment: "horizontal" }, h("slot", { key: '466a8dda804ce655a6160fa7cc1f72333ad8a935', slot: "count", name: "twelfth_tab_count" }))), this.thirteenthTabName && (h("gb-tab-button-base", { key: 'aed9ae9df2fc8dfdf3c5e737c3996015ae6b7fe1', class: `tab_button_base ${this.fullWidth ? 'full_width' : ''}`, size: this.size, "full-width": this.fullWidth, type: this.type === 'button_white_border' ? 'button_white' : this.type === 'rounded_button_white_border' ? 'rounded_button_white' : this.type, onClick: () => this.handleTabClick(12), current: this.internalActiveIndex === 12, "tab-name": this.thirteenthTabName, badge: this.badge, alignment: "horizontal" }, h("slot", { key: '8e3b94695b31c77d37041f8bcd2aeb559d82dc8d', slot: "count", name: "thirteenth_tab_count" }))), this.fourteenthTabName && (h("gb-tab-button-base", { key: '2bd2efb088ad77dc7b192941087bc624b9ea8781', class: `tab_button_base ${this.fullWidth ? 'full_width' : ''}`, size: this.size, "full-width": this.fullWidth, type: this.type === 'button_white_border' ? 'button_white' : this.type === 'rounded_button_white_border' ? 'rounded_button_white' : this.type, onClick: () => this.handleTabClick(13), current: this.internalActiveIndex === 13, "tab-name": this.fourteenthTabName, badge: this.badge, alignment: "horizontal" }, h("slot", { key: 'b2a448659f03ba5c9f5013301c931e705268b12d', slot: "count", name: "fourteenth_tab_count" }))), this.fifteenthTabName && (h("gb-tab-button-base", { key: '4ea15b9f1aca0d2639808c9892488b5db1ca0a72', class: `tab_button_base ${this.fullWidth ? 'full_width' : ''}`, size: this.size, "full-width": this.fullWidth, type: this.type === 'button_white_border' ? 'button_white' : this.type === 'rounded_button_white_border' ? 'rounded_button_white' : this.type, onClick: () => this.handleTabClick(14), current: this.internalActiveIndex === 14, "tab-name": this.fifteenthTabName, badge: this.badge, alignment: "horizontal" }, h("slot", { key: '2554a559ab1269b050574413451ff238599e1c9c', slot: "count", name: "fifteenth_tab_count" }))), this.sixteenthTabName && (h("gb-tab-button-base", { key: '290e5e986f146d78567c50c1061f187b6341cf6b', class: `tab_button_base ${this.fullWidth ? 'full_width' : ''}`, size: this.size, "full-width": this.fullWidth, type: this.type === 'button_white_border' ? 'button_white' : this.type === 'rounded_button_white_border' ? 'rounded_button_white' : this.type, onClick: () => this.handleTabClick(15), current: this.internalActiveIndex === 15, "tab-name": this.sixteenthTabName, badge: this.badge, alignment: "horizontal" }, h("slot", { key: '772b45ee984c93c0f43edbbe209178e79a50574f', slot: "count", name: "sixteenth_tab_count" }))), this.seventeenthTabName && (h("gb-tab-button-base", { key: 'b20d64ad19105eeb2272a718b26000e8109c726e', class: `tab_button_base ${this.fullWidth ? 'full_width' : ''}`, size: this.size, "full-width": this.fullWidth, type: this.type === 'button_white_border' ? 'button_white' : this.type === 'rounded_button_white_border' ? 'rounded_button_white' : this.type, onClick: () => this.handleTabClick(16), current: this.internalActiveIndex === 16, "tab-name": this.seventeenthTabName, badge: this.badge, alignment: "horizontal" }, h("slot", { key: '7b29335479176b817a31573be8f0588ad1a579ed', slot: "count", name: "seventeenth_tab_count" }))), this.eighteenthTabName && (h("gb-tab-button-base", { key: '7df04f9455f3491c512ae13a2e749b179955e58c', class: `tab_button_base ${this.fullWidth ? 'full_width' : ''}`, size: this.size, "full-width": this.fullWidth, type: this.type === 'button_white_border' ? 'button_white' : this.type === 'rounded_button_white_border' ? 'rounded_button_white' : this.type, onClick: () => this.handleTabClick(17), current: this.internalActiveIndex === 17, "tab-name": this.eighteenthTabName, badge: this.badge, alignment: "horizontal" }, h("slot", { key: '1453a771fcedd5ae3bbc44ca10f29752c29a2391', slot: "count", name: "eighteenth_tab_count" }))), this.nineteenthTabName && (h("gb-tab-button-base", { key: 'f6b2deb327395786d060caa731cf0688a50233bd', class: `tab_button_base ${this.fullWidth ? 'full_width' : ''}`, size: this.size, "full-width": this.fullWidth, type: this.type === 'button_white_border' ? 'button_white' : this.type === 'rounded_button_white_border' ? 'rounded_button_white' : this.type, onClick: () => this.handleTabClick(18), current: this.internalActiveIndex === 18, "tab-name": this.nineteenthTabName, badge: this.badge, alignment: "horizontal" }, h("slot", { key: '1f04521beb82f668133ba15b7dc02c60f5b13589', slot: "count", name: "nineteenth_tab_count" }))), this.twentiethTabName && (h("gb-tab-button-base", { key: '7f5dd5afbba98349ceac18c042a697f985fd0cd1', class: `tab_button_base ${this.fullWidth ? 'full_width' : ''}`, size: this.size, "full-width": this.fullWidth, type: this.type === 'button_white_border' ? 'button_white' : this.type === 'rounded_button_white_border' ? 'rounded_button_white' : this.type, onClick: () => this.handleTabClick(19), current: this.internalActiveIndex === 19, "tab-name": this.twentiethTabName, badge: this.badge, alignment: "horizontal" }, h("slot", { key: '6bf2227f0a06ad6ae6e860aa542f6fb25fe1dd1f', slot: "count", name: "twentieth_tab_count" })))));
     }
     static get is() { return "gb-horizontal-tabs"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/gb-icon-button-base/gb-icon-button-base.js

@@ -17,7 +17,7 @@ export class GbIconButtonBase {
         this.loadIcon(this.icon);
     }
     render() {
-        return (h("div", { key: 'c744f103625f1bc42fa84abe7e66feb991be3eb1', class: "icon_button_base_container" }, this.showTooltip && (h("gb-tooltip", { key: 'ab9cbe95e03fc40c218f9feb9337fa71b2cee1bd', "show-arrow": true, arrow: "bottom_center", class: "tooltip" }, h("p", { key: 'f751e830db382d4b1e4f90736f55362566a67033', slot: "label" }, this.label))), h("div", { key: 'a41136f9e5291c4d9aad3e57254c8618416db2f3', class: `icon_button_base_div ${this.current ? 'current' : ''}`, onMouseEnter: () => (this.showTooltip = true), onMouseLeave: () => (this.showTooltip = false) }, h("div", { key: 'e8534ae6d9b6dc130d49d6229f41cfa3045f5362', class: `icon ${this.current ? 'current' : ''}`, innerHTML: this.leadingIconSvg }))));
+        return (h("div", { key: '5fa21586c55107e4d661c2db3214a3744bc26406', class: "icon_button_base_container" }, this.showTooltip && (h("gb-tooltip", { key: 'f9fe538d93455917530cbeccbe721e564844ef1b', "show-arrow": true, arrow: "bottom_center", class: "tooltip" }, h("p", { key: 'ad0dfd5c053ba23dc48ea2d654ae09727daaf638', slot: "label" }, this.label))), h("div", { key: '384121a34997647fca8afbcf60c596e82602479e', class: `icon_button_base_div ${this.current ? 'current' : ''}`, onMouseEnter: () => (this.showTooltip = true), onMouseLeave: () => (this.showTooltip = false) }, h("div", { key: 'd5251e49f592ef00d3af1229f75befdd6ccd7c29', class: `icon ${this.current ? 'current' : ''}`, innerHTML: this.leadingIconSvg }))));
     }
     static get is() { return "gb-icon-button-base"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/gb-input-dropdown/gb-input-dropdown.js

@@ -294,16 +294,16 @@ export class GbInputDropdown {
         const emptyStateBackground = getAssetPath('assets/empty-state-background.svg');
         const illustration = getAssetPath('assets/empty-state-no-data.svg');
         return [
-            h("div", { key: 'e5cf2711c2cc456a353675f433507e90005f697a', class: `input_dropdown_container ${this.type === 'tags' ? 'tag' : ''}` }, h("div", { key: '425d4cddd54dbd572b3a68ec1bf89a514a883f80', class: `input_with_label` }, this.showLabel && (h("p", { key: '3c431ce10a556cbf1d2b9913373561273e0de1dc', class: "text-sm-regular", style: { color: '#4B5565' } }, this.label.charAt(0).toUpperCase() + this.label.slice(1).toLowerCase())), h("div", { key: '5434093c4e258cc2a00455632d9ac2326e1209f2', class: `input_dropdown_div ${this.size} ${this.state} ${this.destructive ? 'destructive' : ''} ${this.type === 'tags' ? 'tag' : ''} ${this.dropdownOpen ? 'focused' : ''}`, onClick: e => this.toggleDropdown(e) }, this.type === 'icon_leading' && (h("svg", { key: 'df85d0ea16186b1b667b85619c92946fd11c6583', xmlns: "http://www.w3.org/2000/svg", width: "20", height: "20", viewBox: "0 0 20 20", fill: "none" }, h("path", { key: '3206aa932ae84915f6daa3736432117b85c551c6', d: "M5.48131 12.9013C4.30234 13.6033 1.21114 15.0368 3.09388 16.8305C4.01359 17.7067 5.03791 18.3333 6.32572 18.3333H13.6743C14.9621 18.3333 15.9864 17.7067 16.9061 16.8305C18.7889 15.0368 15.6977 13.6033 14.5187 12.9013C11.754 11.2551 8.24599 11.2551 5.48131 12.9013Z", stroke: "#697586", "stroke-width": "1.66667" }), h("path", { key: '8e91d5a910827ec89b94dbec316be7990fb4b18f', d: "M13.75 5.41667C13.75 7.48774 12.0711 9.16667 10 9.16667C7.92893 9.16667 6.25 7.48774 6.25 5.41667C6.25 3.3456 7.92893 1.66667 10 1.66667C12.0711 1.66667 13.75 3.3456 13.75 5.41667Z", stroke: "#697586", "stroke-width": "1.66667" }))), this.type === 'avatar_leading' && (h(Fragment, null, this.state === 'default' && (h("svg", { key: 'fc09327e12186300e918489c9629f5bd1cdd66bd', xmlns: "http://www.w3.org/2000/svg", width: "20", height: "20", viewBox: "0 0 20 20", fill: "none" }, h("path", { key: '6302efe97b5c175e050201dff83cd6d1829d8bbb', d: "M5.48131 12.9013C4.30234 13.6033 1.21114 15.0368 3.09388 16.8305C4.01359 17.7067 5.03791 18.3333 6.32572 18.3333H13.6743C14.9621 18.3333 15.9864 17.7067 16.9061 16.8305C18.7889 15.0368 15.6977 13.6033 14.5187 12.9013C11.754 11.2551 8.24599 11.2551 5.48131 12.9013Z", stroke: "#4B5565", "stroke-width": "1.66667" }), h("path", { key: '9db2ab6ae34d074af78e27d2cd31801d61b023a3', d: "M13.75 5.41666C13.75 7.48772 12.0711 9.16666 10 9.16666C7.92893 9.16666 6.25 7.48772 6.25 5.41666C6.25 3.34559 7.92893 1.66666 10 1.66666C12.0711 1.66666 13.75 3.34559 13.75 5.41666Z", stroke: "#4B5565", "stroke-width": "1.66667" }))), this.state === 'filled' && (h("gb-avatar", { key: '625e26c1e8c419d84230926fcc48aa8504e42ccf', size: "xs", text: this.text, color: this.color, "show-border": this.showBorder }, this.selectedItems.map(item => (h(Fragment, null, typeof item === 'object' ? (h("h1", { slot: "initials" }, item.name.split(' ').map(part => part.charAt(0).toUpperCase()))) : (h("h1", { slot: "initials" }, item.split(' ').map(part => part.charAt(0).toUpperCase())))))))))), this.showLeadingIcon && h(Fragment, null, this.type === 'search' || this.type === 'tags' ? h("div", { class: `icon`, innerHTML: this.leadingIconSvg }) : null), this.type === 'dot_leading' && (h("svg", { key: '43e49962186c85ce824e971cdf840f805f534b9c', xmlns: "http://www.w3.org/2000/svg", width: "10", height: "10", viewBox: "0 0 10 10", fill: "none", class: `dot ${this.size}` }, h("circle", { key: '7cd78681bfe43226a38e56b72f4c8688bb20caa6', cx: "5", cy: "5", r: "4", fill: "#079455" }))), h(Fragment, null, this.state === 'default' && (h(Fragment, null, this.placeholder && (h("div", { key: '4f508a9b433f22b35e9ac133669c04a2e06ca49c', class: "placeholder" }, h("p", { key: '663e1fb4b56bc5dc9cf1e6859862468bab8ddbc7', class: "text-md-regular", style: { color: '#CDD5DF' } }, this.placeholder))))), this.state === 'filled' && (h(Fragment, null, h("div", { key: 'c83d4d22e21dbb6294d7319f963eb922a9dab873', class: `content` }, h("div", { key: '82e61f97b22221782099ed9c81de12f5068e20da', class: `text text-md-regular ${this.type === 'tags' ? 'tag' : ''}`, style: { color: '#4B5565' } }, this.type === 'tags' ? (h(Fragment, null, this.value.length === 0 ? (h(Fragment, null, this.selectedItems.map((item, index) => typeof item === 'object' ? (h("div", { class: "added_tag", key: index }, h("gb-tag", { size: "sm", icon: this.icon ? this.icon : 'avatar', action: "X_close", onClick: () => this.handleTagRemove(item) }, h("p", { class: "text-xs-medium" }, item.name.split(' ')[0]), h("h1", { slot: "initials", class: "text-xxs-semi-bold" }, item.name
+            h("div", { key: '04a7958155d6f68825a2fdff26fb0000b6cce87c', class: `input_dropdown_container ${this.type === 'tags' ? 'tag' : ''}` }, h("div", { key: 'db82bcbcadf1b27518daef66a0dd9287f3b50885', class: `input_with_label` }, this.showLabel && (h("p", { key: 'e93cbc41bb95ccaa1dda44bfa7fb09401f5f5a7e', class: "text-sm-regular", style: { color: '#4B5565' } }, this.label.charAt(0).toUpperCase() + this.label.slice(1).toLowerCase())), h("div", { key: '7ff2bf9666c1800243035a0262903be5d0643135', class: `input_dropdown_div ${this.size} ${this.state} ${this.destructive ? 'destructive' : ''} ${this.type === 'tags' ? 'tag' : ''} ${this.dropdownOpen ? 'focused' : ''}`, onClick: e => this.toggleDropdown(e) }, this.type === 'icon_leading' && (h("svg", { key: 'f7b7d23e332b510c0a8d7d1d197f44d21e2ada44', xmlns: "http://www.w3.org/2000/svg", width: "20", height: "20", viewBox: "0 0 20 20", fill: "none" }, h("path", { key: '0bff9f9b8d7a161acf8223cc69b3b6589edb7d87', d: "M5.48131 12.9013C4.30234 13.6033 1.21114 15.0368 3.09388 16.8305C4.01359 17.7067 5.03791 18.3333 6.32572 18.3333H13.6743C14.9621 18.3333 15.9864 17.7067 16.9061 16.8305C18.7889 15.0368 15.6977 13.6033 14.5187 12.9013C11.754 11.2551 8.24599 11.2551 5.48131 12.9013Z", stroke: "#697586", "stroke-width": "1.66667" }), h("path", { key: 'a5c5eda15e705087966b68c5df83934a60978032', d: "M13.75 5.41667C13.75 7.48774 12.0711 9.16667 10 9.16667C7.92893 9.16667 6.25 7.48774 6.25 5.41667C6.25 3.3456 7.92893 1.66667 10 1.66667C12.0711 1.66667 13.75 3.3456 13.75 5.41667Z", stroke: "#697586", "stroke-width": "1.66667" }))), this.type === 'avatar_leading' && (h(Fragment, null, this.state === 'default' && (h("svg", { key: 'a6074b95c52197c6da65808a7cc20766f3b69a6b', xmlns: "http://www.w3.org/2000/svg", width: "20", height: "20", viewBox: "0 0 20 20", fill: "none" }, h("path", { key: 'd988830f453b0967705f7c218c770b47169800b5', d: "M5.48131 12.9013C4.30234 13.6033 1.21114 15.0368 3.09388 16.8305C4.01359 17.7067 5.03791 18.3333 6.32572 18.3333H13.6743C14.9621 18.3333 15.9864 17.7067 16.9061 16.8305C18.7889 15.0368 15.6977 13.6033 14.5187 12.9013C11.754 11.2551 8.24599 11.2551 5.48131 12.9013Z", stroke: "#4B5565", "stroke-width": "1.66667" }), h("path", { key: '0432532c13a98cfefb4e09b8d81c9874d6cae732', d: "M13.75 5.41666C13.75 7.48772 12.0711 9.16666 10 9.16666C7.92893 9.16666 6.25 7.48772 6.25 5.41666C6.25 3.34559 7.92893 1.66666 10 1.66666C12.0711 1.66666 13.75 3.34559 13.75 5.41666Z", stroke: "#4B5565", "stroke-width": "1.66667" }))), this.state === 'filled' && (h("gb-avatar", { key: '1e4a64eefad45de88c4ad24504b0dcd8d1e06db5', size: "xs", text: this.text, color: this.color, "show-border": this.showBorder }, this.selectedItems.map(item => (h(Fragment, null, typeof item === 'object' ? (h("h1", { slot: "initials" }, item.name.split(' ').map(part => part.charAt(0).toUpperCase()))) : (h("h1", { slot: "initials" }, item.split(' ').map(part => part.charAt(0).toUpperCase())))))))))), this.showLeadingIcon && h(Fragment, null, this.type === 'search' || this.type === 'tags' ? h("div", { class: `icon`, innerHTML: this.leadingIconSvg }) : null), this.type === 'dot_leading' && (h("svg", { key: 'e9adb4f62a3506a59364f78bb00b7cf7f3ac58d8', xmlns: "http://www.w3.org/2000/svg", width: "10", height: "10", viewBox: "0 0 10 10", fill: "none", class: `dot ${this.size}` }, h("circle", { key: '48fab6b146e92c5777822357da5f7246201ee9c7', cx: "5", cy: "5", r: "4", fill: "#079455" }))), h(Fragment, null, this.state === 'default' && (h(Fragment, null, this.placeholder && (h("div", { key: 'a1df5ce095ad6f986cee21af0626d198637033f2', class: "placeholder" }, h("p", { key: 'd3ba37b03018fa8e6e7c5c3c0fb76a2e3a33639e', class: "text-md-regular", style: { color: '#CDD5DF' } }, this.placeholder))))), this.state === 'filled' && (h(Fragment, null, h("div", { key: '916bb4449e2270b9ff2889f1a934f8d6d357c60b', class: `content` }, h("div", { key: '1fe4a38f900e8ab5a0ab555ea35f064d69e0a225', class: `text text-md-regular ${this.type === 'tags' ? 'tag' : ''}`, style: { color: '#4B5565' } }, this.type === 'tags' ? (h(Fragment, null, this.value.length === 0 ? (h(Fragment, null, this.selectedItems.map((item, index) => typeof item === 'object' ? (h("div", { class: "added_tag", key: index }, h("gb-tag", { size: "sm", icon: this.icon ? this.icon : 'avatar', action: "X_close", onClick: () => this.handleTagRemove(item) }, h("p", { class: "text-xs-medium" }, item.name.split(' ')[0]), h("h1", { slot: "initials", class: "text-xxs-semi-bold" }, item.name
                 .split(' ')
                 .map(part => part.charAt(0).toUpperCase())
                 .join(''))))) : (h("div", { class: "added_tag", key: index }, h("gb-tag", { size: "sm", icon: this.icon ? this.icon : 'avatar', action: "X_close", onClick: () => this.handleTagRemove(item) }, h("p", { class: "text-xs-medium" }, item))))))) : (h(Fragment, null, this.value.map((item, index) => typeof item === 'object' ? (h("div", { class: "added_tag", key: index }, h("gb-tag", { size: "sm", icon: this.icon ? this.icon : 'avatar', action: "X_close", onClick: () => this.handleTagRemove(item) }, h("p", { class: "text-xs-medium" }, item.name.split(' ')[0]), h("h1", { slot: "initials", class: "text-xxs-semi-bold" }, item.name
                 .split(' ')
                 .map(part => part.charAt(0).toUpperCase())
-                .join(''))))) : (h("div", { class: "added_tag", key: index }, h("gb-tag", { size: "sm", icon: this.icon ? this.icon : 'avatar', action: "X_close", onClick: () => this.handleTagRemove(item) }, h("p", { class: "text-xs-medium" }, item))))))))) : (h("p", { class: "selected_text" }, this.value.length === 0 ? ((_a = this.selectedItem) === null || _a === void 0 ? void 0 : _a.name) || this.selectedItem : h(Fragment, null, this.value.map(item => (typeof item === 'object' ? item.name : item)))))), this.supportingText && (h("div", { key: 'a83f60ebe1eab72a42751e656a66cc5990dc1850', class: "supporting_text text-sm-regular", style: { color: '#697586' } }, this.type !== 'tags' && (h(Fragment, null, this.value.length === 0 ? h(Fragment, null, this.selectedItem.username) : h(Fragment, null, this.value.map(item => typeof item === 'object' && item.username))))))))), this.state === 'disabled' && (h(Fragment, null, h("div", { key: '09b17d9619c472168e969d86e904e7a161aad387', class: `content` }, h("div", { key: 'c3fea91ad2d0ca1166f3fb251b1ea29276652f2f', class: `text text-md-regular ${this.type === 'tags' ? 'tag' : ''}`, style: { color: '#4B5565' } }, this.type === 'tags' ? (h(Fragment, null, this.value.map((item, index) => typeof item === 'object' ? (h("div", { class: "added_tag", key: index }, h("gb-tag", { size: "sm", icon: this.icon ? this.icon : 'avatar', action: "X_close" }, h("p", { class: "text-xs-medium" }, item.name.split(' ')[0]), h("h1", { slot: "initials", class: "text-xxs-semi-bold" }, item.name
+                .join(''))))) : (h("div", { class: "added_tag", key: index }, h("gb-tag", { size: "sm", icon: this.icon ? this.icon : 'avatar', action: "X_close", onClick: () => this.handleTagRemove(item) }, h("p", { class: "text-xs-medium" }, item))))))))) : (h("p", { class: "selected_text" }, this.value.length === 0 ? ((_a = this.selectedItem) === null || _a === void 0 ? void 0 : _a.name) || this.selectedItem : h(Fragment, null, this.value.map(item => (typeof item === 'object' ? item.name : item)))))), this.supportingText && (h("div", { key: '6ccfef93180031f84fe2e802e5e8dd25584425d9', class: "supporting_text text-sm-regular", style: { color: '#697586' } }, this.type !== 'tags' && (h(Fragment, null, this.value.length === 0 ? h(Fragment, null, this.selectedItem.username) : h(Fragment, null, this.value.map(item => typeof item === 'object' && item.username))))))))), this.state === 'disabled' && (h(Fragment, null, h("div", { key: '15d73aadabc10c1d3cc209ba51ee4c154ae26364', class: `content` }, h("div", { key: '93d11530e48b97ecbdb9bb75b01728909bbf289c', class: `text text-md-regular ${this.type === 'tags' ? 'tag' : ''}`, style: { color: '#4B5565' } }, this.type === 'tags' ? (h(Fragment, null, this.value.map((item, index) => typeof item === 'object' ? (h("div", { class: "added_tag", key: index }, h("gb-tag", { size: "sm", icon: this.icon ? this.icon : 'avatar', action: "X_close" }, h("p", { class: "text-xs-medium" }, item.name.split(' ')[0]), h("h1", { slot: "initials", class: "text-xxs-semi-bold" }, item.name
                 .split(' ')
                 .map(part => part.charAt(0).toUpperCase())
-                .join(''))))) : (h("div", { class: "added_tag", key: index }, h("gb-tag", { size: "sm", icon: this.icon ? this.icon : 'avatar', action: "X_close" }, h("p", { class: "text-xs-medium" }, item))))))) : (h(Fragment, null, h(Fragment, null, this.value.map(item => (typeof item === 'object' ? item.name : item)))))), this.supportingText && (h("div", { key: 'ad9f710beff1d16d224f6a152593a105a21a4946', class: "supporting_text text-sm-regular", style: { color: '#697586' } }, this.type !== 'tags' && (h(Fragment, null, this.value.length === 0 ? h(Fragment, null, this.selectedItem.username) : h(Fragment, null, this.value.map(item => typeof item === 'object' && h(Fragment, null, item.username))))))))))), this.showHelpIcon && (h("div", { key: 'aaad512c77af737d7822498d83c593104eb95c7b', class: `help_icon` }, h("gb-help-tooltip", { key: '770118fcfa66d91366cfda8c1df6a9bb00985aad', "show-supporting-text": true }, h("slot", { key: 'f1c61cf2c695e15b38a0a66d178e5cda0f771240', name: "tooltip_label", slot: "label" }), h("slot", { key: '326ca4ad7d08aa30a09bd09bdfe9add06069041b', name: "tooltip_supporting_text", slot: "supporting_text" })))), this.type !== 'search' && (h("div", { key: '74dd3aa557e4e4193223f37838e043e8a67b96ad', class: `dropdown_icon ${this.dropdownOpen ? 'opened' : ''}` }, h("svg", { key: 'd0e9b51285b1f0d99e5f047823b1c0a67e819377', xmlns: "http://www.w3.org/2000/svg", width: "20", height: "20", viewBox: "0 0 20 20", fill: "none", class: `${this.state}` }, h("path", { key: '1a414ee9a14b83214d753bc3ef65d73ea9a989f8', d: "M15 7.50004C15 7.50004 11.3176 12.5 9.99996 12.5C8.68237 12.5 5 7.5 5 7.5", stroke: "#697586", "stroke-width": "1.66667", "stroke-linecap": "round", "stroke-linejoin": "round" })))), h(Fragment, null, this.dropdownOpen && (h("div", { key: 'fdc6913d1b9450791dfff5226bfe66c495380eae', class: `dropdown_menu ${this.menuPosition}`, ref: el => (this.dropdownRef = el), onClick: e => e.stopPropagation() }, this.showSearchInput && (h("div", { key: '9ee28658af3321d2ea3e51158de463420d8eeb27', class: "dropdown_search_field" }, h("gb-input-field", { key: '5a20f5eabaffda391970d20a04a4d71191b82550', size: "sm", value: this.inputValue, "show-close-button": this.inputValue ? true : false, "icon-swap": "assets/search-01.svg", placeholder: "Search banks", type: "icon_leading", labelText: "label", idOfInput: "3", onInputValueChanged: this.searchItems.bind(this) }))), this.searchItem ? (h(Fragment, null, this.searchItem !== '' && this.searchResults.length > 0 ? (h(Fragment, null, this.searchResults.map(item => (h("gb-input-dropdown-menu-item", { type: this.type === 'search' ? 'checkbox' : this.type === 'tags' ? 'checkbox' : this.type, state: StateEnum.Default, "supporting-text": this.supportingText, selected: this.isItemSelected(item), onClick: () => this.handleItemSelect(item) }, typeof item === 'object' ? (h(Fragment, null, h("p", { slot: "name" }, item.name), h("p", { slot: "supporting_text" }, item.username))) : (h("p", { slot: "name" }, item))))))) : this.searchItem !== '' && this.searchResults.length === 0 ? (
+                .join(''))))) : (h("div", { class: "added_tag", key: index }, h("gb-tag", { size: "sm", icon: this.icon ? this.icon : 'avatar', action: "X_close" }, h("p", { class: "text-xs-medium" }, item))))))) : (h(Fragment, null, h(Fragment, null, this.value.map(item => (typeof item === 'object' ? item.name : item)))))), this.supportingText && (h("div", { key: 'e849f230134a956bdddca422066fa21757b460a9', class: "supporting_text text-sm-regular", style: { color: '#697586' } }, this.type !== 'tags' && (h(Fragment, null, this.value.length === 0 ? h(Fragment, null, this.selectedItem.username) : h(Fragment, null, this.value.map(item => typeof item === 'object' && h(Fragment, null, item.username))))))))))), this.showHelpIcon && (h("div", { key: '9d0967e72aca6e0cc4b92252fc97a0496362b235', class: `help_icon` }, h("gb-help-tooltip", { key: 'e24537ef2b2a76d7c20aaae04171df7f1a3169f0', "show-supporting-text": true }, h("slot", { key: 'f846190a57d5ad21ea50f1423b301b9b912111cf', name: "tooltip_label", slot: "label" }), h("slot", { key: '05cff4b052ef63cf46ecc85dd874bf962cfc3904', name: "tooltip_supporting_text", slot: "supporting_text" })))), this.type !== 'search' && (h("div", { key: 'a94f037229bf8bdcdb23f1145773faf044777336', class: `dropdown_icon ${this.dropdownOpen ? 'opened' : ''}` }, h("svg", { key: 'fd25c8f042528fa4371027fd363c6812c0ca8a60', xmlns: "http://www.w3.org/2000/svg", width: "20", height: "20", viewBox: "0 0 20 20", fill: "none", class: `${this.state}` }, h("path", { key: 'd4a0182860427382ca0e90aece2443777b8f3999', d: "M15 7.50004C15 7.50004 11.3176 12.5 9.99996 12.5C8.68237 12.5 5 7.5 5 7.5", stroke: "#697586", "stroke-width": "1.66667", "stroke-linecap": "round", "stroke-linejoin": "round" })))), h(Fragment, null, this.dropdownOpen && (h("div", { key: '910fe5c5ebdea60e76c1ad25ef387026b84acef1', class: `dropdown_menu ${this.menuPosition}`, ref: el => (this.dropdownRef = el), onClick: e => e.stopPropagation() }, this.showSearchInput && (h("div", { key: 'e3cbaede8ea090e504e14fdd6c1f2b05d4df8ecc', class: "dropdown_search_field" }, h("gb-input-field", { key: '64646ceec9a69679a69b17584531bb2e07ba6938', size: "sm", value: this.inputValue, "show-close-button": this.inputValue ? true : false, "icon-swap": "assets/search-01.svg", placeholder: "Search banks", type: "icon_leading", labelText: "label", idOfInput: "3", onInputValueChanged: this.searchItems.bind(this) }))), this.searchItem ? (h(Fragment, null, this.searchItem !== '' && this.searchResults.length > 0 ? (h(Fragment, null, this.searchResults.map(item => (h("gb-input-dropdown-menu-item", { type: this.type === 'search' ? 'checkbox' : this.type === 'tags' ? 'checkbox' : this.type, state: StateEnum.Default, "supporting-text": this.supportingText, selected: this.isItemSelected(item), onClick: () => this.handleItemSelect(item) }, typeof item === 'object' ? (h(Fragment, null, h("p", { slot: "name" }, item.name), h("p", { slot: "supporting_text" }, item.username))) : (h("p", { slot: "name" }, item))))))) : this.searchItem !== '' && this.searchResults.length === 0 ? (
             //Empty state for when there are no search results
             h("div", { class: "empty_state" }, h("img", { src: emptyStateBackground, class: "background", alt: "" }), h("div", { class: "message_background" }, h("img", { src: illustration, alt: "", class: "illustration" }), h("p", { class: "message text-md-semi-bold" }, "No results available")))) : null)) : (h(Fragment, null, this.type === 'tags' ? (h(Fragment, null, this.selectedItems.map(item => (h("gb-input-dropdown-menu-item", { type: this.type === 'search' ? 'checkbox' : this.type === 'tags' ? 'checkbox' : this.type, state: StateEnum.Default, "supporting-text": this.supportingText, selected: true, onClick: () => this.handleItemSelect(item) }, typeof item === 'object' ? (h(Fragment, null, h("p", { slot: "name" }, item.name), h("p", { slot: "supporting_text" }, item.username), h("h1", { slot: "initials" }, item.name.split(' ').map(part => part.charAt(0).toUpperCase())))) : (h(Fragment, null, h("p", { slot: "name" }, item), h("h1", { slot: "initials" }, item.split(' ').map(part => part.charAt(0).toUpperCase()))))))), this.unselectedItems.map(item => (h("gb-input-dropdown-menu-item", { type: this.type === 'search' ? 'checkbox' : this.type === 'tags' ? 'checkbox' : this.type, state: StateEnum.Default, "supporting-text": this.supportingText, selected: false, onClick: () => this.handleItemSelect(item) }, typeof item === 'object' ? (h(Fragment, null, h("p", { slot: "name" }, item.name), h("p", { slot: "supporting_text" }, item.username))) : (h("p", { slot: "name" }, item))))))) : (h(Fragment, null, this.items.map(item => (h("gb-input-dropdown-menu-item", { type: this.type === 'search' ? 'checkbox' : this.type === 'tags' ? 'checkbox' : this.type, state: StateEnum.Default, "supporting-text": this.supportingText, selected: this.isItemSelected(item), color: this.color, onClick: () => this.handleItemSelect(item) }, typeof item === 'object' ? (h(Fragment, null, h("p", { slot: "name" }, item.name), h("h1", { slot: "initials" }, item.name
                 .split(' ')

package/dist/collection/components/gb-input-dropdown-menu-item/gb-input-dropdown-menu-item.js

@@ -25,13 +25,13 @@ export class GbInputDropdownMenuItem {
     render() {
         return (
         // <div class="dropdown-container" onClick={() => (this.selected = !this.selected)}>
-        h("div", { key: 'c6abeb0aac657db4665f5c565a2e49db404b7173', class: "dropdown-container", onClick: () => this.handleClick() }, h("div", { key: 'ea7e5596e4995dc2c504f47ae5968449565939cf', class: {
+        h("div", { key: '78953d07d16988bf3630b37318320375a03132c9', class: "dropdown-container", onClick: () => this.handleClick() }, h("div", { key: '484adbd0319c0d5f861cffb6c20b1a9991c72d4f', class: {
                 'dropdown-item': true,
                 'selected': this.selected,
                 'disabled': this.state === 'disabled',
                 'checkbox': this.type === 'checkbox',
                 [this.type]: true,
-            }, role: "option", "aria-selected": this.selected ? 'true' : 'false', "aria-disabled": this.state === 'disabled' ? 'true' : 'false' }, h("div", { key: '3833b4011dd76f22c8b20aa9e2f3d84a3e287e7f', class: "content" }, this.type === 'icon_leading' && (h("svg", { key: '4709302787c32f8c9d723aaa23d3111388e5f3d6', id: "icon", xmlns: "http://www.w3.org/2000/svg", width: "20", height: "20", viewBox: "0 0 20 20", fill: "none" }, h("path", { key: '3d552369aaef067856c05716f364509d02d37190', d: "M5.48131 12.9013C4.30234 13.6034 1.21114 15.0368 3.09388 16.8305C4.01359 17.7067 5.03791 18.3334 6.32572 18.3334H13.6743C14.9621 18.3334 15.9864 17.7067 16.9061 16.8305C18.7889 15.0368 15.6977 13.6034 14.5187 12.9013C11.754 11.2551 8.24599 11.2551 5.48131 12.9013Z", stroke: "#4B5565", "stroke-width": "1.5" }), h("path", { key: '059beee7d1dd7706c75a8f6990d7d52eded815d2', d: "M13.75 5.41669C13.75 7.48776 12.0711 9.16669 10 9.16669C7.92893 9.16669 6.25 7.48776 6.25 5.41669C6.25 3.34562 7.92893 1.66669 10 1.66669C12.0711 1.66669 13.75 3.34562 13.75 5.41669Z", stroke: "#4B5565", "stroke-width": "1.5" }))), this.type === 'avatar_leading' && (h("gb-avatar", { key: '58a2bd0e3bd1667d23c2486d0aee09e2bab4ada8', class: "avatar-icon", size: "xs", color: this.color, text: true }, h("slot", { key: '52e94d037dfc706e3b26324f714639346e898be3', name: "initials", slot: "initials" }))), this.type === 'dot_leading' && (h(Fragment, null, this.state === 'default' ? (h("svg", { id: "icon", xmlns: "http://www.w3.org/2000/svg", width: "10px", height: "10px", viewBox: "0 0 10 10", fill: "none" }, h("circle", { cx: "5", cy: "5", r: "4", fill: "#17B26A" }))) : (h("svg", { xmlns: "http://www.w3.org/2000/svg", width: "10", height: "10", viewBox: "0 0 10 10", fill: "none" }, h("circle", { cx: "5", cy: "5", r: "4", fill: "#EEF2F6" }))))), this.type === 'checkbox' && h("gb-checkbox", { key: 'a9591084d9f31f9b8a2981fe77e448cd1281e707', class: "checkbox", size: "md", type: "checkbox", state: this.state, checked: this.selected }), h("slot", { key: '2e82aa3768f62441e8f61dce2873580a3de3bd47', name: "name" }), this.supportingText && (h("span", { key: '9b48f92c4bd56b609f9ba2dab2f90564aa3c8a6b' }, h("slot", { key: 'a570e135f7c2a074304f09339c41965751b7764a', name: "supporting_text" })))), this.selected && this.type !== 'checkbox' && (h("div", { key: '960916a38e128c49fcb050e2bca72727143dfccb', class: `tick` }, this.state !== 'disabled' ? (h("svg", { xmlns: "http://www.w3.org/2000/svg", width: "20", height: "20", viewBox: "0 0 20 20", fill: "none", class: `${this.state}` }, h("path", { d: "M4.16669 12.0834C4.16669 12.0834 5.41669 12.0834 7.08335 15C7.08335 15 11.7157 7.36115 15.8334 5.83337", stroke: "#075DB2", "stroke-width": "1.66667", "stroke-linecap": "round", "stroke-linejoin": "round" }))) : (h("svg", { xmlns: "http://www.w3.org/2000/svg", width: "20", height: "20", viewBox: "0 0 20 20", fill: "none" }, h("path", { d: "M4.16669 12.0834C4.16669 12.0834 5.41669 12.0834 7.08335 15C7.08335 15 11.7157 7.36115 15.8334 5.83337", stroke: "#CDD5DF", "stroke-width": "1.66667", "stroke-linecap": "round", "stroke-linejoin": "round" }))))))));
+            }, role: "option", "aria-selected": this.selected ? 'true' : 'false', "aria-disabled": this.state === 'disabled' ? 'true' : 'false' }, h("div", { key: '69f39487e49bef5c5ef44f5f5dead02da9e687c1', class: "content" }, this.type === 'icon_leading' && (h("svg", { key: '9856631574b90e311eb689fa4f36944b97d54e45', id: "icon", xmlns: "http://www.w3.org/2000/svg", width: "20", height: "20", viewBox: "0 0 20 20", fill: "none" }, h("path", { key: '3c3e54ba8b00c4797cb9db6b63229181e57c59aa', d: "M5.48131 12.9013C4.30234 13.6034 1.21114 15.0368 3.09388 16.8305C4.01359 17.7067 5.03791 18.3334 6.32572 18.3334H13.6743C14.9621 18.3334 15.9864 17.7067 16.9061 16.8305C18.7889 15.0368 15.6977 13.6034 14.5187 12.9013C11.754 11.2551 8.24599 11.2551 5.48131 12.9013Z", stroke: "#4B5565", "stroke-width": "1.5" }), h("path", { key: '669832a15ea5805df2c990873406eec7a4386597', d: "M13.75 5.41669C13.75 7.48776 12.0711 9.16669 10 9.16669C7.92893 9.16669 6.25 7.48776 6.25 5.41669C6.25 3.34562 7.92893 1.66669 10 1.66669C12.0711 1.66669 13.75 3.34562 13.75 5.41669Z", stroke: "#4B5565", "stroke-width": "1.5" }))), this.type === 'avatar_leading' && (h("gb-avatar", { key: '913d9b8078817a7ac7c1714370e685bb2dd550ea', class: "avatar-icon", size: "xs", color: this.color, text: true }, h("slot", { key: '848dae12eafcdcc00494ca9490ccf2829f49f044', name: "initials", slot: "initials" }))), this.type === 'dot_leading' && (h(Fragment, null, this.state === 'default' ? (h("svg", { id: "icon", xmlns: "http://www.w3.org/2000/svg", width: "10px", height: "10px", viewBox: "0 0 10 10", fill: "none" }, h("circle", { cx: "5", cy: "5", r: "4", fill: "#17B26A" }))) : (h("svg", { xmlns: "http://www.w3.org/2000/svg", width: "10", height: "10", viewBox: "0 0 10 10", fill: "none" }, h("circle", { cx: "5", cy: "5", r: "4", fill: "#EEF2F6" }))))), this.type === 'checkbox' && h("gb-checkbox", { key: '7e2b89fc5b590f3b2758cfff1458422dd10a0416', class: "checkbox", size: "md", type: "checkbox", state: this.state, checked: this.selected }), h("slot", { key: 'f903002cfcb2f0d93b8306a413748c283db0c0f4', name: "name" }), this.supportingText && (h("span", { key: 'a84fab3cc5677770c5c5033fcb17fdedb3cb550b' }, h("slot", { key: '4b10fef2361b9cce5379d3ad1cf863b32a6a5acc', name: "supporting_text" })))), this.selected && this.type !== 'checkbox' && (h("div", { key: '1360955e06bb7eab084946a099462e484a747581', class: `tick` }, this.state !== 'disabled' ? (h("svg", { xmlns: "http://www.w3.org/2000/svg", width: "20", height: "20", viewBox: "0 0 20 20", fill: "none", class: `${this.state}` }, h("path", { d: "M4.16669 12.0834C4.16669 12.0834 5.41669 12.0834 7.08335 15C7.08335 15 11.7157 7.36115 15.8334 5.83337", stroke: "#075DB2", "stroke-width": "1.66667", "stroke-linecap": "round", "stroke-linejoin": "round" }))) : (h("svg", { xmlns: "http://www.w3.org/2000/svg", width: "20", height: "20", viewBox: "0 0 20 20", fill: "none" }, h("path", { d: "M4.16669 12.0834C4.16669 12.0834 5.41669 12.0834 7.08335 15C7.08335 15 11.7157 7.36115 15.8334 5.83337", stroke: "#CDD5DF", "stroke-width": "1.66667", "stroke-linecap": "round", "stroke-linejoin": "round" }))))))));
     }
     static get is() { return "gb-input-dropdown-menu-item"; }
     static get encapsulation() { return "shadow"; }