@tamagui/core 1.0.1-beta.19 → 1.0.1-beta.190

package/dist/jsx/hooks/useMedia.js

@@ -1,158 +0,0 @@
-var __defProp = Object.defineProperty;
-var __name = (target, value) => __defProp(target, "name", { value, configurable: true });
-import { useForceUpdate } from "@tamagui/use-force-update";
-import { useRef } from "react";
-import { useIsomorphicLayoutEffect } from "../constants/platform";
-import { matchMedia } from "../helpers/matchMedia";
-import { useConstant } from "./useConstant";
-const mediaState = {};
-const mediaQueryListeners = {};
-const addMediaQueryListener = /* @__PURE__ */ __name((key, cb) => {
-  mediaQueryListeners[key] = mediaQueryListeners[key] || /* @__PURE__ */ new Set();
-  mediaQueryListeners[key].add(cb);
-}, "addMediaQueryListener");
-const removeMediaQueryListener = /* @__PURE__ */ __name((key, cb) => {
-  var _a;
-  (_a = mediaQueryListeners[key]) == null ? void 0 : _a.delete(cb);
-}, "removeMediaQueryListener");
-let hasConfigured = false;
-const mediaQueryConfig = {};
-const getMedia = /* @__PURE__ */ __name(() => {
-  return mediaState;
-}, "getMedia");
-const configureMedia = /* @__PURE__ */ __name(({
-  queries,
-  defaultActive = ["sm", "xs"]
-} = {}) => {
-  var _a;
-  if (hasConfigured) {
-    console.warn(`Already configured mediaQueries once (you may have called getMedia() before configureMedia())`);
-  }
-  if (queries) {
-    Object.assign(mediaQueryConfig, queries);
-    hasConfigured = true;
-  }
-  for (const key in queries) {
-    const str = mediaObjectToString(queries[key]);
-    const propKey = `$${key}`;
-    try {
-      let update = function() {
-        const next = !!getMatch().matches;
-        if (next === mediaState[propKey])
-          return;
-        mediaState[propKey] = next;
-        const listeners = mediaQueryListeners[propKey];
-        if (listeners == null ? void 0 : listeners.size) {
-          for (const cb of [...listeners]) {
-            cb();
-          }
-        }
-      };
-      __name(update, "update");
-      const getMatch = /* @__PURE__ */ __name(() => matchMedia(str), "getMatch");
-      const match = getMatch();
-      if (!match || typeof match.addListener !== "function") {
-        throw new Error("\u26A0\uFE0F No match (seeing this in RN sometimes)");
-      }
-      mediaState[propKey] = !!match.matches;
-      match.addListener(update);
-      update();
-    } catch (err) {
-      console.error("Error running media query", str, err.message, err.stack);
-      const isDefaultActive = (_a = defaultActive == null ? void 0 : defaultActive.includes(key)) != null ? _a : true;
-      mediaState[propKey] = isDefaultActive;
-    }
-  }
-}, "configureMedia");
-const useMedia = /* @__PURE__ */ __name(() => {
-  const forceUpdate = useForceUpdate();
-  const state = useRef();
-  if (!state.current) {
-    state.current = {
-      selections: {},
-      nextSelections: {},
-      isUnmounted: false,
-      isRendering: true
-    };
-  }
-  state.current.isRendering = true;
-  useIsomorphicLayoutEffect(() => {
-    const st = state.current;
-    st.isRendering = false;
-    for (const key in st.selections) {
-      if (!(key in st.nextSelections)) {
-        removeMediaQueryListener(key, forceUpdate);
-      }
-    }
-    for (const key in st.nextSelections) {
-      if (!(key in st.selections)) {
-        addMediaQueryListener(key, forceUpdate);
-      }
-    }
-  });
-  useIsomorphicLayoutEffect(() => {
-    return () => {
-      const st = state.current;
-      st.isUnmounted = true;
-      const allKeys = {
-        ...st.selections,
-        ...st.nextSelections
-      };
-      for (const key in allKeys) {
-        removeMediaQueryListener(key, forceUpdate);
-      }
-    };
-  }, []);
-  return useConstant(() => {
-    const st = state.current;
-    return new Proxy(mediaState, {
-      get(target, key) {
-        if (key[0] !== "$") {
-          key = `$${key}`;
-        }
-        if (!(key in mediaState)) {
-          return Reflect.get(target, key);
-        }
-        if (!st.isUnmounted) {
-          if (st.isRendering) {
-            st.nextSelections[key] = true;
-          }
-        }
-        if (key in mediaState) {
-          return mediaState[key];
-        }
-        return Reflect.get(mediaState, key);
-      }
-    });
-  });
-}, "useMedia");
-function camelToHyphen(str) {
-  return str.replace(/[A-Z]/g, (m) => `-${m.toLowerCase()}`).toLowerCase();
-}
-__name(camelToHyphen, "camelToHyphen");
-function mediaObjectToString(query) {
-  if (typeof query === "string") {
-    return query;
-  }
-  return Object.entries(query).map(([feature, value]) => {
-    feature = camelToHyphen(feature);
-    if (typeof value === "string") {
-      return `(${feature}: ${value})`;
-    }
-    if (typeof value === "number" && /[height|width]$/.test(feature)) {
-      value = `${value}px`;
-    }
-    return `(${feature}: ${value})`;
-  }).join(" and ");
-}
-__name(mediaObjectToString, "mediaObjectToString");
-export {
-  addMediaQueryListener,
-  configureMedia,
-  getMedia,
-  mediaObjectToString,
-  mediaQueryConfig,
-  mediaState,
-  removeMediaQueryListener,
-  useMedia
-};

