jb-select 7.0.6 → 7.1.1

package/lib/jb-select.ts

@@ -19,7 +19,6 @@ import { i18n } from "jb-core/i18n";
 import type { JBButtonWebComponent } from "jb-button";
 import { JBPopoverWebComponent } from "jb-popover";
 
-//TODO: add clean button to empty the select box after value selection
 //TODO: add IncludeInputInList or freeSolo so user can select item that he wrote without even it exist in select list
 //TODO: handleHomeEndKeys to move focus inside the popup with the Home and End keys.
 /**
@@ -27,29 +26,29 @@ import { JBPopoverWebComponent } from "jb-popover";
  */
 
 // biome-ignore lint/suspicious/noExplicitAny: <we support any type of value and there is no limitation on value type>
-export class JBSelectWebComponent<TValue = any> extends HTMLElement implements WithValidation<ValidationValue<TValue>>, JBFormInputStandards<TValue> {
+export class JBSelectWebComponent<TValue = any> extends HTMLElement implements WithValidation<ValidationValue<TValue>>, JBFormInputStandards<TValue | null> {
   static get formAssociated() {
     return true;
   }
   // we keep selected option here by option but we return TValue when user demand
-  #value: TValue| null;
+  #value: TValue | null = null;
   #textValue = "";
   // if user set value and current option list is not contain the option.
   // we hold it in _notFoundedValue and select value when option value get updated
-  #notFoundedValue: TValue = null;
+  #notFoundedValue: TValue | null = null;
   #optionList = new Set<JBOptionWebComponent<TValue>>()
   //keep selected option dom
   #selectedOption: JBOptionWebComponent<TValue> | null = null;
   callbacks: JBSelectCallbacks<TValue> = {}
   elements!: JBSelectElements;
-  get value(): TValue {
+  get value() {
     if (this.#value !== null && this.#value !== undefined) {
       return this.#value;
     } else {
       return null;
     }
   }
-  set value(value: TValue | null | undefined) {
+  set value(value: TValue | null) {
     this.#setValueFromOutside(value);
   }
   get textValue() {
@@ -62,11 +61,14 @@ export class JBSelectWebComponent<TValue = any> extends HTMLElement implements W
   }
   get selectedOptionTitle() {
     if (this.value) {
-      return this.#selectedOption.optionContentText;
+      return this.#selectedOption?.optionContentText;
     } else {
       return "";
     }
   }
+  get form(){
+    return this.#internals.form;
+  }
   #placeholder = "";
   get placeholder() {
     return this.#placeholder;
@@ -123,6 +125,7 @@ export class JBSelectWebComponent<TValue = any> extends HTMLElement implements W
     if (value) {
       this.#internals.states?.add("disabled");
       this.#internals.ariaDisabled = "true";
+      this.#hideOptionList();
     } else {
       this.#internals.states?.delete("disabled");
       this.#internals.ariaDisabled = "false";
@@ -137,7 +140,7 @@ export class JBSelectWebComponent<TValue = any> extends HTMLElement implements W
   get required() {
     return this.#required;
   }
-  #internals?: ElementInternals;
+  #internals!: ElementInternals;
   /**
  * @description will determine if component trigger jb-validation mechanism automatically on user event or it just let user-developer handle validation mechanism by himself
  */
@@ -149,9 +152,9 @@ export class JBSelectWebComponent<TValue = any> extends HTMLElement implements W
     return this.getAttribute('name') || '';
   }
   set name(value: string) {
-    if(value){
+    if (value) {
       this.setAttribute('name', value);
-    }else{
+    } else {
       this.removeAttribute('name');
     }
   }
@@ -176,11 +179,11 @@ export class JBSelectWebComponent<TValue = any> extends HTMLElement implements W
     if (this.elements.optionListWrapper instanceof JBPopoverWebComponent) {
       this.#setupPopover();
     } else {
-      customElements.whenDefined("jb-popover").then(() =>this.#setupPopover())
+      customElements.whenDefined("jb-popover").then(() => this.#setupPopover())
     }
   }
-  #setupPopover(){
-      this.elements.optionListWrapper.bindTarget(this.elements.selectBox);
+  #setupPopover() {
+    this.elements.optionListWrapper.bindTarget(this.elements.selectBox);
   }
   #callOnInitEvent() {
     const event = new CustomEvent("init", { bubbles: true, composed: true });
@@ -194,7 +197,7 @@ export class JBSelectWebComponent<TValue = any> extends HTMLElement implements W
     const shadowRoot = this.attachShadow({
       mode: "open",
       delegatesFocus: true,
-      serializable:true
+      serializable: true
     });
     registerDefaultVariables();
     const html = `<style>${CSS} ${VariablesCSS}</style>\n${renderHTML()}`;
@@ -211,11 +214,11 @@ export class JBSelectWebComponent<TValue = any> extends HTMLElement implements W
       optionListSlot: shadowRoot.querySelector(".select-list-wrapper .select-list slot")!,
       arrowIcon: shadowRoot.querySelector(".arrow-icon")!,
       clearButton: shadowRoot.querySelector(".clear-button") as JBButtonWebComponent,
-      label:shadowRoot.querySelector("label"),
+      label: shadowRoot.querySelector("label")!,
       emptyListPlaceholder: shadowRoot.querySelector(".empty-list-placeholder")!,
-      mobileSearchInputWrapper: shadowRoot.querySelector(".mobile-search-input-wrapper"),
-      frontBox: shadowRoot.querySelector(".front-box"),
-      selectBox: shadowRoot.querySelector(".select-box")
+      mobileSearchInputWrapper: shadowRoot.querySelector(".mobile-search-input-wrapper")!,
+      frontBox: shadowRoot.querySelector(".front-box")!,
+      selectBox: shadowRoot.querySelector(".select-box")!
     };
     this.#registerEventListener();
     this.#updateListEmptyPlaceholder();
@@ -305,9 +308,9 @@ export class JBSelectWebComponent<TValue = any> extends HTMLElement implements W
         this.reportValidity();
         break;
       case 'hide-clear':
-        if(value === '' || value === 'true'){
+        if (value === '' || value === 'true') {
           this.elements.clearButton.style.display = 'none'
-        }else{
+        } else {
           this.elements.clearButton.style.display = 'block'
         }
         break;
@@ -331,7 +334,7 @@ export class JBSelectWebComponent<TValue = any> extends HTMLElement implements W
   #setValueOnOptionListChanged() {
     //when option list changed we see if current value is valid for new optionlist we set it if not we reset value to null.
     //in some scenario value is set before optionList attached so we store it on this.#notFoundedValue and after option list set we set value from this.#notFoundedValue
-    if (this.#notFoundedValue) {
+    if (this.#notFoundedValue !== null) {
       //if select has no prev value or pending not found value we don't set it because user may input some search terms in input box and developer-user update list base on that value
       //if we set it to null the search term and this.textValue will become null and empty too and it make impossible for user to search in dynamic back-end provided searchable list so we put this condition to prevent it
       const isSet = this.#setValueFromOutside(this.#notFoundedValue);
@@ -350,13 +353,13 @@ export class JBSelectWebComponent<TValue = any> extends HTMLElement implements W
       return true;
     }
     let matchedOption: JBOptionWebComponent<TValue> | null = null;
-    this.#optionList.forEach((option) => {
+    for (const option of this.#optionList) {
       // if we have value mapper we set selected value by object that match mapper
       if (option.value == value) {
         matchedOption = option;
       }
-    });
-    if (matchedOption) {
+    }
+    if (matchedOption !== null) {
       this.#setValue(matchedOption.value, matchedOption);
       return true;
     } else {
@@ -372,7 +375,7 @@ export class JBSelectWebComponent<TValue = any> extends HTMLElement implements W
       this.#selectedOption = option;
     }
   }
-  #setValue(value: TValue, option: JBOptionWebComponent<TValue> | null) {
+  #setValue(value: TValue | null, option: JBOptionWebComponent<TValue> | null) {
     this.#notFoundedValue = null;
     this.#value = value;
     if (value === null || value === undefined) {
@@ -478,6 +481,9 @@ export class JBSelectWebComponent<TValue = any> extends HTMLElement implements W
     }
   }
   focus() {
+    if (this.#disabled) {
+      return;
+    }
     this.elements.input.focus();
     this.#showOptionList();
     this.elements.optionListWrapper.open();
@@ -502,16 +508,18 @@ export class JBSelectWebComponent<TValue = any> extends HTMLElement implements W
     this.elements.input.blur();
   }
   #showOptionList() {
+    this.#internals.states.add("open")
     this.elements.optionListWrapper.classList.add("--show");
   }
   #hideOptionList() {
+    this.#internals.states.delete("open")
     this.elements.optionListWrapper.classList.remove("--show");
   }
   #updateOptionList(filterText: string) {
     const event = new CustomEvent("filter-change", { detail: { filterText }, bubbles: false, cancelable: false, composed: false });
     this.dispatchEvent(event);
   }
-  #onOptionSelect(e: CustomEvent) {
+  #onOptionSelect(e: Event) {
     const prevValue = this.#value;
     const prevOption = this.#selectedOption;
     //because jb-option may be in another shadow dom like jb-option-list we have to get first composed element as a target
@@ -523,7 +531,7 @@ export class JBSelectWebComponent<TValue = any> extends HTMLElement implements W
       const dispatchedEvent = this.#dispatchOnChangeEvent();
       if (dispatchedEvent.defaultPrevented) {
         e.preventDefault();
-        this.#selectOption(prevValue, prevOption);
+        this.#selectOption(prevValue, prevOption!);
       }
     }
 
