@odx/foundation 1.0.0-alpha.43 → 1.0.0-alpha.45

package/dist/components/search-bar/search-bar.d.ts

@@ -7,7 +7,7 @@ declare global {
     }
 }
 interface SearchOptions {
-    dispatchEvent: boolean;
+    emitEvent: boolean;
     updateInput: boolean;
     forceUpdate: boolean;
 }

package/dist/components.js

@@ -2090,7 +2090,7 @@ var __decorateClass$N = (decorators, target, key, kind) => {
 var __accessCheck$i = (obj, member, msg) => member.has(obj) || __typeError$i("Cannot " + msg);
 var __privateGet$f = (obj, member, getter) => (__accessCheck$i(obj, member, "read from private field"), getter ? getter.call(obj) : member.get(obj));
 var __privateAdd$i = (obj, member, value) => member.has(obj) ? __typeError$i("Cannot add the same private member more than once") : member instanceof WeakSet ? member.add(obj) : member.set(obj, value);
-var _handleInput$1, _handleClear$1;
+var _handleInput$1, _handleKeyDown$2, _handleClear$1;
 let OdxInput = class extends FormControl(CustomElement) {
   constructor() {
     super(...arguments);
@@ -2100,14 +2100,19 @@ let OdxInput = class extends FormControl(CustomElement) {
     __privateAdd$i(this, _handleInput$1, (event) => {
       this.value = event.target.value;
     });
-    __privateAdd$i(this, _handleClear$1, (event) => {
-      event.stopPropagation();
+    __privateAdd$i(this, _handleKeyDown$2, (event) => {
+      const { actions } = getKeyboardEventInfo(event);
+      if (!actions.escape) return;
+      event.preventDefault();
+      __privateGet$f(this, _handleClear$1).call(this);
+    });
+    __privateAdd$i(this, _handleClear$1, () => {
+      if (!this.clearable || this.emit("clear")) return;
       this.clear();
     });
   }
   clear() {
     this.value = "";
-    this.emit("clear");
   }
   render() {
     const clearButton = when(
@@ -2124,9 +2129,10 @@ let OdxInput = class extends FormControl(CustomElement) {
           ?disabled=${this.disabled}
           ?readonly=${this.readonly}
           .value=${this.value}
-          @change=${forwardEvent}
+          @keydown=${__privateGet$f(this, _handleKeyDown$2)}
+          @change=${forwardEvent(this)}
           @input=${__privateGet$f(this, _handleInput$1)}
-          @search=${forwardEvent}
+          @search=${forwardEvent(this)}
         />
         ${clearButton}
         <slot name="suffix"></slot>
@@ -2135,6 +2141,7 @@ let OdxInput = class extends FormControl(CustomElement) {
   }
 };
 _handleInput$1 = new WeakMap();
+_handleKeyDown$2 = new WeakMap();
 _handleClear$1 = new WeakMap();
 OdxInput.formAssociated = true;
 __decorateClass$N([
@@ -2926,7 +2933,7 @@ let OdxModal = class extends CustomElement {
   }
   render() {
     return html`
-      <dialog class="base" @close=${forwardEvent} @keydown=${__privateGet$9(this, _handleKeyDown)}>
+      <dialog class="base" @close=${forwardEvent(this)} @keydown=${__privateGet$9(this, _handleKeyDown)}>
         <div class="inner">
           ${when(
       this.dismissable,
@@ -3479,17 +3486,16 @@ let OdxSearchBar = class extends CustomElement {
     this.placeholder = "";
     __privateAdd$9(this, _handleSearch, (event) => {
       event.preventDefault();
-      event.stopPropagation();
       this.search(__privateGet$7(this, _OdxSearchBar_instances, inputValue_get));
     });
     __privateAdd$9(this, _handleInput, (event) => {
       if (this.behavior !== SearchBarBehavior.INSTANT) return;
       event.preventDefault();
-      event.stopPropagation();
       __privateGet$7(this, _search).call(this, __privateGet$7(this, _OdxSearchBar_instances, inputValue_get));
     });
-    __privateAdd$9(this, _handleClear, (event) => {
-      event.stopPropagation();
+    __privateAdd$9(this, _handleClear, async (event) => {
+      forwardEvent(this)(event);
+      if (event.defaultPrevented) return;
       this.search("");
     });
   }
@@ -3499,7 +3505,7 @@ let OdxSearchBar = class extends CustomElement {
   search(value, options) {
     if (__privateGet$7(this, _value) === value && options?.forceUpdate !== true) return;
     __privateMethod$7(this, _OdxSearchBar_instances, updateValue_fn).call(this, value, options?.updateInput);
-    if (options?.dispatchEvent === false) return;
+    if (options?.emitEvent === false) return;
     this.dispatchEvent(new SearchEvent(value, this.inputElement.value));
   }
   connectedCallback() {

package/dist/lib/utils/dom.d.ts

@@ -11,5 +11,5 @@ export declare function findClosestDocument(node: Node): ShadowRoot | Document |
 export declare function toPx(value?: string | number | null): string | null;
 export declare function getAssignedElements<T extends HTMLElement = HTMLElement>(host: HTMLElement, ...slots: string[]): T[];
 export declare function waitForAnimations(element?: Element | null, subtree?: boolean): Promise<Animation[]>;
-export declare function forwardEvent(this: HTMLElement, event: Event): void;
+export declare function forwardEvent(target: HTMLElement, eventInit?: EventInit): EventListener;
 //# sourceMappingURL=dom.d.ts.map

package/dist/main.js

@@ -48,9 +48,15 @@ async function waitForAnimations(element, subtree = false) {
   }
   return Promise.all(element.getAnimations({ subtree }).map((animation) => animation.finished)).catch(() => []);
 }
-function forwardEvent(event) {
-  event.stopPropagation();
-  this.dispatchEvent(new CustomEvent(event.type, { bubbles: true, composed: true, cancelable: true }));
+function forwardEvent(target, eventInit) {
+  return (event) => {
+    event.stopPropagation();
+    const shouldPreventDefault = target.dispatchEvent(
+      new CustomEvent(event.type, { bubbles: event.bubbles, composed: event.composed, cancelable: event.cancelable, ...eventInit })
+    );
+    if (shouldPreventDefault) return;
+    event.preventDefault();
+  };
 }
 
 function createOptions(defaultOptions) {

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@odx/foundation",
   "description": "A library of Web Component building blocks for ODX",
-  "version": "1.0.0-alpha.43",
+  "version": "1.0.0-alpha.45",
   "author": "Drägerwerk AG & Co.KGaA",
   "license": "SEE LICENSE IN LICENSE",
   "homepage": "https://odx.draeger.com",