@draftbit/core 46.10.3-106fd0.2 → 46.10.3-1ab4b6.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.
Files changed (56) hide show
  1. package/lib/commonjs/components/Checkbox/CheckboxGroup.js +17 -2
  2. package/lib/commonjs/components/Shadow.js +15 -2
  3. package/lib/commonjs/components/Table/Table.js +11 -10
  4. package/lib/commonjs/components/Table/TableCell.js +3 -3
  5. package/lib/commonjs/components/Table/TableCommon.js +30 -0
  6. package/lib/commonjs/components/Table/TableRow.js +4 -4
  7. package/lib/commonjs/components/Table/index.js +3 -27
  8. package/lib/commonjs/constants.js +1 -1
  9. package/lib/commonjs/mappings/Layout.js +85 -177
  10. package/lib/module/components/AspectRatio.js +1 -18
  11. package/lib/module/components/Checkbox/CheckboxGroup.js +2 -16
  12. package/lib/module/components/Checkbox/context.js +1 -1
  13. package/lib/module/components/CircleImage.js +1 -16
  14. package/lib/module/components/DeprecatedButton.js +3 -21
  15. package/lib/module/components/IconButton.js +4 -21
  16. package/lib/module/components/Pressable.js +2 -15
  17. package/lib/module/components/Shadow.js +2 -15
  18. package/lib/module/components/Table/Table.js +7 -7
  19. package/lib/module/components/Table/TableCell.js +1 -1
  20. package/lib/module/components/Table/TableCommon.js +21 -0
  21. package/lib/module/components/Table/TableRow.js +3 -2
  22. package/lib/module/components/Table/index.js +1 -22
  23. package/lib/module/components/ToggleButton.js +2 -16
  24. package/lib/module/constants.js +0 -1
  25. package/lib/module/mappings/Layout.js +86 -178
  26. package/lib/typescript/src/components/Table/Table.d.ts +7 -2
  27. package/lib/typescript/src/components/Table/Table.d.ts.map +1 -1
  28. package/lib/typescript/src/components/Table/TableCell.d.ts +1 -1
  29. package/lib/typescript/src/components/Table/TableCell.d.ts.map +1 -1
  30. package/lib/typescript/src/components/Table/TableCommon.d.ts +20 -0
  31. package/lib/typescript/src/components/Table/TableCommon.d.ts.map +1 -0
  32. package/lib/typescript/src/components/Table/TableRow.d.ts +1 -1
  33. package/lib/typescript/src/components/Table/TableRow.d.ts.map +1 -1
  34. package/lib/typescript/src/components/Table/index.d.ts +1 -19
  35. package/lib/typescript/src/components/Table/index.d.ts.map +1 -1
  36. package/lib/typescript/src/mappings/Layout.d.ts +72 -108
  37. package/lib/typescript/src/mappings/Layout.d.ts.map +1 -1
  38. package/package.json +3 -3
  39. package/src/components/Table/Table.js +4 -2
  40. package/src/components/Table/Table.tsx +9 -3
  41. package/src/components/Table/TableCell.js +1 -1
  42. package/src/components/Table/TableCell.tsx +5 -1
  43. package/src/components/Table/TableCommon.js +12 -0
  44. package/src/components/Table/TableCommon.ts +40 -0
  45. package/src/components/Table/TableRow.js +1 -1
  46. package/src/components/Table/TableRow.tsx +1 -1
  47. package/src/components/Table/index.js +1 -13
  48. package/src/components/Table/index.tsx +1 -42
  49. package/src/mappings/Layout.js +100 -176
  50. package/src/mappings/Layout.ts +116 -178
  51. package/lib/commonjs/mappings/NativeBase/Layout.js +0 -108
  52. package/lib/module/mappings/NativeBase/Layout.js +0 -101
  53. package/lib/typescript/src/mappings/NativeBase/Layout.d.ts +0 -133
  54. package/lib/typescript/src/mappings/NativeBase/Layout.d.ts.map +0 -1
  55. package/src/mappings/NativeBase/Layout.js +0 -124
  56. package/src/mappings/NativeBase/Layout.ts +0 -145
@@ -9,7 +9,6 @@ var _reactNative = require("react-native");
9
9
  var _context = require("./context");
