@draftbit/core 46.1.4 → 46.2.1-328765.5

package/lib/module/mappings/Container.js

@@ -1,9 +1,10 @@
-import { GROUPS, COMPONENT_TYPES, FORM_TYPES, PROP_TYPES, createElevationType, createImageProp, createResizeModeProp } from "@draftbit/types";
+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
   },

package/lib/module/mappings/Container.js.map

@@ -1 +1 @@
-{"version":3,"names":["GROUPS","COMPONENT_TYPES","FORM_TYPES","PROP_TYPES","createElevationType","createImageProp","createResizeModeProp","SEED_DATA","name","tag","description","category","deprecated","layout","height","props","useThemeGutterPadding","group","basic","label","formType","boolean","propType","BOOLEAN","defaultValue","editable","required","backgroundImage","backgroundImageResizeMode","elevation"],"sources":["Container.ts"],"sourcesContent":["import {\n  GROUPS,\n  COMPONENT_TYPES,\n  FORM_TYPES,\n  PROP_TYPES,\n  createElevationType,\n  createImageProp,\n  createResizeModeProp,\n} from \"@draftbit/types\";\n\nexport const SEED_DATA = {\n  name: \"Container\",\n  tag: \"Container\",\n  description: \"A container component with gutter padding\",\n  category: COMPONENT_TYPES.deprecated,\n  layout: {\n    height: 250,\n  },\n  props: {\n    useThemeGutterPadding: {\n      group: GROUPS.basic,\n      label: \"Use gutter padding\",\n      description:\n        \"When true, uses the theme gutter spacing as the container's horizontal padding\",\n      formType: FORM_TYPES.boolean,\n      propType: PROP_TYPES.BOOLEAN,\n      defaultValue: false,\n      editable: false,\n      required: true,\n    },\n    backgroundImage: createImageProp({\n      label: \"Background Image\",\n      description: \"Apply a custom background image\",\n      defaultValue: null,\n    }),\n    backgroundImageResizeMode: createResizeModeProp(),\n    elevation: createElevationType(0),\n  },\n};\n"],"mappings":"AAAA,SACEA,MADF,EAEEC,eAFF,EAGEC,UAHF,EAIEC,UAJF,EAKEC,mBALF,EAMEC,eANF,EAOEC,oBAPF,QAQO,iBARP;AAUA,OAAO,MAAMC,SAAS,GAAG;EACvBC,IAAI,EAAE,WADiB;EAEvBC,GAAG,EAAE,WAFkB;EAGvBC,WAAW,EAAE,2CAHU;EAIvBC,QAAQ,EAAEV,eAAe,CAACW,UAJH;EAKvBC,MAAM,EAAE;IACNC,MAAM,EAAE;EADF,CALe;EAQvBC,KAAK,EAAE;IACLC,qBAAqB,EAAE;MACrBC,KAAK,EAAEjB,MAAM,CAACkB,KADO;MAErBC,KAAK,EAAE,oBAFc;MAGrBT,WAAW,EACT,gFAJmB;MAKrBU,QAAQ,EAAElB,UAAU,CAACmB,OALA;MAMrBC,QAAQ,EAAEnB,UAAU,CAACoB,OANA;MAOrBC,YAAY,EAAE,KAPO;MAQrBC,QAAQ,EAAE,KARW;MASrBC,QAAQ,EAAE;IATW,CADlB;IAYLC,eAAe,EAAEtB,eAAe,CAAC;MAC/Bc,KAAK,EAAE,kBADwB;MAE/BT,WAAW,EAAE,iCAFkB;MAG/Bc,YAAY,EAAE;IAHiB,CAAD,CAZ3B;IAiBLI,yBAAyB,EAAEtB,oBAAoB,EAjB1C;IAkBLuB,SAAS,EAAEzB,mBAAmB,CAAC,CAAD;EAlBzB;AARgB,CAAlB"}
+{"version":3,"names":["GROUPS","COMPONENT_TYPES","FORM_TYPES","PROP_TYPES","createElevationType","createImageProp","createResizeModeProp","CONTAINER_COMPONENT_STYLES_SECTIONS","SEED_DATA","name","tag","description","category","deprecated","stylesPanelSections","layout","height","props","useThemeGutterPadding","group","basic","label","formType","boolean","propType","BOOLEAN","defaultValue","editable","required","backgroundImage","backgroundImageResizeMode","elevation"],"sources":["Container.ts"],"sourcesContent":["import {\n  GROUPS,\n  COMPONENT_TYPES,\n  FORM_TYPES,\n  PROP_TYPES,\n  createElevationType,\n  createImageProp,\n  createResizeModeProp,\n  CONTAINER_COMPONENT_STYLES_SECTIONS,\n} from \"@draftbit/types\";\n\nexport const SEED_DATA = {\n  name: \"Container\",\n  tag: \"Container\",\n  description: \"A container component with gutter padding\",\n  category: COMPONENT_TYPES.deprecated,\n  stylesPanelSections: CONTAINER_COMPONENT_STYLES_SECTIONS,\n  layout: {\n    height: 250,\n  },\n  props: {\n    useThemeGutterPadding: {\n      group: GROUPS.basic,\n      label: \"Use gutter padding\",\n      description:\n        \"When true, uses the theme gutter spacing as the container's horizontal padding\",\n      formType: FORM_TYPES.boolean,\n      propType: PROP_TYPES.BOOLEAN,\n      defaultValue: false,\n      editable: false,\n      required: true,\n    },\n    backgroundImage: createImageProp({\n      label: \"Background Image\",\n      description: \"Apply a custom background image\",\n      defaultValue: null,\n    }),\n    backgroundImageResizeMode: createResizeModeProp(),\n    elevation: createElevationType(0),\n  },\n};\n"],"mappings":"AAAA,SACEA,MADF,EAEEC,eAFF,EAGEC,UAHF,EAIEC,UAJF,EAKEC,mBALF,EAMEC,eANF,EAOEC,oBAPF,EAQEC,mCARF,QASO,iBATP;AAWA,OAAO,MAAMC,SAAS,GAAG;EACvBC,IAAI,EAAE,WADiB;EAEvBC,GAAG,EAAE,WAFkB;EAGvBC,WAAW,EAAE,2CAHU;EAIvBC,QAAQ,EAAEX,eAAe,CAACY,UAJH;EAKvBC,mBAAmB,EAAEP,mCALE;EAMvBQ,MAAM,EAAE;IACNC,MAAM,EAAE;EADF,CANe;EASvBC,KAAK,EAAE;IACLC,qBAAqB,EAAE;MACrBC,KAAK,EAAEnB,MAAM,CAACoB,KADO;MAErBC,KAAK,EAAE,oBAFc;MAGrBV,WAAW,EACT,gFAJmB;MAKrBW,QAAQ,EAAEpB,UAAU,CAACqB,OALA;MAMrBC,QAAQ,EAAErB,UAAU,CAACsB,OANA;MAOrBC,YAAY,EAAE,KAPO;MAQrBC,QAAQ,EAAE,KARW;MASrBC,QAAQ,EAAE;IATW,CADlB;IAYLC,eAAe,EAAExB,eAAe,CAAC;MAC/BgB,KAAK,EAAE,kBADwB;MAE/BV,WAAW,EAAE,iCAFkB;MAG/Be,YAAY,EAAE;IAHiB,CAAD,CAZ3B;IAiBLI,yBAAyB,EAAExB,oBAAoB,EAjB1C;IAkBLyB,SAAS,EAAE3B,mBAAmB,CAAC,CAAD;EAlBzB;AATgB,CAAlB"}

package/lib/module/mappings/DatePicker.js

@@ -21,6 +21,16 @@ const SEED_DATA_PROPS = {
     options: ["date", "time", "datetime"],
     group: GROUPS.basic
   },
+  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",

package/lib/module/mappings/DatePicker.js.map

@@ -1 +1 @@
-{"version":3,"names":["COMPONENT_TYPES","FORM_TYPES","PROP_TYPES","FIELD_NAME","GROUPS","Triggers","SEED_DATA_PROPS","label","description","formType","string","propType","STRING","defaultValue","editable","required","group","data","mode","flatArray","options","basic","assistiveText","disabled","boolean","BOOLEAN","leftIconName","icon","leftIconMode","rightIconName","fieldName","handlerPropName","valuePropName","SEED_DATA","name","tag","category","input","layout","triggers","OnDateChange","props","type"],"sources":["DatePicker.ts"],"sourcesContent":["import {\n  COMPONENT_TYPES,\n  FORM_TYPES,\n  PROP_TYPES,\n  FIELD_NAME,\n  GROUPS,\n  Triggers,\n} from \"@draftbit/types\";\n\nconst SEED_DATA_PROPS = {\n  label: {\n    label: \"Label\",\n    description: \"The label to be displayed on the picker\",\n    formType: FORM_TYPES.string,\n    propType: PROP_TYPES.STRING,\n    defaultValue: \"Date\",\n    editable: true,\n    required: true,\n    group: GROUPS.data,\n  },\n  mode: {\n    label: \"Mode\",\n    description: \"Choose between date, time and datetime\",\n    defaultValue: \"date\",\n    editable: true,\n    required: true,\n    formType: FORM_TYPES.flatArray,\n    propType: PROP_TYPES.STRING,\n    options: [\"date\", \"time\", \"datetime\"],\n    group: GROUPS.basic,\n  },\n  assistiveText: {\n    label: \"Assistive text\",\n    description: \"Helper text to display below the picker\",\n    formType: FORM_TYPES.string,\n    propType: PROP_TYPES.STRING,\n    defaultValue: null,\n    editable: true,\n    required: false,\n    group: GROUPS.basic,\n  },\n  // locale: {\n  //   label: \"Locale\",\n  //   description: \"Locale for the datepicker. Must be a valid Locale\",\n  //   formType: FORM_TYPES.string,\n  //   propType: PROP_TYPES.STRING,\n  //   defaultValue: null,\n  //   editable: true,\n  //   required: false,\n  //   group: GROUPS.basic,\n  // },\n  // minuteInterval: {\n  //   label: \"Minute Interval\",\n  //   description: \"The interval at which minutes can be selected\",\n  //   formType: FORM_TYPES.flatArray,\n  //   propType: PROP_TYPES.NUMBER,\n  //   options: [1, 2, 3, 4, 5, 6, 10, 12, 15, 20, 30],\n  //   defaultValue: null,\n  //   editable: true,\n  //   required: false,\n  //   group: GROUPS.basic,\n  // },\n  // timeZoneOffsetInMinutes: {\n  //   label: \"Time zone offset\",\n  //   description:\n  //     \"By default, the datepicker uses the device's timezone. This will allow you to offset it\",\n  //   formType: FORM_TYPES.number,\n  //   propType: PROP_TYPES.NUMBER,\n  //   defaultValue: null,\n  //   editable: true,\n  //   required: false,\n  //   group: GROUPS.basic,\n  // },\n  disabled: {\n    label: \"Disabled\",\n    description:\n      \"Whether the picker should be disabled. Will prevent selection and show a greyed out state.\",\n    formType: FORM_TYPES.boolean,\n    propType: PROP_TYPES.BOOLEAN,\n    defaultValue: false,\n    editable: true,\n    required: false,\n    group: GROUPS.basic,\n  },\n  // error: {\n  //   label: \"Error\",\n  //   description: \"Whether the picker should display the error state\",\n  //   formType: FORM_TYPES.boolean,\n  //   propType: PROP_TYPES.BOOLEAN,\n  //   defaultValue: false,\n  //   editable: true,\n  //   required: false,\n  //   group: GROUPS.data,\n  // },\n  leftIconName: {\n    label: \"Left icon name\",\n    description: \"The icon to display on the left\",\n    formType: FORM_TYPES.icon,\n    propType: PROP_TYPES.STRING,\n    defaultValue: null,\n    editable: true,\n    required: false,\n    group: GROUPS.basic,\n  },\n  leftIconMode: {\n    label: \"Left icon mode\",\n    description:\n      \"The mode of the icon to display on the left. 'inset' or 'outset'.\",\n    formType: FORM_TYPES.flatArray,\n    propType: PROP_TYPES.STRING,\n    defaultValue: \"inset\",\n    options: [\"inset\", \"outset\"],\n    editable: true,\n    required: true,\n    group: GROUPS.basic,\n  },\n  rightIconName: {\n    label: \"Right icon name\",\n    description: \"The icon to display on the right\",\n    formType: FORM_TYPES.icon,\n    propType: PROP_TYPES.STRING,\n    defaultValue: null,\n    editable: true,\n    required: false,\n    group: GROUPS.basic,\n  },\n  fieldName: {\n    ...FIELD_NAME,\n    handlerPropName: \"onDateChange\",\n    valuePropName: \"date\",\n    defaultValue: \"date\",\n  },\n};\n\nexport const SEED_DATA = [\n  {\n    name: \"Date Picker\",\n    tag: \"DatePicker\",\n    description: \"A component used to select a date from a visual calendar\",\n    category: COMPONENT_TYPES.input,\n    layout: null,\n    triggers: [Triggers.OnDateChange],\n    props: {\n      ...SEED_DATA_PROPS,\n      type: {\n        label: \"Appearance\",\n        description: \"Type of Datepicker\",\n        formType: FORM_TYPES.flatArray,\n        propType: PROP_TYPES.STRING,\n        defaultValue: \"solid\",\n        options: [\"solid\", \"underline\"],\n        editable: true,\n        required: true,\n        group: GROUPS.basic,\n      },\n    },\n  },\n];\n"],"mappings":"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"}
+{"version":3,"names":["COMPONENT_TYPES","FORM_TYPES","PROP_TYPES","FIELD_NAME","GROUPS","Triggers","SEED_DATA_PROPS","label","description","formType","string","propType","STRING","defaultValue","editable","required","group","data","mode","flatArray","options","basic","format","assistiveText","disabled","boolean","BOOLEAN","leftIconName","icon","leftIconMode","rightIconName","fieldName","handlerPropName","valuePropName","SEED_DATA","name","tag","category","input","layout","triggers","OnDateChange","props","type"],"sources":["DatePicker.ts"],"sourcesContent":["import {\n  COMPONENT_TYPES,\n  FORM_TYPES,\n  PROP_TYPES,\n  FIELD_NAME,\n  GROUPS,\n  Triggers,\n} from \"@draftbit/types\";\n\nconst SEED_DATA_PROPS = {\n  label: {\n    label: \"Label\",\n    description: \"The label to be displayed on the picker\",\n    formType: FORM_TYPES.string,\n    propType: PROP_TYPES.STRING,\n    defaultValue: \"Date\",\n    editable: true,\n    required: true,\n    group: GROUPS.data,\n  },\n  mode: {\n    label: \"Mode\",\n    description: \"Choose between date, time and datetime\",\n    defaultValue: \"date\",\n    editable: true,\n    required: true,\n    formType: FORM_TYPES.flatArray,\n    propType: PROP_TYPES.STRING,\n    options: [\"date\", \"time\", \"datetime\"],\n    group: GROUPS.basic,\n  },\n  format: {\n    label: \"Format\",\n    description: \"Create an output format for the date.\",\n    editable: true,\n    required: false,\n    formType: FORM_TYPES.string,\n    propType: PROP_TYPES.STRING,\n    defaultValue: null,\n    group: GROUPS.basic,\n  },\n  assistiveText: {\n    label: \"Assistive text\",\n    description: \"Helper text to display below the picker\",\n    formType: FORM_TYPES.string,\n    propType: PROP_TYPES.STRING,\n    defaultValue: null,\n    editable: true,\n    required: false,\n    group: GROUPS.basic,\n  },\n  // locale: {\n  //   label: \"Locale\",\n  //   description: \"Locale for the datepicker. Must be a valid Locale\",\n  //   formType: FORM_TYPES.string,\n  //   propType: PROP_TYPES.STRING,\n  //   defaultValue: null,\n  //   editable: true,\n  //   required: false,\n  //   group: GROUPS.basic,\n  // },\n  // minuteInterval: {\n  //   label: \"Minute Interval\",\n  //   description: \"The interval at which minutes can be selected\",\n  //   formType: FORM_TYPES.flatArray,\n  //   propType: PROP_TYPES.NUMBER,\n  //   options: [1, 2, 3, 4, 5, 6, 10, 12, 15, 20, 30],\n  //   defaultValue: null,\n  //   editable: true,\n  //   required: false,\n  //   group: GROUPS.basic,\n  // },\n  // timeZoneOffsetInMinutes: {\n  //   label: \"Time zone offset\",\n  //   description:\n  //     \"By default, the datepicker uses the device's timezone. This will allow you to offset it\",\n  //   formType: FORM_TYPES.number,\n  //   propType: PROP_TYPES.NUMBER,\n  //   defaultValue: null,\n  //   editable: true,\n  //   required: false,\n  //   group: GROUPS.basic,\n  // },\n  disabled: {\n    label: \"Disabled\",\n    description:\n      \"Whether the picker should be disabled. Will prevent selection and show a greyed out state.\",\n    formType: FORM_TYPES.boolean,\n    propType: PROP_TYPES.BOOLEAN,\n    defaultValue: false,\n    editable: true,\n    required: false,\n    group: GROUPS.basic,\n  },\n  // error: {\n  //   label: \"Error\",\n  //   description: \"Whether the picker should display the error state\",\n  //   formType: FORM_TYPES.boolean,\n  //   propType: PROP_TYPES.BOOLEAN,\n  //   defaultValue: false,\n  //   editable: true,\n  //   required: false,\n  //   group: GROUPS.data,\n  // },\n  leftIconName: {\n    label: \"Left icon name\",\n    description: \"The icon to display on the left\",\n    formType: FORM_TYPES.icon,\n    propType: PROP_TYPES.STRING,\n    defaultValue: null,\n    editable: true,\n    required: false,\n    group: GROUPS.basic,\n  },\n  leftIconMode: {\n    label: \"Left icon mode\",\n    description:\n      \"The mode of the icon to display on the left. 'inset' or 'outset'.\",\n    formType: FORM_TYPES.flatArray,\n    propType: PROP_TYPES.STRING,\n    defaultValue: \"inset\",\n    options: [\"inset\", \"outset\"],\n    editable: true,\n    required: true,\n    group: GROUPS.basic,\n  },\n  rightIconName: {\n    label: \"Right icon name\",\n    description: \"The icon to display on the right\",\n    formType: FORM_TYPES.icon,\n    propType: PROP_TYPES.STRING,\n    defaultValue: null,\n    editable: true,\n    required: false,\n    group: GROUPS.basic,\n  },\n  fieldName: {\n    ...FIELD_NAME,\n    handlerPropName: \"onDateChange\",\n    valuePropName: \"date\",\n    defaultValue: \"date\",\n  },\n};\n\nexport const SEED_DATA = [\n  {\n    name: \"Date Picker\",\n    tag: \"DatePicker\",\n    description: \"A component used to select a date from a visual calendar\",\n    category: COMPONENT_TYPES.input,\n    layout: null,\n    triggers: [Triggers.OnDateChange],\n    props: {\n      ...SEED_DATA_PROPS,\n      type: {\n        label: \"Appearance\",\n        description: \"Type of Datepicker\",\n        formType: FORM_TYPES.flatArray,\n        propType: PROP_TYPES.STRING,\n        defaultValue: \"solid\",\n        options: [\"solid\", \"underline\"],\n        editable: true,\n        required: true,\n        group: GROUPS.basic,\n      },\n    },\n  },\n];\n"],"mappings":"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"}

