react-native-web-internals
Version:
React Native for Web
95 lines (94 loc) • 3.44 kB
JavaScript
import { styleq } from "styleq";
import { localizeStyle } from "styleq/transform-localize-style.js";
import { canUseDOM } from "../index";
import { atomic, classic, inline } from "./compiler/index";
import { createSheet } from "./dom/index";
import { preprocess } from "./preprocess";
import { validate } from "./validate";
const staticStyleMap = /* @__PURE__ */ new WeakMap(), sheet = createSheet();
function customStyleq(styles, isRTL) {
return styleq.factory({
transform(style) {
const compiledStyle = staticStyleMap.get(style);
return compiledStyle != null ? localizeStyle(compiledStyle, isRTL) : style;
}
})(styles);
}
function insertRules(compiledOrderedRules) {
compiledOrderedRules.forEach(([rules, order]) => {
sheet != null && rules.forEach((rule) => {
sheet.insert(rule, order);
});
});
}
function compileAndInsertAtomic(style) {
const [compiledStyle, compiledOrderedRules] = atomic(preprocess(style));
return insertRules(compiledOrderedRules), compiledStyle;
}
function compileAndInsertReset(style, key) {
const [compiledStyle, compiledOrderedRules] = classic(style, key);
return insertRules(compiledOrderedRules), compiledStyle;
}
const absoluteFillObject = {
position: "absolute",
left: 0,
right: 0,
top: 0,
bottom: 0
}, absoluteFill = create({ x: { ...absoluteFillObject } }).x;
function create(styles) {
return Object.keys(styles).forEach((key) => {
const styleObj = styles[key];
if (styleObj != null && styleObj.$$css !== !0) {
let compiledStyles;
key.indexOf("$raw") > -1 ? compiledStyles = compileAndInsertReset(styleObj, key.split("$raw")[0]) : (process.env.NODE_ENV !== "production" && (validate(styleObj), styles[key] = Object.freeze(styleObj)), compiledStyles = compileAndInsertAtomic(styleObj)), staticStyleMap.set(styleObj, compiledStyles);
}
}), styles;
}
function compose(style1, style2) {
if (process.env.NODE_ENV !== "production") {
const len = arguments.length;
if (len > 2) {
const readableStyles = [...arguments].map((a) => flatten(a));
throw new Error(
`StyleSheet.compose() only accepts 2 arguments, received ${len}: ${JSON.stringify(
readableStyles
)}`
);
}
}
return style1 && style2 ? [style1, style2] : style1 || style2;
}
function flatten(...styles) {
const flatArray = styles.flat(1 / 0), result = {};
for (let i = 0; i < flatArray.length; i++) {
const style = flatArray[i];
style != null && typeof style == "object" && Object.assign(result, style);
}
return result;
}
function getSheet() {
return {
id: sheet.id,
textContent: sheet.getTextContent()
};
}
function StyleSheet(styles, options) {
const isRTL = options != null && options.writingDirection === "rtl", styleProps = customStyleq(styles, isRTL);
return Array.isArray(styleProps) && styleProps[1] != null && (styleProps[1] = inline(preprocess(styleProps[1]), isRTL)), styleProps;
}
StyleSheet.absoluteFill = absoluteFill;
StyleSheet.absoluteFillObject = absoluteFillObject;
StyleSheet.create = create;
StyleSheet.compose = compose;
StyleSheet.flatten = flatten;
StyleSheet.getSheet = getSheet;
StyleSheet.hairlineWidth = 1;
setTimeout(() => {
canUseDOM && window.__REACT_DEVTOOLS_GLOBAL_HOOK__ && (window.__REACT_DEVTOOLS_GLOBAL_HOOK__.resolveRNStyle = StyleSheet.flatten);
}, 100);
export {
StyleSheet as default,
flatten
};
//# sourceMappingURL=index.js.map