@draftbit/core 46.8.2-feb14e.2 → 46.8.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 (186) hide show
  1. package/lib/commonjs/components/Justification.js +1 -5
  2. package/lib/commonjs/components/ResizeMode.js +1 -5
  3. package/lib/module/components/Justification.js +0 -1
  4. package/lib/module/components/ResizeMode.js +0 -1
  5. package/package.json +4 -5
  6. package/lib/commonjs/mappings/HtmlElements.js +0 -175
  7. package/lib/module/mappings/HtmlElements.js +0 -168
  8. package/lib/typescript/src/mappings/HtmlElements.d.ts +0 -73
  9. package/lib/typescript/src/mappings/HtmlElements.d.ts.map +0 -1
  10. package/src/Provider.js +0 -9
  11. package/src/components/Accordion/AccordionGroup.js +0 -44
  12. package/src/components/Accordion/AccordionItem.js +0 -32
  13. package/src/components/Accordion/index.js +0 -2
  14. package/src/components/ActionSheet/ActionSheet.js +0 -45
  15. package/src/components/ActionSheet/ActionSheetCancel.js +0 -6
  16. package/src/components/ActionSheet/ActionSheetItem.js +0 -30
  17. package/src/components/ActionSheet/index.js +0 -3
  18. package/src/components/AnimatedCircularProgress.js +0 -43
  19. package/src/components/AspectRatio.js +0 -18
  20. package/src/components/AvatarEdit.js +0 -30
  21. package/src/components/Banner.js +0 -109
  22. package/src/components/Button.js +0 -114
  23. package/src/components/Card.js +0 -57
  24. package/src/components/Checkbox/Checkbox.js +0 -62
  25. package/src/components/Checkbox/CheckboxGroup.js +0 -21
  26. package/src/components/Checkbox/CheckboxGroupRow.js +0 -76
  27. package/src/components/Checkbox/CheckboxRow.js +0 -77
  28. package/src/components/Checkbox/context.js +0 -14
  29. package/src/components/Checkbox/index.js +0 -3
  30. package/src/components/CircleImage.js +0 -8
  31. package/src/components/CircularProgress.js +0 -81
  32. package/src/components/Config.js +0 -64
  33. package/src/components/Container.js +0 -43
  34. package/src/components/DatePicker/DatePicker.js +0 -382
  35. package/src/components/DatePicker/DatePickerComponent.js +0 -13
  36. package/src/components/DatePicker/DatePickerComponent.web.js +0 -30
  37. package/src/components/DatePicker/DatePickerComponentType.js +0 -1
  38. package/src/components/DeckSwiper/DeckSwiper.js +0 -65
  39. package/src/components/DeckSwiper/DeckSwiperCard.js +0 -21
  40. package/src/components/DeckSwiper/index.js +0 -2
  41. package/src/components/DeprecatedButton.js +0 -83
  42. package/src/components/DeprecatedCardWrapper.js +0 -18
  43. package/src/components/DeprecatedFAB.js +0 -114
  44. package/src/components/Divider.js +0 -13
  45. package/src/components/Elevation.js +0 -20
  46. package/src/components/FAB.js +0 -46
  47. package/src/components/FieldSearchBarFull.js +0 -53
  48. package/src/components/FormRow.js +0 -19
  49. package/src/components/IconButton.js +0 -35
  50. package/src/components/Image.js +0 -47
  51. package/src/components/Justification.js +0 -1
  52. package/src/components/Layout.js +0 -50
  53. package/src/components/NumberInput.js +0 -49
  54. package/src/components/Picker/Picker.js +0 -266
  55. package/src/components/Picker/PickerComponent.android.js +0 -69
  56. package/src/components/Picker/PickerComponent.ios.js +0 -79
  57. package/src/components/Picker/PickerComponent.web.js +0 -70
  58. package/src/components/Picker/PickerTypes.js +0 -1
  59. package/src/components/Portal/Portal.js +0 -35
  60. package/src/components/Portal/PortalConsumer.js +0 -27
  61. package/src/components/Portal/PortalHost.js +0 -107
  62. package/src/components/Portal/PortalManager.js +0 -32
  63. package/src/components/Pressable.js +0 -12
  64. package/src/components/ProgressBar.js +0 -118
  65. package/src/components/ProgressCircle.js +0 -13
  66. package/src/components/ProgressIndicator.js +0 -27
  67. package/src/components/RadioButton/RadioButton.js +0 -17
  68. package/src/components/RadioButton/RadioButtonFieldGroup.js +0 -17
  69. package/src/components/RadioButton/RadioButtonGroup.js +0 -43
  70. package/src/components/RadioButton/RadioButtonRow.js +0 -76
  71. package/src/components/RadioButton/context.js +0 -14
  72. package/src/components/RadioButton/index.js +0 -4
  73. package/src/components/ResizeMode.js +0 -1
  74. package/src/components/Row.js +0 -48
  75. package/src/components/RowBodyIcon.js +0 -8
  76. package/src/components/RowHeadlineImageCaption.js +0 -12
  77. package/src/components/RowHeadlineImageIcon.js +0 -14
  78. package/src/components/SVG.js +0 -13
  79. package/src/components/ScreenContainer.js +0 -35
  80. package/src/components/Slider.js +0 -63
  81. package/src/components/StarRating.js +0 -50
  82. package/src/components/StepIndicator.js +0 -346
  83. package/src/components/Stepper.js +0 -41
  84. package/src/components/Surface.js +0 -32
  85. package/src/components/Swiper/Swiper.js +0 -29
  86. package/src/components/Swiper/SwiperItem.js +0 -9
  87. package/src/components/Swiper/index.js +0 -2
  88. package/src/components/Switch.js +0 -56
  89. package/src/components/Text.js +0 -33
  90. package/src/components/TextField.js +0 -428
  91. package/src/components/ToggleButton.js +0 -39
  92. package/src/components/Touchable.js +0 -12
  93. package/src/components/Touchable.web.js +0 -2
  94. package/src/components/Typography.js +0 -36
  95. package/src/components/useAuthState.js +0 -31
  96. package/src/constants.js +0 -10
  97. package/src/hooks.js +0 -12
  98. package/src/index.js +0 -46
  99. package/src/interfaces/Icon.js +0 -8
  100. package/src/mappings/Accordion.js +0 -50
  101. package/src/mappings/AccordionItem.js +0 -17
  102. package/src/mappings/ActionSheet.js +0 -14
  103. package/src/mappings/ActionSheetCancel.js +0 -20
  104. package/src/mappings/ActionSheetItem.js +0 -24
  105. package/src/mappings/ActivityIndicator.js +0 -58
  106. package/src/mappings/AudioPlayer.js +0 -57
  107. package/src/mappings/AvatarEdit.js +0 -38
  108. package/src/mappings/Banner.js +0 -32
  109. package/src/mappings/BlurView.js +0 -42
  110. package/src/mappings/Button.js +0 -116
  111. package/src/mappings/Card.js +0 -52
  112. package/src/mappings/CardBlock.js +0 -123
  113. package/src/mappings/CardContainer.js +0 -104
  114. package/src/mappings/CardContainerRating.js +0 -126
  115. package/src/mappings/CardContainerShortImage.js +0 -120
  116. package/src/mappings/CardInline.js +0 -52
  117. package/src/mappings/Carousel.js +0 -19
  118. package/src/mappings/Checkbox.js +0 -46
  119. package/src/mappings/CheckboxGroup.js +0 -26
  120. package/src/mappings/CheckboxRow.js +0 -61
  121. package/src/mappings/CircleImage.js +0 -25
  122. package/src/mappings/Container.js +0 -30
  123. package/src/mappings/CustomCode.js +0 -8
  124. package/src/mappings/DatePicker.js +0 -182
  125. package/src/mappings/DeckSwiper.js +0 -48
  126. package/src/mappings/DeckSwiperCard.js +0 -16
  127. package/src/mappings/Divider.js +0 -27
  128. package/src/mappings/FAB.js +0 -37
  129. package/src/mappings/Fetch.js +0 -13
  130. package/src/mappings/FieldSearchBarFull.js +0 -50
  131. package/src/mappings/FlashList.js +0 -113
  132. package/src/mappings/FlatList.js +0 -51
  133. package/src/mappings/HeaderLarge.js +0 -29
  134. package/src/mappings/HeaderMedium.js +0 -55
  135. package/src/mappings/HeaderOverline.js +0 -55
  136. package/src/mappings/HtmlElements.js +0 -191
  137. package/src/mappings/HtmlElements.ts +0 -204
  138. package/src/mappings/Icon.js +0 -32
  139. package/src/mappings/IconButton.js +0 -33
  140. package/src/mappings/Image.js +0 -35
  141. package/src/mappings/ImageBackground.js +0 -29
  142. package/src/mappings/KeyboardAvoidingView.js +0 -41
  143. package/src/mappings/KeyboardAwareScrollView.js +0 -50
  144. package/src/mappings/Layout.js +0 -200
  145. package/src/mappings/LinearGradient.js +0 -82
  146. package/src/mappings/MapCallout.js +0 -22
  147. package/src/mappings/MapMarker.js +0 -48
  148. package/src/mappings/MapView.js +0 -142
  149. package/src/mappings/Modal.js +0 -42
  150. package/src/mappings/NumberInput.js +0 -254
  151. package/src/mappings/Picker.js +0 -153
  152. package/src/mappings/ProgressBar.js +0 -101
  153. package/src/mappings/ProgressCircle.js +0 -109
  154. package/src/mappings/ProgressIndicator.js +0 -181
  155. package/src/mappings/RadioButton.js +0 -51
  156. package/src/mappings/RadioButtonGroup.js +0 -17
  157. package/src/mappings/RadioButtonRow.js +0 -42
  158. package/src/mappings/RowBodyIcon.js +0 -75
  159. package/src/mappings/RowHeadlineImageCaption.js +0 -167
  160. package/src/mappings/RowHeadlineImageIcon.js +0 -99
  161. package/src/mappings/SVG.js +0 -20
  162. package/src/mappings/SafeAreaView.js +0 -33
  163. package/src/mappings/ScrollView.js +0 -37
  164. package/src/mappings/Slider.js +0 -60
  165. package/src/mappings/StarRating.js +0 -43
  166. package/src/mappings/Stepper.js +0 -32
  167. package/src/mappings/Surface.js +0 -14
  168. package/src/mappings/Swiper.js +0 -71
  169. package/src/mappings/SwiperItem.js +0 -9
  170. package/src/mappings/Switch.js +0 -81
  171. package/src/mappings/Text.js +0 -251
  172. package/src/mappings/TextArea.js +0 -283
  173. package/src/mappings/TextField.js +0 -400
  174. package/src/mappings/TextInput.js +0 -402
  175. package/src/mappings/ToggleButton.js +0 -50
  176. package/src/mappings/Touchable.js +0 -67
  177. package/src/mappings/Video.js +0 -81
  178. package/src/mappings/View.js +0 -207
  179. package/src/mappings/WebView.js +0 -88
  180. package/src/styles/DarkTheme.js +0 -26
  181. package/src/styles/DefaultTheme.js +0 -111
  182. package/src/styles/fonts.js +0 -62
  183. package/src/styles/overlay.js +0 -60
  184. package/src/styles/shadow.js +0 -51
  185. package/src/theming.js +0 -3
  186. package/src/utilities.js +0 -102
