@draftbit/core 46.8.2-fee87c.2 → 46.8.2

package/src/mappings/CheckboxRow.js

@@ -1,61 +0,0 @@
-import { createBoolProp, createTextProp, createTextStyle, createRowDirectionProp, createFieldNameProp, createIconProp, createStaticNumberProp, COMPONENT_TYPES, Triggers, createColorProp, StylesPanelSections, } from "@draftbit/types";
-export const SEED_DATA = {
-    name: "Checkbox Row",
-    tag: "CheckboxRow",
-    category: COMPONENT_TYPES.control,
-    stylesPanelSections: [
-        StylesPanelSections.Typography,
-        StylesPanelSections.Margins,
-        StylesPanelSections.Effects,
-    ],
-    layout: {
-        minHeight: 50,
-    },
-    triggers: [Triggers.OnPress, Triggers.OnCheck, Triggers.OnUncheck],
-    props: {
-        fieldName: createFieldNameProp({
-            defaultValue: "checkboxRowValue",
-            valuePropName: "value",
-            handlerPropName: "onPress",
-        }),
-        label: createTextProp({
-            label: "Label",
-            description: "Label to show with the checkbox",
-            required: true,
-            defaultValue: "First Option",
-        }),
-        labelStyle: createTextStyle({
-            label: "Label Style",
-            description: "Change the styles of the label",
-            required: false,
-            editable: false,
-        }),
-        direction: createRowDirectionProp(),
-        color: createColorProp({
-            description: "Color for the button (used when the checkbox is checked)",
-        }),
-        uncheckedColor: createColorProp({
-            label: "Unselected Color",
-            description: "Color for the button when the checkbox is unchecked",
-        }),
-        disabled: createBoolProp({
-            label: "Disabled",
-            description: "Whether the checkbox is disabled",
-        }),
-        size: createStaticNumberProp({
-            label: "Size",
-            description: "Specifies the size of the icon",
-            defaultValue: null,
-        }),
-        checkedIcon: createIconProp({
-            label: "Checked Icon",
-            description: 'Icon to show when the checkbox status is "checked"',
-            defaultValue: null,
-        }),
-        uncheckedIcon: createIconProp({
-            label: "Unchecked Icon",
-            description: 'Icon to show when the checkbox status is "unchecked"',
-            defaultValue: null,
-        }),
-    },
-};

package/src/mappings/CircleImage.js

@@ -1,25 +0,0 @@
-import { GROUPS, COMPONENT_TYPES, FORM_TYPES, PROP_TYPES, createImageProp, BLOCK_STYLES_SECTIONS, } from "@draftbit/types";
-export const SEED_DATA = {
-    name: "Circle Image",
-    tag: "CircleImage",
-    description: "A circle image",
-    category: COMPONENT_TYPES.deprecated,
-    stylesPanelSections: BLOCK_STYLES_SECTIONS,
-    props: {
-        source: createImageProp(),
-        size: {
-            group: GROUPS.basic,
-            label: "Size",
-            description: "Size of your circle image",
-            editable: true,
-            required: false,
-            formType: FORM_TYPES.number,
-            propType: PROP_TYPES.NUMBER,
-            min: 0,
-            max: 300,
-            precision: 0,
-            step: 1,
-            defaultValue: 60,
-        },
-    },
-};

package/src/mappings/Container.js

@@ -1,30 +0,0 @@
-import { GROUPS, COMPONENT_TYPES, FORM_TYPES, PROP_TYPES, createElevationType, createImageProp, createResizeModeProp, CONTAINER_COMPONENT_STYLES_SECTIONS, } from "@draftbit/types";
-export const SEED_DATA = {
-    name: "Container",
-    tag: "Container",
-    description: "A container component with gutter padding",
-    category: COMPONENT_TYPES.deprecated,
-    stylesPanelSections: CONTAINER_COMPONENT_STYLES_SECTIONS,
-    layout: {
-        height: 250,
-    },
-    props: {
-        useThemeGutterPadding: {
-            group: GROUPS.basic,
-            label: "Use gutter padding",
-            description: "When true, uses the theme gutter spacing as the container's horizontal padding",
-            formType: FORM_TYPES.boolean,
-            propType: PROP_TYPES.BOOLEAN,
-            defaultValue: false,
-            editable: false,
-            required: true,
-        },
-        backgroundImage: createImageProp({
-            label: "Background Image",
-            description: "Apply a custom background image",
-            defaultValue: null,
-        }),
-        backgroundImageResizeMode: createResizeModeProp(),
-        elevation: createElevationType(0),
-    },
-};

