@draftbit/core 46.10.2 → 46.10.3-1b8e7d.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/Accordion/AccordionItem.js +23 -4
- package/lib/commonjs/components/Checkbox/CheckboxGroupRow.js +23 -5
- package/lib/commonjs/components/Checkbox/CheckboxRow.js +23 -6
- package/lib/commonjs/components/Checkbox/context.js +1 -1
- package/lib/commonjs/components/Table/Table.js +123 -0
- package/lib/commonjs/components/Table/TableCell.js +49 -0
- package/lib/commonjs/components/Table/TableCommon.js +30 -0
- package/lib/commonjs/components/Table/TableRow.js +61 -0
- package/lib/commonjs/components/Table/index.js +27 -0
- package/lib/commonjs/index.js +19 -28
- package/lib/commonjs/mappings/NativeBase/Layout.js +108 -0
- package/lib/commonjs/mappings/Table.js +140 -0
- package/lib/module/components/Table/Table.js +114 -0
- package/lib/module/components/Table/TableCell.js +41 -0
- package/lib/module/components/Table/TableCommon.js +21 -0
- package/lib/module/components/Table/TableRow.js +53 -0
- package/lib/module/components/Table/index.js +3 -0
- package/lib/module/index.js +1 -4
- package/lib/module/mappings/NativeBase/Layout.js +101 -0
- package/lib/module/mappings/Table.js +133 -0
- package/lib/typescript/src/components/Table/Table.d.ts +19 -0
- package/lib/typescript/src/components/Table/Table.d.ts.map +1 -0
- package/lib/typescript/src/components/Table/TableCell.d.ts +9 -0
- package/lib/typescript/src/components/Table/TableCell.d.ts.map +1 -0
- package/lib/typescript/src/components/Table/TableCommon.d.ts +20 -0
- package/lib/typescript/src/components/Table/TableCommon.d.ts.map +1 -0
- package/lib/typescript/src/components/{RowBodyIcon.d.ts → Table/TableRow.d.ts} +7 -9
- package/lib/typescript/src/components/Table/TableRow.d.ts.map +1 -0
- package/lib/typescript/src/components/Table/index.d.ts +4 -0
- package/lib/typescript/src/components/Table/index.d.ts.map +1 -0
- package/lib/typescript/src/index.d.ts +1 -4
- package/lib/typescript/src/index.d.ts.map +1 -1
- package/lib/typescript/src/mappings/NativeBase/Layout.d.ts +133 -0
- package/lib/typescript/src/mappings/NativeBase/Layout.d.ts.map +1 -0
- package/lib/typescript/src/mappings/Table.d.ts +337 -0
- package/lib/typescript/src/mappings/Table.d.ts.map +1 -0
- package/package.json +3 -3
- package/src/components/Table/Table.js +93 -0
- package/src/components/Table/Table.tsx +176 -0
- package/src/components/Table/TableCell.js +31 -0
- package/src/components/Table/TableCell.tsx +63 -0
- package/src/components/Table/TableCommon.js +12 -0
- package/src/components/Table/TableCommon.ts +40 -0
- package/src/components/Table/TableRow.js +37 -0
- package/src/components/Table/TableRow.tsx +77 -0
- package/src/components/Table/index.js +3 -0
- package/src/components/Table/index.tsx +3 -0
- package/src/index.js +1 -4
- package/src/index.tsx +2 -4
- package/src/mappings/NativeBase/Layout.js +124 -0
- package/src/mappings/NativeBase/Layout.ts +145 -0
- package/src/mappings/Table.js +150 -0
- package/src/mappings/Table.ts +170 -0
- package/lib/commonjs/components/Container.js +0 -93
- package/lib/commonjs/components/DeprecatedFAB.js +0 -157
- package/lib/commonjs/components/Row.js +0 -73
- package/lib/commonjs/components/RowBodyIcon.js +0 -45
- package/lib/commonjs/components/RowHeadlineImageCaption.js +0 -45
- package/lib/commonjs/components/RowHeadlineImageIcon.js +0 -51
- package/lib/commonjs/mappings/Container.js +0 -37
- package/lib/module/components/Container.js +0 -83
- package/lib/module/components/DeprecatedFAB.js +0 -147
- package/lib/module/components/Row.js +0 -63
- package/lib/module/components/RowBodyIcon.js +0 -35
- package/lib/module/components/RowHeadlineImageCaption.js +0 -35
- package/lib/module/components/RowHeadlineImageIcon.js +0 -41
- package/lib/module/mappings/Container.js +0 -30
- package/lib/typescript/src/components/Container.d.ts +0 -21
- package/lib/typescript/src/components/Container.d.ts.map +0 -1
- package/lib/typescript/src/components/DeprecatedFAB.d.ts +0 -56
- package/lib/typescript/src/components/DeprecatedFAB.d.ts.map +0 -1
- package/lib/typescript/src/components/Row.d.ts +0 -21
- package/lib/typescript/src/components/Row.d.ts.map +0 -1
- package/lib/typescript/src/components/RowBodyIcon.d.ts.map +0 -1
- package/lib/typescript/src/components/RowHeadlineImageCaption.d.ts +0 -16
- package/lib/typescript/src/components/RowHeadlineImageCaption.d.ts.map +0 -1
- package/lib/typescript/src/components/RowHeadlineImageIcon.d.ts +0 -18
- package/lib/typescript/src/components/RowHeadlineImageIcon.d.ts.map +0 -1
- package/lib/typescript/src/mappings/Container.d.ts +0 -55
- package/lib/typescript/src/mappings/Container.d.ts.map +0 -1
- package/src/components/Container.js +0 -43
- package/src/components/Container.tsx +0 -116
- package/src/components/DeprecatedFAB.js +0 -114
- package/src/components/DeprecatedFAB.tsx +0 -231
- package/src/components/Row.js +0 -48
- package/src/components/Row.tsx +0 -108
- package/src/components/RowBodyIcon.js +0 -8
- package/src/components/RowBodyIcon.tsx +0 -47
- package/src/components/RowHeadlineImageCaption.js +0 -12
- package/src/components/RowHeadlineImageCaption.tsx +0 -49
- package/src/components/RowHeadlineImageIcon.js +0 -14
- package/src/components/RowHeadlineImageIcon.tsx +0 -61
- package/src/mappings/Container.js +0 -30
- package/src/mappings/Container.ts +0 -41
|
@@ -12,7 +12,6 @@ var _theming = require("../../theming");
|
|
|
12
12
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
13
13
|
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); }
|
|
14
14
|
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; }
|
|
15
|
-
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); }
|
|
16
15
|
const AccordionItem = _ref => {
|
|
17
16
|
let {
|
|
18
17
|
Icon,
|
|
@@ -27,9 +26,10 @@ const AccordionItem = _ref => {
|
|
|
27
26
|
textStyles,
|
|
28
27
|
viewStyles
|
|
29
28
|
} = (0, _utilities.extractStyles)(style);
|
|
30
|
-
return /*#__PURE__*/React.createElement(_reactNative.Pressable,
|
|
31
|
-
style: [styles.container, viewStyles]
|
|
32
|
-
|
|
29
|
+
return /*#__PURE__*/React.createElement(_reactNative.Pressable, {
|
|
30
|
+
style: [styles.container, viewStyles],
|
|
31
|
+
...rest
|
|
32
|
+
}, /*#__PURE__*/React.createElement(_reactNative.View, {
|
|
33
33
|
style: styles.row
|
|
34
34
|
}, icon ? /*#__PURE__*/React.createElement(Icon, {
|
|
35
35
|
name: icon,
|
|
@@ -61,4 +61,23 @@ const styles = _reactNative.StyleSheet.create({
|
|
|
61
61
|
}
|
|
62
62
|
});
|
|
63
63
|
var _default = (0, _theming.withTheme)(AccordionItem);
|
|
64
|
+
exports.default = _default;.StyleSheet.create({
|
|
65
|
+
container: {
|
|
66
|
+
padding: 8
|
|
67
|
+
},
|
|
68
|
+
row: {
|
|
69
|
+
flexDirection: "row",
|
|
70
|
+
alignItems: "center",
|
|
71
|
+
paddingLeft: 8
|
|
72
|
+
},
|
|
73
|
+
item: {
|
|
74
|
+
marginVertical: 6,
|
|
75
|
+
paddingLeft: 8
|
|
76
|
+
},
|
|
77
|
+
content: {
|
|
78
|
+
flex: 1,
|
|
79
|
+
justifyContent: "center"
|
|
80
|
+
}
|
|
81
|
+
});
|
|
82
|
+
var _default = (0, _theming.withTheme)(AccordionItem);
|
|
64
83
|
exports.default = _default;
|
|
@@ -13,8 +13,7 @@ var _utilities = require("../../utilities");
|
|
|
13
13
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
14
14
|
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); }
|
|
15
15
|
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; }
|
|
16
|
-
|
|
17
|
-
let Direction;
|
|
16
|
+
var Direction;
|
|
18
17
|
exports.Direction = Direction;
|
|
19
18
|
(function (Direction) {
|
|
20
19
|
Direction["Row"] = "row";
|
|
@@ -72,13 +71,14 @@ const CheckboxGroupRow = _ref => {
|
|
|
72
71
|
textStyles,
|
|
73
72
|
viewStyles
|
|
74
73
|
} = (0, _utilities.extractStyles)(style);
|
|
75
|
-
return /*#__PURE__*/React.createElement(_reactNative.Pressable,
|
|
74
|
+
return /*#__PURE__*/React.createElement(_reactNative.Pressable, {
|
|
76
75
|
onPress: handlePress,
|
|
77
76
|
style: [styles.mainParent, {
|
|
78
77
|
flexDirection: direction
|
|
79
78
|
}, viewStyles],
|
|
80
|
-
disabled: disabled
|
|
81
|
-
|
|
79
|
+
disabled: disabled,
|
|
80
|
+
...rest
|
|
81
|
+
}, /*#__PURE__*/React.createElement(_reactNative.View, {
|
|
82
82
|
style: [styles.label, {
|
|
83
83
|
alignItems: direction === Direction.Row ? "flex-start" : "flex-end"
|
|
84
84
|
}, labelContainerStyle]
|
|
@@ -117,4 +117,22 @@ const styles = _reactNative.StyleSheet.create({
|
|
|
117
117
|
}
|
|
118
118
|
});
|
|
119
119
|
var _default = CheckboxGroupRow;
|
|
120
|
+
exports.default = _default;center",
|
|
121
|
+
justifyContent: "space-around",
|
|
122
|
+
paddingStart: 20,
|
|
123
|
+
minHeight: 50,
|
|
124
|
+
paddingEnd: 20,
|
|
125
|
+
display: "flex",
|
|
126
|
+
..._reactNative.Platform.select({
|
|
127
|
+
web: {
|
|
128
|
+
cursor: "pointer",
|
|
129
|
+
userSelect: "none"
|
|
130
|
+
}
|
|
131
|
+
})
|
|
132
|
+
},
|
|
133
|
+
label: {
|
|
134
|
+
flex: 3
|
|
135
|
+
}
|
|
136
|
+
});
|
|
137
|
+
var _default = CheckboxGroupRow;
|
|
120
138
|
exports.default = _default;
|
|
@@ -14,8 +14,7 @@ var _Checkbox = _interopRequireDefault(require("./Checkbox"));
|
|
|
14
14
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
15
15
|
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); }
|
|
16
16
|
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; }
|
|
17
|
-
|
|
18
|
-
let Direction;
|
|
17
|
+
var Direction;
|
|
19
18
|
exports.Direction = Direction;
|
|
20
19
|
(function (Direction) {
|
|
21
20
|
Direction["Row"] = "row";
|
|
@@ -58,7 +57,6 @@ const CheckboxRow = _ref => {
|
|
|
58
57
|
setInternalValue(status);
|
|
59
58
|
}
|
|
60
59
|
}, [status]);
|
|
61
|
-
|
|
62
60
|
// This special logic is to handle weird APIs like Airtable that return
|
|
63
61
|
// true or undefined for a boolean
|
|
64
62
|
const previousDefaultValue = (0, _hooks.usePrevious)(defaultValue);
|
|
@@ -82,13 +80,14 @@ const CheckboxRow = _ref => {
|
|
|
82
80
|
textStyles,
|
|
83
81
|
viewStyles
|
|
84
82
|
} = (0, _utilities.extractStyles)(style);
|
|
85
|
-
return /*#__PURE__*/React.createElement(_reactNative.Pressable,
|
|
83
|
+
return /*#__PURE__*/React.createElement(_reactNative.Pressable, {
|
|
86
84
|
onPress: handlePress,
|
|
87
85
|
style: [viewStyles, styles.mainParent, {
|
|
88
86
|
flexDirection: direction
|
|
89
87
|
}],
|
|
90
|
-
disabled: disabled
|
|
91
|
-
|
|
88
|
+
disabled: disabled,
|
|
89
|
+
...rest
|
|
90
|
+
}, /*#__PURE__*/React.createElement(_reactNative.View, {
|
|
92
91
|
style: [styles.label, {
|
|
93
92
|
alignItems: direction === Direction.Row ? "flex-start" : "flex-end"
|
|
94
93
|
}, labelContainerStyle]
|
|
@@ -125,4 +124,22 @@ const styles = _reactNative.StyleSheet.create({
|
|
|
125
124
|
}
|
|
126
125
|
});
|
|
127
126
|
var _default = CheckboxRow;
|
|
127
|
+
exports.default = _default;ems: "center",
|
|
128
|
+
justifyContent: "space-around",
|
|
129
|
+
paddingStart: 20,
|
|
130
|
+
minHeight: 50,
|
|
131
|
+
paddingEnd: 20,
|
|
132
|
+
display: "flex",
|
|
133
|
+
..._reactNative.Platform.select({
|
|
134
|
+
web: {
|
|
135
|
+
cursor: "pointer",
|
|
136
|
+
userSelect: "none"
|
|
137
|
+
}
|
|
138
|
+
})
|
|
139
|
+
},
|
|
140
|
+
label: {
|
|
141
|
+
flex: 3
|
|
142
|
+
}
|
|
143
|
+
});
|
|
144
|
+
var _default = CheckboxRow;
|
|
128
145
|
exports.default = _default;
|
|
@@ -6,7 +6,7 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
6
6
|
exports.checkboxGroupContext = exports.Direction = void 0;
|
|
7
7
|
exports.useCheckboxGroupContext = useCheckboxGroupContext;
|
|
8
8
|
var _react = require("react");
|
|
9
|
-
|
|
9
|
+
let Direction;
|
|
10
10
|
exports.Direction = Direction;
|
|
11
11
|
(function (Direction) {
|
|
12
12
|
Direction["Horizontal"] = "horizontal";
|
|
@@ -0,0 +1,123 @@
|
|
|
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 _reactNative = require("react-native");
|
|
9
|
+
var _theming = require("../../theming");
|
|
10
|
+
var _TableCommon = require("./TableCommon");
|
|
11
|
+
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
12
|
+
const Table = _ref => {
|
|
13
|
+
let {
|
|
14
|
+
theme,
|
|
15
|
+
borderWidth = 1,
|
|
16
|
+
borderColor = theme.colors.divider,
|
|
17
|
+
borderStyle = "solid",
|
|
18
|
+
drawTopBorder = true,
|
|
19
|
+
drawBottomBorder = false,
|
|
20
|
+
drawStartBorder = false,
|
|
21
|
+
drawEndBorder = false,
|
|
22
|
+
cellVerticalPadding = 10,
|
|
23
|
+
cellHorizontalPadding = 10,
|
|
24
|
+
data,
|
|
25
|
+
keyExtractor,
|
|
26
|
+
renderItem,
|
|
27
|
+
children: childrenProp,
|
|
28
|
+
style,
|
|
29
|
+
...rest
|
|
30
|
+
} = _ref;
|
|
31
|
+
//Both 'renderItem' and 'data' are optional to allow direct children. But if one is included, both need to be included
|
|
32
|
+
if (data && !renderItem || renderItem && !data) {
|
|
33
|
+
throw new Error("'renderItem' and 'data' need to both be provided to render from 'data'. Either remove them entirley or include both");
|
|
34
|
+
}
|
|
35
|
+
if (data && renderItem && childrenProp) {
|
|
36
|
+
console.warn("'children' of Table ignored due to usage of 'data' and 'renderItem'");
|
|
37
|
+
}
|
|
38
|
+
const isTableHeader = _react.default.useCallback(object => {
|
|
39
|
+
return object.isTableHeader;
|
|
40
|
+
}, []);
|
|
41
|
+
const isRenderItem = data && renderItem;
|
|
42
|
+
|
|
43
|
+
//Uses 'renderItem' and 'data' to create an array of children
|
|
44
|
+
const dataAsChildren = _react.default.useMemo(() => {
|
|
45
|
+
if (!isRenderItem) return [];
|
|
46
|
+
return data.map((item, index) => {
|
|
47
|
+
const component = renderItem({
|
|
48
|
+
item,
|
|
49
|
+
index
|
|
50
|
+
});
|
|
51
|
+
if (!component) {
|
|
52
|
+
return null;
|
|
53
|
+
}
|
|
54
|
+
const key = keyExtractor ? keyExtractor(item, index) : index.toString();
|
|
55
|
+
return /*#__PURE__*/_react.default.cloneElement(component, {
|
|
56
|
+
key
|
|
57
|
+
});
|
|
58
|
+
});
|
|
59
|
+
}, [data, renderItem, keyExtractor, isRenderItem]);
|
|
60
|
+
const children = isRenderItem ? dataAsChildren : _react.default.Children.toArray(childrenProp);
|
|
61
|
+
const validChildren = _react.default.useMemo(() => children.filter(item => /*#__PURE__*/_react.default.isValidElement(item)), [children]);
|
|
62
|
+
const childrenWithoutHeader = _react.default.useMemo(() => {
|
|
63
|
+
const flattenedWithoutNestedHeaders = validChildren.map(item => {
|
|
64
|
+
const nestedChildren = _react.default.Children.toArray(item.props.children);
|
|
65
|
+
//Header can be nested in React.Fragment when in renderItem
|
|
66
|
+
const nestedHeaders = nestedChildren.filter(child => isTableHeader(child.props));
|
|
67
|
+
if (nestedHeaders !== null && nestedHeaders !== void 0 && nestedHeaders.length) {
|
|
68
|
+
//New element excluding header children
|
|
69
|
+
return /*#__PURE__*/_react.default.cloneElement(item, {
|
|
70
|
+
children: nestedChildren.filter(child => !isTableHeader(child.props))
|
|
71
|
+
});
|
|
72
|
+
}
|
|
73
|
+
return item;
|
|
74
|
+
});
|
|
75
|
+
return flattenedWithoutNestedHeaders.filter(item => !isTableHeader(item.props));
|
|
76
|
+
}, [validChildren, isTableHeader]);
|
|
77
|
+
const header = _react.default.useMemo(() => {
|
|
78
|
+
const flattenedPossibleHeaders = validChildren.map(item => {
|
|
79
|
+
const nestedChildren = _react.default.Children.toArray(item.props.children);
|
|
80
|
+
//Header can be nested in React.Fragment when in renderItem
|
|
81
|
+
const nestedHeaders = nestedChildren.filter(child => isTableHeader(child.props));
|
|
82
|
+
if (nestedHeaders !== null && nestedHeaders !== void 0 && nestedHeaders.length) {
|
|
83
|
+
return nestedHeaders[0];
|
|
84
|
+
}
|
|
85
|
+
return item;
|
|
86
|
+
});
|
|
87
|
+
const allHeaders = flattenedPossibleHeaders.filter(item => isTableHeader(item.props));
|
|
88
|
+
if (allHeaders.length) {
|
|
89
|
+
return allHeaders[0]; //Only 1 header taken
|
|
90
|
+
}
|
|
91
|
+
|
|
92
|
+
return null;
|
|
93
|
+
}, [validChildren, isTableHeader]);
|
|
94
|
+
const contextValue = {
|
|
95
|
+
borderColor,
|
|
96
|
+
borderStyle,
|
|
97
|
+
borderWidth,
|
|
98
|
+
cellHorizontalPadding,
|
|
99
|
+
cellVerticalPadding
|
|
100
|
+
};
|
|
101
|
+
const borderViewStyle = (0, _TableCommon.generateBorderStyles)({
|
|
102
|
+
borderColor,
|
|
103
|
+
borderWidth,
|
|
104
|
+
borderStyle,
|
|
105
|
+
drawTopBorder,
|
|
106
|
+
drawBottomBorder,
|
|
107
|
+
drawStartBorder,
|
|
108
|
+
drawEndBorder
|
|
109
|
+
});
|
|
110
|
+
return /*#__PURE__*/_react.default.createElement(_TableCommon.TableStyleContext.Provider, {
|
|
111
|
+
value: contextValue
|
|
112
|
+
}, /*#__PURE__*/_react.default.createElement(_reactNative.View, {
|
|
113
|
+
style: [styles.container, borderViewStyle, style]
|
|
114
|
+
}, /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, header), /*#__PURE__*/_react.default.createElement(_reactNative.ScrollView, rest, childrenWithoutHeader)));
|
|
115
|
+
};
|
|
116
|
+
const styles = _reactNative.StyleSheet.create({
|
|
117
|
+
container: {
|
|
118
|
+
flex: 1
|
|
119
|
+
}
|
|
120
|
+
});
|
|
121
|
+
var _default = (0, _theming.withTheme)(Table);
|
|
122
|
+
exports.default = _default;
|
|
123
|
+
exports.default = _default;
|
|
@@ -0,0 +1,49 @@
|
|
|
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 _reactNative = require("react-native");
|
|
9
|
+
var _TableCommon = require("./TableCommon");
|
|
10
|
+
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
11
|
+
const TableCell = _ref => {
|
|
12
|
+
let {
|
|
13
|
+
borderWidth,
|
|
14
|
+
borderColor,
|
|
15
|
+
borderStyle,
|
|
16
|
+
drawTopBorder = false,
|
|
17
|
+
drawBottomBorder = false,
|
|
18
|
+
drawStartBorder = false,
|
|
19
|
+
drawEndBorder = true,
|
|
20
|
+
cellVerticalPadding,
|
|
21
|
+
cellHorizontalPadding,
|
|
22
|
+
children,
|
|
23
|
+
style
|
|
24
|
+
} = _ref;
|
|
25
|
+
const parentContextValue = _react.default.useContext(_TableCommon.TableStyleContext);
|
|
26
|
+
const borderViewStyle = (0, _TableCommon.generateBorderStyles)({
|
|
27
|
+
borderColor: borderColor || parentContextValue.borderColor,
|
|
28
|
+
borderWidth: borderWidth || parentContextValue.borderWidth,
|
|
29
|
+
borderStyle: borderStyle || parentContextValue.borderStyle,
|
|
30
|
+
drawTopBorder,
|
|
31
|
+
drawBottomBorder,
|
|
32
|
+
drawStartBorder,
|
|
33
|
+
drawEndBorder
|
|
34
|
+
});
|
|
35
|
+
return /*#__PURE__*/_react.default.createElement(_reactNative.View, {
|
|
36
|
+
style: [styles.cellContainer, borderViewStyle, {
|
|
37
|
+
paddingVertical: cellVerticalPadding || parentContextValue.cellVerticalPadding,
|
|
38
|
+
paddingHorizontal: cellHorizontalPadding || parentContextValue.cellHorizontalPadding
|
|
39
|
+
}, style]
|
|
40
|
+
}, children);
|
|
41
|
+
};
|
|
42
|
+
const styles = _reactNative.StyleSheet.create({
|
|
43
|
+
cellContainer: {
|
|
44
|
+
flex: 1,
|
|
45
|
+
flexDirection: "row"
|
|
46
|
+
}
|
|
47
|
+
});
|
|
48
|
+
var _default = TableCell;
|
|
49
|
+
exports.default = _default;
|
|
@@ -0,0 +1,30 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports.TableStyleContext = void 0;
|
|
7
|
+
exports.generateBorderStyles = generateBorderStyles;
|
|
8
|
+
var _react = _interopRequireDefault(require("react"));
|
|
9
|
+
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
10
|
+
const TableStyleContext = /*#__PURE__*/_react.default.createContext({});
|
|
11
|
+
exports.TableStyleContext = TableStyleContext;
|
|
12
|
+
function generateBorderStyles(_ref) {
|
|
13
|
+
let {
|
|
14
|
+
borderColor,
|
|
15
|
+
borderWidth,
|
|
16
|
+
borderStyle,
|
|
17
|
+
drawTopBorder,
|
|
18
|
+
drawBottomBorder,
|
|
19
|
+
drawStartBorder,
|
|
20
|
+
drawEndBorder
|
|
21
|
+
} = _ref;
|
|
22
|
+
return {
|
|
23
|
+
borderColor,
|
|
24
|
+
borderStyle,
|
|
25
|
+
borderTopWidth: drawTopBorder ? borderWidth : 0,
|
|
26
|
+
borderBottomWidth: drawBottomBorder ? borderWidth : 0,
|
|
27
|
+
borderStartWidth: drawStartBorder ? borderWidth : 0,
|
|
28
|
+
borderEndWidth: drawEndBorder ? borderWidth : 0
|
|
29
|
+
};
|
|
30
|
+
}
|
|
@@ -0,0 +1,61 @@
|
|
|
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 _reactNative = require("react-native");
|
|
9
|
+
var _TableCommon = require("./TableCommon");
|
|
10
|
+
var _theming = require("../../theming");
|
|
11
|
+
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
12
|
+
const TableRow = _ref => {
|
|
13
|
+
let {
|
|
14
|
+
borderWidth,
|
|
15
|
+
borderColor,
|
|
16
|
+
borderStyle,
|
|
17
|
+
drawTopBorder = false,
|
|
18
|
+
drawBottomBorder = true,
|
|
19
|
+
drawStartBorder = true,
|
|
20
|
+
drawEndBorder = false,
|
|
21
|
+
cellVerticalPadding,
|
|
22
|
+
cellHorizontalPadding,
|
|
23
|
+
isTableHeader = false,
|
|
24
|
+
children,
|
|
25
|
+
style,
|
|
26
|
+
theme
|
|
27
|
+
} = _ref;
|
|
28
|
+
const parentContextValue = _react.default.useContext(_TableCommon.TableStyleContext);
|
|
29
|
+
|
|
30
|
+
//Create context to use and pass to children based on own props or fall back to parent provided context
|
|
31
|
+
const contextValue = {
|
|
32
|
+
borderColor: borderColor || parentContextValue.borderColor,
|
|
33
|
+
borderStyle: borderStyle || parentContextValue.borderStyle,
|
|
34
|
+
borderWidth: borderWidth || parentContextValue.borderWidth,
|
|
35
|
+
cellHorizontalPadding: cellHorizontalPadding || parentContextValue.cellHorizontalPadding,
|
|
36
|
+
cellVerticalPadding: cellVerticalPadding || parentContextValue.cellVerticalPadding
|
|
37
|
+
};
|
|
38
|
+
const borderViewStyle = (0, _TableCommon.generateBorderStyles)({
|
|
39
|
+
borderColor: contextValue.borderColor,
|
|
40
|
+
borderWidth: contextValue.borderWidth,
|
|
41
|
+
borderStyle: contextValue.borderStyle,
|
|
42
|
+
drawTopBorder,
|
|
43
|
+
drawBottomBorder,
|
|
44
|
+
drawStartBorder,
|
|
45
|
+
drawEndBorder
|
|
46
|
+
});
|
|
47
|
+
return /*#__PURE__*/_react.default.createElement(_TableCommon.TableStyleContext.Provider, {
|
|
48
|
+
value: contextValue
|
|
49
|
+
}, /*#__PURE__*/_react.default.createElement(_reactNative.View, {
|
|
50
|
+
style: [borderViewStyle, isTableHeader ? {
|
|
51
|
+
backgroundColor: theme.colors.primary
|
|
52
|
+
} : {}, style, styles.cellsContainer]
|
|
53
|
+
}, children));
|
|
54
|
+
};
|
|
55
|
+
const styles = _reactNative.StyleSheet.create({
|
|
56
|
+
cellsContainer: {
|
|
57
|
+
flexDirection: "row"
|
|
58
|
+
}
|
|
59
|
+
});
|
|
60
|
+
var _default = (0, _theming.withTheme)(TableRow);
|
|
61
|
+
exports.default = _default;
|
|
@@ -0,0 +1,27 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
Object.defineProperty(exports, "Table", {
|
|
7
|
+
enumerable: true,
|
|
8
|
+
get: function () {
|
|
9
|
+
return _Table.default;
|
|
10
|
+
}
|
|
11
|
+
});
|
|
12
|
+
Object.defineProperty(exports, "TableCell", {
|
|
13
|
+
enumerable: true,
|
|
14
|
+
get: function () {
|
|
15
|
+
return _TableCell.default;
|
|
16
|
+
}
|
|
17
|
+
});
|
|
18
|
+
Object.defineProperty(exports, "TableRow", {
|
|
19
|
+
enumerable: true,
|
|
20
|
+
get: function () {
|
|
21
|
+
return _TableRow.default;
|
|
22
|
+
}
|
|
23
|
+
});
|
|
24
|
+
var _Table = _interopRequireDefault(require("./Table"));
|
|
25
|
+
var _TableRow = _interopRequireDefault(require("./TableRow"));
|
|
26
|
+
var _TableCell = _interopRequireDefault(require("./TableCell"));
|
|
27
|
+
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
package/lib/commonjs/index.js
CHANGED
|
@@ -117,12 +117,6 @@ Object.defineProperty(exports, "CircleImage", {
|
|
|
117
117
|
return _CircleImage.default;
|
|
118
118
|
}
|
|
119
119
|
});
|
|
120
|
-
Object.defineProperty(exports, "Container", {
|
|
121
|
-
enumerable: true,
|
|
122
|
-
get: function () {
|
|
123
|
-
return _Container.default;
|
|
124
|
-
}
|
|
125
|
-
});
|
|
126
120
|
Object.defineProperty(exports, "DatePicker", {
|
|
127
121
|
enumerable: true,
|
|
128
122
|
get: function () {
|
|
@@ -255,24 +249,6 @@ Object.defineProperty(exports, "Row", {
|
|
|
255
249
|
return _Layout.Row;
|
|
256
250
|
}
|
|
257
251
|
});
|
|
258
|
-
Object.defineProperty(exports, "RowBodyIcon", {
|
|
259
|
-
enumerable: true,
|
|
260
|
-
get: function () {
|
|
261
|
-
return _RowBodyIcon.default;
|
|
262
|
-
}
|
|
263
|
-
});
|
|
264
|
-
Object.defineProperty(exports, "RowHeadlineImageCaption", {
|
|
265
|
-
enumerable: true,
|
|
266
|
-
get: function () {
|
|
267
|
-
return _RowHeadlineImageCaption.default;
|
|
268
|
-
}
|
|
269
|
-
});
|
|
270
|
-
Object.defineProperty(exports, "RowHeadlineImageIcon", {
|
|
271
|
-
enumerable: true,
|
|
272
|
-
get: function () {
|
|
273
|
-
return _RowHeadlineImageIcon.default;
|
|
274
|
-
}
|
|
275
|
-
});
|
|
276
252
|
Object.defineProperty(exports, "SVG", {
|
|
277
253
|
enumerable: true,
|
|
278
254
|
get: function () {
|
|
@@ -369,6 +345,24 @@ Object.defineProperty(exports, "TabViewItem", {
|
|
|
369
345
|
return _TabView.TabViewItem;
|
|
370
346
|
}
|
|
371
347
|
});
|
|
348
|
+
Object.defineProperty(exports, "Table", {
|
|
349
|
+
enumerable: true,
|
|
350
|
+
get: function () {
|
|
351
|
+
return _Table.Table;
|
|
352
|
+
}
|
|
353
|
+
});
|
|
354
|
+
Object.defineProperty(exports, "TableCell", {
|
|
355
|
+
enumerable: true,
|
|
356
|
+
get: function () {
|
|
357
|
+
return _Table.TableCell;
|
|
358
|
+
}
|
|
359
|
+
});
|
|
360
|
+
Object.defineProperty(exports, "TableRow", {
|
|
361
|
+
enumerable: true,
|
|
362
|
+
get: function () {
|
|
363
|
+
return _Table.TableRow;
|
|
364
|
+
}
|
|
365
|
+
});
|
|
372
366
|
Object.defineProperty(exports, "TextField", {
|
|
373
367
|
enumerable: true,
|
|
374
368
|
get: function () {
|
|
@@ -428,7 +422,6 @@ var _CircleImage = _interopRequireDefault(require("./components/CircleImage"));
|
|
|
428
422
|
var _AvatarEdit = _interopRequireDefault(require("./components/AvatarEdit"));
|
|
429
423
|
var _Card = _interopRequireDefault(require("./components/Card"));
|
|
430
424
|
var _Checkbox = require("./components/Checkbox");
|
|
431
|
-
var _Container = _interopRequireDefault(require("./components/Container"));
|
|
432
425
|
var _Divider = _interopRequireDefault(require("./components/Divider"));
|
|
433
426
|
var _FAB = _interopRequireDefault(require("./components/FAB"));
|
|
434
427
|
var _FieldSearchBarFull = _interopRequireDefault(require("./components/FieldSearchBarFull"));
|
|
@@ -455,13 +448,11 @@ var _TabView = require("./components/TabView");
|
|
|
455
448
|
var _Markdown = _interopRequireDefault(require("./components/Markdown"));
|
|
456
449
|
var _BottomSheet = require("./components/BottomSheet");
|
|
457
450
|
var _YoutubePlayer = require("./components/YoutubePlayer");
|
|
451
|
+
var _Table = require("./components/Table");
|
|
458
452
|
var _DatePicker = _interopRequireDefault(require("./components/DatePicker/DatePicker"));
|
|
459
453
|
var _Picker = _interopRequireDefault(require("./components/Picker/Picker"));
|
|
460
454
|
var _ProgressBar = _interopRequireDefault(require("./components/ProgressBar"));
|
|
461
455
|
var _ProgressCircle = _interopRequireDefault(require("./components/ProgressCircle"));
|
|
462
|
-
var _RowBodyIcon = _interopRequireDefault(require("./components/RowBodyIcon"));
|
|
463
|
-
var _RowHeadlineImageCaption = _interopRequireDefault(require("./components/RowHeadlineImageCaption"));
|
|
464
|
-
var _RowHeadlineImageIcon = _interopRequireDefault(require("./components/RowHeadlineImageIcon"));
|
|
465
456
|
var _Slider = _interopRequireDefault(require("./components/Slider"));
|
|
466
457
|
var _Stepper = _interopRequireDefault(require("./components/Stepper"));
|
|
467
458
|
var _useAuthState = require("./components/useAuthState");
|
|
@@ -0,0 +1,108 @@
|
|
|
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 SHARED_SEED_DATA = {
|
|
9
|
+
category: _types.COMPONENT_TYPES.layout,
|
|
10
|
+
packageName: "native-base",
|
|
11
|
+
stylesPanelSections: _types.CONTAINER_COMPONENT_STYLES_SECTIONS
|
|
12
|
+
};
|
|
13
|
+
const CONTAINER_COMPONENT_STYLES_WITHOUT_FLEX = _types.CONTAINER_COMPONENT_STYLES_SECTIONS.filter(item => item !== _types.StylesPanelSections.LayoutFlexItems && item !== _types.StylesPanelSections.LayoutContent);
|
|
14
|
+
const SEED_DATA = [{
|
|
15
|
+
name: "Aspect Ratio",
|
|
16
|
+
tag: "AspectRatio",
|
|
17
|
+
description: "Controls the size of the undefined dimension of a node or child component using an aspect ratio",
|
|
18
|
+
...SHARED_SEED_DATA,
|
|
19
|
+
props: {
|
|
20
|
+
ratio: (0, _types.createStaticNumberProp)({
|
|
21
|
+
label: "Ratio",
|
|
22
|
+
description: "The aspect ratio of the container in decimal format (ex: 3/4 -> 1.33)",
|
|
23
|
+
defaultValue: 1.33
|
|
24
|
+
})
|
|
25
|
+
},
|
|
26
|
+
stylesPanelSections: [_types.StylesPanelSections.Background, _types.StylesPanelSections.Size, _types.StylesPanelSections.Margins, _types.StylesPanelSections.Position, _types.StylesPanelSections.Borders, _types.StylesPanelSections.Effects]
|
|
27
|
+
}, {
|
|
28
|
+
name: "Box",
|
|
29
|
+
tag: "Box",
|
|
30
|
+
description: "This is a generic component for low level layout needs. It is similar to a div in HTML",
|
|
31
|
+
...SHARED_SEED_DATA
|
|
32
|
+
}, {
|
|
33
|
+
name: "Center",
|
|
34
|
+
tag: "Center",
|
|
35
|
+
description: "Center aligns its contents to the center within itself",
|
|
36
|
+
...SHARED_SEED_DATA,
|
|
37
|
+
stylesPanelSections: CONTAINER_COMPONENT_STYLES_WITHOUT_FLEX
|
|
38
|
+
}, {
|
|
39
|
+
name: "Circle",
|
|
40
|
+
tag: "Circle",
|
|
41
|
+
description: "Center aligns its contents to the center within itself with a round border radius",
|
|
42
|
+
...SHARED_SEED_DATA,
|
|
43
|
+
stylesPanelSections: CONTAINER_COMPONENT_STYLES_WITHOUT_FLEX
|
|
44
|
+
}, {
|
|
45
|
+
name: "Container",
|
|
46
|
+
tag: "Container",
|
|
47
|
+
description: "The Container restricts a content's width according to current breakpoint, while keeping the size fluid",
|
|
48
|
+
props: {
|
|
49
|
+
centerContent: (0, _types.createStaticBoolProp)({
|
|
50
|
+
label: "Center content",
|
|
51
|
+
description: "Center child elements based on their content width",
|
|
52
|
+
defaultValue: true
|
|
53
|
+
})
|
|
54
|
+
},
|
|
55
|
+
...SHARED_SEED_DATA
|
|
56
|
+
}, {
|
|
57
|
+
name: "Column",
|
|
58
|
+
tag: "Column",
|
|
59
|
+
description: "Column aligns items vertically",
|
|
60
|
+
layout: {
|
|
61
|
+
flexDirection: "column"
|
|
62
|
+
},
|
|
63
|
+
...SHARED_SEED_DATA
|
|
64
|
+
}, {
|
|
65
|
+
name: "Row",
|
|
66
|
+
tag: "Row",
|
|
67
|
+
description: "Column aligns items horizontally",
|
|
68
|
+
layout: {
|
|
69
|
+
flexDirection: "row"
|
|
70
|
+
},
|
|
71
|
+
...SHARED_SEED_DATA
|
|
72
|
+
}, {
|
|
73
|
+
name: "Spacer",
|
|
74
|
+
tag: "Spacer",
|
|
75
|
+
description: "An adjustable, empty space that can be used to tune the spacing between child elements within Flex",
|
|
76
|
+
layout: {
|
|
77
|
+
flex: 1
|
|
78
|
+
},
|
|
79
|
+
...SHARED_SEED_DATA,
|
|
80
|
+
stylesPanelSections: [_types.StylesPanelSections.LayoutSelectedItem, _types.StylesPanelSections.Background, _types.StylesPanelSections.Margins]
|
|
81
|
+
}, {
|
|
82
|
+
name: "Stack",
|
|
83
|
+
tag: "Stack",
|
|
84
|
+
description: "Stack aligns items vertically or horizontally based on the direction prop",
|
|
85
|
+
...SHARED_SEED_DATA,
|
|
86
|
+
props: {
|
|
87
|
+
isDisabled: (0, _types.createBoolProp)({
|
|
88
|
+
label: "Disabled",
|
|
89
|
+
description: "If true, the Stack will be disabled"
|
|
90
|
+
}),
|
|
91
|
+
isInvalid: (0, _types.createBoolProp)({
|
|
92
|
+
label: "Invalid",
|
|
93
|
+
description: "If true, the Stack will be invalid"
|
|
94
|
+
})
|
|
95
|
+
}
|
|
96
|
+
}, {
|
|
97
|
+
name: "ZStack",
|
|
98
|
+
tag: "ZStack",
|
|
99
|
+
description: "ZStack aligns items to the z-axis",
|
|
100
|
+
...SHARED_SEED_DATA,
|
|
101
|
+
props: {
|
|
102
|
+
reversed: (0, _types.createBoolProp)({
|
|
103
|
+
label: "Reversed",
|
|
104
|
+
description: "Determines whether to reverse the direction of items"
|
|
105
|
+
})
|
|
106
|
+
}
|
|
107
|
+
}];
|
|
108
|
+
exports.SEED_DATA = SEED_DATA;
|