globuswebcomponents 0.3.6 → 0.3.8

package/dist/collection/components/gb-avatar-dropdown/gb-avatar-dropdown.js

@@ -6,16 +6,16 @@ export class GbAvatarDropdown {
         this.showProfile = undefined;
         this.showDarkTheme = undefined;
         this.showLogOut = undefined;
-        this.listGroup1 = undefined;
-        this.listGroup2 = undefined;
-        this.listGroup3 = undefined;
+        this.listGroupOne = undefined;
+        this.listGroupTwo = undefined;
+        this.listGroupThree = undefined;
     }
     render() {
         if (this.type === 'simple') {
             return (h("div", { class: "simple-dropdown" }, h("div", { class: "profile" }, h("gb-avatar-label-group", { size: "md", statusIcon: 'false', text: this.text }, h("slot", { name: "name", slot: "name" }), h("slot", { name: 'image', slot: 'image' }), h("slot", { name: 'supporting_text', slot: 'supporting_text' }))), h("div", { class: "menu-items" }, h("div", { class: "list" }, this.showProfile && (h("gb-dropdown-items-with-shortcut", { icon: true, iconSrc: 'user_profile', label: 'View Profile', shortcut: true, shortcutIcon: 'K + P' })), this.showDarkTheme && (h("gb-dropdown-items-with-shortcut", { icon: true, iconSrc: 'dark_theme', label: 'Dark Theme', shortcut: true, shortcutIcon: 'T' })), this.showLogOut && (h("gb-dropdown-items-with-shortcut", { icon: true, iconSrc: 'logout_button', label: 'Log out', shortcut: true, shortcutIcon: 'L' }))))));
         }
         if (this.type === 'complex') {
-            return (h("div", { class: "complex-dropdown" }, h("div", { class: "profile" }, h("gb-avatar-label-group", { size: "md", statusIcon: 'false' }, h("slot", { name: "name", slot: "name" }))), this.listGroup1 && (h("div", { class: "list-group-1" }, h("gb-dropdown-items-with-shortcut", { icon: true, iconSrc: 'user_profile', label: 'View Profile', shortcut: true, shortcutIcon: '\u2318K+P' }), h("gb-dropdown-items-with-shortcut", { icon: true, iconSrc: 'dark_theme', label: 'Dark Theme', shortcut: true, shortcutIcon: '\u2318T' }))), this.listGroup2 && (h("div", { class: "list-group-2" }, h("gb-dropdown-items-with-shortcut", { icon: true, iconSrc: 'configuration_02', label: "Configuration", shortcut: true, shortcutIcon: 'S' }), h("gb-dropdown-items-with-shortcut", { icon: true, iconSrc: 'user_group', label: "Team", shortcut: true, shortcutIcon: 'K->T' }), h("gb-dropdown-items-with-shortcut", { icon: true, iconSrc: 'user_add', label: 'Invite Members', shortcut: true, shortcutIcon: 'I' }))), this.listGroup3 && (h("div", { class: "list-group-3" }, h("gb-dropdown-items-with-shortcut", { icon: true, iconSrc: 'logout_button', label: 'Log out', shortcut: true, shortcutIcon: '\u2318L' })))));
+            return (h("div", { class: "complex-dropdown" }, h("div", { class: "profile" }, h("gb-avatar-label-group", { size: "md", statusIcon: 'false' }, h("slot", { name: "name", slot: "name" }))), this.listGroupOne && (h("div", { class: "list-group-1" }, h("gb-dropdown-items-with-shortcut", { icon: true, iconSrc: 'user_profile', label: 'View Profile', shortcut: true, shortcutIcon: '\u2318K+P' }), h("gb-dropdown-items-with-shortcut", { icon: true, iconSrc: 'dark_theme', label: 'Dark Theme', shortcut: true, shortcutIcon: '\u2318T' }))), this.listGroupTwo && (h("div", { class: "list-group-2" }, h("gb-dropdown-items-with-shortcut", { icon: true, iconSrc: 'configuration_02', label: "Configuration", shortcut: true, shortcutIcon: 'S' }), h("gb-dropdown-items-with-shortcut", { icon: true, iconSrc: 'user_group', label: "Team", shortcut: true, shortcutIcon: 'K->T' }), h("gb-dropdown-items-with-shortcut", { icon: true, iconSrc: 'user_add', label: 'Invite Members', shortcut: true, shortcutIcon: 'I' }))), this.listGroupThree && (h("div", { class: "list-group-3" }, h("gb-dropdown-items-with-shortcut", { icon: true, iconSrc: 'logout_button', label: 'Log out', shortcut: true, shortcutIcon: '\u2318L' })))));
         }
     }
     static get is() { return "gb-avatar-dropdown"; }
