@reown/appkit-ui 0.0.3

package/dist/esm/src/composites/wui-icon-link/index.js

@@ -0,0 +1,52 @@
+var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
+    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
+    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+    return c > 3 && r && Object.defineProperty(target, key, r), r;
+};
+import { html, LitElement } from 'lit';
+import { property } from 'lit/decorators.js';
+import '../../components/wui-icon/index.js';
+import { colorStyles, elementStyles, resetStyles } from '../../utils/ThemeUtil.js';
+import { customElement } from '../../utils/WebComponentsUtil.js';
+import styles from './styles.js';
+let WuiIconLink = class WuiIconLink extends LitElement {
+    constructor() {
+        super(...arguments);
+        this.size = 'md';
+        this.disabled = false;
+        this.icon = 'copy';
+        this.iconColor = 'inherit';
+    }
+    render() {
+        const borderRadius = this.size === 'lg' ? '--wui-border-radius-xs' : '--wui-border-radius-xxs';
+        const padding = this.size === 'lg' ? '--wui-spacing-1xs' : '--wui-spacing-2xs';
+        this.style.cssText = `
+    --local-border-radius: var(${borderRadius});
+    --local-padding: var(${padding});
+`;
+        return html `
+      <button ?disabled=${this.disabled} ontouchstart>
+        <wui-icon color=${this.iconColor} size=${this.size} name=${this.icon}></wui-icon>
+      </button>
+    `;
+    }
+};
+WuiIconLink.styles = [resetStyles, elementStyles, colorStyles, styles];
+__decorate([
+    property()
+], WuiIconLink.prototype, "size", void 0);
+__decorate([
+    property({ type: Boolean })
+], WuiIconLink.prototype, "disabled", void 0);
+__decorate([
+    property()
+], WuiIconLink.prototype, "icon", void 0);
+__decorate([
+    property()
+], WuiIconLink.prototype, "iconColor", void 0);
+WuiIconLink = __decorate([
+    customElement('wui-icon-link')
+], WuiIconLink);
+export { WuiIconLink };
+//# sourceMappingURL=index.js.map

package/dist/esm/src/composites/wui-icon-link/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../src/composites/wui-icon-link/index.ts"],"names":[],"mappings":";;;;;;AAAA,OAAO,EAAE,IAAI,EAAE,UAAU,EAAE,MAAM,KAAK,CAAA;AACtC,OAAO,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAA;AAC5C,OAAO,oCAAoC,CAAA;AAC3C,OAAO,EAAE,WAAW,EAAE,aAAa,EAAE,WAAW,EAAE,MAAM,0BAA0B,CAAA;AAElF,OAAO,EAAE,aAAa,EAAE,MAAM,kCAAkC,CAAA;AAChE,OAAO,MAAM,MAAM,aAAa,CAAA;AAGzB,IAAM,WAAW,GAAjB,MAAM,WAAY,SAAQ,UAAU;IAApC;;QAIc,SAAI,GAAa,IAAI,CAAA;QAEJ,aAAQ,GAAG,KAAK,CAAA;QAEjC,SAAI,GAAa,MAAM,CAAA;QAEvB,cAAS,GAAc,SAAS,CAAA;IAkBrD,CAAC;IAfiB,MAAM;QACpB,MAAM,YAAY,GAAG,IAAI,CAAC,IAAI,KAAK,IAAI,CAAC,CAAC,CAAC,wBAAwB,CAAC,CAAC,CAAC,yBAAyB,CAAA;QAC9F,MAAM,OAAO,GAAG,IAAI,CAAC,IAAI,KAAK,IAAI,CAAC,CAAC,CAAC,mBAAmB,CAAC,CAAC,CAAC,mBAAmB,CAAA;QAE9E,IAAI,CAAC,KAAK,CAAC,OAAO,GAAG;iCACQ,YAAY;2BAClB,OAAO;CACjC,CAAA;QAEG,OAAO,IAAI,CAAA;0BACW,IAAI,CAAC,QAAQ;0BACb,IAAI,CAAC,SAAS,SAAS,IAAI,CAAC,IAAI,SAAS,IAAI,CAAC,IAAI;;KAEvE,CAAA;IACH,CAAC;;AA1BsB,kBAAM,GAAG,CAAC,WAAW,EAAE,aAAa,EAAE,WAAW,EAAE,MAAM,CAAC,AAApD,CAAoD;AAG9D;IAAlB,QAAQ,EAAE;yCAA6B;AAEJ;IAAnC,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;6CAAwB;AAEjC;IAAlB,QAAQ,EAAE;yCAA+B;AAEvB;IAAlB,QAAQ,EAAE;8CAAwC;AAVxC,WAAW;IADvB,aAAa,CAAC,eAAe,CAAC;GAClB,WAAW,CA4BvB"}

