@arcanejs/toolkit 0.1.1 → 0.2.1

package/dist/frontend.js

@@ -511,7 +511,7 @@
             }
             return element;
           };
-          function createElement11(type, config, children) {
+          function createElement2(type, config, children) {
             var propName;
             var props = {};
             var key = null;
@@ -785,7 +785,7 @@
             }
             return children;
           }
-          function createContext4(defaultValue) {
+          function createContext2(defaultValue) {
             var context = {
               $$typeof: REACT_CONTEXT_TYPE,
               // As a workaround to support multiple concurrent renderers, we categorize
@@ -1071,7 +1071,7 @@
             }
             return dispatcher;
           }
-          function useContext5(Context) {
+          function useContext2(Context) {
             var dispatcher = resolveDispatcher();
             {
               if (Context._context !== void 0) {
@@ -1085,7 +1085,7 @@
             }
             return dispatcher.useContext(Context);
           }
-          function useState8(initialState) {
+          function useState5(initialState) {
             var dispatcher = resolveDispatcher();
             return dispatcher.useState(initialState);
           }
@@ -1093,11 +1093,11 @@
             var dispatcher = resolveDispatcher();
             return dispatcher.useReducer(reducer, initialArg, init);
           }
-          function useRef3(initialValue) {
+          function useRef2(initialValue) {
             var dispatcher = resolveDispatcher();
             return dispatcher.useRef(initialValue);
           }
-          function useEffect3(create, deps) {
+          function useEffect4(create, deps) {
             var dispatcher = resolveDispatcher();
             return dispatcher.useEffect(create, deps);
           }
@@ -1610,7 +1610,7 @@
                 error("React.createElement: type is invalid -- expected a string (for built-in components) or a class/function (for composite components) but got: %s.%s", typeString, info);
               }
             }
-            var element = createElement11.apply(this, arguments);
+            var element = createElement2.apply(this, arguments);
             if (element == null) {
               return element;
             }
@@ -1866,7 +1866,7 @@
           exports.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED = ReactSharedInternals;
           exports.act = act;
           exports.cloneElement = cloneElement$1;
-          exports.createContext = createContext4;
+          exports.createContext = createContext2;
           exports.createElement = createElement$1;
           exports.createFactory = createFactory;
           exports.createRef = createRef;
@@ -1877,18 +1877,18 @@
           exports.startTransition = startTransition;
           exports.unstable_act = act;
           exports.useCallback = useCallback;
-          exports.useContext = useContext5;
+          exports.useContext = useContext2;
           exports.useDebugValue = useDebugValue;
           exports.useDeferredValue = useDeferredValue;
-          exports.useEffect = useEffect3;
+          exports.useEffect = useEffect4;
           exports.useId = useId;
           exports.useImperativeHandle = useImperativeHandle;
           exports.useInsertionEffect = useInsertionEffect;
           exports.useLayoutEffect = useLayoutEffect;
           exports.useMemo = useMemo2;
           exports.useReducer = useReducer;
-          exports.useRef = useRef3;
-          exports.useState = useState8;
+          exports.useRef = useRef2;
+          exports.useState = useState5;
           exports.useSyncExternalStore = useSyncExternalStore;
           exports.useTransition = useTransition;
           exports.version = ReactVersion;
@@ -2384,9 +2384,9 @@
           if (typeof __REACT_DEVTOOLS_GLOBAL_HOOK__ !== "undefined" && typeof __REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStart === "function") {
             __REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStart(new Error());
           }
-          var React13 = require_react();
+          var React9 = require_react();
           var Scheduler = require_scheduler();
-          var ReactSharedInternals = React13.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED;
+          var ReactSharedInternals = React9.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED;
           var suppressWarning = false;
           function setSuppressWarning(newSuppressWarning) {
             {
@@ -2428,7 +2428,7 @@
               Function.prototype.apply.call(console[level], console, argsWithFormat);
             }
           }
-          var FunctionComponent4 = 0;
+          var FunctionComponent = 0;
           var ClassComponent = 1;
           var IndeterminateComponent = 2;
           var HostRoot = 3;
@@ -3475,7 +3475,7 @@
                 return describeBuiltInComponentFrame("Suspense");
               case SuspenseListComponent:
                 return describeBuiltInComponentFrame("SuspenseList");
-              case FunctionComponent4:
+              case FunctionComponent:
               case IndeterminateComponent:
               case SimpleMemoComponent:
                 return describeFunctionComponentFrame(fiber.type);
@@ -3623,7 +3623,7 @@
                 return "TracingMarker";
               // The display name for this tags come from the user-provided type:
               case ClassComponent:
-              case FunctionComponent4:
+              case FunctionComponent:
               case IncompleteClassComponent:
               case IndeterminateComponent:
               case MemoComponent:
@@ -3993,7 +3993,7 @@
             {
               if (props.value == null) {
                 if (typeof props.children === "object" && props.children !== null) {
-                  React13.Children.forEach(props.children, function(child) {
+                  React9.Children.forEach(props.children, function(child) {
                     if (child == null) {
                       return;
                     }
@@ -7723,7 +7723,7 @@
             defaultPrevented: 0,
             isTrusted: 0
           };
-          var SyntheticEvent2 = createSyntheticEvent(EventInterface);
+          var SyntheticEvent = createSyntheticEvent(EventInterface);
           var UIEventInterface = assign2({}, EventInterface, {
             view: 0,
             detail: 0
@@ -8198,7 +8198,7 @@
             enqueueStateRestore(target);
             var listeners = accumulateTwoPhaseListeners(inst, "onChange");
             if (listeners.length > 0) {
-              var event = new SyntheticEvent2("onChange", "change", null, nativeEvent, target);
+              var event = new SyntheticEvent("onChange", "change", null, nativeEvent, target);
               dispatchQueue.push({
                 event,
                 listeners
@@ -8701,7 +8701,7 @@
               lastSelection = currentSelection;
               var listeners = accumulateTwoPhaseListeners(activeElementInst$1, "onSelect");
               if (listeners.length > 0) {
-                var event = new SyntheticEvent2("onSelect", "select", null, nativeEvent, nativeEventTarget);
+                var event = new SyntheticEvent("onSelect", "select", null, nativeEvent, nativeEventTarget);
                 dispatchQueue.push({
                   event,
                   listeners
@@ -8826,7 +8826,7 @@
             if (reactName === void 0) {
               return;
             }
-            var SyntheticEventCtor = SyntheticEvent2;
+            var SyntheticEventCtor = SyntheticEvent;
             var reactEventType = domEventName;
             switch (domEventName) {
               case "keypress":
@@ -9417,7 +9417,7 @@
               }
             }
           }
-          function createElement11(type, props, rootContainerElement, parentNamespace) {
+          function createElement2(type, props, rootContainerElement, parentNamespace) {
             var isCustomComponentTag;
             var ownerDocument = getOwnerDocumentFromRootContainer(rootContainerElement);
             var domElement;
@@ -10287,7 +10287,7 @@
               }
               parentNamespace = hostContextDev.namespace;
             }
-            var domElement = createElement11(type, props, rootContainerInstance, parentNamespace);
+            var domElement = createElement2(type, props, rootContainerInstance, parentNamespace);
             precacheFiberNode(internalInstanceHandle, domElement);
             updateFiberProps(domElement, props);
             return domElement;
@@ -16087,7 +16087,7 @@
           }
           function resetSuspendedComponent(sourceFiber, rootRenderLanes) {
             var tag = sourceFiber.tag;
-            if ((sourceFiber.mode & ConcurrentMode) === NoMode && (tag === FunctionComponent4 || tag === ForwardRef || tag === SimpleMemoComponent)) {
+            if ((sourceFiber.mode & ConcurrentMode) === NoMode && (tag === FunctionComponent || tag === ForwardRef || tag === SimpleMemoComponent)) {
               var currentSource = sourceFiber.alternate;
               if (currentSource) {
                 sourceFiber.updateQueue = currentSource.updateQueue;
@@ -16780,7 +16780,7 @@
             var resolvedProps = resolveDefaultProps(Component, props);
             var child;
             switch (resolvedTag) {
-              case FunctionComponent4: {
+              case FunctionComponent: {
                 {
                   validateFunctionComponentInDev(workInProgress2, Component);
                   workInProgress2.type = Component = resolveFunctionForHotReloading(Component);
@@ -16923,7 +16923,7 @@
               mountClassInstance(workInProgress2, Component, props, renderLanes2);
               return finishClassComponent(null, workInProgress2, Component, true, hasContext, renderLanes2);
             } else {
-              workInProgress2.tag = FunctionComponent4;
+              workInProgress2.tag = FunctionComponent;
               {
                 if (workInProgress2.mode & StrictLegacyMode) {
                   setIsStrictModeForDevtools(true);
@@ -17872,7 +17872,7 @@
                 var elementType = workInProgress2.elementType;
                 return mountLazyComponent(current2, workInProgress2, elementType, renderLanes2);
               }
-              case FunctionComponent4: {
+              case FunctionComponent: {
                 var Component = workInProgress2.type;
                 var unresolvedProps = workInProgress2.pendingProps;
                 var resolvedProps = workInProgress2.elementType === Component ? unresolvedProps : resolveDefaultProps(Component, unresolvedProps);
@@ -18170,7 +18170,7 @@
               case IndeterminateComponent:
               case LazyComponent:
               case SimpleMemoComponent:
-              case FunctionComponent4:
+              case FunctionComponent:
               case ForwardRef:
               case Fragment2:
               case Mode:
@@ -18753,7 +18753,7 @@
             if ((flags & Snapshot) !== NoFlags) {
               setCurrentFiber(finishedWork);
               switch (finishedWork.tag) {
-                case FunctionComponent4:
+                case FunctionComponent:
                 case ForwardRef:
                 case SimpleMemoComponent: {
                   break;
@@ -18947,7 +18947,7 @@
           function commitLayoutEffectOnFiber(finishedRoot, current2, finishedWork, committedLanes) {
             if ((finishedWork.flags & LayoutMask) !== NoFlags) {
               switch (finishedWork.tag) {
-                case FunctionComponent4:
+                case FunctionComponent:
                 case ForwardRef:
                 case SimpleMemoComponent: {
                   if (!offscreenSubtreeWasHidden) {
@@ -19127,7 +19127,7 @@
           }
           function reappearLayoutEffectsOnFiber(node2) {
             switch (node2.tag) {
-              case FunctionComponent4:
+              case FunctionComponent:
               case ForwardRef:
               case SimpleMemoComponent: {
                 if (node2.mode & ProfileMode) {
@@ -19494,7 +19494,7 @@
                 }
                 return;
               }
-              case FunctionComponent4:
+              case FunctionComponent:
               case ForwardRef:
               case MemoComponent:
               case SimpleMemoComponent: {
@@ -19649,7 +19649,7 @@
             var current2 = finishedWork.alternate;
             var flags = finishedWork.flags;
             switch (finishedWork.tag) {
-              case FunctionComponent4:
+              case FunctionComponent:
               case ForwardRef:
               case MemoComponent:
               case SimpleMemoComponent: {
@@ -19958,7 +19958,7 @@
               var fiber = nextEffect;
               var firstChild = fiber.child;
               switch (fiber.tag) {
-                case FunctionComponent4:
+                case FunctionComponent:
                 case ForwardRef:
                 case MemoComponent:
                 case SimpleMemoComponent: {
@@ -20104,7 +20104,7 @@
           }
           function commitPassiveMountOnFiber(finishedRoot, finishedWork, committedLanes, committedTransitions) {
             switch (finishedWork.tag) {
-              case FunctionComponent4:
+              case FunctionComponent:
               case ForwardRef:
               case SimpleMemoComponent: {
                 if (finishedWork.mode & ProfileMode) {
@@ -20181,7 +20181,7 @@
           }
           function commitPassiveUnmountOnFiber(finishedWork) {
             switch (finishedWork.tag) {
-              case FunctionComponent4:
+              case FunctionComponent:
               case ForwardRef:
               case SimpleMemoComponent: {
                 if (finishedWork.mode & ProfileMode) {
@@ -20232,7 +20232,7 @@
           }
           function commitPassiveUnmountInsideDeletedTreeOnFiber(current2, nearestMountedAncestor) {
             switch (current2.tag) {
-              case FunctionComponent4:
+              case FunctionComponent:
               case ForwardRef:
               case SimpleMemoComponent: {
                 if (current2.mode & ProfileMode) {
@@ -20249,7 +20249,7 @@
           function invokeLayoutEffectMountInDEV(fiber) {
             {
               switch (fiber.tag) {
-                case FunctionComponent4:
+                case FunctionComponent:
                 case ForwardRef:
                 case SimpleMemoComponent: {
                   try {
@@ -20274,7 +20274,7 @@
           function invokePassiveEffectMountInDEV(fiber) {
             {
               switch (fiber.tag) {
-                case FunctionComponent4:
+                case FunctionComponent:
                 case ForwardRef:
                 case SimpleMemoComponent: {
                   try {
@@ -20290,7 +20290,7 @@
           function invokeLayoutEffectUnmountInDEV(fiber) {
             {
               switch (fiber.tag) {
-                case FunctionComponent4:
+                case FunctionComponent:
                 case ForwardRef:
                 case SimpleMemoComponent: {
                   try {
@@ -20313,7 +20313,7 @@
           function invokePassiveEffectUnmountInDEV(fiber) {
             {
               switch (fiber.tag) {
-                case FunctionComponent4:
+                case FunctionComponent:
                 case ForwardRef:
                 case SimpleMemoComponent: {
                   try {
@@ -21679,7 +21679,7 @@
                 return;
               }
               var tag = fiber.tag;
-              if (tag !== IndeterminateComponent && tag !== HostRoot && tag !== ClassComponent && tag !== FunctionComponent4 && tag !== ForwardRef && tag !== MemoComponent && tag !== SimpleMemoComponent) {
+              if (tag !== IndeterminateComponent && tag !== HostRoot && tag !== ClassComponent && tag !== FunctionComponent && tag !== ForwardRef && tag !== MemoComponent && tag !== SimpleMemoComponent) {
                 return;
               }
               var componentName = getComponentNameFromFiber(fiber) || "ReactComponent";
@@ -21742,7 +21742,7 @@
             {
               if (isRendering && !getIsUpdatingOpaqueValueInRenderPhaseInDEV()) {
                 switch (fiber.tag) {
-                  case FunctionComponent4:
+                  case FunctionComponent:
                   case ForwardRef:
                   case SimpleMemoComponent: {
                     var renderingComponentName = workInProgress && getComponentNameFromFiber(workInProgress) || "Unknown";
@@ -21809,7 +21809,7 @@
                 if (executionContext !== NoContext) {
                   return;
                 }
-                if (fiber.tag !== FunctionComponent4 && fiber.tag !== ForwardRef && fiber.tag !== SimpleMemoComponent) {
+                if (fiber.tag !== FunctionComponent && fiber.tag !== ForwardRef && fiber.tag !== SimpleMemoComponent) {
                   return;
                 }
               }
@@ -21903,7 +21903,7 @@
                   }
                   break;
                 }
-                case FunctionComponent4: {
+                case FunctionComponent: {
                   if (typeof nextType === "function") {
                     needsCompareFamilies = true;
                   } else if ($$typeofNextType === REACT_LAZY_TYPE) {
@@ -21982,7 +21982,7 @@
               var alternate = fiber.alternate, child = fiber.child, sibling = fiber.sibling, tag = fiber.tag, type = fiber.type;
               var candidateType = null;
               switch (tag) {
-                case FunctionComponent4:
+                case FunctionComponent:
                 case SimpleMemoComponent:
                 case ClassComponent:
                   candidateType = type;
@@ -22047,7 +22047,7 @@
               var child = fiber.child, sibling = fiber.sibling, tag = fiber.tag, type = fiber.type;
               var candidateType = null;
               switch (tag) {
-                case FunctionComponent4:
+                case FunctionComponent:
                 case SimpleMemoComponent:
                 case ClassComponent:
                   candidateType = type;
@@ -22194,7 +22194,7 @@
           }
           function resolveLazyComponentTag(Component) {
             if (typeof Component === "function") {
-              return shouldConstruct$1(Component) ? ClassComponent : FunctionComponent4;
+              return shouldConstruct$1(Component) ? ClassComponent : FunctionComponent;
             } else if (Component !== void 0 && Component !== null) {
               var $$typeof = Component.$$typeof;
               if ($$typeof === REACT_FORWARD_REF_TYPE) {
@@ -22254,7 +22254,7 @@
               workInProgress2._debugNeedsRemount = current2._debugNeedsRemount;
               switch (workInProgress2.tag) {
                 case IndeterminateComponent:
-                case FunctionComponent4:
+                case FunctionComponent:
                 case SimpleMemoComponent:
                   workInProgress2.type = resolveFunctionForHotReloading(current2.type);
                   break;
@@ -23619,9 +23619,986 @@
     }
   });
 
+  // ../../node_modules/.pnpm/react@18.3.1/node_modules/react/cjs/react-jsx-runtime.development.js
+  var require_react_jsx_runtime_development = __commonJS({
+    "../../node_modules/.pnpm/react@18.3.1/node_modules/react/cjs/react-jsx-runtime.development.js"(exports) {
+      "use strict";
+      if (true) {
+        (function() {
+          "use strict";
+          var React9 = require_react();
+          var REACT_ELEMENT_TYPE = Symbol.for("react.element");
+          var REACT_PORTAL_TYPE = Symbol.for("react.portal");
+          var REACT_FRAGMENT_TYPE = Symbol.for("react.fragment");
+          var REACT_STRICT_MODE_TYPE = Symbol.for("react.strict_mode");
+          var REACT_PROFILER_TYPE = Symbol.for("react.profiler");
+          var REACT_PROVIDER_TYPE = Symbol.for("react.provider");
+          var REACT_CONTEXT_TYPE = Symbol.for("react.context");
+          var REACT_FORWARD_REF_TYPE = Symbol.for("react.forward_ref");
+          var REACT_SUSPENSE_TYPE = Symbol.for("react.suspense");
+          var REACT_SUSPENSE_LIST_TYPE = Symbol.for("react.suspense_list");
+          var REACT_MEMO_TYPE = Symbol.for("react.memo");
+          var REACT_LAZY_TYPE = Symbol.for("react.lazy");
+          var REACT_OFFSCREEN_TYPE = Symbol.for("react.offscreen");
+          var MAYBE_ITERATOR_SYMBOL = Symbol.iterator;
+          var FAUX_ITERATOR_SYMBOL = "@@iterator";
+          function getIteratorFn(maybeIterable) {
+            if (maybeIterable === null || typeof maybeIterable !== "object") {
+              return null;
+            }
+            var maybeIterator = MAYBE_ITERATOR_SYMBOL && maybeIterable[MAYBE_ITERATOR_SYMBOL] || maybeIterable[FAUX_ITERATOR_SYMBOL];
+            if (typeof maybeIterator === "function") {
+              return maybeIterator;
+            }
+            return null;
+          }
+          var ReactSharedInternals = React9.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED;
+          function error(format) {
+            {
+              {
+                for (var _len2 = arguments.length, args = new Array(_len2 > 1 ? _len2 - 1 : 0), _key2 = 1; _key2 < _len2; _key2++) {
+                  args[_key2 - 1] = arguments[_key2];
+                }
+                printWarning("error", format, args);
+              }
+            }
+          }
+          function printWarning(level, format, args) {
+            {
+              var ReactDebugCurrentFrame2 = ReactSharedInternals.ReactDebugCurrentFrame;
+              var stack = ReactDebugCurrentFrame2.getStackAddendum();
+              if (stack !== "") {
+                format += "%s";
+                args = args.concat([stack]);
+              }
+              var argsWithFormat = args.map(function(item) {
+                return String(item);
+              });
+              argsWithFormat.unshift("Warning: " + format);
+              Function.prototype.apply.call(console[level], console, argsWithFormat);
+            }
+          }
+          var enableScopeAPI = false;
+          var enableCacheElement = false;
+          var enableTransitionTracing = false;
+          var enableLegacyHidden = false;
+          var enableDebugTracing = false;
+          var REACT_MODULE_REFERENCE;
+          {
+            REACT_MODULE_REFERENCE = Symbol.for("react.module.reference");
+          }
+          function isValidElementType(type) {
+            if (typeof type === "string" || typeof type === "function") {
+              return true;
+            }
+            if (type === REACT_FRAGMENT_TYPE || type === REACT_PROFILER_TYPE || enableDebugTracing || type === REACT_STRICT_MODE_TYPE || type === REACT_SUSPENSE_TYPE || type === REACT_SUSPENSE_LIST_TYPE || enableLegacyHidden || type === REACT_OFFSCREEN_TYPE || enableScopeAPI || enableCacheElement || enableTransitionTracing) {
+              return true;
+            }
+            if (typeof type === "object" && type !== null) {
+              if (type.$$typeof === REACT_LAZY_TYPE || type.$$typeof === REACT_MEMO_TYPE || type.$$typeof === REACT_PROVIDER_TYPE || type.$$typeof === REACT_CONTEXT_TYPE || type.$$typeof === REACT_FORWARD_REF_TYPE || // 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.
+              type.$$typeof === REACT_MODULE_REFERENCE || type.getModuleId !== void 0) {
+                return true;
+              }
+            }
+            return false;
+          }
+          function getWrappedName(outerType, innerType, wrapperName) {
+            var displayName = outerType.displayName;
+            if (displayName) {
+              return displayName;
+            }
+            var functionName = innerType.displayName || innerType.name || "";
+            return functionName !== "" ? wrapperName + "(" + functionName + ")" : wrapperName;
+          }
+          function getContextName(type) {
+            return type.displayName || "Context";
+          }
+          function getComponentNameFromType(type) {
+            if (type == null) {
+              return null;
+            }
+            {
+              if (typeof type.tag === "number") {
+                error("Received an unexpected object in getComponentNameFromType(). This is likely a bug in React. Please file an issue.");
+              }
+            }
+            if (typeof type === "function") {
+              return type.displayName || type.name || null;
+            }
+            if (typeof type === "string") {
+              return type;
+            }
+            switch (type) {
+              case REACT_FRAGMENT_TYPE:
+                return "Fragment";
+              case REACT_PORTAL_TYPE:
+                return "Portal";
+              case REACT_PROFILER_TYPE:
+                return "Profiler";
+              case REACT_STRICT_MODE_TYPE:
+                return "StrictMode";
+              case REACT_SUSPENSE_TYPE:
+                return "Suspense";
+              case REACT_SUSPENSE_LIST_TYPE:
+                return "SuspenseList";
+            }
+            if (typeof type === "object") {
+              switch (type.$$typeof) {
+                case REACT_CONTEXT_TYPE:
+                  var context = type;
+                  return getContextName(context) + ".Consumer";
+                case REACT_PROVIDER_TYPE:
+                  var provider = type;
+                  return getContextName(provider._context) + ".Provider";
+                case REACT_FORWARD_REF_TYPE:
+                  return getWrappedName(type, type.render, "ForwardRef");
+                case REACT_MEMO_TYPE:
+                  var outerName = type.displayName || null;
+                  if (outerName !== null) {
+                    return outerName;
+                  }
+                  return getComponentNameFromType(type.type) || "Memo";
+                case REACT_LAZY_TYPE: {
+                  var lazyComponent = type;
+                  var payload = lazyComponent._payload;
+                  var init = lazyComponent._init;
+                  try {
+                    return getComponentNameFromType(init(payload));
+                  } catch (x2) {
+                    return null;
+                  }
+                }
+              }
+            }
+            return null;
+          }
+          var assign2 = Object.assign;
+          var disabledDepth = 0;
+          var prevLog;
+          var prevInfo;
+          var prevWarn;
+          var prevError;
+          var prevGroup;
+          var prevGroupCollapsed;
+          var prevGroupEnd;
+          function disabledLog() {
+          }
+          disabledLog.__reactDisabledLog = true;
+          function disableLogs() {
+            {
+              if (disabledDepth === 0) {
+                prevLog = console.log;
+                prevInfo = console.info;
+                prevWarn = console.warn;
+                prevError = console.error;
+                prevGroup = console.group;
+                prevGroupCollapsed = console.groupCollapsed;
+                prevGroupEnd = console.groupEnd;
+                var props = {
+                  configurable: true,
+                  enumerable: true,
+                  value: disabledLog,
+                  writable: true
+                };
+                Object.defineProperties(console, {
+                  info: props,
+                  log: props,
+                  warn: props,
+                  error: props,
+                  group: props,
+                  groupCollapsed: props,
+                  groupEnd: props
+                });
+              }
+              disabledDepth++;
+            }
+          }
+          function reenableLogs() {
+            {
+              disabledDepth--;
+              if (disabledDepth === 0) {
+                var props = {
+                  configurable: true,
+                  enumerable: true,
+                  writable: true
+                };
+                Object.defineProperties(console, {
+                  log: assign2({}, props, {
+                    value: prevLog
+                  }),
+                  info: assign2({}, props, {
+                    value: prevInfo
+                  }),
+                  warn: assign2({}, props, {
+                    value: prevWarn
+                  }),
+                  error: assign2({}, props, {
+                    value: prevError
+                  }),
+                  group: assign2({}, props, {
+                    value: prevGroup
+                  }),
+                  groupCollapsed: assign2({}, props, {
+                    value: prevGroupCollapsed
+                  }),
+                  groupEnd: assign2({}, props, {
+                    value: prevGroupEnd
+                  })
+                });
+              }
+              if (disabledDepth < 0) {
+                error("disabledDepth fell below zero. This is a bug in React. Please file an issue.");
+              }
+            }
+          }
+          var ReactCurrentDispatcher = ReactSharedInternals.ReactCurrentDispatcher;
+          var prefix2;
+          function describeBuiltInComponentFrame(name, source, ownerFn) {
+            {
+              if (prefix2 === void 0) {
+                try {
+                  throw Error();
+                } catch (x2) {
+                  var match2 = x2.stack.trim().match(/\n( *(at )?)/);
+                  prefix2 = match2 && match2[1] || "";
+                }
+              }
+              return "\n" + prefix2 + name;
+            }
+          }
+          var reentry = false;
+          var componentFrameCache;
+          {
+            var PossiblyWeakMap = typeof WeakMap === "function" ? WeakMap : Map;
+            componentFrameCache = new PossiblyWeakMap();
+          }
+          function describeNativeComponentFrame(fn, construct) {
+            if (!fn || reentry) {
+              return "";
+            }
+            {
+              var frame = componentFrameCache.get(fn);
+              if (frame !== void 0) {
+                return frame;
+              }
+            }
+            var control;
+            reentry = true;
+            var previousPrepareStackTrace = Error.prepareStackTrace;
+            Error.prepareStackTrace = void 0;
+            var previousDispatcher;
+            {
+              previousDispatcher = ReactCurrentDispatcher.current;
+              ReactCurrentDispatcher.current = null;
+              disableLogs();
+            }
+            try {
+              if (construct) {
+                var Fake = function() {
+                  throw Error();
+                };
+                Object.defineProperty(Fake.prototype, "props", {
+                  set: function() {
+                    throw Error();
+                  }
+                });
+                if (typeof Reflect === "object" && Reflect.construct) {
+                  try {
+                    Reflect.construct(Fake, []);
+                  } catch (x2) {
+                    control = x2;
+                  }
+                  Reflect.construct(fn, [], Fake);
+                } else {
+                  try {
+                    Fake.call();
+                  } catch (x2) {
+                    control = x2;
+                  }
+                  fn.call(Fake.prototype);
+                }
+              } else {
+                try {
+                  throw Error();
+                } catch (x2) {
+                  control = x2;
+                }
+                fn();
+              }
+            } catch (sample) {
+              if (sample && control && typeof sample.stack === "string") {
+                var sampleLines = sample.stack.split("\n");
+                var controlLines = control.stack.split("\n");
+                var s2 = sampleLines.length - 1;
+                var c2 = controlLines.length - 1;
+                while (s2 >= 1 && c2 >= 0 && sampleLines[s2] !== controlLines[c2]) {
+                  c2--;
+                }
+                for (; s2 >= 1 && c2 >= 0; s2--, c2--) {
+                  if (sampleLines[s2] !== controlLines[c2]) {
+                    if (s2 !== 1 || c2 !== 1) {
+                      do {
+                        s2--;
+                        c2--;
+                        if (c2 < 0 || sampleLines[s2] !== controlLines[c2]) {
+                          var _frame = "\n" + sampleLines[s2].replace(" at new ", " at ");
+                          if (fn.displayName && _frame.includes("<anonymous>")) {
+                            _frame = _frame.replace("<anonymous>", fn.displayName);
+                          }
+                          {
+                            if (typeof fn === "function") {
+                              componentFrameCache.set(fn, _frame);
+                            }
+                          }
+                          return _frame;
+                        }
+                      } while (s2 >= 1 && c2 >= 0);
+                    }
+                    break;
+                  }
+                }
+              }
+            } finally {
+              reentry = false;
+              {
+                ReactCurrentDispatcher.current = previousDispatcher;
+                reenableLogs();
+              }
+              Error.prepareStackTrace = previousPrepareStackTrace;
+            }
+            var name = fn ? fn.displayName || fn.name : "";
+            var syntheticFrame = name ? describeBuiltInComponentFrame(name) : "";
+            {
+              if (typeof fn === "function") {
+                componentFrameCache.set(fn, syntheticFrame);
+              }
+            }
+            return syntheticFrame;
+          }
+          function describeFunctionComponentFrame(fn, source, ownerFn) {
+            {
+              return describeNativeComponentFrame(fn, false);
+            }
+          }
+          function shouldConstruct(Component) {
+            var prototype = Component.prototype;
+            return !!(prototype && prototype.isReactComponent);
+          }
+          function describeUnknownElementTypeFrameInDEV(type, source, ownerFn) {
+            if (type == null) {
+              return "";
+            }
+            if (typeof type === "function") {
+              {
+                return describeNativeComponentFrame(type, shouldConstruct(type));
+              }
+            }
+            if (typeof type === "string") {
+              return describeBuiltInComponentFrame(type);
+            }
+            switch (type) {
+              case REACT_SUSPENSE_TYPE:
+                return describeBuiltInComponentFrame("Suspense");
+              case REACT_SUSPENSE_LIST_TYPE:
+                return describeBuiltInComponentFrame("SuspenseList");
+            }
+            if (typeof type === "object") {
+              switch (type.$$typeof) {
+                case REACT_FORWARD_REF_TYPE:
+                  return describeFunctionComponentFrame(type.render);
+                case REACT_MEMO_TYPE:
+                  return describeUnknownElementTypeFrameInDEV(type.type, source, ownerFn);
+                case REACT_LAZY_TYPE: {
+                  var lazyComponent = type;
+                  var payload = lazyComponent._payload;
+                  var init = lazyComponent._init;
+                  try {
+                    return describeUnknownElementTypeFrameInDEV(init(payload), source, ownerFn);
+                  } catch (x2) {
+                  }
+                }
+              }
+            }
+            return "";
+          }
+          var hasOwnProperty = Object.prototype.hasOwnProperty;
+          var loggedTypeFailures = {};
+          var ReactDebugCurrentFrame = ReactSharedInternals.ReactDebugCurrentFrame;
+          function setCurrentlyValidatingElement(element) {
+            {
+              if (element) {
+                var owner = element._owner;
+                var stack = describeUnknownElementTypeFrameInDEV(element.type, element._source, owner ? owner.type : null);
+                ReactDebugCurrentFrame.setExtraStackFrame(stack);
+              } else {
+                ReactDebugCurrentFrame.setExtraStackFrame(null);
+              }
+            }
+          }
+          function checkPropTypes(typeSpecs, values, location, componentName, element) {
+            {
+              var has = Function.call.bind(hasOwnProperty);
+              for (var typeSpecName in typeSpecs) {
+                if (has(typeSpecs, typeSpecName)) {
+                  var error$1 = void 0;
+                  try {
+                    if (typeof typeSpecs[typeSpecName] !== "function") {
+                      var err = Error((componentName || "React class") + ": " + location + " type `" + typeSpecName + "` is invalid; it must be a function, usually from the `prop-types` package, but received `" + typeof typeSpecs[typeSpecName] + "`.This often happens because of typos such as `PropTypes.function` instead of `PropTypes.func`.");
+                      err.name = "Invariant Violation";
+                      throw err;
+                    }
+                    error$1 = typeSpecs[typeSpecName](values, typeSpecName, componentName, location, null, "SECRET_DO_NOT_PASS_THIS_OR_YOU_WILL_BE_FIRED");
+                  } catch (ex) {
+                    error$1 = ex;
+                  }
+                  if (error$1 && !(error$1 instanceof Error)) {
+                    setCurrentlyValidatingElement(element);
+                    error("%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).", componentName || "React class", location, typeSpecName, typeof error$1);
+                    setCurrentlyValidatingElement(null);
+                  }
+                  if (error$1 instanceof Error && !(error$1.message in loggedTypeFailures)) {
+                    loggedTypeFailures[error$1.message] = true;
+                    setCurrentlyValidatingElement(element);
+                    error("Failed %s type: %s", location, error$1.message);
+                    setCurrentlyValidatingElement(null);
+                  }
+                }
+              }
+            }
+          }
+          var isArrayImpl = Array.isArray;
+          function isArray(a2) {
+            return isArrayImpl(a2);
+          }
+          function typeName(value) {
+            {
+              var hasToStringTag = typeof Symbol === "function" && Symbol.toStringTag;
+              var type = hasToStringTag && value[Symbol.toStringTag] || value.constructor.name || "Object";
+              return type;
+            }
+          }
+          function willCoercionThrow(value) {
+            {
+              try {
+                testStringCoercion(value);
+                return false;
+              } catch (e) {
+                return true;
+              }
+            }
+          }
+          function testStringCoercion(value) {
+            return "" + value;
+          }
+          function checkKeyStringCoercion(value) {
+            {
+              if (willCoercionThrow(value)) {
+                error("The provided key is an unsupported type %s. This value must be coerced to a string before before using it here.", typeName(value));
+                return testStringCoercion(value);
+              }
+            }
+          }
+          var ReactCurrentOwner = ReactSharedInternals.ReactCurrentOwner;
+          var RESERVED_PROPS = {
+            key: true,
+            ref: true,
+            __self: true,
+            __source: true
+          };
+          var specialPropKeyWarningShown;
+          var specialPropRefWarningShown;
+          var didWarnAboutStringRefs;
+          {
+            didWarnAboutStringRefs = {};
+          }
+          function hasValidRef(config) {
+            {
+              if (hasOwnProperty.call(config, "ref")) {
+                var getter = Object.getOwnPropertyDescriptor(config, "ref").get;
+                if (getter && getter.isReactWarning) {
+                  return false;
+                }
+              }
+            }
+            return config.ref !== void 0;
+          }
+          function hasValidKey(config) {
+            {
+              if (hasOwnProperty.call(config, "key")) {
+                var getter = Object.getOwnPropertyDescriptor(config, "key").get;
+                if (getter && getter.isReactWarning) {
+                  return false;
+                }
+              }
+            }
+            return config.key !== void 0;
+          }
+          function warnIfStringRefCannotBeAutoConverted(config, self) {
+            {
+              if (typeof config.ref === "string" && ReactCurrentOwner.current && self && ReactCurrentOwner.current.stateNode !== self) {
+                var componentName = getComponentNameFromType(ReactCurrentOwner.current.type);
+                if (!didWarnAboutStringRefs[componentName]) {
+                  error('Component "%s" contains the string ref "%s". Support for string refs will be removed in a future major release. This case cannot be automatically converted to an arrow function. We ask you to manually fix this case by using useRef() or createRef() instead. Learn more about using refs safely here: https://reactjs.org/link/strict-mode-string-ref', getComponentNameFromType(ReactCurrentOwner.current.type), config.ref);
+                  didWarnAboutStringRefs[componentName] = true;
+                }
+              }
+            }
+          }
+          function defineKeyPropWarningGetter(props, displayName) {
+            {
+              var warnAboutAccessingKey = function() {
+                if (!specialPropKeyWarningShown) {
+                  specialPropKeyWarningShown = true;
+                  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://reactjs.org/link/special-props)", displayName);
+                }
+              };
+              warnAboutAccessingKey.isReactWarning = true;
+              Object.defineProperty(props, "key", {
+                get: warnAboutAccessingKey,
+                configurable: true
+              });
+            }
+          }
+          function defineRefPropWarningGetter(props, displayName) {
+            {
+              var warnAboutAccessingRef = function() {
+                if (!specialPropRefWarningShown) {
+                  specialPropRefWarningShown = true;
+                  error("%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)", displayName);
+                }
+              };
+              warnAboutAccessingRef.isReactWarning = true;
+              Object.defineProperty(props, "ref", {
+                get: warnAboutAccessingRef,
+                configurable: true
+              });
+            }
+          }
+          var ReactElement = function(type, key, ref, self, source, owner, props) {
+            var element = {
+              // This tag allows us to uniquely identify this as a React Element
+              $$typeof: REACT_ELEMENT_TYPE,
+              // Built-in properties that belong on the element
+              type,
+              key,
+              ref,
+              props,
+              // Record the component responsible for creating this element.
+              _owner: owner
+            };
+            {
+              element._store = {};
+              Object.defineProperty(element._store, "validated", {
+                configurable: false,
+                enumerable: false,
+                writable: true,
+                value: false
+              });
+              Object.defineProperty(element, "_self", {
+                configurable: false,
+                enumerable: false,
+                writable: false,
+                value: self
+              });
+              Object.defineProperty(element, "_source", {
+                configurable: false,
+                enumerable: false,
+                writable: false,
+                value: source
+              });
+              if (Object.freeze) {
+                Object.freeze(element.props);
+                Object.freeze(element);
+              }
+            }
+            return element;
+          };
+          function jsxDEV(type, config, maybeKey, source, self) {
+            {
+              var propName;
+              var props = {};
+              var key = null;
+              var ref = null;
+              if (maybeKey !== void 0) {
+                {
+                  checkKeyStringCoercion(maybeKey);
+                }
+                key = "" + maybeKey;
+              }
+              if (hasValidKey(config)) {
+                {
+                  checkKeyStringCoercion(config.key);
+                }
+                key = "" + config.key;
+              }
+              if (hasValidRef(config)) {
+                ref = config.ref;
+                warnIfStringRefCannotBeAutoConverted(config, self);
+              }
+              for (propName in config) {
+                if (hasOwnProperty.call(config, propName) && !RESERVED_PROPS.hasOwnProperty(propName)) {
+                  props[propName] = config[propName];
+                }
+              }
+              if (type && type.defaultProps) {
+                var defaultProps = type.defaultProps;
+                for (propName in defaultProps) {
+                  if (props[propName] === void 0) {
+                    props[propName] = defaultProps[propName];
+                  }
+                }
+              }
+              if (key || ref) {
+                var displayName = typeof type === "function" ? type.displayName || type.name || "Unknown" : type;
+                if (key) {
+                  defineKeyPropWarningGetter(props, displayName);
+                }
+                if (ref) {
+                  defineRefPropWarningGetter(props, displayName);
+                }
+              }
+              return ReactElement(type, key, ref, self, source, ReactCurrentOwner.current, props);
+            }
+          }
+          var ReactCurrentOwner$1 = ReactSharedInternals.ReactCurrentOwner;
+          var ReactDebugCurrentFrame$1 = ReactSharedInternals.ReactDebugCurrentFrame;
+          function setCurrentlyValidatingElement$1(element) {
+            {
+              if (element) {
+                var owner = element._owner;
+                var stack = describeUnknownElementTypeFrameInDEV(element.type, element._source, owner ? owner.type : null);
+                ReactDebugCurrentFrame$1.setExtraStackFrame(stack);
+              } else {
+                ReactDebugCurrentFrame$1.setExtraStackFrame(null);
+              }
+            }
+          }
+          var propTypesMisspellWarningShown;
+          {
+            propTypesMisspellWarningShown = false;
+          }
+          function isValidElement(object) {
+            {
+              return typeof object === "object" && object !== null && object.$$typeof === REACT_ELEMENT_TYPE;
+            }
+          }
+          function getDeclarationErrorAddendum() {
+            {
+              if (ReactCurrentOwner$1.current) {
+                var name = getComponentNameFromType(ReactCurrentOwner$1.current.type);
+                if (name) {
+                  return "\n\nCheck the render method of `" + name + "`.";
+                }
+              }
+              return "";
+            }
+          }
+          function getSourceInfoErrorAddendum(source) {
+            {
+              if (source !== void 0) {
+                var fileName = source.fileName.replace(/^.*[\\\/]/, "");
+                var lineNumber = source.lineNumber;
+                return "\n\nCheck your code at " + fileName + ":" + lineNumber + ".";
+              }
+              return "";
+            }
+          }
+          var ownerHasKeyUseWarning = {};
+          function getCurrentComponentErrorInfo(parentType) {
+            {
+              var info = getDeclarationErrorAddendum();
+              if (!info) {
+                var parentName = typeof parentType === "string" ? parentType : parentType.displayName || parentType.name;
+                if (parentName) {
+                  info = "\n\nCheck the top-level render call using <" + parentName + ">.";
+                }
+              }
+              return info;
+            }
+          }
+          function validateExplicitKey(element, parentType) {
+            {
+              if (!element._store || element._store.validated || element.key != null) {
+                return;
+              }
+              element._store.validated = true;
+              var currentComponentErrorInfo = getCurrentComponentErrorInfo(parentType);
+              if (ownerHasKeyUseWarning[currentComponentErrorInfo]) {
+                return;
+              }
+              ownerHasKeyUseWarning[currentComponentErrorInfo] = true;
+              var childOwner = "";
+              if (element && element._owner && element._owner !== ReactCurrentOwner$1.current) {
+                childOwner = " It was passed a child from " + getComponentNameFromType(element._owner.type) + ".";
+              }
+              setCurrentlyValidatingElement$1(element);
+              error('Each child in a list should have a unique "key" prop.%s%s See https://reactjs.org/link/warning-keys for more information.', currentComponentErrorInfo, childOwner);
+              setCurrentlyValidatingElement$1(null);
+            }
+          }
+          function validateChildKeys(node2, parentType) {
+            {
+              if (typeof node2 !== "object") {
+                return;
+              }
+              if (isArray(node2)) {
+                for (var i2 = 0; i2 < node2.length; i2++) {
+                  var child = node2[i2];
+                  if (isValidElement(child)) {
+                    validateExplicitKey(child, parentType);
+                  }
+                }
+              } else if (isValidElement(node2)) {
+                if (node2._store) {
+                  node2._store.validated = true;
+                }
+              } else if (node2) {
+                var iteratorFn = getIteratorFn(node2);
+                if (typeof iteratorFn === "function") {
+                  if (iteratorFn !== node2.entries) {
+                    var iterator = iteratorFn.call(node2);
+                    var step;
+                    while (!(step = iterator.next()).done) {
+                      if (isValidElement(step.value)) {
+                        validateExplicitKey(step.value, parentType);
+                      }
+                    }
+                  }
+                }
+              }
+            }
+          }
+          function validatePropTypes(element) {
+            {
+              var type = element.type;
+              if (type === null || type === void 0 || typeof type === "string") {
+                return;
+              }
+              var propTypes;
+              if (typeof type === "function") {
+                propTypes = type.propTypes;
+              } else if (typeof type === "object" && (type.$$typeof === REACT_FORWARD_REF_TYPE || // Note: Memo only checks outer props here.
+              // Inner props are checked in the reconciler.
+              type.$$typeof === REACT_MEMO_TYPE)) {
+                propTypes = type.propTypes;
+              } else {
+                return;
+              }
+              if (propTypes) {
+                var name = getComponentNameFromType(type);
+                checkPropTypes(propTypes, element.props, "prop", name, element);
+              } else if (type.PropTypes !== void 0 && !propTypesMisspellWarningShown) {
+                propTypesMisspellWarningShown = true;
+                var _name = getComponentNameFromType(type);
+                error("Component %s declared `PropTypes` instead of `propTypes`. Did you misspell the property assignment?", _name || "Unknown");
+              }
+              if (typeof type.getDefaultProps === "function" && !type.getDefaultProps.isReactClassApproved) {
+                error("getDefaultProps is only used on classic React.createClass definitions. Use a static property named `defaultProps` instead.");
+              }
+            }
+          }
+          function validateFragmentProps(fragment) {
+            {
+              var keys = Object.keys(fragment.props);
+              for (var i2 = 0; i2 < keys.length; i2++) {
+                var key = keys[i2];
+                if (key !== "children" && key !== "key") {
+                  setCurrentlyValidatingElement$1(fragment);
+                  error("Invalid prop `%s` supplied to `React.Fragment`. React.Fragment can only have `key` and `children` props.", key);
+                  setCurrentlyValidatingElement$1(null);
+                  break;
+                }
+              }
+              if (fragment.ref !== null) {
+                setCurrentlyValidatingElement$1(fragment);
+                error("Invalid attribute `ref` supplied to `React.Fragment`.");
+                setCurrentlyValidatingElement$1(null);
+              }
+            }
+          }
+          var didWarnAboutKeySpread = {};
+          function jsxWithValidation(type, props, key, isStaticChildren, source, self) {
+            {
+              var validType = isValidElementType(type);
+              if (!validType) {
+                var info = "";
+                if (type === void 0 || typeof type === "object" && type !== null && Object.keys(type).length === 0) {
+                  info += " 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 sourceInfo = getSourceInfoErrorAddendum(source);
+                if (sourceInfo) {
+                  info += sourceInfo;
+                } else {
+                  info += getDeclarationErrorAddendum();
+                }
+                var typeString;
+                if (type === null) {
+                  typeString = "null";
+                } else if (isArray(type)) {
+                  typeString = "array";
+                } else if (type !== void 0 && type.$$typeof === REACT_ELEMENT_TYPE) {
+                  typeString = "<" + (getComponentNameFromType(type.type) || "Unknown") + " />";
+                  info = " Did you accidentally export a JSX literal instead of a component?";
+                } else {
+                  typeString = typeof type;
+                }
+                error("React.jsx: type is invalid -- expected a string (for built-in components) or a class/function (for composite components) but got: %s.%s", typeString, info);
+              }
+              var element = jsxDEV(type, props, key, source, self);
+              if (element == null) {
+                return element;
+              }
+              if (validType) {
+                var children = props.children;
+                if (children !== void 0) {
+                  if (isStaticChildren) {
+                    if (isArray(children)) {
+                      for (var i2 = 0; i2 < children.length; i2++) {
+                        validateChildKeys(children[i2], type);
+                      }
+                      if (Object.freeze) {
+                        Object.freeze(children);
+                      }
+                    } else {
+                      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 {
+                    validateChildKeys(children, type);
+                  }
+                }
+              }
+              {
+                if (hasOwnProperty.call(props, "key")) {
+                  var componentName = getComponentNameFromType(type);
+                  var keys = Object.keys(props).filter(function(k2) {
+                    return k2 !== "key";
+                  });
+                  var beforeExample = keys.length > 0 ? "{key: someKey, " + keys.join(": ..., ") + ": ...}" : "{key: someKey}";
+                  if (!didWarnAboutKeySpread[componentName + beforeExample]) {
+                    var afterExample = keys.length > 0 ? "{" + keys.join(": ..., ") + ": ...}" : "{}";
+                    error('A props object containing a "key" prop is being spread into JSX:\n  let props = %s;\n  <%s {...props} />\nReact keys must be passed directly to JSX without using spread:\n  let props = %s;\n  <%s key={someKey} {...props} />', beforeExample, componentName, afterExample, componentName);
+                    didWarnAboutKeySpread[componentName + beforeExample] = true;
+                  }
+                }
+              }
+              if (type === REACT_FRAGMENT_TYPE) {
+                validateFragmentProps(element);
+              } else {
+                validatePropTypes(element);
+              }
+              return element;
+            }
+          }
+          function jsxWithValidationStatic(type, props, key) {
+            {
+              return jsxWithValidation(type, props, key, true);
+            }
+          }
+          function jsxWithValidationDynamic(type, props, key) {
+            {
+              return jsxWithValidation(type, props, key, false);
+            }
+          }
+          var jsx12 = jsxWithValidationDynamic;
+          var jsxs7 = jsxWithValidationStatic;
+          exports.Fragment = REACT_FRAGMENT_TYPE;
+          exports.jsx = jsx12;
+          exports.jsxs = jsxs7;
+        })();
+      }
+    }
+  });
+
+  // ../../node_modules/.pnpm/react@18.3.1/node_modules/react/jsx-runtime.js
+  var require_jsx_runtime = __commonJS({
+    "../../node_modules/.pnpm/react@18.3.1/node_modules/react/jsx-runtime.js"(exports, module) {
+      "use strict";
+      if (false) {
+        module.exports = null;
+      } else {
+        module.exports = require_react_jsx_runtime_development();
+      }
+    }
+  });
+
   // src/frontend/frontend.ts
   var import_client = __toESM(require_client());
 
+  // ../toolkit-frontend/dist/chunk-35U577MM.mjs
+  var import_react = __toESM(require_react(), 1);
+  function switchToMouseMode(ev) {
+    if (ev.movementX === 0 && ev.movementY === 0) return;
+    document.body.classList.remove("touch-mode");
+  }
+  function switchToTouchMode() {
+    document.body.classList.add("touch-mode");
+  }
+  function initialiseListeners() {
+    window.addEventListener("mousemove", switchToMouseMode);
+    window.addEventListener("touchstart", switchToTouchMode, { passive: false });
+    window.addEventListener("contextmenu", (e) => {
+      if (e.pointerType === "touch") {
+        e.preventDefault();
+      }
+    });
+  }
+  var usePressable = (click) => {
+    const [touching, setTouching] = (0, import_react.useState)(false);
+    return {
+      touching,
+      handlers: {
+        onClick: click,
+        onTouchStart: () => {
+          setTouching(true);
+        },
+        onTouchMove: () => {
+          setTouching(false);
+        },
+        onTouchEnd: (event) => {
+          if (touching) {
+            event.preventDefault();
+            setTouching(false);
+            click();
+          }
+        }
+      }
+    };
+  };
+  function trackTouch(touch, move, end) {
+    const touchMove = (ev) => {
+      ev.preventDefault();
+      for (const t of Array.from(ev.changedTouches)) {
+        if (t.identifier === touch.identifier) {
+          move({ pageX: t.pageX, pageY: t.pageY });
+        }
+      }
+    };
+    const touchEnd = (ev) => {
+      for (const t of Array.from(ev.changedTouches)) {
+        if (t.identifier === touch.identifier) {
+          end({ pageX: t.pageX, pageY: t.pageY });
+          window.removeEventListener("touchmove", touchMove);
+          window.removeEventListener("touchend", touchEnd);
+          window.removeEventListener("touchcancel", touchEnd);
+        }
+      }
+    };
+    window.addEventListener("touchmove", touchMove, { passive: false });
+    window.addEventListener("touchend", touchEnd);
+    window.addEventListener("touchcancel", touchEnd);
+  }
+  var calculateClass = (...args) => args.filter((a2) => !!a2).join(" ");
+
+  // ../toolkit-frontend/dist/chunk-7P6ASYW6.mjs
+  var __defProp2 = Object.defineProperty;
+  var __export = (target, all) => {
+    for (var name in all)
+      __defProp2(target, name, { get: all[name], enumerable: true });
+  };
+
   // ../diff/dist/chunk-KAHL2YAL.mjs
   var patchJson = (old, diff) => {
     if (diff.type === "match") {
@@ -23672,7 +24649,7 @@
   };
 
   // src/frontend/stage.tsx
-  var React12 = __toESM(require_react());
+  var React5 = __toESM(require_react());
 
   // ../../node_modules/.pnpm/tslib@2.6.2/node_modules/tslib/tslib.es6.mjs
   var __assign = function() {
@@ -23714,7 +24691,7 @@
   );
 
   // ../../node_modules/.pnpm/styled-components@6.1.13_react-dom@18.3.1_react@18.3.1__react@18.3.1/node_modules/styled-components/dist/styled-components.browser.esm.js
-  var import_react = __toESM(require_react());
+  var import_react2 = __toESM(require_react());
   var import_shallowequal = __toESM(require_shallowequal());
 
   // ../../node_modules/.pnpm/stylis@4.3.2/node_modules/stylis/src/Enum.js
@@ -24395,7 +25372,7 @@
         console.error = function(t2) {
           for (var n2 = [], o3 = 1; o3 < arguments.length; o3++) n2[o3 - 1] = arguments[o3];
           E.test(t2) ? (a2 = false, N.delete(s2)) : i2.apply(void 0, __spreadArray([t2], n2, false));
-        }, (0, import_react.useRef)(), a2 && !N.has(s2) && (console.warn(s2), N.add(s2));
+        }, (0, import_react2.useRef)(), a2 && !N.has(s2) && (console.warn(s2), N.add(s2));
       } catch (e) {
         E.test(e.message) && N.delete(s2);
       } finally {
@@ -24733,26 +25710,26 @@
   }
   var Me = new ke();
   var ze = Fe();
-  var $e = import_react.default.createContext({ shouldForwardProp: void 0, styleSheet: Me, stylis: ze });
+  var $e = import_react2.default.createContext({ shouldForwardProp: void 0, styleSheet: Me, stylis: ze });
   var Be = $e.Consumer;
-  var Le = import_react.default.createContext(void 0);
+  var Le = import_react2.default.createContext(void 0);
   function Ge() {
-    return (0, import_react.useContext)($e);
+    return (0, import_react2.useContext)($e);
   }
   function Ye(e) {
-    var t = (0, import_react.useState)(e.stylisPlugins), n = t[0], r2 = t[1], c2 = Ge().styleSheet, l2 = (0, import_react.useMemo)(function() {
+    var t = (0, import_react2.useState)(e.stylisPlugins), n = t[0], r2 = t[1], c2 = Ge().styleSheet, l2 = (0, import_react2.useMemo)(function() {
       var t2 = c2;
       return e.sheet ? t2 = e.sheet : e.target && (t2 = t2.reconstructWithOptions({ target: e.target }, false)), e.disableCSSOMInjection && (t2 = t2.reconstructWithOptions({ useCSSOMInjection: false })), t2;
-    }, [e.disableCSSOMInjection, e.sheet, e.target, c2]), u2 = (0, import_react.useMemo)(function() {
+    }, [e.disableCSSOMInjection, e.sheet, e.target, c2]), u2 = (0, import_react2.useMemo)(function() {
       return Fe({ options: { namespace: e.namespace, prefix: e.enableVendorPrefixes }, plugins: n });
     }, [e.enableVendorPrefixes, e.namespace, n]);
-    (0, import_react.useEffect)(function() {
+    (0, import_react2.useEffect)(function() {
       (0, import_shallowequal.default)(n, e.stylisPlugins) || r2(e.stylisPlugins);
     }, [e.stylisPlugins]);
-    var d = (0, import_react.useMemo)(function() {
+    var d = (0, import_react2.useMemo)(function() {
       return { shouldForwardProp: e.shouldForwardProp, styleSheet: l2, stylis: u2 };
     }, [e.shouldForwardProp, l2, u2]);
-    return import_react.default.createElement($e.Provider, { value: d }, import_react.default.createElement(Le.Provider, { value: u2 }, e.children));
+    return import_react2.default.createElement($e.Provider, { value: d }, import_react2.default.createElement(Le.Provider, { value: u2 }, e.children));
   }
   var We = function() {
     function e(e2, t) {
@@ -24844,10 +25821,10 @@
       return o2;
     }, e;
   }();
-  var et = import_react.default.createContext(void 0);
+  var et = import_react2.default.createContext(void 0);
   var tt = et.Consumer;
   function ot(e) {
-    var n = import_react.default.useContext(et), r2 = (0, import_react.useMemo)(function() {
+    var n = import_react2.default.useContext(et), r2 = (0, import_react2.useMemo)(function() {
       return function(e2, n2) {
         if (!e2) throw he(14);
         if (re(e2)) {
@@ -24859,7 +25836,7 @@
         return n2 ? __assign(__assign({}, n2), e2) : e2;
       }(e.theme, n);
     }, [e.theme, n]);
-    return e.children ? import_react.default.createElement(et.Provider, { value: r2 }, e.children) : null;
+    return e.children ? import_react2.default.createElement(et.Provider, { value: r2 }, e.children) : null;
   }
   var rt = {};
   var st = /* @__PURE__ */ new Set();
@@ -24884,8 +25861,8 @@
     var N2 = new Qe(s2, g2, i2 ? a2.componentStyle : void 0);
     function O2(e2, r3) {
       return function(e3, r4, s3) {
-        var i3 = e3.attrs, a3 = e3.componentStyle, c3 = e3.defaultProps, p3 = e3.foldedComponentIds, d2 = e3.styledComponentId, h2 = e3.target, f3 = import_react.default.useContext(et), m3 = Ge(), y3 = e3.shouldForwardProp || m3.shouldForwardProp;
-        (0, import_react.useDebugValue)(d2);
+        var i3 = e3.attrs, a3 = e3.componentStyle, c3 = e3.defaultProps, p3 = e3.foldedComponentIds, d2 = e3.styledComponentId, h2 = e3.target, f3 = import_react2.default.useContext(et), m3 = Ge(), y3 = e3.shouldForwardProp || m3.shouldForwardProp;
+        (0, import_react2.useDebugValue)(d2);
         var v2 = I(r4, f3, c3) || C, g3 = function(e4, n, o2) {
           for (var r5, s4 = __assign(__assign({}, n), { className: void 0, theme: o2 }), i4 = 0; i4 < e4.length; i4 += 1) {
             var a4 = re(r5 = e4[i4]) ? r5(s4) : r5;
@@ -24896,15 +25873,15 @@
         for (var b3 in g3) void 0 === g3[b3] || "$" === b3[0] || "as" === b3 || "theme" === b3 && g3.theme === v2 || ("forwardedAs" === b3 ? w3.as = g3.forwardedAs : y3 && !y3(b3, S3) || (w3[b3] = g3[b3], y3 || false || isPropValid(b3) || st.has(b3) || !A.has(S3) || (st.add(b3), console.warn('styled-components: it looks like an unknown prop "'.concat(b3, '" is being sent through to the DOM, which will likely trigger a React console error. If you would like automatic filtering of unknown props, you can opt-into that behavior via `<StyleSheetManager shouldForwardProp={...}>` (connect an API like `@emotion/is-prop-valid`) or consider using transient props (`$` prefix for automatic filtering.)')))));
         var E3 = function(e4, t) {
           var n = Ge(), o2 = e4.generateAndInjectStyles(t, n.styleSheet, n.stylis);
-          return (0, import_react.useDebugValue)(o2), o2;
+          return (0, import_react2.useDebugValue)(o2), o2;
         }(a3, g3);
         e3.warnTooManyClasses && e3.warnTooManyClasses(E3);
         var N3 = ie(p3, d2);
-        return E3 && (N3 += " " + E3), g3.className && (N3 += " " + g3.className), w3[L(S3) && !A.has(S3) ? "class" : "className"] = N3, w3.ref = s3, (0, import_react.createElement)(S3, w3);
+        return E3 && (N3 += " " + E3), g3.className && (N3 += " " + g3.className), w3[L(S3) && !A.has(S3) ? "class" : "className"] = N3, w3.ref = s3, (0, import_react2.createElement)(S3, w3);
       }(D2, e2, r3);
     }
     O2.displayName = y2;
-    var D2 = import_react.default.forwardRef(O2);
+    var D2 = import_react2.default.forwardRef(O2);
     return D2.attrs = S2, D2.componentStyle = N2, D2.displayName = y2, D2.shouldForwardProp = w2, D2.foldedComponentIds = i2 ? ie(a2.foldedComponentIds, a2.styledComponentId) : "", D2.styledComponentId = g2, D2.target = i2 ? a2.target : e, Object.defineProperty(D2, "defaultProps", { get: function() {
       return this._foldedDefaultProps;
     }, set: function(e2) {
@@ -24975,10 +25952,10 @@
     var i2 = lt.apply(void 0, __spreadArray([n], r2, false)), a2 = "sc-global-".concat($(JSON.stringify(i2))), c2 = new ht(i2, a2);
     P(a2);
     var l2 = function(e) {
-      var t = Ge(), n2 = import_react.default.useContext(et), r3 = import_react.default.useRef(t.styleSheet.allocateGSInstance(a2)).current;
-      return import_react.default.Children.count(e.children) && console.warn("The global style component ".concat(a2, " was given child JSX. createGlobalStyle does not render children.")), i2.some(function(e2) {
+      var t = Ge(), n2 = import_react2.default.useContext(et), r3 = import_react2.default.useRef(t.styleSheet.allocateGSInstance(a2)).current;
+      return import_react2.default.Children.count(e.children) && console.warn("The global style component ".concat(a2, " was given child JSX. createGlobalStyle does not render children.")), i2.some(function(e2) {
         return "string" == typeof e2 && -1 !== e2.indexOf("@import");
-      }) && console.warn("Please do not use @import CSS syntax in createGlobalStyle at this time, as the CSSOM APIs we use in production do not handle it well. Instead, we recommend using a library such as react-helmet to inject a typical <link> meta tag to the stylesheet, or simply embedding it manually in your index.html <head> section for a simpler app."), t.styleSheet.server && u2(r3, e, t.styleSheet, n2, t.stylis), import_react.default.useLayoutEffect(function() {
+      }) && console.warn("Please do not use @import CSS syntax in createGlobalStyle at this time, as the CSSOM APIs we use in production do not handle it well. Instead, we recommend using a library such as react-helmet to inject a typical <link> meta tag to the stylesheet, or simply embedding it manually in your index.html <head> section for a simpler app."), t.styleSheet.server && u2(r3, e, t.styleSheet, n2, t.stylis), import_react2.default.useLayoutEffect(function() {
         if (!t.styleSheet.server) return u2(r3, e, t.styleSheet, n2, t.stylis), function() {
           return c2.removeStyles(r3, t.styleSheet);
         };
@@ -24991,7 +25968,7 @@
         c2.renderStyles(e, i3, o2, s3);
       }
     }
-    return import_react.default.memo(l2);
+    return import_react2.default.memo(l2);
   }
   var vt = function() {
     function e() {
@@ -25010,14 +25987,14 @@
         var r2 = e2.instance.toString();
         if (!r2) return [];
         var s2 = ((n = {})[f] = "", n[y] = v, n.dangerouslySetInnerHTML = { __html: r2 }, n), i2 = Ce();
-        return i2 && (s2.nonce = i2), [import_react.default.createElement("style", __assign({}, s2, { key: "sc-0-0" }))];
+        return i2 && (s2.nonce = i2), [import_react2.default.createElement("style", __assign({}, s2, { key: "sc-0-0" }))];
       }, this.seal = function() {
         e2.sealed = true;
       }, this.instance = new ke({ isServer: true }), this.sealed = false;
     }
     return e.prototype.collectStyles = function(e2) {
       if (this.sealed) throw he(2);
-      return import_react.default.createElement(Ye, { sheet: this.instance }, e2);
+      return import_react2.default.createElement(Ye, { sheet: this.instance }, e2);
     }, e.prototype.interleaveWithNodeStream = function(e2) {
       throw he(3);
     }, e;
@@ -25026,24 +26003,13 @@
   var St = "__sc-".concat(f, "__");
   "undefined" != typeof window && (window[St] || (window[St] = 0), 1 === window[St] && console.warn("It looks like there are several instances of 'styled-components' initialized in this application. This may cause dynamic styles to not render properly, errors during the rehydration process, a missing theme prop, and makes your application bigger without good reason.\n\nSee https://s-c.sh/2BAXzed for more info."), window[St] += 1);
 
-  // src/shared/static.ts
-  var FONTS = {
-    materialSymbolsOutlined: "material-symbols-outlined.woff2"
-  };
-
-  // src/frontend/styling.ts
+  // ../toolkit-frontend/dist/chunk-6Z2ACPNM.mjs
   var GlobalStyle = ft`
 body {
   &.touch-mode * {
     cursor: none !important;
   }
 }
-
-@font-face {
-  font-family: 'Material Symbols Outlined';
-  font-style: normal;
-  src: url(${FONTS.materialSymbolsOutlined}) format('woff');
-}
 `;
   var THEME = {
     colorGreen: "#98c379",
@@ -25178,17 +26144,12 @@ body {
   transition: border-color 0s;
 `;
 
-  // src/frontend/components/group.tsx
-  var React3 = __toESM(require_react());
-  var import_react4 = __toESM(require_react());
-
-  // src/frontend/components/core/icon.tsx
-  var React = __toESM(require_react());
-
-  // src/frontend/components/core/utils.ts
-  var calculateClass = (...args) => args.filter((a2) => !!a2).join(" ");
-
-  // src/frontend/components/core/icon.tsx
+  // ../toolkit-frontend/dist/chunk-3MWB6MZI.mjs
+  var import_jsx_runtime = __toESM(require_jsx_runtime(), 1);
+  var core_exports = {};
+  __export(core_exports, {
+    Icon: () => Icon
+  });
   var ICON_CLASS = "icon";
   var Span = dt.span`
   font-family: 'Material Symbols Outlined';
@@ -25206,19 +26167,105 @@ body {
     'wght' 300,
     'GRAD' -25;
 `;
-  var Icon = ({ icon, ...props }) => /* @__PURE__ */ React.createElement(Span, { className: calculateClass(props.className, ICON_CLASS), ...props }, icon);
+  var Icon = ({ icon, ...props }) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Span, { className: calculateClass(props.className, ICON_CLASS), ...props, children: icon });
 
-  // src/frontend/components/context.tsx
-  var import_react2 = __toESM(require_react());
-  var StageContext = (0, import_react2.createContext)({
+  // ../toolkit-frontend/dist/components/index.mjs
+  var import_react3 = __toESM(require_react(), 1);
+  var import_react4 = __toESM(require_react(), 1);
+  var import_jsx_runtime2 = __toESM(require_jsx_runtime(), 1);
+  var import_react5 = __toESM(require_react(), 1);
+  var import_react6 = __toESM(require_react(), 1);
+  var import_jsx_runtime3 = __toESM(require_jsx_runtime(), 1);
+  var import_jsx_runtime4 = __toESM(require_jsx_runtime(), 1);
+  var import_jsx_runtime5 = __toESM(require_jsx_runtime(), 1);
+  var import_jsx_runtime6 = __toESM(require_jsx_runtime(), 1);
+  var import_react7 = __toESM(require_react(), 1);
+  var import_jsx_runtime7 = __toESM(require_jsx_runtime(), 1);
+  var import_react8 = __toESM(require_react(), 1);
+  var import_jsx_runtime8 = __toESM(require_jsx_runtime(), 1);
+  var import_react9 = __toESM(require_react(), 1);
+  var import_jsx_runtime9 = __toESM(require_jsx_runtime(), 1);
+  var import_react10 = __toESM(require_react(), 1);
+  var import_jsx_runtime10 = __toESM(require_jsx_runtime(), 1);
+  var import_react11 = __toESM(require_react(), 1);
+  var import_jsx_runtime11 = __toESM(require_jsx_runtime(), 1);
+  var import_jsx_runtime12 = __toESM(require_jsx_runtime(), 1);
+  var StageContext = (0, import_react4.createContext)({
     sendMessage: null,
     renderComponent: () => {
       throw new Error(`missing root context`);
     }
   });
+  var TOUCH_INDICATOR_CLASS = "touch-indicator";
+  var TOUCHING_CLASS = "touching";
+  var ERROR_CLASS = "error";
+  var ButtonContents = dt.div`
+  padding: 6px 4px;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+
+  > * {
+    padding: 0;
+  }
+`;
+  var ButtonLabel = dt.span`
+  padding: 0 4px;
+`;
+  var Button = (props) => {
+    const { sendMessage } = import_react3.default.useContext(StageContext);
+    const { touching, handlers } = usePressable(
+      () => sendMessage?.({
+        type: "component-message",
+        componentKey: props.info.key,
+        component: "button"
+      })
+    );
+    const { state } = props.info;
+    return /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(
+      "div",
+      {
+        className: calculateClass(
+          props.className,
+          touching || state.state === "pressed" ? TOUCHING_CLASS : null,
+          state.state === "error" && ERROR_CLASS
+        ),
+        ...handlers,
+        title: state.state === "error" ? state.error : void 0,
+        children: [
+          /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("div", { className: TOUCH_INDICATOR_CLASS }),
+          /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(ButtonContents, { children: [
+            props.info.icon && /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(Icon, { icon: props.info.icon }),
+            props.info.text && /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(ButtonLabel, { children: props.info.text })
+          ] })
+        ]
+      }
+    );
+  };
+  var StyledButton = dt(Button)`
+  ${rectButton}
+  outline: none;
+  height: 30px;
+  position: relative;
+  overflow: visible;
 
-  // src/frontend/components/nesting.tsx
-  var React2 = __toESM(require_react());
+  .${TOUCH_INDICATOR_CLASS} {
+    ${touchIndicatorNormal}
+  }
+
+  &.${ERROR_CLASS} {
+    color: ${THEME.colorRed};
+    border-color: ${THEME.colorRed};
+  }
+
+  &.${TOUCHING_CLASS} {
+    ${buttonStateNormalActive}
+
+    .${TOUCH_INDICATOR_CLASS} {
+      ${touchIndicatorTouching}
+    }
+  }
+`;
   function nextColor(currentColor) {
     switch (currentColor) {
       case "dark":
@@ -25229,13 +26276,10 @@ body {
         return "dark";
     }
   }
-  var LastNestedColor = React2.createContext("dark");
-  var NestedContent = ({
-    className,
-    children
-  }) => {
-    const color = React2.useContext(LastNestedColor);
-    return /* @__PURE__ */ React2.createElement("div", { className: calculateClass(className, `color-${color}`) }, /* @__PURE__ */ React2.createElement(LastNestedColor.Provider, { value: nextColor(color) }, children));
+  var LastNestedColor = import_react6.default.createContext("dark");
+  var NestedContent = ({ className, children }) => {
+    const color = import_react6.default.useContext(LastNestedColor);
+    return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("div", { className: calculateClass(className, `color-${color}`), children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(LastNestedColor.Provider, { value: nextColor(color), children }) });
   };
   NestedContent.displayName = "NestedContent";
   var StyledNestedContent = dt(NestedContent)`
@@ -25254,72 +26298,6 @@ body {
     background: ${THEME.bgLight1};
   }
 `;
-
-  // src/frontend/util/touch.ts
-  var import_react3 = __toESM(require_react());
-  function switchToMouseMode(ev) {
-    if (ev.movementX === 0 && ev.movementY === 0) return;
-    document.body.classList.remove("touch-mode");
-  }
-  function switchToTouchMode() {
-    document.body.classList.add("touch-mode");
-  }
-  function initialiseListeners() {
-    window.addEventListener("mousemove", switchToMouseMode);
-    window.addEventListener("touchstart", switchToTouchMode, { passive: false });
-    window.addEventListener("contextmenu", (e) => {
-      if (e.pointerType === "touch") {
-        e.preventDefault();
-      }
-    });
-  }
-  var usePressable = (click) => {
-    const [touching, setTouching] = (0, import_react3.useState)(false);
-    return {
-      touching,
-      handlers: {
-        onClick: click,
-        onTouchStart: () => {
-          setTouching(true);
-        },
-        onTouchMove: () => {
-          setTouching(false);
-        },
-        onTouchEnd: (event) => {
-          if (touching) {
-            event.preventDefault();
-            setTouching(false);
-            click();
-          }
-        }
-      }
-    };
-  };
-  function trackTouch(touch, move, end) {
-    const touchMove = (ev) => {
-      ev.preventDefault();
-      for (const t of Array.from(ev.changedTouches)) {
-        if (t.identifier === touch.identifier) {
-          move({ pageX: t.pageX, pageY: t.pageY });
-        }
-      }
-    };
-    const touchEnd = (ev) => {
-      for (const t of Array.from(ev.changedTouches)) {
-        if (t.identifier === touch.identifier) {
-          end({ pageX: t.pageX, pageY: t.pageY });
-          window.removeEventListener("touchmove", touchMove);
-          window.removeEventListener("touchend", touchEnd);
-          window.removeEventListener("touchcancel", touchEnd);
-        }
-      }
-    };
-    window.addEventListener("touchmove", touchMove, { passive: false });
-    window.addEventListener("touchend", touchEnd);
-    window.addEventListener("touchcancel", touchEnd);
-  }
-
-  // src/frontend/components/group.tsx
   var CollapseIcon = dt(Icon)({
     cursor: "pointer"
   });
@@ -25396,7 +26374,7 @@ body {
   outline: none;
   color: ${THEME.textNormal};
 `;
-  var GroupStateContext = React3.createContext({
+  var GroupStateContext = import_react5.default.createContext({
     isCollapsed: () => {
       throw new Error("missing GroupStateContext");
     },
@@ -25405,7 +26383,7 @@ body {
     }
   });
   var GroupStateWrapper = ({ openByDefault, children }) => {
-    const [state, setState] = (0, import_react4.useState)({});
+    const [state, setState] = (0, import_react5.useState)({});
     const isCollapsed = (key, defaultState) => {
       let match2 = state[key];
       if (!match2) {
@@ -25423,13 +26401,13 @@ body {
         [key]: current[key] === "closed" ? "open" : "closed"
       }));
     };
-    return /* @__PURE__ */ React3.createElement(GroupStateContext.Provider, { value: { isCollapsed, toggleCollapsed } }, children);
+    return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(GroupStateContext.Provider, { value: { isCollapsed, toggleCollapsed }, children });
   };
   var Group = ({ className, info }) => {
-    const groupState = (0, import_react4.useContext)(GroupStateContext);
-    const { renderComponent: renderComponent2, sendMessage } = (0, import_react4.useContext)(StageContext);
-    const [editingTitle, setEditingTitle] = (0, import_react4.useState)(false);
-    const children = /* @__PURE__ */ React3.createElement(GroupChildren, { info }, info.children.map(renderComponent2));
+    const groupState = (0, import_react5.useContext)(GroupStateContext);
+    const { renderComponent, sendMessage } = (0, import_react5.useContext)(StageContext);
+    const [editingTitle, setEditingTitle] = (0, import_react5.useState)(false);
+    const children = /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(GroupChildren, { info, children: info.children.map(renderComponent) });
     const collapsible = !!info.defaultCollapsibleState;
     const collapsed = info.defaultCollapsibleState ? groupState.isCollapsed(info.key, info.defaultCollapsibleState) : false;
     const collapsePressable = usePressable(
@@ -25457,35 +26435,43 @@ body {
       }
     };
     const hasBorder = info.border || displayHeader;
-    const childrenElements = hasBorder ? /* @__PURE__ */ React3.createElement(StyledNestedContent, null, children) : children;
-    return /* @__PURE__ */ React3.createElement("div", { className: calculateClass(className, !hasBorder && "no-border") }, displayHeader ? /* @__PURE__ */ React3.createElement(
-      Header,
-      {
-        className: calculateClass(
-          collapsePressable.touching && "touching",
-          collapsible && collapsed && "collapsed"
-        )
-      },
-      collapsible && /* @__PURE__ */ React3.createElement(
-        CollapseIcon,
-        {
-          icon: collapsed ? "arrow_right" : "arrow_drop_down",
-          ...collapsePressable.handlers
-        }
-      ),
-      info.labels?.map((l2) => /* @__PURE__ */ React3.createElement(Label, null, l2.text)),
-      showTitle && (info.editableTitle ? editingTitle ? /* @__PURE__ */ React3.createElement(
-        TitleInput,
+    const childrenElements = hasBorder ? /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(StyledNestedContent, { children }) : children;
+    return /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("div", { className: calculateClass(className, !hasBorder && "no-border"), children: [
+      displayHeader ? /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(
+        Header,
         {
-          ref: (input) => input?.focus(),
-          onBlur: updateTitle,
-          onKeyDown: keyDown,
-          defaultValue: info.title
+          className: calculateClass(
+            collapsePressable.touching && "touching",
+            collapsible && collapsed && "collapsed"
+          ),
+          children: [
+            collapsible && /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
+              CollapseIcon,
+              {
+                icon: collapsed ? "arrow_right" : "arrow_drop_down",
+                ...collapsePressable.handlers
+              }
+            ),
+            info.labels?.map((l2) => /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(Label, { children: l2.text })),
+            showTitle && (info.editableTitle ? editingTitle ? /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
+              TitleInput,
+              {
+                ref: (input) => input?.focus(),
+                onBlur: updateTitle,
+                onKeyDown: keyDown,
+                defaultValue: info.title
+              }
+            ) : /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(EditableTitle, { onClick: () => setEditingTitle(true), children: [
+              /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("span", { children: info.title }),
+              /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(Icon, { className: "icon", icon: "edit" })
+            ] }) : /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("span", { children: info.title })),
+            collapsible ? /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(CollapseBar, { ...collapsePressable.handlers }) : /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(Grow, {}),
+            info.headers?.map((h) => h.children.map((c2) => renderComponent(c2)))
+          ]
         }
-      ) : /* @__PURE__ */ React3.createElement(EditableTitle, { onClick: () => setEditingTitle(true) }, /* @__PURE__ */ React3.createElement("span", null, info.title), /* @__PURE__ */ React3.createElement(Icon, { className: "icon", icon: "edit" })) : /* @__PURE__ */ React3.createElement("span", null, info.title)),
-      collapsible ? /* @__PURE__ */ React3.createElement(CollapseBar, { ...collapsePressable.handlers }) : /* @__PURE__ */ React3.createElement(Grow, null),
-      info.headers?.map((h) => h.children.map((c2) => renderComponent2(c2)))
-    ) : null, collapsible && collapsed ? null : childrenElements);
+      ) : null,
+      collapsible && collapsed ? null : childrenElements
+    ] });
   };
   Group.displayName = "Group";
   var StyledGroup = dt(Group)`
@@ -25502,85 +26488,11 @@ body {
     margin: 0 !important;
   }
 `;
-
-  // src/frontend/components/button.tsx
-  var React4 = __toESM(require_react());
-  var TOUCH_INDICATOR_CLASS = "touch-indicator";
-  var TOUCHING_CLASS = "touching";
-  var ERROR_CLASS = "error";
-  var ButtonContents = dt.div`
-  padding: 6px 4px;
-  display: flex;
-  justify-content: center;
-  align-items: center;
-
-  > * {
-    padding: 0;
-  }
-`;
-  var ButtonLabel = dt.span`
-  padding: 0 4px;
-`;
-  var Button = (props) => {
-    const { sendMessage } = React4.useContext(StageContext);
-    const { touching, handlers } = usePressable(
-      () => sendMessage?.({
-        type: "component-message",
-        componentKey: props.info.key,
-        component: "button"
-      })
-    );
-    const { state } = props.info;
-    return /* @__PURE__ */ React4.createElement(
-      "div",
-      {
-        className: calculateClass(
-          props.className,
-          touching || state.state === "pressed" ? TOUCHING_CLASS : null,
-          state.state === "error" && ERROR_CLASS
-        ),
-        ...handlers,
-        title: state.state === "error" ? state.error : void 0
-      },
-      /* @__PURE__ */ React4.createElement("div", { className: TOUCH_INDICATOR_CLASS }),
-      /* @__PURE__ */ React4.createElement(ButtonContents, null, props.info.icon && /* @__PURE__ */ React4.createElement(Icon, { icon: props.info.icon }), props.info.text && /* @__PURE__ */ React4.createElement(ButtonLabel, null, props.info.text))
-    );
-  };
-  var StyledButton = dt(Button)`
-  ${rectButton}
-  outline: none;
-  height: 30px;
-  position: relative;
-  overflow: visible;
-
-  .${TOUCH_INDICATOR_CLASS} {
-    ${touchIndicatorNormal}
-  }
-
-  &.${ERROR_CLASS} {
-    color: ${THEME.colorRed};
-    border-color: ${THEME.colorRed};
-  }
-
-  &.${TOUCHING_CLASS} {
-    ${buttonStateNormalActive}
-
-    .${TOUCH_INDICATOR_CLASS} {
-      ${touchIndicatorTouching}
-    }
-  }
-`;
-
-  // src/frontend/components/label.tsx
-  var React5 = __toESM(require_react());
-  var Label2 = ({ className, info }) => /* @__PURE__ */ React5.createElement("div", { className }, info.text);
+  var Label2 = ({ className, info }) => /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("div", { className, children: info.text });
   var StyledLabel = dt(Label2)`
   font-weight: ${(p2) => p2.info.bold ? "bold" : "normal"};
   white-space: nowrap;
 `;
-
-  // src/frontend/components/rect.tsx
-  var React6 = __toESM(require_react());
   var TRANSPARENCY_SVG = `
 <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 10 10">
   <rect width="10px" height="10px" fill="#333" />
@@ -25601,10 +26513,7 @@ body {
   width: 100%;
   height: 100%;
 `;
-  var Rect = ({ className, info }) => /* @__PURE__ */ React6.createElement(Wrapper, { className }, /* @__PURE__ */ React6.createElement(Inner, { style: { backgroundColor: info.color } }));
-
-  // src/frontend/components/slider_button.tsx
-  var React7 = __toESM(require_react());
+  var Rect = ({ className, info }) => /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(Wrapper, { className, children: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(Inner, { style: { backgroundColor: info.color } }) });
   var CLASS_SLIDER_DISPLAY = "slider-display";
   var CLASS_SLIDER_VALUE = "slider-value";
   var OPEN_SLIDER_WIDTH = 400;
@@ -25627,8 +26536,8 @@ body {
     return pageX - rect.left;
   };
   var SliderButton = (props) => {
-    const [state, setState] = React7.useState({ state: "closed" });
-    const input = React7.useRef(null);
+    const [state, setState] = import_react7.default.useState({ state: "closed" });
+    const input = import_react7.default.useRef(null);
     const displayValue = (value2) => {
       if (props.info.max === 1 && props.info.min === 0) {
         return `${Math.round(value2 * 100)}%`;
@@ -25718,29 +26627,31 @@ body {
     const value = state.state === "touching" ? getNewValue(state.startValue, state.diff) : props.info.value;
     const valueDisplay = value !== null ? displayValue(value) : "";
     const valueCSSPercent = value ? (value - props.info.min) / (props.info.max - props.info.min) * 100 + "%" : "0";
-    return /* @__PURE__ */ React7.createElement("div", { className: [props.className, `state-${state.state}`].join(" ") }, /* @__PURE__ */ React7.createElement(
+    return /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("div", { className: [props.className, `state-${state.state}`].join(" "), children: /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)(
       "div",
       {
         className: "inner",
         onMouseDown: () => setState({ state: "mouse-down" }),
         onMouseUp: () => input.current?.focus(),
         onTouchStart,
-        style: state.state === "touching" ? { left: state.innerLeft } : {}
-      },
-      /* @__PURE__ */ React7.createElement(
-        "input",
-        {
-          type: "text",
-          ref: input,
-          onFocus,
-          onBlur,
-          onKeyDown
-        }
-      ),
-      /* @__PURE__ */ React7.createElement("div", { className: CLASS_SLIDER_VALUE }, valueDisplay),
-      /* @__PURE__ */ React7.createElement("div", { className: CLASS_SLIDER_DISPLAY }, /* @__PURE__ */ React7.createElement("div", { className: "inner", style: { width: valueCSSPercent } })),
-      /* @__PURE__ */ React7.createElement("div", { className: CLASS_SLIDER_VALUE }, valueDisplay)
-    ));
+        style: state.state === "touching" ? { left: state.innerLeft } : {},
+        children: [
+          /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
+            "input",
+            {
+              type: "text",
+              ref: input,
+              onFocus,
+              onBlur,
+              onKeyDown
+            }
+          ),
+          /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("div", { className: CLASS_SLIDER_VALUE, children: valueDisplay }),
+          /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("div", { className: CLASS_SLIDER_DISPLAY, children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("div", { className: "inner", style: { width: valueCSSPercent } }) }),
+          /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("div", { className: CLASS_SLIDER_VALUE, children: valueDisplay })
+        ]
+      }
+    ) });
   };
   var StyledSliderButton = dt(SliderButton)`
   position: relative;
@@ -25838,15 +26749,12 @@ body {
     }
   }
 `;
-  var SliderButtonWrapper = (props) => /* @__PURE__ */ React7.createElement(StageContext.Consumer, null, ({ sendMessage }) => /* @__PURE__ */ React7.createElement(StyledSliderButton, { ...props, sendMessage }));
-
-  // src/frontend/components/switch.tsx
-  var import_react5 = __toESM(require_react());
+  var SliderButtonWrapper = (props) => /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(StageContext.Consumer, { children: ({ sendMessage }) => /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(StyledSliderButton, { ...props, sendMessage }) });
   var CLASS_TOUCHING = "touching";
   var TOUCH_INDICATOR_CLASS2 = "touch-indicator";
   var Switch = ({ className, info, sendMessage }) => {
-    const [touching, setTouching] = (0, import_react5.useState)(false);
-    const onClick = (0, import_react5.useMemo)(
+    const [touching, setTouching] = (0, import_react8.useState)(false);
+    const onClick = (0, import_react8.useMemo)(
       () => () => {
         if (!sendMessage) return;
         console.log("sending message");
@@ -25858,14 +26766,14 @@ body {
       },
       [sendMessage, info.key]
     );
-    const onTouchStart = (0, import_react5.useMemo)(
+    const onTouchStart = (0, import_react8.useMemo)(
       () => (event) => {
         event.preventDefault();
         setTouching(true);
       },
       []
     );
-    const onTouchEnd = (0, import_react5.useMemo)(
+    const onTouchEnd = (0, import_react8.useMemo)(
       () => (event) => {
         event.preventDefault();
         setTouching(false);
@@ -25873,16 +26781,22 @@ body {
       },
       []
     );
-    return /* @__PURE__ */ import_react5.default.createElement(
+    return /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)(
       "div",
       {
         className: calculateClass(className, touching && CLASS_TOUCHING),
         onClick,
         onTouchStart,
-        onTouchEnd
-      },
-      /* @__PURE__ */ import_react5.default.createElement("div", { className: TOUCH_INDICATOR_CLASS2 }),
-      /* @__PURE__ */ import_react5.default.createElement("div", { className: "inner" }, /* @__PURE__ */ import_react5.default.createElement("div", { className: "slider" + (info.state === "on" ? " on" : "") }, /* @__PURE__ */ import_react5.default.createElement("div", { className: "on-text" }, "ON"), /* @__PURE__ */ import_react5.default.createElement("div", { className: "off-text" }, "OFF"), /* @__PURE__ */ import_react5.default.createElement("div", { className: "button" })))
+        onTouchEnd,
+        children: [
+          /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("div", { className: TOUCH_INDICATOR_CLASS2 }),
+          /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("div", { className: "inner", children: /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("div", { className: "slider" + (info.state === "on" ? " on" : ""), children: [
+            /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("div", { className: "on-text", children: "ON" }),
+            /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("div", { className: "off-text", children: "OFF" }),
+            /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("div", { className: "button" })
+          ] }) })
+        ]
+      }
     );
   };
   var SWITCH_HEIGHT = 30;
@@ -25972,10 +26886,7 @@ body {
     }
   }
 `;
-  var SwitchWrapper = (props) => /* @__PURE__ */ import_react5.default.createElement(StageContext.Consumer, null, ({ sendMessage }) => /* @__PURE__ */ import_react5.default.createElement(StyledSwitch, { ...props, sendMessage }));
-
-  // src/frontend/components/tabs.tsx
-  var React9 = __toESM(require_react());
+  var SwitchWrapper = (props) => /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(StageContext.Consumer, { children: ({ sendMessage }) => /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(StyledSwitch, { ...props, sendMessage }) });
   var Wrapper2 = dt.div`
   display: flex;
   flex-direction: column;
@@ -26014,45 +26925,48 @@ body {
   }
 `;
   var Tabs = (props) => {
-    const { renderComponent: renderComponent2 } = React9.useContext(StageContext);
-    const [touching, setTouching] = React9.useState(null);
-    const [currentTab, setCurrentTab] = React9.useState(0);
+    const { renderComponent } = import_react9.default.useContext(StageContext);
+    const [touching, setTouching] = import_react9.default.useState(null);
+    const [currentTab, setCurrentTab] = import_react9.default.useState(0);
     const tab = props.info.tabs[currentTab];
-    return /* @__PURE__ */ React9.createElement(Wrapper2, null, /* @__PURE__ */ React9.createElement(TabList, null, props.info.tabs.map((tab2, i2) => /* @__PURE__ */ React9.createElement(
-      TabItem,
-      {
-        key: i2,
-        className: calculateClass(
-          touching === i2 && "touching",
-          currentTab === i2 && "current"
-        ),
-        onClick: () => setCurrentTab(i2),
-        onTouchStart: (event) => {
-          event.preventDefault();
-          setTouching(i2);
+    return /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)(Wrapper2, { children: [
+      /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(TabList, { children: props.info.tabs.map((tab2, i2) => /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
+        TabItem,
+        {
+          className: calculateClass(
+            touching === i2 && "touching",
+            currentTab === i2 && "current"
+          ),
+          onClick: () => setCurrentTab(i2),
+          onTouchStart: (event) => {
+            event.preventDefault();
+            setTouching(i2);
+          },
+          onTouchEnd: (event) => {
+            event.preventDefault();
+            setTouching(null);
+            setCurrentTab(i2);
+          },
+          children: tab2.name
         },
-        onTouchEnd: (event) => {
-          event.preventDefault();
-          setTouching(null);
-          setCurrentTab(i2);
-        }
-      },
-      tab2.name
-    ))), /* @__PURE__ */ React9.createElement(StyledNestedContent, null, tab?.child && renderComponent2(tab.child)));
+        i2
+      )) }),
+      /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(StyledNestedContent, { children: tab?.child && renderComponent(tab.child) })
+    ] });
   };
-
-  // src/frontend/components/text-input.tsx
-  var React10 = __toESM(require_react());
-  var TextInput = ({
-    className,
-    info,
-    sendMessage
-  }) => {
-    return /* @__PURE__ */ React10.createElement(
+  var TextInput = ({ className, info, sendMessage }) => {
+    const ref = import_react10.default.useRef(null);
+    (0, import_react10.useEffect)(() => {
+      if (ref.current && ref.current.value !== info.value) {
+        ref.current.value = info.value;
+      }
+    }, [info.value]);
+    return /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
       "input",
       {
         className,
-        value: info.value,
+        defaultValue: info.value,
+        ref,
         onChange: (ev) => sendMessage?.({
           type: "component-message",
           componentKey: info.key,
@@ -26078,10 +26992,7 @@ body {
     flex-basis: 100%;
   }
 `;
-  var TextInputWrapper = (props) => /* @__PURE__ */ React10.createElement(StageContext.Consumer, null, ({ sendMessage }) => /* @__PURE__ */ React10.createElement(StyledTextInput, { ...props, sendMessage }));
-
-  // src/frontend/components/timeline.tsx
-  var import_react6 = __toESM(require_react());
+  var TextInputWrapper = (props) => /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(StageContext.Consumer, { children: ({ sendMessage }) => /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(StyledTextInput, { ...props, sendMessage }) });
   var Wrapper3 = dt.div`
   flex-grow: 1;
 `;
@@ -26122,12 +27033,12 @@ body {
 `;
   var Timeline = (props) => {
     const { className, info } = props;
-    const frameState = import_react6.default.useRef({
+    const frameState = import_react11.default.useRef({
       animationFrame: -1,
       state: null
     });
-    const [currentTimeMillis, setCurrentTimeMillis] = (0, import_react6.useState)(0);
-    (0, import_react6.useEffect)(() => {
+    const [currentTimeMillis, setCurrentTimeMillis] = (0, import_react11.useState)(0);
+    (0, import_react11.useEffect)(() => {
       frameState.current.state = info.state;
       const recalculateCurrentTimeMillis = () => {
         if (frameState.current.state !== info.state) {
@@ -26149,43 +27060,52 @@ body {
         window.cancelAnimationFrame(frameState.current.animationFrame);
       };
     }, [frameState, info.state]);
-    return /* @__PURE__ */ import_react6.default.createElement(Wrapper3, { className }, /* @__PURE__ */ import_react6.default.createElement(Data, null, /* @__PURE__ */ import_react6.default.createElement(Metadata, null, info.title && /* @__PURE__ */ import_react6.default.createElement(Title, null, info.title), info.subtitles?.map((subtitle, k2) => /* @__PURE__ */ import_react6.default.createElement(Subtitle, { key: k2 }, subtitle))), /* @__PURE__ */ import_react6.default.createElement(SourceData, null, info.source?.name, /* @__PURE__ */ import_react6.default.createElement(
-      IndicatorIcon,
-      {
-        icon: info.state.state === "playing" ? "play_arrow" : "pause"
-      }
-    ))), /* @__PURE__ */ import_react6.default.createElement(Bar, null, /* @__PURE__ */ import_react6.default.createElement(
-      Fill,
-      {
-        style: {
-          width: `${Math.min(100, 100 * currentTimeMillis / info.state.totalTimeMillis)}%`
+    return /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)(Wrapper3, { className, children: [
+      /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)(Data, { children: [
+        /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)(Metadata, { children: [
+          info.title && /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(Title, { children: info.title }),
+          info.subtitles?.map((subtitle, k2) => /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(Subtitle, { children: subtitle }, k2))
+        ] }),
+        /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)(SourceData, { children: [
+          info.source?.name,
+          /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
+            IndicatorIcon,
+            {
+              icon: info.state.state === "playing" ? "play_arrow" : "pause"
+            }
+          )
+        ] })
+      ] }),
+      /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(Bar, { children: /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
+        Fill,
+        {
+          style: {
+            width: `${Math.min(100, 100 * currentTimeMillis / info.state.totalTimeMillis)}%`
+          }
         }
-      }
-    )));
+      ) })
+    ] });
   };
-
-  // src/frontend/stage.tsx
-  var renderComponent = (info) => {
+  var renderStandardComponent = (info) => {
     switch (info.component) {
       case "button":
-        return /* @__PURE__ */ React12.createElement(StyledButton, { key: info.key, info });
+        return /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(StyledButton, { info }, info.key);
       case "group":
-        return /* @__PURE__ */ React12.createElement(StyledGroup, { key: info.key, info });
+        return /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(StyledGroup, { info }, info.key);
       case "label":
-        return /* @__PURE__ */ React12.createElement(StyledLabel, { key: info.key, info });
+        return /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(StyledLabel, { info }, info.key);
       case "rect":
-        return /* @__PURE__ */ React12.createElement(Rect, { key: info.key, info });
+        return /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(Rect, { info }, info.key);
       case "slider_button":
-        return /* @__PURE__ */ React12.createElement(SliderButtonWrapper, { key: info.key, info });
+        return /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(SliderButtonWrapper, { info }, info.key);
       case "switch":
-        return /* @__PURE__ */ React12.createElement(SwitchWrapper, { key: info.key, info });
+        return /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(SwitchWrapper, { info }, info.key);
       case "tabs":
-        return /* @__PURE__ */ React12.createElement(Tabs, { key: info.key, info });
+        return /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(Tabs, { info }, info.key);
       case "text-input":
-        return /* @__PURE__ */ React12.createElement(TextInputWrapper, { key: info.key, info });
+        return /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(TextInputWrapper, { info }, info.key);
       case "timeline":
-        return /* @__PURE__ */ React12.createElement(Timeline, { key: info.key, info });
-      // Parent-Specific Components
+        return /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(Timeline, { info }, info.key);
       case "group-header":
       case "tab":
         throw new Error(
@@ -26193,12 +27113,28 @@ body {
         );
     }
   };
+
+  // src/shared/static.ts
+  var FONTS = {
+    materialSymbolsOutlined: "material-symbols-outlined.woff2"
+  };
+
+  // src/frontend/styling.ts
+  var MaterialFontStyle = ft`
+@font-face {
+  font-family: 'Material Symbols Outlined';
+  font-style: normal;
+  src: url(${FONTS.materialSymbolsOutlined}) format('woff');
+}
+`;
+
+  // src/frontend/stage.tsx
   var Stage = ({ className }) => {
-    const [root2, setRoot] = React12.useState(
+    const [root2, setRoot] = React5.useState(
       void 0
     );
-    const socket = React12.useRef(null);
-    React12.useEffect(() => {
+    const socket = React5.useRef(null);
+    React5.useEffect(() => {
       initializeWebsocket();
     }, []);
     const initializeWebsocket = async () => {
@@ -26239,15 +27175,15 @@ body {
           return;
       }
     };
-    return /* @__PURE__ */ React12.createElement(
+    return /* @__PURE__ */ React5.createElement(
       StageContext.Provider,
       {
         value: {
           sendMessage,
-          renderComponent
+          renderComponent: renderStandardComponent
         }
       },
-      /* @__PURE__ */ React12.createElement(GroupStateWrapper, { openByDefault: false }, /* @__PURE__ */ React12.createElement("div", { className }, root2 ? /* @__PURE__ */ React12.createElement(StyledGroup, { info: root2 }) : /* @__PURE__ */ React12.createElement("div", { className: "no-root" }, "No root has been added to the light desk")))
+      /* @__PURE__ */ React5.createElement(GroupStateWrapper, { openByDefault: false }, /* @__PURE__ */ React5.createElement("div", { className }, root2 ? /* @__PURE__ */ React5.createElement(StyledGroup, { info: root2 }) : /* @__PURE__ */ React5.createElement("div", { className: "no-root" }, "No root has been added to the light desk")))
     );
   };
   var StyledStage = dt(Stage)`
@@ -26258,7 +27194,7 @@ body {
   padding: ${THEME.sizingPx.spacing}px;
 `;
   function rootComponent() {
-    return /* @__PURE__ */ React12.createElement(React12.Fragment, null, /* @__PURE__ */ React12.createElement(BaseStyle, null), /* @__PURE__ */ React12.createElement(GlobalStyle, null), /* @__PURE__ */ React12.createElement(ot, { theme: THEME }, /* @__PURE__ */ React12.createElement(StyledStage, null)));
+    return /* @__PURE__ */ React5.createElement(React5.Fragment, null, /* @__PURE__ */ React5.createElement(BaseStyle, null), /* @__PURE__ */ React5.createElement(GlobalStyle, null), /* @__PURE__ */ React5.createElement(MaterialFontStyle, null), /* @__PURE__ */ React5.createElement(ot, { theme: THEME }, /* @__PURE__ */ React5.createElement(StyledStage, null)));
   }
 
   // src/frontend/frontend.ts
@@ -26317,5 +27253,16 @@ react-dom/cjs/react-dom.development.js:
    * @internal
    * @license Modernizr 3.0.0pre (Custom Build) | MIT
    *)
+
+react/cjs/react-jsx-runtime.development.js:
+  (**
+   * @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.
+   *)
 */
 //# sourceMappingURL=frontend.js.map