@@ -535,7 +543,7 @@ export class JBSelectWebComponent<TValue = any> extends HTMLElement implements W
     target.addEventListener("jb-option-disconnected", this.#onOptionDisconnected.bind(this), { once: true, passive: true });
     target.setSelectElement(this);
     this.#optionList.add(target);
-    if (this.#notFoundedValue) {
+    if (this.#notFoundedValue !== null) {
       this.#setValueOnOptionListChanged();
     }
     this.#updateListEmptyPlaceholder();
@@ -550,7 +558,7 @@ export class JBSelectWebComponent<TValue = any> extends HTMLElement implements W
     }
   }
 
-  #selectOption(value: TValue, optionDom: JBOptionWebComponent<TValue>) {
+  #selectOption(value: TValue | null, optionDom: JBOptionWebComponent<TValue>) {
     this.#setValue(value, optionDom);
     this.#checkValidity(true);
   }
@@ -572,7 +580,7 @@ export class JBSelectWebComponent<TValue = any> extends HTMLElement implements W
     this.dispatchEvent(event);
     return event;
   }
-  #setSelectedOptionDom(value: TValue) {
+  #setSelectedOptionDom(value: TValue | null) {
     //when user select option or value changed in any condition we set selected option DOM
     this.elements.selectedValueWrapper.innerHTML = "";
     //if value was null or undefined it remain empty
@@ -601,10 +609,10 @@ export class JBSelectWebComponent<TValue = any> extends HTMLElement implements W
   }
   #getInsideValidation() {
     const validationList: ValidationItem<ValidationValue<TValue>>[] = [];
-    if (this.getAttribute("error") !== null && this.getAttribute("error").trim().length > 0) {
+    if (this.getAttribute("error") !== null && (this.getAttribute("error") ?? "").trim().length > 0) {
       validationList.push({
         validator: undefined,
-        message: this.getAttribute("error"),
+        message: this.getAttribute("error")!,
         stateType: "customError"
       });
     }
@@ -668,7 +676,7 @@ export class JBSelectWebComponent<TValue = any> extends HTMLElement implements W
           } else {
             states["customError"] = true;
           }
-          if (message == '') { message = res.message; }
+          if (message == '') { message = res.message ?? ""; }
 
         }
       });

package/lib/types.ts

@@ -4,7 +4,7 @@ import type{ JBSelectWebComponent } from "./jb-select";
 import type {JBButtonWebComponent} from "jb-button";
 import type { JBPopoverWebComponent } from "jb-popover";
 export type JBSelectCallbacks<TValue> = {
-    getSelectedValueDOM?:(value:TValue,content:HTMLElement) => HTMLElement;
+    getSelectedValueDOM?:(value:TValue|null,content:HTMLElement|null) => HTMLElement;
 }
 
 export type JBSelectElements = {

package/lib/variables.css

@@ -33,8 +33,12 @@
 :host(:state(invalid)) {
   --message-color: var(--jb-select-message-error-color, var(--jb-red));
 }
-
-:host(:focus-within) {
+:host(:state(disabled)) {
+ cursor: not-allowed;
+ --select-box-bg-color: var(--jb-select-bg-color-disabled, hsl(from var(--jb-neutral-10) h 12% 66.1));
+ --value-color:var(--jb-select-value-color-disabled, var(--jb-neutral-3));
+}
+:host(:focus-within:not(:state(disabled))) {
   --border-color: var(--jb-select-border-color-focus, var(--jb-neutral));
 }
 

package/package.json

@@ -16,7 +16,7 @@
     "web component",
     "react component"
   ],
-  "version": "7.0.6",
+  "version": "7.1.1",
   "bugs": "https://github.com/javadbat/jb-select/issues",
   "homepage": "https://javadbat.github.io/design-system/?path=/story/components-form-elements-jbselect",
   "license": "MIT",
@@ -36,11 +36,11 @@
   },
   "dependencies": {
     "jb-validation": ">=0.4.0",
-    "jb-button": ">=3.8.0",
-    "jb-popover": ">=1.6.0",
-    "jb-core":">=0.25.0"
+    "jb-button": ">=3.9.1",
+    "jb-popover": ">=1.6.1",
+    "jb-core":">=0.26.0"
   },
   "devDependencies": {
-    "jb-form":">=0.7.1"
+    "jb-form":">=0.11.0"
   }
 }

