@hanzogui/react-native-web-internals 2.0.0

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

@@ -0,0 +1,87 @@
+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: !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, {
+      get: () => from[key],
+      enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable
+    });
+    return to;
+  };
+var __toCommonJS = mod => __copyProps(__defProp({}, "__esModule", {
+  value: !0
+}), mod);
+var createReactDOMStyle_exports = {};
+__export(createReactDOMStyle_exports, {
+  createReactDOMStyle: () => createReactDOMStyle,
+  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})`;
+    }
+  },
+  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;
+      }
+    }
+    return resolvedStyle;
+  };

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

@@ -0,0 +1,26 @@
+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: !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, {
+      get: () => from[key],
+      enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable
+    });
+    return to;
+  };
+var __toCommonJS = mod => __copyProps(__defProp({}, "__esModule", {
+  value: !0
+}), 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,36 @@
+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: !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, {
+      get: () => from[key],
+      enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable
+    });
+    return to;
+  };
+var __toCommonJS = mod => __copyProps(__defProp({}, "__esModule", {
+  value: !0
+}), mod);
+var hyphenateStyleName_exports = {};
+__export(hyphenateStyleName_exports, {
+  hyphenateStyleName: () => hyphenateStyleName
+});
+module.exports = __toCommonJS(hyphenateStyleName_exports);
+const uppercasePattern = /[A-Z]/g,
+  msPattern = /^ms-/,
+  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;
+}

package/dist/cjs/StyleSheet/compiler/index.cjs

@@ -0,0 +1,318 @@
+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: !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, {
+      get: () => from[key],
+      enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable
+    });
+    return to;
+  };
+var __toCommonJS = mod => __copyProps(__defProp({}, "__esModule", {
+  value: !0
+}), mod);
+var compiler_exports = {};
+__export(compiler_exports, {
+  atomic: () => atomic,
+  classic: () => classic,
+  inline: () => inline,
+  stringifyValueWithProperty: () => stringifyValueWithProperty
+});
+module.exports = __toCommonJS(compiler_exports);
+var import_simple_hash = require("@hanzogui/simple-hash"),
+  import_createReactDOMStyle = require("./createReactDOMStyle.cjs"),
+  import_hyphenateStyleName = require("./hyphenateStyleName.cjs"),
+  import_normalizeValueWithProperty = require("./normalizeValueWithProperty.cjs");
+const cache = /* @__PURE__ */new Map(),
+  emptyObject = {},
+  classicGroup = 1,
+  atomicGroup = 2.2,
+  customGroup = {
+    borderColor: 2,
+    borderRadius: 2,
+    borderStyle: 2,
+    borderWidth: 2,
+    display: 2,
+    flex: 2,
+    margin: 2,
+    overflow: 2,
+    overscrollBehavior: 2,
+    padding: 2,
+    marginHorizontal: 2.1,
+    marginVertical: 2.1,
+    paddingHorizontal: 2.1,
+    paddingVertical: 2.1
+  },
+  borderTopLeftRadius = "borderTopLeftRadius",
+  borderTopRightRadius = "borderTopRightRadius",
+  borderBottomLeftRadius = "borderBottomLeftRadius",
+  borderBottomRightRadius = "borderBottomRightRadius",
+  borderLeftColor = "borderLeftColor",
+  borderLeftStyle = "borderLeftStyle",
+  borderLeftWidth = "borderLeftWidth",
+  borderRightColor = "borderRightColor",
+  borderRightStyle = "borderRightStyle",
+  borderRightWidth = "borderRightWidth",
+  right = "right",
+  marginLeft = "marginLeft",
+  marginRight = "marginRight",
+  paddingLeft = "paddingLeft",
+  paddingRight = "paddingRight",
+  left = "left",
+  PROPERTIES_FLIP = {
+    [borderTopLeftRadius]: borderTopRightRadius,
+    [borderTopRightRadius]: borderTopLeftRadius,
+    [borderBottomLeftRadius]: borderBottomRightRadius,
+    [borderBottomRightRadius]: borderBottomLeftRadius,
+    [borderLeftColor]: borderRightColor,
+    [borderLeftStyle]: borderRightStyle,
+    [borderLeftWidth]: borderRightWidth,
+    [borderRightColor]: borderLeftColor,
+    [borderRightStyle]: borderLeftStyle,
+    [borderRightWidth]: borderLeftWidth,
+    [left]: right,
+    [marginLeft]: marginRight,
+    [marginRight]: marginLeft,
+    [paddingLeft]: paddingRight,
+    [paddingRight]: paddingLeft,
+    [right]: left
+  },
+  PROPERTIES_I18N = {
+    borderTopStartRadius: borderTopLeftRadius,
+    borderTopEndRadius: borderTopRightRadius,
+    borderBottomStartRadius: borderBottomLeftRadius,
+    borderBottomEndRadius: borderBottomRightRadius,
+    borderStartColor: borderLeftColor,
+    borderStartStyle: borderLeftStyle,
+    borderStartWidth: borderLeftWidth,
+    borderEndColor: borderRightColor,
+    borderEndStyle: borderRightStyle,
+    borderEndWidth: borderRightWidth,
+    end: right,
+    marginStart: marginLeft,
+    marginEnd: marginRight,
+    paddingStart: paddingLeft,
+    paddingEnd: paddingRight,
+    start: left
+  },
+  PROPERTIES_VALUE = ["clear", "float", "textAlign"];
+function atomic(style) {
+  const compiledStyle = {
+      $$css: !0
+    },
+    compiledRules = [];
+  function atomicCompile(prop, value) {
+    const valueString = stringifyValueWithProperty(value, prop),
+      cacheKey = prop + valueString,
+      cachedResult = cache.get(cacheKey);
+    let identifier;
+    if (cachedResult != null) identifier = cachedResult[0], compiledRules.push(cachedResult[1]);else {
+      identifier = createIdentifier("r", prop, value);
+      const order = customGroup[prop] || atomicGroup,
+        orderedRules = [createAtomicRules(identifier, prop, value), order];
+      compiledRules.push(orderedRules), cache.set(cacheKey, [identifier, orderedRules]);
+    }
+    return identifier;
+  }
+  return Object.keys(style).sort().forEach(prop => {
+    const value = style[prop];
+    if (value != null) {
+      let localizeableValue;
+      if (PROPERTIES_VALUE.indexOf(prop) > -1) {
+        const left2 = atomicCompile(prop, "left"),
+          right2 = atomicCompile(prop, "right");
+        value === "start" ? localizeableValue = [left2, right2] : value === "end" && (localizeableValue = [right2, left2]);
+      }
+      const propPolyfill = PROPERTIES_I18N[prop];
+      if (propPolyfill != null) {
+        const ltr = atomicCompile(propPolyfill, value),
+          rtl = atomicCompile(PROPERTIES_FLIP[propPolyfill], value);
+        localizeableValue = [ltr, rtl];
+      }
+      if (prop === "transitionProperty") {
+        const values = Array.isArray(value) ? value : [value],
+          polyfillIndices = [];
+        for (let i = 0; i < values.length; i++) {
+          const val = values[i];
+          typeof val == "string" && PROPERTIES_I18N[val] != null && polyfillIndices.push(i);
+        }
+        if (polyfillIndices.length > 0) {
+          const ltrPolyfillValues = [...values],
+            rtlPolyfillValues = [...values];
+          polyfillIndices.forEach(i => {
+            const ltrVal = ltrPolyfillValues[i];
+            if (typeof ltrVal == "string") {
+              const ltrPolyfill = PROPERTIES_I18N[ltrVal],
+                rtlPolyfill = PROPERTIES_FLIP[ltrPolyfill];
+              ltrPolyfillValues[i] = ltrPolyfill, rtlPolyfillValues[i] = rtlPolyfill;
+              const ltr = atomicCompile(prop, ltrPolyfillValues),
+                rtl = atomicCompile(prop, rtlPolyfillValues);
+              localizeableValue = [ltr, rtl];
+            }
+          });
+        }
+      }
+      localizeableValue == null ? localizeableValue = atomicCompile(prop, value) : compiledStyle.$$css$localize = !0, compiledStyle[prop] = localizeableValue;
+    }
+  }), [compiledStyle, compiledRules];
+}
+function classic(style, name) {
+  const compiledStyle = {
+      $$css: !0
+    },
+    compiledRules = [],
+    {
+      animationKeyframes,
+      ...rest
+    } = style,
+    identifier = createIdentifier("css", name, style),
+    selector = `.${identifier}`;
+  let animationName;
+  if (animationKeyframes != null) {
+    const [animationNames, keyframesRules] = processKeyframesValue(animationKeyframes);
+    animationName = animationNames.join(","), compiledRules.push(...keyframesRules);
+  }
+  const block = createDeclarationBlock({
+    ...rest,
+    animationName
+  });
+  return compiledRules.push(`${selector}${block}`), compiledStyle[identifier] = identifier, [compiledStyle, [[compiledRules, classicGroup]]];
+}
+function inline(originalStyle, isRTL) {
+  const style = originalStyle || emptyObject,
+    frozenProps = {},
+    nextStyle = {};
+  for (const originalProp in style) {
+    const originalValue = style[originalProp];
+    let prop = originalProp,
+      value = originalValue;
+    if (!Object.prototype.hasOwnProperty.call(style, originalProp) || originalValue == null) continue;
+    PROPERTIES_VALUE.indexOf(originalProp) > -1 && (originalValue === "start" ? value = isRTL ? "right" : "left" : originalValue === "end" && (value = isRTL ? "left" : "right"));
+    const propPolyfill = PROPERTIES_I18N[originalProp];
+    if (propPolyfill != null && (prop = isRTL ? PROPERTIES_FLIP[propPolyfill] : propPolyfill), originalProp === "transitionProperty") {
+      const originalValues = Array.isArray(originalValue) ? originalValue : [originalValue];
+      originalValues.forEach((val, i) => {
+        if (typeof val == "string") {
+          const valuePolyfill = PROPERTIES_I18N[val];
+          valuePolyfill != null && (originalValues[i] = isRTL ? PROPERTIES_FLIP[valuePolyfill] : valuePolyfill);
+        }
+      });
+    }
+    frozenProps[prop] || (nextStyle[prop] = value), PROPERTIES_I18N.hasOwnProperty(originalProp) && (frozenProps[prop] = !0);
+  }
+  return (0, import_createReactDOMStyle.createReactDOMStyle)(nextStyle, !0);
+}
+function stringifyValueWithProperty(value, property) {
+  const normalizedValue = (0, import_normalizeValueWithProperty.normalizeValueWithProperty)(value, property);
+  return typeof normalizedValue != "string" ? JSON.stringify(normalizedValue || "") : normalizedValue;
+}
+function createAtomicRules(identifier, property, value) {
+  const rules = [],
+    selector = `.${identifier}`;
+  switch (property) {
+    case "animationKeyframes":
+      {
+        const [animationNames, keyframesRules] = processKeyframesValue(value),
+          block = createDeclarationBlock({
+            animationName: animationNames.join(",")
+          });
+        rules.push(`${selector}${block}`, ...keyframesRules);
+        break;
+      }
+    // Equivalent to using '::placeholder'
+    case "placeholderTextColor":
+      {
+        const block = createDeclarationBlock({
+          color: value,
+          opacity: 1
+        });
+        rules.push(`${selector}::-webkit-input-placeholder${block}`, `${selector}::-moz-placeholder${block}`, `${selector}:-ms-input-placeholder${block}`, `${selector}::placeholder${block}`);
+        break;
+      }
+    // Polyfill for additional 'pointer-events' values
+    // See d13f78622b233a0afc0c7a200c0a0792c8ca9e58
+    case "pointerEvents":
+      {
+        let finalValue = value;
+        if (value === "auto" || value === "box-only") {
+          if (finalValue = "auto!important", value === "box-only") {
+            const block2 = createDeclarationBlock({
+              pointerEvents: "none"
+            });
+            rules.push(`${selector}>*${block2}`);
+          }
+        } else if ((value === "none" || value === "box-none") && (finalValue = "none!important", value === "box-none")) {
+          const block2 = createDeclarationBlock({
+            pointerEvents: "auto"
+          });
+          rules.push(`${selector}>*${block2}`);
+        }
+        const block = createDeclarationBlock({
+          pointerEvents: finalValue
+        });
+        rules.push(`${selector}${block}`);
+        break;
+      }
+    // Polyfill for draft spec
+    // https://drafts.csswg.org/css-scrollbars-1/
+    case "scrollbarWidth":
+      {
+        value === "none" && rules.push(`${selector}::-webkit-scrollbar{display:none}`);
+        const block = createDeclarationBlock({
+          scrollbarWidth: value
+        });
+        rules.push(`${selector}${block}`);
+        break;
+      }
+    default:
+      {
+        const block = createDeclarationBlock({
+          [property]: value
+        });
+        rules.push(`${selector}${block}`);
+        break;
+      }
+  }
+  return rules;
+}
+function createDeclarationBlock(style) {
+  const domStyle = (0, import_createReactDOMStyle.createReactDOMStyle)(style);
+  return `{${Object.keys(domStyle).map(property => {
+    const value = domStyle[property],
+      prop = (0, import_hyphenateStyleName.hyphenateStyleName)(property);
+    return Array.isArray(value) ? value.map(v => `${prop}:${v}`).join(";") : `${prop}:${value}`;
+  }).sort().join(";")};}`;
+}
+function createIdentifier(prefix, name, value) {
+  const hashedString = (0, import_simple_hash.simpleHash)(name + stringifyValueWithProperty(value, name));
+  return process.env.NODE_ENV !== "production" ? `${prefix}-${name}-${hashedString}` : `${prefix}-${hashedString}`;
+}
+function createKeyframes(keyframes) {
+  const prefixes = ["-webkit-", ""],
+    identifier = createIdentifier("r", "animation", keyframes),
+    steps = "{" + Object.keys(keyframes).map(stepName => {
+      const rule = keyframes[stepName],
+        block = createDeclarationBlock(rule);
+      return `${stepName}${block}`;
+    }).join("") + "}",
+    rules = prefixes.map(prefix => `@${prefix}keyframes ${identifier}${steps}`);
+  return [identifier, rules];
+}
+function processKeyframesValue(keyframesValue) {
+  if (typeof keyframesValue == "number") throw new Error(`Invalid CSS keyframes type: ${typeof keyframesValue}`);
+  const animationNames = [],
+    rules = [];
+  return (Array.isArray(keyframesValue) ? keyframesValue : [keyframesValue]).forEach(keyframes => {
+    if (typeof keyframes == "string") animationNames.push(keyframes);else {
+      const [identifier, keyframesRules] = createKeyframes(keyframes);
+      animationNames.push(identifier), rules.push(...keyframesRules);
+    }
+  }), [animationNames, rules];
+}

package/dist/cjs/StyleSheet/compiler/normalizeColor.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: !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, {
+      get: () => from[key],
+      enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable
+    });
+    return to;
+  };
+var __toCommonJS = mod => __copyProps(__defProp({}, "__esModule", {
+  value: !0
+}), mod);
+var normalizeColor_exports = {};
+__export(normalizeColor_exports, {
+  normalizeColor: () => normalizeColor
+});
+module.exports = __toCommonJS(normalizeColor_exports);
+var import_isWebColor = require("../../modules/isWebColor/index.cjs"),
+  import_processColor = require("../../modules/processColor/index.cjs");
+const normalizeColor = (color, opacity = 1) => {
+  if (color == null) return;
+  if (typeof color == "string" && (0, import_isWebColor.isWebColor)(color)) return color;
+  const colorInt = (0, import_processColor.processColor)(color);
+  if (colorInt != null) {
+    const r = colorInt >> 16 & 255,
+      g = colorInt >> 8 & 255,
+      b = colorInt & 255,
+      alpha = ((colorInt >> 24 & 255) / 255 * opacity).toFixed(2);
+    return `rgba(${r},${g},${b},${alpha})`;
+  }
+  if (typeof color == "string") return color;
+};

package/dist/cjs/StyleSheet/compiler/normalizeValueWithProperty.cjs

@@ -0,0 +1,43 @@
+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: !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, {
+      get: () => from[key],
+      enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable
+    });
+    return to;
+  };
+var __toCommonJS = mod => __copyProps(__defProp({}, "__esModule", {
+  value: !0
+}), mod);
+var normalizeValueWithProperty_exports = {};
+__export(normalizeValueWithProperty_exports, {
+  normalizeValueWithProperty: () => normalizeValueWithProperty
+});
+module.exports = __toCommonJS(normalizeValueWithProperty_exports);
+var import_unitlessNumbers = require("../../modules/unitlessNumbers/index.cjs"),
+  import_normalizeColor = require("./normalizeColor.cjs");
+const colorProps = {
+  backgroundColor: !0,
+  borderColor: !0,
+  borderTopColor: !0,
+  borderRightColor: !0,
+  borderBottomColor: !0,
+  borderLeftColor: !0,
+  color: !0,
+  shadowColor: !0,
+  textDecorationColor: !0,
+  textShadowColor: !0
+};
+function normalizeValueWithProperty(value, property) {
+  let returnValue = value;
+  return (property == null || !import_unitlessNumbers.unitlessNumbers[property]) && typeof value == "number" ? returnValue = `${value}px` : property != null && colorProps[property] && (returnValue = (0, import_normalizeColor.normalizeColor)(value)), returnValue;
+}

package/dist/cjs/StyleSheet/compiler/resolveShadowValue.cjs

@@ -0,0 +1,48 @@
+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: !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, {
+      get: () => from[key],
+      enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable
+    });
+    return to;
+  };
+var __toCommonJS = mod => __copyProps(__defProp({}, "__esModule", {
+  value: !0
+}), mod);
+var resolveShadowValue_exports = {};
+__export(resolveShadowValue_exports, {
+  resolveShadowValue: () => resolveShadowValue
+});
+module.exports = __toCommonJS(resolveShadowValue_exports);
+var import_normalizeColor = require("./normalizeColor.cjs"),
+  import_normalizeValueWithProperty = require("./normalizeValueWithProperty.cjs");
+const defaultOffset = {
+    height: 0,
+    width: 0
+  },
+  resolveShadowValue = style => {
+    const {
+        shadowColor,
+        shadowOffset,
+        shadowOpacity,
+        shadowRadius
+      } = style,
+      {
+        height,
+        width
+      } = shadowOffset || defaultOffset,
+      offsetX = (0, import_normalizeValueWithProperty.normalizeValueWithProperty)(width),
+      offsetY = (0, import_normalizeValueWithProperty.normalizeValueWithProperty)(height),
+      blurRadius = (0, import_normalizeValueWithProperty.normalizeValueWithProperty)(shadowRadius || 0),
+      color = (0, import_normalizeColor.normalizeColor)(shadowColor || "black", shadowOpacity);
+    if (color != null && offsetX != null && offsetY != null && blurRadius != null) return `${offsetX} ${offsetY} ${blurRadius} ${color}`;
+  };

package/dist/cjs/StyleSheet/dom/createCSSStyleSheet.cjs

@@ -0,0 +1,37 @@
+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: !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, {
+      get: () => from[key],
+      enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable
+    });
+    return to;
+  };
+var __toCommonJS = mod => __copyProps(__defProp({}, "__esModule", {
+  value: !0
+}), mod);
+var createCSSStyleSheet_exports = {};
+__export(createCSSStyleSheet_exports, {
+  createCSSStyleSheet: () => createCSSStyleSheet
+});
+module.exports = __toCommonJS(createCSSStyleSheet_exports);
+var import_canUseDOM = require("../../modules/canUseDOM.cjs");
+function createCSSStyleSheet(id, rootNode, textContent) {
+  if (import_canUseDOM.canUseDOM) {
+    const root = rootNode ?? document;
+    let element = root.getElementById(id);
+    if (element == null) if (element = document.createElement("style"), element.setAttribute("id", id), typeof textContent == "string" && element.appendChild(document.createTextNode(textContent)), root instanceof ShadowRoot) root.insertBefore(element, root.firstChild);else {
+      const head = root.head;
+      head && head.appendChild(element);
+    }
+    return element.sheet;
+  } else return null;
+}