package/dist/jsx/hooks/usePressable.js

@@ -1,13 +0,0 @@
-var __defProp = Object.defineProperty;
-var __name = (target, value) => __defProp(target, "name", { value, configurable: true });
-var _a, _b;
-import { Pressable } from "react-native";
-const getPressable = (_b = (_a = Pressable) == null ? void 0 : _a["type"]) == null ? void 0 : _b["render"];
-const usePressable = /* @__PURE__ */ __name((props) => {
-  const out = getPressable(props);
-  const { children, style, ...pressableProps } = out.props;
-  return [pressableProps, style];
-}, "usePressable");
-export {
-  usePressable
-};

package/dist/jsx/hooks/useTheme.js

@@ -1,177 +0,0 @@
-var __defProp = Object.defineProperty;
-var __name = (target, value) => __defProp(target, "name", { value, configurable: true });
-import { useForceUpdate } from "@tamagui/use-force-update";
-import { useContext, useLayoutEffect, useMemo, useRef, useState } from "react";
-import { getConfig } from "../conf";
-import { useIsomorphicLayoutEffect } from "../constants/platform";
-import { areEqualSets } from "../helpers/areEqualSets";
-import { ThemeContext } from "../ThemeContext";
-import { ThemeManager, ThemeManagerContext, emptyManager } from "../ThemeManager";
-import { useConstant } from "./useConstant";
-const useTheme = /* @__PURE__ */ __name((themeName, componentName, props, forceUpdate) => {
-  const { name, theme, themes, themeManager, className, didChangeTheme } = useChangeThemeEffect(themeName, componentName, props, forceUpdate);
-  if (process.env.NODE_ENV === "development") {
-    if ((props == null ? void 0 : props["debug"]) === "verbose") {
-      console.log("  \xBB useTheme", { themeName, componentName, name, className });
-    }
-  }
-  const state = useRef();
-  if (!state.current) {
-    state.current = {
-      uuid: {},
-      keys: /* @__PURE__ */ new Set(),
-      isRendering: true
-    };
-  }
-  state.current.isRendering = true;
-  useIsomorphicLayoutEffect(() => {
-    const st = state.current;
-    st.isRendering = false;
-    const cur = themeManager == null ? void 0 : themeManager.keys.get(st.uuid);
-    if (!cur || !areEqualSets(st.keys, cur)) {
-      themeManager == null ? void 0 : themeManager.track(st.uuid, st.keys);
-    }
-  });
-  return useMemo(() => {
-    if (!theme) {
-      if (process.env.NODE_ENV === "development") {
-        console.warn("No theme", { themeName, theme, componentName, className });
-      }
-      return themes[getConfig().defaultTheme || "light"];
-    }
-    return new Proxy(theme, {
-      has(_, key) {
-        if (typeof key === "string") {
-          if (key[0] === "$") {
-            key = key.slice(1);
-          }
-        }
-        return Reflect.has(theme, key);
-      },
-      get(_, key) {
-        if (!name || key === "__proto__" || typeof key === "symbol") {
-          if (key === GetThemeManager) {
-            if (process.env.NODE_ENV === "development") {
-              if (props["debug"]) {
-                console.log("did change", { themeName, didChangeTheme, name, componentName }, themeManager == null ? void 0 : themeManager.parentName);
-              }
-            }
-            if (!didChangeTheme) {
-              return null;
-            }
-            return themeManager;
-          }
-          return Reflect.get(_, key);
-        }
-        if (typeof key !== "string" || key === "$typeof") {
-          return Reflect.get(_, key);
-        }
-        if (process.env.NODE_ENV === "development") {
-          if (key === "__state") {
-            return state.current;
-          }
-        }
-        if (key === "name") {
-          return name;
-        }
-        if (key === "className") {
-          return className;
-        }
-        if (!themeManager) {
-          console.error("No themeManager");
-          return;
-        }
-        if (key[0] === "$") {
-          key = key.slice(1);
-        }
-        const val = themeManager.getValue(key);
-        if (val) {
-          if (state.current.isRendering) {
-            state.current.keys.add(key);
-            if (process.env.NODE_ENV === "development") {
-              if ((props == null ? void 0 : props["debug"]) === "verbose") {
-                console.log("  \xBB tracking theme key", key);
-              }
-            }
-          }
-          return val;
-        }
-        if (process.env.NODE_ENV === "development") {
-          console.log(`No theme value "${String(key)}" in ${name}`);
-        }
-        return Reflect.get(_, key);
-      }
-    });
-  }, [name, theme, className, didChangeTheme]);
-}, "useTheme");
-const GetThemeManager = Symbol("GetThemeManager");
-const getThemeManagerIfChanged = /* @__PURE__ */ __name((theme) => {
-  return theme == null ? void 0 : theme[GetThemeManager];
-}, "getThemeManagerIfChanged");
-const useThemeName = /* @__PURE__ */ __name((opts) => {
-  const parent = useContext(ThemeManagerContext);
-  const [name, setName] = useState((parent == null ? void 0 : parent.name) || "");
-  useIsomorphicLayoutEffect(() => {
-    if (!parent)
-      return;
-    return parent.onChangeTheme((next, manager) => {
-      const name2 = (opts == null ? void 0 : opts.parent) ? manager.parentName || next : next;
-      if (!name2)
-        return;
-      setName(name2);
-    });
-  }, [parent]);
-  return name;
-}, "useThemeName");
-const useDefaultThemeName = /* @__PURE__ */ __name(() => {
-  var _a;
-  return (_a = useContext(ThemeContext)) == null ? void 0 : _a.defaultTheme;
-}, "useDefaultThemeName");
-const useChangeThemeEffect = /* @__PURE__ */ __name((name, componentName, props, forceUpdateProp) => {
-  const debug = props && props["debug"];
-  const parentManager = useContext(ThemeManagerContext) || emptyManager;
-  const { themes } = useContext(ThemeContext);
-  const next = parentManager.getNextTheme({ name, componentName, themes }, props);
-  const forceUpdate = forceUpdateProp || useForceUpdate();
-  const themeManager = useConstant(() => {
-    if (!next) {
-      return null;
-    }
-    return new ThemeManager(next.name, next.theme, parentManager);
-  });
-  if (typeof document !== "undefined") {
-    useLayoutEffect(() => {
-      if (!themeManager)
-        return;
-      if (next == null ? void 0 : next.name) {
-        themeManager.update(next);
-      }
-      return parentManager.onChangeTheme(() => {
-        const next2 = parentManager.getNextTheme({ name, componentName, themes }, debug);
-        if (!next2)
-          return;
-        if (themeManager.update(next2)) {
-          forceUpdate();
-        }
-      });
-    }, [themes, name, componentName, debug, next == null ? void 0 : next.name]);
-  }
-  const didChangeTheme = next && parentManager && next.name !== parentManager.fullName;
-  return {
-    ...parentManager && {
-      name: parentManager.name,
-      theme: parentManager.theme
-    },
-    ...next,
-    didChangeTheme,
-    themes,
-    themeManager
-  };
-}, "useChangeThemeEffect");
-export {
-  getThemeManagerIfChanged,
-  useChangeThemeEffect,
-  useDefaultThemeName,
-  useTheme,
-  useThemeName
-};

