@charlietango/ddb-widget - npm Package Compare versions

Comparing version 0.0.13 to 0.0.14

dist/collection/collection-manifest.json

@@ -108,2 +108,6 @@ {
           "attr": "logo"
+        },
+        {
+          "name": "onCloseClick",
+          "attr": "on-close-click"
         }
@@ -110,0 +114,0 @@ ],

dist/collection/components/ddb-widget/ddb-widget.js

 export class DdbWidget {
     constructor() {
         this.isOpen = false;
+        this.toggleWidget = () => {
+            this.isOpen = !this.isOpen;
+            document.getElementsByTagName('html')[0].style.overflow = this.isOpen ? 'hidden' : 'auto';
+        };
         this.handleLauncherClick = (event) => {
             event.stopPropagation();
-            this.isOpen = !this.isOpen;
+            this.toggleWidget();
         };
@@ -11,8 +15,11 @@ this.handleOverlayClick = (event) => {
             if (this.isOpen) {
-                this.isOpen = false;
+                this.toggleWidget();
             }
         };
+        this.handleCloseClick = (_event) => {
+            this.toggleWidget();
+        };
     }
     componentWillLoad() {
-        const api = 'https://dd2b2b01-1fe6-4f62-abf8-f012c7ba25bc.mock.pstmn.io/get/data';
+        const api = 'https://ddb-be.s1.umbraco.io/api/ddb/list';
         return this.fetchWidgetData(api);
@@ -34,9 +41,9 @@ }
         }
-        const { links, color, logo } = this.widgetData;
+        const { links, color, logo, topLogo } = this.widgetData;
         return (h("div", { class: `overlay ${this.isOpen ? 'active' : ''}`, onClick: this.handleOverlayClick },
             h("div", { class: 'container' },
                 this.isOpen &&
-                    h("widget-window", { logo: logo },
+                    h("widget-window", { logo: topLogo || logo, onCloseClick: this.handleCloseClick },
                         h("link-list", { links: links, color: color })),
-                h("widget-launcher", { color: color, logo: logo, isOpen: this.isOpen, onClick: this.handleLauncherClick }))));
+                h("widget-launcher", { color: color, logo: logo || topLogo, isOpen: this.isOpen, onClick: this.handleLauncherClick }))));
     }
@@ -43,0 +50,0 @@ static get is() { return "ddb-widget"; }

dist/collection/components/link-list/link-list.js

