@draftbit/core 46.2.4-dedb7a.0 → 46.2.4-f941fc.0

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 (46) hide show
  1. package/lib/commonjs/components/Accordion/AccordionItem.js +25 -5
  2. package/lib/commonjs/components/DeprecatedButton.js +4 -22
  3. package/lib/commonjs/components/TabView/TabView.js +102 -0
  4. package/lib/commonjs/components/TabView/TabViewItem.js +26 -0
  5. package/lib/commonjs/components/TabView/index.js +23 -0
  6. package/lib/commonjs/index.js +14 -0
  7. package/lib/commonjs/mappings/NumberInput.js +149 -146
  8. package/lib/commonjs/mappings/TabView.js +79 -0
  9. package/lib/commonjs/mappings/TextArea.js +193 -188
  10. package/lib/commonjs/mappings/TextField.js +8 -3
  11. package/lib/commonjs/mappings/TextInput.js +180 -178
  12. package/lib/module/components/TabView/TabView.js +87 -0
  13. package/lib/module/components/TabView/TabViewItem.js +18 -0
  14. package/lib/module/components/TabView/index.js +2 -0
  15. package/lib/module/index.js +1 -0
  16. package/lib/module/mappings/NumberInput.js +149 -146
  17. package/lib/module/mappings/TabView.js +70 -0
  18. package/lib/module/mappings/TextArea.js +193 -188
  19. package/lib/module/mappings/TextField.js +8 -3
  20. package/lib/module/mappings/TextInput.js +180 -178
  21. package/lib/typescript/src/components/TabView/TabView.d.ts +19 -0
  22. package/lib/typescript/src/components/TabView/TabViewItem.d.ts +10 -0
  23. package/lib/typescript/src/components/TabView/index.d.ts +2 -0
  24. package/lib/typescript/src/index.d.ts +1 -0
  25. package/lib/typescript/src/mappings/TabView.d.ts +111 -0
  26. package/lib/typescript/src/mappings/TextArea.d.ts +42 -42
  27. package/lib/typescript/src/mappings/TextField.d.ts +118 -118
  28. package/package.json +4 -2
  29. package/src/components/TabView/TabView.js +34 -0
  30. package/src/components/TabView/TabView.tsx +97 -0
  31. package/src/components/TabView/TabViewItem.js +5 -0
  32. package/src/components/TabView/TabViewItem.tsx +21 -0
  33. package/src/components/TabView/index.js +2 -0
  34. package/src/components/TabView/index.ts +2 -0
  35. package/src/index.js +1 -0
  36. package/src/index.tsx +1 -0
  37. package/src/mappings/NumberInput.js +163 -160
  38. package/src/mappings/NumberInput.ts +168 -165
  39. package/src/mappings/TabView.js +73 -0
  40. package/src/mappings/TabView.ts +80 -0
  41. package/src/mappings/TextArea.js +220 -213
  42. package/src/mappings/TextArea.ts +227 -219
  43. package/src/mappings/TextField.js +9 -2
  44. package/src/mappings/TextField.ts +11 -3
  45. package/src/mappings/TextInput.js +208 -205
  46. package/src/mappings/TextInput.ts +215 -212