package/lib/module/mappings/Divider.js

@@ -1,8 +1,9 @@
-import { GROUPS, FORM_TYPES, PROP_TYPES, COMPONENT_TYPES } from "@draftbit/types";
+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,

package/lib/module/mappings/Divider.js.map

@@ -1 +1 @@
-{"version":3,"names":["GROUPS","FORM_TYPES","PROP_TYPES","COMPONENT_TYPES","SEED_DATA","name","tag","category","layout","description","preview_image_url","supports_list_render","props","color","group","basic","label","editable","required","defaultValue","formType","propType","THEME","height"],"sources":["Divider.ts"],"sourcesContent":["import {\n  GROUPS,\n  FORM_TYPES,\n  PROP_TYPES,\n  COMPONENT_TYPES,\n} from \"@draftbit/types\";\n\nexport const SEED_DATA = [\n  {\n    name: \"Divider\",\n    tag: \"Divider\",\n    category: COMPONENT_TYPES.layout,\n    description: \"A horizontal line used to divide content\",\n    preview_image_url: \"{CLOUDINARY_URL}/Divider.png\",\n    supports_list_render: false,\n    props: {\n      color: {\n        group: GROUPS.basic,\n        label: \"Color\",\n        description: \"The color of the divider\",\n        editable: true,\n        required: false,\n        defaultValue: \"divider\",\n        formType: FORM_TYPES.color,\n        propType: PROP_TYPES.THEME,\n      },\n    },\n    layout: {\n      height: 1,\n    },\n  },\n];\n"],"mappings":"AAAA,SACEA,MADF,EAEEC,UAFF,EAGEC,UAHF,EAIEC,eAJF,QAKO,iBALP;AAOA,OAAO,MAAMC,SAAS,GAAG,CACvB;EACEC,IAAI,EAAE,SADR;EAEEC,GAAG,EAAE,SAFP;EAGEC,QAAQ,EAAEJ,eAAe,CAACK,MAH5B;EAIEC,WAAW,EAAE,0CAJf;EAKEC,iBAAiB,EAAE,8BALrB;EAMEC,oBAAoB,EAAE,KANxB;EAOEC,KAAK,EAAE;IACLC,KAAK,EAAE;MACLC,KAAK,EAAEd,MAAM,CAACe,KADT;MAELC,KAAK,EAAE,OAFF;MAGLP,WAAW,EAAE,0BAHR;MAILQ,QAAQ,EAAE,IAJL;MAKLC,QAAQ,EAAE,KALL;MAMLC,YAAY,EAAE,SANT;MAOLC,QAAQ,EAAEnB,UAAU,CAACY,KAPhB;MAQLQ,QAAQ,EAAEnB,UAAU,CAACoB;IARhB;EADF,CAPT;EAmBEd,MAAM,EAAE;IACNe,MAAM,EAAE;EADF;AAnBV,CADuB,CAAlB"}
+{"version":3,"names":["GROUPS","FORM_TYPES","PROP_TYPES","COMPONENT_TYPES","BLOCK_STYLES_SECTIONS","SEED_DATA","name","tag","category","layout","stylesPanelSections","description","preview_image_url","supports_list_render","props","color","group","basic","label","editable","required","defaultValue","formType","propType","THEME","height"],"sources":["Divider.ts"],"sourcesContent":["import {\n  GROUPS,\n  FORM_TYPES,\n  PROP_TYPES,\n  COMPONENT_TYPES,\n  BLOCK_STYLES_SECTIONS,\n} from \"@draftbit/types\";\n\nexport const SEED_DATA = [\n  {\n    name: \"Divider\",\n    tag: \"Divider\",\n    category: COMPONENT_TYPES.layout,\n    stylesPanelSections: BLOCK_STYLES_SECTIONS,\n    description: \"A horizontal line used to divide content\",\n    preview_image_url: \"{CLOUDINARY_URL}/Divider.png\",\n    supports_list_render: false,\n    props: {\n      color: {\n        group: GROUPS.basic,\n        label: \"Color\",\n        description: \"The color of the divider\",\n        editable: true,\n        required: false,\n        defaultValue: \"divider\",\n        formType: FORM_TYPES.color,\n        propType: PROP_TYPES.THEME,\n      },\n    },\n    layout: {\n      height: 1,\n    },\n  },\n];\n"],"mappings":"AAAA,SACEA,MADF,EAEEC,UAFF,EAGEC,UAHF,EAIEC,eAJF,EAKEC,qBALF,QAMO,iBANP;AAQA,OAAO,MAAMC,SAAS,GAAG,CACvB;EACEC,IAAI,EAAE,SADR;EAEEC,GAAG,EAAE,SAFP;EAGEC,QAAQ,EAAEL,eAAe,CAACM,MAH5B;EAIEC,mBAAmB,EAAEN,qBAJvB;EAKEO,WAAW,EAAE,0CALf;EAMEC,iBAAiB,EAAE,8BANrB;EAOEC,oBAAoB,EAAE,KAPxB;EAQEC,KAAK,EAAE;IACLC,KAAK,EAAE;MACLC,KAAK,EAAEhB,MAAM,CAACiB,KADT;MAELC,KAAK,EAAE,OAFF;MAGLP,WAAW,EAAE,0BAHR;MAILQ,QAAQ,EAAE,IAJL;MAKLC,QAAQ,EAAE,KALL;MAMLC,YAAY,EAAE,SANT;MAOLC,QAAQ,EAAErB,UAAU,CAACc,KAPhB;MAQLQ,QAAQ,EAAErB,UAAU,CAACsB;IARhB;EADF,CART;EAoBEf,MAAM,EAAE;IACNgB,MAAM,EAAE;EADF;AApBV,CADuB,CAAlB"}

package/lib/module/mappings/FAB.js

@@ -1,8 +1,9 @@
-import { COMPONENT_TYPES, createIconProp, createColorProp, GROUPS, createBoolProp, createIconSizeProp, createActionProp, Triggers } from "@draftbit/types";
+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.button,
+  stylesPanelSections: BLOCK_STYLES_SECTIONS,
   description: "A mini round icon FAB",
   layout: {},
   triggers: [Triggers.OnPress],

package/lib/module/mappings/FAB.js.map

@@ -1 +1 @@
-{"version":3,"names":["COMPONENT_TYPES","createIconProp","createColorProp","GROUPS","createBoolProp","createIconSizeProp","createActionProp","Triggers","SEED_DATA","name","tag","category","button","description","layout","triggers","OnPress","props","onPress","disabled","label","group","basic","loading","iconName","defaultValue","iconColor","bgColor","size"],"sources":["FAB.ts"],"sourcesContent":["import {\n  COMPONENT_TYPES,\n  createIconProp,\n  createColorProp,\n  GROUPS,\n  createBoolProp,\n  createIconSizeProp,\n  createActionProp,\n  Triggers,\n} from \"@draftbit/types\";\n\nexport const SEED_DATA = {\n  name: \"FAB\",\n  tag: \"FAB\",\n  category: COMPONENT_TYPES.button,\n  description: \"A mini round icon FAB\",\n  layout: {},\n  triggers: [Triggers.OnPress],\n  props: {\n    onPress: createActionProp(),\n    disabled: createBoolProp({\n      label: \"Disabled\",\n      group: GROUPS.basic,\n    }),\n    loading: createBoolProp({\n      label: \"Loading\",\n      group: GROUPS.basic,\n    }),\n    iconName: createIconProp({\n      label: \"Icon\",\n      defaultValue: null,\n      group: GROUPS.basic,\n    }),\n    iconColor: createColorProp({\n      label: \"Icon color\",\n      defaultValue: null,\n      group: GROUPS.basic,\n    }),\n    bgColor: createColorProp({\n      label: \"Background color\",\n      defaultValue: null,\n      group: GROUPS.basic,\n    }),\n    size: createIconSizeProp(),\n  },\n};\n"],"mappings":"AAAA,SACEA,eADF,EAEEC,cAFF,EAGEC,eAHF,EAIEC,MAJF,EAKEC,cALF,EAMEC,kBANF,EAOEC,gBAPF,EAQEC,QARF,QASO,iBATP;AAWA,OAAO,MAAMC,SAAS,GAAG;EACvBC,IAAI,EAAE,KADiB;EAEvBC,GAAG,EAAE,KAFkB;EAGvBC,QAAQ,EAAEX,eAAe,CAACY,MAHH;EAIvBC,WAAW,EAAE,uBAJU;EAKvBC,MAAM,EAAE,EALe;EAMvBC,QAAQ,EAAE,CAACR,QAAQ,CAACS,OAAV,CANa;EAOvBC,KAAK,EAAE;IACLC,OAAO,EAAEZ,gBAAgB,EADpB;IAELa,QAAQ,EAAEf,cAAc,CAAC;MACvBgB,KAAK,EAAE,UADgB;MAEvBC,KAAK,EAAElB,MAAM,CAACmB;IAFS,CAAD,CAFnB;IAMLC,OAAO,EAAEnB,cAAc,CAAC;MACtBgB,KAAK,EAAE,SADe;MAEtBC,KAAK,EAAElB,MAAM,CAACmB;IAFQ,CAAD,CANlB;IAULE,QAAQ,EAAEvB,cAAc,CAAC;MACvBmB,KAAK,EAAE,MADgB;MAEvBK,YAAY,EAAE,IAFS;MAGvBJ,KAAK,EAAElB,MAAM,CAACmB;IAHS,CAAD,CAVnB;IAeLI,SAAS,EAAExB,eAAe,CAAC;MACzBkB,KAAK,EAAE,YADkB;MAEzBK,YAAY,EAAE,IAFW;MAGzBJ,KAAK,EAAElB,MAAM,CAACmB;IAHW,CAAD,CAfrB;IAoBLK,OAAO,EAAEzB,eAAe,CAAC;MACvBkB,KAAK,EAAE,kBADgB;MAEvBK,YAAY,EAAE,IAFS;MAGvBJ,KAAK,EAAElB,MAAM,CAACmB;IAHS,CAAD,CApBnB;IAyBLM,IAAI,EAAEvB,kBAAkB;EAzBnB;AAPgB,CAAlB"}
+{"version":3,"names":["COMPONENT_TYPES","createIconProp","createColorProp","GROUPS","createBoolProp","createIconSizeProp","createActionProp","Triggers","BLOCK_STYLES_SECTIONS","SEED_DATA","name","tag","category","button","stylesPanelSections","description","layout","triggers","OnPress","props","onPress","disabled","label","group","basic","loading","iconName","defaultValue","iconColor","bgColor","size"],"sources":["FAB.ts"],"sourcesContent":["import {\n  COMPONENT_TYPES,\n  createIconProp,\n  createColorProp,\n  GROUPS,\n  createBoolProp,\n  createIconSizeProp,\n  createActionProp,\n  Triggers,\n  BLOCK_STYLES_SECTIONS,\n} from \"@draftbit/types\";\n\nexport const SEED_DATA = {\n  name: \"FAB\",\n  tag: \"FAB\",\n  category: COMPONENT_TYPES.button,\n  stylesPanelSections: BLOCK_STYLES_SECTIONS,\n  description: \"A mini round icon FAB\",\n  layout: {},\n  triggers: [Triggers.OnPress],\n  props: {\n    onPress: createActionProp(),\n    disabled: createBoolProp({\n      label: \"Disabled\",\n      group: GROUPS.basic,\n    }),\n    loading: createBoolProp({\n      label: \"Loading\",\n      group: GROUPS.basic,\n    }),\n    iconName: createIconProp({\n      label: \"Icon\",\n      defaultValue: null,\n      group: GROUPS.basic,\n    }),\n    iconColor: createColorProp({\n      label: \"Icon color\",\n      defaultValue: null,\n      group: GROUPS.basic,\n    }),\n    bgColor: createColorProp({\n      label: \"Background color\",\n      defaultValue: null,\n      group: GROUPS.basic,\n    }),\n    size: createIconSizeProp(),\n  },\n};\n"],"mappings":"AAAA,SACEA,eADF,EAEEC,cAFF,EAGEC,eAHF,EAIEC,MAJF,EAKEC,cALF,EAMEC,kBANF,EAOEC,gBAPF,EAQEC,QARF,EASEC,qBATF,QAUO,iBAVP;AAYA,OAAO,MAAMC,SAAS,GAAG;EACvBC,IAAI,EAAE,KADiB;EAEvBC,GAAG,EAAE,KAFkB;EAGvBC,QAAQ,EAAEZ,eAAe,CAACa,MAHH;EAIvBC,mBAAmB,EAAEN,qBAJE;EAKvBO,WAAW,EAAE,uBALU;EAMvBC,MAAM,EAAE,EANe;EAOvBC,QAAQ,EAAE,CAACV,QAAQ,CAACW,OAAV,CAPa;EAQvBC,KAAK,EAAE;IACLC,OAAO,EAAEd,gBAAgB,EADpB;IAELe,QAAQ,EAAEjB,cAAc,CAAC;MACvBkB,KAAK,EAAE,UADgB;MAEvBC,KAAK,EAAEpB,MAAM,CAACqB;IAFS,CAAD,CAFnB;IAMLC,OAAO,EAAErB,cAAc,CAAC;MACtBkB,KAAK,EAAE,SADe;MAEtBC,KAAK,EAAEpB,MAAM,CAACqB;IAFQ,CAAD,CANlB;IAULE,QAAQ,EAAEzB,cAAc,CAAC;MACvBqB,KAAK,EAAE,MADgB;MAEvBK,YAAY,EAAE,IAFS;MAGvBJ,KAAK,EAAEpB,MAAM,CAACqB;IAHS,CAAD,CAVnB;IAeLI,SAAS,EAAE1B,eAAe,CAAC;MACzBoB,KAAK,EAAE,YADkB;MAEzBK,YAAY,EAAE,IAFW;MAGzBJ,KAAK,EAAEpB,MAAM,CAACqB;IAHW,CAAD,CAfrB;IAoBLK,OAAO,EAAE3B,eAAe,CAAC;MACvBoB,KAAK,EAAE,kBADgB;MAEvBK,YAAY,EAAE,IAFS;MAGvBJ,KAAK,EAAEpB,MAAM,CAACqB;IAHS,CAAD,CApBnB;IAyBLM,IAAI,EAAEzB,kBAAkB;EAzBnB;AARgB,CAAlB"}