package/dist/jsx/hooks/useUnmountEffect.js

@@ -1,10 +0,0 @@
-var __defProp = Object.defineProperty;
-var __name = (target, value) => __defProp(target, "name", { value, configurable: true });
-import { useEffect } from "react";
-function useUnmountEffect(callback) {
-  return useEffect(() => () => callback(), []);
-}
-__name(useUnmountEffect, "useUnmountEffect");
-export {
-  useUnmountEffect
-};

package/dist/jsx/index.js

@@ -1,54 +0,0 @@
-export * from "./Tamagui";
-export * from "./createComponent";
-export * from "./createShorthands";
-export * from "./createTheme";
-export * from "./createTamagui";
-export * from "./createFont";
-import { createTokens } from "./createTokens";
-export * from "./createVariable";
-export * from "./styled";
-export * from "./types";
-import { RNWTextProps, RNWViewProps } from "./types-rnw";
-import { getHasConfigured, getConfig, getThemes, getTokens, onConfiguredOnce } from "./conf";
-export * from "./constants/constants";
-export * from "./constants/platform";
-export * from "./constants/rnw";
-export * from "./helpers/getButtonSize";
-export * from "./helpers/getExpandedShorthands";
-export * from "./helpers/getSize";
-export * from "./helpers/getSplitStyles";
-export * from "./helpers/getStylesAtomic";
-export * from "./helpers/getTextSize";
-export * from "./helpers/isObj";
-export * from "./helpers/isTamaguiElement";
-export * from "./helpers/matchMedia";
-export * from "./helpers/themeable";
-export * from "./helpers/withStaticProperties";
-export * from "./contexts/ButtonInsideButtonContext";
-export * from "./hooks/useConstant";
-export * from "./hooks/useId";
-export * from "./hooks/useIsMounted";
-export * from "./hooks/useIsTouchDevice";
-export * from "./hooks/useMedia";
-export * from "./hooks/usePressable";
-export * from "./hooks/useTheme";
-export * from "./hooks/useUnmountEffect";
-export * from "./views/Stack";
-export * from "./views/Text";
-export * from "./views/TextAncestorContext";
-export * from "./views/Theme";
-export * from "./views/ThemeInverse";
-export * from "./views/ThemeProvider";
-export * from "./views/ThemeReset";
-export * from "@tamagui/use-force-update";
-export * from "@tamagui/helpers";
-export {
-  RNWTextProps,
-  RNWViewProps,
-  createTokens,
-  getConfig,
-  getHasConfigured,
-  getThemes,
-  getTokens,
-  onConfiguredOnce
-};