@@ -0,0 +1,73 @@
1
+ import { COMPONENT_TYPES, createTextProp, createTextEnumProp, createBoolProp, createColorProp, } from "@draftbit/types";
2
+ export const SEED_DATA = [
3
+ {
4
+ name: "TabView",
5
+ tag: "TabView",
6
+ category: COMPONENT_TYPES.container,
7
+ layout: {},
8
+ props: {
9
+ tabBarPosition: createTextEnumProp({
10
+ label: "Tab Bar Position",
11
+ description: "Tab Bar Position",
12
+ options: ["top", "bottom"],
13
+ defaultValue: "top",
14
+ }),
15
+ keyboardDismissMode: createTextEnumProp({
16
+ label: "Keyboard Dismiss Mode",
17
+ description: "Keyboard Dismiss Mode",
18
+ options: ["auto", "on-drag", "none"],
19
+ defaultValue: "auto",
20
+ }),
21
+ swipeEnabled: createBoolProp({
22
+ label: "Swipe Enabled",
23
+ description: "Swipe Enabled",
24
+ defaultValue: true,
25
+ }),
26
+ scrollEnabled: createBoolProp({
27
+ label: "Scroll Enabled",
28
+ description: "Scroll Enabled",
29
+ defaultValue: true,
30
+ }),
31
+ activeColor: createColorProp({
32
+ label: "Active Color",
33
+ description: "Active Color",
34
+ defaultValue: "primary",
35
+ }),
36
+ inactiveColor: createColorProp({
37
+ label: "Inactive Color",
38
+ description: "Inactive Color",
39
+ defaultValue: null,
40
+ }),
41
+ pressColor: createColorProp({
42
+ label: "Press Color",
43
+ description: "Press Color",
44
+ defaultValue: null,
45
+ }),
46
+ indicatorColor: createColorProp({
47
+ label: "Indicator Color",
48
+ description: "Indicator Color",
49
+ defaultValue: null,
50
+ }),
51
+ },
52
+ },
53
+ {
54
+ name: "TabViewItem",
55
+ tag: "TabViewItem",
56
+ category: COMPONENT_TYPES.container,
57
+ layout: {},
58
+ props: {
59
+ title: createTextProp({
60
+ label: "Title",
61
+ description: "Tab Title",
62
+ }),
63
+ id: createTextProp({
64
+ label: "Id",
65
+ description: "Tab Id",
66
+ }),
67
+ accessibilityLabel: createTextProp({
68
+ label: "Accessibility Label",
69
+ description: "Accessibility Label",
70
+ }),
71
+ },
72
+ },
73
+ ];
@@ -0,0 +1,80 @@
1
+ import {
2
+ COMPONENT_TYPES,
3
+ createTextProp,
4
+ createTextEnumProp,
5
+ createBoolProp,
6
+ createColorProp,
7
+ } from "@draftbit/types";
8
+
9
+ export const SEED_DATA = [
10
+ {
11
+ name: "TabView",
12
+ tag: "TabView",
13
+ category: COMPONENT_TYPES.container,
14
+ layout: {},
15
+ props: {
16
+ tabBarPosition: createTextEnumProp({
17
+ label: "Tab Bar Position",
18
+ description: "Tab Bar Position",
19
+ options: ["top", "bottom"],
20
+ defaultValue: "top",
21
+ }),
22
+ keyboardDismissMode: createTextEnumProp({
23
+ label: "Keyboard Dismiss Mode",
24
+ description: "Keyboard Dismiss Mode",
25
+ options: ["auto", "on-drag", "none"],
26
+ defaultValue: "auto",
27
+ }),
28
+ swipeEnabled: createBoolProp({
29
+ label: "Swipe Enabled",
30
+ description: "Swipe Enabled",
31
+ defaultValue: true,
32
+ }),
33
+ scrollEnabled: createBoolProp({
34
+ label: "Scroll Enabled",
35
+ description: "Scroll Enabled",
36
+ defaultValue: true,
37
+ }),
38
+ activeColor: createColorProp({
39
+ label: "Active Color",
40
+ description: "Active Color",
41
+ defaultValue: "primary",
42
+ }),
43
+ inactiveColor: createColorProp({
44
+ label: "Inactive Color",
45
+ description: "Inactive Color",
46
+ defaultValue: null,
47
+ }),
48
+ pressColor: createColorProp({
49
+ label: "Press Color",
50
+ description: "Press Color",
51
+ defaultValue: null,
52
+ }),
53
+ indicatorColor: createColorProp({
54
+ label: "Indicator Color",
55
+ description: "Indicator Color",
56
+ defaultValue: null,
57
+ }),
58
+ },
59
+ },
60
+ {
61
+ name: "TabViewItem",
62
+ tag: "TabViewItem",
63
+ category: COMPONENT_TYPES.container,
64
+ layout: {},
65
+ props: {
66
+ title: createTextProp({
67
+ label: "Title",
68
+ description: "Tab Title",
69
+ }),
70
+ id: createTextProp({
71
+ label: "Id",
72
+ description: "Tab Id",
73
+ }),
74
+ accessibilityLabel: createTextProp({
75
+ label: "Accessibility Label",
76
+ description: "Accessibility Label",
77
+ }),
78
+ },
79
+ },
80
+ ];
@@ -1,4 +1,222 @@
1
1
  import { GROUPS, COMPONENT_TYPES, FORM_TYPES, PROP_TYPES, FIELD_NAME, Triggers, } from "@draftbit/types";
