npm - globuswebcomponents - Versions diffs - 0.6.7 → 0.6.9 - Mend

globuswebcomponents 0.6.7 → 0.6.9

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (336) hide show

package/dist/collection/components/gb-megainput-field-base/gb-megainput-field.js CHANGED Viewed

@@ -16,10 +16,10 @@ export class GbMegaInputField {
         }
     }
     render() {
-        return (h("div", { key: '7333f72c47eeb1c51107aeb98ee602687bd29bfe', class: {
+        return (h("div", { key: '15bb83556f695541b348723b1e056aa43792e669', class: {
                 [this.size]: true,
                 disabled: this.state === 'disabled'
-            } }, h("input", { key: '50d534fced3259ad4ab6dd343f0608f9fd826616', class: {
+            } }, h("input", { key: '05df9cd7f88f1f3b6812dd72139dfc34c0534762', class: {
                 [this.size]: true,
                 disabled: this.state === 'disabled'
             }, type: "number", min: "0", max: "1", placeholder: "0", value: this.inputValue, onInput: (event) => this.handleInput(event) })));

package/dist/collection/components/gb-notification-content/gb-notification-content.js CHANGED Viewed

@@ -8,7 +8,7 @@ export class GbNotificationContent {
     }
     render() {
         const iconSrc = getAssetPath(`assets/${this.icon}.svg`);
-        return (h("div", { key: '821c9403c5198ff217e9f06cd7627318f68b691d', class: "notification_container" }, h("div", { key: 'ba8c6e9ddc846a8f3e18ed2da78833dbaff181cc', class: "notification_title" }, this.icon && (h("div", { key: 'cd92b15602ad73eba3223ec56eaa39f877807572', class: "icon" }, h("img", { key: '573acc7dba05a99d41bb607d35105e9283cfd313', src: iconSrc, alt: "Icon" }))), h("label", { key: 'be7427c112f9d2bcfc22761965d3e581455260be' }, this.label), h("span", { key: '4fe6ff777306eb44f4a2eec98012521d28d1a241', class: "time" }, this.time)), h("div", { key: '762c46e1967e95c01e7055c82cfeb73fe743a0c3', class: "supporting_text" }, h("p", { key: '07083bdd904f12e8fe8397978bc53375ad7fb388', class: "text-sm-regular" }, this.supportingText))));
+        return (h("div", { key: 'e3090988fa1f8ae6dda319746b95272b1be675d2', class: "notification_container" }, h("div", { key: '4989001b2e1e3503e5df0f34c5aba95ca046c0c4', class: "notification_title" }, this.icon && (h("div", { key: 'e0536bb9d66618260682814b8f090fa6d32a5911', class: "icon" }, h("img", { key: 'e930ce7597d6c91423a043cba1eea706659b4cf3', src: iconSrc, alt: "Icon" }))), h("label", { key: '7e0effc58cf5244a68dd38646459e1876096a0d6' }, this.label), h("span", { key: 'f0bc6207adf20141531e9983c98325e57359c820', class: "time" }, this.time)), h("div", { key: 'c65e8cb750ef09742187b91add5caa89b7fc9864', class: "supporting_text" }, h("p", { key: 'af45caabf8a3c1859b50fb2a7ff58a0a50c0c2ca', class: "text-sm-regular" }, this.supportingText))));
     }
     static get is() { return "gb-notification-content"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/gb-notification-pane/gb-notification-pane.js CHANGED Viewed

@@ -26,10 +26,10 @@ export class GbNotificationPane {
         notification.remove();
     }
     render() {
-        return (h("div", { key: 'e85c0d79adc47409741710b10265e502679ad5c7', class: "notification_pane_div" }, this.state === 'empty' && [
-            h("div", { key: '1d39a61b7d25c6723828550eda4afbeeb63fc083', class: `container` }, h("img", { key: '941d43193b47e9fd4b59a8209aeb0c742ca82c27', src: "build/assets/no_notification_frame.svg", alt: "" })),
-            h("div", { key: 'fca8ad19031ee54c5f6d64b3c05b1ac0903300aa', class: `button` }, h("gb-button", { key: 'b5345015b0aa4c2f8f3c75dd4fa00e3b499d2806', size: "sm", hierarchy: "tertiary_color", icon: "default", state: "disabled", "icon-leading": true, "icon-leading-swap": "assets/blush_brush.svg" }, h("p", { key: '90b090ece3ba5b6564ebc4b1a3f071b979142f6a' }, "Mark all as read"))),
-        ], this.state === 'notification_dropdown' && (h("div", { key: '5858ac7dfa5a8cd24910597515870808709db04c', class: "notification_dropdown" }, h("div", { key: '9b09b11c6a02959c77dc92921a4b468d2f8352c6', class: `content_wrapper` }, h("gb-notification-content", { key: 'afea17a13f8a31f61d29f8d12a0b80f78e3b832d', label: "Flagged Transaction", time: "Just now", "supporting-text": "Aisha, here is your weekly report", icon: "alert-02" }), h("gb-notification-content", { key: 'a9829a3e6cfa74340c510519583a74e3c593b5e5', label: "Flagged Transaction", time: "Just now", "supporting-text": "Aisha, here is your weekly report", icon: "alert-02" }), h("gb-notification-content", { key: '214f9795a8593398e043d81a2f9e865edc6cf786', label: "Flagged Transaction", time: "Just now", "supporting-text": "Aisha, here is your weekly report", icon: "alert-02" }), h("gb-notification-content", { key: 'a1ee0f158bc5e5714179195ea21bcfa000c7ea37', label: "Flagged Transaction", time: "Just now", "supporting-text": "Aisha, here is your weekly report", icon: "alert-02" }), h("gb-notification-content", { key: '5b536559b789c5a6e6d378b4c9fc8d5d54b8cdff', label: "Flagged Transaction", time: "Just now", "supporting-text": "Aisha, here is your weekly report", icon: "alert-02" }), h("gb-notification-content", { key: 'f0f442ac8f00434481d597bd40d93a8176b1e760', label: "Flagged Transaction", time: "Just now", "supporting-text": "Aisha, here is your weekly report", icon: "alert-02" })), h("gb-button", { key: '27f97a52c29e3d19339ced06a0f42569ba998b36', size: "sm", hierarchy: "tertiary_color", icon: "default", "icon-leading": true, "icon-leading-swap": "assets/blush_brush.svg" }, h("p", { key: '70a0b6b8384deedb064c3b4ec75546b27cf09d8c' }, "Mark all as read"))))));
+        return (h("div", { key: 'b027a8a726f363f957da3b9430da02f1815eaa88', class: "notification_pane_div" }, this.state === 'empty' && [
+            h("div", { key: '1300148aca0b993ba13242720d26a39759a3654d', class: `container` }, h("img", { key: 'ea9a81de1f6042ccb731f6161653adde841c77bb', src: "build/assets/no_notification_frame.svg", alt: "" })),
+            h("div", { key: '4234dfe6ac3d02c7969bd6b0fe249f7a2166b88c', class: `button` }, h("gb-button", { key: 'f9d73991fe6ee8f5848aff24c8df481d228126dc', size: "sm", hierarchy: "tertiary_color", icon: "default", state: "disabled", "icon-leading": true, "icon-leading-swap": "assets/blush_brush.svg" }, h("p", { key: '87f7ee3de0636138e9e446549443b250707e50ae' }, "Mark all as read"))),
+        ], this.state === 'notification_dropdown' && (h("div", { key: '23acb3983ff2cfce1bc4e3cae49f257e23f0942f', class: "notification_dropdown" }, h("div", { key: 'fac82e0b53477b227ffe29c335dc2c49f9fb341a', class: `content_wrapper` }, h("gb-notification-content", { key: '74a13897136d87100181687e8ed0592e87eb1915', label: "Flagged Transaction", time: "Just now", "supporting-text": "Aisha, here is your weekly report", icon: "alert-02" }), h("gb-notification-content", { key: '209ad45f95b4ec8f87b3a1e7bb56d1ece77212e8', label: "Flagged Transaction", time: "Just now", "supporting-text": "Aisha, here is your weekly report", icon: "alert-02" }), h("gb-notification-content", { key: '8945445e1a297a54848a8f238f18a6408bc003a2', label: "Flagged Transaction", time: "Just now", "supporting-text": "Aisha, here is your weekly report", icon: "alert-02" }), h("gb-notification-content", { key: '348ebdde15978f91e5888be54d9237a5ba0c81ed', label: "Flagged Transaction", time: "Just now", "supporting-text": "Aisha, here is your weekly report", icon: "alert-02" }), h("gb-notification-content", { key: '52b58f7029fa978a685e987072db94fbffc51f54', label: "Flagged Transaction", time: "Just now", "supporting-text": "Aisha, here is your weekly report", icon: "alert-02" }), h("gb-notification-content", { key: 'b330c56d89699d7185997403ab2bdff5c8075f47', label: "Flagged Transaction", time: "Just now", "supporting-text": "Aisha, here is your weekly report", icon: "alert-02" })), h("gb-button", { key: '1bfbd7c1450c789c0cf1cd48a3f3a631f40e5d27', size: "sm", hierarchy: "tertiary_color", icon: "default", "icon-leading": true, "icon-leading-swap": "assets/blush_brush.svg" }, h("p", { key: '77239d1dc9598cd2b408ce00c66e3fe854473fad' }, "Mark all as read"))))));
     }
     static get is() { return "gb-notification-pane"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/gb-pagination/gb-pagination.js CHANGED Viewed

@@ -8,7 +8,7 @@ export class GbPagination {
         this.totalPages = 10;
     }
     render() {
-        return (h("div", { key: 'c295753aff8d7a31e71700c7ec980437ed989acd', class: `pagination_div ${this.type} ${this.breakpoint}` }, this.type === 'page_default' && this.breakpoint === 'desktop' && (h(Fragment, null, h("gb-button", { key: 'fee598a4cf7df7e12821a2a40cc45243c4f5ee1c', size: "sm", hierarchy: "tertiary_gray", icon: "default", state: "default", "icon-leading": true, "icon-leading-swap": "assets/arrow-left-02.svg" }, h("p", { key: 'b0be798513c121603014690dcffde8879794b2b0' }, "Previous")), h("gb-button", { key: '4afee1219518ab8c1852ab59765e76c77924885a', size: "sm", hierarchy: "tertiary_gray", icon: "default", state: "default", "icon-trailing": true, "icon-trailing-swap": "assets/arrow-right-02.svg" }, h("p", { key: '1af112464e2239755c2c8dc863e0f81e4f657216' }, "Next")))), this.type === 'page_minimal_center_aligned' && this.breakpoint === 'desktop' && (h(Fragment, null, h("gb-button", { key: '15491c2574abecca4f4af6223272531d0f85d7f6', size: "sm", hierarchy: "secondary_gray", icon: "default", state: "default", "icon-leading": true, "icon-leading-swap": "assets/arrow-left-02.svg" }, h("p", { key: 'e4180e558f756e2953a64c0c2827cfe8fabb5834' }, "Previous")), h("gb-button", { key: '3da3642336105d9481f3c4b26038e7ff8bf1611d', size: "sm", hierarchy: "secondary_gray", icon: "default", state: "default", "icon-trailing": true, "icon-trailing-swap": "assets/arrow-right-02.svg" }, h("p", { key: '14b8b72f7c2986a77431f72538d700c330449ec2' }, "Next")))), this.type === 'card_default' && this.breakpoint === 'desktop' && (h(Fragment, null, h("div", { key: 'c4d3a305d6cea4fb72eafc85d5938a5384299bdc', class: "entries" }, "Entries"), h("div", { key: '9ef2ede6a694d06d256351bf206bb5f1200b1b2d', class: "page_numbers" }), h("div", { key: '71a864ac779c78bd3ce14f4bc24fa4fdf26b543a', class: "buttons" }, h("gb-button", { key: '75325b035b854b72f6a51a6536d4196764e1edf5', size: "sm", hierarchy: "secondary_gray", icon: "only", state: "default", "icon-leading": true, "icon-leading-swap": "assets/arrow-left-02.svg" }), h("gb-button", { key: 'e948938a34a0f4961db71ebfa47bd00cf47cd559', size: "sm", hierarchy: "secondary_gray", icon: "only", state: "default", "icon-leading": true, "icon-leading-swap": "assets/arrow-right-02.svg" })))), this.type === 'page_default' && this.breakpoint === 'mobile' && (h(Fragment, null, h("gb-button", { key: 'de66ba097606ca2b3d0947827c07f795d442887d', size: "sm", hierarchy: "secondary_gray", icon: "only", state: "default", "icon-leading": true, "icon-leading-swap": "assets/arrow-left-02.svg" }), h("div", { key: '6814775f7e6ee2800b45fc64e767c3ef596cf7c3', class: "page_number_text" }, h("p", { key: '98059bf3f33e3bc33f9790d1a443ee5c1eda7308', class: "text-sm-medium" }, "Page ", this.currentPage, " of ", this.totalPages)), h("gb-button", { key: 'f2320b338c41acd0b865c2632ea1adede9bb4f4c', size: "sm", hierarchy: "secondary_gray", icon: "only", state: "default", "icon-leading": true, "icon-leading-swap": "assets/arrow-right-02.svg" })))));
+        return (h("div", { key: '7937418fa3d8f1c6ebf424d7331be1a709b98dd6', class: `pagination_div ${this.type} ${this.breakpoint}` }, this.type === 'page_default' && this.breakpoint === 'desktop' && (h(Fragment, null, h("gb-button", { key: 'b7d9a24cd079ad3b75b22f02fd4c9f7d8bee6c9e', size: "sm", hierarchy: "tertiary_gray", icon: "default", state: "default", "icon-leading": true, "icon-leading-swap": "assets/arrow-left-02.svg" }, h("p", { key: '1fc062995d1972f274349e28e150d47679117963' }, "Previous")), h("gb-button", { key: '2b66332bfa9a47813972275523df0fb153161b21', size: "sm", hierarchy: "tertiary_gray", icon: "default", state: "default", "icon-trailing": true, "icon-trailing-swap": "assets/arrow-right-02.svg" }, h("p", { key: '11ada6356f5b545f2a732e5a6f4f46662b4dcf04' }, "Next")))), this.type === 'page_minimal_center_aligned' && this.breakpoint === 'desktop' && (h(Fragment, null, h("gb-button", { key: 'ce014623164a840760a2e5eda965b6f5eb44799f', size: "sm", hierarchy: "secondary_gray", icon: "default", state: "default", "icon-leading": true, "icon-leading-swap": "assets/arrow-left-02.svg" }, h("p", { key: '27058fc07df4d98cc352cff7556eb15e3341c9c5' }, "Previous")), h("gb-button", { key: 'b8af1aae26c33b4e94c17758c3a785d085688a90', size: "sm", hierarchy: "secondary_gray", icon: "default", state: "default", "icon-trailing": true, "icon-trailing-swap": "assets/arrow-right-02.svg" }, h("p", { key: 'dc59cb954f3f78a9aeb2e31f49fb3d90dbe8e168' }, "Next")))), this.type === 'card_default' && this.breakpoint === 'desktop' && (h(Fragment, null, h("div", { key: 'a3c83e3ec82891f1fa3158709d0a8ede214978cd', class: "entries" }, "Entries"), h("div", { key: '4dd36525267f63c3db7b93f9a3d1efaa91368955', class: "page_numbers" }), h("div", { key: 'cb803e32ffec973779eae5d9a69b5b6fb0ae1284', class: "buttons" }, h("gb-button", { key: 'c6f54fd2bd997e8475e77218de60be5f819865a4', size: "sm", hierarchy: "secondary_gray", icon: "only", state: "default", "icon-leading": true, "icon-leading-swap": "assets/arrow-left-02.svg" }), h("gb-button", { key: '3a329240e92d5b2a47f602f60080dec8a9b9acda', size: "sm", hierarchy: "secondary_gray", icon: "only", state: "default", "icon-leading": true, "icon-leading-swap": "assets/arrow-right-02.svg" })))), this.type === 'page_default' && this.breakpoint === 'mobile' && (h(Fragment, null, h("gb-button", { key: 'e885aaa8b0083ff0df01f2d6686c5c97bc45f918', size: "sm", hierarchy: "secondary_gray", icon: "only", state: "default", "icon-leading": true, "icon-leading-swap": "assets/arrow-left-02.svg" }), h("div", { key: 'd02ddb6d94242699abdf474b1b26bd4904365649', class: "page_number_text" }, h("p", { key: '4d725bb5c7bd955a617f5ba7aa007e3ff2fa36ee', class: "text-sm-medium" }, "Page ", this.currentPage, " of ", this.totalPages)), h("gb-button", { key: 'e14d12ed003e02894a5d31b3d1a5ad0d8b92f2f8', size: "sm", hierarchy: "secondary_gray", icon: "only", state: "default", "icon-leading": true, "icon-leading-swap": "assets/arrow-right-02.svg" })))));
     }
     static get is() { return "gb-pagination"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/gb-pagination-button-group-base/gb-pagination-button-group-base.js CHANGED Viewed

@@ -12,7 +12,7 @@ export class GbPaginationButtonGroupBase {
         }
     }
     render() {
-        return (h("div", { key: '2eb6d278ee7ee06e899d26fcb8ad48a589391335', class: `button_base_div ${this.icon}` }, this.icon === 'false' && h("slot", { key: 'd34bb191780e0febf2a46366428450000eba096a' }), this.icon === 'leading' && (h(Fragment, null, h("svg", { key: 'a82a9dbf227aa036a6f8c0f5b9bbfae1f4b27c01', xmlns: "http://www.w3.org/2000/svg", width: "20", height: "20", viewBox: "0 0 20 20", fill: "none" }, h("path", { key: '4fbe239fe5ced50dbb92a438ee909cda0c65bfcf', d: "M3.33325 9.99981H16.6666M3.33325 9.99981C3.33326 11.0978 7.49975 14.1667 7.49975 14.1667M3.33325 9.99981C3.33324 8.90182 7.49978 5.83334 7.49978 5.83334", stroke: "#4B5565", "stroke-width": "1.67", "stroke-linecap": "round", "stroke-linejoin": "round" })), h("slot", { key: 'e8282392cc86bdfb39d135f8f3a66cff306d670a' }))), this.icon === 'trailing' && (h(Fragment, null, h("slot", { key: 'b86e41c072a6b0caaf84392ca1eae6c00d6cb0ea' }), this.iconTrailing && (h("svg", { key: '3d902a044b5f6ba63c1c82cc55e4b0600f8009e1', xmlns: "http://www.w3.org/2000/svg", width: "20", height: "20", viewBox: "0 0 20 20", fill: "none" }, h("path", { key: '5845338585d54be981a47136dd413c7205482834', d: "M16.6668 9.99984H3.3335M16.6668 9.99984C16.6668 11.0978 12.5003 14.1667 12.5003 14.1667M16.6668 9.99984C16.6669 8.90185 12.5002 5.83337 12.5002 5.83337", stroke: "#4B5565", "stroke-width": "1.5", "stroke-linecap": "round", "stroke-linejoin": "round" })))))));
+        return (h("div", { key: 'a743513b6887e9c7f7691e24f22aa6867dd0bfd2', class: `button_base_div ${this.icon}` }, this.icon === 'false' && h("slot", { key: 'add03f626990dfc416d7cb5ee27cfdf89eb29323' }), this.icon === 'leading' && (h(Fragment, null, h("svg", { key: '55501995904b14a7b58986456e1472319e9af666', xmlns: "http://www.w3.org/2000/svg", width: "20", height: "20", viewBox: "0 0 20 20", fill: "none" }, h("path", { key: '8ceeb14d4fe3ea01d1f96b7c66594dd5951be790', d: "M3.33325 9.99981H16.6666M3.33325 9.99981C3.33326 11.0978 7.49975 14.1667 7.49975 14.1667M3.33325 9.99981C3.33324 8.90182 7.49978 5.83334 7.49978 5.83334", stroke: "#4B5565", "stroke-width": "1.67", "stroke-linecap": "round", "stroke-linejoin": "round" })), h("slot", { key: '701adbc3a154860b9c1df185b96ea30367240294' }))), this.icon === 'trailing' && (h(Fragment, null, h("slot", { key: 'ef8524e3115842eab884bded8a09515492331fca' }), this.iconTrailing && (h("svg", { key: 'f7a82e5868db5be3ea988acf4f73694ea995af13', xmlns: "http://www.w3.org/2000/svg", width: "20", height: "20", viewBox: "0 0 20 20", fill: "none" }, h("path", { key: '1e6e5e848ce3a9965c1c2599a4d2229526d5bd1c', d: "M16.6668 9.99984H3.3335M16.6668 9.99984C16.6668 11.0978 12.5003 14.1667 12.5003 14.1667M16.6668 9.99984C16.6669 8.90185 12.5002 5.83337 12.5002 5.83337", stroke: "#4B5565", "stroke-width": "1.5", "stroke-linecap": "round", "stroke-linejoin": "round" })))))));
     }
     static get is() { return "gb-pagination-button-group-base"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/gb-pagination-dot-indicator/gb-pagination-dot-indicator.js CHANGED Viewed

@@ -6,7 +6,7 @@ export class GbPaginationDotIndicator {
         this.size = undefined;
     }
     render() {
-        return h("div", { key: 'e23743d28267b84c799dae2ddf5052f97ff0633e', class: `dot_indicator_div
+        return h("div", { key: '31466996ee36ef5c54fce1194b67c38177115a3e', class: `dot_indicator_div
       ${this.type} ${this.current ? 'current' : ''}
       ${this.size}` });
     }

package/dist/collection/components/gb-pagination-number-base/gb-pagination-number-base.js CHANGED Viewed

@@ -10,7 +10,7 @@ export class GbPaginationNumberBase {
         }
     }
     render() {
-        return (h("div", { key: 'ea540184453e28e2e242402c77e76cb183af1cef', class: `page_number_base ${this.shape}` }, h("slot", { key: '683da0be010c87da515066955cd868c15c3cfb34', name: "page_number" })));
+        return (h("div", { key: '33c161662d65c8c85af9e50ecd67d63253a69365', class: `page_number_base ${this.shape}` }, h("slot", { key: '46496a045cd6432455a428fcd536dfe67e495b20', name: "page_number" })));
     }
     static get is() { return "gb-pagination-number-base"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/gb-password-button/gb-password-button.js CHANGED Viewed

@@ -8,7 +8,7 @@ export class GbPasswordButton {
         this.isPasswordVisible = !this.isPasswordVisible;
     }
     render() {
-        return (h("div", { key: 'da9c19c9a66838f8d4626e8f113784f1b7afabf4' }, h("gb-btn", { key: 'fce6a412deaee5a178d481e5bfcc80455f879915', size: "sm", hierarchy: "link_gray", state: "default", onClick: () => this.togglePasswordVisibility() }, this.isPasswordVisible ? (h("gb-button", { size: "sm", hierarchy: "tertiary_gray", icon: "default", state: this.state }, h("p", null, "HIDE"))) : (h("gb-button", { size: "sm", hierarchy: "tertiary_gray", icon: "default", state: this.state }, h("p", null, "SHOW"))))));
+        return (h("div", { key: 'a12c0422cf4b3da4481738c240a1e471e62d2c1d' }, h("gb-btn", { key: '3a2f334a310ebf54f6b1558291f85f8e8dabee5b', size: "sm", hierarchy: "link_gray", state: "default", onClick: () => this.togglePasswordVisibility() }, this.isPasswordVisible ? (h("gb-button", { size: "sm", hierarchy: "tertiary_gray", icon: "default", state: this.state }, h("p", null, "HIDE"))) : (h("gb-button", { size: "sm", hierarchy: "tertiary_gray", icon: "default", state: this.state }, h("p", null, "SHOW"))))));
     }
     static get is() { return "gb-password-button"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/gb-progress-bar/gb-progress-bar.js CHANGED Viewed

@@ -8,7 +8,7 @@ export class GbProgressBar {
     }
     render() {
         const progressValue = Math.min(Math.max(this.progress, 0), 100);
-        return (h("div", { key: '0a86acd5527aca2e22599a44512db1a48bd1a478', class: `progress_bar_container ${this.labelPosition}` }, h("div", { key: '645ee77faeee49735de57e0be7d656d2d22afc55', class: "progress_bar" }, h("div", { key: '6655e79a328c84766c12ae0161e7e35f4931c5fb', class: "progress_fill", style: { width: `${progressValue}%` } })), h(Fragment, null, this.showLabel && (h("div", { key: '3dfed9961c8b65256cb6975679e71f83ef8355c9', class: `label ${this.labelPosition}` }, this.labelPosition === 'right' && h("span", { key: '0a9290dc3364ec3c8b8df91f063f28daf9aa7f7b', class: `text-sm-medium` }, progressValue, "%"), this.labelPosition === 'bottom' && h("span", { key: '1499556f49d8ea20858806379231d4c2b190e917', class: `text-sm-medium` }, progressValue, "%"), this.labelPosition === 'top_floating' && (h("gb-tooltip", { key: 'caa6ef792f9f5f4e5929fd537e55b3982ac00e78', class: `top_tooltip`, arrow: "none", style: { marginLeft: `${(progressValue - 6.5).toString()}%` } }, h("p", { key: '858d2874208ab269fa6b4d51979b359488d913c3', slot: "main_text", class: "text-xs-semi-bold" }, progressValue, "%"))), this.labelPosition === 'bottom_floating' && (h("gb-tooltip", { key: 'b85aa1494ede36a77cc820dbe690ea20577f3235', class: `bottom_tooltip`, arrow: "none", style: { marginLeft: `${(progressValue - 59.5).toString()}%` } }, h("p", { key: 'dd83bf52a374c1b25798aede26dbb11163fb1eac', slot: "main_text", class: "text-xs-semi-bold" }, progressValue, "%"))))))));
+        return (h("div", { key: 'b4efb4dd07fe88eefea4a5ebf3bd0be241237e5f', class: `progress_bar_container ${this.labelPosition}` }, h("div", { key: '937fcd2d2cf99534b1a74146e0b9a3e77b1e20a5', class: "progress_bar" }, h("div", { key: '069037f3878c7bea0736646e0939b7aca57b56d0', class: "progress_fill", style: { width: `${progressValue}%` } })), h(Fragment, null, this.showLabel && (h("div", { key: 'c5dd574a0fe3dee8c1a711e69d52d09499a92027', class: `label ${this.labelPosition}` }, this.labelPosition === 'right' && h("span", { key: 'f25d03182c4957782ebe77dc575d777b446b3f43', class: `text-sm-medium` }, progressValue, "%"), this.labelPosition === 'bottom' && h("span", { key: '0893598ff95a4fb194248cd7deadf7b17f2808f0', class: `text-sm-medium` }, progressValue, "%"), this.labelPosition === 'top_floating' && (h("gb-tooltip", { key: '3e680fb7934d4a8864d44447a6161f50fcf83508', class: `top_tooltip`, arrow: "none", style: { marginLeft: `${(progressValue - 6.5).toString()}%` } }, h("p", { key: '3c2331c625b6a16bc6fbd316fbc3fcd064e920a6', slot: "main_text", class: "text-xs-semi-bold" }, progressValue, "%"))), this.labelPosition === 'bottom_floating' && (h("gb-tooltip", { key: 'edb1729f6bdcdb3dca1e15cc901adb1109fb47dc', class: `bottom_tooltip`, arrow: "none", style: { marginLeft: `${(progressValue - 59.5).toString()}%` } }, h("p", { key: '4cd62dbb1cde5567e5780e0872c50a30d655e51a', slot: "main_text", class: "text-xs-semi-bold" }, progressValue, "%"))))))));
     }
     static get is() { return "gb-progress-bar"; }
     static get encapsulation() { return "shadow"; }