package/lib/module/mappings/Fetch.js

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

package/lib/module/mappings/Fetch.js.map

@@ -1 +1 @@
-{"version":3,"names":["COMPONENT_TYPES","SEED_DATA","name","tag","description","category","data","layout","minHeight","props"],"sources":["Fetch.ts"],"sourcesContent":["import { COMPONENT_TYPES } from \"@draftbit/types\";\n/* TODO remove, still used inside the builder in a weird way */\nexport const SEED_DATA = {\n  name: \"Fetch\",\n  tag: \"Fetch\",\n  description:\n    \"Rest API Declarative Fetch component. Uses react-request internally\",\n  category: COMPONENT_TYPES.data,\n  layout: {\n    minHeight: 40,\n  },\n  props: {},\n};\n"],"mappings":"AAAA,SAASA,eAAT,QAAgC,iBAAhC;AACA;;AACA,OAAO,MAAMC,SAAS,GAAG;EACvBC,IAAI,EAAE,OADiB;EAEvBC,GAAG,EAAE,OAFkB;EAGvBC,WAAW,EACT,qEAJqB;EAKvBC,QAAQ,EAAEL,eAAe,CAACM,IALH;EAMvBC,MAAM,EAAE;IACNC,SAAS,EAAE;EADL,CANe;EASvBC,KAAK,EAAE;AATgB,CAAlB"}
+{"version":3,"names":["COMPONENT_TYPES","StylesPanelSections","SEED_DATA","name","tag","description","category","data","stylesPanelSections","NoStyles","layout","minHeight","props"],"sources":["Fetch.ts"],"sourcesContent":["import { COMPONENT_TYPES, StylesPanelSections } from \"@draftbit/types\";\n/* TODO remove, still used inside the builder in a weird way */\nexport const SEED_DATA = {\n  name: \"Fetch\",\n  tag: \"Fetch\",\n  description:\n    \"Rest API Declarative Fetch component. Uses react-request internally\",\n  category: COMPONENT_TYPES.data,\n  stylesPanelSections: [StylesPanelSections.NoStyles],\n  layout: {\n    minHeight: 40,\n  },\n  props: {},\n};\n"],"mappings":"AAAA,SAASA,eAAT,EAA0BC,mBAA1B,QAAqD,iBAArD;AACA;;AACA,OAAO,MAAMC,SAAS,GAAG;EACvBC,IAAI,EAAE,OADiB;EAEvBC,GAAG,EAAE,OAFkB;EAGvBC,WAAW,EACT,qEAJqB;EAKvBC,QAAQ,EAAEN,eAAe,CAACO,IALH;EAMvBC,mBAAmB,EAAE,CAACP,mBAAmB,CAACQ,QAArB,CANE;EAOvBC,MAAM,EAAE;IACNC,SAAS,EAAE;EADL,CAPe;EAUvBC,KAAK,EAAE;AAVgB,CAAlB"}

package/lib/module/mappings/FieldSearchBarFull.js

@@ -1,9 +1,10 @@
-import { GROUPS, COMPONENT_TYPES, FORM_TYPES, PROP_TYPES, FIELD_NAME, Triggers } from "@draftbit/types";
+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.input,
+  stylesPanelSections: BLOCK_STYLES_SECTIONS,
   preview_image_url: "{CLOUDINARY_URL}/Field_SearchBar_Full.png",
   supports_list_render: false,
   triggers: [Triggers.OnChange],

package/lib/module/mappings/FieldSearchBarFull.js.map

@@ -1 +1 @@
-{"version":3,"names":["GROUPS","COMPONENT_TYPES","FORM_TYPES","PROP_TYPES","FIELD_NAME","Triggers","SEED_DATA","name","tag","description","category","input","preview_image_url","supports_list_render","triggers","OnChange","props","icon","group","basic","label","formType","propType","ASSET","defaultValue","editable","required","placeholder","string","STRING","onSubmit","action","fieldName","layout"],"sources":["FieldSearchBarFull.ts"],"sourcesContent":["import {\n  GROUPS,\n  COMPONENT_TYPES,\n  FORM_TYPES,\n  PROP_TYPES,\n  FIELD_NAME,\n  Triggers,\n} from \"@draftbit/types\";\n\nexport const SEED_DATA = [\n  {\n    name: \"Search Bar\",\n    tag: \"FieldSearchBarFull\",\n    description: \"A search bar with accompanying search icon and clear button.\",\n    category: COMPONENT_TYPES.input,\n    preview_image_url: \"{CLOUDINARY_URL}/Field_SearchBar_Full.png\",\n    supports_list_render: false,\n    triggers: [Triggers.OnChange], // TODO Triggers.OnSubmit for multiple triggers\n    props: {\n      icon: {\n        group: GROUPS.basic,\n        label: \"Icon\",\n        description: \"Left icon to display\",\n        formType: FORM_TYPES.icon,\n        propType: PROP_TYPES.ASSET,\n        defaultValue: null,\n        editable: true,\n        required: false,\n      },\n      placeholder: {\n        group: GROUPS.basic,\n        label: \"Placeholder\",\n        description: \"Input placeholder text\",\n        formType: FORM_TYPES.string,\n        propType: PROP_TYPES.STRING,\n        defaultValue: \"Search for...\",\n        editable: true,\n        required: false,\n      },\n      onSubmit: {\n        group: GROUPS.basic,\n        label: \"Submit action\",\n        description: \"Action to execute on submission\",\n        editable: true,\n        required: false,\n        formType: FORM_TYPES.action,\n        propType: PROP_TYPES.STRING,\n        defaultValue: null,\n      },\n      fieldName: {\n        ...FIELD_NAME,\n        defaultValue: \"searchBarValue\",\n      },\n    },\n    layout: {},\n  },\n];\n"],"mappings":"AAAA,SACEA,MADF,EAEEC,eAFF,EAGEC,UAHF,EAIEC,UAJF,EAKEC,UALF,EAMEC,QANF,QAOO,iBAPP;AASA,OAAO,MAAMC,SAAS,GAAG,CACvB;EACEC,IAAI,EAAE,YADR;EAEEC,GAAG,EAAE,oBAFP;EAGEC,WAAW,EAAE,8DAHf;EAIEC,QAAQ,EAAET,eAAe,CAACU,KAJ5B;EAKEC,iBAAiB,EAAE,2CALrB;EAMEC,oBAAoB,EAAE,KANxB;EAOEC,QAAQ,EAAE,CAACT,QAAQ,CAACU,QAAV,CAPZ;EAOiC;EAC/BC,KAAK,EAAE;IACLC,IAAI,EAAE;MACJC,KAAK,EAAElB,MAAM,CAACmB,KADV;MAEJC,KAAK,EAAE,MAFH;MAGJX,WAAW,EAAE,sBAHT;MAIJY,QAAQ,EAAEnB,UAAU,CAACe,IAJjB;MAKJK,QAAQ,EAAEnB,UAAU,CAACoB,KALjB;MAMJC,YAAY,EAAE,IANV;MAOJC,QAAQ,EAAE,IAPN;MAQJC,QAAQ,EAAE;IARN,CADD;IAWLC,WAAW,EAAE;MACXT,KAAK,EAAElB,MAAM,CAACmB,KADH;MAEXC,KAAK,EAAE,aAFI;MAGXX,WAAW,EAAE,wBAHF;MAIXY,QAAQ,EAAEnB,UAAU,CAAC0B,MAJV;MAKXN,QAAQ,EAAEnB,UAAU,CAAC0B,MALV;MAMXL,YAAY,EAAE,eANH;MAOXC,QAAQ,EAAE,IAPC;MAQXC,QAAQ,EAAE;IARC,CAXR;IAqBLI,QAAQ,EAAE;MACRZ,KAAK,EAAElB,MAAM,CAACmB,KADN;MAERC,KAAK,EAAE,eAFC;MAGRX,WAAW,EAAE,iCAHL;MAIRgB,QAAQ,EAAE,IAJF;MAKRC,QAAQ,EAAE,KALF;MAMRL,QAAQ,EAAEnB,UAAU,CAAC6B,MANb;MAORT,QAAQ,EAAEnB,UAAU,CAAC0B,MAPb;MAQRL,YAAY,EAAE;IARN,CArBL;IA+BLQ,SAAS,EAAE,EACT,GAAG5B,UADM;MAEToB,YAAY,EAAE;IAFL;EA/BN,CART;EA4CES,MAAM,EAAE;AA5CV,CADuB,CAAlB"}
+{"version":3,"names":["GROUPS","COMPONENT_TYPES","FORM_TYPES","PROP_TYPES","FIELD_NAME","Triggers","BLOCK_STYLES_SECTIONS","SEED_DATA","name","tag","description","category","input","stylesPanelSections","preview_image_url","supports_list_render","triggers","OnChange","props","icon","group","basic","label","formType","propType","ASSET","defaultValue","editable","required","placeholder","string","STRING","onSubmit","action","fieldName","layout"],"sources":["FieldSearchBarFull.ts"],"sourcesContent":["import {\n  GROUPS,\n  COMPONENT_TYPES,\n  FORM_TYPES,\n  PROP_TYPES,\n  FIELD_NAME,\n  Triggers,\n  BLOCK_STYLES_SECTIONS,\n} from \"@draftbit/types\";\n\nexport const SEED_DATA = [\n  {\n    name: \"Search Bar\",\n    tag: \"FieldSearchBarFull\",\n    description: \"A search bar with accompanying search icon and clear button.\",\n    category: COMPONENT_TYPES.input,\n    stylesPanelSections: BLOCK_STYLES_SECTIONS,\n    preview_image_url: \"{CLOUDINARY_URL}/Field_SearchBar_Full.png\",\n    supports_list_render: false,\n    triggers: [Triggers.OnChange], // TODO Triggers.OnSubmit for multiple triggers\n    props: {\n      icon: {\n        group: GROUPS.basic,\n        label: \"Icon\",\n        description: \"Left icon to display\",\n        formType: FORM_TYPES.icon,\n        propType: PROP_TYPES.ASSET,\n        defaultValue: null,\n        editable: true,\n        required: false,\n      },\n      placeholder: {\n        group: GROUPS.basic,\n        label: \"Placeholder\",\n        description: \"Input placeholder text\",\n        formType: FORM_TYPES.string,\n        propType: PROP_TYPES.STRING,\n        defaultValue: \"Search for...\",\n        editable: true,\n        required: false,\n      },\n      onSubmit: {\n        group: GROUPS.basic,\n        label: \"Submit action\",\n        description: \"Action to execute on submission\",\n        editable: true,\n        required: false,\n        formType: FORM_TYPES.action,\n        propType: PROP_TYPES.STRING,\n        defaultValue: null,\n      },\n      fieldName: {\n        ...FIELD_NAME,\n        defaultValue: \"searchBarValue\",\n      },\n    },\n    layout: {},\n  },\n];\n"],"mappings":"AAAA,SACEA,MADF,EAEEC,eAFF,EAGEC,UAHF,EAIEC,UAJF,EAKEC,UALF,EAMEC,QANF,EAOEC,qBAPF,QAQO,iBARP;AAUA,OAAO,MAAMC,SAAS,GAAG,CACvB;EACEC,IAAI,EAAE,YADR;EAEEC,GAAG,EAAE,oBAFP;EAGEC,WAAW,EAAE,8DAHf;EAIEC,QAAQ,EAAEV,eAAe,CAACW,KAJ5B;EAKEC,mBAAmB,EAAEP,qBALvB;EAMEQ,iBAAiB,EAAE,2CANrB;EAOEC,oBAAoB,EAAE,KAPxB;EAQEC,QAAQ,EAAE,CAACX,QAAQ,CAACY,QAAV,CARZ;EAQiC;EAC/BC,KAAK,EAAE;IACLC,IAAI,EAAE;MACJC,KAAK,EAAEpB,MAAM,CAACqB,KADV;MAEJC,KAAK,EAAE,MAFH;MAGJZ,WAAW,EAAE,sBAHT;MAIJa,QAAQ,EAAErB,UAAU,CAACiB,IAJjB;MAKJK,QAAQ,EAAErB,UAAU,CAACsB,KALjB;MAMJC,YAAY,EAAE,IANV;MAOJC,QAAQ,EAAE,IAPN;MAQJC,QAAQ,EAAE;IARN,CADD;IAWLC,WAAW,EAAE;MACXT,KAAK,EAAEpB,MAAM,CAACqB,KADH;MAEXC,KAAK,EAAE,aAFI;MAGXZ,WAAW,EAAE,wBAHF;MAIXa,QAAQ,EAAErB,UAAU,CAAC4B,MAJV;MAKXN,QAAQ,EAAErB,UAAU,CAAC4B,MALV;MAMXL,YAAY,EAAE,eANH;MAOXC,QAAQ,EAAE,IAPC;MAQXC,QAAQ,EAAE;IARC,CAXR;IAqBLI,QAAQ,EAAE;MACRZ,KAAK,EAAEpB,MAAM,CAACqB,KADN;MAERC,KAAK,EAAE,eAFC;MAGRZ,WAAW,EAAE,iCAHL;MAIRiB,QAAQ,EAAE,IAJF;MAKRC,QAAQ,EAAE,KALF;MAMRL,QAAQ,EAAErB,UAAU,CAAC+B,MANb;MAORT,QAAQ,EAAErB,UAAU,CAAC4B,MAPb;MAQRL,YAAY,EAAE;IARN,CArBL;IA+BLQ,SAAS,EAAE,EACT,GAAG9B,UADM;MAETsB,YAAY,EAAE;IAFL;EA/BN,CATT;EA6CES,MAAM,EAAE;AA7CV,CADuB,CAAlB"}

package/lib/module/mappings/FlatList.js

@@ -1,9 +1,10 @@
-import { COMPONENT_TYPES, createNumColumnsType, createStaticBoolProp } from "@draftbit/types";
+import { COMPONENT_TYPES, createNumColumnsType, createStaticBoolProp, CONTAINER_COMPONENT_STYLES_SECTIONS } 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
   },
@@ -12,6 +13,10 @@ export const SEED_DATA = {
       label: "Horizontal",
       description: "Render list horizontally"
     }),
+    inverted: createStaticBoolProp({
+      label: "Inverted",
+      description: "If true, reverses the direction."
+    }),
     numColumns: createNumColumnsType({
       editable: true
     })

package/lib/module/mappings/FlatList.js.map

