jb-textarea 3.7.0 → 3.8.0

package/package.json

@@ -14,7 +14,7 @@
     "web component",
     "web-component"
   ],
-  "version": "3.7.0",
+  "version": "3.8.0",
   "bugs": "https://github.com/javadbat/jb-textarea/issues",
   "license": "MIT",
   "files": [

package/react/README.md

@@ -89,28 +89,7 @@ the good point of set boundary with css variable is you can set different min or
 
 ## set custom style
 
-in some cases in your project you need to change default style of web-component for example you need zero margin or different border-radius and etc.    
-if you want to set a custom style to this web-component all you need is to set css variable in parent scope of web-component 
-| css variable name                     | description                                                                                   |
-| -------------                         | -------------                                                                                 |
-| --jb-textarea-margin                  | web-component margin default is `0 12px`                                                      |
-| --jb-textarea-border-radius           | web-component border-radius default is `16px`                                                 |
-| --jb-textarea-border-width            | web-component border-width default is `1px`                                                   |
-| --jb-textarea-border-color            | border color of select in normal mode                                                         |
-| --jb-textarea-border-color-focus      | border color of select in normal mode                                                         |
-| --jb-textarea-bgcolor                 | background color of input                                                                     |
-| --jb-textarea-border-botton-width     | border bottom thickness default is `3px`                                                      |
-| --jb-textarea-label-font-size         | font size of input label default is `0.8em`                                                   |
-| --jb-textarea-value-font-size         | font size of input value default is `1.1em`                                                   |
-| --jb-textarea-value-color             | color of value default in `initial`                                                           |
-| --jb-textarea-message-font-size       | font size of message we show under input                                                      |
-| --jb-textarea-message-error-color     | change color of error we show under input default is `red`                                    |
-| --jb-textarea-min-height              | minimum height of text area default is `80px`                                                 |
-| --jb-textarea-max-height              | minimum height of text area default is `none`                                                 |
-| --jb-textarea-placeholder-color       | placeholder color default is 'initial'                                                        |
-| --jb-textarea-placeholder-font-size   | placeholder font-size default is `initial`                                                    |
-| --jb-textarea-label-color             | label color default is `#1f1735`                                                              |    
-| --jb-textarea-value-color             | value color                                                                                   |
+ see see [jb-textarea](https://github.com/javadbat/jb-textarea) document. there is no difference between these 2 in styling.
 
 ## Other Related Docs:
 

package/react/dist/JBTextarea.cjs.js

@@ -1,2 +1,2 @@
-"use strict";var e=Object.create,t=Object.defineProperty,r=Object.getOwnPropertyDescriptor,u=Object.getOwnPropertyNames,n=Object.getPrototypeOf,a=Object.prototype.hasOwnProperty,o=(e,n,o,l)=>{if(n&&"object"==typeof n||"function"==typeof n)for(var c,s=u(n),i=0,f=s.length;i<f;i++)c=s[i],a.call(e,c)||c===o||t(e,c,{get:(e=>n[e]).bind(null,c),enumerable:!(l=r(n,c))||l.enumerable});return e},l=(r,u,a)=>(a=null!=r?e(n(r)):{},o(!u&&r&&r.__esModule?a:t(a,"default",{value:r,enumerable:!0}),r));const c=l(require("react"));require("jb-textarea");const s=l(require("jb-core/react")),i=c.default.forwardRef((e,t)=>{{let r=(0,c.useRef)(null);return(0,c.useImperativeHandle)(t,()=>r?r.current:void 0,[r]),(0,c.useEffect)(()=>{let t=e.value||"";r.current&&(r.current.value=t)},[e.value]),(0,c.useEffect)(()=>{r.current&&(r.current.validation.list=e.validationList||[])},[e.validationList]),(0,c.useEffect)(()=>{r.current&&void 0!==e.required&&(e.required?r.current.setAttribute("required",""):r.current.removeAttribute("required"))},[e.required]),(0,c.useEffect)(()=>{r.current&&(r.current.autoHeight=e.autoHeight||!1)},[e.autoHeight]),(0,c.useEffect)(()=>{e.error?r?.current?.setAttribute("error",e.error):r?.current?.removeAttribute("error")},[e.error]),(0,s.useEvent)(r,"load",e.onLoad,!0),(0,s.useEvent)(r,"init",e.onInit,!0),(0,s.useEvent)(r,"change",e.onChange),(0,s.useEvent)(r,"keydown",e.onKeyDown),(0,s.useEvent)(r,"input",e.onInput),(0,s.useEvent)(r,"keyup",e.onKeyUp),(0,s.useEvent)(r,"focus",e.onFocus),(0,s.useEvent)(r,"blur",e.onBlur),c.default.createElement("jb-textarea",{placeholder:e.placeholder,class:e.className,style:e.style,ref:r,label:e.label,message:e.message,name:e.name})}});exports.JBTextarea=i;
+"use strict";var e=Object.create,t=Object.defineProperty,r=Object.getOwnPropertyDescriptor,u=Object.getOwnPropertyNames,n=Object.getPrototypeOf,a=Object.prototype.hasOwnProperty,o=(e,n,o,c)=>{if(n&&"object"==typeof n||"function"==typeof n)for(var l,s=u(n),i=0,f=s.length;i<f;i++)l=s[i],a.call(e,l)||l===o||t(e,l,{get:(e=>n[e]).bind(null,l),enumerable:!(c=r(n,l))||c.enumerable});return e},c=(r,u,a)=>(a=null!=r?e(n(r)):{},o(!u&&r&&r.__esModule?a:t(a,"default",{value:r,enumerable:!0}),r));const l=c(require("react"));require("jb-textarea");const s=c(require("jb-core/react")),i=l.default.forwardRef((e,t)=>{{let r=(0,l.useRef)(null);return(0,l.useImperativeHandle)(t,()=>r?r.current:void 0,[r]),(0,l.useEffect)(()=>{let t=e.value||"";r.current&&(r.current.value=t)},[e.value]),(0,l.useEffect)(()=>{r.current&&(r.current.validation.list=e.validationList||[])},[e.validationList]),(0,l.useEffect)(()=>{r.current&&void 0!==e.required&&(e.required?r.current.setAttribute("required",""):r.current.removeAttribute("required"))},[e.required]),(0,l.useEffect)(()=>{r.current&&(r.current.autoHeight=e.autoHeight||!1)},[e.autoHeight]),(0,l.useEffect)(()=>{e.error?r?.current?.setAttribute("error",e.error):r?.current?.removeAttribute("error")},[e.error]),(0,l.useEffect)(()=>{e.name?r?.current?.setAttribute("name",e.name||""):r?.current?.removeAttribute("name")},[e.name]),(0,s.useEvent)(r,"load",e.onLoad,!0),(0,s.useEvent)(r,"init",e.onInit,!0),(0,s.useEvent)(r,"change",e.onChange),(0,s.useEvent)(r,"keydown",e.onKeyDown),(0,s.useEvent)(r,"input",e.onInput),(0,s.useEvent)(r,"keyup",e.onKeyUp),(0,s.useEvent)(r,"focus",e.onFocus),(0,s.useEvent)(r,"blur",e.onBlur),l.default.createElement("jb-textarea",{placeholder:e.placeholder,class:e.className,style:e.style,ref:r,label:e.label,message:e.message},e.children)}});exports.JBTextarea=i;
 //# sourceMappingURL=JBTextarea.cjs.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"JBTextarea.cjs.js","names":[],"sources":["../lib/events-hook.ts","../lib/attributes-hook.ts","../lib/JBTextarea.tsx"],"sourcesContent":["import { useEvent } from \"jb-core/react\";\r\nimport { RefObject } from \"react\";\r\nimport type { JBTextareaWebComponent, JBTextareaEventType } from 'jb-textarea';\r\n\r\nexport type EventProps = {\r\n  /**\r\n   * when component loaded, in most cases component is already loaded before react mount so you dont need this but if you load web-component dynamically with lazy load it will be called after react mount\r\n   */\r\n  onLoad?: (e: JBTextareaEventType<CustomEvent>) => void,\r\n  /**\r\n * when all property set and ready to use, in most cases component is already loaded before react mount so you dont need this but if you load web-component dynamically with lazy load it will be called after react mount\r\n */\r\n  onInit?: (e: JBTextareaEventType<CustomEvent>) => void,\r\n  onChange?: (e: JBTextareaEventType<Event>) => void,\r\n  onFocus?: (e: JBTextareaEventType<FocusEvent>) => void,\r\n  onBlur?: (e: JBTextareaEventType<FocusEvent>) => void,\r\n  onKeyDown?: (e: JBTextareaEventType<KeyboardEvent>) => void,\r\n  onKeyUp?: (e: JBTextareaEventType<KeyboardEvent>) => void,\r\n  onInput?: (e: JBTextareaEventType<InputEvent>) => void,\r\n  onBeforeinput?: (e: JBTextareaEventType<InputEvent>) => void,\r\n\r\n}\r\nexport function useEvents(element: RefObject<JBTextareaWebComponent>, props: EventProps) {\r\n  useEvent(element, 'load', props.onLoad, true);\r\n  useEvent(element, 'init', props.onInit, true);\r\n  useEvent(element, 'change', props.onChange);\r\n  useEvent(element, 'keydown', props.onKeyDown);\r\n  useEvent(element, 'input', props.onInput);\r\n  useEvent(element, 'keyup', props.onKeyUp);\r\n  useEvent(element, 'focus', props.onFocus);\r\n  useEvent(element, 'blur', props.onBlur);\r\n}","import { JBTextareaWebComponent, type ValidationValue } from \"jb-textarea\";\r\nimport { type ValidationItem } from \"jb-validation\";\r\nimport { RefObject, useEffect } from \"react\";\r\n\r\nexport type JBTextareaAttributes = {\r\n  value?: string | null | undefined,\r\n  validationList?:ValidationItem<ValidationValue>[],\r\n  autoHeight?: boolean,\r\n  required?:boolean\r\n  error?: string,\r\n}\r\nexport function useJBTextareaAttribute(element: RefObject<JBTextareaWebComponent>, props: JBTextareaAttributes) {\r\n\r\n  useEffect(() => {\r\n    const value:string = props.value || '';\r\n    if(element.current){\r\n      element.current.value = value;\r\n    }\r\n  }, [props.value]);\r\n\r\n  useEffect(() => {\r\n    if(element.current){\r\n      element.current.validation.list = props.validationList || [];\r\n    }\r\n  }, [props.validationList]);\r\n  useEffect(() => {\r\n    if(element.current && props.required!== undefined){\r\n      props.required?element.current.setAttribute(\"required\",''):element.current.removeAttribute(\"required\");\r\n    }\r\n  }, [props.required]);\r\n\r\n  useEffect(() => {\r\n    if(element.current){\r\n      element.current.autoHeight = props.autoHeight || false;\r\n    }\r\n  }, [props.autoHeight]);\r\n  \r\n  useEffect(() => {\r\n    if (props.error) {\r\n      element?.current?.setAttribute('error', props.error);\r\n    } else {\r\n      element?.current?.removeAttribute('error');\r\n    }\r\n  }, [props.error]);\r\n}","/* eslint-disable no-inner-declarations */\r\nimport React, { useRef, useImperativeHandle, CSSProperties } from 'react';\r\nimport 'jb-textarea';\r\n// eslint-disable-next-line no-duplicate-imports\r\nimport {JBTextareaWebComponent} from 'jb-textarea';\r\nimport { EventProps, useEvents } from './events-hook.js';\r\nimport { JBTextareaAttributes, useJBTextareaAttribute } from './attributes-hook.js';\r\ndeclare global {\r\n    // eslint-disable-next-line @typescript-eslint/no-namespace\r\n    namespace JSX {\r\n      interface IntrinsicElements {\r\n        'jb-textarea': JBTextareaType;\r\n      }\r\n      interface JBTextareaType extends React.DetailedHTMLProps<React.HTMLAttributes<JBTextareaWebComponent>, JBTextareaWebComponent> {\r\n        class?:string,\r\n        label?: string,\r\n        name?:string,\r\n        message?:string,\r\n        placeholder?:string,\r\n        // ref:React.RefObject<JBDateInputWebComponent>,\r\n      }\r\n    }\r\n}\r\n// eslint-disable-next-line react/display-name\r\nconst JBTextarea = React.forwardRef((props:Props, ref) => {\r\n  {\r\n    //we set this state so when ref change we have a render and our event listener will be updated\r\n    const element = useRef<JBTextareaWebComponent>(null);\r\n    useImperativeHandle(\r\n      ref,\r\n      () => (element ? element.current : undefined),\r\n      [element],\r\n    );\r\n    useJBTextareaAttribute(element, props);\r\n    useEvents(element,props);\r\n    return (\r\n      <jb-textarea placeholder={props.placeholder} class={props.className} style={props.style} ref={element} label={props.label} message={props.message} name={props.name}></jb-textarea>\r\n    );\r\n  }\r\n});\r\n\r\nexport type Props = EventProps & JBTextareaAttributes & {\r\n    label?: string,\r\n    placeholder?:string,\r\n    className?: string,\r\n    message?:string,\r\n    style?:CSSProperties,\r\n    name?:string,\r\n}\r\nexport {JBTextarea};"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACO,SAAS,UAAU,SAAQ,OAAA;AAC9B,6BAAS,SAAS,QAAQ,MAAM,QAAQ,KAAK;AACjD,6BAAA,SAAA,QAAA,MAAA,QAAA,KAAA;AACI,6BAAS,SAAS,UAAI,MAAA,SAAA;AACtB,6BAAC,SAAA,WAAA,MAAA,UAAA;AACD,6BAAS,SAAS,SAAS,MAAM,QAAQ;AACzC,6BAAC,SAAA,SAAA,MAAA,QAAA;AACD,6BAAS,SAAS,SAAS,MAAM,QAAQ;AACzC,6BAAC,SAAA,QAAA,MAAA,OAAA;AACJ;;;;ACTM,SAAS,uBAAuB,SAAS,OAAI;AAChD,sBAAU,MAAI;EAClB,MAAA,QAAA,MAAA,SAAA;AACQ,MAAI,QAAQ,QACR,SAAQ,QAAQ,QAAQ;CAE/B,GAAE,CACC,MAAM,KACT,EAAC;AACL,sBAAA,MAAA;AACO,MAAI,QAAQ,QACpB,SAAA,QAAA,WAAA,OAAA,MAAA,kBAAA,CAAA;CAEK,GAAE,CACC,MAAM,cACT,EAAC;AACF,sBAAC,MAAA;AACG,MAAI,QAAQ,WAAA,MAAA,aAAA,UACpB,OAAA,WAAA,QAAA,QAAA,aAAA,YAAA,GAAA,GAAA,QAAA,QAAA,gBAAA,WAAA;CAEK,GAAE,CACC,MAAM,QACT,EAAA;AACD,sBAAU,MAAI;AACV,MAAI,QAAO,QACP,SAAQ,QAAQ,aAAa,MAAM,cAAQ;CAElD,GAAA,CACG,MAAM,UACd,EAAA;AACI,sBAAU,MAAI;AACV,MAAI,MAAM,MACN,UAAS,SAAS,aAAa,SAAS,MAAM,MAAG;MAEjD,UAAS,SAAI,gBAAA,QAAA;CAEpB,GAAE,CACC,MAAM,KACT,EAAC;AACL;;;;ACnCD,MAAM,2BAA2B,cAAM,WAAW,CAAC,OAAM,QAAA;CACrD;EAEI,MAAM,UAAU,kBAAO,KAAK;AAC5B,iCAAW,KAAA,MAAA,UAAA,QAAA,UAAA,WAAA,CACP,OACH,EAAC;AACH,yBAAA,SAAA,MAAA;AACC,YAAU,SAAS,MAAM;AACzB,uBAAc,cAAA,cAAA,eAAA;GACV,aAAW,MAAA;GACX,OAAO,MAAE;GACT,OAAO,MAAK;GACZ,KAAK;GACL,OAAO,MAAM;GAClB,SAAA,MAAA;GACF,MAAA,MAAA;EACJ,EAAA;CACI;AACJ,EAAC"}
+{"version":3,"file":"JBTextarea.cjs.js","names":[],"sources":["../lib/events-hook.ts","../lib/attributes-hook.ts","../lib/JBTextarea.tsx"],"sourcesContent":["","",""],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAsBM,SAAU,UAAU,SAA4C,OAAiB;AACrF,6BAAS,SAAS,QAAQ,MAAM,QAAQ,KAAK;AAC7C,6BAAS,SAAS,QAAQ,MAAM,QAAQ,KAAK;AAC7C,6BAAS,SAAS,UAAU,MAAM,SAAS;AAC3C,6BAAS,SAAS,WAAW,MAAM,UAAU;AAC7C,6BAAS,SAAS,SAAS,MAAM,QAAQ;AACzC,6BAAS,SAAS,SAAS,MAAM,QAAQ;AACzC,6BAAS,SAAS,SAAS,MAAM,QAAQ;AACzC,6BAAS,SAAS,QAAQ,MAAM,OAAO;AACzC;;;;AClBM,SAAU,uBAAuB,SAA4C,OAA2B;AAE5G,sBAAU,MAAG;EACX,MAAM,QAAe,MAAM,SAAS;AACpC,MAAG,QAAQ,QACT,SAAQ,QAAQ,QAAQ;CAE3B,GAAE,CAEH,MAAU;sBAEN,MAAA;AACF,MAAA,QAAA,QACE,SAAM,QAAc,WAAE,OAAA,MAAA,kBAAA,CAAA;WAGtB;AAEJ,sBAAU,MAAA;AAEV,MAAA,QAAe,WAAA,MAAA,aAAA,UACV,OAAA,WAAgB,QAAA,QAAA,aAAA,YAAA,GAAA,GAAA,QAAA,QAAA,gBAAA,WAAA;KAGjB,MAAM,QAEV,EAAA;sBACM,MAAM;MACR,QAAO,QACT,SAAA,QAAA,aAAA,MAAA,cAAA;KAEA,MAAA,UACD,EAAA;AAEC,sBAAU,MAAG;AACb,MAAI,MAAM,MACR,UAAS,SAAS,aAAa,SAAQ,MAAM,MAAI;gBAC5C,SAAA,gBAAA,QAAA;KAGL,MAAM,KAEZ,EAAA;;;;;;;;;AChCA,MAAA,2BAAA,cAAA,WAAA,CAAA,OAAA,QAAA;CACA;EAEI,MAAA,UAAA,kBAAA,KAAA;AACA,iCAAgB,KAA+B,MAAK,UAAA,QAAA,UAAA,WAAA,CACpD,OAKA,EAAA;AACA,yBAAkB,SAAM,MAAA;AACxB,YACE,SAAA,MAAA;AAIJ,uBAAA,cAAA,cAAA,eAAA;GACA,aAAA,MAAA;GAUF,OAAA,MAAA;GACQ,OAAU,MAAC"}

package/react/dist/JBTextarea.d.ts

@@ -1,4 +1,4 @@
-import React, { CSSProperties } from 'react';
+import React, { CSSProperties, type PropsWithChildren } from 'react';
 import 'jb-textarea';
 import { JBTextareaWebComponent } from 'jb-textarea';
 import { EventProps } from './events-hook.js';
@@ -23,14 +23,15 @@ declare const JBTextarea: React.ForwardRefExoticComponent<EventProps & JBTextare
     className?: string;
     message?: string;
     style?: CSSProperties;
-    name?: string;
-} & React.RefAttributes<unknown>>;
-export type Props = EventProps & JBTextareaAttributes & {
+} & {
+    children?: React.ReactNode | undefined;
+} & React.HTMLAttributes<JBTextareaWebComponent> & React.RefAttributes<unknown>>;
+type JBTextareaProps = EventProps & JBTextareaAttributes & {
     label?: string;
     placeholder?: string;
     className?: string;
     message?: string;
     style?: CSSProperties;
-    name?: string;
 };
+export type Props = PropsWithChildren<JBTextareaProps> & React.HTMLAttributes<JBTextareaWebComponent>;
 export { JBTextarea };

package/react/dist/JBTextarea.js

@@ -1,2 +1,2 @@
-import e,{useEffect as r,useImperativeHandle as t,useRef as o}from"react";import"jb-textarea";import{useEvent as a}from"jb-core/react";let n=e.forwardRef((n,u)=>{{var i;let l=o(null);return t(u,()=>l?l.current:void 0,[l]),r(()=>{let e=i.value||"";l.current&&(l.current.value=e)},[(i=n).value]),r(()=>{l.current&&(l.current.validation.list=i.validationList||[])},[i.validationList]),r(()=>{l.current&&void 0!==i.required&&(i.required?l.current.setAttribute("required",""):l.current.removeAttribute("required"))},[i.required]),r(()=>{l.current&&(l.current.autoHeight=i.autoHeight||!1)},[i.autoHeight]),r(()=>{i.error?l?.current?.setAttribute("error",i.error):l?.current?.removeAttribute("error")},[i.error]),a(l,"load",n.onLoad,!0),a(l,"init",n.onInit,!0),a(l,"change",n.onChange),a(l,"keydown",n.onKeyDown),a(l,"input",n.onInput),a(l,"keyup",n.onKeyUp),a(l,"focus",n.onFocus),a(l,"blur",n.onBlur),e.createElement("jb-textarea",{placeholder:n.placeholder,class:n.className,style:n.style,ref:l,label:n.label,message:n.message,name:n.name})}});export{n as JBTextarea};
+import e,{useEffect as r,useImperativeHandle as t,useRef as n}from"react";import"jb-textarea";import{useEvent as a}from"jb-core/react";let o=e.forwardRef((o,u)=>{{var i;let l=n(null);return t(u,()=>l?l.current:void 0,[l]),r(()=>{let e=i.value||"";l.current&&(l.current.value=e)},[(i=o).value]),r(()=>{l.current&&(l.current.validation.list=i.validationList||[])},[i.validationList]),r(()=>{l.current&&void 0!==i.required&&(i.required?l.current.setAttribute("required",""):l.current.removeAttribute("required"))},[i.required]),r(()=>{l.current&&(l.current.autoHeight=i.autoHeight||!1)},[i.autoHeight]),r(()=>{i.error?l?.current?.setAttribute("error",i.error):l?.current?.removeAttribute("error")},[i.error]),r(()=>{i.name?l?.current?.setAttribute("name",i.name||""):l?.current?.removeAttribute("name")},[i.name]),a(l,"load",o.onLoad,!0),a(l,"init",o.onInit,!0),a(l,"change",o.onChange),a(l,"keydown",o.onKeyDown),a(l,"input",o.onInput),a(l,"keyup",o.onKeyUp),a(l,"focus",o.onFocus),a(l,"blur",o.onBlur),e.createElement("jb-textarea",{placeholder:o.placeholder,class:o.className,style:o.style,ref:l,label:o.label,message:o.message},o.children)}});export{o as JBTextarea};
 //# sourceMappingURL=JBTextarea.js.map

package/react/dist/JBTextarea.js.map

@@ -1 +1 @@
-{"version":3,"file":"JBTextarea.js","names":[],"sources":["../lib/events-hook.ts","../lib/attributes-hook.ts","../lib/JBTextarea.tsx"],"sourcesContent":["import { useEvent } from \"jb-core/react\";\r\nimport { RefObject } from \"react\";\r\nimport type { JBTextareaWebComponent, JBTextareaEventType } from 'jb-textarea';\r\n\r\nexport type EventProps = {\r\n  /**\r\n   * when component loaded, in most cases component is already loaded before react mount so you dont need this but if you load web-component dynamically with lazy load it will be called after react mount\r\n   */\r\n  onLoad?: (e: JBTextareaEventType<CustomEvent>) => void,\r\n  /**\r\n * when all property set and ready to use, in most cases component is already loaded before react mount so you dont need this but if you load web-component dynamically with lazy load it will be called after react mount\r\n */\r\n  onInit?: (e: JBTextareaEventType<CustomEvent>) => void,\r\n  onChange?: (e: JBTextareaEventType<Event>) => void,\r\n  onFocus?: (e: JBTextareaEventType<FocusEvent>) => void,\r\n  onBlur?: (e: JBTextareaEventType<FocusEvent>) => void,\r\n  onKeyDown?: (e: JBTextareaEventType<KeyboardEvent>) => void,\r\n  onKeyUp?: (e: JBTextareaEventType<KeyboardEvent>) => void,\r\n  onInput?: (e: JBTextareaEventType<InputEvent>) => void,\r\n  onBeforeinput?: (e: JBTextareaEventType<InputEvent>) => void,\r\n\r\n}\r\nexport function useEvents(element: RefObject<JBTextareaWebComponent>, props: EventProps) {\r\n  useEvent(element, 'load', props.onLoad, true);\r\n  useEvent(element, 'init', props.onInit, true);\r\n  useEvent(element, 'change', props.onChange);\r\n  useEvent(element, 'keydown', props.onKeyDown);\r\n  useEvent(element, 'input', props.onInput);\r\n  useEvent(element, 'keyup', props.onKeyUp);\r\n  useEvent(element, 'focus', props.onFocus);\r\n  useEvent(element, 'blur', props.onBlur);\r\n}","import { JBTextareaWebComponent, type ValidationValue } from \"jb-textarea\";\r\nimport { type ValidationItem } from \"jb-validation\";\r\nimport { RefObject, useEffect } from \"react\";\r\n\r\nexport type JBTextareaAttributes = {\r\n  value?: string | null | undefined,\r\n  validationList?:ValidationItem<ValidationValue>[],\r\n  autoHeight?: boolean,\r\n  required?:boolean\r\n  error?: string,\r\n}\r\nexport function useJBTextareaAttribute(element: RefObject<JBTextareaWebComponent>, props: JBTextareaAttributes) {\r\n\r\n  useEffect(() => {\r\n    const value:string = props.value || '';\r\n    if(element.current){\r\n      element.current.value = value;\r\n    }\r\n  }, [props.value]);\r\n\r\n  useEffect(() => {\r\n    if(element.current){\r\n      element.current.validation.list = props.validationList || [];\r\n    }\r\n  }, [props.validationList]);\r\n  useEffect(() => {\r\n    if(element.current && props.required!== undefined){\r\n      props.required?element.current.setAttribute(\"required\",''):element.current.removeAttribute(\"required\");\r\n    }\r\n  }, [props.required]);\r\n\r\n  useEffect(() => {\r\n    if(element.current){\r\n      element.current.autoHeight = props.autoHeight || false;\r\n    }\r\n  }, [props.autoHeight]);\r\n  \r\n  useEffect(() => {\r\n    if (props.error) {\r\n      element?.current?.setAttribute('error', props.error);\r\n    } else {\r\n      element?.current?.removeAttribute('error');\r\n    }\r\n  }, [props.error]);\r\n}","/* eslint-disable no-inner-declarations */\r\nimport React, { useRef, useImperativeHandle, CSSProperties } from 'react';\r\nimport 'jb-textarea';\r\n// eslint-disable-next-line no-duplicate-imports\r\nimport {JBTextareaWebComponent} from 'jb-textarea';\r\nimport { EventProps, useEvents } from './events-hook.js';\r\nimport { JBTextareaAttributes, useJBTextareaAttribute } from './attributes-hook.js';\r\ndeclare global {\r\n    // eslint-disable-next-line @typescript-eslint/no-namespace\r\n    namespace JSX {\r\n      interface IntrinsicElements {\r\n        'jb-textarea': JBTextareaType;\r\n      }\r\n      interface JBTextareaType extends React.DetailedHTMLProps<React.HTMLAttributes<JBTextareaWebComponent>, JBTextareaWebComponent> {\r\n        class?:string,\r\n        label?: string,\r\n        name?:string,\r\n        message?:string,\r\n        placeholder?:string,\r\n        // ref:React.RefObject<JBDateInputWebComponent>,\r\n      }\r\n    }\r\n}\r\n// eslint-disable-next-line react/display-name\r\nconst JBTextarea = React.forwardRef((props:Props, ref) => {\r\n  {\r\n    //we set this state so when ref change we have a render and our event listener will be updated\r\n    const element = useRef<JBTextareaWebComponent>(null);\r\n    useImperativeHandle(\r\n      ref,\r\n      () => (element ? element.current : undefined),\r\n      [element],\r\n    );\r\n    useJBTextareaAttribute(element, props);\r\n    useEvents(element,props);\r\n    return (\r\n      <jb-textarea placeholder={props.placeholder} class={props.className} style={props.style} ref={element} label={props.label} message={props.message} name={props.name}></jb-textarea>\r\n    );\r\n  }\r\n});\r\n\r\nexport type Props = EventProps & JBTextareaAttributes & {\r\n    label?: string,\r\n    placeholder?:string,\r\n    className?: string,\r\n    message?:string,\r\n    style?:CSSProperties,\r\n    name?:string,\r\n}\r\nexport {JBTextarea};"],"mappings":";;;;;AACO,SAAS,UAAU,SAAQ,OAAA;AAC9B,UAAS,SAAS,QAAQ,MAAM,QAAQ,KAAK;AACjD,UAAA,SAAA,QAAA,MAAA,QAAA,KAAA;AACI,UAAS,SAAS,UAAI,MAAA,SAAA;AACtB,UAAC,SAAA,WAAA,MAAA,UAAA;AACD,UAAS,SAAS,SAAS,MAAM,QAAQ;AACzC,UAAC,SAAA,SAAA,MAAA,QAAA;AACD,UAAS,SAAS,SAAS,MAAM,QAAQ;AACzC,UAAC,SAAA,QAAA,MAAA,OAAA;AACJ;;;;ACTM,SAAS,uBAAuB,SAAS,OAAI;AAChD,WAAU,MAAI;EAClB,MAAA,QAAA,MAAA,SAAA;AACQ,MAAI,QAAQ,QACR,SAAQ,QAAQ,QAAQ;CAE/B,GAAE,CACC,MAAM,KACT,EAAC;AACL,WAAA,MAAA;AACO,MAAI,QAAQ,QACpB,SAAA,QAAA,WAAA,OAAA,MAAA,kBAAA,CAAA;CAEK,GAAE,CACC,MAAM,cACT,EAAC;AACF,WAAC,MAAA;AACG,MAAI,QAAQ,WAAA,MAAA,aAAA,UACpB,OAAA,WAAA,QAAA,QAAA,aAAA,YAAA,GAAA,GAAA,QAAA,QAAA,gBAAA,WAAA;CAEK,GAAE,CACC,MAAM,QACT,EAAA;AACD,WAAU,MAAI;AACV,MAAI,QAAO,QACP,SAAQ,QAAQ,aAAa,MAAM,cAAQ;CAElD,GAAA,CACG,MAAM,UACd,EAAA;AACI,WAAU,MAAI;AACV,MAAI,MAAM,MACN,UAAS,SAAS,aAAa,SAAS,MAAM,MAAG;MAEjD,UAAS,SAAI,gBAAA,QAAA;CAEpB,GAAE,CACC,MAAM,KACT,EAAC;AACL;;;;ACnCD,MAAM,2BAA2B,MAAM,WAAW,CAAC,OAAM,QAAA;CACrD;EAEI,MAAM,UAAU,OAAO,KAAK;AAC5B,sBAAW,KAAA,MAAA,UAAA,QAAA,UAAA,WAAA,CACP,OACH,EAAC;AACH,yBAAA,SAAA,MAAA;AACC,YAAU,SAAS,MAAM;AACzB,uBAAc,MAAA,cAAA,eAAA;GACV,aAAW,MAAA;GACX,OAAO,MAAE;GACT,OAAO,MAAK;GACZ,KAAK;GACL,OAAO,MAAM;GAClB,SAAA,MAAA;GACF,MAAA,MAAA;EACJ,EAAA;CACI;AACJ,EAAC"}
+{"version":3,"file":"JBTextarea.js","names":[],"sources":["../lib/events-hook.ts","../lib/attributes-hook.ts","../lib/JBTextarea.tsx"],"sourcesContent":["","",""],"mappings":";;;;;AAsBM,SAAU,UAAU,SAA4C,OAAiB;AACrF,UAAS,SAAS,QAAQ,MAAM,QAAQ,KAAK;AAC7C,UAAS,SAAS,QAAQ,MAAM,QAAQ,KAAK;AAC7C,UAAS,SAAS,UAAU,MAAM,SAAS;AAC3C,UAAS,SAAS,WAAW,MAAM,UAAU;AAC7C,UAAS,SAAS,SAAS,MAAM,QAAQ;AACzC,UAAS,SAAS,SAAS,MAAM,QAAQ;AACzC,UAAS,SAAS,SAAS,MAAM,QAAQ;AACzC,UAAS,SAAS,QAAQ,MAAM,OAAO;AACzC;;;;AClBM,SAAU,uBAAuB,SAA4C,OAA2B;AAE5G,WAAU,MAAG;EACX,MAAM,QAAe,MAAM,SAAS;AACpC,MAAG,QAAQ,QACT,SAAQ,QAAQ,QAAQ;CAE3B,GAAE,CAEH,MAAU;WAEN,MAAA;AACF,MAAA,QAAA,QACE,SAAM,QAAc,WAAE,OAAA,MAAA,kBAAA,CAAA;WAGtB;AAEJ,WAAU,MAAA;AAEV,MAAA,QAAe,WAAA,MAAA,aAAA,UACV,OAAA,WAAgB,QAAA,QAAA,aAAA,YAAA,GAAA,GAAA,QAAA,QAAA,gBAAA,WAAA;KAGjB,MAAM,QAEV,EAAA;WACM,MAAM;MACR,QAAO,QACT,SAAA,QAAA,aAAA,MAAA,cAAA;KAEA,MAAA,UACD,EAAA;AAEC,WAAU,MAAG;AACb,MAAI,MAAM,MACR,UAAS,SAAS,aAAa,SAAQ,MAAM,MAAI;gBAC5C,SAAA,gBAAA,QAAA;KAGL,MAAM,KAEZ,EAAA;;;;;;;;;AChCA,MAAA,2BAAA,MAAA,WAAA,CAAA,OAAA,QAAA;CACA;EAEI,MAAA,UAAA,OAAA,KAAA;AACA,sBAAgB,KAA+B,MAAK,UAAA,QAAA,UAAA,WAAA,CACpD,OAKA,EAAA;AACA,yBAAkB,SAAM,MAAA;AACxB,YACE,SAAA,MAAA;AAIJ,uBAAA,MAAA,cAAA,eAAA;GACA,aAAA,MAAA;GAUF,OAAA,MAAA;GACQ,OAAU,MAAC"}

package/react/dist/JBTextarea.umd.js

@@ -1,2 +1,2 @@
-var e,t;e=this,t=function(e,t,r,u){"use strict";var n=Object.create,a=Object.defineProperty,o=Object.getOwnPropertyDescriptor,l=Object.getOwnPropertyNames,c=Object.getPrototypeOf,i=Object.prototype.hasOwnProperty,s=(e,t,r,u)=>{if(t&&"object"==typeof t||"function"==typeof t)for(var n,c=l(t),s=0,f=c.length;s<f;s++)n=c[s],i.call(e,n)||n===r||a(e,n,{get:(e=>t[e]).bind(null,n),enumerable:!(u=o(t,n))||u.enumerable});return e},f=(e,t,r)=>(r=null!=e?n(c(e)):{},s(!t&&e&&e.__esModule?r:a(r,"default",{value:e,enumerable:!0}),e));t=f(t),u=f(u);let d=t.default.forwardRef((e,r)=>{{let n=(0,t.useRef)(null);return(0,t.useImperativeHandle)(r,()=>n?n.current:void 0,[n]),(0,t.useEffect)(()=>{let t=e.value||"";n.current&&(n.current.value=t)},[e.value]),(0,t.useEffect)(()=>{n.current&&(n.current.validation.list=e.validationList||[])},[e.validationList]),(0,t.useEffect)(()=>{n.current&&void 0!==e.required&&(e.required?n.current.setAttribute("required",""):n.current.removeAttribute("required"))},[e.required]),(0,t.useEffect)(()=>{n.current&&(n.current.autoHeight=e.autoHeight||!1)},[e.autoHeight]),(0,t.useEffect)(()=>{e.error?n?.current?.setAttribute("error",e.error):n?.current?.removeAttribute("error")},[e.error]),(0,u.useEvent)(n,"load",e.onLoad,!0),(0,u.useEvent)(n,"init",e.onInit,!0),(0,u.useEvent)(n,"change",e.onChange),(0,u.useEvent)(n,"keydown",e.onKeyDown),(0,u.useEvent)(n,"input",e.onInput),(0,u.useEvent)(n,"keyup",e.onKeyUp),(0,u.useEvent)(n,"focus",e.onFocus),(0,u.useEvent)(n,"blur",e.onBlur),t.default.createElement("jb-textarea",{placeholder:e.placeholder,class:e.className,style:e.style,ref:n,label:e.label,message:e.message,name:e.name})}});e.JBTextarea=d},"object"==typeof exports&&"undefined"!=typeof module?t(exports,require("react"),require("jb-textarea"),require("jb-core/react")):"function"==typeof define&&define.amd?define(["exports","react","jb-textarea","jb-core/react"],t):t((e="undefined"!=typeof globalThis?globalThis:e||self).JBTextareaReact={},e.React,e.JBTextarea,e.JBCoreReact);
+var e,t;e=this,t=function(e,t,r,u){"use strict";var n=Object.create,a=Object.defineProperty,o=Object.getOwnPropertyDescriptor,c=Object.getOwnPropertyNames,l=Object.getPrototypeOf,i=Object.prototype.hasOwnProperty,s=(e,t,r,u)=>{if(t&&"object"==typeof t||"function"==typeof t)for(var n,l=c(t),s=0,f=l.length;s<f;s++)n=l[s],i.call(e,n)||n===r||a(e,n,{get:(e=>t[e]).bind(null,n),enumerable:!(u=o(t,n))||u.enumerable});return e},f=(e,t,r)=>(r=null!=e?n(l(e)):{},s(!t&&e&&e.__esModule?r:a(r,"default",{value:e,enumerable:!0}),e));t=f(t),u=f(u);let d=t.default.forwardRef((e,r)=>{{let n=(0,t.useRef)(null);return(0,t.useImperativeHandle)(r,()=>n?n.current:void 0,[n]),(0,t.useEffect)(()=>{let t=e.value||"";n.current&&(n.current.value=t)},[e.value]),(0,t.useEffect)(()=>{n.current&&(n.current.validation.list=e.validationList||[])},[e.validationList]),(0,t.useEffect)(()=>{n.current&&void 0!==e.required&&(e.required?n.current.setAttribute("required",""):n.current.removeAttribute("required"))},[e.required]),(0,t.useEffect)(()=>{n.current&&(n.current.autoHeight=e.autoHeight||!1)},[e.autoHeight]),(0,t.useEffect)(()=>{e.error?n?.current?.setAttribute("error",e.error):n?.current?.removeAttribute("error")},[e.error]),(0,t.useEffect)(()=>{e.name?n?.current?.setAttribute("name",e.name||""):n?.current?.removeAttribute("name")},[e.name]),(0,u.useEvent)(n,"load",e.onLoad,!0),(0,u.useEvent)(n,"init",e.onInit,!0),(0,u.useEvent)(n,"change",e.onChange),(0,u.useEvent)(n,"keydown",e.onKeyDown),(0,u.useEvent)(n,"input",e.onInput),(0,u.useEvent)(n,"keyup",e.onKeyUp),(0,u.useEvent)(n,"focus",e.onFocus),(0,u.useEvent)(n,"blur",e.onBlur),t.default.createElement("jb-textarea",{placeholder:e.placeholder,class:e.className,style:e.style,ref:n,label:e.label,message:e.message},e.children)}});e.JBTextarea=d},"object"==typeof exports&&"undefined"!=typeof module?t(exports,require("react"),require("jb-textarea"),require("jb-core/react")):"function"==typeof define&&define.amd?define(["exports","react","jb-textarea","jb-core/react"],t):t((e="undefined"!=typeof globalThis?globalThis:e||self).JBTextareaReact={},e.React,e.JBTextarea,e.JBCoreReact);
 //# sourceMappingURL=JBTextarea.umd.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"JBTextarea.umd.js","names":[],"sources":["../lib/events-hook.ts","../lib/attributes-hook.ts","../lib/JBTextarea.tsx"],"sourcesContent":["import { useEvent } from \"jb-core/react\";\r\nimport { RefObject } from \"react\";\r\nimport type { JBTextareaWebComponent, JBTextareaEventType } from 'jb-textarea';\r\n\r\nexport type EventProps = {\r\n  /**\r\n   * when component loaded, in most cases component is already loaded before react mount so you dont need this but if you load web-component dynamically with lazy load it will be called after react mount\r\n   */\r\n  onLoad?: (e: JBTextareaEventType<CustomEvent>) => void,\r\n  /**\r\n * when all property set and ready to use, in most cases component is already loaded before react mount so you dont need this but if you load web-component dynamically with lazy load it will be called after react mount\r\n */\r\n  onInit?: (e: JBTextareaEventType<CustomEvent>) => void,\r\n  onChange?: (e: JBTextareaEventType<Event>) => void,\r\n  onFocus?: (e: JBTextareaEventType<FocusEvent>) => void,\r\n  onBlur?: (e: JBTextareaEventType<FocusEvent>) => void,\r\n  onKeyDown?: (e: JBTextareaEventType<KeyboardEvent>) => void,\r\n  onKeyUp?: (e: JBTextareaEventType<KeyboardEvent>) => void,\r\n  onInput?: (e: JBTextareaEventType<InputEvent>) => void,\r\n  onBeforeinput?: (e: JBTextareaEventType<InputEvent>) => void,\r\n\r\n}\r\nexport function useEvents(element: RefObject<JBTextareaWebComponent>, props: EventProps) {\r\n  useEvent(element, 'load', props.onLoad, true);\r\n  useEvent(element, 'init', props.onInit, true);\r\n  useEvent(element, 'change', props.onChange);\r\n  useEvent(element, 'keydown', props.onKeyDown);\r\n  useEvent(element, 'input', props.onInput);\r\n  useEvent(element, 'keyup', props.onKeyUp);\r\n  useEvent(element, 'focus', props.onFocus);\r\n  useEvent(element, 'blur', props.onBlur);\r\n}","import { JBTextareaWebComponent, type ValidationValue } from \"jb-textarea\";\r\nimport { type ValidationItem } from \"jb-validation\";\r\nimport { RefObject, useEffect } from \"react\";\r\n\r\nexport type JBTextareaAttributes = {\r\n  value?: string | null | undefined,\r\n  validationList?:ValidationItem<ValidationValue>[],\r\n  autoHeight?: boolean,\r\n  required?:boolean\r\n  error?: string,\r\n}\r\nexport function useJBTextareaAttribute(element: RefObject<JBTextareaWebComponent>, props: JBTextareaAttributes) {\r\n\r\n  useEffect(() => {\r\n    const value:string = props.value || '';\r\n    if(element.current){\r\n      element.current.value = value;\r\n    }\r\n  }, [props.value]);\r\n\r\n  useEffect(() => {\r\n    if(element.current){\r\n      element.current.validation.list = props.validationList || [];\r\n    }\r\n  }, [props.validationList]);\r\n  useEffect(() => {\r\n    if(element.current && props.required!== undefined){\r\n      props.required?element.current.setAttribute(\"required\",''):element.current.removeAttribute(\"required\");\r\n    }\r\n  }, [props.required]);\r\n\r\n  useEffect(() => {\r\n    if(element.current){\r\n      element.current.autoHeight = props.autoHeight || false;\r\n    }\r\n  }, [props.autoHeight]);\r\n  \r\n  useEffect(() => {\r\n    if (props.error) {\r\n      element?.current?.setAttribute('error', props.error);\r\n    } else {\r\n      element?.current?.removeAttribute('error');\r\n    }\r\n  }, [props.error]);\r\n}","/* eslint-disable no-inner-declarations */\r\nimport React, { useRef, useImperativeHandle, CSSProperties } from 'react';\r\nimport 'jb-textarea';\r\n// eslint-disable-next-line no-duplicate-imports\r\nimport {JBTextareaWebComponent} from 'jb-textarea';\r\nimport { EventProps, useEvents } from './events-hook.js';\r\nimport { JBTextareaAttributes, useJBTextareaAttribute } from './attributes-hook.js';\r\ndeclare global {\r\n    // eslint-disable-next-line @typescript-eslint/no-namespace\r\n    namespace JSX {\r\n      interface IntrinsicElements {\r\n        'jb-textarea': JBTextareaType;\r\n      }\r\n      interface JBTextareaType extends React.DetailedHTMLProps<React.HTMLAttributes<JBTextareaWebComponent>, JBTextareaWebComponent> {\r\n        class?:string,\r\n        label?: string,\r\n        name?:string,\r\n        message?:string,\r\n        placeholder?:string,\r\n        // ref:React.RefObject<JBDateInputWebComponent>,\r\n      }\r\n    }\r\n}\r\n// eslint-disable-next-line react/display-name\r\nconst JBTextarea = React.forwardRef((props:Props, ref) => {\r\n  {\r\n    //we set this state so when ref change we have a render and our event listener will be updated\r\n    const element = useRef<JBTextareaWebComponent>(null);\r\n    useImperativeHandle(\r\n      ref,\r\n      () => (element ? element.current : undefined),\r\n      [element],\r\n    );\r\n    useJBTextareaAttribute(element, props);\r\n    useEvents(element,props);\r\n    return (\r\n      <jb-textarea placeholder={props.placeholder} class={props.className} style={props.style} ref={element} label={props.label} message={props.message} name={props.name}></jb-textarea>\r\n    );\r\n  }\r\n});\r\n\r\nexport type Props = EventProps & JBTextareaAttributes & {\r\n    label?: string,\r\n    placeholder?:string,\r\n    className?: string,\r\n    message?:string,\r\n    style?:CSSProperties,\r\n    name?:string,\r\n}\r\nexport {JBTextarea};"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACO,SAAS,UAAU,SAAQ,OAAA;AAC9B,6BAAS,SAAS,QAAQ,MAAM,QAAQ,KAAK;AACjD,6BAAA,SAAA,QAAA,MAAA,QAAA,KAAA;AACI,6BAAS,SAAS,UAAI,MAAA,SAAA;AACtB,6BAAC,SAAA,WAAA,MAAA,UAAA;AACD,6BAAS,SAAS,SAAS,MAAM,QAAQ;AACzC,6BAAC,SAAA,SAAA,MAAA,QAAA;AACD,6BAAS,SAAS,SAAS,MAAM,QAAQ;AACzC,6BAAC,SAAA,QAAA,MAAA,OAAA;AACJ;;;;ACTM,SAAS,uBAAuB,SAAS,OAAI;AAChD,sBAAU,MAAI;EAClB,MAAA,QAAA,MAAA,SAAA;AACQ,MAAI,QAAQ,QACR,SAAQ,QAAQ,QAAQ;CAE/B,GAAE,CACC,MAAM,KACT,EAAC;AACL,sBAAA,MAAA;AACO,MAAI,QAAQ,QACpB,SAAA,QAAA,WAAA,OAAA,MAAA,kBAAA,CAAA;CAEK,GAAE,CACC,MAAM,cACT,EAAC;AACF,sBAAC,MAAA;AACG,MAAI,QAAQ,WAAA,MAAA,aAAA,UACpB,OAAA,WAAA,QAAA,QAAA,aAAA,YAAA,GAAA,GAAA,QAAA,QAAA,gBAAA,WAAA;CAEK,GAAE,CACC,MAAM,QACT,EAAA;AACD,sBAAU,MAAI;AACV,MAAI,QAAO,QACP,SAAQ,QAAQ,aAAa,MAAM,cAAQ;CAElD,GAAA,CACG,MAAM,UACd,EAAA;AACI,sBAAU,MAAI;AACV,MAAI,MAAM,MACN,UAAS,SAAS,aAAa,SAAS,MAAM,MAAG;MAEjD,UAAS,SAAI,gBAAA,QAAA;CAEpB,GAAE,CACC,MAAM,KACT,EAAC;AACL;;;;ACnCD,MAAM,2BAA2B,cAAM,WAAW,CAAC,OAAM,QAAA;CACrD;EAEI,MAAM,UAAU,kBAAO,KAAK;AAC5B,iCAAW,KAAA,MAAA,UAAA,QAAA,UAAA,WAAA,CACP,OACH,EAAC;AACH,yBAAA,SAAA,MAAA;AACC,YAAU,SAAS,MAAM;AACzB,uBAAc,cAAA,cAAA,eAAA;GACV,aAAW,MAAA;GACX,OAAO,MAAE;GACT,OAAO,MAAK;GACZ,KAAK;GACL,OAAO,MAAM;GAClB,SAAA,MAAA;GACF,MAAA,MAAA;EACJ,EAAA;CACI;AACJ,EAAC"}
+{"version":3,"file":"JBTextarea.umd.js","names":[],"sources":["../lib/events-hook.ts","../lib/attributes-hook.ts","../lib/JBTextarea.tsx"],"sourcesContent":["","",""],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAsBM,SAAU,UAAU,SAA4C,OAAiB;AACrF,6BAAS,SAAS,QAAQ,MAAM,QAAQ,KAAK;AAC7C,6BAAS,SAAS,QAAQ,MAAM,QAAQ,KAAK;AAC7C,6BAAS,SAAS,UAAU,MAAM,SAAS;AAC3C,6BAAS,SAAS,WAAW,MAAM,UAAU;AAC7C,6BAAS,SAAS,SAAS,MAAM,QAAQ;AACzC,6BAAS,SAAS,SAAS,MAAM,QAAQ;AACzC,6BAAS,SAAS,SAAS,MAAM,QAAQ;AACzC,6BAAS,SAAS,QAAQ,MAAM,OAAO;AACzC;;;;AClBM,SAAU,uBAAuB,SAA4C,OAA2B;AAE5G,sBAAU,MAAG;EACX,MAAM,QAAe,MAAM,SAAS;AACpC,MAAG,QAAQ,QACT,SAAQ,QAAQ,QAAQ;CAE3B,GAAE,CAEH,MAAU;sBAEN,MAAA;AACF,MAAA,QAAA,QACE,SAAM,QAAc,WAAE,OAAA,MAAA,kBAAA,CAAA;WAGtB;AAEJ,sBAAU,MAAA;AAEV,MAAA,QAAe,WAAA,MAAA,aAAA,UACV,OAAA,WAAgB,QAAA,QAAA,aAAA,YAAA,GAAA,GAAA,QAAA,QAAA,gBAAA,WAAA;KAGjB,MAAM,QAEV,EAAA;sBACM,MAAM;MACR,QAAO,QACT,SAAA,QAAA,aAAA,MAAA,cAAA;KAEA,MAAA,UACD,EAAA;AAEC,sBAAU,MAAG;AACb,MAAI,MAAM,MACR,UAAS,SAAS,aAAa,SAAQ,MAAM,MAAI;gBAC5C,SAAA,gBAAA,QAAA;KAGL,MAAM,KAEZ,EAAA;;;;;;;;;AChCA,MAAA,2BAAA,cAAA,WAAA,CAAA,OAAA,QAAA;CACA;EAEI,MAAA,UAAA,kBAAA,KAAA;AACA,iCAAgB,KAA+B,MAAK,UAAA,QAAA,UAAA,WAAA,CACpD,OAKA,EAAA;AACA,yBAAkB,SAAM,MAAA;AACxB,YACE,SAAA,MAAA;AAIJ,uBAAA,cAAA,cAAA,eAAA;GACA,aAAA,MAAA;GAUF,OAAA,MAAA;GACQ,OAAU,MAAC"}

package/react/dist/attributes-hook.d.ts

@@ -7,5 +7,6 @@ export type JBTextareaAttributes = {
     autoHeight?: boolean;
     required?: boolean;
     error?: string;
+    name?: string;
 };
 export declare function useJBTextareaAttribute(element: RefObject<JBTextareaWebComponent>, props: JBTextareaAttributes): void;

package/react/lib/JBTextarea.tsx

@@ -1,5 +1,5 @@
 /* eslint-disable no-inner-declarations */
-import React, { useRef, useImperativeHandle, CSSProperties } from 'react';
+import React, { useRef, useImperativeHandle, CSSProperties, type PropsWithChildren } from 'react';
 import 'jb-textarea';
 // eslint-disable-next-line no-duplicate-imports
 import {JBTextareaWebComponent} from 'jb-textarea';
@@ -34,17 +34,20 @@ const JBTextarea = React.forwardRef((props:Props, ref) => {
     useJBTextareaAttribute(element, props);
     useEvents(element,props);
     return (
-      <jb-textarea placeholder={props.placeholder} class={props.className} style={props.style} ref={element} label={props.label} message={props.message} name={props.name}></jb-textarea>
+      <jb-textarea placeholder={props.placeholder} class={props.className} style={props.style} ref={element} label={props.label} message={props.message}>
+        {props.children}
+      </jb-textarea>
     );
   }
 });
 
-export type Props = EventProps & JBTextareaAttributes & {
+type JBTextareaProps = EventProps & JBTextareaAttributes & {
     label?: string,
     placeholder?:string,
     className?: string,
     message?:string,
     style?:CSSProperties,
-    name?:string,
 }
+export type Props = PropsWithChildren<JBTextareaProps> & React.HTMLAttributes<JBTextareaWebComponent>;
+// export type Props = PropsWithChildren<JBTextareaProps> & React.HTMLAttributes<JBTextareaWebComponent>;
 export {JBTextarea};

package/react/lib/attributes-hook.ts

@@ -8,6 +8,8 @@ export type JBTextareaAttributes = {
   autoHeight?: boolean,
   required?:boolean
   error?: string,
+  name?:string,
+
 }
 export function useJBTextareaAttribute(element: RefObject<JBTextareaWebComponent>, props: JBTextareaAttributes) {
 
@@ -42,4 +44,13 @@ export function useJBTextareaAttribute(element: RefObject<JBTextareaWebComponent
       element?.current?.removeAttribute('error');
     }
   }, [props.error]);
+
+    useEffect(() => {
+    if (props.name) {
+      element?.current?.setAttribute('name', props.name || '');
+    } else {
+      element?.current?.removeAttribute('name');
+    }
+  }, [props.name]);
+
 }

package/dist/lib/jb-textarea.d.ts

@@ -1,37 +0,0 @@
-import { ShowValidationErrorInput, ValidationHelper, type WithValidation } from 'jb-validation';
-import type { JBFormInputStandards } from 'jb-form';
-export * from './types.js';
-export declare class JBTextareaWebComponent extends HTMLElement implements WithValidation, JBFormInputStandards<string> {
-    #private;
-    static get formAssociated(): boolean;
-    get value(): string;
-    set value(value: string);
-    get isAutoValidationDisabled(): boolean;
-    set isAutoValidationDisabled(value: boolean);
-    get disabled(): boolean;
-    set disabled(value: boolean);
-    set required(value: boolean);
-    get required(): boolean;
-    get name(): string;
-    initialValue: string;
-    get isDirty(): boolean;
-    constructor();
-    autoHeight: boolean;
-    get validation(): ValidationHelper<string>;
-    static get observedAttributes(): string[];
-    attributeChangedCallback(name: string, oldValue: string, newValue: string): void;
-    showValidationError(error: ShowValidationErrorInput | string): void;
-    clearValidationError(): void;
-    get validationMessage(): string;
-    /**
-   * @public
-   * @description this method used to check for validity but doesn't show error to user and just return the result
-   * this method used by #internal of component
-   */
-    checkValidity(): boolean;
-    /**
-    * @public
-   * @description this method used to check for validity and show error to user
-   */
-    reportValidity(): boolean;
-}

package/dist/lib/types.d.ts

@@ -1,10 +0,0 @@
-import type { EventTypeWithTarget } from "jb-core";
-import type { JBTextareaWebComponent } from "./jb-textarea";
-export type JBTextareaElements = {
-    textarea: HTMLTextAreaElement;
-    label: HTMLLabelElement;
-    labelValue: HTMLSpanElement;
-    messageBox: HTMLDivElement;
-};
-export type ValidationValue = string;
-export type JBTextareaEventType<TEvent> = EventTypeWithTarget<TEvent, JBTextareaWebComponent>;

package/dist/web-component/jb-textarea/lib/jb-textarea.d.ts

@@ -1,37 +0,0 @@
-import { ShowValidationErrorInput, ValidationHelper, type WithValidation } from 'jb-validation';
-import type { JBFormInputStandards } from 'jb-form';
-export * from './types.js';
-export declare class JBTextareaWebComponent extends HTMLElement implements WithValidation, JBFormInputStandards<string> {
-    #private;
-    static get formAssociated(): boolean;
-    get value(): string;
-    set value(value: string);
-    get isAutoValidationDisabled(): boolean;
-    set isAutoValidationDisabled(value: boolean);
-    get disabled(): boolean;
-    set disabled(value: boolean);
-    set required(value: boolean);
-    get required(): boolean;
-    get name(): string;
-    initialValue: string;
-    get isDirty(): boolean;
-    constructor();
-    autoHeight: boolean;
-    get validation(): ValidationHelper<string>;
-    static get observedAttributes(): string[];
-    attributeChangedCallback(name: string, oldValue: string, newValue: string): void;
-    showValidationError(error: ShowValidationErrorInput | string): void;
-    clearValidationError(): void;
-    get validationMessage(): string;
-    /**
-   * @public
-   * @description this method used to check for validity but doesn't show error to user and just return the result
-   * this method used by #internal of component
-   */
-    checkValidity(): boolean;
-    /**
-    * @public
-   * @description this method used to check for validity and show error to user
-   */
-    reportValidity(): boolean;
-}

package/dist/web-component/jb-textarea/lib/types.d.ts

@@ -1,10 +0,0 @@
-import type { EventTypeWithTarget } from "jb-core";
-import type { JBTextareaWebComponent } from "./jb-textarea";
-export type JBTextareaElements = {
-    textarea: HTMLTextAreaElement;
-    label: HTMLLabelElement;
-    labelValue: HTMLSpanElement;
-    messageBox: HTMLDivElement;
-};
-export type ValidationValue = string;
-export type JBTextareaEventType<TEvent> = EventTypeWithTarget<TEvent, JBTextareaWebComponent>;

package/react/dist/common/hooks/use-event.d.ts

@@ -1,3 +0,0 @@
-/// <reference types="react" />
-export declare function useEvent(dom: HTMLElement, event: any, handler: any, passive?: boolean): void;
-export declare function useBindEvent<TRef extends React.MutableRefObject<any | null>, TEvent>(ref: TRef, event: string, handler: (e: TEvent) => void, passive?: boolean): void;

package/react/dist/common/hooks/useLazyRef.d.ts

@@ -1,4 +0,0 @@
-import { MutableRefObject } from "react";
-type InitFunc<T> = () => T;
-export declare const useLazyRef: <T>(initValFunc: InitFunc<T>) => MutableRefObject<any>;
-export {};

package/react/dist/common/hooks/useMobx.d.ts

@@ -1,4 +0,0 @@
-type Initializers = any[];
-type Constructor<T extends object = object> = new (...args: any[]) => T;
-export declare const useMobx: <T extends object>(Store: Constructor<T>, initializers: Initializers) => T;
-export {};

package/react/dist/common/scripts/device-detection.d.ts

@@ -1 +0,0 @@
-export declare const isMobile: () => boolean;

package/react/dist/common/scripts/persian-helper.d.ts

@@ -1,3 +0,0 @@
-declare function faToEnDigits(input: string | number): string;
-declare function enToFaDigits(input: string | number): string;
-export { enToFaDigits, faToEnDigits };

package/react/dist/lib/JBTextarea.d.ts

@@ -1,44 +0,0 @@
-import React, { CSSProperties } from 'react';
-import 'jb-textarea';
-import { JBTextareaWebComponent, type ValidationValue } from 'jb-textarea';
-import { type ValidationItem } from "jb-validation";
-import { EventProps } from './events-hook.js';
-declare global {
-    namespace JSX {
-        interface IntrinsicElements {
-            'jb-textarea': JBTextareaType;
-        }
-        interface JBTextareaType extends React.DetailedHTMLProps<React.HTMLAttributes<JBTextareaWebComponent>, JBTextareaWebComponent> {
-            class?: string;
-            label?: string;
-            name?: string;
-            message?: string;
-            placeholder?: string;
-        }
-    }
-}
-declare const JBTextarea: React.ForwardRefExoticComponent<EventProps & {
-    label?: string;
-    value?: string | null | undefined;
-    placeholder?: string;
-    className?: string;
-    style?: CSSProperties;
-    validationList?: ValidationItem<ValidationValue>[];
-    autoHeight?: boolean;
-    message?: string;
-    name?: string;
-    required?: boolean;
-} & React.RefAttributes<unknown>>;
-export type Props = EventProps & {
-    label?: string;
-    value?: string | null | undefined;
-    placeholder?: string;
-    className?: string;
-    style?: CSSProperties;
-    validationList?: ValidationItem<ValidationValue>[];
-    autoHeight?: boolean;
-    message?: string;
-    name?: string;
-    required?: boolean;
-};
-export { JBTextarea };

package/react/dist/lib/events-hook.d.ts

@@ -1,20 +0,0 @@
-import { RefObject } from "react";
-import type { JBTextareaWebComponent, JBTextareaEventType } from 'jb-textarea';
-export type EventProps = {
-    /**
-     * when component loaded, in most cases component is already loaded before react mount so you dont need this but if you load web-component dynamically with lazy load it will be called after react mount
-     */
-    onLoad?: (e: JBTextareaEventType<CustomEvent>) => void;
-    /**
-   * when all property set and ready to use, in most cases component is already loaded before react mount so you dont need this but if you load web-component dynamically with lazy load it will be called after react mount
-   */
-    onInit?: (e: JBTextareaEventType<CustomEvent>) => void;
-    onChange?: (e: JBTextareaEventType<Event>) => void;
-    onFocus?: (e: JBTextareaEventType<FocusEvent>) => void;
-    onBlur?: (e: JBTextareaEventType<FocusEvent>) => void;
-    onKeyDown?: (e: JBTextareaEventType<KeyboardEvent>) => void;
-    onKeyUp?: (e: JBTextareaEventType<KeyboardEvent>) => void;
-    onInput?: (e: JBTextareaEventType<InputEvent>) => void;
-    onBeforeinput?: (e: JBTextareaEventType<InputEvent>) => void;
-};
-export declare function useEvents(element: RefObject<JBTextareaWebComponent>, props: EventProps): void;

package/react/dist/web-component/jb-textarea/react/lib/JBTextarea.d.ts

@@ -1,44 +0,0 @@
-import React, { CSSProperties } from 'react';
-import 'jb-textarea';
-import { JBTextareaWebComponent, type ValidationValue } from 'jb-textarea';
-import { type ValidationItem } from "jb-validation";
-import { EventProps } from './events-hook.js';
-declare global {
-    namespace JSX {
-        interface IntrinsicElements {
-            'jb-textarea': JBTextareaType;
-        }
-        interface JBTextareaType extends React.DetailedHTMLProps<React.HTMLAttributes<JBTextareaWebComponent>, JBTextareaWebComponent> {
-            class?: string;
-            label?: string;
-            name?: string;
-            message?: string;
-            placeholder?: string;
-        }
-    }
-}
-declare const JBTextarea: React.ForwardRefExoticComponent<EventProps & {
-    label?: string;
-    value?: string | null | undefined;
-    placeholder?: string;
-    className?: string;
-    style?: CSSProperties;
-    validationList?: ValidationItem<ValidationValue>[];
-    autoHeight?: boolean;
-    message?: string;
-    name?: string;
-    required?: boolean;
-} & React.RefAttributes<unknown>>;
-export type Props = EventProps & {
-    label?: string;
-    value?: string | null | undefined;
-    placeholder?: string;
-    className?: string;
-    style?: CSSProperties;
-    validationList?: ValidationItem<ValidationValue>[];
-    autoHeight?: boolean;
-    message?: string;
-    name?: string;
-    required?: boolean;
-};
-export { JBTextarea };

package/react/dist/web-component/jb-textarea/react/lib/events-hook.d.ts

@@ -1,20 +0,0 @@
-import { RefObject } from "react";
-import type { JBTextareaWebComponent, JBTextareaEventType } from 'jb-textarea';
-export type EventProps = {
-    /**
-     * when component loaded, in most cases component is already loaded before react mount so you dont need this but if you load web-component dynamically with lazy load it will be called after react mount
-     */
-    onLoad?: (e: JBTextareaEventType<CustomEvent>) => void;
-    /**
-   * when all property set and ready to use, in most cases component is already loaded before react mount so you dont need this but if you load web-component dynamically with lazy load it will be called after react mount
-   */
-    onInit?: (e: JBTextareaEventType<CustomEvent>) => void;
-    onChange?: (e: JBTextareaEventType<Event>) => void;
-    onFocus?: (e: JBTextareaEventType<FocusEvent>) => void;
-    onBlur?: (e: JBTextareaEventType<FocusEvent>) => void;
-    onKeyDown?: (e: JBTextareaEventType<KeyboardEvent>) => void;
-    onKeyUp?: (e: JBTextareaEventType<KeyboardEvent>) => void;
-    onInput?: (e: JBTextareaEventType<InputEvent>) => void;
-    onBeforeinput?: (e: JBTextareaEventType<InputEvent>) => void;
-};
-export declare function useEvents(element: RefObject<JBTextareaWebComponent>, props: EventProps): void;