@everymatrix/general-input 1.22.9 → 1.23.1

package/dist/components/vaadin-button.js

@@ -1,4 +1,4 @@
-import { i, r as registerStyles, Q as TabindexMixin, l as FocusMixin, E as ElementMixin, g as ThemableMixin, H as ControllerMixin, P as PolymerElement, T as TooltipController, f as defineCustomElement, h as html } from './field-mixin.js';
+import { i, r as registerStyles, N as TabindexMixin, l as FocusMixin, E as ElementMixin, T as ThemableMixin, C as ControllerMixin, P as PolymerElement, h as html, g as TooltipController } from './field-mixin.js';
 import { A as ActiveMixin } from './active-mixin.js';
 
 const button = i`
@@ -21,7 +21,6 @@ const button = i`
     -webkit-tap-highlight-color: transparent;
     -webkit-font-smoothing: antialiased;
     -moz-osx-font-smoothing: grayscale;
-    flex-shrink: 0;
   }
 
   /* Set only for the internal parts so we don't affect the host vertical alignment */
@@ -52,7 +51,10 @@ const button = i`
     /* We rely on the host always being relative */
     position: absolute;
     z-index: 1;
-    inset: 0;
+    top: 0;
+    right: 0;
+    bottom: 0;
+    left: 0;
     background-color: currentColor;
     border-radius: inherit;
     opacity: 0;
@@ -197,14 +199,16 @@ const button = i`
 
   /* Icons */
 
-  [part] ::slotted(vaadin-icon) {
+  [part] ::slotted(vaadin-icon),
+  [part] ::slotted(iron-icon) {
     display: inline-block;
     width: var(--lumo-icon-size-m);
     height: var(--lumo-icon-size-m);
   }
 
   /* Vaadin icons are based on a 16x16 grid (unlike Lumo and Material icons with 24x24), so they look too big by default */
-  [part] ::slotted(vaadin-icon[icon^='vaadin:']) {
+  [part] ::slotted(vaadin-icon[icon^='vaadin:']),
+  [part] ::slotted(iron-icon[icon^='vaadin:']) {
     padding: 0.25em;
     box-sizing: border-box !important;
   }
@@ -256,90 +260,7 @@ registerStyles('vaadin-button', button, { moduleId: 'lumo-button' });
 
 /**
  * @license
- * Copyright (c) 2017 - 2023 Vaadin Ltd.
- * This program is available under Apache License Version 2.0, available at https://vaadin.com/license/
- */
-
-const buttonStyles = i`
-  :host {
-    display: inline-block;
-    position: relative;
-    outline: none;
-    white-space: nowrap;
-    -webkit-user-select: none;
-    -moz-user-select: none;
-    user-select: none;
-  }
-
-  :host([hidden]) {
-    display: none !important;
-  }
-
-  /* Aligns the button with form fields when placed on the same line.
-  Note, to make it work, the form fields should have the same "::before" pseudo-element. */
-  .vaadin-button-container::before {
-    content: '\\2003';
-    display: inline-block;
-    width: 0;
-    max-height: 100%;
-  }
-
-  .vaadin-button-container {
-    display: inline-flex;
-    align-items: center;
-    justify-content: center;
-    text-align: center;
-    width: 100%;
-    height: 100%;
-    min-height: inherit;
-    text-shadow: inherit;
-  }
-
-  [part='prefix'],
-  [part='suffix'] {
-    flex: none;
-  }
-
-  [part='label'] {
-    white-space: nowrap;
-    overflow: hidden;
-    text-overflow: ellipsis;
-  }
-
-  @media (forced-colors: active) {
-    :host {
-      outline: 1px solid;
-      outline-offset: -1px;
-    }
-
-    :host([focused]) {
-      outline-width: 2px;
-    }
-
-    :host([disabled]) {
-      outline-color: GrayText;
-    }
-  }
-`;
-
-const buttonTemplate = (html) => html`
-  <div class="vaadin-button-container">
-    <span part="prefix" aria-hidden="true">
-      <slot name="prefix"></slot>
-    </span>
-    <span part="label">
-      <slot></slot>
-    </span>
-    <span part="suffix" aria-hidden="true">
-      <slot name="suffix"></slot>
-    </span>
-  </div>
-  <slot name="tooltip"></slot>
-`;
-
-/**
- * @license
- * Copyright (c) 2017 - 2023 Vaadin Ltd.
+ * Copyright (c) 2017 - 2022 Vaadin Ltd.
  * This program is available under Apache License Version 2.0, available at https://vaadin.com/license/
  */
 
@@ -362,9 +283,7 @@ const ButtonMixin = (superClass) =>
          * @protected
          */
         tabindex: {
-          type: Number,
           value: 0,
-          reflectToAttribute: true,
         },
       };
     }