package/dist/esm/src/composites/wui-icon-link/styles.js

@@ -0,0 +1,27 @@
+import { css } from 'lit';
+export default css `
+  button {
+    border-radius: var(--local-border-radius);
+    color: var(--wui-color-fg-100);
+    padding: var(--local-padding);
+  }
+
+  @media (max-width: 700px) {
+    button {
+      padding: var(--wui-spacing-s);
+    }
+  }
+
+  button > wui-icon {
+    pointer-events: none;
+  }
+
+  button:disabled > wui-icon {
+    color: var(--wui-color-bg-300) !important;
+  }
+
+  button:disabled {
+    background-color: transparent;
+  }
+`;
+//# sourceMappingURL=styles.js.map

package/dist/esm/src/composites/wui-icon-link/styles.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"styles.js","sourceRoot":"","sources":["../../../../../src/composites/wui-icon-link/styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAA;AAEzB,eAAe,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;CAwBjB,CAAA"}

package/dist/esm/src/composites/wui-input-amount/index.js

@@ -0,0 +1,71 @@
+var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
+    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
+    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+    return c > 3 && r && Object.defineProperty(target, key, r), r;
+};
+import { html, LitElement } from 'lit';
+import { property } from 'lit/decorators.js';
+import { elementStyles, resetStyles } from '../../utils/ThemeUtil.js';
+import { customElement } from '../../utils/WebComponentsUtil.js';
+import styles from './styles.js';
+import { createRef, ref } from 'lit/directives/ref.js';
+import { numbersRegex, specialCharactersRegex } from '../../utils/ConstantsUtil.js';
+let WuiInputAmount = class WuiInputAmount extends LitElement {
+    constructor() {
+        super(...arguments);
+        this.inputElementRef = createRef();
+        this.disabled = false;
+        this.value = '';
+        this.placeholder = '0';
+    }
+    render() {
+        if (this.inputElementRef?.value && this.value) {
+            this.inputElementRef.value.value = this.value;
+        }
+        return html `<input
+      ${ref(this.inputElementRef)}
+      type="text"
+      inputmode="decimal"
+      pattern="[0-9,.]*"
+      placeholder=${this.placeholder}
+      ?disabled=${this.disabled}
+      autofocus
+      value=${this.value ?? ''}
+      @input=${this.dispatchInputChangeEvent.bind(this)}
+    /> `;
+    }
+    dispatchInputChangeEvent(e) {
+        const inputChar = e.data;
+        if (inputChar && this.inputElementRef?.value) {
+            if (inputChar === ',') {
+                const inputValue = this.inputElementRef.value.value.replace(',', '.');
+                this.inputElementRef.value.value = inputValue;
+                this.value = `${this.value}${inputValue}`;
+            }
+            else if (!numbersRegex.test(inputChar)) {
+                this.inputElementRef.value.value = this.value.replace(new RegExp(inputChar.replace(specialCharactersRegex, '\\$&'), 'gu'), '');
+            }
+        }
+        this.dispatchEvent(new CustomEvent('inputChange', {
+            detail: this.inputElementRef.value?.value,
+            bubbles: true,
+            composed: true
+        }));
+    }
+};
+WuiInputAmount.styles = [resetStyles, elementStyles, styles];
+__decorate([
+    property({ type: Boolean })
+], WuiInputAmount.prototype, "disabled", void 0);
+__decorate([
+    property({ type: String })
+], WuiInputAmount.prototype, "value", void 0);
+__decorate([
+    property({ type: String })
+], WuiInputAmount.prototype, "placeholder", void 0);
+WuiInputAmount = __decorate([
+    customElement('wui-input-amount')
+], WuiInputAmount);
+export { WuiInputAmount };
+//# sourceMappingURL=index.js.map