package/src/mappings/CustomCode.js

@@ -1,8 +0,0 @@
-import { COMPONENT_TYPES } from "@draftbit/types";
-export const SEED_DATA = {
-    name: "Custom Code",
-    tag: "CustomCode",
-    description: "A component that allows usage of custom code",
-    category: COMPONENT_TYPES.utility,
-    props: {},
-};

package/src/mappings/DatePicker.js

@@ -1,182 +0,0 @@
-import { COMPONENT_TYPES, FORM_TYPES, PROP_TYPES, FIELD_NAME, GROUPS, Triggers, StylesPanelSections, createNumberProp, createColorProp, createStaticBoolProp, } from "@draftbit/types";
-const SEED_DATA_PROPS = {
-    mode: {
-        label: "Mode",
-        description: "Choose between date, time and datetime",
-        defaultValue: "date",
-        editable: true,
-        required: true,
-        formType: FORM_TYPES.flatArray,
-        propType: PROP_TYPES.STRING,
-        options: ["date", "time", "datetime"],
-        group: GROUPS.basic,
-    },
-    label: {
-        label: "Label",
-        description: "The label to be displayed on the picker",
-        formType: FORM_TYPES.string,
-        propType: PROP_TYPES.STRING,
-        defaultValue: "Date",
-        editable: true,
-        required: true,
-        group: GROUPS.data,
-    },
-    labelSize: createNumberProp({
-        label: "Label Size",
-    }),
-    labelColor: createColorProp({
-        label: "Label Color",
-    }),
-    borderColor: createColorProp({
-        label: "Border Color",
-    }),
-    borderColorActive: createColorProp({
-        label: "Active Border Color",
-        description: "Color of border when date picker is active",
-    }),
-    format: {
-        label: "Format",
-        description: "Create an output format for the date.",
-        editable: true,
-        required: false,
-        formType: FORM_TYPES.string,
-        propType: PROP_TYPES.STRING,
-        defaultValue: null,
-        group: GROUPS.basic,
-    },
-    assistiveText: {
-        label: "Assistive text",
-        description: "Helper text to display below the picker",
-        formType: FORM_TYPES.string,
-        propType: PROP_TYPES.STRING,
-        defaultValue: null,
-        editable: true,
-        required: false,
-        group: GROUPS.basic,
-    },
-    // locale: {
-    //   label: "Locale",
-    //   description: "Locale for the datepicker. Must be a valid Locale",
-    //   formType: FORM_TYPES.string,
-    //   propType: PROP_TYPES.STRING,
-    //   defaultValue: null,
-    //   editable: true,
-    //   required: false,
-    //   group: GROUPS.basic,
-    // },
-    // minuteInterval: {
-    //   label: "Minute Interval",
-    //   description: "The interval at which minutes can be selected",
-    //   formType: FORM_TYPES.flatArray,
-    //   propType: PROP_TYPES.NUMBER,
-    //   options: [1, 2, 3, 4, 5, 6, 10, 12, 15, 20, 30],
-    //   defaultValue: null,
-    //   editable: true,
-    //   required: false,
-    //   group: GROUPS.basic,
-    // },
-    // timeZoneOffsetInMinutes: {
-    //   label: "Time zone offset",
-    //   description:
-    //     "By default, the datepicker uses the device's timezone. This will allow you to offset it",
-    //   formType: FORM_TYPES.number,
-    //   propType: PROP_TYPES.NUMBER,
-    //   defaultValue: null,
-    //   editable: true,
-    //   required: false,
-    //   group: GROUPS.basic,
-    // },
-    disabled: {
-        label: "Disabled",
-        description: "Whether the picker should be disabled. Will prevent selection and show a greyed out state.",
-        formType: FORM_TYPES.boolean,
-        propType: PROP_TYPES.BOOLEAN,
-        defaultValue: false,
-        editable: true,
-        required: false,
-        group: GROUPS.basic,
-    },
-    // error: {
-    //   label: "Error",
-    //   description: "Whether the picker should display the error state",
-    //   formType: FORM_TYPES.boolean,
-    //   propType: PROP_TYPES.BOOLEAN,
-    //   defaultValue: false,
-    //   editable: true,
-    //   required: false,
-    //   group: GROUPS.data,
-    // },
-    leftIconName: {
-        label: "Left icon name",
-        description: "The icon to display on the left",
-        formType: FORM_TYPES.icon,
-        propType: PROP_TYPES.STRING,
-        defaultValue: null,
-        editable: true,
-        required: false,
-        group: GROUPS.basic,
-    },
-    leftIconMode: {
-        label: "Left icon mode",
-        description: "The mode of the icon to display on the left. 'inset' or 'outset'.",
-        formType: FORM_TYPES.flatArray,
-        propType: PROP_TYPES.STRING,
-        defaultValue: "inset",
-        options: ["inset", "outset"],
-        editable: true,
-        required: true,
-        group: GROUPS.basic,
-    },
-    rightIconName: {
-        label: "Right icon name",
-        description: "The icon to display on the right",
-        formType: FORM_TYPES.icon,
-        propType: PROP_TYPES.STRING,
-        defaultValue: null,
-        editable: true,
-        required: false,
-        group: GROUPS.basic,
-    },
-    fieldName: {
-        ...FIELD_NAME,
-        handlerPropName: "onDateChange",
-        valuePropName: "date",
-        defaultValue: "date",
-    },
-};
-export const SEED_DATA = [
-    {
-        name: "Date Picker",
-        tag: "DatePicker",
-        description: "A component used to select a date from a visual calendar",
-        category: COMPONENT_TYPES.input,
-        layout: null,
-        triggers: [Triggers.OnDateChange],
-        stylesPanelSections: [
-            StylesPanelSections.Typography,
-            StylesPanelSections.Background,
-            StylesPanelSections.Size,
-            StylesPanelSections.MarginsAndPaddings,
-            StylesPanelSections.Position,
-        ],
-        props: {
-            ...SEED_DATA_PROPS,
-            type: {
-                label: "Appearance",
-                description: "Type of Datepicker",
-                formType: FORM_TYPES.flatArray,
-                propType: PROP_TYPES.STRING,
-                defaultValue: "solid",
-                options: ["solid", "underline"],
-                editable: true,
-                required: true,
-                group: GROUPS.basic,
-            },
-            autoDismissKeyboard: createStaticBoolProp({
-                label: "Auto dismiss keyboard",
-                description: "Automatically dismiss keyboard when DatePicker is opened",
-                defaultValue: true,
-            }),
-        },
-    },
-];

