UNPKG

@dariobrozzi/c64-design-system

Version:

A vintage Design System inspired on Commodore interface

369 lines (368 loc) 11 kB
import re from "react"; var T = { exports: {} }, p = {}; /** * @license React * react-jsx-runtime.production.js * * Copyright (c) Meta Platforms, Inc. and affiliates. * * This source code is licensed under the MIT license found in the * LICENSE file in the root directory of this source tree. */ var D; function te() { if (D) return p; D = 1; var o = Symbol.for("react.transitional.element"), c = Symbol.for("react.fragment"); function i(f, s, l) { var E = null; if (l !== void 0 && (E = "" + l), s.key !== void 0 && (E = "" + s.key), "key" in s) { l = {}; for (var b in s) b !== "key" && (l[b] = s[b]); } else l = s; return s = l.ref, { $$typeof: o, type: f, key: E, ref: s !== void 0 ? s : null, props: l }; } return p.Fragment = c, p.jsx = i, p.jsxs = i, p; } var R = {}; /** * @license React * react-jsx-runtime.development.js * * Copyright (c) Meta Platforms, Inc. and affiliates. * * This source code is licensed under the MIT license found in the * LICENSE file in the root directory of this source tree. */ var I; function ne() { return I || (I = 1, process.env.NODE_ENV !== "production" && function() { function o(e) { if (e == null) return null; if (typeof e == "function") return e.$$typeof === Q ? null : e.displayName || e.name || null; if (typeof e == "string") return e; switch (e) { case x: return "Fragment"; case q: return "Profiler"; case U: return "StrictMode"; case X: return "Suspense"; case B: return "SuspenseList"; case Z: return "Activity"; } if (typeof e == "object") switch (typeof e.tag == "number" && console.error( "Received an unexpected object in getComponentNameFromType(). This is likely a bug in React. Please file an issue." ), e.$$typeof) { case W: return "Portal"; case V: return (e.displayName || "Context") + ".Provider"; case J: return (e._context.displayName || "Context") + ".Consumer"; case G: var r = e.render; return e = e.displayName, e || (e = r.displayName || r.name || "", e = e !== "" ? "ForwardRef(" + e + ")" : "ForwardRef"), e; case H: return r = e.displayName || null, r !== null ? r : o(e.type) || "Memo"; case P: r = e._payload, e = e._init; try { return o(e(r)); } catch { } } return null; } function c(e) { return "" + e; } function i(e) { try { c(e); var r = !1; } catch { r = !0; } if (r) { r = console; var t = r.error, n = typeof Symbol == "function" && Symbol.toStringTag && e[Symbol.toStringTag] || e.constructor.name || "Object"; return t.call( r, "The provided key is an unsupported type %s. This value must be coerced to a string before using it here.", n ), c(e); } } function f(e) { if (e === x) return "<>"; if (typeof e == "object" && e !== null && e.$$typeof === P) return "<...>"; try { var r = o(e); return r ? "<" + r + ">" : "<...>"; } catch { return "<...>"; } } function s() { var e = k.A; return e === null ? null : e.getOwner(); } function l() { return Error("react-stack-top-frame"); } function E(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 b(e, r) { function t() { N || (N = !0, console.error( "%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://react.dev/link/special-props)", r )); } t.isReactWarning = !0, Object.defineProperty(e, "key", { get: t, configurable: !0 }); } function L() { var e = o(this.type); return C[e] || (C[e] = !0, console.error( "Accessing element.ref was removed in React 19. ref is now a regular prop. It will be removed from the JSX Element type in a future release." )), e = this.props.ref, e !== void 0 ? e : null; } function M(e, r, t, n, d, u, y, h) { return t = u.ref, e = { $$typeof: S, type: e, key: r, props: u, _owner: d }, (t !== void 0 ? t : null) !== null ? Object.defineProperty(e, "ref", { enumerable: !1, get: L }) : Object.defineProperty(e, "ref", { enumerable: !1, value: null }), e._store = {}, Object.defineProperty(e._store, "validated", { configurable: !1, enumerable: !1, writable: !0, value: 0 }), Object.defineProperty(e, "_debugInfo", { configurable: !1, enumerable: !1, writable: !0, value: null }), Object.defineProperty(e, "_debugStack", { configurable: !1, enumerable: !1, writable: !0, value: y }), Object.defineProperty(e, "_debugTask", { configurable: !1, enumerable: !1, writable: !0, value: h }), Object.freeze && (Object.freeze(e.props), Object.freeze(e)), e; } function A(e, r, t, n, d, u, y, h) { var a = r.children; if (a !== void 0) if (n) if (K(a)) { for (n = 0; n < a.length; n++) O(a[n]); Object.freeze && Object.freeze(a); } else console.error( "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 O(a); if (w.call(r, "key")) { a = o(e); var v = Object.keys(r).filter(function(ee) { return ee !== "key"; }); n = 0 < v.length ? "{key: someKey, " + v.join(": ..., ") + ": ...}" : "{key: someKey}", $[a + n] || (v = 0 < v.length ? "{" + v.join(": ..., ") + ": ...}" : "{}", console.error( `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} />`, n, a, v, a ), $[a + n] = !0); } if (a = null, t !== void 0 && (i(t), a = "" + t), E(r) && (i(r.key), a = "" + r.key), "key" in r) { t = {}; for (var j in r) j !== "key" && (t[j] = r[j]); } else t = r; return a && b( t, typeof e == "function" ? e.displayName || e.name || "Unknown" : e ), M( e, a, u, d, s(), t, y, h ); } function O(e) { typeof e == "object" && e !== null && e.$$typeof === S && e._store && (e._store.validated = 1); } var _ = re, S = Symbol.for("react.transitional.element"), W = Symbol.for("react.portal"), x = Symbol.for("react.fragment"), U = Symbol.for("react.strict_mode"), q = Symbol.for("react.profiler"), J = Symbol.for("react.consumer"), V = Symbol.for("react.context"), G = Symbol.for("react.forward_ref"), X = Symbol.for("react.suspense"), B = Symbol.for("react.suspense_list"), H = Symbol.for("react.memo"), P = Symbol.for("react.lazy"), Z = Symbol.for("react.activity"), Q = Symbol.for("react.client.reference"), k = _.__CLIENT_INTERNALS_DO_NOT_USE_OR_WARN_USERS_THEY_CANNOT_UPGRADE, w = Object.prototype.hasOwnProperty, K = Array.isArray, g = console.createTask ? console.createTask : function() { return null; }; _ = { "react-stack-bottom-frame": function(e) { return e(); } }; var N, C = {}, Y = _["react-stack-bottom-frame"].bind( _, l )(), F = g(f(l)), $ = {}; R.Fragment = x, R.jsx = function(e, r, t, n, d) { var u = 1e4 > k.recentlyCreatedOwnerStacks++; return A( e, r, t, !1, n, d, u ? Error("react-stack-top-frame") : Y, u ? g(f(e)) : F ); }, R.jsxs = function(e, r, t, n, d) { var u = 1e4 > k.recentlyCreatedOwnerStacks++; return A( e, r, t, !0, n, d, u ? Error("react-stack-top-frame") : Y, u ? g(f(e)) : F ); }; }()), R; } var z; function ae() { return z || (z = 1, process.env.NODE_ENV === "production" ? T.exports = te() : T.exports = ne()), T.exports; } var m = ae(); function se({ children: o, size: c = "base", level: i = 1, c64: f = !0, centered: s = !1 }) { return /* @__PURE__ */ m.jsx( "div", { role: "heading", "aria-level": i, style: { fontFamily: f ? "var(--text-font-c64-pro-name)" : "var(--text-font-system)", fontSize: `var(--text-size-${c})`, textAlign: s ? "center" : "start", paddingTop: "var(--spacing-4)", paddingBottom: "var(--spacing-4)" }, children: o } ); } function ie({ children: o, size: c = "medium", ...i }) { return /* @__PURE__ */ m.jsx( "a", { style: { fontFamily: "var(--text-font-system)", fontSize: `var(--text-size-${c})`, color: "var(--link-primary)", textDecoration: "underline", textDecorationColor: "var(--link-primary)" }, ...i, children: o } ); } function ce({ children: o, as: c = "p", size: i = "base", c64: f = !1, centered: s = !1 }) { return /* @__PURE__ */ m.jsx( c, { style: { fontFamily: f ? "var(--text-font-c64-pro-name)" : "var(--text-font-system)", fontSize: `var(--text-size-${i})`, textAlign: s ? "center" : "start", lineHeight: 1.5 }, children: o } ); } function le({ children: o, header: c, footer: i }) { return /* @__PURE__ */ m.jsx("div", { style: { background: "var(--background-secondary)", fontFamily: "var(--text-font-system)", height: "100vh", padding: "var(--spacing-10)" }, children: /* @__PURE__ */ m.jsxs("div", { style: { position: "relative", background: "var(--background-primary)", color: "var(--text-primary)", height: "calc(100vh - var(--spacing-10) * 2)", overflowY: "auto" }, children: [ c && /* @__PURE__ */ m.jsx("header", { children: c }), /* @__PURE__ */ m.jsx("main", { children: o }), i && /* @__PURE__ */ m.jsx("footer", { children: i }) ] }) }); } export { le as BasicLayout, se as Heading, ie as Link, ce as Text };