package/dist/esm/src/composites/wui-input-amount/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../src/composites/wui-input-amount/index.ts"],"names":[],"mappings":";;;;;;AAAA,OAAO,EAAE,IAAI,EAAE,UAAU,EAAE,MAAM,KAAK,CAAA;AACtC,OAAO,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAA;AAC5C,OAAO,EAAE,aAAa,EAAE,WAAW,EAAE,MAAM,0BAA0B,CAAA;AACrE,OAAO,EAAE,aAAa,EAAE,MAAM,kCAAkC,CAAA;AAChE,OAAO,MAAM,MAAM,aAAa,CAAA;AAChC,OAAO,EAAE,SAAS,EAAE,GAAG,EAAY,MAAM,uBAAuB,CAAA;AAChE,OAAO,EAAE,YAAY,EAAE,sBAAsB,EAAE,MAAM,8BAA8B,CAAA;AAG5E,IAAM,cAAc,GAApB,MAAM,cAAe,SAAQ,UAAU;IAAvC;;QAIE,oBAAe,GAA0B,SAAS,EAAoB,CAAA;QAGzC,aAAQ,GAAG,KAAK,CAAA;QAEjB,UAAK,GAAG,EAAE,CAAA;QAEV,gBAAW,GAAG,GAAG,CAAA;IA8CtD,CAAC;IA3CiB,MAAM;QACpB,IAAI,IAAI,CAAC,eAAe,EAAE,KAAK,IAAI,IAAI,CAAC,KAAK,EAAE,CAAC;YAC9C,IAAI,CAAC,eAAe,CAAC,KAAK,CAAC,KAAK,GAAG,IAAI,CAAC,KAAK,CAAA;QAC/C,CAAC;QAED,OAAO,IAAI,CAAA;QACP,GAAG,CAAC,IAAI,CAAC,eAAe,CAAC;;;;oBAIb,IAAI,CAAC,WAAW;kBAClB,IAAI,CAAC,QAAQ;;cAEjB,IAAI,CAAC,KAAK,IAAI,EAAE;eACf,IAAI,CAAC,wBAAwB,CAAC,IAAI,CAAC,IAAI,CAAC;QAC/C,CAAA;IACN,CAAC;IAGO,wBAAwB,CAAC,CAAa;QAC5C,MAAM,SAAS,GAAG,CAAC,CAAC,IAAI,CAAA;QAExB,IAAI,SAAS,IAAI,IAAI,CAAC,eAAe,EAAE,KAAK,EAAE,CAAC;YAC7C,IAAI,SAAS,KAAK,GAAG,EAAE,CAAC;gBACtB,MAAM,UAAU,GAAG,IAAI,CAAC,eAAe,CAAC,KAAK,CAAC,KAAK,CAAC,OAAO,CAAC,GAAG,EAAE,GAAG,CAAC,CAAA;gBACrE,IAAI,CAAC,eAAe,CAAC,KAAK,CAAC,KAAK,GAAG,UAAU,CAAA;gBAC7C,IAAI,CAAC,KAAK,GAAG,GAAG,IAAI,CAAC,KAAK,GAAG,UAAU,EAAE,CAAA;YAC3C,CAAC;iBAAM,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC,SAAS,CAAC,EAAE,CAAC;gBACzC,IAAI,CAAC,eAAe,CAAC,KAAK,CAAC,KAAK,GAAG,IAAI,CAAC,KAAK,CAAC,OAAO,CACnD,IAAI,MAAM,CAAC,SAAS,CAAC,OAAO,CAAC,sBAAsB,EAAE,MAAM,CAAC,EAAE,IAAI,CAAC,EACnE,EAAE,CACH,CAAA;YACH,CAAC;QACH,CAAC;QAED,IAAI,CAAC,aAAa,CAChB,IAAI,WAAW,CAAC,aAAa,EAAE;YAC7B,MAAM,EAAE,IAAI,CAAC,eAAe,CAAC,KAAK,EAAE,KAAK;YACzC,OAAO,EAAE,IAAI;YACb,QAAQ,EAAE,IAAI;SACf,CAAC,CACH,CAAA;IACH,CAAC;;AAvDsB,qBAAM,GAAG,CAAC,WAAW,EAAE,aAAa,EAAE,MAAM,CAAC,AAAvC,CAAuC;AAMhC;IAAnC,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;gDAAwB;AAEjB;IAAlC,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;6CAAkB;AAEV;IAAlC,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;mDAAyB;AAXzC,cAAc;IAD1B,aAAa,CAAC,kBAAkB,CAAC;GACrB,cAAc,CAyD1B"}

