globuswebcomponents 0.3.5 → 0.3.7

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

@@ -4,11 +4,11 @@ export class GbPagination {
         this.type = undefined;
         this.shape = undefined;
         this.breakpoint = undefined;
-        this.currentPage = '1';
-        this.totalPages = '10';
+        this.currentPage = 1;
+        this.totalPages = 10;
     }
     render() {
-        return (h("div", { key: '9097b0db5a20250da94b6d7a745760da7324daa9', class: `pagination_div` }, this.type === 'card_minimal_right_aligned' && this.breakpoint === 'desktop' && (h(Fragment, null, h("div", { key: '0a65f7cc0974a09e1ffd3f3522b9903c33347bfd', class: "entries" }, h("p", { key: 'be419f8783c3eef70027fd1c16afc4c9b94c9673' }, "Entries"), h("input", { key: '4bda90978e4066187d24e42a2711595d0522203a', type: "text" })), h("div", { key: '8987354c40bb05ae448865d813618a57a0ca1d4d', class: "pages" }, "Page ", this.currentPage, " of ", this.totalPages), h("div", { key: '1df19559976015da19dbaab1b236ca5d087346a7', class: "buttons" }, h("gb-button", { key: '56d99f9cc5340e948de50327f3e4ef2c98d76166', size: "sm", hierarchy: "secondary_gray", icon: "default" }, h("p", { key: 'f25809d0c6bdb9901061e981cc7786ce2a47bb8d' }, "Previous")), h("gb-button", { key: 'cbee2e2a9f4674ca70c8923aca5196541659114d', size: "sm", hierarchy: "secondary_gray", icon: "default" }, h("p", { key: '1fa4bae10a038f38f628eb517ebf6e6c5861a1ad' }, "Next"))))), this.type === 'card_minimal_center_aligned' && this.breakpoint === 'desktop' && (h(Fragment, null, h("div", { key: '5752bcbf3411367cc38e1b1dea094af3d8b0739b', class: "prev" }, h("gb-button", { key: '7f5d1dc3177a1da465ea3e9fcf033a92e882c7af', size: "sm", hierarchy: "secondary_gray", icon: "default" }, h("p", { key: '9896b39f91bee7d39ad92b432efe25bc52a4858a' }, "Previous"))), h("div", { key: '65d7ca48ccc6b131ab4927c8f2ccaf8844b0e31c', class: "pages" }, "Page ", this.currentPage, " of ", this.totalPages), h("div", { key: '2bdc155ef65e8c521d64b2be18866b406a49f6f2', class: "next" }, h("gb-button", { key: '4377773556f96720402e8ada7bcc50697ad4f195', size: "sm", hierarchy: "secondary_gray", icon: "default" }, h("p", { key: '5fd9853a4b6219f8f47ea1c0d65ad7a986b4303e' }, "Next")))))));
+        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" })))));
     }
     static get is() { return "gb-pagination"; }
     static get encapsulation() { return "shadow"; }
@@ -94,11 +94,11 @@ export class GbPagination {
                 "reflect": false
             },
             "currentPage": {
-                "type": "string",
+                "type": "number",
                 "mutable": false,
                 "complexType": {
-                    "original": "string",
-                    "resolved": "string",
+                    "original": "number",
+                    "resolved": "number",
                     "references": {}
                 },
                 "required": false,
@@ -109,14 +109,14 @@ export class GbPagination {
                 },
                 "attribute": "current-page",
                 "reflect": false,
-                "defaultValue": "'1'"
+                "defaultValue": "1"
             },
             "totalPages": {
-                "type": "string",
+                "type": "number",
                 "mutable": false,
                 "complexType": {
-                    "original": "string",
-                    "resolved": "string",
+                    "original": "number",
+                    "resolved": "number",
                     "references": {}
                 },
                 "required": false,
@@ -127,7 +127,7 @@ export class GbPagination {
                 },
                 "attribute": "total-pages",
                 "reflect": false,
-                "defaultValue": "'10'"
+                "defaultValue": "10"
             }
         };
     }

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

