@tamagui/react-native-web-internals 2.0.0-rc.9 → 2.0.0

package/dist/cjs/StyleSheet/__tests__/validate-test.cjs

@@ -2,35 +2,50 @@ var import_validate = require("../validate.cjs");
 describe("validate", () => {
   beforeAll(() => {
     jest.spyOn(console, "error").mockImplementation(() => {});
-  }), afterAll(() => {
+  });
+  afterAll(() => {
     console.error.mockRestore();
-  }), afterEach(() => {
+  });
+  afterEach(() => {
     console.error.mockClear();
-  }), test("invalid shortform properties", () => {
+  });
+  test("invalid shortform properties", () => {
     (0, import_validate.validate)({
       background: "red"
-    }), (0, import_validate.validate)({
+    });
+    (0, import_validate.validate)({
       font: "arial"
-    }), (0, import_validate.validate)({
+    });
+    (0, import_validate.validate)({
       borderTop: "1px solid red"
-    }), expect(console.error).toHaveBeenCalled();
-  }), test("valid shortform values", () => {
+    });
+    expect(console.error).toHaveBeenCalled();
+  });
+  test("valid shortform values", () => {
     (0, import_validate.validate)({
       flex: 1
-    }), (0, import_validate.validate)({
+    });
+    (0, import_validate.validate)({
       margin: 10
-    }), (0, import_validate.validate)({
+    });
+    (0, import_validate.validate)({
       margin: "calc(10 * 1px)"
-    }), (0, import_validate.validate)({
+    });
+    (0, import_validate.validate)({
       margin: "calc(10 * calc(10 * 1px))"
-    }), expect(console.error).not.toHaveBeenCalled();
-  }), test("invalid shortform multi-values", () => {
+    });
+    expect(console.error).not.toHaveBeenCalled();
+  });
+  test("invalid shortform multi-values", () => {
     (0, import_validate.validate)({
       flex: "1 1 25%"
-    }), (0, import_validate.validate)({
+    });
+    (0, import_validate.validate)({
       margin: "10px 20px"
-    }), (0, import_validate.validate)({
+    });
+    (0, import_validate.validate)({
       margin: "calc(10 * 1px) var(--test)"
-    }), expect(console.error).toHaveBeenCalledTimes(3);
+    });
+    expect(console.error).toHaveBeenCalledTimes(3);
   });
 });

package/dist/cjs/StyleSheet/compiler/createReactDOMStyle.cjs

