globuswebcomponents 0.3.6 → 0.3.8

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: 'd986dc7b3c18891bff81b49cd978e6cce34e4565', class: `pagination_div` }, this.type === 'card_minimal_right_aligned' && this.breakpoint === 'desktop' && (h(Fragment, null, h("div", { key: 'bc2c2c72099335bff2c6b2c786cc17b96d492b54', class: "entries" }, h("p", { key: '737e82cbaa2e772568b03dcea53f08a6d162fff9' }, "Entries"), h("input", { key: '6b3a839201cf30add9e21f3788cae49d4ce0adce', type: "text" })), h("div", { key: '7e188b9632fb9fb9986edec3502c9cf850f51931', class: "pages" }, "Page ", this.currentPage, " of ", this.totalPages), h("div", { key: 'd0a80dc811310a17a11b394e11e4b9d4af150f15', class: "buttons" }, h("gb-button", { key: '60466b820667305f08d06a84f9e0e1c05ccc6ff3', size: "sm", hierarchy: "secondary_gray", icon: "default" }, h("p", { key: '30b91cac0e1a59f565ea930f80f00dde0e2fadb0' }, "Previous")), h("gb-button", { key: '473d40124dfff0c16f08b117758a9e598e698c6c', size: "sm", hierarchy: "secondary_gray", icon: "default" }, h("p", { key: 'cd733000dbd614ffdabbb3bfa7b99282e8b13220' }, "Next"))))), this.type === 'card_minimal_center_aligned' && this.breakpoint === 'desktop' && (h(Fragment, null, h("div", { key: 'ccc2f7e1b5234de2ea103e599b426f8747b3ef0d', class: "prev" }, h("gb-button", { key: 'ee82324e1344de73328d313f40ae9522ddbf9e79', size: "sm", hierarchy: "secondary_gray", icon: "default" }, h("p", { key: '8ba9b098ff55f8dc03af13c5731a27ae1d34104d' }, "Previous"))), h("div", { key: '6dd52bcc1a5fe4b929e2aba62c4c0b457c0f3335', class: "pages" }, "Page ", this.currentPage, " of ", this.totalPages), h("div", { key: '5aa0922681a98e4985d3030568cf1d41e1cf5102', class: "next" }, h("gb-button", { key: '775bff78df0874f71bcd98caed33f68b2f83cdf3', size: "sm", hierarchy: "secondary_gray", icon: "default" }, h("p", { key: '2d323725d3d38deb17a6677501fb838fd342b956' }, "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.js

@@ -12,7 +12,7 @@ export class GbPaginationButtonGroupBase {
         }
     }
     render() {
-        return (h("div", { key: '23e000cc72327574dd1bfd318b8381c3e27c038c', class: `button_base_div ${this.icon}` }, this.icon === 'false' && h("slot", { key: '6c670f46911286ab7041afc0dc63ee198af1be67' }), this.icon === 'leading' && (h(Fragment, null, h("svg", { key: '7df22c26954326e13a451a2a7d53f139e1d6fb53', xmlns: "http://www.w3.org/2000/svg", width: "20", height: "20", viewBox: "0 0 20 20", fill: "none" }, h("path", { key: '4904f26820f1af0e6e1b1a36e059936c6d613537', 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: 'f20497eb0db947aae2e8c84536253b54dc391102' }))), this.icon === 'trailing' && (h(Fragment, null, h("slot", { key: 'c4d9f7db5866da3b75cc280e1e8e903875de63e3' }), this.iconTrailing && (h("svg", { key: 'f3c144d1cffe42c5e3741b3d6ee6a718ff30f278', xmlns: "http://www.w3.org/2000/svg", width: "20", height: "20", viewBox: "0 0 20 20", fill: "none" }, h("path", { key: 'f6f236d8157f534cca2457b5ed3748fb8ed66f56', 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: '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"; }

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}"]}