@@ -1,50 +0,0 @@
1
- import { COMPONENT_TYPES, createNumberProp, createIconProp, createTextProp, createStaticBoolProp, createColorProp, StylesPanelSections, } from "@draftbit/types";
2
- export const SEED_DATA = {
3
- name: "Accordion",
4
- tag: "AccordionGroup",
5
- description: "An expandable container containing components",
6
- category: COMPONENT_TYPES.container,
7
- stylesPanelSections: [
8
- StylesPanelSections.LayoutSelectedItem,
9
- StylesPanelSections.Background,
10
- StylesPanelSections.Size,
11
- StylesPanelSections.MarginsAndPaddings,
12
- StylesPanelSections.Position,
13
- StylesPanelSections.Borders,
14
- StylesPanelSections.Effects,
15
- ],
16
- layout: {
17
- paddingTop: 8,
18
- paddingRight: 8,
19
- paddingBottom: 8,
20
- paddingLeft: 8,
21
- fontSize: 16,
22
- },
23
- props: {
24
- label: createTextProp({
25
- label: "Label",
26
- }),
27
- expanded: createStaticBoolProp({
28
- label: "Expanded",
29
- description: "Whether the AccordionGroup should be initaially expanded or not",
30
- }),
31
- openColor: createColorProp({
32
- label: "Open text color",
33
- }),
34
- closedColor: createColorProp({
35
- label: "Closed text color",
36
- }),
37
- caretColor: createColorProp({
38
- label: "Caret color",
39
- }),
40
- caretSize: createNumberProp({
41
- label: "Caret size",
42
- defaultValue: 24,
43
- }),
44
- icon: createIconProp(),
45
- iconSize: createNumberProp({
46
- label: "Icon size",
47
- defaultValue: 24,
48
- }),
49
- },
50
- };
@@ -1,17 +0,0 @@
1
- import { COMPONENT_TYPES, createIconProp, createTextProp, createColorProp, CONTAINER_COMPONENT_STYLES_SECTIONS, } from "@draftbit/types";
2
- export const SEED_DATA = {
3
- name: "Accordion Item",
4
- tag: "AccordionItem",
5
- description: "Item to be used in Accordion",
6
- category: COMPONENT_TYPES.deprecated,
7
- stylesPanelSections: CONTAINER_COMPONENT_STYLES_SECTIONS,
8
- props: {
9
- icon: createIconProp(),
10
- label: createTextProp({
11
- label: "Item label",
12
- }),
13
- iconColor: createColorProp({
14
- label: "Icon color",
15
- }),
16
- },
17
- };
@@ -1,14 +0,0 @@
1
- import { COMPONENT_TYPES, createStaticBoolProp, GROUPS, StylesPanelSections, } from "@draftbit/types";
2
- export const SEED_DATA = {
3
- name: "Action Sheet",
4
- tag: "ActionSheet",
5
- description: "Action Sheet container",
6
- category: COMPONENT_TYPES.actionsheet,
7
- stylesPanelSections: [StylesPanelSections.Size, StylesPanelSections.Margins],
8
- props: {
9
- visible: createStaticBoolProp({
10
- group: GROUPS.data,
11
- label: "Show Action Sheet",
12
- }),
13
- },
14
- };
@@ -1,20 +0,0 @@
1
- import { COMPONENT_TYPES, createActionProp, createColorProp, createTextProp, GROUPS, Triggers, StylesPanelSections, } from "@draftbit/types";
2
- export const SEED_DATA = {
3
- name: "Action Sheet Cancel",
4
- tag: "ActionSheetCancel",
5
- description: "Action Sheet cancel",
6
- stylesPanelSections: [StylesPanelSections.Size, StylesPanelSections.Margins],
7
- category: COMPONENT_TYPES.actionsheet,
8
- triggers: [Triggers.OnPress],
9
- props: {
10
- onPress: createActionProp(),
11
- label: createTextProp({
12
- group: GROUPS.basic,
13
- label: "Label",
14
- defaultValue: "Cancel",
15
- }),
16
- color: createColorProp({
17
- label: "Font Color",
18
- }),
19
- },
20
- };
@@ -1,24 +0,0 @@
1
- import { COMPONENT_TYPES, createActionProp, createColorProp, createTextProp, GROUPS, Triggers, StylesPanelSections, } from "@draftbit/types";
2
- export const SEED_DATA = {
3
- name: "Action Sheet Item",
4
- tag: "ActionSheetItem",
5
- description: "Action Sheet item",
6
- category: COMPONENT_TYPES.actionsheet,
7
- stylesPanelSections: [StylesPanelSections.Size, StylesPanelSections.Margins],
8
- triggers: [Triggers.OnPress],
9
- layout: {
10
- textAlign: "center",
11
- },
12
- props: {
13
- onPress: createActionProp(),
14
- label: createTextProp({
15
- group: GROUPS.basic,
16
- label: "Label",
17
- defaultValue: "Option",
18
- }),
19
- color: createColorProp({
20
- label: "Font Color",
21
- defaultValue: "strong",
22
- }),
23
- },
24
- };
@@ -1,58 +0,0 @@
1
- import { COMPONENT_TYPES, FORM_TYPES, PROP_TYPES, GROUPS, StylesPanelSections, } from "@draftbit/types";
2
- export const SEED_DATA = {
3
- name: "Activity Indicator",
4
- tag: "ActivityIndicator",
5
- description: "Displays a circular loading indicator.",
6
- doc_link: "https://docs.expo.io/versions/latest/react-native/activityindicator/",
7
- code_link: "https://github.com/expo/expo/blob/master/ios/versioned-react-native/ABI32_0_0/Libraries/Components/ActivityIndicator/ActivityIndicator.js",
8
- category: COMPONENT_TYPES.utility,
9
- stylesPanelSections: [
10
- StylesPanelSections.Size,
11
- StylesPanelSections.Margins,
12
- StylesPanelSections.Borders,
13
- ],
14
- layout: { width: 36, height: 36 },
15
- props: {
16
- size: {
17
- label: "Size",
18
- description: "The size of the loading indicator (Default: small)",
19
- options: ["small", "large"],
20
- formType: FORM_TYPES.flatArray,
21
- propType: PROP_TYPES.STRING,
22
- editable: true,
23
- required: false,
24
- defaultValue: "small",
25
- group: GROUPS.basic,
26
- },
27
- animating: {
28
- label: "Spinning",
29
- description: "Whether to show the loading indicator (Default: true)",
30
- formType: FORM_TYPES.boolean,
31
- propType: PROP_TYPES.BOOLEAN,
32
- editable: true,
33
- required: false,
34
- defaultValue: true,
35
- group: GROUPS.basic,
36
- },
37
- hidesWhenStopped: {
38
- label: "Hide When Stopped",
39
- description: "Whether the indicator should hide when not animating (Default: true)",
40
- formType: FORM_TYPES.boolean,
41
- propType: PROP_TYPES.BOOLEAN,
42
- editable: true,
43
- required: false,
44
- defaultValue: true,
45
- group: GROUPS.basic,
46
- },
47
- color: {
48
- label: "Color",
49
- description: "The color of the loading indicator (Default: gray)",
50
- formType: FORM_TYPES.color,
51
- propType: PROP_TYPES.THEME,
52
- editable: true,
53
- required: false,
54
- defaultValue: null,
55
- group: GROUPS.basic,
56
- },
57
- },
58
- };
@@ -1,57 +0,0 @@
1
- import { GROUPS, COMPONENT_TYPES, FORM_TYPES, PROP_TYPES, StylesPanelSections, createColorProp, createNumberProp, } from "@draftbit/types";
2
- export const SEED_DATA = {
3
- name: "Audio Player",
4
- tag: "AudioPlayer",
5
- description: "Given a source URL, plays sounds & audio!",
6
- category: COMPONENT_TYPES.media,
7
- stylesPanelSections: [
8
- StylesPanelSections.Typography,
9
- StylesPanelSections.Background,
10
- StylesPanelSections.Borders,
11
- StylesPanelSections.Size,
12
- StylesPanelSections.MarginsAndPaddings,
13
- StylesPanelSections.Position,
14
- ],
15
- layout: {
16
- backgroundColor: "#eee",
17
- paddingLeft: 16,
18
- paddingRight: 16,
19
- paddingTop: 8,
20
- paddingBottom: 8,
21
- borderRadius: 24,
22
- flexDirection: "row",
23
- alignItems: "center",
24
- },
25
- props: {
26
- source: {
27
- group: GROUPS.data,
28
- label: "Source",
29
- description: "The source URL for the audio file.",
30
- editable: true,
31
- required: true,
32
- defaultValue: "https://static.draftbit.com/audio/intro-to-draftbit-audio.mp3",
33
- formType: FORM_TYPES.sourceUrl,
34
- propType: PROP_TYPES.OBJECT,
35
- },
36
- sliderColor: createColorProp({
37
- label: "Thumb Color",
38
- defaultValue: "strong",
39
- }),
40
- completedTrackColor: createColorProp({
41
- label: "Completed Track Color",
42
- defaultValue: "background",
43
- }),
44
- remainingTrackColor: createColorProp({
45
- label: "Remaining Track Color",
46
- defaultValue: "light",
47
- }),
48
- trackThumbSize: createNumberProp({
49
- label: "Thumb Size",
50
- defaultValue: 24,
51
- }),
52
- playIconColor: createColorProp({
53
- label: "Play Icon Color",
54
- defaultValue: "strong",
55
- }),
56
- },
57
- };
@@ -1,38 +0,0 @@
1
- import { GROUPS, COMPONENT_TYPES, FORM_TYPES, PROP_TYPES, BLOCK_STYLES_SECTIONS, } from "@draftbit/types";
2
- export const SEED_DATA = {
3
- name: "Avatar Edit",
4
- tag: "AvatarEdit",
5
- description: "An avatar with an edit icon in the top right",
6
- category: COMPONENT_TYPES.deprecated,
7
- stylesPanelSections: BLOCK_STYLES_SECTIONS,
8
- layout: {
9
- width: 64,
10
- height: 64,
11
- },
12
- props: {
13
- size: {
14
- group: GROUPS.basic,
15
- label: "Size",
16
- description: "Size of avatar / width, height",
17
- editable: true,
18
- required: false,
19
- formType: FORM_TYPES.number,
20
- propType: PROP_TYPES.NUMBER,
21
- min: 0,
22
- max: 300,
23
- precision: 0,
24
- step: 1,
25
- defaultValue: 80,
26
- },
27
- image: {
28
- group: GROUPS.data,
29
- label: "Image",
30
- description: "Name of the image",
31
- editable: true,
32
- required: true,
33
- formType: FORM_TYPES.image,
34
- propType: PROP_TYPES.ASSET,
35
- defaultValue: "brightness-5",
36
- },
37
- },
38
- };
@@ -1,32 +0,0 @@
1
- import { COMPONENT_TYPES, createIconProp, createBoolProp, createColorProp, createTextProp, GROUPS, } from "@draftbit/types";
2
- export const SEED_DATA = {
3
- name: "Banner",
4
- tag: "Banner",
5
- category: COMPONENT_TYPES.deprecated,
6
- props: {
7
- icon: createIconProp({
8
- defaultValue: null,
9
- required: false,
10
- }),
11
- content: createTextProp({
12
- label: "Content",
13
- description: "Banner text content",
14
- }),
15
- initiallyVisible: createBoolProp({
16
- group: GROUPS.basic,
17
- label: "Initially visible",
18
- description: "Whether the banner should be visible",
19
- defaultValue: true,
20
- }),
21
- dismissable: createBoolProp({
22
- group: GROUPS.basic,
23
- label: "Dismissable",
24
- description: "Whether the banner should be able to be closed",
25
- defaultValue: true,
26
- }),
27
- buttonColor: createColorProp({
28
- label: "Button color",
29
- defaultValue: "primary",
30
- }),
31
- },
32
- };
@@ -1,42 +0,0 @@
1
- import { COMPONENT_TYPES, FORM_TYPES, PROP_TYPES, GROUPS, CONTAINER_COMPONENT_STYLES_SECTIONS, } from "@draftbit/types";
2
- export const SEED_DATA = {
3
- name: "Blur View",
4
- tag: "BlurView",
5
- description: "Expo Blur View",
6
- doc_link: "https://docs.expo.io/versions/latest/sdk/blur-view/",
7
- code_link: "https://github.com/expo/expo/blob/master/packages/expo/src/effects/BlurView.d.ts",
8
- category: COMPONENT_TYPES.view,
9
- stylesPanelSections: CONTAINER_COMPONENT_STYLES_SECTIONS,
10
- layout: {
11
- flexGrow: 1,
12
- flexShrink: 1,
13
- flexBasis: 0,
14
- },
15
- props: {
16
- tint: {
17
- label: "Tint",
18
- description: "The tint of the blur view",
19
- editable: true,
20
- required: true,
21
- defaultValue: "default",
22
- formType: FORM_TYPES.flatArray,
23
- propType: PROP_TYPES.STRING,
24
- options: ["default", "light", "dark"],
25
- group: GROUPS.basic,
26
- },
27
- intensity: {
28
- label: "Intensity",
29
- description: "A number from 1 to 100 that controls the intensity of the blur effect",
30
- editable: true,
31
- required: true,
32
- defaultValue: 50,
33
- formType: FORM_TYPES.number,
34
- propType: PROP_TYPES.NUMBER,
35
- min: 0,
36
- max: 100,
37
- step: 1,
38
- precision: 0,
39
- group: GROUPS.basic,
40
- },
41
- },
42
- };
@@ -1,116 +0,0 @@
1
- import { COMPONENT_TYPES, createIconProp, createTextProp, createDisabledProp, createLoadingProp, createActionProp, Triggers, StylesPanelSections, createStaticNumberProp, } from "@draftbit/types";
2
- const SEED_DATA_TRIGGERS = [Triggers.OnPress, Triggers.OnLongPress];
3
- const SEED_DATA_PROPS = {
4
- onPress: createActionProp(),
5
- onLongPress: createActionProp(),
6
- icon: createIconProp({
7
- defaultValue: null,
8
- required: false,
9
- }),
10
- title: createTextProp({
11
- label: "Label",
12
- description: "Button Label",
13
- defaultValue: "Get Started",
14
- }),
15
- disabled: createDisabledProp(),
16
- loading: createLoadingProp(),
17
- activeOpacity: createStaticNumberProp({
18
- label: "Active Opacity",
19
- description: "Opacity of the button when active.",
20
- defaultValue: null,
21
- min: 0,
22
- max: 1,
23
- step: 0.01,
24
- precision: 2,
25
- required: false,
26
- }),
27
- disabledOpacity: createStaticNumberProp({
28
- label: "Disabled Opacity",
29
- description: "Opacity of the button when disabled.",
30
- defaultValue: null,
31
- min: 0,
32
- max: 1,
33
- step: 0.01,
34
- precision: 2,
35
- required: false,
36
- }),
37
- delayLongPress: createStaticNumberProp({
38
- label: "Delay Long Press",
39
- description: "Duration (in milliseconds) from onPressIn before onLongPress is called.",
40
- required: false,
41
- }),
42
- hitSlop: createStaticNumberProp({
43
- label: "Hit Slop",
44
- description: "Sets additional distance outside of element in which a press can be detected",
45
- required: false,
46
- }),
47
- };
48
- export const SEED_DATA = [
49
- {
50
- name: "Button Outline",
51
- tag: "ButtonOutline",
52
- category: COMPONENT_TYPES.deprecated,
53
- stylesPanelSections: [
54
- StylesPanelSections.Typography,
55
- StylesPanelSections.Background,
56
- StylesPanelSections.Borders,
57
- StylesPanelSections.Size,
58
- StylesPanelSections.MarginsAndPaddings,
59
- StylesPanelSections.Position,
60
- StylesPanelSections.Effects,
61
- ],
62
- layout: {
63
- borderRadius: 8,
64
- fontFamily: "system-700",
65
- backgroundColor: "transparent",
66
- borderWidth: 1,
67
- textAlign: "center",
68
- },
69
- triggers: SEED_DATA_TRIGGERS,
70
- props: SEED_DATA_PROPS,
71
- },
72
- {
73
- name: "Button Solid",
74
- tag: "ButtonSolid",
75
- category: COMPONENT_TYPES.deprecated,
76
- stylesPanelSections: [
77
- StylesPanelSections.Typography,
78
- StylesPanelSections.Background,
79
- StylesPanelSections.Borders,
80
- StylesPanelSections.Size,
81
- StylesPanelSections.MarginsAndPaddings,
82
- StylesPanelSections.Position,
83
- StylesPanelSections.Effects,
84
- ],
85
- layout: {
86
- borderRadius: 8,
87
- fontFamily: "system-700",
88
- backgroundColor: "primary",
89
- textAlign: "center",
90
- },
91
- triggers: SEED_DATA_TRIGGERS,
92
- props: SEED_DATA_PROPS,
93
- },
94
- {
95
- name: "Button",
96
- tag: "Button",
97
- category: COMPONENT_TYPES.button,
98
- stylesPanelSections: [
99
- StylesPanelSections.Typography,
100
- StylesPanelSections.Background,
101
- StylesPanelSections.Borders,
102
- StylesPanelSections.Size,
103
- StylesPanelSections.MarginsAndPaddings,
104
- StylesPanelSections.Position,
105
- StylesPanelSections.Effects,
106
- ],
107
- layout: {
108
- borderRadius: 8,
109
- fontFamily: "system-700",
110
- backgroundColor: "primary",
111
- textAlign: "center",
112
- },
113
- triggers: SEED_DATA_TRIGGERS,
114
- props: SEED_DATA_PROPS,
115
- },
116
- ];
@@ -1,52 +0,0 @@
1
- import { COMPONENT_TYPES, createElevationType, createTextProp, createImageProp, createIconProp, createAspectRatioProp, createStaticBoolProp, createTextStyle, createActionProp, Triggers, } from "@draftbit/types";
2
- export const SEED_DATA = {
3
- name: "Card",
4
- tag: "Card",
5
- description: "A card you can customize however you'd like",
6
- category: COMPONENT_TYPES.card,
7
- triggers: [Triggers.OnPress, Triggers.OnPressIcon],
8
- props: {
9
- onPress: createActionProp(),
10
- onPressIcon: createActionProp({
11
- handlerPropName: "onPressIcon",
12
- }),
13
- elevation: createElevationType(3),
14
- image: createImageProp(),
15
- title: createTextProp({
16
- label: "Title",
17
- description: "Large title text",
18
- // defaultValue: "Title",
19
- defaultValue: null,
20
- }),
21
- titleStyle: createTextStyle({
22
- label: "Title Style",
23
- }),
24
- subtitle: createTextProp({
25
- label: "Subtitle",
26
- description: "Text underneath the title",
27
- defaultValue: null,
28
- // defaultValue: "Edit me in the props panel on the right",
29
- }),
30
- subtitleStyle: createTextStyle({
31
- label: "Subtitle Style",
32
- }),
33
- description: createTextProp({
34
- label: "Description",
35
- description: "Smallest text underneath subtitle",
36
- // defaultValue:
37
- // "This bottom text is optional, but shows up to make your life a little easier!",
38
- defaultValue: null,
39
- }),
40
- descriptionStyle: createTextStyle({
41
- label: "Description Style",
42
- }),
43
- icon: createIconProp(),
44
- aspectRatio: createAspectRatioProp({
45
- defaultValue: 1.5,
46
- }),
47
- textCentered: createStaticBoolProp({
48
- label: "Centered Text",
49
- description: "Places your title and subtitle in the center",
50
- }),
51
- },
52
- };
@@ -1,123 +0,0 @@
1
- import { GROUPS, COMPONENT_TYPES, FORM_TYPES, PROP_TYPES, createElevationType, createNumColumnsType, BLOCK_STYLES_SECTIONS, } from "@draftbit/types";
2
- const SEED_DATA_PROPS = {
3
- image: {
4
- group: GROUPS.data,
5
- label: "Image",
6
- description: "Image",
7
- formType: FORM_TYPES.image,
8
- propType: PROP_TYPES.ASSET,
9
- defaultValue: null,
10
- editable: true,
11
- required: false,
12
- },
13
- title: {
14
- group: GROUPS.data,
15
- label: "Title",
16
- description: "Text to display",
17
- formType: FORM_TYPES.string,
18
- propType: PROP_TYPES.STRING,
19
- defaultValue: "Beautiful West Coast Villa",
20
- editable: true,
21
- required: false,
22
- },
23
- leftDescription: {
24
- group: GROUPS.data,
25
- label: "Left description",
26
- description: "Text to display on the left",
27
- formType: FORM_TYPES.string,
28
- propType: PROP_TYPES.STRING,
29
- defaultValue: "San Diego",
30
- editable: true,
31
- required: false,
32
- },
33
- rightDescription: {
34
- group: GROUPS.data,
35
- label: "Right description",
36
- description: "Text to display on the right",
37
- formType: FORM_TYPES.string,
38
- propType: PROP_TYPES.STRING,
39
- defaultValue: "$100",
40
- editable: true,
41
- required: false,
42
- },
43
- aspectRatio: {
44
- group: GROUPS.basic,
45
- label: "Aspect ratio",
46
- description: "Aspect ratio of the image",
47
- formType: FORM_TYPES.aspectRatio,
48
- propType: PROP_TYPES.NUMBER,
49
- defaultValue: 1.5,
50
- editable: true,
51
- required: false,
52
- },
53
- titleCentered: {
54
- group: GROUPS.basic,
55
- label: "Title centered",
56
- description: "Whether to center the title",
57
- formType: FORM_TYPES.boolean,
58
- propType: PROP_TYPES.BOOLEAN,
59
- defaultValue: false,
60
- editable: true,
61
- required: false,
62
- },
63
- elevation: createElevationType(2),
64
- };
65
- export const SEED_DATA = [
66
- {
67
- name: "Small Card",
68
- tag: "CardBlock",
69
- description: "An elevated card with a title and description, that takes up one third of its container.",
70
- category: COMPONENT_TYPES.card,
71
- props: {
72
- ...SEED_DATA_PROPS,
73
- numColumns: createNumColumnsType({
74
- defaultValue: 1,
75
- }),
76
- },
77
- },
78
- {
79
- name: "Medium Block Card",
80
- tag: "CardBlock",
81
- description: "An elevated card with a title and description, that takes up one half of its container.",
82
- category: COMPONENT_TYPES.card,
83
- props: {
84
- ...SEED_DATA_PROPS,
85
- icon: {
86
- group: GROUPS.basic,
87
- label: "Icon",
88
- description: "Icon to display on the top right",
89
- formType: FORM_TYPES.icon,
90
- propType: PROP_TYPES.STRING,
91
- defaultValue: null,
92
- editable: true,
93
- required: true,
94
- },
95
- numColumns: createNumColumnsType({
96
- defaultValue: 2,
97
- }),
98
- },
99
- },
100
- {
101
- name: "Large Block Card",
102
- tag: "CardBlock",
103
- description: "An elevated card with a title and description, that takes up the full width its container.",
104
- category: COMPONENT_TYPES.card,
105
- stylesPanelSections: BLOCK_STYLES_SECTIONS,
106
- props: {
107
- ...SEED_DATA_PROPS,
108
- icon: {
109
- group: GROUPS.basic,
110
- label: "Icon",
111
- description: "Icon to display on the top right",
112
- formType: FORM_TYPES.icon,
113
- propType: PROP_TYPES.STRING,
114
- defaultValue: null,
115
- editable: true,
116
- required: true,
117
- },
118
- numColumns: createNumColumnsType({
119
- defaultValue: 3,
120
- }),
121
- },
122
- },
123
- ];