@draftbit/core 46.2.4-2fc21b.3 → 46.2.4-44e731.5
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/Banner.js +4 -24
- package/lib/commonjs/components/CardContainer.js +5 -15
- package/lib/commonjs/components/Carousel.js +10 -34
- package/lib/commonjs/components/Checkbox/CheckboxGroupRow.js +6 -24
- package/lib/commonjs/components/CircularProgress.js +7 -15
- package/lib/commonjs/components/DeprecatedButton.js +4 -22
- package/lib/commonjs/components/Image.js +3 -16
- package/lib/commonjs/components/NumberInput.js +2 -13
- package/lib/commonjs/components/Portal/PortalManager.js +11 -19
- package/lib/commonjs/components/ProgressBar.js +7 -23
- package/lib/commonjs/components/Slider.js +5 -24
- package/lib/commonjs/components/Table/index.js +55 -0
- package/lib/commonjs/components/Table/table.js +35 -0
- package/lib/commonjs/components/Table/tableCell.js +50 -0
- package/lib/commonjs/components/Table/tableHeader.js +41 -0
- package/lib/commonjs/components/Table/tablePaginator.js +17 -0
- package/lib/commonjs/components/Table/tableRow.js +47 -0
- package/lib/commonjs/components/Table/tableTitle.js +60 -0
- package/lib/commonjs/components/Touchable.js +2 -16
- package/lib/commonjs/constants.js +1 -1
- package/lib/commonjs/index.js +38 -0
- package/lib/commonjs/mappings/FieldSearchBarFull.js +3 -1
- package/lib/commonjs/mappings/MapView.js +1 -0
- package/lib/commonjs/mappings/table.js +103 -0
- package/lib/commonjs/utilities.js +2 -2
- package/lib/module/components/Table/index.js +6 -0
- package/lib/module/components/Table/table.js +23 -0
- package/lib/module/components/Table/tableCell.js +37 -0
- package/lib/module/components/Table/tableHeader.js +27 -0
- package/lib/module/components/Table/tablePaginator.js +6 -0
- package/lib/module/components/Table/tableRow.js +33 -0
- package/lib/module/components/Table/tableTitle.js +47 -0
- package/lib/module/index.js +1 -0
- package/lib/module/mappings/MapView.js +1 -0
- package/lib/module/mappings/table.js +94 -0
- package/lib/module/utilities.js +3 -3
- package/lib/typescript/src/components/Table/index.d.ts +6 -0
- package/lib/typescript/src/components/Table/table.d.ts +8 -0
- package/lib/typescript/src/components/Table/tableCell.d.ts +10 -0
- package/lib/typescript/src/components/Table/tableHeader.d.ts +12 -0
- package/lib/typescript/src/components/Table/tablePaginator.d.ts +3 -0
- package/lib/typescript/src/components/Table/tableRow.d.ts +12 -0
- package/lib/typescript/src/components/Table/tableTitle.d.ts +12 -0
- package/lib/typescript/src/index.d.ts +1 -0
- package/lib/typescript/src/mappings/MapView.d.ts +1 -0
- package/lib/typescript/src/mappings/table.d.ts +153 -0
- package/lib/typescript/src/utilities.d.ts +3 -3
- package/package.json +3 -3
- package/src/components/Table/index.js +6 -0
- package/src/components/Table/index.tsx +6 -0
- package/src/components/Table/table.js +10 -0
- package/src/components/Table/table.tsx +22 -0
- package/src/components/Table/tableCell.js +21 -0
- package/src/components/Table/tableCell.tsx +44 -0
- package/src/components/Table/tableHeader.js +11 -0
- package/src/components/Table/tableHeader.tsx +28 -0
- package/src/components/Table/tablePaginator.js +5 -0
- package/src/components/Table/tablePaginator.tsx +10 -0
- package/src/components/Table/tableRow.js +16 -0
- package/src/components/Table/tableRow.tsx +31 -0
- package/src/components/Table/tableTitle.js +28 -0
- package/src/components/Table/tableTitle.tsx +58 -0
- package/src/index.js +1 -0
- package/src/index.tsx +9 -0
- package/src/mappings/MapView.js +1 -0
- package/src/mappings/MapView.ts +1 -0
- package/src/mappings/table.js +137 -0
- package/src/mappings/table.ts +145 -0
- package/src/utilities.js +5 -2
- package/src/utilities.ts +13 -2
|
@@ -0,0 +1,50 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports.default = void 0;
|
|
7
|
+
|
|
8
|
+
var _react = _interopRequireDefault(require("react"));
|
|
9
|
+
|
|
10
|
+
var _reactNative = require("react-native");
|
|
11
|
+
|
|
12
|
+
var _utilities = require("../../utilities");
|
|
13
|
+
|
|
14
|
+
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
15
|
+
|
|
16
|
+
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); }
|
|
17
|
+
|
|
18
|
+
const TableCell = _ref => {
|
|
19
|
+
let {
|
|
20
|
+
children,
|
|
21
|
+
style,
|
|
22
|
+
numeric,
|
|
23
|
+
value,
|
|
24
|
+
...rest
|
|
25
|
+
} = _ref;
|
|
26
|
+
const {
|
|
27
|
+
textStyles,
|
|
28
|
+
viewStyles
|
|
29
|
+
} = (0, _utilities.extractStyles)(style);
|
|
30
|
+
return /*#__PURE__*/_react.default.createElement(_reactNative.View, _extends({}, rest, {
|
|
31
|
+
style: [styles.wrapper, numeric && styles.right, viewStyles]
|
|
32
|
+
}), /*#__PURE__*/_react.default.createElement(_reactNative.Text, {
|
|
33
|
+
numberOfLines: 1,
|
|
34
|
+
style: textStyles
|
|
35
|
+
}, children, value));
|
|
36
|
+
};
|
|
37
|
+
|
|
38
|
+
const styles = _reactNative.StyleSheet.create({
|
|
39
|
+
wrapper: {
|
|
40
|
+
flex: 1,
|
|
41
|
+
display: "flex",
|
|
42
|
+
flexDirection: "row"
|
|
43
|
+
},
|
|
44
|
+
right: {
|
|
45
|
+
justifyContent: "flex-end"
|
|
46
|
+
}
|
|
47
|
+
});
|
|
48
|
+
|
|
49
|
+
var _default = TableCell;
|
|
50
|
+
exports.default = _default;
|
|
@@ -0,0 +1,41 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports.default = void 0;
|
|
7
|
+
|
|
8
|
+
var _react = _interopRequireDefault(require("react"));
|
|
9
|
+
|
|
10
|
+
var _reactNative = require("react-native");
|
|
11
|
+
|
|
12
|
+
var _theming = require("../../theming");
|
|
13
|
+
|
|
14
|
+
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
15
|
+
|
|
16
|
+
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); }
|
|
17
|
+
|
|
18
|
+
const TableHeader = _ref => {
|
|
19
|
+
let {
|
|
20
|
+
children,
|
|
21
|
+
style,
|
|
22
|
+
theme,
|
|
23
|
+
...rest
|
|
24
|
+
} = _ref;
|
|
25
|
+
return /*#__PURE__*/_react.default.createElement(_reactNative.View, _extends({}, rest, {
|
|
26
|
+
style: [styles.wrapper, {
|
|
27
|
+
borderBottomColor: theme.colors.medium
|
|
28
|
+
}, style]
|
|
29
|
+
}), children);
|
|
30
|
+
};
|
|
31
|
+
|
|
32
|
+
const styles = _reactNative.StyleSheet.create({
|
|
33
|
+
wrapper: {
|
|
34
|
+
display: "flex",
|
|
35
|
+
flexDirection: "row"
|
|
36
|
+
}
|
|
37
|
+
});
|
|
38
|
+
|
|
39
|
+
var _default = (0, _theming.withTheme)(TableHeader);
|
|
40
|
+
|
|
41
|
+
exports.default = _default;
|
|
@@ -0,0 +1,17 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports.default = void 0;
|
|
7
|
+
|
|
8
|
+
var _react = _interopRequireDefault(require("react"));
|
|
9
|
+
|
|
10
|
+
var _reactNative = require("react-native");
|
|
11
|
+
|
|
12
|
+
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
13
|
+
|
|
14
|
+
const TablePaginator = () => /*#__PURE__*/_react.default.createElement(_reactNative.View, null, /*#__PURE__*/_react.default.createElement(_reactNative.Text, null, "Table Paginator"));
|
|
15
|
+
|
|
16
|
+
var _default = TablePaginator;
|
|
17
|
+
exports.default = _default;
|
|
@@ -0,0 +1,47 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports.default = void 0;
|
|
7
|
+
|
|
8
|
+
var _react = _interopRequireDefault(require("react"));
|
|
9
|
+
|
|
10
|
+
var _reactNative = require("react-native");
|
|
11
|
+
|
|
12
|
+
var _theming = require("../../theming");
|
|
13
|
+
|
|
14
|
+
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
15
|
+
|
|
16
|
+
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); }
|
|
17
|
+
|
|
18
|
+
const TableRow = _ref => {
|
|
19
|
+
let {
|
|
20
|
+
children,
|
|
21
|
+
style,
|
|
22
|
+
theme,
|
|
23
|
+
...rest
|
|
24
|
+
} = _ref;
|
|
25
|
+
return /*#__PURE__*/_react.default.createElement(_reactNative.View, _extends({}, rest, {
|
|
26
|
+
style: [styles.container, {
|
|
27
|
+
borderBottomColor: theme.colors.light
|
|
28
|
+
}, style]
|
|
29
|
+
}), /*#__PURE__*/_react.default.createElement(_reactNative.View, {
|
|
30
|
+
style: styles.content
|
|
31
|
+
}, children));
|
|
32
|
+
};
|
|
33
|
+
|
|
34
|
+
const styles = _reactNative.StyleSheet.create({
|
|
35
|
+
container: {
|
|
36
|
+
display: "flex",
|
|
37
|
+
flexDirection: "row"
|
|
38
|
+
},
|
|
39
|
+
content: {
|
|
40
|
+
flex: 1,
|
|
41
|
+
flexDirection: "row"
|
|
42
|
+
}
|
|
43
|
+
});
|
|
44
|
+
|
|
45
|
+
var _default = (0, _theming.withTheme)(TableRow);
|
|
46
|
+
|
|
47
|
+
exports.default = _default;
|
|
@@ -0,0 +1,60 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports.default = void 0;
|
|
7
|
+
|
|
8
|
+
var _react = _interopRequireDefault(require("react"));
|
|
9
|
+
|
|
10
|
+
var _reactNative = require("react-native");
|
|
11
|
+
|
|
12
|
+
var _utilities = require("../../utilities");
|
|
13
|
+
|
|
14
|
+
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
15
|
+
|
|
16
|
+
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); }
|
|
17
|
+
|
|
18
|
+
const TableTitle = _ref => {
|
|
19
|
+
let {
|
|
20
|
+
children,
|
|
21
|
+
style,
|
|
22
|
+
numeric = false,
|
|
23
|
+
isAscending = false,
|
|
24
|
+
numberOfLines = 1,
|
|
25
|
+
title,
|
|
26
|
+
...rest
|
|
27
|
+
} = _ref;
|
|
28
|
+
const {
|
|
29
|
+
textStyles,
|
|
30
|
+
viewStyles
|
|
31
|
+
} = (0, _utilities.extractStyles)(style);
|
|
32
|
+
return /*#__PURE__*/_react.default.createElement(_reactNative.View, _extends({}, rest, {
|
|
33
|
+
style: [styles.wrapper, numeric && styles.right, viewStyles]
|
|
34
|
+
}), /*#__PURE__*/_react.default.createElement(_reactNative.Text, {
|
|
35
|
+
style: [isAscending ? styles.sorted : {
|
|
36
|
+
color: "gray"
|
|
37
|
+
}, textStyles],
|
|
38
|
+
numberOfLines: numberOfLines
|
|
39
|
+
}, children, title));
|
|
40
|
+
};
|
|
41
|
+
|
|
42
|
+
const styles = _reactNative.StyleSheet.create({
|
|
43
|
+
wrapper: {
|
|
44
|
+
flex: 1,
|
|
45
|
+
display: "flex",
|
|
46
|
+
flexDirection: "row"
|
|
47
|
+
},
|
|
48
|
+
right: {
|
|
49
|
+
justifyContent: "flex-end"
|
|
50
|
+
},
|
|
51
|
+
sorted: {// marginLeft: 8,
|
|
52
|
+
},
|
|
53
|
+
icon: {
|
|
54
|
+
height: 24,
|
|
55
|
+
justifyContent: "center"
|
|
56
|
+
}
|
|
57
|
+
});
|
|
58
|
+
|
|
59
|
+
var _default = TableTitle;
|
|
60
|
+
exports.default = _default;
|
|
@@ -11,6 +11,8 @@ var _reactNative = require("react-native");
|
|
|
11
11
|
|
|
12
12
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
13
13
|
|
|
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
16
|
function Touchable(_ref) {
|
|
15
17
|
let {
|
|
16
18
|
children,
|
|
@@ -19,22 +21,6 @@ function Touchable(_ref) {
|
|
|
19
21
|
style,
|
|
20
22
|
...props
|
|
21
23
|
} = _ref;
|
|
22
|
-
return /*#__PURE__*/_react.default.createElement(_reactNative.Pressable, {
|
|
23
|
-
onPress: onPress,
|
|
24
|
-
disabled: disabled,
|
|
25
|
-
hitSlop: 8,
|
|
26
|
-
style: _ref2 => {
|
|
27
|
-
let {
|
|
28
|
-
pressed
|
|
29
|
-
} = _ref2;
|
|
30
|
-
return [{
|
|
31
|
-
opacity: pressed || disabled ? 0.75 : 1
|
|
32
|
-
}, style];
|
|
33
|
-
},
|
|
34
|
-
...props
|
|
35
|
-
}, children);
|
|
36
|
-
}rops
|
|
37
|
-
} = _ref;
|
|
38
24
|
return /*#__PURE__*/_react.default.createElement(_reactNative.Pressable, _extends({
|
|
39
25
|
onPress: onPress,
|
|
40
26
|
disabled: disabled,
|
|
@@ -16,4 +16,4 @@ const APPROX_STATUSBAR_HEIGHT = _reactNative.Platform.select({
|
|
|
16
16
|
ios: _reactNative.Platform.Version < 11 ? DEFAULT_STATUSBAR_HEIGHT_EXPO : 0
|
|
17
17
|
});
|
|
18
18
|
|
|
19
|
-
exports.APPROX_STATUSBAR_HEIGHT = APPROX_STATUSBAR_HEIGHT;
|
|
19
|
+
exports.APPROX_STATUSBAR_HEIGHT = APPROX_STATUSBAR_HEIGHT;
|
package/lib/commonjs/index.js
CHANGED
|
@@ -369,6 +369,42 @@ Object.defineProperty(exports, "SwitchRow", {
|
|
|
369
369
|
return _Switch.SwitchRow;
|
|
370
370
|
}
|
|
371
371
|
});
|
|
372
|
+
Object.defineProperty(exports, "Table", {
|
|
373
|
+
enumerable: true,
|
|
374
|
+
get: function () {
|
|
375
|
+
return _Table.Table;
|
|
376
|
+
}
|
|
377
|
+
});
|
|
378
|
+
Object.defineProperty(exports, "TableCell", {
|
|
379
|
+
enumerable: true,
|
|
380
|
+
get: function () {
|
|
381
|
+
return _Table.TableCell;
|
|
382
|
+
}
|
|
383
|
+
});
|
|
384
|
+
Object.defineProperty(exports, "TableHeader", {
|
|
385
|
+
enumerable: true,
|
|
386
|
+
get: function () {
|
|
387
|
+
return _Table.TableHeader;
|
|
388
|
+
}
|
|
389
|
+
});
|
|
390
|
+
Object.defineProperty(exports, "TablePaginator", {
|
|
391
|
+
enumerable: true,
|
|
392
|
+
get: function () {
|
|
393
|
+
return _Table.TablePaginator;
|
|
394
|
+
}
|
|
395
|
+
});
|
|
396
|
+
Object.defineProperty(exports, "TableRow", {
|
|
397
|
+
enumerable: true,
|
|
398
|
+
get: function () {
|
|
399
|
+
return _Table.TableRow;
|
|
400
|
+
}
|
|
401
|
+
});
|
|
402
|
+
Object.defineProperty(exports, "TableTitle", {
|
|
403
|
+
enumerable: true,
|
|
404
|
+
get: function () {
|
|
405
|
+
return _Table.TableTitle;
|
|
406
|
+
}
|
|
407
|
+
});
|
|
372
408
|
Object.defineProperty(exports, "TextField", {
|
|
373
409
|
enumerable: true,
|
|
374
410
|
get: function () {
|
|
@@ -476,6 +512,8 @@ var _Layout = require("./components/Layout");
|
|
|
476
512
|
|
|
477
513
|
var _index = require("./components/RadioButton/index");
|
|
478
514
|
|
|
515
|
+
var _Table = require("./components/Table");
|
|
516
|
+
|
|
479
517
|
var _DeprecatedButton = _interopRequireDefault(require("./components/DeprecatedButton"));
|
|
480
518
|
|
|
481
519
|
var _CardBlock = _interopRequireDefault(require("./components/CardBlock"));
|
|
@@ -16,7 +16,6 @@ const SEED_DATA = [{
|
|
|
16
16
|
preview_image_url: "{CLOUDINARY_URL}/Field_SearchBar_Full.png",
|
|
17
17
|
supports_list_render: false,
|
|
18
18
|
triggers: [_types.Triggers.OnChange],
|
|
19
|
-
// TODO Triggers.OnSubmit for multiple triggers
|
|
20
19
|
props: {
|
|
21
20
|
icon: {
|
|
22
21
|
group: _types.GROUPS.basic,
|
|
@@ -54,4 +53,7 @@ const SEED_DATA = [{
|
|
|
54
53
|
},
|
|
55
54
|
layout: {}
|
|
56
55
|
}];
|
|
56
|
+
exports.SEED_DATA = SEED_DATA;},
|
|
57
|
+
layout: {}
|
|
58
|
+
}];
|
|
57
59
|
exports.SEED_DATA = SEED_DATA;
|
|
@@ -0,0 +1,103 @@
|
|
|
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: "Table",
|
|
12
|
+
tag: "Table",
|
|
13
|
+
category: _types.COMPONENT_TYPES.container,
|
|
14
|
+
stylesPanelSections: [_types.StylesPanelSections.Background, _types.StylesPanelSections.Borders, _types.StylesPanelSections.Size, _types.StylesPanelSections.MarginsAndPaddings, _types.StylesPanelSections.Position, _types.StylesPanelSections.Effects],
|
|
15
|
+
layout: {
|
|
16
|
+
width: "100%"
|
|
17
|
+
},
|
|
18
|
+
props: {}
|
|
19
|
+
}, {
|
|
20
|
+
name: "Table Row",
|
|
21
|
+
tag: "TableRow",
|
|
22
|
+
category: _types.COMPONENT_TYPES.container,
|
|
23
|
+
stylesPanelSections: [_types.StylesPanelSections.Background, _types.StylesPanelSections.Borders, _types.StylesPanelSections.Size, _types.StylesPanelSections.MarginsAndPaddings, _types.StylesPanelSections.Position, _types.StylesPanelSections.Effects],
|
|
24
|
+
layout: {
|
|
25
|
+
paddingLeft: 16,
|
|
26
|
+
paddingRight: 16,
|
|
27
|
+
borderBottomWidth: 1,
|
|
28
|
+
borderStyle: "solid"
|
|
29
|
+
},
|
|
30
|
+
props: {}
|
|
31
|
+
}, {
|
|
32
|
+
name: "Table Cell",
|
|
33
|
+
tag: "TableCell",
|
|
34
|
+
category: _types.COMPONENT_TYPES.container,
|
|
35
|
+
layout: {
|
|
36
|
+
paddingTop: 16,
|
|
37
|
+
paddingBottom: 16,
|
|
38
|
+
paddingLeft: 8,
|
|
39
|
+
paddingRight: 8
|
|
40
|
+
},
|
|
41
|
+
stylesPanelSections: [_types.StylesPanelSections.Typography, _types.StylesPanelSections.Background, _types.StylesPanelSections.Borders, _types.StylesPanelSections.Size, _types.StylesPanelSections.MarginsAndPaddings, _types.StylesPanelSections.Position, _types.StylesPanelSections.Effects],
|
|
42
|
+
props: {
|
|
43
|
+
numeric: (0, _types.createBoolProp)({
|
|
44
|
+
label: "Is Numeric Cell?",
|
|
45
|
+
description: "Does the cell contain a numeric value?",
|
|
46
|
+
group: _types.GROUPS.data
|
|
47
|
+
}),
|
|
48
|
+
value: (0, _types.createTextProp)({
|
|
49
|
+
label: "Cell Value",
|
|
50
|
+
description: "Table Cell Value",
|
|
51
|
+
group: _types.GROUPS.data
|
|
52
|
+
})
|
|
53
|
+
}
|
|
54
|
+
}, {
|
|
55
|
+
name: "Table Header",
|
|
56
|
+
tag: "TableHeader",
|
|
57
|
+
category: _types.COMPONENT_TYPES.container,
|
|
58
|
+
stylesPanelSections: [_types.StylesPanelSections.Background, _types.StylesPanelSections.Borders, _types.StylesPanelSections.Size, _types.StylesPanelSections.MarginsAndPaddings, _types.StylesPanelSections.Position, _types.StylesPanelSections.Effects],
|
|
59
|
+
layout: {
|
|
60
|
+
paddingLeft: 16,
|
|
61
|
+
paddingRight: 16,
|
|
62
|
+
borderBottomWidth: 1,
|
|
63
|
+
borderStyle: "solid",
|
|
64
|
+
backgroundColor: "#EFEFEF"
|
|
65
|
+
},
|
|
66
|
+
props: {}
|
|
67
|
+
}, {
|
|
68
|
+
name: "Table Title",
|
|
69
|
+
tag: "TableTitle",
|
|
70
|
+
category: _types.COMPONENT_TYPES.container,
|
|
71
|
+
stylesPanelSections: [_types.StylesPanelSections.Typography, _types.StylesPanelSections.Background, _types.StylesPanelSections.Borders, _types.StylesPanelSections.Size, _types.StylesPanelSections.MarginsAndPaddings, _types.StylesPanelSections.Position, _types.StylesPanelSections.Effects],
|
|
72
|
+
layout: {
|
|
73
|
+
fontSize: 14,
|
|
74
|
+
fontWeight: "500",
|
|
75
|
+
paddingTop: 16,
|
|
76
|
+
paddingBottom: 16,
|
|
77
|
+
paddingLeft: 8,
|
|
78
|
+
paddingRight: 8
|
|
79
|
+
},
|
|
80
|
+
props: {
|
|
81
|
+
numeric: (0, _types.createBoolProp)({
|
|
82
|
+
label: "Is Numeric Cell?",
|
|
83
|
+
description: "Does the cell contain a numeric value?",
|
|
84
|
+
group: _types.GROUPS.data
|
|
85
|
+
}),
|
|
86
|
+
value: (0, _types.createTextProp)({
|
|
87
|
+
label: "Cell Value",
|
|
88
|
+
description: "Table Cell Value",
|
|
89
|
+
group: _types.GROUPS.data
|
|
90
|
+
}),
|
|
91
|
+
isAscending: (0, _types.createBoolProp)({
|
|
92
|
+
label: "Is Ascending?",
|
|
93
|
+
description: "Does the cell contain a numeric value?",
|
|
94
|
+
group: _types.GROUPS.data
|
|
95
|
+
}),
|
|
96
|
+
numberOfLines: (0, _types.createNumberProp)({
|
|
97
|
+
label: "Number of Lines",
|
|
98
|
+
description: "Number of Lines",
|
|
99
|
+
group: _types.GROUPS.basic
|
|
100
|
+
})
|
|
101
|
+
}
|
|
102
|
+
}];
|
|
103
|
+
exports.SEED_DATA = SEED_DATA;
|
|
@@ -0,0 +1,6 @@
|
|
|
1
|
+
export { default as Table } from "./table";
|
|
2
|
+
export { default as TableHeader } from "./tableHeader";
|
|
3
|
+
export { default as TablePaginator } from "./tablePaginator";
|
|
4
|
+
export { default as TableRow } from "./tableRow";
|
|
5
|
+
export { default as TableCell } from "./tableCell";
|
|
6
|
+
export { default as TableTitle } from "./tableTitle";
|
|
@@ -0,0 +1,23 @@
|
|
|
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
|
+
|
|
3
|
+
import React from "react";
|
|
4
|
+
import { View, StyleSheet } from "react-native";
|
|
5
|
+
|
|
6
|
+
const Table = _ref => {
|
|
7
|
+
let {
|
|
8
|
+
children,
|
|
9
|
+
style,
|
|
10
|
+
...rest
|
|
11
|
+
} = _ref;
|
|
12
|
+
return /*#__PURE__*/React.createElement(View, _extends({}, rest, {
|
|
13
|
+
style: [styles.wrapper, style]
|
|
14
|
+
}), children);
|
|
15
|
+
};
|
|
16
|
+
|
|
17
|
+
const styles = StyleSheet.create({
|
|
18
|
+
wrapper: {
|
|
19
|
+
display: "flex",
|
|
20
|
+
flexDirection: "column"
|
|
21
|
+
}
|
|
22
|
+
});
|
|
23
|
+
export default Table;
|
|
@@ -0,0 +1,37 @@
|
|
|
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
|
+
|
|
3
|
+
import React from "react";
|
|
4
|
+
import { View, Text, StyleSheet } from "react-native";
|
|
5
|
+
import { extractStyles } from "../../utilities";
|
|
6
|
+
|
|
7
|
+
const TableCell = _ref => {
|
|
8
|
+
let {
|
|
9
|
+
children,
|
|
10
|
+
style,
|
|
11
|
+
numeric,
|
|
12
|
+
value,
|
|
13
|
+
...rest
|
|
14
|
+
} = _ref;
|
|
15
|
+
const {
|
|
16
|
+
textStyles,
|
|
17
|
+
viewStyles
|
|
18
|
+
} = extractStyles(style);
|
|
19
|
+
return /*#__PURE__*/React.createElement(View, _extends({}, rest, {
|
|
20
|
+
style: [styles.wrapper, numeric && styles.right, viewStyles]
|
|
21
|
+
}), /*#__PURE__*/React.createElement(Text, {
|
|
22
|
+
numberOfLines: 1,
|
|
23
|
+
style: textStyles
|
|
24
|
+
}, children, value));
|
|
25
|
+
};
|
|
26
|
+
|
|
27
|
+
const styles = StyleSheet.create({
|
|
28
|
+
wrapper: {
|
|
29
|
+
flex: 1,
|
|
30
|
+
display: "flex",
|
|
31
|
+
flexDirection: "row"
|
|
32
|
+
},
|
|
33
|
+
right: {
|
|
34
|
+
justifyContent: "flex-end"
|
|
35
|
+
}
|
|
36
|
+
});
|
|
37
|
+
export default TableCell;
|
|
@@ -0,0 +1,27 @@
|
|
|
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
|
+
|
|
3
|
+
import React from "react";
|
|
4
|
+
import { View, StyleSheet } from "react-native";
|
|
5
|
+
import { withTheme } from "../../theming";
|
|
6
|
+
|
|
7
|
+
const TableHeader = _ref => {
|
|
8
|
+
let {
|
|
9
|
+
children,
|
|
10
|
+
style,
|
|
11
|
+
theme,
|
|
12
|
+
...rest
|
|
13
|
+
} = _ref;
|
|
14
|
+
return /*#__PURE__*/React.createElement(View, _extends({}, rest, {
|
|
15
|
+
style: [styles.wrapper, {
|
|
16
|
+
borderBottomColor: theme.colors.medium
|
|
17
|
+
}, style]
|
|
18
|
+
}), children);
|
|
19
|
+
};
|
|
20
|
+
|
|
21
|
+
const styles = StyleSheet.create({
|
|
22
|
+
wrapper: {
|
|
23
|
+
display: "flex",
|
|
24
|
+
flexDirection: "row"
|
|
25
|
+
}
|
|
26
|
+
});
|
|
27
|
+
export default withTheme(TableHeader);
|
|
@@ -0,0 +1,33 @@
|
|
|
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
|
+
|
|
3
|
+
import React from "react";
|
|
4
|
+
import { View, StyleSheet } from "react-native";
|
|
5
|
+
import { withTheme } from "../../theming";
|
|
6
|
+
|
|
7
|
+
const TableRow = _ref => {
|
|
8
|
+
let {
|
|
9
|
+
children,
|
|
10
|
+
style,
|
|
11
|
+
theme,
|
|
12
|
+
...rest
|
|
13
|
+
} = _ref;
|
|
14
|
+
return /*#__PURE__*/React.createElement(View, _extends({}, rest, {
|
|
15
|
+
style: [styles.container, {
|
|
16
|
+
borderBottomColor: theme.colors.light
|
|
17
|
+
}, style]
|
|
18
|
+
}), /*#__PURE__*/React.createElement(View, {
|
|
19
|
+
style: styles.content
|
|
20
|
+
}, children));
|
|
21
|
+
};
|
|
22
|
+
|
|
23
|
+
const styles = StyleSheet.create({
|
|
24
|
+
container: {
|
|
25
|
+
display: "flex",
|
|
26
|
+
flexDirection: "row"
|
|
27
|
+
},
|
|
28
|
+
content: {
|
|
29
|
+
flex: 1,
|
|
30
|
+
flexDirection: "row"
|
|
31
|
+
}
|
|
32
|
+
});
|
|
33
|
+
export default withTheme(TableRow);
|
|
@@ -0,0 +1,47 @@
|
|
|
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
|
+
|
|
3
|
+
import React from "react";
|
|
4
|
+
import { View, Text, StyleSheet } from "react-native";
|
|
5
|
+
import { extractStyles } from "../../utilities";
|
|
6
|
+
|
|
7
|
+
const TableTitle = _ref => {
|
|
8
|
+
let {
|
|
9
|
+
children,
|
|
10
|
+
style,
|
|
11
|
+
numeric = false,
|
|
12
|
+
isAscending = false,
|
|
13
|
+
numberOfLines = 1,
|
|
14
|
+
title,
|
|
15
|
+
...rest
|
|
16
|
+
} = _ref;
|
|
17
|
+
const {
|
|
18
|
+
textStyles,
|
|
19
|
+
viewStyles
|
|
20
|
+
} = extractStyles(style);
|
|
21
|
+
return /*#__PURE__*/React.createElement(View, _extends({}, rest, {
|
|
22
|
+
style: [styles.wrapper, numeric && styles.right, viewStyles]
|
|
23
|
+
}), /*#__PURE__*/React.createElement(Text, {
|
|
24
|
+
style: [isAscending ? styles.sorted : {
|
|
25
|
+
color: "gray"
|
|
26
|
+
}, textStyles],
|
|
27
|
+
numberOfLines: numberOfLines
|
|
28
|
+
}, children, title));
|
|
29
|
+
};
|
|
30
|
+
|
|
31
|
+
const styles = StyleSheet.create({
|
|
32
|
+
wrapper: {
|
|
33
|
+
flex: 1,
|
|
34
|
+
display: "flex",
|
|
35
|
+
flexDirection: "row"
|
|
36
|
+
},
|
|
37
|
+
right: {
|
|
38
|
+
justifyContent: "flex-end"
|
|
39
|
+
},
|
|
40
|
+
sorted: {// marginLeft: 8,
|
|
41
|
+
},
|
|
42
|
+
icon: {
|
|
43
|
+
height: 24,
|
|
44
|
+
justifyContent: "center"
|
|
45
|
+
}
|
|
46
|
+
});
|
|
47
|
+
export default TableTitle;
|
package/lib/module/index.js
CHANGED
|
@@ -31,6 +31,7 @@ export { ActionSheet, ActionSheetItem, ActionSheetCancel } from "./components/Ac
|
|
|
31
31
|
export { Swiper, SwiperItem } from "./components/Swiper";
|
|
32
32
|
export { Center, Circle, Square, Row, Stack, Spacer } from "./components/Layout";
|
|
33
33
|
export { RadioButton, RadioButtonGroup, RadioButtonRow, RadioButtonFieldGroup } from "./components/RadioButton/index";
|
|
34
|
+
export { Table, TableRow, TablePaginator, TableHeader, TableCell, TableTitle } from "./components/Table";
|
|
34
35
|
/* Deprecated: Fix or Delete! */
|
|
35
36
|
|
|
36
37
|
export { default as Button } from "./components/DeprecatedButton";
|