@@ -3,20 +3,22 @@ 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: !0
-    });
-  },
-  __copyProps = (to, from, except, desc) => {
-    if (from && typeof from == "object" || typeof from == "function") for (let key of __getOwnPropNames(from)) !__hasOwnProp.call(to, key) && key !== except && __defProp(to, key, {
+  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;
-  };
+  }
+  return to;
+};
 var __toCommonJS = mod => __copyProps(__defProp({}, "__esModule", {
-  value: !0
+  value: true
 }), mod);
 var createReactDOMStyle_exports = {};
 __export(createReactDOMStyle_exports, {
@@ -24,64 +26,135 @@ __export(createReactDOMStyle_exports, {
   createTransformValue: () => createTransformValue
 });
 module.exports = __toCommonJS(createReactDOMStyle_exports);
-var import_canUseDOM = require("../../modules/canUseDOM.cjs"),
-  import_normalizeValueWithProperty = require("./normalizeValueWithProperty.cjs");
-const emptyObject = {},
-  supportsCSS3TextDecoration = !import_canUseDOM.canUseDOM || window.CSS != null && window.CSS.supports != null && (window.CSS.supports("text-decoration-line", "none") || window.CSS.supports("-webkit-text-decoration-line", "none")),
-  ignoredProps = {
-    elevation: !0,
-    overlayColor: !0,
-    resizeMode: !0,
-    tintColor: !0
-  },
-  MONOSPACE_FONT_STACK = "monospace,monospace",
-  SYSTEM_FONT_STACK = '-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif',
-  STYLE_SHORT_FORM_EXPANSIONS = {
-    borderColor: ["borderTopColor", "borderRightColor", "borderBottomColor", "borderLeftColor"],
-    borderRadius: ["borderTopLeftRadius", "borderTopRightRadius", "borderBottomRightRadius", "borderBottomLeftRadius"],
-    borderStyle: ["borderTopStyle", "borderRightStyle", "borderBottomStyle", "borderLeftStyle"],
-    borderWidth: ["borderTopWidth", "borderRightWidth", "borderBottomWidth", "borderLeftWidth"],
-    marginHorizontal: ["marginRight", "marginLeft"],
-    marginVertical: ["marginTop", "marginBottom"],
-    overflow: ["overflowX", "overflowY"],
-    overscrollBehavior: ["overscrollBehaviorX", "overscrollBehaviorY"],
-    paddingHorizontal: ["paddingRight", "paddingLeft"],
-    paddingVertical: ["paddingTop", "paddingBottom"]
-  },
-  mapTransform = transform => {
-    const type = Object.keys(transform)[0],
-      value = transform[type];
-    if (type === "matrix" || type === "matrix3d") return `${type}(${value.join(",")})`;
-    {
-      const normalizedValue = (0, import_normalizeValueWithProperty.normalizeValueWithProperty)(value, type);
-      return `${type}(${normalizedValue})`;
+var import_canUseDOM = require("../../modules/canUseDOM.cjs");
+var import_normalizeValueWithProperty = require("./normalizeValueWithProperty.cjs");
+const emptyObject = {};
+const supportsCSS3TextDecoration = !import_canUseDOM.canUseDOM || window.CSS != null && window.CSS.supports != null && (window.CSS.supports("text-decoration-line", "none") || window.CSS.supports("-webkit-text-decoration-line", "none"));
+const ignoredProps = {
+  elevation: true,
+  overlayColor: true,
+  resizeMode: true,
+  tintColor: true
+};
+const MONOSPACE_FONT_STACK = "monospace,monospace";
+const SYSTEM_FONT_STACK = '-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif';
+const STYLE_SHORT_FORM_EXPANSIONS = {
+  borderColor: ["borderTopColor", "borderRightColor", "borderBottomColor", "borderLeftColor"],
+  borderRadius: ["borderTopLeftRadius", "borderTopRightRadius", "borderBottomRightRadius", "borderBottomLeftRadius"],
+  borderStyle: ["borderTopStyle", "borderRightStyle", "borderBottomStyle", "borderLeftStyle"],
+  borderWidth: ["borderTopWidth", "borderRightWidth", "borderBottomWidth", "borderLeftWidth"],
+  marginHorizontal: ["marginRight", "marginLeft"],
+  marginVertical: ["marginTop", "marginBottom"],
+  overflow: ["overflowX", "overflowY"],
+  overscrollBehavior: ["overscrollBehaviorX", "overscrollBehaviorY"],
+  paddingHorizontal: ["paddingRight", "paddingLeft"],
+  paddingVertical: ["paddingTop", "paddingBottom"]
+};
+const mapTransform = transform => {
+  const type = Object.keys(transform)[0];
+  const value = transform[type];
+  if (type === "matrix" || type === "matrix3d") {
+    return `${type}(${value.join(",")})`;
+  } else {
+    const normalizedValue = (0, import_normalizeValueWithProperty.normalizeValueWithProperty)(value, type);
+    return `${type}(${normalizedValue})`;
+  }
+};
+const createTransformValue = style => {
+  let transform = style.transform;
+  if (Array.isArray(style.transform)) {
+    transform = style.transform.map(mapTransform).join(" ");
+  }
+  return transform;
+};
+const createReactDOMStyle = (style, isInline) => {
+  if (!style) {
+    return emptyObject;
+  }
+  const resolvedStyle = {};
+  for (const prop in style) {
+    const value = style[prop];
+    if (
+    // Ignore everything with a null value
+    value == null ||
+    // Ignore some React Native styles
+    ignoredProps[prop]) {
+      continue;
     }
-  },
-  createTransformValue = style => {
-    let transform = style.transform;
-    return Array.isArray(style.transform) && (transform = style.transform.map(mapTransform).join(" ")), transform;
-  },
-  createReactDOMStyle = (style, isInline) => {
-    if (!style) return emptyObject;
-    const resolvedStyle = {};
-    for (const prop in style) {
-      const value = style[prop];
-      if (
-      // Ignore everything with a null value
-      !(value == null ||
-      // Ignore some React Native styles
-      ignoredProps[prop])) if (prop === "aspectRatio") resolvedStyle[prop] = value.toString();else if (prop === "backgroundClip") value === "text" && (resolvedStyle.backgroundClip = value, resolvedStyle.WebkitBackgroundClip = value);else if (prop === "flex") value === -1 ? (resolvedStyle.flexGrow = 0, resolvedStyle.flexShrink = 1, resolvedStyle.flexBasis = "auto") : resolvedStyle.flex = value;else if (prop === "font") resolvedStyle[prop] = value.replace("System", SYSTEM_FONT_STACK);else if (prop === "fontFamily") {
-        if (value.indexOf("System") > -1) {
-          const stack = value.split(/,\s*/);
-          stack[stack.indexOf("System")] = SYSTEM_FONT_STACK, resolvedStyle[prop] = stack.join(",");
-        } else value === "monospace" ? resolvedStyle[prop] = MONOSPACE_FONT_STACK : resolvedStyle[prop] = value;
-      } else if (prop === "fontVariant") Array.isArray(value) && value.length > 0 && (resolvedStyle.fontVariant = value.join(" "));else if (prop === "textAlignVertical") resolvedStyle.verticalAlign = value === "center" ? "middle" : value;else if (prop === "textDecorationLine") supportsCSS3TextDecoration ? resolvedStyle.textDecorationLine = value : resolvedStyle.textDecoration = value;else if (prop === "transform" || prop === "transformMatrix") resolvedStyle.transform = createTransformValue(style);else if (prop === "writingDirection") resolvedStyle.direction = value;else {
-        const value2 = (0, import_normalizeValueWithProperty.normalizeValueWithProperty)(style[prop], prop),
-          longFormProperties = STYLE_SHORT_FORM_EXPANSIONS[prop];
-        isInline && prop === "margin" ? (style.marginHorizontal == null && (resolvedStyle.marginLeft = value2, resolvedStyle.marginRight = value2), style.marginVertical == null && (resolvedStyle.marginTop = value2, resolvedStyle.marginBottom = value2)) : isInline && prop === "padding" ? (style.paddingHorizontal == null && (resolvedStyle.paddingLeft = value2, resolvedStyle.paddingRight = value2), style.paddingVertical == null && (resolvedStyle.paddingTop = value2, resolvedStyle.paddingBottom = value2)) : longFormProperties ? longFormProperties.forEach((longForm, i) => {
-          style[longForm] == null && (resolvedStyle[longForm] = value2);
-        }) : resolvedStyle[prop] = Array.isArray(value2) ? value2.join(",") : value2;
+    if (prop === "aspectRatio") {
+      resolvedStyle[prop] = value.toString();
+    } else if (prop === "backgroundClip") {
+      if (value === "text") {
+        resolvedStyle.backgroundClip = value;
+        resolvedStyle.WebkitBackgroundClip = value;
+      }
+    } else if (prop === "flex") {
+      if (value === -1) {
+        resolvedStyle.flexGrow = 0;
+        resolvedStyle.flexShrink = 1;
+        resolvedStyle.flexBasis = "auto";
+      } else {
+        resolvedStyle.flex = value;
+      }
+    } else if (prop === "font") {
+      resolvedStyle[prop] = value.replace("System", SYSTEM_FONT_STACK);
+    } else if (prop === "fontFamily") {
+      if (value.indexOf("System") > -1) {
+        const stack = value.split(/,\s*/);
+        stack[stack.indexOf("System")] = SYSTEM_FONT_STACK;
+        resolvedStyle[prop] = stack.join(",");
+      } else if (value === "monospace") {
+        resolvedStyle[prop] = MONOSPACE_FONT_STACK;
+      } else {
+        resolvedStyle[prop] = value;
+      }
+    } else if (prop === "fontVariant") {
+      if (Array.isArray(value) && value.length > 0) {
+        resolvedStyle.fontVariant = value.join(" ");
+      }
+    } else if (prop === "textAlignVertical") {
+      resolvedStyle.verticalAlign = value === "center" ? "middle" : value;
+    } else if (prop === "textDecorationLine") {
+      if (!supportsCSS3TextDecoration) {
+        resolvedStyle.textDecoration = value;
+      } else {
+        resolvedStyle.textDecorationLine = value;
+      }
+    } else if (prop === "transform" || prop === "transformMatrix") {
+      resolvedStyle.transform = createTransformValue(style);
+    } else if (prop === "writingDirection") {
+      resolvedStyle.direction = value;
+    } else {
+      const value2 = (0, import_normalizeValueWithProperty.normalizeValueWithProperty)(style[prop], prop);
+      const longFormProperties = STYLE_SHORT_FORM_EXPANSIONS[prop];
+      if (isInline && prop === "margin") {
+        if (style.marginHorizontal == null) {
+          resolvedStyle.marginLeft = value2;
+          resolvedStyle.marginRight = value2;
+        }
+        if (style.marginVertical == null) {
+          resolvedStyle.marginTop = value2;
+          resolvedStyle.marginBottom = value2;
+        }
+      } else if (isInline && prop === "padding") {
+        if (style.paddingHorizontal == null) {
+          resolvedStyle.paddingLeft = value2;
+          resolvedStyle.paddingRight = value2;
+        }
+        if (style.paddingVertical == null) {
+          resolvedStyle.paddingTop = value2;
+          resolvedStyle.paddingBottom = value2;
+        }
+      } else if (longFormProperties) {
+        longFormProperties.forEach((longForm, i) => {
+          if (style[longForm] == null) {
+            resolvedStyle[longForm] = value2;
+          }
+        });
+      } else {
+        resolvedStyle[prop] = Array.isArray(value2) ? value2.join(",") : value2;
       }
     }
-    return resolvedStyle;
-  };
+  }
+  return resolvedStyle;
+};

package/dist/cjs/StyleSheet/compiler/hash.cjs

@@ -3,20 +3,22 @@ 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: !0
-    });
-  },
-  __copyProps = (to, from, except, desc) => {
-    if (from && typeof from == "object" || typeof from == "function") for (let key of __getOwnPropNames(from)) !__hasOwnProp.call(to, key) && key !== except && __defProp(to, key, {
+  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;
-  };
+  }
+  return to;
+};
 var __toCommonJS = mod => __copyProps(__defProp({}, "__esModule", {
-  value: !0
+  value: true
 }), mod);
 var hash_exports = {};
 __export(hash_exports, {

package/dist/cjs/StyleSheet/compiler/hyphenateStyleName.cjs

@@ -3,34 +3,38 @@ 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: !0
-    });
-  },
-  __copyProps = (to, from, except, desc) => {
-    if (from && typeof from == "object" || typeof from == "function") for (let key of __getOwnPropNames(from)) !__hasOwnProp.call(to, key) && key !== except && __defProp(to, key, {
+  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;
-  };
+  }
+  return to;
+};
 var __toCommonJS = mod => __copyProps(__defProp({}, "__esModule", {
-  value: !0
+  value: true
 }), mod);
 var hyphenateStyleName_exports = {};
 __export(hyphenateStyleName_exports, {
   hyphenateStyleName: () => hyphenateStyleName
 });
 module.exports = __toCommonJS(hyphenateStyleName_exports);
-const uppercasePattern = /[A-Z]/g,
-  msPattern = /^ms-/,
-  cache = {};
+const uppercasePattern = /[A-Z]/g;
+const msPattern = /^ms-/;
+const cache = {};
 function toHyphenLower(match) {
   return "-" + match.toLowerCase();
 }
 function hyphenateStyleName(name) {
-  if (name in cache) return cache[name];
+  if (name in cache) {
+    return cache[name];
+  }
   const hName = name.replace(uppercasePattern, toHyphenLower);
   return cache[name] = msPattern.test(hName) ? "-" + hName : hName;
 }