@expo/html-elements 0.12.2 → 0.12.4

package/src/elements/__tests__/__snapshots__/Text-test.tsx.snap.android

@@ -0,0 +1,174 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`renders B 1`] = `
+<Text
+  style={
+    {
+      "fontWeight": "bold",
+    }
+  }
+>
+  demo
+</Text>
+`;
+
+exports[`renders BR 1`] = `
+<Text
+  style={
+    {
+      "height": 16,
+      "width": 0,
+    }
+  }
+/>
+`;
+
+exports[`renders BlockQuote 1`] = `
+<View
+  style={
+    {
+      "marginVertical": 32,
+    }
+  }
+/>
+`;
+
+exports[`renders Code 1`] = `
+<Text
+  style={
+    {
+      "fontFamily": "monospace",
+      "fontWeight": "500",
+    }
+  }
+/>
+`;
+
+exports[`renders Del 1`] = `
+<Text
+  style={
+    {
+      "textDecorationLine": "line-through",
+      "textDecorationStyle": "solid",
+    }
+  }
+>
+  demo
+</Text>
+`;
+
+exports[`renders EM 1`] = `
+<Text
+  style={
+    {
+      "fontStyle": "italic",
+    }
+  }
+>
+  demo
+</Text>
+`;
+
+exports[`renders I 1`] = `
+<Text
+  style={
+    {
+      "fontStyle": "italic",
+    }
+  }
+>
+  demo
+</Text>
+`;
+
+exports[`renders Mark 1`] = `
+<Text
+  style={
+    {
+      "backgroundColor": "yellow",
+      "color": "black",
+    }
+  }
+/>
+`;
+
+exports[`renders P 1`] = `
+<Text
+  style={
+    {
+      "marginVertical": 32,
+    }
+  }
+>
+  demo
+</Text>
+`;
+
+exports[`renders Pre 1`] = `
+<Text
+  style={
+    {
+      "fontFamily": "monospace",
+      "fontWeight": "500",
+      "marginVertical": 32,
+    }
+  }
+>
+  
+    body {
+      color: red;
+    }
+  
+</Text>
+`;
+
+exports[`renders Q 1`] = `
+<Text
+  style={
+    {
+      "fontStyle": "italic",
+    }
+  }
+>
+  "
+  demo
+  "
+</Text>
+`;
+
+exports[`renders S 1`] = `
+<Text
+  style={
+    {
+      "textDecorationLine": "line-through",
+      "textDecorationStyle": "solid",
+    }
+  }
+>
+  demo
+</Text>
+`;
+
+exports[`renders Span 1`] = `
+<Text>
+  demo
+</Text>
+`;
+
+exports[`renders Strong 1`] = `
+<Text
+  style={
+    {
+      "fontWeight": "bold",
+    }
+  }
+>
+  demo
+</Text>
+`;
+
+exports[`renders Time 1`] = `
+<Text>
+  May 15
+</Text>
+`;

package/src/elements/__tests__/__snapshots__/Text-test.tsx.snap.ios

@@ -0,0 +1,174 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`renders B 1`] = `
+<Text
+  style={
+    {
+      "fontWeight": "bold",
+    }
+  }
+>
+  demo
+</Text>
+`;
+
+exports[`renders BR 1`] = `
+<Text
+  style={
+    {
+      "height": 16,
+      "width": 0,
+    }
+  }
+/>
+`;
+
+exports[`renders BlockQuote 1`] = `
+<View
+  style={
+    {
+      "marginVertical": 32,
+    }
+  }
+/>
+`;
+
+exports[`renders Code 1`] = `
+<Text
+  style={
+    {
+      "fontFamily": "Courier New",
+      "fontWeight": "500",
+    }
+  }
+/>
+`;
+
+exports[`renders Del 1`] = `
+<Text
+  style={
+    {
+      "textDecorationLine": "line-through",
+      "textDecorationStyle": "solid",
+    }
+  }
+>
+  demo
+</Text>
+`;
+
+exports[`renders EM 1`] = `
+<Text
+  style={
+    {
+      "fontStyle": "italic",
+    }
+  }
+>
+  demo
+</Text>
+`;
+
+exports[`renders I 1`] = `
+<Text
+  style={
+    {
+      "fontStyle": "italic",
+    }
+  }
+>
+  demo
+</Text>
+`;
+
+exports[`renders Mark 1`] = `
+<Text
+  style={
+    {
+      "backgroundColor": "yellow",
+      "color": "black",
+    }
+  }
+/>
+`;
+
+exports[`renders P 1`] = `
+<Text
+  style={
+    {
+      "marginVertical": 32,
+    }
+  }
+>
+  demo
+</Text>
+`;
+
+exports[`renders Pre 1`] = `
+<Text
+  style={
+    {
+      "fontFamily": "Courier New",
+      "fontWeight": "500",
+      "marginVertical": 32,
+    }
+  }
+>
+  
+    body {
+      color: red;
+    }
+  
+</Text>
+`;
+
+exports[`renders Q 1`] = `
+<Text
+  style={
+    {
+      "fontStyle": "italic",
+    }
+  }
+>
+  "
+  demo
+  "
+</Text>
+`;
+
+exports[`renders S 1`] = `
+<Text
+  style={
+    {
+      "textDecorationLine": "line-through",
+      "textDecorationStyle": "solid",
+    }
+  }
+>
+  demo
+</Text>
+`;
+
+exports[`renders Span 1`] = `
+<Text>
+  demo
+</Text>
+`;
+
+exports[`renders Strong 1`] = `
+<Text
+  style={
+    {
+      "fontWeight": "bold",
+    }
+  }
+>
+  demo
+</Text>
+`;
+
+exports[`renders Time 1`] = `
+<Text>
+  May 15
+</Text>
+`;