package/react/dist/JBOption.d.ts

@@ -1,19 +1,13 @@
 import React, { PropsWithChildren } from 'react';
 import { JBOptionWebComponent } from 'jb-select';
-type TValue = any;
-declare module "react" {
-    namespace JSX {
-        interface IntrinsicElements {
-            'jb-option': JBOptionType;
-        }
-        interface JBOptionType extends React.DetailedHTMLProps<React.HTMLAttributes<JBOptionWebComponent<TValue>>, JBOptionWebComponent<TValue>> {
-            class?: string;
-        }
-    }
+import './module-declaration.js';
+export declare function JBOption<TValue>(props: JBOptionProps<TValue>): React.JSX.Element;
+export declare namespace JBOption {
+    var displayName: string;
 }
-export declare const JBOption: React.ForwardRefExoticComponent<Omit<JBOptionProps<any>, "ref"> & React.RefAttributes<unknown>>;
 type Props<TValue> = {
     value: TValue;
+    ref?: React.ForwardedRef<JBOptionWebComponent<TValue> | undefined>;
 };
 export type JBOptionProps<TValue> = PropsWithChildren<React.JSX.JBOptionType & Props<TValue>>;
 export {};

package/react/dist/JBSelect.d.ts

@@ -32,4 +32,5 @@ export type Props<TValue> = PropsWithChildren<EventProps & JBSelectAttributes<TV
     ref?: React.RefObject<JBSelectWebComponent>;
     size?: SizeVariants;
     name?: string;
+    disabled?: boolean;
 };

package/react/dist/index.cjs.js

