globuswebcomponents 0.6.3 → 0.6.5

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

@@ -0,0 +1,218 @@
+import { h } from "@stencil/core";
+export class GbCheckbox {
+    constructor() {
+        this.checked = false;
+        this.indeterminate = false;
+        this.size = undefined;
+        this.type = undefined;
+        this.state = undefined;
+        this.text = false;
+        this.supportingText = false;
+    }
+    getMainTextClass() {
+        switch (this.size) {
+            case 'sm': return `text-sm-medium`;
+            case 'md': return `text-md-medium`;
+        }
+    }
+    getSupportingTextClass() {
+        switch (this.size) {
+            case 'sm': return 'text-xs-regular';
+            case 'md': return 'text-sm-regular';
+        }
+    }
+    componentDidLoad() {
+        const mainTextSlot = this.el.querySelector('[slot="label"]');
+        const supportingTextSlot = this.el.querySelector('[slot="supporting_text"]');
+        const mainDiv = this.el.querySelector('.text');
+        if (mainTextSlot) {
+            mainTextSlot.classList.add(this.getMainTextClass());
+        }
+        if (supportingTextSlot) {
+            supportingTextSlot.classList.add(this.getSupportingTextClass());
+        }
+        if (!this.supportingText) {
+            mainDiv.classList.add('div_centered');
+        }
+    }
+    render() {
+        return (h("div", { key: 'c4282242daef9a50d46c93911a91befec67e6d97', class: `checkbox_div ${this.size} ${this.text ? 'text_class' : ''}` }, h("div", { key: '80781acbb05a09ec6a7f7f9051210eb419563ce8', class: "checkbox_base" }, h("gb-checkbox-base", { key: '1a49d813c2c7ff479828df509e03371f9e5e7bde', size: this.size, type: this.type, checked: this.checked, state: this.state, indeterminate: this.indeterminate })), this.text && (h("div", { key: '4eafa6a300ca619b82f50a3880618302e756f635', class: "text" }, h("slot", { key: '6ee4f7e87fe9df6bbe5201f5a945252101658f03', name: "label" }), this.supportingText && h("slot", { key: '33c770405ccaadc4293e190b3d26cf3583030902', name: "supporting_text" })))));
+    }
+    static get is() { return "gb-checkbox"; }
+    static get encapsulation() { return "shadow"; }
+    static get originalStyleUrls() {
+        return {
+            "$": ["gb-checkbox.css"]
+        };
+    }
+    static get styleUrls() {
+        return {
+            "$": ["gb-checkbox.css"]
+        };
+    }
+    static get properties() {
+        return {
+            "checked": {
+                "type": "boolean",
+                "mutable": false,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "attribute": "checked",
+                "reflect": false,
+                "defaultValue": "false"
+            },
+            "indeterminate": {
+                "type": "boolean",
+                "mutable": false,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "attribute": "indeterminate",
+                "reflect": false,
+                "defaultValue": "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
+            },
+            "type": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "CheckBoxVariants",
+                    "resolved": "\"check_circle\" | \"checkbox\" | \"radio\"",
+                    "references": {
+                        "CheckBoxVariants": {
+                            "location": "import",
+                            "path": "../../models/reusableModels",
+                            "id": "src/models/reusableModels.ts::CheckBoxVariants"
+                        }
+                    }
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "attribute": "type",
+                "reflect": false
+            },
+            "state": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "StateEnum",
+                    "resolved": "StateEnum.Default | StateEnum.Disabled",
+                    "references": {
+                        "StateEnum": {
+                            "location": "import",
+                            "path": "../../models/reusableModels",
+                            "id": "src/models/reusableModels.ts::StateEnum"
+                        }
+                    }
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "attribute": "state",
+                "reflect": false
+            },
+            "text": {
+                "type": "boolean",
+                "mutable": false,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "attribute": "text",
+                "reflect": false,
+                "defaultValue": "false"
+            },
+            "supportingText": {
+                "type": "boolean",
+                "mutable": false,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "attribute": "supporting-text",
+                "reflect": false,
+                "defaultValue": "false"
+            }
+        };
+    }
+    static get events() {
+        return [{
+                "method": "checkboxClicked",
+                "name": "checkboxClicked",
+                "bubbles": true,
+                "cancelable": true,
+                "composed": true,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                }
+            }];
+    }
+    static get elementRef() { return "el"; }
+}
+//# sourceMappingURL=gb-checkbox.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"gb-checkbox.js","sourceRoot":"","sources":["../../../src/components/gb-checkbox/gb-checkbox.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,OAAO,EAAE,KAAK,EAAgB,CAAC,EAAE,IAAI,EAAE,MAAM,eAAe,CAAC;AASjF,MAAM,OAAO,UAAU;;uBACS,KAAK;6BACA,KAAK;;;;oBAId,KAAK;8BACK,KAAK;;IAIvC,gBAAgB;QACZ,QAAO,IAAI,CAAC,IAAI,EAAE,CAAC;YACf,KAAK,IAAK,CAAC,CAAC,OAAO,gBAAgB,CAAC;YACpC,KAAK,IAAK,CAAC,CAAC,OAAO,gBAAgB,CAAC;QACxC,CAAC;IACL,CAAC;IAED,sBAAsB;QAClB,QAAO,IAAI,CAAC,IAAI,EAAE,CAAC;YACf,KAAK,IAAK,CAAC,CAAC,OAAO,iBAAiB,CAAC;YACrC,KAAK,IAAK,CAAC,CAAC,OAAO,iBAAiB,CAAC;QACzC,CAAC;IACL,CAAC;IAED,gBAAgB;QACZ,MAAM,YAAY,GAAG,IAAI,CAAC,EAAE,CAAC,aAAa,CAAC,gBAAgB,CAAC,CAAC;QAC7D,MAAM,kBAAkB,GAAG,IAAI,CAAC,EAAE,CAAC,aAAa,CAAC,0BAA0B,CAAC,CAAC;QAC7E,MAAM,OAAO,GAAG,IAAI,CAAC,EAAE,CAAC,aAAa,CAAC,OAAO,CAAC,CAAC;QAE/C,IAAG,YAAY,EAAC,CAAC;YACb,YAAY,CAAC,SAAS,CAAC,GAAG,CAAC,IAAI,CAAC,gBAAgB,EAAE,CAAC,CAAC;QACxD,CAAC;QAED,IAAG,kBAAkB,EAAE,CAAC;YACpB,kBAAkB,CAAC,SAAS,CAAC,GAAG,CAAC,IAAI,CAAC,sBAAsB,EAAE,CAAC,CAAC;QACpE,CAAC;QAED,IAAG,CAAC,IAAI,CAAC,cAAc,EAAE,CAAC;YACtB,OAAO,CAAC,SAAS,CAAC,GAAG,CAAC,cAAc,CAAC,CAAC;QAC1C,CAAC;IACL,CAAC;IAED,MAAM;QACF,OAAO,CACL,4DAAK,KAAK,EAAE,gBAAgB,IAAI,CAAC,IAAI,IAAI,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC,YAAY,CAAC,CAAC,CAAC,EAAE,EAAE;YACtE,4DAAK,KAAK,EAAC,eAAe;gBACxB,yEAAkB,IAAI,EAAE,IAAI,CAAC,IAAI,EAAE,IAAI,EAAE,IAAI,CAAC,IAAI,EAAE,OAAO,EAAE,IAAI,CAAC,OAAO,EAAE,KAAK,EAAE,IAAI,CAAC,KAAK,EAAE,aAAa,EAAE,IAAI,CAAC,aAAa,GAAqB,CAChJ;YACL,IAAI,CAAC,IAAI,IAAI,CACZ,4DAAK,KAAK,EAAC,MAAM;gBACf,6DAAM,IAAI,EAAC,OAAO,GAAQ;gBACzB,IAAI,CAAC,cAAc,IAAI,6DAAM,IAAI,EAAC,iBAAiB,GAAQ,CACxD,CACP,CACG,CACP,CAAC;IACN,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACJ","sourcesContent":["import { Component, Element, Event, EventEmitter, h, Prop } from \"@stencil/core\";\r\nimport { CheckBoxVariants, GeneralSizes, StateEnum } from \"../../models/reusableModels\";\r\n\r\n@Component({\r\n    tag:'gb-checkbox',\r\n    styleUrl: 'gb-checkbox.css',\r\n    shadow: true\r\n})\r\n\r\nexport class GbCheckbox {\r\n    @Prop() checked: boolean =  false;\r\n    @Prop() indeterminate: boolean = false;\r\n    @Prop() size: GeneralSizes;\r\n    @Prop() type: CheckBoxVariants;\r\n    @Prop() state: StateEnum;\r\n    @Prop() text: boolean = false;\r\n    @Prop() supportingText: boolean = false;\r\n    @Element() el: HTMLElement;\r\n    @Event() checkboxClicked: EventEmitter<boolean>;\r\n\r\n    getMainTextClass() {\r\n        switch(this.size) {\r\n            case 'sm' : return `text-sm-medium`;\r\n            case 'md' : return `text-md-medium`;\r\n        }\r\n    }\r\n\r\n    getSupportingTextClass() {\r\n        switch(this.size) {\r\n            case 'sm' : return 'text-xs-regular';\r\n            case 'md' : return 'text-sm-regular';\r\n        }\r\n    }\r\n\r\n    componentDidLoad() {\r\n        const mainTextSlot = this.el.querySelector('[slot=\"label\"]');\r\n        const supportingTextSlot = this.el.querySelector('[slot=\"supporting_text\"]');\r\n        const mainDiv = this.el.querySelector('.text');\r\n\r\n        if(mainTextSlot){\r\n            mainTextSlot.classList.add(this.getMainTextClass());\r\n        }\r\n\r\n        if(supportingTextSlot) {\r\n            supportingTextSlot.classList.add(this.getSupportingTextClass());\r\n        }\r\n\r\n        if(!this.supportingText) {\r\n            mainDiv.classList.add('div_centered');\r\n        }\r\n    }\r\n\r\n    render() {\r\n        return (\r\n          <div class={`checkbox_div ${this.size} ${this.text ? 'text_class' : ''}`}>\r\n            <div class=\"checkbox_base\">\r\n              <gb-checkbox-base size={this.size} type={this.type} checked={this.checked} state={this.state} indeterminate={this.indeterminate}></gb-checkbox-base>\r\n            </div>\r\n            {this.text && (\r\n              <div class=\"text\">\r\n                <slot name=\"label\"></slot>\r\n                {this.supportingText && <slot name=\"supporting_text\"></slot>}\r\n              </div>\r\n            )}\r\n          </div>\r\n        );\r\n    }\r\n}"]}