package/src/elements/__tests__/__snapshots__/Text-test.tsx.snap.web

@@ -0,0 +1,149 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`renders B 1`] = `
+<div
+  className="css-text-146c3p1 r-fontWeight-vw2c0b"
+  dir="auto"
+  ref={[Function]}
+>
+  demo
+</div>
+`;
+
+exports[`renders BR 1`] = `
+<div
+  className="css-text-146c3p1 r-height-10rkof1 r-width-1h2t8mc"
+  dir="auto"
+  ref={[Function]}
+/>
+`;
+
+exports[`renders BlockQuote 1`] = `
+<div
+  className="css-view-g5y9jx r-marginBlock-11nzuo4"
+  dir={null}
+  ref={[Function]}
+/>
+`;
+
+exports[`renders Code 1`] = `
+<div
+  className="css-text-146c3p1 r-fontFamily-1pm8pkb r-fontWeight-majxgm"
+  dir="auto"
+  ref={[Function]}
+/>
+`;
+
+exports[`renders Del 1`] = `
+<div
+  className="css-text-146c3p1 r-textDecorationLine-142tt33 r-textDecorationStyle-1a2p6p6"
+  dir="auto"
+  ref={[Function]}
+>
+  demo
+</div>
+`;
+
+exports[`renders EM 1`] = `
+<div
+  className="css-text-146c3p1 r-fontStyle-36ujnk"
+  dir="auto"
+  ref={[Function]}
+>
+  demo
+</div>
+`;
+
+exports[`renders I 1`] = `
+<div
+  className="css-text-146c3p1 r-fontStyle-36ujnk"
+  dir="auto"
+  ref={[Function]}
+>
+  demo
+</div>
+`;
+
+exports[`renders Mark 1`] = `
+<div
+  className="css-text-146c3p1 r-backgroundColor-98uye2 r-color-cqee49"
+  dir="auto"
+  ref={[Function]}
+/>
+`;
+
+exports[`renders P 1`] = `
+<div
+  className="css-text-146c3p1 r-marginBlock-11nzuo4"
+  dir="auto"
+  ref={[Function]}
+>
+  demo
+</div>
+`;
+
+exports[`renders Pre 1`] = `
+<div
+  className="css-text-146c3p1 r-fontFamily-1pm8pkb r-fontWeight-majxgm r-marginBlock-11nzuo4"
+  dir="auto"
+  ref={[Function]}
+>
+  
+    body {
+      color: red;
+    }
+  
+</div>
+`;
+
+exports[`renders Q 1`] = `
+<div
+  className="css-text-146c3p1 r-fontStyle-36ujnk"
+  dir="auto"
+  ref={[Function]}
+>
+  "
+  demo
+  "
+</div>
+`;
+
+exports[`renders S 1`] = `
+<div
+  className="css-text-146c3p1 r-textDecorationLine-142tt33 r-textDecorationStyle-1a2p6p6"
+  dir="auto"
+  ref={[Function]}
+>
+  demo
+</div>
+`;
+
+exports[`renders Span 1`] = `
+<div
+  className="css-text-146c3p1"
+  dir="auto"
+  ref={[Function]}
+>
+  demo
+</div>
+`;
+
+exports[`renders Strong 1`] = `
+<div
+  className="css-text-146c3p1 r-fontWeight-vw2c0b"
+  dir="auto"
+  ref={[Function]}
+>
+  demo
+</div>
+`;
+
+exports[`renders Time 1`] = `
+<div
+  className="css-text-146c3p1"
+  dir="auto"
+  ref={[Function]}
+>
+  May 15
+</div>
+`;