@@ -1,2 +1,2 @@
-var e=Object.create,t=Object.defineProperty,r=Object.getOwnPropertyDescriptor,u=Object.getOwnPropertyNames,l=Object.getPrototypeOf,n=Object.prototype.hasOwnProperty,c=(e,l,c,a)=>{if(l&&"object"==typeof l||"function"==typeof l)for(var o,i=u(l),s=0,f=i.length;s<f;s++)o=i[s],n.call(e,o)||o===c||t(e,o,{get:(e=>l[e]).bind(null,o),enumerable:!(a=r(l,o))||a.enumerable});return e},a=(r,u,n)=>(n=null!=r?e(l(r)):{},c(!u&&r&&r.__esModule?n:t(n,"default",{value:r,enumerable:!0}),r));const o=a(require("react"));require("jb-select");const i=a(require("jb-core/react")),s=o.default.forwardRef((e,t)=>{let r=(0,o.useRef)(null);return(0,o.useImperativeHandle)(t,()=>r?r.current:void 0,[r]),(0,o.useEffect)(()=>{r.current&&Array.isArray(e.optionList)&&(r.current.optionList=e.optionList)},[e.optionList,r]),(0,o.useEffect)(()=>{r.current&&"function"==typeof e.getTitle&&r.current.setCallback("getTitle",e.getTitle)},[e.getTitle,r]),(0,o.useEffect)(()=>{r.current&&"function"==typeof e.getValue&&r.current.setCallback("getValue",e.getValue)},[e.getValue,r]),(0,o.useEffect)(()=>{r.current&&"function"==typeof e.getContentDOM&&r.current.setCallback("getContentDOM",e.getContentDOM)},[e.getContentDOM,r]),o.default.createElement("jb-option-list",{ref:r})});function f(e){var t,r;let u=(0,o.useRef)(null);(0,o.useImperativeHandle)(e.ref,()=>u?u.current:void 0,[u]);let{onChange:l,onInit:n,onInput:c,onKeyUp:a,onLoad:s,error:f,getSelectedValueDOM:d,label:p,required:b,message:v,placeholder:g,searchPlaceholder:h,validationList:m,value:E,hideClear:O,...y}=e;return t={onChange:l,onInit:n,onInput:c,onKeyUp:a,onLoad:s},(0,i.useEvent)(u,"load",t.onLoad,!0),(0,i.useEvent)(u,"init",t.onInit,!0),(0,i.useEvent)(u,"keyup",t.onKeyUp),(0,i.useEvent)(u,"change",t.onChange),(0,i.useEvent)(u,"input",t.onInput),r={error:f,getSelectedValueDOM:d,label:p,required:b,message:v,placeholder:g,searchPlaceholder:h,validationList:m,value:E,hideClear:O},(0,o.useEffect)(()=>{null!==r.message&&void 0!==r.message?u.current?.setAttribute("message",r.message):u.current?.removeAttribute("message")},[r.message]),(0,o.useEffect)(()=>{u?.current&&(u.current.validation.list=r.validationList||[])},[u.current,r.validationList]),(0,o.useEffect)(()=>{null!==r.label&&void 0!==r.label?u.current?.setAttribute("label",r.label):u.current?.removeAttribute("label")},[r.label,u.current]),(0,o.useEffect)(()=>{null!==r.required&&void 0!==r.required?u.current?.setAttribute("required",""):u.current?.removeAttribute("required")},[r.required,u]),(0,o.useEffect)(()=>{null!==r.hideClear&&void 0!==r.hideClear?u.current?.setAttribute("hide-clear",""):u.current?.removeAttribute("hide-clear")},[r.hideClear,u]),(0,o.useEffect)(()=>{null!==r.placeholder&&void 0!==r.placeholder&&u.current?.setAttribute("placeholder",r.placeholder)},[r.placeholder,u]),(0,o.useEffect)(()=>{null!==r.searchPlaceholder&&void 0!==r.searchPlaceholder&&u.current?.setAttribute("search-placeholder",r.searchPlaceholder)},[r.searchPlaceholder]),(0,o.useEffect)(()=>{r.error?u?.current?.setAttribute("error",r.error):u?.current?.removeAttribute("error")},[r.error]),(0,o.useEffect)(()=>{u.current&&(u.current.value=r.value)},[r.value]),(0,o.useEffect)(()=>{"function"==typeof r.getSelectedValueDOM&&u.current&&u.current&&(u.current.callbacks.getSelectedValueDOM=r.getSelectedValueDOM)},[r.getSelectedValueDOM]),o.default.createElement("jb-select",{ref:u,...y},e.children)}s.displayName="JBOptionList",f.displayName="JBSelect";const d=o.default.forwardRef((e,t)=>{let r=(0,o.useRef)(null),{value:u,children:l,className:n,...c}=e;return(0,o.useImperativeHandle)(t,()=>r?r.current:void 0,[r]),(0,o.useEffect)(()=>{r.current&&void 0!==u&&(r.current.value=u)},[u,r]),o.default.createElement("jb-option",{class:n,ref:r,...c},l)});d.displayName="JBOption",exports.JBOption=d,exports.JBOptionList=s,exports.JBSelect=f;
+var e=Object.create,t=Object.defineProperty,r=Object.getOwnPropertyDescriptor,l=Object.getOwnPropertyNames,u=Object.getPrototypeOf,n=Object.prototype.hasOwnProperty,c=(e,u,c,a)=>{if(u&&"object"==typeof u||"function"==typeof u)for(var o,i=l(u),s=0,f=i.length;s<f;s++)o=i[s],n.call(e,o)||o===c||t(e,o,{get:(e=>u[e]).bind(null,o),enumerable:!(a=r(u,o))||a.enumerable});return e},a=(r,l,n)=>(n=null!=r?e(u(r)):{},c(!l&&r&&r.__esModule?n:t(n,"default",{value:r,enumerable:!0}),r));const o=a(require("react"));require("jb-select");const i=a(require("jb-core/react")),s=o.default.forwardRef((e,t)=>{let r=(0,o.useRef)(null);return(0,o.useImperativeHandle)(t,()=>r?r.current:void 0,[r]),(0,o.useEffect)(()=>{r.current&&Array.isArray(e.optionList)&&(r.current.optionList=e.optionList)},[e.optionList,r]),(0,o.useEffect)(()=>{r.current&&"function"==typeof e.getTitle&&r.current.setCallback("getTitle",e.getTitle)},[e.getTitle,r]),(0,o.useEffect)(()=>{r.current&&"function"==typeof e.getValue&&r.current.setCallback("getValue",e.getValue)},[e.getValue,r]),(0,o.useEffect)(()=>{r.current&&"function"==typeof e.getContentDOM&&r.current.setCallback("getContentDOM",e.getContentDOM)},[e.getContentDOM,r]),o.default.createElement("jb-option-list",{ref:r})});function f(e){var t,r;let l=(0,o.useRef)(null);(0,o.useImperativeHandle)(e.ref,()=>l?l.current:void 0,[l]);let{onChange:u,onInit:n,onInput:c,onKeyUp:a,onLoad:s,error:f,getSelectedValueDOM:d,label:p,required:b,message:v,placeholder:g,searchPlaceholder:h,validationList:m,value:E,hideClear:O,...y}=e;return t={onChange:u,onInit:n,onInput:c,onKeyUp:a,onLoad:s},(0,i.useEvent)(l,"load",t.onLoad,!0),(0,i.useEvent)(l,"init",t.onInit,!0),(0,i.useEvent)(l,"keyup",t.onKeyUp),(0,i.useEvent)(l,"change",t.onChange),(0,i.useEvent)(l,"input",t.onInput),r={error:f,getSelectedValueDOM:d,label:p,required:b,message:v,placeholder:g,searchPlaceholder:h,validationList:m,value:E,hideClear:O},(0,o.useEffect)(()=>{null!==r.message&&void 0!==r.message?l.current?.setAttribute("message",r.message):l.current?.removeAttribute("message")},[r.message]),(0,o.useEffect)(()=>{l?.current&&(l.current.validation.list=r.validationList||[])},[l.current,r.validationList]),(0,o.useEffect)(()=>{null!==r.label&&void 0!==r.label?l.current?.setAttribute("label",r.label):l.current?.removeAttribute("label")},[r.label,l.current]),(0,o.useEffect)(()=>{null!==r.required&&void 0!==r.required?l.current?.setAttribute("required",""):l.current?.removeAttribute("required")},[r.required,l]),(0,o.useEffect)(()=>{null!==r.hideClear&&void 0!==r.hideClear?l.current?.setAttribute("hide-clear",""):l.current?.removeAttribute("hide-clear")},[r.hideClear,l]),(0,o.useEffect)(()=>{null!==r.placeholder&&void 0!==r.placeholder&&l.current?.setAttribute("placeholder",r.placeholder)},[r.placeholder,l]),(0,o.useEffect)(()=>{null!==r.searchPlaceholder&&void 0!==r.searchPlaceholder&&l.current?.setAttribute("search-placeholder",r.searchPlaceholder)},[r.searchPlaceholder]),(0,o.useEffect)(()=>{r.error?l?.current?.setAttribute("error",r.error):l?.current?.removeAttribute("error")},[r.error]),(0,o.useEffect)(()=>{l.current&&(l.current.value=r.value)},[r.value]),(0,o.useEffect)(()=>{"function"==typeof r.getSelectedValueDOM&&l.current&&l.current&&(l.current.callbacks.getSelectedValueDOM=r.getSelectedValueDOM)},[r.getSelectedValueDOM]),o.default.createElement("jb-select",{ref:l,...y},e.children)}function d(e){let t=(0,o.useRef)(null),{children:r,ref:l,className:u,...n}=e;return(0,o.useImperativeHandle)(l,()=>t.current??void 0,[t]),o.default.createElement("jb-option",{class:u,ref:t,...n},r)}s.displayName="JBOptionList",f.displayName="JBSelect",d.displayName="JBOption",exports.JBOption=d,exports.JBOptionList=s,exports.JBSelect=f;
 //# sourceMappingURL=index.cjs.js.map

package/react/dist/index.cjs.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.cjs.js","names":[],"sources":["../lib/JBOptionList.tsx","../lib/events-hook.ts","../lib/attributes-hook.ts","../lib/JBSelect.tsx","../lib/JBOption.tsx"],"sourcesContent":[],"mappings":"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"}
+{"version":3,"file":"index.cjs.js","names":[],"sources":["../lib/JBOptionList.tsx","../lib/events-hook.ts","../lib/attributes-hook.ts","../lib/JBSelect.tsx","../lib/JBOption.tsx"],"sourcesContent":[],"mappings":"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"}

package/react/dist/index.js