@@ -7,3 +7,3 @@ export class LinkList {
                     h("div", { class: 'top-container' },
-                        h("img", { src: item.icon, alt: item.icon }),
+                        h("img", { src: item.icon.src, alt: item.icon.alt || item.icon.src }),
                         h("svg", { class: 'right-arrow', viewBox: "0 0 22 22" },
@@ -21,13 +21,9 @@ h("defs", null,
         const newLinks = [...this.links, ...this.links];
-        newLinks[0].icon = 'https://image.ibb.co/iZebEK/Screenshot_2018_10_06_at_19_33_20.png';
-        newLinks[1].icon = 'https://image.ibb.co/i8VK1z/Screenshot_2018_10_06_at_19_47_07.png';
-        newLinks[2].icon = 'https://image.ibb.co/dVaYuK/Screenshot_2018_10_06_at_19_39_46.png';
-        newLinks[3].icon = 'https://image.ibb.co/iEuOTe/Screenshot_2018_10_06_at_19_46_24.png';
-        newLinks[4].icon = 'https://image.ibb.co/n8TTuK/Screenshot_2018_10_06_at_19_46_13.png';
-        newLinks[0].label = 'læs anmeldelser og find din næste læseoplevelse';
-        newLinks[1].label = 'læs anmeldelser og find din næste læseoplevelse';
+        newLinks[2].icon.src = 'https://image.ibb.co/dVaYuK/Screenshot_2018_10_06_at_19_39_46.png';
+        newLinks[3].icon.src = 'https://image.ibb.co/iEuOTe/Screenshot_2018_10_06_at_19_46_24.png';
+        newLinks[4].icon.src = 'https://image.ibb.co/n8TTuK/Screenshot_2018_10_06_at_19_46_13.png';
         newLinks[2].label = 'læs anmeldelser og find din næste læseoplevelse';
         newLinks[3].label = 'læs anmeldelser og find din næste læseoplevelse';
         newLinks[4].label = 'læs anmeldelser og find din næste læseoplevelse';
-        return (h("div", { style: { height: '100%', overflow: 'auto' } },
+        return (h("div", { class: 'scroll-container' },
             h("ul", { class: 'list' }, newLinks.map(this.renderListItem))));
@@ -34,0 +30,0 @@ }

dist/collection/components/widget-window/widget-window.js

@@ -6,2 +6,6 @@ export class WidgetWindow {
         };
+        this.handleCloseClick = (event) => {
+            event.stopPropagation();
+            this.onCloseClick();
+        };
     }
@@ -12,3 +16,7 @@ render() {
             h("div", { class: "header" },
-                h("img", { src: mockLogo, alt: this.logo.alt || this.logo.src })),
+                h("img", { src: mockLogo, alt: this.logo.alt || this.logo.src }),
+                h("div", { onClick: this.handleCloseClick, class: 'close-icon' },
+                    h("svg", { viewBox: "0 0 1280.000000 1280.000000", preserveAspectRatio: "xMidYMid meet" },
+                        h("g", { transform: "translate(0.000000,1280.000000) scale(0.100000,-0.100000)", fill: "#3f3f3f", stroke: "none" },
+                            h("path", { d: "M1545 12784 c-85 -19 -167 -51 -243 -95 -69 -41 -1089 -1049 -1157\n                  -1144 -101 -141 -140 -263 -140 -440 0 -169 36 -293 125 -427 29 -43 705 -726\n                  2149 -2170 l2106 -2108 -2111 -2112 c-1356 -1358 -2124 -2133 -2147 -2169 -88\n                  -137 -121 -249 -121 -419 -1 -181 37 -302 139 -445 68 -95 1088 -1103 1157\n                  -1144 273 -159 604 -143 853 42 22 17 986 976 2143 2131 l2102 2101 2103\n                  -2101 c1156 -1155 2120 -2114 2142 -2131 69 -51 130 -82 224 -113 208 -70 431\n                  -44 629 71 69 41 1089 1049 1157 1144 101 141 140 263 140 440 0 166 -36 290\n                  -121 422 -25 39 -746 767 -2148 2171 l-2111 2112 2107 2108 c2207 2208 2162\n                  2161 2219 2303 75 187 77 392 4 572 -53 132 -74 157 -615 700 -289 291 -552\n                  548 -585 572 -141 101 -263 140 -440 140 -166 0 -289 -35 -420 -120 -41 -26\n                  -724 -702 -2172 -2149 l-2113 -2111 -2112 2111 c-1454 1452 -2132 2123 -2173\n                  2150 -64 41 -149 78 -230 101 -79 22 -258 26 -340 7z" }))))),
             h("div", { class: "content" },
@@ -23,2 +31,6 @@ h("slot", null))));
             "attr": "logo"
+        },
+        "onCloseClick": {
+            "type": "Any",
+            "attr": "on-close-click"
         }
@@ -25,0 +37,0 @@ }; }

dist/ddb-widget.js

 /*!
  * Built with http://stenciljs.com
- * 2018-09-06T20:35:27
+ * 2018-09-08T11:53:58
  */