@@ -118,7 +118,7 @@ export class GbAvatarDropdown {
                 "attribute": "show-log-out",
                 "reflect": false
             },
-            "listGroup1": {
+            "listGroupOne": {
                 "type": "boolean",
                 "mutable": false,
                 "complexType": {
@@ -132,10 +132,10 @@ export class GbAvatarDropdown {
                     "tags": [],
                     "text": ""
                 },
-                "attribute": "list-group-1",
+                "attribute": "list-group-one",
                 "reflect": false
             },
-            "listGroup2": {
+            "listGroupTwo": {
                 "type": "boolean",
                 "mutable": false,
                 "complexType": {
@@ -149,10 +149,10 @@ export class GbAvatarDropdown {
                     "tags": [],
                     "text": ""
                 },
-                "attribute": "list-group-2",
+                "attribute": "list-group-two",
                 "reflect": false
             },
-            "listGroup3": {
+            "listGroupThree": {
                 "type": "boolean",
                 "mutable": false,
                 "complexType": {
@@ -166,7 +166,7 @@ export class GbAvatarDropdown {
                     "tags": [],
                     "text": ""
                 },
-                "attribute": "list-group-3",
+                "attribute": "list-group-three",
                 "reflect": false
             }
         };

package/dist/collection/components/gb-avatar-dropdown/gb-avatar-dropdown.js.map

@@ -1 +1 @@
-{"version":3,"file":"gb-avatar-dropdown.js","sourceRoot":"","sources":["../../../src/components/gb-avatar-dropdown/gb-avatar-dropdown.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAC,SAAS,EAAE,IAAI,EAAE,CAAC,EAAC,MAAM,eAAe,CAAC;AAQjD,MAAM,OAAO,gBAAgB;;;oBAED,KAAK;;;;;;;;IAQ7B,MAAM;QAEF,IAAI,IAAI,CAAC,IAAI,KAAK,QAAQ,EAAE,CAAC;YACzB,OAAO,CACH,WAAK,KAAK,EAAC,iBAAiB;gBACxB,WAAK,KAAK,EAAC,SAAS;oBAChB,6BAAuB,IAAI,EAAC,IAAI,EAAC,UAAU,EAAC,OAAO,EAAC,IAAI,EAAE,IAAI,CAAC,IAAI;wBACnE,YAAM,IAAI,EAAC,MAAM,EAAC,IAAI,EAAC,MAAM,GAAQ;wBACrC,YAAM,IAAI,EAAC,OAAO,EAAC,IAAI,EAAC,OAAO,GAAQ;wBACvC,YAAM,IAAI,EAAC,iBAAiB,EAAC,IAAI,EAAC,iBAAiB,GAAQ,CACnC,CACtB;gBACN,WAAK,KAAK,EAAC,YAAY;oBACnB,WAAK,KAAK,EAAC,MAAM;wBACZ,IAAI,CAAC,WAAW,IAAI,CACjB,uCAAiC,IAAI,QAAC,OAAO,EAAC,cAAc,EAAC,KAAK,EAAC,cAAc,EAAC,QAAQ,QAAC,YAAY,EAAC,OAAO,GAC7E,CACrC;wBACA,IAAI,CAAC,aAAa,IAAI,CACnB,uCAAiC,IAAI,QAAC,OAAO,EAAC,YAAY,EAAC,KAAK,EAAC,YAAY,EAAC,QAAQ,QAAC,YAAY,EAAC,GAAG,GAAmC,CAC7I;wBACA,IAAI,CAAC,UAAU,IAAI,CAChB,uCAAiC,IAAI,QAAC,OAAO,EAAC,eAAe,EAAC,KAAK,EAAC,SAAS,EAAC,QAAQ,QAAC,YAAY,EAAC,GAAG,GAAmC,CAC7I,CACC,CACJ,CACJ,CACT,CAAC;QACN,CAAC;QAED,IAAG,IAAI,CAAC,IAAI,KAAK,SAAS,EAAE,CAAC;YACzB,OAAO,CACH,WAAK,KAAK,EAAC,kBAAkB;gBACzB,WAAK,KAAK,EAAC,SAAS;oBAChB,6BAAuB,IAAI,EAAC,IAAI,EAAC,UAAU,EAAC,OAAO;wBAC/C,YAAM,IAAI,EAAC,MAAM,EAAC,IAAI,EAAC,MAAM,GAAQ,CACjB,CACtB;gBACL,IAAI,CAAC,UAAU,IAAI,CAChB,WAAK,KAAK,EAAC,cAAc;oBACrB,uCAAiC,IAAI,QAAC,OAAO,EAAC,cAAc,EAAC,KAAK,EAAC,cAAc,EAAC,QAAQ,QAAC,YAAY,EAAC,WAAM,GAC5E;oBAClC,uCAAiC,IAAI,QAAC,OAAO,EAAC,YAAY,EAAC,KAAK,EAAC,YAAY,EAAC,QAAQ,QAAC,YAAY,EAAC,SAAI,GAAmC,CACzI,CACT;gBACA,IAAI,CAAC,UAAU,IAAI,CAChB,WAAK,KAAK,EAAC,cAAc;oBACrB,uCAAiC,IAAI,QAAC,OAAO,EAAC,kBAAkB,EAAC,KAAK,EAAC,eAAe,EAAC,QAAQ,QAAC,YAAY,EAAC,GAAG,GAAmC;oBACnJ,uCAAiC,IAAI,QAAC,OAAO,EAAC,YAAY,EAAC,KAAK,EAAC,MAAM,EAAC,QAAQ,QAAC,YAAY,EAAC,MAAM,GAAmC;oBACvI,uCAAiC,IAAI,QAAC,OAAO,EAAC,UAAU,EAAC,KAAK,EAAC,gBAAgB,EAAC,QAAQ,QAAC,YAAY,EAAC,GAAG,GAAmC,CAC1I,CACT;gBACA,IAAI,CAAC,UAAU,IAAI,CAChB,WAAK,KAAK,EAAC,cAAc;oBACrB,uCAAiC,IAAI,QAAC,OAAO,EAAC,eAAe,EAAC,KAAK,EAAC,SAAS,EAAC,QAAQ,QAAC,YAAY,EAAC,SAAI,GAAmC,CACzI,CACT,CACC,CACT,CAAA;QACL,CAAC;IAGL,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACJ","sourcesContent":["import {Component, Prop, h} from '@stencil/core';\r\n\r\n@Component ({\r\n    tag: 'gb-avatar-dropdown',\r\n    styleUrl: 'gb-avatar-dropdown.css',\r\n    shadow: true\r\n})\r\n\r\nexport class GbAvatarDropdown {\r\n    @Prop() type: 'simple' | 'complex';\r\n    @Prop() text: boolean = false;\r\n    @Prop() showProfile: boolean;\r\n    @Prop() showDarkTheme: boolean;\r\n    @Prop() showLogOut: boolean;\r\n    @Prop() listGroup1: boolean;\r\n    @Prop() listGroup2: boolean;\r\n    @Prop() listGroup3: boolean;\r\n\r\n    render() {\r\n\r\n        if (this.type === 'simple') {\r\n            return (\r\n                <div class=\"simple-dropdown\">\r\n                    <div class=\"profile\">\r\n                        <gb-avatar-label-group size=\"md\" statusIcon='false' text={this.text}>\r\n                        <slot name=\"name\" slot=\"name\"></slot>\r\n                        <slot name='image' slot='image'></slot>\r\n                        <slot name='supporting_text' slot='supporting_text'></slot>\r\n                        </gb-avatar-label-group>\r\n                    </div>\r\n                    <div class=\"menu-items\">\r\n                        <div class=\"list\">\r\n                            {this.showProfile && (\r\n                                <gb-dropdown-items-with-shortcut icon iconSrc='user_profile' label='View Profile' shortcut shortcutIcon='K + P'>\r\n                                </gb-dropdown-items-with-shortcut>\r\n                            )}\r\n                            {this.showDarkTheme && (\r\n                                <gb-dropdown-items-with-shortcut icon iconSrc='dark_theme' label='Dark Theme' shortcut shortcutIcon='T'></gb-dropdown-items-with-shortcut>\r\n                            )}\r\n                            {this.showLogOut && (\r\n                                <gb-dropdown-items-with-shortcut icon iconSrc='logout_button' label='Log out' shortcut shortcutIcon='L'></gb-dropdown-items-with-shortcut>\r\n                            )}\r\n                        </div> \r\n                    </div> \r\n                </div>\r\n            );\r\n        }\r\n\r\n        if(this.type === 'complex') {\r\n            return (\r\n                <div class=\"complex-dropdown\">\r\n                    <div class=\"profile\">\r\n                        <gb-avatar-label-group size=\"md\" statusIcon='false'>\r\n                            <slot name=\"name\" slot=\"name\"></slot>\r\n                        </gb-avatar-label-group>\r\n                    </div>\r\n                    {this.listGroup1 && (\r\n                        <div class=\"list-group-1\">\r\n                            <gb-dropdown-items-with-shortcut icon iconSrc='user_profile' label='View Profile' shortcut shortcutIcon='⌘K+P'>\r\n                            </gb-dropdown-items-with-shortcut>\r\n                            <gb-dropdown-items-with-shortcut icon iconSrc='dark_theme' label='Dark Theme' shortcut shortcutIcon='⌘T'></gb-dropdown-items-with-shortcut>\r\n                        </div>\r\n                    )}\r\n                    {this.listGroup2 && (\r\n                        <div class=\"list-group-2\">\r\n                            <gb-dropdown-items-with-shortcut icon iconSrc='configuration_02' label=\"Configuration\" shortcut shortcutIcon='S'></gb-dropdown-items-with-shortcut>\r\n                            <gb-dropdown-items-with-shortcut icon iconSrc='user_group' label=\"Team\" shortcut shortcutIcon='K->T'></gb-dropdown-items-with-shortcut>\r\n                            <gb-dropdown-items-with-shortcut icon iconSrc='user_add' label='Invite Members' shortcut shortcutIcon='I'></gb-dropdown-items-with-shortcut>\r\n                        </div>\r\n                    )}\r\n                    {this.listGroup3 && (\r\n                        <div class=\"list-group-3\">\r\n                            <gb-dropdown-items-with-shortcut icon iconSrc='logout_button' label='Log out' shortcut shortcutIcon='⌘L'></gb-dropdown-items-with-shortcut>\r\n                        </div>\r\n                    )}\r\n                </div>\r\n            )\r\n        }\r\n\r\n        \r\n    }\r\n}"]}
+{"version":3,"file":"gb-avatar-dropdown.js","sourceRoot":"","sources":["../../../src/components/gb-avatar-dropdown/gb-avatar-dropdown.tsx"],"names":[],"mappings":"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","sourcesContent":["import {Component, Prop, h} from '@stencil/core';\r\n\r\n@Component ({\r\n    tag: 'gb-avatar-dropdown',\r\n    styleUrl: 'gb-avatar-dropdown.css',\r\n    shadow: true\r\n})\r\n\r\nexport class GbAvatarDropdown {\r\n    @Prop() type: 'simple' | 'complex';\r\n    @Prop() text: boolean = false;\r\n    @Prop() showProfile: boolean;\r\n    @Prop() showDarkTheme: boolean;\r\n    @Prop() showLogOut: boolean;\r\n    @Prop() listGroupOne: boolean;\r\n    @Prop() listGroupTwo: boolean;\r\n    @Prop() listGroupThree: boolean;\r\n\r\n    render() {\r\n\r\n        if (this.type === 'simple') {\r\n            return (\r\n                <div class=\"simple-dropdown\">\r\n                    <div class=\"profile\">\r\n                        <gb-avatar-label-group size=\"md\" statusIcon='false' text={this.text}>\r\n                        <slot name=\"name\" slot=\"name\"></slot>\r\n                        <slot name='image' slot='image'></slot>\r\n                        <slot name='supporting_text' slot='supporting_text'></slot>\r\n                        </gb-avatar-label-group>\r\n                    </div>\r\n                    <div class=\"menu-items\">\r\n                        <div class=\"list\">\r\n                            {this.showProfile && (\r\n                                <gb-dropdown-items-with-shortcut icon iconSrc='user_profile' label='View Profile' shortcut shortcutIcon='K + P'>\r\n                                </gb-dropdown-items-with-shortcut>\r\n                            )}\r\n                            {this.showDarkTheme && (\r\n                                <gb-dropdown-items-with-shortcut icon iconSrc='dark_theme' label='Dark Theme' shortcut shortcutIcon='T'></gb-dropdown-items-with-shortcut>\r\n                            )}\r\n                            {this.showLogOut && (\r\n                                <gb-dropdown-items-with-shortcut icon iconSrc='logout_button' label='Log out' shortcut shortcutIcon='L'></gb-dropdown-items-with-shortcut>\r\n                            )}\r\n                        </div> \r\n                    </div> \r\n                </div>\r\n            );\r\n        }\r\n\r\n        if(this.type === 'complex') {\r\n            return (\r\n                <div class=\"complex-dropdown\">\r\n                    <div class=\"profile\">\r\n                        <gb-avatar-label-group size=\"md\" statusIcon='false'>\r\n                            <slot name=\"name\" slot=\"name\"></slot>\r\n                        </gb-avatar-label-group>\r\n                    </div>\r\n                    {this.listGroupOne && (\r\n                        <div class=\"list-group-1\">\r\n                            <gb-dropdown-items-with-shortcut icon iconSrc='user_profile' label='View Profile' shortcut shortcutIcon='⌘K+P'>\r\n                            </gb-dropdown-items-with-shortcut>\r\n                            <gb-dropdown-items-with-shortcut icon iconSrc='dark_theme' label='Dark Theme' shortcut shortcutIcon='⌘T'></gb-dropdown-items-with-shortcut>\r\n                        </div>\r\n                    )}\r\n                    {this.listGroupTwo && (\r\n                        <div class=\"list-group-2\">\r\n                            <gb-dropdown-items-with-shortcut icon iconSrc='configuration_02' label=\"Configuration\" shortcut shortcutIcon='S'></gb-dropdown-items-with-shortcut>\r\n                            <gb-dropdown-items-with-shortcut icon iconSrc='user_group' label=\"Team\" shortcut shortcutIcon='K->T'></gb-dropdown-items-with-shortcut>\r\n                            <gb-dropdown-items-with-shortcut icon iconSrc='user_add' label='Invite Members' shortcut shortcutIcon='I'></gb-dropdown-items-with-shortcut>\r\n                        </div>\r\n                    )}\r\n                    {this.listGroupThree && (\r\n                        <div class=\"list-group-3\">\r\n                            <gb-dropdown-items-with-shortcut icon iconSrc='logout_button' label='Log out' shortcut shortcutIcon='⌘L'></gb-dropdown-items-with-shortcut>\r\n                        </div>\r\n                    )}\r\n                </div>\r\n            )\r\n        }\r\n\r\n        \r\n    }\r\n}"]}

package/dist/collection/components/gb-avatar-group/gb-avatar-group.css

@@ -92,4 +92,11 @@
 
 ::slotted(p){
     color: #4B5565;
+}
+
+.avatar img{
+    width: 100%;
+    height: 100%;
+    object-fit: cover;
+    border-radius: 50%;
 }