@@ -410,10 +329,6 @@ const ButtonMixin = (superClass) =>
     _onKeyDown(event) {
       super._onKeyDown(event);
 
-      if (event.altKey || event.shiftKey || event.ctrlKey || event.metaKey) {
-        return;
-      }
-
       if (this._activeKeys.includes(event.key)) {
         event.preventDefault();
 
@@ -426,12 +341,10 @@ const ButtonMixin = (superClass) =>
 
 /**
  * @license
- * Copyright (c) 2017 - 2023 Vaadin Ltd.
+ * Copyright (c) 2017 - 2022 Vaadin Ltd.
  * This program is available under Apache License Version 2.0, available at https://vaadin.com/license/
  */
 
-registerStyles('vaadin-button', buttonStyles, { moduleId: 'vaadin-button-styles' });
-
 /**
  * `<vaadin-button>` is an accessible and customizable button that allows users to perform actions.
  *
@@ -458,9 +371,8 @@ registerStyles('vaadin-button', buttonStyles, { moduleId: 'vaadin-button-styles'
  * `focus-ring` | Set when the button is focused using the keyboard.
  * `focused`    | Set when the button is focused.
  *
- * See [Styling Components](https://vaadin.com/docs/latest/styling/styling-components) documentation.
+ * See [Styling Components](https://vaadin.com/docs/latest/styling/custom-theme/styling-components) documentation.
  *
- * @customElement
  * @extends HTMLElement
  * @mixes ButtonMixin
  * @mixes ControllerMixin
@@ -473,7 +385,66 @@ class Button extends ButtonMixin(ElementMixin(ThemableMixin(ControllerMixin(Poly
   }
 
   static get template() {
-    return buttonTemplate(html);
+    return html`
+      <style>
+        :host {
+          display: inline-block;
+          position: relative;
+          outline: none;
+          white-space: nowrap;
+          -webkit-user-select: none;
+          -moz-user-select: none;
+          user-select: none;
+        }
+
+        :host([hidden]) {
+          display: none !important;
+        }
+
+        /* Aligns the button with form fields when placed on the same line.
+          Note, to make it work, the form fields should have the same "::before" pseudo-element. */
+        .vaadin-button-container::before {
+          content: '\\2003';
+          display: inline-block;
+          width: 0;
+          max-height: 100%;
+        }
+
+        .vaadin-button-container {
+          display: inline-flex;
+          align-items: center;
+          justify-content: center;
+          text-align: center;
+          width: 100%;
+          height: 100%;
+          min-height: inherit;
+          text-shadow: inherit;
+        }
+
+        [part='prefix'],
+        [part='suffix'] {
+          flex: none;
+        }
+
+        [part='label'] {
+          white-space: nowrap;
+          overflow: hidden;
+          text-overflow: ellipsis;
+        }
+      </style>
+      <div class="vaadin-button-container">
+        <span part="prefix" aria-hidden="true">
+          <slot name="prefix"></slot>
+        </span>
+        <span part="label">
+          <slot></slot>
+        </span>
+        <span part="suffix" aria-hidden="true">
+          <slot name="suffix"></slot>
+        </span>
+      </div>
+      <slot name="tooltip"></slot>
+    `;
   }
 
   /** @protected */
@@ -485,6 +456,6 @@ class Button extends ButtonMixin(ElementMixin(ThemableMixin(ControllerMixin(Poly
   }
 }
 
-defineCustomElement(Button);
+customElements.define(Button.is, Button);
 
 export { Button as B, button as b };