UNPKG

@kelvininc/ui-components

Version:
157 lines (154 loc) 6.45 kB
import { p as proxyCustomElement, H, d as createEvent, h, e as Host } from './p-D6GMjtmE.js'; import { a as EComponentSize } from './p-BRgmvbuh.js'; import { c as EInputFieldType, d as EValidationState, b as EIconName } from './p-DBphUUgi.js'; import './p-BcMhjKoS.js'; import './p-BQDwJ0uF.js'; import { d as defineCustomElement$9 } from './p-BOySlV0g.js'; import { d as defineCustomElement$8 } from './p-BJSKhyhi.js'; import { d as defineCustomElement$7 } from './p-BYJ5hjZN.js'; import { d as defineCustomElement$6 } from './p-Bu3_3dFw.js'; import { d as defineCustomElement$5 } from './p-B41PGLQm.js'; import { d as defineCustomElement$4 } from './p-BIWUEm1f.js'; import { d as defineCustomElement$3 } from './p-DMity2tp.js'; import { d as defineCustomElement$2 } from './p-GHnCHOez.js'; import { d as defineCustomElement$1 } from './p-BuaFqlfN.js'; import { i as isEmpty } from './p-BZNGlO8m.js'; const KvSearch = /*@__PURE__*/ proxyCustomElement(class KvSearch extends H { constructor() { super(); this.__registerHost(); this.__attachShadow(); this.textChange = createEvent(this, "textChange", 7); this.textFieldBlur = createEvent(this, "textFieldBlur", 7); this.clickResetButton = createEvent(this, "clickResetButton", 7); this.rightActionClick = createEvent(this, "rightActionClick", 7); this.fieldClick = createEvent(this, "fieldClick", 7); /** @inheritdoc */ this.type = EInputFieldType.Text; /** @inheritdoc */ this.placeholder = 'Search'; /** @inheritdoc */ this.size = EComponentSize.Large; /** @inheritdoc */ this.inputDisabled = false; /** @inheritdoc */ this.inputRequired = false; /** @inheritdoc */ this.loading = false; /** @inheritdoc */ this.state = EValidationState.None; /** @inheritdoc */ this.inputReadonly = false; /** @inheritdoc */ this.helpText = []; /** @inheritdoc */ this.forcedFocus = false; /** @inheritdoc */ this.value = ''; /** @inheritdoc */ this.useInputMask = false; /** @inheritdoc */ this.inputMaskRegex = ''; this.onTextChange = (event) => { event.stopPropagation(); this.textChange.emit(event.detail); }; this.onResetClick = (event) => { event.stopPropagation(); this.clickResetButton.emit(event.detail); this.textChange.emit(); }; } /** Focus input */ async focusInput() { this.inputRef.focusInput(); } render() { const shouldShowResetIcon = !isEmpty(this.value) && !this.inputDisabled; return (h(Host, { key: '695c53a55e9f86e9354df2903497a6718f55c548' }, h("kv-text-field", { key: '09bf7c96d9f826f14c1de065ab60431d209c4595', ref: el => (this.inputRef = el), actionIcon: shouldShowResetIcon ? EIconName.Close : undefined, onTextChange: this.onTextChange, onRightActionClick: this.onResetClick, type: this.type, label: this.label, examples: this.examples, icon: EIconName.Search, inputName: this.inputName, placeholder: this.placeholder, maxLength: this.maxLength, minLength: this.minLength, max: this.max, min: this.min, step: this.step, size: this.size, inputDisabled: this.inputDisabled, inputRequired: this.inputRequired, loading: this.loading, state: this.state, inputReadonly: this.inputReadonly, helpText: this.helpText, forcedFocus: this.forcedFocus, tooltipConfig: this.tooltipConfig, value: this.value, useInputMask: this.useInputMask, inputMaskRegex: this.inputMaskRegex, fitContent: false }))); } }, [1, "kv-search", { "type": [513], "label": [513], "examples": [16], "inputName": [513, "input-name"], "placeholder": [513], "maxLength": [514, "max-length"], "minLength": [514, "min-length"], "max": [520], "min": [520], "step": [520], "size": [1], "inputDisabled": [516, "input-disabled"], "inputRequired": [516, "input-required"], "loading": [516], "state": [513], "inputReadonly": [516, "input-readonly"], "helpText": [513, "help-text"], "forcedFocus": [516, "forced-focus"], "tooltipConfig": [16, "tooltip-config"], "value": [520], "useInputMask": [516, "use-input-mask"], "inputMaskRegex": [513, "input-mask-regex"], "focusInput": [64] }]); function defineCustomElement() { if (typeof customElements === "undefined") { return; } const components = ["kv-search", "kv-badge", "kv-dirty-dot", "kv-form-help-text", "kv-form-label", "kv-icon", "kv-portal", "kv-text-field", "kv-tooltip", "kv-tooltip-text"]; components.forEach(tagName => { switch (tagName) { case "kv-search": if (!customElements.get(tagName)) { customElements.define(tagName, KvSearch); } break; case "kv-badge": if (!customElements.get(tagName)) { defineCustomElement$9(); } break; case "kv-dirty-dot": if (!customElements.get(tagName)) { defineCustomElement$8(); } break; case "kv-form-help-text": if (!customElements.get(tagName)) { defineCustomElement$7(); } break; case "kv-form-label": if (!customElements.get(tagName)) { defineCustomElement$6(); } break; case "kv-icon": if (!customElements.get(tagName)) { defineCustomElement$5(); } break; case "kv-portal": if (!customElements.get(tagName)) { defineCustomElement$4(); } break; case "kv-text-field": if (!customElements.get(tagName)) { defineCustomElement$3(); } break; case "kv-tooltip": if (!customElements.get(tagName)) { defineCustomElement$2(); } break; case "kv-tooltip-text": if (!customElements.get(tagName)) { defineCustomElement$1(); } break; } }); } defineCustomElement(); export { KvSearch as K, defineCustomElement as d };