package/dist/esm/src/composites/wui-input-amount/styles.js

@@ -0,0 +1,37 @@
+import { css } from 'lit';
+export default css `
+  :host {
+    position: relative;
+    display: inline-block;
+  }
+
+  input {
+    background: transparent;
+    width: 100%;
+    height: auto;
+    font-family: var(--wui-font-family);
+    color: var(--wui-color-fg-100);
+
+    font-feature-settings: 'case' on;
+    font-size: 32px;
+    font-weight: var(--wui-font-weight-light);
+    caret-color: var(--wui-color-accent-100);
+    line-height: 130%;
+    letter-spacing: -1.28px;
+    box-sizing: border-box;
+    -webkit-appearance: none;
+    -moz-appearance: textfield;
+    padding: 0px;
+  }
+
+  input::-webkit-outer-spin-button,
+  input::-webkit-inner-spin-button {
+    -webkit-appearance: none;
+    margin: 0;
+  }
+
+  input::placeholder {
+    color: var(--wui-color-fg-275);
+  }
+`;
+//# sourceMappingURL=styles.js.map

package/dist/esm/src/composites/wui-input-amount/styles.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"styles.js","sourceRoot":"","sources":["../../../../../src/composites/wui-input-amount/styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAA;AAEzB,eAAe,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAkCjB,CAAA"}

package/dist/esm/src/composites/wui-input-element/index.js

@@ -0,0 +1,34 @@
+var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
+    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
+    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+    return c > 3 && r && Object.defineProperty(target, key, r), r;
+};
+import { html, LitElement } from 'lit';
+import { property } from 'lit/decorators.js';
+import '../../components/wui-icon/index.js';
+import { elementStyles, resetStyles } from '../../utils/ThemeUtil.js';
+import { customElement } from '../../utils/WebComponentsUtil.js';
+import styles from './styles.js';
+let WuiInputElement = class WuiInputElement extends LitElement {
+    constructor() {
+        super(...arguments);
+        this.icon = 'copy';
+    }
+    render() {
+        return html `
+      <button>
+        <wui-icon color="inherit" size="xxs" name=${this.icon}></wui-icon>
+      </button>
+    `;
+    }
+};
+WuiInputElement.styles = [resetStyles, elementStyles, styles];
+__decorate([
+    property()
+], WuiInputElement.prototype, "icon", void 0);
+WuiInputElement = __decorate([
+    customElement('wui-input-element')
+], WuiInputElement);
+export { WuiInputElement };
+//# sourceMappingURL=index.js.map

