@luzmo/lucero 1.0.1-alpha.24 → 1.0.1-alpha.26
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/components/button/button.d.ts +1 -1
- package/components/button/index.cjs +1 -1
- package/components/button/index.js +7 -6
- package/components/color-field/index.cjs +1 -1
- package/components/color-field/index.js +1 -1
- package/components/index.cjs +1 -1
- package/components/index.js +1 -1
- package/components/number-field/index.cjs +1 -1
- package/components/number-field/index.js +1 -1
- package/components/search/index.cjs +1 -1
- package/components/search/index.js +1 -1
- package/components/text-field/index.cjs +1 -1
- package/components/text-field/index.js +1 -1
- package/components/text-field/text-field.d.ts +0 -1
- package/components/{text-field-CQ8t9NU2.js → text-field-BTEpwGFu.js} +52 -68
- package/components/{text-field-Bnei-lTb.cjs → text-field-JMrsh-zo.cjs} +3 -5
- package/custom-elements.json +1 -1
- package/package.json +1 -1
|
@@ -23,7 +23,7 @@ import { c as g, a as N, j as V } from "../platform-CqwNrovd.js";
|
|
|
23
23
|
import { L as P, l as q } from "../language-resolution-B-wjV5bb.js";
|
|
24
24
|
import { s as E } from "../streaming-listener-BlWm-XZU.js";
|
|
25
25
|
import "../infield-button/index.js";
|
|
26
|
-
import { a as S } from "../text-field-
|
|
26
|
+
import { a as S } from "../text-field-BTEpwGFu.js";
|
|
27
27
|
const w = () => {
|
|
28
28
|
if (typeof document < "u" && !document.querySelector("style[data-luzmo-vars]")) {
|
|
29
29
|
const p = document.createElement("style");
|
|
@@ -15,7 +15,7 @@
|
|
|
15
15
|
* OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
|
|
16
16
|
* SOFTWARE.
|
|
17
17
|
* */
|
|
18
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const l=require("lit"),a=require("lit/decorators.js"),u=require("lit/directives/if-defined.js"),n=require("@luzmo/icons");require("../button/index.cjs");require("../icon/index.cjs");const d=require("../text-field-Bnei-lTb.cjs"),v="@media (forced-colors: active){#text-field #text-field,#text-field #text-field .input{--highcontrast-search-color-default: CanvasText;--highcontrast-search-color-hover: CanvasText;--highcontrast-search-color-focus: CanvasText;--highcontrast-search-color-disabled: GrayText}#text-field #button .luzmo-ClearButton-fill{forced-color-adjust:none;background-color:initial}}#text-field{--search-button-inline-size: var(--search-block-size);--search-min-inline-size: calc( var(--search-min-inline-multiplier) * var(--search-block-size) );--luzmo-text-field-font-family: var( --luzmo-search-font-family, var(--search-font-family) );--luzmo-text-field-font-weight: var( --luzmo-search-font-weight, var(--search-font-weight) );--luzmo-text-field-corner-radius: var( --luzmo-search-border-radius, var(--search-border-radius) );--luzmo-text-field-border-width: var( --luzmo-search-border-width, var(--search-border-width) );--luzmo-text-field-focus-indicator-gap: var( --luzmo-search-focus-indicator-gap, var(--search-focus-indicator-gap) );--luzmo-text-field-focus-indicator-width: var( --luzmo-search-focus-indicator-width, var(--search-focus-indicator-width) );--luzmo-text-field-focus-indicator-color: var( --luzmo-search-focus-indicator-color, var(--search-focus-indicator-color) );--luzmo-text-field-text-color-default: var( --luzmo-search-color-default, var(--search-color-default) );--luzmo-text-field-text-color-hover: var( --luzmo-search-color-hover, var(--search-color-hover) );--luzmo-text-field-text-color-focus: var( --luzmo-search-color-focus, var(--search-color-focus) );--luzmo-text-field-text-color-focus-hover: var( --luzmo-search-color-focus-hover, var(--search-color-focus-hover) );--luzmo-text-field-text-color-keyboard-focus: var( --luzmo-search-color-key-focus, var(--search-color-key-focus) );--luzmo-text-field-text-color-disabled: var( --luzmo-search-color-disabled, var(--search-color-disabled) );--luzmo-text-field-border-color: var( --luzmo-search-border-color-default, var(--search-border-color-default) );--luzmo-text-field-border-color-hover: var( --luzmo-search-border-color-hover, var(--search-border-color-hover) );--luzmo-text-field-border-color-focus: var( --luzmo-search-border-color-focus, var(--search-border-color-focus) );--luzmo-text-field-border-color-focus-hover: var( --luzmo-search-border-color-focus-hover, var(--search-border-color-focus-hover) );--luzmo-text-field-border-color-keyboard-focus: var( --luzmo-search-border-color-key-focus, var(--search-border-color-key-focus) );--luzmo-text-field-border-color-disabled: var( --luzmo-search-border-color-disabled, var(--search-border-color-disabled) );--luzmo-text-field-background-color: var( --luzmo-search-background-color, var(--search-background-color) );--luzmo-text-field-background-color-disabled: var( --luzmo-search-background-color-disabled, var(--search-background-color-disabled) );inline-size:var(--luzmo-search-inline-size, var(--search-inline-size));min-inline-size:var(--luzmo-search-min-inline-size, var(--search-min-inline-size));display:inline-block;position:relative}#text-field .luzmo-HelpText{margin-block-start:var(--luzmo-search-to-help-text, var(--search-to-help-text))}#button{position:absolute;inset-block-start:0;inset-inline-end:0;height:var(--search-block-size);width:var(--search-block-size)}#button,#button .luzmo-ClearButton-fill{border-radius:var(--luzmo-search-border-radius, var(--search-border-radius))}#text-field.is-disabled #button{display:none}#text-field{inline-size:100%}.icon-search{--search-color: var( --highcontrast-search-color-default, var(--luzmo-search-color-default, var(--search-color-default)) );color:var(--search-color);margin-block:auto;display:block;position:absolute;inset-block:0}#text-field.is-focused .icon-search{--search-color: var( --highcontrast-search-color-focus, var(--luzmo-search-color-focus, var(--search-color-focus)) )}#text-field.is-disabled .icon-search{--search-color: var( --highcontrast-search-color-disabled, var(--luzmo-search-color-disabled, var(--search-color-disabled)) )}@media (hover: hover){#text-field:hover .icon-search{--search-color: var( --highcontrast-search-color-hover, var(--luzmo-search-color-hover, var(--search-color-hover)) )}#text-field.is-focused:hover .icon-search{--search-color: var( --highcontrast-search-color-focus, var(--luzmo-search-color-focus-hover, var(--search-color-focus-hover)) )}#text-field.is-disabled:hover .icon-search{--search-color: var( --highcontrast-search-color-disabled, var(--luzmo-search-color-disabled, var(--search-color-disabled)) )}}.input{-webkit-appearance:none;-moz-appearance:none;appearance:none;block-size:var(--luzmo-search-block-size, var(--search-block-size));font-style:var(--luzmo-search-font-style, var(--search-font-style));line-height:var(--luzmo-search-line-height, var(--search-line-height));padding-block-start:calc(var(--luzmo-search-top-to-text, var(--search-top-to-text)) - var(--luzmo-search-border-width, var(--search-border-width)));padding-block-end:calc(var(--luzmo-search-bottom-to-text, var(--search-bottom-to-text)) - var(--luzmo-search-border-width, var(--search-border-width)))}.input::-webkit-search-cancel-button,.input::-webkit-search-decoration{-webkit-appearance:none;-moz-appearance:none;appearance:none}:host(:not([quiet])) #text-field .icon-search{inset-inline-start:var(--luzmo-search-edge-to-visual, var(--search-edge-to-visual))}:host(:not([quiet])) #text-field .input{padding-inline-start:calc(var(--luzmo-search-edge-to-visual, var(--search-edge-to-visual)) - var(--luzmo-search-border-width, var(--search-border-width)) + var(--luzmo-search-icon-size, var(--search-icon-size)) + var(--luzmo-search-text-to-icon, var(--search-text-to-icon)));padding-inline-end:calc(var(--luzmo-search-button-inline-size, var(--search-button-inline-size)) - var(--luzmo-search-border-width, var(--search-border-width)))}:host([quiet]){--search-quiet-button-offset: var( --luzmo-search-quiet-button-offset, calc( var(--luzmo-search-block-size, var(--search-block-size)) / 2 - var(--luzmo-search-icon-size, var(--search-icon-size)) / 2 ) )}:host([quiet]) #button .luzmo-ClearButton-icon{transform:translate(var(--search-quiet-button-offset))}:host([quiet]) #text-field .input{border-radius:var(--luzmo-search-border-radius, var(--search-border-radius));padding-block-start:var(--luzmo-search-top-to-text, var(--search-top-to-text));padding-inline-start:calc(var(--luzmo-search-edge-to-visual, var(--search-edge-to-visual)) + var(--luzmo-search-icon-size, var(--search-icon-size)) + var(--luzmo-search-text-to-icon, var(--search-text-to-icon)));padding-inline-end:calc(var(--luzmo-search-button-inline-size, var(--search-button-inline-size)) - var(--search-quiet-button-offset))}:host{--search-border-color-default: var(--luzmo-border-color);--search-border-color-hover: rgba(var(--luzmo-primary-rgb), .3);--search-border-color-focus: var(--luzmo-primary);--search-border-color-focus-hover: var(--luzmo-primary);--search-border-color-key-focus: var(--luzmo-primary);--search-inline-size: 192px;--search-min-inline-multiplier: 3;--search-to-help-text: 0px;--search-top-to-text: var(--luzmo-spacing-2);--search-bottom-to-text: var(--luzmo-spacing-2);--search-focus-indicator-width: var(--luzmo-indicator-width);--search-focus-indicator-gap: -1px;--search-focus-indicator-color: var(--luzmo-primary);--search-font-family: var(--luzmo-font-family);--search-font-weight: var(--luzmo-font-weight);--search-font-style: var(--luzmo-font-style);--search-line-height: var(--luzmo-line-height);--search-color-default: var(--luzmo-font-color);--search-color-hover: var(--luzmo-font-color-hover);--search-color-focus: var(--luzmo-font-color-focus);--search-color-focus-hover: var(--luzmo-font-focus);--search-color-key-focus: var(--luzmo-font-color-focus);--search-border-width: var(--luzmo-border-width);--search-background-color: var(--luzmo-background-color);--search-color-disabled: var(--luzmo-disabled-color);--search-background-color-disabled: var(--luzmo-background-color-disabled);--search-border-color-disabled: var(--luzmo-border-color-disabled)}:host #text-field{--search-border-radius: var(--luzmo-border-radius);--search-edge-to-visual: calc( var(--luzmo-spacing-3) + var(--luzmo-spacing-1) );--search-block-size: var(--luzmo-component-height);--search-icon-size: var(--luzmo-font-size-l);--search-text-to-icon: calc(var(--luzmo-spacing-3) + var(--luzmo-spacing-1))}:host([size=s]) #text-field{--search-border-radius: var(--luzmo-border-radius);--search-edge-to-visual: var(--luzmo-spacing-3);--search-block-size: var(--luzmo-component-height-s);--search-icon-size: var(--luzmo-font-size);--search-text-to-icon: var(--luzmo-spacing-3)}:host([size=l]) #text-field{--search-border-radius: var(--luzmo-border-radius);--search-edge-to-visual: var(--luzmo-spacing-4);--search-block-size: var(--luzmo-component-height-l);--search-icon-size: var(--luzmo-font-size-xl);--search-text-to-icon: calc(var(--luzmo-spacing-3) + var(--luzmo-spacing-1))}:host([size=xl]) #text-field{--search-border-radius: var(--luzmo-border-radius);--search-edge-to-visual: calc( var(--luzmo-spacing-4) + var(--luzmo-spacing-1) );--search-block-size: var(--luzmo-component-height-xl);--search-icon-size: var(--luzmo-font-size-xxl);--search-text-to-icon: var(--luzmo-spacing-4)}:host([quiet]) #text-field{--search-background-color: transparent;--search-background-color-disabled: transparent;--search-border-color-disabled: var(--luzmo-border-color-disabled);--search-border-radius: 0;--search-edge-to-visual: 0px}:host{--luzmo-text-field-spacing-inline: var(--alias-infield-button-full-height-m)}input::-webkit-search-cancel-button{display:none}@media (forced-colors: active){luzmo-clear-button{--clear-button-fill-background-color: transparent;--clear-button-fill-background-color-disabled: transparent;--clear-button-fill-background-color-down: transparent;--clear-button-fill-background-color-hover: transparent;--clear-button-fill-background-color-key-focus: transparent}}";var m=Object.defineProperty,t=(o,r,c,f)=>{for(var s=void 0,i=o.length-1,h;i>=0;i--)(h=o[i])&&(s=h(r,c,s)||s);return s&&m(r,c,s),s};const b=o=>o.stopPropagation(),z=o=>o==="s"?n.luzmoSearch12:o==="l"?n.luzmoSearch:n.luzmoSearch14;class e extends d.LuzmoTextField{constructor(){super(...arguments),this.action="",this.label="Search",this.placeholder="Search"}static get styles(){return[...super.styles,l.unsafeCSS(v)]}handleSubmit(r){this.dispatchEvent(new Event("submit",{cancelable:!0,bubbles:!0}))||r.preventDefault()}handleKeydown(r){const{code:c}=r;c==="Escape"&&this.holdValueOnEscape||!this.value||c!=="Escape"||this.reset()}async reset(){this.value="",await this.updateComplete,this.focusElement.dispatchEvent(new InputEvent("input",{bubbles:!0,composed:!0})),this.focusElement.dispatchEvent(new InputEvent("change",{bubbles:!0}))}renderField(){return l.html`
|
|
18
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const l=require("lit"),a=require("lit/decorators.js"),u=require("lit/directives/if-defined.js"),n=require("@luzmo/icons");require("../button/index.cjs");require("../icon/index.cjs");const d=require("../text-field-JMrsh-zo.cjs"),v="@media (forced-colors: active){#text-field #text-field,#text-field #text-field .input{--highcontrast-search-color-default: CanvasText;--highcontrast-search-color-hover: CanvasText;--highcontrast-search-color-focus: CanvasText;--highcontrast-search-color-disabled: GrayText}#text-field #button .luzmo-ClearButton-fill{forced-color-adjust:none;background-color:initial}}#text-field{--search-button-inline-size: var(--search-block-size);--search-min-inline-size: calc( var(--search-min-inline-multiplier) * var(--search-block-size) );--luzmo-text-field-font-family: var( --luzmo-search-font-family, var(--search-font-family) );--luzmo-text-field-font-weight: var( --luzmo-search-font-weight, var(--search-font-weight) );--luzmo-text-field-corner-radius: var( --luzmo-search-border-radius, var(--search-border-radius) );--luzmo-text-field-border-width: var( --luzmo-search-border-width, var(--search-border-width) );--luzmo-text-field-focus-indicator-gap: var( --luzmo-search-focus-indicator-gap, var(--search-focus-indicator-gap) );--luzmo-text-field-focus-indicator-width: var( --luzmo-search-focus-indicator-width, var(--search-focus-indicator-width) );--luzmo-text-field-focus-indicator-color: var( --luzmo-search-focus-indicator-color, var(--search-focus-indicator-color) );--luzmo-text-field-text-color-default: var( --luzmo-search-color-default, var(--search-color-default) );--luzmo-text-field-text-color-hover: var( --luzmo-search-color-hover, var(--search-color-hover) );--luzmo-text-field-text-color-focus: var( --luzmo-search-color-focus, var(--search-color-focus) );--luzmo-text-field-text-color-focus-hover: var( --luzmo-search-color-focus-hover, var(--search-color-focus-hover) );--luzmo-text-field-text-color-keyboard-focus: var( --luzmo-search-color-key-focus, var(--search-color-key-focus) );--luzmo-text-field-text-color-disabled: var( --luzmo-search-color-disabled, var(--search-color-disabled) );--luzmo-text-field-border-color: var( --luzmo-search-border-color-default, var(--search-border-color-default) );--luzmo-text-field-border-color-hover: var( --luzmo-search-border-color-hover, var(--search-border-color-hover) );--luzmo-text-field-border-color-focus: var( --luzmo-search-border-color-focus, var(--search-border-color-focus) );--luzmo-text-field-border-color-focus-hover: var( --luzmo-search-border-color-focus-hover, var(--search-border-color-focus-hover) );--luzmo-text-field-border-color-keyboard-focus: var( --luzmo-search-border-color-key-focus, var(--search-border-color-key-focus) );--luzmo-text-field-border-color-disabled: var( --luzmo-search-border-color-disabled, var(--search-border-color-disabled) );--luzmo-text-field-background-color: var( --luzmo-search-background-color, var(--search-background-color) );--luzmo-text-field-background-color-disabled: var( --luzmo-search-background-color-disabled, var(--search-background-color-disabled) );inline-size:var(--luzmo-search-inline-size, var(--search-inline-size));min-inline-size:var(--luzmo-search-min-inline-size, var(--search-min-inline-size));display:inline-block;position:relative}#text-field .luzmo-HelpText{margin-block-start:var(--luzmo-search-to-help-text, var(--search-to-help-text))}#button{position:absolute;inset-block-start:0;inset-inline-end:0;height:var(--search-block-size);width:var(--search-block-size)}#button,#button .luzmo-ClearButton-fill{border-radius:var(--luzmo-search-border-radius, var(--search-border-radius))}#text-field.is-disabled #button{display:none}#text-field{inline-size:100%}.icon-search{--search-color: var( --highcontrast-search-color-default, var(--luzmo-search-color-default, var(--search-color-default)) );color:var(--search-color);margin-block:auto;display:block;position:absolute;inset-block:0}#text-field.is-focused .icon-search{--search-color: var( --highcontrast-search-color-focus, var(--luzmo-search-color-focus, var(--search-color-focus)) )}#text-field.is-disabled .icon-search{--search-color: var( --highcontrast-search-color-disabled, var(--luzmo-search-color-disabled, var(--search-color-disabled)) )}@media (hover: hover){#text-field:hover .icon-search{--search-color: var( --highcontrast-search-color-hover, var(--luzmo-search-color-hover, var(--search-color-hover)) )}#text-field.is-focused:hover .icon-search{--search-color: var( --highcontrast-search-color-focus, var(--luzmo-search-color-focus-hover, var(--search-color-focus-hover)) )}#text-field.is-disabled:hover .icon-search{--search-color: var( --highcontrast-search-color-disabled, var(--luzmo-search-color-disabled, var(--search-color-disabled)) )}}.input{-webkit-appearance:none;-moz-appearance:none;appearance:none;block-size:var(--luzmo-search-block-size, var(--search-block-size));font-style:var(--luzmo-search-font-style, var(--search-font-style));line-height:var(--luzmo-search-line-height, var(--search-line-height));padding-block-start:calc(var(--luzmo-search-top-to-text, var(--search-top-to-text)) - var(--luzmo-search-border-width, var(--search-border-width)));padding-block-end:calc(var(--luzmo-search-bottom-to-text, var(--search-bottom-to-text)) - var(--luzmo-search-border-width, var(--search-border-width)))}.input::-webkit-search-cancel-button,.input::-webkit-search-decoration{-webkit-appearance:none;-moz-appearance:none;appearance:none}:host(:not([quiet])) #text-field .icon-search{inset-inline-start:var(--luzmo-search-edge-to-visual, var(--search-edge-to-visual))}:host(:not([quiet])) #text-field .input{padding-inline-start:calc(var(--luzmo-search-edge-to-visual, var(--search-edge-to-visual)) - var(--luzmo-search-border-width, var(--search-border-width)) + var(--luzmo-search-icon-size, var(--search-icon-size)) + var(--luzmo-search-text-to-icon, var(--search-text-to-icon)));padding-inline-end:calc(var(--luzmo-search-button-inline-size, var(--search-button-inline-size)) - var(--luzmo-search-border-width, var(--search-border-width)))}:host([quiet]){--search-quiet-button-offset: var( --luzmo-search-quiet-button-offset, calc( var(--luzmo-search-block-size, var(--search-block-size)) / 2 - var(--luzmo-search-icon-size, var(--search-icon-size)) / 2 ) )}:host([quiet]) #button .luzmo-ClearButton-icon{transform:translate(var(--search-quiet-button-offset))}:host([quiet]) #text-field .input{border-radius:var(--luzmo-search-border-radius, var(--search-border-radius));padding-block-start:var(--luzmo-search-top-to-text, var(--search-top-to-text));padding-inline-start:calc(var(--luzmo-search-edge-to-visual, var(--search-edge-to-visual)) + var(--luzmo-search-icon-size, var(--search-icon-size)) + var(--luzmo-search-text-to-icon, var(--search-text-to-icon)));padding-inline-end:calc(var(--luzmo-search-button-inline-size, var(--search-button-inline-size)) - var(--search-quiet-button-offset))}:host{--search-border-color-default: var(--luzmo-border-color);--search-border-color-hover: rgba(var(--luzmo-primary-rgb), .3);--search-border-color-focus: var(--luzmo-primary);--search-border-color-focus-hover: var(--luzmo-primary);--search-border-color-key-focus: var(--luzmo-primary);--search-inline-size: 192px;--search-min-inline-multiplier: 3;--search-to-help-text: 0px;--search-top-to-text: var(--luzmo-spacing-2);--search-bottom-to-text: var(--luzmo-spacing-2);--search-focus-indicator-width: var(--luzmo-indicator-width);--search-focus-indicator-gap: -1px;--search-focus-indicator-color: var(--luzmo-primary);--search-font-family: var(--luzmo-font-family);--search-font-weight: var(--luzmo-font-weight);--search-font-style: var(--luzmo-font-style);--search-line-height: var(--luzmo-line-height);--search-color-default: var(--luzmo-font-color);--search-color-hover: var(--luzmo-font-color-hover);--search-color-focus: var(--luzmo-font-color-focus);--search-color-focus-hover: var(--luzmo-font-focus);--search-color-key-focus: var(--luzmo-font-color-focus);--search-border-width: var(--luzmo-border-width);--search-background-color: var(--luzmo-background-color);--search-color-disabled: var(--luzmo-disabled-color);--search-background-color-disabled: var(--luzmo-background-color-disabled);--search-border-color-disabled: var(--luzmo-border-color-disabled)}:host #text-field{--search-border-radius: var(--luzmo-border-radius);--search-edge-to-visual: calc( var(--luzmo-spacing-3) + var(--luzmo-spacing-1) );--search-block-size: var(--luzmo-component-height);--search-icon-size: var(--luzmo-font-size-l);--search-text-to-icon: calc(var(--luzmo-spacing-3) + var(--luzmo-spacing-1))}:host([size=s]) #text-field{--search-border-radius: var(--luzmo-border-radius);--search-edge-to-visual: var(--luzmo-spacing-3);--search-block-size: var(--luzmo-component-height-s);--search-icon-size: var(--luzmo-font-size);--search-text-to-icon: var(--luzmo-spacing-3)}:host([size=l]) #text-field{--search-border-radius: var(--luzmo-border-radius);--search-edge-to-visual: var(--luzmo-spacing-4);--search-block-size: var(--luzmo-component-height-l);--search-icon-size: var(--luzmo-font-size-xl);--search-text-to-icon: calc(var(--luzmo-spacing-3) + var(--luzmo-spacing-1))}:host([size=xl]) #text-field{--search-border-radius: var(--luzmo-border-radius);--search-edge-to-visual: calc( var(--luzmo-spacing-4) + var(--luzmo-spacing-1) );--search-block-size: var(--luzmo-component-height-xl);--search-icon-size: var(--luzmo-font-size-xxl);--search-text-to-icon: var(--luzmo-spacing-4)}:host([quiet]) #text-field{--search-background-color: transparent;--search-background-color-disabled: transparent;--search-border-color-disabled: var(--luzmo-border-color-disabled);--search-border-radius: 0;--search-edge-to-visual: 0px}:host{--luzmo-text-field-spacing-inline: var(--alias-infield-button-full-height-m)}input::-webkit-search-cancel-button{display:none}@media (forced-colors: active){luzmo-clear-button{--clear-button-fill-background-color: transparent;--clear-button-fill-background-color-disabled: transparent;--clear-button-fill-background-color-down: transparent;--clear-button-fill-background-color-hover: transparent;--clear-button-fill-background-color-key-focus: transparent}}";var m=Object.defineProperty,t=(o,r,c,f)=>{for(var s=void 0,i=o.length-1,h;i>=0;i--)(h=o[i])&&(s=h(r,c,s)||s);return s&&m(r,c,s),s};const b=o=>o.stopPropagation(),z=o=>o==="s"?n.luzmoSearch12:o==="l"?n.luzmoSearch:n.luzmoSearch14;class e extends d.LuzmoTextField{constructor(){super(...arguments),this.action="",this.label="Search",this.placeholder="Search"}static get styles(){return[...super.styles,l.unsafeCSS(v)]}handleSubmit(r){this.dispatchEvent(new Event("submit",{cancelable:!0,bubbles:!0}))||r.preventDefault()}handleKeydown(r){const{code:c}=r;c==="Escape"&&this.holdValueOnEscape||!this.value||c!=="Escape"||this.reset()}async reset(){this.value="",await this.updateComplete,this.focusElement.dispatchEvent(new InputEvent("input",{bubbles:!0,composed:!0})),this.focusElement.dispatchEvent(new InputEvent("change",{bubbles:!0}))}renderField(){return l.html`
|
|
19
19
|
<form
|
|
20
20
|
action=${this.action}
|
|
21
21
|
id="form"
|
|
@@ -21,7 +21,7 @@ import { ifDefined as n } from "lit/directives/if-defined.js";
|
|
|
21
21
|
import { luzmoSearch12 as b, luzmoSearch as f, luzmoSearch14 as v } from "@luzmo/icons";
|
|
22
22
|
import "../button/index.js";
|
|
23
23
|
import "../icon/index.js";
|
|
24
|
-
import { L as p } from "../text-field-
|
|
24
|
+
import { L as p } from "../text-field-BTEpwGFu.js";
|
|
25
25
|
const d = () => {
|
|
26
26
|
if (typeof document < "u" && !document.querySelector("style[data-luzmo-vars]")) {
|
|
27
27
|
const o = document.createElement("style");
|
|
@@ -15,7 +15,7 @@
|
|
|
15
15
|
* OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
|
|
16
16
|
* SOFTWARE.
|
|
17
17
|
* */
|
|
18
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const x=require("../text-field-
|
|
18
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const x=require("../text-field-JMrsh-zo.cjs"),e=require("lit"),h=require("@luzmo/icons"),p=require("lit/decorators.js"),s=require("../base-5nDSSNeT.cjs"),u=require("../sized-mixin-DcvJLFeo.cjs"),v="@media (forced-colors: active){:host{--highcontrast-helptext-content-color-default: CanvasText;--highcontrast-helptext-icon-color-default: CanvasText}:host,.text,.icon{forced-color-adjust:none}}:host{--helptext-bottom-to-workflow-icon: 3px;color:var(--highcontrast-helptext-content-color-default, var(--luzmo-helptext-content-color-default, var(--helptext-content-color-default)));font-family:var(--luzmo-helptext-font-family, var(--luzmo-font-family));font-weight:var(--luzmo-helptext-font-weight, var(--luzmo-font-weight));font-size:var(--luzmo-helptext-font-size, var(--helptext-font-size, var(--luzmo-font-size-s)));min-block-size:var(--luzmo-helptext-min-height, var(--helptext-min-height, 24px));display:flex}.icon{block-size:var(--luzmo-helptext-icon-size, var(--helptext-icon-size, 18px));inline-size:var(--luzmo-helptext-icon-size, var(--helptext-icon-size, 18px));flex-shrink:0;margin-inline-end:var(--luzmo-helptext-text-to-visual, var(--helptext-text-to-visual, 7px));padding-block-start:var(--luzmo-helptext-top-to-workflow-icon, var(--helptext-top-to-workflow-icon, 3px));padding-block-end:var(--luzmo-helptext-bottom-to-workflow-icon, var(--helptext-bottom-to-workflow-icon, 3px))}.text{line-height:var(--luzmo-helptext-line-height, var(--helptext-line-height, 1.3));padding-block-start:var(--luzmo-helptext-top-to-text, var(--helptext-top-to-text, 4px));padding-block-end:var(--luzmo-helptext-bottom-to-text, var(--helptext-bottom-to-text, 5px))}:host(:lang(ja)) .text,:host(:lang(ko)) .text,:host(:lang(zh)) .text{line-height:var(--luzmo-helptext-line-height-cjk, var(--helptext-line-height-cjk, 1.4))}:host([variant=neutral]) .text{color:var(--highcontrast-helptext-content-color-default, var(--luzmo-helptext-content-color-default, var(--helptext-content-color-default)))}:host([variant=neutral]) .icon{color:var(--highcontrast-helptext-icon-color-default, var(--luzmo-helptext-icon-color-default, var(--helptext-icon-color-default)))}:host([variant=negative]) .text{color:var(--highcontrast-helptext-content-color-default, var(--luzmo-helptext-content-color-default, var(--luzmo-negative-color-down)))}:host([variant=negative]) .icon{color:var(--highcontrast-helptext-icon-color-default, var(--luzmo-helptext-icon-color-default, var(--helptext-icon-color-default)))}:host([disabled]) .text{color:var(--highcontrast-helptext-content-color-default, var(--luzmo-helptext-content-color-default, var(--luzmo-font-color)))}:host([disabled]) .icon{color:var(--highcontrast-helptext-icon-color-default, var(--luzmo-helptext-icon-color-default, var(--helptext-icon-color-default)))}:host{--helptext-line-height: 1.3;--helptext-content-color-default: var(--luzmo-font-color);--helptext-icon-color-default: var(--luzmo-font-color);--helptext-disabled-content-color: var(--luzmo-font-color-disabled)}:host([variant=neutral]){--helptext-content-color-default: var(var(--luzmo-font-color));--helptext-icon-color-default: var(var(--luzmo-font-color))}:host([variant=negative]){--helptext-content-color-default: var(var(--luzmo-negative-color));--helptext-icon-color-default: var(var(--luzmo-negative-color))}:host([disabled]){--helptext-content-color-default: var(--luzmo-font-color-disabled);--helptext-icon-color-default: var(--luzmo-font-color-disabled)}:host(:lang(ja)){--helptext-line-height-cjk: 1.4}:host(:lang(zh)){--helptext-line-height-cjk: 1.4}:host(:lang(ko)){--helptext-line-height-cjk: 1.4}:host([size=s]){--helptext-min-height: 24px;--helptext-icon-size: 16px;--helptext-font-size: 12px;--helptext-text-to-visual: 7px;--helptext-top-to-workflow-icon: 4px;--helptext-top-to-text: 4px;--helptext-bottom-to-text: 5px}:host{--helptext-min-height: 24px;--helptext-icon-size: 18px;--helptext-font-size: 12px;--helptext-text-to-visual: 7px;--helptext-top-to-workflow-icon: 3px;--helptext-top-to-text: 4px;--helptext-bottom-to-text: 5px}:host([size=l]){--helptext-min-height: 32px;--helptext-icon-size: 20px;--helptext-font-size: 14px;--helptext-text-to-visual: 8px;--helptext-top-to-workflow-icon: 6px;--helptext-top-to-text: 6px;--helptext-bottom-to-text: 5px}:host([size=xl]){--helptext-min-height: 40px;--helptext-icon-size: 22px;--helptext-font-size: 16px;--helptext-text-to-visual: 9px;--helptext-top-to-workflow-icon: 9px;--helptext-top-to-text: 9px;--helptext-bottom-to-text: 12px}";var f=Object.defineProperty,c=(l,r,i,d)=>{for(var t=void 0,n=l.length-1,a;n>=0;n--)(a=l[n])&&(t=a(r,i,t)||t);return t&&f(r,i,t),t};class o extends u.SizedMixin(s.LuzmoElement,{noDefaultSize:!0}){constructor(){super(...arguments),this.icon=!1,this.variant="neutral"}static get styles(){return[e.unsafeCSS(v)]}render(){return e.html`
|
|
19
19
|
${this.variant==="negative"&&this.icon?e.html` ${h.luzmoIcon(h.luzmoClose14)} `:e.nothing}
|
|
20
20
|
<div class="text"><slot></slot></div>
|
|
21
21
|
`}}c([p.property({type:Boolean,reflect:!0})],o.prototype,"icon");c([p.property({reflect:!0})],o.prototype,"variant");customElements.get("luzmo-text-field")||customElements.define("luzmo-text-field",x.LuzmoTextField);customElements.get("luzmo-help-text")||customElements.define("luzmo-help-text",o);exports.LuzmoTextField=x.LuzmoTextField;exports.LuzmoHelpText=o;
|
|
@@ -15,7 +15,7 @@
|
|
|
15
15
|
* OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
|
|
16
16
|
* SOFTWARE.
|
|
17
17
|
* */
|
|
18
|
-
import { L as h } from "../text-field-
|
|
18
|
+
import { L as h } from "../text-field-BTEpwGFu.js";
|
|
19
19
|
import { unsafeCSS as p, nothing as x, html as a } from "lit";
|
|
20
20
|
import { luzmoIcon as s, luzmoClose14 as z } from "@luzmo/icons";
|
|
21
21
|
import { property as c } from "lit/decorators.js";
|
|
@@ -120,7 +120,6 @@ export declare class LuzmoTextFieldBase extends LuzmoTextFieldBase_base {
|
|
|
120
120
|
protected handleChange(): void;
|
|
121
121
|
protected onFocus(): void;
|
|
122
122
|
protected onBlur(_event: FocusEvent): void;
|
|
123
|
-
protected handleKeyPress(event: KeyboardEvent): void;
|
|
124
123
|
protected handleInputElementPointerdown(): void;
|
|
125
124
|
protected renderStateIcons(): TemplateResult | typeof nothing;
|
|
126
125
|
protected get displayValue(): string;
|
|
@@ -15,23 +15,23 @@
|
|
|
15
15
|
* OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
|
|
16
16
|
* SOFTWARE.
|
|
17
17
|
* */
|
|
18
|
-
import { unsafeCSS as
|
|
19
|
-
import { state as
|
|
18
|
+
import { unsafeCSS as v, html as o, nothing as p } from "lit";
|
|
19
|
+
import { state as m, property as l, query as y } from "lit/decorators.js";
|
|
20
20
|
import { ifDefined as r } from "lit/directives/if-defined.js";
|
|
21
21
|
import { live as f } from "lit/directives/live.js";
|
|
22
|
-
import { luzmoIcon as
|
|
23
|
-
import { F as
|
|
24
|
-
import { S as
|
|
25
|
-
import { M as
|
|
26
|
-
import { t as
|
|
27
|
-
var
|
|
28
|
-
for (var n = a > 1 ? void 0 : a ?
|
|
29
|
-
(d = h[u]) && (n = (a ? d(e,
|
|
30
|
-
return a && n &&
|
|
22
|
+
import { luzmoIcon as c, luzmoAlert as g, luzmoCheck as $ } from "@luzmo/icons";
|
|
23
|
+
import { F as x } from "./focusable-BjvsvVam.js";
|
|
24
|
+
import { S as b } from "./sized-mixin-cJbo3PKR.js";
|
|
25
|
+
import { M as S } from "./manage-help-text-C9sCHK3R.js";
|
|
26
|
+
import { t as w } from "./text-field.module-C2KVUJcX.js";
|
|
27
|
+
var _ = Object.defineProperty, E = Object.getOwnPropertyDescriptor, t = (h, e, s, a) => {
|
|
28
|
+
for (var n = a > 1 ? void 0 : a ? E(e, s) : e, u = h.length - 1, d; u >= 0; u--)
|
|
29
|
+
(d = h[u]) && (n = (a ? d(e, s, n) : d(n)) || n);
|
|
30
|
+
return a && n && _(e, s, n), n;
|
|
31
31
|
};
|
|
32
|
-
const
|
|
33
|
-
class i extends
|
|
34
|
-
x
|
|
32
|
+
const q = ["text", "url", "tel", "email", "password"];
|
|
33
|
+
class i extends S(
|
|
34
|
+
b(x, {
|
|
35
35
|
noDefaultSize: !0
|
|
36
36
|
})
|
|
37
37
|
) {
|
|
@@ -39,20 +39,20 @@ class i extends w(
|
|
|
39
39
|
super(...arguments), this.allowedKeys = "", this.focused = !1, this.invalid = !1, this.label = "", this.placeholder = "", this._type = "text", this.grows = !1, this.maxlength = -1, this.minlength = -1, this.multiline = !1, this.readonly = !1, this.rows = -1, this.valid = !1, this._value = "", this.quiet = !1, this.required = !1;
|
|
40
40
|
}
|
|
41
41
|
static get styles() {
|
|
42
|
-
return [
|
|
42
|
+
return [v(w)];
|
|
43
43
|
}
|
|
44
44
|
set type(e) {
|
|
45
|
-
const
|
|
46
|
-
this._type = e, this.requestUpdate("type",
|
|
45
|
+
const s = this._type;
|
|
46
|
+
this._type = e, this.requestUpdate("type", s);
|
|
47
47
|
}
|
|
48
48
|
get type() {
|
|
49
|
-
return
|
|
49
|
+
return q.find((e) => e === this._type) ?? "text";
|
|
50
50
|
}
|
|
51
51
|
set value(e) {
|
|
52
52
|
if (e === this.value)
|
|
53
53
|
return;
|
|
54
|
-
const
|
|
55
|
-
this._value = e, this.requestUpdate("value",
|
|
54
|
+
const s = this._value;
|
|
55
|
+
this._value = e, this.requestUpdate("value", s);
|
|
56
56
|
}
|
|
57
57
|
get value() {
|
|
58
58
|
return this._value;
|
|
@@ -70,10 +70,10 @@ class i extends w(
|
|
|
70
70
|
* @param [selectionDirection="none"] A string indicating the direction in which the selection is considered to
|
|
71
71
|
* have been performed.
|
|
72
72
|
*/
|
|
73
|
-
setSelectionRange(e,
|
|
73
|
+
setSelectionRange(e, s, a = "none") {
|
|
74
74
|
this.inputElement.setSelectionRange(
|
|
75
75
|
e,
|
|
76
|
-
|
|
76
|
+
s,
|
|
77
77
|
a
|
|
78
78
|
);
|
|
79
79
|
}
|
|
@@ -105,27 +105,13 @@ class i extends w(
|
|
|
105
105
|
onBlur(e) {
|
|
106
106
|
this.focused = !this.readonly && !1;
|
|
107
107
|
}
|
|
108
|
-
handleKeyPress(e) {
|
|
109
|
-
this.dispatchEvent(
|
|
110
|
-
new KeyboardEvent("keypress", {
|
|
111
|
-
bubbles: !0,
|
|
112
|
-
composed: !0,
|
|
113
|
-
key: e.key,
|
|
114
|
-
code: e.code,
|
|
115
|
-
ctrlKey: e.ctrlKey,
|
|
116
|
-
shiftKey: e.shiftKey,
|
|
117
|
-
altKey: e.altKey,
|
|
118
|
-
metaKey: e.metaKey
|
|
119
|
-
})
|
|
120
|
-
);
|
|
121
|
-
}
|
|
122
108
|
handleInputElementPointerdown() {
|
|
123
109
|
}
|
|
124
110
|
renderStateIcons() {
|
|
125
111
|
return this.invalid ? o`
|
|
126
|
-
<div id="invalid" class="icon">${
|
|
112
|
+
<div id="invalid" class="icon">${c(g)}</div>
|
|
127
113
|
` : this.valid ? o`
|
|
128
|
-
<div id="valid" class="icon">${
|
|
114
|
+
<div id="valid" class="icon">${c($)}</div>
|
|
129
115
|
` : p;
|
|
130
116
|
}
|
|
131
117
|
get displayValue() {
|
|
@@ -153,7 +139,6 @@ class i extends w(
|
|
|
153
139
|
.value=${this.displayValue}
|
|
154
140
|
@change=${this.handleChange}
|
|
155
141
|
@input=${this.handleInput}
|
|
156
|
-
@keypress=${this.handleKeyPress}
|
|
157
142
|
@focus=${this.onFocus}
|
|
158
143
|
@blur=${this.onBlur}
|
|
159
144
|
?disabled=${this.disabled}
|
|
@@ -182,7 +167,6 @@ class i extends w(
|
|
|
182
167
|
.value=${f(this.displayValue)}
|
|
183
168
|
@change=${this.handleChange}
|
|
184
169
|
@input=${this.handleInput}
|
|
185
|
-
@keypress=${this.handleKeyPress}
|
|
186
170
|
@pointerdown=${this.handleInputElementPointerdown}
|
|
187
171
|
@focus=${this.onFocus}
|
|
188
172
|
@blur=${this.onBlur}
|
|
@@ -216,89 +200,89 @@ class i extends w(
|
|
|
216
200
|
}
|
|
217
201
|
}
|
|
218
202
|
t([
|
|
219
|
-
|
|
203
|
+
m()
|
|
220
204
|
], i.prototype, "appliedLabel", 2);
|
|
221
205
|
t([
|
|
222
|
-
|
|
206
|
+
l({ attribute: "allowed-keys" })
|
|
223
207
|
], i.prototype, "allowedKeys", 2);
|
|
224
208
|
t([
|
|
225
|
-
|
|
209
|
+
l({ type: Boolean, reflect: !0 })
|
|
226
210
|
], i.prototype, "focused", 2);
|
|
227
211
|
t([
|
|
228
|
-
|
|
212
|
+
y(".input:not(#sizer)")
|
|
229
213
|
], i.prototype, "inputElement", 2);
|
|
230
214
|
t([
|
|
231
|
-
|
|
215
|
+
l({ type: Boolean, reflect: !0 })
|
|
232
216
|
], i.prototype, "invalid", 2);
|
|
233
217
|
t([
|
|
234
|
-
|
|
218
|
+
l()
|
|
235
219
|
], i.prototype, "label", 2);
|
|
236
220
|
t([
|
|
237
|
-
|
|
221
|
+
l({ type: String, reflect: !0 })
|
|
238
222
|
], i.prototype, "name", 2);
|
|
239
223
|
t([
|
|
240
|
-
|
|
224
|
+
l()
|
|
241
225
|
], i.prototype, "placeholder", 2);
|
|
242
226
|
t([
|
|
243
|
-
|
|
227
|
+
m()
|
|
244
228
|
], i.prototype, "type", 1);
|
|
245
229
|
t([
|
|
246
|
-
|
|
230
|
+
l({ attribute: "type", reflect: !0 })
|
|
247
231
|
], i.prototype, "_type", 2);
|
|
248
232
|
t([
|
|
249
|
-
|
|
233
|
+
l()
|
|
250
234
|
], i.prototype, "pattern", 2);
|
|
251
235
|
t([
|
|
252
|
-
|
|
236
|
+
l({ type: Boolean, reflect: !0 })
|
|
253
237
|
], i.prototype, "grows", 2);
|
|
254
238
|
t([
|
|
255
|
-
|
|
239
|
+
l({ type: Number })
|
|
256
240
|
], i.prototype, "maxlength", 2);
|
|
257
241
|
t([
|
|
258
|
-
|
|
242
|
+
l({ type: Number })
|
|
259
243
|
], i.prototype, "minlength", 2);
|
|
260
244
|
t([
|
|
261
|
-
|
|
245
|
+
l({ type: Boolean, reflect: !0 })
|
|
262
246
|
], i.prototype, "multiline", 2);
|
|
263
247
|
t([
|
|
264
|
-
|
|
248
|
+
l({ type: Boolean, reflect: !0 })
|
|
265
249
|
], i.prototype, "readonly", 2);
|
|
266
250
|
t([
|
|
267
|
-
|
|
251
|
+
l({ type: Number })
|
|
268
252
|
], i.prototype, "rows", 2);
|
|
269
253
|
t([
|
|
270
|
-
|
|
254
|
+
l({ type: Boolean, reflect: !0 })
|
|
271
255
|
], i.prototype, "valid", 2);
|
|
272
256
|
t([
|
|
273
|
-
|
|
257
|
+
l({ type: String })
|
|
274
258
|
], i.prototype, "value", 1);
|
|
275
259
|
t([
|
|
276
|
-
|
|
260
|
+
l({ type: Boolean, reflect: !0 })
|
|
277
261
|
], i.prototype, "quiet", 2);
|
|
278
262
|
t([
|
|
279
|
-
|
|
263
|
+
l({ type: Boolean, reflect: !0 })
|
|
280
264
|
], i.prototype, "required", 2);
|
|
281
265
|
t([
|
|
282
|
-
|
|
266
|
+
l({ type: String, reflect: !0 })
|
|
283
267
|
], i.prototype, "autocomplete", 2);
|
|
284
|
-
class
|
|
268
|
+
class B extends i {
|
|
285
269
|
constructor() {
|
|
286
270
|
super(...arguments), this._value = "";
|
|
287
271
|
}
|
|
288
272
|
set value(e) {
|
|
289
273
|
if (e === this.value)
|
|
290
274
|
return;
|
|
291
|
-
const
|
|
292
|
-
this._value = e, this.requestUpdate("value",
|
|
275
|
+
const s = this._value;
|
|
276
|
+
this._value = e, this.requestUpdate("value", s);
|
|
293
277
|
}
|
|
294
278
|
get value() {
|
|
295
279
|
return this._value;
|
|
296
280
|
}
|
|
297
281
|
}
|
|
298
282
|
t([
|
|
299
|
-
|
|
300
|
-
],
|
|
283
|
+
l({ type: String })
|
|
284
|
+
], B.prototype, "value", 1);
|
|
301
285
|
export {
|
|
302
|
-
|
|
286
|
+
B as L,
|
|
303
287
|
i as a
|
|
304
288
|
};
|
|
@@ -15,7 +15,7 @@
|
|
|
15
15
|
* OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
|
|
16
16
|
* SOFTWARE.
|
|
17
17
|
* */
|
|
18
|
-
"use strict";const n=require("lit"),i=require("lit/decorators.js"),s=require("lit/directives/if-defined.js"),
|
|
18
|
+
"use strict";const n=require("lit"),i=require("lit/decorators.js"),s=require("lit/directives/if-defined.js"),y=require("lit/directives/live.js"),h=require("@luzmo/icons"),v=require("./focusable-CbVKgGfS.cjs"),f=require("./sized-mixin-DcvJLFeo.cjs"),m=require("./manage-help-text-Bat9yGvF.cjs"),g=require("./text-field.module-DXhFA9G-.cjs");var $=Object.defineProperty,x=Object.getOwnPropertyDescriptor,r=(p,e,l,a)=>{for(var o=a>1?void 0:a?x(e,l):e,u=p.length-1,d;u>=0;u--)(d=p[u])&&(o=(a?d(e,l,o):d(o))||o);return a&&o&&$(e,l,o),o};const b=["text","url","tel","email","password"];class t extends m.ManageHelpText(f.SizedMixin(v.Focusable,{noDefaultSize:!0})){constructor(){super(...arguments),this.allowedKeys="",this.focused=!1,this.invalid=!1,this.label="",this.placeholder="",this._type="text",this.grows=!1,this.maxlength=-1,this.minlength=-1,this.multiline=!1,this.readonly=!1,this.rows=-1,this.valid=!1,this._value="",this.quiet=!1,this.required=!1}static get styles(){return[n.unsafeCSS(g.textFieldStyles)]}set type(e){const l=this._type;this._type=e,this.requestUpdate("type",l)}get type(){return b.find(e=>e===this._type)??"text"}set value(e){if(e===this.value)return;const l=this._value;this._value=e,this.requestUpdate("value",l)}get value(){return this._value}get focusElement(){return this.inputElement}setSelectionRange(e,l,a="none"){this.inputElement.setSelectionRange(e,l,a)}select(){this.inputElement.select()}handleInput(e){if(this.allowedKeys&&this.inputElement.value&&!new RegExp(`^[${this.allowedKeys}]*$`,"u").test(this.inputElement.value)){const o=this.inputElement.selectionStart-1;this.inputElement.value=this.value.toString(),this.inputElement.setSelectionRange(o,o);return}this.value=this.inputElement.value}handleChange(){this.dispatchEvent(new Event("change",{bubbles:!0,composed:!0}))}onFocus(){this.focused=!this.readonly&&!0}onBlur(e){this.focused=!this.readonly&&!1}handleInputElementPointerdown(){}renderStateIcons(){return this.invalid?n.html`
|
|
19
19
|
<div id="invalid" class="icon">${h.luzmoIcon(h.luzmoAlert)}</div>
|
|
20
20
|
`:this.valid?n.html`
|
|
21
21
|
<div id="valid" class="icon">${h.luzmoIcon(h.luzmoCheck)}</div>
|
|
@@ -39,7 +39,6 @@
|
|
|
39
39
|
.value=${this.displayValue}
|
|
40
40
|
@change=${this.handleChange}
|
|
41
41
|
@input=${this.handleInput}
|
|
42
|
-
@keypress=${this.handleKeyPress}
|
|
43
42
|
@focus=${this.onFocus}
|
|
44
43
|
@blur=${this.onBlur}
|
|
45
44
|
?disabled=${this.disabled}
|
|
@@ -62,10 +61,9 @@
|
|
|
62
61
|
minlength=${s.ifDefined(this.minlength>-1?this.minlength:void 0)}
|
|
63
62
|
pattern=${s.ifDefined(this.pattern)}
|
|
64
63
|
placeholder=${this.placeholder}
|
|
65
|
-
.value=${
|
|
64
|
+
.value=${y.live(this.displayValue)}
|
|
66
65
|
@change=${this.handleChange}
|
|
67
66
|
@input=${this.handleInput}
|
|
68
|
-
@keypress=${this.handleKeyPress}
|
|
69
67
|
@pointerdown=${this.handleInputElementPointerdown}
|
|
70
68
|
@focus=${this.onFocus}
|
|
71
69
|
@blur=${this.onBlur}
|
|
@@ -80,4 +78,4 @@
|
|
|
80
78
|
`}render(){return n.html`
|
|
81
79
|
<div id="text-field">${this.renderField()}</div>
|
|
82
80
|
${this.renderHelpText(this.invalid)}
|
|
83
|
-
`}update(e){(e.has("value")||e.has("required")&&this.required)&&this.updateComplete.then(()=>{this.checkValidity()}),super.update(e)}checkValidity(){let e=this.inputElement.checkValidity();return(this.required||this.value&&this.pattern)&&((this.disabled||this.multiline)&&this.pattern&&(e=new RegExp(`^${this.pattern}$`,"u").test(this.value.toString())),this.minlength!==void 0&&(e=e&&this.value.toString().length>=this.minlength),this.valid=e,this.invalid=!e),e}}r([i.state()],t.prototype,"appliedLabel",2);r([i.property({attribute:"allowed-keys"})],t.prototype,"allowedKeys",2);r([i.property({type:Boolean,reflect:!0})],t.prototype,"focused",2);r([i.query(".input:not(#sizer)")],t.prototype,"inputElement",2);r([i.property({type:Boolean,reflect:!0})],t.prototype,"invalid",2);r([i.property()],t.prototype,"label",2);r([i.property({type:String,reflect:!0})],t.prototype,"name",2);r([i.property()],t.prototype,"placeholder",2);r([i.state()],t.prototype,"type",1);r([i.property({attribute:"type",reflect:!0})],t.prototype,"_type",2);r([i.property()],t.prototype,"pattern",2);r([i.property({type:Boolean,reflect:!0})],t.prototype,"grows",2);r([i.property({type:Number})],t.prototype,"maxlength",2);r([i.property({type:Number})],t.prototype,"minlength",2);r([i.property({type:Boolean,reflect:!0})],t.prototype,"multiline",2);r([i.property({type:Boolean,reflect:!0})],t.prototype,"readonly",2);r([i.property({type:Number})],t.prototype,"rows",2);r([i.property({type:Boolean,reflect:!0})],t.prototype,"valid",2);r([i.property({type:String})],t.prototype,"value",1);r([i.property({type:Boolean,reflect:!0})],t.prototype,"quiet",2);r([i.property({type:Boolean,reflect:!0})],t.prototype,"required",2);r([i.property({type:String,reflect:!0})],t.prototype,"autocomplete",2);class
|
|
81
|
+
`}update(e){(e.has("value")||e.has("required")&&this.required)&&this.updateComplete.then(()=>{this.checkValidity()}),super.update(e)}checkValidity(){let e=this.inputElement.checkValidity();return(this.required||this.value&&this.pattern)&&((this.disabled||this.multiline)&&this.pattern&&(e=new RegExp(`^${this.pattern}$`,"u").test(this.value.toString())),this.minlength!==void 0&&(e=e&&this.value.toString().length>=this.minlength),this.valid=e,this.invalid=!e),e}}r([i.state()],t.prototype,"appliedLabel",2);r([i.property({attribute:"allowed-keys"})],t.prototype,"allowedKeys",2);r([i.property({type:Boolean,reflect:!0})],t.prototype,"focused",2);r([i.query(".input:not(#sizer)")],t.prototype,"inputElement",2);r([i.property({type:Boolean,reflect:!0})],t.prototype,"invalid",2);r([i.property()],t.prototype,"label",2);r([i.property({type:String,reflect:!0})],t.prototype,"name",2);r([i.property()],t.prototype,"placeholder",2);r([i.state()],t.prototype,"type",1);r([i.property({attribute:"type",reflect:!0})],t.prototype,"_type",2);r([i.property()],t.prototype,"pattern",2);r([i.property({type:Boolean,reflect:!0})],t.prototype,"grows",2);r([i.property({type:Number})],t.prototype,"maxlength",2);r([i.property({type:Number})],t.prototype,"minlength",2);r([i.property({type:Boolean,reflect:!0})],t.prototype,"multiline",2);r([i.property({type:Boolean,reflect:!0})],t.prototype,"readonly",2);r([i.property({type:Number})],t.prototype,"rows",2);r([i.property({type:Boolean,reflect:!0})],t.prototype,"valid",2);r([i.property({type:String})],t.prototype,"value",1);r([i.property({type:Boolean,reflect:!0})],t.prototype,"quiet",2);r([i.property({type:Boolean,reflect:!0})],t.prototype,"required",2);r([i.property({type:String,reflect:!0})],t.prototype,"autocomplete",2);class c extends t{constructor(){super(...arguments),this._value=""}set value(e){if(e===this.value)return;const l=this._value;this._value=e,this.requestUpdate("value",l)}get value(){return this._value}}r([i.property({type:String})],c.prototype,"value",1);exports.LuzmoTextField=c;exports.LuzmoTextFieldBase=t;
|