package/src/mappings/DeckSwiper.js

@@ -1,48 +0,0 @@
-import { COMPONENT_TYPES, Triggers, createActionProp, createStaticNumberProp, createStaticBoolProp, BLOCK_STYLES_SECTIONS, } from "@draftbit/types";
-export const SEED_DATA = {
-    name: "Deck Swiper",
-    tag: "DeckSwiper",
-    description: "Deck swiper container",
-    category: COMPONENT_TYPES.swiper,
-    stylesPanelSections: BLOCK_STYLES_SECTIONS,
-    layout: {
-        width: "100%",
-    },
-    triggers: [Triggers.OnIndexChanged, Triggers.OnEndReached],
-    props: {
-        onIndexChanged: createActionProp({
-            label: "On index changed",
-            description: "Action to execute when swipe to new index",
-        }),
-        onEndReached: createActionProp({
-            label: "On end reached",
-            description: "Action to execute when end of swiping reached",
-        }),
-        startCardIndex: createStaticNumberProp({
-            label: "Start card index",
-            description: "Index of card to start swiping from",
-            defaultValue: 0,
-        }),
-        infiniteSwiping: createStaticBoolProp({
-            label: "Infinite swiping",
-            description: "Whether to infinitley loop through cards or not",
-        }),
-        verticalEnabled: createStaticBoolProp({
-            label: "Vertical swipe enabled",
-            description: "Whether cards should be swipeable vertically or not",
-            defaultValue: true,
-        }),
-        horizontalEnabled: createStaticBoolProp({
-            label: "Horizontal swipe enabled",
-            description: "Whether cards should be swipeable horizontally or not",
-            defaultValue: true,
-        }),
-        visibleCardCount: createStaticNumberProp({
-            label: "Visible card count",
-            description: "Number of cards visible behind (and including) the current card",
-            defaultValue: 1,
-            min: 1,
-            step: 1,
-        }),
-    },
-};

