@frank-auth/react/dist/cjs/components/forms/field-error.cjs

Flexible and customizable React UI components for Frank Authentication

'use client';
"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const t=require("react/jsx-runtime"),v=require("../ui/input/input.cjs"),k=require("../../theme/context.cjs"),b=require("@emotion/styled"),p=require("framer-motion"),j=require("react"),y=e=>e&&e.__esModule?e:{default:e},l=y(b),r=y(j),_=l.default(p.motion.div)`
	display: flex;
	align-items: flex-start;
	gap: ${e=>e.theme.spacing[1]};
	color: ${e=>e.theme.colors.danger[600]};

	font-size: ${e=>{switch(e.size){case"sm":return e.theme.fontSizes.xs;case"lg":return e.theme.fontSizes.base;default:return e.theme.fontSizes.sm}}};

	${e=>{switch(e.variant){case"inline":return`
					margin-left: ${e.theme.spacing[2]};
					display: inline-flex;
				`;case"tooltip":return`
					position: absolute;
					z-index: ${e.theme.zIndex.tooltip};
					margin-top: ${e.theme.spacing[1]};
				`;default:return""}}}
`,M=l.default.span`
	color: ${e=>e.theme.colors.danger[500]};
	margin-top: ${e=>e.theme.spacing[.5]||"0.125rem"};
	flex-shrink: 0;

	svg {
		width: ${e=>e.theme.spacing[4]};
		height: ${e=>e.theme.spacing[4]};
	}
`,w=l.default.div`
	flex: 1;
	min-width: 0;
`,z=l.default.div`
	${e=>e.hasMargin&&`margin-top: ${e.theme.spacing[1]};`}
`;l.default.span`
	display: block;
	color: inherit;
	word-break: break-words;
`;function E({error:e,fieldName:a,immediate:i=!1,className:s="",icon:u,showMultiple:d=!1,variant:f="default",size:h="md"}){const{theme:n}=k.useTheme(),o=r.default.useMemo(()=>e?Array.isArray(e)?e.filter(Boolean):[e]:[],[e]);if(o.length===0)return null;const c=d?o:o.slice(0,1),$={initial:{opacity:0,y:-10,height:0},animate:{opacity:1,y:0,height:"auto",transition:{duration:.2,ease:"easeOut"}},exit:{opacity:0,y:-10,height:0,transition:{duration:.15,ease:"easeIn"}}},m=u||t.jsx("svg",{fill:"none",stroke:"currentColor",viewBox:"0 0 24 24","aria-hidden":"true",children:t.jsx("path",{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:2,d:"M12 8v4m0 4h.01M21 12a9 9 0 11-18 0 9 9 0 0118 0z"})});return t.jsx(p.AnimatePresence,{mode:"wait",children:c.length>0&&t.jsxs(_,{theme:n,size:h,variant:f,className:s,initial:i?"animate":"initial",animate:"animate",exit:"exit",variants:$,role:"alert","aria-live":"polite","aria-relevant":"all",children:[m&&t.jsx(M,{theme:n,children:m}),t.jsx(w,{theme:n,children:c.map((g,x)=>t.jsx(z,{theme:n,hasMargin:x>0,children:t.jsx(v.HelperText,{theme:n,isError:!!g,children:g})},`${a}-error-${x}`))})]})})}function C(e){const[a,i]=r.default.useState(null),[s,u]=r.default.useState(!1),d=r.default.useMemo(()=>s&&!!a,[s,a]),f=r.default.useCallback(()=>{i(null)},[]),h=r.default.useCallback(c=>{i(c)},[]),n=r.default.useCallback(()=>{u(!0)},[]),o=r.default.useCallback(()=>{i(null),u(!1)},[]);return{error:a,showError:d,touched:s,setError:h,clearError:f,touch:n,reset:o,fieldName:e}}var S=E;exports.FieldError=E;exports.default=S;exports.useFieldError=C;
//# sourceMappingURL=field-error.cjs.map