From dc3c52270ab8a800e35f950591a76dc95e17bdee Mon Sep 17 00:00:00 2001 From: Joe Vilches Date: Wed, 18 Jun 2025 10:52:01 -0400 Subject: [PATCH 1/2] Add documentation for isolation --- docs/layout-props.md | 15 +++++++++++++++ .../versioned_docs/version-0.76/layout-props.md | 15 +++++++++++++++ .../versioned_docs/version-0.77/layout-props.md | 15 +++++++++++++++ .../versioned_docs/version-0.78/layout-props.md | 15 +++++++++++++++ .../versioned_docs/version-0.79/layout-props.md | 15 +++++++++++++++ .../versioned_docs/version-0.80/layout-props.md | 15 +++++++++++++++ 6 files changed, 90 insertions(+) diff --git a/docs/layout-props.md b/docs/layout-props.md index 5d9fe532572..5e627a792fa 100644 --- a/docs/layout-props.md +++ b/docs/layout-props.md @@ -661,6 +661,21 @@ It works similarly to `height` in CSS, but in React Native you must use points o --- +### `isolation` + +`isolation` lets you form a [stacking context](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_positioned_layout/Stacking_context). This prop is only available on the [New Architecture](/architecture/landing-page). + +There are two values: + +* `auto` (default): Does nothing. +* `isolate`: Forms a stacking context. + +| Type | Required | +| ----------------------- | -------- | +| enum('auto', 'isolate') | No | + +--- + ### `justifyContent` `justifyContent` aligns children in the main direction. For example, if children are flowing vertically, `justifyContent` controls how they align vertically. It works like `justify-content` in CSS (default: flex-start). See https://developer.mozilla.org/en-US/docs/Web/CSS/justify-content for more details. diff --git a/website/versioned_docs/version-0.76/layout-props.md b/website/versioned_docs/version-0.76/layout-props.md index 5c973c63a9c..d6bf61f3174 100644 --- a/website/versioned_docs/version-0.76/layout-props.md +++ b/website/versioned_docs/version-0.76/layout-props.md @@ -651,6 +651,21 @@ It works similarly to `height` in CSS, but in React Native you must use points o --- +### `isolation` + +`isolation` lets you form a [stacking context](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_positioned_layout/Stacking_context). This prop is only available on the [New Architecture](/architecture/landing-page). + +There are two values: + +* `auto` (default): Does nothing. +* `isolate`: Forms a stacking context. + +| Type | Required | +| ----------------------- | -------- | +| enum('auto', 'isolate') | No | + +--- + ### `justifyContent` `justifyContent` aligns children in the main direction. For example, if children are flowing vertically, `justifyContent` controls how they align vertically. It works like `justify-content` in CSS (default: flex-start). See https://developer.mozilla.org/en-US/docs/Web/CSS/justify-content for more details. diff --git a/website/versioned_docs/version-0.77/layout-props.md b/website/versioned_docs/version-0.77/layout-props.md index 5d9fe532572..5e627a792fa 100644 --- a/website/versioned_docs/version-0.77/layout-props.md +++ b/website/versioned_docs/version-0.77/layout-props.md @@ -661,6 +661,21 @@ It works similarly to `height` in CSS, but in React Native you must use points o --- +### `isolation` + +`isolation` lets you form a [stacking context](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_positioned_layout/Stacking_context). This prop is only available on the [New Architecture](/architecture/landing-page). + +There are two values: + +* `auto` (default): Does nothing. +* `isolate`: Forms a stacking context. + +| Type | Required | +| ----------------------- | -------- | +| enum('auto', 'isolate') | No | + +--- + ### `justifyContent` `justifyContent` aligns children in the main direction. For example, if children are flowing vertically, `justifyContent` controls how they align vertically. It works like `justify-content` in CSS (default: flex-start). See https://developer.mozilla.org/en-US/docs/Web/CSS/justify-content for more details. diff --git a/website/versioned_docs/version-0.78/layout-props.md b/website/versioned_docs/version-0.78/layout-props.md index 5d9fe532572..5e627a792fa 100644 --- a/website/versioned_docs/version-0.78/layout-props.md +++ b/website/versioned_docs/version-0.78/layout-props.md @@ -661,6 +661,21 @@ It works similarly to `height` in CSS, but in React Native you must use points o --- +### `isolation` + +`isolation` lets you form a [stacking context](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_positioned_layout/Stacking_context). This prop is only available on the [New Architecture](/architecture/landing-page). + +There are two values: + +* `auto` (default): Does nothing. +* `isolate`: Forms a stacking context. + +| Type | Required | +| ----------------------- | -------- | +| enum('auto', 'isolate') | No | + +--- + ### `justifyContent` `justifyContent` aligns children in the main direction. For example, if children are flowing vertically, `justifyContent` controls how they align vertically. It works like `justify-content` in CSS (default: flex-start). See https://developer.mozilla.org/en-US/docs/Web/CSS/justify-content for more details. diff --git a/website/versioned_docs/version-0.79/layout-props.md b/website/versioned_docs/version-0.79/layout-props.md index 5d9fe532572..5e627a792fa 100644 --- a/website/versioned_docs/version-0.79/layout-props.md +++ b/website/versioned_docs/version-0.79/layout-props.md @@ -661,6 +661,21 @@ It works similarly to `height` in CSS, but in React Native you must use points o --- +### `isolation` + +`isolation` lets you form a [stacking context](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_positioned_layout/Stacking_context). This prop is only available on the [New Architecture](/architecture/landing-page). + +There are two values: + +* `auto` (default): Does nothing. +* `isolate`: Forms a stacking context. + +| Type | Required | +| ----------------------- | -------- | +| enum('auto', 'isolate') | No | + +--- + ### `justifyContent` `justifyContent` aligns children in the main direction. For example, if children are flowing vertically, `justifyContent` controls how they align vertically. It works like `justify-content` in CSS (default: flex-start). See https://developer.mozilla.org/en-US/docs/Web/CSS/justify-content for more details. diff --git a/website/versioned_docs/version-0.80/layout-props.md b/website/versioned_docs/version-0.80/layout-props.md index 5d9fe532572..5e627a792fa 100644 --- a/website/versioned_docs/version-0.80/layout-props.md +++ b/website/versioned_docs/version-0.80/layout-props.md @@ -661,6 +661,21 @@ It works similarly to `height` in CSS, but in React Native you must use points o --- +### `isolation` + +`isolation` lets you form a [stacking context](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_positioned_layout/Stacking_context). This prop is only available on the [New Architecture](/architecture/landing-page). + +There are two values: + +* `auto` (default): Does nothing. +* `isolate`: Forms a stacking context. + +| Type | Required | +| ----------------------- | -------- | +| enum('auto', 'isolate') | No | + +--- + ### `justifyContent` `justifyContent` aligns children in the main direction. For example, if children are flowing vertically, `justifyContent` controls how they align vertically. It works like `justify-content` in CSS (default: flex-start). See https://developer.mozilla.org/en-US/docs/Web/CSS/justify-content for more details. From 023c0482fa049d144d0c17673a190238707b8a79 Mon Sep 17 00:00:00 2001 From: Joe Vilches Date: Wed, 18 Jun 2025 11:02:32 -0400 Subject: [PATCH 2/2] format --- docs/layout-props.md | 4 ++-- website/versioned_docs/version-0.76/layout-props.md | 4 ++-- website/versioned_docs/version-0.77/layout-props.md | 4 ++-- website/versioned_docs/version-0.78/layout-props.md | 4 ++-- website/versioned_docs/version-0.79/layout-props.md | 4 ++-- website/versioned_docs/version-0.80/layout-props.md | 4 ++-- 6 files changed, 12 insertions(+), 12 deletions(-) diff --git a/docs/layout-props.md b/docs/layout-props.md index 5e627a792fa..114ff5da96a 100644 --- a/docs/layout-props.md +++ b/docs/layout-props.md @@ -667,8 +667,8 @@ It works similarly to `height` in CSS, but in React Native you must use points o There are two values: -* `auto` (default): Does nothing. -* `isolate`: Forms a stacking context. +- `auto` (default): Does nothing. +- `isolate`: Forms a stacking context. | Type | Required | | ----------------------- | -------- | diff --git a/website/versioned_docs/version-0.76/layout-props.md b/website/versioned_docs/version-0.76/layout-props.md index d6bf61f3174..6c73bcd636c 100644 --- a/website/versioned_docs/version-0.76/layout-props.md +++ b/website/versioned_docs/version-0.76/layout-props.md @@ -657,8 +657,8 @@ It works similarly to `height` in CSS, but in React Native you must use points o There are two values: -* `auto` (default): Does nothing. -* `isolate`: Forms a stacking context. +- `auto` (default): Does nothing. +- `isolate`: Forms a stacking context. | Type | Required | | ----------------------- | -------- | diff --git a/website/versioned_docs/version-0.77/layout-props.md b/website/versioned_docs/version-0.77/layout-props.md index 5e627a792fa..114ff5da96a 100644 --- a/website/versioned_docs/version-0.77/layout-props.md +++ b/website/versioned_docs/version-0.77/layout-props.md @@ -667,8 +667,8 @@ It works similarly to `height` in CSS, but in React Native you must use points o There are two values: -* `auto` (default): Does nothing. -* `isolate`: Forms a stacking context. +- `auto` (default): Does nothing. +- `isolate`: Forms a stacking context. | Type | Required | | ----------------------- | -------- | diff --git a/website/versioned_docs/version-0.78/layout-props.md b/website/versioned_docs/version-0.78/layout-props.md index 5e627a792fa..114ff5da96a 100644 --- a/website/versioned_docs/version-0.78/layout-props.md +++ b/website/versioned_docs/version-0.78/layout-props.md @@ -667,8 +667,8 @@ It works similarly to `height` in CSS, but in React Native you must use points o There are two values: -* `auto` (default): Does nothing. -* `isolate`: Forms a stacking context. +- `auto` (default): Does nothing. +- `isolate`: Forms a stacking context. | Type | Required | | ----------------------- | -------- | diff --git a/website/versioned_docs/version-0.79/layout-props.md b/website/versioned_docs/version-0.79/layout-props.md index 5e627a792fa..114ff5da96a 100644 --- a/website/versioned_docs/version-0.79/layout-props.md +++ b/website/versioned_docs/version-0.79/layout-props.md @@ -667,8 +667,8 @@ It works similarly to `height` in CSS, but in React Native you must use points o There are two values: -* `auto` (default): Does nothing. -* `isolate`: Forms a stacking context. +- `auto` (default): Does nothing. +- `isolate`: Forms a stacking context. | Type | Required | | ----------------------- | -------- | diff --git a/website/versioned_docs/version-0.80/layout-props.md b/website/versioned_docs/version-0.80/layout-props.md index 5e627a792fa..114ff5da96a 100644 --- a/website/versioned_docs/version-0.80/layout-props.md +++ b/website/versioned_docs/version-0.80/layout-props.md @@ -667,8 +667,8 @@ It works similarly to `height` in CSS, but in React Native you must use points o There are two values: -* `auto` (default): Does nothing. -* `isolate`: Forms a stacking context. +- `auto` (default): Does nothing. +- `isolate`: Forms a stacking context. | Type | Required | | ----------------------- | -------- |