UNPKG

@szum-tech/design-system

Version:

Szum-Tech design system with tailwindcss support

117 lines (111 loc) 4.39 kB
'use strict'; var chunkP4J2TTH7_cjs = require('./chunk-P4J2TTH7.cjs'); var chunkFVSO3RHT_cjs = require('./chunk-FVSO3RHT.cjs'); var reactHookForm = require('react-hook-form'); var React2 = require('react'); var tailwindMerge = require('tailwind-merge'); var jsxRuntime = require('react/jsx-runtime'); var reactSlot = require('@radix-ui/react-slot'); function _interopNamespace(e) { if (e && e.__esModule) return e; var n = Object.create(null); if (e) { Object.keys(e).forEach(function (k) { if (k !== 'default') { var d = Object.getOwnPropertyDescriptor(e, k); Object.defineProperty(n, k, d.get ? d : { enumerable: true, get: function () { return e[k]; } }); } }); } n.default = e; return Object.freeze(n); } var React2__namespace = /*#__PURE__*/_interopNamespace(React2); var Form = reactHookForm.FormProvider; var FormItemContext = React2__namespace.createContext({}); var FormItem = React2__namespace.forwardRef(function({ className, ...props }, ref) { const id = React2__namespace.useId(); return /* @__PURE__ */ jsxRuntime.jsx(FormItemContext.Provider, { value: { id }, children: /* @__PURE__ */ jsxRuntime.jsx("div", { ref, className: tailwindMerge.twMerge("space-y-2", className), ...props }) }); }); FormItem.displayName = "FormItem"; var FormFieldContext = React2__namespace.createContext({}); var FormField = ({ ...props }) => { return /* @__PURE__ */ jsxRuntime.jsx(FormFieldContext.Provider, { value: { name: props.name }, children: /* @__PURE__ */ jsxRuntime.jsx(reactHookForm.Controller, { ...props }) }); }; var useFormField = () => { const fieldContext = React2__namespace.useContext(FormFieldContext); const itemContext = React2__namespace.useContext(FormItemContext); const { getFieldState, formState } = reactHookForm.useFormContext(); const fieldState = getFieldState(fieldContext.name, formState); if (!fieldContext) { throw new Error("useFormField should be used within <FormField>"); } const { id } = itemContext; return { id, name: fieldContext.name, formItemId: `${id}-form-item`, formDescriptionId: `${id}-form-item-description`, formMessageId: `${id}-form-item-message`, ...fieldState }; }; var FormLabel = React2__namespace.forwardRef( ({ className, caption, ...props }, ref) => { const { error, formItemId } = useFormField(); return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-row items-end justify-between", children: [ /* @__PURE__ */ jsxRuntime.jsx( chunkFVSO3RHT_cjs.Label, { ref, className: tailwindMerge.twMerge(error ? "text-error-500" : null, className), htmlFor: formItemId, ...props } ), caption ? /* @__PURE__ */ jsxRuntime.jsx("div", { className: "typography-caption text-gray-200", children: caption }) : null ] }); } ); FormLabel.displayName = "FormLabel"; var FormControl = React2__namespace.forwardRef(function(props, ref) { const { error, formItemId, formDescriptionId, formMessageId } = useFormField(); const newProps = { ...props, invalid: !!error }; return /* @__PURE__ */ jsxRuntime.jsx( reactSlot.Slot, { ref, id: formItemId, "aria-describedby": !error ? `${formDescriptionId}` : `${formDescriptionId} ${formMessageId}`, "aria-invalid": !!error, ...newProps } ); }); FormControl.displayName = "FormControl"; var FormMessage = React2__namespace.forwardRef(function({ children, ...props }, ref) { const { error, formMessageId } = useFormField(); const body = error ? String(error?.message) : children; if (!body) { return null; } return /* @__PURE__ */ jsxRuntime.jsx(chunkP4J2TTH7_cjs.HelperText, { ref, type: "error", id: formMessageId, ...props, children: body }); }); FormMessage.displayName = "FormMessage"; var FormDescription = React2__namespace.forwardRef(function(props, ref) { const { formDescriptionId } = useFormField(); return /* @__PURE__ */ jsxRuntime.jsx(chunkP4J2TTH7_cjs.HelperText, { ref, id: formDescriptionId, ...props }); }); FormDescription.displayName = "FormDescription"; exports.Form = Form; exports.FormControl = FormControl; exports.FormDescription = FormDescription; exports.FormField = FormField; exports.FormItem = FormItem; exports.FormLabel = FormLabel; exports.FormMessage = FormMessage;