UNPKG

react-native-web-internals

Version:

React Native for Web

95 lines (94 loc) 3.44 kB
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