@@ -1,2 +1,2 @@
-import e,{useEffect as t,useImperativeHandle as r,useRef as l}from"react";import"jb-select";import{useEvent as n}from"jb-core/react";let u=e.forwardRef((n,u)=>{let a=l(null);return r(u,()=>a?a.current:void 0,[a]),t(()=>{a.current&&Array.isArray(n.optionList)&&(a.current.optionList=n.optionList)},[n.optionList,a]),t(()=>{a.current&&"function"==typeof n.getTitle&&a.current.setCallback("getTitle",n.getTitle)},[n.getTitle,a]),t(()=>{a.current&&"function"==typeof n.getValue&&a.current.setCallback("getValue",n.getValue)},[n.getValue,a]),t(()=>{a.current&&"function"==typeof n.getContentDOM&&a.current.setCallback("getContentDOM",n.getContentDOM)},[n.getContentDOM,a]),e.createElement("jb-option-list",{ref:a})});function a(u){var a,i;let c=l(null);r(u.ref,()=>c?c.current:void 0,[c]);let{onChange:o,onInit:s,onInput:d,onKeyUp:p,onLoad:b,error:g,getSelectedValueDOM:h,label:v,required:m,message:f,placeholder:A,searchPlaceholder:O,validationList:y,value:C,hideClear:L,...D}=u;return n(c,"load",(a={onChange:o,onInit:s,onInput:d,onKeyUp:p,onLoad:b}).onLoad,!0),n(c,"init",a.onInit,!0),n(c,"keyup",a.onKeyUp),n(c,"change",a.onChange),n(c,"input",a.onInput),i={error:g,getSelectedValueDOM:h,label:v,required:m,message:f,placeholder:A,searchPlaceholder:O,validationList:y,value:C,hideClear:L},t(()=>{null!==i.message&&void 0!==i.message?c.current?.setAttribute("message",i.message):c.current?.removeAttribute("message")},[i.message]),t(()=>{c?.current&&(c.current.validation.list=i.validationList||[])},[c.current,i.validationList]),t(()=>{null!==i.label&&void 0!==i.label?c.current?.setAttribute("label",i.label):c.current?.removeAttribute("label")},[i.label,c.current]),t(()=>{null!==i.required&&void 0!==i.required?c.current?.setAttribute("required",""):c.current?.removeAttribute("required")},[i.required,c]),t(()=>{null!==i.hideClear&&void 0!==i.hideClear?c.current?.setAttribute("hide-clear",""):c.current?.removeAttribute("hide-clear")},[i.hideClear,c]),t(()=>{null!==i.placeholder&&void 0!==i.placeholder&&c.current?.setAttribute("placeholder",i.placeholder)},[i.placeholder,c]),t(()=>{null!==i.searchPlaceholder&&void 0!==i.searchPlaceholder&&c.current?.setAttribute("search-placeholder",i.searchPlaceholder)},[i.searchPlaceholder]),t(()=>{i.error?c?.current?.setAttribute("error",i.error):c?.current?.removeAttribute("error")},[i.error]),t(()=>{c.current&&(c.current.value=i.value)},[i.value]),t(()=>{"function"==typeof i.getSelectedValueDOM&&c.current&&c.current&&(c.current.callbacks.getSelectedValueDOM=i.getSelectedValueDOM)},[i.getSelectedValueDOM]),e.createElement("jb-select",{ref:c,...D},u.children)}u.displayName="JBOptionList",a.displayName="JBSelect";let i=e.forwardRef((n,u)=>{let a=l(null),{value:i,children:c,className:o,...s}=n;return r(u,()=>a?a.current:void 0,[a]),t(()=>{a.current&&void 0!==i&&(a.current.value=i)},[i,a]),e.createElement("jb-option",{class:o,ref:a,...s},c)});i.displayName="JBOption";export{i as JBOption,u as JBOptionList,a as JBSelect};
+import e,{useEffect as t,useImperativeHandle as r,useRef as l}from"react";import"jb-select";import{useEvent as n}from"jb-core/react";let u=e.forwardRef((n,u)=>{let i=l(null);return r(u,()=>i?i.current:void 0,[i]),t(()=>{i.current&&Array.isArray(n.optionList)&&(i.current.optionList=n.optionList)},[n.optionList,i]),t(()=>{i.current&&"function"==typeof n.getTitle&&i.current.setCallback("getTitle",n.getTitle)},[n.getTitle,i]),t(()=>{i.current&&"function"==typeof n.getValue&&i.current.setCallback("getValue",n.getValue)},[n.getValue,i]),t(()=>{i.current&&"function"==typeof n.getContentDOM&&i.current.setCallback("getContentDOM",n.getContentDOM)},[n.getContentDOM,i]),e.createElement("jb-option-list",{ref:i})});function i(u){var i,a;let c=l(null);r(u.ref,()=>c?c.current:void 0,[c]);let{onChange:o,onInit:s,onInput:d,onKeyUp:p,onLoad:b,error:g,getSelectedValueDOM:h,label:m,required:v,message:f,placeholder:A,searchPlaceholder:O,validationList:y,value:C,hideClear:L,...D}=u;return n(c,"load",(i={onChange:o,onInit:s,onInput:d,onKeyUp:p,onLoad:b}).onLoad,!0),n(c,"init",i.onInit,!0),n(c,"keyup",i.onKeyUp),n(c,"change",i.onChange),n(c,"input",i.onInput),a={error:g,getSelectedValueDOM:h,label:m,required:v,message:f,placeholder:A,searchPlaceholder:O,validationList:y,value:C,hideClear:L},t(()=>{null!==a.message&&void 0!==a.message?c.current?.setAttribute("message",a.message):c.current?.removeAttribute("message")},[a.message]),t(()=>{c?.current&&(c.current.validation.list=a.validationList||[])},[c.current,a.validationList]),t(()=>{null!==a.label&&void 0!==a.label?c.current?.setAttribute("label",a.label):c.current?.removeAttribute("label")},[a.label,c.current]),t(()=>{null!==a.required&&void 0!==a.required?c.current?.setAttribute("required",""):c.current?.removeAttribute("required")},[a.required,c]),t(()=>{null!==a.hideClear&&void 0!==a.hideClear?c.current?.setAttribute("hide-clear",""):c.current?.removeAttribute("hide-clear")},[a.hideClear,c]),t(()=>{null!==a.placeholder&&void 0!==a.placeholder&&c.current?.setAttribute("placeholder",a.placeholder)},[a.placeholder,c]),t(()=>{null!==a.searchPlaceholder&&void 0!==a.searchPlaceholder&&c.current?.setAttribute("search-placeholder",a.searchPlaceholder)},[a.searchPlaceholder]),t(()=>{a.error?c?.current?.setAttribute("error",a.error):c?.current?.removeAttribute("error")},[a.error]),t(()=>{c.current&&(c.current.value=a.value)},[a.value]),t(()=>{"function"==typeof a.getSelectedValueDOM&&c.current&&c.current&&(c.current.callbacks.getSelectedValueDOM=a.getSelectedValueDOM)},[a.getSelectedValueDOM]),e.createElement("jb-select",{ref:c,...D},u.children)}function a(t){let n=l(null),{children:u,ref:i,className:a,...c}=t;return r(i,()=>n.current??void 0,[n]),e.createElement("jb-option",{class:a,ref:n,...c},u)}u.displayName="JBOptionList",i.displayName="JBSelect",a.displayName="JBOption";export{a as JBOption,u as JBOptionList,i as JBSelect};
 //# sourceMappingURL=index.js.map

