@hanzogui/react-native-web-internals 2.0.0-rc.41-hanzoai.5

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

@@ -0,0 +1,121 @@
+var import_preprocess = require("../preprocess.cjs");
+describe("StyleSheet/preprocess", () => {
+  describe("preprocesses multiple shadow styles into a single declaration", () => {
+    test("shadowColor only", () => {
+      expect((0, import_preprocess.preprocess)({
+        shadowColor: "red"
+      })).toEqual({
+        boxShadow: "0px 0px 0px rgba(255,0,0,1.00)"
+      });
+    });
+    test("shadowColor and shadowOpacity only", () => {
+      expect((0, import_preprocess.preprocess)({
+        shadowColor: "red",
+        shadowOpacity: 0.5
+      })).toEqual({
+        boxShadow: "0px 0px 0px rgba(255,0,0,0.50)"
+      });
+    });
+    test("shadowOffset only", () => {
+      expect((0, import_preprocess.preprocess)({
+        shadowOffset: {
+          width: 1,
+          height: 2
+        }
+      })).toEqual({
+        boxShadow: "1px 2px 0px rgba(0,0,0,1.00)"
+      });
+    });
+    test("shadowRadius only", () => {
+      expect((0, import_preprocess.preprocess)({
+        shadowRadius: 5
+      })).toEqual({
+        boxShadow: "0px 0px 5px rgba(0,0,0,1.00)"
+      });
+    });
+    test("shadowOffset, shadowRadius, shadowColor", () => {
+      expect((0, import_preprocess.preprocess)({
+        shadowColor: "rgba(50,60,70,0.5)",
+        shadowOffset: {
+          width: 1,
+          height: 2
+        },
+        shadowOpacity: 0.5,
+        shadowRadius: 3
+      })).toEqual({
+        boxShadow: "1px 2px 3px rgba(50,60,70,0.25)"
+      });
+    });
+  });
+  describe("preprocesses multiple textShadow styles into a single declaration", () => {
+    test("textShadowColor only", () => {
+      expect((0, import_preprocess.preprocess)({
+        textShadowColor: "red"
+      })).toEqual({});
+    });
+    test("textShadowOffset only", () => {
+      expect((0, import_preprocess.preprocess)({
+        textShadowOffset: {
+          width: 1,
+          height: 2
+        }
+      })).toEqual({});
+    });
+    test("textShadowRadius only", () => {
+      expect((0, import_preprocess.preprocess)({
+        textShadowRadius: 5
+      })).toEqual({});
+    });
+    test("textShadowColor and textShadowOffset only", () => {
+      expect((0, import_preprocess.preprocess)({
+        textShadowColor: "red",
+        textShadowOffset: {
+          width: 0,
+          height: 0
+        }
+      })).toEqual({});
+      expect((0, import_preprocess.preprocess)({
+        textShadowColor: "red",
+        textShadowOffset: {
+          width: -1,
+          height: 0
+        }
+      })).toEqual({
+        textShadow: "-1px 0px 0px rgba(255,0,0,1.00)"
+      });
+      expect((0, import_preprocess.preprocess)({
+        textShadowColor: "red",
+        textShadowOffset: {
+          width: 1,
+          height: 2
+        }
+      })).toEqual({
+        textShadow: "1px 2px 0px rgba(255,0,0,1.00)"
+      });
+    });
+    test("textShadowColor and textShadowRadius only", () => {
+      expect((0, import_preprocess.preprocess)({
+        textShadowColor: "red",
+        textShadowRadius: 0
+      })).toEqual({});
+      expect((0, import_preprocess.preprocess)({
+        textShadowColor: "red",
+        textShadowRadius: 5
+      })).toEqual({
+        textShadow: "0px 0px 5px rgba(255,0,0,1.00)"
+      });
+    });
+    test("textShadowColor, textShadowOffset, textShadowRadius", () => {
+      expect((0, import_preprocess.preprocess)({
+        textShadowColor: "rgba(50,60,70,0.50)",
+        textShadowOffset: {
+          width: 5,
+          height: 10
+        },
+        textShadowRadius: 15
+      })).toEqual({
+        textShadow: "5px 10px 15px rgba(50,60,70,0.50)"
+      });
+    });
+  });
+});

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

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

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

@@ -0,0 +1,160 @@
+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 createReactDOMStyle_exports = {};
+__export(createReactDOMStyle_exports, {
+  createReactDOMStyle: () => createReactDOMStyle,
+  createTransformValue: () => createTransformValue
+});
+module.exports = __toCommonJS(createReactDOMStyle_exports);
+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;
+    }
+    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;
+};

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

@@ -0,0 +1,28 @@
+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 hash_exports = {};
+__export(hash_exports, {
+  default: () => import_simple_hash.simpleHash
+});
+module.exports = __toCommonJS(hash_exports);
+var import_simple_hash = require("@hanzogui/simple-hash");

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

@@ -0,0 +1,40 @@
+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 hyphenateStyleName_exports = {};
+__export(hyphenateStyleName_exports, {
+  hyphenateStyleName: () => hyphenateStyleName
+});
+module.exports = __toCommonJS(hyphenateStyleName_exports);
+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];
+  }
+  const hName = name.replace(uppercasePattern, toHyphenLower);
+  return cache[name] = msPattern.test(hName) ? "-" + hName : hName;
+}