package/src/elements/__tests__/__snapshots__/Text.test.ios.tsx.snap.ios

@@ -0,0 +1,174 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`renders B 1`] = `
+<Text
+  style={
+    {
+      "fontWeight": "bold",
+    }
+  }
+>
+  demo
+</Text>
+`;
+
+exports[`renders BR 1`] = `
+<Text
+  style={
+    {
+      "height": 16,
+      "width": 0,
+    }
+  }
+/>
+`;
+
+exports[`renders BlockQuote 1`] = `
+<View
+  style={
+    {
+      "marginVertical": 32,
+    }
+  }
+/>
+`;
+
+exports[`renders Code 1`] = `
+<Text
+  style={
+    {
+      "fontFamily": "Courier New",
+      "fontWeight": "500",
+    }
+  }
+/>
+`;
+
+exports[`renders Del 1`] = `
+<Text
+  style={
+    {
+      "textDecorationLine": "line-through",
+      "textDecorationStyle": "solid",
+    }
+  }
+>
+  demo
+</Text>
+`;
+
+exports[`renders EM 1`] = `
+<Text
+  style={
+    {
+      "fontStyle": "italic",
+    }
+  }
+>
+  demo
+</Text>
+`;
+
+exports[`renders I 1`] = `
+<Text
+  style={
+    {
+      "fontStyle": "italic",
+    }
+  }
+>
+  demo
+</Text>
+`;
+
+exports[`renders Mark 1`] = `
+<Text
+  style={
+    {
+      "backgroundColor": "yellow",
+      "color": "black",
+    }
+  }
+/>
+`;
+
+exports[`renders P 1`] = `
+<Text
+  style={
+    {
+      "marginVertical": 32,
+    }
+  }
+>
+  demo
+</Text>
+`;
+
+exports[`renders Pre 1`] = `
+<Text
+  style={
+    {
+      "fontFamily": "Courier New",
+      "fontWeight": "500",
+      "marginVertical": 32,
+    }
+  }
+>
+  
+    body {
+      color: red;
+    }
+  
+</Text>
+`;
+
+exports[`renders Q 1`] = `
+<Text
+  style={
+    {
+      "fontStyle": "italic",
+    }
+  }
+>
+  "
+  demo
+  "
+</Text>
+`;
+
+exports[`renders S 1`] = `
+<Text
+  style={
+    {
+      "textDecorationLine": "line-through",
+      "textDecorationStyle": "solid",
+    }
+  }
+>
+  demo
+</Text>
+`;
+
+exports[`renders Span 1`] = `
+<Text>
+  demo
+</Text>
+`;
+
+exports[`renders Strong 1`] = `
+<Text
+  style={
+    {
+      "fontWeight": "bold",
+    }
+  }
+>
+  demo
+</Text>
+`;
+
+exports[`renders Time 1`] = `
+<Text>
+  May 15
+</Text>
+`;

package/src/primitives/Image.tsx

@@ -0,0 +1,30 @@
+import { ClassAttributes, ComponentProps, ComponentType } from 'react';
+import { Image as NativeImage, ImageStyle as NativeImageStyle, StyleProp } from 'react-native';
+
+import { WebViewStyle } from './View';
+import { createSafeStyledView } from '../css/createSafeStyledView';
+
+type NativeImageProps = ComponentProps<typeof NativeImage> & ClassAttributes<typeof NativeImage>;
+
+export interface WebImageStyle {
+  opacity?: number;
+}
+
+export type ImageStyle = Omit<NativeImageStyle, 'position'> & WebImageStyle & WebViewStyle;
+
+export type WebImageProps = {
+  style?: StyleProp<ImageStyle>;
+  /** @platform web */
+  tabIndex?: number;
+  /**
+   * Set whether the image can be dragged with native browser behavior.
+   * @platform web
+   */
+  draggable?: boolean;
+};
+
+export type ImageProps = Omit<NativeImageProps, 'style'> & WebImageProps;
+
+const Image = NativeImage as ComponentType<ImageProps>;
+
+export default createSafeStyledView(Image) as ComponentType<ImageProps>;