@internetarchive/ia-sharing-options - npm Package Compare versions

Comparing version 0.0.0-alpha.f838473 to 0.0.1

custom-elements.json

@@ -32,2 +32,7 @@ {
           "description": "Item type (book, audio, video, etc.)",
+        },
+        {
+          "name": "renderHeader",
+          "type": "Boolean",
+          "description": "draws panel header",
         }
@@ -34,0 +39,0 @@ ],

package.json

 {
   "name": "@internetarchive/ia-sharing-options",
-  "version": "0.0.0-alpha.f838473",
+  "version": "0.0.1",
   "description": "Sharing options for Internet Archive items",
-  "author": "Shane Riley, Internet Archive",
+  "author": "Shane Riley, Isa Herico Velasco, Internet Archive",
   "license": "AGPL-3.0-only",
@@ -22,3 +22,2 @@ "main": "index.js",
   "dependencies": {
-    "@internetarchive/icon-collapse-sidebar": "^1.1.0",
     "@internetarchive/icon-email": "^1.1.1",
@@ -34,3 +33,3 @@ "@internetarchive/icon-facebook": "^1.1.1",
   "devDependencies": {
-    "@internetarchive/ia-menu-slider": "0.0.2-alpha.09d6bce",
+    "@internetarchive/ia-menu-slider": "^0.0.3-alpha.2",
     "@internetarchive/icon-share": "^1.1.0",
@@ -37,0 +36,0 @@ "@open-wc/eslint-config": "^2.0.0",

src/ia-sharing-options.js

 import { classMap } from 'lit-html/directives/class-map';
 import { html, LitElement } from 'lit-element';
-import closeIcon from '@internetarchive/icon-collapse-sidebar';
+import { nothing } from 'lit-html';
 import '@internetarchive/icon-link/icon-link.js';
@@ -37,2 +37,3 @@ import sharingOptionsCSS from './styles/ia-sharing-options.js';
       type: { type: String },
+      renderHeader: { type: Boolean },
     };
@@ -93,3 +94,3 @@ }
   get iframeEmbed() {
-    return html`<iframe src="https://archive.org/embed/${this.identifier}" width="560" height="384" frameborder="0" webkitallowfullscreen="true" mozallowfullscreen="true" allowfullscreen></iframe>`;
+    return html`<iframe src="https://${this.baseHost}/embed/${this.identifier}" width="560" height="384" frameborder="0" webkitallowfullscreen="true" mozallowfullscreen="true" allowfullscreen></iframe>`;
   }
@@ -110,11 +111,5 @@
 
-  unsetSelectedMenuOption(e) {
-    e.preventDefault();
-    this.dispatchEvent(new CustomEvent('menuTypeSelected', {
-      bubbles: true,
-      composed: true,
-      detail: {
-        id: 'share',
-      },
-    }));
+  get header() {
+    const header = html`<header><h3>Share this ${this.type}</h3></header>`;
+    return this.renderHeader ? header : nothing;
   }
@@ -124,6 +119,3 @@
     return html`
-      <header>
-        <h3>Share this ${this.type}</h3>
-        <a href="#" class="close" @click=${this.unsetSelectedMenuOption}>${closeIcon}</a>
-      </header>
+      ${this.header}
       <ul>
@@ -133,3 +125,3 @@ ${this.sharingItems}
         <div class=${classMap({ visible: this.embedOptionsVisible, embed: true })}>
-          <h4>Iframe Embed</h4>
+          <h4>Embed</h4>
           <div class="code" @click=${copyToClipboard}>
@@ -139,3 +131,3 @@ <textarea readonly="readonly">${this.iframeEmbed}</textarea>
           </div>
-          <h4>Embed for wordpress.com hosted blogs and archive.org item <description> tags</h4>
+          <h4>Embed for wordpress.com hosted blogs and archive.org item &lt;description&gt; tags</h4>
           <div class="code" @click=${copyToClipboard}>
@@ -142,0 +134,0 @@ <textarea readonly="readonly">${this.bbcodeEmbed}</textarea>

src/styles/ia-sharing-options.js

@@ -7,3 +7,2 @@ import { css } from 'lit-element';
   height: 100%;
-  padding: 1.5rem 1rem;
   overflow-y: auto;
@@ -16,3 +15,2 @@ font-size: 1.4rem;
   display: flex;
-  justify-content: space-between;
   align-items: baseline;
@@ -31,8 +29,2 @@ }
 
-a.close {
-  justify-self: end;
-  --iconWidth: 18px;
-  --iconHeight: 18px;
-}
-
 ul {
@@ -39,0 +31,0 @@ padding: 0;

test/ia-sharing-options.test.js

@@ -1,7 +0,2 @@
-import {
-  html,
-  fixture,
-  expect,
-  oneEvent,
-} from '@open-wc/testing';
+import { html, fixture, expect } from '@open-wc/testing';
 import sinon from 'sinon';
@@ -52,30 +47,22 @@ import { IASharingOptions } from '../src/ia-sharing-options.js';
 
-  it('emits a custom event to close the menu', async () => {
+  it('toggles visibility of embed options', async () => {
     const el = await fixture(container());
 
-    setTimeout(() => (
-      el.unsetSelectedMenuOption(new Event('click'))
-    ));
-    const response = await oneEvent(el, 'menuTypeSelected');
+    el.toggleEmbedOptions(new Event('click'));
+    await el.updateComplete;
 
-    expect(response).to.exist;
+    expect(el.embedOptionsVisible).to.equal(true);
   });
 
-  it('closes the menu when close element clicked', async () => {
-    IASharingOptions.prototype.unsetSelectedMenuOption = sinon.fake();
-
+  it('does not show internal header by default', async () => {
     const el = await fixture(container());
-
-    el.shadowRoot.querySelector('.close').click();
-    expect(el.unsetSelectedMenuOption.callCount).to.equal(1);
+    expect(el.shadowRoot.querySelector('header')).to.be.null;
   });
 
-  it('toggles visibility of embed options', async () => {
+  it('does shows internal header when requested', async () => {
     const el = await fixture(container());
-
-    el.toggleEmbedOptions(new Event('click'));
+    el.renderHeader = true;
     await el.updateComplete;
-
-    expect(el.embedOptionsVisible).to.equal(true);
+    expect(el.shadowRoot.querySelector('header')).to.not.be.null;
   });
 });

New alerts

New author

Supply chain risk

A new npm collaborator published a version of the package for the first time. New collaborators are usually benign additions to a project, but do indicate a change to the security surface area of a package.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

56011

increased by0.24%

Dependency count

8

decreased by-11.11%

Worsened metrics

Lines of code

437

decreased by-4.17%

Number of medium supply chain risk alerts

1

increased byInfinity%

Dependency changes

• - Removed@internetarchive/icon-collapse-sidebar@^1.1.0

• - Removed@internetarchive/icon-collapse-sidebar@1.3.4(transitive)