@modular-web/rc-form
Version:
Un componente de formulario flexible y personalizable construido con React, TypeScript y TailwindCSS.
669 lines (666 loc) • 25 kB
JavaScript
import Ie, { useState as Pe } from "react";
import ke from "classnames";
var J = { exports: {} }, Y = {};
/**
* @license React
* react-jsx-runtime.production.min.js
*
* Copyright (c) Facebook, Inc. and its affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*/
var qe;
function pr() {
if (qe) return Y;
qe = 1;
var g = Ie, S = Symbol.for("react.element"), D = Symbol.for("react.fragment"), j = Object.prototype.hasOwnProperty, P = g.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED.ReactCurrentOwner, k = { key: !0, ref: !0, __self: !0, __source: !0 };
function R(_, f, O) {
var v, y = {}, w = null, A = null;
O !== void 0 && (w = "" + O), f.key !== void 0 && (w = "" + f.key), f.ref !== void 0 && (A = f.ref);
for (v in f) j.call(f, v) && !k.hasOwnProperty(v) && (y[v] = f[v]);
if (_ && _.defaultProps) for (v in f = _.defaultProps, f) y[v] === void 0 && (y[v] = f[v]);
return { $$typeof: S, type: _, key: w, ref: A, props: y, _owner: P.current };
}
return Y.Fragment = D, Y.jsx = R, Y.jsxs = R, Y;
}
var L = {};
/**
* @license React
* react-jsx-runtime.development.js
*
* Copyright (c) Facebook, Inc. and its affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*/
var Fe;
function hr() {
return Fe || (Fe = 1, process.env.NODE_ENV !== "production" && function() {
var g = Ie, S = Symbol.for("react.element"), D = Symbol.for("react.portal"), j = Symbol.for("react.fragment"), P = Symbol.for("react.strict_mode"), k = Symbol.for("react.profiler"), R = Symbol.for("react.provider"), _ = Symbol.for("react.context"), f = Symbol.for("react.forward_ref"), O = Symbol.for("react.suspense"), v = Symbol.for("react.suspense_list"), y = Symbol.for("react.memo"), w = Symbol.for("react.lazy"), A = Symbol.for("react.offscreen"), h = Symbol.iterator, E = "@@iterator";
function I(e) {
if (e === null || typeof e != "object")
return null;
var r = h && e[h] || e[E];
return typeof r == "function" ? r : null;
}
var x = g.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED;
function d(e) {
{
for (var r = arguments.length, t = new Array(r > 1 ? r - 1 : 0), n = 1; n < r; n++)
t[n - 1] = arguments[n];
K("error", e, t);
}
}
function K(e, r, t) {
{
var n = x.ReactDebugCurrentFrame, o = n.getStackAddendum();
o !== "" && (r += "%s", t = t.concat([o]));
var s = t.map(function(i) {
return String(i);
});
s.unshift("Warning: " + r), Function.prototype.apply.call(console[e], console, s);
}
}
var z = !1, G = !1, T = !1, Ne = !1, $e = !1, ie;
ie = Symbol.for("react.module.reference");
function Ve(e) {
return !!(typeof e == "string" || typeof e == "function" || e === j || e === k || $e || e === P || e === O || e === v || Ne || e === A || z || G || T || typeof e == "object" && e !== null && (e.$$typeof === w || e.$$typeof === y || e.$$typeof === R || e.$$typeof === _ || e.$$typeof === f || // This needs to include all possible module reference object
// types supported by any Flight configuration anywhere since
// we don't know which Flight build this will end up being used
// with.
e.$$typeof === ie || e.getModuleId !== void 0));
}
function We(e, r, t) {
var n = e.displayName;
if (n)
return n;
var o = r.displayName || r.name || "";
return o !== "" ? t + "(" + o + ")" : t;
}
function oe(e) {
return e.displayName || "Context";
}
function C(e) {
if (e == null)
return null;
if (typeof e.tag == "number" && d("Received an unexpected object in getComponentNameFromType(). This is likely a bug in React. Please file an issue."), typeof e == "function")
return e.displayName || e.name || null;
if (typeof e == "string")
return e;
switch (e) {
case j:
return "Fragment";
case D:
return "Portal";
case k:
return "Profiler";
case P:
return "StrictMode";
case O:
return "Suspense";
case v:
return "SuspenseList";
}
if (typeof e == "object")
switch (e.$$typeof) {
case _:
var r = e;
return oe(r) + ".Consumer";
case R:
var t = e;
return oe(t._context) + ".Provider";
case f:
return We(e, e.render, "ForwardRef");
case y:
var n = e.displayName || null;
return n !== null ? n : C(e.type) || "Memo";
case w: {
var o = e, s = o._payload, i = o._init;
try {
return C(i(s));
} catch {
return null;
}
}
}
return null;
}
var q = Object.assign, V = 0, se, le, ue, ce, fe, de, ve;
function pe() {
}
pe.__reactDisabledLog = !0;
function Ye() {
{
if (V === 0) {
se = console.log, le = console.info, ue = console.warn, ce = console.error, fe = console.group, de = console.groupCollapsed, ve = console.groupEnd;
var e = {
configurable: !0,
enumerable: !0,
value: pe,
writable: !0
};
Object.defineProperties(console, {
info: e,
log: e,
warn: e,
error: e,
group: e,
groupCollapsed: e,
groupEnd: e
});
}
V++;
}
}
function Le() {
{
if (V--, V === 0) {
var e = {
configurable: !0,
enumerable: !0,
writable: !0
};
Object.defineProperties(console, {
log: q({}, e, {
value: se
}),
info: q({}, e, {
value: le
}),
warn: q({}, e, {
value: ue
}),
error: q({}, e, {
value: ce
}),
group: q({}, e, {
value: fe
}),
groupCollapsed: q({}, e, {
value: de
}),
groupEnd: q({}, e, {
value: ve
})
});
}
V < 0 && d("disabledDepth fell below zero. This is a bug in React. Please file an issue.");
}
}
var X = x.ReactCurrentDispatcher, H;
function M(e, r, t) {
{
if (H === void 0)
try {
throw Error();
} catch (o) {
var n = o.stack.trim().match(/\n( *(at )?)/);
H = n && n[1] || "";
}
return `
` + H + e;
}
}
var Q = !1, U;
{
var Me = typeof WeakMap == "function" ? WeakMap : Map;
U = new Me();
}
function he(e, r) {
if (!e || Q)
return "";
{
var t = U.get(e);
if (t !== void 0)
return t;
}
var n;
Q = !0;
var o = Error.prepareStackTrace;
Error.prepareStackTrace = void 0;
var s;
s = X.current, X.current = null, Ye();
try {
if (r) {
var i = function() {
throw Error();
};
if (Object.defineProperty(i.prototype, "props", {
set: function() {
throw Error();
}
}), typeof Reflect == "object" && Reflect.construct) {
try {
Reflect.construct(i, []);
} catch (m) {
n = m;
}
Reflect.construct(e, [], i);
} else {
try {
i.call();
} catch (m) {
n = m;
}
e.call(i.prototype);
}
} else {
try {
throw Error();
} catch (m) {
n = m;
}
e();
}
} catch (m) {
if (m && n && typeof m.stack == "string") {
for (var a = m.stack.split(`
`), p = n.stack.split(`
`), u = a.length - 1, c = p.length - 1; u >= 1 && c >= 0 && a[u] !== p[c]; )
c--;
for (; u >= 1 && c >= 0; u--, c--)
if (a[u] !== p[c]) {
if (u !== 1 || c !== 1)
do
if (u--, c--, c < 0 || a[u] !== p[c]) {
var b = `
` + a[u].replace(" at new ", " at ");
return e.displayName && b.includes("<anonymous>") && (b = b.replace("<anonymous>", e.displayName)), typeof e == "function" && U.set(e, b), b;
}
while (u >= 1 && c >= 0);
break;
}
}
} finally {
Q = !1, X.current = s, Le(), Error.prepareStackTrace = o;
}
var $ = e ? e.displayName || e.name : "", F = $ ? M($) : "";
return typeof e == "function" && U.set(e, F), F;
}
function Ue(e, r, t) {
return he(e, !1);
}
function Ze(e) {
var r = e.prototype;
return !!(r && r.isReactComponent);
}
function Z(e, r, t) {
if (e == null)
return "";
if (typeof e == "function")
return he(e, Ze(e));
if (typeof e == "string")
return M(e);
switch (e) {
case O:
return M("Suspense");
case v:
return M("SuspenseList");
}
if (typeof e == "object")
switch (e.$$typeof) {
case f:
return Ue(e.render);
case y:
return Z(e.type, r, t);
case w: {
var n = e, o = n._payload, s = n._init;
try {
return Z(s(o), r, t);
} catch {
}
}
}
return "";
}
var W = Object.prototype.hasOwnProperty, me = {}, ge = x.ReactDebugCurrentFrame;
function B(e) {
if (e) {
var r = e._owner, t = Z(e.type, e._source, r ? r.type : null);
ge.setExtraStackFrame(t);
} else
ge.setExtraStackFrame(null);
}
function Be(e, r, t, n, o) {
{
var s = Function.call.bind(W);
for (var i in e)
if (s(e, i)) {
var a = void 0;
try {
if (typeof e[i] != "function") {
var p = Error((n || "React class") + ": " + t + " type `" + i + "` is invalid; it must be a function, usually from the `prop-types` package, but received `" + typeof e[i] + "`.This often happens because of typos such as `PropTypes.function` instead of `PropTypes.func`.");
throw p.name = "Invariant Violation", p;
}
a = e[i](r, i, n, t, null, "SECRET_DO_NOT_PASS_THIS_OR_YOU_WILL_BE_FIRED");
} catch (u) {
a = u;
}
a && !(a instanceof Error) && (B(o), d("%s: type specification of %s `%s` is invalid; the type checker function must return `null` or an `Error` but returned a %s. You may have forgotten to pass an argument to the type checker creator (arrayOf, instanceOf, objectOf, oneOf, oneOfType, and shape all require an argument).", n || "React class", t, i, typeof a), B(null)), a instanceof Error && !(a.message in me) && (me[a.message] = !0, B(o), d("Failed %s type: %s", t, a.message), B(null));
}
}
}
var Je = Array.isArray;
function ee(e) {
return Je(e);
}
function Ke(e) {
{
var r = typeof Symbol == "function" && Symbol.toStringTag, t = r && e[Symbol.toStringTag] || e.constructor.name || "Object";
return t;
}
}
function ze(e) {
try {
return be(e), !1;
} catch {
return !0;
}
}
function be(e) {
return "" + e;
}
function ye(e) {
if (ze(e))
return d("The provided key is an unsupported type %s. This value must be coerced to a string before before using it here.", Ke(e)), be(e);
}
var Ee = x.ReactCurrentOwner, Ge = {
key: !0,
ref: !0,
__self: !0,
__source: !0
}, Re, _e;
function Xe(e) {
if (W.call(e, "ref")) {
var r = Object.getOwnPropertyDescriptor(e, "ref").get;
if (r && r.isReactWarning)
return !1;
}
return e.ref !== void 0;
}
function He(e) {
if (W.call(e, "key")) {
var r = Object.getOwnPropertyDescriptor(e, "key").get;
if (r && r.isReactWarning)
return !1;
}
return e.key !== void 0;
}
function Qe(e, r) {
typeof e.ref == "string" && Ee.current;
}
function er(e, r) {
{
var t = function() {
Re || (Re = !0, d("%s: `key` is not a prop. Trying to access it will result in `undefined` being returned. If you need to access the same value within the child component, you should pass it as a different prop. (https://reactjs.org/link/special-props)", r));
};
t.isReactWarning = !0, Object.defineProperty(e, "key", {
get: t,
configurable: !0
});
}
}
function rr(e, r) {
{
var t = function() {
_e || (_e = !0, d("%s: `ref` is not a prop. Trying to access it will result in `undefined` being returned. If you need to access the same value within the child component, you should pass it as a different prop. (https://reactjs.org/link/special-props)", r));
};
t.isReactWarning = !0, Object.defineProperty(e, "ref", {
get: t,
configurable: !0
});
}
}
var tr = function(e, r, t, n, o, s, i) {
var a = {
// This tag allows us to uniquely identify this as a React Element
$$typeof: S,
// Built-in properties that belong on the element
type: e,
key: r,
ref: t,
props: i,
// Record the component responsible for creating this element.
_owner: s
};
return a._store = {}, Object.defineProperty(a._store, "validated", {
configurable: !1,
enumerable: !1,
writable: !0,
value: !1
}), Object.defineProperty(a, "_self", {
configurable: !1,
enumerable: !1,
writable: !1,
value: n
}), Object.defineProperty(a, "_source", {
configurable: !1,
enumerable: !1,
writable: !1,
value: o
}), Object.freeze && (Object.freeze(a.props), Object.freeze(a)), a;
};
function nr(e, r, t, n, o) {
{
var s, i = {}, a = null, p = null;
t !== void 0 && (ye(t), a = "" + t), He(r) && (ye(r.key), a = "" + r.key), Xe(r) && (p = r.ref, Qe(r, o));
for (s in r)
W.call(r, s) && !Ge.hasOwnProperty(s) && (i[s] = r[s]);
if (e && e.defaultProps) {
var u = e.defaultProps;
for (s in u)
i[s] === void 0 && (i[s] = u[s]);
}
if (a || p) {
var c = typeof e == "function" ? e.displayName || e.name || "Unknown" : e;
a && er(i, c), p && rr(i, c);
}
return tr(e, a, p, o, n, Ee.current, i);
}
}
var re = x.ReactCurrentOwner, xe = x.ReactDebugCurrentFrame;
function N(e) {
if (e) {
var r = e._owner, t = Z(e.type, e._source, r ? r.type : null);
xe.setExtraStackFrame(t);
} else
xe.setExtraStackFrame(null);
}
var te;
te = !1;
function ne(e) {
return typeof e == "object" && e !== null && e.$$typeof === S;
}
function Te() {
{
if (re.current) {
var e = C(re.current.type);
if (e)
return `
Check the render method of \`` + e + "`.";
}
return "";
}
}
function ar(e) {
return "";
}
var we = {};
function ir(e) {
{
var r = Te();
if (!r) {
var t = typeof e == "string" ? e : e.displayName || e.name;
t && (r = `
Check the top-level render call using <` + t + ">.");
}
return r;
}
}
function je(e, r) {
{
if (!e._store || e._store.validated || e.key != null)
return;
e._store.validated = !0;
var t = ir(r);
if (we[t])
return;
we[t] = !0;
var n = "";
e && e._owner && e._owner !== re.current && (n = " It was passed a child from " + C(e._owner.type) + "."), N(e), d('Each child in a list should have a unique "key" prop.%s%s See https://reactjs.org/link/warning-keys for more information.', t, n), N(null);
}
}
function Oe(e, r) {
{
if (typeof e != "object")
return;
if (ee(e))
for (var t = 0; t < e.length; t++) {
var n = e[t];
ne(n) && je(n, r);
}
else if (ne(e))
e._store && (e._store.validated = !0);
else if (e) {
var o = I(e);
if (typeof o == "function" && o !== e.entries)
for (var s = o.call(e), i; !(i = s.next()).done; )
ne(i.value) && je(i.value, r);
}
}
}
function or(e) {
{
var r = e.type;
if (r == null || typeof r == "string")
return;
var t;
if (typeof r == "function")
t = r.propTypes;
else if (typeof r == "object" && (r.$$typeof === f || // Note: Memo only checks outer props here.
// Inner props are checked in the reconciler.
r.$$typeof === y))
t = r.propTypes;
else
return;
if (t) {
var n = C(r);
Be(t, e.props, "prop", n, e);
} else if (r.PropTypes !== void 0 && !te) {
te = !0;
var o = C(r);
d("Component %s declared `PropTypes` instead of `propTypes`. Did you misspell the property assignment?", o || "Unknown");
}
typeof r.getDefaultProps == "function" && !r.getDefaultProps.isReactClassApproved && d("getDefaultProps is only used on classic React.createClass definitions. Use a static property named `defaultProps` instead.");
}
}
function sr(e) {
{
for (var r = Object.keys(e.props), t = 0; t < r.length; t++) {
var n = r[t];
if (n !== "children" && n !== "key") {
N(e), d("Invalid prop `%s` supplied to `React.Fragment`. React.Fragment can only have `key` and `children` props.", n), N(null);
break;
}
}
e.ref !== null && (N(e), d("Invalid attribute `ref` supplied to `React.Fragment`."), N(null));
}
}
var Ce = {};
function Se(e, r, t, n, o, s) {
{
var i = Ve(e);
if (!i) {
var a = "";
(e === void 0 || typeof e == "object" && e !== null && Object.keys(e).length === 0) && (a += " You likely forgot to export your component from the file it's defined in, or you might have mixed up default and named imports.");
var p = ar();
p ? a += p : a += Te();
var u;
e === null ? u = "null" : ee(e) ? u = "array" : e !== void 0 && e.$$typeof === S ? (u = "<" + (C(e.type) || "Unknown") + " />", a = " Did you accidentally export a JSX literal instead of a component?") : u = typeof e, d("React.jsx: type is invalid -- expected a string (for built-in components) or a class/function (for composite components) but got: %s.%s", u, a);
}
var c = nr(e, r, t, o, s);
if (c == null)
return c;
if (i) {
var b = r.children;
if (b !== void 0)
if (n)
if (ee(b)) {
for (var $ = 0; $ < b.length; $++)
Oe(b[$], e);
Object.freeze && Object.freeze(b);
} else
d("React.jsx: Static children should always be an array. You are likely explicitly calling React.jsxs or React.jsxDEV. Use the Babel transform instead.");
else
Oe(b, e);
}
if (W.call(r, "key")) {
var F = C(e), m = Object.keys(r).filter(function(vr) {
return vr !== "key";
}), ae = m.length > 0 ? "{key: someKey, " + m.join(": ..., ") + ": ...}" : "{key: someKey}";
if (!Ce[F + ae]) {
var dr = m.length > 0 ? "{" + m.join(": ..., ") + ": ...}" : "{}";
d(`A props object containing a "key" prop is being spread into JSX:
let props = %s;
<%s {...props} />
React keys must be passed directly to JSX without using spread:
let props = %s;
<%s key={someKey} {...props} />`, ae, F, dr, F), Ce[F + ae] = !0;
}
}
return e === j ? sr(c) : or(c), c;
}
}
function lr(e, r, t) {
return Se(e, r, t, !0);
}
function ur(e, r, t) {
return Se(e, r, t, !1);
}
var cr = ur, fr = lr;
L.Fragment = j, L.jsx = cr, L.jsxs = fr;
}()), L;
}
var De;
function mr() {
return De || (De = 1, process.env.NODE_ENV === "production" ? J.exports = pr() : J.exports = hr()), J.exports;
}
var l = mr();
const gr = (g) => l.jsx("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 -960 960 960", width: "100px", height: "100px", fill: "blue", ...g, children: l.jsx("path", { d: "M480-320q75 0 127.5-52.5T660-500q0-75-52.5-127.5T480-680q-75 0-127.5 52.5T300-500q0 75 52.5 127.5T480-320Zm0-72q-45 0-76.5-31.5T372-500q0-45 31.5-76.5T480-608q45 0 76.5 31.5T588-500q0 45-31.5 76.5T480-392Zm0 192q-146 0-266-81.5T40-500q54-137 174-218.5T480-800q146 0 266 81.5T920-500q-54 137-174 218.5T480-200Zm0-300Zm0 220q113 0 207.5-59.5T832-500q-50-101-144.5-160.5T480-720q-113 0-207.5 59.5T128-500q50 101 144.5 160.5T480-280Z" }) }), br = (g) => l.jsx("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 -960 960 960", ...g, children: l.jsx("path", { d: "m644-428-58-58q9-47-27-88t-93-32l-58-58q17-8 34.5-12t37.5-4q75 0 127.5 52.5T660-500q0 20-4 37.5T644-428Zm128 126-58-56q38-29 67.5-63.5T832-500q-50-101-143.5-160.5T480-720q-29 0-57 4t-55 12l-62-62q41-17 84-25.5t90-8.5q151 0 269 83.5T920-500q-23 59-60.5 109.5T772-302Zm20 246L624-222q-35 11-70.5 16.5T480-200q-151 0-269-83.5T40-500q21-53 53-98.5t73-81.5L56-792l56-56 736 736-56 56ZM222-624q-29 26-53 57t-41 67q50 101 143.5 160.5T480-280q20 0 39-2.5t39-5.5l-36-38q-11 3-21 4.5t-21 1.5q-75 0-127.5-52.5T300-500q0-11 1.5-21t4.5-21l-84-82Zm319 93Zm-151 75Z" }) }), yr = (g) => l.jsx("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 -960 960 960", ...g, children: l.jsx("path", { d: "m256-200-56-56 224-224-224-224 56-56 224 224 224-224 56 56-224 224 224 224-56 56-224-224-224 224Z" }) }), Ae = [
l.jsx(gr, { width: "20px", height: "20px", fill: "#1F2937" }),
l.jsx(br, { width: "20px", height: "20px", fill: "#1F2937" })
];
function _r({ inputs: g, title: S, textButton: D, className: j, submit: P, children: k }) {
const [R, _] = Pe({}), [f, O] = Pe({}), v = (h) => {
const { name: E, value: I } = h.target;
_((x) => ({
...x,
[E]: I
}));
}, y = (h) => {
_((E) => ({
...E,
[h]: ""
}));
}, w = (h) => {
O((E) => ({
...E,
[h]: !f[h]
}));
}, A = (h) => {
h.preventDefault(), console.log({ values: R }), P && P({ values: R, event: h });
};
return l.jsxs(l.Fragment, { children: [l.jsxs("form", { className: ke("bg-[#285cbdce] min-w-[500px] flex flex-col justify-center items-center gap-5 p-5", j), onSubmit: A, children: [l.jsx("h1", { className: "text-[#222] dark:text-white text-3xl font-bold", children: S }), g == null ? void 0 : g.map((h, E) => {
const { label: I, clearable: x, toggleable: d, required: K, className: z, type: G, ...T } = h;
return l.jsx("div", { className: "w-full flex items-center justify-center", children: l.jsxs("div", { className: "w-[80%]", children: [I && l.jsx("label", { htmlFor: T.id, className: "inline-block mb-2 font-bold text-[#222]", children: I }), l.jsxs("div", { className: "relative w-full", children: [l.jsx("input", { ...T, type: d && f[T.id] ? "text" : G, className: ke(
"text-base p-2 rounded-lg outline-none w-full",
z
// Combina las clases pasadas a través de props
), onChange: v, value: R[T.name] ?? "", ...K && { required: !0 } }, E), l.jsxs("div", { className: "absolute right-0 top-0 flex justify-center items-center p-1 gap-1", children: [x && R[T.name] && l.jsx("button", { type: "button", onClick: () => y(T.name), className: "size-[30px] flex justify-center items-center rounded-full bg-[#ddd] outline-none", children: l.jsx(yr, { width: "20px", height: "20px", fill: "#1F2937" }) }), d && l.jsx("button", { type: "button", onClick: () => w(T.id), className: "size-[30px] flex justify-center items-center rounded-full bg-[#ddd]", children: f[T.id] ? Ae[1] : Ae[0] })] })] })] }, E) }, E);
}), D && l.jsx("button", { type: "submit", className: "p-4 bg-yellow-300 rounded-lg font-bold shadow-lg", children: D })] }), k && k] });
}
export {
_r as FormComponent
};
//# sourceMappingURL=index.es.js.map