package/dist/esm/src/composites/wui-input-element/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../src/composites/wui-input-element/index.ts"],"names":[],"mappings":";;;;;;AAAA,OAAO,EAAE,IAAI,EAAE,UAAU,EAAE,MAAM,KAAK,CAAA;AACtC,OAAO,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAA;AAC5C,OAAO,oCAAoC,CAAA;AAC3C,OAAO,EAAE,aAAa,EAAE,WAAW,EAAE,MAAM,0BAA0B,CAAA;AAErE,OAAO,EAAE,aAAa,EAAE,MAAM,kCAAkC,CAAA;AAChE,OAAO,MAAM,MAAM,aAAa,CAAA;AAGzB,IAAM,eAAe,GAArB,MAAM,eAAgB,SAAQ,UAAU;IAAxC;;QAIc,SAAI,GAAa,MAAM,CAAA;IAU5C,CAAC;IAPiB,MAAM;QACpB,OAAO,IAAI,CAAA;;oDAEqC,IAAI,CAAC,IAAI;;KAExD,CAAA;IACH,CAAC;;AAZsB,sBAAM,GAAG,CAAC,WAAW,EAAE,aAAa,EAAE,MAAM,CAAC,AAAvC,CAAuC;AAGjD;IAAlB,QAAQ,EAAE;6CAA+B;AAJ/B,eAAe;IAD3B,aAAa,CAAC,mBAAmB,CAAC;GACtB,eAAe,CAc3B"}

package/dist/esm/src/composites/wui-input-element/styles.js

@@ -0,0 +1,33 @@
+import { css } from 'lit';
+export default css `
+  button {
+    background-color: var(--wui-color-fg-300);
+    border-radius: var(--wui-border-radius-4xs);
+    width: 16px;
+    height: 16px;
+  }
+
+  button:disabled {
+    background-color: var(--wui-color-bg-300);
+  }
+
+  wui-icon {
+    color: var(--wui-color-bg-200) !important;
+  }
+
+  button:focus-visible {
+    background-color: var(--wui-color-fg-250);
+    border: 1px solid var(--wui-color-accent-100);
+  }
+
+  @media (hover: hover) and (pointer: fine) {
+    button:hover:enabled {
+      background-color: var(--wui-color-fg-250);
+    }
+
+    button:active:enabled {
+      background-color: var(--wui-color-fg-225);
+    }
+  }
+`;
+//# sourceMappingURL=styles.js.map

package/dist/esm/src/composites/wui-input-element/styles.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"styles.js","sourceRoot":"","sources":["../../../../../src/composites/wui-input-element/styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAA;AAEzB,eAAe,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA8BjB,CAAA"}

package/dist/esm/src/composites/wui-input-numeric/index.js

@@ -0,0 +1,40 @@
+var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
+    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
+    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+    return c > 3 && r && Object.defineProperty(target, key, r), r;
+};
+import { html, LitElement } from 'lit';
+import { property } from 'lit/decorators.js';
+import { elementStyles, resetStyles } from '../../utils/ThemeUtil.js';
+import { customElement } from '../../utils/WebComponentsUtil.js';
+import styles from './styles.js';
+let WuiInputNumeric = class WuiInputNumeric extends LitElement {
+    constructor() {
+        super(...arguments);
+        this.disabled = false;
+        this.value = '';
+    }
+    render() {
+        return html `<input
+      type="number"
+      maxlength="1"
+      inputmode="numeric"
+      autofocus
+      ?disabled=${this.disabled}
+      value=${this.value}
+    /> `;
+    }
+};
+WuiInputNumeric.styles = [resetStyles, elementStyles, styles];
+__decorate([
+    property({ type: Boolean })
+], WuiInputNumeric.prototype, "disabled", void 0);
+__decorate([
+    property({ type: String })
+], WuiInputNumeric.prototype, "value", void 0);
+WuiInputNumeric = __decorate([
+    customElement('wui-input-numeric')
+], WuiInputNumeric);
+export { WuiInputNumeric };
+//# sourceMappingURL=index.js.map