package/dist/jsx/nativeGestureHandler.native.js

@@ -1 +0,0 @@
-export * from "react-native-gesture-handler";

package/dist/jsx/static.js

@@ -1,16 +0,0 @@
-export * from "./styled";
-export * from "./createComponent";
-export * from "./createFont";
-export * from "./createTokens";
-export * from "./createTamagui";
-export * from "./createVariable";
-export * from "./constants/constants";
-export * from "./hooks/useMedia";
-export * from "./hooks/useTheme";
-export * from "./helpers/isObj";
-export * from "./helpers/getStylesAtomic";
-export * from "./helpers/proxyThemeVariables";
-export * from "./helpers/getSplitStyles";
-export * from "@tamagui/helpers";
-export * from "./constants/rnw";
-export * from "./types";

package/dist/jsx/styled.js

@@ -1,47 +0,0 @@
-var __defProp = Object.defineProperty;
-var __name = (target, value) => __defProp(target, "name", { value, configurable: true });
-import { Image, Text, TextInput } from "react-native";
-import { createComponent } from "./createComponent";
-import { RNComponents } from "./helpers/RNComponents";
-function styled(Component, options, staticExtractionOptions) {
-  const staticConfigProps = (() => {
-    var _a;
-    if (options) {
-      const { variants, name, defaultVariants, ...defaultProps } = options;
-      if (defaultVariants) {
-        Object.assign(defaultProps, defaultVariants);
-      }
-      const isReactNativeWeb = "staticConfig" in Component ? Component.staticConfig.isReactNativeWeb : RNComponents.has(Component);
-      const reactNativeWebComponent = isReactNativeWeb ? ((_a = Component["staticConfig"]) == null ? void 0 : _a.reactNativeWebComponent) || Component : null;
-      const isTamagui = !isReactNativeWeb && "staticConfig" in Component;
-      const Comp = reactNativeWebComponent || Component;
-      const isImage = !!(defaultProps.isImage || (!isTamagui ? Comp === Image : false));
-      const isInput = !!(defaultProps.isInput || (!isTamagui ? Comp === TextInput : false));
-      const isText = !!(defaultProps.isText || (!isTamagui ? isInput || Comp === Text : false));
-      const conf = {
-        ...staticExtractionOptions,
-        ...!isTamagui && {
-          Component: Comp
-        },
-        isTamagui,
-        variants,
-        defaultProps,
-        defaultVariants,
-        componentName: name,
-        isReactNativeWeb,
-        reactNativeWebComponent,
-        isInput,
-        isText,
-        isImage
-      };
-      return conf;
-    }
-    return {};
-  })();
-  const component = createComponent(staticConfigProps, Component);
-  return component;
-}
-__name(styled, "styled");
-export {
-  styled
-};