@@ -1 +1 @@
-{"version":3,"file":"gb-pagination.js","sourceRoot":"","sources":["../../../src/components/gb-pagination/gb-pagination.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,IAAI,EAAE,CAAC,EAAE,QAAQ,EAAE,MAAM,eAAe,CAAC;AAQ7D,MAAM,OAAO,YAAY;;;;;2BAIO,GAAG;0BACJ,IAAI;;IAEjC,MAAM;QACJ,OAAO,CACL,4DAAK,KAAK,EAAE,gBAAgB;YACzB,IAAI,CAAC,IAAI,KAAK,4BAA4B,IAAI,IAAI,CAAC,UAAU,KAAK,SAAS,IAAI,CAC9E;gBACE,4DAAK,KAAK,EAAC,SAAS;oBAClB,sEAAc;oBACd,8DAAO,IAAI,EAAC,MAAM,GAAG,CACjB;gBACN,4DAAK,KAAK,EAAC,OAAO;;oBACV,IAAI,CAAC,WAAW;;oBAAM,IAAI,CAAC,UAAU,CACvC;gBACN,4DAAK,KAAK,EAAC,SAAS;oBAClB,kEAAW,IAAI,EAAC,IAAI,EAAC,SAAS,EAAC,gBAAgB,EAAC,IAAI,EAAC,SAAS;wBAC5D,uEAAe,CACL;oBACZ,kEAAW,IAAI,EAAC,IAAI,EAAC,SAAS,EAAC,gBAAgB,EAAC,IAAI,EAAC,SAAS;wBAC5D,mEAAW,CACD,CACR,CACL,CACJ;YACA,IAAI,CAAC,IAAI,KAAK,6BAA6B,IAAI,IAAI,CAAC,UAAU,KAAK,SAAS,IAAI,CAC/E;gBACE,4DAAK,KAAK,EAAC,MAAM;oBACf,kEAAW,IAAI,EAAC,IAAI,EAAC,SAAS,EAAC,gBAAgB,EAAC,IAAI,EAAC,SAAS;wBAC5D,uEAAe,CACL,CACR;gBACN,4DAAK,KAAK,EAAC,OAAO;;oBACV,IAAI,CAAC,WAAW;;oBAAM,IAAI,CAAC,UAAU,CACvC;gBACN,4DAAK,KAAK,EAAC,MAAM;oBACf,kEAAW,IAAI,EAAC,IAAI,EAAC,SAAS,EAAC,gBAAgB,EAAC,IAAI,EAAC,SAAS;wBAC5D,mEAAW,CACD,CACR,CACL,CACJ,CACG,CACP,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, Prop, h, Fragment } from \"@stencil/core\";\r\nimport { BreakPoints, PaginationNumberShapes, PaginationTypes } from \"../../models/reusableModels\";\r\n\r\n@Component({\r\n  tag: 'gb-pagination',\r\n  styleUrl: 'gb-pagination.css',\r\n  shadow: true,\r\n})\r\nexport class GbPagination {\r\n  @Prop() type: PaginationTypes;\r\n  @Prop() shape: PaginationNumberShapes;\r\n  @Prop() breakpoint: BreakPoints;\r\n  @Prop() currentPage: string = '1';\r\n  @Prop() totalPages: string = '10';\r\n\r\n  render() {\r\n    return (\r\n      <div class={`pagination_div`}>\r\n        {this.type === 'card_minimal_right_aligned' && this.breakpoint === 'desktop' && (\r\n          <>\r\n            <div class=\"entries\">\r\n              <p>Entries</p>\r\n              <input type=\"text\" />\r\n            </div>\r\n            <div class=\"pages\">\r\n              Page {this.currentPage} of {this.totalPages}\r\n            </div>\r\n            <div class=\"buttons\">\r\n              <gb-button size=\"sm\" hierarchy=\"secondary_gray\" icon=\"default\">\r\n                <p>Previous</p>\r\n              </gb-button>\r\n              <gb-button size=\"sm\" hierarchy=\"secondary_gray\" icon=\"default\">\r\n                <p>Next</p>\r\n              </gb-button>\r\n            </div>\r\n          </>\r\n        )}\r\n        {this.type === 'card_minimal_center_aligned' && this.breakpoint === 'desktop' && (\r\n          <>\r\n            <div class=\"prev\">\r\n              <gb-button size=\"sm\" hierarchy=\"secondary_gray\" icon=\"default\">\r\n                <p>Previous</p>\r\n              </gb-button>\r\n            </div>\r\n            <div class=\"pages\">\r\n              Page {this.currentPage} of {this.totalPages}\r\n            </div>\r\n            <div class=\"next\">\r\n              <gb-button size=\"sm\" hierarchy=\"secondary_gray\" icon=\"default\">\r\n                <p>Next</p>\r\n              </gb-button>\r\n            </div>\r\n          </>\r\n        )}\r\n      </div>\r\n    );\r\n  }\r\n}"]}
+{"version":3,"file":"gb-pagination.js","sourceRoot":"","sources":["../../../src/components/gb-pagination/gb-pagination.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,IAAI,EAAE,CAAC,EAAE,QAAQ,EAAE,MAAM,eAAe,CAAC;AAQ7D,MAAM,OAAO,YAAY;;;;;2BAIO,CAAC;0BACF,EAAE;;IAE/B,MAAM;QACJ,OAAO,CACL,4DAAK,KAAK,EAAE,kBAAkB,IAAI,CAAC,IAAI,IAAI,IAAI,CAAC,UAAU,EAAE;YAEzD,IAAI,CAAC,IAAI,KAAK,cAAc,IAAI,IAAI,CAAC,UAAU,KAAK,SAAS,IAAI,CAChE;gBACE,kEAAW,IAAI,EAAC,IAAI,EAAC,SAAS,EAAC,eAAe,EAAC,IAAI,EAAC,SAAS,EAAC,KAAK,EAAC,SAAS,kBAAe,IAAI,uBAAoB,0BAA0B;oBAC5I,uEAAe,CACL;gBAMZ,kEAAW,IAAI,EAAC,IAAI,EAAC,SAAS,EAAC,eAAe,EAAC,IAAI,EAAC,SAAS,EAAC,KAAK,EAAC,SAAS,mBAAgB,IAAI,wBAAqB,2BAA2B;oBAC/I,mEAAW,CACD,CACX,CACJ;YACA,IAAI,CAAC,IAAI,KAAK,6BAA6B,IAAI,IAAI,CAAC,UAAU,KAAK,SAAS,IAAI,CAC/E;gBACE,kEAAW,IAAI,EAAC,IAAI,EAAC,SAAS,EAAC,gBAAgB,EAAC,IAAI,EAAC,SAAS,EAAC,KAAK,EAAC,SAAS,kBAAe,IAAI,uBAAoB,0BAA0B;oBAC7I,uEAAe,CACL;gBAEZ,kEAAW,IAAI,EAAC,IAAI,EAAC,SAAS,EAAC,gBAAgB,EAAC,IAAI,EAAC,SAAS,EAAC,KAAK,EAAC,SAAS,mBAAgB,IAAI,wBAAqB,2BAA2B;oBAChJ,mEAAW,CACD,CACX,CACJ;YACA,IAAI,CAAC,IAAI,KAAK,cAAc,IAAI,IAAI,CAAC,UAAU,KAAK,SAAS,IAAI,CAChE;gBACE,4DAAK,KAAK,EAAC,SAAS,cAEd;gBACN,4DAAK,KAAK,EAAC,cAAc,GAAO;gBAChC,4DAAK,KAAK,EAAC,SAAS;oBAClB,kEAAW,IAAI,EAAC,IAAI,EAAC,SAAS,EAAC,gBAAgB,EAAC,IAAI,EAAC,MAAM,EAAC,KAAK,EAAC,SAAS,kBAAe,IAAI,uBAAoB,0BAA0B,GAAa;oBACzJ,kEAAW,IAAI,EAAC,IAAI,EAAC,SAAS,EAAC,gBAAgB,EAAC,IAAI,EAAC,MAAM,EAAC,KAAK,EAAC,SAAS,kBAAe,IAAI,uBAAoB,2BAA2B,GAAa,CACtJ,CACL,CACJ;YAGA,IAAI,CAAC,IAAI,KAAK,cAAc,IAAI,IAAI,CAAC,UAAU,KAAK,QAAQ,IAAI,CAC/D;gBACE,kEAAW,IAAI,EAAC,IAAI,EAAC,SAAS,EAAC,gBAAgB,EAAC,IAAI,EAAC,MAAM,EAAC,KAAK,EAAC,SAAS,kBAAe,IAAI,uBAAoB,0BAA0B,GAAa;gBACzJ,4DAAK,KAAK,EAAC,kBAAkB;oBAC3B,0DAAG,KAAK,EAAC,gBAAgB;;wBACjB,IAAI,CAAC,WAAW;;wBAAM,IAAI,CAAC,UAAU,CACzC,CACA;gBACN,kEAAW,IAAI,EAAC,IAAI,EAAC,SAAS,EAAC,gBAAgB,EAAC,IAAI,EAAC,MAAM,EAAC,KAAK,EAAC,SAAS,kBAAe,IAAI,uBAAoB,2BAA2B,GAAa,CACzJ,CACJ,CACG,CACP,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, Prop, h, Fragment } from \"@stencil/core\";\r\nimport { BreakPoints, PaginationNumberShapes, PaginationTypes } from \"../../models/reusableModels\";\r\n\r\n@Component({\r\n  tag: 'gb-pagination',\r\n  styleUrl: 'gb-pagination.css',\r\n  shadow: true,\r\n})\r\nexport class GbPagination {\r\n  @Prop() type: PaginationTypes;\r\n  @Prop() shape: PaginationNumberShapes;\r\n  @Prop() breakpoint: BreakPoints;\r\n  @Prop() currentPage: number = 1;\r\n  @Prop() totalPages: number = 10;\r\n\r\n  render() {\r\n    return (\r\n      <div class={`pagination_div ${this.type} ${this.breakpoint}`}>\r\n        {/* Desktop Breakpoint Pagination */}\r\n        {this.type === 'page_default' && this.breakpoint === 'desktop' && (\r\n          <>\r\n            <gb-button size=\"sm\" hierarchy=\"tertiary_gray\" icon=\"default\" state=\"default\" icon-leading={true} icon-leading-swap=\"assets/arrow-left-02.svg\">\r\n              <p>Previous</p>\r\n            </gb-button>\r\n\r\n            {/* <div class=\"page_default_numbers\">\r\n              <gb-pagination-number-base shape={this.shape}></gb-pagination-number-base>\r\n            </div> */}\r\n\r\n            <gb-button size=\"sm\" hierarchy=\"tertiary_gray\" icon=\"default\" state=\"default\" icon-trailing={true} icon-trailing-swap=\"assets/arrow-right-02.svg\">\r\n              <p>Next</p>\r\n            </gb-button>\r\n          </>\r\n        )}\r\n        {this.type === 'page_minimal_center_aligned' && this.breakpoint === 'desktop' && (\r\n          <>\r\n            <gb-button size=\"sm\" hierarchy=\"secondary_gray\" icon=\"default\" state=\"default\" icon-leading={true} icon-leading-swap=\"assets/arrow-left-02.svg\">\r\n              <p>Previous</p>\r\n            </gb-button>\r\n\r\n            <gb-button size=\"sm\" hierarchy=\"secondary_gray\" icon=\"default\" state=\"default\" icon-trailing={true} icon-trailing-swap=\"assets/arrow-right-02.svg\">\r\n              <p>Next</p>\r\n            </gb-button>\r\n          </>\r\n        )}\r\n        {this.type === 'card_default' && this.breakpoint === 'desktop' && (\r\n          <>\r\n            <div class=\"entries\">\r\n              Entries\r\n            </div>\r\n            <div class=\"page_numbers\"></div>\r\n            <div class=\"buttons\">\r\n              <gb-button size=\"sm\" hierarchy=\"secondary_gray\" icon=\"only\" state=\"default\" icon-leading={true} icon-leading-swap=\"assets/arrow-left-02.svg\"></gb-button>\r\n              <gb-button size=\"sm\" hierarchy=\"secondary_gray\" icon=\"only\" state=\"default\" icon-leading={true} icon-leading-swap=\"assets/arrow-right-02.svg\"></gb-button>\r\n            </div>\r\n          </>\r\n        )}\r\n\r\n        {/* Mobile Breakpoint Pagination */}\r\n        {this.type === 'page_default' && this.breakpoint === 'mobile' && (\r\n          <>\r\n            <gb-button size=\"sm\" hierarchy=\"secondary_gray\" icon=\"only\" state=\"default\" icon-leading={true} icon-leading-swap=\"assets/arrow-left-02.svg\"></gb-button>\r\n            <div class=\"page_number_text\">\r\n              <p class=\"text-sm-medium\">\r\n                Page {this.currentPage} of {this.totalPages}\r\n              </p>\r\n            </div>\r\n            <gb-button size=\"sm\" hierarchy=\"secondary_gray\" icon=\"only\" state=\"default\" icon-leading={true} icon-leading-swap=\"assets/arrow-right-02.svg\"></gb-button>\r\n          </>\r\n        )}\r\n      </div>\r\n    );\r\n  }\r\n}"]}

