You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
-[][`node.contains()`](https://developer.mozilla.org/en-US/docs/Web/API/Node/contains). Returns true or false value indicating whether or not a node is a descendant of the calling node.
381
-
-[][`node.getRootNode()`](https://developer.mozilla.org/en-US/docs/Web/API/Node/getRootNode). Returns the context object's root which optionally includes the shadow root if it is available..
-[x][`node.contains()`](https://developer.mozilla.org/en-US/docs/Web/API/Node/contains). Returns true or false value indicating whether or not a node is a descendant of the calling node.
381
+
-[-][`node.getRootNode()`](https://developer.mozilla.org/en-US/docs/Web/API/Node/getRootNode). Returns the context object's root which optionally includes the shadow root if it is available..
-[][`element.children`](https://developer.mozilla.org/en-US/docs/Web/API/Element/children). Not a live collection.
394
-
-[][`element.clientHeight`](https://developer.mozilla.org/en-US/docs/Web/API/Element/clientHeight)[Read only]. Returns a number representing the inner height of the element.
395
-
-[][`element.clientLeft`](https://developer.mozilla.org/en-US/docs/Web/API/Element/clientLeft)[Read only]. Returns a number representing the width of the left border of the element.
396
-
-[][`element.clientTop`](https://developer.mozilla.org/en-US/docs/Web/API/Element/clientTop)[Read only]. Returns a number representing the width of the top border of the element.
397
-
-[][`element.clientWidth`](https://developer.mozilla.org/en-US/docs/Web/API/Element/clientWidth)[Read only]. Returns a number representing the inner width of the element.
-[][`element.scrollHeight`](https://developer.mozilla.org/en-US/docs/Web/API/Element/scrollHeight)[Read only]. Returns a number representing the scroll view height of an element.
404
-
-[][`element.scrollLeft`](https://developer.mozilla.org/en-US/docs/Web/API/Element/scrollLeft). Is a number representing the left scroll offset of the element.
405
-
-[][`element.scrollTop`](https://developer.mozilla.org/en-US/docs/Web/API/Element/scrollTop). A number representing number of pixels the top of the element is scrolled vertically.
406
-
-[][`element.scrollWidth`](https://developer.mozilla.org/en-US/docs/Web/API/Element/scrollWidth)[Read only]. Returns a number representing the scroll view width of the element.
407
-
-[][`element.tagName`](https://developer.mozilla.org/en-US/docs/Web/API/Element/tagName) (alias for nodeName).
-[x][`element.children`](https://developer.mozilla.org/en-US/docs/Web/API/Element/children). Not a live collection.
394
+
-[x][`element.clientHeight`](https://developer.mozilla.org/en-US/docs/Web/API/Element/clientHeight)[Read only]. Returns a number representing the inner height of the element.
395
+
-[x][`element.clientLeft`](https://developer.mozilla.org/en-US/docs/Web/API/Element/clientLeft)[Read only]. Returns a number representing the width of the left border of the element.
396
+
-[x][`element.clientTop`](https://developer.mozilla.org/en-US/docs/Web/API/Element/clientTop)[Read only]. Returns a number representing the width of the top border of the element.
397
+
-[x][`element.clientWidth`](https://developer.mozilla.org/en-US/docs/Web/API/Element/clientWidth)[Read only]. Returns a number representing the inner width of the element.
-[x][`element.scrollHeight`](https://developer.mozilla.org/en-US/docs/Web/API/Element/scrollHeight)[Read only]. Returns a number representing the scroll view height of an element.
404
+
-[x][`element.scrollLeft`](https://developer.mozilla.org/en-US/docs/Web/API/Element/scrollLeft). Is a number representing the left scroll offset of the element.
405
+
-[x][`element.scrollTop`](https://developer.mozilla.org/en-US/docs/Web/API/Element/scrollTop). A number representing number of pixels the top of the element is scrolled vertically.
406
+
-[x][`element.scrollWidth`](https://developer.mozilla.org/en-US/docs/Web/API/Element/scrollWidth)[Read only]. Returns a number representing the scroll view width of the element.
407
+
-[x][`element.tagName`](https://developer.mozilla.org/en-US/docs/Web/API/Element/tagName) (alias for nodeName).
408
408
409
409
### Instance methods
410
410
411
411
Element inherits methods from its parents Node, and its own parent, EventTarget.
412
412
413
413
-[ ][`element.computedStyleMap()`](https://developer.mozilla.org/en-US/docs/Web/API/Element/computedStyleMap). Returns a StylePropertyMapReadOnly interface which provides a read-only representation of a CSS declaration block that is an alternative to CSSStyleDeclaration.
414
414
-[ ][`element.getAttribute()`](https://developer.mozilla.org/en-US/docs/Web/API/Element/getAttribute). Returns the value of a specified attribute on the element.
415
-
-[][`element.getBoundingClientRect()`](https://developer.mozilla.org/en-US/docs/Web/API/Element/getBoundingClientRect). Returns the size of an element and its position relative to the viewport.
415
+
-[x][`element.getBoundingClientRect()`](https://developer.mozilla.org/en-US/docs/Web/API/Element/getBoundingClientRect). Returns the size of an element and its position relative to the viewport.
416
416
-[ ][`element.getClientRects()`](https://developer.mozilla.org/en-US/docs/Web/API/Element/getClientRects). Returns a collection of `DOMRect` objects that indicate the bounding rectangles for each CSS border box in a client.
417
417
-[ ][`element.hasAttribute()`](https://developer.mozilla.org/en-US/docs/Web/API/Element/hasAttribute). Returns a Boolean value indicating whether the specified element has the specified attribute or not.
418
418
-[ ][`element.hasPointerCapture()`](https://developer.mozilla.org/en-US/docs/Web/API/Element/hasPointerCapture). Checks whether the element on which it is invoked has pointer capture for the pointer identified by the given pointer ID.
@@ -476,11 +476,11 @@ The HTMLElement interface represents any HTML element. Some elements directly im
476
476
Inherits properties from its parent, Element, and implements those from DocumentAndElementEventHandlers, GlobalEventHandlers, and TouchEventHandlers.
477
477
478
478
-[ ][`HTMLElement.hidden`](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/hidden)[Read only]. A boolean value indicating if the element is hidden or not.
479
-
-[][`HTMLElement.offsetHeight`](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/offsetHeight)[Read only]. Returns a double containing the height of an element, relative to the layout.
480
-
-[][`HTMLElement.offsetLeft`](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/offsetLeft)[Read only]. Returns a double, the distance from this element's left border to its offsetParent's left border.
481
-
-[][`HTMLElement.offsetParent`](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/offsetParent)[Read only]. Returns a Element that is the element from which all offset calculations are currently computed.
482
-
-[][`HTMLElement.offsetTop`](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/offsetTop)[Read only]. Returns a double, the distance from this element's top border to its offsetParent's top border.
483
-
-[][`HTMLElement.offsetWidth`](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/offsetWidth)[Read only]. Returns a double containing the width of an element, relative to the layout.
479
+
-[x][`HTMLElement.offsetHeight`](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/offsetHeight)[Read only]. Returns a double containing the height of an element, relative to the layout.
480
+
-[x][`HTMLElement.offsetLeft`](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/offsetLeft)[Read only]. Returns a double, the distance from this element's left border to its offsetParent's left border.
481
+
-[x][`HTMLElement.offsetParent`](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/offsetParent)[Read only]. Returns a Element that is the element from which all offset calculations are currently computed.
482
+
-[x][`HTMLElement.offsetTop`](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/offsetTop)[Read only]. Returns a double, the distance from this element's top border to its offsetParent's top border.
483
+
-[x][`HTMLElement.offsetWidth`](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/offsetWidth)[Read only]. Returns a double containing the width of an element, relative to the layout.
484
484
485
485
### Methods
486
486
@@ -834,19 +834,25 @@ Additional events for `<input>` and `<textarea>`.
834
834
835
835
# Styles API (CSS subset)
836
836
837
-
Significantly expanded styling capabilities to cover more of the features that are heavily relied upon by web engineers. Styles are used with the `css()` function and are passed to the `style` prop on elements.
837
+
Significantly expanded styling capabilities to cover more of the features that are heavily relied upon by web engineers. Styles are used with the `css.create()` function and are passed to the `style` prop on elements.
A function that returns native props, e.g., `const nativeProps = css.apply(...styles)`. On web, this is used to generate DOM `className` and `style` props, whereas on native it can be used to pass flattened/transformed styles and any other other native props to custom native components.
853
+
<div style={styles.foo} />
854
+
<div style={styles.bar(props.color)} />
855
+
```
850
856
851
857
## CSS Compatibility
852
858
@@ -865,7 +871,7 @@ Existing properties that can be adjusted to align with the CSS spec.
865
871
866
872
Existing logical properties that can be adjusted to adopt the CSS standard names. In addition, React Native will need to add native support for subtree-level writing direction controls. Setting the `dir` prop (or `direction` style) to `ltr` or `rtl` on an element should alter the way logical properties are resolved in the subtree.
867
873
868
-
*[ ] (`direction`. But it is [not recommended](https://w3c.github.io/csswg-drafts/css-writing-modes/#propdef-direction)on web, and we should consider removing it in favor of the `dir` prop.)
874
+
*[ ] (`direction`. But it is [not recommended](https://w3c.github.io/csswg-drafts/css-writing-modes/#propdef-direction)for most use cases on web.)
869
875
*[x]`borderEndEndRadius` is equivalent to `borderBottomEndRadius`.
870
876
*[x]`borderEndStartRadius` is equivalent to `borderBottomStartRadius`.
871
877
*[x]`borderStartEndRadius` is equivalent to `borderTopEndRadius`.
@@ -907,6 +913,12 @@ Existing logical properties that can be adjusted to adopt the CSS standard names
907
913
*[x]`insetInline` is equivalent to `right` & `left`.
908
914
*[x]`insetInlineEnd` is equivalent to `right` or `left`.
909
915
*[x]`insetInlineStart` is equivalent to `right` or `left`.
0 commit comments