@targoninc/jess-components 0.0.29 → 0.0.31

package/dist/index.js

@@ -746,6 +746,18 @@ var InputType;
   InputType2["week"] = "week";
 })(InputType ||= {});
 
+// src/src/Debounce.ts
+var debounceMap = {};
+function debounce(identifier, func, delay = 500) {
+  if (debounceMap[identifier]) {
+    clearTimeout(debounceMap[identifier]);
+  }
+  debounceMap[identifier] = setTimeout(() => {
+    func();
+    delete debounceMap[identifier];
+  }, delay);
+}
+
 // src/src/Components.ts
 function getDisabledClass(config) {
   let disabledClass;
@@ -772,19 +784,13 @@ function input(config) {
   const toggleState = signal(false);
   const configTypeSignal = config.type.constructor === Signal ? config.type : signal(config.type);
   const actualType = compute((t) => t ? InputType.text : configTypeSignal.value, toggleState);
+  const inputId = v4_default();
   let lastChange = 0;
-  let debounceTimeout;
   function validate(newValue) {
     errors.value = [];
     if (config.debounce) {
       if (Date.now() - lastChange < config.debounce) {
-        if (debounceTimeout) {
-          clearTimeout(debounceTimeout);
-        }
-        debounceTimeout = setTimeout(() => {
-          debounceTimeout = undefined;
-          validate(newValue);
-        }, config.debounce);
+        debounce(inputId, () => validate(newValue), config.debounce);
         return;
       }
     }
@@ -813,7 +819,7 @@ function input(config) {
       validate(e.target.value);
     }
     if (config.onchange) {
-      config.onchange(e.target.value);
+      debounce(inputId, () => config.onchange(e.target.value), config.debounce);
     }
     value.value = e.target.value;
   }).onchange((e) => {
@@ -823,7 +829,7 @@ function input(config) {
       validate(e.target.value);
     }
     if (config.onchange) {
-      config.onchange(e.target.value);
+      debounce(inputId, () => config.onchange(e.target.value), config.debounce);
     }
     value.value = e.target.value;
   }).onkeydown(config.onkeydown ?? (() => {})).name(config.name).build(), when(isPassword, eyeButton(toggleState, () => {

package/dist/src/Components.d.ts

@@ -11,8 +11,8 @@ export declare function container(config: ContainerConfig): AnyElement;
 export declare function text(config: TextConfig): AnyElement;
 export declare function heading(config: HeadingConfig): AnyElement;
 export declare function icon(config: IconConfig): Signal<AnyElement>;
-export declare function select(config: SelectConfig): AnyElement;
-export declare function searchableSelect(config: SearchableSelectConfig): AnyElement;
-export declare function searchSelectOption(config: SelectOptionConfig): any;
+export declare function select<T = any>(config: SelectConfig<T>): AnyElement;
+export declare function searchableSelect<T = any>(config: SearchableSelectConfig<T>): AnyElement;
+export declare function searchSelectOption<T = any>(config: SelectOptionConfig<T>): any;
 export declare function checkbox(config: BooleanConfig): AnyElement;
 export declare function toggle(config: BooleanConfig): AnyElement;

package/dist/src/Debounce.d.ts

@@ -0,0 +1 @@
+export declare function debounce(identifier: any, func: () => void, delay?: number): void;

package/dist/src/Types.d.ts

@@ -57,24 +57,24 @@ export interface IconConfig extends BaseComponentConfig {
     isUrl?: TypeOrSignal<boolean>;
     onclick?: Function;
 }
-export interface SelectOption extends BaseComponentConfig {
+export interface SelectOption<T> extends BaseComponentConfig {
     image?: string;
     imageIsUrl?: boolean;
     name: any;
-    id: any;
+    id: any | T;
 }
-export interface SelectOptionConfig extends BaseComponentConfig {
-    option: SelectOption;
+export interface SelectOptionConfig<T> extends BaseComponentConfig {
+    option: SelectOption<T>;
     value: Signal<any>;
     search: Signal<string>;
     optionsVisible: Signal<boolean>;
     selectedId: Signal<any>;
 }
 export interface SearchableSelectConfig<T = string> extends ChangeableConfig<T> {
-    options: Signal<SelectOption[]>;
+    options: Signal<SelectOption<T>[]>;
     value: Signal<T>;
 }
-export type SelectConfig = SearchableSelectConfig;
+export type SelectConfig<T> = SearchableSelectConfig<T>;
 export interface HeadingConfig extends BaseComponentConfig {
     level?: IntRange<1, 6>;
     text: StringOrSignal;

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@targoninc/jess-components",
   "type": "module",
-  "version": "0.0.29",
+  "version": "0.0.31",
   "main": "dist/index.js",
   "types": "dist/index.d.ts",
   "files": [