Skip to content

Commit

Permalink
Update docs for 0.18 release
Browse files Browse the repository at this point in the history
  • Loading branch information
necolas committed Jun 10, 2022
1 parent 094bd0e commit cb8381a
Show file tree
Hide file tree
Showing 6 changed files with 19 additions and 21 deletions.
5 changes: 3 additions & 2 deletions packages/docs/src/pages/docs/apis/style-sheet.md
Original file line number Diff line number Diff line change
Expand Up @@ -5,6 +5,7 @@ permalink: /docs/style-sheet/index.html
eleventyNavigation:
key: StyleSheet
parent: APIs
label: "Change"
---

{% import "fragments/macros.html" as macro with context %}
Expand Down Expand Up @@ -48,9 +49,9 @@ Combines two styles such that the last style overrides properties of the first s
{% endcall %}

{% call macro.prop('create', '({ [key]: ruleset }) => ({ [key]: number })') %}
Define style objects. Each key of the object passed to `create` must define a style object. These values are opaque and should not be introspected.
Define style objects. Each key of the object passed to `create` must define a style object. These values should not be introspected at runtime.
{% endcall %}

{% call macro.prop('flatten', '(styles: Style) => Object') %}
Lookup a style object by ID or flatten an array of styles into a single style object.
Flatten an array of styles into a single style object. **This is not recommended as it is not compatible with static extraction of styles to CSS.**
{% endcall %}
26 changes: 11 additions & 15 deletions packages/docs/src/pages/docs/appendix/unstable-apis.md
Original file line number Diff line number Diff line change
Expand Up @@ -2,11 +2,12 @@
title: Unstable APIs
date: Last Modified
permalink: /docs/unstable-apis/index.html
description:
description:
eleventyNavigation:
key: Unstable APIs
parent: Appendix
order: 1
label: "Change"
---

:::lead
Expand All @@ -28,13 +29,16 @@ This also works with composite components defined in your existing component gal

```js
import RaisedButton from 'material-ui/RaisedButton';
import { unstable_createElement } from 'react-native-web';
import { StyleSheet } from 'react-native';
import { unstable_createElement, useLocaleContext } from 'react-native-web';
import { StyleSheet, } from 'react-native';

const CustomButton = (props) => unstable_createElement(RaisedButton, {
...props,
style: [ styles.button, props.style ]
});
const CustomButton = (props) => {
const { direction } = useLocaleContext();
return unstable_createElement(RaisedButton, {
...props,
style: [ styles.button, props.style ]
});
}, { writingDirection: direction });

const styles = StyleSheet.create({
button: {
Expand All @@ -43,14 +47,6 @@ const styles = StyleSheet.create({
});
```

And `unstable_createElement` can be used as drop-in replacement for `React.createElement`:

```jsx
/* @jsx unstable_createElement */
import { unstable_createElement } from 'react-native-web';
const Video = (props) => <video {...props} style={[ { marginVertical: 10 }, props.style ]} />
```

Remember that React Native styles are not the same as React DOM styles, and care needs to be taken not to pass React DOM styles into your React Native wrapped components.

## Use as a library framework
Expand Down
1 change: 1 addition & 0 deletions packages/docs/src/pages/docs/concepts/localization.md
Original file line number Diff line number Diff line change
Expand Up @@ -5,6 +5,7 @@ permalink: /docs/localization/index.html
eleventyNavigation:
key: Localization
parent: Concepts
label: "Change"
---

{% import "fragments/macros.html" as macro with context %}
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -17,10 +17,9 @@ Understanding {{ site.name }} browser compatibility.
The browsers with known support include:

* Chrome 60+
* Safari 10+ / iOS Safari 10+
* Safari 10.1+ / iOS Safari 10.1+
* Edge 12+
* Firefox ESR+
* Internet Explorer 11
* Opera

If specific exports have a different browser support expectation, it will be documented with that export.
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -12,7 +12,7 @@ eleventyNavigation:
React Native for Web provides compatibility with the vast majority of React Native's JavaScript API. Features deprecated in React Native should be considered *unsupported* in React Native for Web.
:::

**Best used with React Native >= 0.63**.
**Best used with React Native >= 0.68**.

Visit the [React Native Directory](https://reactnative.directory/?web=true) to find React Native packages with known web support.

Expand Down
3 changes: 2 additions & 1 deletion packages/docs/src/pages/docs/hooks/use-locale-context.md
Original file line number Diff line number Diff line change
Expand Up @@ -3,8 +3,9 @@ title: useLocaleContext
date: Last Modified
permalink: /docs/use-locale-context/index.html
eleventyNavigation:
key: useLocaleContext
key: useLocaleContext
parent: Hooks
label: "New"
---

{% import "fragments/macros.html" as macro with context %}
Expand Down

0 comments on commit cb8381a

Please sign in to comment.