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

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

@@ -1,51 +1,51 @@
-import { UiKitElement as d } from "../base/UiKitElement.js";
-import { customUiKitElement as m } from "../../decorators/customUiKitElement.js";
-import { inputStatesMixin as v } from "../../mixins/inputStatesMixin.js";
-import { booleanConverter as c } from "../../utils/booleanConverter.js";
-import { validateMaxLength as f } from "../../utils/validateMaxLength.js";
-import "../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/reactive-element.js";
-import { html as l, nothing as p } 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 n } from "../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/decorators/property.js";
-import { classMap as b } from "../../node_modules/.pnpm/lit-html@3.3.1/node_modules/lit-html/directives/class-map.js";
-import { commonStyles as g } from "./styles/common.styles.js";
-var y = Object.defineProperty, E = Object.getOwnPropertyDescriptor, r = (t, e, o, a) => {
-  for (var s = a > 1 ? void 0 : a ? E(e, o) : e, h = t.length - 1, u; h >= 0; h--)
-    (u = t[h]) && (s = (a ? u(e, o, s) : u(s)) || s);
-  return a && s && y(e, o, s), s;
-};
-let i = class extends v(d) {
-  constructor() {
-    super(...arguments), this.size = "medium", this.variant = "primary", this.loading = !1, this.helperText = "", this.forcedError = "", this.invalidError = "", this.dataAriaLabelRemoveButton = "", this.dataAriaLabelPositionButton = "", this.withPositionButton = !0, this.handleRemove = () => {
-      this.nativeInput.value = "", this.nativeInput.focus(), ["input", "change"].forEach(
-        (t) => this.nativeInput.dispatchEvent(new Event(t, { bubbles: !0, composed: !0 }))
-      );
-    }, this.handleClickPositionButton = () => {
-      this.dispatchEvent(
-        new Event("ds-search-input:click-position-button", {
-          bubbles: !0,
-          composed: !0
-        })
-      );
-    };
-  }
-  get classes() {
-    return {
-      container: !0,
-      error: !!this.forcedError,
-      loading: this.loading,
-      [this.size]: !!this.size,
-      [this.variant]: !!this.variant,
-      disabled: this.inputStates.disabled,
-      filled: this.inputStates.filled,
-      invalid: this.inputStates.invalid,
-      focus: this.inputStates.focus,
-      "focus-visible": this.inputStates.focusVisible
-    };
-  }
-  render() {
-    return l`
-            <div part="container" class=${b(this.classes)}>
+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 "../../node_modules/.pnpm/lit@3.3.1/node_modules/lit/decorators.js";
+import { __decorate as r } from "../../_virtual/_@oxc-project_runtime@0.122.0/helpers/decorate.js";
+import { UiKitElement as i } from "../base/UiKitElement.js";
+import { customUiKitElement as a } from "../../decorators/customUiKitElement.js";
+import { booleanConverter as o } from "../../utils/booleanConverter.js";
+import { e as s } 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 { inputStatesMixin as c } from "../../mixins/inputStatesMixin.js";
+import { validateMaxLength as l } from "../../utils/validateMaxLength.js";
+import { commonStyles as u } from "./styles/common.styles.js";
+//#region src/components/ds-search-input/ds-search-input.ts
+var d = class extends c(i) {
+	constructor(...e) {
+		super(...e), this.size = "medium", this.variant = "primary", this.loading = !1, this.helperText = "", this.forcedError = "", this.invalidError = "", this.dataAriaLabelRemoveButton = "", this.dataAriaLabelPositionButton = "", this.withPositionButton = !0, this.handleRemove = () => {
+			this.nativeInput.value = "", this.nativeInput.focus(), ["input", "change"].forEach((e) => this.nativeInput.dispatchEvent(new Event(e, {
+				bubbles: !0,
+				composed: !0
+			})));
+		}, this.handleClickPositionButton = () => {
+			this.dispatchEvent(new Event("ds-search-input:click-position-button", {
+				bubbles: !0,
+				composed: !0
+			}));
+		};
+	}
+	static {
+		this.styles = [u];
+	}
+	get classes() {
+		return {
+			container: !0,
+			error: !!this.forcedError,
+			loading: this.loading,
+			[this.size]: !!this.size,
+			[this.variant]: !!this.variant,
+			disabled: this.inputStates.disabled,
+			filled: this.inputStates.filled,
+			invalid: this.inputStates.invalid,
+			focus: this.inputStates.focus,
+			"focus-visible": this.inputStates.focusVisible
+		};
+	}
+	render() {
+		return t`
+            <div part="container" class=${s(this.classes)}>
                 <div part="input-container" class="input-container">
                     ${this.searchIconTemplate}
                     <slot></slot>
@@ -58,46 +58,41 @@ let i = class extends v(d) {
                 ${this.footerTemplate}
             </div>
         `;
-  }
-  get searchIconTemplate() {
-    return this.componentFactory.createIcon({
-      class: "icon",
-      "icon-name": "magnifying-glass",
-      variant: "standard"
-    });
-  }
-  get removeTemplate() {
-    var t, e, o;
-    return !((e = (t = this.nativeInput) == null ? void 0 : t.value) != null && e.length) || this.loading ? p : this.componentFactory.createIconButton({
-      class: "remove-icon-button",
-      "icon-name": "cross",
-      disabled: !!((o = this.nativeInput) != null && o.disabled),
-      size: this.size,
-      variant: "naked",
-      "@click": this.handleRemove,
-      "data-aria-label": this.dataAriaLabelRemoveButton || "remove button"
-    });
-  }
-  get positionTemplate() {
-    var t;
-    return this.loading || !this.withPositionButton ? p : this.componentFactory.createIconButton({
-      class: "position-icon-button",
-      "icon-name": "position",
-      disabled: !!((t = this.nativeInput) != null && t.disabled),
-      size: this.size,
-      variant: "naked",
-      "@click": this.handleClickPositionButton,
-      "data-aria-label": this.dataAriaLabelPositionButton || "position button"
-    });
-  }
-  get loaderSpinnerTemplate() {
-    return this.componentFactory.createLoaderSpinner({
-      show: this.loading
-    });
-  }
-  get footerTemplate() {
-    var t, e;
-    return !((t = this.helperText) != null && t.length) && !this.forcedError && (!this.inputStates.invalid || !this.invalidError) && Number((e = this.nativeInput) == null ? void 0 : e.maxLength) < 0 ? p : l`
+	}
+	get searchIconTemplate() {
+		return this.componentFactory.createIcon({
+			class: "icon",
+			"icon-name": "magnifying-glass",
+			variant: "standard"
+		});
+	}
+	get removeTemplate() {
+		return !this.nativeInput?.value?.length || this.loading ? e : this.componentFactory.createIconButton({
+			class: "remove-icon-button",
+			"icon-name": "cross",
+			disabled: !!this.nativeInput?.disabled,
+			size: this.size,
+			variant: "naked",
+			"@click": this.handleRemove,
+			"data-aria-label": this.dataAriaLabelRemoveButton || "remove button"
+		});
+	}
+	get positionTemplate() {
+		return this.loading || !this.withPositionButton ? e : this.componentFactory.createIconButton({
+			class: "position-icon-button",
+			"icon-name": "position",
+			disabled: !!this.nativeInput?.disabled,
+			size: this.size,
+			variant: "naked",
+			"@click": this.handleClickPositionButton,
+			"data-aria-label": this.dataAriaLabelPositionButton || "position button"
+		});
+	}
+	get loaderSpinnerTemplate() {
+		return this.componentFactory.createLoaderSpinner({ show: this.loading });
+	}
+	get footerTemplate() {
+		return !this.helperText?.length && !this.forcedError && (!this.inputStates.invalid || !this.invalidError) && Number(this.nativeInput?.maxLength) < 0 ? e : t`
             <div class="footer">
                 ${this.helperTextTemplate}
                 ${this.forcedErrorTemplate}
@@ -105,54 +100,42 @@ let i = class extends v(d) {
                 ${this.lengthTemplate}
             </div>
         `;
-  }
-  get helperTextTemplate() {
-    var t;
-    return this.forcedError || this.inputStates.invalid && this.invalidError || !((t = this.helperText) != null && t.length) ? p : l`<span class="support-text helper-text">${this.helperText}</span>`;
-  }
-  get forcedErrorTemplate() {
-    return this.forcedError ? l`<span class="support-text error-text forced-error">${this.forcedError}</span>` : p;
-  }
-  get invalidErrorTemplate() {
-    return this.forcedError || !this.inputStates.invalid || !this.invalidError ? p : l`<span class="support-text error-text invalid-error">${this.invalidError}</span>`;
-  }
-  get lengthTemplate() {
-    var e, o, a;
-    const t = (o = (e = this.nativeInput) == null ? void 0 : e.maxLength) == null ? void 0 : o.toString();
-    return f(t) ? l`<span class="char-counter">${((a = this.inputStates.currentValue) == null ? void 0 : a.length) || 0}/${t}</span>` : p;
-  }
-};
-i.styles = [g];
-r([
-  n({ type: String })
-], i.prototype, "size", 2);
-r([
-  n({ type: String })
-], i.prototype, "variant", 2);
-r([
-  n({ type: Boolean, converter: c })
-], i.prototype, "loading", 2);
-r([
-  n({ type: String, attribute: "helper-text" })
-], i.prototype, "helperText", 2);
-r([
-  n({ type: String, attribute: "forced-error" })
-], i.prototype, "forcedError", 2);
-r([
-  n({ type: String, attribute: "invalid-error" })
-], i.prototype, "invalidError", 2);
-r([
-  n({ type: String, attribute: "data-aria-label-remove-button" })
-], i.prototype, "dataAriaLabelRemoveButton", 2);
-r([
-  n({ type: String, attribute: "data-aria-label-position-button" })
-], i.prototype, "dataAriaLabelPositionButton", 2);
-r([
-  n({ type: Boolean, converter: c, attribute: "with-position-button" })
-], i.prototype, "withPositionButton", 2);
-i = r([
-  m("ds-search-input")
-], i);
-export {
-  i as DsSearchInput
+	}
+	get helperTextTemplate() {
+		return this.forcedError || this.inputStates.invalid && this.invalidError || !this.helperText?.length ? e : t`<span class="support-text helper-text">${this.helperText}</span>`;
+	}
+	get forcedErrorTemplate() {
+		return this.forcedError ? t`<span class="support-text error-text forced-error">${this.forcedError}</span>` : e;
+	}
+	get invalidErrorTemplate() {
+		return this.forcedError || !this.inputStates.invalid || !this.invalidError ? e : t`<span class="support-text error-text invalid-error">${this.invalidError}</span>`;
+	}
+	get lengthTemplate() {
+		let n = this.nativeInput?.maxLength?.toString();
+		return l(n) ? t`<span class="char-counter">${this.inputStates.currentValue?.length || 0}/${n}</span>` : e;
+	}
 };