-!function(e,t,r,n,i,s,o,d,c,a,l,u,p,h){for((l=e.DdbWidget=e.DdbWidget||{}).components=c,(p=c.map(function(e){return e[0]})).length&&((u=t.createElement("style")).innerHTML=p.join()+"{visibility:hidden}.hydrated{visibility:inherit}",u.setAttribute("data-styles",""),p=t.head.querySelector("meta[charset]"),t.head.insertBefore(u,p?p.nextSibling:t.head.firstChild)),function(e,t,r){(e["s-apps"]=e["s-apps"]||[]).push("DdbWidget"),r.componentOnReady||(r.componentOnReady=function(){var t=this;function r(r){if(t.nodeName.indexOf("-")>0){for(var n=e["s-apps"],i=0,s=0;s<n.length;s++)if(e[n[s]].componentOnReady){if(e[n[s]].componentOnReady(t,r))return;i++}if(i<n.length)return void(e["s-cr"]=e["s-cr"]||[]).push([t,r])}r(null)}return e.Promise?new e.Promise(r):{then:r}})}(e,0,a),i=i||l.resourcesUrl,u=(p=t.querySelectorAll("script")).length-1;u>=0&&!(h=p[u]).src&&!h.hasAttribute("data-resources-url");u--);p=h.getAttribute("data-resources-url"),!i&&p&&(i=p),!i&&h.src&&(i=(p=h.src.split("/").slice(0,-1)).join("/")+(p.length?"/":"")+"ddb-widget/"),u=t.createElement("script"),function(e,t,r,n){return!(t.search.indexOf("core=esm")>0)&&(!(!(t.search.indexOf("core=es5")>0||"file:"===t.protocol)&&e.customElements&&e.customElements.define&&e.fetch&&e.CSS&&e.CSS.supports&&e.CSS.supports("color","var(--c)")&&"noModule"in r)||function(e){try{return new Function('import("")'),!1}catch(e){}return!0}())}(e,e.location,u)?u.src=i+"ddb-widget.twb6lpzt.js":(u.src=i+"ddb-widget.biglrsa8.js",u.setAttribute("type","module"),u.setAttribute("crossorigin",!0)),u.setAttribute("data-resources-url",i),u.setAttribute("data-namespace","ddb-widget"),t.head.appendChild(u)}(window,document,0,0,0,0,0,0,[["ddb-widget","dvsjryes",1,[["isOpen",16],["widgetData",16]],1],["link-list","dvsjryes",1,[["color",1,0,1,2],["links",1]],1],["widget-launcher","dvsjryes",1,[["color",1,0,1,2],["isExpanded",16],["isOpen",1,0,"is-open",4],["isReady",16],["logo",1]],1],["widget-window","dvsjryes",1,[["logo",1]],1]],HTMLElement.prototype);
+!function(e,t,n,i,r,s,o,d,c,l,u,a,p,g){for((u=e.DdbWidget=e.DdbWidget||{}).components=c,(p=c.map(function(e){return e[0]})).length&&((a=t.createElement("style")).innerHTML=p.join()+"{visibility:hidden}.hydrated{visibility:inherit}",a.setAttribute("data-styles",""),p=t.head.querySelector("meta[charset]"),t.head.insertBefore(a,p?p.nextSibling:t.head.firstChild)),function(e,t,n){(e["s-apps"]=e["s-apps"]||[]).push("DdbWidget"),n.componentOnReady||(n.componentOnReady=function(){var t=this;function n(n){if(t.nodeName.indexOf("-")>0){for(var i=e["s-apps"],r=0,s=0;s<i.length;s++)if(e[i[s]].componentOnReady){if(e[i[s]].componentOnReady(t,n))return;r++}if(r<i.length)return void(e["s-cr"]=e["s-cr"]||[]).push([t,n])}n(null)}return e.Promise?new e.Promise(n):{then:n}})}(e,0,l),r=r||u.resourcesUrl,a=(p=t.querySelectorAll("script")).length-1;a>=0&&!(g=p[a]).src&&!g.hasAttribute("data-resources-url");a--);p=g.getAttribute("data-resources-url"),!r&&p&&(r=p),!r&&g.src&&(r=(p=g.src.split("/").slice(0,-1)).join("/")+(p.length?"/":"")+"ddb-widget/"),a=t.createElement("script"),function(e,t,n,i){return!(t.search.indexOf("core=esm")>0)&&(!(!(t.search.indexOf("core=es5")>0||"file:"===t.protocol)&&e.customElements&&e.customElements.define&&e.fetch&&e.CSS&&e.CSS.supports&&e.CSS.supports("color","var(--c)")&&"noModule"in n)||function(e){try{return new Function('import("")'),!1}catch(e){}return!0}())}(e,e.location,a)?a.src=r+"ddb-widget.twb6lpzt.js":(a.src=r+"ddb-widget.biglrsa8.js",a.setAttribute("type","module"),a.setAttribute("crossorigin",!0)),a.setAttribute("data-resources-url",r),a.setAttribute("data-namespace","ddb-widget"),t.head.appendChild(a)}(window,document,0,0,0,0,0,0,[["ddb-widget","xvgqmkbu",1,[["isOpen",16],["widgetData",16]],1],["link-list","xvgqmkbu",1,[["color",1,0,1,2],["links",1]],1],["widget-launcher","xvgqmkbu",1,[["color",1,0,1,2],["isExpanded",16],["isOpen",1,0,"is-open",4],["isReady",16],["logo",1]],1],["widget-window","xvgqmkbu",1,[["logo",1],["onCloseClick",1]],1]],HTMLElement.prototype);

dist/esm/es2017/ddb-widget.components.js

 // DdbWidget: Host Data, ES Module/es2017 Target