package/src/mappings/DeckSwiperCard.js

@@ -1,16 +0,0 @@
-import { COMPONENT_TYPES, CONTAINER_COMPONENT_STYLES_SECTIONS, } from "@draftbit/types";
-export const SEED_DATA = {
-    name: "Deck Swiper Card",
-    tag: "DeckSwiperCard",
-    description: "Single Deck Swiper Card item to be used in DeckSwiper",
-    category: COMPONENT_TYPES.swiper,
-    stylesPanelSections: CONTAINER_COMPONENT_STYLES_SECTIONS,
-    layout: {
-        flex: 1,
-        alignItems: "center",
-        justifyContent: "center",
-        padding: 20,
-        borderWidth: 2,
-    },
-    props: {},
-};

package/src/mappings/Divider.js

@@ -1,27 +0,0 @@
-import { GROUPS, FORM_TYPES, PROP_TYPES, COMPONENT_TYPES, BLOCK_STYLES_SECTIONS, } from "@draftbit/types";
-export const SEED_DATA = [
-    {
-        name: "Divider",
-        tag: "Divider",
-        category: COMPONENT_TYPES.layout,
-        stylesPanelSections: BLOCK_STYLES_SECTIONS,
-        description: "A horizontal line used to divide content",
-        preview_image_url: "{CLOUDINARY_URL}/Divider.png",
-        supports_list_render: false,
-        props: {
-            color: {
-                group: GROUPS.basic,
-                label: "Color",
-                description: "The color of the divider",
-                editable: true,
-                required: false,
-                defaultValue: "divider",
-                formType: FORM_TYPES.color,
-                propType: PROP_TYPES.THEME,
-            },
-        },
-        layout: {
-            height: 1,
-        },
-    },
-];

package/src/mappings/FAB.js

@@ -1,37 +0,0 @@
-import { COMPONENT_TYPES, createIconProp, createColorProp, GROUPS, createBoolProp, createIconSizeProp, createActionProp, Triggers, BLOCK_STYLES_SECTIONS, } from "@draftbit/types";
-export const SEED_DATA = {
-    name: "FAB",
-    tag: "FAB",
-    category: COMPONENT_TYPES.deprecated,
-    stylesPanelSections: BLOCK_STYLES_SECTIONS,
-    description: "A mini round icon FAB",
-    layout: {},
-    triggers: [Triggers.OnPress],
-    props: {
-        onPress: createActionProp(),
-        disabled: createBoolProp({
-            label: "Disabled",
-            group: GROUPS.basic,
-        }),
-        loading: createBoolProp({
-            label: "Loading",
-            group: GROUPS.basic,
-        }),
-        iconName: createIconProp({
-            label: "Icon",
-            defaultValue: null,
-            group: GROUPS.basic,
-        }),
-        iconColor: createColorProp({
-            label: "Icon color",
-            defaultValue: null,
-            group: GROUPS.basic,
-        }),
-        bgColor: createColorProp({
-            label: "Background color",
-            defaultValue: null,
-            group: GROUPS.basic,
-        }),
-        size: createIconSizeProp(),
-    },
-};

package/src/mappings/Fetch.js

@@ -1,13 +0,0 @@
-import { COMPONENT_TYPES, StylesPanelSections } from "@draftbit/types";
-/* TODO remove, still used inside the builder in a weird way */
-export const SEED_DATA = {
-    name: "Fetch",
-    tag: "Fetch",
-    description: "Rest API Declarative Fetch component. Uses react-request internally",
-    category: COMPONENT_TYPES.data,
-    stylesPanelSections: [StylesPanelSections.NoStyles],
-    layout: {
-        minHeight: 40,
-    },
-    props: {},
-};

package/src/mappings/FieldSearchBarFull.js