package/react/dist/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":[],"sources":["../lib/JBOptionList.tsx","../lib/events-hook.ts","../lib/attributes-hook.ts","../lib/JBSelect.tsx","../lib/JBOption.tsx"],"sourcesContent":[],"mappings":"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"}
+{"version":3,"file":"index.js","names":[],"sources":["../lib/JBOptionList.tsx","../lib/events-hook.ts","../lib/attributes-hook.ts","../lib/JBSelect.tsx","../lib/JBOption.tsx"],"sourcesContent":[],"mappings":";;;;;AAEA,MAAY,+BAAuB,MAAA,WAAqB,CAAA,OAAM,QAAO;CAkBrE,MAAO,UAAM,OAAY,KAAG;AAC1B,qBAAgB,KAAkD,MAAK,UAAA,QAAA,kBAAA,CACvE,OAKA,EAAA;WACM,MAAA;MACF,QAAQ,WAAQ,MAAA,QAAa,MAAM,WAAU,CAC/C,SAAA,QAAA,aAAA,MAAA;CAEF,GAAA,CACE,MAAI;AAGN,WAAU,MAAA;AACV,MAAA,QAAe,kBAAA,MAAA,YAAA,WACT,SAAQ,QAAO,YAAW,YAAc,MAAI,SAAU;KAGxD,MAAM,UACV;WAEI,MAAA;AACF,MAAA,QAAA,kBAAA,MAAA,YAAA,WACE,SAAM,QAAa,YAAW,YAAA,MAAA,SAAA;CAKlC,GAAA,CAQF,MAAa;;;;;;;;;;AC1Cb,SAAgB,UAAU,SAA0C,OAAiB;AACnF,UAAS,SAAS,QAAQ,MAAM,QAAQ,KAAK;AAC7C,UAAS,SAAS,QAAQ,MAAM,QAAQ,KAAK;AAC7C,UAAS,SAAS,SAAS,MAAM,QAAQ;AACzC,UAAS,SAAS,UAAU,MAAM,SAAS;AAC3C,UAAS,SAAS,SAAS,MAAM,QAAQ;AAC3C;;;;ACNA,SAAgB,qBAA6B,SAA0C,OAAiC;AACtH,WAAU,MAAG;AACX,MAAI,MAAM,YAAY,QAAQ,MAAM,mBAClC,SAAQ,SAAS,aAAa,WAAW,MAAM,QAAQ;eAClD,SAAA,gBAAA,UAAA;KAGL,MAAM,OAEV,EAAA;WACM,MAAA;MACF,SAAQ,QACV,SAAA,QAAA,WAAA,OAAA,MAAA,kBAAA,CAAA;CAGF,GAAA,CACE,QAAI,eACF;WACK,MAAA;MACL,MAAA,UAAe,QAAE,MAAA,iBACnB,SAAA,SAAA,aAAA,SAAA,MAAA,MAAA;MAGF,SAAe,SAAA,gBAAA,QAAA;KAGb,MAAA,eAAO;WAEP,MAAA;AACE,MAAA,MAAM,aAAiB,QAAE,MAAA,oBAE7B,SAAe,SAAA,aAAA,YAAA,GAAA;MAEX,SAAQ,SAAS,gBAAa,WAAc;WAE5C,UACF,OACD,EAAA;AAED,WAAU,MAAG;AACX,MAAI,MAAM,cAAW,QAAS,MAAI,qBAChC,SAAQ,SAAS,aAAa,cAAa,GAAE;MAE7C,SAAM,SAAY,gBAAS,aAAA;WAI3B,WACF,OACD,EAAA;AACD,WAAU,MAAG;AACX,MAAI,MAAM,gBAAO,QAAA,MAAA,uBACf,SAAO,SAAS,aAAc,eAAe,MAAM,YAAC;WAEpD,aACF,OACD,EAAA;AACD,WAAU,MAAG;AACX,MAAI,MAAA,sBAAiB,QAAA,MAAA,6BACnB,SAAQ,SAAQ,aAAc,sBAAK,MAAA,kBAAA;CAEtC,GAAE,CACH,MAAU;WAEN,MAAA;AACF,MAAA,MAAA,MACE,UAAM,SAAA,aAAqB,SAAA,MAAA,MAAA;;;;;;;;;;;;;AC5EjC,SAAS,SAAA,OAA+C;CAuBxD,MAAM,UAAU,OAAiB,KAAoB;AACnD,qBAAgB,MAA6B,KAAK,MAAA,UAAA,QAAA,kBAAA,CAClD,OAKA,EAAA;CACA,MAAA,EAAA,UAAiB,QAAI,SAAU,SAAQ,QAAS,OAAS,qBAAS,OAAA,UAAA,SAAA,aAAA,mBAAA,gBAAA,OAAA,UAAA,GAAA,YAAA,GAAA;AAClE,WAAA,SAAA;EACA;EAKF;EAAC;EAQO;;;;;;;;;;;;;;;;;;;;;;;;AC9CR,SAAgB,SAAkB,OAA4B;CAC5D,MAAM,UAAU,OAAqC,KAAK;CAE1D,MAAM,EAAC,UAAU,KAAI,UAAW,GAAG,MAAK,GAAG;AAC3C,qBACE,KACA,MAAG,QAAI,mBAAiB,CAI1B,OAKF,EAAA;AAAC,wBAAA,MAAA,cAAA,aAAA;EAQO,OAAC"}

package/react/dist/index.umd.js