package/dist/esm/src/composites/wui-input-numeric/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../src/composites/wui-input-numeric/index.ts"],"names":[],"mappings":";;;;;;AAAA,OAAO,EAAE,IAAI,EAAE,UAAU,EAAE,MAAM,KAAK,CAAA;AACtC,OAAO,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAA;AAC5C,OAAO,EAAE,aAAa,EAAE,WAAW,EAAE,MAAM,0BAA0B,CAAA;AACrE,OAAO,EAAE,aAAa,EAAE,MAAM,kCAAkC,CAAA;AAChE,OAAO,MAAM,MAAM,aAAa,CAAA;AAGzB,IAAM,eAAe,GAArB,MAAM,eAAgB,SAAQ,UAAU;IAAxC;;QAI+B,aAAQ,GAAG,KAAK,CAAA;QACjB,UAAK,GAAG,EAAE,CAAA;IAa/C,CAAC;IAViB,MAAM;QACpB,OAAO,IAAI,CAAA;;;;;kBAKG,IAAI,CAAC,QAAQ;cACjB,IAAI,CAAC,KAAK;QAChB,CAAA;IACN,CAAC;;AAhBsB,sBAAM,GAAG,CAAC,WAAW,EAAE,aAAa,EAAE,MAAM,CAAC,AAAvC,CAAuC;AAGhC;IAAnC,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;iDAAwB;AACjB;IAAlC,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;8CAAkB;AALlC,eAAe;IAD3B,aAAa,CAAC,mBAAmB,CAAC;GACtB,eAAe,CAkB3B"}

package/dist/esm/src/composites/wui-input-numeric/styles.js

@@ -0,0 +1,62 @@
+import { css } from 'lit';
+export default css `
+  :host {
+    position: relative;
+    display: inline-block;
+  }
+
+  input {
+    width: 50px;
+    height: 50px;
+    background: var(--wui-color-gray-glass-010);
+    border-radius: var(--wui-border-radius-xs);
+    border: 1px solid var(--wui-color-gray-glass-005);
+    font-family: var(--wui-font-family);
+    font-size: var(--wui-font-size-large);
+    font-weight: var(--wui-font-weight-regular);
+    letter-spacing: var(--wui-letter-spacing-large);
+    text-align: center;
+    color: var(--wui-color-fg-100);
+    caret-color: var(--wui-color-accent-100);
+    transition:
+      background-color var(--wui-ease-inout-power-1) var(--wui-duration-md),
+      border-color var(--wui-ease-inout-power-1) var(--wui-duration-md),
+      box-shadow var(--wui-ease-inout-power-1) var(--wui-duration-md);
+    will-change: background-color, border-color, box-shadow;
+    box-sizing: border-box;
+    -webkit-appearance: none;
+    -moz-appearance: textfield;
+    padding: 0px;
+  }
+
+  input::-webkit-outer-spin-button,
+  input::-webkit-inner-spin-button {
+    -webkit-appearance: none;
+    margin: 0;
+  }
+
+  input[type='number'] {
+    -moz-appearance: textfield;
+  }
+
+  input:disabled {
+    cursor: not-allowed;
+    border: 1px solid var(--wui-color-gray-glass-010);
+    background: var(--wui-color-gray-glass-005);
+  }
+
+  input:focus:enabled {
+    background-color: var(--wui-color-gray-glass-015);
+    border: 1px solid var(--wui-color-accent-100);
+    -webkit-box-shadow: 0px 0px 0px 4px var(--wui-box-shadow-blue);
+    -moz-box-shadow: 0px 0px 0px 4px var(--wui-box-shadow-blue);
+    box-shadow: 0px 0px 0px 4px var(--wui-box-shadow-blue);
+  }
+
+  @media (hover: hover) and (pointer: fine) {
+    input:hover:enabled {
+      background-color: var(--wui-color-gray-glass-015);
+    }
+  }
+`;
+//# sourceMappingURL=styles.js.map

package/dist/esm/src/composites/wui-input-numeric/styles.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"styles.js","sourceRoot":"","sources":["../../../../../src/composites/wui-input-numeric/styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAA;AAEzB,eAAe,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA2DjB,CAAA"}