10
10
  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); }
11
11
  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; }
12
- 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); }
13
12
  const {
14
13
  Provider
15
14
  } = _context.checkboxGroupContext;
@@ -31,7 +30,23 @@ const CheckboxGroup = _ref => {
31
30
  alignItems: "center"
32
31
  });
33
32
  }
34
- return /*#__PURE__*/React.createElement(_reactNative.View, _extends({
33
+ return /*#__PURE__*/React.createElement(_reactNative.View, {
34
+ style: [{
35
+ minHeight: 40
36
+ }, style],
37
+ ...rest
38
+ }, /*#__PURE__*/React.createElement(Provider, {
39
+ value: {
40
+ values,
41
+ onValueChange,
42
+ direction
43
+ }
44
+ }, /*#__PURE__*/React.createElement(_reactNative.View, {
45
+ style: _containerStyle
46
+ }, children)));
47
+ };
48
+ var _default = CheckboxGroup;
49
+ exports.default = _default;s({
35
50
  style: [{
36
51
  minHeight: 40
37
52
  }, style]
@@ -7,7 +7,6 @@ exports.default = void 0;
7
7
  var _react = _interopRequireDefault(require("react"));
8
8
  var _reactNativeShadow = require("react-native-shadow-2");
9
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
10
  const Shadow = _ref => {
12
11
  let {
13
12
  offsetX = 0,
@@ -24,7 +23,7 @@ const Shadow = _ref => {
24
23
  style,
25
24
  ...rest
26
25
  } = _ref;
27
- return /*#__PURE__*/_react.default.createElement(_reactNativeShadow.Shadow, _extends({
26
+ return /*#__PURE__*/_react.default.createElement(_reactNativeShadow.Shadow, {
28
27
  offset: [offsetX, offsetY],
29
28
  sides: {
30
29
  start: showShadowSideStart,
@@ -39,6 +38,20 @@ const Shadow = _ref => {
39
38
  bottomEnd: showShadowCornerBottomEnd
40
39
  },
41
40
  containerStyle: style,
41
+ paintInside: paintInside,
42
+ ...rest
43
+ });
44
+ };
45
+ var _default = Shadow;
46
+ exports.default = _default;showShadowSideBottom
47
+ },
48
+ corners: {
49
+ topStart: showShadowCornerTopStart,
50
+ topEnd: showShadowCornerTopEnd,
51
+ bottomStart: showShadowCornerBottomStart,
52
+ bottomEnd: showShadowCornerBottomEnd
53
+ },
54
+ containerStyle: style,
42
55
  paintInside: paintInside
43
56
  }, rest));
44
57
  };
@@ -3,15 +3,17 @@
3
3
  Object.defineProperty(exports, "__esModule", {
4
4
  value: true
5
5
  });
6
- exports.Table = void 0;
6
+ exports.default = void 0;
7
7
  var _react = _interopRequireDefault(require("react"));
8
8
  var _reactNative = require("react-native");
9
- var _index = require("./index");
9
+ var _theming = require("../../theming");
10
+ var _TableCommon = require("./TableCommon");
10
11
  function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
11
12
  const Table = _ref => {
12
13
  let {
14
+ theme,
13
15
  borderWidth = 1,
14
- borderColor = "rgba(200, 200, 200, 1)",
16
+ borderColor = theme.colors.divider,
15
17
  borderStyle = "solid",
16
18
  drawTopBorder = true,
17
19
  drawBottomBorder = false,
@@ -96,7 +98,7 @@ const Table = _ref => {
96
98
  cellHorizontalPadding,
97
99
  cellVerticalPadding
98
100
  };
99
- const borderViewStyle = (0, _index.generateBorderStyles)({
101
+ const borderViewStyle = (0, _TableCommon.generateBorderStyles)({
100
102
  borderColor,
101
103
  borderWidth,
102
104
  borderStyle,
@@ -105,18 +107,17 @@ const Table = _ref => {
105
107
  drawStartBorder,
106
108
  drawEndBorder
107
109
  });
108
- return /*#__PURE__*/_react.default.createElement(_index.TableStyleContext.Provider, {
110
+ return /*#__PURE__*/_react.default.createElement(_TableCommon.TableStyleContext.Provider, {
109
111
  value: contextValue
110
112
  }, /*#__PURE__*/_react.default.createElement(_reactNative.View, {
111
113
  style: [styles.container, borderViewStyle, style]
112
114
  }, /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, header), /*#__PURE__*/_react.default.createElement(_reactNative.ScrollView, rest, childrenWithoutHeader)));
113
115
  };
114
- exports.Table = Table;
115
116
  const styles = _reactNative.StyleSheet.create({
116
117
  container: {
117
118
  flex: 1
118
119
  }
119
- });ainer: {
120
- flex: 1
121
- }
122
- });
120
+ });
121
+ var _default = (0, _theming.withTheme)(Table);
122
+ exports.default = _default;
123
+ exports.default = _default;
@@ -6,7 +6,7 @@ Object.defineProperty(exports, "__esModule", {
6
6
  exports.default = void 0;
7
7
  var _react = _interopRequireDefault(require("react"));
8
8
  var _reactNative = require("react-native");
9
- var _index = require("./index");
9
+ var _TableCommon = require("./TableCommon");
10
10
  function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
11
11
  const TableCell = _ref => {
12
12
  let {
@@ -22,8 +22,8 @@ const TableCell = _ref => {
22
22
  children,
23
23
  style
24
24
  } = _ref;
25
- const parentContextValue = _react.default.useContext(_index.TableStyleContext);
26
- const borderViewStyle = (0, _index.generateBorderStyles)({
25
+ const parentContextValue = _react.default.useContext(_TableCommon.TableStyleContext);
26
+ const borderViewStyle = (0, _TableCommon.generateBorderStyles)({
27
27
  borderColor: borderColor || parentContextValue.borderColor,
28
28
  borderWidth: borderWidth || parentContextValue.borderWidth,
29
29
  borderStyle: borderStyle || parentContextValue.borderStyle,
@@ -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
+ }
@@ -6,7 +6,7 @@ Object.defineProperty(exports, "__esModule", {
6
6
  exports.default = void 0;
7
7
  var _react = _interopRequireDefault(require("react"));
8
8
  var _reactNative = require("react-native");
9
- var _index = require("./index");
9
+ var _TableCommon = require("./TableCommon");
10
10
  var _theming = require("../../theming");
11
11
  function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
12
12
  const TableRow = _ref => {
@@ -25,7 +25,7 @@ const TableRow = _ref => {
25
25
  style,
26
26
  theme
27
27
  } = _ref;
28
- const parentContextValue = _react.default.useContext(_index.TableStyleContext);
28
+ const parentContextValue = _react.default.useContext(_TableCommon.TableStyleContext);
29
29
 
30
30
  //Create context to use and pass to children based on own props or fall back to parent provided context
31
31
  const contextValue = {
@@ -35,7 +35,7 @@ const TableRow = _ref => {
35
35
  cellHorizontalPadding: cellHorizontalPadding || parentContextValue.cellHorizontalPadding,
36
36
  cellVerticalPadding: cellVerticalPadding || parentContextValue.cellVerticalPadding
37
37
  };
38
- const borderViewStyle = (0, _index.generateBorderStyles)({
38
+ const borderViewStyle = (0, _TableCommon.generateBorderStyles)({
39
39
  borderColor: contextValue.borderColor,
40
40
  borderWidth: contextValue.borderWidth,
41
41
  borderStyle: contextValue.borderStyle,
@@ -44,7 +44,7 @@ const TableRow = _ref => {
44
44
  drawStartBorder,
45
45
  drawEndBorder
46
46
  });
47
- return /*#__PURE__*/_react.default.createElement(_index.TableStyleContext.Provider, {
47
+ return /*#__PURE__*/_react.default.createElement(_TableCommon.TableStyleContext.Provider, {
48
48
  value: contextValue
49
49
  }, /*#__PURE__*/_react.default.createElement(_reactNative.View, {
50
50
  style: [borderViewStyle, isTableHeader ? {
@@ -6,7 +6,7 @@ Object.defineProperty(exports, "__esModule", {
6
6
  Object.defineProperty(exports, "Table", {
7
7
  enumerable: true,
8
8
  get: function () {
9
- return _Table.Table;
9
+ return _Table.default;
10
10
  }
11
11
  });
12
12
  Object.defineProperty(exports, "TableCell", {
@@ -21,31 +21,7 @@ Object.defineProperty(exports, "TableRow", {
21
21
  return _TableRow.default;
22
22
  }
23
23
  });
24
- exports.TableStyleContext = void 0;
25
- exports.generateBorderStyles = generateBorderStyles;
26
- var _react = _interopRequireDefault(require("react"));
27
- var _Table = require("./Table");
24
+ var _Table = _interopRequireDefault(require("./Table"));
28
25
  var _TableRow = _interopRequireDefault(require("./TableRow"));
29
26
  var _TableCell = _interopRequireDefault(require("./TableCell"));
30
- function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
31
- const TableStyleContext = /*#__PURE__*/_react.default.createContext({});
32
- exports.TableStyleContext = TableStyleContext;
33
- function generateBorderStyles(_ref) {
34
- let {
35
- borderColor,
36
- borderWidth,
37
- borderStyle,
38
- drawTopBorder,
39
- drawBottomBorder,
40
- drawStartBorder,
41
- drawEndBorder
42
- } = _ref;
43
- return {
44
- borderColor,
45
- borderStyle,
46
- borderTopWidth: drawTopBorder ? borderWidth : 0,
47
- borderBottomWidth: drawBottomBorder ? borderWidth : 0,
48
- borderStartWidth: drawStartBorder ? borderWidth : 0,
49
- borderEndWidth: drawEndBorder ? borderWidth : 0
50
- };
51
- }
27
+ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
@@ -12,4 +12,4 @@ const APPROX_STATUSBAR_HEIGHT = _reactNative.Platform.select({
12
12
  android: DEFAULT_STATUSBAR_HEIGHT_EXPO,
13
13
  ios: _reactNative.Platform.Version < 11 ? DEFAULT_STATUSBAR_HEIGHT_EXPO : 0
14
14
  });
15
- exports.APPROX_STATUSBAR_HEIGHT = APPROX_STATUSBAR_HEIGHT;
15
+ exports.APPROX_STATUSBAR_HEIGHT = APPROX_STATUSBAR_HEIGHT;AR_HEIGHT;
@@ -5,196 +5,104 @@ Object.defineProperty(exports, "__esModule", {
5
5
  });
6
6
  exports.SEED_DATA = void 0;
7
7
  var _types = require("@draftbit/types");
8
- const SEED_DATA = [{
9
- name: "Row",
10
- tag: "Row",
11
- category: _types.COMPONENT_TYPES.deprecated,
12
- stylesPanelSections: [_types.StylesPanelSections.NoStyles],
13
- props: {
14
- justifyContent: {
15
- label: "Align Horizontally",
16
- group: _types.GROUPS.style,
17
- description: "Align Items Horizontally (on the X Axis)",
18
- formType: _types.FORM_TYPES.string,
19
- propType: _types.PROP_TYPES.STRING,
20
- defaultValue: "flex-start",
21
- editable: true,
22
- required: false
23
- },
24
- alignItems: {
25
- label: "Align Vertically",
26
- group: _types.GROUPS.style,
27
- description: "Align Items Vertically (on the Y Axis)",
28
- formType: _types.FORM_TYPES.string,
29
- propType: _types.PROP_TYPES.STRING,
30
- defaultValue: "flex-start",
31
- editable: true,
32
- required: false
33
- }
34
- }
35
- }, {
36
- name: "Spacer",
37
- tag: "Spacer",
8
+ const SHARED_SEED_DATA = {
38
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,
39
19
  props: {
40
- top: {
41
- label: "Top",
42
- description: "Top",
43
- formType: _types.FORM_TYPES.number,
44
- propType: _types.PROP_TYPES.NUMBER,
45
- group: _types.GROUPS.style,
46
- defaultValue: 8,
47
- editable: true,
48
- required: false
49
- },
50
- right: {
51
- label: "Right",
52
- description: "Right",
53
- formType: _types.FORM_TYPES.number,
54
- propType: _types.PROP_TYPES.NUMBER,
55
- group: _types.GROUPS.style,
56
- defaultValue: 8,
57
- editable: true,
58
- required: false
59
- },
60
- bottom: {
61
- label: "Bottom",
62
- description: "Bottom",
63
- formType: _types.FORM_TYPES.number,
64
- propType: _types.PROP_TYPES.NUMBER,
65
- group: _types.GROUPS.style,
66
- defaultValue: 8,
67
- editable: true,
68
- required: false
69
- },
70
- left: {
71
- label: "Left",
72
- description: "Left",
73
- formType: _types.FORM_TYPES.number,
74
- propType: _types.PROP_TYPES.NUMBER,
75
- group: _types.GROUPS.style,
76
- defaultValue: 8,
77
- editable: true,
78
- required: false
79
- }
80
- }
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]
81
27
  }, {
82
- name: "Stack",
83
- tag: "Stack",
84
- category: _types.COMPONENT_TYPES.deprecated,
85
- stylesPanelSections: [_types.StylesPanelSections.NoStyles],
86
- props: {
87
- justifyContent: {
88
- group: _types.GROUPS.style,
89
- label: "Justify",
90
- description: "Justify horizontally",
91
- formType: _types.FORM_TYPES.string,
92
- propType: _types.PROP_TYPES.STRING,
93
- defaultValue: "flex-start",
94
- editable: true,
95
- required: false
96
- },
97
- alignItems: {
98
- group: _types.GROUPS.style,
99
- label: "Align",
100
- description: "Vertical align",
101
- formType: _types.FORM_TYPES.string,
102
- propType: _types.PROP_TYPES.STRING,
103
- defaultValue: "flex-start",
104
- editable: true,
105
- required: false
106
- }
107
- }
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
108
32
  }, {
109
33
  name: "Center",
110
34
  tag: "Center",
111
- category: _types.COMPONENT_TYPES.layout,
112
- stylesPanelSections: [_types.StylesPanelSections.NoStyles],
113
- props: {
114
- width: {
115
- label: "Width",
116
- description: "Width",
117
- formType: _types.FORM_TYPES.number,
118
- propType: _types.PROP_TYPES.NUMBER,
119
- group: _types.GROUPS.style,
120
- defaultValue: 240,
121
- editable: true,
122
- required: false
123
- },
124
- height: {
125
- label: "Height",
126
- description: "Height",
127
- formType: _types.FORM_TYPES.number,
128
- propType: _types.PROP_TYPES.NUMBER,
129
- group: _types.GROUPS.style,
130
- defaultValue: 200,
131
- editable: true,
132
- required: false
133
- },
134
- bgColor: {
135
- label: "Background Color",
136
- description: "Background color",
137
- formType: _types.FORM_TYPES.color,
138
- propType: _types.PROP_TYPES.THEME,
139
- editable: true,
140
- required: false,
141
- defaultValue: "light",
142
- group: _types.GROUPS.style
143
- }
144
- }
35
+ description: "Center aligns its contents to the center within itself",
36
+ ...SHARED_SEED_DATA,
37
+ stylesPanelSections: CONTAINER_COMPONENT_STYLES_WITHOUT_FLEX
145
38
  }, {
146
39
  name: "Circle",
147
40
  tag: "Circle",
148
- category: _types.COMPONENT_TYPES.layout,
149
- stylesPanelSections: [_types.StylesPanelSections.NoStyles],
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",
150
48
  props: {
151
- size: {
152
- label: "Size",
153
- description: "Size",
154
- formType: _types.FORM_TYPES.number,
155
- propType: _types.PROP_TYPES.NUMBER,
156
- group: _types.GROUPS.style,
157
- defaultValue: 50,
158
- editable: true,
159
- required: false
160
- },
161
- bgColor: {
162
- label: "Background Color",
163
- description: "Background color",
164
- formType: _types.FORM_TYPES.color,
165
- propType: _types.PROP_TYPES.THEME,
166
- editable: true,
167
- required: false,
168
- defaultValue: "light",
169
- group: _types.GROUPS.style
170
- }
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
+ })
171
95
  }
172
96
  }, {
173
- name: "Square",
174
- tag: "Square",
175
- category: _types.COMPONENT_TYPES.layout,
176
- stylesPanelSections: [_types.StylesPanelSections.NoStyles],
97
+ name: "ZStack",
98
+ tag: "ZStack",
99
+ description: "ZStack aligns items to the z-axis",
100
+ ...SHARED_SEED_DATA,
177
101
  props: {
178
- size: {
179
- label: "Size",
180
- description: "Size",
181
- formType: _types.FORM_TYPES.number,
182
- propType: _types.PROP_TYPES.NUMBER,
183
- group: _types.GROUPS.style,
184
- defaultValue: 50,
185
- editable: true,
186
- required: false
187
- },
188
- bgColor: {
189
- label: "Background Color",
190
- description: "Background color",
191
- formType: _types.FORM_TYPES.color,
192
- propType: _types.PROP_TYPES.THEME,
193
- editable: true,
194
- required: false,
195
- defaultValue: "light",
196
- group: _types.GROUPS.style
197
- }
102
+ reversed: (0, _types.createBoolProp)({
103
+ label: "Reversed",
104
+ description: "Determines whether to reverse the direction of items"
105
+ })
198
106
  }
199
107
  }];
200
108
  exports.SEED_DATA = SEED_DATA;
@@ -1,3 +1,4 @@
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); }
1
2
  import React from "react";
2
3
  import { View, StyleSheet } from "react-native";
3
4
  const AspectRatio = props => {
@@ -26,24 +27,6 @@ const AspectRatio = props => {
26
27
  });
27
28
  }
28
29
  }
29
- return /*#__PURE__*/React.createElement(View, {
30
- ...props,
31
- style: style,
32
- onLayout: _ref => {
33
- let {
34
- nativeEvent: {
35
- layout: l
36
- }
37
- } = _ref;
38
- return setLayout(l);
39
- }
40
- }, props.children);
41
- };
42
- export default AspectRatio;idth,
43
- height: width * (1 / aspectRatio)
44
- });
45
- }
46
- }
47
30
  return /*#__PURE__*/React.createElement(View, _extends({}, props, {
48
31
  style: style,
49
32
  onLayout: _ref => {
@@ -1,3 +1,4 @@
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); }
1
2
  import * as React from "react";
2
3
  import { View } from "react-native";
3
4
  import { checkboxGroupContext, Direction } from "./context";
@@ -22,22 +23,7 @@ const CheckboxGroup = _ref => {
22
23
  alignItems: "center"
23
24
  });
24
25
  }
25
- return /*#__PURE__*/React.createElement(View, {
26
- style: [{
27
- minHeight: 40
28
- }, style],
29
- ...rest
30
- }, /*#__PURE__*/React.createElement(Provider, {
31
- value: {
32
- values,
33
- onValueChange,
34
- direction
35
- }
36
- }, /*#__PURE__*/React.createElement(View, {
37
- style: _containerStyle
38
- }, children)));
39
- };
40
- export default CheckboxGroup;PURE__*/React.createElement(View, _extends({
26
+ return /*#__PURE__*/React.createElement(View, _extends({
41
27
  style: [{
42
28
  minHeight: 40
43
29
  }, style]
@@ -1,5 +1,5 @@
1
1
  import { createContext, useContext } from "react";
2
- export var Direction;
2
+ export let Direction;
3
3
  (function (Direction) {
4
4
  Direction["Horizontal"] = "horizontal";
5
5
  Direction["Vertical"] = "vertical";
@@ -1,3 +1,4 @@
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); }
1
2
  import * as React from "react";
2
3
  import { Image } from "react-native";
3
4
  import Config from "./Config";
@@ -9,22 +10,6 @@ const CircleImage = _ref => {
9
10
  ...props
10
11
  } = _ref;
11
12
  const borderRadius = size / 2;
12
- return /*#__PURE__*/React.createElement(Image, {
13
- style: [{
14
- width: size,
15
- height: size,
16
- borderRadius
17
- }, style],
18
- source: typeof source === "string" ? {
19
- uri: source
20
- } : source,
21
- resizeMode: "cover",
22
- ...props
23
- });
24
- };
25
- export default CircleImage;props
26
- } = _ref;
27
- const borderRadius = size / 2;
28
13
  return /*#__PURE__*/React.createElement(Image, _extends({
29
14
  style: [{
30
15
  width: size,