@cupra/ui-kit 2.0.0-canary.88 → 2.0.0-canary.89

package/dist/esm/components/ds-search/ds-search.js

@@ -1,107 +1,103 @@
-import { UiKitElement as m } from "../base/UiKitElement.js";
-import { customUiKitElement as y } from "../../decorators/customUiKitElement.js";
-import { FormAssociatedMixin as v } from "../../mixins/FormAssociatedMixin.js";
-import { booleanConverter as u } from "../../utils/booleanConverter.js";
-import { htmlWithTokens as f } from "../../utils/htmlWithTokens.js";
-import "../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/reactive-element.js";
-import { html as o, nothing as c } from "../../node_modules/.pnpm/lit-html@3.3.1/node_modules/lit-html/lit-html.js";
-import "../../node_modules/.pnpm/lit-element@4.2.1/node_modules/lit-element/lit-element.js";
-import { property as r } from "../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/decorators/property.js";
-import { state as d } from "../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/decorators/state.js";
-import { query as g } from "../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/decorators/query.js";
-import { classMap as T } from "../../node_modules/.pnpm/lit-html@3.3.1/node_modules/lit-html/directives/class-map.js";
-import { commonStyles as x, containerStyles as b, helperTextStyles as $, inputFieldStyles as S, inputContainerStyles as _ } from "./styles/common.styles.js";
-var C = Object.defineProperty, I = Object.getOwnPropertyDescriptor, t = (s, l, n, a) => {
-  for (var i = a > 1 ? void 0 : a ? I(l, n) : l, p = s.length - 1, h; p >= 0; p--)
-    (h = s[p]) && (i = (a ? h(l, n, i) : h(i)) || i);
-  return a && i && C(l, n, i), i;
-};
-let e = class extends v(m) {
-  constructor() {
-    super(...arguments), this.initialValue = "", this.label = "", this.helperText = "", this.errorText = "", this.disabled = !1, this.success = !1, this.mode = "light", this.size = "large", this.name = "", this.placeholder = "", this.type = "text", this.focused = !1, this.handleFocus = () => {
-      this.focused = !0;
-    }, this.handleBlur = () => {
-      this.focused = !1;
-    }, this.handleClickClearIcon = () => {
-      this._value = "", this.dispatchEvent(
-        new CustomEvent("ds-search:clear", {
-          bubbles: !0,
-          composed: !0
-        })
-      );
-    }, this.handleInput = (s) => {
-      const l = s.target;
-      this._value = l.value || "";
-    }, this.handleSuccess = (s) => {
-      this.dispatchEvent(
-        new CustomEvent("ds-search:position-success", {
-          bubbles: !0,
-          composed: !0,
-          detail: {
-            position: s
-          }
-        })
-      );
-    }, this.handleError = (s) => {
-      this.dispatchEvent(
-        new CustomEvent("ds-search:position-error", {
-          bubbles: !0,
-          composed: !0,
-          detail: {
-            error: s
-          }
-        })
-      );
-    };
-  }
-  firstUpdated() {
-    this._value = this.initialValue;
-  }
-  get value() {
-    return this._value;
-  }
-  set value(s) {
-    this._value = s;
-  }
-  get classes() {
-    return {
-      container: !0,
-      focused: this.focused,
-      error: !!this.errorText,
-      success: this.success,
-      disabled: this.disabled,
-      [this.size]: !0,
-      [this.mode]: !0
-    };
-  }
-  get searchIconTemplate() {
-    return o`
+import { E as e, x as t } from "../../node_modules/.pnpm/lit-html@3.3.1/node_modules/lit-html/lit-html.js";
+import "../../node_modules/.pnpm/lit@3.3.1/node_modules/lit/index.js";
+import { n } from "../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/decorators/property.js";
+import { r } from "../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/decorators/state.js";
+import { e as i } from "../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/decorators/query.js";
+import "../../node_modules/.pnpm/lit@3.3.1/node_modules/lit/decorators.js";
+import { __decorate as a } from "../../_virtual/_@oxc-project_runtime@0.122.0/helpers/decorate.js";
+import { UiKitElement as o } from "../base/UiKitElement.js";
+import { customUiKitElement as s } from "../../decorators/customUiKitElement.js";
+import { booleanConverter as c } from "../../utils/booleanConverter.js";
+import { htmlWithTokens as l } from "../../utils/htmlWithTokens.js";
+import { e as u } from "../../node_modules/.pnpm/lit-html@3.3.1/node_modules/lit-html/directives/class-map.js";
+import "../../node_modules/.pnpm/lit@3.3.1/node_modules/lit/directives/class-map.js";
+import { FormAssociatedMixin as d } from "../../mixins/FormAssociatedMixin.js";
+import { commonStyles as f, containerStyles as p, helperTextStyles as m, inputContainerStyles as h, inputFieldStyles as g } from "./styles/common.styles.js";
+//#region src/components/ds-search/ds-search.ts
+var _ = class extends d(o) {
+	constructor(...e) {
+		super(...e), this.initialValue = "", this.label = "", this.helperText = "", this.errorText = "", this.disabled = !1, this.success = !1, this.mode = "light", this.size = "large", this.name = "", this.placeholder = "", this.type = "text", this.focused = !1, this.handleFocus = () => {
+			this.focused = !0;
+		}, this.handleBlur = () => {
+			this.focused = !1;
+		}, this.handleClickClearIcon = () => {
+			this._value = "", this.dispatchEvent(new CustomEvent("ds-search:clear", {
+				bubbles: !0,
+				composed: !0
+			}));
+		}, this.handleInput = (e) => {
+			this._value = e.target.value || "";
+		}, this.handleSuccess = (e) => {
+			this.dispatchEvent(new CustomEvent("ds-search:position-success", {
+				bubbles: !0,
+				composed: !0,
+				detail: { position: e }
+			}));
+		}, this.handleError = (e) => {
+			this.dispatchEvent(new CustomEvent("ds-search:position-error", {
+				bubbles: !0,
+				composed: !0,
+				detail: { error: e }
+			}));
+		};
+	}
+	static {
+		this.styles = [
+			f,
+			p,
+			m,
+			g,
+			h
+		];
+	}
+	firstUpdated() {
+		this._value = this.initialValue;
+	}
+	get value() {
+		return this._value;
+	}
+	set value(e) {
+		this._value = e;
+	}
+	get classes() {
+		return {
+			container: !0,
+			focused: this.focused,
+			error: !!this.errorText,
+			success: this.success,
+			disabled: this.disabled,
+			[this.size]: !0,
+			[this.mode]: !0
+		};
+	}
+	get searchIconTemplate() {
+		return t`
             ${this.componentFactory.createIcon({
-      class: "search-icon",
-      "icon-name": "magnifying-glass"
-    })}
+			class: "search-icon",
+			"icon-name": "magnifying-glass"
+		})}
         `;
-  }
-  get positionIconTemplate() {
-    return o`
+	}
+	get positionIconTemplate() {
+		return t`
             ${this.componentFactory.createIcon({
-      class: "position-icon",
-      "icon-name": "position"
-    })}
+			class: "position-icon",
+			"icon-name": "position"
+		})}
         `;
-  }
-  get clearIconTemplate() {
-    return o`
+	}
+	get clearIconTemplate() {
+		return t`
             ${this.componentFactory.createIcon({
-      class: "clear-icon",
-      "data-testid": "clear-icon",
-      "icon-name": "cross",
-      "@click": this.handleClickClearIcon
-    })}
+			class: "clear-icon",
+			"data-testid": "clear-icon",
+			"icon-name": "cross",
+			"@click": this.handleClickClearIcon
+		})}
         `;
-  }
-  get inputTemplate() {
-    return o`
+	}
+	get inputTemplate() {
+		return t`
             <input
                 class="input-field"
                 type=${this.type}
@@ -116,20 +112,20 @@ let e = class extends v(m) {
                 ?disabled=${this.disabled}
             />
         `;
-  }
-  get helperTextTemplate() {
-    return this.helperText ? o`
+	}
+	get helperTextTemplate() {
+		return this.helperText ? t`
             <div class="helper-text" @click=${this.handleClickHelperText}>
                 ${this.positionIconTemplate}
                 ${this.helperText}
             </div>
-        ` : c;
-  }
-  get errorTextTemplate() {
-    return this.errorText ? o`<div class="error-text">${this.errorText}</div>` : c;
-  }
-  get styleTokens() {
-    return f`
+        ` : e;
+	}
+	get errorTextTemplate() {
+		return this.errorText ? t`<div class="error-text">${this.errorText}</div>` : e;
+	}
+	get styleTokens() {
+		return l`
             <style>
                 :host{
                     color-scheme: ${this.mode};
@@ -137,14 +133,14 @@ let e = class extends v(m) {
                 }
             </style>
         `;
-  }
-  handleClickHelperText() {
-    navigator.geolocation.getCurrentPosition(this.handleSuccess, this.handleError);
-  }
-  render() {
-    return o`
+	}
+	handleClickHelperText() {
+		navigator.geolocation.getCurrentPosition(this.handleSuccess, this.handleError);
+	}
+	render() {
+		return t`
             ${this.styleTokens}
-            <div class=${T(this.classes)}>
+            <div class=${u(this.classes)}>
                 <div class="input-container">
                     ${this.searchIconTemplate}
                     ${this.inputTemplate}
@@ -154,57 +150,29 @@ let e = class extends v(m) {
                 ${this.helperTextTemplate}
             </div>
         `;
-  }
-};
-e.styles = [x, b, $, S, _];
-t([
-  r({ type: String, reflect: !0, attribute: "initial-value" })
-], e.prototype, "initialValue", 2);
-t([
-  r({ type: String })
-], e.prototype, "label", 2);
-t([
-  r({ type: String, attribute: "helper-text" })
-], e.prototype, "helperText", 2);
-t([
-  r({ type: String, attribute: "error-text" })
-], e.prototype, "errorText", 2);
-t([
-  r({ type: Boolean, converter: u })
-], e.prototype, "disabled", 2);
-t([
-  r({ type: Boolean, converter: u })
-], e.prototype, "success", 2);
-t([
-  r({ type: String, reflect: !0 })
-], e.prototype, "mode", 2);
-t([
-  r({ type: String })
-], e.prototype, "size", 2);
-t([
-  r({ type: String })
-], e.prototype, "name", 2);
-t([
-  r({ type: String })
-], e.prototype, "placeholder", 2);
-t([
-  r({ type: String, attribute: "max-length" })
-], e.prototype, "maxLength", 2);
-t([
-  r({ type: String })
-], e.prototype, "type", 2);
-t([
-  d()
-], e.prototype, "_value", 2);
-t([
-  d()
-], e.prototype, "focused", 2);
-t([
-  g(".input-field")
-], e.prototype, "inputField", 2);
-e = t([
-  y("ds-search")
-], e);
-export {
-  e as DsSearch
+	}
 };
