globuswebcomponents 0.2.6 → 0.2.9

package/dist/collection/components/gb-avatar-profile-photo/gb-avatar-profile-photo.js

@@ -0,0 +1,155 @@
+import { h } from "@stencil/core";
+import { BorderWeights } from "../../models/reusableModels";
+export class GbAvatarProfilePhoto {
+    constructor() {
+        this.placeholder = false;
+        this.text = false;
+        this.size = undefined;
+        this.verified = false;
+        this.icon = 'user';
+    }
+    getInitialsSize() {
+        switch (this.size) {
+            case 'lg': return 'display-xl-semi-bold';
+            case 'md': return 'display-md-semi-bold';
+            case 'sm': return 'display-sm-semi-bold';
+        }
+    }
+    getProfileSize() {
+        switch (this.size) {
+            case 'lg': return 'profile_lg';
+            case 'md': return 'profile_md';
+            case 'sm': return 'profile_sm';
+        }
+    }
+    setWeight() {
+        switch (this.size) {
+            case 'lg': return BorderWeights.Heavy;
+            case 'md': return BorderWeights.Heavy;
+            case 'sm': return BorderWeights.Regular;
+        }
+    }
+    componentDidLoad() {
+        const slottedInitials = this.el.querySelector('h1');
+        if (slottedInitials) {
+            slottedInitials.classList.add(this.getInitialsSize());
+        }
+    }
+    render() {
+        const profileSize = this.getProfileSize();
+        return (h("div", { key: '76226bb62f296b9f81d5506f39e9520e0046830e', class: `profile_photo ${profileSize}` }, h("gb-avatar", { key: 'b42aace14943d215950f725e0f01459cdb69f784', size: profileSize, icon: "user", text: this.text, "status-icon": this.verified && ('verified'), weight: this.setWeight(), placeholder: this.placeholder }, !this.text ? (h("slot", { name: "image", slot: "image" })) : (h("slot", { name: "initials", slot: "initials" })))));
+    }
+    static get is() { return "gb-avatar-profile-photo"; }
+    static get encapsulation() { return "shadow"; }
+    static get originalStyleUrls() {
+        return {
+            "$": ["gb-avatar-profile-photo.css"]
+        };
+    }
+    static get styleUrls() {
+        return {
+            "$": ["gb-avatar-profile-photo.css"]
+        };
+    }
+    static get properties() {
+        return {
+            "placeholder": {
+                "type": "boolean",
+                "mutable": false,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "attribute": "placeholder",
+                "reflect": false,
+                "defaultValue": "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"
+            },
+            "size": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "GeneralSizes",
+                    "resolved": "\"lg\" | \"md\" | \"profile_lg\" | \"profile_md\" | \"profile_sm\" | \"sm\" | \"xl\" | \"xl2\" | \"xl3\" | \"xl4\" | \"xs\"",
+                    "references": {
+                        "GeneralSizes": {
+                            "location": "import",
+                            "path": "../../models/reusableModels",
+                            "id": "src/models/reusableModels.ts::GeneralSizes"
+                        }
+                    }
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "attribute": "size",
+                "reflect": false
+            },
+            "verified": {
+                "type": "boolean",
+                "mutable": false,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "attribute": "verified",
+                "reflect": false,
+                "defaultValue": "false"
+            },
+            "icon": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "attribute": "icon",
+                "reflect": false,
+                "defaultValue": "'user'"
+            }
+        };
+    }
+    static get elementRef() { return "el"; }
+}
+//# sourceMappingURL=gb-avatar-profile-photo.js.map