@@ -1,2 +1,2 @@
-var e,t;e=this,t=function(e,t,r,l){var u=Object.create,n=Object.defineProperty,c=Object.getOwnPropertyDescriptor,a=Object.getOwnPropertyNames,o=Object.getPrototypeOf,i=Object.prototype.hasOwnProperty,s=(e,t,r,l)=>{if(t&&"object"==typeof t||"function"==typeof t)for(var u,o=a(t),s=0,f=o.length;s<f;s++)u=o[s],i.call(e,u)||u===r||n(e,u,{get:(e=>t[e]).bind(null,u),enumerable:!(l=c(t,u))||l.enumerable});return e},f=(e,t,r)=>(r=null!=e?u(o(e)):{},s(!t&&e&&e.__esModule?r:n(r,"default",{value:e,enumerable:!0}),e));t=f(t),l=f(l);let d=t.default.forwardRef((e,r)=>{let l=(0,t.useRef)(null);return(0,t.useImperativeHandle)(r,()=>l?l.current:void 0,[l]),(0,t.useEffect)(()=>{l.current&&Array.isArray(e.optionList)&&(l.current.optionList=e.optionList)},[e.optionList,l]),(0,t.useEffect)(()=>{l.current&&"function"==typeof e.getTitle&&l.current.setCallback("getTitle",e.getTitle)},[e.getTitle,l]),(0,t.useEffect)(()=>{l.current&&"function"==typeof e.getValue&&l.current.setCallback("getValue",e.getValue)},[e.getValue,l]),(0,t.useEffect)(()=>{l.current&&"function"==typeof e.getContentDOM&&l.current.setCallback("getContentDOM",e.getContentDOM)},[e.getContentDOM,l]),t.default.createElement("jb-option-list",{ref:l})});function p(e){var r,u;let n=(0,t.useRef)(null);(0,t.useImperativeHandle)(e.ref,()=>n?n.current:void 0,[n]);let{onChange:c,onInit:a,onInput:o,onKeyUp:i,onLoad:s,error:f,getSelectedValueDOM:d,label:p,required:b,message:v,placeholder:g,searchPlaceholder:h,validationList:m,value:y,hideClear:E,...O}=e;return r={onChange:c,onInit:a,onInput:o,onKeyUp:i,onLoad:s},(0,l.useEvent)(n,"load",r.onLoad,!0),(0,l.useEvent)(n,"init",r.onInit,!0),(0,l.useEvent)(n,"keyup",r.onKeyUp),(0,l.useEvent)(n,"change",r.onChange),(0,l.useEvent)(n,"input",r.onInput),u={error:f,getSelectedValueDOM:d,label:p,required:b,message:v,placeholder:g,searchPlaceholder:h,validationList:m,value:y,hideClear:E},(0,t.useEffect)(()=>{null!==u.message&&void 0!==u.message?n.current?.setAttribute("message",u.message):n.current?.removeAttribute("message")},[u.message]),(0,t.useEffect)(()=>{n?.current&&(n.current.validation.list=u.validationList||[])},[n.current,u.validationList]),(0,t.useEffect)(()=>{null!==u.label&&void 0!==u.label?n.current?.setAttribute("label",u.label):n.current?.removeAttribute("label")},[u.label,n.current]),(0,t.useEffect)(()=>{null!==u.required&&void 0!==u.required?n.current?.setAttribute("required",""):n.current?.removeAttribute("required")},[u.required,n]),(0,t.useEffect)(()=>{null!==u.hideClear&&void 0!==u.hideClear?n.current?.setAttribute("hide-clear",""):n.current?.removeAttribute("hide-clear")},[u.hideClear,n]),(0,t.useEffect)(()=>{null!==u.placeholder&&void 0!==u.placeholder&&n.current?.setAttribute("placeholder",u.placeholder)},[u.placeholder,n]),(0,t.useEffect)(()=>{null!==u.searchPlaceholder&&void 0!==u.searchPlaceholder&&n.current?.setAttribute("search-placeholder",u.searchPlaceholder)},[u.searchPlaceholder]),(0,t.useEffect)(()=>{u.error?n?.current?.setAttribute("error",u.error):n?.current?.removeAttribute("error")},[u.error]),(0,t.useEffect)(()=>{n.current&&(n.current.value=u.value)},[u.value]),(0,t.useEffect)(()=>{"function"==typeof u.getSelectedValueDOM&&n.current&&n.current&&(n.current.callbacks.getSelectedValueDOM=u.getSelectedValueDOM)},[u.getSelectedValueDOM]),t.default.createElement("jb-select",{ref:n,...O},e.children)}d.displayName="JBOptionList",p.displayName="JBSelect";let b=t.default.forwardRef((e,r)=>{let l=(0,t.useRef)(null),{value:u,children:n,className:c,...a}=e;return(0,t.useImperativeHandle)(r,()=>l?l.current:void 0,[l]),(0,t.useEffect)(()=>{l.current&&void 0!==u&&(l.current.value=u)},[u,l]),t.default.createElement("jb-option",{class:c,ref:l,...a},n)});b.displayName="JBOption",e.JBOption=b,e.JBOptionList=d,e.JBSelect=p},"object"==typeof exports&&"undefined"!=typeof module?t(exports,require("react"),require("jb-select"),require("jb-core/react")):"function"==typeof define&&define.amd?define(["exports","react","jb-select","jb-core/react"],t):t((e="undefined"!=typeof globalThis?globalThis:e||self).JBSelectReact={},e.React,e.JBSelect,e.JBCoreReact);
+var e,t;e=this,t=function(e,t,r,l){var u=Object.create,n=Object.defineProperty,c=Object.getOwnPropertyDescriptor,a=Object.getOwnPropertyNames,o=Object.getPrototypeOf,i=Object.prototype.hasOwnProperty,s=(e,t,r,l)=>{if(t&&"object"==typeof t||"function"==typeof t)for(var u,o=a(t),s=0,f=o.length;s<f;s++)u=o[s],i.call(e,u)||u===r||n(e,u,{get:(e=>t[e]).bind(null,u),enumerable:!(l=c(t,u))||l.enumerable});return e},f=(e,t,r)=>(r=null!=e?u(o(e)):{},s(!t&&e&&e.__esModule?r:n(r,"default",{value:e,enumerable:!0}),e));t=f(t),l=f(l);let d=t.default.forwardRef((e,r)=>{let l=(0,t.useRef)(null);return(0,t.useImperativeHandle)(r,()=>l?l.current:void 0,[l]),(0,t.useEffect)(()=>{l.current&&Array.isArray(e.optionList)&&(l.current.optionList=e.optionList)},[e.optionList,l]),(0,t.useEffect)(()=>{l.current&&"function"==typeof e.getTitle&&l.current.setCallback("getTitle",e.getTitle)},[e.getTitle,l]),(0,t.useEffect)(()=>{l.current&&"function"==typeof e.getValue&&l.current.setCallback("getValue",e.getValue)},[e.getValue,l]),(0,t.useEffect)(()=>{l.current&&"function"==typeof e.getContentDOM&&l.current.setCallback("getContentDOM",e.getContentDOM)},[e.getContentDOM,l]),t.default.createElement("jb-option-list",{ref:l})});function p(e){var r,u;let n=(0,t.useRef)(null);(0,t.useImperativeHandle)(e.ref,()=>n?n.current:void 0,[n]);let{onChange:c,onInit:a,onInput:o,onKeyUp:i,onLoad:s,error:f,getSelectedValueDOM:d,label:p,required:b,message:v,placeholder:g,searchPlaceholder:h,validationList:m,value:y,hideClear:E,...O}=e;return r={onChange:c,onInit:a,onInput:o,onKeyUp:i,onLoad:s},(0,l.useEvent)(n,"load",r.onLoad,!0),(0,l.useEvent)(n,"init",r.onInit,!0),(0,l.useEvent)(n,"keyup",r.onKeyUp),(0,l.useEvent)(n,"change",r.onChange),(0,l.useEvent)(n,"input",r.onInput),u={error:f,getSelectedValueDOM:d,label:p,required:b,message:v,placeholder:g,searchPlaceholder:h,validationList:m,value:y,hideClear:E},(0,t.useEffect)(()=>{null!==u.message&&void 0!==u.message?n.current?.setAttribute("message",u.message):n.current?.removeAttribute("message")},[u.message]),(0,t.useEffect)(()=>{n?.current&&(n.current.validation.list=u.validationList||[])},[n.current,u.validationList]),(0,t.useEffect)(()=>{null!==u.label&&void 0!==u.label?n.current?.setAttribute("label",u.label):n.current?.removeAttribute("label")},[u.label,n.current]),(0,t.useEffect)(()=>{null!==u.required&&void 0!==u.required?n.current?.setAttribute("required",""):n.current?.removeAttribute("required")},[u.required,n]),(0,t.useEffect)(()=>{null!==u.hideClear&&void 0!==u.hideClear?n.current?.setAttribute("hide-clear",""):n.current?.removeAttribute("hide-clear")},[u.hideClear,n]),(0,t.useEffect)(()=>{null!==u.placeholder&&void 0!==u.placeholder&&n.current?.setAttribute("placeholder",u.placeholder)},[u.placeholder,n]),(0,t.useEffect)(()=>{null!==u.searchPlaceholder&&void 0!==u.searchPlaceholder&&n.current?.setAttribute("search-placeholder",u.searchPlaceholder)},[u.searchPlaceholder]),(0,t.useEffect)(()=>{u.error?n?.current?.setAttribute("error",u.error):n?.current?.removeAttribute("error")},[u.error]),(0,t.useEffect)(()=>{n.current&&(n.current.value=u.value)},[u.value]),(0,t.useEffect)(()=>{"function"==typeof u.getSelectedValueDOM&&n.current&&n.current&&(n.current.callbacks.getSelectedValueDOM=u.getSelectedValueDOM)},[u.getSelectedValueDOM]),t.default.createElement("jb-select",{ref:n,...O},e.children)}function b(e){let r=(0,t.useRef)(null),{children:l,ref:u,className:n,...c}=e;return(0,t.useImperativeHandle)(u,()=>r.current??void 0,[r]),t.default.createElement("jb-option",{class:n,ref:r,...c},l)}d.displayName="JBOptionList",p.displayName="JBSelect",b.displayName="JBOption",e.JBOption=b,e.JBOptionList=d,e.JBSelect=p},"object"==typeof exports&&"undefined"!=typeof module?t(exports,require("react"),require("jb-select"),require("jb-core/react")):"function"==typeof define&&define.amd?define(["exports","react","jb-select","jb-core/react"],t):t((e="undefined"!=typeof globalThis?globalThis:e||self).JBSelectReact={},e.React,e.JBSelect,e.JBCoreReact);
 //# sourceMappingURL=index.umd.js.map

