globuswebcomponents 0.3.9 → 0.4.1

package/dist/collection/components/gb-megainput-field-base/gb-megainput-field.css

@@ -2119,7 +2119,7 @@
 }
 
 .text-sm-regular{
-    font-size: var(--text-sm-regular-font-size);
+    font-size: var(--text-sm-regular-font-size, 0.875rem);
     font-weight: var(--text-sm-regular-font-weight);
     line-height: var(--text-sm-regular-line-height);
 }
@@ -2148,56 +2148,100 @@
     line-height: var(--text-xs-regular-line-height);
 }
 
-input{
-    display: flex;   
-    flex-direction: column;
-    justify-content: center;
-    align-items: flex-start;
-    gap: var(--spacing-2);
-    border-radius: 8px;
-    border: 1px solid #CDD5DF;
-    color: #CDD5DF;
-    text-align: center;
-    /*font-family: Sora;*/
-    font-style: normal;
-    font-weight: 500;
+div {
+  display: flex;   
+  flex-direction: column;
+  justify-content: center;
+  align-items: center;
+  gap: var(--spacing-Positive-spacing-2, 0.5rem);
+  border-radius: 8px;
+  border: 1px solid var(--color-boarder-input, #CDD5DF);
+}
+
+div.sm {
+  width: 2.75rem;
+  min-width: 2.75rem;
+  min-height: 2.75rem;
+  padding: var(--spacing-Positive-spacing-half, 0.125rem);
+}
+
+div.md {
+  width: 3rem;
+  min-width: 3rem;
+  min-height: 3rem;
+  padding: 0.625rem var(--spacing-Positive-spacing-2, 0.5rem);
+}
+
+div.lg {
+  width: 3.5rem;
+  min-width: 3.5rem;
+  min-height: 3.5rem;
+  padding: var(--spacing-Positive-spacing-3, 0.75rem) var(--spacing-Positive-spacing-2, 0.5rem);
+}
+
+div:active {
+  border: 1.3px solid var(--color-border-selected, #075DB2);
+  color: var(--color-text, #4B5565);
+}
+
+div.disabled {
+  background: var(--color-background-gray-subtlest, #F6F8FA);
+  border: 1px solid var(--color-boarder-disabled, #E3E8EF);
+}
+
+input[type="number"]::-webkit-outer-spin-button,
+input[type="number"]::-webkit-inner-spin-button {
+  -webkit-appearance: none;
+  margin: 0;
+}
+
+input {
+  width: inherit;
+  border: none;
+  background-color: var(--color-background-card, #FFFFFF); 
+  padding: 2px;
+  box-shadow: none;
+  outline: none;
+  text-align: center;
+  font-family: Sora;
+  font-style: normal;
+  font-weight: 500;
+  color: var(--color-text-disabled, #CDD5DF); /* Placeholder color */
+}
+
+input:focus {
+  border:none;
+  box-shadow: none;
 }
 
 input.sm {
-    min-width: 44px;
-    min-height: 44px;
-    padding: var(--spacing-half) var(--spacing-2);
-    font-size: 24px;
-    line-height: 32px; /* 133.333% */
+  font-size: 1.5rem;
+  line-height: 2rem;
 }
 
 input.md {
-    min-width: 48px;
-    min-height: 48px;
-    padding: 10px var(--spacing-2);
-    font-size: 30px;
-    line-height: 38px; /* 126.667% */
+  font-size: 1.875rem;
+  line-height: 2.375rem;
 }
 
 input.lg {
-    min-width: 56px;
-    min-height: 56px;
-    padding: var(--spacing-3) var(--spacing-2);
-    font-size: 30px;
-    line-height: 38px; /* 126.667% */
+  font-size: 1.875rem;
+  line-height: 2.375rem;
 }
 
-input:not(:placeholder-shown) {
-    color: #4B5565;
+input.disabled {
+  background: var(--color-background-gray-subtlest, #F6F8FA);
+  color: var(--color-text-disabled, #CDD5DF); 
 }
 
-input:focus:not(:placeholder-shown){
-    border: 1.3px solid #075DB2;
-    color: #4B5565;
+input::placeholder {
+  color: var(--color-text-disabled, #CDD5DF);
+}
+
+input:not(:placeholder-shown) {
+  color: var(--color-text, #4B5565);
 }
 
-input:disabled {
-    background: #F6F8FA;
-    border: 1px solid #E3E8EF;
-    color: #CDD5DF;
+input.disabled:not(:placeholder-shown) {
+  color: var(--color-text-disabled, #CDD5DF);
 }

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

@@ -2,9 +2,27 @@ import { h } from "@stencil/core";
 export class GbMegaInputField {
     constructor() {
         this.size = undefined;
+        this.state = undefined;
+        this.inputValue = '';
+    }
+    handleInput(event) {
+        const input = event.target.value;
+        // Allow only one digit in the input field
+        if (input.length <= 1) {
+            this.inputValue = input; // Set the input value
+        }
+        else {
+            this.inputValue = input[0]; // Keep only the first character if more is entered
+        }
     }
     render() {
-        return (h("input", { key: '3efb8cace12edfc87a9d1ff2d59e9ece5f8537f1', class: this.size, type: "number", placeholder: "0" }));
+        return (h("div", { key: '50bb34dd9f6b149c141a991ea11e8d62703d758b', class: {
+                [this.size]: true,
+                disabled: this.state === 'disabled'
+            } }, h("input", { key: '4c3c7714439412b1c264178d29fc8c6b4d53aa3f', class: {
+                [this.size]: true,
+                disabled: this.state === 'disabled'
+            }, type: "number", min: "0", max: "9", placeholder: "0", value: this.inputValue, onInput: (event) => this.handleInput(event) })));
     }
     static get is() { return "gb-megainput-field"; }
     static get encapsulation() { return "shadow"; }
@@ -42,8 +60,31 @@ export class GbMegaInputField {
                 },
                 "attribute": "size",
                 "reflect": false
+            },
+            "state": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "'placeholder' | 'disabled'",
+                    "resolved": "\"disabled\" | \"placeholder\"",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "attribute": "state",
+                "reflect": false
             }
         };
     }
+    static get states() {
+        return {
+            "inputValue": {}
+        };
+    }
+    static get elementRef() { return "el"; }
 }
 //# sourceMappingURL=gb-megainput-field.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"gb-megainput-field.js","sourceRoot":"","sources":["../../../src/components/gb-megainput-field-base/gb-megainput-field.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,CAAC,EAAE,IAAI,EAAE,MAAM,eAAe,CAAC;AASnD,MAAM,OAAO,gBAAgB;;;;IAGzB,MAAM;QACF,OAAO,CACH,8DAAO,KAAK,EAAE,IAAI,CAAC,IAAI,EAAE,IAAI,EAAC,QAAQ,EAAC,WAAW,EAAC,GAAG,GAAS,CAClE,CAAA;IACL,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACJ","sourcesContent":["import { Component, h, Prop } from \"@stencil/core\";\r\nimport { GeneralSizes } from \"../../models/reusableModels\";\r\n\r\n@Component({\r\n    tag: 'gb-megainput-field',\r\n    styleUrl: 'gb-megainput-field.css',\r\n    shadow: true\r\n})\r\n\r\nexport class GbMegaInputField {\r\n    @Prop() size: GeneralSizes;\r\n \r\n    render() {\r\n        return (\r\n            <input class={this.size} type=\"number\" placeholder=\"0\"></input>\r\n        )\r\n    }\r\n}"]}
+{"version":3,"file":"gb-megainput-field.js","sourceRoot":"","sources":["../../../src/components/gb-megainput-field-base/gb-megainput-field.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,CAAC,EAAE,IAAI,EAAE,KAAK,EAAE,OAAO,EAAE,MAAM,eAAe,CAAC;AASnE,MAAM,OAAO,gBAAgB;;;;0BAGK,EAAE;;IAGhC,WAAW,CAAC,KAAY;QACpB,MAAM,KAAK,GAAI,KAAK,CAAC,MAA2B,CAAC,KAAK,CAAC;QAEvD,0CAA0C;QAC1C,IAAI,KAAK,CAAC,MAAM,IAAI,CAAC,EAAE,CAAC;YACtB,IAAI,CAAC,UAAU,GAAG,KAAK,CAAC,CAAC,sBAAsB;QACjD,CAAC;aAAM,CAAC;YACN,IAAI,CAAC,UAAU,GAAG,KAAK,CAAC,CAAC,CAAC,CAAC,CAAC,mDAAmD;QACjF,CAAC;IACL,CAAC;IAED,MAAM;QACF,OAAO,CACH,4DAAK,KAAK,EAAE;gBACR,CAAC,IAAI,CAAC,IAAI,CAAC,EAAG,IAAI;gBAClB,QAAQ,EAAE,IAAI,CAAC,KAAK,KAAK,UAAU;aACtC;YACG,8DACA,KAAK,EAAE;oBACH,CAAC,IAAI,CAAC,IAAI,CAAC,EAAG,IAAI;oBAClB,QAAQ,EAAE,IAAI,CAAC,KAAK,KAAK,UAAU;iBACtC,EACD,IAAI,EAAC,QAAQ,EACb,GAAG,EAAC,GAAG,EAAC,GAAG,EAAC,GAAG,EACf,WAAW,EAAC,GAAG,EACf,KAAK,EAAE,IAAI,CAAC,UAAU,EACtB,OAAO,EAAE,CAAC,KAAK,EAAE,EAAE,CAAC,IAAI,CAAC,WAAW,CAAC,KAAK,CAAC,GACnC,CACN,CAET,CAAA;IACL,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACJ","sourcesContent":["import { Component, h, Prop, State, Element } from \"@stencil/core\";\r\nimport { GeneralSizes } from \"../../models/reusableModels\";\r\n\r\n@Component({\r\n    tag: 'gb-megainput-field',\r\n    styleUrl: 'gb-megainput-field.css',\r\n    shadow: true\r\n})\r\n\r\nexport class GbMegaInputField {\r\n    @Prop() size: GeneralSizes;\r\n    @Prop() state: 'placeholder' | 'disabled';\r\n    @State() inputValue: string = '';\r\n    @Element() el: HTMLElement;\r\n\r\n    handleInput(event: Event) {\r\n        const input = (event.target as HTMLInputElement).value;\r\n    \r\n        // Allow only one digit in the input field\r\n        if (input.length <= 1) {\r\n          this.inputValue = input; // Set the input value\r\n        } else {\r\n          this.inputValue = input[0]; // Keep only the first character if more is entered\r\n        }\r\n    }\r\n\r\n    render() {\r\n        return (\r\n            <div class={{\r\n                [this.size] : true,\r\n                disabled: this.state === 'disabled'\r\n            }}>\r\n                <input  \r\n                class={{\r\n                    [this.size] : true,\r\n                    disabled: this.state === 'disabled'\r\n                }}\r\n                type=\"number\" \r\n                min=\"0\" max=\"9\" \r\n                placeholder=\"0\"\r\n                value={this.inputValue}\r\n                onInput={(event) => this.handleInput(event)}>\r\n                </input>\r\n            </div>\r\n            \r\n        )\r\n    }\r\n}"]}

package/dist/collection/components/gb-notification-content/gb-notification-content.css

@@ -2119,7 +2119,7 @@
 }
 
 .text-sm-regular{
-    font-size: var(--text-sm-regular-font-size);
+    font-size: var(--text-sm-regular-font-size, 0.875rem);
     font-weight: var(--text-sm-regular-font-weight);
     line-height: var(--text-sm-regular-line-height);
 }

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

@@ -8,7 +8,7 @@ export class GbNotificationContent {
     }
     render() {
         const iconSrc = getAssetPath(`assets/${this.icon}.svg`);
-        return (h("div", { key: 'af8e325ee56f90f0b3c674e7fc3f01a967c6601d', class: "notification-container" }, h("div", { key: 'fcaa6a61933643b8fc90e2c38563e85d9e962dcc', class: "notification-title" }, this.icon && (h("div", { key: '021da38cfa4f82a1cb52ce83058821ff35767a45', class: "icon" }, h("img", { key: 'e44c9d68aef974145aedb7a0fdee6de30f3a6c60', src: iconSrc, alt: "Icon" }))), h("label", { key: '5874fce3852a4f14441ab2df4779f00a72903a7f' }, this.label), h("span", { key: '733be44accf713824d605cde0894720247e8c50d', class: "time" }, this.time)), h("div", { key: 'fb5f84427579f041cb6e219165d8212427e169b8', class: "supporting-text" }, this.supportingText)));
+        return (h("div", { key: '6e3ee602b4220d1c05513fd097ec9cb8f7f29a49', class: "notification-container" }, h("div", { key: '61b9a275e944588f8f8c8d7b7da2659cc1580f06', class: "notification-title" }, this.icon && (h("div", { key: '749e970947406d9df1f1991a5a86c230b759864d', class: "icon" }, h("img", { key: 'e75537fe5b66b55670f02beb61fac0577ab31212', src: iconSrc, alt: "Icon" }))), h("label", { key: '8df7096217206e797201bc1f45961dc14f3fc915' }, this.label), h("span", { key: '76d07d0c119e2945cba4f364552686d846f02378', class: "time" }, this.time)), h("div", { key: '8499a7cf3c9c2514919d6d64b57639322b129acb', class: "supporting-text" }, this.supportingText)));
     }
     static get is() { return "gb-notification-content"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/gb-notification-panel/gb-notification-panel.css

@@ -2119,7 +2119,7 @@
 }
 
 .text-sm-regular{
-    font-size: var(--text-sm-regular-font-size);
+    font-size: var(--text-sm-regular-font-size, 0.875rem);
     font-weight: var(--text-sm-regular-font-weight);
     line-height: var(--text-sm-regular-line-height);
 }

package/dist/collection/components/gb-notification-panel/gb-notification-panel.js

@@ -26,7 +26,7 @@ export class GbNotificationPanel {
         notification.remove();
     }
     render() {
-        return (h("div", { key: '9d40355ebaed2f0ed9508306f7110813eb9bcefb', class: "notification-panel" }, this.state === 'empty' && this.notifications.length === 0 && (h("div", { key: '76e80e60baa23e7f961ee409448a88ce85b5a56c' }, h("div", { key: '46bf69ef7e24a5c8955261fbab930691fcf2e391', class: "empty-state" }, h("img", { key: '11429b54dfbcdb9bebb58dc20a149afbc1ad81b2', src: "./build/assets/panel_bell.svg", alt: "No notification" }), h("h3", { key: '6c4f1139977bb6e65f5a66c6f3b29d337e44e17e' }, "No notification"), h("p", { key: 'd15f4c976b4abf27aeac83f7083fc5a5dd20cd20' }, "Your notification inbox is empty at the moment. Rest assured, you'll be promptly notified of any new events.")), h("test-button", { key: 'bf843de64d64bc0b33c1b2dab36a2b473a442dc2', size: 'sm', hierarchy: 'tertiary_color', "left-icon": 'blush_brush' }, "Mark all as read"))), this.state === 'notification_dropdown' && (h("div", { key: 'bbf8010d47fb39fc5a9bd1442186a0d4cc514f91', class: "notification-dropdown" }, h("slot", { key: 'f9742ee4217bdf5297d222dcc57c92903ddc437a' }), h("test-button", { key: '7138cc87a184004d0a14780f10791a82cf209b3a', size: 'sm', hierarchy: 'tertiary_color', "left-icon": 'blush_brush' }, "Mark all as read")))));
+        return (h("div", { key: '0e02ab89477bef8e33203591f0eef4933d8ee49b', class: "notification-panel" }, this.state === 'empty' && this.notifications.length === 0 && (h("div", { key: '2fc98b149a8aa50eaa86a4fa83d389d0a631b6fb' }, h("div", { key: '89330e56a8770aa541f8216e3ead8ea9b89ec9f1', class: "empty-state" }, h("img", { key: '1a93360466cfa19a7e1d8ef08d07894bbda6f7a8', src: "./build/assets/panel_bell.svg", alt: "No notification" }), h("h3", { key: '3c159ba17083834a91e422e619bdebd0341395ac' }, "No notification"), h("p", { key: '46c7f459eb6ca58032a7eb9918d4c1f8afa3ac1e' }, "Your notification inbox is empty at the moment. Rest assured, you'll be promptly notified of any new events.")), h("test-button", { key: '17222ad62b3bf5c328bb949bce38321f7e8a0551', size: 'sm', hierarchy: 'tertiary_color', "left-icon": 'blush_brush' }, "Mark all as read"))), this.state === 'notification_dropdown' && (h("div", { key: '642911a27ad0a8082e16c949f5210e93ff2dd598', class: "notification-dropdown" }, h("slot", { key: '826fbbf7f82865492104a76e24781b3a0ee5c53b' }), h("test-button", { key: 'dd0c48fe1141e1b84e188fd6628950176e2f52f8', size: 'sm', hierarchy: 'tertiary_color', "left-icon": 'blush_brush' }, "Mark all as read")))));
     }
     static get is() { return "gb-notification-panel"; }
     static get encapsulation() { return "shadow"; }

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

@@ -8,7 +8,7 @@ export class GbPagination {
         this.totalPages = 10;
     }
     render() {
-        return (h("div", { key: '3a7caa76e13b124caea0ff207f10b4a5b303f240', class: `pagination_div ${this.type} ${this.breakpoint}` }, this.type === 'page_default' && this.breakpoint === 'desktop' && (h(Fragment, null, h("gb-button", { key: '4816a54b9ac2ddc140e109bae7f8d28b82b7f3d4', size: "sm", hierarchy: "tertiary_gray", icon: "default", state: "default", "icon-leading": true, "icon-leading-swap": "assets/arrow-left-02.svg" }, h("p", { key: 'bc0c61e964f7ff66b2d0dde82ca3a44d3ed2daa9' }, "Previous")), h("gb-button", { key: '1d5135b58c6075bbaa42bb65dc4f15ba3d65807f', size: "sm", hierarchy: "tertiary_gray", icon: "default", state: "default", "icon-trailing": true, "icon-trailing-swap": "assets/arrow-right-02.svg" }, h("p", { key: '7d534aac100126345e043ea5fb6aff94f6319d22' }, "Next")))), this.type === 'page_minimal_center_aligned' && this.breakpoint === 'desktop' && (h(Fragment, null, h("gb-button", { key: '4f171062c212b245831c15c36ae20393b1adfa2f', size: "sm", hierarchy: "secondary_gray", icon: "default", state: "default", "icon-leading": true, "icon-leading-swap": "assets/arrow-left-02.svg" }, h("p", { key: 'd5f098dac2f01a245d2caad8f77d78401e376060' }, "Previous")), h("gb-button", { key: '675df596c5f372405072c3408afbb4ff4d916126', size: "sm", hierarchy: "secondary_gray", icon: "default", state: "default", "icon-trailing": true, "icon-trailing-swap": "assets/arrow-right-02.svg" }, h("p", { key: 'd8d6b1e565bfa8e56a5b1c7bd8929dc0b9c52333' }, "Next")))), this.type === 'card_default' && this.breakpoint === 'desktop' && (h(Fragment, null, h("div", { key: '6fab12b1df80ffcd4ab88f938e9e8eee5d022a9e', class: "entries" }, "Entries"), h("div", { key: '8412ff5dd251a9a5a58aabd501ebe5bfc7cb4b81', class: "page_numbers" }), h("div", { key: 'a1ba11985fd82baf58c1adbe454cb236e71c55b7', class: "buttons" }, h("gb-button", { key: 'e9de614a16b8ca3f6f1ab4988e401be0b9179f37', size: "sm", hierarchy: "secondary_gray", icon: "only", state: "default", "icon-leading": true, "icon-leading-swap": "assets/arrow-left-02.svg" }), h("gb-button", { key: 'beeedba633ef6bb88ef575fc21875253fd68bd29', 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: '117d7c1eb866bd4f19ba3f04b79326d8ff75f987', size: "sm", hierarchy: "secondary_gray", icon: "only", state: "default", "icon-leading": true, "icon-leading-swap": "assets/arrow-left-02.svg" }), h("div", { key: '7e3cf823e2704933b08bc8fc040270d8d33d48c2', class: "page_number_text" }, h("p", { key: '8776a4485be045e02fae8fa4299a85196350b9a9', class: "text-sm-medium" }, "Page ", this.currentPage, " of ", this.totalPages)), h("gb-button", { key: '36bf6a18d25b1915919dc39c3d220ceeb6dd1223', size: "sm", hierarchy: "secondary_gray", icon: "only", state: "default", "icon-leading": true, "icon-leading-swap": "assets/arrow-right-02.svg" })))));
+        return (h("div", { key: 'ccf5d989941c21b5718efc9586a5da37e973bde9', class: `pagination_div ${this.type} ${this.breakpoint}` }, this.type === 'page_default' && this.breakpoint === 'desktop' && (h(Fragment, null, h("gb-button", { key: '2fdc86d497c04aead9836e96a61846bedb28d7ed', size: "sm", hierarchy: "tertiary_gray", icon: "default", state: "default", "icon-leading": true, "icon-leading-swap": "assets/arrow-left-02.svg" }, h("p", { key: 'e85a0f141a665479d12a388e62825f800dd26471' }, "Previous")), h("gb-button", { key: '7fcac6b8e075bf79c844015a4f6c303fc70b9c54', size: "sm", hierarchy: "tertiary_gray", icon: "default", state: "default", "icon-trailing": true, "icon-trailing-swap": "assets/arrow-right-02.svg" }, h("p", { key: '240895a212ed14498eb6447850f4ffcb38d415bb' }, "Next")))), this.type === 'page_minimal_center_aligned' && this.breakpoint === 'desktop' && (h(Fragment, null, h("gb-button", { key: 'f34e3110134cdaca3ade2147a03bc72e857d9682', size: "sm", hierarchy: "secondary_gray", icon: "default", state: "default", "icon-leading": true, "icon-leading-swap": "assets/arrow-left-02.svg" }, h("p", { key: 'b962dc873a69c0a5c567506a646f0f39315b8e38' }, "Previous")), h("gb-button", { key: '3bc4c0e7e5d4b23a7845be184ae32b413e3dd211', size: "sm", hierarchy: "secondary_gray", icon: "default", state: "default", "icon-trailing": true, "icon-trailing-swap": "assets/arrow-right-02.svg" }, h("p", { key: '1a93b1f943eedce44a2fed380c53d670c190a01d' }, "Next")))), this.type === 'card_default' && this.breakpoint === 'desktop' && (h(Fragment, null, h("div", { key: 'e69408075acac39836716b364a6b31a15fb5315d', class: "entries" }, "Entries"), h("div", { key: '0b0edc0067ec7376a2e1177c8a77238bd7bfffc5', class: "page_numbers" }), h("div", { key: '671cee855484b8e510088ff38889aa4e03a542b6', class: "buttons" }, h("gb-button", { key: '9426468ceb70a4a20a9b637c3297f36cdb3a3645', size: "sm", hierarchy: "secondary_gray", icon: "only", state: "default", "icon-leading": true, "icon-leading-swap": "assets/arrow-left-02.svg" }), h("gb-button", { key: '9a2869e21abf91624316b96758d7af1c15a6f9ab', 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: '17268fb325f921d9797f31f0a002d8699f998839', size: "sm", hierarchy: "secondary_gray", icon: "only", state: "default", "icon-leading": true, "icon-leading-swap": "assets/arrow-left-02.svg" }), h("div", { key: '95ae664f9f650f5acb7f740cfa7955d5bd00c58e', class: "page_number_text" }, h("p", { key: '075b4e1a9312956044fbbc5d275b065a1f464195', class: "text-sm-medium" }, "Page ", this.currentPage, " of ", this.totalPages)), h("gb-button", { key: '058a6357c539f9bdb872bb6fb549639b7f72b610', 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

@@ -12,7 +12,7 @@ export class GbPaginationButtonGroupBase {
         }
     }
     render() {
-        return (h("div", { key: 'cd9238c3abc78a965d250207f7330cc2bcc82d04', class: `button_base_div ${this.icon}` }, this.icon === 'false' && h("slot", { key: '6424e6cba116b7f8507185ede0b151d6b2403b7c' }), this.icon === 'leading' && (h(Fragment, null, h("svg", { key: 'ac360879e379562e61a3446b767d25478e400df9', xmlns: "http://www.w3.org/2000/svg", width: "20", height: "20", viewBox: "0 0 20 20", fill: "none" }, h("path", { key: '4151197b797966dfbe7a91e540891b4c558902f4', 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: '3358799bf4bab83e74af22a1eac32f62718fddb8' }))), this.icon === 'trailing' && (h(Fragment, null, h("slot", { key: 'b4a59c46ce9528e699eeb04777e975fbbd8c4dee' }), this.iconTrailing && (h("svg", { key: '5ed1eab0fce27ad45e303b71e520eadda2a7f768', xmlns: "http://www.w3.org/2000/svg", width: "20", height: "20", viewBox: "0 0 20 20", fill: "none" }, h("path", { key: 'e162ce71920414dfe10c8a421fa4e9b5a45a55ba', 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: 'bd658d0c2c7d5fec8e5f53c297128fbf6db7e35c', class: `button_base_div ${this.icon}` }, this.icon === 'false' && h("slot", { key: '46ac516d11c2991f4cb8688f49af7a0993eb6f14' }), this.icon === 'leading' && (h(Fragment, null, h("svg", { key: '299dff7353d41e50665227113f24ecb190f92341', xmlns: "http://www.w3.org/2000/svg", width: "20", height: "20", viewBox: "0 0 20 20", fill: "none" }, h("path", { key: '4c81ad3a2c2dd7e4570aa535cec10bca921efb0d', 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: 'f3c1736e92e01a3d160e13bfa3d03b13602d279a' }))), this.icon === 'trailing' && (h(Fragment, null, h("slot", { key: '23e9794b3b43fd20cea33f42453eb00abae58711' }), this.iconTrailing && (h("svg", { key: 'aba44f3fd7cf7b6ca88052ce9350fecff4e241b6', xmlns: "http://www.w3.org/2000/svg", width: "20", height: "20", viewBox: "0 0 20 20", fill: "none" }, h("path", { key: '0d34fdc541153964b86708b6ec134d4f9d35e26f', 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

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

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

@@ -10,7 +10,7 @@ export class GbPaginationNumberBase {
         }
     }
     render() {
-        return (h("div", { key: '7585d2221ce4e3f1ac385e3a555ae632b95a4180', class: `page_number_base ${this.shape}` }, h("slot", { key: 'c95d8d15871deca35148338ae4cb0aa4789e7a85', name: "page_number" })));
+        return (h("div", { key: '5a9e6b20e583927ddf029a75ff8ff35fa515023b', class: `page_number_base ${this.shape}` }, h("slot", { key: 'b97979e6e3a226afb66fd944e773761b1b2dfbff', name: "page_number" })));
     }
     static get is() { return "gb-pagination-number-base"; }
     static get encapsulation() { return "shadow"; }