package/dist/jsx/views/Slot.js

@@ -1,75 +0,0 @@
-var __defProp = Object.defineProperty;
-var __name = (target, value) => __defProp(target, "name", { value, configurable: true });
-import { composeRefs } from "@tamagui/compose-refs";
-import * as React from "react";
-const Slot = React.forwardRef((props, forwardedRef) => {
-  const { children, ...slotProps } = props;
-  if (React.Children.toArray(children).some(isSlottable)) {
-    return <>{React.Children.map(children, (child) => {
-      return isSlottable(child) ? <SlotClone {...slotProps} ref={forwardedRef}>{child.props.children}</SlotClone> : child;
-    })}</>;
-  }
-  return <SlotClone {...slotProps} ref={forwardedRef}>{children}</SlotClone>;
-});
-Slot.displayName = "Slot";
-const SlotClone = React.forwardRef((props, forwardedRef) => {
-  const { children, ...slotProps } = props;
-  if (React.isValidElement(children)) {
-    return React.cloneElement(children, {
-      ...mergeProps(children, slotProps),
-      ref: composeRefs(forwardedRef, children.ref)
-    });
-  }
-  return React.Children.count(children) > 1 ? React.Children.only(null) : null;
-});
-SlotClone.displayName = "SlotClone";
-const Slottable = /* @__PURE__ */ __name(({ children }) => {
-  return <>{children}</>;
-}, "Slottable");
-function isSlottable(child) {
-  return React.isValidElement(child);
-}
-__name(isSlottable, "isSlottable");
-const pressMap = {
-  onPress: "onClick",
-  onPressOut: "onMouseOut",
-  onPressIn: "onMouseIn"
-};
-function mergeProps(child, slotProps) {
-  const childProps = child.props;
-  const overrideProps = { ...childProps };
-  const isHTMLChild = typeof child.type === "string";
-  if (isHTMLChild) {
-    for (const key in pressMap) {
-      if (key in slotProps) {
-        slotProps[pressMap[key]] = slotProps[key];
-        delete slotProps[key];
-      }
-    }
-  }
-  for (let propName in childProps) {
-    const slotPropValue = slotProps[propName];
-    const childPropValue = childProps[propName];
-    if (isHTMLChild && pressMap[propName]) {
-      propName = pressMap[propName];
-      delete overrideProps[propName];
-    }
-    const isHandler = /^on[A-Z]/.test(propName);
-    if (isHandler) {
-      overrideProps[propName] = (...args) => {
-        childPropValue == null ? void 0 : childPropValue(...args);
-        slotPropValue == null ? void 0 : slotPropValue(...args);
-      };
-    } else if (propName === "style") {
-      overrideProps[propName] = { ...slotPropValue, ...childPropValue };
-    } else if (propName === "className") {
-      overrideProps[propName] = [slotPropValue, childPropValue].filter(Boolean).join(" ");
-    }
-  }
-  return { ...slotProps, ...overrideProps };
-}
-__name(mergeProps, "mergeProps");
-export {
-  Slot,
-  Slottable
-};

package/dist/jsx/views/Stack.js