package/dist/collection/components/gb-pagination-button-group-base/gb-pagination-button-group-base.css

@@ -0,0 +1,31 @@
+.button_base_div{
+    display: flex;
+    align-items: center;
+    border-right: 1px solid var(--color-border-subtle, #CDD5DF);
+    justify-content: center;
+    cursor: pointer;
+    width: fit-content;
+}
+
+.button_base_div:hover{
+    background: var(--color-background-gray-subtler, #EEF2F6);
+}
+
+.button_base_div:active{
+    background: none;
+}
+
+.button_base_div.false{
+    width: 2.5rem;
+    padding: 0.625rem;
+}
+
+.button_base_div.leading,
+.button_base_div.trailing{
+    gap: 0.5rem;
+    padding: 0.625rem var(--spacing-4);
+}
+
+::slotted(p){
+    color: var(--color-text, #4B5565);
+}

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

@@ -0,0 +1,86 @@
+import { h, Fragment } from "@stencil/core";
+export class GbPaginationButtonGroupBase {
+    constructor() {
+        this.icon = undefined;
+        this.iconLeading = undefined;
+        this.iconTrailing = undefined;
+    }
+    componentDidLoad() {
+        const slottedContent = this.el.querySelector('p');
+        if (slottedContent) {
+            slottedContent.classList.add('text-sm-semi-bold');
+        }
+    }
+    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" })))))));
+    }
+    static get is() { return "gb-pagination-button-group-base"; }
+    static get encapsulation() { return "shadow"; }
+    static get originalStyleUrls() {
+        return {
+            "$": ["gb-pagination-button-group-base.css"]
+        };
+    }
+    static get styleUrls() {
+        return {
+            "$": ["gb-pagination-button-group-base.css"]
+        };
+    }
+    static get properties() {
+        return {
+            "icon": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "'false' | 'only' | 'trailing' | 'leading'",
+                    "resolved": "\"false\" | \"leading\" | \"only\" | \"trailing\"",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "attribute": "icon",
+                "reflect": false
+            },
+            "iconLeading": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "attribute": "icon-leading",
+                "reflect": false
+            },
+            "iconTrailing": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "attribute": "icon-trailing",
+                "reflect": false
+            }
+        };
+    }
+    static get elementRef() { return "el"; }
+}
+//# sourceMappingURL=gb-pagination-button-group-base.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"gb-pagination-button-group-base.js","sourceRoot":"","sources":["../../../src/components/gb-pagination-button-group-base/gb-pagination-button-group-base.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,IAAI,EAAE,CAAC,EAAE,QAAQ,EAAE,OAAO,EAAE,MAAM,eAAe,CAAC;AAOtE,MAAM,OAAO,2BAA2B;;;;;;IAMtC,gBAAgB;QACd,MAAM,cAAc,GAAG,IAAI,CAAC,EAAE,CAAC,aAAa,CAAC,GAAG,CAAC,CAAC;QAElD,IAAI,cAAc,EAAE,CAAC;YACnB,cAAc,CAAC,SAAS,CAAC,GAAG,CAAC,mBAAmB,CAAC,CAAC;QACpD,CAAC;IACH,CAAC;IAED,MAAM;QACJ,OAAO,CACL,4DAAK,KAAK,EAAE,mBAAmB,IAAI,CAAC,IAAI,EAAE;YACvC,IAAI,CAAC,IAAI,KAAK,OAAO,IAAI,8DAAa;YACtC,IAAI,CAAC,IAAI,KAAK,SAAS,IAAI,CAC1B;gBACE,4DAAK,KAAK,EAAC,4BAA4B,EAAC,KAAK,EAAC,IAAI,EAAC,MAAM,EAAC,IAAI,EAAC,OAAO,EAAC,WAAW,EAAC,IAAI,EAAC,MAAM;oBAC5F,6DACE,CAAC,EAAC,0JAA0J,EAC5J,MAAM,EAAC,SAAS,kBACH,MAAM,oBACJ,OAAO,qBACN,OAAO,GACvB,CACE;gBACN,8DAAa,CACZ,CACJ;YACA,IAAI,CAAC,IAAI,KAAK,UAAU,IAAI,CAC3B;gBACE,8DAAa;gBACZ,IAAI,CAAC,YAAY,IAAI,CACpB,4DAAK,KAAK,EAAC,4BAA4B,EAAC,KAAK,EAAC,IAAI,EAAC,MAAM,EAAC,IAAI,EAAC,OAAO,EAAC,WAAW,EAAC,IAAI,EAAC,MAAM;oBAC5F,6DACE,CAAC,EAAC,yJAAyJ,EAC3J,MAAM,EAAC,SAAS,kBACH,KAAK,oBACH,OAAO,qBACN,OAAO,GACvB,CACE,CACP,CACA,CACJ,CAEG,CACP,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, Prop, h, Fragment, Element } from \"@stencil/core\";\r\n\r\n@Component({\r\n  tag: 'gb-pagination-button-group-base',\r\n  styleUrl: 'gb-pagination-button-group-base.css',\r\n  shadow: true,\r\n})\r\nexport class GbPaginationButtonGroupBase {\r\n  @Prop() icon: 'false' | 'only' | 'trailing' | 'leading';\r\n  @Prop() iconLeading: string;\r\n  @Prop() iconTrailing: string;\r\n  @Element() el: HTMLElement;\r\n\r\n  componentDidLoad() {\r\n    const slottedContent = this.el.querySelector('p');\r\n\r\n    if (slottedContent) {\r\n      slottedContent.classList.add('text-sm-semi-bold');\r\n    }\r\n  }\r\n\r\n  render() {\r\n    return (\r\n      <div class={`button_base_div ${this.icon}`}>\r\n        {this.icon === 'false' && <slot></slot>}\r\n        {this.icon === 'leading' && (\r\n          <>\r\n            <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\">\r\n              <path\r\n                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\"\r\n                stroke=\"#4B5565\"\r\n                stroke-width=\"1.67\"\r\n                stroke-linecap=\"round\"\r\n                stroke-linejoin=\"round\"\r\n              />\r\n            </svg>\r\n            <slot></slot>\r\n          </>\r\n        )}\r\n        {this.icon === 'trailing' && (\r\n          <>\r\n            <slot></slot>\r\n            {this.iconTrailing && (\r\n              <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\">\r\n                <path\r\n                  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\"\r\n                  stroke=\"#4B5565\"\r\n                  stroke-width=\"1.5\"\r\n                  stroke-linecap=\"round\"\r\n                  stroke-linejoin=\"round\"\r\n                />\r\n              </svg>\r\n            )}\r\n          </>\r\n        )}\r\n        {/* {this.icon === 'only' && ()} */}\r\n      </div>\r\n    );\r\n  }\r\n}"]}

