@draftbit/core 46.4.4-c18fe1.2 → 46.4.4-caab07.0

package/src/mappings/ProgressCircle.js

@@ -1,109 +1,116 @@
-import { COMPONENT_TYPES, FORM_TYPES, GROUPS, PROP_TYPES, BLOCK_STYLES_SECTIONS, } from "@draftbit/types";
+import {
+  COMPONENT_TYPES,
+  FORM_TYPES,
+  GROUPS,
+  PROP_TYPES,
+  BLOCK_STYLES_SECTIONS,
+} from "@draftbit/types";
 export const SEED_DATA = {
-    name: "Progress Circle",
-    tag: "ProgressCircle",
-    description: "A circle used to show completed progress",
-    category: COMPONENT_TYPES.deprecated,
-    stylesPanelSections: BLOCK_STYLES_SECTIONS,
-    preview_image_url: "{CLOUDINARY_URL}/Status_Progress.png",
-    supports_list_render: false,
-    props: {
-        progress: {
-            group: GROUPS.data,
-            label: "Progress",
-            description: "The amount of progress to display. A number 0-1.",
-            formType: FORM_TYPES.number,
-            propType: PROP_TYPES.NUMBER,
-            defaultValue: 0.5,
-            min: 0,
-            max: 1,
-            step: 0.01,
-            precision: 2,
-            editable: true,
-            required: true,
-        },
-        color: {
-            group: GROUPS.basic,
-            label: "Color",
-            description: "Color for the progress shown",
-            editable: true,
-            defaultValue: "primary",
-            required: true,
-            formType: FORM_TYPES.color,
-            propType: PROP_TYPES.THEME,
-        },
-        unfilledColor: {
-            group: GROUPS.basic,
-            label: "Unfilled Color",
-            description: "The color of the unfilled portion of the progress bar(eg. if at 50% then this is the color of the other 50%)",
-            editable: true,
-            defaultValue: null,
-            required: true,
-            formType: FORM_TYPES.color,
-            propType: PROP_TYPES.THEME,
-        },
-        size: {
-            group: GROUPS.basic,
-            label: "Size",
-            description: "The size of the circle",
-            formType: FORM_TYPES.number,
-            propType: PROP_TYPES.NUMBER,
-            defaultValue: 100,
-            min: 0,
-            max: 300,
-            step: 1,
-            precision: 1,
-            editable: true,
-            required: true,
-        },
-        showsText: {
-            group: GROUPS.basic,
-            label: "Show Progress Text",
-            description: "Shows progress in the middle of the circle",
-            formType: FORM_TYPES.boolean,
-            propType: PROP_TYPES.BOOLEAN,
-            defaultValue: true,
-            editable: true,
-            required: true,
-        },
-        textStyle: {
-            group: GROUPS.basic,
-            label: "Text Style",
-            description: "Text Style of the inner circle",
-            editable: true,
-            required: true,
-            formType: FORM_TYPES.typeStyle,
-            propType: PROP_TYPES.THEME,
-            defaultValue: null,
-        },
-        thickness: {
-            group: GROUPS.basic,
-            label: "Thickness",
-            description: "Thickness of the inner circle",
-            formType: FORM_TYPES.number,
-            propType: PROP_TYPES.NUMBER,
-            defaultValue: 1,
-            min: 0,
-            max: 15,
-            step: 1,
-            precision: 1,
-            editable: true,
-            required: true,
-        },
-        strokeCap: {
-            group: GROUPS.basic,
-            label: "Stroke Cap",
-            description: "The style of the stroke",
-            formType: FORM_TYPES.flatArray,
-            propType: PROP_TYPES.STRING,
-            defaultValue: "butt",
-            options: ["butt", "square", "round"],
-            editable: true,
-            required: true,
-        },
+  name: "Progress Circle",
+  tag: "ProgressCircle",
+  description: "A circle used to show completed progress",
+  category: COMPONENT_TYPES.deprecated,
+  stylesPanelSections: BLOCK_STYLES_SECTIONS,
+  preview_image_url: "{CLOUDINARY_URL}/Status_Progress.png",
+  supports_list_render: false,
+  props: {
+    progress: {
+      group: GROUPS.data,
+      label: "Progress",
+      description: "The amount of progress to display. A number 0-1.",
+      formType: FORM_TYPES.number,
+      propType: PROP_TYPES.NUMBER,
+      defaultValue: 0.5,
+      min: 0,
+      max: 1,
+      step: 0.01,
+      precision: 2,
+      editable: true,
+      required: true,
     },
-    layout: {
-        width: 250,
-        height: 250,
+    color: {
+      group: GROUPS.basic,
+      label: "Color",
+      description: "Color for the progress shown",
+      editable: true,
+      defaultValue: "primary",
+      required: true,
+      formType: FORM_TYPES.color,
+      propType: PROP_TYPES.THEME,
     },
+    unfilledColor: {
+      group: GROUPS.basic,
+      label: "Unfilled Color",
+      description:
+        "The color of the unfilled portion of the progress bar(eg. if at 50% then this is the color of the other 50%)",
+      editable: true,
+      defaultValue: null,
+      required: true,
+      formType: FORM_TYPES.color,
+      propType: PROP_TYPES.THEME,
+    },
+    size: {
+      group: GROUPS.basic,
+      label: "Size",
+      description: "The size of the circle",
+      formType: FORM_TYPES.number,
+      propType: PROP_TYPES.NUMBER,
+      defaultValue: 100,
+      min: 0,
+      max: 300,
+      step: 1,
+      precision: 1,
+      editable: true,
+      required: true,
+    },
+    showsText: {
+      group: GROUPS.basic,
+      label: "Show Progress Text",
+      description: "Shows progress in the middle of the circle",
+      formType: FORM_TYPES.boolean,
+      propType: PROP_TYPES.BOOLEAN,
+      defaultValue: true,
+      editable: true,
+      required: true,
+    },
+    textStyle: {
+      group: GROUPS.basic,
+      label: "Text Style",
+      description: "Text Style of the inner circle",
+      editable: true,
+      required: true,
+      formType: FORM_TYPES.typeStyle,
+      propType: PROP_TYPES.THEME,
+      defaultValue: null,
+    },
+    thickness: {
+      group: GROUPS.basic,
+      label: "Thickness",
+      description: "Thickness of the inner circle",
+      formType: FORM_TYPES.number,
+      propType: PROP_TYPES.NUMBER,
+      defaultValue: 1,
+      min: 0,
+      max: 15,
+      step: 1,
+      precision: 1,
+      editable: true,
+      required: true,
+    },
+    strokeCap: {
+      group: GROUPS.basic,
+      label: "Stroke Cap",
+      description: "The style of the stroke",
+      formType: FORM_TYPES.flatArray,
+      propType: PROP_TYPES.STRING,
+      defaultValue: "butt",
+      options: ["butt", "square", "round"],
+      editable: true,
+      required: true,
+    },
+  },
+  layout: {
+    width: 250,
+    height: 250,
+  },
 };

package/src/mappings/ProgressIndicator.js

@@ -1,181 +1,189 @@
-import { COMPONENT_TYPES, FORM_TYPES, GROUPS, PROP_TYPES, BLOCK_STYLES_SECTIONS, } from "@draftbit/types";
+import {
+  COMPONENT_TYPES,
+  FORM_TYPES,
+  GROUPS,
+  PROP_TYPES,
+  BLOCK_STYLES_SECTIONS,
+} from "@draftbit/types";
 export const SEED_DATA = {
-    name: "Progress Indicator",
-    tag: "ProgressIndicator",
-    description: "A component used to show current Step in a process",
-    category: COMPONENT_TYPES.deprecated,
-    stylesPanelSections: BLOCK_STYLES_SECTIONS,
-    preview_image_url: "{CLOUDINARY_URL}/Control_Slider.png",
-    supports_list_render: false,
-    layout: {},
-    props: {
-        numberOfSteps: {
-            group: GROUPS.data,
-            label: "Number of Steps",
-            description: "The border radius for the thumb",
-            editable: true,
-            required: false,
-            formType: FORM_TYPES.number,
-            propType: PROP_TYPES.NUMBER,
-            min: 0,
-            max: 10,
-            step: 1,
-            precision: 0,
-            defaultValue: 5,
-        },
-        currentStep: {
-            group: GROUPS.data,
-            label: "Current Step",
-            description: "The step that the user is on",
-            editable: true,
-            required: false,
-            formType: FORM_TYPES.number,
-            propType: PROP_TYPES.NUMBER,
-            min: 0,
-            max: 10,
-            step: 1,
-            precision: 0,
-            defaultValue: 5,
-        },
-        stepIndicatorSize: {
-            group: GROUPS.basic,
-            label: "Step Size",
-            description: "The size of the step circle",
-            editable: true,
-            required: false,
-            formType: FORM_TYPES.number,
-            propType: PROP_TYPES.NUMBER,
-            min: 10,
-            max: 100,
-            step: 5,
-            precision: 0,
-            defaultValue: 25,
-        },
-        stepIndicatorLabelFontSize: {
-            group: GROUPS.basic,
-            label: "Step Font Size",
-            description: "The font size of the step number",
-            editable: true,
-            required: false,
-            formType: FORM_TYPES.number,
-            propType: PROP_TYPES.NUMBER,
-            min: 6,
-            max: 36,
-            step: 1,
-            precision: 0,
-            defaultValue: 15,
-        },
-        currentStepIndicatorLabelFontSize: {
-            group: GROUPS.basic,
-            label: "Current Step Font Size",
-            description: "The font size of the current step number",
-            editable: true,
-            required: false,
-            formType: FORM_TYPES.number,
-            propType: PROP_TYPES.NUMBER,
-            min: 6,
-            max: 36,
-            step: 1,
-            precision: 0,
-            defaultValue: 15,
-        },
-        unfinishedColor: {
-            group: GROUPS.basic,
-            label: "Unfinished Color",
-            description: "The color of the step and divider when the step is either not the current step or not finished",
-            editable: true,
-            required: false,
-            formType: FORM_TYPES.color,
-            propType: PROP_TYPES.THEME,
-            defaultValue: null,
-        },
-        finishedColor: {
-            group: GROUPS.basic,
-            label: "Finished Color",
-            description: "The color of the step and divider when the step is the current step or finished",
-            editable: true,
-            required: false,
-            formType: FORM_TYPES.color,
-            propType: PROP_TYPES.THEME,
-            defaultValue: null,
-        },
-        stepNumberUnfinishedColor: {
-            group: GROUPS.basic,
-            label: "Unfinished Number Color",
-            description: "The color of the number within the step when unfinished",
-            editable: true,
-            required: false,
-            formType: FORM_TYPES.color,
-            propType: PROP_TYPES.THEME,
-            defaultValue: null,
-        },
-        stepNumberFinishedColor: {
-            group: GROUPS.basic,
-            label: "Finished Number Color",
-            description: "The color of the number within the step when finished",
-            editable: true,
-            required: false,
-            formType: FORM_TYPES.color,
-            propType: PROP_TYPES.THEME,
-            defaultValue: null,
-        },
-        stepIndicatorCurrentColor: {
-            group: GROUPS.basic,
-            label: "Current Step Color",
-            description: "The color of current step circle",
-            editable: true,
-            required: false,
-            formType: FORM_TYPES.color,
-            propType: PROP_TYPES.THEME,
-            defaultValue: null,
-        },
-        stepIndicatorLabelCurrentColor: {
-            group: GROUPS.basic,
-            label: "Current Step Number Color",
-            description: "The color of current number within the step circle",
-            editable: true,
-            required: false,
-            formType: FORM_TYPES.color,
-            propType: PROP_TYPES.THEME,
-            defaultValue: null,
-        },
-        stepStrokeCurrentColor: {
-            group: GROUPS.basic,
-            label: "Current Step Border Color",
-            description: "The color of current border color of the step",
-            editable: true,
-            required: false,
-            formType: FORM_TYPES.color,
-            propType: PROP_TYPES.THEME,
-            defaultValue: null,
-        },
-        currentStepStrokeWidth: {
-            group: GROUPS.basic,
-            label: "Current Step Border Width",
-            description: "The width of the border for the current step",
-            editable: true,
-            required: false,
-            formType: FORM_TYPES.number,
-            propType: PROP_TYPES.NUMBER,
-            min: 1,
-            max: 20,
-            step: 1,
-            precision: 0,
-            defaultValue: 0,
-        },
-        currentStepIndicatorSize: {
-            group: GROUPS.basic,
-            label: "Current Step Size",
-            description: "The size of the current step circle",
-            editable: true,
-            required: false,
-            formType: FORM_TYPES.number,
-            propType: PROP_TYPES.NUMBER,
-            min: 10,
-            max: 100,
-            step: 5,
-            precision: 0,
-            defaultValue: null,
-        },
+  name: "Progress Indicator",
+  tag: "ProgressIndicator",
+  description: "A component used to show current Step in a process",
+  category: COMPONENT_TYPES.deprecated,
+  stylesPanelSections: BLOCK_STYLES_SECTIONS,
+  preview_image_url: "{CLOUDINARY_URL}/Control_Slider.png",
+  supports_list_render: false,
+  layout: {},
+  props: {
+    numberOfSteps: {
+      group: GROUPS.data,
+      label: "Number of Steps",
+      description: "The border radius for the thumb",
+      editable: true,
+      required: false,
+      formType: FORM_TYPES.number,
+      propType: PROP_TYPES.NUMBER,
+      min: 0,
+      max: 10,
+      step: 1,
+      precision: 0,
+      defaultValue: 5,
     },
+    currentStep: {
+      group: GROUPS.data,
+      label: "Current Step",
+      description: "The step that the user is on",
+      editable: true,
+      required: false,
+      formType: FORM_TYPES.number,
+      propType: PROP_TYPES.NUMBER,
+      min: 0,
+      max: 10,
+      step: 1,
+      precision: 0,
+      defaultValue: 5,
+    },
+    stepIndicatorSize: {
+      group: GROUPS.basic,
+      label: "Step Size",
+      description: "The size of the step circle",
+      editable: true,
+      required: false,
+      formType: FORM_TYPES.number,
+      propType: PROP_TYPES.NUMBER,
+      min: 10,
+      max: 100,
+      step: 5,
+      precision: 0,
+      defaultValue: 25,
+    },
+    stepIndicatorLabelFontSize: {
+      group: GROUPS.basic,
+      label: "Step Font Size",
+      description: "The font size of the step number",
+      editable: true,
+      required: false,
+      formType: FORM_TYPES.number,
+      propType: PROP_TYPES.NUMBER,
+      min: 6,
+      max: 36,
+      step: 1,
+      precision: 0,
+      defaultValue: 15,
+    },
+    currentStepIndicatorLabelFontSize: {
+      group: GROUPS.basic,
+      label: "Current Step Font Size",
+      description: "The font size of the current step number",
+      editable: true,
+      required: false,
+      formType: FORM_TYPES.number,
+      propType: PROP_TYPES.NUMBER,
+      min: 6,
+      max: 36,
+      step: 1,
+      precision: 0,
+      defaultValue: 15,
+    },
+    unfinishedColor: {
+      group: GROUPS.basic,
+      label: "Unfinished Color",
+      description:
+        "The color of the step and divider when the step is either not the current step or not finished",
+      editable: true,
+      required: false,
+      formType: FORM_TYPES.color,
+      propType: PROP_TYPES.THEME,
+      defaultValue: null,
+    },
+    finishedColor: {
+      group: GROUPS.basic,
+      label: "Finished Color",
+      description:
+        "The color of the step and divider when the step is the current step or finished",
+      editable: true,
+      required: false,
+      formType: FORM_TYPES.color,
+      propType: PROP_TYPES.THEME,
+      defaultValue: null,
+    },
+    stepNumberUnfinishedColor: {
+      group: GROUPS.basic,
+      label: "Unfinished Number Color",
+      description: "The color of the number within the step when unfinished",
+      editable: true,
+      required: false,
+      formType: FORM_TYPES.color,
+      propType: PROP_TYPES.THEME,
+      defaultValue: null,
+    },
+    stepNumberFinishedColor: {
+      group: GROUPS.basic,
+      label: "Finished Number Color",
+      description: "The color of the number within the step when finished",
+      editable: true,
+      required: false,
+      formType: FORM_TYPES.color,
+      propType: PROP_TYPES.THEME,
+      defaultValue: null,
+    },
+    stepIndicatorCurrentColor: {
+      group: GROUPS.basic,
+      label: "Current Step Color",
+      description: "The color of current step circle",
+      editable: true,
+      required: false,
+      formType: FORM_TYPES.color,
+      propType: PROP_TYPES.THEME,
+      defaultValue: null,
+    },
+    stepIndicatorLabelCurrentColor: {
+      group: GROUPS.basic,
+      label: "Current Step Number Color",
+      description: "The color of current number within the step circle",
+      editable: true,
+      required: false,
+      formType: FORM_TYPES.color,
+      propType: PROP_TYPES.THEME,
+      defaultValue: null,
+    },
+    stepStrokeCurrentColor: {
+      group: GROUPS.basic,
+      label: "Current Step Border Color",
+      description: "The color of current border color of the step",
+      editable: true,
+      required: false,
+      formType: FORM_TYPES.color,
+      propType: PROP_TYPES.THEME,
+      defaultValue: null,
+    },
+    currentStepStrokeWidth: {
+      group: GROUPS.basic,
+      label: "Current Step Border Width",
+      description: "The width of the border for the current step",
+      editable: true,
+      required: false,
+      formType: FORM_TYPES.number,
+      propType: PROP_TYPES.NUMBER,
+      min: 1,
+      max: 20,
+      step: 1,
+      precision: 0,
+      defaultValue: 0,
+    },
+    currentStepIndicatorSize: {
+      group: GROUPS.basic,
+      label: "Current Step Size",
+      description: "The size of the current step circle",
+      editable: true,
+      required: false,
+      formType: FORM_TYPES.number,
+      propType: PROP_TYPES.NUMBER,
+      min: 10,
+      max: 100,
+      step: 5,
+      precision: 0,
+      defaultValue: null,
+    },
+  },
 };

package/src/mappings/RadioButton.js

@@ -1,51 +1,61 @@
-import { GROUPS, COMPONENT_TYPES, createBoolProp, createColorProp, createNumberProp, createIconProp, createTextProp, Triggers, BLOCK_STYLES_SECTIONS, } from "@draftbit/types";
+import {
+  GROUPS,
+  COMPONENT_TYPES,
+  createBoolProp,
+  createColorProp,
+  createNumberProp,
+  createIconProp,
+  createTextProp,
+  Triggers,
+  BLOCK_STYLES_SECTIONS,
+} from "@draftbit/types";
 export const SEED_DATA = {
-    name: "Radio Button",
-    tag: "RadioButton",
-    category: COMPONENT_TYPES.control,
-    stylesPanelSections: BLOCK_STYLES_SECTIONS,
-    triggers: [Triggers.OnPress],
-    props: {
-        value: createTextProp({
-            label: "Value",
-            description: "Value of the radio button",
-            defaultValue: null,
-            required: true,
-        }),
-        color: createColorProp({
-            group: GROUPS.basic,
-            description: "Color for the button",
-            defaultValue: "primary",
-        }),
-        unselectedColor: createColorProp({
-            group: GROUPS.basic,
-            label: "Unselected Color",
-            description: "Unselected Color for the button",
-            defaultValue: "primary",
-        }),
-        disabled: createBoolProp({
-            label: "Disabled",
-            description: "Whether radio button is disabled",
-        }),
-        size: createNumberProp({
-            group: GROUPS.basic,
-            label: "Size",
-            description: "Specifies the size of the button",
-            defaultValue: 24,
-            min: 16,
-            max: 128,
-            step: 1,
-            precision: 0,
-        }),
-        selectedIcon: createIconProp({
-            label: "Selected Icon",
-            description: "Icon to show when the radio button is selected",
-            defaultValue: "MaterialIcons/radio-button-checked",
-        }),
-        unselectedIcon: createIconProp({
-            label: "Unselected Icon",
-            description: "Icon to show when the radio button is unselected",
-            defaultValue: "MaterialIcons/radio-button-unchecked",
-        }),
-    },
+  name: "Radio Button",
+  tag: "RadioButton",
+  category: COMPONENT_TYPES.control,
+  stylesPanelSections: BLOCK_STYLES_SECTIONS,
+  triggers: [Triggers.OnPress],
+  props: {
+    value: createTextProp({
+      label: "Value",
+      description: "Value of the radio button",
+      defaultValue: null,
+      required: true,
+    }),
+    color: createColorProp({
+      group: GROUPS.basic,
+      description: "Color for the button",
+      defaultValue: "primary",
+    }),
+    unselectedColor: createColorProp({
+      group: GROUPS.basic,
+      label: "Unselected Color",
+      description: "Unselected Color for the button",
+      defaultValue: "primary",
+    }),
+    disabled: createBoolProp({
+      label: "Disabled",
+      description: "Whether radio button is disabled",
+    }),
+    size: createNumberProp({
+      group: GROUPS.basic,
+      label: "Size",
+      description: "Specifies the size of the button",
+      defaultValue: 24,
+      min: 16,
+      max: 128,
+      step: 1,
+      precision: 0,
+    }),
+    selectedIcon: createIconProp({
+      label: "Selected Icon",
+      description: "Icon to show when the radio button is selected",
+      defaultValue: "MaterialIcons/radio-button-checked",
+    }),
+    unselectedIcon: createIconProp({
+      label: "Unselected Icon",
+      description: "Icon to show when the radio button is unselected",
+      defaultValue: "MaterialIcons/radio-button-unchecked",
+    }),
+  },
 };