2
+ const TEXT_AREA_PROPS = {
3
+ allowFontScaling: {
4
+ group: GROUPS.advanced,
5
+ label: "Allow Font Scaling",
6
+ description: "Whether fonts should scale to respect Text Size in the user's accessibility settings. (Default: true)",
7
+ editable: true,
8
+ required: false,
9
+ defaultValue: null,
10
+ formType: FORM_TYPES.boolean,
11
+ propType: PROP_TYPES.BOOLEAN,
12
+ },
13
+ autoCapitalize: {
14
+ group: GROUPS.advanced,
15
+ label: "Auto Capitalize",
16
+ description: "Can automatically capitalize sentences, words, and characters (Default: none).",
17
+ editable: true,
18
+ required: false,
19
+ defaultValue: null,
20
+ options: ["none", "sentences", "words", "characters"],
21
+ formType: FORM_TYPES.flatArray,
22
+ propType: PROP_TYPES.STRING,
23
+ },
24
+ autoCorrect: {
25
+ group: GROUPS.advanced,
26
+ label: "Auto Correct",
27
+ description: "Enables auto correction",
28
+ editable: true,
29
+ required: false,
30
+ defaultValue: null,
31
+ formType: FORM_TYPES.boolean,
32
+ propType: PROP_TYPES.BOOLEAN,
33
+ },
34
+ autoFocus: {
35
+ group: GROUPS.basic,
36
+ label: "Auto Focus",
37
+ description: "Focuses the input on load in and brings up the keyboard",
38
+ editable: true,
39
+ required: false,
40
+ defaultValue: null,
41
+ formType: FORM_TYPES.boolean,
42
+ propType: PROP_TYPES.BOOLEAN,
43
+ },
44
+ caretHidden: {
45
+ group: GROUPS.advanced,
46
+ label: "Hide Caret",
47
+ description: "Hides the caret(the line small line underneath each showing where you're editing/typing",
48
+ editable: true,
49
+ required: false,
50
+ defaultValue: null,
51
+ formType: FORM_TYPES.boolean,
52
+ propType: PROP_TYPES.BOOLEAN,
53
+ },
54
+ contextMenuHidden: {
55
+ group: GROUPS.advanced,
56
+ label: "Hide Context Menu",
57
+ description: "Hides the system context menu (Default: false)",
58
+ editable: true,
59
+ required: false,
60
+ defaultValue: null,
61
+ formType: FORM_TYPES.boolean,
62
+ propType: PROP_TYPES.BOOLEAN,
63
+ },
64
+ editable: {
65
+ group: GROUPS.advanced,
66
+ label: "Editable",
67
+ description: "If false, the text is not editable",
68
+ editable: true,
69
+ required: false,
70
+ defaultValue: true,
71
+ formType: FORM_TYPES.boolean,
72
+ propType: PROP_TYPES.BOOLEAN,
73
+ },
74
+ keyboardAppearance: {
75
+ group: GROUPS.advanced,
76
+ label: "Keyboard Appearance",
77
+ description: "Determines the color of the keyboard.(iOS Only)",
78
+ editable: true,
79
+ required: false,
80
+ defaultValue: null,
81
+ options: ["default", "light", "dark"],
82
+ formType: FORM_TYPES.flatArray,
83
+ propType: PROP_TYPES.STRING,
84
+ },
85
+ keyboardType: {
86
+ group: GROUPS.advanced,
87
+ label: "Keyboard Type",
88
+ description: "Determines what keyboard is given to the user.",
89
+ editable: true,
90
+ required: false,
91
+ defaultValue: null,
92
+ options: [
93
+ "default",
94
+ "email-address",
95
+ "numeric",
96
+ "phone-pad",
97
+ "ascii-capable",
98
+ "numbers-and-punctuation",
99
+ "url",
100
+ "number-pad",
101
+ "name-phone-pad",
102
+ "decimal-pad",
103
+ "twitter",
104
+ "web-search",
105
+ "visible-password",
106
+ ],
107
+ formType: FORM_TYPES.flatArray,
108
+ propType: PROP_TYPES.STRING,
109
+ },
110
+ maxLength: {
111
+ group: GROUPS.basic,
112
+ label: "Max Length",
113
+ description: "Limits the input to a set number of characters.",
114
+ editable: true,
115
+ required: false,
116
+ defaultValue: null,
117
+ min: 0,
118
+ step: 1,
119
+ precision: 0,
120
+ formType: FORM_TYPES.number,
121
+ propType: PROP_TYPES.NUMBER,
122
+ },
123
+ placeholder: {
124
+ group: GROUPS.data,
125
+ label: "Placeholder Text",
126
+ description: "The text that is shown on load when no value is available.",
127
+ editable: true,
128
+ required: false,
129
+ defaultValue: "Enter a value...",
130
+ formType: FORM_TYPES.string,
131
+ propType: PROP_TYPES.STRING,
132
+ },
133
+ placeholderTextColor: {
134
+ group: GROUPS.basic,
135
+ label: "Placeholder Text Color",
136
+ description: "The color of the placeholder text.",
137
+ editable: true,
138
+ required: false,
139
+ defaultValue: null,
140
+ formType: FORM_TYPES.color,
141
+ propType: PROP_TYPES.STRING,
142
+ },
143
+ returnKeyLabel: {
144
+ group: GROUPS.advanced,
145
+ label: "Return Key Label",
146
+ description: "(Android Only) Sets the label on the return key (use this instead of rewturnKeyType)",
147
+ editable: true,
148
+ required: false,
149
+ defaultValue: null,
150
+ formType: FORM_TYPES.string,
151
+ propType: PROP_TYPES.STRING,
152
+ },
153
+ returnKeyType: {
154
+ group: GROUPS.advanced,
155
+ label: "Return Key Type",
156
+ description: "Determines how the return key should look like",
157
+ editable: true,
158
+ required: false,
159
+ defaultValue: null,
160
+ options: [
161
+ "done",
162
+ "go",
163
+ "next",
164
+ "search",
165
+ "send",
166
+ "none",
167
+ "previous",
168
+ "default",
169
+ "emergency-call",
170
+ "google",
171
+ "join",
172
+ "route",
173
+ "yahoo",
174
+ ],
175
+ formType: FORM_TYPES.flatArray,
176
+ propType: PROP_TYPES.STRING,
177
+ },
178
+ secureTextEntry: {
179
+ group: GROUPS.basic,
180
+ label: "Password Input?",
181
+ description: "Hides the characters with a *, useful for passwords and other sensitive information.",
182
+ editable: true,
183
+ required: false,
184
+ defaultValue: null,
185
+ formType: FORM_TYPES.boolean,
186
+ propType: PROP_TYPES.BOOLEAN,
187
+ },
188
+ selectionColor: {
189
+ group: GROUPS.advanced,
190
+ label: "Selection Color",
191
+ description: "Color of the highlighted portion when selecting.",
192
+ editable: true,
193
+ required: false,
194
+ defaultValue: null,
195
+ formType: FORM_TYPES.color,
196
+ propType: PROP_TYPES.STRING,
197
+ },
198
+ selectTextOnFocus: {
199
+ group: GROUPS.advanced,
200
+ label: "Select Text on Focus",
201
+ description: "If true, all the text will automatically be selected on focus",
202
+ editable: true,
203
+ required: false,
204
+ defaultValue: null,
205
+ formType: FORM_TYPES.boolean,
206
+ propType: PROP_TYPES.BOOLEAN,
207
+ },
208
+ textAlignVertical: {
209
+ group: GROUPS.advanced,
210
+ label: "Aligns text on the vertical axis",
211
+ description: "Move the text around in the given component.",
212
+ options: ["auto", "top", "bottom", "center"],
213
+ editable: true,
214
+ required: false,
215
+ defaultValue: "top",
216
+ formType: FORM_TYPES.flatArray,
217
+ propType: PROP_TYPES.STRING,
218
+ },
219
+ };
2
220
  export const SEED_DATA = {
3
221
  name: "Text Area",
4
222
  tag: "TextInput",
@@ -18,221 +236,10 @@ export const SEED_DATA = {
18
236
  },
19
237
  triggers: [Triggers.OnChangeText],
20
238
  props: {
21
- allowFontScaling: {
22
- group: GROUPS.advanced,
23
- label: "Allow Font Scaling",
24
- description: "Whether fonts should scale to respect Text Size in the user's accessibility settings. (Default: true)",
25
- editable: true,
26
- required: false,
27
- defaultValue: null,
28
- formType: FORM_TYPES.boolean,
29
- propType: PROP_TYPES.BOOLEAN,
30
- },
31
- autoCapitalize: {
32
- group: GROUPS.advanced,
33
- label: "Auto Capitalize",
34
- description: "Can automatically capitalize sentences, words, and characters (Default: none).",
35
- editable: true,
36
- required: false,
37
- defaultValue: null,
38
- options: ["none", "sentences", "words", "characters"],
39
- formType: FORM_TYPES.flatArray,
40
- propType: PROP_TYPES.STRING,
41
- },
42
- autoCorrect: {
43
- group: GROUPS.advanced,
44
- label: "Auto Correct",
45
- description: "Enables auto correction",
46
- editable: true,
47
- required: false,
48
- defaultValue: null,
49
- formType: FORM_TYPES.boolean,
50
- propType: PROP_TYPES.BOOLEAN,
51
- },
52
- autoFocus: {
53
- group: GROUPS.basic,
54
- label: "Auto Focus",
55
- description: "Focuses the input on load in and brings up the keyboard",
56
- editable: true,
57
- required: false,
58
- defaultValue: null,
59
- formType: FORM_TYPES.boolean,
60
- propType: PROP_TYPES.BOOLEAN,
61
- },
62
- caretHidden: {
63
- group: GROUPS.advanced,
64
- label: "Hide Caret",
65
- description: "Hides the caret(the line small line underneath each showing where you're editing/typing",
66
- editable: true,
67
- required: false,
68
- defaultValue: null,
69
- formType: FORM_TYPES.boolean,
70
- propType: PROP_TYPES.BOOLEAN,
71
- },
72
- contextMenuHidden: {
73
- group: GROUPS.advanced,
74
- label: "Hide Context Menu",
75
- description: "Hides the system context menu (Default: false)",
76
- editable: true,
77
- required: false,
78
- defaultValue: null,
79
- formType: FORM_TYPES.boolean,
80
- propType: PROP_TYPES.BOOLEAN,
81
- },
82
- editable: {
83
- group: GROUPS.advanced,
84
- label: "Editable",
85
- description: "If false, the text is not editable",
86
- editable: true,
87
- required: false,
88
- defaultValue: true,
89
- formType: FORM_TYPES.boolean,
90
- propType: PROP_TYPES.BOOLEAN,
91
- },
92
- keyboardAppearance: {
93
- group: GROUPS.advanced,
94
- label: "Keyboard Appearance",
95
- description: "Determines the color of the keyboard.(iOS Only)",
96
- editable: true,
97
- required: false,
98
- defaultValue: null,
99
- options: ["default", "light", "dark"],
100
- formType: FORM_TYPES.flatArray,
101
- propType: PROP_TYPES.STRING,
102
- },
103
- keyboardType: {
104
- group: GROUPS.advanced,
105
- label: "Keyboard Type",
106
- description: "Determines what keyboard is given to the user.",
107
- editable: true,
108
- required: false,
109
- defaultValue: null,
110
- options: [
111
- "default",
112
- "email-address",
113
- "numeric",
114
- "phone-pad",
115
- "ascii-capable",
116
- "numbers-and-punctuation",
117
- "url",
118
- "number-pad",
119
- "name-phone-pad",
120
- "decimal-pad",
121
- "twitter",
122
- "web-search",
123
- "visible-password",
124
- ],
125
- formType: FORM_TYPES.flatArray,
126
- propType: PROP_TYPES.STRING,
127
- },
128
- maxLength: {
129
- group: GROUPS.basic,
130
- label: "Max Length",
131
- description: "Limits the input to a set number of characters.",
132
- editable: true,
133
- required: false,
134
- defaultValue: null,
135
- min: 0,
136
- step: 1,
137
- precision: 0,
138
- formType: FORM_TYPES.number,
139
- propType: PROP_TYPES.NUMBER,
140
- },
239
+ ...TEXT_AREA_PROPS,
141
240
  placeholder: {
142
- group: GROUPS.data,
143
- label: "Placeholder Text",
144
- description: "The text that is shown on load when no value is available.",
145
- editable: true,
146
- required: false,
241
+ ...TEXT_AREA_PROPS.placeholder,
147
242
  defaultValue: "Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s.",
148
- formType: FORM_TYPES.string,
149
- propType: PROP_TYPES.STRING,
150
- },
151
- placeholderTextColor: {
152
- group: GROUPS.basic,
153
- label: "Placeholder Text Color",
154
- description: "The color of the placeholder text.",
155
- editable: true,
156
- required: false,
157
- defaultValue: null,
158
- formType: FORM_TYPES.color,
159
- propType: PROP_TYPES.STRING,
160
- },
161
- returnKeyLabel: {
162
- group: GROUPS.advanced,
163
- label: "Return Key Label",
164
- description: "(Android Only) Sets the label on the return key (use this instead of rewturnKeyType)",
165
- editable: true,
166
- required: false,
167
- defaultValue: null,
168
- formType: FORM_TYPES.string,
169
- propType: PROP_TYPES.STRING,
170
- },
171
- returnKeyType: {
172
- group: GROUPS.advanced,
173
- label: "Return Key Type",
174
- description: "Determines how the return key should look like",
175
- editable: true,
176
- required: false,
177
- defaultValue: null,
178
- options: [
179
- "done",
180
- "go",
181
- "next",
182
- "search",
183
- "send",
184
- "none",
185
- "previous",
186
- "default",
187
- "emergency-call",
188
- "google",
189
- "join",
190
- "route",
191
- "yahoo",
192
- ],
193
- formType: FORM_TYPES.flatArray,
194
- propType: PROP_TYPES.STRING,
195
- },
196
- secureTextEntry: {
197
- group: GROUPS.basic,
198
- label: "Password Input?",
199
- description: "Hides the characters with a *, useful for passwords and other sensitive information.",
200
- editable: true,
201
- required: false,
202
- defaultValue: null,
203
- formType: FORM_TYPES.boolean,
204
- propType: PROP_TYPES.BOOLEAN,
205
- },
206
- selectionColor: {
207
- group: GROUPS.advanced,
208
- label: "Selection Color",
209
- description: "Color of the highlighted portion when selecting.",
210
- editable: true,
211
- required: false,
212
- defaultValue: null,
213
- formType: FORM_TYPES.color,
214
- propType: PROP_TYPES.STRING,
215
- },
216
- selectTextOnFocus: {
217
- group: GROUPS.advanced,
218
- label: "Select Text on Focus",
219
- description: "If true, all the text will automatically be selected on focus",
220
- editable: true,
221
- required: false,
222
- defaultValue: null,
223
- formType: FORM_TYPES.boolean,
224
- propType: PROP_TYPES.BOOLEAN,
225
- },
226
- textAlignVertical: {
227
- group: GROUPS.advanced,
228
- label: "Aligns text on the vertical axis",
229
- description: "Move the text around in the given component.",
230
- options: ["auto", "top", "bottom", "center"],
231
- editable: true,
232
- required: false,
233
- defaultValue: "top",
234
- formType: FORM_TYPES.flatArray,
235
- propType: PROP_TYPES.STRING,
236
243
  },
237
244
  multiline: {
238
245
  label: "Multiline",