@draftbit/core 46.2.4-99ac4e.1 → 46.2.4-c963c3.4

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -62,6 +62,7 @@ var _default = {
62
62
  width: size.width,
63
63
  height: size.height
64
64
  }, "image-placeholder_1"),
65
+ placeholderSvgURL: "https://static.draftbit.com/images/placeholder-svg.svg",
65
66
  squareImageUrl: buildImageUrl({
66
67
  width: 100,
67
68
  height: 100
@@ -25,6 +25,8 @@ function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "functio
25
25
 
26
26
  function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
27
27
 
28
+ function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
29
+
28
30
  const Button = _ref => {
29
31
  let {
30
32
  Icon,
@@ -126,7 +128,7 @@ const Button = _ref => {
126
128
  alignSelf: "stretch",
127
129
  ...margins
128
130
  }
129
- }, /*#__PURE__*/React.createElement(_Touchable.default, { ...rest,
131
+ }, /*#__PURE__*/React.createElement(_Touchable.default, _extends({}, rest, {
130
132
  onPress: onPress,
131
133
  accessibilityState: {
132
134
  disabled
@@ -134,7 +136,7 @@ const Button = _ref => {
134
136
  accessibilityRole: "button",
135
137
  disabled: disabled || loading,
136
138
  style: [styles.button, buttonStyle, innerStyles]
137
- }, /*#__PURE__*/React.createElement(_reactNative.View, {
139
+ }), /*#__PURE__*/React.createElement(_reactNative.View, {
138
140
  style: styles.content
139
141
  }, icon && loading !== true ? /*#__PURE__*/React.createElement(_reactNative.View, {
140
142
  style: iconStyle
@@ -169,24 +171,4 @@ const styles = _reactNative.StyleSheet.create({
169
171
 
170
172
  var _default = (0, _theming.withTheme)(Button);
171
173
 
172
- exports.default = _default;));
173
- };
174
-
175
- const styles = _reactNative.StyleSheet.create({
176
- button: {
177
- minWidth: 64,
178
- borderStyle: "solid"
179
- },
180
- content: {
181
- flexDirection: "row",
182
- alignItems: "center",
183
- justifyContent: "center"
184
- },
185
- icon: {
186
- width: _Config.default.buttonIconSize
187
- }
188
- });
189
-
190
- var _default = (0, _theming.withTheme)(Button);
191
-
192
174
  exports.default = _default;
@@ -17,8 +17,6 @@ function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "functio
17
17
 
18
18
  function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
19
19
 
20
- function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
21
-
22
20
  const PortalContext = /*#__PURE__*/React.createContext(null);
23
21
  /**
24
22
  * Portal host renders all of its children `Portal` elements.
@@ -51,11 +49,11 @@ class PortalHost extends React.Component {
51
49
  constructor() {
52
50
  super(...arguments);
53
51
 
54
- _defineProperty(this, "setManager", manager => {
52
+ this.setManager = manager => {
55
53
  this.manager = manager;
56
- });
54
+ };
57
55
 
58
- _defineProperty(this, "mount", children => {
56
+ this.mount = children => {
59
57
  const key = this.nextKey++;
60
58
 
61
59
  if (this.manager) {
@@ -69,9 +67,9 @@ class PortalHost extends React.Component {
69
67
  }
70
68
 
71
69
  return key;
72
- });
70
+ };
73
71
 
74
- _defineProperty(this, "update", (key, children) => {
72
+ this.update = (key, children) => {
75
73
  if (this.manager) {
76
74
  this.manager.update(key, children);
77
75
  } else {
@@ -89,9 +87,9 @@ class PortalHost extends React.Component {
89
87
  this.queue.push(op);
90
88
  }
91
89
  }
92
- });
90
+ };
93
91
 
94
- _defineProperty(this, "unmount", key => {
92
+ this.unmount = key => {
95
93
  if (this.manager) {
96
94
  this.manager.unmount(key);
97
95
  } else {
@@ -100,13 +98,10 @@ class PortalHost extends React.Component {
100
98
  key
101
99
  });
102
100
  }
103
- });
104
-
105
- _defineProperty(this, "nextKey", 0);
106
-
107
- _defineProperty(this, "queue", []);
101
+ };
108
102
 
109
- _defineProperty(this, "manager", void 0);
103
+ this.nextKey = 0;
104
+ this.queue = [];
110
105
  }
111
106
 
112
107
  componentDidMount() {
@@ -152,6 +147,23 @@ class PortalHost extends React.Component {
152
147
 
153
148
  }
154
149
 
150
+ exports.default = PortalHost;
151
+ PortalHost.displayName = "Portal.Host";
152
+
153
+ const styles = _reactNative.StyleSheet.create({
154
+ container: {
155
+ flex: 1
156
+ }
157
+ }); style: styles.container,
158
+ collapsable: false,
159
+ pointerEvents: "box-none"
160
+ }, this.props.children), /*#__PURE__*/React.createElement(_PortalManager.default, {
161
+ ref: this.setManager
162
+ }));
163
+ }
164
+
165
+ }
166
+
155
167
  exports.default = PortalHost;
156
168
 
157
169
  _defineProperty(PortalHost, "displayName", "Portal.Host");
@@ -17,8 +17,6 @@ function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "functio
17
17
 
18
18
  function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
19
19
 
20
- function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
21
-
22
20
  const {
23
21
  Provider
24
22
  } = _context.radioButtonGroupContext;
@@ -63,9 +61,24 @@ const RadioButtonGroup = _ref => {
63
61
  });
64
62
  }
65
63
 
66
- return /*#__PURE__*/React.createElement(_reactNative.View, _extends({
64
+ return /*#__PURE__*/React.createElement(_reactNative.View, {
67
65
  style: [{
68
66
  minHeight: 40
67
+ }, style],
68
+ ...rest
69
+ }, /*#__PURE__*/React.createElement(Provider, {
70
+ value: {
71
+ value: internalValue,
72
+ onValueChange: handleValueChange,
73
+ direction
74
+ }
75
+ }, /*#__PURE__*/React.createElement(_reactNative.View, {
76
+ style: _containerStyle
77
+ }, children)));
78
+ };
79
+
80
+ var _default = RadioButtonGroup;
81
+ exports.default = _default;0
69
82
  }, style]
70
83
  }, rest), /*#__PURE__*/React.createElement(Provider, {
71
84
  value: {
@@ -0,0 +1,49 @@
1
+ "use strict";
2
+
3
+ Object.defineProperty(exports, "__esModule", {
4
+ value: true
5
+ });
6
+ exports.default = void 0;
7
+
8
+ var React = _interopRequireWildcard(require("react"));
9
+
10
+ var _reactNative = require("react-native");
11
+
12
+ var _reactNativeSvg = require("react-native-svg");
13
+
14
+ var _Config = _interopRequireDefault(require("./Config"));
15
+
16
+ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
17
+
18
+ function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
19
+
20
+ function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
21
+
22
+ const SVG = _ref => {
23
+ let {
24
+ source,
25
+ style
26
+ } = _ref;
27
+ let svgSource = source === null || source === undefined ? _Config.default.placeholderSvgURL : source;
28
+ return /*#__PURE__*/React.createElement(React.Fragment, null, _reactNative.Platform.OS === "ios" && /*#__PURE__*/React.createElement(_reactNative.View, {
29
+ style: style
30
+ }, /*#__PURE__*/React.createElement(_reactNativeSvg.SvgUri, {
31
+ width: "100%",
32
+ height: "100%",
33
+ uri: svgSource
34
+ })), _reactNative.Platform.OS === "android" && /*#__PURE__*/React.createElement(_reactNative.View, {
35
+ style: style
36
+ }, /*#__PURE__*/React.createElement(_reactNativeSvg.SvgUri, {
37
+ width: "100%",
38
+ height: "100%",
39
+ uri: svgSource
40
+ })), _reactNative.Platform.OS === "web" && /*#__PURE__*/React.createElement(_reactNative.Image, {
41
+ style: style,
42
+ source: {
43
+ uri: svgSource
44
+ }
45
+ }));
46
+ };
47
+
48
+ var _default = SVG;
49
+ exports.default = _default;
@@ -291,6 +291,12 @@ Object.defineProperty(exports, "RowHeadlineImageIcon", {
291
291
  return _RowHeadlineImageIcon.default;
292
292
  }
293
293
  });
294
+ Object.defineProperty(exports, "SVG", {
295
+ enumerable: true,
296
+ get: function () {
297
+ return _SVG.default;
298
+ }
299
+ });
294
300
  Object.defineProperty(exports, "ScreenContainer", {
295
301
  enumerable: true,
296
302
  get: function () {
@@ -442,6 +448,8 @@ var _IconButton = _interopRequireDefault(require("./components/IconButton"));
442
448
 
443
449
  var _Image = _interopRequireDefault(require("./components/Image"));
444
450
 
451
+ var _SVG = _interopRequireDefault(require("./components/SVG"));
452
+
445
453
  var _NumberInput = _interopRequireDefault(require("./components/NumberInput"));
446
454
 
447
455
  var _ScreenContainer = _interopRequireDefault(require("./components/ScreenContainer"));
@@ -14,8 +14,8 @@ const SEED_DATA = {
14
14
  category: _types.COMPONENT_TYPES.media,
15
15
  stylesPanelSections: [_types.StylesPanelSections.Size, _types.StylesPanelSections.Margins, _types.StylesPanelSections.Position, _types.StylesPanelSections.Effects],
16
16
  layout: {
17
- width: 250,
18
- height: 250
17
+ width: 100,
18
+ height: 100
19
19
  },
20
20
  props: {
21
21
  source: (0, _types.createImageProp)(),
@@ -61,6 +61,7 @@ const SEED_DATA = {
61
61
  label: "Map Type",
62
62
  description: "The type of map to show",
63
63
  group: _types.GROUPS.basic,
64
+ editable: true,
64
65
  formType: _types.FORM_TYPES.flatArray,
65
66
  propType: _types.PROP_TYPES.STRING,
66
67
  required: false,
@@ -0,0 +1,23 @@
1
+ "use strict";
2
+
3
+ Object.defineProperty(exports, "__esModule", {
4
+ value: true
5
+ });
6
+ exports.SEED_DATA = void 0;
7
+
8
+ var _types = require("@draftbit/types");
9
+
10
+ const SEED_DATA = {
11
+ name: "SVG",
12
+ tag: "SVG",
13
+ description: "An SVG component",
14
+ category: _types.COMPONENT_TYPES.media,
15
+ layout: {
16
+ width: 100,
17
+ height: 100
18
+ },
19
+ props: {
20
+ source: (0, _types.createSvgProp)()
21
+ }
22
+ };
23
+ exports.SEED_DATA = SEED_DATA;
@@ -54,6 +54,7 @@ export default {
54
54
  width: size.width,
55
55
  height: size.height
56
56
  }, "image-placeholder_1"),
57
+ placeholderSvgURL: "https://static.draftbit.com/images/placeholder-svg.svg",
57
58
  squareImageUrl: buildImageUrl({
58
59
  width: 100,
59
60
  height: 100
@@ -0,0 +1,32 @@
1
+ import * as React from "react";
2
+ import { View, Platform, Image } from "react-native";
3
+ import { SvgUri } from "react-native-svg";
4
+ import Config from "./Config";
5
+
6
+ const SVG = _ref => {
7
+ let {
8
+ source,
9
+ style
10
+ } = _ref;
11
+ let svgSource = source === null || source === undefined ? Config.placeholderSvgURL : source;
12
+ return /*#__PURE__*/React.createElement(React.Fragment, null, Platform.OS === "ios" && /*#__PURE__*/React.createElement(View, {
13
+ style: style
14
+ }, /*#__PURE__*/React.createElement(SvgUri, {
15
+ width: "100%",
16
+ height: "100%",
17
+ uri: svgSource
18
+ })), Platform.OS === "android" && /*#__PURE__*/React.createElement(View, {
19
+ style: style
20
+ }, /*#__PURE__*/React.createElement(SvgUri, {
21
+ width: "100%",
22
+ height: "100%",
23
+ uri: svgSource
24
+ })), Platform.OS === "web" && /*#__PURE__*/React.createElement(Image, {
25
+ style: style,
26
+ source: {
27
+ uri: svgSource
28
+ }
29
+ }));
30
+ };
31
+
32
+ export default SVG;
@@ -5,4 +5,5 @@ const DEFAULT_STATUSBAR_HEIGHT_EXPO = expo !== null && expo !== void 0 && expo.C
5
5
  export const APPROX_STATUSBAR_HEIGHT = Platform.select({
6
6
  android: DEFAULT_STATUSBAR_HEIGHT_EXPO,
7
7
  ios: Platform.Version < 11 ? DEFAULT_STATUSBAR_HEIGHT_EXPO : 0
8
+ });PO : 0
8
9
  });
@@ -17,6 +17,7 @@ export { default as FAB } from "./components/FAB";
17
17
  export { default as FieldSearchBarFull } from "./components/FieldSearchBarFull";
18
18
  export { default as IconButton } from "./components/IconButton";
19
19
  export { default as Image } from "./components/Image";
20
+ export { default as SVG } from "./components/SVG";
20
21
  export { default as NumberInput } from "./components/NumberInput";
21
22
  export { default as ScreenContainer } from "./components/ScreenContainer";
22
23
  export { default as StarRating } from "./components/StarRating";
@@ -6,8 +6,8 @@ export const SEED_DATA = {
6
6
  category: COMPONENT_TYPES.media,
7
7
  stylesPanelSections: [StylesPanelSections.Size, StylesPanelSections.Margins, StylesPanelSections.Position, StylesPanelSections.Effects],
8
8
  layout: {
9
- width: 250,
10
- height: 250
9
+ width: 100,
10
+ height: 100
11
11
  },
12
12
  props: {
13
13
  source: createImageProp(),
@@ -53,6 +53,7 @@ export const SEED_DATA = {
53
53
  label: "Map Type",
54
54
  description: "The type of map to show",
55
55
  group: GROUPS.basic,
56
+ editable: true,
56
57
  formType: FORM_TYPES.flatArray,
57
58
  propType: PROP_TYPES.STRING,
58
59
  required: false,
@@ -0,0 +1,14 @@
1
+ import { COMPONENT_TYPES, createSvgProp } from "@draftbit/types";
2
+ export const SEED_DATA = {
3
+ name: "SVG",
4
+ tag: "SVG",
5
+ description: "An SVG component",
6
+ category: COMPONENT_TYPES.media,
7
+ layout: {
8
+ width: 100,
9
+ height: 100
10
+ },
11
+ props: {
12
+ source: createSvgProp()
13
+ }
14
+ };
@@ -13,6 +13,7 @@ declare const _default: {
13
13
  width: number;
14
14
  height: number;
15
15
  }) => string;
16
+ placeholderSvgURL: string;
16
17
  squareImageUrl: string;
17
18
  FABSize: number;
18
19
  FABBorderRadius: number;
@@ -0,0 +1,8 @@
1
+ /// <reference types="react" />
2
+ import { StyleProp, ImageStyle } from "react-native";
3
+ declare type SVGComponentProps = {
4
+ source: string;
5
+ style?: StyleProp<ImageStyle>;
6
+ };
7
+ declare const SVG: ({ source, style }: SVGComponentProps) => JSX.Element;
8
+ export default SVG;
@@ -17,6 +17,7 @@ export { default as FAB } from "./components/FAB";
17
17
  export { default as FieldSearchBarFull } from "./components/FieldSearchBarFull";
18
18
  export { default as IconButton } from "./components/IconButton";
19
19
  export { default as Image } from "./components/Image";
20
+ export { default as SVG } from "./components/SVG";
20
21
  export { default as NumberInput } from "./components/NumberInput";
21
22
  export { default as ScreenContainer } from "./components/ScreenContainer";
22
23
  export { default as StarRating } from "./components/StarRating";
@@ -56,6 +56,7 @@ export declare const SEED_DATA: {
56
56
  label: string;
57
57
  description: string;
58
58
  group: string;
59
+ editable: boolean;
59
60
  formType: string;
60
61
  propType: string;
61
62
  required: boolean;
@@ -0,0 +1,22 @@
1
+ export declare const SEED_DATA: {
2
+ name: string;
3
+ tag: string;
4
+ description: string;
5
+ category: string;
6
+ layout: {
7
+ width: number;
8
+ height: number;
9
+ };
10
+ props: {
11
+ source: {
12
+ label: string;
13
+ description: string;
14
+ group: string;
15
+ formType: string;
16
+ propType: string;
17
+ defaultValue: string;
18
+ editable: boolean;
19
+ required: boolean;
20
+ };
21
+ };
22
+ };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@draftbit/core",
3
- "version": "46.2.4-99ac4e.1+99ac4ee6",
3
+ "version": "46.2.4-c963c3.4+c963c352",
4
4
  "description": "Core (non-native) Components",
5
5
  "main": "lib/commonjs/index.js",
6
6
  "module": "lib/module/index.js",
@@ -41,7 +41,7 @@
41
41
  "dependencies": {
42
42
  "@date-io/date-fns": "^1.3.13",
43
43
  "@draftbit/react-theme-provider": "^2.1.1",
44
- "@draftbit/types": "^46.2.3",
44
+ "@draftbit/types": "^46.2.4",
45
45
  "@material-ui/core": "^4.11.0",
46
46
  "@material-ui/pickers": "^3.2.10",
47
47
  "@react-native-community/slider": "4.2.3",
@@ -53,6 +53,7 @@
53
53
  "lodash.omit": "^4.5.0",
54
54
  "lodash.tonumber": "^4.0.3",
55
55
  "react-native-modal-datetime-picker": "^13.0.0",
56
+ "react-native-svg": "^12.3.0",
56
57
  "react-native-typography": "^1.4.1",
57
58
  "react-native-web-swiper": "^2.2.3"
58
59
  },
@@ -79,5 +80,5 @@
79
80
  ]
80
81
  ]
81
82
  },
82
- "gitHead": "99ac4ee67b881abfe6746d634237cb9cf26051ac"
83
+ "gitHead": "c963c352589ec3b359bd3b4eaa360a444e8b9ff0"
83
84
  }
@@ -42,6 +42,7 @@ export default {
42
42
  cardIconElevation: 1,
43
43
  placeholderImageURL: "https://static.draftbit.com/images/placeholder-image" + getExtension(),
44
44
  getPlaceholderImageUrl: (size) => buildImageUrl({ width: size.width, height: size.height }, "image-placeholder_1"),
45
+ placeholderSvgURL: "https://static.draftbit.com/images/placeholder-svg.svg",
45
46
  squareImageUrl: buildImageUrl({ width: 100, height: 100 }, "Avatar"),
46
47
  FABSize: 40,
47
48
  FABBorderRadius: 20,
@@ -60,6 +60,7 @@ export default {
60
60
  { width: size.width, height: size.height },
61
61
  "image-placeholder_1"
62
62
  ),
63
+ placeholderSvgURL: "https://static.draftbit.com/images/placeholder-svg.svg",
63
64
  squareImageUrl: buildImageUrl({ width: 100, height: 100 }, "Avatar"),
64
65
  FABSize: 40,
65
66
  FABBorderRadius: 20,
@@ -0,0 +1,14 @@
1
+ import * as React from "react";
2
+ import { View, Platform, Image } from "react-native";
3
+ import { SvgUri } from "react-native-svg";
4
+ import Config from "./Config";
5
+ const SVG = ({ source, style }) => {
6
+ let svgSource = source === null || source === undefined ? Config.placeholderSvgURL : source;
7
+ return (React.createElement(React.Fragment, null,
8
+ Platform.OS === "ios" && (React.createElement(View, { style: style },
9
+ React.createElement(SvgUri, { width: "100%", height: "100%", uri: svgSource }))),
10
+ Platform.OS === "android" && (React.createElement(View, { style: style },
11
+ React.createElement(SvgUri, { width: "100%", height: "100%", uri: svgSource }))),
12
+ Platform.OS === "web" && (React.createElement(Image, { style: style, source: { uri: svgSource } }))));
13
+ };
14
+ export default SVG;
@@ -0,0 +1,35 @@
1
+ import * as React from "react";
2
+ import { View, Platform, Image, StyleProp, ImageStyle } from "react-native";
3
+ import { SvgUri } from "react-native-svg";
4
+
5
+ import Config from "./Config";
6
+
7
+ type SVGComponentProps = {
8
+ source: string;
9
+ style?: StyleProp<ImageStyle>;
10
+ };
11
+
12
+ const SVG = ({ source, style }: SVGComponentProps) => {
13
+ let svgSource =
14
+ source === null || source === undefined ? Config.placeholderSvgURL : source;
15
+
16
+ return (
17
+ <>
18
+ {Platform.OS === "ios" && (
19
+ <View style={style}>
20
+ <SvgUri width="100%" height="100%" uri={svgSource} />
21
+ </View>
22
+ )}
23
+ {Platform.OS === "android" && (
24
+ <View style={style}>
25
+ <SvgUri width="100%" height="100%" uri={svgSource} />
26
+ </View>
27
+ )}
28
+ {Platform.OS === "web" && (
29
+ <Image style={style} source={{ uri: svgSource }} />
30
+ )}
31
+ </>
32
+ );
33
+ };
34
+
35
+ export default SVG;
package/src/index.js CHANGED
@@ -17,6 +17,7 @@ export { default as FAB } from "./components/FAB";
17
17
  export { default as FieldSearchBarFull } from "./components/FieldSearchBarFull";
18
18
  export { default as IconButton } from "./components/IconButton";
19
19
  export { default as Image } from "./components/Image";
20
+ export { default as SVG } from "./components/SVG";
20
21
  export { default as NumberInput } from "./components/NumberInput";
21
22
  export { default as ScreenContainer } from "./components/ScreenContainer";
22
23
  export { default as StarRating } from "./components/StarRating";
package/src/index.tsx CHANGED
@@ -18,6 +18,7 @@ export { default as FAB } from "./components/FAB";
18
18
  export { default as FieldSearchBarFull } from "./components/FieldSearchBarFull";
19
19
  export { default as IconButton } from "./components/IconButton";
20
20
  export { default as Image } from "./components/Image";
21
+ export { default as SVG } from "./components/SVG";
21
22
  export { default as NumberInput } from "./components/NumberInput";
22
23
  export { default as ScreenContainer } from "./components/ScreenContainer";
23
24
  export { default as StarRating } from "./components/StarRating";
@@ -11,8 +11,8 @@ export const SEED_DATA = {
11
11
  StylesPanelSections.Effects,
12
12
  ],
13
13
  layout: {
14
- width: 250,
15
- height: 250,
14
+ width: 100,
15
+ height: 100,
16
16
  },
17
17
  props: {
18
18
  source: createImageProp(),
@@ -17,8 +17,8 @@ export const SEED_DATA = {
17
17
  StylesPanelSections.Effects,
18
18
  ],
19
19
  layout: {
20
- width: 250,
21
- height: 250,
20
+ width: 100,
21
+ height: 100,
22
22
  },
23
23
  props: {
24
24
  source: createImageProp(),
@@ -53,6 +53,7 @@ export const SEED_DATA = {
53
53
  label: "Map Type",
54
54
  description: "The type of map to show",
55
55
  group: GROUPS.basic,
56
+ editable: true,
56
57
  formType: FORM_TYPES.flatArray,
57
58
  propType: PROP_TYPES.STRING,
58
59
  required: false,
@@ -63,6 +63,7 @@ export const SEED_DATA = {
63
63
  label: "Map Type",
64
64
  description: "The type of map to show",
65
65
  group: GROUPS.basic,
66
+ editable: true,
66
67
  formType: FORM_TYPES.flatArray,
67
68
  propType: PROP_TYPES.STRING,
68
69
  required: false,
@@ -0,0 +1,14 @@
1
+ import { COMPONENT_TYPES, createSvgProp } from "@draftbit/types";
2
+ export const SEED_DATA = {
3
+ name: "SVG",
4
+ tag: "SVG",
5
+ description: "An SVG component",
6
+ category: COMPONENT_TYPES.media,
7
+ layout: {
8
+ width: 100,
9
+ height: 100,
10
+ },
11
+ props: {
12
+ source: createSvgProp(),
13
+ },
14
+ };
@@ -0,0 +1,15 @@
1
+ import { COMPONENT_TYPES, createSvgProp } from "@draftbit/types";
2
+
3
+ export const SEED_DATA = {
4
+ name: "SVG",
5
+ tag: "SVG",
6
+ description: "An SVG component",
7
+ category: COMPONENT_TYPES.media,
8
+ layout: {
9
+ width: 100,
10
+ height: 100,
11
+ },
12
+ props: {
13
+ source: createSvgProp(),
14
+ },
15
+ };