@lion/ui 0.22.0 → 0.24.0

package/components/button/src/LionButtonReset.js

@@ -32,7 +32,6 @@ export class LionButtonReset extends LionButton {
     /** @type {EventListener} */
     this.__preventEventLeakage = this.__preventEventLeakage.bind(this);
   }
-
   connectedCallback() {
     super.connectedCallback();
     // Old browsers (IE11, Old Edge, Firefox ESR 60) don't have the `.form`
@@ -41,7 +40,6 @@ export class LionButtonReset extends LionButton {
       this._setupSubmitAndResetHelperOnConnected();
     });
   }
-
   disconnectedCallback() {
     super.disconnectedCallback();
     this._teardownSubmitAndResetHelperOnDisconnected();
@@ -67,7 +65,6 @@ export class LionButtonReset extends LionButton {
     /** @type {HTMLFormElement|null} */
     this._form = this.__submitAndResetHelperButton.form;
     this.removeChild(this.__submitAndResetHelperButton);
-
     if (this._form) {
       this._form.addEventListener('click', this.__preventEventLeakage);
     }
@@ -96,7 +93,6 @@ export class LionButtonReset extends LionButton {
     if (!this._form) {
       await this.updateComplete;
     }
-
     if ((this.type === 'submit' || this.type === 'reset') && ev.target === this && this._form) {
       /**
        * Here, we make sure our button is compatible with a native form, by firing a click
@@ -107,7 +103,6 @@ export class LionButtonReset extends LionButton {
        * absolute minimum.
        */
       this.__submitAndResetHelperButton.type = this.type;
-
       this._form.appendChild(this.__submitAndResetHelperButton);
       // Form submission or reset will happen
       this.__submitAndResetHelperButton.click();

package/components/button/src/LionButtonSubmit.js

@@ -7,7 +7,6 @@ import { LionButtonReset } from './LionButtonReset.js';
 
 /** @type {WeakMap<HTMLFormElement, HelperRegistration>} */
 const implicitHelperMap = new WeakMap();
-
 function createImplicitSubmitHelperButton() {
   const buttonEl = document.createElement('button');
   buttonEl.tabIndex = -1;
@@ -48,9 +47,8 @@ export class LionButtonSubmit extends LionButtonReset {
    * @protected
    */
   get _nativeButtonNode() {
-    return implicitHelperMap.get(/** @type {HTMLFormElement} */ (this._form))?.helper || null;
+    return implicitHelperMap.get(/** @type {HTMLFormElement} */ this._form)?.helper || null;
   }
-
   constructor() {
     super();
     this.type = 'submit';
@@ -58,17 +56,14 @@ export class LionButtonSubmit extends LionButtonReset {
     /** @type {HTMLButtonElement|null} */
     this.__implicitSubmitHelperButton = null;
   }
-
   _setupSubmitAndResetHelperOnConnected() {
     super._setupSubmitAndResetHelperOnConnected();
-
     if (!this._form || this.type !== 'submit') {
       return;
     }
     /** @type {HTMLFormElement} */
     const form = this._form;
     const registrationForCurForm = implicitHelperMap.get(this._form);
-
     if (!registrationForCurForm) {
       const buttonEl = createImplicitSubmitHelperButton();
       const wrapperEl = document.createElement('div');
@@ -83,19 +78,19 @@ export class LionButtonSubmit extends LionButtonReset {
       form.appendChild(wrapperEl);
 
       // Prevent that the just created button gets lost during rerender
-      implicitHelperMap.get(form)?.observer.observe(wrapperEl, { childList: true });
+      implicitHelperMap.get(form)?.observer.observe(wrapperEl, {
+        childList: true,
+      });
     }
     implicitHelperMap.get(form)?.lionButtons.add(this);
   }
-
   _teardownSubmitAndResetHelperOnDisconnected() {
     super._teardownSubmitAndResetHelperOnDisconnected();
-
     if (this._form) {
       // If we are the last button to leave the form, clean up the
-      const registrationForCurForm = /** @type {HelperRegistration} */ (
-        implicitHelperMap.get(/** @type {HTMLFormElement} */ (this._form))
-      );
+      const registrationForCurForm =
+        /** @type {HelperRegistration} */
+        implicitHelperMap.get(/** @type {HTMLFormElement} */ this._form);
       if (registrationForCurForm) {
         registrationForCurForm.lionButtons.delete(this);
         if (!registrationForCurForm.lionButtons.size) {

package/components/button/test/demos.screenshots-test.js

@@ -2,60 +2,99 @@
 /* globals capture getStoryPage */
 
 const selector = 'lion-button';
-
 describe('buttons-button', () => {
   it('main', async () => {
     const id = 'buttons-button--main';
     const page = await getStoryPage(id);
-    await capture({ selector, id, page });
+    await capture({
+      selector,
+      id,
+      page,
+    });
   });
   it('main-hovered', async () => {
     const id = 'buttons-button--main';
     const page = await getStoryPage(id);
     await page.hover(selector);
-    await capture({ selector, id: `${id}-hovered`, page });
+    await capture({
+      selector,
+      id: `${id}-hovered`,
+      page,
+    });
   });
   it('main-focused', async () => {
     const id = 'buttons-button--main';
     const page = await getStoryPage(id);
     await page.focus(selector);
-    await capture({ selector, id: `${id}-focused`, page });
+    await capture({
+      selector,
+      id: `${id}-focused`,
+      page,
+    });
   });
   it('handler', async () => {
     const id = 'buttons-button--handler';
     const page = await getStoryPage(id);
-    await capture({ selector, id, page });
+    await capture({
+      selector,
+      id,
+      page,
+    });
   });
   it('icon-button', async () => {
     const id = 'buttons-button--icon-button';
     const page = await getStoryPage(id);
-    await capture({ selector, id, page });
+    await capture({
+      selector,
+      id,
+      page,
+    });
   });
   it('icon-only', async () => {
     const id = 'buttons-button--icon-only';
     const page = await getStoryPage(id);
-    await capture({ selector, id, page });
+    await capture({
+      selector,
+      id,
+      page,
+    });
   });
   it('icon-only-hovered', async () => {
     const id = 'buttons-button--icon-only';
     const page = await getStoryPage(id);
     await page.hover(selector);
-    await capture({ selector, id: `${id}-hovered`, page });
+    await capture({
+      selector,
+      id: `${id}-hovered`,
+      page,
+    });
   });
   it('icon-only-focused', async () => {
     const id = 'buttons-button--icon-only';
     const page = await getStoryPage(id);
     await page.focus(selector);
-    await capture({ selector, id: `${id}-focused`, page });
+    await capture({
+      selector,
+      id: `${id}-focused`,
+      page,
+    });
   });
   it('disabled', async () => {
     const id = 'buttons-button--disabled';
     const page = await getStoryPage(id);
-    await capture({ selector, id, page });
+    await capture({
+      selector,
+      id,
+      page,
+    });
   });
   it('within-form', async () => {
     const id = 'buttons-button--within-form';
     const page = await getStoryPage(id);
-    await capture({ selector, id, page });
+    await capture({
+      selector,
+      id,
+      page,
+    });
   });
 });

package/components/button/test/lion-button.test.js

@@ -1,7 +1,6 @@
 import { LionButtonSuite } from '../test-suites/LionButton.suite.js';
 import { LionButtonResetSuite } from '../test-suites/LionButtonReset.suite.js';
 import { LionButtonSubmitSuite } from '../test-suites/LionButtonSubmit.suite.js';
-
 describe('lion-button', () => {
   LionButtonSuite();
   LionButtonResetSuite();