package/dist/collection/components/gb-pagination-dot-indicator/gb-pagination-dot-indicator.css

@@ -0,0 +1,30 @@
+.dot_indicator_div{
+    border-radius: var(--rounded-full);
+    background: var(--color-icon-disabled, #CDD5DF);
+}
+
+/* Current Styles */
+.dot_indicator_div.current{
+    background: var(--color-icon-selected, #075DB2);
+}
+
+/* Type Styles */
+.dot_indicator_div.dot.md{
+    width: 0.5rem;
+    height: 0.5rem;
+}
+
+.dot_indicator_div.dot.lg{
+    width: 0.625rem;
+    height: 0.625rem;
+}
+
+.dot_indicator_div.line.md{
+    width: 2.5rem;
+    height: 0.375rem;
+}
+
+.dot_indicator_div.line.lg{
+    width: 2.5rem;
+    height: 0.5rem;
+}

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

@@ -0,0 +1,87 @@
+import { h } from "@stencil/core";
+export class GbPaginationDotIndicator {
+    constructor() {
+        this.current = false;
+        this.type = undefined;
+        this.size = undefined;
+    }
+    render() {
+        return h("div", { key: 'f003dd4cbd92437f19b0954ae84db88823b19894', class: `dot_indicator_div 
+      ${this.type} ${this.current ? 'current' : ''} 
+      ${this.size}` });
+    }
+    static get is() { return "gb-pagination-dot-indicator"; }
+    static get originalStyleUrls() {
+        return {
+            "$": ["gb-pagination-dot-indicator.css"]
+        };
+    }
+    static get styleUrls() {
+        return {
+            "$": ["gb-pagination-dot-indicator.css"]
+        };
+    }
+    static get properties() {
+        return {
+            "current": {
+                "type": "boolean",
+                "mutable": false,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "attribute": "current",
+                "reflect": false,
+                "defaultValue": "false"
+            },
+            "type": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "'dot' | 'line'",
+                    "resolved": "\"dot\" | \"line\"",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "attribute": "type",
+                "reflect": false
+            },
+            "size": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "GeneralSizes",
+                    "resolved": "\"lg\" | \"md\" | \"profile_lg\" | \"profile_md\" | \"profile_sm\" | \"sm\" | \"xl\" | \"xl2\" | \"xl3\" | \"xl4\" | \"xs\" | \"xxs\"",
+                    "references": {
+                        "GeneralSizes": {
+                            "location": "import",
+                            "path": "../../models/reusableModels",
+                            "id": "src/models/reusableModels.ts::GeneralSizes"
+                        }
+                    }
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "attribute": "size",
+                "reflect": false
+            }
+        };
+    }
+}
+//# sourceMappingURL=gb-pagination-dot-indicator.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"gb-pagination-dot-indicator.js","sourceRoot":"","sources":["../../../src/components/gb-pagination-dot-indicator/gb-pagination-dot-indicator.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,IAAI,EAAE,CAAC,EAAE,MAAM,eAAe,CAAC;AAOnD,MAAM,OAAO,wBAAwB;;uBACR,KAAK;;;;IAIhC,MAAM;QACJ,OAAO,4DAAK,KAAK,EAAE;QACf,IAAI,CAAC,IAAI,IAAI,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,EAAE;QAC1C,IAAI,CAAC,IAAI,EAAE,GAAQ,CAAC;IAC1B,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, Prop, h } from \"@stencil/core\";\r\nimport { GeneralSizes } from \"../../models/reusableModels\";\r\n\r\n@Component({\r\n  tag: 'gb-pagination-dot-indicator',\r\n  styleUrl: 'gb-pagination-dot-indicator.css',\r\n})\r\nexport class GbPaginationDotIndicator {\r\n  @Prop() current: boolean = false;\r\n  @Prop() type: 'dot' | 'line';\r\n  @Prop() size: GeneralSizes;\r\n\r\n  render() {\r\n    return <div class={`dot_indicator_div \r\n      ${this.type} ${this.current ? 'current' : ''} \r\n      ${this.size}`}></div>;\r\n  }\r\n}"]}