package/dist/collection/components/gb-avatar-profile-photo/gb-avatar-profile-photo.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"gb-avatar-profile-photo.js","sourceRoot":"","sources":["../../../src/components/gb-avatar-profile-photo/gb-avatar-profile-photo.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,OAAO,EAAE,CAAC,EAAE,IAAI,EAAE,MAAM,eAAe,CAAC;AAC5D,OAAO,EAAE,aAAa,EAAgB,MAAM,6BAA6B,CAAC;AAQ1E,MAAM,OAAO,oBAAoB;;2BACE,KAAK;oBACZ,KAAK;;wBAED,KAAK;oBAEV,MAAM;;IAE7B,eAAe;QACX,QAAQ,IAAI,CAAC,IAAI,EAAE,CAAC;YAChB,KAAK,IAAI,CAAC,CAAC,OAAO,sBAAsB,CAAC;YACzC,KAAK,IAAI,CAAC,CAAC,OAAO,sBAAsB,CAAC;YACzC,KAAK,IAAI,CAAC,CAAC,OAAO,sBAAsB,CAAC;QAC7C,CAAC;IACL,CAAC;IAED,cAAc;QACV,QAAQ,IAAI,CAAC,IAAI,EAAE,CAAC;YAChB,KAAK,IAAI,CAAC,CAAC,OAAO,YAAY,CAAC;YAC/B,KAAK,IAAI,CAAC,CAAC,OAAO,YAAY,CAAC;YAC/B,KAAK,IAAI,CAAC,CAAC,OAAO,YAAY,CAAC;QACnC,CAAC;IACL,CAAC;IAED,SAAS;QACL,QAAQ,IAAI,CAAC,IAAI,EAAE,CAAC;YAChB,KAAK,IAAK,CAAC,CAAC,OAAO,aAAa,CAAC,KAAK,CAAC;YACvC,KAAK,IAAK,CAAC,CAAC,OAAO,aAAa,CAAC,KAAK,CAAC;YACvC,KAAK,IAAK,CAAC,CAAC,OAAO,aAAa,CAAC,OAAO,CAAC;QAC7C,CAAC;IACL,CAAC;IAED,gBAAgB;QACZ,MAAM,eAAe,GAAG,IAAI,CAAC,EAAE,CAAC,aAAa,CAAC,IAAI,CAAC,CAAC;QAEpD,IAAI,eAAe,EAAE,CAAC;YAClB,eAAe,CAAC,SAAS,CAAC,GAAG,CAAC,IAAI,CAAC,eAAe,EAAE,CAAC,CAAC;QAC1D,CAAC;IACL,CAAC;IAED,MAAM;QACF,MAAM,WAAW,GAAG,IAAI,CAAC,cAAc,EAAE,CAAC;QAE1C,OAAO,CACH,4DAAK,KAAK,EAAE,iBAAiB,WAAW,EAAE;YACtC,kEACA,IAAI,EAAE,WAAW,EACjB,IAAI,EAAC,MAAM,EACX,IAAI,EAAE,IAAI,CAAC,IAAI,iBACF,IAAI,CAAC,QAAQ,IAAI,CAAC,UAAU,CAAC,EAC1C,MAAM,EAAE,IAAI,CAAC,SAAS,EAAE,EACxB,WAAW,EAAE,IAAI,CAAC,WAAW,IAExB,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC,CACV,YAAM,IAAI,EAAC,OAAO,EAAC,IAAI,EAAC,OAAO,GAAQ,CAC1C,CAAC,CAAC,CAAC,CACA,YAAM,IAAI,EAAC,UAAU,EAAC,IAAI,EAAC,UAAU,GAAQ,CAChD,CACO,CACV,CACT,CAAC;IACN,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACJ","sourcesContent":["import { Component, Element, h, Prop } from \"@stencil/core\";\r\nimport { BorderWeights, GeneralSizes } from \"../../models/reusableModels\";\r\n\r\n@Component({\r\n    tag: 'gb-avatar-profile-photo',\r\n    styleUrl: 'gb-avatar-profile-photo.css',\r\n    shadow: true\r\n})\r\n\r\nexport class GbAvatarProfilePhoto {\r\n    @Prop() placeholder: boolean = false;\r\n    @Prop() text: boolean = false;\r\n    @Prop() size: GeneralSizes;\r\n    @Prop() verified: boolean = false;\r\n    @Element() el: HTMLElement;\r\n    @Prop() icon: string = 'user';\r\n\r\n    getInitialsSize() {\r\n        switch (this.size) {\r\n            case 'lg': return 'display-xl-semi-bold';\r\n            case 'md': return 'display-md-semi-bold';\r\n            case 'sm': return 'display-sm-semi-bold';\r\n        }\r\n    }\r\n\r\n    getProfileSize() {\r\n        switch (this.size) {\r\n            case 'lg': return 'profile_lg';\r\n            case 'md': return 'profile_md';\r\n            case 'sm': return 'profile_sm';\r\n        }\r\n    }\r\n\r\n    setWeight() {\r\n        switch (this.size) {\r\n            case 'lg' : return BorderWeights.Heavy;\r\n            case 'md' : return BorderWeights.Heavy;\r\n            case 'sm' : return BorderWeights.Regular;\r\n        }\r\n    }\r\n\r\n    componentDidLoad() {\r\n        const slottedInitials = this.el.querySelector('h1');\r\n    \r\n        if (slottedInitials) {\r\n            slottedInitials.classList.add(this.getInitialsSize());\r\n        }\r\n    }\r\n\r\n    render() {\r\n        const profileSize = this.getProfileSize();\r\n\r\n        return (\r\n            <div class={`profile_photo ${profileSize}`}>\r\n                <gb-avatar\r\n                size={profileSize}\r\n                icon=\"user\"\r\n                text={this.text}\r\n                status-icon={this.verified && ('verified')}\r\n                weight={this.setWeight()}\r\n                placeholder={this.placeholder}\r\n                >\r\n                    {!this.text ? (\r\n                        <slot name=\"image\" slot=\"image\"></slot>\r\n                    ) : (\r\n                        <slot name=\"initials\" slot=\"initials\"></slot>\r\n                    )}\r\n                </gb-avatar>\r\n            </div>\r\n        );\r\n    }\r\n}"]}