@@ -1,50 +0,0 @@
-import { GROUPS, COMPONENT_TYPES, FORM_TYPES, PROP_TYPES, FIELD_NAME, Triggers, BLOCK_STYLES_SECTIONS, } from "@draftbit/types";
-export const SEED_DATA = [
-    {
-        name: "Search Bar",
-        tag: "FieldSearchBarFull",
-        description: "A search bar with accompanying search icon and clear button.",
-        category: COMPONENT_TYPES.deprecated,
-        stylesPanelSections: BLOCK_STYLES_SECTIONS,
-        preview_image_url: "{CLOUDINARY_URL}/Field_SearchBar_Full.png",
-        supports_list_render: false,
-        triggers: [Triggers.OnChange],
-        props: {
-            icon: {
-                group: GROUPS.basic,
-                label: "Icon",
-                description: "Left icon to display",
-                formType: FORM_TYPES.icon,
-                propType: PROP_TYPES.ASSET,
-                defaultValue: null,
-                editable: true,
-                required: false,
-            },
-            placeholder: {
-                group: GROUPS.basic,
-                label: "Placeholder",
-                description: "Input placeholder text",
-                formType: FORM_TYPES.string,
-                propType: PROP_TYPES.STRING,
-                defaultValue: "Search for...",
-                editable: true,
-                required: false,
-            },
-            onSubmit: {
-                group: GROUPS.basic,
-                label: "Submit action",
-                description: "Action to execute on submission",
-                editable: true,
-                required: false,
-                formType: FORM_TYPES.action,
-                propType: PROP_TYPES.STRING,
-                defaultValue: null,
-            },
-            fieldName: {
-                ...FIELD_NAME,
-                defaultValue: "searchBarValue",
-            },
-        },
-        layout: {},
-    },
-];

package/src/mappings/FlashList.js

@@ -1,113 +0,0 @@
-import { COMPONENT_TYPES, createNumColumnsType, createStaticBoolProp, createNumberProp, CONTAINER_COMPONENT_STYLES_SECTIONS, GROUPS, Triggers, createActionProp, createStaticNumberProp, createColorProp, } from "@draftbit/types";
-export const SEED_DATA = [
-    {
-        name: "Masonry List",
-        tag: "MasonryFlashList",
-        description: "Masonry Flashlist by Shopify",
-        packageName: "@shopify/flash-list",
-        category: COMPONENT_TYPES.data,
-        stylesPanelSections: CONTAINER_COMPONENT_STYLES_SECTIONS,
-        layout: {
-            flex: 1,
-        },
-        triggers: [Triggers.OnRefresh, Triggers.OnEndReached],
-        props: {
-            onRefresh: createActionProp(),
-            onEndReached: createActionProp(),
-            numColumns: createNumColumnsType({
-                editable: true,
-            }),
-            estimatedItemSize: createNumberProp({
-                group: GROUPS.basic,
-                label: "Est. Item Size",
-                description: "Approximate size of the items before rendering.",
-                defaultValue: 50,
-                step: 1,
-                precision: 0,
-            }),
-            initialNumToRender: createStaticNumberProp({
-                label: "Initial Num To Render",
-                description: "How many items to render in the initial batch",
-                defaultValue: null,
-            }),
-            onEndReachedThreshold: createStaticNumberProp({
-                label: "End Reached Threshold",
-                description: "How far from the end (in units of visible length of the list) the bottom edge of the list must be from the end of the content to trigger the onEndReached callback. Thus a value of 0.5 will trigger onEndReached when the end of the content is within half the visible length of the list.",
-                defaultValue: 0.5,
-            }),
-            refreshColor: createColorProp({
-                label: "Refreshing Color",
-                description: "Color of the refresh indicator",
-            }),
-            showsHorizontalScrollIndicator: createStaticBoolProp({
-                label: "Show Horizontal Scroll Indicator",
-                description: "When true, shows a horizontal scroll indicator. The default value is true.",
-                defaultValue: true,
-            }),
-            showsVerticalScrollIndicator: createStaticBoolProp({
-                label: "Show Vertical Scroll Indicator",
-                description: "When true, shows a vertical scroll indicator. The default value is true.",
-                defaultValue: true,
-            }),
-        },
-    },
-    {
-        name: "FlashList",
-        tag: "FlashList",
-        description: "Flashlist by Shopify",
-        packageName: "@shopify/flash-list",
-        category: COMPONENT_TYPES.data,
-        stylesPanelSections: CONTAINER_COMPONENT_STYLES_SECTIONS,
-        layout: {
-            flex: 1,
-        },
-        triggers: [Triggers.OnRefresh, Triggers.OnEndReached],
-        props: {
-            onRefresh: createActionProp(),
-            onEndReached: createActionProp(),
-            estimatedItemSize: createNumberProp({
-                group: GROUPS.basic,
-                label: "Est. Item Size",
-                description: "Approximate size of the items before rendering.",
-                defaultValue: 50,
-                step: 1,
-                precision: 0,
-            }),
-            horizontal: createStaticBoolProp({
-                label: "Horizontal",
-                description: "Render list horizontally",
-            }),
-            inverted: createStaticBoolProp({
-                label: "Inverted",
-                description: "If true, reverses the direction.",
-            }),
-            numColumns: createNumColumnsType({
-                editable: true,
-            }),
-            initialNumToRender: createStaticNumberProp({
-                label: "Initial Num To Render",
-                description: "How many items to render in the initial batch",
-                defaultValue: null,
-            }),
-            onEndReachedThreshold: createStaticNumberProp({
-                label: "End Reached Threshold",
-                description: "How far from the end (in units of visible length of the list) the bottom edge of the list must be from the end of the content to trigger the onEndReached callback. Thus a value of 0.5 will trigger onEndReached when the end of the content is within half the visible length of the list.",
-                defaultValue: 0.5,
-            }),
-            refreshColor: createColorProp({
-                label: "Refreshing Color",
-                description: "Color of the refresh indicator",
-            }),
-            showsHorizontalScrollIndicator: createStaticBoolProp({
-                label: "Show Horizontal Scroll Indicator",
-                description: "When true, shows a horizontal scroll indicator. The default value is true.",
-                defaultValue: true,
-            }),
-            showsVerticalScrollIndicator: createStaticBoolProp({
-                label: "Show Vertical Scroll Indicator",
-                description: "When true, shows a vertical scroll indicator. The default value is true.",
-                defaultValue: true,
-            }),
-        },
-    },
-];