package/dist/esm/src/composites/wui-input-text/index.js

@@ -0,0 +1,95 @@
+var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
+    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
+    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+    return c > 3 && r && Object.defineProperty(target, key, r), r;
+};
+import { html, LitElement } from 'lit';
+import { property } from 'lit/decorators.js';
+import { ifDefined } from 'lit/directives/if-defined.js';
+import { createRef, ref } from 'lit/directives/ref.js';
+import { classMap } from 'lit/directives/class-map.js';
+import '../../components/wui-icon/index.js';
+import { elementStyles, resetStyles } from '../../utils/ThemeUtil.js';
+import { customElement } from '../../utils/WebComponentsUtil.js';
+import styles from './styles.js';
+let WuiInputText = class WuiInputText extends LitElement {
+    constructor() {
+        super(...arguments);
+        this.inputElementRef = createRef();
+        this.size = 'md';
+        this.disabled = false;
+        this.placeholder = '';
+        this.type = 'text';
+        this.value = '';
+    }
+    render() {
+        const inputClass = `wui-padding-right-${this.inputRightPadding}`;
+        const sizeClass = `wui-size-${this.size}`;
+        const classes = {
+            [sizeClass]: true,
+            [inputClass]: Boolean(this.inputRightPadding)
+        };
+        return html `${this.templateIcon()}
+      <input
+        data-testid="wui-input-text"
+        ${ref(this.inputElementRef)}
+        class=${classMap(classes)}
+        type=${this.type}
+        enterkeyhint=${ifDefined(this.enterKeyHint)}
+        ?disabled=${this.disabled}
+        placeholder=${this.placeholder}
+        @input=${this.dispatchInputChangeEvent.bind(this)}
+        .value=${this.value || ''}
+      />
+      <slot></slot>`;
+    }
+    templateIcon() {
+        if (this.icon) {
+            return html `<wui-icon
+        data-input=${this.size}
+        size=${this.size}
+        color="inherit"
+        name=${this.icon}
+      ></wui-icon>`;
+        }
+        return null;
+    }
+    dispatchInputChangeEvent() {
+        this.dispatchEvent(new CustomEvent('inputChange', {
+            detail: this.inputElementRef.value?.value,
+            bubbles: true,
+            composed: true
+        }));
+    }
+};
+WuiInputText.styles = [resetStyles, elementStyles, styles];
+__decorate([
+    property()
+], WuiInputText.prototype, "size", void 0);
+__decorate([
+    property()
+], WuiInputText.prototype, "icon", void 0);
+__decorate([
+    property({ type: Boolean })
+], WuiInputText.prototype, "disabled", void 0);
+__decorate([
+    property()
+], WuiInputText.prototype, "placeholder", void 0);
+__decorate([
+    property()
+], WuiInputText.prototype, "type", void 0);
+__decorate([
+    property()
+], WuiInputText.prototype, "keyHint", void 0);
+__decorate([
+    property()
+], WuiInputText.prototype, "value", void 0);
+__decorate([
+    property()
+], WuiInputText.prototype, "inputRightPadding", void 0);
+WuiInputText = __decorate([
+    customElement('wui-input-text')
+], WuiInputText);
+export { WuiInputText };
+//# sourceMappingURL=index.js.map