+a([n({
+	type: String,
+	reflect: !0,
+	attribute: "initial-value"
+})], _.prototype, "initialValue", void 0), a([n({ type: String })], _.prototype, "label", void 0), a([n({
+	type: String,
+	attribute: "helper-text"
+})], _.prototype, "helperText", void 0), a([n({
+	type: String,
+	attribute: "error-text"
+})], _.prototype, "errorText", void 0), a([n({
+	type: Boolean,
+	converter: c
+})], _.prototype, "disabled", void 0), a([n({
+	type: Boolean,
+	converter: c
+})], _.prototype, "success", void 0), a([n({
+	type: String,
+	reflect: !0
+})], _.prototype, "mode", void 0), a([n({ type: String })], _.prototype, "size", void 0), a([n({ type: String })], _.prototype, "name", void 0), a([n({ type: String })], _.prototype, "placeholder", void 0), a([n({
+	type: String,
+	attribute: "max-length"
+})], _.prototype, "maxLength", void 0), a([n({ type: String })], _.prototype, "type", void 0), a([r()], _.prototype, "_value", void 0), a([r()], _.prototype, "focused", void 0), a([i(".input-field")], _.prototype, "inputField", void 0), _ = a([s("ds-search")], _);
+//#endregion

package/dist/esm/components/ds-search/styles/common.styles.js

