@muonic/muon 0.0.2-beta.41 → 0.0.2-beta.43

package/.nycrc

@@ -7,7 +7,8 @@
   "exclude": [
     "**/modular-scale.js",
     "tests",
-    "tokens/**/string.js"
+    "tokens/**/string.js",
+    "js"
   ],
   "check-coverage": true,
   "lines": 99,

package/CHANGELOG.md

@@ -2,6 +2,24 @@
 
 All notable changes to this project will be documented in this file. See [standard-version](https://github.com/conventional-changelog/standard-version) for commit guidelines.
 
+### [0.0.2-beta.43](https://github.com/centrica-engineering/muon/compare/v0.0.2-beta.42...v0.0.2-beta.43) (2023-09-07)
+
+
+### Features
+
+* move registry to internal ([ed355c0](https://github.com/centrica-engineering/muon/commit/ed355c07bbd673f715470a75e44df1636e0035a3))
+
+### [0.0.2-beta.42](https://github.com/centrica-engineering/muon/compare/v0.0.2-beta.39...v0.0.2-beta.42) (2023-09-01)
+
+
+### Features
+
+* bubble the detail toggle event ([9a82a2b](https://github.com/centrica-engineering/muon/commit/9a82a2b35ecd29d9c00d9ae4d68b919ba1188c84))
+* inputter detail max width ([f32f699](https://github.com/centrica-engineering/muon/commit/f32f69945a7210765a70ac8d7f0a5bd868992386))
+* inputter detail width tokens ([c61bc6f](https://github.com/centrica-engineering/muon/commit/c61bc6f782b551229a45024ec984f1b4d07307c7))
+* inputter helper toggle event ([987dd38](https://github.com/centrica-engineering/muon/commit/987dd38fe39192906ae5e813a230342aca599dad))
+* virtual component-export ([5b7190e](https://github.com/centrica-engineering/muon/commit/5b7190ec3e96e5ba5ea228a30ecedb1e9d64ca4d))
+
 ### [0.0.2-beta.41](https://github.com/centrica-engineering/muon/compare/v0.0.2-beta.40...v0.0.2-beta.41) (2023-08-23)
 
 ### [0.0.2-beta.40](https://github.com/centrica-engineering/muon/compare/v0.0.2-beta.10...v0.0.2-beta.40) (2023-08-17)

package/js/scoped-custom-element-registry.min.js

@@ -0,0 +1,65 @@
+(function () {
+  /*
+  
+   Copyright (c) 2020 The Polymer Project Authors. All rights reserved.
+   This code may only be used under the BSD style license found at
+   http://polymer.github.io/LICENSE.txt
+   The complete set of authors may be found at
+   http://polymer.github.io/AUTHORS.txt
+   The complete set of contributors may be found at
+   http://polymer.github.io/CONTRIBUTORS.txt
+   Code distributed by Google as part of the polymer project is also
+   subject to an additional IP rights grant found at
+   http://polymer.github.io/PATENTS.txt
+  */
+  'use strict'; function h(b) { var c = 0; return function () { return c < b.length ? { done: !1, value: b[c++] } : { done: !0 } } } function l(b) { var c = "undefined" != typeof Symbol && Symbol.iterator && b[Symbol.iterator]; return c ? c.call(b) : { next: h(b) } } function m(b) { if (!(b instanceof Array)) { b = l(b); for (var c, a = []; !(c = b.next()).done;)a.push(c.value); b = a } return b } var n = "function" == typeof Object.create ? Object.create : function (b) { function c() { } c.prototype = b; return new c };
+  function p(b) { b = ["object" == typeof globalThis && globalThis, b, "object" == typeof window && window, "object" == typeof self && self, "object" == typeof global && global]; for (var c = 0; c < b.length; ++c) { var a = b[c]; if (a && a.Math == Math) return a } throw Error("Cannot find global object"); }
+  var q = p(this), r = function () { function b() { function a() { } new a; Reflect.construct(a, [], function () { }); return new a instanceof a } if ("undefined" != typeof Reflect && Reflect.construct) { if (b()) return Reflect.construct; var c = Reflect.construct; return function (a, d, e) { a = c(a, d); e && Reflect.setPrototypeOf(a, e.prototype); return a } } return function (a, d, e) { void 0 === e && (e = a); e = n(e.prototype || Object.prototype); return Function.prototype.apply.call(a, e, d) || e } }(), t;
+  if ("function" == typeof Object.setPrototypeOf) t = Object.setPrototypeOf; else { var u; a: { var v = { a: !0 }, w = {}; try { w.__proto__ = v; u = w.a; break a } catch (b) { } u = !1 } t = u ? function (b, c) { b.__proto__ = c; if (b.__proto__ !== c) throw new TypeError(b + " is not extensible"); return b } : null } var x = t;
+  if (!ShadowRoot.prototype.createElement) {
+    var y = window.HTMLElement, A = window.customElements.define, B = window.customElements.get, C = window.customElements, D = new WeakMap, E = new WeakMap, F = new WeakMap, G = new WeakMap; window.CustomElementRegistry = function () { this.l = new Map; this.o = new Map; this.j = new Map; this.h = new Map }; window.CustomElementRegistry.prototype.define = function (b, c) {
+      b = b.toLowerCase(); if (void 0 !== this.i(b)) throw new DOMException("Failed to execute 'define' on 'CustomElementRegistry': the name \"" + b + '" has already been used with this registry');
+      if (void 0 !== this.o.get(c)) throw new DOMException("Failed to execute 'define' on 'CustomElementRegistry': this constructor has already been used with this registry"); var a = c.prototype.attributeChangedCallback, d = new Set(c.observedAttributes || []); H(c, d, a); a = {
+        g: c, connectedCallback: c.prototype.connectedCallback, disconnectedCallback: c.prototype.disconnectedCallback, adoptedCallback: c.prototype.adoptedCallback, attributeChangedCallback: a, formAssociated: c.formAssociated, formAssociatedCallback: c.prototype.formAssociatedCallback,
+        formDisabledCallback: c.prototype.formDisabledCallback, formResetCallback: c.prototype.formResetCallback, formStateRestoreCallback: c.prototype.formStateRestoreCallback, observedAttributes: d
+      }; this.l.set(b, a); this.o.set(c, a); d = B.call(C, b); d || (d = I(b), A.call(C, b, d)); this === window.customElements && (F.set(c, a), a.s = d); if (d = this.h.get(b)) { this.h.delete(b); d = l(d); for (var e = d.next(); !e.done; e = d.next())e = e.value, E.delete(e), J(e, a, !0) } a = this.j.get(b); void 0 !== a && (a.resolve(c), this.j.delete(b)); return c
+    }; window.CustomElementRegistry.prototype.upgrade =
+      function () { K.push(this); C.upgrade.apply(C, arguments); K.pop() }; window.CustomElementRegistry.prototype.get = function (b) { var c; return null == (c = this.l.get(b)) ? void 0 : c.g }; window.CustomElementRegistry.prototype.i = function (b) { return this.l.get(b) }; window.CustomElementRegistry.prototype.whenDefined = function (b) { var c = this.i(b); if (void 0 !== c) return Promise.resolve(c.g); var a = this.j.get(b); void 0 === a && (a = {}, a.promise = new Promise(function (d) { return a.resolve = d }), this.j.set(b, a)); return a.promise }; window.CustomElementRegistry.prototype.m =
+        function (b, c, a) { var d = this.h.get(c); d || this.h.set(c, d = new Set); a ? d.add(b) : d.delete(b) }; var L; window.HTMLElement = function () { var b = L; if (b) return L = void 0, b; var c = F.get(this.constructor); if (!c) throw new TypeError("Illegal constructor (custom element class must be registered with global customElements registry to be newable)"); b = Reflect.construct(y, [], c.s); Object.setPrototypeOf(b, this.constructor.prototype); D.set(b, c); return b }; window.HTMLElement.prototype = y.prototype; var I = function (b) {
+          function c() {
+            var a =
+              Reflect.construct(y, [], this.constructor); Object.setPrototypeOf(a, HTMLElement.prototype); a: { var d = a.getRootNode(); if (!(d === document || d instanceof ShadowRoot)) { d = K[K.length - 1]; if (d instanceof CustomElementRegistry) { var e = d; break a } d = d.getRootNode(); d === document || d instanceof ShadowRoot || (d = (null == (e = G.get(d)) ? void 0 : e.getRootNode()) || document) } e = d.customElements } e = e || window.customElements; (d = e.i(b)) ? J(a, d) : E.set(a, e); return a
+          } q.Object.defineProperty(c, "formAssociated", {
+            configurable: !0, enumerable: !0,
+            get: function () { var a = window.customElements.i(b); return a ? a.formAssociated : !1 }
+          }); c.prototype.connectedCallback = function () { var a = D.get(this); a ? a.connectedCallback && a.connectedCallback.apply(this, arguments) : E.get(this).m(this, b, !0) }; c.prototype.disconnectedCallback = function () { var a = D.get(this); a ? a.disconnectedCallback && a.disconnectedCallback.apply(this, arguments) : E.get(this).m(this, b, !1) }; c.prototype.adoptedCallback = function () {
+            var a, d; null == (a = D.get(this)) || null == (d = a.adoptedCallback) || d.apply(this,
+              arguments)
+          }; c.prototype.formAssociatedCallback = function () { var a = D.get(this); if (a && a.formAssociated) { var d; null == a || null == (d = a.formAssociatedCallback) || d.apply(this, arguments) } }; c.prototype.formDisabledCallback = function () { var a = D.get(this); if (null == a ? 0 : a.formAssociated) { var d; null == a || null == (d = a.formDisabledCallback) || d.apply(this, arguments) } }; c.prototype.formResetCallback = function () { var a = D.get(this); if (null == a ? 0 : a.formAssociated) { var d; null == a || null == (d = a.formResetCallback) || d.apply(this, arguments) } };
+          c.prototype.formStateRestoreCallback = function () { var a = D.get(this); if (null == a ? 0 : a.formAssociated) { var d; null == a || null == (d = a.formStateRestoreCallback) || d.apply(this, arguments) } }; return c
+        }, H = function (b, c, a) {
+          if (0 !== c.size && void 0 !== a) {
+            var d = b.prototype.setAttribute; d && (b.prototype.setAttribute = function (f, k) { f = f.toLowerCase(); if (c.has(f)) { var z = this.getAttribute(f); d.call(this, f, k); a.call(this, f, z, k) } else d.call(this, f, k) }); var e = b.prototype.removeAttribute; e && (b.prototype.removeAttribute = function (f) {
+              f =
+              f.toLowerCase(); if (c.has(f)) { var k = this.getAttribute(f); e.call(this, f); a.call(this, f, k, null) } else e.call(this, f)
+            }); var g = b.prototype.toggleAttribute; g && (b.prototype.toggleAttribute = function (f, k) { f = f.toLowerCase(); if (c.has(f)) { var z = this.getAttribute(f); g.call(this, f, k); k = this.getAttribute(f); a.call(this, f, z, k) } else g.call(this, f, k) })
+          }
+        }, M = function (b) { var c = Object.getPrototypeOf(b); if (c !== window.HTMLElement) return c === y ? Object.setPrototypeOf(b, window.HTMLElement) : M(c) }, J = function (b, c, a) {
+          a = void 0 ===
+            a ? !1 : a; Object.setPrototypeOf(b, c.g.prototype); D.set(b, c); L = b; try { new c.g } catch (d) { M(c.g), new c.g } c.attributeChangedCallback && c.observedAttributes.forEach(function (d) { b.hasAttribute(d) && c.attributeChangedCallback.call(b, d, null, b.getAttribute(d)) }); a && c.connectedCallback && b.isConnected && c.connectedCallback.call(b)
+        }, N = Element.prototype.attachShadow; Element.prototype.attachShadow = function (b) { var c = N.apply(this, arguments); b.customElements && (c.customElements = b.customElements); return c }; var K = [document],
+          O = function (b, c, a) { var d = (a ? Object.getPrototypeOf(a) : b.prototype)[c]; b.prototype[c] = function () { K.push(this); var e = d.apply(a || this, arguments); void 0 !== e && G.set(e, this); K.pop(); return e } }; O(ShadowRoot, "createElement", document); O(ShadowRoot, "importNode", document); O(Element, "insertAdjacentHTML"); var P = function (b) { var c = Object.getOwnPropertyDescriptor(b.prototype, "innerHTML"); Object.defineProperty(b.prototype, "innerHTML", Object.assign({}, c, { set: function (a) { K.push(this); c.set.call(this, a); K.pop() } })) }; P(Element);
+    P(ShadowRoot); Object.defineProperty(window, "customElements", { value: new CustomElementRegistry, configurable: !0, writable: !0 }); if (window.ElementInternals && window.ElementInternals.prototype.setFormValue) {
+      var Q = new WeakMap, R = HTMLElement.prototype.attachInternals, methods = ["setFormValue", "setValidity", "checkValidity", "reportValidity"]; HTMLElement.prototype.attachInternals = function (b) { for (var c = [], a = 0; a < arguments.length; ++a)c[a] = arguments[a]; c = R.call.apply(R, [this].concat(m(c))); Q.set(c, this); return c }; methods.forEach(function (b) {
+        var c =
+          window.ElementInternals.prototype, a = c[b]; c[b] = function (d) { for (var e = [], g = 0; g < arguments.length; ++g)e[g] = arguments[g]; g = Q.get(this); if (!0 === D.get(g).formAssociated) return null == a ? void 0 : a.call.apply(a, [this].concat(m(e))); throw new DOMException("Failed to execute " + a + " on 'ElementInternals': The target element is not a form-associated custom element."); }
+      }); var RadioNodeList = function (b) { var c = r(Array, [].concat(m(b)), this.constructor); c.h = b; return c }, S = RadioNodeList, T = Array; S.prototype = n(T.prototype);
+      S.prototype.constructor = S; if (x) x(S, T); else for (var U in T) if ("prototype" != U) if (Object.defineProperties) { var V = Object.getOwnPropertyDescriptor(T, U); V && Object.defineProperty(S, U, V) } else S[U] = T[U]; S.u = T.prototype; q.Object.defineProperty(RadioNodeList.prototype, "value", { configurable: !0, enumerable: !0, get: function () { var b; return (null == (b = this.h.find(function (c) { return !0 === c.checked })) ? void 0 : b.value) || "" } }); var HTMLFormControlsCollection = function (b) {
+        var c = this, a = new Map; b.forEach(function (d, e) {
+          var g = d.getAttribute("name"),
+          f = a.get(g) || []; c[+e] = d; f.push(d); a.set(g, f)
+        }); this.length = b.length; a.forEach(function (d, e) { d && (c[e] = 1 === d.length ? d[0] : new RadioNodeList(d)) })
+      }; HTMLFormControlsCollection.prototype.namedItem = function (b) { return this[b] }; var W = Object.getOwnPropertyDescriptor(HTMLFormElement.prototype, "elements"); Object.defineProperty(HTMLFormElement.prototype, "elements", { get: function () { var b = W.get.call(this, []), c = []; b = l(b); for (var a = b.next(); !a.done; a = b.next()) { a = a.value; var d = D.get(a); d && !0 !== d.formAssociated || c.push(a) } return new HTMLFormControlsCollection(c) } })
+    }
+  };
+}).call(typeof globalThis === 'object' ? globalThis : window);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@muonic/muon",
-  "version": "0.0.2-beta.41",
+  "version": "0.0.2-beta.43",
   "description": "",
   "main": "index.js",
   "scripts": {
@@ -28,7 +28,6 @@
     "@web/dev-server-rollup": "0.5.2",
     "@web/dev-server-storybook": "0.7.4",
     "@web/storybook-prebuilt": "0.1.37",
-    "@webcomponents/scoped-custom-element-registry": "0.0.9",
     "app-root-path": "3.1.0",
     "autoprefixer": "10.4.14",
     "chokidar": "3.5.3",
@@ -38,7 +37,7 @@
     "deepmerge": "4.3.1",
     "glob": "10.2.2",
     "glob-to-regexp": "0.4.1",
-    "lit": "2.7.3",
+    "lit": "2.8.0",
     "lodash": "4.17.21",
     "path-is-inside": "1.0.2",
     "postcss": "8.4.27",

package/rollup.config.mjs

@@ -3,7 +3,7 @@ import virtual from '@rollup/plugin-virtual';
 import { nodeResolve } from '@rollup/plugin-node-resolve';
 import { createBasicConfig } from '@open-wc/building-rollup';
 import path from 'path';
-import { componentDefiner, getDestination } from '@muonic/muon/scripts/utils/index.mjs';
+import { componentDefiner, componentImportExport, getDestination } from '@muonic/muon/scripts/utils/index.mjs';
 import { rollupPlugins } from '@muonic/muon/scripts/rollup-plugins.mjs';
 import minifyHTMLPlugin from 'rollup-plugin-minify-html-literals';
 
@@ -17,7 +17,8 @@ export default merge(config, {
   plugins: [
     minifyHTMLPlugin.default(),
     virtual({
-      'component-definitions.js': componentDefiner()
+      'component-definitions.js': componentDefiner(),
+      'component-export.js': componentImportExport()
     }),
     ...rollupPlugins,
     nodeResolve()

package/scripts/utils/index.mjs

@@ -293,7 +293,7 @@ const createTokens = async () => {
 
 const componentDefiner = async () => {
   const compList = await analyze();
-  let componentDefinition = `import '@webcomponents/scoped-custom-element-registry';`;
+  let componentDefinition = `import '@muonic/muon/js/scoped-custom-element-registry.min.js';`;
 
   componentDefinition += compList.map(({ file, exportName }) => {
     return `import { ${exportName} } from '${file}';
@@ -313,6 +313,23 @@ const componentDefiner = async () => {
   return componentDefinition;
 };
 
+const componentImportExport = async () => {
+  const compList = await analyze();
+  let componentDefinition = `import '@muonic/muon/js/scoped-custom-element-registry.min.js';`;
+
+  componentDefinition += compList.map(({ file, exportName }) => {
+    return `import { ${exportName} } from '${file}';
+    `;
+  }).join('');
+
+  componentDefinition += `
+    export {
+      ${compList.map(({ exportName }) => exportName).join(',')}
+    };`;
+
+  return componentDefinition;
+};
+
 const runner = async (file, overrideDestination) => {
   const destination = overrideDestination || getDestination();
 
@@ -328,6 +345,7 @@ export {
   filterPathToCustomElements,
   createTokens,
   componentDefiner,
+  componentImportExport,
   runner,
   sourceFilesAnalyzer,
   getAliasPaths

package/tests/scripts/utils/utils-test.mjs

@@ -64,7 +64,7 @@ testRunner('getConfig config file', async (t) => {
 const componentsDefinitionMacro = async (t, expected) => {
   const componentDefinition = await utilsLibrary.componentDefiner();
   t.true(componentDefinition !== undefined);
-  t.true(componentDefinition.indexOf(`import '@webcomponents/scoped-custom-element-registry';`) > -1);
+  t.true(componentDefinition.indexOf(`import '@muonic/muon/js/scoped-custom-element-registry.min.js';`) > -1);
   Object.keys(expected).forEach((component) => {
     t.true(componentDefinition.indexOf(`import { ${expected[component]} } from '${process.cwd()}/components/${component}/src/${component}-component.js';`) > -1);
     t.true(componentDefinition.indexOf(`customElements.define('muon-${component}', ${expected[component]});`) > -1);
@@ -74,6 +74,17 @@ componentsDefinitionMacro.title = (providedTitle, expected) => `${providedTitle}
 
 testRunner('componentDefiner', componentsDefinitionMacro, { card: 'Card', cta: 'Cta', detail: 'Detail', form: 'Form', icon: 'Icon', inputter: 'Inputter', image: 'Image' });
 
+const componentImportExportMacro = async (t, expected) => {
+  const componentImportExport = await utilsLibrary.componentImportExport();
+  t.true(componentImportExport !== undefined);
+  Object.keys(expected).forEach((component) => {
+    t.true(componentImportExport.indexOf(`import { ${expected[component]} } from '${process.cwd()}/components/${component}/src/${component}-component.js';`) > -1);
+  });
+};
+componentImportExportMacro.title = (providedTitle, expected) => `${providedTitle} => ${Object.keys(expected)}`;
+
+testRunner('componentImportExport', componentImportExportMacro, { card: 'Card', cta: 'Cta', detail: 'Detail', form: 'Form', icon: 'Icon', inputter: 'Inputter', image: 'Image' });
+
 testRunner('getAliasPath glob', async (t) => {
   const alias = utilsLibrary.getAliasPaths('glob');
 

package/web-test-runner.browserstack.config.mjs

@@ -23,7 +23,7 @@ export default {
     `<html>
       <head>
         <script type="module">
-          import '@webcomponents/scoped-custom-element-registry';
+          import '@muonic/muon/js/scoped-custom-element-registry.min.js';
         </script>
       </head>
       <body>

package/web-test-runner.config.mjs

@@ -7,7 +7,7 @@ export default {
     `<html>
       <head>
         <script type="module">
-          import '@webcomponents/scoped-custom-element-registry';
+          import '@muonic/muon/js/scoped-custom-element-registry.min.js';
         </script>
       </head>
       <body>
@@ -39,6 +39,10 @@ export default {
       branches: 99,
       functions: 99,
       lines: 99
-    }
+    },
+    exclude: [
+      '**/node_modules/**',
+      '**/js/*.min.js'
+    ]
   }
 };