@@ -1 +1 @@
-{"version":3,"names":["COMPONENT_TYPES","createNumColumnsType","createStaticBoolProp","SEED_DATA","name","tag","description","category","data","layout","flex","props","horizontal","label","numColumns","editable"],"sources":["FlatList.ts"],"sourcesContent":["import {\n  COMPONENT_TYPES,\n  createNumColumnsType,\n  createStaticBoolProp,\n} from \"@draftbit/types\";\n\nexport const SEED_DATA = {\n  name: \"List\",\n  tag: \"FlatList\",\n  description: \"A basic List component\",\n  category: COMPONENT_TYPES.data,\n  layout: {\n    flex: 1,\n  },\n  props: {\n    horizontal: createStaticBoolProp({\n      label: \"Horizontal\",\n      description: \"Render list horizontally\",\n    }),\n    numColumns: createNumColumnsType({\n      editable: true,\n    }),\n  },\n};\n"],"mappings":"AAAA,SACEA,eADF,EAEEC,oBAFF,EAGEC,oBAHF,QAIO,iBAJP;AAMA,OAAO,MAAMC,SAAS,GAAG;EACvBC,IAAI,EAAE,MADiB;EAEvBC,GAAG,EAAE,UAFkB;EAGvBC,WAAW,EAAE,wBAHU;EAIvBC,QAAQ,EAAEP,eAAe,CAACQ,IAJH;EAKvBC,MAAM,EAAE;IACNC,IAAI,EAAE;EADA,CALe;EAQvBC,KAAK,EAAE;IACLC,UAAU,EAAEV,oBAAoB,CAAC;MAC/BW,KAAK,EAAE,YADwB;MAE/BP,WAAW,EAAE;IAFkB,CAAD,CAD3B;IAKLQ,UAAU,EAAEb,oBAAoB,CAAC;MAC/Bc,QAAQ,EAAE;IADqB,CAAD;EAL3B;AARgB,CAAlB"}
+{"version":3,"names":["COMPONENT_TYPES","createNumColumnsType","createStaticBoolProp","CONTAINER_COMPONENT_STYLES_SECTIONS","SEED_DATA","name","tag","description","category","data","stylesPanelSections","layout","flex","props","horizontal","label","inverted","numColumns","editable"],"sources":["FlatList.ts"],"sourcesContent":["import {\n  COMPONENT_TYPES,\n  createNumColumnsType,\n  createStaticBoolProp,\n  CONTAINER_COMPONENT_STYLES_SECTIONS,\n} from \"@draftbit/types\";\n\nexport const SEED_DATA = {\n  name: \"List\",\n  tag: \"FlatList\",\n  description: \"A basic List component\",\n  category: COMPONENT_TYPES.data,\n  stylesPanelSections: CONTAINER_COMPONENT_STYLES_SECTIONS,\n  layout: {\n    flex: 1,\n  },\n  props: {\n    horizontal: createStaticBoolProp({\n      label: \"Horizontal\",\n      description: \"Render list horizontally\",\n    }),\n    inverted: createStaticBoolProp({\n      label: \"Inverted\",\n      description: \"If true, reverses the direction.\",\n    }),\n    numColumns: createNumColumnsType({\n      editable: true,\n    }),\n  },\n};\n"],"mappings":"AAAA,SACEA,eADF,EAEEC,oBAFF,EAGEC,oBAHF,EAIEC,mCAJF,QAKO,iBALP;AAOA,OAAO,MAAMC,SAAS,GAAG;EACvBC,IAAI,EAAE,MADiB;EAEvBC,GAAG,EAAE,UAFkB;EAGvBC,WAAW,EAAE,wBAHU;EAIvBC,QAAQ,EAAER,eAAe,CAACS,IAJH;EAKvBC,mBAAmB,EAAEP,mCALE;EAMvBQ,MAAM,EAAE;IACNC,IAAI,EAAE;EADA,CANe;EASvBC,KAAK,EAAE;IACLC,UAAU,EAAEZ,oBAAoB,CAAC;MAC/Ba,KAAK,EAAE,YADwB;MAE/BR,WAAW,EAAE;IAFkB,CAAD,CAD3B;IAKLS,QAAQ,EAAEd,oBAAoB,CAAC;MAC7Ba,KAAK,EAAE,UADsB;MAE7BR,WAAW,EAAE;IAFgB,CAAD,CALzB;IASLU,UAAU,EAAEhB,oBAAoB,CAAC;MAC/BiB,QAAQ,EAAE;IADqB,CAAD;EAT3B;AATgB,CAAlB"}

package/lib/module/mappings/HeaderLarge.js

