@draftbit/core 46.2.4-1cc3fe.10 → 46.2.4-258475.12

package/src/mappings/FieldSearchBarFull.js

@@ -4,7 +4,7 @@ export const SEED_DATA = [
         name: "Search Bar",
         tag: "FieldSearchBarFull",
         description: "A search bar with accompanying search icon and clear button.",
-        category: COMPONENT_TYPES.input,
+        category: COMPONENT_TYPES.deprecated,
         stylesPanelSections: BLOCK_STYLES_SECTIONS,
         preview_image_url: "{CLOUDINARY_URL}/Field_SearchBar_Full.png",
         supports_list_render: false,

package/src/mappings/FieldSearchBarFull.ts

@@ -13,7 +13,7 @@ export const SEED_DATA = [
     name: "Search Bar",
     tag: "FieldSearchBarFull",
     description: "A search bar with accompanying search icon and clear button.",
-    category: COMPONENT_TYPES.input,
+    category: COMPONENT_TYPES.deprecated,
     stylesPanelSections: BLOCK_STYLES_SECTIONS,
     preview_image_url: "{CLOUDINARY_URL}/Field_SearchBar_Full.png",
     supports_list_render: false,

package/src/mappings/FlashList.js

@@ -0,0 +1,33 @@
+import { COMPONENT_TYPES, createNumColumnsType, createStaticBoolProp, createNumberProp, CONTAINER_COMPONENT_STYLES_SECTIONS, GROUPS, } from "@draftbit/types";
+export const SEED_DATA = {
+    name: "FlashList",
+    tag: "FlashList",
+    description: "Flashlist by Shopify",
+    packageName: "@shopify/flash-list",
+    category: COMPONENT_TYPES.data,
+    stylesPanelSections: CONTAINER_COMPONENT_STYLES_SECTIONS,
+    layout: {
+        flex: 1,
+    },
+    props: {
+        estimatedItemSize: createNumberProp({
+            group: GROUPS.basic,
+            label: "Est. Item Size",
+            description: "Approximate size of the items before rendering.",
+            defaultValue: 50,
+            step: 1,
+            precision: 0,
+        }),
+        horizontal: createStaticBoolProp({
+            label: "Horizontal",
+            description: "Render list horizontally",
+        }),
+        inverted: createStaticBoolProp({
+            label: "Inverted",
+            description: "If true, reverses the direction.",
+        }),
+        numColumns: createNumColumnsType({
+            editable: true,
+        }),
+    },
+};

package/src/mappings/FlashList.ts

@@ -0,0 +1,41 @@
+import {
+  COMPONENT_TYPES,
+  createNumColumnsType,
+  createStaticBoolProp,
+  createNumberProp,
+  CONTAINER_COMPONENT_STYLES_SECTIONS,
+  GROUPS,
+} from "@draftbit/types";
+
+export const SEED_DATA = {
+  name: "FlashList",
+  tag: "FlashList",
+  description: "Flashlist by Shopify",
+  packageName: "@shopify/flash-list",
+  category: COMPONENT_TYPES.data,
+  stylesPanelSections: CONTAINER_COMPONENT_STYLES_SECTIONS,
+  layout: {
+    flex: 1,
+  },
+  props: {
+    estimatedItemSize: createNumberProp({
+      group: GROUPS.basic,
+      label: "Est. Item Size",
+      description: "Approximate size of the items before rendering.",
+      defaultValue: 50,
+      step: 1,
+      precision: 0,
+    }),
+    horizontal: createStaticBoolProp({
+      label: "Horizontal",
+      description: "Render list horizontally",
+    }),
+    inverted: createStaticBoolProp({
+      label: "Inverted",
+      description: "If true, reverses the direction.",
+    }),
+    numColumns: createNumColumnsType({
+      editable: true,
+    }),
+  },
+};

package/src/mappings/HeaderLarge.js

@@ -4,7 +4,7 @@ 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,
+        category: COMPONENT_TYPES.deprecatedHeader,
         stylesPanelSections: BLOCK_STYLES_SECTIONS,
         layout: {},
         triggers: [Triggers.OnPress],

package/src/mappings/HeaderLarge.ts

@@ -13,7 +13,7 @@ export const SEED_DATA = [
     tag: "HeaderLarge",
     description:
       "A large header with an optional touchable right aligned text and icon.",
-    category: COMPONENT_TYPES.header,
+    category: COMPONENT_TYPES.deprecatedHeader,
     stylesPanelSections: BLOCK_STYLES_SECTIONS,
     layout: {},
     triggers: [Triggers.OnPress],

package/src/mappings/HeaderMedium.js

@@ -4,7 +4,7 @@ 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,
+        category: COMPONENT_TYPES.deprecatedHeader,
         stylesPanelSections: BLOCK_STYLES_SECTIONS,
         preview_image_url: "{CLOUDINARY_URL}/Header_HeadlineMediumIconText.png",
         supports_list_render: false,

package/src/mappings/HeaderMedium.ts

@@ -12,7 +12,7 @@ export const SEED_DATA = [
     tag: "HeaderMedium",
     description:
       "A medium header with an optional touchable right aligned text and icon.",
-    category: COMPONENT_TYPES.header,
+    category: COMPONENT_TYPES.deprecatedHeader,
     stylesPanelSections: BLOCK_STYLES_SECTIONS,
     preview_image_url: "{CLOUDINARY_URL}/Header_HeadlineMediumIconText.png",
     supports_list_render: false,

package/src/mappings/HeaderOverline.js

@@ -4,7 +4,7 @@ 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,
+        category: COMPONENT_TYPES.deprecatedHeader,
         stylesPanelSections: BLOCK_STYLES_SECTIONS,
         preview_image_url: "{CLOUDINARY_URL}/Header_OverlineIconText.png",
         supports_list_render: false,

package/src/mappings/HeaderOverline.ts

@@ -12,7 +12,7 @@ export const SEED_DATA = [
     tag: "HeaderOverline",
     description:
       "A small header with an optional touchable right aligned text and icon.",
-    category: COMPONENT_TYPES.header,
+    category: COMPONENT_TYPES.deprecatedHeader,
     stylesPanelSections: BLOCK_STYLES_SECTIONS,
     preview_image_url: "{CLOUDINARY_URL}/Header_OverlineIconText.png",
     supports_list_render: false,

package/src/mappings/KeyboardAvoidingView.js

@@ -3,7 +3,7 @@ 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,
+    category: COMPONENT_TYPES.view,
     stylesPanelSections: CONTAINER_COMPONENT_STYLES_SECTIONS,
     props: {
         enabled: {

package/src/mappings/KeyboardAvoidingView.ts

@@ -10,7 +10,7 @@ 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,
+  category: COMPONENT_TYPES.view,
   stylesPanelSections: CONTAINER_COMPONENT_STYLES_SECTIONS,
   props: {
     enabled: {

package/src/mappings/KeyboardAwareScrollView.js

@@ -3,7 +3,7 @@ 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,
+    category: COMPONENT_TYPES.view,
     stylesPanelSections: CONTAINER_COMPONENT_STYLES_SECTIONS,
     layout: {},
     props: {

package/src/mappings/KeyboardAwareScrollView.ts

@@ -11,7 +11,7 @@ export const SEED_DATA = {
   tag: "KeyboardAwareScrollView",
   description:
     "View that moves pushes the content when virtual keyboard is open.",
-  category: COMPONENT_TYPES.layout,
+  category: COMPONENT_TYPES.view,
   stylesPanelSections: CONTAINER_COMPONENT_STYLES_SECTIONS,
   layout: {},
   props: {

package/src/mappings/Layout.js

@@ -3,7 +3,7 @@ export const SEED_DATA = [
     {
         name: "Row",
         tag: "Row",
-        category: COMPONENT_TYPES.layout,
+        category: COMPONENT_TYPES.deprecated,
         stylesPanelSections: [StylesPanelSections.NoStyles],
         props: {
             justifyContent: {
@@ -78,7 +78,7 @@ export const SEED_DATA = [
     {
         name: "Stack",
         tag: "Stack",
-        category: COMPONENT_TYPES.layout,
+        category: COMPONENT_TYPES.deprecated,
         stylesPanelSections: [StylesPanelSections.NoStyles],
         props: {
             justifyContent: {

package/src/mappings/Layout.ts

@@ -10,7 +10,7 @@ export const SEED_DATA = [
   {
     name: "Row",
     tag: "Row",
-    category: COMPONENT_TYPES.layout,
+    category: COMPONENT_TYPES.deprecated,
     stylesPanelSections: [StylesPanelSections.NoStyles],
     props: {
       justifyContent: {
@@ -85,7 +85,7 @@ export const SEED_DATA = [
   {
     name: "Stack",
     tag: "Stack",
-    category: COMPONENT_TYPES.layout,
+    category: COMPONENT_TYPES.deprecated,
     stylesPanelSections: [StylesPanelSections.NoStyles],
     props: {
       justifyContent: {

package/src/mappings/MapCallout.js

@@ -4,7 +4,7 @@ export const SEED_DATA = {
     tag: "MapCallout",
     packageName: "@draftbit/maps",
     description: "An info window to display on top of a marker when it is clicked",
-    category: COMPONENT_TYPES.media,
+    category: COMPONENT_TYPES.map,
     triggers: [Triggers.OnPress],
     layout: {},
     props: {

package/src/mappings/MapCallout.ts

@@ -12,7 +12,7 @@ export const SEED_DATA = {
   packageName: "@draftbit/maps",
   description:
     "An info window to display on top of a marker when it is clicked",
-  category: COMPONENT_TYPES.media,
+  category: COMPONENT_TYPES.map,
   triggers: [Triggers.OnPress],
   layout: {},
   props: {

package/src/mappings/MapMarker.js

@@ -4,7 +4,7 @@ export const SEED_DATA = {
     tag: "MapMarker",
     packageName: "@draftbit/maps",
     description: "A marker to show inside map view",
-    category: COMPONENT_TYPES.media,
+    category: COMPONENT_TYPES.map,
     layout: {},
     props: {
         latitude: createNumberProp({

package/src/mappings/MapMarker.ts

@@ -12,7 +12,7 @@ export const SEED_DATA = {
   tag: "MapMarker",
   packageName: "@draftbit/maps",
   description: "A marker to show inside map view",
-  category: COMPONENT_TYPES.media,
+  category: COMPONENT_TYPES.map,
   layout: {},
   props: {
     latitude: createNumberProp({

package/src/mappings/MapView.js

@@ -4,7 +4,7 @@ export const SEED_DATA = {
     tag: "MapView",
     packageName: "@draftbit/maps",
     description: "A map view",
-    category: COMPONENT_TYPES.media,
+    category: COMPONENT_TYPES.map,
     layout: {
         flex: 1,
     },

package/src/mappings/MapView.ts

@@ -14,7 +14,7 @@ export const SEED_DATA = {
   tag: "MapView",
   packageName: "@draftbit/maps",
   description: "A map view",
-  category: COMPONENT_TYPES.media,
+  category: COMPONENT_TYPES.map,
   layout: {
     flex: 1,
   },

package/src/mappings/Modal.js

@@ -3,7 +3,7 @@ export const SEED_DATA = {
     name: "Modal",
     tag: "Modal",
     description: "A basic Modal Component",
-    category: COMPONENT_TYPES.container,
+    category: COMPONENT_TYPES.layout,
     stylesPanelSections: [StylesPanelSections.NoStyles],
     props: {
         animationType: {

package/src/mappings/Modal.ts

@@ -11,7 +11,7 @@ export const SEED_DATA = {
   name: "Modal",
   tag: "Modal",
   description: "A basic Modal Component",
-  category: COMPONENT_TYPES.container,
+  category: COMPONENT_TYPES.layout,
   stylesPanelSections: [StylesPanelSections.NoStyles],
   props: {
     animationType: {

package/src/mappings/RadioButton.js

@@ -2,7 +2,7 @@ import { GROUPS, COMPONENT_TYPES, createBoolProp, createColorProp, createNumberP
 export const SEED_DATA = {
     name: "Radio Button",
     tag: "RadioButton",
-    category: COMPONENT_TYPES.input,
+    category: COMPONENT_TYPES.control,
     stylesPanelSections: BLOCK_STYLES_SECTIONS,
     triggers: [Triggers.OnPress],
     props: {

package/src/mappings/RadioButton.ts

@@ -13,7 +13,7 @@ import {
 export const SEED_DATA = {
   name: "Radio Button",
   tag: "RadioButton",
-  category: COMPONENT_TYPES.input,
+  category: COMPONENT_TYPES.control,
   stylesPanelSections: BLOCK_STYLES_SECTIONS,
   triggers: [Triggers.OnPress],
   props: {

package/src/mappings/RadioButtonGroup.js

@@ -2,7 +2,7 @@ import { COMPONENT_TYPES, createFieldNameProp, createDirectionProp, Triggers, St
 export const SEED_DATA = {
     name: "Radio Button Group",
     tag: "RadioButtonGroup",
-    category: COMPONENT_TYPES.input,
+    category: COMPONENT_TYPES.control,
     stylesPanelSections: [StylesPanelSections.Margins],
     layout: {},
     triggers: [Triggers.OnValueChange],

package/src/mappings/RadioButtonGroup.ts

@@ -9,7 +9,7 @@ import {
 export const SEED_DATA = {
   name: "Radio Button Group",
   tag: "RadioButtonGroup",
-  category: COMPONENT_TYPES.input,
+  category: COMPONENT_TYPES.control,
   stylesPanelSections: [StylesPanelSections.Margins],
   layout: {},
   triggers: [Triggers.OnValueChange],

package/src/mappings/RadioButtonRow.js

@@ -2,7 +2,7 @@ import { createTextProp, createTextEnumProp, COMPONENT_TYPES, createColorProp, G
 export const SEED_DATA = {
     name: "Radio Button Row",
     tag: "RadioButtonRow",
-    category: COMPONENT_TYPES.input,
+    category: COMPONENT_TYPES.control,
     stylesPanelSections: [
         StylesPanelSections.Typography,
         StylesPanelSections.Margins,

package/src/mappings/RadioButtonRow.ts

@@ -10,7 +10,7 @@ import {
 export const SEED_DATA = {
   name: "Radio Button Row",
   tag: "RadioButtonRow",
-  category: COMPONENT_TYPES.input,
+  category: COMPONENT_TYPES.control,
   stylesPanelSections: [
     StylesPanelSections.Typography,
     StylesPanelSections.Margins,

package/src/mappings/RowBodyIcon.js

@@ -4,7 +4,7 @@ export const SEED_DATA = [
         name: "Row Single Line Body Icon",
         tag: "RowBodyIcon",
         description: "A row with left aligned body text and a right aligned icon",
-        category: COMPONENT_TYPES.row,
+        category: COMPONENT_TYPES.deprecatedRow,
         preview_image_url: "{CLOUDINARY_URL}/Row_SingleLine_BodyIcon.png",
         supports_list_render: true,
         props: {
@@ -35,7 +35,7 @@ export const SEED_DATA = [
         name: "Row Double Line Body Icon",
         tag: "RowBodyIcon",
         description: "A row with left aligned body text and subtitle text and a right aligned icon",
-        category: COMPONENT_TYPES.row,
+        category: COMPONENT_TYPES.deprecatedRow,
         preview_image_url: "{CLOUDINARY_URL}/Row_DoubleLine_BodyIcon.png",
         supports_list_render: true,
         props: {

package/src/mappings/RowBodyIcon.ts

@@ -10,7 +10,7 @@ export const SEED_DATA = [
     name: "Row Single Line Body Icon",
     tag: "RowBodyIcon",
     description: "A row with left aligned body text and a right aligned icon",
-    category: COMPONENT_TYPES.row,
+    category: COMPONENT_TYPES.deprecatedRow,
     preview_image_url: "{CLOUDINARY_URL}/Row_SingleLine_BodyIcon.png",
     supports_list_render: true,
     props: {
@@ -42,7 +42,7 @@ export const SEED_DATA = [
     tag: "RowBodyIcon",
     description:
       "A row with left aligned body text and subtitle text and a right aligned icon",
-    category: COMPONENT_TYPES.row,
+    category: COMPONENT_TYPES.deprecatedRow,
     preview_image_url: "{CLOUDINARY_URL}/Row_DoubleLine_BodyIcon.png",
     supports_list_render: true,
     props: {

package/src/mappings/RowHeadlineImageCaption.js

@@ -4,7 +4,7 @@ export const SEED_DATA = [
         name: "Row Single Line Headline Caption",
         tag: "RowHeadlineImageCaption",
         description: "A row with left aligned headline text and right aligned caption text",
-        category: COMPONENT_TYPES.row,
+        category: COMPONENT_TYPES.deprecatedRow,
         preview_image_url: "{CLOUDINARY_URL}/Row_SingleLine_HeadlineCaption.png",
         supports_list_render: true,
         props: {
@@ -35,7 +35,7 @@ export const SEED_DATA = [
         name: "Row Single Line Headline Image Caption",
         tag: "RowHeadlineImageCaption",
         description: "A row with left aligned image and headline text and right aligned caption text",
-        category: COMPONENT_TYPES.row,
+        category: COMPONENT_TYPES.deprecatedRow,
         preview_image_url: "{CLOUDINARY_URL}/Row_SingleLine_HeadlineImageCaption.png",
         supports_list_render: true,
         props: {
@@ -76,7 +76,7 @@ export const SEED_DATA = [
         name: "Row Double Line Headline Caption",
         tag: "RowHeadlineImageCaption",
         description: "A row with left aligned headline text and subtitle text and right aligned caption text",
-        category: COMPONENT_TYPES.row,
+        category: COMPONENT_TYPES.deprecatedRow,
         preview_image_url: "{CLOUDINARY_URL}/Row_DoubleLine_HeadlineCaption.png",
         supports_list_render: true,
         props: {
@@ -117,7 +117,7 @@ export const SEED_DATA = [
         name: "Row Double Line Headline Image Caption",
         tag: "RowHeadlineImageCaption",
         description: "A row with left aligned image, headline text, and subtitle text, and right aligned caption text",
-        category: COMPONENT_TYPES.row,
+        category: COMPONENT_TYPES.deprecatedRow,
         preview_image_url: "{CLOUDINARY_URL}/Row_DoubleLine_HeadlineCaption.png",
         supports_list_render: true,
         props: {

package/src/mappings/RowHeadlineImageCaption.ts

@@ -11,7 +11,7 @@ export const SEED_DATA = [
     tag: "RowHeadlineImageCaption",
     description:
       "A row with left aligned headline text and right aligned caption text",
-    category: COMPONENT_TYPES.row,
+    category: COMPONENT_TYPES.deprecatedRow,
     preview_image_url: "{CLOUDINARY_URL}/Row_SingleLine_HeadlineCaption.png",
     supports_list_render: true,
     props: {
@@ -43,7 +43,7 @@ export const SEED_DATA = [
     tag: "RowHeadlineImageCaption",
     description:
       "A row with left aligned image and headline text and right aligned caption text",
-    category: COMPONENT_TYPES.row,
+    category: COMPONENT_TYPES.deprecatedRow,
     preview_image_url:
       "{CLOUDINARY_URL}/Row_SingleLine_HeadlineImageCaption.png",
     supports_list_render: true,
@@ -86,7 +86,7 @@ export const SEED_DATA = [
     tag: "RowHeadlineImageCaption",
     description:
       "A row with left aligned headline text and subtitle text and right aligned caption text",
-    category: COMPONENT_TYPES.row,
+    category: COMPONENT_TYPES.deprecatedRow,
     preview_image_url: "{CLOUDINARY_URL}/Row_DoubleLine_HeadlineCaption.png",
     supports_list_render: true,
     props: {
@@ -128,7 +128,7 @@ export const SEED_DATA = [
     tag: "RowHeadlineImageCaption",
     description:
       "A row with left aligned image, headline text, and subtitle text, and right aligned caption text",
-    category: COMPONENT_TYPES.row,
+    category: COMPONENT_TYPES.deprecatedRow,
     preview_image_url: "{CLOUDINARY_URL}/Row_DoubleLine_HeadlineCaption.png",
     supports_list_render: true,
     props: {

package/src/mappings/RowHeadlineImageIcon.js

@@ -23,7 +23,7 @@ export const SEED_DATA = [
         name: "Row Single Line Headline Icon",
         tag: "RowHeadlineImageIcon",
         description: "A row with left aligned headline text and a right aligned icon",
-        category: COMPONENT_TYPES.row,
+        category: COMPONENT_TYPES.deprecatedRow,
         layout: {},
         props: {
             ...SEED_DATA_PROPS,
@@ -33,7 +33,7 @@ export const SEED_DATA = [
         name: "Row Single Line Headline Icon Image",
         tag: "RowHeadlineImageIcon",
         description: "A row with left aligned image and headline text and a right aligned icon",
-        category: COMPONENT_TYPES.row,
+        category: COMPONENT_TYPES.deprecatedRow,
         layout: {},
         props: {
             ...SEED_DATA_PROPS,
@@ -44,7 +44,7 @@ export const SEED_DATA = [
         name: "Row Double Line Headline Icon",
         tag: "RowHeadlineImageIcon",
         description: "A row with left aligned headline text and subtitle text and a right aligned icon",
-        category: COMPONENT_TYPES.row,
+        category: COMPONENT_TYPES.deprecatedRow,
         layout: {},
         props: {
             ...SEED_DATA_PROPS,
@@ -55,7 +55,7 @@ export const SEED_DATA = [
         name: "Row Double Line Headline Image Icon",
         tag: "RowHeadlineImageIcon",
         description: "A row with left aligned headline text and subtitle text and a right aligned icon",
-        category: COMPONENT_TYPES.row,
+        category: COMPONENT_TYPES.deprecatedRow,
         layout: {},
         props: {
             ...SEED_DATA_PROPS,
@@ -67,7 +67,7 @@ export const SEED_DATA = [
         name: "Row Multiline Headline Icon",
         tag: "RowHeadlineImageIcon",
         description: "A row with left aligned headline text and multiline subtitle text and a right aligned icon",
-        category: COMPONENT_TYPES.row,
+        category: COMPONENT_TYPES.deprecatedRow,
         layout: {},
         props: {
             ...SEED_DATA_PROPS,
@@ -83,7 +83,7 @@ export const SEED_DATA = [
         name: "Row Multiline Headline Image Icon",
         tag: "RowHeadlineImageIcon",
         description: "A row with left aligned image, headline text, and multiline subtitle text, and a right aligned icon",
-        category: COMPONENT_TYPES.row,
+        category: COMPONENT_TYPES.deprecatedRow,
         layout: {},
         props: {
             ...SEED_DATA_PROPS,

package/src/mappings/RowHeadlineImageIcon.ts

@@ -33,7 +33,7 @@ export const SEED_DATA = [
     tag: "RowHeadlineImageIcon",
     description:
       "A row with left aligned headline text and a right aligned icon",
-    category: COMPONENT_TYPES.row,
+    category: COMPONENT_TYPES.deprecatedRow,
     layout: {},
     props: {
       ...SEED_DATA_PROPS,
@@ -44,7 +44,7 @@ export const SEED_DATA = [
     tag: "RowHeadlineImageIcon",
     description:
       "A row with left aligned image and headline text and a right aligned icon",
-    category: COMPONENT_TYPES.row,
+    category: COMPONENT_TYPES.deprecatedRow,
     layout: {},
     props: {
       ...SEED_DATA_PROPS,
@@ -56,7 +56,7 @@ export const SEED_DATA = [
     tag: "RowHeadlineImageIcon",
     description:
       "A row with left aligned headline text and subtitle text and a right aligned icon",
-    category: COMPONENT_TYPES.row,
+    category: COMPONENT_TYPES.deprecatedRow,
     layout: {},
     props: {
       ...SEED_DATA_PROPS,
@@ -68,7 +68,7 @@ export const SEED_DATA = [
     tag: "RowHeadlineImageIcon",
     description:
       "A row with left aligned headline text and subtitle text and a right aligned icon",
-    category: COMPONENT_TYPES.row,
+    category: COMPONENT_TYPES.deprecatedRow,
     layout: {},
     props: {
       ...SEED_DATA_PROPS,
@@ -81,7 +81,7 @@ export const SEED_DATA = [
     tag: "RowHeadlineImageIcon",
     description:
       "A row with left aligned headline text and multiline subtitle text and a right aligned icon",
-    category: COMPONENT_TYPES.row,
+    category: COMPONENT_TYPES.deprecatedRow,
     layout: {},
     props: {
       ...SEED_DATA_PROPS,
@@ -99,7 +99,7 @@ export const SEED_DATA = [
     tag: "RowHeadlineImageIcon",
     description:
       "A row with left aligned image, headline text, and multiline subtitle text, and a right aligned icon",
-    category: COMPONENT_TYPES.row,
+    category: COMPONENT_TYPES.deprecatedRow,
     layout: {},
     props: {
       ...SEED_DATA_PROPS,

package/src/mappings/ScrollView.js

@@ -3,7 +3,7 @@ export const SEED_DATA = {
     name: "Scroll View",
     tag: "ScrollView",
     description: "A basic ScrollView component",
-    category: COMPONENT_TYPES.layout,
+    category: COMPONENT_TYPES.view,
     stylesPanelSections: CONTAINER_COMPONENT_STYLES_SECTIONS,
     layout: {},
     props: {

package/src/mappings/ScrollView.ts

@@ -8,7 +8,7 @@ export const SEED_DATA = {
   name: "Scroll View",
   tag: "ScrollView",
   description: "A basic ScrollView component",
-  category: COMPONENT_TYPES.layout,
+  category: COMPONENT_TYPES.view,
   stylesPanelSections: CONTAINER_COMPONENT_STYLES_SECTIONS,
   layout: {},
   props: {

package/src/mappings/Slider.js

@@ -3,7 +3,7 @@ export const SEED_DATA = {
     name: "Slider",
     tag: "Slider",
     description: "A component used to set a value in a range",
-    category: COMPONENT_TYPES.input,
+    category: COMPONENT_TYPES.control,
     stylesPanelSections: BLOCK_STYLES_SECTIONS,
     layout: {
         marginLeft: 12,

package/src/mappings/Slider.ts

@@ -13,7 +13,7 @@ export const SEED_DATA = {
   name: "Slider",
   tag: "Slider",
   description: "A component used to set a value in a range",
-  category: COMPONENT_TYPES.input,
+  category: COMPONENT_TYPES.control,
   stylesPanelSections: BLOCK_STYLES_SECTIONS,
   layout: {
     marginLeft: 12,

package/src/mappings/StarRating.js

@@ -3,7 +3,7 @@ export const SEED_DATA = {
     name: "Star Rating",
     tag: "StarRating",
     description: "A star rating component",
-    category: COMPONENT_TYPES.button,
+    category: COMPONENT_TYPES.control,
     stylesPanelSections: BLOCK_STYLES_SECTIONS,
     triggers: [Triggers.OnPress],
     props: {