@stylexjs/stylex - npm Package Compare versions

Comparing version 0.2.0-beta.10 to 0.2.0-beta.11

lib/native/__tests__/__snapshots__/stylex-test.js.snap

lib/native/__tests__/stylex-test.js

lib/native/CSSCustomPropertyValue.js

lib/native/CSSLengthUnitValue.js

lib/native/CSSMediaQuery.js

lib/native/errorMsg.js

lib/native/flattenStyle.js

lib/native/parseShadow.js

lib/native/stylex.js

package.json

		{
		"name": "@stylexjs/stylex",
		"version": "0.2.0-beta.10",
		"description": "A minimal runtime styling library for web.",
		"version": "0.2.0-beta.11",
		"description": "A styling library for React.",
		"main": "lib/stylex.js",
		"react-native": "lib/native/stylex.js",
		"types": "lib/stylex.d.ts",
		"repository": "https://www.github.com/facebookexternal/stylex",
		"author": "Naman Goel <nmn@fb.com>",
		"repository": "https://www.github.com/facebook/stylex",
		"license": "MIT",
		@@ -16,2 +16,3 @@ "scripts": {
		"dependencies": {
		"css-mediaquery": "^0.1.2",
		"invariant": "^2.2.4",
		@@ -18,0 +19,0 @@ "utility-types": "^3.10.0",

README.md

		@@ -90,11 +90,11 @@ # @stylexjs/stylex

		### stylex.apply()
		### stylex.spread()

		Applying style rules to specific elements is done using `stylex.apply()`. Each argument to this function must be a reference to a compiled style object, or an array of compiled style objects. The function merges styles from left to right.
		Applying style rules to specific elements is done using `stylex.spread`. Each argument to this function must be a reference to a compiled style object, or an array of compiled style objects. The function merges styles from left to right.

		```tsx
		<div {...stylex.apply(styles.root, styles.highlighted)} />
		<div {...stylex.spread(styles.root, styles.highlighted)} />
		```

		The `stylex.apply` function returns React DOM style props as required to render an HTML element. StyleX styles can still be passed to other components via props, but only the components rendering HTML elements will use `stylex.apply()`. For example:
		The `stylex.spread` function returns React props as required to render an element. StyleX styles can still be passed to other components via props, but only the components rendering host platform elements will use `stylex.spread()`. For example:

		@@ -112,3 +112,3 @@ ```tsx
		function InternalComponent(props) {
		return <div {...props} {...stylex.apply([ styles.internalRoot, props.style ])} />
		return <div {...props} {...stylex.spread([ styles.internalRoot, props.style ])} />
		}
		@@ -124,3 +124,3 @@
		```tsx
		<div {...stylex.apply(styles.root, isHighlighted && styles.highlighted)} />
		<div {...stylex.spread(styles.root, isHighlighted && styles.highlighted)} />
		```
		@@ -131,3 +131,3 @@
		```tsx
		<div {...stylex.apply(props.style, styles.root)} />
		<div {...stylex.spread(props.style, styles.root)} />
		```
		@@ -138,3 +138,3 @@
		```tsx
		<div {...stylex.apply(styles.root, { opacity })} />
		<div {...stylex.spread(styles.root, { opacity })} />
		```
		@@ -182,3 +182,3 @@
		return (
		<div {...stylex.apply(localStyles.foo, localStyles.bar, style)} />
		<div {...stylex.spread(localStyles.foo, localStyles.bar, style)} />
		);
		@@ -185,0 +185,0 @@ }

@stylexjs/stylex - npm Package Compare versions

New alerts

Fixed alerts

Improved metrics

Worsened metrics

Dependency changes