package/src/mappings/FlatList.js

@@ -1,51 +0,0 @@
-import { COMPONENT_TYPES, createNumColumnsType, createStaticBoolProp, CONTAINER_COMPONENT_STYLES_SECTIONS, Triggers, createActionProp, createStaticNumberProp, createColorProp, } from "@draftbit/types";
-export const SEED_DATA = {
-    name: "List",
-    tag: "FlatList",
-    description: "A basic List component",
-    category: COMPONENT_TYPES.data,
-    stylesPanelSections: CONTAINER_COMPONENT_STYLES_SECTIONS,
-    layout: {
-        flex: 1,
-    },
-    triggers: [Triggers.OnRefresh, Triggers.OnEndReached],
-    props: {
-        onRefresh: createActionProp(),
-        onEndReached: createActionProp(),
-        horizontal: createStaticBoolProp({
-            label: "Horizontal",
-            description: "Render list horizontally",
-        }),
-        inverted: createStaticBoolProp({
-            label: "Inverted",
-            description: "If true, reverses the direction.",
-        }),
-        numColumns: createNumColumnsType({
-            editable: true,
-        }),
-        initialNumToRender: createStaticNumberProp({
-            label: "Initial Num To Render",
-            description: "How many items to render in the initial batch",
-            defaultValue: null,
-        }),
-        onEndReachedThreshold: createStaticNumberProp({
-            label: "End Reached Threshold",
-            description: "How far from the end (in units of visible length of the list) the bottom edge of the list must be from the end of the content to trigger the onEndReached callback. Thus a value of 0.5 will trigger onEndReached when the end of the content is within half the visible length of the list.",
-            defaultValue: 0.5,
-        }),
-        refreshColor: createColorProp({
-            label: "Refreshing Color",
-            description: "Color of the refresh indicator",
-        }),
-        showsHorizontalScrollIndicator: createStaticBoolProp({
-            label: "Show Horizontal Scroll Indicator",
-            description: "When true, shows a horizontal scroll indicator. The default value is true.",
-            defaultValue: true,
-        }),
-        showsVerticalScrollIndicator: createStaticBoolProp({
-            label: "Show Vertical Scroll Indicator",
-            description: "When true, shows a vertical scroll indicator. The default value is true.",
-            defaultValue: true,
-        }),
-    },
-};