tembro 2.0.5 → 2.1.0

package/dist/components/form/form-field-shell.js

@@ -17,80 +17,96 @@ var o = {
 	horizontal: "grid gap-2 sm:grid-cols-[minmax(0,12rem)_1fr] sm:items-start sm:gap-5",
 	inline: "flex flex-col gap-2 sm:flex-row sm:items-center sm:gap-4"
 };
-function s({ className: a, label: s, description: c, error: l, required: u = !1, htmlFor: d, labelId: f, descriptionId: p, errorId: m, layout: h = "vertical", descriptionPosition: g = "top", labelAction: _, requiredIndicator: v = /* @__PURE__ */ r("span", {
+function s({ className: a, label: s, description: c, error: l, success: u, loading: d = !1, required: f = !1, htmlFor: p, labelId: m, descriptionId: h, errorId: g, layout: _ = "vertical", descriptionPosition: v = "top", labelAction: y, requiredIndicator: b = /* @__PURE__ */ r("span", {
 	className: "ml-1 text-destructive",
 	children: "*"
-}), errorIcon: y, showErrorIcon: b = !0, disabled: x = !1, readOnly: S = !1, labelClassName: C, labelRowClassName: w, descriptionClassName: T, errorClassName: E, contentClassName: D, children: O, ...k }) {
-	let A = !!(s || _), j = c && g === "top", M = c && g === "bottom", N = y ?? /* @__PURE__ */ r(t, { className: "size-3.5" }), P = A ? /* @__PURE__ */ i("div", {
+}), errorIcon: x, showErrorIcon: S = !0, disabled: C = !1, readOnly: w = !1, labelClassName: T, labelRowClassName: E, descriptionClassName: D, errorClassName: O, contentClassName: k, children: A, ...j }) {
+	let M = !!(s || y), N = c && v === "top", P = c && v === "bottom", F = x ?? /* @__PURE__ */ r(t, { className: "size-3.5" }), I = M ? /* @__PURE__ */ i("div", {
 		"data-slot": "form-field-label-row",
-		className: e("flex min-w-0 items-center justify-between gap-3", h === "inline" && "sm:w-auto", w),
+		className: e("flex min-w-0 items-center justify-between gap-3", _ === "inline" && "sm:w-auto", E),
 		children: [s ? /* @__PURE__ */ i("label", {
 			"data-slot": "form-field-label",
-			htmlFor: d,
-			id: f,
-			className: e("min-w-0 text-sm font-semibold leading-none tracking-tight text-foreground", x && "cursor-not-allowed opacity-60", S && "opacity-80", C),
-			children: [s, u && v]
-		}) : /* @__PURE__ */ r("span", {}), _ && /* @__PURE__ */ r("div", {
+			htmlFor: p,
+			id: m,
+			className: e("min-w-0 text-sm font-semibold leading-none tracking-tight text-foreground", C && "cursor-not-allowed opacity-60", w && "opacity-80", T),
+			children: [s, f && b]
+		}) : /* @__PURE__ */ r("span", {}), y && /* @__PURE__ */ r("div", {
 			"data-slot": "form-field-label-action",
 			className: "shrink-0 text-sm",
-			children: _
+			children: y
 		})]
-	}) : null, F = c ? /* @__PURE__ */ r("p", {
+	}) : null, L = c ? /* @__PURE__ */ r("p", {
 		"data-slot": "form-field-description",
-		id: p,
-		className: e("text-sm leading-6 text-muted-foreground", x && "opacity-60", T),
+		id: h,
+		className: e("text-sm leading-6 text-muted-foreground", C && "opacity-60", D),
 		children: c
-	}) : null, I = /* @__PURE__ */ r("div", {
+	}) : null, R = /* @__PURE__ */ r("div", {
 		"data-slot": "form-field-content",
-		className: e("min-w-0 space-y-2", D),
-		children: O
-	}), L = l ? /* @__PURE__ */ i("p", {
+		className: e("min-w-0 space-y-2", k),
+		children: A
+	}), z = l ? /* @__PURE__ */ i("p", {
 		"data-slot": "form-field-error",
-		id: m,
+		id: g,
 		role: "alert",
 		"aria-live": "polite",
-		className: e("flex items-start gap-2 rounded-[min(var(--radius-xl),16px)] border border-destructive/18 bg-destructive/8 px-3 py-2 text-sm font-medium leading-6 text-destructive", E),
-		children: [b && /* @__PURE__ */ r("span", {
+		className: e("flex items-start gap-2 rounded-[min(var(--radius-xl),16px)] border border-destructive/18 bg-destructive/8 px-3 py-2 text-sm font-medium leading-6 text-destructive", O),
+		children: [S && /* @__PURE__ */ r("span", {
 			className: "mt-1 shrink-0",
-			children: N
+			children: F
 		}), /* @__PURE__ */ r("span", {
 			className: "min-w-0",
 			children: l
 		})]
+	}) : null, B = u && !l ? /* @__PURE__ */ r("p", {
+		"data-slot": "form-field-success",
+		className: "rounded-[min(var(--radius-xl),16px)] border border-emerald-500/18 bg-emerald-500/8 px-3 py-2 text-sm font-medium leading-6 text-emerald-700 dark:text-emerald-300",
+		children: u
+	}) : null, V = d ? /* @__PURE__ */ r("p", {
+		"data-slot": "form-field-loading",
+		className: "text-sm leading-6 text-muted-foreground",
+		children: "Loading..."
 	}) : null;
 	return /* @__PURE__ */ r("div", {
 		"data-slot": "form-field-shell",
-		"data-layout": h,
+		"data-layout": _,
 		"data-invalid": !!l || void 0,
-		"data-disabled": x || void 0,
-		"data-readonly": S || void 0,
-		"aria-disabled": x || void 0,
-		className: e(o[h], "rounded-[var(--radius-2xl)]", a),
-		...k,
-		children: h === "horizontal" ? /* @__PURE__ */ i(n, { children: [/* @__PURE__ */ i("div", {
+		"data-success": !!(u && !l) || void 0,
+		"data-loading": d || void 0,
+		"data-disabled": C || void 0,
+		"data-readonly": w || void 0,
+		"aria-disabled": C || void 0,
+		className: e(o[_], "rounded-[var(--radius-2xl)]", a),
+		...j,
+		children: _ === "horizontal" ? /* @__PURE__ */ i(n, { children: [/* @__PURE__ */ i("div", {
 			className: "grid gap-2 sm:pt-2.5",
-			children: [P, j && F]
+			children: [I, N && L]
 		}), /* @__PURE__ */ i("div", {
 			className: "grid min-w-0 gap-2",
 			children: [
-				I,
-				M && F,
-				L
+				R,
+				V,
+				P && L,
+				B,
+				z
 			]
-		})] }) : h === "inline" ? /* @__PURE__ */ i(n, { children: [P, /* @__PURE__ */ i("div", {
+		})] }) : _ === "inline" ? /* @__PURE__ */ i(n, { children: [I, /* @__PURE__ */ i("div", {
 			className: "grid min-w-0 flex-1 gap-2",
 			children: [
-				j && F,
-				I,
-				M && F,
-				L
+				N && L,
+				R,
+				V,
+				P && L,
+				B,
+				z
 			]
 		})] }) : /* @__PURE__ */ i(n, { children: [
-			P,
-			j && F,
 			I,
-			M && F,
-			L
+			N && L,
+			R,
+			V,
+			P && L,
+			B,
+			z
 		] })
 	});
 }

package/dist/components/form/form-input.cjs

@@ -1 +1 @@
-Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("../../_virtual/_rolldown/runtime.cjs"),t=require("../inputs/clearable-input.cjs"),n=require("../inputs/date-input.cjs"),r=require("../inputs/date-range-input.cjs"),i=require("../inputs/money-input.cjs"),a=require("../inputs/masked-input.cjs"),o=require("../inputs/number-input.cjs"),s=require("../inputs/phone-input.cjs"),c=require("../inputs/quantity-input.cjs"),l=require("../inputs/search-input.cjs"),u=require("../ui/input/index.cjs"),d=require("./form-field-shell.cjs");let f=require("react");f=e.__toESM(f,1);let p=require("react/jsx-runtime"),m=require("react-hook-form");function h(e){return{label:e.label,description:e.description,required:e.required,className:e.className,htmlFor:e.id??e.name,layout:e.layout,descriptionPosition:e.descriptionPosition,labelAction:e.labelAction,requiredIndicator:e.requiredIndicator,errorIcon:e.errorIcon,showErrorIcon:e.showErrorIcon,disabled:e.disabled,readOnly:e.readOnly,labelClassName:e.labelClassName,labelRowClassName:e.labelRowClassName,descriptionClassName:e.descriptionClassName,errorClassName:e.errorClassName,contentClassName:e.contentClassName}}function g(e){let f=e.id??e.name,g=h(e),_=e.kind??`text`,v=e.fieldClassName??`w-full`;return(0,p.jsx)(m.Controller,{control:e.control,name:e.name,rules:e.rules,render:({field:m,fieldState:h})=>{let y=h.error?.message,b=d.resolveFormFieldIds(f,{description:e.description,error:y});if(_===`search`){let{control:t,name:n,label:r,description:i,required:a,className:o,layout:s,descriptionPosition:c,labelAction:u,requiredIndicator:_,errorIcon:x,showErrorIcon:S,disabled:C,readOnly:w,labelClassName:T,labelRowClassName:E,descriptionClassName:D,errorClassName:O,contentClassName:k,fieldClassName:A,id:j,kind:M,onValueChange:N,onBlur:P,...F}=e;return(0,p.jsx)(d.FormFieldShell,{...g,labelId:b.labelId,descriptionId:b.descriptionId,errorId:b.errorId,error:y,htmlFor:j??f,children:(0,p.jsx)(l.SearchInput,{...F,id:j??f,name:m.name,ref:m.ref,value:m.value??``,disabled:C,readOnly:e.readOnly,inputClassName:A??v,"aria-invalid":h.invalid||void 0,"aria-describedby":b.describedBy,"aria-errormessage":y?b.errorId:void 0,onBlur:e=>{m.onBlur(),P?.(e)},onValueChange:e=>{m.onChange(e),N?.(e)}})})}if(_===`password`){let{control:t,name:n,label:r,description:i,required:a,className:o,layout:s,descriptionPosition:c,labelAction:l,requiredIndicator:_,errorIcon:x,showErrorIcon:S,disabled:C,readOnly:w,labelClassName:T,labelRowClassName:E,descriptionClassName:D,errorClassName:O,contentClassName:k,fieldClassName:A,id:j,kind:M,onValueChange:N,onBlur:P,...F}=e;return(0,p.jsx)(d.FormFieldShell,{...g,labelId:b.labelId,descriptionId:b.descriptionId,errorId:b.errorId,error:y,htmlFor:j??f,children:(0,p.jsx)(u.Input,{...F,type:`password`,id:j??f,ref:m.ref,name:m.name,value:m.value??``,disabled:C,readOnly:e.readOnly,inputClassName:A??v,"aria-describedby":b.describedBy,"aria-errormessage":y?b.errorId:void 0,onBlur:e=>{m.onBlur(),P?.(e)},onChange:e=>{let t=e.currentTarget.value;m.onChange(t),N?.(t)},"aria-invalid":h.invalid||void 0})})}if(_===`number`){let{control:t,name:n,label:r,description:i,required:a,className:s,layout:c,descriptionPosition:l,labelAction:u,requiredIndicator:_,errorIcon:x,showErrorIcon:S,disabled:C,readOnly:w,labelClassName:T,labelRowClassName:E,descriptionClassName:D,errorClassName:O,contentClassName:k,fieldClassName:A,id:j,kind:M,emptyValue:N=null,onNumberChange:P,onBlur:F,...I}=e;return(0,p.jsx)(d.FormFieldShell,{...g,labelId:b.labelId,descriptionId:b.descriptionId,errorId:b.errorId,error:y,htmlFor:j??f,children:(0,p.jsx)(o.NumberInput,{...I,id:j??f,name:m.name,ref:m.ref,value:m.value??``,disabled:C,readOnly:e.readOnly,className:A??v,"aria-invalid":h.invalid||void 0,"aria-describedby":b.describedBy,"aria-errormessage":y?b.errorId:void 0,onBlur:e=>{m.onBlur(),F?.(e)},onNumberChange:e=>{m.onChange(e??N),P?.(e)}})})}if(_===`phone`){let{control:t,name:n,label:r,description:i,required:a,className:o,layout:c,descriptionPosition:l,labelAction:u,requiredIndicator:_,errorIcon:x,showErrorIcon:S,disabled:C,readOnly:w,labelClassName:T,labelRowClassName:E,descriptionClassName:D,errorClassName:O,contentClassName:k,fieldClassName:A,id:j,kind:M,valueMode:N=`raw`,countryCode:P=`+998`,maxDigits:F=12,onValueChange:I,onBlur:L,...R}=e,z=m.value==null?``:String(m.value),B=N===`raw`?s.formatPhoneDigits(z,P,F):z;return(0,p.jsx)(d.FormFieldShell,{...g,labelId:b.labelId,descriptionId:b.descriptionId,errorId:b.errorId,error:y,htmlFor:j??f,children:(0,p.jsx)(s.PhoneInput,{...R,id:j??f,name:m.name,ref:m.ref,value:B,disabled:C,readOnly:e.readOnly,countryCode:P,maxDigits:F,className:A??v,"aria-invalid":h.invalid||void 0,"aria-describedby":b.describedBy,"aria-errormessage":y?b.errorId:void 0,onBlur:e=>{m.onBlur(),L?.(e)},onValueChange:(e,t)=>{let n=N===`raw`?t:e;m.onChange(n),I?.(n,t,e)}})})}if(_===`date`){let{control:t,name:r,label:i,description:a,required:o,className:s,layout:c,descriptionPosition:l,labelAction:u,requiredIndicator:_,errorIcon:x,showErrorIcon:S,disabled:C,readOnly:w,labelClassName:T,labelRowClassName:E,descriptionClassName:D,errorClassName:O,contentClassName:k,fieldClassName:A,id:j,kind:M,emptyValue:N=``,onValueChange:P,onBlur:F,...I}=e;return(0,p.jsx)(d.FormFieldShell,{...g,labelId:b.labelId,descriptionId:b.descriptionId,errorId:b.errorId,error:y,htmlFor:j??f,children:(0,p.jsx)(n.DateInput,{...I,id:j??f,name:m.name,ref:m.ref,value:m.value??``,disabled:C,readOnly:e.readOnly,className:A??v,"aria-invalid":h.invalid||void 0,"aria-describedby":b.describedBy,"aria-errormessage":y?b.errorId:void 0,onBlur:e=>{m.onBlur(),F?.(e)},onValueChange:e=>{m.onChange(e||N),P?.(e)}})})}if(_===`clearable`){let{control:n,name:r,label:i,description:a,required:o,className:s,layout:c,descriptionPosition:l,labelAction:u,requiredIndicator:_,errorIcon:x,showErrorIcon:S,disabled:C,readOnly:w,labelClassName:T,labelRowClassName:E,descriptionClassName:D,errorClassName:O,contentClassName:k,fieldClassName:A,id:j,kind:M,emptyValue:N=``,onValueChange:P,onBlur:F,...I}=e;return(0,p.jsx)(d.FormFieldShell,{...g,labelId:b.labelId,descriptionId:b.descriptionId,errorId:b.errorId,error:y,htmlFor:j??f,children:(0,p.jsx)(t.ClearableInput,{...I,id:j??f,name:m.name,ref:m.ref,value:m.value??``,disabled:C,readOnly:e.readOnly,className:A??v,"aria-invalid":h.invalid||void 0,"aria-describedby":b.describedBy,"aria-errormessage":y?b.errorId:void 0,onBlur:e=>{m.onBlur(),F?.(e)},onValueChange:e=>{m.onChange(e||N),P?.(e)}})})}if(_===`masked`){let{control:t,name:n,label:r,description:i,required:o,className:s,layout:c,descriptionPosition:l,labelAction:u,requiredIndicator:_,errorIcon:x,showErrorIcon:S,disabled:C,readOnly:w,labelClassName:T,labelRowClassName:E,descriptionClassName:D,errorClassName:O,contentClassName:k,fieldClassName:A,id:j,kind:M,valueMode:N=`raw`,onValueChange:P,onBlur:F,...I}=e;return(0,p.jsx)(d.FormFieldShell,{...g,labelId:b.labelId,descriptionId:b.descriptionId,errorId:b.errorId,error:y,htmlFor:j??f,children:(0,p.jsx)(a.MaskedInput,{...I,id:j??f,name:m.name,ref:m.ref,value:String(m.value??``),disabled:C,readOnly:e.readOnly,className:A??v,"aria-invalid":h.invalid||void 0,"aria-describedby":b.describedBy,"aria-errormessage":y?b.errorId:void 0,onBlur:e=>{m.onBlur(),F?.(e)},onValueChange:(e,t)=>{let n=N===`raw`?t:e;m.onChange(n),P?.(e,t)}})})}if(_===`money`){let{control:t,name:n,label:r,description:a,required:o,className:s,layout:c,descriptionPosition:l,labelAction:u,requiredIndicator:_,errorIcon:x,showErrorIcon:S,disabled:C,readOnly:w,labelClassName:T,labelRowClassName:E,descriptionClassName:D,errorClassName:O,contentClassName:k,fieldClassName:A,id:j,kind:M,emptyValue:N=null,onValueChange:P,onBlur:F,...I}=e;return(0,p.jsx)(d.FormFieldShell,{...g,labelId:b.labelId,descriptionId:b.descriptionId,errorId:b.errorId,error:y,htmlFor:j??f,children:(0,p.jsx)(i.MoneyInput,{...I,id:j??f,name:m.name,ref:m.ref,value:m.value??null,disabled:C,readOnly:e.readOnly,className:A??v,"aria-invalid":h.invalid||void 0,"aria-describedby":b.describedBy,"aria-errormessage":y?b.errorId:void 0,onBlur:e=>{m.onBlur(),F?.(e)},onValueChange:(e,t)=>{m.onChange(e??N),P?.(e,t)}})})}if(_===`quantity`){let{control:t,name:n,label:r,description:i,required:a,className:o,layout:s,descriptionPosition:l,labelAction:u,requiredIndicator:_,errorIcon:x,showErrorIcon:S,disabled:C,readOnly:w,labelClassName:T,labelRowClassName:E,descriptionClassName:D,errorClassName:O,contentClassName:k,fieldClassName:A,id:j,kind:M,emptyValue:N=null,onValueChange:P,onBlur:F,...I}=e;return(0,p.jsx)(d.FormFieldShell,{...g,labelId:b.labelId,descriptionId:b.descriptionId,errorId:b.errorId,error:y,htmlFor:j??f,children:(0,p.jsx)(c.QuantityInput,{...I,id:j??f,name:m.name,ref:m.ref,value:m.value,disabled:C,readOnly:e.readOnly,className:A??v,"aria-invalid":h.invalid||void 0,"aria-describedby":b.describedBy,"aria-errormessage":y?b.errorId:void 0,onBlur:e=>{m.onBlur(),F?.(e)},onValueChange:e=>{m.onChange(e??N),P?.(e)}})})}if(_===`date-range`){let{control:t,name:n,label:i,description:a,required:o,className:s,layout:c,descriptionPosition:l,labelAction:u,requiredIndicator:_,errorIcon:v,showErrorIcon:x,disabled:S,labelClassName:C,labelRowClassName:w,descriptionClassName:T,errorClassName:E,contentClassName:D,fieldClassName:O,id:k,kind:A,onValueChange:j,onBlur:M,...N}=e,P=m.value;return(0,p.jsx)(d.FormFieldShell,{...g,labelId:b.labelId,descriptionId:b.descriptionId,errorId:b.errorId,error:y,htmlFor:k??f,children:(0,p.jsx)(r.DateRangeInput,{...N,id:k??f,value:P&&typeof P==`object`?{from:P.from,to:P.to}:{from:``,to:``},fromInputProps:{...N.fromInputProps??{},disabled:S,readOnly:e.readOnly,"aria-describedby":b.describedBy,"aria-errormessage":y?b.errorId:void 0},toInputProps:{...N.toInputProps??{},disabled:S,readOnly:e.readOnly,"aria-describedby":b.describedBy,"aria-errormessage":y?b.errorId:void 0},onValueChange:e=>{m.onChange(e),j?.(e)},"aria-invalid":h.invalid||void 0,onBlur:e=>{m.onBlur(),M?.(e)}})})}let{control:x,name:S,label:C,description:w,required:T,className:E,layout:D,descriptionPosition:O,labelAction:k,requiredIndicator:A,errorIcon:j,showErrorIcon:M,disabled:N,readOnly:P,labelClassName:F,labelRowClassName:I,descriptionClassName:L,errorClassName:R,contentClassName:z,fieldClassName:B,transformIn:V,transformOut:H,id:U,kind:W,onChange:G,onBlur:K,...q}=e;return(0,p.jsx)(d.FormFieldShell,{...g,labelId:b.labelId,descriptionId:b.descriptionId,errorId:b.errorId,error:y,htmlFor:U??f,children:(0,p.jsx)(u.Input,{...q,id:U??f,ref:m.ref,name:m.name,value:V?V(m.value):m.value??``,disabled:N,readOnly:P,onBlur:e=>{m.onBlur(),K?.(e)},onChange:e=>{m.onChange(H?H(e):e.target.value),G?.(e)},"aria-invalid":h.invalid||void 0,"aria-describedby":b.describedBy,"aria-errormessage":y?b.errorId:void 0,className:B??v})})}})}exports.FormInput=g;
+Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("../../_virtual/_rolldown/runtime.cjs"),t=require("../inputs/date-input.cjs"),n=require("../inputs/date-range-input.cjs"),r=require("../inputs/money-input.cjs"),i=require("../inputs/masked-input.cjs"),a=require("../inputs/number-input.cjs"),o=require("../inputs/phone-input.cjs"),s=require("../inputs/quantity-input.cjs"),c=require("../ui/input/index.cjs"),l=require("./form-field-shell.cjs");let u=require("react");u=e.__toESM(u,1);let d=require("react/jsx-runtime"),f=require("react-hook-form");function p(e){return{label:e.label,description:e.description,success:e.success,loading:e.loading,required:e.required,className:e.className,htmlFor:e.id??e.name,layout:e.layout,descriptionPosition:e.descriptionPosition,labelAction:e.labelAction,requiredIndicator:e.requiredIndicator,errorIcon:e.errorIcon,showErrorIcon:e.showErrorIcon,disabled:e.disabled,readOnly:e.readOnly,labelClassName:e.labelClassName,labelRowClassName:e.labelRowClassName,descriptionClassName:e.descriptionClassName,errorClassName:e.errorClassName,contentClassName:e.contentClassName}}function m(e){let u=e.id??e.name,m=p(e),h=e.kind??`text`,g=e.fieldClassName??`w-full`;return(0,d.jsx)(f.Controller,{control:e.control,name:e.name,rules:e.rules,render:({field:f,fieldState:p})=>{let _=p.error?.message,v=l.resolveFormFieldIds(u,{description:e.description,error:_});if(h===`search`){let{control:t,name:n,label:r,description:i,required:a,className:o,layout:s,descriptionPosition:h,labelAction:y,requiredIndicator:b,errorIcon:x,showErrorIcon:S,disabled:C,readOnly:w,labelClassName:T,labelRowClassName:E,descriptionClassName:D,errorClassName:O,contentClassName:k,fieldClassName:A,id:j,kind:M,onValueChange:N,onBlur:P,...F}=e;return(0,d.jsx)(l.FormFieldShell,{...m,labelId:v.labelId,descriptionId:v.descriptionId,errorId:v.errorId,error:_,htmlFor:j??u,children:(0,d.jsx)(c.Input,{...F,type:`search`,id:j??u,name:f.name,ref:f.ref,value:f.value??``,disabled:C,readOnly:e.readOnly,inputClassName:A??g,"aria-invalid":p.invalid||void 0,"aria-describedby":v.describedBy,"aria-errormessage":_?v.errorId:void 0,onBlur:e=>{f.onBlur(),P?.(e)},onValueChange:e=>{f.onChange(e),N?.(e)}})})}if(h===`password`){let{control:t,name:n,label:r,description:i,required:a,className:o,layout:s,descriptionPosition:h,labelAction:y,requiredIndicator:b,errorIcon:x,showErrorIcon:S,disabled:C,readOnly:w,labelClassName:T,labelRowClassName:E,descriptionClassName:D,errorClassName:O,contentClassName:k,fieldClassName:A,id:j,kind:M,onValueChange:N,onBlur:P,...F}=e;return(0,d.jsx)(l.FormFieldShell,{...m,labelId:v.labelId,descriptionId:v.descriptionId,errorId:v.errorId,error:_,htmlFor:j??u,children:(0,d.jsx)(c.Input,{...F,type:`password`,id:j??u,ref:f.ref,name:f.name,value:f.value??``,disabled:C,readOnly:e.readOnly,inputClassName:A??g,"aria-describedby":v.describedBy,"aria-errormessage":_?v.errorId:void 0,onBlur:e=>{f.onBlur(),P?.(e)},onChange:e=>{let t=e.currentTarget.value;f.onChange(t),N?.(t)},"aria-invalid":p.invalid||void 0})})}if(h===`number`){let{control:t,name:n,label:r,description:i,required:o,className:s,layout:c,descriptionPosition:h,labelAction:y,requiredIndicator:b,errorIcon:x,showErrorIcon:S,disabled:C,readOnly:w,labelClassName:T,labelRowClassName:E,descriptionClassName:D,errorClassName:O,contentClassName:k,fieldClassName:A,id:j,kind:M,emptyValue:N=null,onNumberChange:P,onBlur:F,...I}=e;return(0,d.jsx)(l.FormFieldShell,{...m,labelId:v.labelId,descriptionId:v.descriptionId,errorId:v.errorId,error:_,htmlFor:j??u,children:(0,d.jsx)(a.NumberInput,{...I,id:j??u,name:f.name,ref:f.ref,value:f.value??``,disabled:C,readOnly:e.readOnly,className:A??g,"aria-invalid":p.invalid||void 0,"aria-describedby":v.describedBy,"aria-errormessage":_?v.errorId:void 0,onBlur:e=>{f.onBlur(),F?.(e)},onNumberChange:e=>{f.onChange(e??N),P?.(e)}})})}if(h===`phone`){let{control:t,name:n,label:r,description:i,required:a,className:s,layout:c,descriptionPosition:h,labelAction:y,requiredIndicator:b,errorIcon:x,showErrorIcon:S,disabled:C,readOnly:w,labelClassName:T,labelRowClassName:E,descriptionClassName:D,errorClassName:O,contentClassName:k,fieldClassName:A,id:j,kind:M,valueMode:N=`raw`,countryCode:P=`+998`,maxDigits:F=12,onValueChange:I,onBlur:L,...R}=e,z=f.value==null?``:String(f.value),B=N===`raw`?o.formatPhoneDigits(z,P,F):z;return(0,d.jsx)(l.FormFieldShell,{...m,labelId:v.labelId,descriptionId:v.descriptionId,errorId:v.errorId,error:_,htmlFor:j??u,children:(0,d.jsx)(o.PhoneInput,{...R,id:j??u,name:f.name,ref:f.ref,value:B,disabled:C,readOnly:e.readOnly,countryCode:P,maxDigits:F,className:A??g,"aria-invalid":p.invalid||void 0,"aria-describedby":v.describedBy,"aria-errormessage":_?v.errorId:void 0,onBlur:e=>{f.onBlur(),L?.(e)},onValueChange:(e,t)=>{let n=N===`raw`?t:e;f.onChange(n),I?.(n,t,e)}})})}if(h===`date`){let{control:n,name:r,label:i,description:a,required:o,className:s,layout:c,descriptionPosition:h,labelAction:y,requiredIndicator:b,errorIcon:x,showErrorIcon:S,disabled:C,readOnly:w,labelClassName:T,labelRowClassName:E,descriptionClassName:D,errorClassName:O,contentClassName:k,fieldClassName:A,id:j,kind:M,emptyValue:N=``,onValueChange:P,onBlur:F,...I}=e;return(0,d.jsx)(l.FormFieldShell,{...m,labelId:v.labelId,descriptionId:v.descriptionId,errorId:v.errorId,error:_,htmlFor:j??u,children:(0,d.jsx)(t.DateInput,{...I,id:j??u,name:f.name,ref:f.ref,value:f.value??``,disabled:C,readOnly:e.readOnly,className:A??g,"aria-invalid":p.invalid||void 0,"aria-describedby":v.describedBy,"aria-errormessage":_?v.errorId:void 0,onBlur:e=>{f.onBlur(),F?.(e)},onValueChange:e=>{f.onChange(e||N),P?.(e)}})})}if(h===`clearable`){let{control:t,name:n,label:r,description:i,required:a,className:o,layout:s,descriptionPosition:h,labelAction:y,requiredIndicator:b,errorIcon:x,showErrorIcon:S,disabled:C,readOnly:w,labelClassName:T,labelRowClassName:E,descriptionClassName:D,errorClassName:O,contentClassName:k,fieldClassName:A,id:j,kind:M,emptyValue:N=``,onValueChange:P,onBlur:F,...I}=e;return(0,d.jsx)(l.FormFieldShell,{...m,labelId:v.labelId,descriptionId:v.descriptionId,errorId:v.errorId,error:_,htmlFor:j??u,children:(0,d.jsx)(c.Input,{...I,clearable:!0,id:j??u,name:f.name,ref:f.ref,value:f.value??``,disabled:C,readOnly:e.readOnly,className:A??g,"aria-invalid":p.invalid||void 0,"aria-describedby":v.describedBy,"aria-errormessage":_?v.errorId:void 0,onBlur:e=>{f.onBlur(),F?.(e)},onValueChange:e=>{f.onChange(e||N),P?.(e)}})})}if(h===`masked`){let{control:t,name:n,label:r,description:a,required:o,className:s,layout:c,descriptionPosition:h,labelAction:y,requiredIndicator:b,errorIcon:x,showErrorIcon:S,disabled:C,readOnly:w,labelClassName:T,labelRowClassName:E,descriptionClassName:D,errorClassName:O,contentClassName:k,fieldClassName:A,id:j,kind:M,valueMode:N=`raw`,onValueChange:P,onBlur:F,...I}=e;return(0,d.jsx)(l.FormFieldShell,{...m,labelId:v.labelId,descriptionId:v.descriptionId,errorId:v.errorId,error:_,htmlFor:j??u,children:(0,d.jsx)(i.MaskedInput,{...I,id:j??u,name:f.name,ref:f.ref,value:String(f.value??``),disabled:C,readOnly:e.readOnly,className:A??g,"aria-invalid":p.invalid||void 0,"aria-describedby":v.describedBy,"aria-errormessage":_?v.errorId:void 0,onBlur:e=>{f.onBlur(),F?.(e)},onValueChange:(e,t)=>{let n=N===`raw`?t:e;f.onChange(n),P?.(e,t)}})})}if(h===`money`){let{control:t,name:n,label:i,description:a,required:o,className:s,layout:c,descriptionPosition:h,labelAction:y,requiredIndicator:b,errorIcon:x,showErrorIcon:S,disabled:C,readOnly:w,labelClassName:T,labelRowClassName:E,descriptionClassName:D,errorClassName:O,contentClassName:k,fieldClassName:A,id:j,kind:M,emptyValue:N=null,onValueChange:P,onBlur:F,...I}=e;return(0,d.jsx)(l.FormFieldShell,{...m,labelId:v.labelId,descriptionId:v.descriptionId,errorId:v.errorId,error:_,htmlFor:j??u,children:(0,d.jsx)(r.MoneyInput,{...I,id:j??u,name:f.name,ref:f.ref,value:f.value??null,disabled:C,readOnly:e.readOnly,className:A??g,"aria-invalid":p.invalid||void 0,"aria-describedby":v.describedBy,"aria-errormessage":_?v.errorId:void 0,onBlur:e=>{f.onBlur(),F?.(e)},onValueChange:(e,t)=>{f.onChange(e??N),P?.(e,t)}})})}if(h===`quantity`){let{control:t,name:n,label:r,description:i,required:a,className:o,layout:c,descriptionPosition:h,labelAction:y,requiredIndicator:b,errorIcon:x,showErrorIcon:S,disabled:C,readOnly:w,labelClassName:T,labelRowClassName:E,descriptionClassName:D,errorClassName:O,contentClassName:k,fieldClassName:A,id:j,kind:M,emptyValue:N=null,onValueChange:P,onBlur:F,...I}=e;return(0,d.jsx)(l.FormFieldShell,{...m,labelId:v.labelId,descriptionId:v.descriptionId,errorId:v.errorId,error:_,htmlFor:j??u,children:(0,d.jsx)(s.QuantityInput,{...I,id:j??u,name:f.name,ref:f.ref,value:f.value,disabled:C,readOnly:e.readOnly,className:A??g,"aria-invalid":p.invalid||void 0,"aria-describedby":v.describedBy,"aria-errormessage":_?v.errorId:void 0,onBlur:e=>{f.onBlur(),F?.(e)},onValueChange:e=>{f.onChange(e??N),P?.(e)}})})}if(h===`date-range`){let{control:t,name:r,label:i,description:a,required:o,className:s,layout:c,descriptionPosition:h,labelAction:g,requiredIndicator:y,errorIcon:b,showErrorIcon:x,disabled:S,labelClassName:C,labelRowClassName:w,descriptionClassName:T,errorClassName:E,contentClassName:D,fieldClassName:O,id:k,kind:A,onValueChange:j,onBlur:M,...N}=e,P=f.value;return(0,d.jsx)(l.FormFieldShell,{...m,labelId:v.labelId,descriptionId:v.descriptionId,errorId:v.errorId,error:_,htmlFor:k??u,children:(0,d.jsx)(n.DateRangeInput,{...N,id:k??u,value:P&&typeof P==`object`?{from:P.from,to:P.to}:{from:``,to:``},fromInputProps:{...N.fromInputProps??{},disabled:S,readOnly:e.readOnly,"aria-describedby":v.describedBy,"aria-errormessage":_?v.errorId:void 0},toInputProps:{...N.toInputProps??{},disabled:S,readOnly:e.readOnly,"aria-describedby":v.describedBy,"aria-errormessage":_?v.errorId:void 0},onValueChange:e=>{f.onChange(e),j?.(e)},"aria-invalid":p.invalid||void 0,onBlur:e=>{f.onBlur(),M?.(e)}})})}let{control:y,name:b,label:x,description:S,required:C,className:w,layout:T,descriptionPosition:E,labelAction:D,requiredIndicator:O,errorIcon:k,showErrorIcon:A,disabled:j,readOnly:M,labelClassName:N,labelRowClassName:P,descriptionClassName:F,errorClassName:I,contentClassName:L,fieldClassName:R,transformIn:z,transformOut:B,id:V,kind:H,onChange:U,onBlur:W,...G}=e;return(0,d.jsx)(l.FormFieldShell,{...m,labelId:v.labelId,descriptionId:v.descriptionId,errorId:v.errorId,error:_,htmlFor:V??u,children:(0,d.jsx)(c.Input,{...G,id:V??u,ref:f.ref,name:f.name,value:z?z(f.value):f.value??``,disabled:j,readOnly:M,onBlur:e=>{f.onBlur(),W?.(e)},onChange:e=>{f.onChange(B?B(e):e.target.value),U?.(e)},"aria-invalid":p.invalid||void 0,"aria-describedby":v.describedBy,"aria-errormessage":_?v.errorId:void 0,className:R??g})})}})}exports.FormInput=m;

package/dist/components/form/form-input.d.ts

@@ -2,13 +2,12 @@ import * as React from "react";
 import { type Control, type FieldPath, type FieldValues, type RegisterOptions } from "react-hook-form";
 import { type DateRangeInputProps, type DateRangeValue } from "@/components/inputs/date-range-input";
 import { type DateInputProps } from "@/components/inputs/date-input";
+import { type InputClearableProps, type InputSearchProps } from "@/components/ui/input";
 import { type MaskedInputProps } from "@/components/inputs/masked-input";
 import { type MoneyInputProps } from "@/components/inputs/money-input";
 import { type NumberInputProps } from "@/components/inputs/number-input";
 import { type PhoneInputProps } from "@/components/inputs/phone-input";
 import { type QuantityInputProps } from "@/components/inputs/quantity-input";
-import { type SearchInputProps } from "@/components/inputs/search-input";
-import { type ClearableInputProps } from "@/components/inputs/clearable-input";
 import { type FormFieldShellControlProps } from "@/components/form/form-field-shell";
 export type FormInputKind = "text" | "search" | "password" | "number" | "phone" | "date" | "date-range" | "clearable" | "masked" | "money" | "quantity";
 export type FormInputPhoneInputValueMode = "raw" | "masked";
@@ -28,7 +27,7 @@ export type FormTextInputProps<TFieldValues extends FieldValues = FieldValues, T
     transformIn?: (value: unknown) => string | number | readonly string[] | undefined;
     transformOut?: (event: TextInputElementChangeEvent) => unknown;
 };
-export type FormInputSearchVariantProps<TFieldValues extends FieldValues = FieldValues, TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>> = Omit<SearchInputProps, "name" | "value" | "defaultValue" | "onValueChange"> & FormControlledFieldProps<TFieldValues, TName> & {
+export type FormInputSearchVariantProps<TFieldValues extends FieldValues = FieldValues, TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>> = Omit<InputSearchProps, "name" | "value" | "defaultValue" | "onValueChange" | "kind"> & FormControlledFieldProps<TFieldValues, TName> & {
     kind: "search";
     onValueChange?: (value: string) => void;
 };
@@ -57,7 +56,7 @@ export type FormInputDateRangeVariantProps<TFieldValues extends FieldValues = Fi
     kind: "date-range";
     onValueChange?: (value: DateRangeValue) => void;
 };
-export type FormInputClearableVariantProps<TFieldValues extends FieldValues = FieldValues, TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>> = Omit<ClearableInputProps, "name" | "value" | "defaultValue" | "onValueChange"> & FormControlledFieldProps<TFieldValues, TName> & {
+export type FormInputClearableVariantProps<TFieldValues extends FieldValues = FieldValues, TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>> = Omit<InputClearableProps, "name" | "value" | "defaultValue" | "onValueChange" | "kind"> & FormControlledFieldProps<TFieldValues, TName> & {
     kind: "clearable";
     emptyValue?: unknown;
     onValueChange?: (value: string) => void;