tembro 2.0.4 → 2.0.6

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

@@ -3,42 +3,56 @@ import "react";
 import { AlertCircleIcon as t } from "lucide-react";
 import { Fragment as n, jsx as r, jsxs as i } from "react/jsx-runtime";
 //#region src/components/form/form-field-shell.tsx
-var a = {
+function a(e, t = {}) {
+	let n = `${e}-label`, r = `${e}-description`, i = `${e}-error`;
+	return {
+		labelId: n,
+		descriptionId: r,
+		errorId: i,
+		describedBy: [t.description ? r : null, t.error ? i : null].filter(Boolean).join(" ") || void 0
+	};
+}
+var o = {
 	vertical: "grid gap-2",
 	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 o({ className: o, label: s, description: c, error: l, required: u = !1, htmlFor: d, layout: f = "vertical", descriptionPosition: p = "top", labelAction: m, requiredIndicator: h = /* @__PURE__ */ r("span", {
+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", {
 	className: "ml-1 text-destructive",
 	children: "*"
-}), errorIcon: g, showErrorIcon: _ = !0, disabled: v = !1, readOnly: y = !1, labelClassName: b, labelRowClassName: x, descriptionClassName: S, errorClassName: C, contentClassName: w, children: T, ...E }) {
-	let D = !!(s || m), O = c && p === "top", k = c && p === "bottom", A = g ?? /* @__PURE__ */ r(t, { className: "size-3.5" }), j = D ? /* @__PURE__ */ i("div", {
+}), 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", {
 		"data-slot": "form-field-label-row",
-		className: e("flex min-w-0 items-center justify-between gap-3", f === "inline" && "sm:w-auto", x),
+		className: e("flex min-w-0 items-center justify-between gap-3", h === "inline" && "sm:w-auto", w),
 		children: [s ? /* @__PURE__ */ i("label", {
 			"data-slot": "form-field-label",
 			htmlFor: d,
-			className: e("min-w-0 text-sm font-semibold leading-none tracking-tight text-foreground", v && "cursor-not-allowed opacity-60", y && "opacity-80", b),
-			children: [s, u && h]
-		}) : /* @__PURE__ */ r("span", {}), m && /* @__PURE__ */ r("div", {
+			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", {
 			"data-slot": "form-field-label-action",
 			className: "shrink-0 text-sm",
-			children: m
+			children: _
 		})]
-	}) : null, M = c ? /* @__PURE__ */ r("p", {
+	}) : null, F = c ? /* @__PURE__ */ r("p", {
 		"data-slot": "form-field-description",
-		className: e("text-sm leading-6 text-muted-foreground", v && "opacity-60", S),
+		id: p,
+		className: e("text-sm leading-6 text-muted-foreground", x && "opacity-60", T),
 		children: c
-	}) : null, N = /* @__PURE__ */ r("div", {
+	}) : null, I = /* @__PURE__ */ r("div", {
 		"data-slot": "form-field-content",
-		className: e("min-w-0 space-y-2", w),
-		children: T
-	}), P = l ? /* @__PURE__ */ i("p", {
+		className: e("min-w-0 space-y-2", D),
+		children: O
+	}), L = l ? /* @__PURE__ */ i("p", {
 		"data-slot": "form-field-error",
-		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", C),
-		children: [_ && /* @__PURE__ */ r("span", {
+		id: m,
+		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: "mt-1 shrink-0",
-			children: A
+			children: N
 		}), /* @__PURE__ */ r("span", {
 			className: "min-w-0",
 			children: l
@@ -46,39 +60,39 @@ function o({ className: o, label: s, description: c, error: l, required: u = !1,
 	}) : null;
 	return /* @__PURE__ */ r("div", {
 		"data-slot": "form-field-shell",
-		"data-layout": f,
+		"data-layout": h,
 		"data-invalid": !!l || void 0,
-		"data-disabled": v || void 0,
-		"data-readonly": y || void 0,
-		"aria-disabled": v || void 0,
-		className: e(a[f], "rounded-[var(--radius-2xl)]", o),
-		...E,
-		children: f === "horizontal" ? /* @__PURE__ */ i(n, { children: [/* @__PURE__ */ i("div", {
+		"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", {
 			className: "grid gap-2 sm:pt-2.5",
-			children: [j, O && M]
+			children: [P, j && F]
 		}), /* @__PURE__ */ i("div", {
 			className: "grid min-w-0 gap-2",
 			children: [
-				N,
-				k && M,
-				P
+				I,
+				M && F,
+				L
 			]
-		})] }) : f === "inline" ? /* @__PURE__ */ i(n, { children: [j, /* @__PURE__ */ i("div", {
+		})] }) : h === "inline" ? /* @__PURE__ */ i(n, { children: [P, /* @__PURE__ */ i("div", {
 			className: "grid min-w-0 flex-1 gap-2",
 			children: [
-				O && M,
-				N,
-				k && M,
-				P
+				j && F,
+				I,
+				M && F,
+				L
 			]
 		})] }) : /* @__PURE__ */ i(n, { children: [
-			j,
-			O && M,
-			N,
-			k && M,
-			P
+			P,
+			j && F,
+			I,
+			M && F,
+			L
 		] })
 	});
 }
 //#endregion
-export { o as FormFieldShell };
+export { s as FormFieldShell, a as resolveFormFieldIds };

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,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;if(_===`search`){let{control:t,name:n,label:r,description:i,required:a,className:o,layout:s,descriptionPosition:c,labelAction:u,requiredIndicator:_,errorIcon:b,showErrorIcon:x,disabled:S,readOnly:C,labelClassName:w,labelRowClassName:T,descriptionClassName:E,errorClassName:D,contentClassName:O,fieldClassName:k,id:A,kind:j,onValueChange:M,onBlur:N,...P}=e;return(0,p.jsx)(d.FormFieldShell,{...g,error:y,htmlFor:A??f,children:(0,p.jsx)(l.SearchInput,{...P,id:A??f,name:m.name,ref:m.ref,value:m.value??``,disabled:S,readOnly:e.readOnly,inputClassName:k??v,"aria-invalid":h.invalid||void 0,onBlur:e=>{m.onBlur(),N?.(e)},onValueChange:e=>{m.onChange(e),M?.(e)}})})}if(_===`password`){let{control:t,name:n,label:r,description:i,required:a,className:o,layout:s,descriptionPosition:c,labelAction:l,requiredIndicator:_,errorIcon:b,showErrorIcon:x,disabled:S,readOnly:C,labelClassName:w,labelRowClassName:T,descriptionClassName:E,errorClassName:D,contentClassName:O,fieldClassName:k,id:A,kind:j,onValueChange:M,onBlur:N,...P}=e;return(0,p.jsx)(d.FormFieldShell,{...g,error:y,htmlFor:A??f,children:(0,p.jsx)(u.Input,{...P,type:`password`,id:A??f,ref:m.ref,name:m.name,value:m.value??``,disabled:S,readOnly:e.readOnly,inputClassName:k??v,onBlur:e=>{m.onBlur(),N?.(e)},onChange:e=>{let t=e.currentTarget.value;m.onChange(t),M?.(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:b,showErrorIcon:x,disabled:S,readOnly:C,labelClassName:w,labelRowClassName:T,descriptionClassName:E,errorClassName:D,contentClassName:O,fieldClassName:k,id:A,kind:j,emptyValue:M=null,onNumberChange:N,onBlur:P,...F}=e;return(0,p.jsx)(d.FormFieldShell,{...g,error:y,htmlFor:A??f,children:(0,p.jsx)(o.NumberInput,{...F,id:A??f,name:m.name,ref:m.ref,value:m.value??``,disabled:S,readOnly:e.readOnly,className:k??v,"aria-invalid":h.invalid||void 0,onBlur:e=>{m.onBlur(),P?.(e)},onNumberChange:e=>{m.onChange(e??M),N?.(e)}})})}if(_===`phone`){let{control:t,name:n,label:r,description:i,required:a,className:o,layout:c,descriptionPosition:l,labelAction:u,requiredIndicator:_,errorIcon:b,showErrorIcon:x,disabled:S,readOnly:C,labelClassName:w,labelRowClassName:T,descriptionClassName:E,errorClassName:D,contentClassName:O,fieldClassName:k,id:A,kind:j,valueMode:M=`raw`,countryCode:N=`+998`,maxDigits:P=12,onValueChange:F,onBlur:I,...L}=e,R=m.value==null?``:String(m.value),z=M===`raw`?s.formatPhoneDigits(R,N,P):R;return(0,p.jsx)(d.FormFieldShell,{...g,error:y,htmlFor:A??f,children:(0,p.jsx)(s.PhoneInput,{...L,id:A??f,name:m.name,ref:m.ref,value:z,disabled:S,readOnly:e.readOnly,countryCode:N,maxDigits:P,className:k??v,"aria-invalid":h.invalid||void 0,onBlur:e=>{m.onBlur(),I?.(e)},onValueChange:(e,t)=>{let n=M===`raw`?t:e;m.onChange(n),F?.(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:b,showErrorIcon:x,disabled:S,readOnly:C,labelClassName:w,labelRowClassName:T,descriptionClassName:E,errorClassName:D,contentClassName:O,fieldClassName:k,id:A,kind:j,emptyValue:M=``,onValueChange:N,onBlur:P,...F}=e;return(0,p.jsx)(d.FormFieldShell,{...g,error:y,htmlFor:A??f,children:(0,p.jsx)(n.DateInput,{...F,id:A??f,name:m.name,ref:m.ref,value:m.value??``,disabled:S,readOnly:e.readOnly,className:k??v,"aria-invalid":h.invalid||void 0,onBlur:e=>{m.onBlur(),P?.(e)},onValueChange:e=>{m.onChange(e||M),N?.(e)}})})}if(_===`clearable`){let{control:n,name:r,label:i,description:a,required:o,className:s,layout:c,descriptionPosition:l,labelAction:u,requiredIndicator:_,errorIcon:b,showErrorIcon:x,disabled:S,readOnly:C,labelClassName:w,labelRowClassName:T,descriptionClassName:E,errorClassName:D,contentClassName:O,fieldClassName:k,id:A,kind:j,emptyValue:M=``,onValueChange:N,onBlur:P,...F}=e;return(0,p.jsx)(d.FormFieldShell,{...g,error:y,htmlFor:A??f,children:(0,p.jsx)(t.ClearableInput,{...F,id:A??f,name:m.name,ref:m.ref,value:m.value??``,disabled:S,readOnly:e.readOnly,className:k??v,"aria-invalid":h.invalid||void 0,onBlur:e=>{m.onBlur(),P?.(e)},onValueChange:e=>{m.onChange(e||M),N?.(e)}})})}if(_===`masked`){let{control:t,name:n,label:r,description:i,required:o,className:s,layout:c,descriptionPosition:l,labelAction:u,requiredIndicator:_,errorIcon:b,showErrorIcon:x,disabled:S,readOnly:C,labelClassName:w,labelRowClassName:T,descriptionClassName:E,errorClassName:D,contentClassName:O,fieldClassName:k,id:A,kind:j,valueMode:M=`raw`,onValueChange:N,onBlur:P,...F}=e;return(0,p.jsx)(d.FormFieldShell,{...g,error:y,htmlFor:A??f,children:(0,p.jsx)(a.MaskedInput,{...F,id:A??f,name:m.name,ref:m.ref,value:String(m.value??``),disabled:S,readOnly:e.readOnly,className:k??v,"aria-invalid":h.invalid||void 0,onBlur:e=>{m.onBlur(),P?.(e)},onValueChange:(e,t)=>{let n=M===`raw`?t:e;m.onChange(n),N?.(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:b,showErrorIcon:x,disabled:S,readOnly:C,labelClassName:w,labelRowClassName:T,descriptionClassName:E,errorClassName:D,contentClassName:O,fieldClassName:k,id:A,kind:j,emptyValue:M=null,onValueChange:N,onBlur:P,...F}=e;return(0,p.jsx)(d.FormFieldShell,{...g,error:y,htmlFor:A??f,children:(0,p.jsx)(i.MoneyInput,{...F,id:A??f,name:m.name,ref:m.ref,value:m.value??null,disabled:S,readOnly:e.readOnly,className:k??v,"aria-invalid":h.invalid||void 0,onBlur:e=>{m.onBlur(),P?.(e)},onValueChange:(e,t)=>{m.onChange(e??M),N?.(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:b,showErrorIcon:x,disabled:S,readOnly:C,labelClassName:w,labelRowClassName:T,descriptionClassName:E,errorClassName:D,contentClassName:O,fieldClassName:k,id:A,kind:j,emptyValue:M=null,onValueChange:N,onBlur:P,...F}=e;return(0,p.jsx)(d.FormFieldShell,{...g,error:y,htmlFor:A??f,children:(0,p.jsx)(c.QuantityInput,{...F,id:A??f,name:m.name,ref:m.ref,value:m.value,disabled:S,readOnly:e.readOnly,className:k??v,"aria-invalid":h.invalid||void 0,onBlur:e=>{m.onBlur(),P?.(e)},onValueChange:e=>{m.onChange(e??M),N?.(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:b,disabled:x,labelClassName:S,labelRowClassName:C,descriptionClassName:w,errorClassName:T,contentClassName:E,fieldClassName:D,id:O,kind:k,onValueChange:A,onBlur:j,...M}=e,N=m.value;return(0,p.jsx)(d.FormFieldShell,{...g,error:y,htmlFor:O??f,children:(0,p.jsx)(r.DateRangeInput,{...M,id:O??f,value:N&&typeof N==`object`?{from:N.from,to:N.to}:{from:``,to:``},fromInputProps:{...M.fromInputProps??{},disabled:x,readOnly:e.readOnly},toInputProps:{...M.toInputProps??{},disabled:x,readOnly:e.readOnly},onValueChange:e=>{m.onChange(e),A?.(e)},"aria-invalid":h.invalid||void 0,onBlur:e=>{m.onBlur(),j?.(e)}})})}let{control:b,name:x,label:S,description:C,required:w,className:T,layout:E,descriptionPosition:D,labelAction:O,requiredIndicator:k,errorIcon:A,showErrorIcon:j,disabled:M,readOnly:N,labelClassName:P,labelRowClassName:F,descriptionClassName:I,errorClassName:L,contentClassName:R,fieldClassName:z,transformIn:B,transformOut:V,id:H,kind:U,onChange:W,onBlur:G,...K}=e;return(0,p.jsx)(d.FormFieldShell,{...g,error:y,htmlFor:H??f,children:(0,p.jsx)(u.Input,{...K,id:H??f,ref:m.ref,name:m.name,value:B?B(m.value):m.value??``,disabled:M,readOnly:N,onBlur:e=>{m.onBlur(),G?.(e)},onChange:e=>{m.onChange(V?V(e):e.target.value),W?.(e)},"aria-invalid":h.invalid||void 0,className:z??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,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;