package/react/dist/index.umd.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.umd.js","names":[],"sources":["../lib/JBOptionList.tsx","../lib/events-hook.ts","../lib/attributes-hook.ts","../lib/JBSelect.tsx","../lib/JBOption.tsx"],"sourcesContent":[],"mappings":"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"}
+{"version":3,"file":"index.umd.js","names":[],"sources":["../lib/JBOptionList.tsx","../lib/events-hook.ts","../lib/attributes-hook.ts","../lib/JBSelect.tsx","../lib/JBOption.tsx"],"sourcesContent":[],"mappings":"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"}

package/react/dist/module-declaration.d.ts

@@ -0,0 +1,11 @@
+import type { JBOptionWebComponent } from "jb-select";
+declare module "react" {
+    namespace JSX {
+        interface IntrinsicElements {
+            'jb-option': JBOptionType;
+        }
+        interface JBOptionType extends React.DetailedHTMLProps<React.HTMLAttributes<JBOptionWebComponent<any>>, JBOptionWebComponent<any>> {
+            class?: string;
+        }
+    }
+}

package/react/lib/JBOption.tsx

@@ -1,45 +1,30 @@
 'use client'
-/* eslint-disable react/display-name */
-import React, { useEffect, useRef, useImperativeHandle, PropsWithChildren, ComponentProps } from 'react';
+import React, { useEffect, useRef, useImperativeHandle, PropsWithChildren, ComponentProps, type RefObject } from 'react';
 import { JBOptionWebComponent } from 'jb-select';
-//TODO: make it generic when remove forward ref
-type TValue = any;
+import './module-declaration.js';
 
-declare module "react" {
-  // eslint-disable-next-line @typescript-eslint/no-namespace
-  namespace JSX {
-    interface IntrinsicElements {
-      'jb-option': JBOptionType;
-    }
-    interface JBOptionType extends React.DetailedHTMLProps<React.HTMLAttributes<JBOptionWebComponent<TValue>>, JBOptionWebComponent<TValue>> {
-      class?: string,
-    }
-  }
-}
-export const JBOption = React.forwardRef((props: JBOptionProps<TValue>, ref) => {
+
+
+export function JBOption<TValue> (props: JBOptionProps<TValue>){
   const element = useRef<JBOptionWebComponent<TValue>>(null);
-  const {value,children,className, ...rest} = props;
+  // value is inside ...rest
+  const {children, ref,className, ...rest} = props;
   useImperativeHandle(
     ref,
-    () => (element ? element.current : undefined),
+    () => (element.current??undefined),
     [element],
   );
-  
-  useEffect(() => {
-    if (element.current && value !== undefined) {
-      element.current.value = value;
-    }
-  }, [value, element]);
 
   return (
     <jb-option class={className} ref={element} {...rest}>
       {children}
     </jb-option>
   );
-});
+};
 
 type Props<TValue> = {
-  value:TValue
+  value:TValue,
+  ref?: React.ForwardedRef<JBOptionWebComponent<TValue> | undefined>
 }
 
 export type JBOptionProps<TValue> = PropsWithChildren<React.JSX.JBOptionType & Props<TValue>>

package/react/lib/JBSelect.tsx

@@ -49,5 +49,6 @@ export type Props<TValue> = PropsWithChildren<EventProps & JBSelectAttributes<TV
   ref?: React.RefObject<JBSelectWebComponent>,
   size?: SizeVariants,
   name?: string,
+  disabled?:boolean,
 }
 JBSelect.displayName = 'JBSelect';

package/react/lib/module-declaration.ts

@@ -0,0 +1,12 @@
+import type { JBOptionWebComponent } from "jb-select";
+
+declare module "react" {
+  namespace JSX {
+    interface IntrinsicElements {
+      'jb-option': JBOptionType;
+    }
+    interface JBOptionType extends React.DetailedHTMLProps<React.HTMLAttributes<JBOptionWebComponent<any>>, JBOptionWebComponent<any>> {
+      class?: string,
+    }
+  }
+}