@draftbit/core 46.2.3 → 46.2.4-2fc21b.3

package/src/mappings/TextArea.ts

@@ -7,231 +7,6 @@ import {
   Triggers,
 } from "@draftbit/types";
 
-const TEXT_AREA_PROPS = {
-  allowFontScaling: {
-    group: GROUPS.advanced,
-    label: "Allow Font Scaling",
-    description:
-      "Whether fonts should scale to respect Text Size in the user's accessibility settings. (Default: true)",
-    editable: true,
-    required: false,
-    defaultValue: null,
-    formType: FORM_TYPES.boolean,
-    propType: PROP_TYPES.BOOLEAN,
-  },
-  autoCapitalize: {
-    group: GROUPS.advanced,
-    label: "Auto Capitalize",
-    description:
-      "Can automatically capitalize sentences, words, and characters (Default: none).",
-    editable: true,
-    required: false,
-    defaultValue: null,
-    options: ["none", "sentences", "words", "characters"],
-    formType: FORM_TYPES.flatArray,
-    propType: PROP_TYPES.STRING,
-  },
-  autoCorrect: {
-    group: GROUPS.advanced,
-    label: "Auto Correct",
-    description: "Enables auto correction",
-    editable: true,
-    required: false,
-    defaultValue: null,
-    formType: FORM_TYPES.boolean,
-    propType: PROP_TYPES.BOOLEAN,
-  },
-  autoFocus: {
-    group: GROUPS.basic,
-    label: "Auto Focus",
-    description: "Focuses the input on load in and brings up the keyboard",
-    editable: true,
-    required: false,
-    defaultValue: null,
-    formType: FORM_TYPES.boolean,
-    propType: PROP_TYPES.BOOLEAN,
-  },
-  caretHidden: {
-    group: GROUPS.advanced,
-    label: "Hide Caret",
-    description:
-      "Hides the caret(the line small line underneath each showing where you're editing/typing",
-    editable: true,
-    required: false,
-    defaultValue: null,
-    formType: FORM_TYPES.boolean,
-    propType: PROP_TYPES.BOOLEAN,
-  },
-  contextMenuHidden: {
-    group: GROUPS.advanced,
-    label: "Hide Context Menu",
-    description: "Hides the system context menu (Default: false)",
-    editable: true,
-    required: false,
-    defaultValue: null,
-    formType: FORM_TYPES.boolean,
-    propType: PROP_TYPES.BOOLEAN,
-  },
-  editable: {
-    group: GROUPS.advanced,
-    label: "Editable",
-    description: "If false, the text is not editable",
-    editable: true,
-    required: false,
-    defaultValue: true,
-    formType: FORM_TYPES.boolean,
-    propType: PROP_TYPES.BOOLEAN,
-  },
-  keyboardAppearance: {
-    group: GROUPS.advanced,
-    label: "Keyboard Appearance",
-    description: "Determines the color of the keyboard.(iOS Only)",
-    editable: true,
-    required: false,
-    defaultValue: null,
-    options: ["default", "light", "dark"],
-    formType: FORM_TYPES.flatArray,
-    propType: PROP_TYPES.STRING,
-  },
-  keyboardType: {
-    group: GROUPS.advanced,
-    label: "Keyboard Type",
-    description: "Determines what keyboard is given to the user.",
-    editable: true,
-    required: false,
-    defaultValue: null,
-    options: [
-      "default",
-      "email-address",
-      "numeric",
-      "phone-pad",
-      "ascii-capable",
-      "numbers-and-punctuation",
-      "url",
-      "number-pad",
-      "name-phone-pad",
-      "decimal-pad",
-      "twitter",
-      "web-search",
-      "visible-password",
-    ],
-    formType: FORM_TYPES.flatArray,
-    propType: PROP_TYPES.STRING,
-  },
-  maxLength: {
-    group: GROUPS.basic,
-    label: "Max Length",
-    description: "Limits the input to a set number of characters.",
-    editable: true,
-    required: false,
-    defaultValue: null,
-    min: 0,
-    step: 1,
-    precision: 0,
-    formType: FORM_TYPES.number,
-    propType: PROP_TYPES.NUMBER,
-  },
-  placeholder: {
-    group: GROUPS.data,
-    label: "Placeholder Text",
-    description: "The text that is shown on load when no value is available.",
-    editable: true,
-    required: false,
-    defaultValue: "Enter a value...",
-    formType: FORM_TYPES.string,
-    propType: PROP_TYPES.STRING,
-  },
-  placeholderTextColor: {
-    group: GROUPS.basic,
-    label: "Placeholder Text Color",
-    description: "The color of the placeholder text.",
-    editable: true,
-    required: false,
-    defaultValue: null,
-    formType: FORM_TYPES.color,
-    propType: PROP_TYPES.STRING,
-  },
-  returnKeyLabel: {
-    group: GROUPS.advanced,
-    label: "Return Key Label",
-    description:
-      "(Android Only) Sets the label on the return key (use this instead of rewturnKeyType)",
-    editable: true,
-    required: false,
-    defaultValue: null,
-    formType: FORM_TYPES.string,
-    propType: PROP_TYPES.STRING,
-  },
-  returnKeyType: {
-    group: GROUPS.advanced,
-    label: "Return Key Type",
-    description: "Determines how the return key should look like",
-    editable: true,
-    required: false,
-    defaultValue: null,
-    options: [
-      "done",
-      "go",
-      "next",
-      "search",
-      "send",
-      "none",
-      "previous",
-      "default",
-      "emergency-call",
-      "google",
-      "join",
-      "route",
-      "yahoo",
-    ],
-    formType: FORM_TYPES.flatArray,
-    propType: PROP_TYPES.STRING,
-  },
-  secureTextEntry: {
-    group: GROUPS.basic,
-    label: "Password Input?",
-    description:
-      "Hides the characters with a *, useful for passwords and other sensitive information.",
-    editable: true,
-    required: false,
-    defaultValue: null,
-    formType: FORM_TYPES.boolean,
-    propType: PROP_TYPES.BOOLEAN,
-  },
-  selectionColor: {
-    group: GROUPS.advanced,
-    label: "Selection Color",
-    description: "Color of the highlighted portion when selecting.",
-    editable: true,
-    required: false,
-    defaultValue: null,
-    formType: FORM_TYPES.color,
-    propType: PROP_TYPES.STRING,
-  },
-  selectTextOnFocus: {
-    group: GROUPS.advanced,
-    label: "Select Text on Focus",
-    description:
-      "If true, all the text will automatically be selected on focus",
-    editable: true,
-    required: false,
-    defaultValue: null,
-    formType: FORM_TYPES.boolean,
-    propType: PROP_TYPES.BOOLEAN,
-  },
-  textAlignVertical: {
-    group: GROUPS.advanced,
-    label: "Aligns text on the vertical axis",
-    description: "Move the text around in the given component.",
-    options: ["auto", "top", "bottom", "center"],
-    editable: true,
-    required: false,
-    defaultValue: "top",
-    formType: FORM_TYPES.flatArray,
-    propType: PROP_TYPES.STRING,
-  },
-};
-
 export const SEED_DATA = {
   name: "Text Area",
   tag: "TextInput",
@@ -251,11 +26,228 @@ export const SEED_DATA = {
   },
   triggers: [Triggers.OnChangeText],
   props: {
-    ...TEXT_AREA_PROPS,
+    allowFontScaling: {
+      group: GROUPS.advanced,
+      label: "Allow Font Scaling",
+      description:
+        "Whether fonts should scale to respect Text Size in the user's accessibility settings. (Default: true)",
+      editable: true,
+      required: false,
+      defaultValue: null,
+      formType: FORM_TYPES.boolean,
+      propType: PROP_TYPES.BOOLEAN,
+    },
+    autoCapitalize: {
+      group: GROUPS.advanced,
+      label: "Auto Capitalize",
+      description:
+        "Can automatically capitalize sentences, words, and characters (Default: none).",
+      editable: true,
+      required: false,
+      defaultValue: null,
+      options: ["none", "sentences", "words", "characters"],
+      formType: FORM_TYPES.flatArray,
+      propType: PROP_TYPES.STRING,
+    },
+    autoCorrect: {
+      group: GROUPS.advanced,
+      label: "Auto Correct",
+      description: "Enables auto correction",
+      editable: true,
+      required: false,
+      defaultValue: null,
+      formType: FORM_TYPES.boolean,
+      propType: PROP_TYPES.BOOLEAN,
+    },
+    autoFocus: {
+      group: GROUPS.basic,
+      label: "Auto Focus",
+      description: "Focuses the input on load in and brings up the keyboard",
+      editable: true,
+      required: false,
+      defaultValue: null,
+      formType: FORM_TYPES.boolean,
+      propType: PROP_TYPES.BOOLEAN,
+    },
+    caretHidden: {
+      group: GROUPS.advanced,
+      label: "Hide Caret",
+      description:
+        "Hides the caret(the line small line underneath each showing where you're editing/typing",
+      editable: true,
+      required: false,
+      defaultValue: null,
+      formType: FORM_TYPES.boolean,
+      propType: PROP_TYPES.BOOLEAN,
+    },
+    contextMenuHidden: {
+      group: GROUPS.advanced,
+      label: "Hide Context Menu",
+      description: "Hides the system context menu (Default: false)",
+      editable: true,
+      required: false,
+      defaultValue: null,
+      formType: FORM_TYPES.boolean,
+      propType: PROP_TYPES.BOOLEAN,
+    },
+    editable: {
+      group: GROUPS.advanced,
+      label: "Editable",
+      description: "If false, the text is not editable",
+      editable: true,
+      required: false,
+      defaultValue: true,
+      formType: FORM_TYPES.boolean,
+      propType: PROP_TYPES.BOOLEAN,
+    },
+    keyboardAppearance: {
+      group: GROUPS.advanced,
+      label: "Keyboard Appearance",
+      description: "Determines the color of the keyboard.(iOS Only)",
+      editable: true,
+      required: false,
+      defaultValue: null,
+      options: ["default", "light", "dark"],
+      formType: FORM_TYPES.flatArray,
+      propType: PROP_TYPES.STRING,
+    },
+    keyboardType: {
+      group: GROUPS.advanced,
+      label: "Keyboard Type",
+      description: "Determines what keyboard is given to the user.",
+      editable: true,
+      required: false,
+      defaultValue: null,
+      options: [
+        "default",
+        "email-address",
+        "numeric",
+        "phone-pad",
+        "ascii-capable",
+        "numbers-and-punctuation",
+        "url",
+        "number-pad",
+        "name-phone-pad",
+        "decimal-pad",
+        "twitter",
+        "web-search",
+        "visible-password",
+      ],
+      formType: FORM_TYPES.flatArray,
+      propType: PROP_TYPES.STRING,
+    },
+    maxLength: {
+      group: GROUPS.basic,
+      label: "Max Length",
+      description: "Limits the input to a set number of characters.",
+      editable: true,
+      required: false,
+      defaultValue: null,
+      min: 0,
+      step: 1,
+      precision: 0,
+      formType: FORM_TYPES.number,
+      propType: PROP_TYPES.NUMBER,
+    },
     placeholder: {
-      ...TEXT_AREA_PROPS.placeholder,
+      group: GROUPS.data,
+      label: "Placeholder Text",
+      description: "The text that is shown on load when no value is available.",
+      editable: true,
+      required: false,
       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.",
+      formType: FORM_TYPES.string,
+      propType: PROP_TYPES.STRING,
+    },
+    placeholderTextColor: {
+      group: GROUPS.basic,
+      label: "Placeholder Text Color",
+      description: "The color of the placeholder text.",
+      editable: true,
+      required: false,
+      defaultValue: null,
+      formType: FORM_TYPES.color,
+      propType: PROP_TYPES.STRING,
+    },
+    returnKeyLabel: {
+      group: GROUPS.advanced,
+      label: "Return Key Label",
+      description:
+        "(Android Only) Sets the label on the return key (use this instead of rewturnKeyType)",
+      editable: true,
+      required: false,
+      defaultValue: null,
+      formType: FORM_TYPES.string,
+      propType: PROP_TYPES.STRING,
+    },
+    returnKeyType: {
+      group: GROUPS.advanced,
+      label: "Return Key Type",
+      description: "Determines how the return key should look like",
+      editable: true,
+      required: false,
+      defaultValue: null,
+      options: [
+        "done",
+        "go",
+        "next",
+        "search",
+        "send",
+        "none",
+        "previous",
+        "default",
+        "emergency-call",
+        "google",
+        "join",
+        "route",
+        "yahoo",
+      ],
+      formType: FORM_TYPES.flatArray,
+      propType: PROP_TYPES.STRING,
+    },
+    secureTextEntry: {
+      group: GROUPS.basic,
+      label: "Password Input?",
+      description:
+        "Hides the characters with a *, useful for passwords and other sensitive information.",
+      editable: true,
+      required: false,
+      defaultValue: null,
+      formType: FORM_TYPES.boolean,
+      propType: PROP_TYPES.BOOLEAN,
+    },
+    selectionColor: {
+      group: GROUPS.advanced,
+      label: "Selection Color",
+      description: "Color of the highlighted portion when selecting.",
+      editable: true,
+      required: false,
+      defaultValue: null,
+      formType: FORM_TYPES.color,
+      propType: PROP_TYPES.STRING,
+    },
+    selectTextOnFocus: {
+      group: GROUPS.advanced,
+      label: "Select Text on Focus",
+      description:
+        "If true, all the text will automatically be selected on focus",
+      editable: true,
+      required: false,
+      defaultValue: null,
+      formType: FORM_TYPES.boolean,
+      propType: PROP_TYPES.BOOLEAN,
+    },
+    textAlignVertical: {
+      group: GROUPS.advanced,
+      label: "Aligns text on the vertical axis",
+      description: "Move the text around in the given component.",
+      options: ["auto", "top", "bottom", "center"],
+      editable: true,
+      required: false,
+      defaultValue: "top",
+      formType: FORM_TYPES.flatArray,
+      propType: PROP_TYPES.STRING,
     },
     multiline: {
       label: "Multiline",

package/src/mappings/TextField.js

@@ -1,5 +1,5 @@
 import { GROUPS, COMPONENT_TYPES, FORM_TYPES, PROP_TYPES, FIELD_NAME, Triggers, createColorProp, createNumberProp, createFieldNameProp, StylesPanelSections, } from "@draftbit/types";
-const TEXT_FIELD_PROPS = {
+const SEED_DATA_PROPS = {
     allowFontScaling: {
         group: GROUPS.advanced,
         label: "Allow Font Scaling",
@@ -136,7 +136,7 @@ const TEXT_FIELD_PROPS = {
         description: "The text that is shown on load when no value is available.",
         editable: true,
         required: false,
-        defaultValue: "Enter a value...",
+        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, when an unknown printer took a galley of type and scrambled it to make a type specimen book.",
         formType: FORM_TYPES.string,
         propType: PROP_TYPES.STRING,
     },
@@ -215,9 +215,6 @@ const TEXT_FIELD_PROPS = {
         formType: FORM_TYPES.boolean,
         propType: PROP_TYPES.BOOLEAN,
     },
-};
-const SEED_DATA_PROPS = {
-    ...TEXT_FIELD_PROPS,
     label: {
         group: GROUPS.data,
         label: "Label",
@@ -312,6 +309,10 @@ export const SEED_DATA = [
                 label: "Underline Color",
                 defaultValue: "light",
             }),
+            activeBorderColor: createColorProp({
+                label: "Active Border Color",
+                defaultValue: "primary",
+            }),
             secureTextEntry: {
                 group: GROUPS.basic,
                 label: "Password field",
@@ -344,10 +345,6 @@ export const SEED_DATA = [
         triggers: SEED_DATA_TRIGGERS,
         props: {
             ...SEED_DATA_PROPS,
-            placeholder: {
-                ...TEXT_FIELD_PROPS.placeholder,
-                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, when an unknown printer took a galley of type and scrambled it to make a type specimen book.",
-            },
             type: {
                 label: "Appearance",
                 description: "Type of Datepicker",

package/src/mappings/TextField.ts

@@ -11,7 +11,7 @@ import {
   StylesPanelSections,
 } from "@draftbit/types";
 
-const TEXT_FIELD_PROPS = {
+const SEED_DATA_PROPS = {
   allowFontScaling: {
     group: GROUPS.advanced,
     label: "Allow Font Scaling",
@@ -152,7 +152,8 @@ const TEXT_FIELD_PROPS = {
     description: "The text that is shown on load when no value is available.",
     editable: true,
     required: false,
-    defaultValue: "Enter a value...",
+    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, when an unknown printer took a galley of type and scrambled it to make a type specimen book.",
     formType: FORM_TYPES.string,
     propType: PROP_TYPES.STRING,
   },
@@ -234,10 +235,6 @@ const TEXT_FIELD_PROPS = {
     formType: FORM_TYPES.boolean,
     propType: PROP_TYPES.BOOLEAN,
   },
-};
-
-const SEED_DATA_PROPS = {
-  ...TEXT_FIELD_PROPS,
   label: {
     group: GROUPS.data,
     label: "Label",
@@ -334,6 +331,10 @@ export const SEED_DATA = [
         label: "Underline Color",
         defaultValue: "light",
       }),
+      activeBorderColor: createColorProp({
+        label: "Active Border Color",
+        defaultValue: "primary",
+      }),
       secureTextEntry: {
         group: GROUPS.basic,
         label: "Password field",
@@ -367,11 +368,6 @@ export const SEED_DATA = [
     triggers: SEED_DATA_TRIGGERS,
     props: {
       ...SEED_DATA_PROPS,
-      placeholder: {
-        ...TEXT_FIELD_PROPS.placeholder,
-        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, when an unknown printer took a galley of type and scrambled it to make a type specimen book.",
-      },
       type: {
         label: "Appearance",
         description: "Type of Datepicker",