@draftbit/core 46.8.2-fee87c.2 → 46.9.1-0f1b60.2
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.
- package/lib/commonjs/components/Container.js +15 -4
- package/lib/commonjs/components/Markdown.js +30 -0
- package/lib/commonjs/components/Shadow.js +46 -0
- package/lib/commonjs/components/TabView/TabView.js +22 -6
- package/lib/commonjs/hooks.js +1 -2
- package/lib/commonjs/index.js +14 -0
- package/lib/commonjs/mappings/FlashList.js +2 -8
- package/lib/commonjs/mappings/HtmlElements.js +160 -0
- package/lib/commonjs/mappings/Markdown.js +27 -0
- package/lib/commonjs/mappings/Shadow.js +102 -0
- package/lib/commonjs/mappings/TabView.js +6 -5
- package/lib/commonjs/mappings/TabViewItem.js +5 -3
- package/lib/module/components/Markdown.js +20 -0
- package/lib/module/components/Shadow.js +38 -0
- package/lib/module/components/TabView/TabView.js +22 -5
- package/lib/module/index.js +2 -0
- package/lib/module/mappings/FlashList.js +3 -9
- package/lib/module/mappings/HtmlElements.js +153 -0
- package/lib/module/mappings/Markdown.js +20 -0
- package/lib/module/mappings/Shadow.js +95 -0
- package/lib/module/mappings/TabView.js +7 -6
- package/lib/module/mappings/TabViewItem.js +6 -4
- package/lib/typescript/src/components/Markdown.d.ts +8 -0
- package/lib/typescript/src/components/Markdown.d.ts.map +1 -0
- package/lib/typescript/src/components/Shadow.d.ts +24 -0
- package/lib/typescript/src/components/Shadow.d.ts.map +1 -0
- package/lib/typescript/src/components/TabView/TabView.d.ts.map +1 -1
- package/lib/typescript/src/components/TabView/TabViewItem.d.ts +1 -1
- package/lib/typescript/src/components/TabView/TabViewItem.d.ts.map +1 -1
- package/lib/typescript/src/index.d.ts +2 -0
- package/lib/typescript/src/index.d.ts.map +1 -1
- package/lib/typescript/src/mappings/FlashList.d.ts +0 -6
- package/lib/typescript/src/mappings/FlashList.d.ts.map +1 -1
- package/lib/typescript/src/mappings/HtmlElements.d.ts +109 -0
- package/lib/typescript/src/mappings/HtmlElements.d.ts.map +1 -0
- package/lib/typescript/src/mappings/Markdown.d.ts +20 -0
- package/lib/typescript/src/mappings/Markdown.d.ts.map +1 -0
- package/lib/typescript/src/mappings/Shadow.d.ts +173 -0
- package/lib/typescript/src/mappings/Shadow.d.ts.map +1 -0
- package/lib/typescript/src/mappings/TabView.d.ts.map +1 -1
- package/lib/typescript/src/mappings/TabViewItem.d.ts.map +1 -1
- package/package.json +6 -3
- package/src/components/Markdown.js +10 -0
- package/src/components/Markdown.tsx +22 -0
- package/src/components/Shadow.js +16 -0
- package/src/components/Shadow.tsx +62 -0
- package/src/components/TabView/TabView.js +16 -7
- package/src/components/TabView/TabView.tsx +25 -7
- package/src/components/TabView/TabViewItem.tsx +1 -1
- package/src/index.js +2 -0
- package/src/index.tsx +3 -0
- package/src/mappings/FlashList.js +9 -9
- package/src/mappings/FlashList.ts +9 -9
- package/src/mappings/HtmlElements.js +180 -0
- package/src/mappings/HtmlElements.ts +194 -0
- package/src/mappings/Markdown.js +25 -0
- package/src/mappings/Markdown.ts +32 -0
- package/src/mappings/Shadow.js +95 -0
- package/src/mappings/Shadow.ts +104 -0
- package/src/mappings/TabView.js +11 -5
- package/src/mappings/TabView.ts +11 -5
- package/src/mappings/TabViewItem.js +4 -2
- package/src/mappings/TabViewItem.ts +4 -1
|
@@ -11,7 +11,6 @@ var _Elevation = _interopRequireDefault(require("./Elevation"));
|
|
|
11
11
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
12
12
|
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); }
|
|
13
13
|
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; }
|
|
14
|
-
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); }
|
|
15
14
|
const Container = _ref => {
|
|
16
15
|
let {
|
|
17
16
|
useThemeGutterPadding,
|
|
@@ -73,9 +72,10 @@ const Container = _ref => {
|
|
|
73
72
|
};
|
|
74
73
|
const Wrap = elevation ? _Elevation.default : _reactNative.View;
|
|
75
74
|
if (elevation) containerStyle.elevation = elevation;
|
|
76
|
-
return /*#__PURE__*/React.createElement(Wrap,
|
|
77
|
-
style: [containerStyle, style]
|
|
78
|
-
|
|
75
|
+
return /*#__PURE__*/React.createElement(Wrap, {
|
|
76
|
+
style: [containerStyle, style],
|
|
77
|
+
...rest
|
|
78
|
+
}, backgroundImage ? /*#__PURE__*/React.createElement(_reactNative.ImageBackground, {
|
|
79
79
|
source: typeof backgroundImage === "string" ? {
|
|
80
80
|
uri: backgroundImage
|
|
81
81
|
} : backgroundImage,
|
|
@@ -90,4 +90,15 @@ const Container = _ref => {
|
|
|
90
90
|
}, children));
|
|
91
91
|
};
|
|
92
92
|
var _default = (0, _theming.withTheme)(Container);
|
|
93
|
+
exports.default = _default;sizeMode: backgroundImageResizeMode,
|
|
94
|
+
style: {
|
|
95
|
+
flex: 1
|
|
96
|
+
}
|
|
97
|
+
}, /*#__PURE__*/React.createElement(_reactNative.View, {
|
|
98
|
+
style: innerStyle
|
|
99
|
+
}, children)) : /*#__PURE__*/React.createElement(_reactNative.View, {
|
|
100
|
+
style: innerStyle
|
|
101
|
+
}, children));
|
|
102
|
+
};
|
|
103
|
+
var _default = (0, _theming.withTheme)(Container);
|
|
93
104
|
exports.default = _default;
|
|
@@ -0,0 +1,30 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports.default = void 0;
|
|
7
|
+
var React = _interopRequireWildcard(require("react"));
|
|
8
|
+
var _reactNative = require("react-native");
|
|
9
|
+
var _reactNativeMarkdownDisplay = _interopRequireDefault(require("react-native-markdown-display"));
|
|
10
|
+
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
11
|
+
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); }
|
|
12
|
+
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; }
|
|
13
|
+
const Markdown = _ref => {
|
|
14
|
+
let {
|
|
15
|
+
children,
|
|
16
|
+
style
|
|
17
|
+
} = _ref;
|
|
18
|
+
return (
|
|
19
|
+
/*#__PURE__*/
|
|
20
|
+
//'body' style applies to all markdown components
|
|
21
|
+
//@ts-ignore TS does not like the type of this named style for some reason
|
|
22
|
+
React.createElement(_reactNativeMarkdownDisplay.default, {
|
|
23
|
+
style: {
|
|
24
|
+
body: _reactNative.StyleSheet.flatten(style)
|
|
25
|
+
}
|
|
26
|
+
}, children)
|
|
27
|
+
);
|
|
28
|
+
};
|
|
29
|
+
var _default = Markdown;
|
|
30
|
+
exports.default = _default;
|
|
@@ -0,0 +1,46 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports.default = void 0;
|
|
7
|
+
var _react = _interopRequireDefault(require("react"));
|
|
8
|
+
var _reactNativeShadow = require("react-native-shadow-2");
|
|
9
|
+
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
10
|
+
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); }
|
|
11
|
+
const Shadow = _ref => {
|
|
12
|
+
let {
|
|
13
|
+
offsetX = 0,
|
|
14
|
+
offsetY = 0,
|
|
15
|
+
showShadowSideStart = true,
|
|
16
|
+
showShadowSideEnd = true,
|
|
17
|
+
showShadowSideTop = true,
|
|
18
|
+
showShadowSideBottom = true,
|
|
19
|
+
showShadowCornerTopStart = true,
|
|
20
|
+
showShadowCornerTopEnd = true,
|
|
21
|
+
showShadowCornerBottomStart = true,
|
|
22
|
+
showShadowCornerBottomEnd = true,
|
|
23
|
+
paintInside = false,
|
|
24
|
+
style,
|
|
25
|
+
...rest
|
|
26
|
+
} = _ref;
|
|
27
|
+
return /*#__PURE__*/_react.default.createElement(_reactNativeShadow.Shadow, _extends({
|
|
28
|
+
offset: [offsetX, offsetY],
|
|
29
|
+
sides: {
|
|
30
|
+
start: showShadowSideStart,
|
|
31
|
+
end: showShadowSideEnd,
|
|
32
|
+
top: showShadowSideTop,
|
|
33
|
+
bottom: showShadowSideBottom
|
|
34
|
+
},
|
|
35
|
+
corners: {
|
|
36
|
+
topStart: showShadowCornerTopStart,
|
|
37
|
+
topEnd: showShadowCornerTopEnd,
|
|
38
|
+
bottomStart: showShadowCornerBottomStart,
|
|
39
|
+
bottomEnd: showShadowCornerBottomEnd
|
|
40
|
+
},
|
|
41
|
+
containerStyle: style,
|
|
42
|
+
paintInside: paintInside
|
|
43
|
+
}, rest));
|
|
44
|
+
};
|
|
45
|
+
var _default = Shadow;
|
|
46
|
+
exports.default = _default;
|
|
@@ -6,9 +6,8 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
6
6
|
exports.default = void 0;
|
|
7
7
|
var React = _interopRequireWildcard(require("react"));
|
|
8
8
|
var _reactNativeTabView = require("react-native-tab-view");
|
|
9
|
-
var _TabViewItem = _interopRequireDefault(require("./TabViewItem"));
|
|
10
9
|
var _theming = require("../../theming");
|
|
11
|
-
|
|
10
|
+
var _utilities = require("../../utilities");
|
|
12
11
|
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); }
|
|
13
12
|
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; }
|
|
14
13
|
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); }
|
|
@@ -33,12 +32,22 @@ const TabViewComponent = _ref => {
|
|
|
33
32
|
const [index, setIndex] = React.useState(0);
|
|
34
33
|
const [routes, setRoutes] = React.useState([]);
|
|
35
34
|
const [tabScenes, setTabScenes] = React.useState({});
|
|
35
|
+
const {
|
|
36
|
+
textStyles,
|
|
37
|
+
viewStyles
|
|
38
|
+
} = (0, _utilities.extractStyles)(style);
|
|
39
|
+
|
|
40
|
+
//Check type of child using props
|
|
41
|
+
//Regular '.type' cannot work because Draftbit strips the type in Draft view
|
|
42
|
+
const instanceOfTabViewItemProps = object => {
|
|
43
|
+
return "title" in object;
|
|
44
|
+
};
|
|
36
45
|
|
|
37
46
|
//Populate routes and scenes based on children
|
|
38
47
|
React.useEffect(() => {
|
|
39
48
|
const newRoutes = [];
|
|
40
49
|
const scenes = {};
|
|
41
|
-
React.Children.toArray(children).filter(child => /*#__PURE__*/React.isValidElement(child) && child.
|
|
50
|
+
React.Children.toArray(children).filter(child => /*#__PURE__*/React.isValidElement(child) && instanceOfTabViewItemProps(child.props)).forEach((item, idx) => {
|
|
42
51
|
const child = item;
|
|
43
52
|
newRoutes.push({
|
|
44
53
|
key: idx.toString(),
|
|
@@ -67,6 +76,7 @@ const TabViewComponent = _ref => {
|
|
|
67
76
|
indicatorStyle: {
|
|
68
77
|
backgroundColor: indicatorColor || theme.colors.primary
|
|
69
78
|
},
|
|
79
|
+
labelStyle: textStyles,
|
|
70
80
|
renderIcon: _ref2 => {
|
|
71
81
|
let {
|
|
72
82
|
route,
|
|
@@ -75,15 +85,21 @@ const TabViewComponent = _ref => {
|
|
|
75
85
|
return route !== null && route !== void 0 && route.icon ? /*#__PURE__*/React.createElement(Icon, {
|
|
76
86
|
name: route.icon,
|
|
77
87
|
color: color,
|
|
78
|
-
size:
|
|
88
|
+
size: 16
|
|
79
89
|
}) : null;
|
|
80
90
|
},
|
|
81
|
-
style:
|
|
91
|
+
style: {
|
|
82
92
|
backgroundColor: tabsBackgroundColor || theme.colors.background
|
|
83
|
-
}
|
|
93
|
+
}
|
|
84
94
|
}));
|
|
85
95
|
};
|
|
96
|
+
|
|
97
|
+
//Cannot render TabView without at least one tab
|
|
98
|
+
if (!routes.length) {
|
|
99
|
+
return /*#__PURE__*/React.createElement(React.Fragment, null);
|
|
100
|
+
}
|
|
86
101
|
return /*#__PURE__*/React.createElement(_reactNativeTabView.TabView, {
|
|
102
|
+
style: [viewStyles],
|
|
87
103
|
navigationState: {
|
|
88
104
|
index,
|
|
89
105
|
routes
|
package/lib/commonjs/hooks.js
CHANGED
|
@@ -10,12 +10,11 @@ function usePrevious(value) {
|
|
|
10
10
|
// The ref object is a generic container whose current property is mutable
|
|
11
11
|
// and can hold any value, similar to an instance property on a class
|
|
12
12
|
const ref = _react.default.useRef();
|
|
13
|
-
|
|
14
13
|
// Store current value in ref
|
|
15
14
|
_react.default.useEffect(() => {
|
|
16
15
|
ref.current = value;
|
|
17
16
|
}, [value]);
|
|
18
|
-
|
|
19
17
|
// Return previous value (happens before update in useEffect above)
|
|
20
18
|
return ref.current;
|
|
19
|
+
}
|
|
21
20
|
}
|
package/lib/commonjs/index.js
CHANGED
|
@@ -177,6 +177,12 @@ Object.defineProperty(exports, "Link", {
|
|
|
177
177
|
return _Text.Link;
|
|
178
178
|
}
|
|
179
179
|
});
|
|
180
|
+
Object.defineProperty(exports, "Markdown", {
|
|
181
|
+
enumerable: true,
|
|
182
|
+
get: function () {
|
|
183
|
+
return _Markdown.default;
|
|
184
|
+
}
|
|
185
|
+
});
|
|
180
186
|
Object.defineProperty(exports, "NumberInput", {
|
|
181
187
|
enumerable: true,
|
|
182
188
|
get: function () {
|
|
@@ -273,6 +279,12 @@ Object.defineProperty(exports, "ScreenContainer", {
|
|
|
273
279
|
return _ScreenContainer.default;
|
|
274
280
|
}
|
|
275
281
|
});
|
|
282
|
+
Object.defineProperty(exports, "Shadow", {
|
|
283
|
+
enumerable: true,
|
|
284
|
+
get: function () {
|
|
285
|
+
return _Shadow.default;
|
|
286
|
+
}
|
|
287
|
+
});
|
|
276
288
|
Object.defineProperty(exports, "Slider", {
|
|
277
289
|
enumerable: true,
|
|
278
290
|
get: function () {
|
|
@@ -425,8 +437,10 @@ var _ActionSheet = require("./components/ActionSheet");
|
|
|
425
437
|
var _Swiper = require("./components/Swiper");
|
|
426
438
|
var _Layout = require("./components/Layout");
|
|
427
439
|
var _index = require("./components/RadioButton/index");
|
|
440
|
+
var _Shadow = _interopRequireDefault(require("./components/Shadow"));
|
|
428
441
|
var _DeckSwiper = require("./components/DeckSwiper");
|
|
429
442
|
var _TabView = require("./components/TabView");
|
|
443
|
+
var _Markdown = _interopRequireDefault(require("./components/Markdown"));
|
|
430
444
|
var _DatePicker = _interopRequireDefault(require("./components/DatePicker/DatePicker"));
|
|
431
445
|
var _Picker = _interopRequireDefault(require("./components/Picker/Picker"));
|
|
432
446
|
var _ProgressBar = _interopRequireDefault(require("./components/ProgressBar"));
|
|
@@ -11,10 +11,7 @@ const SEED_DATA = [{
|
|
|
11
11
|
description: "Masonry Flashlist by Shopify",
|
|
12
12
|
packageName: "@shopify/flash-list",
|
|
13
13
|
category: _types.COMPONENT_TYPES.data,
|
|
14
|
-
stylesPanelSections: _types.
|
|
15
|
-
layout: {
|
|
16
|
-
flex: 1
|
|
17
|
-
},
|
|
14
|
+
stylesPanelSections: [_types.StylesPanelSections.Background, _types.StylesPanelSections.MarginsAndPaddings],
|
|
18
15
|
triggers: [_types.Triggers.OnRefresh, _types.Triggers.OnEndReached],
|
|
19
16
|
props: {
|
|
20
17
|
onRefresh: (0, _types.createActionProp)(),
|
|
@@ -61,10 +58,7 @@ const SEED_DATA = [{
|
|
|
61
58
|
description: "Flashlist by Shopify",
|
|
62
59
|
packageName: "@shopify/flash-list",
|
|
63
60
|
category: _types.COMPONENT_TYPES.data,
|
|
64
|
-
stylesPanelSections: _types.
|
|
65
|
-
layout: {
|
|
66
|
-
flex: 1
|
|
67
|
-
},
|
|
61
|
+
stylesPanelSections: [_types.StylesPanelSections.Background, _types.StylesPanelSections.MarginsAndPaddings],
|
|
68
62
|
triggers: [_types.Triggers.OnRefresh, _types.Triggers.OnEndReached],
|
|
69
63
|
props: {
|
|
70
64
|
onRefresh: (0, _types.createActionProp)(),
|
|
@@ -0,0 +1,160 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports.SEED_DATA = void 0;
|
|
7
|
+
var _types = require("@draftbit/types");
|
|
8
|
+
const ELEMENT_SEED_DATA = {
|
|
9
|
+
doc_link: "https://www.npmjs.com/package/@expo/html-elements",
|
|
10
|
+
code_link: "https://github.com/expo/expo/tree/master/packages/html-elements",
|
|
11
|
+
packageName: "@expo/html-elements",
|
|
12
|
+
stylesPanelSections: _types.BLOCK_STYLES_SECTIONS,
|
|
13
|
+
category: _types.COMPONENT_TYPES.webelement
|
|
14
|
+
};
|
|
15
|
+
const TEXT_SEED_DATA = {
|
|
16
|
+
...ELEMENT_SEED_DATA,
|
|
17
|
+
category: _types.COMPONENT_TYPES.text,
|
|
18
|
+
stylesPanelSections: [_types.StylesPanelSections.Typography, _types.StylesPanelSections.LayoutSelectedItem, _types.StylesPanelSections.MarginsAndPaddings, _types.StylesPanelSections.Effects],
|
|
19
|
+
layout: {
|
|
20
|
+
color: "strong"
|
|
21
|
+
},
|
|
22
|
+
props: {
|
|
23
|
+
children: {
|
|
24
|
+
group: _types.GROUPS.data,
|
|
25
|
+
label: "Text",
|
|
26
|
+
description: "Text",
|
|
27
|
+
defaultValue: "Double click me to edit 👀",
|
|
28
|
+
editable: true,
|
|
29
|
+
required: true,
|
|
30
|
+
formType: _types.FORM_TYPES.string,
|
|
31
|
+
propType: _types.PROP_TYPES.STRING
|
|
32
|
+
},
|
|
33
|
+
accessibilityLabel: {
|
|
34
|
+
group: _types.GROUPS.accessibility,
|
|
35
|
+
name: "accessibilityLabel",
|
|
36
|
+
label: "accessibilityLabel",
|
|
37
|
+
description: "Overrides the text that's read by the screen reader when the user interacts with the element. By default, the label is constructed by traversing all the children and accumulating all the Text nodes separated by space.",
|
|
38
|
+
editable: true,
|
|
39
|
+
required: false,
|
|
40
|
+
formType: _types.FORM_TYPES.string,
|
|
41
|
+
propType: _types.PROP_TYPES.STRING,
|
|
42
|
+
defaultValue: null
|
|
43
|
+
},
|
|
44
|
+
selectable: {
|
|
45
|
+
group: _types.GROUPS.advanced,
|
|
46
|
+
name: "selectable",
|
|
47
|
+
label: "selectable",
|
|
48
|
+
description: "Lets the user select text, to use the native copy and paste functionality.",
|
|
49
|
+
editable: true,
|
|
50
|
+
required: false,
|
|
51
|
+
formType: _types.FORM_TYPES.boolean,
|
|
52
|
+
propType: _types.PROP_TYPES.BOOLEAN,
|
|
53
|
+
defaultValue: true
|
|
54
|
+
}
|
|
55
|
+
}
|
|
56
|
+
};
|
|
57
|
+
const SEED_DATA = [{
|
|
58
|
+
name: "Heading 1",
|
|
59
|
+
tag: "H1",
|
|
60
|
+
...TEXT_SEED_DATA
|
|
61
|
+
}, {
|
|
62
|
+
name: "Heading 2",
|
|
63
|
+
tag: "H2",
|
|
64
|
+
...TEXT_SEED_DATA
|
|
65
|
+
}, {
|
|
66
|
+
name: "Heading 3",
|
|
67
|
+
tag: "H3",
|
|
68
|
+
...TEXT_SEED_DATA
|
|
69
|
+
}, {
|
|
70
|
+
name: "Heading 4",
|
|
71
|
+
tag: "H4",
|
|
72
|
+
...TEXT_SEED_DATA
|
|
73
|
+
}, {
|
|
74
|
+
name: "Heading 5",
|
|
75
|
+
tag: "H5",
|
|
76
|
+
...TEXT_SEED_DATA
|
|
77
|
+
}, {
|
|
78
|
+
name: "Heading 6",
|
|
79
|
+
tag: "H6",
|
|
80
|
+
...TEXT_SEED_DATA
|
|
81
|
+
}, {
|
|
82
|
+
name: "Paragraph",
|
|
83
|
+
tag: "P",
|
|
84
|
+
...TEXT_SEED_DATA
|
|
85
|
+
}, {
|
|
86
|
+
name: "Bold",
|
|
87
|
+
tag: "B",
|
|
88
|
+
...TEXT_SEED_DATA
|
|
89
|
+
}, {
|
|
90
|
+
name: "Strikethrough",
|
|
91
|
+
tag: "S",
|
|
92
|
+
...TEXT_SEED_DATA
|
|
93
|
+
}, {
|
|
94
|
+
name: "Italic",
|
|
95
|
+
tag: "I",
|
|
96
|
+
...TEXT_SEED_DATA
|
|
97
|
+
}, {
|
|
98
|
+
name: "Code",
|
|
99
|
+
tag: "Code",
|
|
100
|
+
...TEXT_SEED_DATA
|
|
101
|
+
}, {
|
|
102
|
+
name: "Preformatted",
|
|
103
|
+
tag: "Pre",
|
|
104
|
+
...TEXT_SEED_DATA
|
|
105
|
+
}, {
|
|
106
|
+
name: "Mark",
|
|
107
|
+
tag: "Mark",
|
|
108
|
+
...TEXT_SEED_DATA
|
|
109
|
+
}, {
|
|
110
|
+
name: "Block Quote",
|
|
111
|
+
tag: "BlockQuote",
|
|
112
|
+
...TEXT_SEED_DATA
|
|
113
|
+
}, {
|
|
114
|
+
name: "Quoted",
|
|
115
|
+
tag: "Q",
|
|
116
|
+
...TEXT_SEED_DATA
|
|
117
|
+
}, {
|
|
118
|
+
name: "Time",
|
|
119
|
+
tag: "Time",
|
|
120
|
+
...TEXT_SEED_DATA
|
|
121
|
+
}, {
|
|
122
|
+
name: "Unordered List",
|
|
123
|
+
tag: "UL",
|
|
124
|
+
...ELEMENT_SEED_DATA
|
|
125
|
+
}, {
|
|
126
|
+
name: "List Item",
|
|
127
|
+
tag: "LI",
|
|
128
|
+
...TEXT_SEED_DATA,
|
|
129
|
+
category: _types.COMPONENT_TYPES.webelement
|
|
130
|
+
}, {
|
|
131
|
+
name: "Line Break",
|
|
132
|
+
tag: "BR",
|
|
133
|
+
...ELEMENT_SEED_DATA
|
|
134
|
+
}, {
|
|
135
|
+
name: "Horizontal Rule",
|
|
136
|
+
tag: "HR",
|
|
137
|
+
...ELEMENT_SEED_DATA
|
|
138
|
+
}, {
|
|
139
|
+
name: "Anchor",
|
|
140
|
+
tag: "A",
|
|
141
|
+
...TEXT_SEED_DATA,
|
|
142
|
+
props: {
|
|
143
|
+
...TEXT_SEED_DATA.props,
|
|
144
|
+
href: (0, _types.createTextProp)({
|
|
145
|
+
label: "href",
|
|
146
|
+
description: "Specify the URL",
|
|
147
|
+
defaultValue: ""
|
|
148
|
+
}),
|
|
149
|
+
target: {
|
|
150
|
+
group: _types.GROUPS.basic,
|
|
151
|
+
label: "target",
|
|
152
|
+
description: "decide where link should open",
|
|
153
|
+
formType: _types.FORM_TYPES.flatArray,
|
|
154
|
+
defaultValue: "_blank",
|
|
155
|
+
options: ["_blank", "_self", "_parent", "_top"]
|
|
156
|
+
}
|
|
157
|
+
},
|
|
158
|
+
category: _types.COMPONENT_TYPES.webelement
|
|
159
|
+
}];
|
|
160
|
+
exports.SEED_DATA = SEED_DATA;
|
|
@@ -0,0 +1,27 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports.SEED_DATA = void 0;
|
|
7
|
+
var _types = require("@draftbit/types");
|
|
8
|
+
const SEED_DATA = {
|
|
9
|
+
name: "Markdown",
|
|
10
|
+
tag: "Markdown",
|
|
11
|
+
description: "A component that renders markdown",
|
|
12
|
+
category: _types.COMPONENT_TYPES.text,
|
|
13
|
+
stylesPanelSections: [_types.StylesPanelSections.Typography, _types.StylesPanelSections.LayoutSelectedItem, _types.StylesPanelSections.MarginsAndPaddings, _types.StylesPanelSections.Effects],
|
|
14
|
+
props: {
|
|
15
|
+
children: {
|
|
16
|
+
group: _types.GROUPS.data,
|
|
17
|
+
label: "Markdown Text",
|
|
18
|
+
description: "Markdown text to be rendered ",
|
|
19
|
+
editable: true,
|
|
20
|
+
required: true,
|
|
21
|
+
formType: _types.FORM_TYPES.string,
|
|
22
|
+
propType: _types.PROP_TYPES.STRING,
|
|
23
|
+
defaultValue: "### Markdown"
|
|
24
|
+
}
|
|
25
|
+
}
|
|
26
|
+
};
|
|
27
|
+
exports.SEED_DATA = SEED_DATA;
|
|
@@ -0,0 +1,102 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports.SEED_DATA = void 0;
|
|
7
|
+
var _types = require("@draftbit/types");
|
|
8
|
+
const SEED_DATA = {
|
|
9
|
+
name: "Shadow",
|
|
10
|
+
tag: "Shadow",
|
|
11
|
+
description: "A cross-platform, universal shadow.",
|
|
12
|
+
category: _types.COMPONENT_TYPES.view,
|
|
13
|
+
stylesPanelSections: _types.CONTAINER_COMPONENT_STYLES_SECTIONS,
|
|
14
|
+
props: {
|
|
15
|
+
disabled: (0, _types.createDisabledProp)({
|
|
16
|
+
description: "Disables the shadow."
|
|
17
|
+
}),
|
|
18
|
+
startColor: (0, _types.createColorProp)({
|
|
19
|
+
label: "Start Color",
|
|
20
|
+
description: "The initial gradient color of the shadow.",
|
|
21
|
+
defaultValue: null
|
|
22
|
+
}),
|
|
23
|
+
endColor: (0, _types.createColorProp)({
|
|
24
|
+
label: "End Color",
|
|
25
|
+
description: "The final gradient color of the shadow.",
|
|
26
|
+
defaultValue: null
|
|
27
|
+
}),
|
|
28
|
+
distance: (0, _types.createStaticNumberProp)({
|
|
29
|
+
label: "Distance",
|
|
30
|
+
description: "The distance of the shadow."
|
|
31
|
+
}),
|
|
32
|
+
paintInside: (0, _types.createStaticBoolProp)({
|
|
33
|
+
label: "Paint Inside",
|
|
34
|
+
description: "Apply the shadow below/inside the content.",
|
|
35
|
+
defaultValue: false
|
|
36
|
+
}),
|
|
37
|
+
stretch: (0, _types.createStaticBoolProp)({
|
|
38
|
+
label: "Stretch",
|
|
39
|
+
description: "Force children to occupy all available horizontal space.",
|
|
40
|
+
defaultValue: null
|
|
41
|
+
}),
|
|
42
|
+
offsetX: (0, _types.createStaticNumberProp)({
|
|
43
|
+
label: "Offset X",
|
|
44
|
+
description: "Moves the shadow in the x direction",
|
|
45
|
+
defeaultValue: 0
|
|
46
|
+
}),
|
|
47
|
+
offsetY: (0, _types.createStaticNumberProp)({
|
|
48
|
+
label: "Offset Y",
|
|
49
|
+
description: "Moves the shadow in the y direction",
|
|
50
|
+
defeaultValue: 0
|
|
51
|
+
}),
|
|
52
|
+
showShadowSideStart: (0, _types.createStaticBoolProp)({
|
|
53
|
+
label: "Show Shadow Start",
|
|
54
|
+
description: "Whether to show shadow on the start side or not",
|
|
55
|
+
defaultValue: true,
|
|
56
|
+
group: _types.GROUPS.advanced
|
|
57
|
+
}),
|
|
58
|
+
showShadowSideEnd: (0, _types.createStaticBoolProp)({
|
|
59
|
+
label: "Show Shadow End",
|
|
60
|
+
description: "Whether to show shadow on the end side or not",
|
|
61
|
+
defaultValue: true,
|
|
62
|
+
group: _types.GROUPS.advanced
|
|
63
|
+
}),
|
|
64
|
+
showShadowSideTop: (0, _types.createStaticBoolProp)({
|
|
65
|
+
label: "Show Shadow Top",
|
|
66
|
+
description: "Whether to show shadow on the top side or not",
|
|
67
|
+
defaultValue: true,
|
|
68
|
+
group: _types.GROUPS.advanced
|
|
69
|
+
}),
|
|
70
|
+
showShadowSideBottom: (0, _types.createStaticBoolProp)({
|
|
71
|
+
label: "Show Shadow Bottom",
|
|
72
|
+
description: "Whether to show shadow on the bottom side or not",
|
|
73
|
+
defaultValue: true,
|
|
74
|
+
group: _types.GROUPS.advanced
|
|
75
|
+
}),
|
|
76
|
+
showShadowCornerTopStart: (0, _types.createStaticBoolProp)({
|
|
77
|
+
label: "Show Shadow Top Start Corner",
|
|
78
|
+
description: "Whether to show shadow on the top start corner or not",
|
|
79
|
+
defaultValue: true,
|
|
80
|
+
group: _types.GROUPS.advanced
|
|
81
|
+
}),
|
|
82
|
+
showShadowCornerTopEnd: (0, _types.createStaticBoolProp)({
|
|
83
|
+
label: "Show Shadow Top End Corner",
|
|
84
|
+
description: "Whether to show shadow on the top end corner or not",
|
|
85
|
+
defaultValue: true,
|
|
86
|
+
group: _types.GROUPS.advanced
|
|
87
|
+
}),
|
|
88
|
+
showShadowCornerBottomStart: (0, _types.createStaticBoolProp)({
|
|
89
|
+
label: "Show Shadow Bottom Start Corner",
|
|
90
|
+
description: "Whether to show shadow on the bottom start corner or not",
|
|
91
|
+
defaultValue: true,
|
|
92
|
+
group: _types.GROUPS.advanced
|
|
93
|
+
}),
|
|
94
|
+
showShadowCornerBottomEnd: (0, _types.createStaticBoolProp)({
|
|
95
|
+
label: "Show Shadow Bottom End Corner",
|
|
96
|
+
description: "Whether to show shadow on the bottom end corner or not",
|
|
97
|
+
defaultValue: true,
|
|
98
|
+
group: _types.GROUPS.advanced
|
|
99
|
+
})
|
|
100
|
+
}
|
|
101
|
+
};
|
|
102
|
+
exports.SEED_DATA = SEED_DATA;
|
|
@@ -10,7 +10,7 @@ const SEED_DATA = {
|
|
|
10
10
|
tag: "TabView",
|
|
11
11
|
description: "Tab view container",
|
|
12
12
|
category: _types.COMPONENT_TYPES.swiper,
|
|
13
|
-
stylesPanelSections: [
|
|
13
|
+
stylesPanelSections: [_types.StylesPanelSections.Size, _types.StylesPanelSections.MarginsAndPaddings, _types.StylesPanelSections.Position, _types.StylesPanelSections.Effects, _types.StylesPanelSections.LayoutSelectedItem, _types.StylesPanelSections.Background, _types.StylesPanelSections.Typography],
|
|
14
14
|
triggers: [_types.Triggers.OnIndexChanged, _types.Triggers.OnEndReached],
|
|
15
15
|
props: {
|
|
16
16
|
onIndexChanged: (0, _types.createActionProp)({
|
|
@@ -39,9 +39,9 @@ const SEED_DATA = {
|
|
|
39
39
|
defaultValue: true
|
|
40
40
|
}),
|
|
41
41
|
scrollEnabled: (0, _types.createStaticBoolProp)({
|
|
42
|
-
label: "Scroll Enabled",
|
|
42
|
+
label: "Tab Scroll Enabled",
|
|
43
43
|
description: "Whether scrolling of tabs is enabled or not",
|
|
44
|
-
defaultValue:
|
|
44
|
+
defaultValue: false
|
|
45
45
|
}),
|
|
46
46
|
activeColor: (0, _types.createColorProp)({
|
|
47
47
|
label: "Active Color",
|
|
@@ -55,8 +55,9 @@ const SEED_DATA = {
|
|
|
55
55
|
}),
|
|
56
56
|
pressColor: (0, _types.createColorProp)({
|
|
57
57
|
label: "Press Color",
|
|
58
|
-
description: "Color of ripple when pressed
|
|
59
|
-
defaultValue: "primary"
|
|
58
|
+
description: "Color of ripple when pressed",
|
|
59
|
+
defaultValue: "primary",
|
|
60
|
+
group: _types.GROUPS.android
|
|
60
61
|
}),
|
|
61
62
|
indicatorColor: (0, _types.createColorProp)({
|
|
62
63
|
label: "Indicator Color",
|
|
@@ -18,8 +18,9 @@ const SEED_DATA = {
|
|
|
18
18
|
title: (0, _types.createTextProp)({
|
|
19
19
|
label: "Title",
|
|
20
20
|
description: "Title of tab item",
|
|
21
|
-
defaultValue:
|
|
22
|
-
required: true
|
|
21
|
+
defaultValue: "Title",
|
|
22
|
+
required: true,
|
|
23
|
+
group: _types.GROUPS.basic
|
|
23
24
|
}),
|
|
24
25
|
icon: (0, _types.createIconProp)({
|
|
25
26
|
defaultValue: null,
|
|
@@ -28,7 +29,8 @@ const SEED_DATA = {
|
|
|
28
29
|
accessibilityLabel: (0, _types.createTextProp)({
|
|
29
30
|
label: "Accessibility Label",
|
|
30
31
|
description: "Accessibility Label",
|
|
31
|
-
defaultValue: null
|
|
32
|
+
defaultValue: null,
|
|
33
|
+
group: _types.GROUPS.accessibility
|
|
32
34
|
})
|
|
33
35
|
}
|
|
34
36
|
};
|
|
@@ -0,0 +1,20 @@
|
|
|
1
|
+
import * as React from "react";
|
|
2
|
+
import { StyleSheet } from "react-native";
|
|
3
|
+
import MarkdownComponent from "react-native-markdown-display";
|
|
4
|
+
const Markdown = _ref => {
|
|
5
|
+
let {
|
|
6
|
+
children,
|
|
7
|
+
style
|
|
8
|
+
} = _ref;
|
|
9
|
+
return (
|
|
10
|
+
/*#__PURE__*/
|
|
11
|
+
//'body' style applies to all markdown components
|
|
12
|
+
//@ts-ignore TS does not like the type of this named style for some reason
|
|
13
|
+
React.createElement(MarkdownComponent, {
|
|
14
|
+
style: {
|
|
15
|
+
body: StyleSheet.flatten(style)
|
|
16
|
+
}
|
|
17
|
+
}, children)
|
|
18
|
+
);
|
|
19
|
+
};
|
|
20
|
+
export default Markdown;
|
|
@@ -0,0 +1,38 @@
|
|
|
1
|
+
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); }
|
|
2
|
+
import React from "react";
|
|
3
|
+
import { Shadow as ShadowComponent } from "react-native-shadow-2";
|
|
4
|
+
const Shadow = _ref => {
|
|
5
|
+
let {
|
|
6
|
+
offsetX = 0,
|
|
7
|
+
offsetY = 0,
|
|
8
|
+
showShadowSideStart = true,
|
|
9
|
+
showShadowSideEnd = true,
|
|
10
|
+
showShadowSideTop = true,
|
|
11
|
+
showShadowSideBottom = true,
|
|
12
|
+
showShadowCornerTopStart = true,
|
|
13
|
+
showShadowCornerTopEnd = true,
|
|
14
|
+
showShadowCornerBottomStart = true,
|
|
15
|
+
showShadowCornerBottomEnd = true,
|
|
16
|
+
paintInside = false,
|
|
17
|
+
style,
|
|
18
|
+
...rest
|
|
19
|
+
} = _ref;
|
|
20
|
+
return /*#__PURE__*/React.createElement(ShadowComponent, _extends({
|
|
21
|
+
offset: [offsetX, offsetY],
|
|
22
|
+
sides: {
|
|
23
|
+
start: showShadowSideStart,
|
|
24
|
+
end: showShadowSideEnd,
|
|
25
|
+
top: showShadowSideTop,
|
|
26
|
+
bottom: showShadowSideBottom
|
|
27
|
+
},
|
|
28
|
+
corners: {
|
|
29
|
+
topStart: showShadowCornerTopStart,
|
|
30
|
+
topEnd: showShadowCornerTopEnd,
|
|
31
|
+
bottomStart: showShadowCornerBottomStart,
|
|
32
|
+
bottomEnd: showShadowCornerBottomEnd
|
|
33
|
+
},
|
|
34
|
+
containerStyle: style,
|
|
35
|
+
paintInside: paintInside
|
|
36
|
+
}, rest));
|
|
37
|
+
};
|
|
38
|
+
export default Shadow;
|