-export const DdbWidget = ["ddb-widget","dvsjryes",1,[["isOpen",16],["widgetData",16]],1];
-export const LinkList = ["link-list","dvsjryes",1,[["color",1,0,1,2],["links",1]],1];
-export const WidgetLauncher = ["widget-launcher","dvsjryes",1,[["color",1,0,1,2],["isExpanded",16],["isOpen",1,0,"is-open",4],["isReady",16],["logo",1]],1];
-export const WidgetWindow = ["widget-window","dvsjryes",1,[["logo",1]],1];
+export const DdbWidget = ["ddb-widget","xvgqmkbu",1,[["isOpen",16],["widgetData",16]],1];
+export const LinkList = ["link-list","xvgqmkbu",1,[["color",1,0,1,2],["links",1]],1];
+export const WidgetLauncher = ["widget-launcher","xvgqmkbu",1,[["color",1,0,1,2],["isExpanded",16],["isOpen",1,0,"is-open",4],["isReady",16],["logo",1]],1];
+export const WidgetWindow = ["widget-window","xvgqmkbu",1,[["logo",1],["onCloseClick",1]],1];

dist/esm/es5/ddb-widget.components.js

 // DdbWidget: Host Data, ES Module/es5 Target
-export var DdbWidget = ["ddb-widget","dvsjryes",1,[["isOpen",16],["widgetData",16]],1];
-export var LinkList = ["link-list","dvsjryes",1,[["color",1,0,1,2],["links",1]],1];
-export var WidgetLauncher = ["widget-launcher","dvsjryes",1,[["color",1,0,1,2],["isExpanded",16],["isOpen",1,0,"is-open",4],["isReady",16],["logo",1]],1];
-export var WidgetWindow = ["widget-window","dvsjryes",1,[["logo",1]],1];
+export var DdbWidget = ["ddb-widget","xvgqmkbu",1,[["isOpen",16],["widgetData",16]],1];
+export var LinkList = ["link-list","xvgqmkbu",1,[["color",1,0,1,2],["links",1]],1];
+export var WidgetLauncher = ["widget-launcher","xvgqmkbu",1,[["color",1,0,1,2],["isExpanded",16],["isOpen",1,0,"is-open",4],["isReady",16],["logo",1]],1];
+export var WidgetWindow = ["widget-window","xvgqmkbu",1,[["logo",1],["onCloseClick",1]],1];

dist/types/components.d.ts

@@ -44,5 +44,7 @@ /* tslint:disable */
     'logo': ImageViewModel;
+    'onCloseClick': Function;
   }
   interface WidgetWindowAttributes extends StencilHTMLAttributes {
     'logo'?: ImageViewModel;
+    'onCloseClick'?: Function;
   }
@@ -49,0 +51,0 @@ }

dist/types/components/ddb-widget/ddb-widget.d.ts

@@ -6,2 +6,3 @@ import '../../stencil.core';
     logo?: ImageViewModel;
+    topLogo?: ImageViewModel;
     color?: string;
@@ -14,7 +15,9 @@ links?: LinkViewModel[];
     componentWillLoad(): Promise<void>;
+    toggleWidget: () => void;
     fetchWidgetData(api: string): Promise<void>;
     handleLauncherClick: (event: UIEvent) => void;
     handleOverlayClick: (event: UIEvent) => void;
+    handleCloseClick: (_event: UIEvent) => void;
     render(): JSX.Element;
 }
 export {};

dist/types/components/widget-window/widget-window.d.ts

@@ -5,4 +5,6 @@ import '../../stencil.core';
     logo: ImageViewModel;
+    onCloseClick: Function;
     handleWidgetWindowClick: (event: UIEvent) => void;
+    handleCloseClick: (event: UIEvent) => void;
     render(): JSX.Element;
 }

package.json

 {
   "name": "@charlietango/ddb-widget",
-  "version": "0.0.13",
+  "version": "0.0.14",
   "description": "Web Component built with Stencil by Charlie Tango",
@@ -5,0 +5,0 @@ "module": "dist/esm/index.js",

New alerts

Long strings

Supply chain risk

Contains long string literals, which may be a sign of obfuscated or packed code.

Found 1 instance in 1 package

Fixed alerts

Long strings

Supply chain risk

Contains long string literals, which may be a sign of obfuscated or packed code.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

470588

increased by4.66%

Lines of code

4962

increased by2.82%

Worsened metrics

Number of low supply chain risk alerts

21

increased by23.53%

No dependency changes