@@ -1,9 +1,10 @@
-import { COMPONENT_TYPES, createIconProp, createTextProp, createActionProp, Triggers } from "@draftbit/types";
+import { COMPONENT_TYPES, createIconProp, createTextProp, createActionProp, Triggers, BLOCK_STYLES_SECTIONS } from "@draftbit/types";
 export const SEED_DATA = [{
   name: "Header Large",
   tag: "HeaderLarge",
   description: "A large header with an optional touchable right aligned text and icon.",
   category: COMPONENT_TYPES.header,
+  stylesPanelSections: BLOCK_STYLES_SECTIONS,
   layout: {},
   triggers: [Triggers.OnPress],
   props: {

package/lib/module/mappings/HeaderLarge.js.map

@@ -1 +1 @@
-{"version":3,"names":["COMPONENT_TYPES","createIconProp","createTextProp","createActionProp","Triggers","SEED_DATA","name","tag","description","category","header","layout","triggers","OnPress","props","onPress","title","label","defaultValue","buttonText","icon","required"],"sources":["HeaderLarge.ts"],"sourcesContent":["import {\n  COMPONENT_TYPES,\n  createIconProp,\n  createTextProp,\n  createActionProp,\n  Triggers,\n} from \"@draftbit/types\";\n\nexport const SEED_DATA = [\n  {\n    name: \"Header Large\",\n    tag: \"HeaderLarge\",\n    description:\n      \"A large header with an optional touchable right aligned text and icon.\",\n    category: COMPONENT_TYPES.header,\n    layout: {},\n    triggers: [Triggers.OnPress],\n    props: {\n      onPress: createActionProp(),\n      title: createTextProp({\n        label: \"Title\",\n        description: \"Text to display\",\n        defaultValue: \"Title\",\n      }),\n      buttonText: createTextProp({\n        label: \"Button text\",\n        description: \"Right aligned button text to display\",\n        defaultValue: \"See All\",\n      }),\n      icon: createIconProp({\n        defaultValue: null,\n        required: false,\n      }),\n    },\n  },\n];\n"],"mappings":"AAAA,SACEA,eADF,EAEEC,cAFF,EAGEC,cAHF,EAIEC,gBAJF,EAKEC,QALF,QAMO,iBANP;AAQA,OAAO,MAAMC,SAAS,GAAG,CACvB;EACEC,IAAI,EAAE,cADR;EAEEC,GAAG,EAAE,aAFP;EAGEC,WAAW,EACT,wEAJJ;EAKEC,QAAQ,EAAET,eAAe,CAACU,MAL5B;EAMEC,MAAM,EAAE,EANV;EAOEC,QAAQ,EAAE,CAACR,QAAQ,CAACS,OAAV,CAPZ;EAQEC,KAAK,EAAE;IACLC,OAAO,EAAEZ,gBAAgB,EADpB;IAELa,KAAK,EAAEd,cAAc,CAAC;MACpBe,KAAK,EAAE,OADa;MAEpBT,WAAW,EAAE,iBAFO;MAGpBU,YAAY,EAAE;IAHM,CAAD,CAFhB;IAOLC,UAAU,EAAEjB,cAAc,CAAC;MACzBe,KAAK,EAAE,aADkB;MAEzBT,WAAW,EAAE,sCAFY;MAGzBU,YAAY,EAAE;IAHW,CAAD,CAPrB;IAYLE,IAAI,EAAEnB,cAAc,CAAC;MACnBiB,YAAY,EAAE,IADK;MAEnBG,QAAQ,EAAE;IAFS,CAAD;EAZf;AART,CADuB,CAAlB"}
+{"version":3,"names":["COMPONENT_TYPES","createIconProp","createTextProp","createActionProp","Triggers","BLOCK_STYLES_SECTIONS","SEED_DATA","name","tag","description","category","header","stylesPanelSections","layout","triggers","OnPress","props","onPress","title","label","defaultValue","buttonText","icon","required"],"sources":["HeaderLarge.ts"],"sourcesContent":["import {\n  COMPONENT_TYPES,\n  createIconProp,\n  createTextProp,\n  createActionProp,\n  Triggers,\n  BLOCK_STYLES_SECTIONS,\n} from \"@draftbit/types\";\n\nexport const SEED_DATA = [\n  {\n    name: \"Header Large\",\n    tag: \"HeaderLarge\",\n    description:\n      \"A large header with an optional touchable right aligned text and icon.\",\n    category: COMPONENT_TYPES.header,\n    stylesPanelSections: BLOCK_STYLES_SECTIONS,\n    layout: {},\n    triggers: [Triggers.OnPress],\n    props: {\n      onPress: createActionProp(),\n      title: createTextProp({\n        label: \"Title\",\n        description: \"Text to display\",\n        defaultValue: \"Title\",\n      }),\n      buttonText: createTextProp({\n        label: \"Button text\",\n        description: \"Right aligned button text to display\",\n        defaultValue: \"See All\",\n      }),\n      icon: createIconProp({\n        defaultValue: null,\n        required: false,\n      }),\n    },\n  },\n];\n"],"mappings":"AAAA,SACEA,eADF,EAEEC,cAFF,EAGEC,cAHF,EAIEC,gBAJF,EAKEC,QALF,EAMEC,qBANF,QAOO,iBAPP;AASA,OAAO,MAAMC,SAAS,GAAG,CACvB;EACEC,IAAI,EAAE,cADR;EAEEC,GAAG,EAAE,aAFP;EAGEC,WAAW,EACT,wEAJJ;EAKEC,QAAQ,EAAEV,eAAe,CAACW,MAL5B;EAMEC,mBAAmB,EAAEP,qBANvB;EAOEQ,MAAM,EAAE,EAPV;EAQEC,QAAQ,EAAE,CAACV,QAAQ,CAACW,OAAV,CARZ;EASEC,KAAK,EAAE;IACLC,OAAO,EAAEd,gBAAgB,EADpB;IAELe,KAAK,EAAEhB,cAAc,CAAC;MACpBiB,KAAK,EAAE,OADa;MAEpBV,WAAW,EAAE,iBAFO;MAGpBW,YAAY,EAAE;IAHM,CAAD,CAFhB;IAOLC,UAAU,EAAEnB,cAAc,CAAC;MACzBiB,KAAK,EAAE,aADkB;MAEzBV,WAAW,EAAE,sCAFY;MAGzBW,YAAY,EAAE;IAHW,CAAD,CAPrB;IAYLE,IAAI,EAAErB,cAAc,CAAC;MACnBmB,YAAY,EAAE,IADK;MAEnBG,QAAQ,EAAE;IAFS,CAAD;EAZf;AATT,CADuB,CAAlB"}

package/lib/module/mappings/HeaderMedium.js

@@ -1,9 +1,10 @@
-import { GROUPS, COMPONENT_TYPES, FORM_TYPES, PROP_TYPES } from "@draftbit/types";
+import { GROUPS, COMPONENT_TYPES, FORM_TYPES, PROP_TYPES, BLOCK_STYLES_SECTIONS } from "@draftbit/types";
 export const SEED_DATA = [{
   name: "Header Medium",
   tag: "HeaderMedium",
   description: "A medium header with an optional touchable right aligned text and icon.",
   category: COMPONENT_TYPES.header,
+  stylesPanelSections: BLOCK_STYLES_SECTIONS,
   preview_image_url: "{CLOUDINARY_URL}/Header_HeadlineMediumIconText.png",
   supports_list_render: false,
   props: {

package/lib/module/mappings/HeaderMedium.js.map

@@ -1 +1 @@
-{"version":3,"names":["GROUPS","COMPONENT_TYPES","FORM_TYPES","PROP_TYPES","SEED_DATA","name","tag","description","category","header","preview_image_url","supports_list_render","props","title","group","data","label","formType","string","propType","STRING","defaultValue","editable","required","buttonText","icon","basic","ASSET","onPress","action","layout"],"sources":["HeaderMedium.ts"],"sourcesContent":["import {\n  GROUPS,\n  COMPONENT_TYPES,\n  FORM_TYPES,\n  PROP_TYPES,\n} from \"@draftbit/types\";\n\nexport const SEED_DATA = [\n  {\n    name: \"Header Medium\",\n    tag: \"HeaderMedium\",\n    description:\n      \"A medium header with an optional touchable right aligned text and icon.\",\n    category: COMPONENT_TYPES.header,\n    preview_image_url: \"{CLOUDINARY_URL}/Header_HeadlineMediumIconText.png\",\n    supports_list_render: false,\n    props: {\n      title: {\n        group: GROUPS.data,\n        label: \"Title\",\n        description: \"Text to display\",\n        formType: FORM_TYPES.string,\n        propType: PROP_TYPES.STRING,\n        defaultValue: \"Title\",\n        editable: true,\n        required: false,\n      },\n      buttonText: {\n        group: GROUPS.data,\n        label: \"Button text\",\n        description: \"Right aligned button text to display\",\n        formType: FORM_TYPES.string,\n        propType: PROP_TYPES.STRING,\n        defaultValue: \"See All\",\n        editable: true,\n        required: false,\n      },\n      icon: {\n        group: GROUPS.basic,\n        label: \"Icon\",\n        description: \"Name of icon to display\",\n        formType: FORM_TYPES.icon,\n        propType: PROP_TYPES.ASSET,\n        defaultValue: null,\n        editable: true,\n        required: false,\n      },\n      onPress: {\n        group: GROUPS.basic,\n        label: \"Action\",\n        description: \"Action to execute when button pressed\",\n        editable: true,\n        required: false,\n        formType: FORM_TYPES.action,\n        propType: PROP_TYPES.STRING,\n        defaultValue: null,\n      },\n    },\n    layout: {},\n  },\n];\n"],"mappings":"AAAA,SACEA,MADF,EAEEC,eAFF,EAGEC,UAHF,EAIEC,UAJF,QAKO,iBALP;AAOA,OAAO,MAAMC,SAAS,GAAG,CACvB;EACEC,IAAI,EAAE,eADR;EAEEC,GAAG,EAAE,cAFP;EAGEC,WAAW,EACT,yEAJJ;EAKEC,QAAQ,EAAEP,eAAe,CAACQ,MAL5B;EAMEC,iBAAiB,EAAE,oDANrB;EAOEC,oBAAoB,EAAE,KAPxB;EAQEC,KAAK,EAAE;IACLC,KAAK,EAAE;MACLC,KAAK,EAAEd,MAAM,CAACe,IADT;MAELC,KAAK,EAAE,OAFF;MAGLT,WAAW,EAAE,iBAHR;MAILU,QAAQ,EAAEf,UAAU,CAACgB,MAJhB;MAKLC,QAAQ,EAAEhB,UAAU,CAACiB,MALhB;MAMLC,YAAY,EAAE,OANT;MAOLC,QAAQ,EAAE,IAPL;MAQLC,QAAQ,EAAE;IARL,CADF;IAWLC,UAAU,EAAE;MACVV,KAAK,EAAEd,MAAM,CAACe,IADJ;MAEVC,KAAK,EAAE,aAFG;MAGVT,WAAW,EAAE,sCAHH;MAIVU,QAAQ,EAAEf,UAAU,CAACgB,MAJX;MAKVC,QAAQ,EAAEhB,UAAU,CAACiB,MALX;MAMVC,YAAY,EAAE,SANJ;MAOVC,QAAQ,EAAE,IAPA;MAQVC,QAAQ,EAAE;IARA,CAXP;IAqBLE,IAAI,EAAE;MACJX,KAAK,EAAEd,MAAM,CAAC0B,KADV;MAEJV,KAAK,EAAE,MAFH;MAGJT,WAAW,EAAE,yBAHT;MAIJU,QAAQ,EAAEf,UAAU,CAACuB,IAJjB;MAKJN,QAAQ,EAAEhB,UAAU,CAACwB,KALjB;MAMJN,YAAY,EAAE,IANV;MAOJC,QAAQ,EAAE,IAPN;MAQJC,QAAQ,EAAE;IARN,CArBD;IA+BLK,OAAO,EAAE;MACPd,KAAK,EAAEd,MAAM,CAAC0B,KADP;MAEPV,KAAK,EAAE,QAFA;MAGPT,WAAW,EAAE,uCAHN;MAIPe,QAAQ,EAAE,IAJH;MAKPC,QAAQ,EAAE,KALH;MAMPN,QAAQ,EAAEf,UAAU,CAAC2B,MANd;MAOPV,QAAQ,EAAEhB,UAAU,CAACiB,MAPd;MAQPC,YAAY,EAAE;IARP;EA/BJ,CART;EAkDES,MAAM,EAAE;AAlDV,CADuB,CAAlB"}
+{"version":3,"names":["GROUPS","COMPONENT_TYPES","FORM_TYPES","PROP_TYPES","BLOCK_STYLES_SECTIONS","SEED_DATA","name","tag","description","category","header","stylesPanelSections","preview_image_url","supports_list_render","props","title","group","data","label","formType","string","propType","STRING","defaultValue","editable","required","buttonText","icon","basic","ASSET","onPress","action","layout"],"sources":["HeaderMedium.ts"],"sourcesContent":["import {\n  GROUPS,\n  COMPONENT_TYPES,\n  FORM_TYPES,\n  PROP_TYPES,\n  BLOCK_STYLES_SECTIONS,\n} from \"@draftbit/types\";\n\nexport const SEED_DATA = [\n  {\n    name: \"Header Medium\",\n    tag: \"HeaderMedium\",\n    description:\n      \"A medium header with an optional touchable right aligned text and icon.\",\n    category: COMPONENT_TYPES.header,\n    stylesPanelSections: BLOCK_STYLES_SECTIONS,\n    preview_image_url: \"{CLOUDINARY_URL}/Header_HeadlineMediumIconText.png\",\n    supports_list_render: false,\n    props: {\n      title: {\n        group: GROUPS.data,\n        label: \"Title\",\n        description: \"Text to display\",\n        formType: FORM_TYPES.string,\n        propType: PROP_TYPES.STRING,\n        defaultValue: \"Title\",\n        editable: true,\n        required: false,\n      },\n      buttonText: {\n        group: GROUPS.data,\n        label: \"Button text\",\n        description: \"Right aligned button text to display\",\n        formType: FORM_TYPES.string,\n        propType: PROP_TYPES.STRING,\n        defaultValue: \"See All\",\n        editable: true,\n        required: false,\n      },\n      icon: {\n        group: GROUPS.basic,\n        label: \"Icon\",\n        description: \"Name of icon to display\",\n        formType: FORM_TYPES.icon,\n        propType: PROP_TYPES.ASSET,\n        defaultValue: null,\n        editable: true,\n        required: false,\n      },\n      onPress: {\n        group: GROUPS.basic,\n        label: \"Action\",\n        description: \"Action to execute when button pressed\",\n        editable: true,\n        required: false,\n        formType: FORM_TYPES.action,\n        propType: PROP_TYPES.STRING,\n        defaultValue: null,\n      },\n    },\n    layout: {},\n  },\n];\n"],"mappings":"AAAA,SACEA,MADF,EAEEC,eAFF,EAGEC,UAHF,EAIEC,UAJF,EAKEC,qBALF,QAMO,iBANP;AAQA,OAAO,MAAMC,SAAS,GAAG,CACvB;EACEC,IAAI,EAAE,eADR;EAEEC,GAAG,EAAE,cAFP;EAGEC,WAAW,EACT,yEAJJ;EAKEC,QAAQ,EAAER,eAAe,CAACS,MAL5B;EAMEC,mBAAmB,EAAEP,qBANvB;EAOEQ,iBAAiB,EAAE,oDAPrB;EAQEC,oBAAoB,EAAE,KARxB;EASEC,KAAK,EAAE;IACLC,KAAK,EAAE;MACLC,KAAK,EAAEhB,MAAM,CAACiB,IADT;MAELC,KAAK,EAAE,OAFF;MAGLV,WAAW,EAAE,iBAHR;MAILW,QAAQ,EAAEjB,UAAU,CAACkB,MAJhB;MAKLC,QAAQ,EAAElB,UAAU,CAACmB,MALhB;MAMLC,YAAY,EAAE,OANT;MAOLC,QAAQ,EAAE,IAPL;MAQLC,QAAQ,EAAE;IARL,CADF;IAWLC,UAAU,EAAE;MACVV,KAAK,EAAEhB,MAAM,CAACiB,IADJ;MAEVC,KAAK,EAAE,aAFG;MAGVV,WAAW,EAAE,sCAHH;MAIVW,QAAQ,EAAEjB,UAAU,CAACkB,MAJX;MAKVC,QAAQ,EAAElB,UAAU,CAACmB,MALX;MAMVC,YAAY,EAAE,SANJ;MAOVC,QAAQ,EAAE,IAPA;MAQVC,QAAQ,EAAE;IARA,CAXP;IAqBLE,IAAI,EAAE;MACJX,KAAK,EAAEhB,MAAM,CAAC4B,KADV;MAEJV,KAAK,EAAE,MAFH;MAGJV,WAAW,EAAE,yBAHT;MAIJW,QAAQ,EAAEjB,UAAU,CAACyB,IAJjB;MAKJN,QAAQ,EAAElB,UAAU,CAAC0B,KALjB;MAMJN,YAAY,EAAE,IANV;MAOJC,QAAQ,EAAE,IAPN;MAQJC,QAAQ,EAAE;IARN,CArBD;IA+BLK,OAAO,EAAE;MACPd,KAAK,EAAEhB,MAAM,CAAC4B,KADP;MAEPV,KAAK,EAAE,QAFA;MAGPV,WAAW,EAAE,uCAHN;MAIPgB,QAAQ,EAAE,IAJH;MAKPC,QAAQ,EAAE,KALH;MAMPN,QAAQ,EAAEjB,UAAU,CAAC6B,MANd;MAOPV,QAAQ,EAAElB,UAAU,CAACmB,MAPd;MAQPC,YAAY,EAAE;IARP;EA/BJ,CATT;EAmDES,MAAM,EAAE;AAnDV,CADuB,CAAlB"}

package/lib/module/mappings/HeaderOverline.js

@@ -1,9 +1,10 @@
-import { GROUPS, COMPONENT_TYPES, FORM_TYPES, PROP_TYPES } from "@draftbit/types";
+import { GROUPS, COMPONENT_TYPES, FORM_TYPES, PROP_TYPES, BLOCK_STYLES_SECTIONS } from "@draftbit/types";
 export const SEED_DATA = [{
   name: "Header Overline",
   tag: "HeaderOverline",
   description: "A small header with an optional touchable right aligned text and icon.",
   category: COMPONENT_TYPES.header,
+  stylesPanelSections: BLOCK_STYLES_SECTIONS,
   preview_image_url: "{CLOUDINARY_URL}/Header_OverlineIconText.png",
   supports_list_render: false,
   props: {

package/lib/module/mappings/HeaderOverline.js.map

@@ -1 +1 @@
-{"version":3,"names":["GROUPS","COMPONENT_TYPES","FORM_TYPES","PROP_TYPES","SEED_DATA","name","tag","description","category","header","preview_image_url","supports_list_render","props","title","group","data","label","formType","string","propType","STRING","defaultValue","editable","required","buttonText","icon","basic","ASSET","onPress","action","layout"],"sources":["HeaderOverline.ts"],"sourcesContent":["import {\n  GROUPS,\n  COMPONENT_TYPES,\n  FORM_TYPES,\n  PROP_TYPES,\n} from \"@draftbit/types\";\n\nexport const SEED_DATA = [\n  {\n    name: \"Header Overline\",\n    tag: \"HeaderOverline\",\n    description:\n      \"A small header with an optional touchable right aligned text and icon.\",\n    category: COMPONENT_TYPES.header,\n    preview_image_url: \"{CLOUDINARY_URL}/Header_OverlineIconText.png\",\n    supports_list_render: false,\n    props: {\n      title: {\n        group: GROUPS.data,\n        label: \"Title\",\n        description: \"Text to display\",\n        formType: FORM_TYPES.string,\n        propType: PROP_TYPES.STRING,\n        defaultValue: \"Title\",\n        editable: true,\n        required: false,\n      },\n      buttonText: {\n        group: GROUPS.data,\n        label: \"Button text\",\n        description: \"Right aligned button text to display\",\n        formType: FORM_TYPES.string,\n        propType: PROP_TYPES.STRING,\n        defaultValue: \"See All\",\n        editable: true,\n        required: false,\n      },\n      icon: {\n        group: GROUPS.basic,\n        label: \"Icon\",\n        description: \"Name of icon to display\",\n        formType: FORM_TYPES.icon,\n        propType: PROP_TYPES.ASSET,\n        defaultValue: null,\n        editable: true,\n        required: false,\n      },\n      onPress: {\n        group: GROUPS.basic,\n        label: \"Action\",\n        description: \"Action to execute when button pressed\",\n        editable: true,\n        required: false,\n        formType: FORM_TYPES.action,\n        propType: PROP_TYPES.STRING,\n        defaultValue: null,\n      },\n    },\n    layout: {},\n  },\n];\n"],"mappings":"AAAA,SACEA,MADF,EAEEC,eAFF,EAGEC,UAHF,EAIEC,UAJF,QAKO,iBALP;AAOA,OAAO,MAAMC,SAAS,GAAG,CACvB;EACEC,IAAI,EAAE,iBADR;EAEEC,GAAG,EAAE,gBAFP;EAGEC,WAAW,EACT,wEAJJ;EAKEC,QAAQ,EAAEP,eAAe,CAACQ,MAL5B;EAMEC,iBAAiB,EAAE,8CANrB;EAOEC,oBAAoB,EAAE,KAPxB;EAQEC,KAAK,EAAE;IACLC,KAAK,EAAE;MACLC,KAAK,EAAEd,MAAM,CAACe,IADT;MAELC,KAAK,EAAE,OAFF;MAGLT,WAAW,EAAE,iBAHR;MAILU,QAAQ,EAAEf,UAAU,CAACgB,MAJhB;MAKLC,QAAQ,EAAEhB,UAAU,CAACiB,MALhB;MAMLC,YAAY,EAAE,OANT;MAOLC,QAAQ,EAAE,IAPL;MAQLC,QAAQ,EAAE;IARL,CADF;IAWLC,UAAU,EAAE;MACVV,KAAK,EAAEd,MAAM,CAACe,IADJ;MAEVC,KAAK,EAAE,aAFG;MAGVT,WAAW,EAAE,sCAHH;MAIVU,QAAQ,EAAEf,UAAU,CAACgB,MAJX;MAKVC,QAAQ,EAAEhB,UAAU,CAACiB,MALX;MAMVC,YAAY,EAAE,SANJ;MAOVC,QAAQ,EAAE,IAPA;MAQVC,QAAQ,EAAE;IARA,CAXP;IAqBLE,IAAI,EAAE;MACJX,KAAK,EAAEd,MAAM,CAAC0B,KADV;MAEJV,KAAK,EAAE,MAFH;MAGJT,WAAW,EAAE,yBAHT;MAIJU,QAAQ,EAAEf,UAAU,CAACuB,IAJjB;MAKJN,QAAQ,EAAEhB,UAAU,CAACwB,KALjB;MAMJN,YAAY,EAAE,IANV;MAOJC,QAAQ,EAAE,IAPN;MAQJC,QAAQ,EAAE;IARN,CArBD;IA+BLK,OAAO,EAAE;MACPd,KAAK,EAAEd,MAAM,CAAC0B,KADP;MAEPV,KAAK,EAAE,QAFA;MAGPT,WAAW,EAAE,uCAHN;MAIPe,QAAQ,EAAE,IAJH;MAKPC,QAAQ,EAAE,KALH;MAMPN,QAAQ,EAAEf,UAAU,CAAC2B,MANd;MAOPV,QAAQ,EAAEhB,UAAU,CAACiB,MAPd;MAQPC,YAAY,EAAE;IARP;EA/BJ,CART;EAkDES,MAAM,EAAE;AAlDV,CADuB,CAAlB"}
+{"version":3,"names":["GROUPS","COMPONENT_TYPES","FORM_TYPES","PROP_TYPES","BLOCK_STYLES_SECTIONS","SEED_DATA","name","tag","description","category","header","stylesPanelSections","preview_image_url","supports_list_render","props","title","group","data","label","formType","string","propType","STRING","defaultValue","editable","required","buttonText","icon","basic","ASSET","onPress","action","layout"],"sources":["HeaderOverline.ts"],"sourcesContent":["import {\n  GROUPS,\n  COMPONENT_TYPES,\n  FORM_TYPES,\n  PROP_TYPES,\n  BLOCK_STYLES_SECTIONS,\n} from \"@draftbit/types\";\n\nexport const SEED_DATA = [\n  {\n    name: \"Header Overline\",\n    tag: \"HeaderOverline\",\n    description:\n      \"A small header with an optional touchable right aligned text and icon.\",\n    category: COMPONENT_TYPES.header,\n    stylesPanelSections: BLOCK_STYLES_SECTIONS,\n    preview_image_url: \"{CLOUDINARY_URL}/Header_OverlineIconText.png\",\n    supports_list_render: false,\n    props: {\n      title: {\n        group: GROUPS.data,\n        label: \"Title\",\n        description: \"Text to display\",\n        formType: FORM_TYPES.string,\n        propType: PROP_TYPES.STRING,\n        defaultValue: \"Title\",\n        editable: true,\n        required: false,\n      },\n      buttonText: {\n        group: GROUPS.data,\n        label: \"Button text\",\n        description: \"Right aligned button text to display\",\n        formType: FORM_TYPES.string,\n        propType: PROP_TYPES.STRING,\n        defaultValue: \"See All\",\n        editable: true,\n        required: false,\n      },\n      icon: {\n        group: GROUPS.basic,\n        label: \"Icon\",\n        description: \"Name of icon to display\",\n        formType: FORM_TYPES.icon,\n        propType: PROP_TYPES.ASSET,\n        defaultValue: null,\n        editable: true,\n        required: false,\n      },\n      onPress: {\n        group: GROUPS.basic,\n        label: \"Action\",\n        description: \"Action to execute when button pressed\",\n        editable: true,\n        required: false,\n        formType: FORM_TYPES.action,\n        propType: PROP_TYPES.STRING,\n        defaultValue: null,\n      },\n    },\n    layout: {},\n  },\n];\n"],"mappings":"AAAA,SACEA,MADF,EAEEC,eAFF,EAGEC,UAHF,EAIEC,UAJF,EAKEC,qBALF,QAMO,iBANP;AAQA,OAAO,MAAMC,SAAS,GAAG,CACvB;EACEC,IAAI,EAAE,iBADR;EAEEC,GAAG,EAAE,gBAFP;EAGEC,WAAW,EACT,wEAJJ;EAKEC,QAAQ,EAAER,eAAe,CAACS,MAL5B;EAMEC,mBAAmB,EAAEP,qBANvB;EAOEQ,iBAAiB,EAAE,8CAPrB;EAQEC,oBAAoB,EAAE,KARxB;EASEC,KAAK,EAAE;IACLC,KAAK,EAAE;MACLC,KAAK,EAAEhB,MAAM,CAACiB,IADT;MAELC,KAAK,EAAE,OAFF;MAGLV,WAAW,EAAE,iBAHR;MAILW,QAAQ,EAAEjB,UAAU,CAACkB,MAJhB;MAKLC,QAAQ,EAAElB,UAAU,CAACmB,MALhB;MAMLC,YAAY,EAAE,OANT;MAOLC,QAAQ,EAAE,IAPL;MAQLC,QAAQ,EAAE;IARL,CADF;IAWLC,UAAU,EAAE;MACVV,KAAK,EAAEhB,MAAM,CAACiB,IADJ;MAEVC,KAAK,EAAE,aAFG;MAGVV,WAAW,EAAE,sCAHH;MAIVW,QAAQ,EAAEjB,UAAU,CAACkB,MAJX;MAKVC,QAAQ,EAAElB,UAAU,CAACmB,MALX;MAMVC,YAAY,EAAE,SANJ;MAOVC,QAAQ,EAAE,IAPA;MAQVC,QAAQ,EAAE;IARA,CAXP;IAqBLE,IAAI,EAAE;MACJX,KAAK,EAAEhB,MAAM,CAAC4B,KADV;MAEJV,KAAK,EAAE,MAFH;MAGJV,WAAW,EAAE,yBAHT;MAIJW,QAAQ,EAAEjB,UAAU,CAACyB,IAJjB;MAKJN,QAAQ,EAAElB,UAAU,CAAC0B,KALjB;MAMJN,YAAY,EAAE,IANV;MAOJC,QAAQ,EAAE,IAPN;MAQJC,QAAQ,EAAE;IARN,CArBD;IA+BLK,OAAO,EAAE;MACPd,KAAK,EAAEhB,MAAM,CAAC4B,KADP;MAEPV,KAAK,EAAE,QAFA;MAGPV,WAAW,EAAE,uCAHN;MAIPgB,QAAQ,EAAE,IAJH;MAKPC,QAAQ,EAAE,KALH;MAMPN,QAAQ,EAAEjB,UAAU,CAAC6B,MANd;MAOPV,QAAQ,EAAElB,UAAU,CAACmB,MAPd;MAQPC,YAAY,EAAE;IARP;EA/BJ,CATT;EAmDES,MAAM,EAAE;AAnDV,CADuB,CAAlB"}

package/lib/module/mappings/Icon.js

@@ -1,9 +1,10 @@
-import { COMPONENT_TYPES, GROUPS, createNumberProp, createColorProp, createIconProp } from "@draftbit/types";
+import { COMPONENT_TYPES, GROUPS, createNumberProp, createColorProp, createIconProp, StylesPanelSections } from "@draftbit/types";
 export const SEED_DATA = {
   name: "Icon",
   tag: "Icon",
   description: "An icon",
   category: COMPONENT_TYPES.basic,
+  stylesPanelSections: [StylesPanelSections.Size, StylesPanelSections.Margins, StylesPanelSections.Background, StylesPanelSections.Position, StylesPanelSections.Effects],
   layout: {},
   props: {
     name: { ...createIconProp(),

package/lib/module/mappings/Icon.js.map

@@ -1 +1 @@
-{"version":3,"names":["COMPONENT_TYPES","GROUPS","createNumberProp","createColorProp","createIconProp","SEED_DATA","name","tag","description","category","basic","layout","props","group","data","color","size","label","defaultValue","min","max","step","precision"],"sources":["Icon.ts"],"sourcesContent":["import {\n  COMPONENT_TYPES,\n  GROUPS,\n  createNumberProp,\n  createColorProp,\n  createIconProp,\n} from \"@draftbit/types\";\n\nexport const SEED_DATA = {\n  name: \"Icon\",\n  tag: \"Icon\",\n  description: \"An icon\",\n  category: COMPONENT_TYPES.basic,\n  layout: {},\n  props: {\n    name: {\n      ...createIconProp(),\n      group: GROUPS.data,\n    },\n    color: createColorProp(),\n    size: createNumberProp({\n      group: GROUPS.basic,\n      label: \"Size\",\n      description: \"Width and height of your icon\",\n      defaultValue: 24,\n      min: 1,\n      max: 128,\n      step: 1,\n      precision: 0,\n    }),\n  },\n};\n"],"mappings":"AAAA,SACEA,eADF,EAEEC,MAFF,EAGEC,gBAHF,EAIEC,eAJF,EAKEC,cALF,QAMO,iBANP;AAQA,OAAO,MAAMC,SAAS,GAAG;EACvBC,IAAI,EAAE,MADiB;EAEvBC,GAAG,EAAE,MAFkB;EAGvBC,WAAW,EAAE,SAHU;EAIvBC,QAAQ,EAAET,eAAe,CAACU,KAJH;EAKvBC,MAAM,EAAE,EALe;EAMvBC,KAAK,EAAE;IACLN,IAAI,EAAE,EACJ,GAAGF,cAAc,EADb;MAEJS,KAAK,EAAEZ,MAAM,CAACa;IAFV,CADD;IAKLC,KAAK,EAAEZ,eAAe,EALjB;IAMLa,IAAI,EAAEd,gBAAgB,CAAC;MACrBW,KAAK,EAAEZ,MAAM,CAACS,KADO;MAErBO,KAAK,EAAE,MAFc;MAGrBT,WAAW,EAAE,+BAHQ;MAIrBU,YAAY,EAAE,EAJO;MAKrBC,GAAG,EAAE,CALgB;MAMrBC,GAAG,EAAE,GANgB;MAOrBC,IAAI,EAAE,CAPe;MAQrBC,SAAS,EAAE;IARU,CAAD;EANjB;AANgB,CAAlB"}
+{"version":3,"names":["COMPONENT_TYPES","GROUPS","createNumberProp","createColorProp","createIconProp","StylesPanelSections","SEED_DATA","name","tag","description","category","basic","stylesPanelSections","Size","Margins","Background","Position","Effects","layout","props","group","data","color","size","label","defaultValue","min","max","step","precision"],"sources":["Icon.ts"],"sourcesContent":["import {\n  COMPONENT_TYPES,\n  GROUPS,\n  createNumberProp,\n  createColorProp,\n  createIconProp,\n  StylesPanelSections,\n} from \"@draftbit/types\";\n\nexport const SEED_DATA = {\n  name: \"Icon\",\n  tag: \"Icon\",\n  description: \"An icon\",\n  category: COMPONENT_TYPES.basic,\n  stylesPanelSections: [\n    StylesPanelSections.Size,\n    StylesPanelSections.Margins,\n    StylesPanelSections.Background,\n    StylesPanelSections.Position,\n    StylesPanelSections.Effects,\n  ],\n  layout: {},\n  props: {\n    name: {\n      ...createIconProp(),\n      group: GROUPS.data,\n    },\n    color: createColorProp(),\n    size: createNumberProp({\n      group: GROUPS.basic,\n      label: \"Size\",\n      description: \"Width and height of your icon\",\n      defaultValue: 24,\n      min: 1,\n      max: 128,\n      step: 1,\n      precision: 0,\n    }),\n  },\n};\n"],"mappings":"AAAA,SACEA,eADF,EAEEC,MAFF,EAGEC,gBAHF,EAIEC,eAJF,EAKEC,cALF,EAMEC,mBANF,QAOO,iBAPP;AASA,OAAO,MAAMC,SAAS,GAAG;EACvBC,IAAI,EAAE,MADiB;EAEvBC,GAAG,EAAE,MAFkB;EAGvBC,WAAW,EAAE,SAHU;EAIvBC,QAAQ,EAAEV,eAAe,CAACW,KAJH;EAKvBC,mBAAmB,EAAE,CACnBP,mBAAmB,CAACQ,IADD,EAEnBR,mBAAmB,CAACS,OAFD,EAGnBT,mBAAmB,CAACU,UAHD,EAInBV,mBAAmB,CAACW,QAJD,EAKnBX,mBAAmB,CAACY,OALD,CALE;EAYvBC,MAAM,EAAE,EAZe;EAavBC,KAAK,EAAE;IACLZ,IAAI,EAAE,EACJ,GAAGH,cAAc,EADb;MAEJgB,KAAK,EAAEnB,MAAM,CAACoB;IAFV,CADD;IAKLC,KAAK,EAAEnB,eAAe,EALjB;IAMLoB,IAAI,EAAErB,gBAAgB,CAAC;MACrBkB,KAAK,EAAEnB,MAAM,CAACU,KADO;MAErBa,KAAK,EAAE,MAFc;MAGrBf,WAAW,EAAE,+BAHQ;MAIrBgB,YAAY,EAAE,EAJO;MAKrBC,GAAG,EAAE,CALgB;MAMrBC,GAAG,EAAE,GANgB;MAOrBC,IAAI,EAAE,CAPe;MAQrBC,SAAS,EAAE;IARU,CAAD;EANjB;AAbgB,CAAlB"}

package/lib/module/mappings/IconButton.js

@@ -1,10 +1,11 @@
-import { COMPONENT_TYPES, GROUPS, createIconProp, createColorProp, createNumberProp, createBoolProp, createActionProp, Triggers } from "@draftbit/types";
+import { COMPONENT_TYPES, GROUPS, createIconProp, createColorProp, createNumberProp, createBoolProp, createActionProp, Triggers, StylesPanelSections } from "@draftbit/types";
 export const SEED_DATA = {
   name: "Icon Button",
   tag: "IconButton",
   category: COMPONENT_TYPES.button,
   layout: {},
   triggers: [Triggers.OnPress],
+  stylesPanelSections: [StylesPanelSections.Margins, StylesPanelSections.Effects, StylesPanelSections.Position],
   props: {
     onPress: createActionProp(),
     icon: createIconProp(),

package/lib/module/mappings/IconButton.js.map

@@ -1 +1 @@
-{"version":3,"names":["COMPONENT_TYPES","GROUPS","createIconProp","createColorProp","createNumberProp","createBoolProp","createActionProp","Triggers","SEED_DATA","name","tag","category","button","layout","triggers","OnPress","props","onPress","icon","color","label","group","basic","disabled","size","description","defaultValue","min","max","step","precision"],"sources":["IconButton.ts"],"sourcesContent":["import {\n  COMPONENT_TYPES,\n  GROUPS,\n  createIconProp,\n  createColorProp,\n  createNumberProp,\n  createBoolProp,\n  createActionProp,\n  Triggers,\n} from \"@draftbit/types\";\n\nexport const SEED_DATA = {\n  name: \"Icon Button\",\n  tag: \"IconButton\",\n  category: COMPONENT_TYPES.button,\n  layout: {},\n  triggers: [Triggers.OnPress],\n  props: {\n    onPress: createActionProp(),\n    icon: createIconProp(),\n    color: createColorProp({\n      label: \"Color\",\n      group: GROUPS.basic,\n    }),\n    disabled: createBoolProp({\n      label: \"Disabled\",\n      group: GROUPS.basic,\n    }),\n    size: createNumberProp({\n      group: GROUPS.basic,\n      label: \"Size\",\n      description: \"Width and height of your icon\",\n      defaultValue: 32,\n      min: 16,\n      max: 128,\n      step: 1,\n      precision: 0,\n    }),\n  },\n};\n"],"mappings":"AAAA,SACEA,eADF,EAEEC,MAFF,EAGEC,cAHF,EAIEC,eAJF,EAKEC,gBALF,EAMEC,cANF,EAOEC,gBAPF,EAQEC,QARF,QASO,iBATP;AAWA,OAAO,MAAMC,SAAS,GAAG;EACvBC,IAAI,EAAE,aADiB;EAEvBC,GAAG,EAAE,YAFkB;EAGvBC,QAAQ,EAAEX,eAAe,CAACY,MAHH;EAIvBC,MAAM,EAAE,EAJe;EAKvBC,QAAQ,EAAE,CAACP,QAAQ,CAACQ,OAAV,CALa;EAMvBC,KAAK,EAAE;IACLC,OAAO,EAAEX,gBAAgB,EADpB;IAELY,IAAI,EAAEhB,cAAc,EAFf;IAGLiB,KAAK,EAAEhB,eAAe,CAAC;MACrBiB,KAAK,EAAE,OADc;MAErBC,KAAK,EAAEpB,MAAM,CAACqB;IAFO,CAAD,CAHjB;IAOLC,QAAQ,EAAElB,cAAc,CAAC;MACvBe,KAAK,EAAE,UADgB;MAEvBC,KAAK,EAAEpB,MAAM,CAACqB;IAFS,CAAD,CAPnB;IAWLE,IAAI,EAAEpB,gBAAgB,CAAC;MACrBiB,KAAK,EAAEpB,MAAM,CAACqB,KADO;MAErBF,KAAK,EAAE,MAFc;MAGrBK,WAAW,EAAE,+BAHQ;MAIrBC,YAAY,EAAE,EAJO;MAKrBC,GAAG,EAAE,EALgB;MAMrBC,GAAG,EAAE,GANgB;MAOrBC,IAAI,EAAE,CAPe;MAQrBC,SAAS,EAAE;IARU,CAAD;EAXjB;AANgB,CAAlB"}
+{"version":3,"names":["COMPONENT_TYPES","GROUPS","createIconProp","createColorProp","createNumberProp","createBoolProp","createActionProp","Triggers","StylesPanelSections","SEED_DATA","name","tag","category","button","layout","triggers","OnPress","stylesPanelSections","Margins","Effects","Position","props","onPress","icon","color","label","group","basic","disabled","size","description","defaultValue","min","max","step","precision"],"sources":["IconButton.ts"],"sourcesContent":["import {\n  COMPONENT_TYPES,\n  GROUPS,\n  createIconProp,\n  createColorProp,\n  createNumberProp,\n  createBoolProp,\n  createActionProp,\n  Triggers,\n  StylesPanelSections,\n} from \"@draftbit/types\";\n\nexport const SEED_DATA = {\n  name: \"Icon Button\",\n  tag: \"IconButton\",\n  category: COMPONENT_TYPES.button,\n  layout: {},\n  triggers: [Triggers.OnPress],\n  stylesPanelSections: [\n    StylesPanelSections.Margins,\n    StylesPanelSections.Effects,\n    StylesPanelSections.Position,\n  ],\n  props: {\n    onPress: createActionProp(),\n    icon: createIconProp(),\n    color: createColorProp({\n      label: \"Color\",\n      group: GROUPS.basic,\n    }),\n    disabled: createBoolProp({\n      label: \"Disabled\",\n      group: GROUPS.basic,\n    }),\n    size: createNumberProp({\n      group: GROUPS.basic,\n      label: \"Size\",\n      description: \"Width and height of your icon\",\n      defaultValue: 32,\n      min: 16,\n      max: 128,\n      step: 1,\n      precision: 0,\n    }),\n  },\n};\n"],"mappings":"AAAA,SACEA,eADF,EAEEC,MAFF,EAGEC,cAHF,EAIEC,eAJF,EAKEC,gBALF,EAMEC,cANF,EAOEC,gBAPF,EAQEC,QARF,EASEC,mBATF,QAUO,iBAVP;AAYA,OAAO,MAAMC,SAAS,GAAG;EACvBC,IAAI,EAAE,aADiB;EAEvBC,GAAG,EAAE,YAFkB;EAGvBC,QAAQ,EAAEZ,eAAe,CAACa,MAHH;EAIvBC,MAAM,EAAE,EAJe;EAKvBC,QAAQ,EAAE,CAACR,QAAQ,CAACS,OAAV,CALa;EAMvBC,mBAAmB,EAAE,CACnBT,mBAAmB,CAACU,OADD,EAEnBV,mBAAmB,CAACW,OAFD,EAGnBX,mBAAmB,CAACY,QAHD,CANE;EAWvBC,KAAK,EAAE;IACLC,OAAO,EAAEhB,gBAAgB,EADpB;IAELiB,IAAI,EAAErB,cAAc,EAFf;IAGLsB,KAAK,EAAErB,eAAe,CAAC;MACrBsB,KAAK,EAAE,OADc;MAErBC,KAAK,EAAEzB,MAAM,CAAC0B;IAFO,CAAD,CAHjB;IAOLC,QAAQ,EAAEvB,cAAc,CAAC;MACvBoB,KAAK,EAAE,UADgB;MAEvBC,KAAK,EAAEzB,MAAM,CAAC0B;IAFS,CAAD,CAPnB;IAWLE,IAAI,EAAEzB,gBAAgB,CAAC;MACrBsB,KAAK,EAAEzB,MAAM,CAAC0B,KADO;MAErBF,KAAK,EAAE,MAFc;MAGrBK,WAAW,EAAE,+BAHQ;MAIrBC,YAAY,EAAE,EAJO;MAKrBC,GAAG,EAAE,EALgB;MAMrBC,GAAG,EAAE,GANgB;MAOrBC,IAAI,EAAE,CAPe;MAQrBC,SAAS,EAAE;IARU,CAAD;EAXjB;AAXgB,CAAlB"}

package/lib/module/mappings/Image.js

@@ -1,9 +1,10 @@
-import { COMPONENT_TYPES, createImageProp, createResizeModeProp } from "@draftbit/types";
+import { COMPONENT_TYPES, createImageProp, createResizeModeProp, StylesPanelSections } from "@draftbit/types";
 export const SEED_DATA = {
   name: "Image",
   tag: "Image",
   description: "A basic Image Component",
   category: COMPONENT_TYPES.media,
+  stylesPanelSections: [StylesPanelSections.Size, StylesPanelSections.Margins, StylesPanelSections.Position, StylesPanelSections.Effects],
   layout: {
     width: 250,
     height: 250

package/lib/module/mappings/Image.js.map

@@ -1 +1 @@
-{"version":3,"names":["COMPONENT_TYPES","createImageProp","createResizeModeProp","SEED_DATA","name","tag","description","category","media","layout","width","height","props","source","resizeMode"],"sources":["Image.ts"],"sourcesContent":["import {\n  COMPONENT_TYPES,\n  createImageProp,\n  createResizeModeProp,\n} from \"@draftbit/types\";\n\nexport const SEED_DATA = {\n  name: \"Image\",\n  tag: \"Image\",\n  description: \"A basic Image Component\",\n  category: COMPONENT_TYPES.media,\n  layout: {\n    width: 250,\n    height: 250,\n  },\n  props: {\n    source: createImageProp(),\n    resizeMode: createResizeModeProp(),\n  },\n};\n"],"mappings":"AAAA,SACEA,eADF,EAEEC,eAFF,EAGEC,oBAHF,QAIO,iBAJP;AAMA,OAAO,MAAMC,SAAS,GAAG;EACvBC,IAAI,EAAE,OADiB;EAEvBC,GAAG,EAAE,OAFkB;EAGvBC,WAAW,EAAE,yBAHU;EAIvBC,QAAQ,EAAEP,eAAe,CAACQ,KAJH;EAKvBC,MAAM,EAAE;IACNC,KAAK,EAAE,GADD;IAENC,MAAM,EAAE;EAFF,CALe;EASvBC,KAAK,EAAE;IACLC,MAAM,EAAEZ,eAAe,EADlB;IAELa,UAAU,EAAEZ,oBAAoB;EAF3B;AATgB,CAAlB"}
+{"version":3,"names":["COMPONENT_TYPES","createImageProp","createResizeModeProp","StylesPanelSections","SEED_DATA","name","tag","description","category","media","stylesPanelSections","Size","Margins","Position","Effects","layout","width","height","props","source","resizeMode"],"sources":["Image.ts"],"sourcesContent":["import {\n  COMPONENT_TYPES,\n  createImageProp,\n  createResizeModeProp,\n  StylesPanelSections,\n} from \"@draftbit/types\";\n\nexport const SEED_DATA = {\n  name: \"Image\",\n  tag: \"Image\",\n  description: \"A basic Image Component\",\n  category: COMPONENT_TYPES.media,\n  stylesPanelSections: [\n    StylesPanelSections.Size,\n    StylesPanelSections.Margins,\n    StylesPanelSections.Position,\n    StylesPanelSections.Effects,\n  ],\n  layout: {\n    width: 250,\n    height: 250,\n  },\n  props: {\n    source: createImageProp(),\n    resizeMode: createResizeModeProp(),\n  },\n};\n"],"mappings":"AAAA,SACEA,eADF,EAEEC,eAFF,EAGEC,oBAHF,EAIEC,mBAJF,QAKO,iBALP;AAOA,OAAO,MAAMC,SAAS,GAAG;EACvBC,IAAI,EAAE,OADiB;EAEvBC,GAAG,EAAE,OAFkB;EAGvBC,WAAW,EAAE,yBAHU;EAIvBC,QAAQ,EAAER,eAAe,CAACS,KAJH;EAKvBC,mBAAmB,EAAE,CACnBP,mBAAmB,CAACQ,IADD,EAEnBR,mBAAmB,CAACS,OAFD,EAGnBT,mBAAmB,CAACU,QAHD,EAInBV,mBAAmB,CAACW,OAJD,CALE;EAWvBC,MAAM,EAAE;IACNC,KAAK,EAAE,GADD;IAENC,MAAM,EAAE;EAFF,CAXe;EAevBC,KAAK,EAAE;IACLC,MAAM,EAAElB,eAAe,EADlB;IAELmB,UAAU,EAAElB,oBAAoB;EAF3B;AAfgB,CAAlB"}

package/lib/module/mappings/ImageBackground.js

@@ -1,4 +1,4 @@
-import { COMPONENT_TYPES, createImageProp, createResizeModeProp, createTextEnumProp, createColorProp } from "@draftbit/types";
+import { COMPONENT_TYPES, createImageProp, createResizeModeProp, createTextEnumProp, createColorProp, CONTAINER_COMPONENT_STYLES_SECTIONS } from "@draftbit/types";
 export const SEED_DATA = {
   name: "Image Background",
   tag: "ImageBackground",
@@ -6,6 +6,7 @@ export const SEED_DATA = {
   code_link: "https://github.com/facebook/react-native/blob/master/Libraries/Image/ImageBackground.js",
   description: "A very simple drop-in replacement for Image that allows you to use an Image as a background.",
   category: COMPONENT_TYPES.media,
+  stylesPanelSections: CONTAINER_COMPONENT_STYLES_SECTIONS,
   layout: {
     width: "100%",
     height: "100%"

package/lib/module/mappings/ImageBackground.js.map

@@ -1 +1 @@
-{"version":3,"names":["COMPONENT_TYPES","createImageProp","createResizeModeProp","createTextEnumProp","createColorProp","SEED_DATA","name","tag","doc_link","code_link","description","category","media","layout","width","height","props","source","defaultValue","resizeMode","backgroundColor","label","backfaceVisibility","options"],"sources":["ImageBackground.ts"],"sourcesContent":["import {\n  COMPONENT_TYPES,\n  createImageProp,\n  createResizeModeProp,\n  createTextEnumProp,\n  createColorProp,\n} from \"@draftbit/types\";\n\nexport const SEED_DATA = {\n  name: \"Image Background\",\n  tag: \"ImageBackground\",\n  doc_link:\n    \"https://docs.expo.io/versions/latest/react-native/imagebackground/\",\n  code_link:\n    \"https://github.com/facebook/react-native/blob/master/Libraries/Image/ImageBackground.js\",\n  description:\n    \"A very simple drop-in replacement for Image that allows you to use an Image as a background.\",\n  category: COMPONENT_TYPES.media,\n  layout: {\n    width: \"100%\",\n    height: \"100%\",\n  },\n  props: {\n    source: createImageProp({\n      defaultValue:\n        \"https://static.draftbit.com/images/placeholder-image-background.png\",\n    }),\n    resizeMode: createResizeModeProp(),\n    backgroundColor: createColorProp({\n      label: \"Background Color\",\n      description: \"If no image is chosen render a colored background.\",\n    }),\n    backfaceVisibility: createTextEnumProp({\n      label: \"Backface Visibility\",\n      description: \"When animating a card, show the back face of it\",\n      options: [\"visible\", \"hidden\"],\n    }),\n  },\n};\n"],"mappings":"AAAA,SACEA,eADF,EAEEC,eAFF,EAGEC,oBAHF,EAIEC,kBAJF,EAKEC,eALF,QAMO,iBANP;AAQA,OAAO,MAAMC,SAAS,GAAG;EACvBC,IAAI,EAAE,kBADiB;EAEvBC,GAAG,EAAE,iBAFkB;EAGvBC,QAAQ,EACN,oEAJqB;EAKvBC,SAAS,EACP,yFANqB;EAOvBC,WAAW,EACT,8FARqB;EASvBC,QAAQ,EAAEX,eAAe,CAACY,KATH;EAUvBC,MAAM,EAAE;IACNC,KAAK,EAAE,MADD;IAENC,MAAM,EAAE;EAFF,CAVe;EAcvBC,KAAK,EAAE;IACLC,MAAM,EAAEhB,eAAe,CAAC;MACtBiB,YAAY,EACV;IAFoB,CAAD,CADlB;IAKLC,UAAU,EAAEjB,oBAAoB,EAL3B;IAMLkB,eAAe,EAAEhB,eAAe,CAAC;MAC/BiB,KAAK,EAAE,kBADwB;MAE/BX,WAAW,EAAE;IAFkB,CAAD,CAN3B;IAULY,kBAAkB,EAAEnB,kBAAkB,CAAC;MACrCkB,KAAK,EAAE,qBAD8B;MAErCX,WAAW,EAAE,iDAFwB;MAGrCa,OAAO,EAAE,CAAC,SAAD,EAAY,QAAZ;IAH4B,CAAD;EAVjC;AAdgB,CAAlB"}
+{"version":3,"names":["COMPONENT_TYPES","createImageProp","createResizeModeProp","createTextEnumProp","createColorProp","CONTAINER_COMPONENT_STYLES_SECTIONS","SEED_DATA","name","tag","doc_link","code_link","description","category","media","stylesPanelSections","layout","width","height","props","source","defaultValue","resizeMode","backgroundColor","label","backfaceVisibility","options"],"sources":["ImageBackground.ts"],"sourcesContent":["import {\n  COMPONENT_TYPES,\n  createImageProp,\n  createResizeModeProp,\n  createTextEnumProp,\n  createColorProp,\n  CONTAINER_COMPONENT_STYLES_SECTIONS,\n} from \"@draftbit/types\";\n\nexport const SEED_DATA = {\n  name: \"Image Background\",\n  tag: \"ImageBackground\",\n  doc_link:\n    \"https://docs.expo.io/versions/latest/react-native/imagebackground/\",\n  code_link:\n    \"https://github.com/facebook/react-native/blob/master/Libraries/Image/ImageBackground.js\",\n  description:\n    \"A very simple drop-in replacement for Image that allows you to use an Image as a background.\",\n  category: COMPONENT_TYPES.media,\n  stylesPanelSections: CONTAINER_COMPONENT_STYLES_SECTIONS,\n  layout: {\n    width: \"100%\",\n    height: \"100%\",\n  },\n  props: {\n    source: createImageProp({\n      defaultValue:\n        \"https://static.draftbit.com/images/placeholder-image-background.png\",\n    }),\n    resizeMode: createResizeModeProp(),\n    backgroundColor: createColorProp({\n      label: \"Background Color\",\n      description: \"If no image is chosen render a colored background.\",\n    }),\n    backfaceVisibility: createTextEnumProp({\n      label: \"Backface Visibility\",\n      description: \"When animating a card, show the back face of it\",\n      options: [\"visible\", \"hidden\"],\n    }),\n  },\n};\n"],"mappings":"AAAA,SACEA,eADF,EAEEC,eAFF,EAGEC,oBAHF,EAIEC,kBAJF,EAKEC,eALF,EAMEC,mCANF,QAOO,iBAPP;AASA,OAAO,MAAMC,SAAS,GAAG;EACvBC,IAAI,EAAE,kBADiB;EAEvBC,GAAG,EAAE,iBAFkB;EAGvBC,QAAQ,EACN,oEAJqB;EAKvBC,SAAS,EACP,yFANqB;EAOvBC,WAAW,EACT,8FARqB;EASvBC,QAAQ,EAAEZ,eAAe,CAACa,KATH;EAUvBC,mBAAmB,EAAET,mCAVE;EAWvBU,MAAM,EAAE;IACNC,KAAK,EAAE,MADD;IAENC,MAAM,EAAE;EAFF,CAXe;EAevBC,KAAK,EAAE;IACLC,MAAM,EAAElB,eAAe,CAAC;MACtBmB,YAAY,EACV;IAFoB,CAAD,CADlB;IAKLC,UAAU,EAAEnB,oBAAoB,EAL3B;IAMLoB,eAAe,EAAElB,eAAe,CAAC;MAC/BmB,KAAK,EAAE,kBADwB;MAE/BZ,WAAW,EAAE;IAFkB,CAAD,CAN3B;IAULa,kBAAkB,EAAErB,kBAAkB,CAAC;MACrCoB,KAAK,EAAE,qBAD8B;MAErCZ,WAAW,EAAE,iDAFwB;MAGrCc,OAAO,EAAE,CAAC,SAAD,EAAY,QAAZ;IAH4B,CAAD;EAVjC;AAfgB,CAAlB"}

package/lib/module/mappings/KeyboardAvoidingView.js

@@ -1,9 +1,10 @@
-import { COMPONENT_TYPES, FORM_TYPES, PROP_TYPES, GROUPS } from "@draftbit/types";
+import { COMPONENT_TYPES, FORM_TYPES, PROP_TYPES, GROUPS, CONTAINER_COMPONENT_STYLES_SECTIONS } from "@draftbit/types";
 export const SEED_DATA = {
   name: "Keyboard Avoiding View",
   tag: "KeyboardAvoidingView",
   description: "View that moves out of the way of the virtual keyboard. ",
   category: COMPONENT_TYPES.layout,
+  stylesPanelSections: CONTAINER_COMPONENT_STYLES_SECTIONS,
   props: {
     enabled: {
       label: "Enabled",

package/lib/module/mappings/KeyboardAvoidingView.js.map

@@ -1 +1 @@
-{"version":3,"names":["COMPONENT_TYPES","FORM_TYPES","PROP_TYPES","GROUPS","SEED_DATA","name","tag","description","category","layout","props","enabled","label","editable","required","defaultValue","formType","boolean","propType","BOOLEAN","group","basic","behavior","options","flatArray","STRING","keyboardVerticalOffset","number","NUMBER"],"sources":["KeyboardAvoidingView.ts"],"sourcesContent":["import {\n  COMPONENT_TYPES,\n  FORM_TYPES,\n  PROP_TYPES,\n  GROUPS,\n} from \"@draftbit/types\";\n\nexport const SEED_DATA = {\n  name: \"Keyboard Avoiding View\",\n  tag: \"KeyboardAvoidingView\",\n  description: \"View that moves out of the way of the virtual keyboard. \",\n  category: COMPONENT_TYPES.layout,\n  props: {\n    enabled: {\n      label: \"Enabled\",\n      description: \"Enable the keyboard avoiding view\",\n      editable: true,\n      required: true,\n      defaultValue: true,\n      formType: FORM_TYPES.boolean,\n      propType: PROP_TYPES.BOOLEAN,\n      group: GROUPS.basic,\n    },\n    behavior: {\n      label: \"Resizing Behavior\",\n      description:\n        \"The behavior for how the keyboard resizing interacts with the rest of the screen. (Default: padding).\",\n      editable: true,\n      required: true,\n      defaultValue: \"padding\",\n      options: [\"padding\", \"position\", \"height\"],\n      formType: FORM_TYPES.flatArray,\n      propType: PROP_TYPES.STRING,\n      group: GROUPS.basic,\n    },\n    keyboardVerticalOffset: {\n      label: \"Keyboard Vertical Offset\",\n      description:\n        \"The distance between the bottom of the view and the keyboard\",\n      editable: true,\n      required: false,\n      defaultValue: 0,\n      formType: FORM_TYPES.number,\n      propType: PROP_TYPES.NUMBER,\n      group: GROUPS.basic,\n    },\n  },\n};\n"],"mappings":"AAAA,SACEA,eADF,EAEEC,UAFF,EAGEC,UAHF,EAIEC,MAJF,QAKO,iBALP;AAOA,OAAO,MAAMC,SAAS,GAAG;EACvBC,IAAI,EAAE,wBADiB;EAEvBC,GAAG,EAAE,sBAFkB;EAGvBC,WAAW,EAAE,0DAHU;EAIvBC,QAAQ,EAAER,eAAe,CAACS,MAJH;EAKvBC,KAAK,EAAE;IACLC,OAAO,EAAE;MACPC,KAAK,EAAE,SADA;MAEPL,WAAW,EAAE,mCAFN;MAGPM,QAAQ,EAAE,IAHH;MAIPC,QAAQ,EAAE,IAJH;MAKPC,YAAY,EAAE,IALP;MAMPC,QAAQ,EAAEf,UAAU,CAACgB,OANd;MAOPC,QAAQ,EAAEhB,UAAU,CAACiB,OAPd;MAQPC,KAAK,EAAEjB,MAAM,CAACkB;IARP,CADJ;IAWLC,QAAQ,EAAE;MACRV,KAAK,EAAE,mBADC;MAERL,WAAW,EACT,uGAHM;MAIRM,QAAQ,EAAE,IAJF;MAKRC,QAAQ,EAAE,IALF;MAMRC,YAAY,EAAE,SANN;MAORQ,OAAO,EAAE,CAAC,SAAD,EAAY,UAAZ,EAAwB,QAAxB,CAPD;MAQRP,QAAQ,EAAEf,UAAU,CAACuB,SARb;MASRN,QAAQ,EAAEhB,UAAU,CAACuB,MATb;MAURL,KAAK,EAAEjB,MAAM,CAACkB;IAVN,CAXL;IAuBLK,sBAAsB,EAAE;MACtBd,KAAK,EAAE,0BADe;MAEtBL,WAAW,EACT,8DAHoB;MAItBM,QAAQ,EAAE,IAJY;MAKtBC,QAAQ,EAAE,KALY;MAMtBC,YAAY,EAAE,CANQ;MAOtBC,QAAQ,EAAEf,UAAU,CAAC0B,MAPC;MAQtBT,QAAQ,EAAEhB,UAAU,CAAC0B,MARC;MAStBR,KAAK,EAAEjB,MAAM,CAACkB;IATQ;EAvBnB;AALgB,CAAlB"}
+{"version":3,"names":["COMPONENT_TYPES","FORM_TYPES","PROP_TYPES","GROUPS","CONTAINER_COMPONENT_STYLES_SECTIONS","SEED_DATA","name","tag","description","category","layout","stylesPanelSections","props","enabled","label","editable","required","defaultValue","formType","boolean","propType","BOOLEAN","group","basic","behavior","options","flatArray","STRING","keyboardVerticalOffset","number","NUMBER"],"sources":["KeyboardAvoidingView.ts"],"sourcesContent":["import {\n  COMPONENT_TYPES,\n  FORM_TYPES,\n  PROP_TYPES,\n  GROUPS,\n  CONTAINER_COMPONENT_STYLES_SECTIONS,\n} from \"@draftbit/types\";\n\nexport const SEED_DATA = {\n  name: \"Keyboard Avoiding View\",\n  tag: \"KeyboardAvoidingView\",\n  description: \"View that moves out of the way of the virtual keyboard. \",\n  category: COMPONENT_TYPES.layout,\n  stylesPanelSections: CONTAINER_COMPONENT_STYLES_SECTIONS,\n  props: {\n    enabled: {\n      label: \"Enabled\",\n      description: \"Enable the keyboard avoiding view\",\n      editable: true,\n      required: true,\n      defaultValue: true,\n      formType: FORM_TYPES.boolean,\n      propType: PROP_TYPES.BOOLEAN,\n      group: GROUPS.basic,\n    },\n    behavior: {\n      label: \"Resizing Behavior\",\n      description:\n        \"The behavior for how the keyboard resizing interacts with the rest of the screen. (Default: padding).\",\n      editable: true,\n      required: true,\n      defaultValue: \"padding\",\n      options: [\"padding\", \"position\", \"height\"],\n      formType: FORM_TYPES.flatArray,\n      propType: PROP_TYPES.STRING,\n      group: GROUPS.basic,\n    },\n    keyboardVerticalOffset: {\n      label: \"Keyboard Vertical Offset\",\n      description:\n        \"The distance between the bottom of the view and the keyboard\",\n      editable: true,\n      required: false,\n      defaultValue: 0,\n      formType: FORM_TYPES.number,\n      propType: PROP_TYPES.NUMBER,\n      group: GROUPS.basic,\n    },\n  },\n};\n"],"mappings":"AAAA,SACEA,eADF,EAEEC,UAFF,EAGEC,UAHF,EAIEC,MAJF,EAKEC,mCALF,QAMO,iBANP;AAQA,OAAO,MAAMC,SAAS,GAAG;EACvBC,IAAI,EAAE,wBADiB;EAEvBC,GAAG,EAAE,sBAFkB;EAGvBC,WAAW,EAAE,0DAHU;EAIvBC,QAAQ,EAAET,eAAe,CAACU,MAJH;EAKvBC,mBAAmB,EAAEP,mCALE;EAMvBQ,KAAK,EAAE;IACLC,OAAO,EAAE;MACPC,KAAK,EAAE,SADA;MAEPN,WAAW,EAAE,mCAFN;MAGPO,QAAQ,EAAE,IAHH;MAIPC,QAAQ,EAAE,IAJH;MAKPC,YAAY,EAAE,IALP;MAMPC,QAAQ,EAAEjB,UAAU,CAACkB,OANd;MAOPC,QAAQ,EAAElB,UAAU,CAACmB,OAPd;MAQPC,KAAK,EAAEnB,MAAM,CAACoB;IARP,CADJ;IAWLC,QAAQ,EAAE;MACRV,KAAK,EAAE,mBADC;MAERN,WAAW,EACT,uGAHM;MAIRO,QAAQ,EAAE,IAJF;MAKRC,QAAQ,EAAE,IALF;MAMRC,YAAY,EAAE,SANN;MAORQ,OAAO,EAAE,CAAC,SAAD,EAAY,UAAZ,EAAwB,QAAxB,CAPD;MAQRP,QAAQ,EAAEjB,UAAU,CAACyB,SARb;MASRN,QAAQ,EAAElB,UAAU,CAACyB,MATb;MAURL,KAAK,EAAEnB,MAAM,CAACoB;IAVN,CAXL;IAuBLK,sBAAsB,EAAE;MACtBd,KAAK,EAAE,0BADe;MAEtBN,WAAW,EACT,8DAHoB;MAItBO,QAAQ,EAAE,IAJY;MAKtBC,QAAQ,EAAE,KALY;MAMtBC,YAAY,EAAE,CANQ;MAOtBC,QAAQ,EAAEjB,UAAU,CAAC4B,MAPC;MAQtBT,QAAQ,EAAElB,UAAU,CAAC4B,MARC;MAStBR,KAAK,EAAEnB,MAAM,CAACoB;IATQ;EAvBnB;AANgB,CAAlB"}

package/lib/module/mappings/KeyboardAwareScrollView.js

@@ -1,9 +1,10 @@
-import { COMPONENT_TYPES, createStaticBoolProp, createStaticNumberProp, createTextEnumProp } from "@draftbit/types";
+import { COMPONENT_TYPES, createStaticBoolProp, createStaticNumberProp, createTextEnumProp, CONTAINER_COMPONENT_STYLES_SECTIONS } from "@draftbit/types";
 export const SEED_DATA = {
   name: "Keyboard Aware Scroll View",
   tag: "KeyboardAwareScrollView",
   description: "View that moves pushes the content when virtual keyboard is open.",
   category: COMPONENT_TYPES.layout,
+  stylesPanelSections: CONTAINER_COMPONENT_STYLES_SECTIONS,
   layout: {},
   props: {
     viewIsInsideTabBar: createStaticBoolProp({

package/lib/module/mappings/KeyboardAwareScrollView.js.map

@@ -1 +1 @@
-{"version":3,"names":["COMPONENT_TYPES","createStaticBoolProp","createStaticNumberProp","createTextEnumProp","SEED_DATA","name","tag","description","category","layout","props","viewIsInsideTabBar","label","enableAutomaticScroll","extraHeight","extraScrollHeight","enableResetScrollToCoords","keyboardOpeningTime","enableOnAndroid","showsVerticalScrollIndicator","defaultValue","keyboardShouldPersistTaps","options"],"sources":["KeyboardAwareScrollView.ts"],"sourcesContent":["import {\n  COMPONENT_TYPES,\n  createStaticBoolProp,\n  createStaticNumberProp,\n  createTextEnumProp,\n} from \"@draftbit/types\";\n\nexport const SEED_DATA = {\n  name: \"Keyboard Aware Scroll View\",\n  tag: \"KeyboardAwareScrollView\",\n  description:\n    \"View that moves pushes the content when virtual keyboard is open.\",\n  category: COMPONENT_TYPES.layout,\n  layout: {},\n  props: {\n    viewIsInsideTabBar: createStaticBoolProp({\n      label: \"View Is Inside TabBar\",\n      description: \"Adds an extra offset that represents the TabBarIOS height.\",\n    }),\n    enableAutomaticScroll: createStaticBoolProp({\n      label: \"Enable Automatic Scroll\",\n      description:\n        \"When focus in TextInput will scroll the position, default is enabled\",\n    }),\n    extraHeight: createStaticNumberProp({\n      label: \"Extra Height\",\n      description: \"Adds an extra offset when focusing the TextInputs\",\n    }),\n    extraScrollHeight: createStaticNumberProp({\n      label: \"Extra Scroll Height\",\n      description:\n        \"Adds an extra offset to the keyboard. Useful if you want to stick elements above the keyboard\",\n    }),\n    enableResetScrollToCoords: createStaticBoolProp({\n      label: \"Enable Reset Scroll To Coordinates\",\n      description:\n        \"Lets the user enable or disable automatic resetScrollToCoords\",\n    }),\n    keyboardOpeningTime: createStaticNumberProp({\n      label: \"Opening Time\",\n      description:\n        \"Sets the delay time before scrolling to new position after keyboard opening, default is 250\",\n    }),\n    enableOnAndroid: createStaticBoolProp({\n      label: \"Enable On Android\",\n      description: \"Enable Android Support\",\n    }),\n    showsVerticalScrollIndicator: createStaticBoolProp({\n      label: \"Shows Vertical Scroll Indicator\",\n      description: \"Show or hide the vertical scroll indicator\",\n      defaultValue: true,\n    }),\n    keyboardShouldPersistTaps: createTextEnumProp({\n      label: \"Allow Touch Events\",\n      description:\n        \"Allows touch events on visible components to be processed while the keyboard is open\",\n      defaultValue: \"never\",\n      options: [\"never\", \"always\"],\n    }),\n  },\n};\n"],"mappings":"AAAA,SACEA,eADF,EAEEC,oBAFF,EAGEC,sBAHF,EAIEC,kBAJF,QAKO,iBALP;AAOA,OAAO,MAAMC,SAAS,GAAG;EACvBC,IAAI,EAAE,4BADiB;EAEvBC,GAAG,EAAE,yBAFkB;EAGvBC,WAAW,EACT,mEAJqB;EAKvBC,QAAQ,EAAER,eAAe,CAACS,MALH;EAMvBA,MAAM,EAAE,EANe;EAOvBC,KAAK,EAAE;IACLC,kBAAkB,EAAEV,oBAAoB,CAAC;MACvCW,KAAK,EAAE,uBADgC;MAEvCL,WAAW,EAAE;IAF0B,CAAD,CADnC;IAKLM,qBAAqB,EAAEZ,oBAAoB,CAAC;MAC1CW,KAAK,EAAE,yBADmC;MAE1CL,WAAW,EACT;IAHwC,CAAD,CALtC;IAULO,WAAW,EAAEZ,sBAAsB,CAAC;MAClCU,KAAK,EAAE,cAD2B;MAElCL,WAAW,EAAE;IAFqB,CAAD,CAV9B;IAcLQ,iBAAiB,EAAEb,sBAAsB,CAAC;MACxCU,KAAK,EAAE,qBADiC;MAExCL,WAAW,EACT;IAHsC,CAAD,CAdpC;IAmBLS,yBAAyB,EAAEf,oBAAoB,CAAC;MAC9CW,KAAK,EAAE,oCADuC;MAE9CL,WAAW,EACT;IAH4C,CAAD,CAnB1C;IAwBLU,mBAAmB,EAAEf,sBAAsB,CAAC;MAC1CU,KAAK,EAAE,cADmC;MAE1CL,WAAW,EACT;IAHwC,CAAD,CAxBtC;IA6BLW,eAAe,EAAEjB,oBAAoB,CAAC;MACpCW,KAAK,EAAE,mBAD6B;MAEpCL,WAAW,EAAE;IAFuB,CAAD,CA7BhC;IAiCLY,4BAA4B,EAAElB,oBAAoB,CAAC;MACjDW,KAAK,EAAE,iCAD0C;MAEjDL,WAAW,EAAE,4CAFoC;MAGjDa,YAAY,EAAE;IAHmC,CAAD,CAjC7C;IAsCLC,yBAAyB,EAAElB,kBAAkB,CAAC;MAC5CS,KAAK,EAAE,oBADqC;MAE5CL,WAAW,EACT,sFAH0C;MAI5Ca,YAAY,EAAE,OAJ8B;MAK5CE,OAAO,EAAE,CAAC,OAAD,EAAU,QAAV;IALmC,CAAD;EAtCxC;AAPgB,CAAlB"}
+{"version":3,"names":["COMPONENT_TYPES","createStaticBoolProp","createStaticNumberProp","createTextEnumProp","CONTAINER_COMPONENT_STYLES_SECTIONS","SEED_DATA","name","tag","description","category","layout","stylesPanelSections","props","viewIsInsideTabBar","label","enableAutomaticScroll","extraHeight","extraScrollHeight","enableResetScrollToCoords","keyboardOpeningTime","enableOnAndroid","showsVerticalScrollIndicator","defaultValue","keyboardShouldPersistTaps","options"],"sources":["KeyboardAwareScrollView.ts"],"sourcesContent":["import {\n  COMPONENT_TYPES,\n  createStaticBoolProp,\n  createStaticNumberProp,\n  createTextEnumProp,\n  CONTAINER_COMPONENT_STYLES_SECTIONS,\n} from \"@draftbit/types\";\n\nexport const SEED_DATA = {\n  name: \"Keyboard Aware Scroll View\",\n  tag: \"KeyboardAwareScrollView\",\n  description:\n    \"View that moves pushes the content when virtual keyboard is open.\",\n  category: COMPONENT_TYPES.layout,\n  stylesPanelSections: CONTAINER_COMPONENT_STYLES_SECTIONS,\n  layout: {},\n  props: {\n    viewIsInsideTabBar: createStaticBoolProp({\n      label: \"View Is Inside TabBar\",\n      description: \"Adds an extra offset that represents the TabBarIOS height.\",\n    }),\n    enableAutomaticScroll: createStaticBoolProp({\n      label: \"Enable Automatic Scroll\",\n      description:\n        \"When focus in TextInput will scroll the position, default is enabled\",\n    }),\n    extraHeight: createStaticNumberProp({\n      label: \"Extra Height\",\n      description: \"Adds an extra offset when focusing the TextInputs\",\n    }),\n    extraScrollHeight: createStaticNumberProp({\n      label: \"Extra Scroll Height\",\n      description:\n        \"Adds an extra offset to the keyboard. Useful if you want to stick elements above the keyboard\",\n    }),\n    enableResetScrollToCoords: createStaticBoolProp({\n      label: \"Enable Reset Scroll To Coordinates\",\n      description:\n        \"Lets the user enable or disable automatic resetScrollToCoords\",\n    }),\n    keyboardOpeningTime: createStaticNumberProp({\n      label: \"Opening Time\",\n      description:\n        \"Sets the delay time before scrolling to new position after keyboard opening, default is 250\",\n    }),\n    enableOnAndroid: createStaticBoolProp({\n      label: \"Enable On Android\",\n      description: \"Enable Android Support\",\n    }),\n    showsVerticalScrollIndicator: createStaticBoolProp({\n      label: \"Shows Vertical Scroll Indicator\",\n      description: \"Show or hide the vertical scroll indicator\",\n      defaultValue: true,\n    }),\n    keyboardShouldPersistTaps: createTextEnumProp({\n      label: \"Allow Touch Events\",\n      description:\n        \"Allows touch events on visible components to be processed while the keyboard is open\",\n      defaultValue: \"never\",\n      options: [\"never\", \"always\"],\n    }),\n  },\n};\n"],"mappings":"AAAA,SACEA,eADF,EAEEC,oBAFF,EAGEC,sBAHF,EAIEC,kBAJF,EAKEC,mCALF,QAMO,iBANP;AAQA,OAAO,MAAMC,SAAS,GAAG;EACvBC,IAAI,EAAE,4BADiB;EAEvBC,GAAG,EAAE,yBAFkB;EAGvBC,WAAW,EACT,mEAJqB;EAKvBC,QAAQ,EAAET,eAAe,CAACU,MALH;EAMvBC,mBAAmB,EAAEP,mCANE;EAOvBM,MAAM,EAAE,EAPe;EAQvBE,KAAK,EAAE;IACLC,kBAAkB,EAAEZ,oBAAoB,CAAC;MACvCa,KAAK,EAAE,uBADgC;MAEvCN,WAAW,EAAE;IAF0B,CAAD,CADnC;IAKLO,qBAAqB,EAAEd,oBAAoB,CAAC;MAC1Ca,KAAK,EAAE,yBADmC;MAE1CN,WAAW,EACT;IAHwC,CAAD,CALtC;IAULQ,WAAW,EAAEd,sBAAsB,CAAC;MAClCY,KAAK,EAAE,cAD2B;MAElCN,WAAW,EAAE;IAFqB,CAAD,CAV9B;IAcLS,iBAAiB,EAAEf,sBAAsB,CAAC;MACxCY,KAAK,EAAE,qBADiC;MAExCN,WAAW,EACT;IAHsC,CAAD,CAdpC;IAmBLU,yBAAyB,EAAEjB,oBAAoB,CAAC;MAC9Ca,KAAK,EAAE,oCADuC;MAE9CN,WAAW,EACT;IAH4C,CAAD,CAnB1C;IAwBLW,mBAAmB,EAAEjB,sBAAsB,CAAC;MAC1CY,KAAK,EAAE,cADmC;MAE1CN,WAAW,EACT;IAHwC,CAAD,CAxBtC;IA6BLY,eAAe,EAAEnB,oBAAoB,CAAC;MACpCa,KAAK,EAAE,mBAD6B;MAEpCN,WAAW,EAAE;IAFuB,CAAD,CA7BhC;IAiCLa,4BAA4B,EAAEpB,oBAAoB,CAAC;MACjDa,KAAK,EAAE,iCAD0C;MAEjDN,WAAW,EAAE,4CAFoC;MAGjDc,YAAY,EAAE;IAHmC,CAAD,CAjC7C;IAsCLC,yBAAyB,EAAEpB,kBAAkB,CAAC;MAC5CW,KAAK,EAAE,oBADqC;MAE5CN,WAAW,EACT,sFAH0C;MAI5Cc,YAAY,EAAE,OAJ8B;MAK5CE,OAAO,EAAE,CAAC,OAAD,EAAU,QAAV;IALmC,CAAD;EAtCxC;AARgB,CAAlB"}

package/lib/module/mappings/Layout.js

@@ -1,8 +1,9 @@
-import { GROUPS, FORM_TYPES, PROP_TYPES, COMPONENT_TYPES } from "@draftbit/types";
+import { GROUPS, FORM_TYPES, PROP_TYPES, COMPONENT_TYPES, StylesPanelSections } from "@draftbit/types";
 export const SEED_DATA = [{
   name: "Row",
   tag: "Row",
   category: COMPONENT_TYPES.layout,
+  stylesPanelSections: [StylesPanelSections.NoStyles],
   props: {
     justifyContent: {
       label: "Align Horizontally",
@@ -75,6 +76,7 @@ export const SEED_DATA = [{
   name: "Stack",
   tag: "Stack",
   category: COMPONENT_TYPES.layout,
+  stylesPanelSections: [StylesPanelSections.NoStyles],
   props: {
     justifyContent: {
       group: GROUPS.style,
@@ -101,6 +103,7 @@ export const SEED_DATA = [{
   name: "Center",
   tag: "Center",
   category: COMPONENT_TYPES.layout,
+  stylesPanelSections: [StylesPanelSections.NoStyles],
   props: {
     width: {
       label: "Width",
@@ -137,6 +140,7 @@ export const SEED_DATA = [{
   name: "Circle",
   tag: "Circle",
   category: COMPONENT_TYPES.layout,
+  stylesPanelSections: [StylesPanelSections.NoStyles],
   props: {
     size: {
       label: "Size",
@@ -163,6 +167,7 @@ export const SEED_DATA = [{
   name: "Square",
   tag: "Square",
   category: COMPONENT_TYPES.layout,
+  stylesPanelSections: [StylesPanelSections.NoStyles],
   props: {
     size: {
       label: "Size",