fix: Add sideEffects to package.json; Fix # in MySharingWidgetElement (#67)(#66)

nfreear · nfreear · commit b7426ecb0975 · 2026-01-24T17:34:03.000Z
* Plus, add `dia.js` entry file - for Dive Into Accessibility. * nfreear/diveintoaccessibility#19
diff --git a/demo/my-search.html b/demo/my-search.html
@@ -1,6 +1,7 @@
 <!doctype html><html lang="en"> <title> my-search </title>
 
   <meta name="viewport" content="width=device-width,initial-scale=1">
+  <meta name="description" content="My page description ...">
 
   <link rel="stylesheet" href="style/app.v2.css" />
 
@@ -11,17 +12,33 @@ <h1> my-search </h1>
 
     <my-search cx="001222343498871500969:-u73i2qfu2s"></my-search>
 
+
+    <my-share-button></my-share-button>
   </my-page>
 
   <script type="importmap"> {
     "imports": {
-      "ndf-elements": "../i.js"
+      "auto:ndf-elements": "../i.js",
+      "ndf-elements/dia": "../src/dia.js",
+      "package.json": "../package.json"
     },
     "myElements": {
       "use": [ "my-search" ]
     }
   } </script>
 
-  <script type="module"> import 'ndf-elements'; </script>
+  <script type="module">
+    // import 'auto:ndf-elements';
+    import {
+      MySharingWidgetElement, MySearchElement
+    } from 'ndf-elements/dia';
+    import PKG from 'package.json' with { type: 'json' };
+
+    // console.debug('module:', MOD);
+    customElements.define('my-search', MySearchElement);
+    customElements.define('my-share-button', MySharingWidgetElement);
+
+    console.debug('PKG:', PKG);
+  </script>
 
 </html>
diff --git a/package.json b/package.json
@@ -13,10 +13,15 @@
     "./blog": "./src/blog.js",
     "./my-map": "./src/components/MyMapElement.js",
     "./an-form": "./src/an-form.js",
+    "./dia": "./src/dia.js",
     "./experiment": "./src/experiment.js",
     "./util": "./util.js",
     "./web": "./web.js"
   },
+  "sideEffects": [
+    "./i.js",
+    "**/*.css"
+  ],
   "description": "My collection of useful custom elements.",
   "license": "MIT",
   "x-copyright": "© 2021-2025 Nick Freear.",
diff --git a/src/blog.js b/src/blog.js
@@ -9,6 +9,8 @@ export { MyGtagElement } from './components/MyGtagElement.js';
 export { MyLoomEmbedElement } from './components/MyLoomEmbedElement.js';
 export { MyOpenBadgeElement } from './components/MyOpenBadgeElement.js';
 export { MySearchElement } from './components/MySearchElement.js';
+export { MySearchApiElement } from './components/MySearchApiElement.js';
+export { MySharingWidgetElement } from './components/MySharingWidgetElement.js';
 export { MySiteCounterElement } from './components/MySiteCounterElement.js';
 export { MySkipLinkElement } from './components/MySkipLinkElement.js';
 export { MyTranscriptElement } from './components/MyTranscriptElement.js';
diff --git a/src/components/MySearchApiElement.js b/src/components/MySearchApiElement.js
@@ -147,7 +147,7 @@ export class MySearchApiElement extends HTMLElement {
     return { form, results };
   }
 
-  #createElement(tagName, partAttr, attributes = []) {
+  #createElement (tagName, partAttr, attributes = []) {
     const elem = document.createElement(tagName);
     const part = typeof partAttr === 'undefined' || partAttr === -1 ? tagName : partAttr;
     if (partAttr !== false) {
diff --git a/src/components/MySharingWidgetElement.js b/src/components/MySharingWidgetElement.js
@@ -36,9 +36,9 @@ export class MySharingWidgetElement extends HTMLElement {
   }
 
   connectedCallback () {
-    if (!this._supportsShareApi) {
+    if (!this.#supportsShareApi) {
       console.warn('Web Share API not supported');
-      // Was: return;
+      return;
     }
     const formElem = this.#createElements();
 
diff --git a/src/dia.js b/src/dia.js
@@ -0,0 +1,10 @@
+/**
+ * Entry point for "Dive Into Accessibility" (https://github.com/nfreear/elements | license: MIT)
+ */
+import MySearchElement from './components/MySearchElement.js';
+import MySearchApiElement from './components/MySearchApiElement.js';
+import MySharingWidgetElement from './components/MySharingWidgetElement.js';
+import MySiteCounterElement from './components/MySiteCounterElement.js';
+// import MyTestElement from './components/MyTestElement.js';
+
+export { MySharingWidgetElement, MySearchElement, MySearchApiElement, MySiteCounterElement };

Original file line number	Diff line number	Diff line change
`@@ -147,7 +147,7 @@ export class MySearchApiElement extends HTMLElement {`
`147`	`147`	`return { form, results };`
`148`	`148`	`}`
`149`	`149`
`150`		`- #createElement(tagName, partAttr, attributes = []) {`
	`150`	`+ #createElement (tagName, partAttr, attributes = []) {`
`151`	`151`	`const elem = document.createElement(tagName);`
`152`	`152`	`const part = typeof partAttr === 'undefined' \|\| partAttr === -1 ? tagName : partAttr;`
`153`	`153`	`if (partAttr !== false) {`
Original file line number	Diff line number	Diff line change
`@@ -36,9 +36,9 @@ export class MySharingWidgetElement extends HTMLElement {`
`36`	`36`	`}`
`37`	`37`
`38`	`38`	`connectedCallback () {`
`39`		`- if (!this._supportsShareApi) {`
	`39`	`+ if (!this.#supportsShareApi) {`
`40`	`40`	`console.warn('Web Share API not supported');`
`41`		`- // Was: return;`
	`41`	`+ return;`
`42`	`42`	`}`
`43`	`43`	`const formElem = this.#createElements();`
`44`	`44`