package/dist/esm/src/composites/wui-input-text/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../src/composites/wui-input-text/index.ts"],"names":[],"mappings":";;;;;;AAAA,OAAO,EAAE,IAAI,EAAE,UAAU,EAAE,MAAM,KAAK,CAAA;AACtC,OAAO,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAA;AAC5C,OAAO,EAAE,SAAS,EAAE,MAAM,8BAA8B,CAAA;AACxD,OAAO,EAAE,SAAS,EAAE,GAAG,EAAY,MAAM,uBAAuB,CAAA;AAChE,OAAO,EAAE,QAAQ,EAAE,MAAM,6BAA6B,CAAA;AACtD,OAAO,oCAAoC,CAAA;AAC3C,OAAO,EAAE,aAAa,EAAE,WAAW,EAAE,MAAM,0BAA0B,CAAA;AAErE,OAAO,EAAE,aAAa,EAAE,MAAM,kCAAkC,CAAA;AAChE,OAAO,MAAM,MAAM,aAAa,CAAA;AAGzB,IAAM,YAAY,GAAlB,MAAM,YAAa,SAAQ,UAAU;IAArC;;QAIE,oBAAe,GAA0B,SAAS,EAAoB,CAAA;QAG1D,SAAI,GAAgD,IAAI,CAAA;QAIvC,aAAQ,GAAG,KAAK,CAAA;QAEjC,gBAAW,GAAG,EAAE,CAAA;QAEhB,SAAI,GAAc,MAAM,CAAA;QAIxB,UAAK,GAAY,EAAE,CAAA;IAmDxC,CAAC;IA9CiB,MAAM;QACpB,MAAM,UAAU,GAAG,qBAAqB,IAAI,CAAC,iBAAiB,EAAE,CAAA;QAChE,MAAM,SAAS,GAAG,YAAY,IAAI,CAAC,IAAI,EAAE,CAAA;QACzC,MAAM,OAAO,GAAG;YACd,CAAC,SAAS,CAAC,EAAE,IAAI;YACjB,CAAC,UAAU,CAAC,EAAE,OAAO,CAAC,IAAI,CAAC,iBAAiB,CAAC;SAC9C,CAAA;QAED,OAAO,IAAI,CAAA,GAAG,IAAI,CAAC,YAAY,EAAE;;;UAG3B,GAAG,CAAC,IAAI,CAAC,eAAe,CAAC;gBACnB,QAAQ,CAAC,OAAO,CAAC;eAClB,IAAI,CAAC,IAAI;uBACD,SAAS,CAAC,IAAI,CAAC,YAAY,CAAC;oBAC/B,IAAI,CAAC,QAAQ;sBACX,IAAI,CAAC,WAAW;iBACrB,IAAI,CAAC,wBAAwB,CAAC,IAAI,CAAC,IAAI,CAAC;iBACxC,IAAI,CAAC,KAAK,IAAI,EAAE;;oBAEb,CAAA;IAClB,CAAC;IAGO,YAAY;QAClB,IAAI,IAAI,CAAC,IAAI,EAAE,CAAC;YACd,OAAO,IAAI,CAAA;qBACI,IAAI,CAAC,IAAI;eACf,IAAI,CAAC,IAAI;;eAET,IAAI,CAAC,IAAI;mBACL,CAAA;QACf,CAAC;QAED,OAAO,IAAI,CAAA;IACb,CAAC;IAEO,wBAAwB;QAC9B,IAAI,CAAC,aAAa,CAChB,IAAI,WAAW,CAAC,aAAa,EAAE;YAC7B,MAAM,EAAE,IAAI,CAAC,eAAe,CAAC,KAAK,EAAE,KAAK;YACzC,OAAO,EAAE,IAAI;YACb,QAAQ,EAAE,IAAI;SACf,CAAC,CACH,CAAA;IACH,CAAC;;AApEsB,mBAAM,GAAG,CAAC,WAAW,EAAE,aAAa,EAAE,MAAM,CAAC,AAAvC,CAAuC;AAMjD;IAAlB,QAAQ,EAAE;0CAAgE;AAExD;IAAlB,QAAQ,EAAE;0CAAuB;AAEE;IAAnC,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;8CAAwB;AAEjC;IAAlB,QAAQ,EAAE;iDAAwB;AAEhB;IAAlB,QAAQ,EAAE;0CAAgC;AAExB;IAAlB,QAAQ,EAAE;6CAAkD;AAE1C;IAAlB,QAAQ,EAAE;2CAA2B;AAEnB;IAAlB,QAAQ,EAAE;uDAAuC;AArBvC,YAAY;IADxB,aAAa,CAAC,gBAAgB,CAAC;GACnB,YAAY,CAsExB"}