@tamagui/web 2.7.7 → 3.0.0-beta.643.1

package/dist/cjs/hooks/useComponentState.native.cjs

@@ -0,0 +1,250 @@
+"use strict";
+
+
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+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 __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var useComponentState_exports = {};
+__export(useComponentState_exports, { useComponentState: () => useComponentState });
+module.exports = __toCommonJS(useComponentState_exports);
+var import_constants = require("@tamagui/constants");
+var import_helpers = require("@tamagui/helpers");
+var import_runtime = require("@tamagui/style-grammar/runtime");
+var import_is_equal_shallow = require("@tamagui/is-equal-shallow");
+var import_use_did_finish_ssr = require("@tamagui/use-did-finish-ssr");
+var import_react = require("react");
+var import_config = require("../config.native.js");
+var import_formatDiagnostic = require("../helpers/formatDiagnostic.native.js");
+var import_isOptimizedForFirstRender = require("./isOptimizedForFirstRender.native.js");
+var import_defaultComponentState = require("../defaultComponentState.native.js");
+var import_isObj = require("../helpers/isObj.native.js");
+var import_log = require("../helpers/log.native.js");
+function _type_of(obj) {
+	"@swc/helpers - typeof";
+	return obj && typeof Symbol !== "undefined" && obj.constructor === Symbol ? "symbol" : typeof obj;
+}
+var platformPseudoModifiers = /* @__PURE__ */ new Set([
+	"hover",
+	"press",
+	"focus"
+]);
+var enterModifier = /* @__PURE__ */ new Set(["enter"]);
+var scanSource = "";
+var scanWanted = enterModifier;
+var scanFound = false;
+var scanRefused = false;
+var lifecycleVisitor = {
+	segment(start, end, isBase) {
+		if (start === end && !isBase) scanRefused = true;
+	},
+	chain(start, end) {
+		if (scanRefused) return false;
+		for (var index = start; index <= end; index++) {
+			if (index !== end && scanSource.charCodeAt(index) !== 58) continue;
+			if (scanWanted.has((0, import_runtime.canonicalClauseModifier)(scanSource.slice(start, index)))) {
+				scanFound = true;
+			}
+			start = index + 1;
+		}
+		return true;
+	},
+	error() {
+		scanRefused = true;
+	}
+};
+function hasFlatModifier(props, config, modifiers) {
+	for (var key in props) {
+		var value = props[key];
+		if (typeof value !== "string" || value.indexOf(":") === -1) continue;
+		var property = config.shorthands[key] || key;
+		if (!(property in import_helpers.stylePropsAll) && property !== "transition") continue;
+		scanSource = value;
+		scanWanted = modifiers;
+		scanFound = false;
+		scanRefused = false;
+		(0, import_runtime.scanFlatValue)(value, lifecycleVisitor);
+		if (scanFound && !scanRefused) return true;
+	}
+	return false;
+}
+var useComponentState = function(props, animationDriver, staticConfig, config) {
+	"use no memo";
+	var _getPlatformDriver, _animationDriver_usePresence;
+	var isHydrated = (0, import_use_did_finish_ssr.useDidFinishSSR)();
+	var needsHydration = !(0, import_use_did_finish_ssr.useIsClientOnly)();
+	var useAnimations = (animationDriver === null || animationDriver === void 0 ? void 0 : animationDriver.isStub) ? void 0 : animationDriver === null || animationDriver === void 0 ? void 0 : animationDriver.useAnimations;
+	var { isHOC } = staticConfig;
+	var stateRef = (0, import_react.useRef)(void 0);
+	if (!stateRef.current) {
+		stateRef.current = {
+			startedUnhydrated: needsHydration && !isHydrated,
+			optimizeForFirstRender: (0, import_isOptimizedForFirstRender.isOptimizedForFirstRender)()
+		};
+	}
+	var hasAnimationProp = Boolean(!isHOC && "transition" in props || props.style && hasAnimatedStyleValue(props.style));
+	var _animationDriver_inputStyle;
+	var inputStyle = (_animationDriver_inputStyle = animationDriver === null || animationDriver === void 0 ? void 0 : animationDriver.inputStyle) !== null && _animationDriver_inputStyle !== void 0 ? _animationDriver_inputStyle : "css";
+	var _animationDriver_outputStyle;
+	var outputStyle = (_animationDriver_outputStyle = animationDriver === null || animationDriver === void 0 ? void 0 : animationDriver.outputStyle) !== null && _animationDriver_outputStyle !== void 0 ? _animationDriver_outputStyle : "css";
+	var curStateRef = stateRef.current;
+	if (!needsHydration && hasAnimationProp) {
+		curStateRef.hasAnimated = true;
+	}
+	var platformPseudo = Boolean(!isHOC && useAnimations && (animationDriver === null || animationDriver === void 0 ? void 0 : animationDriver.avoidReRenders) && ((_getPlatformDriver = (0, import_constants.getPlatformDriver)()) === null || _getPlatformDriver === void 0 ? void 0 : _getPlatformDriver.pseudo) && hasFlatModifier(props, config, platformPseudoModifiers));
+	var willBeAnimatedClient = (function() {
+		var next = !!((hasAnimationProp || platformPseudo) && !isHOC && useAnimations);
+		return Boolean(next || curStateRef.hasAnimated);
+	})();
+	var willBeAnimated = !import_constants.isServer && willBeAnimatedClient;
+	if (willBeAnimated && !curStateRef.hasAnimated) {
+		curStateRef.hasAnimated = true;
+	}
+	var { disableClassName } = props;
+	var presence = !isHOC && willBeAnimated && props["animatePresence"] !== false && (animationDriver === null || animationDriver === void 0 ? void 0 : (_animationDriver_usePresence = animationDriver.usePresence) === null || _animationDriver_usePresence === void 0 ? void 0 : _animationDriver_usePresence.call(animationDriver)) || null;
+	var presenceState = presence === null || presence === void 0 ? void 0 : presence[2];
+	var isExiting = (presenceState === null || presenceState === void 0 ? void 0 : presenceState.isPresent) === false;
+	var isEntering = (presenceState === null || presenceState === void 0 ? void 0 : presenceState.isPresent) === true && presenceState.initial !== false;
+	var hasEnterStyle = hasFlatModifier(props, config, enterModifier);
+	var hasAnimationThatNeedsHydrate = hasAnimationProp && !isHydrated && ((animationDriver === null || animationDriver === void 0 ? void 0 : animationDriver.isReactNative) || inputStyle !== "css");
+	var canImmediatelyEnter = hasEnterStyle || isEntering;
+	var shouldEnter = !isHOC && (hasEnterStyle || isEntering || hasAnimationThatNeedsHydrate || disableClassName);
+	var initialState = shouldEnter ? canImmediatelyEnter ? import_defaultComponentState.defaultComponentStateShouldEnter : import_defaultComponentState.defaultComponentState : import_defaultComponentState.defaultComponentStateMounted;
+	var disabled = isDisabled(props);
+	if (disabled != null) {
+		initialState.disabled = disabled;
+	}
+	var states = (0, import_react.useState)(initialState);
+	var state = props.forceStyle ? {
+		...states[0],
+		[props.forceStyle]: true
+	} : states[0];
+	var setState = states[1];
+	var isAnimated = willBeAnimated;
+	if (import_constants.isWeb && hasAnimationThatNeedsHydrate && !staticConfig.isHOC && !isHydrated) {
+		isAnimated = false;
+		curStateRef.willHydrate = true;
+	}
+	if (disabled !== state.disabled) {
+		if (disabled) {
+			Object.assign(state, import_defaultComponentState.defaultComponentStateMounted);
+		}
+		state.disabled = disabled;
+		setState(function(_) {
+			return { ...state };
+		});
+	}
+	var groupName = props.group;
+	if (!stateRef.current.baseSetStateShallow) {
+		var r = stateRef.current;
+		r.baseSetStateShallow = function(stateOrGetState) {
+			setState(function(prev) {
+				var next = typeof stateOrGetState === "function" ? stateOrGetState(prev) : stateOrGetState;
+				var update = (0, import_is_equal_shallow.mergeIfNotShallowEqual)(prev, next);
+				if (process.env.NODE_ENV === "development") {
+					var dbg = r.__debug;
+					if (dbg && update !== prev) {
+						console.groupCollapsed(`setStateShallow CHANGE`, "=>", update);
+						console.info(`previously`, prev);
+						console.trace();
+						console.groupEnd();
+					}
+				}
+				return update;
+			});
+		};
+	}
+	if (process.env.NODE_ENV === "development") {
+		;
+		stateRef.current.__debug = props.debug;
+	}
+	var setStateShallow = stateRef.current.baseSetStateShallow;
+	if (process.env.NODE_ENV === "development" && globalThis.time) globalThis.time`state-useCreateShallowSetState`;
+	var outProps = props;
+	if (presenceState && isAnimated && isHydrated && staticConfig.variants) {
+		if (process.env.NODE_ENV === "development" && props.debug === "verbose") {
+			var _staticConfig_Component, _staticConfig_Component1;
+			console.warn((0, import_formatDiagnostic.formatDiagnostic)("TAMAGUI_PRESENCE_STATE", ((_staticConfig_Component = staticConfig.Component) === null || _staticConfig_Component === void 0 ? void 0 : _staticConfig_Component.displayName) || ((_staticConfig_Component1 = staticConfig.Component) === null || _staticConfig_Component1 === void 0 ? void 0 : _staticConfig_Component1.name) || "TamaguiComponent", "AnimatePresence supplied lifecycle state to an animated component", "Remove debug=\"verbose\" after inspecting the animation state", "presenceState", presenceState));
+		}
+		var { custom } = presenceState;
+		if ((0, import_isObj.isObj)(custom)) {
+			outProps = {
+				...props,
+				...custom
+			};
+		}
+	}
+	var noClass = !import_constants.isWeb || !!props.forceStyle;
+	if (!isHydrated) {
+		noClass = false;
+	} else {
+		if (import_constants.isWeb && isHydrated) {
+			var isAnimatedAndHydrated = isAnimated && isHydrated;
+			var isClassNameDisabled = !staticConfig.acceptsClassName && ((0, import_config.getSetting)("disableSSR") || !state.unmounted);
+			var isDisabledManually = disableClassName && !state.unmounted;
+			if (isAnimatedAndHydrated && outputStyle !== "css" || isDisabledManually || isClassNameDisabled) {
+				noClass = true;
+				if (process.env.NODE_ENV === "development" && props.debug === "verbose") {
+					(0, import_log.log)(`avoiding className`, {
+						isAnimatedAndHydrated,
+						isDisabledManually,
+						isClassNameDisabled
+					});
+				}
+			}
+		}
+	}
+	return {
+		props: outProps,
+		startedUnhydrated: curStateRef.startedUnhydrated,
+		curStateRef,
+		disabled,
+		groupName,
+		hasAnimationProp,
+		hasEnterStyle,
+		isAnimated,
+		isExiting,
+		isHydrated,
+		presence,
+		presenceState,
+		setState,
+		setStateShallow,
+		noClass,
+		state,
+		stateRef,
+		inputStyle,
+		outputStyle,
+		willBeAnimated,
+		willBeAnimatedClient,
+		platformPseudo
+	};
+};
+function hasAnimatedStyleValue(style) {
+	for (var k in style) {
+		var val = style[k];
+		if (val && (typeof val === "undefined" ? "undefined" : _type_of(val)) === "object" && "_animation" in val) {
+			return true;
+		}
+	}
+	return false;
+}
+var isDisabled = function(props) {
+	var _props_accessibilityState;
+	return props.disabled || props.passThrough || ((_props_accessibilityState = props.accessibilityState) === null || _props_accessibilityState === void 0 ? void 0 : _props_accessibilityState.disabled) || props["aria-disabled"] || props.accessibilityDisabled || false;
+};