@@ -1,12 +0,0 @@
-import { stackDefaultStyles } from "../constants/constants";
-import { createComponent } from "../createComponent";
-const Stack = createComponent({
-  componentName: "Stack",
-  defaultProps: {
-    ...stackDefaultStyles,
-    flexDirection: "column"
-  }
-});
-export {
-  Stack
-};

package/dist/jsx/views/Text.js

@@ -1,56 +0,0 @@
-import { stylePropsTextOnly, validStyles } from "@tamagui/helpers";
-import { isWeb } from "../constants/platform";
-import { createComponent } from "../createComponent";
-const ellipseStyle = {
-  maxWidth: "100%",
-  overflow: "hidden",
-  textOverflow: "ellipsis",
-  whiteSpace: "nowrap"
-};
-const Text = createComponent({
-  componentName: "Text",
-  isText: true,
-  defaultProps: {
-    display: "flex",
-    fontFamily: "System",
-    ...isWeb && {
-      display: "inline",
-      boxSizing: "border-box",
-      wordWrap: "break-word"
-    }
-  },
-  variants: {
-    numberOfLines: {
-      1: isWeb ? ellipseStyle : { numberOfLines: 1 },
-      ":number": (numberOfLines) => isWeb ? numberOfLines >= 1 ? { WebkitLineClamp: numberOfLines } : null : { numberOfLines }
-    },
-    selectable: {
-      true: {
-        userSelect: "text",
-        cursor: "text"
-      },
-      false: {
-        userSelect: "none"
-      }
-    },
-    pressable: {
-      true: {
-        cursor: "pointer"
-      }
-    },
-    ellipse: {
-      true: isWeb ? ellipseStyle : {
-        numberOfLines: 1,
-        lineBreakMode: "clip"
-      }
-    }
-  },
-  deoptProps: new Set(isWeb ? [] : ["ellipse"]),
-  validStyles: {
-    ...validStyles,
-    ...stylePropsTextOnly
-  }
-});
-export {
-  Text
-};

package/dist/jsx/views/TextAncestorContext.js

@@ -1,15 +0,0 @@
-var __defProp = Object.defineProperty;
-var __name = (target, value) => __defProp(target, "name", { value, configurable: true });
-var _a, _b;
-import { createContext } from "react";
-import { rnw } from "../constants/rnw";
-const FallbackNativeContext = createContext(false);
-const TextAncestorContext = (_b = (_a = rnw) == null ? void 0 : _a.TextAncestorContext) != null ? _b : FallbackNativeContext;
-const TextAncestorProvider = /* @__PURE__ */ __name((props) => {
-  return <TextAncestorContext.Provider value={false}>{props.children}</TextAncestorContext.Provider>;
-}, "TextAncestorProvider");
-export {
-  FallbackNativeContext,
-  TextAncestorContext,
-  TextAncestorProvider
-};

package/dist/jsx/views/Theme.js

@@ -1,31 +0,0 @@
-var __defProp = Object.defineProperty;
-var __name = (target, value) => __defProp(target, "name", { value, configurable: true });
-import React, { memo, useMemo } from "react";
-import { isWeb } from "../constants/platform";
-import { wrapThemeManagerContext } from "../helpers/wrapThemeManagerContext";
-import { useChangeThemeEffect } from "../hooks/useTheme";
-React["createElement"];
-const Theme = memo(/* @__PURE__ */ __name(function Theme2(props) {
-  var _a, _b;
-  const { name, theme, themeManager, themes, className } = useChangeThemeEffect(props.name, props.componentName, props);
-  if (!themes || !name || !theme) {
-    if (name && !theme && process.env.NODE_ENV === "development") {
-      console.warn(`No theme found by name ${name}`);
-    }
-    return props.children;
-  }
-  const contents = useMemo(() => wrapThemeManagerContext(props.children, themeManager), [props.children, themeManager]);
-  if (isWeb) {
-    return <span className={[
-      `tui_Theme`,
-      ...!props.disableThemeClass ? [props.className, className].filter(Boolean) : []
-    ].join(" ")} style={{
-      display: "contents",
-      color: (_b = (_a = themes[name]) == null ? void 0 : _a.color) == null ? void 0 : _b.toString()
-    }}>{contents}</span>;
-  }
-  return contents;
-}, "Theme"));
-export {
-  Theme
-};