@hanzogui/web 8.3.1 → 8.3.2

package/dist/cjs/createComponent.native.js

@@ -1,1078 +0,0 @@
-"use strict";
-
-var __create = Object.create;
-var __defProp = Object.defineProperty;
-var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
-var __getOwnPropNames = Object.getOwnPropertyNames;
-var __getProtoOf = Object.getPrototypeOf;
-var __hasOwnProp = Object.prototype.hasOwnProperty;
-var __export = (target, all) => {
-  for (var name in all) __defProp(target, name, {
-    get: all[name],
-    enumerable: true
-  });
-};
-var __copyProps = (to, from, except, desc) => {
-  if (from && typeof from === "object" || typeof from === "function") {
-    for (let key of __getOwnPropNames(from)) if (!__hasOwnProp.call(to, key) && key !== except) __defProp(to, key, {
-      get: () => from[key],
-      enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable
-    });
-  }
-  return to;
-};
-var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
-// If the importer is in node compatibility mode or this is not an ESM
-// file that has been converted to a CommonJS file using a Babel-
-// compatible transform (i.e. "__esModule" has not been set), then set
-// "default" to the CommonJS "module.exports" for node compatibility.
-isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", {
-  value: mod,
-  enumerable: true
-}) : target, mod));
-var __toCommonJS = mod => __copyProps(__defProp({}, "__esModule", {
-  value: true
-}), mod);
-var createComponent_exports = {};
-__export(createComponent_exports, {
-  componentSetStates: () => componentSetStates,
-  createComponent: () => createComponent
-});
-module.exports = __toCommonJS(createComponent_exports);
-var import_jsx_runtime = require("react/jsx-runtime");
-var import_compose_refs = require("@hanzogui/compose-refs");
-var import_constants = require("@hanzogui/constants");
-var import_native = require("@hanzogui/native");
-var import_helpers = require("@hanzogui/helpers");
-var import_is_equal_shallow = require("@hanzogui/is-equal-shallow");
-var import_react = __toESM(require("react"), 1);
-var import_config = require("./config.native.js");
-var import_isDevTools = require("./constants/isDevTools.native.js");
-var import_ComponentContext = require("./contexts/ComponentContext.native.js");
-var import_GroupContext = require("./contexts/GroupContext.native.js");
-var import_createVariable = require("./createVariable.native.js");
-var import_defaultComponentState = require("./defaultComponentState.native.js");
-var import_eventHandling = require("./eventHandling.native.js");
-var import_getDefaultProps = require("./helpers/getDefaultProps.native.js");
-var import_resolveAnimationDriver = require("./helpers/resolveAnimationDriver.native.js");
-var import_getSplitStyles = require("./helpers/getSplitStyles.native.js");
-var import_log = require("./helpers/log.native.js");
-var import_mergeProps = require("./helpers/mergeProps.native.js");
-var import_mergeRenderElementProps = require("./helpers/mergeRenderElementProps.native.js");
-var import_objectIdentityKey = require("./helpers/objectIdentityKey.native.js");
-var import_pointerEvents = require("./helpers/pointerEvents.native.js");
-var import_pseudoTransitions = require("./helpers/pseudoTransitions.native.js");
-var import_setElementProps = require("./helpers/setElementProps.native.js");
-var import_subscribeToContextGroup = require("./helpers/subscribeToContextGroup.native.js");
-var import_themeable = require("./helpers/themeable.native.js");
-require("./helpers/wrapStyleTags.native.js");
-var import_useComponentState = require("./hooks/useComponentState.native.js");
-var import_useMedia = require("./hooks/useMedia.native.js");
-var import_useTheme = require("./hooks/useTheme.native.js");
-var import_setupHooks = require("./setupHooks.native.js");
-var import_Slot = require("./views/Slot.native.js");
-var import_Theme = require("./views/Theme.native.js");
-function _type_of(obj) {
-  "@swc/helpers - typeof";
-
-  return obj && typeof Symbol !== "undefined" && obj.constructor === Symbol ? "symbol" : typeof obj;
-}
-var dataSlotCache = /* @__PURE__ */new Map();
-var dataSlotFor = function (name) {
-  var slot = dataSlotCache.get(name);
-  if (slot === void 0) {
-    slot = name.replace(/([A-Z]+)([A-Z][a-z])/g, "$1-$2").replace(/([a-z0-9])([A-Z])/g, "$1-$2").toLowerCase();
-    dataSlotCache.set(name, slot);
-  }
-  return slot;
-};
-var time;
-var debugKeyListeners;
-var startVisualizer;
-var componentSetStates = /* @__PURE__ */new Set();
-var avoidReRenderKeys = /* @__PURE__ */new Set(["hover", "press", "pressIn", "group", "focus", "focusWithin", "media", "group"]);
-var groupPseudoKeys = ["disabled", "hover", "press", "pressIn", "focus", "focusVisible", "focusWithin"];
-var BaseText;
-var BaseView;
-var hasSetupBaseViews = false;
-var lastInteractionWasKeyboard = {
-  value: false
-};
-var lastInteractionWasTouch = {
-  value: false
-};
-if (import_constants.isWeb && typeof document !== "undefined") {
-  document.addEventListener("keydown", function () {
-    if (!lastInteractionWasKeyboard.value) lastInteractionWasKeyboard.value = true;
-  });
-  document.addEventListener("mousedown", function () {
-    if (lastInteractionWasKeyboard.value) lastInteractionWasKeyboard.value = false;
-  });
-  document.addEventListener("mousemove", function () {
-    if (lastInteractionWasKeyboard.value) lastInteractionWasKeyboard.value = false;
-    lastInteractionWasTouch.value = false;
-  });
-  document.addEventListener("touchstart", function () {
-    lastInteractionWasTouch.value = true;
-  });
-}
-function createComponent(staticConfig) {
-  var config = null;
-  var {
-    Component,
-    isText,
-    isHOC
-  } = staticConfig;
-  var component = /* @__PURE__ */import_react.default.forwardRef(function (propsIn, forwardedRef) {
-    "use no memo";
-
-    var _hooks_usePropsTransform;
-    config = config || (0, import_config.getConfig)();
-    var internalID = process.env.NODE_ENV === "development" ? import_react.default.useId() : "";
-    if (process.env.NODE_ENV === "development") {
-      if (startVisualizer) {
-        startVisualizer();
-        startVisualizer = void 0;
-      }
-    }
-    if (!hasSetupBaseViews) {
-      var _hooks_getBaseViews;
-      hasSetupBaseViews = true;
-      var baseViews = (_hooks_getBaseViews = import_setupHooks.hooks.getBaseViews) === null || _hooks_getBaseViews === void 0 ? void 0 : _hooks_getBaseViews.call(import_setupHooks.hooks);
-      if (baseViews) {
-        BaseText = baseViews.Text;
-        BaseView = baseViews.View;
-      }
-    }
-    if (process.env.NODE_ENV === "test") {
-      var testRenderCount = propsIn["data-test-renders"];
-      if (testRenderCount && (typeof testRenderCount === "undefined" ? "undefined" : _type_of(testRenderCount)) === "object" && !Object.isFrozen(testRenderCount)) {
-        var _testRenderCount_current;
-        testRenderCount.current = (_testRenderCount_current = testRenderCount.current) !== null && _testRenderCount_current !== void 0 ? _testRenderCount_current : 0;
-        testRenderCount.current += 1;
-      }
-    }
-    var {
-      context,
-      isReactNative
-    } = staticConfig;
-    var debugProp = propsIn["debug"];
-    var styledContextValue = context ? import_react.default.useContext(context) : void 0;
-    var overriddenContextProps = null;
-    var componentContext = import_react.default.useContext(import_ComponentContext.ComponentContext);
-    var hasTextAncestor = !!(import_constants.isWeb && isText ? componentContext.inText : false);
-    var isInsideNativeMenu = import_constants.isAndroid ? import_react.default.useContext(import_native.NativeMenuContext) : false;
-    if (!process.env.GUI_IS_CORE_NODE && process.env.NODE_ENV === "development" && debugProp === "profile" && !time) {
-      time = require("@hanzogui/timer").timer().start();
-      globalThis["time"] = time;
-    }
-    if (process.env.NODE_ENV === "development" && !time && globalThis.time) time = globalThis.time;
-    if (process.env.NODE_ENV === "development" && time) time`non-hanzogui time (ignore)`;
-    var props = propsIn;
-    var componentName = props.componentName || staticConfig.componentName;
-    var defaultProps = (0, import_getDefaultProps.getDefaultProps)(staticConfig, props.componentName);
-    var [nextProps, overrides] = (0, import_mergeProps.mergeComponentProps)(defaultProps, styledContextValue, propsIn);
-    props = nextProps;
-    overriddenContextProps = overrides;
-    if (process.env.NODE_ENV === "development" && import_constants.isClient) import_react.default.useEffect(function () {
-      var node;
-      var overlay = null;
-      var remove = function () {
-        if (overlay) try {
-          var _overlay_parentNode;
-          (_overlay_parentNode = overlay.parentNode) === null || _overlay_parentNode === void 0 || _overlay_parentNode.removeChild(overlay);
-          overlay = null;
-        } catch (e) {}
-      };
-      var debugVisualizerHandler = function () {
-        var show = arguments.length > 0 && arguments[0] !== void 0 ? arguments[0] : false;
-        node = stateRef.current.host;
-        if (!node) return;
-        if (show) {
-          if (!overlay) {
-            overlay = document.createElement("span");
-            overlay.style.inset = "0px";
-            overlay.style.zIndex = "1000000";
-            overlay.style.position = "absolute";
-            overlay.style.borderColor = "red";
-            overlay.style.borderWidth = "1px";
-            overlay.style.borderStyle = "dotted";
-          }
-          var dataAt = node.getAttribute("data-at") || "";
-          var dataIn = node.getAttribute("data-in") || "";
-          var tooltip = document.createElement("span");
-          tooltip.style.position = "absolute";
-          tooltip.style.top = "0px";
-          tooltip.style.left = "0px";
-          tooltip.style.padding = "3px";
-          tooltip.style.background = "rgba(0,0,0,0.75)";
-          tooltip.style.color = "rgba(255,255,255,1)";
-          tooltip.style.fontSize = "12px";
-          tooltip.style.lineHeight = "12px";
-          tooltip.style.fontFamily = "monospace";
-          tooltip.innerText = `${componentName || ""} ${dataAt} ${dataIn}`.trim();
-          overlay.appendChild(tooltip);
-          node.appendChild(overlay);
-        } else remove();
-      };
-      debugKeyListeners = debugKeyListeners || /* @__PURE__ */new Set();
-      debugKeyListeners.add(debugVisualizerHandler);
-      return function () {
-        remove();
-        debugKeyListeners === null || debugKeyListeners === void 0 || debugKeyListeners.delete(debugVisualizerHandler);
-      };
-    }, [componentName]);
-    var groupContextParent = import_react.default.useContext(import_GroupContext.GroupContext);
-    var animationDriver = function () {
-      if (props.animatedBy && config) {
-        if (config.animationDrivers) {
-          var _config_animationDrivers_props_animatedBy;
-          return (_config_animationDrivers_props_animatedBy = config.animationDrivers[props.animatedBy]) !== null && _config_animationDrivers_props_animatedBy !== void 0 ? _config_animationDrivers_props_animatedBy : config.animations;
-        }
-        return props.animatedBy === "default" ? config.animations : null;
-      }
-      var _resolveAnimationDriver, _ref4;
-      return (_ref4 = (_resolveAnimationDriver = (0, import_resolveAnimationDriver.resolveAnimationDriver)(componentContext.animationDriver)) !== null && _resolveAnimationDriver !== void 0 ? _resolveAnimationDriver : (0, import_resolveAnimationDriver.resolveAnimationDriver)(config === null || config === void 0 ? void 0 : config.animations)) !== null && _ref4 !== void 0 ? _ref4 : null;
-    }();
-    var useAnimations = animationDriver === null || animationDriver === void 0 ? void 0 : animationDriver.useAnimations;
-    var componentState = (0, import_useComponentState.useComponentState)(props, (animationDriver === null || animationDriver === void 0 ? void 0 : animationDriver.isStub) ? null : animationDriver, staticConfig, config);
-    var {
-      disabled,
-      groupName,
-      hasAnimationProp,
-      hasEnterStyle,
-      isAnimated,
-      isExiting,
-      isHydrated,
-      presence,
-      presenceState,
-      setState,
-      noClass,
-      state,
-      stateRef,
-      inputStyle,
-      outputStyle,
-      willBeAnimated,
-      willBeAnimatedClient,
-      platformPseudo,
-      startedUnhydrated
-    } = componentState;
-    if (animationDriver === null || animationDriver === void 0 ? void 0 : animationDriver.avoidReRenders) (0, import_constants.useIsomorphicLayoutEffect)(function () {
-      var emitted = stateRef.current.prevPseudoState;
-      if (emitted && (emitted.hover || emitted.press || emitted.focus)) {
-        var _stateRef_current_updateStyleListener, _stateRef_current;
-        (_stateRef_current_updateStyleListener = (_stateRef_current = stateRef.current).updateStyleListener) === null || _stateRef_current_updateStyleListener === void 0 || _stateRef_current_updateStyleListener.call(_stateRef_current);
-      }
-      var pendingState = stateRef.current.nextState;
-      if (!pendingState) return;
-      stateRef.current.nextState = void 0;
-      if (!(0, import_is_equal_shallow.isEqualShallow)(state, pendingState)) componentState.setStateShallow(pendingState);
-    });
-    (0, import_constants.useIsomorphicLayoutEffect)(function () {
-      var _getPlatformDriver;
-      if (!platformPseudo || props.disabled) return;
-      var pseudoDriver = (_getPlatformDriver = (0, import_constants.getPlatformDriver)()) === null || _getPlatformDriver === void 0 ? void 0 : _getPlatformDriver.pseudo;
-      var host = stateRef.current.host;
-      if (!pseudoDriver || !host) return;
-      return pseudoDriver.subscribe(host, function (param) {
-        var {
-          hovered
-        } = param;
-        var _stateRef_current_setStateShallow, _stateRef_current;
-        (_stateRef_current_setStateShallow = (_stateRef_current = stateRef.current).setStateShallow) === null || _stateRef_current_setStateShallow === void 0 || _stateRef_current_setStateShallow.call(_stateRef_current, {
-          hover: hovered
-        });
-      });
-    }, [platformPseudo, props.disabled]);
-    var allGroupContexts = (0, import_react.useMemo)(function () {
-      var _stateRef_current_group_listeners, _stateRef_current_group;
-      if (!groupName || props.passThrough) return groupContextParent;
-      var listeners = /* @__PURE__ */new Set();
-      (_stateRef_current_group = stateRef.current.group) === null || _stateRef_current_group === void 0 || (_stateRef_current_group_listeners = _stateRef_current_group.listeners) == null || _stateRef_current_group_listeners.clear();
-      stateRef.current.group = {
-        listeners,
-        emit(state2) {
-          listeners.forEach(function (l) {
-            return l(state2);
-          });
-        },
-        subscribe(cb) {
-          listeners.add(cb);
-          if (listeners.size === 1) setStateShallow({
-            hasDynGroupChildren: true
-          });
-          return function () {
-            listeners.delete(cb);
-            if (listeners.size === 0) setStateShallow({
-              hasDynGroupChildren: false
-            });
-          };
-        }
-      };
-      return {
-        ...groupContextParent,
-        [groupName]: {
-          state: {
-            pseudo: import_defaultComponentState.defaultComponentStateMounted
-          },
-          subscribe: function (listener) {
-            var _stateRef_current_group2;
-            var dispose = (_stateRef_current_group2 = stateRef.current.group) === null || _stateRef_current_group2 === void 0 ? void 0 : _stateRef_current_group2.subscribe(listener);
-            return function () {
-              dispose === null || dispose === void 0 || dispose();
-            };
-          }
-        }
-      };
-    }, [stateRef, groupName, groupContextParent]);
-    var setStateShallow = componentState.setStateShallow;
-    if (process.env.NODE_ENV === "development" && time) time`use-state`;
-    var renderProp = props.render;
-    var isRenderString = !Component || typeof Component === "string";
-    var element = import_constants.isWeb ? isRenderString ? renderProp || Component : Component : Component;
-    var BaseComponent = isText ? BaseText || element || "span" : BaseView || element || (hasTextAncestor ? "span" : "div");
-    var elementType = BaseComponent;
-    if (animationDriver && isAnimated && animationDriver.needsCustomComponent) elementType = animationDriver[isText ? "Text" : "View"] || elementType;
-    var disableTheme = isHOC;
-    if (process.env.NODE_ENV === "development" && time) time`theme-props`;
-    var themeStateProps = {
-      componentName,
-      disable: disableTheme,
-      shallow: props.themeShallow,
-      debug: debugProp,
-      unstyled: props.unstyled
-    };
-    if ("theme" in props) themeStateProps.name = props.theme;
-    themeStateProps.needsUpdate = function () {
-      return !!stateRef.current.isListeningToTheme;
-    };
-    themeStateProps.deopt = willBeAnimated;
-    if (process.env.NODE_ENV === "development") {
-      if (debugProp && debugProp !== "profile") {
-        var name = `${componentName || (Component === null || Component === void 0 ? void 0 : Component.displayName) || (Component === null || Component === void 0 ? void 0 : Component.name) || "[Unnamed Component]"}`;
-        var type = (hasEnterStyle ? "(hasEnter)" : " ") + (isAnimated ? "(animated)" : " ") + (isReactNative ? "(rnw)" : " ") + (noClass ? "(noClass)" : " ") + (state.press || state.pressIn ? "(PRESSED)" : " ") + (state.hover ? "(HOVERED)" : " ") + (state.focus ? "(FOCUSED)" : " ") + (state.focusWithin ? "(WITHIN FOCUSED)" : " ") + ((presenceState === null || presenceState === void 0 ? void 0 : presenceState.isPresent) === false ? "(EXIT)" : "");
-        var dataIs = propsIn["data-is"] || "";
-        var banner = `<${name} /> ${internalID} ${dataIs ? ` ${dataIs}` : ""} ${type.trim()} (hydrated: ${isHydrated}) (unmounted: ${state.unmounted})`;
-        var ch = propsIn.children;
-        var childLog = typeof ch === "string" ? ch.length > 4 ? ch.slice(0, 4) + "..." : ch : "";
-        if (childLog.length) childLog = `(children: ${childLog})`;
-        if (import_constants.isWeb) {
-          console.info(`%c ${banner}`, "background: green; color: white;");
-          if (import_constants.isServer) (0, import_log.log)({
-            noClass,
-            isAnimated,
-            isWeb: import_constants.isWeb,
-            inputStyle
-          });else {
-            console.groupEnd();
-            console.groupCollapsed(`${childLog} [inspect props, state, context \u{1F447}]`);
-            (0, import_log.log)("props in:", propsIn);
-            (0, import_log.log)("final props:", props, Object.keys(props));
-            (0, import_log.log)({
-              state,
-              staticConfig,
-              elementType,
-              themeStateProps
-            });
-            (0, import_log.log)({
-              context,
-              overriddenContextProps,
-              componentContext
-            });
-            (0, import_log.log)({
-              presence,
-              isAnimated,
-              isHOC,
-              hasAnimationProp,
-              useAnimations
-            });
-            console.groupEnd();
-          }
-        } else {
-          console.info(`
-
-------------------------------
-${banner}
-------------------------------
-`);
-          (0, import_log.log)(`children:`, props.children);
-          (0, import_log.log)({
-            overriddenContextProps,
-            styledContextValue
-          });
-          (0, import_log.log)({
-            noClass,
-            isAnimated,
-            isWeb: import_constants.isWeb,
-            inputStyle
-          });
-        }
-      }
-    }
-    if (process.env.NODE_ENV === "development" && time) time`pre-theme-media`;
-    var [theme, themeState] = (0, import_useTheme.useThemeWithState)(themeStateProps);
-    if (process.env.NODE_ENV === "development" && time) time`theme`;
-    elementType = element || elementType;
-    var isStringElement = typeof elementType === "string";
-    var mediaState = (0, import_useMedia.useMedia)(componentContext, debugProp);
-    (0, import_createVariable.setDidGetVariableValue)(false);
-    if (process.env.NODE_ENV === "development" && time) time`media`;
-    var styleProps = {
-      mediaState,
-      noClass,
-      resolveValues: isAnimated && inputStyle !== "css" || isHOC && state.unmounted == false && hasAnimationProp ? "value" : "auto",
-      isExiting,
-      isAnimated,
-      willBeAnimated,
-      styledContext: styledContextValue
-    };
-    var themeName = (themeState === null || themeState === void 0 ? void 0 : themeState.name) || "";
-    if (process.env.NODE_ENV === "development" && time) time`split-styles-prepare`;
-    var splitStyles = (0, import_getSplitStyles.useSplitStyles)(props, staticConfig, theme, themeName, state, styleProps, null, componentContext, allGroupContexts, elementType, startedUnhydrated, debugProp, animationDriver);
-    var isPassthrough = !splitStyles;
-    var contextForOverride = staticConfig.context;
-    if (splitStyles === null || splitStyles === void 0 ? void 0 : splitStyles.overriddenContextProps) {
-      var _staticConfig_parentStaticConfig;
-      var contextForProps = staticConfig.context || ((_staticConfig_parentStaticConfig = staticConfig.parentStaticConfig) === null || _staticConfig_parentStaticConfig === void 0 ? void 0 : _staticConfig_parentStaticConfig.context);
-      if (contextForProps) {
-        for (var key in splitStyles.overriddenContextProps) {
-          overriddenContextProps = overriddenContextProps || {};
-          overriddenContextProps[key] = splitStyles.overriddenContextProps[key];
-        }
-        if (!staticConfig.context) contextForOverride = contextForProps;
-      }
-    }
-    var groupContext = groupName ? (allGroupContexts === null || allGroupContexts === void 0 ? void 0 : allGroupContexts[groupName]) || null : null;
-    if (!isPassthrough && groupContext && props.containerType !== "normal") {
-      var groupState = groupContext === null || groupContext === void 0 ? void 0 : groupContext.state;
-      if (groupState && groupState.layout === void 0) {
-        var _splitStyles_style, _splitStyles_style1;
-        if (((_splitStyles_style = splitStyles.style) === null || _splitStyles_style === void 0 ? void 0 : _splitStyles_style.width) || ((_splitStyles_style1 = splitStyles.style) === null || _splitStyles_style1 === void 0 ? void 0 : _splitStyles_style1.height)) groupState.layout = {
-          width: fromPx(splitStyles.style.width),
-          height: fromPx(splitStyles.style.height)
-        };
-      }
-    }
-    var hasEnterExitTransition = props.transition && _type_of(props.transition) === "object" && !Array.isArray(props.transition) && ("enter" in props.transition || "exit" in props.transition);
-    if (!isPassthrough && (hasAnimationProp || groupName || platformPseudo) && (animationDriver === null || animationDriver === void 0 ? void 0 : animationDriver.avoidReRenders) && !hasEnterExitTransition) {
-      let updateGroupListeners2 = function () {
-        var updatedState = stateRef.current.nextState;
-        if (groupContext) {
-          var {
-            group,
-            hasDynGroupChildren,
-            unmounted,
-            transition,
-            ...childrenGroupState
-          } = updatedState;
-          notifyGroupSubscribers(groupContext, stateRef.current.group || null, childrenGroupState);
-        }
-      };
-      var ogSetStateShallow = setStateShallow;
-      stateRef.current.updateStyleListener = function () {
-        var useStyleListener = stateRef.current.useStyleListener;
-        if (!useStyleListener) {
-          var pendingState = stateRef.current.nextState;
-          if (pendingState) ogSetStateShallow(pendingState);
-          return;
-        }
-        var updatedState = stateRef.current.nextState || state;
-        var mediaState2 = stateRef.current.nextMedia;
-        var nextStyles = (0, import_getSplitStyles.getSplitStyles)(props, staticConfig, theme, themeName, updatedState, mediaState2 ? {
-          ...styleProps,
-          mediaState: mediaState2
-        } : styleProps, null, componentContext, allGroupContexts, elementType, startedUnhydrated, debugProp, animationDriver);
-        var _props_transition2;
-        var effectiveTransition2 = (0, import_pseudoTransitions.resolveEffectivePseudoTransition)(stateRef.current.prevPseudoState, updatedState, nextStyles === null || nextStyles === void 0 ? void 0 : nextStyles.pseudoTransitions, (_props_transition2 = props.transition) !== null && _props_transition2 !== void 0 ? _props_transition2 : platformPseudo ? "0ms" : void 0);
-        stateRef.current.prevPseudoState = (0, import_pseudoTransitions.extractPseudoState)(updatedState);
-        var hasActivePseudo = Boolean(updatedState.hover || updatedState.press || updatedState.pressIn || updatedState.focus || updatedState.focusWithin);
-        useStyleListener((nextStyles === null || nextStyles === void 0 ? void 0 : nextStyles.style) || {}, effectiveTransition2, hasActivePseudo);
-      };
-      componentContext.mediaEmitListeners = componentContext.mediaEmitListeners || /* @__PURE__ */new Set();
-      if (!stateRef.current.mediaEmitCleanup) {
-        var updateListener = function (next) {
-          var _stateRef_current_updateStyleListener, _stateRef_current;
-          stateRef.current.nextMedia = next;
-          (_stateRef_current_updateStyleListener = (_stateRef_current = stateRef.current).updateStyleListener) === null || _stateRef_current_updateStyleListener === void 0 || _stateRef_current_updateStyleListener.call(_stateRef_current);
-        };
-        componentContext.mediaEmitListeners.add(updateListener);
-        stateRef.current.mediaEmitCleanup = function () {
-          var _componentContext_mediaEmitListeners;
-          (_componentContext_mediaEmitListeners = componentContext.mediaEmitListeners) === null || _componentContext_mediaEmitListeners === void 0 || _componentContext_mediaEmitListeners.delete(updateListener);
-        };
-      }
-      componentContext.mediaEmit = componentContext.mediaEmit || function (next) {
-        var _iteratorNormalCompletion = true,
-          _didIteratorError = false,
-          _iteratorError = void 0;
-        try {
-          for (var _iterator = componentContext.mediaEmitListeners[Symbol.iterator](), _step; !(_iteratorNormalCompletion = (_step = _iterator.next()).done); _iteratorNormalCompletion = true) {
-            var listener = _step.value;
-            listener(next);
-          }
-        } catch (err) {
-          _didIteratorError = true;
-          _iteratorError = err;
-        } finally {
-          try {
-            if (!_iteratorNormalCompletion && _iterator.return != null) _iterator.return();
-          } finally {
-            if (_didIteratorError) throw _iteratorError;
-          }
-        }
-      };
-      stateRef.current.setStateShallow = function (nextOrGetNext) {
-        var prev = stateRef.current.nextState || state;
-        var next = typeof nextOrGetNext === "function" ? nextOrGetNext(prev) : nextOrGetNext;
-        if (next === prev || (0, import_is_equal_shallow.isEqualShallow)(prev, next)) return;
-        var canAvoidReRender = Object.keys(next).every(function (key3) {
-          return avoidReRenderKeys.has(key3);
-        });
-        var updatedState = {
-          ...prev,
-          ...next
-        };
-        stateRef.current.nextState = updatedState;
-        if (canAvoidReRender) {
-          var _stateRef_current_updateStyleListener, _stateRef_current;
-          if (process.env.NODE_ENV === "development" && debugProp && debugProp !== "profile") {
-            console.groupCollapsed(`[\u26A1\uFE0F] avoid setState`, componentName, next, {
-              updatedState,
-              props
-            });
-            console.info(stateRef.current.host);
-            console.groupEnd();
-          }
-          updateGroupListeners2();
-          (_stateRef_current_updateStyleListener = (_stateRef_current = stateRef.current).updateStyleListener) === null || _stateRef_current_updateStyleListener === void 0 || _stateRef_current_updateStyleListener.call(_stateRef_current);
-        } else {
-          if (process.env.NODE_ENV === "development" && debugProp && debugProp !== "profile") console.info(`[\u{1F40C}] re-render`, {
-            canAvoidReRender,
-            next
-          });
-          ogSetStateShallow(next);
-        }
-      };
-      setStateShallow = function (state2) {
-        var _stateRef_current_setStateShallow, _stateRef_current;
-        (_stateRef_current_setStateShallow = (_stateRef_current = stateRef.current).setStateShallow) === null || _stateRef_current_setStateShallow === void 0 || _stateRef_current_setStateShallow.call(_stateRef_current, state2);
-      };
-    }
-    if (process.env.NODE_ENV === "development" && time) time`split-styles`;
-    if (splitStyles) {
-      if (props.group && props.untilMeasured === "hide" && !stateRef.current.hasMeasured) {
-        splitStyles.style = splitStyles.style || {};
-        splitStyles.style.opacity = 0;
-      }
-      if (splitStyles.dynamicThemeAccess != null) stateRef.current.isListeningToTheme = splitStyles.dynamicThemeAccess;
-    }
-    var hasRuntimeMediaKeys = (splitStyles === null || splitStyles === void 0 ? void 0 : splitStyles.hasMedia) && splitStyles.hasMedia !== true;
-    var shouldListenForMedia = (0, import_createVariable.didGetVariableValue)() || hasRuntimeMediaKeys || noClass && (splitStyles === null || splitStyles === void 0 ? void 0 : splitStyles.hasMedia) === true;
-    var mediaListeningKeys = hasRuntimeMediaKeys ? splitStyles.hasMedia : null;
-    if (process.env.NODE_ENV === "development" && debugProp === "verbose") console.info(`useMedia() createComponent`, shouldListenForMedia, mediaListeningKeys);
-    (0, import_useMedia.setMediaShouldUpdate)(componentContext, shouldListenForMedia, mediaListeningKeys);
-    var {
-      viewProps: viewPropsIn,
-      pseudos,
-      style: splitStylesStyle,
-      classNames,
-      pseudoGroups,
-      mediaGroups
-    } = splitStyles || {};
-    var propsWithAnimation = props;
-    var {
-      asChild,
-      children,
-      themeShallow,
-      spaceDirection: _spaceDirection,
-      onPress,
-      onLongPress,
-      onPressIn,
-      onPressOut,
-      onHoverIn,
-      onHoverOut,
-      onMouseUp,
-      onMouseDown,
-      onMouseEnter,
-      onMouseLeave,
-      onFocus,
-      onBlur,
-      onDidAnimate,
-      separator,
-      passThrough,
-      forceStyle: _forceStyle,
-      onClick,
-      theme: _themeProp,
-      ...nonGuiProps
-    } = viewPropsIn || {};
-    var viewProps = nonGuiProps;
-    if (props.forceStyle) viewProps.forceStyle = props.forceStyle;
-    if (isHOC) {
-      if (typeof _themeProp !== "undefined") viewProps.theme = _themeProp;
-      if (typeof passThrough !== "undefined") viewProps.passThrough = passThrough;
-    }
-    var animationStyles;
-    var shouldUseAnimation = (inputStyle === "css" ? willBeAnimatedClient : willBeAnimated) && useAnimations && !isHOC;
-    var animatedRef;
-    if (shouldUseAnimation) {
-      var useStyleEmitter = (animationDriver === null || animationDriver === void 0 ? void 0 : animationDriver.avoidReRenders) ? function (listener) {
-        stateRef.current.useStyleListener = listener;
-      } : void 0;
-      var _props_transition;
-      var effectiveTransition = (0, import_pseudoTransitions.resolveEffectivePseudoTransition)(stateRef.current.prevPseudoState, state, splitStyles === null || splitStyles === void 0 ? void 0 : splitStyles.pseudoTransitions, (_props_transition = props.transition) !== null && _props_transition !== void 0 ? _props_transition : platformPseudo ? "0ms" : void 0);
-      if (splitStyles) splitStyles.effectiveTransition = effectiveTransition;
-      stateRef.current.prevPseudoState = (0, import_pseudoTransitions.extractPseudoState)(state);
-      var animations = useAnimations({
-        props: propsWithAnimation,
-        style: isHydrated ? splitStylesStyle || {} : {
-          ...splitStylesStyle
-        },
-        styleState: splitStyles,
-        useStyleEmitter,
-        presence,
-        componentState: state,
-        styleProps,
-        theme,
-        themeName,
-        pseudos: pseudos || null,
-        staticConfig,
-        stateRef,
-        onDidAnimate
-      });
-      if (animations) {
-        if (animations.ref) animatedRef = animations.ref;
-        if (isHydrated && animations) {
-          animationStyles = animations.style;
-          viewProps.style = animationStyles;
-          if (animations.className) viewProps.className = `${state.unmounted === "should-enter" ? "t_unmounted " : ""}${viewProps.className || ""} ${animations.className}`;
-        }
-      }
-      if (process.env.NODE_ENV === "development" && time) time`animations`;
-    }
-    if (process.env.NODE_ENV === "development" && props.untilMeasured && !props.group) console.warn(`You set the untilMeasured prop without setting group. This doesn't work, be sure to set untilMeasured on the parent that sets group, not the children that use the $group- prop.
-
-If you meant to do this, you can disable this warning - either change untilMeasured and group at the same time, or do group={conditional ? 'name' : undefined}`);
-    if (process.env.NODE_ENV === "development" && time) time`destructure`;
-    if (!isPassthrough && groupContext && props.containerType !== "normal") nonGuiProps.onLayout = (0, import_helpers.composeEventHandlers)(nonGuiProps.onLayout, function (e) {
-      var _stateRef_current_group;
-      var layout = e.nativeEvent.layout;
-      groupContext.state.layout = layout;
-      (_stateRef_current_group = stateRef.current.group) === null || _stateRef_current_group === void 0 || _stateRef_current_group.emit({
-        layout
-      });
-      if (!stateRef.current.hasMeasured && props.untilMeasured === "hide") setState(function (prev) {
-        return {
-          ...prev
-        };
-      });
-      stateRef.current.hasMeasured = true;
-    });
-    viewProps = ((_hooks_usePropsTransform = import_setupHooks.hooks.usePropsTransform) === null || _hooks_usePropsTransform === void 0 ? void 0 : _hooks_usePropsTransform.call(import_setupHooks.hooks, elementType, nonGuiProps, stateRef, stateRef.current.willHydrate)) || nonGuiProps;
-    if (!stateRef.current.composedRef) stateRef.current.composedRef = (0, import_compose_refs.composeRefs)(function (x) {
-      return stateRef.current.host = x;
-    }, forwardedRef, import_setElementProps.setElementProps, animatedRef);
-    viewProps.ref = stateRef.current.composedRef;
-    (0, import_pointerEvents.usePointerEvents)(props, viewProps);
-    if (process.env.NODE_ENV === "development") {
-      if (!isReactNative && !isText && import_constants.isWeb && !isHOC) import_react.default.Children.toArray(props.children).forEach(function (item) {
-        if (typeof item === "string" && item !== "\n") console.error(`Unexpected text node: ${item}. A text node cannot be a child of a <${staticConfig.componentName || propsIn.tag || "View"}>.`, props);
-      });
-    }
-    if (process.env.NODE_ENV === "development" && time) time`events-hooks`;
-    var unPress = function () {
-      setStateShallow({
-        press: false,
-        pressIn: false
-      });
-    };
-    if (process.env.NODE_ENV === "development" && import_constants.isWeb) (0, import_constants.useIsomorphicLayoutEffect)(function () {
-      if (debugProp === "verbose") {
-        let cssStyleDeclarationToObject2 = function (style) {
-          var styleObject = {};
-          for (var i = 0; i < style.length; i++) {
-            var prop = style[i];
-            styleObject[prop] = style.getPropertyValue(prop);
-          }
-          return styleObject;
-        };
-        var computed = stateRef.current.host ? cssStyleDeclarationToObject2(getComputedStyle(stateRef.current.host)) : {};
-        console.groupCollapsed(`Rendered > (opacity: ${computed.opacity})`);
-        console.warn(stateRef.current.host);
-        console.warn(computed);
-        console.groupEnd();
-      }
-    });
-    (0, import_constants.useIsomorphicLayoutEffect)(function () {
-      if (state.unmounted === true && hasEnterStyle) {
-        setStateShallow({
-          unmounted: "should-enter"
-        });
-        return;
-      }
-      if (state.unmounted) {
-        if (inputStyle === "css") {
-          var cancelled = false;
-          requestAnimationFrame(function () {
-            if (cancelled) return;
-            requestAnimationFrame(function () {
-              if (cancelled) return;
-              setStateShallow({
-                unmounted: false
-              });
-            });
-          });
-          return function () {
-            cancelled = true;
-          };
-        }
-        setStateShallow({
-          unmounted: false
-        });
-      }
-      return function () {
-        var _stateRef_current_mediaEmitCleanup, _stateRef_current;
-        componentSetStates.delete(setState);
-        (_stateRef_current_mediaEmitCleanup = (_stateRef_current = stateRef.current).mediaEmitCleanup) === null || _stateRef_current_mediaEmitCleanup === void 0 || _stateRef_current_mediaEmitCleanup.call(_stateRef_current);
-      };
-    }, [state.unmounted, inputStyle]);
-    (0, import_constants.useIsomorphicLayoutEffect)(function () {
-      if (disabled) return;
-      if (!pseudoGroups && !mediaGroups) return;
-      if (!allGroupContexts) return;
-      return (0, import_subscribeToContextGroup.subscribeToContextGroup)({
-        groupContext: allGroupContexts,
-        setStateShallow,
-        mediaGroups,
-        pseudoGroups
-      });
-    }, [allGroupContexts, disabled, pseudoGroups ? (0, import_objectIdentityKey.objectIdentityKey)(pseudoGroups) : 0, mediaGroups ? (0, import_objectIdentityKey.objectIdentityKey)(mediaGroups) : 0]);
-    var groupEmitter = stateRef.current.group;
-    (0, import_constants.useIsomorphicLayoutEffect)(function () {
-      if (!groupContext || !groupEmitter) return;
-      notifyGroupSubscribers(groupContext, groupEmitter, state);
-    }, [groupContext, groupEmitter, state]);
-    var runtimePressStyle = !disabled && noClass && (pseudos === null || pseudos === void 0 ? void 0 : pseudos.pressStyle);
-    var runtimeFocusStyle = !disabled && noClass && (pseudos === null || pseudos === void 0 ? void 0 : pseudos.focusStyle);
-    var runtimeFocusVisibleStyle = !disabled && noClass && (pseudos === null || pseudos === void 0 ? void 0 : pseudos.focusVisibleStyle);
-    var attachFocus = Boolean(runtimePressStyle || runtimeFocusStyle || runtimeFocusVisibleStyle || onFocus || onBlur || !!componentContext.setParentFocusState);
-    var hasDynamicGroupChildren = Boolean(groupName && state.hasDynGroupChildren);
-    var attachPress = Boolean(hasDynamicGroupChildren || runtimePressStyle || onPress || onPressOut || onPressIn || onMouseDown || onMouseUp || onLongPress || onClick || (pseudos === null || pseudos === void 0 ? void 0 : pseudos.focusVisibleStyle));
-    var runtimeHoverStyle = !disabled && noClass && (pseudos === null || pseudos === void 0 ? void 0 : pseudos.hoverStyle);
-    var needsHoverState = Boolean(hasDynamicGroupChildren || runtimeHoverStyle && !platformPseudo);
-    var attachHover = (import_constants.isWeb || import_constants.isNativeDesktop) && !!(hasDynamicGroupChildren || needsHoverState || onMouseEnter || onMouseLeave);
-    var shouldAttach = !disabled && !props.asChild && Boolean(attachFocus || attachPress || attachHover || runtimePressStyle || runtimeHoverStyle || runtimeFocusStyle);
-    var needsPressState = Boolean(hasDynamicGroupChildren || runtimePressStyle);
-    if (process.env.NODE_ENV === "development" && time) time`events-setup`;
-    if (process.env.NODE_ENV === "development" && debugProp === "verbose") (0, import_log.log)(`\u{1FAA9} events()`, {
-      runtimeFocusStyle,
-      runtimePressStyle,
-      runtimeHoverStyle,
-      runtimeFocusVisibleStyle,
-      attachPress,
-      attachFocus,
-      attachHover,
-      shouldAttach,
-      needsHoverState,
-      pseudos
-    });
-    var events = shouldAttach ? {
-      onPressOut: attachPress ? function (e) {
-        unPress();
-        onPressOut === null || onPressOut === void 0 || onPressOut(e);
-        onMouseUp === null || onMouseUp === void 0 || onMouseUp(e);
-      } : void 0,
-      ...((attachHover || attachPress) && {
-        onMouseEnter: function (e) {
-          var next = {};
-          if (needsHoverState && !lastInteractionWasTouch.value) next.hover = true;
-          if (needsPressState) {
-            if (state.pressIn) next.press = true;
-          }
-          setStateShallow(next);
-          onHoverIn === null || onHoverIn === void 0 || onHoverIn(e);
-          onMouseEnter === null || onMouseEnter === void 0 || onMouseEnter(e);
-        },
-        onMouseLeave: function (e) {
-          var next = {};
-          if (needsHoverState) next.hover = false;
-          if (needsPressState) {
-            next.press = false;
-            next.pressIn = false;
-          }
-          setStateShallow(next);
-          onHoverOut === null || onHoverOut === void 0 || onHoverOut(e);
-          onMouseLeave === null || onMouseLeave === void 0 || onMouseLeave(e);
-        }
-      }),
-      onPressIn: attachPress ? function (e) {
-        if (needsPressState) setStateShallow({
-          press: true,
-          pressIn: true
-        });
-        onPressIn === null || onPressIn === void 0 || onPressIn(e);
-        onMouseDown === null || onMouseDown === void 0 || onMouseDown(e);
-        if (import_constants.isWeb) componentSetStates.add(setState);
-      } : void 0,
-      onPress: attachPress ? function (e) {
-        unPress();
-        onPress === null || onPress === void 0 || onPress(e);
-      } : void 0,
-      ...(attachPress && onLongPress && {
-        onLongPress: function (e) {
-          unPress();
-          onLongPress === null || onLongPress === void 0 || onLongPress(e);
-        }
-      }),
-      ...(attachFocus && {
-        onFocus: function (e) {
-          var next = {};
-          if (componentContext.setParentFocusState) {
-            componentContext.setParentFocusState({
-              focusWithin: true
-            });
-            next.focusWithin = true;
-          }
-          if (pseudos === null || pseudos === void 0 ? void 0 : pseudos.focusVisibleStyle) {
-            if (lastInteractionWasKeyboard.value) next.focusVisible = true;else next.focus = true;
-          } else next.focus = true;
-          setStateShallow(next);
-          onFocus === null || onFocus === void 0 || onFocus(e);
-        },
-        onBlur: function (e) {
-          if (componentContext.setParentFocusState) componentContext.setParentFocusState({
-            focusWithin: false
-          });
-          setStateShallow({
-            focus: false,
-            focusVisible: false,
-            focusWithin: false
-          });
-          onBlur === null || onBlur === void 0 || onBlur(e);
-        }
-      })
-    } : null;
-    if (events && !asChild) {
-      var _viewProps_focusable;
-      Object.assign(events, {
-        cancelable: !viewProps.rejectResponderTermination,
-        disabled,
-        hitSlop: viewProps.hitSlop,
-        delayLongPress: viewProps.delayLongPress,
-        delayPressIn: viewProps.delayPressIn,
-        delayPressOut: viewProps.delayPressOut,
-        focusable: (_viewProps_focusable = viewProps.focusable) !== null && _viewProps_focusable !== void 0 ? _viewProps_focusable : true,
-        minPressDuration: 0
-      });
-    }
-    if (process.env.NODE_ENV === "development" && time) time`events`;
-    if (process.env.NODE_ENV === "development" && debugProp === "verbose") (0, import_log.log)(`events`, {
-      events,
-      attachHover,
-      attachPress
-    });
-    var propsWithHref = props;
-    var propsInWithHref = propsIn;
-    var _props_testID, _ref, _ref1, _ref2, _ref3;
-    var pressDebugName = [componentName, (_ref3 = (_ref2 = (_ref1 = (_ref = (_props_testID = props.testID) !== null && _props_testID !== void 0 ? _props_testID : propsIn.testID) !== null && _ref !== void 0 ? _ref : props.accessibilityLabel) !== null && _ref1 !== void 0 ? _ref1 : propsIn.accessibilityLabel) !== null && _ref2 !== void 0 ? _ref2 : typeof propsWithHref.href === "string" ? propsWithHref.href : null) !== null && _ref3 !== void 0 ? _ref3 : typeof propsInWithHref.href === "string" ? propsInWithHref.href : null].filter(Boolean).join(":") || null;
-    var hasRealPressEvents = !!(onPress || onPressIn || onPressOut || onLongPress);
-    var pressGesture = (0, import_eventHandling.useEvents)(events, viewProps, stateRef, staticConfig, isHOC, isInsideNativeMenu, pressDebugName, hasRealPressEvents);
-    if (process.env.NODE_ENV === "development" && time) time`hooks`;
-    if (asChild) {
-      elementType = import_Slot.Slot;
-      Object.assign(viewProps, {
-        onPress,
-        onLongPress
-      });
-    }
-    if (process.env.NODE_ENV === "development" && time) time`spaced-as-child`;
-    if (import_constants.isWeb && componentName && !("data-slot" in viewProps)) viewProps["data-slot"] = dataSlotFor(componentName);
-    var content;
-    if (isPassthrough) content = /* @__PURE__ */import_react.default.createElement(BaseComponent, {
-      style: {
-        display: "contents"
-      }
-    }, propsIn.children);else {
-      if (import_setupHooks.hooks.useChildren) content = import_setupHooks.hooks.useChildren(elementType, content || children, viewProps);
-      var isRenderPropString = typeof renderProp === "string";
-      if (renderProp && !isRenderPropString) {
-        var out = getCustomRender(renderProp, content || children, viewProps, componentState);
-        if (out) {
-          viewProps = out.viewProps;
-          elementType = out.elementType;
-        }
-      }
-      if (!content) {
-        if (isRenderPropString) viewProps.render;
-        content = /* @__PURE__ */import_react.default.createElement(elementType, viewProps, content || children);
-      }
-      if (process.env.NODE_ENV === "development" && time) time`use-children`;
-    }
-    var isCompositeComponent = !isHOC && Component && typeof Component !== "string";
-    content = (0, import_eventHandling.wrapWithGestureDetector)(content, pressGesture, stateRef, isHOC, isCompositeComponent, hasRealPressEvents);
-    var ResetPresence = animationDriver === null || animationDriver === void 0 ? void 0 : animationDriver.ResetPresence;
-    var needsReset = Boolean(
-    // not when passing down to child
-    !asChild && splitStyles && !isHOC && ResetPresence && willBeAnimated && (hasEnterStyle || presenceState));
-    var hasEverReset = stateRef.current.hasEverResetPresence;
-    if (needsReset && !hasEverReset) stateRef.current.hasEverResetPresence = true;
-    if ((needsReset || hasEverReset) && ResetPresence) content = /* @__PURE__ */(0, import_jsx_runtime.jsx)(ResetPresence, {
-      disabled: !needsReset,
-      children: content
-    });
-    if (process.env.NODE_ENV === "development" && time) time`create-element`;
-    if ("focusWithinStyle" in propsIn || (pseudos === null || pseudos === void 0 ? void 0 : pseudos.focusWithinStyle)) content = /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_ComponentContext.ComponentContext.Provider, {
-      ...componentContext,
-      setParentFocusState: setStateShallow,
-      children: content
-    });
-    if ("group" in props) content = /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_GroupContext.GroupContext.Provider, {
-      value: allGroupContexts,
-      children: content
-    });
-    if (process.env.NODE_ENV === "development" && time) time`group-context`;
-    content = disableTheme || !splitStyles ? content : (0, import_Theme.getThemedChildren)(themeState, content, themeStateProps, false, stateRef);
-    if (process.env.NODE_ENV === "development" && time) time`themed-children`;
-    if (overriddenContextProps && contextForOverride) {
-      var Provider = contextForOverride.Provider;
-      for (var key1 in styledContextValue) if (!(key1 in overriddenContextProps)) overriddenContextProps[key1] = styledContextValue[key1];
-      content = /* @__PURE__ */(0, import_jsx_runtime.jsx)(Provider, {
-        __disableMergeDefaultValues: true,
-        ...overriddenContextProps,
-        children: content
-      });
-    }
-    if (process.env.NODE_ENV === "development" && time) time`context-override`;
-    if (process.env.NODE_ENV === "development" && time) time`style-tags`;
-    if (process.env.NODE_ENV === "development") {
-      if (debugProp && debugProp !== "profile") {
-        var title = `render <${typeof elementType === "string" ? elementType : "Component"} /> (${internalID}) with props`;
-        if (!import_constants.isWeb || !import_constants.isClient) {
-          (0, import_log.log)(title);
-          (0, import_log.log)(`state: `, state);
-          if (import_isDevTools.isDevTools) (0, import_log.log)("viewProps", viewProps);
-          (0, import_log.log)(`final styles:`);
-          for (var key2 in splitStylesStyle) (0, import_log.log)(key2, splitStylesStyle[key2]);
-        } else {
-          console.groupCollapsed(title);
-          try {
-            (0, import_log.log)("viewProps", viewProps);
-            (0, import_log.log)("children", content);
-            if (typeof window !== "undefined") (0, import_log.log)({
-              propsIn,
-              props,
-              attachPress,
-              animationStyles,
-              classNames,
-              content,
-              elementType,
-              events,
-              isAnimated,
-              hasRuntimeMediaKeys,
-              isStringElement,
-              mediaListeningKeys,
-              pseudos,
-              shouldAttach,
-              noClass,
-              shouldListenForMedia,
-              splitStyles,
-              splitStylesStyle,
-              state,
-              stateRef,
-              staticConfig,
-              styleProps,
-              themeState,
-              viewProps,
-              willBeAnimated,
-              startedUnhydrated
-            });
-          } catch (e) {} finally {
-            console.groupEnd();
-          }
-        }
-        if (debugProp === "break") {}
-      }
-    }
-    if (process.env.NODE_ENV === "development" && time) {
-      time`rest`;
-      if (!globalThis["willPrint"]) {
-        globalThis["willPrint"] = true;
-        setTimeout(function () {
-          delete globalThis["willPrint"];
-          time.print();
-          time = null;
-        }, 50);
-      }
-    }
-    return content;
-  });
-  function notifyGroupSubscribers(groupContext, groupEmitter, pseudo) {
-    if (!groupContext || !groupEmitter) return;
-    var prevPseudo = groupContext.state.pseudo;
-    var shouldReplacePseudo = !prevPseudo || "unmounted" in prevPseudo || "group" in prevPseudo || "hasDynGroupChildren" in prevPseudo || "transition" in prevPseudo;
-    var nextPseudo = shouldReplacePseudo ? {} : prevPseudo;
-    var didChange = shouldReplacePseudo;
-    for (var i = 0; i < groupPseudoKeys.length; i++) {
-      var key = groupPseudoKeys[i];
-      var value = pseudo[key];
-      if (nextPseudo[key] !== value) {
-        nextPseudo[key] = value;
-        didChange = true;
-      } else if (didChange) nextPseudo[key] = value;
-    }
-    if (!didChange) return;
-    groupContext.state.pseudo = nextPseudo;
-    groupEmitter.emit(groupContext.state);
-  }
-  if (staticConfig.componentName) component.displayName = staticConfig.componentName;
-  var res = component;
-  res = /* @__PURE__ */import_react.default.memo(res);
-  res.staticConfig = staticConfig;
-  function extendStyledConfig(extended) {
-    return {
-      ...staticConfig,
-      ...extended,
-      neverFlatten: true,
-      isHOC: true,
-      isStyledHOC: false
-    };
-  }
-  function styleable(Component2, options) {
-    var out = typeof Component2 === "function" && Component2.length === 1 ? Component2 : /* @__PURE__ */import_react.default.forwardRef(Component2);
-    var extendedConfig = extendStyledConfig(options === null || options === void 0 ? void 0 : options.staticConfig);
-    out = (options === null || options === void 0 ? void 0 : options.disableTheme) ? out : (0, import_themeable.themeable)(out, extendedConfig, true);
-    if (extendedConfig.memo || process.env.GUI_MEMOIZE_STYLEABLE) out = /* @__PURE__ */import_react.default.memo(out);
-    out.staticConfig = extendedConfig;
-    out.styleable = styleable;
-    return out;
-  }
-  res.styleable = styleable;
-  return res;
-}
-var fromPx = function (val) {
-  if (typeof val === "number") return val;
-  if (typeof val === "string") return +val.replace("px", "");
-  return 0;
-};
-var getCustomRender = function (renderProp, content, viewProps, state) {
-  if (typeof renderProp === "function") renderProp = getRenderElementForPlatform(renderProp(viewProps, state));
-  if (renderProp) {
-    if ((typeof renderProp === "undefined" ? "undefined" : _type_of(renderProp)) === "object" && /* @__PURE__ */import_react.default.isValidElement(renderProp)) {
-      if (getRenderElementForPlatform(renderProp)) {
-        var elementProps = renderProp.props;
-        var mergedProps = elementProps ? (0, import_mergeRenderElementProps.mergeRenderElementProps)(elementProps, viewProps, content) : viewProps;
-        return {
-          elementType: renderProp.type,
-          viewProps: mergedProps
-        };
-      }
-    }
-  }
-};
-function getRenderElementForPlatform(potential) {
-  if (isHTMLElement(potential)) return;
-  return potential;
-}
-function isHTMLElement(el) {
-  return typeof el["type"] === "string" && el["type"][0] === el["type"][0].toLowerCase();
-}
-//# sourceMappingURL=createComponent.native.js.map