+r([n({ type: String })], d.prototype, "size", void 0), r([n({ type: String })], d.prototype, "variant", void 0), r([n({
+	type: Boolean,
+	converter: o
+})], d.prototype, "loading", void 0), r([n({
+	type: String,
+	attribute: "helper-text"
+})], d.prototype, "helperText", void 0), r([n({
+	type: String,
+	attribute: "forced-error"
+})], d.prototype, "forcedError", void 0), r([n({
+	type: String,
+	attribute: "invalid-error"
+})], d.prototype, "invalidError", void 0), r([n({
+	type: String,
+	attribute: "data-aria-label-remove-button"
+})], d.prototype, "dataAriaLabelRemoveButton", void 0), r([n({
+	type: String,
+	attribute: "data-aria-label-position-button"
+})], d.prototype, "dataAriaLabelPositionButton", void 0), r([n({
+	type: Boolean,
+	converter: o,
+	attribute: "with-position-button"
+})], d.prototype, "withPositionButton", void 0), d = r([a("ds-search-input")], d);
+//#endregion

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

@@ -1,12 +1,10 @@
-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 o } from "../../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/css-tag.js";
-const p = o`
+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-input/styles/common.styles.ts
+var t = e`
     :host {
         display: contents;
     }
 `;
-export {
-  p as commonStyles
-};
+//#endregion
+export { t as commonStyles };