UNPKG

react-kit-us-abc

Version:

A beautiful, customizable React Button component built with TailwindCSS and TypeScript

668 lines (665 loc) 22.3 kB
import Ce from "react"; var N = { exports: {} }, $ = {}; /** * @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 xe; function cr() { if (xe) return $; xe = 1; var k = Ce, _ = Symbol.for("react.element"), D = Symbol.for("react.fragment"), y = Object.prototype.hasOwnProperty, m = k.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED.ReactCurrentOwner, T = { key: !0, ref: !0, __self: !0, __source: !0 }; function x(g, f, E) { var c, h = {}, w = null, W = null; E !== void 0 && (w = "" + E), f.key !== void 0 && (w = "" + f.key), f.ref !== void 0 && (W = f.ref); for (c in f) y.call(f, c) && !T.hasOwnProperty(c) && (h[c] = f[c]); if (g && g.defaultProps) for (c in f = g.defaultProps, f) h[c] === void 0 && (h[c] = f[c]); return { $$typeof: _, type: g, key: w, ref: W, props: h, _owner: m.current }; } return $.Fragment = D, $.jsx = x, $.jsxs = x, $; } var I = {}; /** * @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 we; function dr() { return we || (we = 1, process.env.NODE_ENV !== "production" && function() { var k = Ce, _ = Symbol.for("react.element"), D = Symbol.for("react.portal"), y = Symbol.for("react.fragment"), m = Symbol.for("react.strict_mode"), T = Symbol.for("react.profiler"), x = Symbol.for("react.provider"), g = Symbol.for("react.context"), f = Symbol.for("react.forward_ref"), E = Symbol.for("react.suspense"), c = Symbol.for("react.suspense_list"), h = Symbol.for("react.memo"), w = Symbol.for("react.lazy"), W = Symbol.for("react.offscreen"), Z = Symbol.iterator, Se = "@@iterator"; function Pe(e) { if (e === null || typeof e != "object") return null; var r = Z && e[Z] || e[Se]; return typeof r == "function" ? r : null; } var S = k.__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]; je("error", e, t); } } function je(e, r, t) { { var n = S.ReactDebugCurrentFrame, i = n.getStackAddendum(); i !== "" && (r += "%s", t = t.concat([i])); var u = t.map(function(o) { return String(o); }); u.unshift("Warning: " + r), Function.prototype.apply.call(console[e], console, u); } } var ke = !1, De = !1, Fe = !1, Ae = !1, $e = !1, Q; Q = Symbol.for("react.module.reference"); function Ie(e) { return !!(typeof e == "string" || typeof e == "function" || e === y || e === T || $e || e === m || e === E || e === c || Ae || e === W || ke || De || Fe || typeof e == "object" && e !== null && (e.$$typeof === w || e.$$typeof === h || e.$$typeof === x || e.$$typeof === g || 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 === Q || e.getModuleId !== void 0)); } function We(e, r, t) { var n = e.displayName; if (n) return n; var i = r.displayName || r.name || ""; return i !== "" ? t + "(" + i + ")" : t; } function ee(e) { return e.displayName || "Context"; } function R(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 y: return "Fragment"; case D: return "Portal"; case T: return "Profiler"; case m: return "StrictMode"; case E: return "Suspense"; case c: return "SuspenseList"; } if (typeof e == "object") switch (e.$$typeof) { case g: var r = e; return ee(r) + ".Consumer"; case x: var t = e; return ee(t._context) + ".Provider"; case f: return We(e, e.render, "ForwardRef"); case h: var n = e.displayName || null; return n !== null ? n : R(e.type) || "Memo"; case w: { var i = e, u = i._payload, o = i._init; try { return R(o(u)); } catch { return null; } } } return null; } var O = Object.assign, F = 0, re, te, ne, ae, oe, ie, ue; function se() { } se.__reactDisabledLog = !0; function Ye() { { if (F === 0) { re = console.log, te = console.info, ne = console.warn, ae = console.error, oe = console.group, ie = console.groupCollapsed, ue = console.groupEnd; var e = { configurable: !0, enumerable: !0, value: se, writable: !0 }; Object.defineProperties(console, { info: e, log: e, warn: e, error: e, group: e, groupCollapsed: e, groupEnd: e }); } F++; } } function Le() { { if (F--, F === 0) { var e = { configurable: !0, enumerable: !0, writable: !0 }; Object.defineProperties(console, { log: O({}, e, { value: re }), info: O({}, e, { value: te }), warn: O({}, e, { value: ne }), error: O({}, e, { value: ae }), group: O({}, e, { value: oe }), groupCollapsed: O({}, e, { value: ie }), groupEnd: O({}, e, { value: ue }) }); } F < 0 && d("disabledDepth fell below zero. This is a bug in React. Please file an issue."); } } var J = S.ReactCurrentDispatcher, q; function Y(e, r, t) { { if (q === void 0) try { throw Error(); } catch (i) { var n = i.stack.trim().match(/\n( *(at )?)/); q = n && n[1] || ""; } return ` ` + q + e; } } var B = !1, L; { var Ve = typeof WeakMap == "function" ? WeakMap : Map; L = new Ve(); } function le(e, r) { if (!e || B) return ""; { var t = L.get(e); if (t !== void 0) return t; } var n; B = !0; var i = Error.prepareStackTrace; Error.prepareStackTrace = void 0; var u; u = J.current, J.current = null, Ye(); try { if (r) { var o = function() { throw Error(); }; if (Object.defineProperty(o.prototype, "props", { set: function() { throw Error(); } }), typeof Reflect == "object" && Reflect.construct) { try { Reflect.construct(o, []); } catch (p) { n = p; } Reflect.construct(e, [], o); } else { try { o.call(); } catch (p) { n = p; } e.call(o.prototype); } } else { try { throw Error(); } catch (p) { n = p; } e(); } } catch (p) { if (p && n && typeof p.stack == "string") { for (var a = p.stack.split(` `), v = n.stack.split(` `), s = a.length - 1, l = v.length - 1; s >= 1 && l >= 0 && a[s] !== v[l]; ) l--; for (; s >= 1 && l >= 0; s--, l--) if (a[s] !== v[l]) { if (s !== 1 || l !== 1) do if (s--, l--, l < 0 || a[s] !== v[l]) { var b = ` ` + a[s].replace(" at new ", " at "); return e.displayName && b.includes("<anonymous>") && (b = b.replace("<anonymous>", e.displayName)), typeof e == "function" && L.set(e, b), b; } while (s >= 1 && l >= 0); break; } } } finally { B = !1, J.current = u, Le(), Error.prepareStackTrace = i; } var j = e ? e.displayName || e.name : "", C = j ? Y(j) : ""; return typeof e == "function" && L.set(e, C), C; } function Me(e, r, t) { return le(e, !1); } function Ne(e) { var r = e.prototype; return !!(r && r.isReactComponent); } function V(e, r, t) { if (e == null) return ""; if (typeof e == "function") return le(e, Ne(e)); if (typeof e == "string") return Y(e); switch (e) { case E: return Y("Suspense"); case c: return Y("SuspenseList"); } if (typeof e == "object") switch (e.$$typeof) { case f: return Me(e.render); case h: return V(e.type, r, t); case w: { var n = e, i = n._payload, u = n._init; try { return V(u(i), r, t); } catch { } } } return ""; } var A = Object.prototype.hasOwnProperty, fe = {}, ce = S.ReactDebugCurrentFrame; function M(e) { if (e) { var r = e._owner, t = V(e.type, e._source, r ? r.type : null); ce.setExtraStackFrame(t); } else ce.setExtraStackFrame(null); } function Ue(e, r, t, n, i) { { var u = Function.call.bind(A); for (var o in e) if (u(e, o)) { var a = void 0; try { if (typeof e[o] != "function") { var v = Error((n || "React class") + ": " + t + " type `" + o + "` is invalid; it must be a function, usually from the `prop-types` package, but received `" + typeof e[o] + "`.This often happens because of typos such as `PropTypes.function` instead of `PropTypes.func`."); throw v.name = "Invariant Violation", v; } a = e[o](r, o, n, t, null, "SECRET_DO_NOT_PASS_THIS_OR_YOU_WILL_BE_FIRED"); } catch (s) { a = s; } a && !(a instanceof Error) && (M(i), 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, o, typeof a), M(null)), a instanceof Error && !(a.message in fe) && (fe[a.message] = !0, M(i), d("Failed %s type: %s", t, a.message), M(null)); } } } var Je = Array.isArray; function K(e) { return Je(e); } function qe(e) { { var r = typeof Symbol == "function" && Symbol.toStringTag, t = r && e[Symbol.toStringTag] || e.constructor.name || "Object"; return t; } } function Be(e) { try { return de(e), !1; } catch { return !0; } } function de(e) { return "" + e; } function ve(e) { if (Be(e)) return d("The provided key is an unsupported type %s. This value must be coerced to a string before before using it here.", qe(e)), de(e); } var pe = S.ReactCurrentOwner, Ke = { key: !0, ref: !0, __self: !0, __source: !0 }, be, ge; function ze(e) { if (A.call(e, "ref")) { var r = Object.getOwnPropertyDescriptor(e, "ref").get; if (r && r.isReactWarning) return !1; } return e.ref !== void 0; } function Ge(e) { if (A.call(e, "key")) { var r = Object.getOwnPropertyDescriptor(e, "key").get; if (r && r.isReactWarning) return !1; } return e.key !== void 0; } function Xe(e, r) { typeof e.ref == "string" && pe.current; } function He(e, r) { { var t = function() { be || (be = !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 Ze(e, r) { { var t = function() { ge || (ge = !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 Qe = function(e, r, t, n, i, u, o) { var a = { // This tag allows us to uniquely identify this as a React Element $$typeof: _, // Built-in properties that belong on the element type: e, key: r, ref: t, props: o, // Record the component responsible for creating this element. _owner: u }; 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: i }), Object.freeze && (Object.freeze(a.props), Object.freeze(a)), a; }; function er(e, r, t, n, i) { { var u, o = {}, a = null, v = null; t !== void 0 && (ve(t), a = "" + t), Ge(r) && (ve(r.key), a = "" + r.key), ze(r) && (v = r.ref, Xe(r, i)); for (u in r) A.call(r, u) && !Ke.hasOwnProperty(u) && (o[u] = r[u]); if (e && e.defaultProps) { var s = e.defaultProps; for (u in s) o[u] === void 0 && (o[u] = s[u]); } if (a || v) { var l = typeof e == "function" ? e.displayName || e.name || "Unknown" : e; a && He(o, l), v && Ze(o, l); } return Qe(e, a, v, i, n, pe.current, o); } } var z = S.ReactCurrentOwner, he = S.ReactDebugCurrentFrame; function P(e) { if (e) { var r = e._owner, t = V(e.type, e._source, r ? r.type : null); he.setExtraStackFrame(t); } else he.setExtraStackFrame(null); } var G; G = !1; function X(e) { return typeof e == "object" && e !== null && e.$$typeof === _; } function ye() { { if (z.current) { var e = R(z.current.type); if (e) return ` Check the render method of \`` + e + "`."; } return ""; } } function rr(e) { return ""; } var me = {}; function tr(e) { { var r = ye(); 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 Ee(e, r) { { if (!e._store || e._store.validated || e.key != null) return; e._store.validated = !0; var t = tr(r); if (me[t]) return; me[t] = !0; var n = ""; e && e._owner && e._owner !== z.current && (n = " It was passed a child from " + R(e._owner.type) + "."), P(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), P(null); } } function Re(e, r) { { if (typeof e != "object") return; if (K(e)) for (var t = 0; t < e.length; t++) { var n = e[t]; X(n) && Ee(n, r); } else if (X(e)) e._store && (e._store.validated = !0); else if (e) { var i = Pe(e); if (typeof i == "function" && i !== e.entries) for (var u = i.call(e), o; !(o = u.next()).done; ) X(o.value) && Ee(o.value, r); } } } function nr(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 === h)) t = r.propTypes; else return; if (t) { var n = R(r); Ue(t, e.props, "prop", n, e); } else if (r.PropTypes !== void 0 && !G) { G = !0; var i = R(r); d("Component %s declared `PropTypes` instead of `propTypes`. Did you misspell the property assignment?", i || "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 ar(e) { { for (var r = Object.keys(e.props), t = 0; t < r.length; t++) { var n = r[t]; if (n !== "children" && n !== "key") { P(e), d("Invalid prop `%s` supplied to `React.Fragment`. React.Fragment can only have `key` and `children` props.", n), P(null); break; } } e.ref !== null && (P(e), d("Invalid attribute `ref` supplied to `React.Fragment`."), P(null)); } } var _e = {}; function Te(e, r, t, n, i, u) { { var o = Ie(e); if (!o) { 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 v = rr(); v ? a += v : a += ye(); var s; e === null ? s = "null" : K(e) ? s = "array" : e !== void 0 && e.$$typeof === _ ? (s = "<" + (R(e.type) || "Unknown") + " />", a = " Did you accidentally export a JSX literal instead of a component?") : s = 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", s, a); } var l = er(e, r, t, i, u); if (l == null) return l; if (o) { var b = r.children; if (b !== void 0) if (n) if (K(b)) { for (var j = 0; j < b.length; j++) Re(b[j], 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 Re(b, e); } if (A.call(r, "key")) { var C = R(e), p = Object.keys(r).filter(function(fr) { return fr !== "key"; }), H = p.length > 0 ? "{key: someKey, " + p.join(": ..., ") + ": ...}" : "{key: someKey}"; if (!_e[C + H]) { var lr = p.length > 0 ? "{" + p.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} />`, H, C, lr, C), _e[C + H] = !0; } } return e === y ? ar(l) : nr(l), l; } } function or(e, r, t) { return Te(e, r, t, !0); } function ir(e, r, t) { return Te(e, r, t, !1); } var ur = ir, sr = or; I.Fragment = y, I.jsx = ur, I.jsxs = sr; }()), I; } var Oe; function vr() { return Oe || (Oe = 1, process.env.NODE_ENV === "production" ? N.exports = cr() : N.exports = dr()), N.exports; } var U = vr(); const pr = { primary: "bg-blue-500 hover:bg-blue-600 text-white", secondary: "bg-gray-500 hover:bg-gray-600 text-white", success: "bg-green-500 hover:bg-green-600 text-white", danger: "bg-red-500 hover:bg-red-600 text-white", warning: "bg-yellow-500 hover:bg-yellow-600 text-white", outline: "bg-transparent border border-blue-500 text-blue-500 hover:bg-blue-500 hover:text-white" }, br = { sm: "px-3 py-1.5 text-sm", md: "px-4 py-2 text-base", lg: "px-6 py-3 text-lg" }, hr = ({ children: k, variant: _ = "primary", size: D = "md", className: y = "", loading: m = !1, disabled: T, ...x }) => { const g = "rounded font-medium transition-colors duration-200 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-blue-500", f = pr[_], E = br[D], c = T || m ? "opacity-50 cursor-not-allowed" : ""; return /* @__PURE__ */ U.jsx( "button", { className: `${g} ${f} ${E} ${c} ${y}`, disabled: T || m, ...x, children: m ? /* @__PURE__ */ U.jsxs("div", { className: "flex items-center gap-2", children: [ /* @__PURE__ */ U.jsx("div", { className: "w-4 h-4 border-2 border-current border-t-transparent rounded-full animate-spin" }), /* @__PURE__ */ U.jsx("span", { children: "Loading..." }) ] }) : k } ); }; export { hr as Button };