@@ -1,8 +1,7 @@
-import "../../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/reactive-element.js";
-import "../../../node_modules/.pnpm/lit-html@3.3.1/node_modules/lit-html/lit-html.js";
-import "../../../node_modules/.pnpm/lit-element@4.2.1/node_modules/lit-element/lit-element.js";
-import { css as t } from "../../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/css-tag.js";
-const r = t`
+import { i as e } from "../../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/css-tag.js";
+import "../../../node_modules/.pnpm/lit@3.3.1/node_modules/lit/index.js";
+//#region src/components/ds-search/styles/common.styles.ts
+var t = e`
     :host {
         display: block;
         width: 100%;
@@ -12,11 +11,11 @@ const r = t`
     .helper-text {
         user-select: none;
     }
-`, s = t`
+`, n = e`
     .container {
         position: relative;
     }
-`, l = t`
+`, r = e`
     .input-field::-webkit-search-decoration,
     .input-field::-webkit-search-cancel-button,
     .input-field::-webkit-search-results-button,
@@ -37,14 +36,14 @@ const r = t`
     .input-field:focus {
         outline: none;
     }
-`, c = t`
+`, i = e`
     .helper-text {
         cursor: pointer;
         display: flex;
         justify-content: flex-start;
         align-items: center;
     }
-`, p = t`
+`, a = e`
     .input-container {
         align-items: center;
         justify-content: center;
@@ -52,10 +51,5 @@ const r = t`
         position: relative;
     }
 `;
-export {
-  r as commonStyles,
-  s as containerStyles,
-  c as helperTextStyles,
-  p as inputContainerStyles,
-  l as inputFieldStyles
-};
+//#endregion
+export { t as commonStyles, n as containerStyles, i as helperTextStyles, a as inputContainerStyles, r as inputFieldStyles };